/* ZeroToken UI — clean white, indigo, round, animated (modelled on credit.linux.do) */
:root{
  color-scheme:light;
  --bg:#ffffff; --surface:#ffffff; --surface-2:#f6f6f9; --surface-3:#ececf2;
  --border:#ececf1; --border-strong:#dcdce6;
  --text:#111114; --text-2:#5d5d6b; --muted:#9a9aa8;
  --primary:#5b5ef0; --primary-h:#4a4de0; --on-primary:#fff; --primary-soft:rgba(91,94,240,.1); --primary-soft-2:rgba(91,94,240,.18);
  --ok:#16a34a; --ok-soft:rgba(34,197,94,.14); --warn:#b45309; --warn-soft:rgba(245,158,11,.16);
  --danger:#e11d48; --danger-soft:rgba(244,63,94,.1);
  --code-bg:#15151b; --code-text:#ececf3; --code-muted:#8d8d9c;
  --shadow-sm:0 1px 2px rgba(20,20,40,.04); --shadow:0 12px 34px rgba(40,40,90,.1); --shadow-lg:0 30px 80px rgba(30,30,70,.22);
  --chart:#5b5ef0; --chart-grid:#eeeef3; --chart-axis:#9a9aa8;
  --r-sm:12px; --r:18px; --r-lg:24px; --pill:999px;
  --ease:cubic-bezier(.22,1,.36,1); --spring:cubic-bezier(.34,1.56,.64,1);
  --font:"Inter","Noto Sans SC",ui-sans-serif,system-ui,-apple-system,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Consolas,"Liberation Mono",monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0d0d10; --surface:#141418; --surface-2:#1b1b21; --surface-3:#26262e;
    --border:#25252c; --border-strong:#363640;
    --text:#f3f3f6; --text-2:#b6b6c2; --muted:#82828f;
    --primary:#7b7eff; --primary-h:#9497ff; --on-primary:#0d0d14; --primary-soft:rgba(123,126,255,.14); --primary-soft-2:rgba(123,126,255,.24);
    --ok:#4ade80; --ok-soft:rgba(74,222,128,.14); --warn:#fbbf24; --warn-soft:rgba(251,191,36,.15);
    --danger:#fb7185; --danger-soft:rgba(251,113,133,.14);
    --code-bg:#0a0a0d; --shadow-sm:none; --shadow:0 12px 36px rgba(0,0,0,.5); --shadow-lg:0 30px 80px rgba(0,0,0,.7);
    --chart:#7b7eff; --chart-grid:#222229; --chart-axis:#82828f;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0d0d10; --surface:#141418; --surface-2:#1b1b21; --surface-3:#26262e;
  --border:#25252c; --border-strong:#363640;
  --text:#f3f3f6; --text-2:#b6b6c2; --muted:#82828f;
  --primary:#7b7eff; --primary-h:#9497ff; --on-primary:#0d0d14; --primary-soft:rgba(123,126,255,.14); --primary-soft-2:rgba(123,126,255,.24);
  --ok:#4ade80; --ok-soft:rgba(74,222,128,.14); --warn:#fbbf24; --warn-soft:rgba(251,191,36,.15);
  --danger:#fb7185; --danger-soft:rgba(251,113,133,.14);
  --code-bg:#0a0a0d; --shadow-sm:none; --shadow:0 12px 36px rgba(0,0,0,.5); --shadow-lg:0 30px 80px rgba(0,0,0,.7);
  --chart:#7b7eff; --chart-grid:#222229; --chart-axis:#82828f;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 var(--font);-webkit-font-smoothing:antialiased;transition:background .4s var(--ease),color .3s}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;line-height:1.25;letter-spacing:-.015em}
p{margin:0}
button{font:inherit;color:inherit}
svg.i{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none;transition:transform .3s var(--ease)}
svg.i.sm{width:15px;height:15px}svg.i.lg{width:22px;height:22px}
.muted{color:var(--muted)}.t2{color:var(--text-2)}
.mono{font-family:var(--mono);font-size:12.5px}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:var(--pill)}
::selection{background:var(--primary-soft-2)}

/* ---------- buttons (pills) ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 20px;border-radius:var(--pill);border:1px solid transparent;background:var(--primary);color:var(--on-primary);font-weight:600;cursor:pointer;white-space:nowrap;line-height:1.4;
  transition:transform .25s var(--spring),background .2s,color .2s,box-shadow .3s var(--ease),border-color .2s,opacity .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(91,94,240,.32);background:var(--primary-h)}
.btn:active{transform:translateY(0) scale(.96);box-shadow:none}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.btn:hover svg.i:last-child:not(:first-child){transform:translateX(4px)}
.btn.ghost{background:transparent;color:var(--text);border-color:var(--border-strong)}
.btn.ghost:hover{background:var(--surface-2);box-shadow:none}
.btn.soft{background:var(--surface-2);color:var(--text)}
.btn.soft:hover{background:var(--surface-3);box-shadow:none}
.btn.pri-soft{background:var(--primary-soft);color:var(--primary)}
.btn.pri-soft:hover{background:var(--primary-soft-2);box-shadow:none}
.btn.danger{background:var(--danger-soft);color:var(--danger)}
.btn.danger:hover{background:var(--danger);color:#fff;box-shadow:0 10px 24px rgba(225,29,72,.3)}
.btn.grad{background:linear-gradient(135deg,#5b5ef0,#8b5cf6);color:#fff;box-shadow:0 8px 24px rgba(91,94,240,.38)}
.btn.grad:hover{filter:brightness(1.08);box-shadow:0 14px 32px rgba(91,94,240,.5);background:linear-gradient(135deg,#5b5ef0,#8b5cf6)}
.btn.lg{padding:14px 30px;font-size:15px}
.btn.sm{padding:5px 14px;font-size:12.5px;font-weight:550}
.btn.icon{width:38px;height:38px;padding:0;border-radius:50%}
.btn.icon.sm{width:30px;height:30px}
.btn.block{width:100%}
.btn .spin{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:rot .7s linear infinite}
@keyframes rot{to{transform:rotate(360deg)}}

/* ---------- forms (round) ---------- */
.field{margin-bottom:16px}
.field>label,.lbl{display:block;margin:0 0 6px 8px;font-size:12.5px;font-weight:550;color:var(--text-2)}
.input,.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea,select.input{width:100%;padding:11px 18px;border:1.5px solid var(--border-strong);border-radius:var(--pill);background:var(--surface);color:var(--text);font:inherit;transition:border-color .2s,box-shadow .3s var(--ease),transform .3s var(--ease)}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239a9aa8' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.input:hover,.field input:hover,.field select:hover{border-color:var(--muted)}
.input:focus,.field input:focus,.field select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-soft-2);transform:translateY(-1px)}
.hint{margin:6px 0 0 8px;font-size:12px;color:var(--muted)}
.check{display:flex;align-items:center;gap:9px;cursor:pointer;font-size:13.5px}
.field.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.switch{position:relative;width:46px;height:28px;flex:none;display:inline-block}
.switch input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0;z-index:1}
.switch i{position:absolute;inset:0;background:var(--surface-3);border-radius:var(--pill);transition:background .3s var(--ease)}
.switch i::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);transition:transform .4s var(--spring),width .2s}
.switch:active i::after{width:27px}
.switch input:checked+i{background:var(--primary)}
.switch input:checked+i::after{transform:translateX(18px)}
.switch input:checked:active+i::after{transform:translateX(13px)}
.switch input:focus-visible+i{outline:2px solid var(--primary);outline-offset:3px}
.setrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 4px;border-bottom:1px solid var(--border)}
.setrow:last-child{border-bottom:0}
.setrow b{font-weight:600;font-size:13.5px}.setrow .hint{margin:2px 0 0}

/* ---------- cards ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s;overflow:hidden}
.card.hov:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--border-strong)}
.card.flat{background:var(--surface-2);border-color:transparent;box-shadow:none}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 24px;border-bottom:1px solid var(--border)}
.card-h h3{font-size:15px;font-weight:650}
.card-b{padding:22px 24px}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-a{grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.stat{padding:20px 24px;position:relative;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.stat:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.stat .l{display:flex;align-items:center;gap:8px;color:var(--text-2);font-size:12.5px;font-weight:550}
.stat .l svg{color:var(--muted)}
.stat .n{font-size:28px;font-weight:750;letter-spacing:-.03em;margin-top:8px;line-height:1.15;font-variant-numeric:tabular-nums}
.stat .s{font-size:12px;color:var(--muted);margin-top:6px}
.page-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.page-h h1{font-size:30px;font-weight:760;letter-spacing:-.03em}
.page-h p{color:var(--text-2);margin-top:6px}
.stack>*+*{margin-top:16px}
.row{display:flex;align-items:center;gap:10px}.row.wrap{flex-wrap:wrap}.sp{flex:1}
.sh{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:22px;font-weight:740;letter-spacing:-.025em;padding-bottom:12px;border-bottom:1px solid var(--border);margin:30px 0 18px}
.sh:first-child{margin-top:0}
.sh small{font-size:12.5px;font-weight:500;color:var(--muted);letter-spacing:0}
.callout{padding:30px 32px;border-radius:var(--r-lg);background:var(--surface-2)}
.callout h2{font-size:24px;font-weight:760;margin-bottom:10px}.callout p{color:var(--text-2);max-width:640px}

/* ---------- badges / tabs / chips ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 11px;border-radius:var(--pill);background:var(--surface-2);color:var(--text-2);font-size:12px;font-weight:550;white-space:nowrap}
.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.bad{background:var(--danger-soft);color:var(--danger)}
.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.pri{background:var(--primary-soft);color:var(--primary)}
.badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.badge.ok .dot{animation:pulse 2s ease infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 currentColor}70%{box-shadow:0 0 0 6px transparent}100%{box-shadow:0 0 0 0 transparent}}
.tabs{position:relative;display:inline-flex;gap:2px;padding:4px;background:var(--surface-2);border-radius:var(--pill)}
.tabs button{position:relative;z-index:1;border:0;background:transparent;padding:6px 16px;border-radius:var(--pill);color:var(--text-2);cursor:pointer;font-weight:550;font-size:13px;transition:color .25s}
.tabs button.on{color:var(--text)}
.tabs .ind{position:absolute;top:4px;bottom:4px;left:0;border-radius:var(--pill);background:var(--surface);box-shadow:0 2px 8px rgba(0,0,0,.12);transition:transform .4s var(--ease),width .4s var(--ease);pointer-events:none}
/* underline tabs, as on credit.linux.do */
.utabs{position:relative;display:flex;gap:6px;border-bottom:1px solid var(--border);margin-bottom:20px;overflow-x:auto;scrollbar-width:none}
.utabs button{position:relative;border:0;background:transparent;padding:10px 12px;color:var(--text-2);cursor:pointer;font-weight:600;font-size:14px;white-space:nowrap;transition:color .25s}
.utabs button:hover{color:var(--text)}
.utabs button.on{color:var(--primary)}
.utabs .ind{position:absolute;left:0;bottom:-1px;height:2.5px;border-radius:var(--pill);background:var(--primary);transition:transform .4s var(--ease),width .35s var(--ease);pointer-events:none}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1.5px solid var(--border-strong);background:var(--surface);padding:5px 16px;border-radius:var(--pill);cursor:pointer;font-size:12.5px;color:var(--text-2);transition:all .3s var(--spring)}
.chip:hover{transform:translateY(-2px);border-color:var(--muted)}
.chip.on{background:var(--primary);border-color:var(--primary);color:var(--on-primary);font-weight:600}

/* ---------- table ---------- */
.tw{overflow-x:auto}
table.t{width:100%;border-collapse:collapse}
.t th{padding:12px 20px;text-align:left;font-size:12px;font-weight:600;color:var(--muted);background:var(--surface-2);white-space:nowrap}
.t td{padding:14px 20px;border-bottom:1px solid var(--border);vertical-align:middle}
.t tr:last-child td{border-bottom:0}
.t tbody tr{transition:background .2s}
.t tbody tr:hover{background:var(--surface-2)}
.t .num{text-align:right;font-variant-numeric:tabular-nums}.t .act{text-align:right;white-space:nowrap}
.t td.sub{color:var(--text-2)}
.pager{display:flex;align-items:center;justify-content:center;gap:14px;padding:16px;border-top:1px solid var(--border);color:var(--muted);font-size:13px}
.copyable{cursor:pointer;border-radius:var(--pill);padding:3px 10px;margin:-3px -10px;transition:background .2s,color .2s}
.copyable:hover{background:var(--primary-soft);color:var(--primary)}

/* ---------- empty / skeleton ---------- */
.empty{display:flex;flex-direction:column;align-items:center;gap:12px;padding:56px 20px;color:var(--muted);text-align:center}
.empty .ico{width:64px;height:64px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;color:var(--muted);animation:bob 3.6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.empty b{color:var(--text);font-size:16px}
.dashed{border:1.5px dashed var(--border-strong);border-radius:var(--r-lg)}
.skel{border-radius:var(--r);background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 37%,var(--surface-2) 63%);background-size:400% 100%;animation:sk 1.4s ease infinite}
@keyframes sk{0%{background-position:100% 50%}100%{background-position:0 50%}}

/* ---------- code ---------- */
.code{background:var(--code-bg);color:var(--code-text);border-radius:var(--r-lg);overflow:hidden}
.code-h{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 16px;border-bottom:1px solid rgba(255,255,255,.07);color:var(--code-muted);font-size:12px}
.code .tabs{background:rgba(255,255,255,.07)}.code .tabs button{color:#b9b9c4}.code .tabs button.on{color:#fff}.code .tabs .ind{background:rgba(255,255,255,.16);box-shadow:none}
.code pre{margin:0;padding:20px 22px;overflow-x:auto;font:12.5px/1.75 var(--mono);color:var(--code-text)}
.code .btn.ghost{color:var(--code-text);border-color:rgba(255,255,255,.18)}.code .btn.ghost:hover{background:rgba(255,255,255,.1)}
.kv{display:flex;align-items:center;gap:10px;background:var(--surface-2);border-radius:var(--pill);padding:6px 6px 6px 18px}
.kv code{flex:1;font:13px var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- modal / toast / menu ---------- */
dialog{border:0;border-radius:var(--r-lg);background:var(--surface);color:var(--text);padding:0;width:min(480px,calc(100vw - 28px));max-height:90vh;box-shadow:var(--shadow-lg);overflow:hidden}
dialog.wide{width:min(640px,calc(100vw - 28px))}
dialog::backdrop{background:rgba(14,14,30,.45);backdrop-filter:blur(6px);animation:fade .25s ease}
dialog[open]{animation:dpop .45s var(--spring)}
dialog.closing{animation:dout .18s ease forwards}dialog.closing::backdrop{animation:fadeout .18s ease forwards}
@keyframes dpop{from{opacity:0;transform:translateY(26px) scale(.92)}to{opacity:1;transform:none}}
@keyframes dout{to{opacity:0;transform:translateY(14px) scale(.96)}}
@keyframes fade{from{opacity:0}}@keyframes fadeout{to{opacity:0}}
.dlg-h{display:flex;align-items:center;justify-content:space-between;padding:22px 26px 6px}
.dlg-h h3{font-size:18px}
.dlg-b{padding:12px 26px 4px;overflow:auto;max-height:calc(90vh - 160px)}
.dlg-f{display:flex;justify-content:flex-end;gap:10px;padding:18px 26px 24px}
#toast{position:fixed;top:18px;right:18px;z-index:999;display:flex;flex-direction:column;gap:12px;align-items:flex-end;pointer-events:none;width:min(360px,calc(100vw - 28px))}
.toast{position:relative;display:flex;align-items:flex-start;gap:14px;width:100%;padding:16px 16px 18px 16px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow-lg);pointer-events:auto;overflow:hidden;animation:tin .6s var(--spring)}
.toast .ti{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--primary-soft);color:var(--primary);animation:tpop .7s .15s var(--spring) both}
.toast.ok .ti{background:var(--ok-soft);color:var(--ok)}.toast.err .ti{background:var(--danger-soft);color:var(--danger)}
.toast .tb{flex:1;min-width:0;padding-top:1px}
.toast .tb b{display:block;font-size:14px;line-height:1.3}
.toast .tb span{display:block;margin-top:2px;font-size:12.5px;color:var(--text-2);word-break:break-all;line-height:1.45}
.toast .tx{border:0;background:transparent;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--muted);flex:none;padding:0;transition:background .2s,transform .3s var(--spring)}
.toast .tx:hover{background:var(--surface-2);color:var(--text);transform:rotate(90deg)}
.toast .tp{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--primary);transform-origin:left;animation:tbar var(--dur,3.6s) linear forwards}
.toast.ok .tp{background:var(--ok)}.toast.err .tp{background:var(--danger)}
.toast:hover .tp{animation-play-state:paused}
.toast.out{animation:tout .36s cubic-bezier(.5,0,.75,0) forwards}
@keyframes tin{from{opacity:0;transform:translateX(70px) scale(.9)}}
@keyframes tout{to{opacity:0;transform:translateX(90px) scale(.92)}}
@keyframes tpop{from{transform:scale(0) rotate(-90deg)}}
@keyframes tbar{to{transform:scaleX(0)}}
.alert{display:flex;gap:12px;padding:14px 20px;border-radius:var(--r);background:var(--warn-soft);font-size:13px;align-items:flex-start}
.alert svg{color:var(--warn);margin-top:2px}
.menu{position:absolute;z-index:80;min-width:210px;padding:8px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow-lg);transform-origin:top left;animation:mpop .3s var(--spring)}
.menu.out{animation:mout .15s ease forwards}
@keyframes mpop{from{opacity:0;transform:translateY(-8px) scale(.92)}}@keyframes mout{to{opacity:0;transform:translateY(-6px) scale(.95)}}
.menu button{display:flex;align-items:center;gap:11px;width:100%;padding:9px 14px;border:0;background:transparent;border-radius:var(--pill);cursor:pointer;color:var(--text);text-align:left;transition:background .15s,transform .2s var(--ease)}
.menu button:hover{background:var(--surface-2);transform:translateX(3px)}
.menu hr{border:0;border-top:1px solid var(--border);margin:6px 4px}
.menu .mh{padding:8px 14px 6px;font-size:12px;color:var(--muted)}
.cmd{display:flex;flex-direction:column;gap:4px;max-height:50vh;overflow:auto;padding-bottom:12px}
.cmd button{display:flex;align-items:center;gap:12px;padding:10px 16px;border:0;background:transparent;border-radius:var(--pill);cursor:pointer;color:var(--text);text-align:left;font-weight:550;transition:background .15s}
.cmd button:hover,.cmd button.sel{background:var(--primary-soft);color:var(--primary)}
.cmd .grp{padding:10px 16px 4px;font-size:11px;font-weight:650;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
kbd{font:600 11px var(--mono);padding:2px 8px;border-radius:var(--pill);background:var(--surface-3);color:var(--text-2)}

/* ---------- captcha ---------- */
.cap{display:flex;gap:10px;align-items:center}
.cap .cin{flex:1;letter-spacing:.25em;text-transform:uppercase;font-family:var(--mono)}
.cap .img{flex:none;width:160px;height:56px;border-radius:var(--pill);overflow:hidden;cursor:pointer;background:#f3f4f6;transition:transform .3s var(--spring)}
.cap .img:hover{transform:scale(1.04)}.cap .img:active{transform:rotate(-2deg) scale(.97)}
.cap .img svg{display:block}

/* ---------- chart / progress ---------- */
.chart{position:relative;width:100%}
.chart svg{display:block;overflow:visible}
.chart .grid-l{stroke:var(--chart-grid);stroke-width:1}
.chart .ax{fill:var(--chart-axis);font-size:11px;font-family:var(--font)}
.chart .bar{fill:var(--chart);transition:opacity .2s;transform-box:fill-box;transform-origin:50% 100%}
.chart .bar.grow{animation:grow .8s var(--ease) both}
.chart .bar.dim{opacity:.35}
@keyframes grow{from{transform:scaleY(0)}}
.chart .lbl-v{fill:var(--text);font-size:11.5px;font-weight:650;animation:fade .8s .5s both}
.chart-tip{position:absolute;pointer-events:none;background:var(--text);color:var(--bg);border-radius:14px;padding:9px 14px;box-shadow:var(--shadow);font-size:12.5px;opacity:0;transform:translate(-50%,calc(-100% + 6px)) scale(.94);transition:opacity .15s,transform .3s var(--spring),left .2s var(--ease);white-space:nowrap;z-index:3}
.chart-tip.show{opacity:1;transform:translate(-50%,-100%) scale(1)}
.chart-tip b{display:block;margin-bottom:2px}
.pb{display:grid;grid-template-columns:1fr auto;gap:2px 10px;margin-bottom:12px;font-size:12px}
.pb .bar{grid-column:1/-1;height:8px;border-radius:var(--pill);background:var(--surface-3);overflow:hidden}
.pb .bar i{display:block;height:100%;border-radius:var(--pill);background:#22c55e;transform-origin:left;animation:fillx 1s var(--ease) both}
.pb.pr .bar i{background:var(--primary)}
.pb em{font-style:normal;font-weight:650;font-variant-numeric:tabular-nums}
@keyframes fillx{from{transform:scaleX(0)}}
.ov-i{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-radius:var(--r-sm);background:var(--surface-2);margin-bottom:8px;transition:transform .3s var(--ease),background .2s}
.ov-i:hover{transform:translateX(4px);background:var(--surface-3)}
.ov-i b{display:block;font-size:13px}.ov-i small{color:var(--muted);font-size:11px}
.kvl>div{padding:14px 0;border-bottom:1px solid var(--border)}
.kvl>div:last-child{border:0}
.kvl .k{display:flex;align-items:center;gap:6px;color:var(--text-2);font-size:13px}
.kvl .v{font-size:26px;font-weight:760;letter-spacing:-.02em;margin-top:4px;font-variant-numeric:tabular-nums}

/* ---------- app shell ---------- */
.shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh;transition:grid-template-columns .45s var(--ease)}
.shell.collapsed{grid-template-columns:76px minmax(0,1fr)}
.side{position:sticky;top:0;height:100vh;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:14px 12px;z-index:40}
.cbtn{position:absolute;right:-14px;top:50%;width:28px;height:28px;border-radius:50%;background:var(--surface);border:1px solid var(--border-strong);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .4s var(--spring),background .2s;z-index:5;padding:0}
.cbtn:hover{background:var(--surface-2);transform:scale(1.15)}
.shell.collapsed .cbtn svg{transform:rotate(180deg)}
.usw{position:relative;display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:var(--pill);cursor:pointer;border:0;background:transparent;width:100%;text-align:left;transition:background .2s}
.usw:hover{background:var(--surface-2)}
.usw .me-t{min-width:0;flex:1;transition:opacity .25s,width .3s}
.me-t b{display:block;font-size:13.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.me-t span{font-size:11.5px;color:var(--muted)}
.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#5b5ef0,#8b5cf6);color:#fff;display:grid;place-items:center;font-weight:750;font-size:14px;flex:none;text-transform:uppercase}
.nav{position:relative;display:flex;flex-direction:column;gap:3px;overflow-y:auto;overflow-x:hidden;flex:1;margin-top:4px;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav-sec{padding:18px 16px 6px;font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap;transition:opacity .25s}
.nav a{position:relative;z-index:1;display:flex;align-items:center;gap:13px;padding:10px 16px;border-radius:var(--pill);color:var(--text-2);font-weight:550;white-space:nowrap;transition:color .25s,transform .3s var(--ease)}
.nav a span{transition:opacity .25s}
.nav a:hover{color:var(--text);transform:translateX(3px)}
.nav a:hover svg.i{transform:scale(1.15) rotate(-6deg)}
.nav a.on{color:var(--primary);font-weight:650}
.nav .ind{position:absolute;left:0;right:0;top:0;height:42px;border-radius:var(--pill);background:var(--primary-soft);z-index:0;transition:transform .42s var(--ease),height .3s var(--ease);pointer-events:none}
.side-f{margin:10px -12px -14px;padding:10px 12px 14px;border-top:1px solid var(--border)}
.usw.b{padding:8px 8px 8px 10px}
.usw .nm{display:flex;align-items:center;gap:7px;min-width:0}
.usw .nm b{min-width:0}
.balchip{display:inline-flex;align-items:center;gap:4px;padding:1px 8px;border-radius:var(--pill);background:var(--warn-soft);color:var(--warn);font-size:11.5px;font-weight:650;white-space:nowrap;font-variant-numeric:tabular-nums;flex:none}
.balchip svg{width:12px;height:12px}
.balchip.bump{animation:bump .6s var(--spring)}
@keyframes bump{40%{transform:scale(1.25)}}
.shell.collapsed .usw.b .me-t,.shell.collapsed .usw.b .chev,.shell.collapsed .me-t,.shell.collapsed .nav a span,.shell.collapsed .nav-sec,.shell.collapsed .side-f,.shell.collapsed .usw .chev{opacity:0;pointer-events:none}
.shell.collapsed .nav a{padding-left:21px}
.main{min-width:0;display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:8px;padding:12px 28px;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(14px)}
.search{display:flex;align-items:center;gap:10px;width:min(280px,42vw);padding:8px 14px 8px 16px;border-radius:var(--pill);background:var(--surface-2);border:1px solid var(--border);color:var(--muted);cursor:pointer;transition:all .3s var(--ease);text-align:left}
.search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:var(--shadow-sm);width:min(320px,46vw)}
.search span{flex:1}
.tbtn{width:38px;height:38px;border-radius:50%;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--text-2);transition:background .2s,transform .4s var(--spring),color .2s;padding:0}
.tbtn:hover{background:var(--surface-2);color:var(--text);transform:rotate(14deg) scale(1.08)}
.tbtn.plus{background:var(--primary);color:var(--on-primary);box-shadow:0 6px 16px rgba(91,94,240,.4)}
.tbtn.plus:hover{background:var(--primary-h);color:#fff;transform:rotate(90deg) scale(1.1)}
#menubtn{display:none}
.content{padding:14px 36px 70px;max-width:1240px;width:100%;margin:0 auto}
.scrim{display:none}

/* page enter: container fades up, children stagger in */
.enter{animation:vin .5s var(--ease) both}
.enter>*{animation:vin .65s var(--ease) both}
.enter>*:nth-child(2){animation-delay:.06s}.enter>*:nth-child(3){animation-delay:.12s}.enter>*:nth-child(4){animation-delay:.18s}
.enter>*:nth-child(5){animation-delay:.24s}.enter>*:nth-child(6){animation-delay:.3s}.enter>*:nth-child(n+7){animation-delay:.36s}
.enter .grid>*{animation:vin .65s var(--ease) both}
.enter .grid>*:nth-child(2){animation-delay:.1s}.enter .grid>*:nth-child(3){animation-delay:.18s}.enter .grid>*:nth-child(4){animation-delay:.26s}.enter .grid>*:nth-child(5){animation-delay:.34s}
@keyframes vin{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.rv{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}

/* ---------- home ---------- */
.home-g{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}
.ckcard{position:relative;margin-top:10px;padding:22px 24px;border-radius:var(--r-lg);color:#fff;overflow:hidden;isolation:isolate;background:linear-gradient(135deg,#5b5ef0,#8b5cf6)}
.ckcard::before,.ckcard::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.14);z-index:-1}
.ckcard::before{width:140px;height:140px;right:-40px;top:-50px;animation:drift 9s ease-in-out infinite}
.ckcard::after{width:90px;height:90px;right:60px;bottom:-40px;animation:drift 12s ease-in-out infinite reverse}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-14px,10px) scale(1.1)}}
.ckcard .btn{background:#fff;color:#4a4de0}.ckcard .btn:hover{background:#f3f3ff;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.ckcard small{color:rgba(255,255,255,.8)}
.ov{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ov .card{background:var(--surface-2);border-color:transparent;box-shadow:none}
.ov .card .card-b{background:var(--surface);margin:10px;border-radius:var(--r);padding:16px 18px}
.ov .card-t{padding:14px 20px 0;font-weight:650}
.ov .card-f{display:flex;justify-content:space-between;padding:10px 22px 14px;font-size:12px;color:var(--muted)}
.ov .card-f a{color:var(--primary);font-weight:600}

/* ---------- landing ---------- */
.lnav{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(14px);animation:ndrop .8s var(--ease) both}
@keyframes ndrop{from{opacity:0;transform:translateY(-30px)}}
.lnav .in{max-width:1180px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:4px}
.brand{display:flex;align-items:center;gap:11px;font-weight:780;font-size:18px;letter-spacing:-.03em}
.lnav .brand{margin-right:18px}
.logo{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#5b5ef0,#8b5cf6);display:grid;place-items:center;flex:none;transition:transform .6s var(--spring);box-shadow:0 6px 16px rgba(91,94,240,.35)}
.brand:hover .logo{transform:rotate(-18deg) scale(1.1)}
.logo svg{width:17px;height:17px;stroke:none;fill:#fff}
.lnav .lk{padding:8px 16px;color:var(--text-2);font-weight:550;border-radius:var(--pill);cursor:pointer;transition:background .2s,color .2s}
.lnav .lk:hover{background:var(--surface-2);color:var(--text)}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.hero{position:relative;padding:70px 0 50px;overflow:hidden}
.glow{position:absolute;border-radius:50%;pointer-events:none;z-index:0;filter:blur(60px)}
.glow.g1{width:520px;height:520px;background:radial-gradient(closest-side,rgba(91,126,255,.35),transparent);right:2%;top:40px;animation:float1 14s ease-in-out infinite}
.glow.g2{width:420px;height:420px;background:radial-gradient(closest-side,rgba(168,120,255,.28),transparent);right:22%;top:-40px;animation:float2 17s ease-in-out infinite}
.glow.g3{width:360px;height:360px;background:radial-gradient(closest-side,rgba(91,94,240,.18),transparent);left:-80px;bottom:-60px;animation:float1 12s ease-in-out infinite reverse}
@keyframes float1{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,34px)}}
@keyframes float2{0%,100%{transform:translate(0,0)}50%{transform:translate(-36px,28px)}}
.hero-g{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:30px;align-items:center;min-height:460px}
.hero h1{font-size:clamp(38px,5.4vw,64px);font-weight:820;letter-spacing:-.04em;line-height:1.1}
.hero h1 .l2{display:block;color:var(--primary)}
.hero p.lead{font-size:clamp(15px,1.7vw,17px);color:var(--text-2);max-width:520px;margin-top:22px}
.hero .cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}
.hero .feats{display:flex;gap:26px;margin-top:40px;padding-top:26px;border-top:1px solid var(--border);flex-wrap:wrap;max-width:600px}
.hero .feats span{display:inline-flex;align-items:center;gap:8px;color:var(--text-2);font-size:13.5px}
.hero .feats svg{width:20px;height:20px}
.fcard{position:relative;height:420px}
.fc-main{position:absolute;left:6%;top:70px;width:84%;padding:24px 26px;border-radius:30px;background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(245,240,255,.9));border:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow-lg);animation:bob 6.5s ease-in-out infinite;color:#111114}
:root[data-theme="dark"] .fc-main{background:linear-gradient(135deg,rgba(40,40,60,.95),rgba(30,30,48,.9));border-color:rgba(255,255,255,.08);color:#f3f3f6}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .fc-main{background:linear-gradient(135deg,rgba(40,40,60,.95),rgba(30,30,48,.9));border-color:rgba(255,255,255,.08);color:#f3f3f6}}
.fc-main .tt{display:flex;align-items:center;gap:10px;font-weight:600}
.fc-main .bal{margin-top:74px;display:flex;align-items:flex-end;justify-content:space-between}
.fc-main small{color:#8a8a98;display:block}
.fc-main .amt{font-size:32px;font-weight:780;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.fc-main .dot{width:34px;height:34px;border-radius:50%;background:var(--primary);box-shadow:0 6px 16px rgba(91,94,240,.5)}
.fc-inc{position:absolute;right:0;top:10px;display:flex;align-items:center;gap:12px;padding:12px 18px;border-radius:22px;background:var(--surface);box-shadow:var(--shadow);animation:bob 5s -1.5s ease-in-out infinite;z-index:2}
.fc-inc .ic{width:40px;height:40px;border-radius:50%;background:var(--ok-soft);color:var(--ok);display:grid;place-items:center}
.fc-inc small{display:block;color:var(--muted);font-size:11.5px}.fc-inc b{font-size:14px}
.fc-sm{position:absolute;left:0;bottom:30px;display:flex;align-items:center;gap:10px;padding:10px 18px;border-radius:var(--pill);background:var(--surface);box-shadow:var(--shadow);animation:bob 6s -3s ease-in-out infinite;font-weight:600;font-size:13px;z-index:2}
.fc-sm i{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px var(--ok-soft)}
.sec{padding:64px 0}
.sec-h{text-align:center;margin-bottom:40px}
.sec-h h2{font-size:clamp(26px,3.4vw,38px);font-weight:800;letter-spacing:-.035em}
.sec-h p{color:var(--text-2);margin-top:12px}
.feat{padding:28px;background:var(--surface-2);border-color:transparent;box-shadow:none}
.feat .fi{width:52px;height:52px;border-radius:50%;background:var(--surface);color:var(--primary);display:grid;place-items:center;margin-bottom:18px;transition:transform .5s var(--spring),background .3s,color .3s}
.feat:hover .fi{transform:rotate(-12deg) scale(1.12);background:var(--primary);color:#fff}
.feat h3{font-size:16.5px;margin-bottom:8px}.feat p{color:var(--text-2);font-size:13.5px}
.steps{counter-reset:s}
.step{padding:28px}
.step::before{counter-increment:s;content:counter(s);width:38px;height:38px;border-radius:50%;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center;font-weight:750;margin-bottom:16px;transition:transform .5s var(--spring),background .3s,color .3s}
.step:hover::before{transform:scale(1.2) rotate(8deg);background:var(--primary);color:#fff}
.step h3{font-size:16.5px;margin-bottom:6px}.step p{color:var(--text-2);font-size:13.5px}
.foot{padding:30px 0 40px;color:var(--muted);font-size:13px;border-top:1px solid var(--border)}
.foot a:hover{color:var(--text)}

/* ---------- auth ---------- */
.auth{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:100vh}
.auth-art{position:relative;background:linear-gradient(145deg,#4f52e8,#7c5cf3);color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;isolation:isolate}
.auth-art .c{position:absolute;border-radius:50%;z-index:-1;background:rgba(255,255,255,.12)}
.auth-art .c1{width:380px;height:380px;right:-120px;top:-100px;animation:float1 12s ease-in-out infinite}
.auth-art .c2{width:240px;height:240px;left:-70px;bottom:90px;background:rgba(255,255,255,.09);animation:float2 15s ease-in-out infinite}
.auth-art .c3{width:110px;height:110px;right:90px;bottom:-30px;background:rgba(255,255,255,.2);animation:float1 9s ease-in-out infinite reverse}
.auth-art .brand{color:#fff}.auth-art .logo{background:rgba(255,255,255,.2);box-shadow:none}
.auth-art h2{font-size:clamp(30px,3.4vw,42px);line-height:1.15;font-weight:800;letter-spacing:-.04em;max-width:440px}
.auth-art ul{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:12px}
.auth-art li{display:flex;gap:12px;align-items:center;color:#fff;background:rgba(255,255,255,.14);padding:11px 18px;border-radius:var(--pill);backdrop-filter:blur(4px);max-width:420px;animation:vin .8s var(--ease) both}
.auth-art li:nth-child(2){animation-delay:.12s}.auth-art li:nth-child(3){animation-delay:.24s}
.auth-art small{color:rgba(255,255,255,.65)}
.auth-form{display:grid;place-items:center;padding:28px 20px}
.auth-card{width:100%;max-width:400px;animation:vin .7s .1s var(--ease) both}
.auth-card h1{font-size:30px;font-weight:800;letter-spacing:-.035em}
.auth-card .sub{color:var(--text-2);margin:8px 0 26px}
.auth-card .alt{margin-top:20px;text-align:center;color:var(--text-2)}
.auth-card .alt a{font-weight:650;color:var(--primary)}
.backlink{display:inline-flex;align-items:center;gap:6px;color:var(--muted);margin-bottom:26px;font-size:13px;padding:6px 14px 6px 10px;border-radius:var(--pill);transition:background .2s,color .2s}
.backlink:hover{background:var(--surface-2);color:var(--text)}.backlink:hover svg{transform:translateX(-3px)}

/* ---------- misc ---------- */
.set-nav{position:sticky;top:80px;display:flex;flex-direction:column;gap:3px}
.set-nav a{padding:9px 16px;border-radius:var(--pill);color:var(--text-2);font-weight:550;transition:all .25s var(--ease)}
.set-nav a:hover{background:var(--surface-2);color:var(--text);transform:translateX(4px)}
.set-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:28px;align-items:start}
.savebar{position:sticky;bottom:18px;display:flex;gap:10px;justify-content:flex-end;align-items:center;padding:10px 12px 10px 24px;background:color-mix(in srgb,var(--surface) 90%,transparent);backdrop-filter:blur(14px);border:1px solid var(--border-strong);border-radius:var(--pill);box-shadow:var(--shadow);margin-top:20px}
.route-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) 70px 60px auto auto;gap:12px;align-items:center;padding:12px 24px;border-top:1px solid var(--border);transition:background .2s}
.route-row:not(.route-h):hover{background:var(--surface-2)}
.route-h{color:var(--muted);font-size:12px;font-weight:600;background:var(--surface-2)}
.confetti{position:fixed;width:10px;height:10px;border-radius:50%;pointer-events:none;z-index:1000}

/* ---------- responsive ---------- */
@media (max-width:1100px){.home-g{grid-template-columns:minmax(0,1fr)}.ov{grid-template-columns:minmax(0,1fr)}}
@media (max-width:1000px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-g{grid-template-columns:minmax(0,1fr)}.fcard{max-width:480px;margin:0 auto;width:100%}}
@media (max-width:860px){
  .shell,.shell.collapsed{grid-template-columns:minmax(0,1fr)}
  .side{position:fixed;left:0;top:0;width:280px;transform:translateX(-104%);transition:transform .45s var(--ease);box-shadow:var(--shadow-lg);z-index:60}
  .side.open{transform:none}.cbtn{display:none}
  .shell.collapsed .usw.b .me-t,.shell.collapsed .usw.b .chev,.shell.collapsed .me-t,.shell.collapsed .nav a span,.shell.collapsed .nav-sec,.shell.collapsed .side-f{opacity:1;pointer-events:auto}
  .scrim{display:block;position:fixed;inset:0;background:rgba(14,14,30,.5);z-index:50;opacity:0;pointer-events:none;transition:opacity .3s;backdrop-filter:blur(3px)}
  .scrim.show{opacity:1;pointer-events:auto}
  #menubtn{display:grid}.top{padding:10px 14px}.content{padding:10px 16px 48px}
  .auth{grid-template-columns:minmax(0,1fr)}.auth-art{display:none}
  .set-layout{grid-template-columns:minmax(0,1fr)}.set-nav{position:static;flex-direction:row;overflow-x:auto}
  .lnav .lk.hide-m{display:none}
}
@media (max-width:620px){
  #toast{right:50%;transform:translateX(50%);align-items:center}
  .g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}
  .hero{padding:30px 0 20px}.fcard{display:none}.hero-g{min-height:0}
  .field.row2{grid-template-columns:1fr}
  .route-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:6px;padding:12px 18px}.route-h{display:none}
  .cap .img{width:128px}.page-h h1{font-size:25px}
  .t th,.t td{padding:12px 14px}.card-h,.card-b{padding-left:18px;padding-right:18px}
  .search{width:auto;flex:1}.search:hover{width:auto}.balp{display:none}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.rv{opacity:1;transform:none}}

/* ---------- extra motion ---------- */
.btn{overflow:hidden}
.ripple{position:absolute;border-radius:50%;background:currentColor;opacity:.22;transform:scale(0);animation:rip .65s ease-out forwards;pointer-events:none}
@keyframes rip{to{transform:scale(1);opacity:0}}
.enter .t tbody tr{animation:vin .5s var(--ease) both}
.enter .t tbody tr:nth-child(1){animation-delay:.12s}.enter .t tbody tr:nth-child(2){animation-delay:.17s}.enter .t tbody tr:nth-child(3){animation-delay:.22s}
.enter .t tbody tr:nth-child(4){animation-delay:.27s}.enter .t tbody tr:nth-child(5){animation-delay:.32s}.enter .t tbody tr:nth-child(6){animation-delay:.37s}
.enter .t tbody tr:nth-child(n+7){animation-delay:.42s}
dialog[open] .field,dialog[open] .setrow,dialog[open] .alert,dialog[open] .kv{animation:vin .5s var(--ease) both}
dialog[open] .field:nth-child(1){animation-delay:.08s}dialog[open] .field:nth-child(2){animation-delay:.14s}dialog[open] .field:nth-child(3){animation-delay:.2s}
dialog[open] .field:nth-child(4){animation-delay:.26s}dialog[open] .field:nth-child(n+5){animation-delay:.32s}
.nav a{animation:slidein .6s var(--ease) both}
.nav a:nth-of-type(2){animation-delay:.05s}.nav a:nth-of-type(3){animation-delay:.1s}.nav a:nth-of-type(4){animation-delay:.15s}.nav a:nth-of-type(5){animation-delay:.2s}.nav a:nth-of-type(n+6){animation-delay:.25s}
@keyframes slidein{from{opacity:0;transform:translateX(-14px)}}
.avatar{transition:transform .5s var(--spring)}.usw:hover .avatar{transform:rotate(-8deg) scale(1.1)}
.ov-i,.pb{animation:vin .6s var(--ease) both}
.stat .n,.kvl .v{transition:color .3s}
.card .card-h .badge{transition:transform .3s var(--spring)}.card:hover .card-h .badge{transform:scale(1.08)}
.page-h h1{animation:vin .7s var(--ease) both}
.code{transition:box-shadow .4s var(--ease)}.code:hover{box-shadow:var(--shadow)}
.chart-tip b{animation:fade .2s}

/* ---------- fixes from visual review ---------- */
.row.wrap{flex-wrap:wrap;margin:0;max-width:none;padding:0}   /* helper class must not inherit the landing .wrap container */
.balchip i{font-style:normal}
.cap .img{border-radius:18px}
.hero .feats span:nth-child(1) svg{color:#f59e0b}.hero .feats span:nth-child(2) svg{color:#3b82f6}.hero .feats span:nth-child(3) svg{color:#22c55e}
.search span{white-space:nowrap}
@media (max-width:860px){.side{box-shadow:none}.side.open{box-shadow:var(--shadow-lg)}}
@media (max-width:620px){.search kbd{display:none}}