/* ---- design tokens ---------------------------------------------------
   Nocturne, as signed off in apps/suresign/lib/theme.dart and the 2026-08-25
   screen handoff. Light is the default; the OS setting wins until the visitor
   uses the header toggle, which sets .t-light / .t-dark on <html>. -------- */
:root{
/* shape — Nocturne single radius system */
  --r-feature:22px; --r-card:20px; --r-row:16px; --r-cta:20px; --r-pill:999px;
  --r-hero:32px;            /* WEB-EXT 1: page-scale canvas only */
  /* rhythm — Nocturne compact 0.7x, extended with web section steps */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s7:28px;
  --s8:40px; --s9:64px; --s10:96px;   /* WEB-EXT 2: section rhythm */
  /* motion — names follow apps/suresign-web/src/styles.css */
  --motion-fast:120ms; --motion-standard:200ms; --motion-emphasis:360ms;
  --motion-result:700ms; --motion-ceremony:1250ms;
  --ease:cubic-bezier(.2,.8,.2,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --ease-inout:cubic-bezier(.65,0,.35,1);
}
:root{
--ground:#eeeef2; --page:#e7e7ee; --card:#ffffff; --inset:#e2e3ea; --line:#d4d6e0;
  --tx1:#1d1f2e; --tx2:#5b5e70; --tx3:#8b8ea3;
  --acc:#6f61c4; --acc-soft:#6f61c4; --acc-press:#5a4dab;
  --acc-tint:rgba(111,97,196,.10); --acc-tint-hi:rgba(111,97,196,.18);
  --ok:#2e7d54; --warn:#8a5f16; --bad:#c03a2e; --none:#6b6e80; --nocheck:#8a5b00;
  --ok-bg:rgba(46,125,84,.08); --warn-bg:rgba(138,95,22,.08); --bad-bg:rgba(192,58,46,.08);
  --none-bg:rgba(107,110,128,.08);
  --nocheck-bg:rgba(253,243,225,1);
  --hero:linear-gradient(150deg,#4a4390,#2c2850);  /* stays dark; content reverses */
  --halo:rgba(111,97,196,.20);
  --glow:0 0 26px rgba(111,97,196,.18);
  --glow-cta:0 0 32px rgba(111,97,196,.22);
  --glass:rgba(238,238,242,.90);
  --rule:rgba(111,97,196,.20);
}
@media (prefers-color-scheme: dark){
  :root:not(.t-light){
--ground:#14161f; --page:#161826; --card:#1e2132; --inset:#232637; --line:#2b2f45;
  --tx1:#e9e9ed; --tx2:#a3a6b8; --tx3:#8b8ea3;
  --acc:#9184d9; --acc-soft:#b3a9e6; --acc-press:#cfc8f0;
  --acc-tint:rgba(145,132,217,.12); --acc-tint-hi:rgba(145,132,217,.22);
  --ok:#74c69d; --warn:#e0b35c; --bad:#e8685a; --none:#8b8ea3; --nocheck:#d9a441;
  --ok-bg:rgba(116,198,157,.10); --warn-bg:rgba(224,179,92,.10); --bad-bg:rgba(232,104,90,.12);
  --none-bg:rgba(139,142,163,.10);
  --nocheck-bg:rgba(217,164,65,.08);
  --hero:linear-gradient(150deg,#363061 0%,#1a1c2e 74%);
  --halo:rgba(145,132,217,.28);
  --glow:0 0 26px rgba(145,132,217,.25);
  --glow-cta:0 0 32px rgba(145,132,217,.32);
  --glass:rgba(20,22,31,.88);
  --rule:rgba(145,132,217,.22);
  }
}
:root.t-light{
--ground:#eeeef2; --page:#e7e7ee; --card:#ffffff; --inset:#e2e3ea; --line:#d4d6e0;
  --tx1:#1d1f2e; --tx2:#5b5e70; --tx3:#8b8ea3;
  --acc:#6f61c4; --acc-soft:#6f61c4; --acc-press:#5a4dab;
  --acc-tint:rgba(111,97,196,.10); --acc-tint-hi:rgba(111,97,196,.18);
  --ok:#2e7d54; --warn:#8a5f16; --bad:#c03a2e; --none:#6b6e80; --nocheck:#8a5b00;
  --ok-bg:rgba(46,125,84,.08); --warn-bg:rgba(138,95,22,.08); --bad-bg:rgba(192,58,46,.08);
  --none-bg:rgba(107,110,128,.08);
  --nocheck-bg:rgba(253,243,225,1);
  --hero:linear-gradient(150deg,#4a4390,#2c2850);  /* stays dark; content reverses */
  --halo:rgba(111,97,196,.20);
  --glow:0 0 26px rgba(111,97,196,.18);
  --glow-cta:0 0 32px rgba(111,97,196,.22);
  --glass:rgba(238,238,242,.90);
  --rule:rgba(111,97,196,.20);
}
:root.t-dark{
--ground:#14161f; --page:#161826; --card:#1e2132; --inset:#232637; --line:#2b2f45;
  --tx1:#e9e9ed; --tx2:#a3a6b8; --tx3:#8b8ea3;
  --acc:#9184d9; --acc-soft:#b3a9e6; --acc-press:#cfc8f0;
  --acc-tint:rgba(145,132,217,.12); --acc-tint-hi:rgba(145,132,217,.22);
  --ok:#74c69d; --warn:#e0b35c; --bad:#e8685a; --none:#8b8ea3; --nocheck:#d9a441;
  --ok-bg:rgba(116,198,157,.10); --warn-bg:rgba(224,179,92,.10); --bad-bg:rgba(232,104,90,.12);
  --none-bg:rgba(139,142,163,.10);
  --nocheck-bg:rgba(217,164,65,.08);
  --hero:linear-gradient(150deg,#363061 0%,#1a1c2e 74%);
  --halo:rgba(145,132,217,.28);
  --glow:0 0 26px rgba(145,132,217,.25);
  --glow-cta:0 0 32px rgba(145,132,217,.32);
  --glass:rgba(20,22,31,.88);
  --rule:rgba(145,132,217,.22);
}
*{box-sizing:border-box}
body{margin:0}
html{scroll-behavior:smooth; background:var(--ground)}
body{
  background:var(--ground); color:var(--tx1);
  font-family:'Inter',-apple-system,'Segoe UI',Arial,sans-serif;
  font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased;
  overflow-x:hidden; position:relative; min-height:100vh;
}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body::-webkit-scrollbar{width:10px}
body::-webkit-scrollbar-track{background:var(--ground)}
body::-webkit-scrollbar-thumb{background:var(--line); border-radius:99px}
h1,h2,h3,h4,.dsp{font-family:'Sora',Verdana,sans-serif; margin:0; letter-spacing:-.02em}
p{margin:0}
a{color:var(--acc-soft); text-decoration:none}
a:hover{color:var(--acc-press)}
.hi{font-family:'Noto Sans Devanagari','Inter',Arial,sans-serif; line-height:1.7; letter-spacing:0}
.hi h1,.hi h2,.hi h3,.hi h4,.hi .dsp{font-family:'Noto Sans Devanagari','Sora',Verdana,sans-serif;
  letter-spacing:0; line-height:1.35}
.hi .micro{text-transform:none; letter-spacing:0; font-size:12px}
.hi .lead,.hi .b1,.hi .b2,.hi .b3,.hi .t1,.hi .t2,.hi .docv,.hi p,.hi li,
.hi .chip,.hi .pill,.hi .btn,.hi .btn2,.hi .nlink{line-height:1.7; letter-spacing:0}
.hi .pill,.hi .chip{height:auto; min-height:34px; padding-top:5px; padding-bottom:5px}
.hi .btn,.hi .btn2{height:auto; min-height:52px; padding-top:10px; padding-bottom:10px}
.micro{font-size:11px; font-weight:700; letter-spacing:.20em; text-transform:uppercase; color:var(--tx3)}
.d1{font-size:62px; line-height:1.04; font-weight:800; letter-spacing:-.03em}
.d2{font-size:40px; line-height:1.12; font-weight:800; letter-spacing:-.025em}
.d3{font-size:30px; line-height:1.15; font-weight:800; letter-spacing:-.02em}
.t1{font-size:19px; line-height:1.3; font-weight:700; letter-spacing:0}
.t2{font-size:15px; line-height:1.3; font-weight:700; letter-spacing:0}
.b1{font-size:16px; line-height:1.62; color:var(--tx2)}
.b2{font-size:14.5px; line-height:1.55; color:var(--tx2)}
.b3{font-size:12.5px; line-height:1.45; color:var(--tx3)}
.lead{font-size:19px; line-height:1.55; color:var(--tx2)}
.wrap{max-width:1140px; margin:0 auto; padding:0 40px}
.sec{padding:var(--s10) 0; position:relative}
.sec-hd{max-width:640px; margin-bottom:var(--s8)}
.sec-hd .micro{margin-bottom:14px; display:flex; align-items:center; gap:10px}
.sec-hd .micro::after{content:''; flex:1; height:1px; background:var(--rule)}
.grid{display:grid; gap:var(--s5)}
.row{display:flex; gap:var(--s4); align-items:center}
.col{display:flex; flex-direction:column; gap:var(--s4)}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--r-card); padding:var(--s6)}
.card.feat{border-radius:var(--r-feature)}
.card.i{transition:transform var(--motion-fast) ease, border-color var(--motion-fast) ease}
.card.i:hover{transform:translateY(-2px); border-color:var(--acc)}
.inset{background:var(--inset); border-radius:var(--r-row)}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px;
  height:52px; padding:0 26px; border-radius:var(--r-row);
  border:1.5px solid var(--acc); background:var(--acc-tint); color:var(--acc-press);
  font-family:'Sora',Verdana,sans-serif; font-weight:700; font-size:15.5px;
  box-shadow:var(--glow); cursor:pointer;
  transition:background var(--motion-fast) ease, transform var(--motion-fast) ease}
.btn:hover{background:var(--acc-tint-hi)}
.btn:active{transform:scale(.98)}
.btn.lg{height:64px; padding:0 34px; font-size:18px; border-radius:var(--r-cta); box-shadow:var(--glow-cta)}
.btn2{display:inline-flex; align-items:center; justify-content:center; gap:9px;
  height:46px; padding:0 20px; border-radius:var(--r-row);
  border:1px solid var(--line); background:var(--inset); color:var(--tx1);
  font-weight:600; font-size:14.5px; cursor:pointer;
  transition:border-color var(--motion-fast) ease}
.btn2:hover{border-color:var(--acc)}
.chip{display:inline-flex; align-items:center; gap:7px; height:30px; padding:0 13px;
  border-radius:var(--r-pill); background:var(--inset); border:1px solid var(--line);
  font-size:12.5px; font-weight:600; color:var(--tx2)}
.chip.acc{border-color:var(--acc); background:var(--acc-tint); color:var(--acc-soft)}
.pill{display:inline-flex; align-items:center; gap:8px; height:34px; padding:0 15px;
  border-radius:var(--r-pill); font-size:13px; font-weight:700; font-family:'Sora',Verdana,sans-serif}
.pill.ok{background:var(--ok-bg); border:1px solid var(--ok); color:var(--ok)}
.pill.warn{background:var(--warn-bg); border:1px solid var(--warn); color:var(--warn)}
.pill.bad{background:var(--bad-bg); border:1px solid var(--bad); color:var(--bad)}
.tile{width:56px; height:56px; border-radius:var(--r-row); display:grid; place-items:center;
  background:var(--acc-tint); color:var(--acc-soft); flex:none}
.tile.sm{width:44px; height:44px; border-radius:14px}
.tile.ok{background:var(--ok-bg); color:var(--ok)}
.tile.warn{background:var(--warn-bg); color:var(--warn)}
.tile.bad{background:var(--bad-bg); color:var(--bad)}
.tile.n,.tile.none{background:var(--inset); color:var(--tx2)}
.nav{position:sticky; top:0; z-index:60; height:72px; display:flex; align-items:center;
  background:var(--glass); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid transparent; transition:border-color var(--motion-standard) ease}
.nav.scrolled{border-bottom-color:var(--line)}
.nav .wrap{display:flex; align-items:center; gap:var(--s8); width:100%}
.brand{display:flex; align-items:center; gap:10px; flex:none}
.wm{font-family:'Sora',Verdana,sans-serif; font-weight:800; font-size:21px; letter-spacing:-.03em}
.wm i{font-style:normal; color:var(--acc-soft)}
.nlinks{display:flex; align-items:center; gap:26px; flex:1}
.nlink{font-size:14.5px; font-weight:600; color:var(--tx2); position:relative; padding:6px 0}
.nlink:hover{color:var(--tx1)}
.nlink.on{color:var(--tx1)}
.nlink.on::after{content:''; position:absolute; left:0; right:0; bottom:-2px; height:3px;
  border-radius:99px; background:var(--acc); box-shadow:0 0 10px var(--acc)}
.nact{display:flex; align-items:center; gap:12px; flex:none}
.seg{display:flex; padding:3px; border-radius:14px; background:var(--inset); border:1px solid var(--line)}
.seg b{display:grid; place-items:center; height:30px; padding:0 12px; border-radius:11px;
  font-size:12.5px; font-weight:600; color:var(--tx3); cursor:pointer}
.seg b.on{background:var(--acc-tint); border:1px solid var(--acc); color:var(--acc-soft)}
.iconbtn{width:36px; height:36px; border-radius:12px; display:grid; place-items:center;
  border:1px solid var(--line); background:var(--inset); color:var(--tx2); cursor:pointer}
.iconbtn:hover{border-color:var(--acc); color:var(--acc-soft)}
[data-plx]{will-change:transform}
.rv{opacity:0; transform:translateY(28px); transition:opacity 620ms var(--ease), transform 620ms var(--ease)}
.rv.in{opacity:1; transform:none}
.orb{position:absolute; border-radius:50%; pointer-events:none; filter:blur(6px)}
.grain{position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:radial-gradient(circle at 1px 1px, var(--line) 1px, transparent 0);
  background-size:34px 34px; -webkit-mask-image:radial-gradient(120% 80% at 50% 0%, #000 20%, transparent 72%);
  mask-image:radial-gradient(120% 80% at 50% 0%, #000 20%, transparent 72%)}
.bar{height:8px; border-radius:99px; background:var(--inset); overflow:hidden}
.bar span{display:block; height:100%; width:0; border-radius:99px;
  background:linear-gradient(90deg,var(--acc),var(--acc-soft));
  transition:width 900ms var(--ease) var(--dly,0ms)}
.in .bar span{width:var(--w)}
.bar.ok span{background:var(--ok)}
.bar.warn span{background:var(--warn)}
.bar.bad span{background:var(--bad)}
.foot{border-top:1px solid var(--line); background:var(--page); padding:var(--s9) 0 var(--s8)}
.foot .cols{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:var(--s8)}
.foot h4{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--tx3); margin-bottom:14px}
.foot .lk{display:flex; flex-direction:column; gap:10px}
.foot .lk a{font-size:13.5px; color:var(--tx2)}
.foot .lk a:hover{color:var(--tx1)}
.legalbar{margin-top:var(--s8); padding-top:22px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center; gap:20px}
.store{display:inline-flex; align-items:center; gap:12px; height:58px; padding:0 22px;
  border-radius:var(--r-row); border:1px solid var(--line); background:var(--card); color:var(--tx1);
  transition:border-color var(--motion-fast) ease}
.store:hover{border-color:var(--acc); color:var(--tx1)}
.store small{display:block; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--tx3)}
.store b{display:block; font-family:'Sora',Verdana,sans-serif; font-size:16px; font-weight:700; letter-spacing:-.02em}
.ph{color:var(--tx3); border-bottom:1px dashed var(--tx3); font-weight:600}
@media (prefers-reduced-motion: reduce){
  .rv{opacity:1; transform:none; transition:none}
  .bar span{transition:none; width:var(--w)}
  *{animation-duration:1ms !important; animation-iteration-count:1 !important}
  body{scroll-behavior:auto}
}
.hero{position:relative; min-height:660px; padding:88px 0 96px; overflow:hidden;
  background:var(--hero); color:#e9e9ed; border-bottom-left-radius:var(--r-hero);
  border-bottom-right-radius:var(--r-hero)}
.hero .b1,.hero .b2,.hero .lead{color:#c9c6de}
.hero .micro{color:#a49ecb}
.hero-in{position:relative; z-index:3; display:grid; grid-template-columns:1.08fr .92fr;
  gap:56px; align-items:center}
.o1{width:520px; height:520px; left:-140px; top:-120px;
  background:radial-gradient(circle,rgba(145,132,217,.28),transparent 66%)}
.o2{width:420px; height:420px; right:-90px; top:180px;
  background:radial-gradient(circle,rgba(179,169,230,.20),transparent 66%)}
.hero h1{font-size:64px; line-height:1.02; letter-spacing:-.035em; color:#fff}
.hero h1 em{font-style:normal; color:#b3a9e6}
.drop{margin-top:32px; border:1.5px dashed rgba(179,169,230,.55); border-radius:var(--r-feature);
  background:rgba(20,22,31,.34); padding:26px; display:flex; align-items:center; gap:20px;
  transition:border-color var(--motion-standard) ease, background var(--motion-standard) ease}
.drop:hover{border-color:#b3a9e6; background:rgba(20,22,31,.5)}
.hero .btn{color:#e9e9ed; border-color:#b3a9e6; background:rgba(145,132,217,.20)}
.hero .btn:hover{background:rgba(145,132,217,.32)}
.hero .btn2{background:rgba(233,233,237,.06); border-color:rgba(233,233,237,.22); color:#e9e9ed}
.trustline{display:flex; gap:22px; margin-top:26px; flex-wrap:wrap}
.trustline span{display:inline-flex; align-items:center; gap:8px; font-size:13px; color:#a49ecb}
.stack{position:relative; height:430px}
.doc{position:absolute; width:292px; border-radius:18px; padding:18px;
  background:rgba(30,33,50,.92); border:1px solid rgba(179,169,230,.28);
  box-shadow:0 18px 44px rgba(10,10,20,.42); backdrop-filter:blur(6px)}
.doc .ln{height:7px; border-radius:99px; background:rgba(233,233,237,.13); margin-top:9px}
.doc.k1{left:16px; top:8px; transform-origin:center}
.doc.k2{right:-10px; top:118px; width:268px}
.doc.k3{left:40px; bottom:0; width:274px}
.docv{display:flex; align-items:flex-start; gap:9px; font-family:'Sora',Verdana,sans-serif;
  font-weight:700; font-size:12.5px; line-height:1.35}
.docv svg{flex:none; margin-top:1px}
.doc .b3{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.beam{position:absolute; left:0; right:0; height:2px; border-radius:2px;
  background:linear-gradient(90deg,transparent,#b3a9e6,transparent);
  box-shadow:0 0 16px #9184d9; animation:scan 2600ms var(--ease-inout) infinite}
0%{top:14%; opacity:0}
12%{opacity:1}
88%{opacity:1}
100%{top:86%; opacity:0}
.halo-mark{position:absolute; width:260px; height:260px; border-radius:50%;
  background:radial-gradient(circle,rgba(145,132,217,.30),transparent 65%);
  animation:breathe 3400ms var(--ease-inout) infinite}
0%,100%{opacity:.55; transform:scale(1)}
50%{opacity:1; transform:scale(1.08)}
.strip{margin-top:-44px; position:relative; z-index:8}
.strip .grid{grid-template-columns:repeat(4,1fr)}
.act{background:var(--card); border:1px solid var(--line); border-radius:var(--r-card);
  padding:22px; display:flex; flex-direction:column; gap:12px;
  transition:transform var(--motion-fast) ease, border-color var(--motion-fast) ease}
.act:hover{transform:translateY(-3px); border-color:var(--acc)}
.flowbox{position:relative; background:var(--card); border:1px solid var(--line);
  border-radius:var(--r-feature); padding:44px 40px 36px; overflow:hidden}
.flow{display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative}
.fstep{position:relative; padding:0 18px; text-align:center}
.fstep .num{width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  margin:0 auto 14px; font-family:'Sora',Verdana,sans-serif; font-size:13px; font-weight:800;
  background:var(--inset); color:var(--tx3); border:1px solid var(--line)}
.fstep .disc{width:84px; height:84px; border-radius:26px; margin:0 auto 16px; display:grid;
  place-items:center; background:var(--inset); border:1px solid var(--line); color:var(--tx2);
  animation:lift 5200ms var(--ease-inout) infinite}
.fstep:nth-child(1) .disc{animation-delay:0ms}
.fstep:nth-child(2) .disc{animation-delay:1300ms}
.fstep:nth-child(3) .disc{animation-delay:2600ms}
.fstep:nth-child(4) .disc{animation-delay:3900ms}
0%,72%,100%{border-color:var(--line); color:var(--tx2); background:var(--inset);
  box-shadow:none; transform:translateY(0)}
12%,60%{border-color:var(--acc); color:var(--acc-soft); background:var(--acc-tint);
  box-shadow:var(--glow); transform:translateY(-5px)}
.frail{position:absolute; left:12%; right:12%; top:104px; height:2px; background:var(--line);
  border-radius:2px}
.ftoken{position:absolute; top:-4px; left:0; width:10px; height:10px; border-radius:50%;
  background:var(--acc-soft); box-shadow:0 0 14px var(--acc);
  animation:travel 5200ms var(--ease-inout) infinite}
0%{left:0%}
18%{left:0%}
30%{left:33.3%}
44%{left:33.3%}
56%{left:66.6%}
70%{left:66.6%}
82%{left:100%}
100%{left:100%}
.fverdict{margin-top:34px; border-top:1px dashed var(--line); padding-top:26px;
  display:flex; align-items:center; gap:16px; justify-content:center}
.three{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s5)}
.pane{background:var(--card); border:1px solid var(--line); border-radius:var(--r-feature);
  overflow:hidden; display:flex; flex-direction:column}
.pane .art{height:186px; position:relative; display:grid; place-items:center;
  background:var(--inset); border-bottom:1px solid var(--line); overflow:hidden}
.pane .body{padding:24px}
.pane .verdictline{margin-top:16px; padding-top:14px; border-top:1px solid var(--line);
  display:flex; align-items:center; gap:9px; font-size:13px; font-weight:600}
.sq{stroke-dasharray:220; stroke-dashoffset:220; animation:draw 3200ms var(--ease-inout) infinite}
0%{stroke-dashoffset:220}
45%,72%{stroke-dashoffset:0}
100%{stroke-dashoffset:220}
.copyghost{position:absolute; opacity:0; animation:ghost 3200ms var(--ease-inout) infinite}
0%,30%{opacity:0; transform:translate(0,0) rotate(0)}
55%{opacity:.5; transform:translate(34px,16px) rotate(-6deg)}
85%,100%{opacity:0; transform:translate(60px,26px) rotate(-9deg)}
.hashrun{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; letter-spacing:.06em;
  color:var(--acc-soft); animation:flick 2400ms steps(6) infinite}
0%,100%{opacity:.55}
50%{opacity:1}
.scale{position:relative; height:88px; border-radius:var(--r-row); overflow:hidden;
  border:1px solid var(--line); display:flex}
.scale .z{flex:none; display:flex; flex-direction:column; justify-content:flex-end;
  padding:12px 14px; position:relative}
.scale .z b{font-family:'Sora',Verdana,sans-serif; font-size:14px; font-weight:700}
.scale .z small{font-size:11.5px; opacity:.85}
.z.high{width:50%; background:var(--bad-bg); color:var(--bad); border-right:2px solid var(--ground)}
.z.med{width:30%; background:var(--warn-bg); color:var(--warn); border-right:2px solid var(--ground)}
.z.low{width:20%; background:var(--ok-bg); color:var(--ok)}
.ticks{display:flex; margin-top:8px; font-size:11.5px; color:var(--tx3)}
.ring-wrap{display:grid; place-items:center; position:relative; width:200px; height:200px}
.ring-num{position:absolute; text-align:center}
.ring-num b{font-family:'Sora',Verdana,sans-serif; font-size:44px; font-weight:800;
  letter-spacing:-.02em; display:block; line-height:1}
.ringc{transition:stroke-dashoffset var(--motion-ceremony) var(--ease-inout)}
.checks{display:grid; grid-template-columns:1fr 1fr; gap:14px 32px}
.ck{display:grid; grid-template-columns:26px 1fr auto; gap:14px; align-items:center;
  padding:13px 0; border-bottom:1px solid var(--line)}
.mx{width:100%; border-collapse:separate; border-spacing:0}
.mx th,.mx td{text-align:left; padding:15px 18px; border-bottom:1px solid var(--line);
  font-size:14.5px}
.mx thead th{font-family:'Sora',Verdana,sans-serif; font-size:13px; font-weight:700;
  color:var(--tx3); text-transform:uppercase; letter-spacing:.12em}
.mx td:first-child{color:var(--tx2); width:38%}
.mx .yes{color:var(--acc-soft); display:inline-flex; align-items:center; gap:8px; font-weight:600}
.mx .no{color:var(--tx3); display:inline-flex; align-items:center; gap:8px; font-weight:600}
.mx tbody tr:hover td{background:var(--acc-tint)}
.feats{grid-template-columns:repeat(3,1fr)}
.arts{grid-template-columns:repeat(3,1fr)}
.art-card{background:var(--card); border:1px solid var(--line); border-radius:var(--r-card);
  overflow:hidden; transition:transform var(--motion-fast) ease, border-color var(--motion-fast) ease}
.art-card:hover{transform:translateY(-3px); border-color:var(--acc)}
.art-card .cover{height:132px; position:relative; overflow:hidden;
  background:var(--hero); display:grid; place-items:center; color:#b3a9e6}
.ctaband{background:var(--hero); border-radius:var(--r-hero); padding:64px 56px;
  position:relative; overflow:hidden; color:#e9e9ed}
.ctaband .b1{color:#c9c6de}
.apphd{padding:44px 0 30px; border-bottom:1px solid var(--line); position:relative; overflow:hidden}
.apphd .orb{width:420px; height:420px; right:-120px; top:-220px;
  background:radial-gradient(circle,var(--halo),transparent 66%)}
.two{display:grid; grid-template-columns:1.35fr .65fr; gap:var(--s8); align-items:start}
.dz{border:1.5px dashed var(--acc); border-radius:var(--r-feature); background:var(--acc-tint);
  padding:52px 40px; text-align:center; position:relative; overflow:hidden;
  transition:background var(--motion-standard) ease}
.dz:hover{background:var(--acc-tint-hi)}
.dz .ring{width:96px; height:96px; border-radius:32px; margin:0 auto 22px; display:grid;
  place-items:center; background:var(--card); border:1px solid var(--acc); color:var(--acc-soft);
  box-shadow:var(--glow); animation:breathe 3400ms var(--ease-inout) infinite}
.side{display:flex; flex-direction:column; gap:var(--s4)}
.srow{display:grid; grid-template-columns:40px 1fr; gap:14px; align-items:flex-start;
  padding:14px 0; border-bottom:1px solid var(--line)}
.srow:last-child{border-bottom:0}
.scanning{position:relative; height:230px; border-radius:var(--r-feature); overflow:hidden;
  background:var(--inset); border:1px solid var(--line); display:grid; place-items:center}
.scanning .beam{position:absolute; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--acc-soft),transparent);
  box-shadow:0 0 16px var(--acc); animation:scan 1600ms var(--ease-inout) infinite}
.vcol{border-radius:var(--r-feature); border:1px solid var(--line); overflow:hidden;
  background:var(--card); display:flex; flex-direction:column}
.vhead{padding:36px 26px 30px; text-align:center; position:relative; overflow:hidden}
.vhead.ok{background:radial-gradient(420px 300px at 50% -50px,var(--ok-bg),transparent 72%)}
.vhead.warn{background:radial-gradient(420px 300px at 50% -50px,var(--warn-bg),transparent 72%)}
.vhead.bad{background:radial-gradient(420px 300px at 50% -50px,var(--bad-bg),transparent 72%)}
.vico{width:96px; height:96px; border-radius:50%; margin:0 auto 20px; display:grid; place-items:center}
.reason{display:grid; grid-template-columns:20px 1fr; gap:12px; align-items:flex-start;
  padding:13px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--tx2)}
.reason:last-of-type{border-bottom:0}
.jolt{animation:jolt 380ms var(--ease) 1}
0%,100%{transform:translateX(0)}
20%{transform:translateX(-7px)}
40%{transform:translateX(6px)}
60%{transform:translateX(-4px)}
80%{transform:translateX(2px)}
.mark{border:1px solid var(--line); border-radius:var(--r-row); background:var(--inset);
  height:112px; display:grid; place-items:center; position:relative; overflow:hidden}
.mark.sel{border-color:var(--acc); box-shadow:var(--glow)}
.mark .lockbadge{position:absolute; top:8px; right:8px; color:var(--tx3)}
.canvasdoc{background:#f6f6f8; border-radius:var(--r-row); aspect-ratio:1/1.31; position:relative;
  border:1px solid var(--line); overflow:hidden}
.canvasdoc .ln{height:8px; border-radius:99px; background:#dcdce4; margin:14px 30px}
.snap{position:absolute; border:1.5px dashed var(--acc); border-radius:6px;
  background:rgba(145,132,217,.10)}
.snapline{position:absolute; background:var(--acc); box-shadow:0 0 8px var(--acc)}
.meter{height:6px; border-radius:99px; background:var(--inset); overflow:hidden}
.meter span{display:block; height:100%; border-radius:99px;
  background:linear-gradient(90deg,var(--acc),var(--acc-soft)); box-shadow:var(--glow)}
.vlist .it{display:grid; grid-template-columns:44px 1fr auto; gap:14px; align-items:center;
  padding:16px 0; border-bottom:1px solid var(--line)}
.heat{display:grid; grid-template-columns:repeat(26,1fr); gap:4px}
.heat i{aspect-ratio:1; border-radius:3px; background:var(--inset); display:block}
.heat i.v{border-radius:3px}
.heat i.c{border-radius:0}
.heat i.f{border-radius:50%}
.chain{display:flex; flex-direction:column; gap:0}
.chain .node{display:grid; grid-template-columns:44px 1fr; gap:16px; align-items:center;
  padding:16px 0; position:relative}
.chain .node:not(:last-child)::after{content:''; position:absolute; left:21px; top:60px; bottom:-4px;
  width:2px; background:var(--line)}
.kv{display:grid; grid-template-columns:1fr 1fr; gap:2px 28px}
.kv div{display:flex; justify-content:space-between; gap:16px; padding:11px 0;
  border-bottom:1px solid var(--line); font-size:13.5px}
.kv b{font-weight:600; color:var(--tx1); font-family:ui-monospace,'SF Mono',Menlo,monospace;
  font-size:12.5px}
.bloghero{padding:56px 0 44px; position:relative; overflow:hidden;
  border-bottom:1px solid var(--line)}
.bloghero .orb{width:460px; height:460px; right:-140px; top:-240px;
  background:radial-gradient(circle,var(--halo),transparent 66%)}
.cats{display:flex; gap:10px; flex-wrap:wrap}
.feature{display:grid; grid-template-columns:1.05fr .95fr; gap:0; border:1px solid var(--line);
  border-radius:var(--r-feature); overflow:hidden; background:var(--card)}
.feature .cover{background:var(--hero); position:relative; min-height:300px; display:grid;
  place-items:center; color:#b3a9e6; overflow:hidden}
.feature .body{padding:38px}
.blist{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s5)}
.prose{max-width:680px}
.prose h2{font-size:27px; margin:44px 0 16px; letter-spacing:-.02em}
.prose h3{font-size:19px; margin:32px 0 12px}
.prose p{font-size:17px; line-height:1.72; color:var(--tx2); margin:0 0 18px}
.prose ul{margin:0 0 18px; padding-left:22px; color:var(--tx2); font-size:17px; line-height:1.72}
.prose li{margin-bottom:9px}
.prose strong{color:var(--tx1); font-weight:600}
.pull{border-left:3px solid var(--acc); padding:6px 0 6px 22px; margin:32px 0;
  font-family:'Sora',Verdana,sans-serif; font-size:21px; line-height:1.44; color:var(--tx1);
  font-weight:600; letter-spacing:-.01em}
.figure{margin:34px 0; border:1px solid var(--line); border-radius:var(--r-card);
  background:var(--inset); padding:28px; text-align:center}
.figure figcaption{margin-top:16px; font-size:12.5px; color:var(--tx3); text-align:left}
.toc{position:sticky; top:96px; align-self:start}
.toc a{display:block; padding:8px 0 8px 14px; border-left:2px solid var(--line);
  font-size:13.5px; color:var(--tx2)}
.toc a.on{border-left-color:var(--acc); color:var(--acc-soft); font-weight:600}
.artgrid{display:grid; grid-template-columns:200px 1fr; gap:var(--s8)}
.anat{position:relative}
.fld{position:relative; border:1.5px dashed var(--acc); border-radius:10px; padding:12px 14px;
  background:var(--acc-tint); margin-bottom:14px}
.fld .tag{position:absolute; top:-10px; left:12px; height:20px; padding:0 8px; border-radius:99px;
  background:var(--acc); color:#14161f; font-size:10.5px; font-weight:800; display:flex;
  align-items:center; font-family:ui-monospace,'SF Mono',Menlo,monospace}
.fld.opt{border-color:var(--tx3); background:var(--inset)}
.fld.opt .tag{background:var(--tx3)}
.fld.rep{border-color:var(--acc-soft); background:transparent}
.fld.rep .tag{background:var(--acc-soft)}
.schema{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12.5px; line-height:1.8;
  color:var(--tx2)}
.schema b{color:var(--acc-soft); font-weight:600}
.schema i{color:var(--tx3); font-style:normal}
.journey{position:relative; padding:38px 0 10px}
.jrail{position:absolute; left:6%; right:6%; top:96px; height:2px; background:var(--line)}
.jrail::after{content:''; position:absolute; left:0; top:0; height:100%; width:0;
  background:linear-gradient(90deg,var(--acc),var(--acc-soft)); box-shadow:0 0 12px var(--acc);
  animation:fill 6400ms var(--ease-inout) infinite}
0%{width:0}
12%{width:0}
88%{width:100%}
100%{width:100%}
.jgrid{display:grid; grid-template-columns:repeat(5,1fr); position:relative}
.jstep{text-align:center; padding:0 12px}
.jstep .dot{width:76px; height:76px; border-radius:26px; margin:0 auto 18px; display:grid;
  place-items:center; background:var(--card); border:1px solid var(--line); color:var(--tx2);
  position:relative; z-index:2; animation:pop 6400ms var(--ease-inout) infinite}
.jstep:nth-child(1) .dot{animation-delay:0ms}
.jstep:nth-child(2) .dot{animation-delay:1200ms}
.jstep:nth-child(3) .dot{animation-delay:2400ms}
.jstep:nth-child(4) .dot{animation-delay:3600ms}
.jstep:nth-child(5) .dot{animation-delay:4800ms}
0%,78%,100%{border-color:var(--line); color:var(--tx2); box-shadow:none;
  transform:scale(1)}
10%,58%{border-color:var(--acc); color:var(--acc-soft); background:var(--acc-tint);
  box-shadow:var(--glow); transform:scale(1.07)}
.trust3{display:grid; grid-template-columns:repeat(3,1fr); gap:0; position:relative}
.tnode{text-align:center; padding:0 20px; position:relative}
.tnode .seal{width:104px; height:104px; border-radius:34px; margin:0 auto 18px; display:grid;
  place-items:center; background:var(--acc-tint); border:1.5px solid var(--acc);
  color:var(--acc-soft); box-shadow:var(--glow)}
.tnode:not(:last-child)::after{content:''; position:absolute; right:-16px; top:48px; width:32px;
  height:2px; background:var(--acc); box-shadow:0 0 8px var(--acc)}
.diffdoc{border:1px solid var(--line); border-radius:var(--r-card); overflow:hidden;
  background:var(--card)}
.diffdoc header{padding:12px 18px; border-bottom:1px solid var(--line); display:flex;
  align-items:center; gap:10px; font-size:12.5px; font-weight:600}
.diffdoc .pane2{padding:22px; background:#f6f6f8}
.dl{height:9px; border-radius:99px; background:#dcdce4; margin-bottom:11px}
.dl.chg{background:rgba(232,104,90,.38); position:relative}
.dl.chg::after{content:''; position:absolute; inset:-4px -6px; border:1.5px solid var(--bad);
  border-radius:8px; animation:pulseb 2200ms var(--ease-inout) infinite}
0%,100%{opacity:.35}
50%{opacity:1}
.bandrow{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s5)}
.bandcard{border:1px solid var(--line); border-radius:var(--r-card); padding:24px; background:var(--card)}
.bandcard .bico{width:60px; height:60px; border-radius:20px; display:grid; place-items:center;
  margin-bottom:18px}
.sw{display:grid; grid-template-columns:repeat(6,1fr); gap:12px}
.sw div{border-radius:12px; overflow:hidden; border:1px solid var(--line)}
.sw i{display:block; height:56px}
.sw p{padding:9px 10px; font-size:11px; font-family:ui-monospace,'SF Mono',Menlo,monospace;
  color:var(--tx2); line-height:1.5}
.sw p b{display:block; color:var(--tx1); font-family:'Inter',sans-serif; font-size:11.5px;
  font-weight:600; margin-bottom:2px}
.tbl{width:100%; border-collapse:separate; border-spacing:0}
.tbl th,.tbl td{text-align:left; padding:11px 14px; border-bottom:1px solid var(--line);
  font-size:13px; vertical-align:top}
.tbl thead th{font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--tx3);
  font-family:'Sora',Verdana,sans-serif; font-weight:700}
.tbl code, code.k{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12px;
  color:var(--acc-soft)}
.blk{margin-bottom:44px}
.blk > .micro{margin-bottom:16px; display:flex; align-items:center; gap:10px}
.blk > .micro::after{content:''; flex:1; height:1px; background:var(--rule)}
.spec{display:grid; grid-template-columns:150px 1fr; gap:20px; padding:16px 0;
  border-bottom:1px solid var(--line); align-items:center}
.ok-x{color:var(--ok)}
.no-x{color:var(--bad)}
.t-dark{
  --field-bg:#191c2b; --field-line:#333752; --field-line-on:#9184d9;
  --field-bad:#e08a80; --field-bad-bg:rgba(224,138,128,.10);
  --field-ok:#7fb59b; --field-hint:#8b8ea3;
}
.t-light{
  --field-bg:#f6f6f9; --field-line:#cbcdd9; --field-line-on:#6f61c4;
  --field-bad:#b4463a; --field-bad-bg:rgba(180,70,58,.07);
  --field-ok:#3f7d60; --field-hint:#6f7285;
}
.screen{background:var(--ground); color:var(--tx1); min-height:100%;
  font-family:'Inter',-apple-system,'Segoe UI',Arial,sans-serif; font-size:15px;
  line-height:1.5; -webkit-font-smoothing:antialiased; display:flex;
  flex-direction:column; position:relative; overflow:hidden}
.screen .rv{opacity:1; transform:none}
.screen.hi{font-family:'Noto Sans Devanagari','Inter',Arial,sans-serif; line-height:1.7}
.sbar{height:52px; display:flex; align-items:center; gap:12px; padding:0 20px; flex:none}
.sbar .back{width:40px; height:40px; border-radius:12px; display:grid; place-items:center;
  color:var(--tx2); margin-left:-8px}
.sbody{flex:1; min-height:0; padding:8px 20px 24px; display:flex;
  flex-direction:column; overflow-y:auto}
.sbody::-webkit-scrollbar{width:0}
.sfoot{padding:16px 20px 24px; flex:none; display:flex; flex-direction:column; gap:12px}
.field{display:flex; flex-direction:column; gap:8px}
.field > label{font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--tx3)}
.input{min-height:56px; border-radius:var(--r-row); background:var(--field-bg);
  border:1px solid var(--field-line); display:flex; align-items:center; gap:12px;
  padding:0 16px; font-size:16px}
.input.on{border-color:var(--field-line-on); box-shadow:0 0 0 3px var(--acc-tint)}
.input.bad{border-color:var(--field-bad); background:var(--field-bad-bg)}
.input .val{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.input .ph{color:var(--tx3); border:0; font-weight:400}
.input .caret{width:1.5px; height:22px; background:var(--acc); display:inline-block;
  animation:blink 1100ms steps(1) infinite}
0%,49%{opacity:1}
50%,100%{opacity:0}
.hint{font-size:12.5px; color:var(--field-hint); line-height:1.5}
.err{display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--field-bad);
  font-weight:500}
.err svg{flex:none; margin-top:1px}
.okline{display:flex; gap:8px; align-items:center; font-size:13px; color:var(--field-ok)}
.otp{display:flex; gap:10px}
.otp i{flex:1; min-width:44px; height:60px; border-radius:14px; background:var(--field-bg);
  border:1px solid var(--field-line); display:grid; place-items:center;
  font-family:'Sora',Verdana,sans-serif; font-size:24px; font-weight:700; font-style:normal}
.otp i.on{border-color:var(--field-line-on); box-shadow:0 0 0 3px var(--acc-tint)}
.otp i.bad{border-color:var(--field-bad); background:var(--field-bad-bg); color:var(--field-bad)}
.otp.six i{font-size:22px}
.codes{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.codes span{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:14px;
  letter-spacing:.06em; background:var(--field-bg); border:1px solid var(--field-line);
  border-radius:12px; padding:12px 14px; text-align:center; color:var(--tx1)}
.qrbox{width:200px; height:200px; border-radius:20px; background:#fff; display:grid;
  place-items:center; margin:0 auto; position:relative; color:#14161f}
.qrbox .scanline{position:absolute; left:14px; right:14px; height:2px; background:var(--acc);
  box-shadow:0 0 12px var(--acc); animation:qscan 2200ms var(--ease-inout) infinite}
0%{top:16px}
50%{top:180px}
100%{top:16px}
.pair{display:grid; grid-template-columns:1fr auto 1fr; gap:20px; align-items:center}
.pairlink{display:flex; flex-direction:column; align-items:center; gap:6px; color:var(--acc-soft)}
.pairlink i{display:block; width:2px; height:34px; background:var(--acc); opacity:.5}
.totp{display:flex; align-items:center; gap:14px; background:var(--field-bg);
  border:1px solid var(--field-line); border-radius:var(--r-row); padding:14px 16px}
.totp b{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:22px;
  letter-spacing:.18em; flex:1}
.ring-t{width:34px; height:34px; flex:none}
.coach{position:absolute; inset:0; background:rgba(10,11,18,.74);
  backdrop-filter:blur(2px); z-index:20}
.spot{position:absolute; border-radius:18px; box-shadow:0 0 0 3px var(--acc),
  0 0 0 9999px rgba(10,11,18,.74); background:transparent}
.tip{position:absolute; background:var(--card); border:1px solid var(--acc);
  border-radius:var(--r-card); padding:16px 18px; box-shadow:var(--glow); max-width:270px}
.tip .arrow{position:absolute; width:14px; height:14px; background:var(--card);
  border-left:1px solid var(--acc); border-top:1px solid var(--acc); transform:rotate(45deg)}
.tipnav{display:flex; align-items:center; justify-content:space-between; margin-top:14px;
  gap:12px}
.dots{display:flex; gap:6px}
.dots i{width:6px; height:6px; border-radius:50%; background:var(--line); display:block}
.dots i.on{background:var(--acc); width:18px; border-radius:99px}
.dash{display:grid; gap:14px}
.stat{background:var(--card); border:1px solid var(--line); border-radius:var(--r-card);
  padding:18px}
.stat .n{font-family:'Sora',Verdana,sans-serif; font-size:30px; font-weight:800;
  letter-spacing:-.02em; line-height:1; margin:10px 0 6px}
.quick{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.qa{background:var(--card); border:1px solid var(--line); border-radius:var(--r-card);
  padding:16px; display:flex; flex-direction:column; gap:10px; min-height:104px}
.qa:hover{border-color:var(--acc)}
.sparkrow{display:flex; align-items:flex-end; gap:3px; height:34px}
.sparkrow i{flex:1; background:var(--acc); opacity:.55; border-radius:2px 2px 0 0; display:block}
.sparkrow i.hi{opacity:1}
.timeline .ev{display:grid; grid-template-columns:34px 1fr auto; gap:12px; align-items:center;
  padding:13px 0; border-bottom:1px solid var(--line)}
.timeline .ev:last-child{border-bottom:0}
.shell{display:grid; grid-template-columns:236px 1fr; min-height:100%}
.side{background:var(--page); border-right:1px solid var(--line); padding:20px 14px;
  display:flex; flex-direction:column; gap:6px}
.side a{display:flex; align-items:center; gap:12px; min-height:44px; padding:0 12px;
  border-radius:12px; color:var(--tx2); font-size:14.5px; font-weight:600}
.side a.on{background:var(--acc-tint); color:var(--acc-soft)}
.side .who{margin-top:auto; border-top:1px solid var(--line); padding-top:14px}
.avatar{width:38px; height:38px; border-radius:12px; background:var(--acc-tint);
  color:var(--acc-soft); display:grid; place-items:center;
  font-family:'Sora',Verdana,sans-serif; font-weight:800; font-size:14px; flex:none}
.tier{display:flex; gap:12px; align-items:flex-start; border-radius:var(--r-row);
  padding:14px 16px; border:1px solid var(--acc); background:var(--acc-tint)}
.tier.b{border-color:var(--nocheck); background:var(--nocheck-bg)}
.tier b{font-family:'Sora',Verdana,sans-serif; font-size:13.5px}
.seg2{display:flex; padding:3px; border-radius:14px; background:var(--field-bg);
  border:1px solid var(--field-line)}
.seg2 b{flex:1; display:grid; place-items:center; min-height:44px; border-radius:11px;
  font-size:13.5px; font-weight:600; color:var(--tx3); font-family:inherit}
.seg2 b.on{background:var(--acc-tint); border:1px solid var(--acc); color:var(--acc-soft)}
a.b3, .row > a{display:inline-flex; align-items:center; min-height:44px}
.linkrow{display:flex; justify-content:center; gap:6px; font-size:14px; color:var(--tx2);
  min-height:44px; align-items:center; flex-wrap:wrap}
.linkrow a{display:inline-flex; align-items:center; min-height:44px}
.linkrow a{color:var(--acc-soft); font-weight:600}
.mark-hero{display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center}
.authpage{min-height:100vh; display:grid; place-items:center; padding:32px 20px 40px;
  position:relative; overflow:hidden}
.authpage .orb{width:520px; height:520px; left:50%; top:-260px; margin-left:-260px;
  background:radial-gradient(circle,var(--halo),transparent 66%); position:absolute}
.authpage .screen{width:100%; max-width:480px; height:auto !important; min-height:0;
  border:1px solid var(--line); border-radius:var(--r-feature); background:var(--card);
  overflow:visible; position:relative; z-index:2}
.authpage .sbody{overflow:visible; padding:8px 26px 26px}
.authpage .sfoot{padding:0 26px 28px}
.authpage .sbar{padding:14px 20px 0; height:auto; min-height:52px}
.authwrap{position:relative; z-index:2; width:100%; max-width:480px; margin:0 auto}
.authhead{position:relative; display:flex; align-items:center; justify-content:center;
  margin-bottom:22px; min-height:44px}
.authmark{display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit}
.authtop{position:absolute; top:50%; right:0; transform:translateY(-50%);
  display:flex; gap:10px}
.authfoot{margin-top:26px; text-align:center; position:relative; z-index:2}
.authfoot a{color:var(--tx3); font-size:12.5px; margin:0 8px; display:inline-flex;
  align-items:center; min-height:44px}
@media (max-width: 559px){
  .authpage{padding:0; display:block; min-height:100dvh}
  .authpage .screen{max-width:none; border:0; border-radius:0; background:transparent;
    min-height:100dvh; display:flex; flex-direction:column}
  .authpage .sbody{flex:1; padding:8px 20px 24px}
  .authpage .sfoot{padding:16px 20px 28px}
  .authpage .orb{display:none}
  .authwrap{max-width:none; display:flex; flex-direction:column; min-height:100dvh}
  .authhead{justify-content:space-between; padding:14px 20px 0; margin-bottom:0; gap:12px}
  .authtop{position:static; transform:none}
  .authpage .screen{min-height:0; flex:1}
  .authfoot{padding:0 20px 24px; margin-top:0}
}
.appshell{display:grid; grid-template-columns:236px 1fr; min-height:100vh}
.appshell > .side{position:sticky; top:0; height:100vh}
.appmain{padding:30px 36px; min-width:0}
.tabbar{display:none}
@media (max-width: 1023px){
  .appshell{grid-template-columns:88px 1fr}
  .appshell .side{padding:18px 10px; align-items:center}
  .appshell .side a{justify-content:center; padding:0; width:56px}
  .appshell .side a span{display:none}
  .appshell .side .brandtext,.appshell .side .whotext{display:none}
  .appmain{padding:24px 24px}
}
@media (max-width: 767px){
  .appshell{grid-template-columns:1fr}
  .appshell > .side{display:none}
  .appmain{padding:18px 18px 96px}
  .tabbar{display:flex; position:fixed; left:0; right:0; bottom:0; height:76px; z-index:60;
    background:var(--glass); backdrop-filter:blur(18px); border-top:1px solid var(--line)}
  .tabbar a{flex:1; display:flex; flex-direction:column; align-items:center;
    justify-content:center; gap:4px; font-size:10.5px; font-weight:600; color:var(--tx3);
    min-height:44px; position:relative; text-decoration:none}
  .tabbar a.on{color:var(--acc-soft)}
  .tabbar a.on::before{content:''; position:absolute; top:0; width:34px; height:3px;
    border-radius:99px; background:var(--acc); box-shadow:0 0 10px var(--acc)}
}
@media (max-width: 1023px){ .dashsplit{grid-template-columns:1fr !important} }
@media (max-width: 767px){
  .dash{grid-template-columns:1fr 1fr !important}
  .quick{grid-template-columns:1fr 1fr !important}
}
.seg b > .langlink{display:flex; align-items:center; justify-content:center;
  width:100%; height:100%; min-height:44px; margin:-1px -12px; padding:0 12px}
.chip{white-space:nowrap}
.stat .n{overflow-wrap:anywhere}
@media (max-width: 1200px){ .stat .n{font-size:24px} }
.notadopted{max-width:480px; margin:0 auto 20px; border-radius:var(--r-row);
  border:1px solid var(--nocheck); background:var(--nocheck-bg); padding:14px 16px;
  display:flex; gap:12px; align-items:flex-start; position:relative; z-index:2}
@media (max-width: 559px){ .notadopted{margin:16px 16px 0; max-width:none} }

/* ---- mobile layer (was the `.m` artboard scope) ---- */
@media (max-width: 768px){
  .wrap{padding:0 20px; max-width:none}
  .nav{height:60px}
  .nav .wrap{gap:0; justify-content:space-between}
  .nlinks{display:none}
  .sec{padding:52px 0}
  .sec-hd{margin-bottom:26px}
  .d1{font-size:38px; line-height:1.06}
  .d2{font-size:27px}
  .d3{font-size:21px}
  .lead{font-size:16px}
  .hero{min-height:auto; padding:36px 0 56px; border-bottom-left-radius:26px;
    border-bottom-right-radius:26px}
  .hero-in{grid-template-columns:1fr; gap:34px}
  .drop{flex-direction:column; align-items:stretch; text-align:center; gap:16px; padding:22px}
  .drop .tile{margin:0 auto}
  .btn{width:100%; height:56px}
  .stack{height:250px}
  .hi .stack{height:330px}
  .doc{width:250px}
  .doc.k1{left:0; top:0}
  .doc.k2{right:0; top:78px; width:236px}
  .doc.k3{display:none}
  .strip{margin-top:-30px}
  .strip .grid{grid-template-columns:1fr 1fr; gap:12px}
  .act{padding:16px}
  .flow{grid-template-columns:1fr 1fr; gap:26px 0}
  .frail{display:none}
  .flowbox{padding:26px 18px}
  .three{grid-template-columns:1fr}
  .checks{grid-template-columns:1fr; gap:0}
  .feats, .arts{grid-template-columns:1fr}
  .ctaband{padding:34px 22px; border-radius:26px}
  .ctaband > div{grid-template-columns:1fr !important; gap:28px}
  .foot .cols{grid-template-columns:1fr 1fr; gap:30px}
  .legalbar{flex-direction:column; align-items:flex-start; gap:10px}
  .trustline{gap:10px; flex-direction:column}
  .store{width:100%}
  .fverdict{flex-direction:column; text-align:center; gap:12px}
  .hi .fverdict .pill{white-space:normal; text-align:left; align-items:flex-start}
  .tabbar{position:sticky; bottom:0; z-index:50; height:66px; display:flex;
    background:var(--glass); backdrop-filter:blur(18px); border-top:1px solid var(--line)}
  .tabbar a{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:4px; font-size:10.5px; font-weight:600; color:var(--tx3)}
  .hi .tabbar a{font-size:12px; line-height:1.25}
  .hi .tabbar{height:74px}
  .tabbar a.on{color:var(--acc-soft)}
  .tabbar a.on::before{content:''; position:absolute; top:0; width:34px; height:3px;
    border-radius:99px; background:var(--acc); box-shadow:0 0 10px var(--acc)}
  .tabbar a{position:relative}
  .iconbtn{width:44px; height:44px}
  .seg{padding:0}
  .seg b{height:44px; padding:0 14px; border-radius:13px}
  .nact .btn2{height:44px !important}
  .nact{gap:8px}
  .vaultcta span{display:none}
  .vaultcta{width:44px; padding:0; justify-content:center}
}

/* ---- tablet ---- */
@media (max-width: 1080px) and (min-width: 769px){
  .wrap{padding:0 32px}
  .hero-in{grid-template-columns:1fr; gap:44px}
  .stack{height:360px}
  .three,.feats,.arts,.blist,.bandrow{grid-template-columns:1fr 1fr !important}
  .two{grid-template-columns:1fr !important}
  .strip .grid{grid-template-columns:1fr 1fr}
  .flow{grid-template-columns:1fr 1fr; gap:28px 0}
  .frail{display:none}
  .checks{grid-template-columns:1fr}
  .foot .cols{grid-template-columns:1fr 1fr; gap:36px}
  .artgrid{grid-template-columns:1fr}
  .toc{position:static}
  .d1{font-size:48px}
}

/* ---- real-site chrome ---- */
.skip{position:absolute; left:-9999px; top:0; z-index:200; background:var(--card);
  color:var(--tx1); padding:12px 18px; border-radius:0 0 var(--r-row) 0;
  border:1px solid var(--acc)}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--acc); outline-offset:3px; border-radius:6px}
.navtoggle{display:none}
.brand{text-decoration:none; color:inherit}
.nlink,.iconbtn,.seg b,.vaultcta{cursor:pointer}
.nlink{text-decoration:none}
[hidden]{display:none !important}
.langlink{color:inherit; text-decoration:none}
@media (max-width: 768px){
  .navtoggle{display:grid; place-items:center; width:44px; height:44px; border-radius:12px;
    border:1px solid var(--line); background:var(--inset); color:var(--tx2)}
  .nlinks{position:fixed; inset:60px 0 auto 0; flex-direction:column; align-items:stretch;
    gap:0; background:var(--ground); border-bottom:1px solid var(--line); padding:8px 20px 20px;
    display:none; z-index:70}
  .nlinks.open{display:flex}
  .nlinks .nlink{padding:15px 0; border-bottom:1px solid var(--line); font-size:16px;
    min-height:44px; display:flex; align-items:center}
  .nlinks .nlink.on::after{display:none}
  .nlinks .nlink.on{color:var(--acc-soft)}
}
/* the drop zone is a real control on the built site */
.tablescroll{overflow-x:auto; -webkit-overflow-scrolling:touch}
.drawer-extra{display:none}
@media (max-width: 768px){
  /* the wordmark plus a language switch plus two buttons does not fit 390px,
     so language and the Vault CTA move into the drawer */
  .nav .nact > .seg,
  .nav .nact > .vaultcta{display:none}
  .drawer-extra{display:flex; flex-direction:column; gap:14px; padding-top:16px}
  .drawer-extra .seg{align-self:flex-start}
  .drawer-extra .btn2{width:100%; height:52px}
  .drawer-extra .btn2 span{display:inline}
  .brand .wm{font-size:19px}
  /* every multi-column construct collapses; nothing may push the body sideways */
  .scorelayout{grid-template-columns:1fr !important; gap:26px !important;
    justify-items:center; text-align:left}
  .two{grid-template-columns:1fr !important}
  .kv,.checks,.trust3,.bandrow,.three,.feats,.arts,.blist,
  .diffgrid{grid-template-columns:1fr !important}
  .artgrid{grid-template-columns:1fr; gap:24px}
  .toc{position:static}
  .jgrid{grid-template-columns:1fr 1fr; gap:26px 0}
  .jrail{display:none}
  .heat{grid-template-columns:repeat(13,1fr)}
  .vlist .it{grid-template-columns:40px 1fr; gap:12px}
  .vlist .it > .row{grid-column:1 / -1}
  .ring-wrap{width:170px; height:170px}
  .ring-wrap svg{width:170px; height:170px}
  .apphd{padding:32px 0 24px}
  .prose p,.prose ul{font-size:16px}
  .pull{font-size:18px}
  .mx th,.mx td{padding:12px 14px; font-size:13.5px}
  .fverdict{flex-direction:column; gap:12px; text-align:center}
  .feature{grid-template-columns:1fr}
  .feature .cover{min-height:160px}
  .legalbar{flex-direction:column; align-items:flex-start; gap:10px}
  /* chip and action rows must wrap rather than push the page sideways */
  .row{flex-wrap:wrap}
  .card .row{min-width:0}
  .sec-hd{flex-direction:column; align-items:flex-start !important; gap:16px}
  .cats{gap:8px}
  .btn,.btn2{max-width:100%}
  .kv div,.spec{flex-wrap:wrap}
  .spec{grid-template-columns:1fr; gap:8px}
  /* inline multi-column grids inside content sections collapse too */
  .sec .grid{grid-template-columns:1fr !important}
  .strip .grid{grid-template-columns:1fr 1fr !important}
  /* fixed-height inset rows (password field, file row) must grow and wrap */
  .card .inset{height:auto !important; min-height:52px; padding-top:12px;
    padding-bottom:12px; flex-wrap:wrap; row-gap:10px}
  .card .inset > span[style*="letter-spacing"]{min-width:0; overflow-wrap:anywhere}
  .vico{width:78px !important; height:78px !important}
}
.dropzone{cursor:pointer}
.dropzone.dragover{border-color:var(--acc); background:var(--acc-tint-hi)}
.demo-note{margin-top:14px; font-size:12.5px; color:var(--tx3)}