@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700&family=Space+Grotesk:wght@500;700&display=swap');
:root{color:#eff3ff;background:#10082b;font-family:'Noto Sans SC',sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh}.sky{position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 80% 7%,#e867bd 0,#9554c9 18%,transparent 41%),radial-gradient(circle at 12% 85%,#164b9a 0,transparent 38%),linear-gradient(130deg,#10082b,#311568 58%,#17255a)}.grid{position:fixed;inset:52% -20% 0;z-index:-1;opacity:.3;background:linear-gradient(#65eaff 1px,transparent 1px),linear-gradient(90deg,#65eaff 1px,transparent 1px);background-size:45px 45px;transform:perspective(320px) rotateX(52deg)}a{color:#86f4ff;text-decoration:none}.nav{height:76px;display:flex;justify-content:space-between;align-items:center;max-width:1160px;margin:auto;padding:0 24px}.brand{display:grid;color:#fff;font-size:20px;font-weight:700;grid-template-columns:auto 1fr;column-gap:8px}.brand small{font-family:'Space Grotesk';font-size:8px;letter-spacing:1.4px;color:#9bb7ff;grid-column:2}.nav nav{display:flex;gap:18px;align-items:center}.link,button{font:inherit;cursor:pointer}.link{border:0;background:transparent;color:#dbe3ff}.pill,.primary{border:0;border-radius:10px;background:linear-gradient(100deg,#38dbff,#5b7cff);color:#06132c;padding:10px 18px;font-weight:700}.shell{width:min(1060px,calc(100% - 32px));margin:65px auto 90px}.hero{max-width:700px;margin:70px auto 54px;text-align:center}.hero h1,.page-head h1,.auth h1,.checkout h1{font-size:clamp(32px,6vw,62px);margin:8px 0}.hero em{font-style:normal;color:#77efff}.eyebrow{font:700 12px 'Space Grotesk';letter-spacing:2px;color:#7eecff}.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;justify-content:center}.card{background:linear-gradient(120deg,#ffffff20,#e2dbff0b);border:1px solid #ffffff2e;border-radius:18px;padding:24px;box-shadow:0 20px 45px #08021e30;backdrop-filter:blur(15px)}.plan{min-height:300px;display:flex;flex-direction:column;justify-content:space-between}.plan h2{margin:9px 0}.plan p{color:#c5c9e5}.price{font:700 32px 'Space Grotesk';color:#fff!important}.price small{font:400 13px 'Noto Sans SC'}.auth,.checkout{max-width:470px;margin:20px auto}.auth{text-align:center}.auth form,.checkout form{display:grid;gap:14px;text-align:left;margin:24px 0}.spark{font-size:30px;color:#83f6ff;margin:0}.auth h1,.checkout h1{font-size:32px}.auth>p{color:#c9cbe4}label{display:grid;gap:7px;font-size:14px;color:#d9dcf3}input,textarea{width:100%;border:1px solid #ffffff30;border-radius:9px;background:#111a4b88;padding:12px;color:white;font:inherit}textarea{min-height:88px}.summary{display:grid;grid-template-columns:1fr auto;gap:8px;padding:18px 0;border-block:1px solid #ffffff20}.summary strong{grid-column:2;font-size:24px;color:#7eefff}.summary span{color:#afb7d8}.checkout dl{display:grid;grid-template-columns:100px 1fr;gap:15px}.checkout dt{color:#b4badb}.checkout dd{margin:0}.amount{font-size:26px;color:#80eeff;font-weight:bold}.qr{margin:26px auto;text-align:center;border:1px dashed #7fefff80;border-radius:14px;padding:58px 15px;color:#9df6ff;background:#0e1b5166}.qr-img{border-style:solid;padding:20px 15px;background:#ffffff10}.qr-img img{max-width:240px;width:100%;border-radius:10px;display:block;margin:0 auto}.qr-img p{margin:14px 0 0;color:#cfe9ff;font-size:14px}.qr-img small{color:#93a3c9;font-size:12px}.muted{color:#b8beda}.page-head{margin-bottom:25px}.page-head h1{font-size:38px}.orders{display:grid;gap:0}.order{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid #ffffff20}.order:last-child{border:0}.order p{margin:6px 0;color:#bdc4e2}.delivery{background:#09174270;border-radius:9px;padding:8px 12px;margin-top:9px}.delivery p{white-space:pre-wrap}.status{font-size:12px;border-radius:999px;padding:5px 9px;background:#736e8c;color:white}.status.pending_review{background:#8b5a1e}.status.paid,.status.delivered{background:#17765c}.status.closed{background:#6a364b}.small{margin:6px 0 0 8px;padding:6px 9px;border:1px solid #a1efff70;border-radius:7px;color:#9af4ff;background:transparent}.danger{border-color:#ff9bb8;color:#ffb6c9}.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:18px}.stats .card{padding:16px}.stats b{display:block;font:700 27px 'Space Grotesk';color:#7deeff}.stats span{font-size:13px;color:#c3c8e4}.table-wrap{overflow:auto;padding:8px 16px}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th,td{padding:13px 8px;border-bottom:1px solid #ffffff16;font-size:13px}th{color:#aab5da}.proof-row td{color:#b7c6e8;background:#07103850}.warning{max-width:680px;margin:100px auto;border-color:#ffcf7580}.notice{position:fixed;z-index:5;top:20px;left:50%;transform:translateX(-50%);background:#253665;padding:12px 18px;border-radius:9px;box-shadow:0 10px 30px #0007}.notice.bad{background:#79294c}.notice.ok{background:#16725c}@media(max-width:800px){.plans{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:500px){.nav{padding:0 16px}.nav nav{gap:10px}.shell{margin-top:32px}.plans{grid-template-columns:1fr}.order{display:block}.stats{grid-template-columns:1fr 1fr}}
.buyer-notice{max-width:820px;margin:40px auto 0}.buyer-notice h2{margin-top:0}.highlights{list-style:none;padding:0;margin:14px 0;display:grid;gap:8px}.highlights li{padding-left:26px;position:relative;color:#dfe3f7}.highlights li::before{content:'✓';position:absolute;left:0;color:#7eecff;font-weight:700}.buyer-notice .tag{color:#9bb7ff;font:700 13px 'Space Grotesk';letter-spacing:1px;margin:4px 0 18px;display:block}.notice-tips{border-top:1px solid #ffffff20;padding-top:14px;display:grid;gap:8px}.notice-tips p{margin:0;color:#c5c9e5;font-size:14px}
.plans{align-items:center}.plan-pro{position:relative;background:linear-gradient(155deg,#2a1152,#0a051c 65%);border:1px solid transparent;background-clip:padding-box;transform:scale(1.06);z-index:3;box-shadow:0 0 0 1px #ffd88a70,0 45px 90px #00000075,0 0 60px #b978ff40,inset 0 1px 0 #ffffff1c}.plan-pro::before{content:'';position:absolute;inset:-1.5px;border-radius:20px;padding:1.5px;background:linear-gradient(120deg,#ffd88a,#ff9ecf,#7cf0ff);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:0}.plan-pro::after{content:'';position:absolute;inset:-40px;background:radial-gradient(circle at 50% 20%,#c891ff33,transparent 65%);z-index:-1;pointer-events:none}.plan-pro>*{position:relative;z-index:1}.plan-pro h2{background:linear-gradient(100deg,#ffe3a8,#ffd88a);-webkit-background-clip:text;background-clip:text;color:transparent}.plan-pro .price{color:#ffe9c2!important}.pro-badge{position:absolute;top:14px;right:14px;font:700 11px 'Space Grotesk';letter-spacing:1px;color:#2a1608;background:linear-gradient(100deg,#ffd88a,#ff9ecf);padding:4px 10px;border-radius:999px;z-index:2;box-shadow:0 4px 14px #ffb86c50}
.order-features{margin:18px 0 4px}
.checkout{margin-top:8vh}
.buyer-notice+.buyer-notice{margin-top:20px}
.buyer-notice .notice-tips p{line-height:1.6}
.legal-note{display:block;margin-top:16px;padding-top:14px;border-top:1px solid #ffffff20;color:#9aa2c4;font:400 12px 'Noto Sans SC'}
.gate{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#0a0620ee;backdrop-filter:blur(6px)}.gate-card{text-align:center;max-width:340px;padding:36px 28px}.gate-card h1{font-size:28px;margin:6px 0}.gate-card p{color:#c9cbe4;margin:0 0 20px}.gate-card .primary{width:100%}
.account-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:18px}.account-hero-info{display:flex;align-items:center;gap:16px}.account-hero .eyebrow{margin:0}.account-hero h1{margin:2px 0 4px;font-size:26px}.account-hero p.muted{margin:0}.account-hero>a.primary{white-space:nowrap;flex-shrink:0}.avatar{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:700 22px 'Space Grotesk';background:linear-gradient(100deg,#38dbff,#5b7cff);color:#06132c;flex-shrink:0}
.account-stats{grid-template-columns:repeat(3,1fr)}
.empty-state{text-align:center;padding:44px 20px;color:#c5c9e5}.empty-state .spark{font-size:34px;margin:0 0 12px}.empty-state a{display:inline-block;margin-top:16px}
@media(max-width:500px){.account-hero{flex-direction:column;align-items:flex-start}.account-hero>a.primary{width:100%;text-align:center}}
.code-row{display:flex;align-items:flex-end;gap:10px}.code-row label{flex:1}.code-row button{flex-shrink:0;height:46px;white-space:nowrap;font-size:13px}
.email-field{position:relative}.email-suggest{display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:6;background:#132057;border:1px solid #ffffff30;border-radius:9px;max-height:220px;overflow:auto;box-shadow:0 12px 30px #00000050}.email-suggest-item{padding:10px 12px;font-size:14px;color:#dbe3ff;cursor:pointer}.email-suggest-item:hover{background:#ffffff1c}
.cashier h1{text-align:center;font-size:26px;margin-bottom:6px}.cashier-amount{text-align:center;font:700 44px 'Space Grotesk';color:#7eefff;margin:4px 0}.cashier-amount::before{content:'¥';font-size:22px;margin-right:4px;color:#9bb7ff}.cashier-timer{display:table;margin:0 auto 20px;padding:6px 16px;border-radius:999px;background:#3a173366;color:#ffb4b4;font-size:13px}.pay-methods{margin:6px 0 20px}.pay-method{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid #ffffff30;border-radius:12px;background:#ffffff0c}.pay-icon{width:34px;height:34px;border-radius:50%;background:#1677ff;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}.pay-method b{display:block;font-size:15px;color:#eff3ff}.pay-method small{color:#aab5da;font-size:12px}.pay-check{margin-left:auto;color:#4ce27a;font-weight:700;font-size:18px}.cashier-qr{margin-top:20px}.cashier-expired{margin:20px 0 0!important;max-width:none!important;text-align:center}.cashier-expired button{margin-top:10px}

/* ---- motion & premium polish ---- */
@media(prefers-reduced-motion:no-preference){
.sky{background-size:160% 160%;animation:skyDrift 26s ease-in-out infinite alternate}
.spark{display:inline-block;animation:sparkFloat 3.6s ease-in-out infinite}
.hero>*{opacity:0;animation:fadeUp .8s ease forwards}
.hero .eyebrow{animation-delay:.05s}
.hero h1{animation-delay:.16s}
.hero>p:not(.eyebrow):not(.hero-tagline){animation-delay:.28s}
.hero-tagline{animation-delay:.4s}
.plans .plan{opacity:0;animation:fadeUp .7s ease forwards}
.plans .plan:nth-child(1){animation-delay:.08s}
.plans .plan:nth-child(2){animation-delay:.18s}
.plans .plan:nth-child(3){animation-delay:.28s}
.plans .plan:nth-child(4){animation-delay:.38s}
.plans .plan:nth-child(n+5){animation-delay:.46s}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:translateY(0)}
}
@keyframes skyDrift{from{background-position:0% 20%}to{background-position:100% 80%}}
@keyframes sparkFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.card{transition:transform .35s ease,box-shadow .35s ease}
.plan:not(.plan-pro):hover{transform:translateY(-6px);box-shadow:0 26px 55px #08021e45}
.plan-pro:hover{transform:scale(1.07) translateY(-5px)}
.pill,.primary{transition:transform .25s ease,box-shadow .25s ease,filter .25s ease}
.pill:hover,.primary:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 12px 26px #38dbff30}
.hero-tagline{margin-top:14px;color:#9bb7ff;font:500 14px 'Space Grotesk';letter-spacing:.5px}
.essay{max-width:740px;margin:64px auto 0;text-align:center;padding:44px 22px 8px}
.essay-mark{font:700 64px Georgia,'Noto Sans SC',serif;color:#7eecff3d;margin:0 0 -22px;line-height:1}
.essay-quote{font-size:20px;line-height:1.75;color:#e9ecff;max-width:580px;margin:0 auto 34px;font-weight:500}
.essay-points{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;text-align:left;border-top:1px solid #ffffff20;padding-top:30px}
.essay-points b{display:block;color:#7eecff;font:700 12px 'Space Grotesk';letter-spacing:1.6px;margin-bottom:8px;text-transform:uppercase}
.essay-points p{margin:0;color:#c5c9e5;font-size:13px;line-height:1.7}
@media(max-width:700px){.essay-points{grid-template-columns:1fr;gap:18px}.essay-quote{font-size:18px}}

