:root{
  --blue:#2563eb;--blue-hover:#1d4ed8;--blue-text:#1d4ed8;--blue-soft:#eaf1fe;--blue-line:#bfdbfe;--sky:#60a5fa;
  --navy:#0b1220;--navy-2:#101c36;--navy-3:#16244a;
  --ink:#1f2937;--ink-2:#4b5563;--ink-3:#6b7280;--ink-4:#9ca3af;--line:#e5e7eb;--bg:#fff;--bg-2:#f9fafb;--gray-soft:#f3f4f6;
  --green:#15803d;--green-soft:#dcfce7;--red:#b91c1c;
  --radius:16px;--max:1140px;
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue","Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);overflow-x:hidden}
a{color:var(--blue-text);text-decoration:none}p{line-height:1.75;margin:0}h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.3px}
button,input,select,textarea{font:inherit}img{display:block}
.eyebrow{font-size:11px;letter-spacing:2.5px;font-weight:700;color:var(--blue-text);margin-bottom:16px;text-transform:uppercase}
.eyebrow.light{color:var(--sky)}
.footnote{font-size:12px;color:var(--ink-4);margin-top:14px;line-height:1.7}.footnote.center{text-align:center;margin-top:22px}

/* 按钮 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:12px 20px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:14px;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .15s,box-shadow .2s;white-space:nowrap}
.btn:hover{background:var(--gray-soft)}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn.primary:hover{background:var(--blue-hover);border-color:var(--blue-hover)}
.btn.glowbtn{box-shadow:0 10px 30px rgba(37,99,235,.45)}.btn.glowbtn:hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(37,99,235,.55)}
.btn.dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff;backdrop-filter:blur(6px)}.btn.dark:hover{background:rgba(255,255,255,.12)}
.btn.ghost{background:#fff}.btn.text{border-color:transparent;background:transparent;color:var(--blue-text);padding-left:8px;padding-right:8px}.btn.text:hover{background:transparent;text-decoration:underline}
.btn.small{padding:8px 14px;font-size:13px}.btn.large{padding:15px 28px;font-size:16px;border-radius:12px}
.btn:disabled{opacity:.45;cursor:default}

/* 顶栏（深色，贯穿全页） */
.nav{position:sticky;top:0;z-index:20;height:68px;display:flex;align-items:center;gap:24px;padding:0 max(24px,calc((100% - var(--max))/2));background:rgba(11,18,32,.82);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid rgba(255,255,255,.08);color:#fff}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;color:#fff;letter-spacing:.5px}.brand img{width:30px;height:30px;border-radius:8px;box-shadow:0 4px 12px rgba(37,99,235,.4)}
.nav nav{display:flex;gap:24px;margin-left:16px;font-size:14px}.nav nav a{color:rgba(255,255,255,.7)}.nav nav a:hover{color:#fff}
.nav .btn.ghost{margin-left:auto;background:transparent;border-color:rgba(255,255,255,.2);color:#fff}.nav .btn.ghost:hover{background:rgba(255,255,255,.1)}

/* Hero */
.hero{position:relative;background:radial-gradient(1200px 600px at 80% -10%,#1e3a8a 0%,transparent 60%),linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 70%,#0e1730 100%);color:#fff;overflow:hidden}
.glow{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.g1{width:700px;height:700px;right:-160px;top:-260px;background:rgba(37,99,235,.45)}
.g2{width:420px;height:420px;left:-180px;bottom:-220px;background:rgba(96,165,250,.22)}
.grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 30%,transparent 100%);pointer-events:none}
.hero-inner{position:relative;max-width:var(--max);margin:auto;padding:96px 24px 110px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center}
.pill-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:#bfdbfe;border:1px solid rgba(147,197,253,.3);background:rgba(37,99,235,.15);padding:6px 12px;border-radius:20px;margin-bottom:26px}
.dotx{width:7px;height:7px;border-radius:50%;background:var(--sky);box-shadow:0 0 0 4px rgba(96,165,250,.25);animation:pulse 1.6s ease-in-out infinite}
.hero h1{font-size:62px;line-height:1.14;letter-spacing:-2px;font-weight:700}
.hero h1 em{font-style:normal;background:linear-gradient(92deg,#93c5fd,#60a5fa 40%,#2563eb);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:17px;color:rgba(255,255,255,.68);margin:26px 0 34px;max-width:500px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}.cta-row.center{justify-content:center}
.hero-points{display:flex;gap:22px;list-style:none;padding:0;margin:30px 0 0;font-size:13px;color:rgba(255,255,255,.6);flex-wrap:wrap}
.hero-points li::before{content:"✓";color:var(--sky);font-weight:700;margin-right:6px}
.hero-visual{position:relative;min-height:520px}
.jet{position:absolute;width:640px;max-width:none;right:-120px;top:-40px;filter:drop-shadow(0 40px 60px rgba(37,99,235,.55)) drop-shadow(0 0 40px rgba(96,165,250,.25));animation:float 6s ease-in-out infinite;z-index:2}
.streaks{position:absolute;left:-40px;top:250px;width:520px;height:200px;transform:rotate(-24deg);z-index:1}
.streaks i{position:absolute;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,rgba(147,197,253,.9),transparent);animation:streak 2.4s linear infinite;opacity:0}
.streaks i:nth-child(1){top:20px;left:0;width:260px;animation-delay:0s}.streaks i:nth-child(2){top:70px;left:40px;width:340px;animation-delay:.6s}.streaks i:nth-child(3){top:120px;left:20px;width:220px;animation-delay:1.2s}.streaks i:nth-child(4){top:160px;left:80px;width:300px;animation-delay:1.8s}
.chip{position:absolute;z-index:3;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.96);color:var(--ink);font-size:13px;padding:9px 12px;border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,.35);opacity:0;animation:chip .6s cubic-bezier(.2,.8,.2,1) forwards}
.chip b{color:var(--ink-3);font-weight:500;font-size:11px}.chip span{margin-left:4px;width:18px;height:18px;border-radius:50%;background:var(--green-soft);color:var(--green);font-size:11px;display:grid;place-items:center;font-weight:700}
.c1{left:0;top:40px;animation-delay:.4s}.c2{left:40px;top:120px;animation-delay:.9s}.c3{left:10px;top:200px;animation-delay:1.4s}.c4{left:60px;top:280px;animation-delay:1.9s}
.c5{left:20px;top:380px;animation-delay:2.6s;background:var(--blue);color:#fff;font-weight:600;padding:10px 16px;box-shadow:0 16px 40px rgba(37,99,235,.5)}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-16px) rotate(-1.5deg)}}
@keyframes streak{0%{transform:translateX(-120px);opacity:0}20%{opacity:1}80%{opacity:1}100%{transform:translateX(320px);opacity:0}}
@keyframes chip{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}
@keyframes grow{to{width:var(--w)}}
@keyframes rise{to{opacity:1;transform:none}}

/* 跑马灯 */
.marquee{background:var(--blue);color:#fff;overflow:hidden;padding:13px 0;font-size:13px;font-weight:500;letter-spacing:.5px}
.track{display:flex;gap:0;width:max-content;animation:marquee 32s linear infinite}
.track span{padding:0 28px;position:relative}.track span::after{content:"✦";position:absolute;right:-6px;opacity:.6;font-size:10px;top:2px}
@keyframes marquee{to{transform:translateX(-50%)}}

/* 通用区块 */
.section{max-width:var(--max);margin:auto;padding:104px 24px}
.section.alt{max-width:none;background:var(--bg-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section.alt>*{max-width:var(--max);margin-left:auto;margin-right:auto}
.section-head{max-width:680px;margin-bottom:52px}.section-head h2{font-size:42px;line-height:1.22;letter-spacing:-1.2px;font-weight:700}.section-head p{margin-top:18px;font-size:16px;color:var(--ink-2)}

/* 卖点一 */
.fast-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;align-items:stretch}
.big-number{background:var(--navy);color:#fff;border-radius:22px;padding:38px 40px;position:relative;overflow:hidden}
.big-number::after{content:"";position:absolute;width:360px;height:360px;right:-140px;bottom:-200px;border-radius:50%;background:rgba(37,99,235,.5);filter:blur(60px)}
.bn-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;position:relative}
.bn-label{font-size:14px;color:rgba(255,255,255,.6)}
.bn-row strong{font-size:96px;line-height:1;letter-spacing:-4px;font-weight:700;font-variant-numeric:tabular-nums}.bn-row strong small{font-size:18px;letter-spacing:0;margin-left:8px;font-weight:500;color:rgba(255,255,255,.6)}
.bn-row .gray{color:rgba(255,255,255,.28);text-decoration:line-through;text-decoration-thickness:6px;text-decoration-color:rgba(255,255,255,.25)}
.bn-row .blue{background:linear-gradient(92deg,#93c5fd,#60a5fa 50%,#3b82f6);-webkit-background-clip:text;background-clip:text;color:transparent}
.bn-arrow{font-size:26px;color:var(--sky);margin:10px 0}
.big-number .footnote{color:rgba(255,255,255,.4);margin-top:26px;position:relative}
.compare{background:#fff;border:1px solid var(--line);border-radius:22px;padding:34px 34px 30px;display:flex;flex-direction:column;justify-content:center}
.bar-row{display:grid;grid-template-columns:110px 1fr 90px;align-items:center;gap:16px;margin:10px 0;font-size:14px}
.bar-label{color:var(--ink-2)}.bar{height:30px;background:var(--gray-soft);border-radius:8px;overflow:hidden}
.bar i{display:block;height:100%;width:0;border-radius:8px}.bar .gray{background:#cbd5e1}.bar .blue{background:linear-gradient(90deg,#3b82f6,#2563eb)}
.compare.in .bar i{animation:grow 1.4s ease-out forwards}
.bar-value{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-2);font-weight:600}.bar-value.blue{color:var(--blue-text)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
.stats div{padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:var(--bg-2)}
.stats strong{display:block;font-size:28px;letter-spacing:-.8px;color:var(--blue-text);font-weight:700}.stats span{display:block;font-size:12px;color:var(--ink-3);margin-top:6px}

/* 卖点二：bento */
.bento{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.tile{background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}
.tile:hover{transform:translateY(-3px);box-shadow:0 20px 50px rgba(31,41,55,.08)}
.tile.wide{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center}
.tile h3{font-size:20px;margin-bottom:10px;letter-spacing:-.4px}.tile p{font-size:14px;color:var(--ink-2)}
.tile.dark{background:var(--navy);border-color:var(--navy);color:#fff}.tile.dark p{color:rgba(255,255,255,.65)}
.tile-art{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tile.wide .tile-art{margin-top:0;justify-content:flex-end}
.files span{padding:9px 13px;border-radius:10px;background:var(--gray-soft);font-size:12px;font-weight:600;color:var(--ink-2)}
.files .arrow{color:var(--ink-4);font-style:normal;padding:0 6px}
.files .doc{background:var(--blue-soft);color:var(--blue-text);display:flex;flex-direction:column;gap:2px}.files .doc em{font-style:normal;font-weight:400;font-size:11px;color:var(--ink-3)}
.controls span{padding:8px 12px;border-radius:9px;border:1px solid var(--line);font-size:12px;color:var(--ink-2);background:#fff}
.controls .plus{border-style:dashed;color:var(--blue-text);border-color:var(--blue-line)}
.todo-art span{padding:8px 12px;border-radius:9px;background:var(--blue-soft);color:var(--blue-text);font-size:12px;font-weight:500}.todo-art .muted{background:var(--gray-soft);color:var(--ink-3)}
.stages-art{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;width:100%}
.stages-art span{font-size:11px;padding-top:10px;border-top:3px solid rgba(255,255,255,.15);color:rgba(255,255,255,.4)}
.stages-art .past{border-color:rgba(147,197,253,.6);color:rgba(255,255,255,.6)}.stages-art .cur{border-color:var(--sky);color:#fff;font-weight:600}

/* 步骤 */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:s}
.steps li{position:relative;padding:30px 26px;border:1px solid var(--line);border-radius:22px;background:#fff}
.num{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;font-size:14px;font-weight:700;margin-bottom:18px;box-shadow:0 8px 18px rgba(37,99,235,.35)}
.steps h3{font-size:17px;margin-bottom:8px}.steps p{font-size:14px;color:var(--ink-2)}

/* 演示 */
.demo-section{padding-top:80px}
.demo-frame{padding:14px;border-radius:26px;background:linear-gradient(135deg,#1e3a8a,#0b1220 60%,#2563eb);box-shadow:0 40px 90px rgba(11,18,32,.35)}
.demo{display:grid;grid-template-columns:330px minmax(0,1fr);border-radius:16px;overflow:hidden;background:var(--gray-soft)}
.panel{background:#fff;border-right:1px solid var(--line);padding:20px 20px 24px;font-size:13px;display:flex;flex-direction:column;gap:14px;min-height:640px}
.panel-top{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px}.panel-top img{width:24px;height:24px;border-radius:6px}
.tag{margin-left:auto;font-size:10px;letter-spacing:1px;color:var(--ink-3);border:1px solid var(--line);border-radius:4px;padding:2px 6px;font-weight:500}
.stages{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.stages li{font-size:11px;color:var(--ink-4);padding-top:8px;border-top:3px solid var(--line);transition:.3s}
.stages li.past{border-color:var(--blue-line);color:var(--ink-3)}.stages li.current{border-color:var(--blue);color:var(--blue-text);font-weight:600}.stages li.done{border-color:var(--green);color:var(--green)}
.field-label{font-size:12px;font-weight:600;color:var(--ink-2);margin-bottom:-8px}
.panel select{width:100%;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-size:13px}
.status-card{display:flex;justify-content:space-between;gap:10px;padding:13px 14px;background:var(--blue-soft);color:var(--blue-text);border-radius:10px}
.status-card.done{background:var(--green-soft);color:var(--green)}
.status-main{display:flex;gap:9px}.status-card strong{font-size:13px;display:block}.status-card p{font-size:12px;opacity:.85;margin-top:3px}
.status-dot{width:8px;height:8px;border-radius:50%;background:currentColor;margin-top:6px;flex-shrink:0}.status-dot.busy{animation:pulse 1.2s ease-in-out infinite}
.elapsed{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;opacity:.8;white-space:nowrap}
.panel-actions{display:flex;gap:6px}.panel-actions .btn{padding:9px 12px;font-size:13px}.panel-actions .primary{flex:1}
.todo{border:1px solid var(--blue-line);background:var(--blue-soft);border-radius:10px;padding:14px}.todo h4{font-size:13px;color:var(--blue-text);margin-bottom:8px}
.todo ul{list-style:none;padding:0;margin:0 0 12px}.todo li{padding:8px 0;border-top:1px solid #d6e4fb;font-size:12px}.todo li:first-child{border:0;padding-top:0}.todo b{display:block;color:var(--ink);font-weight:600}.todo span{color:var(--ink-2)}
.todo p{font-size:12px;color:var(--ink-2);margin-bottom:12px}.todo .btn{width:100%;padding:9px;font-size:13px}
.todo.finished{border-color:#bbf7d0;background:var(--green-soft)}.todo.finished h4{color:var(--green)}
.log-title{font-size:12px;color:var(--ink-2);margin-top:4px}
.log{list-style:none;padding:0;margin:0;max-height:260px;overflow:auto}
.log li{border-left:2px solid var(--blue-line);padding:7px 10px;margin-bottom:6px;background:var(--bg-2);border-radius:0 8px 8px 0;font-size:12px;animation:rise .25s ease-out}
.log li b{color:var(--ink);font-weight:600;margin-right:6px}.log li span{color:var(--ink-2)}.log li.note{border-color:var(--ink-4);color:var(--ink-3)}.log .empty{border:0;background:transparent;color:var(--ink-4);animation:none}
.site{position:relative;padding:22px 26px 26px;background:var(--gray-soft)}
.site-bar{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;padding:12px 18px;font-size:12px;color:var(--ink-3)}.site-bar em{margin-left:auto;font-style:normal;font-size:11px;color:var(--ink-4)}
.live{width:8px;height:8px;border-radius:50%;background:var(--green)}
.site-pill{position:absolute;left:50%;top:70px;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:12px;padding:7px 14px;border-radius:20px;box-shadow:0 8px 20px rgba(0,0,0,.18);z-index:3;white-space:nowrap}
.app-form{background:#fff;border:1px solid var(--line);border-radius:0 0 12px 12px;padding:26px 30px 24px}
.app-form h3{font-size:22px}.job-meta{font-size:12px;color:var(--ink-3);margin:6px 0 22px}
fieldset{border:0;padding:0;margin:0 0 22px;min-width:0}legend{font-size:14px;font-weight:600;margin-bottom:14px;color:var(--ink)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.grid label{display:block;font-size:12px;color:var(--ink-3)}
.grid input:not([type=checkbox]),.grid select,.grid textarea{display:block;width:100%;margin-top:6px;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-size:13px;transition:border-color .2s,box-shadow .2s}
.grid textarea{resize:vertical;line-height:1.6}
.grid .wide{grid-column:1/-1}
.grid .check{display:flex;align-items:center;gap:8px;align-self:end;padding:9px 0;color:var(--ink-2);font-size:13px}.grid .check input{margin:0}
.filling{border-color:var(--blue)!important;box-shadow:0 0 0 3px var(--blue-soft)}
.check.filling{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
.file-box{display:flex;align-items:center;gap:12px;margin-top:6px;padding:8px 10px;border:1px dashed var(--ink-4);border-radius:8px;font-size:12px;color:var(--ink-3)}.file-box.filled{border-style:solid;border-color:var(--green);color:var(--green)}
.form-foot{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:18px}
.form-foot .btn{font-size:13px;padding:9px 16px}

/* 注册（深色） */
.signup{position:relative;overflow:hidden;background:radial-gradient(900px 500px at 15% 110%,#1e3a8a 0%,transparent 60%),linear-gradient(180deg,#0e1730,var(--navy));color:#fff;padding:120px 24px 130px}
.g3{width:600px;height:600px;right:-100px;top:-200px;background:rgba(37,99,235,.4)}
.signup-jet{position:absolute;width:560px;right:-60px;top:50%;transform:translateY(-50%) rotate(-4deg);filter:drop-shadow(0 30px 50px rgba(37,99,235,.5));animation:float 7s ease-in-out infinite;opacity:.95}
.signup-inner{position:relative;max-width:var(--max);margin:auto}
.signup h2{font-size:48px;line-height:1.18;letter-spacing:-1.5px;font-weight:700}
.signup p{margin:22px 0 32px;color:rgba(255,255,255,.65);font-size:16px;max-width:520px}
.foot{border-top:1px solid var(--line);padding:22px 24px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--ink-4);max-width:var(--max);margin:auto}
.foot span{display:flex;align-items:center;gap:8px}.foot img{width:20px;height:20px;border-radius:5px;opacity:.85}

[hidden]{display:none!important}

@media(max-width:1100px){.jet{width:520px;right:-80px}}
@media(max-width:960px){
  .hero-inner{grid-template-columns:1fr;padding-top:64px;padding-bottom:60px}.hero h1{font-size:46px}
  .hero-visual{min-height:440px}.jet{width:440px;right:-60px;top:-10px}.streaks{top:200px;left:-80px}
  .fast-grid{grid-template-columns:1fr}.bn-row strong{font-size:72px}
  .demo{grid-template-columns:1fr}.panel{border-right:0;border-bottom:1px solid var(--line);min-height:0}
  .steps,.bento,.stats{grid-template-columns:1fr}.tile.wide{grid-template-columns:1fr}.tile.wide .tile-art{justify-content:flex-start;margin-top:20px}
  .section-head h2{font-size:34px}.signup-jet{width:380px;right:-120px;top:auto;bottom:-80px;transform:rotate(-4deg);opacity:.5}.signup h2{font-size:38px}
}
@media(max-width:640px){
  .nav{gap:12px;padding:0 16px}.nav nav{display:none}.nav .btn.ghost{display:none}.nav .btn.primary{margin-left:auto}
  .hero-inner,.section,.signup{padding-left:16px;padding-right:16px}.hero h1{font-size:36px;letter-spacing:-1px}.lead{font-size:15px}
  .hero-points{flex-direction:column;gap:8px}.hero-visual{min-height:400px}.jet{width:330px;right:-50px;top:0}
  .chip{font-size:12px}.c5{top:340px}
  .bn-row strong{font-size:56px;letter-spacing:-2px}.big-number{padding:28px 24px}.compare{padding:22px 18px}
  .bar-row{grid-template-columns:80px 1fr 70px;font-size:12px}
  .grid{grid-template-columns:1fr}.site{padding:14px 12px}.app-form{padding:20px 16px}.demo-frame{padding:8px;border-radius:18px}
  .signup h2{font-size:30px}.foot{flex-direction:column;gap:10px;text-align:center}
  .section-head h2{font-size:28px}.section{padding-top:72px;padding-bottom:72px}
}

/* ===== 全站深色 ===== */
body{background:var(--navy);color:#fff}
.hero{background:radial-gradient(1200px 600px at 80% -10%,#1e3a8a 0%,transparent 60%),var(--navy)}
.section,.section.alt{background:transparent;border:0;color:#fff}
.section.alt{background:linear-gradient(180deg,rgba(37,99,235,.06),transparent)}
.section-head h2,.tile h3,.steps h3{color:#fff}
.section-head p,.tile p,.steps p{color:rgba(255,255,255,.62)}
.eyebrow{color:var(--sky)}
.footnote{color:rgba(255,255,255,.4)}
.compare,.tile,.steps li{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1);backdrop-filter:blur(8px)}
.tile:hover{box-shadow:0 20px 50px rgba(0,0,0,.35);border-color:rgba(147,197,253,.35)}
.tile.dark{background:rgba(37,99,235,.18);border-color:rgba(147,197,253,.3)}
.big-number{background:rgba(37,99,235,.14);border:1px solid rgba(147,197,253,.3)}
.bar-label,.bar-value{color:rgba(255,255,255,.7)}.bar-value.blue{color:var(--sky)}
.bar{background:rgba(255,255,255,.08)}.bar .gray{background:rgba(255,255,255,.25)}
.stats div{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1)}.stats strong{color:var(--sky)}.stats span{color:rgba(255,255,255,.5)}
.files span,.controls span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:rgba(255,255,255,.8)}
.files .arrow{color:rgba(255,255,255,.4)}.files .doc{background:rgba(37,99,235,.35);color:#fff}.files .doc em{color:rgba(255,255,255,.6)}
.controls .plus{color:var(--sky);border-color:rgba(147,197,253,.5)}
.todo-art span{background:rgba(37,99,235,.35);color:#fff}.todo-art .muted{background:rgba(255,255,255,.08);color:rgba(255,255,255,.5)}
.demo-frame{background:linear-gradient(135deg,#3b82f6,#1e3a8a 50%,#60a5fa);box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 80px rgba(37,99,235,.35)}
.signup{background:radial-gradient(900px 500px at 15% 110%,#1e3a8a 0%,transparent 60%),var(--navy)}
.foot{border-top-color:rgba(255,255,255,.08);color:rgba(255,255,255,.4);max-width:none;padding-left:max(24px,calc((100% - var(--max))/2));padding-right:max(24px,calc((100% - var(--max))/2))}
.marquee{background:rgba(37,99,235,.9);border-top:1px solid rgba(147,197,253,.3);border-bottom:1px solid rgba(147,197,253,.3)}

/* 演示：跟随当前字段的悬浮标签 */
.site{overflow:visible}
.float-tag{position:absolute;z-index:4;display:flex;align-items:center;gap:7px;background:var(--navy);color:#fff;font-size:12px;font-weight:500;padding:6px 10px 6px 7px;border-radius:9px;box-shadow:0 10px 26px rgba(11,18,32,.35);white-space:nowrap;pointer-events:none;transition:top .28s cubic-bezier(.2,.8,.2,1),left .28s cubic-bezier(.2,.8,.2,1),opacity .2s;transform:translateY(-100%)}
.float-tag::after{content:"";position:absolute;left:14px;bottom:-5px;width:10px;height:10px;background:var(--navy);transform:rotate(45deg);border-radius:2px}
.float-tag img{width:16px;height:16px;border-radius:4px}
.float-tag.ok{background:var(--green)}.float-tag.ok::after{background:var(--green)}
.float-tag.skip{background:var(--ink-3)}.float-tag.skip::after{background:var(--ink-3)}

/* 首屏：27 项由慢到快的填写流 */
.feed{position:absolute;left:0;top:30px;width:300px;height:400px;z-index:3;display:flex;flex-direction:column;gap:8px;overflow:hidden;mask-image:linear-gradient(180deg,#000 70%,transparent 100%)}
.feed .chip{position:static;opacity:1;animation:chipIn .35s cubic-bezier(.2,.8,.2,1);width:fit-content}
.feed .chip.out{animation:chipOut .3s forwards}
.chip.counter{left:0;top:448px;background:var(--blue);color:#fff;font-weight:600;padding:10px 16px;box-shadow:0 16px 40px rgba(37,99,235,.5);opacity:1;animation:none;gap:6px}
.chip.counter b{color:rgba(255,255,255,.75);font-size:12px}.chip.counter strong{font-size:18px;font-variant-numeric:tabular-nums;letter-spacing:-.5px}
.chip.counter.done{background:var(--green);box-shadow:0 16px 40px rgba(21,128,61,.45)}
@keyframes chipIn{from{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:none}}
@keyframes chipOut{to{opacity:0;transform:translateY(10px)}}
@media(max-width:640px){.feed{width:100%;height:330px}.chip.counter{top:370px}}

/* 首屏：模拟表单被逐项填写 */
.mock{position:absolute;left:0;top:20px;width:360px;z-index:3;background:#fff;color:var(--ink);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.08);overflow:hidden;font-size:12px}
.mock-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--bg-2)}
.mock-bar span{width:9px;height:9px;border-radius:50%;background:#d1d5db}.mock-bar em{margin-left:8px;font-style:normal;color:var(--ink-3);font-size:11px}
.mock-progress{height:3px;background:var(--gray-soft)}.mock-progress i{display:block;height:100%;width:0;background:var(--blue);transition:width .25s}
.mock-body{height:360px;overflow:hidden;padding:14px 16px;position:relative}
.mock-inner{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.mock-h{font-size:11px;font-weight:700;color:var(--ink);margin:6px 0 8px;letter-spacing:.5px}.mock-h:first-child{margin-top:0}
.mock-field{margin-bottom:9px}.mock-field label{display:block;font-size:10px;color:var(--ink-3);margin-bottom:4px}
.mock-box{height:30px;border:1px solid var(--line);border-radius:7px;padding:0 9px;display:flex;align-items:center;gap:6px;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s;position:relative;white-space:nowrap;overflow:hidden}
.mock-box.sel::after{content:"▾";margin-left:auto;color:var(--ink-4)}
.mock-box.check{border:0;padding:0;height:auto;gap:8px;color:var(--ink-2)}
.mock-box.check i{width:14px;height:14px;border:1px solid var(--ink-4);border-radius:4px;display:grid;place-items:center;font-size:10px;font-style:normal;color:#fff}
.mock-box.check.on i{background:var(--blue);border-color:var(--blue)}
.mock-box.focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.mock-box.check.focus{box-shadow:none;outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
.mock-box.focus .caret{width:1px;height:14px;background:var(--blue);animation:blink 1s steps(2) infinite}
.mock-box .val{overflow:hidden;text-overflow:ellipsis}
.mock-box.empty .val{color:var(--ink-4)}
.mock-menu{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid var(--line);border-radius:7px;box-shadow:0 10px 24px rgba(0,0,0,.12);z-index:2;padding:4px}
.mock-menu span{display:block;padding:5px 8px;border-radius:5px}.mock-menu span.hi{background:var(--blue-soft);color:var(--blue-text)}
.mock-foot{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-top:1px solid var(--line);background:var(--bg-2);color:var(--ink-3);font-size:11px}
.mock-foot b{color:var(--blue-text);font-variant-numeric:tabular-nums}
.mock.done .mock-foot{background:var(--green-soft);color:var(--green)}.mock.done .mock-foot b{color:var(--green)}.mock.done .mock-progress i{background:var(--green)}
.mock-tag{position:absolute;right:10px;z-index:3;background:var(--navy);color:#fff;font-size:10px;padding:4px 8px;border-radius:6px;display:flex;align-items:center;gap:5px;transition:top .3s cubic-bezier(.2,.8,.2,1);box-shadow:0 6px 16px rgba(11,18,32,.3)}
.mock-tag img{width:12px;height:12px;border-radius:3px}
@keyframes blink{to{opacity:0}}
@media(max-width:960px){.mock{width:min(360px,100%)}}
@media(max-width:640px){.mock-body{height:300px}.hero-visual{min-height:460px}.jet{top:40px;opacity:.9}}

/* 首屏表单窗口：半透明毛玻璃 */
.mock{background:rgba(255,255,255,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}
.mock-bar,.mock-foot{background:rgba(249,250,251,.6)}
.mock-box{background:rgba(255,255,255,.6)}
.mock-menu{background:rgba(255,255,255,.95)}
.mock-progress{background:rgba(243,244,246,.7)}

/* 飞机再往右 */
.jet{right:-170px}
@media(max-width:1100px){.jet{right:-180px}}
@media(max-width:960px){.jet{right:-120px}}
@media(max-width:640px){.jet{right:-90px}}

/* 首屏表单：勾选行留出内边距 */
.mock-box.check{padding:7px 10px;border-radius:7px;margin:0 -2px}
.mock-box.check.focus{outline:0;background:var(--blue-soft);box-shadow:0 0 0 1px var(--blue)}