:root{--typo:#8a5a12;color-scheme:light dark;--bg:#f7f8fc;--panel:#ffffff;--sunken:#eef1f8;--ink:#101522;--muted:#626a7b;--accent:#315efb;--accent-text:#2449d8;--accent-soft:#edf1ff;--line:#dde2ec;--key:#ffffff;--board:#eef1f8;--shadow:0 14px 38px rgba(16,21,34,.06);--radius:16px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);line-height:1.55}a{color:inherit;text-underline-offset:4px}button,input{font:inherit}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.wrap{width:min(1120px,calc(100% - 48px));margin:auto}.skip{position:absolute;top:-100px;left:12px;background:var(--panel);padding:12px;z-index:10}.skip:focus{top:12px}.site-nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0}.logo{font-size:30px;font-weight:800;letter-spacing:-2px;text-decoration:none}.logo span{color:var(--accent-text)}.site-nav nav{display:flex;align-items:center;gap:28px;font-size:14px}.site-nav nav a{text-decoration:none}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:13px 20px;border-radius:12px;font-weight:650;text-decoration:none;border:1px solid var(--line);background:var(--panel);color:var(--ink)}.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.button.small{min-height:42px;padding:8px 18px}.eyebrow{font-size:13px;font-weight:650;letter-spacing:0;text-transform:none;color:var(--muted)}.beta{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:650;color:var(--muted);border:1px solid var(--line);border-radius:99px;padding:7px 12px}.beta::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}.hero{display:grid;grid-template-columns:1.04fr 1fr;align-items:center;gap:72px;padding:58px 0 82px}.hero h1{font-size:clamp(46px,6.8vw,86px);line-height:1.02;letter-spacing:-.064em;margin:25px 0}.hero h1 em{font-style:normal;color:var(--accent-text)}.lead{font-size:18px;line-height:1.65;color:var(--muted);max-width:490px}.actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:28px 0 16px}.caption{font-size:12px;color:var(--muted)}.hero-note{max-width:430px}.device{max-width:432px;margin:auto;border:1px solid var(--line);border-radius:28px;background:var(--panel);box-shadow:var(--shadow);overflow:hidden}.device-top{padding:21px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:12px}.device-top strong{font-size:16px}.compose{padding:30px 25px 32px;min-height:223px}.compose .micro{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.13em}.compose p{font-size:26px;line-height:1.4;letter-spacing:-.025em;margin:18px 0}.word{color:var(--accent-text);background:var(--accent-soft);border-radius:6px;padding:1px 3px}.tiny-label{font-size:11px;color:var(--muted)}.keyboard{background:var(--board);padding:10px 8px 20px}.strip{height:37px;display:flex;align-items:center;justify-content:space-between;padding:0 7px 8px;font-size:11px;font-weight:650;color:var(--ink)}.strip .receipt{background:var(--panel);padding:4px 10px;border-radius:20px}.row{display:flex;justify-content:center;gap:5px;margin:6px 0}.key{flex:1;min-width:0;max-width:calc((100% - 45px)/10);height:43px;background:var(--key);border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:0 1px 0 #18302b24;color:var(--ink)}.row.mid{padding:0 17px}.row.mid .key{max-width:none}.row.last{padding:0 0}.row.last .key{max-width:none}.key.utility{background:var(--accent-soft);font-size:14px;flex:1.4}.key.space{flex:4.6;max-width:none;font-size:12px}.key.return{flex:1.6;max-width:none;background:var(--accent);color:#ffffff}.mini-footer{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);padding:9px 8px 0}.figure-caption{font-size:11px;text-align:center;color:var(--muted);max-width:440px;margin:18px auto 0}.benefit-band{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;gap:24px}.benefit-band strong{font-size:14px}.benefit-band span{display:block;font-size:12px;color:var(--muted);margin-top:5px}.section{padding:85px 0}.section h2{font-size:clamp(32px,4.3vw,49px);line-height:1.13;letter-spacing:-.045em;margin:12px 0 22px;max-width:770px}.section-intro{color:var(--muted);max-width:640px;font-size:17px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:38px}.card{border-top:1px solid var(--line);border-radius:0;background:transparent;padding:24px 0 0}.card .number{font-size:13px;color:var(--accent-text);font-weight:700}.card h3{font-size:21px;line-height:1.3;letter-spacing:-.025em;margin:22px 0 12px}.card p{font-size:14px;color:var(--muted);margin:0}.split{display:grid;grid-template-columns:1fr 1fr;gap:68px;align-items:center}.manifesto{background:var(--ink);color:var(--bg);border-radius:32px;padding:46px}.manifesto .eyebrow{color:#a2b3ff}.manifesto h2{font-size:41px}.manifesto p{color:#c8d0df;font-size:16px}.statement{font-size:24px;font-weight:550;line-height:1.5;letter-spacing:-.025em}.swatch-row{display:flex;gap:10px;margin:26px 0}.swatch{height:30px;width:30px;border:3px solid var(--panel);outline:1px solid var(--line);border-radius:50%}.pearl{background:#e9ebe5}.graphite{background:#2a3838}.tide{background:#09675e}.lilac{background:#6f56a2}.ember{background:#a24232}.theme-panel{border-top:1px solid var(--line);border-radius:0;padding:26px 0 0;background:transparent}.theme-panel h3{margin:0;font-size:25px;letter-spacing:-.04em}.theme-caption{font-size:13px;color:var(--muted)}.fact{padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}.fact:last-child{border:0}.fact strong{display:block}.fact span{color:var(--muted)}.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:35px}.step{border-top:2px solid var(--line);padding-top:20px}.step strong{font-size:16px}.step p{font-size:14px;color:var(--muted)}.faq{max-width:780px}.faq details{border-bottom:1px solid var(--line);padding:20px 0}.faq summary{cursor:pointer;font-size:17px;font-weight:600;min-height:30px}.faq details p{color:var(--muted);font-size:15px;padding-right:24px}.cta-panel{text-align:center;background:transparent;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;padding:58px 26px}.cta-panel h2{margin:12px auto 18px}.cta-panel p{color:var(--muted)}.cta-panel .actions{justify-content:center}.site-footer{border-top:1px solid var(--line);padding:30px 0;display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:12px;color:var(--muted)}.site-footer nav{display:flex;gap:20px;flex-wrap:wrap}.guide{max-width:780px;margin:auto;padding:40px 0 75px}.guide h1{font-size:clamp(40px,6vw,65px);line-height:1.08;letter-spacing:-.05em;margin:16px 0 22px}.guide h2{font-size:26px;letter-spacing:-.035em;margin-top:42px}.guide .step-card{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:26px;margin:20px 0}.guide .step-card h2{margin:10px 0}.guide p{color:var(--muted)}.guide ol{padding-left:22px}.guide li{margin:12px 0}.notice{border-left:3px solid var(--accent);padding:4px 0 4px 18px;color:var(--muted);font-size:14px}.compare-table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14px}.compare-table th,.compare-table td{text-align:left;border-bottom:1px solid var(--line);padding:14px 9px;vertical-align:top}.compare-table th{color:var(--muted);font-size:12px}.legal-note{font-size:12px;color:var(--muted);margin-top:22px}
@media(prefers-color-scheme:dark){:root{--typo:#f1b45c;--bg:#090b10;--panel:#151923;--sunken:#10141c;--ink:#f6f8ff;--muted:#aab4c8;--accent:#86a0ff;--accent-text:#a2b3ff;--accent-soft:#1a2340;--line:#293142;--key:#20283a;--board:#10141c;--shadow:0 14px 38px rgba(0,0,0,.34)}.button.primary,.key.return{background:#86a0ff;border-color:#86a0ff;color:#08102e}.manifesto{background:#151923;color:#f6f8ff}.manifesto .eyebrow{color:#a2b3ff}.manifesto p{color:#aab4c8}}
@media(max-width:800px){.hero{gap:35px}.site-nav nav{gap:18px}.hero h1{font-size:58px}.lead{font-size:16px}.split{gap:32px}.cards{gap:12px}.card{padding:23px}.manifesto{padding:32px}}
@media(max-width:640px){.wrap{width:calc(100% - 36px)}.site-nav{padding:18px 0}.site-nav nav .desktop{display:none}.site-nav nav{gap:17px}.hero{grid-template-columns:1fr;gap:35px;padding:38px 0 45px}.hero h1{font-size:62px}.hero .lead{font-size:17px}.device{max-width:390px}.benefit-band{grid-template-columns:1fr;gap:18px}.section{padding:54px 0}.cards,.split,.timeline{grid-template-columns:1fr}.cards{gap:16px}.card h3{margin-top:14px}.manifesto{padding:30px}.manifesto h2{font-size:34px}.site-footer{align-items:flex-start;flex-direction:column}.site-footer nav{gap:22px}.figure-caption{font-size:11px}.compare-table{font-size:12px}.key{height:43px}.section h2{max-width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hero-figure{margin:0;min-width:0}

/* Product Experience V6 §11: real desktop header, real mobile menu, no script. */
.site-nav{flex-wrap:wrap;position:relative}
.site-nav nav{display:flex;align-items:center;gap:22px;font-size:14px;flex-wrap:wrap}
.site-nav nav a{text-decoration:none;white-space:nowrap}
.site-nav nav a[aria-current=page]{color:var(--accent-text);font-weight:650}
.menu-state{position:absolute;opacity:0;width:44px;height:44px;right:0;top:50%;transform:translateY(-50%);margin:0;cursor:pointer;z-index:2}
.menu-button{display:none;align-items:center;gap:8px;min-height:44px;padding:9px 16px;border:1px solid var(--line);border-radius:100px;background:var(--panel);font-size:14px;font-weight:650;cursor:pointer}
.menu-button::after{content:"";width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translate(-2px,-2px)}
@media(max-width:860px){
 .menu-button{display:inline-flex}
 .site-nav nav{display:none;order:3;width:100%;flex-direction:column;align-items:stretch;gap:0;margin-top:14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow:hidden}
 .site-nav nav a{padding:15px 18px;border-bottom:1px solid var(--line);font-size:16px;min-height:52px;display:flex;align-items:center}
 .site-nav nav a:last-child{border-bottom:0;margin:12px 14px 16px;border-radius:100px;justify-content:center}
 .menu-state:checked~nav{display:flex}
 .menu-state:checked~.menu-button::after{transform:rotate(-135deg) translate(-3px,-3px)}
}
@media(min-width:861px){.menu-state{display:none}}
/* V6 §11 mobile web spacing. */
@media(max-width:640px){
 .wrap{width:calc(100% - 48px)}
 .hero{padding:34px 0 40px}
 .hero h1{font-size:clamp(44px,12vw,64px)}
 .device{max-width:340px}
 .section{padding:60px 0}
 .actions .button{width:100%}
 .cta-panel{padding:38px 20px}
}

/* 2026-09-17 consumer redesign: the site speaks the app's language — neutral paper, one accent,
   space instead of bands of colour. No script anywhere; the demonstration is static markup with a
   CSS-only emphasis, and it says what it is. */
.lede{font-size:19px;line-height:1.5;color:var(--muted);max-width:44ch}
.demo{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:none;display:grid;gap:14px}
.demo p{margin:0;font-size:20px;line-height:1.45}
.demo .typed{color:var(--muted)}
.demo .typed b{color:var(--typo);font-weight:600}
.demo .repaired b{color:var(--accent-text);font-weight:600}
.demo .receipt{display:flex;gap:16px;align-items:baseline;font-size:14px;color:var(--muted)}
.demo .receipt span:last-child{color:var(--accent-text);font-weight:600}
.demo-note{font-size:13px;color:var(--muted);margin:10px 2px 0}
.value-list{display:grid;gap:34px;margin:34px 0 0;padding:0;list-style:none;max-width:56ch}
.value-list h3{margin:0 0 6px;font-size:21px;letter-spacing:-.2px}
.value-list p{margin:0;color:var(--muted)}
.tiers{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:28px}
.tier{border-top:1px solid var(--line);border-radius:0;padding:24px 0 0;background:transparent}
.tier h3{margin:0 0 4px;font-size:19px}
.tier .price{color:var(--muted);font-size:15px;margin:0 0 14px}
.tier ul{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:8px}
@media(max-width:640px){.tiers{grid-template-columns:1fr}.demo{padding:22px}.demo p{font-size:18px}}


/* One public visual language: legal/support pages use the same neutral shell as the product pages. */
.brand{font-size:30px;font-weight:800;letter-spacing:-2px;text-decoration:none}
.document{width:min(790px,calc(100% - 48px));margin:48px auto 90px;overflow-wrap:anywhere}
.document h1{font-size:clamp(42px,7vw,68px);line-height:1.04;letter-spacing:-.055em;margin:18px 0 24px}
.document h2{font-size:25px;line-height:1.2;letter-spacing:-.025em;margin:42px 0 12px}
.document h3{font-size:18px;margin:28px 0 10px}
.document p,.document li{color:var(--muted)}
.document li{margin:10px 0}
.document strong{color:var(--ink)}
.document code{background:var(--sunken);padding:2px 5px;border-radius:5px;color:var(--ink)}
.document .notice{margin:28px 0;padding:0 0 0 18px;border-left:2px solid var(--accent);color:var(--muted)}
.document .notice p{margin-bottom:0}
@media(max-width:640px){.document{width:calc(100% - 36px);margin-top:26px}.document h1{font-size:44px}}
/* Build 21 motion/depth pass — CSS only, progressive enhancement, no script. */
:root{--elev-1:0 10px 24px rgba(16,21,34,.07);--elev-2:0 22px 60px rgba(16,21,34,.11);--elev-3:0 34px 90px rgba(16,21,34,.15);--glass:color-mix(in srgb,var(--panel) 84%,transparent)}
html,body{overflow-x:clip}
body{position:relative;isolation:isolate;background:radial-gradient(900px 540px at 8% -8%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 68%),radial-gradient(760px 520px at 92% 18%,color-mix(in srgb,var(--accent-text) 8%,transparent),transparent 72%),var(--bg);background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;opacity:.34;background-image:linear-gradient(color-mix(in srgb,var(--line) 28%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--line) 28%,transparent) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,#000 0%,transparent 72%)}
body::after{content:"";position:fixed;width:36vw;height:36vw;min-width:320px;min-height:320px;right:-15vw;top:23vh;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 16%,transparent),transparent 67%);filter:blur(16px);pointer-events:none;z-index:-1}
.site-nav{position:sticky;top:0;z-index:20;padding-top:18px;padding-bottom:18px;backdrop-filter:saturate(150%) blur(18px);-webkit-backdrop-filter:saturate(150%) blur(18px);background:linear-gradient(to bottom,color-mix(in srgb,var(--bg) 91%,transparent),color-mix(in srgb,var(--bg) 72%,transparent));border-bottom:1px solid color-mix(in srgb,var(--line) 62%,transparent)}
.site-nav::after{content:"";position:absolute;left:50%;bottom:-1px;width:min(1120px,calc(100vw - 48px));height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 24%,var(--line)),transparent)}
.site-nav nav a:not(.button){position:relative;transition:color .2s ease,transform .2s ease}
.site-nav nav a:not(.button)::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;border-radius:99px;background:var(--accent);transform:scaleX(0);transform-origin:center;transition:transform .22s ease}
.site-nav nav a:not(.button):hover{color:var(--accent-text);transform:translateY(-1px)}
.site-nav nav a:not(.button):hover::after,.site-nav nav a[aria-current=page]::after{transform:scaleX(1)}
.button{position:relative;overflow:hidden;box-shadow:0 1px 0 rgba(255,255,255,.36) inset;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.button::after{content:"";position:absolute;inset:-80% -25%;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.28) 50%,transparent 58%);transform:translateX(-65%) rotate(6deg);transition:transform .55s ease}
.button:hover{transform:translateY(-2px);box-shadow:var(--elev-1)}
.button:hover::after{transform:translateX(65%) rotate(6deg)}
.button:active{transform:translateY(0) scale(.985)}
.beta{box-shadow:0 6px 18px rgba(16,21,34,.05);background:color-mix(in srgb,var(--panel) 76%,transparent);backdrop-filter:blur(10px)}
.beta::before{box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 12%,transparent)}
.hero{min-height:min(780px,82vh);perspective:1400px;transform-style:preserve-3d}
.hero>div:first-child{position:relative;z-index:2}
.hero h1{text-wrap:balance;text-shadow:0 1px 0 color-mix(in srgb,var(--panel) 35%,transparent)}
.hero h1 em{background:linear-gradient(120deg,var(--accent-text),color-mix(in srgb,var(--accent-text) 55%,#b45cff));-webkit-background-clip:text;background-clip:text;color:transparent}
 .hero-figure{perspective:1200px;transform-style:preserve-3d;position:relative}
.hero-figure::before{content:"";position:absolute;inset:12% 4% -6%;border-radius:42px;background:radial-gradient(circle at 28% 18%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 48%),linear-gradient(145deg,color-mix(in srgb,var(--panel) 58%,transparent),transparent);filter:blur(26px);transform:translateZ(-80px) scale(.98);z-index:-1}
.device{position:relative;transform:rotateY(-5deg) rotateX(2deg) translateZ(0);transform-style:preserve-3d;box-shadow:var(--elev-3);transition:transform .42s cubic-bezier(.2,.75,.2,1),box-shadow .42s ease}
.device::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(130deg,rgba(255,255,255,.34),transparent 22%,transparent 70%,color-mix(in srgb,var(--accent) 9%,transparent));z-index:4;mix-blend-mode:soft-light}
.hero-figure:hover .device{transform:rotateY(-1deg) rotateX(0) translateY(-7px) translateZ(24px);box-shadow:0 44px 110px rgba(16,21,34,.18)}
.compose,.keyboard{transform:translateZ(14px)}
.word{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 0%,transparent);transition:box-shadow .25s ease,transform .25s ease}
.device:hover .word{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 10%,transparent);transform:translateY(-1px)}
.strip .receipt{box-shadow:0 7px 18px rgba(16,21,34,.08);border:1px solid color-mix(in srgb,var(--line) 74%,transparent)}
.key{box-shadow:0 2px 0 rgba(16,21,34,.12),0 5px 10px rgba(16,21,34,.04);transition:transform .14s ease,box-shadow .14s ease,background .14s ease}
.device:hover .key:nth-child(3n+1){transform:translateY(-.5px)}
.device:hover .key:nth-child(3n+2){transform:translateY(.5px)}
.section{position:relative;isolation:isolate}
.section::before{content:"";position:absolute;inset:11% -4% 7%;z-index:-1;border-radius:48px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 16%,transparent),transparent 68%);pointer-events:none}
.cards{perspective:1200px}
.card,.tier,.theme-panel,.demo,.guide .step-card{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--line) 86%,transparent);border-radius:22px;background:linear-gradient(150deg,color-mix(in srgb,var(--panel) 94%,transparent),color-mix(in srgb,var(--panel) 78%,transparent));box-shadow:var(--elev-1)}
.card,.tier{padding:26px;border-top:1px solid color-mix(in srgb,var(--line) 86%,transparent);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease;transform-style:preserve-3d}
.card::before,.tier::before,.theme-panel::before,.demo::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,rgba(255,255,255,.22),transparent 25%,transparent 72%,color-mix(in srgb,var(--accent) 7%,transparent));opacity:.8}
.card:hover,.tier:hover{transform:translateY(-7px) rotateX(1.2deg);box-shadow:var(--elev-2);border-color:color-mix(in srgb,var(--accent) 24%,var(--line))}
.card>*,.tier>*,.theme-panel>*,.demo>*{position:relative;z-index:1}
.theme-panel{padding:28px;border-top:1px solid color-mix(in srgb,var(--line) 86%,transparent);box-shadow:var(--elev-2)}
.fact{position:relative;padding:17px 14px;margin:0 -14px;border-radius:12px;transition:background .2s ease,transform .2s ease}
.fact:hover{background:color-mix(in srgb,var(--accent-soft) 42%,transparent);transform:translateX(5px)}
.timeline{perspective:1000px}
.step{position:relative;padding:22px 20px 2px;border-top:2px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:0 0 16px 16px;background:linear-gradient(to bottom,color-mix(in srgb,var(--panel) 52%,transparent),transparent 82%)}
.step::before{content:"";position:absolute;top:-5px;left:20px;width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 12%,transparent)}
.demo{box-shadow:var(--elev-2);border-radius:24px}
.demo .receipt{padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--accent-soft) 56%,transparent);border:1px solid color-mix(in srgb,var(--accent) 12%,var(--line))}
.cta-panel{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line));border-radius:30px;background:radial-gradient(500px 220px at 50% -15%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%),linear-gradient(145deg,color-mix(in srgb,var(--panel) 90%,transparent),color-mix(in srgb,var(--panel) 70%,transparent));box-shadow:var(--elev-2)}
.cta-panel::after{content:"";position:absolute;width:180px;height:180px;right:-65px;bottom:-90px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 16%,transparent);box-shadow:0 0 0 24px color-mix(in srgb,var(--accent) 4%,transparent),0 0 0 52px color-mix(in srgb,var(--accent) 3%,transparent)}
.faq details{transition:padding .22s ease,background .22s ease;border-radius:12px}
.faq details[open]{padding:20px 18px;background:color-mix(in srgb,var(--panel) 62%,transparent)}
.faq summary{transition:color .2s ease,transform .2s ease}
.faq summary:hover{color:var(--accent-text);transform:translateX(3px)}
.guide .step-card{box-shadow:var(--elev-1);transition:transform .25s ease,box-shadow .25s ease}
.guide .step-card:hover{transform:translateY(-4px);box-shadow:var(--elev-2)}
.site-footer{position:relative}
.site-footer::before{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 28%,var(--line)),transparent)}
/* Motion roles: reveal hierarchy, show data filling, and respond to a person's action.
   No decorative infinite floating/pulsing. */
@supports (animation-timeline:view()){
 @keyframes idio-section-reveal{from{opacity:.35;transform:translateY(22px)}to{opacity:1;transform:none}}
 @keyframes idio-flow-reveal{from{opacity:.25;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
 @keyframes idio-bar-fill{from{transform:scaleX(.15)}to{transform:scaleX(1)}}
 .section-head{animation:idio-section-reveal linear both;animation-timeline:view();animation-range:entry 4% cover 22%}
 .flow-card,.feel-card,.plan-card{animation:idio-flow-reveal linear both;animation-timeline:view();animation-range:entry 2% cover 24%}
 .metric .bar{animation:idio-bar-fill linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
}

@media(prefers-color-scheme:dark){
 :root{--elev-1:0 12px 28px rgba(0,0,0,.28);--elev-2:0 24px 70px rgba(0,0,0,.36);--elev-3:0 38px 110px rgba(0,0,0,.46)}
 body::before{opacity:.2}
 .device::before{background:linear-gradient(130deg,rgba(255,255,255,.11),transparent 24%,transparent 72%,rgba(134,160,255,.08))}
}
@media(max-width:640px){
 body{background-attachment:scroll}
 .card,.tier,.theme-panel,.demo,.guide .step-card{border-radius:18px}
 .card,.tier{padding:22px}
 .cta-panel{border-radius:22px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
 .device,.hero-figure:hover .device,.card:hover,.tier:hover,.fact:hover,.guide .step-card:hover,.site-nav nav a:not(.button):hover,.button:hover,.button:active{transform:none!important}
}
/* Build 21 homepage redesign: denser product storytelling with a distinct colour per idea. */
:root{--coral:#e65f4d;--coral-soft:#fff0ed;--violet:#7557e8;--violet-soft:#f0edff;--mint:#138a68;--mint-soft:#e9f8f2;--gold:#bd7b11;--gold-soft:#fff5df;--cyan:#197fae;--cyan-soft:#e9f6fc}
.home-hero{min-height:0;padding:48px 0 68px;gap:62px}.home-hero .lead{max-width:430px;font-size:21px;line-height:1.45}.home-hero .lead strong{color:var(--ink);font-weight:650}
.hero-proof{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:25px 0 8px;font-size:12px;font-weight:700}.hero-proof span{padding:7px 10px;border-radius:99px;background:var(--accent-soft);color:var(--accent-text)}.hero-proof i{font-style:normal;color:var(--muted)}
.home-hero .actions{margin-top:22px}.home-hero .device{max-width:410px}.compact-compose{min-height:208px;padding:26px 24px}.compact-compose p{font-size:24px;margin:12px 0 8px}
.demo-state{position:absolute;opacity:0;pointer-events:none}.demo-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;width:min(330px,92%);margin:0 auto 12px;padding:4px;border-radius:13px;background:var(--sunken);border:1px solid var(--line)}
.demo-tabs label{cursor:pointer;text-align:center;padding:8px 10px;border-radius:9px;font-size:12px;font-weight:700;color:var(--muted);transition:background .18s ease,color .18s ease,transform .18s ease}
#demo-typed:checked~.demo-tabs label[for=demo-typed],#demo-clean:checked~.demo-tabs label[for=demo-clean]{background:var(--panel);color:var(--ink);box-shadow:0 3px 10px rgba(16,21,34,.08)}
.demo-pane{display:none}.demo-pane p{animation:idio-pane-in .2s ease both}@keyframes idio-pane-in{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}
#demo-typed:checked~.device .demo-typed,#demo-clean:checked~.device .demo-clean{display:block}
.typo-word{color:var(--coral);background:var(--coral-soft);border-radius:6px;padding:1px 3px}.fixed-word{color:var(--mint);background:var(--mint-soft);border-radius:6px;padding:1px 3px}
.section-head{display:flex;flex-direction:column;align-items:flex-start;max-width:760px}.section-head h2{margin:10px 0 12px}.section-head .section-intro{margin:0}.accent-word{color:var(--tone,var(--accent-text))}
.tone-coral{--tone:var(--coral);--tone-soft:var(--coral-soft)}.tone-violet{--tone:var(--violet);--tone-soft:var(--violet-soft)}.tone-mint{--tone:var(--mint);--tone-soft:var(--mint-soft)}.tone-gold{--tone:var(--gold);--tone-soft:var(--gold-soft)}.tone-cyan{--tone:var(--cyan);--tone-soft:var(--cyan-soft)}
.flow-section,.personal-showcase,.feel-showcase,.plan-snapshot,.trust-section{padding:64px 0}
.flow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:30px}.flow-card{min-height:232px;padding:22px;border:1px solid var(--line);border-radius:24px;background:var(--panel);box-shadow:var(--elev-1);position:relative;overflow:hidden}
.flow-card::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--tone)}.flow-index{font-size:11px;font-weight:750;color:var(--tone);letter-spacing:.08em}.flow-card h3{font-size:19px;margin:20px 0 6px}.flow-card p{font-size:13px;color:var(--muted);margin:0}
.flow-example{min-height:72px;margin-top:18px;padding:15px 14px;border-radius:15px;background:var(--sunken);display:flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:16px}.flow-example b{color:var(--muted)}.flow-sentence{font-size:12px;line-height:1.25;flex-direction:column;align-items:flex-start;gap:4px}.flow-sentence span:last-child{color:var(--mint)}
.sweep-control{min-height:72px;margin-top:18px;padding:12px;border-radius:15px;background:var(--sunken);display:flex;gap:6px;align-items:center;flex-wrap:wrap}.sweep-control strong{background:var(--accent);color:#fff;border-radius:99px;padding:7px 10px;font-size:12px}.sweep-control span{border:1px solid var(--line);background:var(--panel);border-radius:99px;padding:5px 7px;font-size:10px;color:var(--muted)}
.guardrail-row{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}.guardrail-row span{font-size:11px;font-weight:650;padding:7px 10px;border-radius:99px;background:var(--tone-soft);color:var(--tone)}
.learning-board{margin-top:30px;display:grid;grid-template-columns:.78fr 1.42fr;gap:16px}.status-stack{display:grid;grid-template-columns:1fr 1fr;gap:10px}.status-pill{min-height:104px;padding:17px;border-radius:20px;border:1px solid var(--line);background:var(--panel);display:grid;grid-template-columns:10px 1fr;grid-template-rows:auto auto;column-gap:9px;align-content:center}
.status-pill>span{width:9px;height:9px;border-radius:50%;background:var(--tone);grid-row:1/3}.status-pill strong{font-size:14px}.status-pill small{color:var(--muted);font-size:11px}.status-pill.using>span{background:var(--mint)}.status-pill.learning>span{background:var(--gold)}.status-pill.protected>span{background:var(--violet)}.status-pill.observed>span{background:var(--cyan)}
.fingerprint-panel{padding:20px;border-radius:24px;border:1px solid var(--line);background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--tone-soft) 55%,var(--panel)));box-shadow:var(--elev-1)}
.panel-title{display:flex;justify-content:space-between;align-items:center;gap:16px}.panel-title strong{font-size:16px}.panel-title span{font-size:10px;color:var(--muted)}.fingerprint-visual{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0 14px}
.touch-map{position:relative;min-height:132px;border-radius:18px;background:linear-gradient(135deg,var(--sunken),var(--panel));border:1px solid var(--line);overflow:hidden}.touch-map>span{position:absolute;left:12px;bottom:10px;font-size:11px;color:var(--muted)}
.touch-map .dot{position:absolute;width:18px;height:18px;border-radius:50%;background:color-mix(in srgb,var(--violet) 72%,transparent);box-shadow:0 0 0 8px color-mix(in srgb,var(--violet) 10%,transparent)}.touch-map .d1{left:24%;top:26%}.touch-map .d2{left:52%;top:18%;width:12px;height:12px}.touch-map .d3{left:70%;top:44%}.touch-map .d4{left:38%;top:58%;width:14px;height:14px}.touch-map .d5{left:64%;top:70%;width:10px;height:10px}
.metric-stack{display:grid;gap:12px;align-content:center}.metric{display:grid;gap:6px}.metric span{font-size:11px;color:var(--muted)}.metric::after{content:"";height:7px;border-radius:99px;background:var(--sunken);grid-row:2;grid-column:1}.metric .bar{height:7px;border-radius:99px;background:var(--violet);grid-row:2;grid-column:1;transform-origin:left;z-index:1}.metric .b1{width:82%}.metric .b2{width:58%}.metric .b3{width:71%}
.word-stat-chip{display:flex;justify-content:space-between;gap:12px;padding:11px 13px;border-radius:14px;background:var(--violet-soft);color:var(--violet)}.word-stat-chip strong{font-size:12px}.word-stat-chip span{font-size:10px}.learn-actions{grid-column:1/-1;display:flex;gap:9px;align-items:center;flex-wrap:wrap}.learn-actions a,.learn-actions span{font-size:11px;padding:7px 10px;border-radius:99px;background:var(--tone-soft);color:var(--tone);text-decoration:none;font-weight:650}
.feel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:30px}.feel-card{min-height:218px;border:1px solid var(--line);border-radius:24px;background:var(--panel);box-shadow:var(--elev-1);padding:20px;display:flex;flex-direction:column;justify-content:space-between;gap:15px}.feel-card h3{margin:0 0 5px;font-size:18px}.feel-card p{margin:0;color:var(--muted);font-size:13px}
.mini-key-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.mini-key-row span{height:54px;border-radius:11px;background:var(--sunken);display:grid;place-items:center;font-size:20px;box-shadow:0 3px 0 color-mix(in srgb,var(--ink) 10%,transparent)}.keycap-card:hover .mini-key-row span{transform:translateY(-2px)}.mini-key-row span{transition:transform .15s ease}
.emoji-search{display:flex;gap:8px;align-items:center;padding:9px 11px;border-radius:12px;background:var(--sunken);color:var(--muted)}.emoji-search strong{color:var(--ink);font-size:13px}.emoji-results{display:flex;justify-content:space-between;font-size:25px}.emoji-results span{transition:transform .15s ease}.emoji-results span:hover{transform:scale(1.18)}
.theme-swatches{display:flex;gap:8px}.theme-swatches .swatch{width:28px;height:28px;border-width:2px}.saved-chip{padding:9px 11px;border-radius:12px;background:var(--mint-soft);color:var(--mint);font-size:12px;font-weight:700}.saved-chip span{font-weight:500}
.plan-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:16px;margin:30px 0 14px}.plan-card{padding:24px;border:1px solid var(--line);border-radius:26px;background:var(--panel);box-shadow:var(--elev-1)}.pro-card{background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--gold-soft) 70%,var(--panel)));border-color:color-mix(in srgb,var(--gold) 28%,var(--line))}
.plan-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.plan-title h3{margin:3px 0 0;font-size:21px}.plan-kicker{font-size:10px;font-weight:800;letter-spacing:.1em;color:var(--muted)}.plan-title>strong{font-size:34px;line-height:1;color:var(--tone)}
.plan-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:20px}.plan-chips span{padding:7px 9px;border-radius:99px;background:var(--sunken);font-size:10px}.pro-depth{display:grid;gap:10px;margin-top:18px}.pro-depth span{display:grid;grid-template-columns:24px 1fr;gap:9px;font-size:12px;color:var(--muted)}.pro-depth b{color:var(--gold)}
.text-link{display:inline-flex;font-size:13px;font-weight:700;color:var(--tone);text-decoration:none;margin-top:6px}.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0 10px}.trust-grid article{padding:18px;border-radius:18px;background:var(--tone-soft);color:var(--tone)}.trust-grid strong{display:block;font-size:15px}.trust-grid span{display:block;font-size:11px;margin-top:4px;opacity:.8}
.compact-cta{padding:46px 0 64px}.compact-cta .cta-panel{padding:42px 22px}.compact-cta .cta-panel h2{font-size:clamp(34px,4.2vw,48px)}.compact-cta .cta-panel p{margin:8px auto;max-width:34ch}
@media(prefers-color-scheme:dark){:root{--coral:#ff8c7e;--coral-soft:#341b1a;--violet:#ad99ff;--violet-soft:#241e43;--mint:#64d5ad;--mint-soft:#142f28;--gold:#f7bd62;--gold-soft:#342914;--cyan:#75c9ed;--cyan-soft:#142d39}}
@media(max-width:640px){
 .wrap{width:calc(100% - 28px)}.site-nav{padding:12px 0}.home-hero{padding:22px 0 34px;gap:22px}.home-hero h1{font-size:clamp(43px,13vw,56px);margin:16px 0}.home-hero .lead{font-size:16px;line-height:1.4;margin:0}.hero-proof{gap:5px;margin:16px 0 2px}.hero-proof span{padding:5px 7px;font-size:9px}.hero-proof i{font-size:9px}.home-hero .actions{margin:16px 0 8px;gap:10px}.home-hero .actions .button{min-height:44px}.hero-note{font-size:10px}.demo-tabs{margin-bottom:8px}
 .home-hero .device{width:min(100%,344px);transform:none;box-shadow:0 18px 50px rgba(16,21,34,.12)}.compact-compose{min-height:134px;padding:15px 16px}.compact-compose p{font-size:17px;line-height:1.3;margin:7px 0}.keyboard{padding:6px 5px 9px}.strip{height:28px;padding-bottom:4px}.row{gap:3px;margin:3px 0}.key{height:30px;border-radius:5px;font-size:14px}.row.mid{padding:0 12px}.key.utility{font-size:10px}.key.space{font-size:9px}.figure-caption{margin-top:8px;font-size:9px}
 .flow-section,.personal-showcase,.feel-showcase,.plan-snapshot,.trust-section{padding:38px 0}.section-head h2{font-size:34px;line-height:1.06;margin:7px 0 10px}.section-head .section-intro{font-size:13px;line-height:1.4}.eyebrow{font-size:11px}
 .flow-grid,.feel-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin:19px -14px 0;padding:0 14px 8px;scrollbar-width:none}.flow-grid::-webkit-scrollbar,.feel-grid::-webkit-scrollbar{display:none}.flow-card,.feel-card{flex:0 0 82%;scroll-snap-align:center;min-height:202px;border-radius:20px;padding:18px}.flow-example,.sweep-control{min-height:62px;margin-top:12px}.guardrail-row{gap:5px;margin-top:10px}.guardrail-row span{font-size:9px;padding:5px 7px}
 .learning-board{margin-top:18px;grid-template-columns:1fr;gap:10px}.status-stack{display:flex;overflow-x:auto;gap:7px;scroll-snap-type:x mandatory;padding-bottom:3px}.status-pill{flex:0 0 44%;min-height:74px;padding:12px;border-radius:16px;scroll-snap-align:start}.status-pill strong{font-size:12px}.status-pill small{font-size:9px}.fingerprint-panel{padding:14px;border-radius:18px}.fingerprint-visual{margin:12px 0 9px;gap:9px}.touch-map{min-height:96px}.metric-stack{gap:8px}.word-stat-chip{padding:8px 9px}.word-stat-chip span{font-size:8px}.learn-actions{gap:5px}.learn-actions a,.learn-actions span{font-size:9px;padding:5px 7px}
 .feel-card{min-height:190px}.mini-key-row span{height:44px}.emoji-results{font-size:22px}.plan-grid{grid-template-columns:1fr;gap:10px;margin:18px 0 8px}.plan-card{padding:18px;border-radius:20px}.plan-title h3{font-size:18px}.plan-title>strong{font-size:28px}.plan-chips{margin-top:13px}.pro-depth{margin-top:13px;gap:7px}.trust-grid{grid-template-columns:1fr 1fr;gap:7px;margin-top:18px}.trust-grid article{padding:12px;border-radius:14px}.trust-grid article:first-child{grid-column:1/-1}.compact-cta{padding:28px 0 42px}.compact-cta .cta-panel{padding:28px 16px}.compact-cta .actions{gap:8px;margin:16px 0 8px}.site-footer{padding:22px 0}
}
@media(prefers-reduced-motion:reduce){.demo-pane p,.mini-key-row span,.emoji-results span{animation:none!important;transition:none!important}}

/* Build 21 plan clarity: show the upgrade rather than describing a pricing philosophy. */
.hero-proof span b{font-size:.68em;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-left:3px}.hero-proof .paid-chip{background:var(--gold-soft);color:var(--gold)}.hero-proof .paid-chip b{color:inherit}
.mini-compare{width:100%;margin:28px 0 14px;border:1px solid var(--line);border-radius:24px;border-collapse:separate;border-spacing:0;overflow:hidden;background:var(--panel);box-shadow:var(--elev-1)}.mini-compare th,.mini-compare td{height:49px;padding:0 16px;border-top:1px solid var(--line);font-size:12px;text-align:center;font-weight:700}.mini-compare th[scope=row]{text-align:left;font-weight:500;color:var(--ink)}.mini-compare thead th{height:40px;border-top:0;background:var(--sunken);font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700}.mini-compare thead th:first-child{text-align:left}.mini-compare th:not(:first-child),.mini-compare td{width:74px}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mini-compare .pro-col{color:var(--gold);font-weight:800}.plan-price-line{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:12px 0}.plan-price-line b{color:var(--ink)}
.plans-hero{min-height:0}.trial-card{padding:30px;border:1px solid color-mix(in srgb,var(--gold) 34%,var(--line));border-radius:30px;background:radial-gradient(480px 260px at 50% 0%,color-mix(in srgb,var(--gold-soft) 90%,var(--panel)),var(--panel));box-shadow:var(--elev-2)}.trial-kicker{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--gold)}.trial-card>strong{display:block;font-size:clamp(42px,5vw,62px);line-height:1;margin:16px 0 9px;letter-spacing:-.05em}.trial-card p{max-width:30ch;color:var(--muted);font-size:14px}.trial-card small{display:block;color:var(--muted);font-size:10px;margin-top:18px}.trial-path{display:grid;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;gap:8px;margin-top:24px}.trial-path span{font-size:10px;font-weight:750}.trial-path i{height:2px;background:linear-gradient(90deg,var(--gold),color-mix(in srgb,var(--gold) 12%,transparent));border-radius:99px}
.upgrade-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:14px;margin-top:28px}.upgrade-grid article{padding:24px;border-radius:24px;border:1px solid var(--line);background:var(--panel)}.upgrade-grid article.featured{border-color:color-mix(in srgb,var(--gold) 35%,var(--line));background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--gold-soft) 70%,var(--panel)));box-shadow:var(--elev-1)}.upgrade-grid article>span,.reason-grid article>span,.price-pair article>span{font-size:10px;font-weight:800;letter-spacing:.1em;color:var(--muted)}.upgrade-grid h3{font-size:22px;margin:12px 0 7px}.upgrade-grid p{font-size:13px;line-height:1.5;color:var(--muted);margin:0}
.compare-shell{overflow:hidden;margin-top:28px;border:1px solid var(--line);border-radius:26px;background:var(--panel);box-shadow:var(--elev-1)}.pro-compare{width:100%;border-collapse:collapse;margin:0}.pro-compare th,.pro-compare td{padding:15px 18px;border-bottom:1px solid var(--line);text-align:center;font-size:13px}.pro-compare th:first-child,.pro-compare td:first-child{text-align:left;width:62%}.pro-compare thead th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);background:var(--sunken)}.pro-compare th:last-child,.pro-compare .pro-cell{background:color-mix(in srgb,var(--gold-soft) 55%,var(--panel))}.pro-compare td strong{display:block;font-size:14px}.pro-compare td small{display:block;margin-top:3px;color:var(--muted);font-size:10px;font-weight:400}.pro-compare .yes{font-size:18px;font-weight:850;color:var(--mint)}.pro-compare .upgrade-row td:first-child strong{color:var(--gold)}.pro-compare tr:last-child td{border-bottom:0}
.reason-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:28px}.reason-grid article{padding:20px;min-height:160px;border:1px solid var(--line);border-radius:22px;background:var(--panel);box-shadow:var(--elev-1)}.reason-grid article>span{color:var(--violet)}.reason-grid h3{font-size:17px;margin:24px 0 5px}.reason-grid p{font-size:12px;color:var(--muted);margin:0}
.price-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:28px 0 18px}.price-pair article{padding:24px;border-radius:24px;border:1px solid var(--line);background:var(--panel)}.price-pair article.annual{border-color:color-mix(in srgb,var(--gold) 38%,var(--line));background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--gold-soft) 74%,var(--panel)));box-shadow:var(--elev-1)}.price-pair strong{display:block;font-size:38px;letter-spacing:-.04em;margin:10px 0 1px}.price-pair small{font-size:11px;color:var(--muted)}
.cancel-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}.cancel-grid article{padding:20px;border-radius:20px;background:var(--tone-soft);color:var(--tone)}.cancel-grid strong{display:block;font-size:15px;margin-bottom:6px}.cancel-grid span{font-size:11px;line-height:1.5}
@media(max-width:640px){
 .mini-compare{border-radius:18px;margin-top:18px}.mini-compare th,.mini-compare td{height:44px;padding:0 10px;font-size:11px}.mini-compare th:not(:first-child),.mini-compare td{width:52px}.mini-compare thead th{font-size:9px}.plan-price-line{font-size:10px;gap:9px}
 .plans-hero{padding-top:26px;gap:26px}.trial-card{padding:21px;border-radius:22px}.trial-card>strong{font-size:45px}.trial-path{grid-template-columns:auto 1fr auto;gap:6px}.trial-path i:nth-of-type(2),.trial-path span:last-child{display:none}.upgrade-grid,.price-pair,.cancel-grid{grid-template-columns:1fr;gap:9px}.upgrade-grid article,.price-pair article{padding:18px;border-radius:19px}.compare-shell{margin:20px -14px 0;border-radius:0;border-left:0;border-right:0}.pro-compare th,.pro-compare td{padding:11px 8px;font-size:10px}.pro-compare th:first-child,.pro-compare td:first-child{width:58%;padding-left:14px}.pro-compare th:last-child,.pro-compare td:last-child{padding-right:14px}.pro-compare td strong{font-size:11px}.pro-compare td small{font-size:8px;line-height:1.3}.pro-compare .yes{font-size:15px}.reason-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:9px;margin:18px -14px 0;padding:0 14px 8px;scrollbar-width:none}.reason-grid::-webkit-scrollbar{display:none}.reason-grid article{flex:0 0 72%;min-height:135px;padding:17px;scroll-snap-align:center}.reason-grid h3{margin-top:18px}.cancel-grid{margin-top:18px}.cancel-grid article{padding:16px;border-radius:17px}
}
.start-guide{max-width:900px}.setup-path{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto 1fr auto 1fr auto;gap:7px;align-items:center;margin:28px 0 8px}.setup-path span{font-size:10px;font-weight:800;color:var(--muted)}.setup-path i{height:2px;background:var(--line);border-radius:99px}.setup-swatches{margin-top:18px}.try-strip{display:flex;align-items:center;justify-content:center;gap:13px;padding:18px;border-radius:16px;background:var(--sunken);font-size:18px}.try-strip i{font-style:normal;color:var(--muted)}.try-strip strong{color:var(--mint)}.post-setup{margin-top:34px}.pro-preview-row{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.pro-preview-row span{padding:8px 11px;border-radius:99px;background:var(--gold-soft);color:var(--gold);font-size:11px;font-weight:750}
@media(max-width:640px){.setup-path{overflow:hidden;grid-template-columns:repeat(6,max-content);gap:6px}.setup-path i{display:none}.setup-path span{padding:6px 8px;border-radius:99px;background:var(--sunken);font-size:9px}.try-strip{font-size:15px;gap:9px;padding:14px}.pro-preview-row{gap:5px;margin:16px 0}.pro-preview-row span{font-size:9px;padding:6px 8px}}
/* Density pass after real 1440px render: keep the comparison useful without turning it into a report. */
.plan-snapshot{padding:48px 0}.mini-compare th,.mini-compare td{height:42px}.mini-compare{margin-top:20px}.plan-price-line{margin:9px 0}
.plans-hero{padding-bottom:62px}.plan-story,#compare,.pro-reasons,.billing-simple,.cancel-preview{padding:58px 0}.pro-compare th,.pro-compare td{padding:10px 16px}.reason-grid{margin-top:22px}.price-pair{margin-top:22px}
@media(max-width:640px){.plan-snapshot{padding:34px 0}.plan-story,#compare,.pro-reasons,.billing-simple,.cancel-preview{padding:40px 0}.pro-compare th,.pro-compare td{padding:9px 7px}}
/* Semantic before/after backgrounds carry the accent; text itself keeps WCAG contrast. */
.flow-example .typo-word,.flow-example .fixed-word,.try-strip>strong{color:var(--ink);font-weight:800}