/* Saints design system, loaded after each page's own styles.

   Two brand colours: Ink (#111218) for text and primary actions, Violet (#6A5AE0) for selection, focus and
   "this is live / this is yours". Everything else is neutral. Green/red appear only for gains and losses,
   amber only as a warning.

   Principles borrowed from Linear, Stripe, Raycast, Robinhood and Phantom:
   - hierarchy comes from size and weight, not colour
   - content sits on solid white cards on a soft grey canvas; only floating chrome (top bar, drawer,
     menus, toasts) is translucent glass
   - hairline borders and layered low-opacity shadows give depth without looking heavy
   - one primary (ink) button per area; everything else is quiet
   - numbers use tabular figures in the UI font, never a "code" font */

:root{
  --ink:#111218;
  --ink2:#50525C;
  --ink3:#7A7C86;
  --violet:#6A5AE0;
  --violet2:#7B6CE6;
  --pearl:#F5F5F7;
  --line:rgba(17,18,24,.07);
  --up:#13925C;
  --down:#D63B4B;
  --gold:#A86E0A;
  --ice:#E6E6EC;--lilac:#DCD7FA;--rose:#ECEAF2;--peach:#EFEDF2;--champ:#F1EEE6;--mint:#E3F1EA;
  --mono:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;   /* numbers in the UI font, tabular */
  --e1:0 0 0 1px rgba(17,18,24,.06),0 1px 2px rgba(17,18,24,.04),0 6px 16px -8px rgba(17,18,24,.08);
  --e2:0 0 0 1px rgba(17,18,24,.06),0 2px 4px rgba(17,18,24,.04),0 18px 40px -18px rgba(17,18,24,.22);
  --e3:0 0 0 1px rgba(17,18,24,.07),0 4px 10px rgba(17,18,24,.05),0 30px 70px -24px rgba(17,18,24,.35);
}
html{background:var(--pearl)}
body{
  background:linear-gradient(180deg,#F8F8FA 0,var(--pearl) 340px) fixed;
  font-feature-settings:"cv11","ss03";
  font-variant-numeric:tabular-nums;
  letter-spacing:-.003em;
}
.bg{display:none}

/* surfaces: solid cards on the canvas */
.glass{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:var(--e1)}
.card,.lane,.panel{border-radius:20px}

/* floating chrome stays glass so content reads underneath it */
.bar.glass,.mbar.glass,.mnav.glass,.toast.glass{background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);box-shadow:var(--e2)}
.bar{border-radius:18px!important}
.drawer.glass{background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);box-shadow:var(--e3);border-radius:22px}
.pop.glass.on{background:rgba(255,255,255,.92);box-shadow:var(--e3)}
.pop{border-radius:16px}

/* type: confident headings, quiet labels */
h1,h2,h3{color:var(--ink);letter-spacing:-.022em}
h5,.cell small,.kpi small,.stats small,th{color:var(--ink3)!important;letter-spacing:.06em}

/* buttons: ink is the one primary; secondary is a quiet hairline */
.btn.holo::before{content:none!important;animation:none!important}
.btn.holo::after,.btn.ink{background:var(--ink)!important}
.btn.holo,.btn.ink{color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.1) inset,0 1px 2px rgba(17,18,24,.2),0 8px 18px -10px rgba(17,18,24,.55)!important}
.btn.holo:hover::after,.btn.ink:hover{background:#24252E!important}
.btn.soft{background:#fff;box-shadow:0 0 0 1px rgba(17,18,24,.1),0 1px 2px rgba(17,18,24,.05)}
.btn.soft:hover{background:#F7F7F9}

/* neutral chips; colour only when it means something */
.chip{background:#F1F1F4;color:var(--ink2)}
.chip.vio{background:rgba(106,90,224,.09);color:var(--violet)}

/* segmented controls and tabs */
.seg,.tabs,.bs,.lane-switch{background:#EFEFF2!important}
.tabs a.on,.ind{background:#fff!important;box-shadow:0 0 0 1px rgba(17,18,24,.06),0 1px 3px rgba(17,18,24,.1)!important}
.ind.line{background:var(--violet)!important;box-shadow:none!important}

/* the accent marks what's selected, live or yours */
.prog .fill,.prog>i{background:var(--violet)!important}
.tok.sel{background:rgba(106,90,224,.06)!important;box-shadow:inset 0 0 0 1px rgba(106,90,224,.22)!important}
.amts button.on{box-shadow:0 0 0 1.5px var(--violet)!important;color:var(--violet)}
.dot{background:var(--up)}
.pontiff{background:#F7F7F9!important;box-shadow:inset 0 0 0 1px var(--line)!important}

/* token tiles: neutral until the real logo loads, so the board reads calm */
.coin,.tile{background:linear-gradient(180deg,#F3F3F6,#E7E7EC)!important;color:var(--ink2)!important;box-shadow:inset 0 0 0 1px rgba(17,18,24,.06)!important}

/* rows and lists */
.tok:hover{background:#F7F7F9!important;box-shadow:none!important}
.cell,.stat,.qb,.amts button,.amt,.spark{background:#fff;box-shadow:0 0 0 1px var(--line)!important}
.stat,.qb{background:rgba(255,255,255,.9)}

/* column markers: grey new, violet close to graduating, green graduated */
.lane[data-lane=new] .tag{background:#B4B6BF!important;box-shadow:none!important}
.lane[data-lane=final] .tag{background:var(--violet)!important;box-shadow:0 0 0 3px rgba(106,90,224,.16)!important}
.lane[data-lane=migrated] .tag{background:var(--up)!important;box-shadow:0 0 0 3px rgba(19,146,92,.14)!important}

/* chat app accents */
.hello h2 em{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:var(--violet)!important}
.hello .orb::before{background:conic-gradient(from var(--a),#E6E3FB,var(--violet),#E6E3FB)!important;opacity:.55!important}
#ringGrad stop{stop-color:var(--violet)}
#ringGrad stop:first-child{stop-color:#A79DF0}
.plan.best{box-shadow:0 0 0 1.5px var(--violet),0 24px 50px -28px rgba(106,90,224,.55)!important}
.plan .tag{background:var(--violet)!important}
.plan .lim{color:var(--violet)}
.send{background:var(--ink)!important;box-shadow:0 8px 18px -10px rgba(17,18,24,.6)!important}
.sheet{background:#fff!important;box-shadow:var(--e3)!important}
.starter{background:#fff!important;box-shadow:var(--e1)!important}

/* Profile wheel: the chosen saint is the accent */
.wi.on .wp{box-shadow:0 0 0 2px var(--violet),0 10px 24px -10px rgba(106,90,224,.5)!important}

/* profile avatar in the top bar */
.acct-me{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;overflow:hidden;flex:none;text-decoration:none;font:700 13px var(--display);color:#fff;background:var(--ink);box-shadow:0 0 0 2px #fff,0 0 0 3px var(--line);transition:transform .3s var(--ease)}
.acct-me:active{transform:scale(.94);transition:transform .1s ease-out}
.acct-me img{width:100%;height:100%;object-fit:cover}

:focus-visible{outline-color:var(--violet)}
::selection{background:rgba(106,90,224,.18)}

@media (prefers-contrast:more){
  :root{--ink2:#2E3040;--ink3:#4A4C58;--line:rgba(17,18,24,.28)}
  .glass{box-shadow:0 0 0 1.5px rgba(17,18,24,.5)}
}

/* ---------- account menu (opened from the avatar) ---------- */
.acct-me{cursor:pointer}
.acct-me.has-dot{box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--violet)}
.acct{position:fixed;z-index:70;width:300px;border-radius:18px;overflow:hidden;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(24px) saturate(170%);backdrop-filter:blur(24px) saturate(170%);box-shadow:var(--e3);
  transform-origin:var(--ox,90%) -10px;opacity:0;visibility:hidden;pointer-events:none;transform:scale(.94) translateY(-4px);
  transition:opacity .16s ease-out,transform .32s var(--ease),height .32s var(--ease),visibility 0s .32s}
.acct.on{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.acct-track{display:flex;width:200%;transition:transform .34s var(--ease)}
.acct-track.in{transform:translateX(-50%)}
.acct-pane{width:50%;flex:none;padding:8px}
.acct-head{display:flex;align-items:center;gap:11px;padding:10px 10px 12px}
.acct-av{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;overflow:hidden;flex:none;background:var(--ink);color:#fff;font:700 15px var(--display)}
.acct-av img{width:100%;height:100%;object-fit:cover}
.acct-head b{display:block;font:600 14.5px var(--display);letter-spacing:-.015em;color:var(--ink)}
.acct-head small{display:block;font-size:12px;color:var(--ink3)}
.acct-list{display:grid;gap:1px;padding-top:6px;box-shadow:inset 0 1px 0 var(--line)}
.acct-list a,.acct-list button,.acct-sub button{display:flex;align-items:center;gap:11px;width:100%;height:40px;padding:0 10px;border-radius:10px;font:500 14px var(--body);color:var(--ink);text-decoration:none;text-align:left;transition:background .15s,transform .3s var(--ease)}
.acct-list a:hover,.acct-list button:hover,.acct-list a:focus-visible,.acct-list button:focus-visible{background:#F3F3F6;outline:none}
.acct-list a:active,.acct-list button:active{transform:scale(.98);transition:transform .1s ease-out}
.acct svg{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--ink2)}
/* sign-in and wallet rows (app/privy.js) */
.acct-signin{display:flex;align-items:center;justify-content:center;width:calc(100% - 20px);height:40px;margin:0 10px 10px;border-radius:12px;background:var(--violet);color:#fff;font:600 14px var(--body);letter-spacing:-.01em;box-shadow:0 8px 20px -10px var(--violet);transition:transform .3s var(--ease),filter .15s}
.acct-signin:hover{filter:brightness(1.07)}
.acct-signin:active{transform:scale(.98);transition:transform .1s ease-out}
.acct-wallet{display:flex;align-items:center;gap:9px;width:calc(100% - 20px);margin:0 10px 10px;padding:9px 10px;border-radius:12px;background:rgba(106,90,224,.07);box-shadow:inset 0 0 0 1px rgba(106,90,224,.14);font:500 13px var(--body);color:var(--ink2);text-align:left}
.acct-wallet span{display:flex;align-items:center;gap:9px;flex:1}
.acct-wallet code{font:600 12.5px var(--mono);color:var(--ink)}
button.acct-wallet:hover{background:rgba(106,90,224,.11)}
.acct-list span{flex:1}
.acct-list svg:last-child:not(:first-child){width:15px;height:15px;color:var(--ink3)}
.acct-list em{font:600 11px var(--body);font-style:normal;color:#fff;background:var(--violet);min-width:18px;height:18px;padding:0 5px;border-radius:999px;display:grid;place-items:center}
.acct-list hr{border:0;height:1px;background:var(--line);margin:5px 6px}
.acct-note{margin:4px 10px 8px;padding:10px 12px;border-radius:10px;background:#F5F5F8;font-size:12.5px;color:var(--ink2)}
.acct-sub{display:flex;align-items:center;gap:6px;padding:4px 4px 8px;box-shadow:inset 0 -1px 0 var(--line)}
.acct-sub button{width:32px;height:32px;padding:0;justify-content:center;border-radius:9px}
.acct-sub button:hover{background:#F3F3F6}
.acct-sub b{font:600 14.5px var(--display);letter-spacing:-.015em}
.acct-tag{margin-left:auto;font:600 11px var(--body);color:var(--violet);background:rgba(106,90,224,.09);padding:3px 8px;border-radius:999px}
.acct-notes li{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:start;padding:10px 8px;border-radius:10px}
.acct-notes li+li{box-shadow:inset 0 1px 0 var(--line)}
.acct-notes li.new{background:rgba(106,90,224,.05)}
.acct-sav{display:block;width:32px;aspect-ratio:1;border-radius:50%;background:var(--img) no-repeat;background-size:404.2% auto;background-position:var(--x) 30%;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--line)}
.acct-notes b{display:block;font:600 13px var(--body);color:var(--ink)}
.acct-notes small{display:block;font-size:12px;color:var(--ink3);margin-top:1px}
.acct-notes time{font:500 11.5px var(--body);color:var(--ink3)}
.acct-set{display:grid;padding-top:4px}
.acct-set button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:11px 10px;border-radius:10px;font:500 13.5px var(--body);color:var(--ink);text-align:left}
.acct-set button:hover{background:#F3F3F6}
.acct-set i{position:relative;width:38px;height:22px;border-radius:999px;background:rgba(17,18,24,.16);flex:none;transition:background .25s}
.acct-set i::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(17,18,24,.3);transition:transform .32s var(--ease)}
.acct-set [aria-checked=true] i{background:var(--violet)}
.acct-set [aria-checked=true] i::after{transform:translateX(16px)}
@media (prefers-reduced-motion:reduce){.acct,.acct-track,.acct-set i::after{transition:opacity .15s ease!important}.acct{transform:none}}

/* ---------- ?shot: clean screenshot mode for social posts ---------- */
.shot [data-pv],.shot #keyBtn,.shot .lane.hold .paused{display:none!important}

/* ======================================================================
   Dark mode: same two brand colours. Ink becomes the canvas, Violet stays the accent.
   Set by html[data-theme=dark] (Settings → Dark mode, ?theme=dark, or the device setting).
   ====================================================================== */
html[data-theme=dark]{
  color-scheme:dark;
  --ink:#EDEDF2;--ink2:#A9ABB6;--ink3:#7E808C;
  --pearl:#000000;--line:#1C1D22;
  --violet:#8B7DF2;--violet2:#9A8EF5;
  --up:#2FC28A;--down:#F0566A;--gold:#E0A84A;
  --card:#0A0A0C;--card2:#111114;--card3:#1A1B20;
  --e1:0 0 0 1px #1C1D22;
  --e2:0 0 0 1px #1C1D22;
  --e3:0 0 0 1px rgba(255,255,255,.08),0 6px 14px rgba(0,0,0,.45),0 34px 80px -24px rgba(0,0,0,.85);
}
html[data-theme=dark],html[data-theme=dark] body{background:var(--pearl)}
html[data-theme=dark] body{background:#000}
html[data-theme=dark] .bg{display:none}

/* surfaces */
html[data-theme=dark] .glass,html[data-theme=dark] .sheet,html[data-theme=dark] .plan,html[data-theme=dark] .starter,html[data-theme=dark] .pick,html[data-theme=dark] .composer,html[data-theme=dark] .newchat,html[data-theme=dark] .card:not(.glass),html[data-theme=dark] .colbox,html[data-theme=dark] .item,html[data-theme=dark] .work,html[data-theme=dark] .notice,html[data-theme=dark] .locked,html[data-theme=dark] .bal,html[data-theme=dark] .nl{background:var(--card)!important;box-shadow:var(--e1)!important;color:var(--ink)}
html[data-theme=dark] .bar.glass,html[data-theme=dark] .mbar.glass,html[data-theme=dark] .mnav.glass,html[data-theme=dark] .toast.glass{background:#0A0A0C!important;box-shadow:0 0 0 1px #1C1D22!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html[data-theme=dark] .drawer.glass,html[data-theme=dark] .pop.glass.on,html[data-theme=dark] .acct{background:#0E0E11!important;box-shadow:var(--e3)!important}
html[data-theme=dark] .modal{background:rgba(0,0,0,.5)}

/* controls */
html[data-theme=dark] .btn.holo,html[data-theme=dark] .btn.ink,html[data-theme=dark] .send{color:#111218!important}
html[data-theme=dark] .btn.holo::after,html[data-theme=dark] .btn.ink,html[data-theme=dark] .send{background:#EDEDF2!important}
html[data-theme=dark] .btn.holo:hover::after,html[data-theme=dark] .btn.ink:hover{background:#fff!important}
html[data-theme=dark] .send svg{stroke:#111218}
html[data-theme=dark] .btn.soft{background:var(--card2)!important;box-shadow:0 0 0 1px var(--line)!important;color:var(--ink)}
html[data-theme=dark] .btn.soft:hover{background:var(--card3)!important}
html[data-theme=dark] .chip{background:var(--card3);color:var(--ink2)}
html[data-theme=dark] .chip.up{background:rgba(47,194,138,.13);color:var(--up)}
html[data-theme=dark] .chip.dn{background:rgba(240,86,106,.13);color:var(--down)}
html[data-theme=dark] .chip.gold{background:rgba(224,168,74,.14);color:var(--gold)}
html[data-theme=dark] .chip.vio{background:rgba(139,125,242,.14);color:var(--violet)}
html[data-theme=dark] .seg,html[data-theme=dark] .tabs,html[data-theme=dark] .bs,html[data-theme=dark] .lane-switch{background:var(--card2)!important}
html[data-theme=dark] .tabs a.on,html[data-theme=dark] .ind,html[data-theme=dark] .seg .ind{background:var(--card3)!important;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 2px 6px rgba(0,0,0,.4)!important}
html[data-theme=dark] .ind.line{background:var(--violet)!important}
html[data-theme=dark] .stat,html[data-theme=dark] .qb,html[data-theme=dark] .upill{background:var(--card2)!important;box-shadow:0 0 0 1px var(--line)!important;color:var(--ink)}
html[data-theme=dark] .qb input,html[data-theme=dark] .pop input,html[data-theme=dark] .pop select,html[data-theme=dark] .amt input{background:var(--card3);color:var(--ink)}
html[data-theme=dark] .cell,html[data-theme=dark] .amts button,html[data-theme=dark] .amt,html[data-theme=dark] .spark,html[data-theme=dark] .ca{background:var(--card2)!important;box-shadow:0 0 0 1px var(--line)!important;color:var(--ink)}
html[data-theme=dark] .icon-btn:hover,html[data-theme=dark] .tok:hover,html[data-theme=dark] .acct-list a:hover,html[data-theme=dark] .acct-list button:hover,html[data-theme=dark] .acct-set button:hover,html[data-theme=dark] .acct-sub button:hover,html[data-theme=dark] .nav button:hover,html[data-theme=dark] .nav a:hover{background:var(--card2)!important}
html[data-theme=dark] .tok:active{background:var(--card3)!important}
html[data-theme=dark] .nav button.on{background:rgba(139,125,242,.14)}
html[data-theme=dark] .coin,html[data-theme=dark] .tile{background:linear-gradient(180deg,#24252E,#1B1C23)!important;color:var(--ink2)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)!important}
html[data-theme=dark] .prog .tr,html[data-theme=dark] .prog:not(:has(.tr)){background:rgba(255,255,255,.08)}
html[data-theme=dark] th{background:#0A0A0C!important}
html[data-theme=dark] .acct-note,html[data-theme=dark] .pontiff{background:var(--card2)!important}
html[data-theme=dark] .acct-av,html[data-theme=dark] .acct-me,html[data-theme=dark] .photo{background:#2A2B34;color:#EDEDF2}
html[data-theme=dark] .acct-me{box-shadow:0 0 0 2px var(--card),0 0 0 3px var(--line)}
html[data-theme=dark] .acct-set i,html[data-theme=dark] .switch{background:rgba(255,255,255,.16)}
html[data-theme=dark] .switch[aria-checked=true]{background:var(--up)}
html[data-theme=dark] .acct-set [aria-checked=true] i{background:var(--violet)}

/* profile wheel */
html[data-theme=dark] .wp{background:var(--card2)}
html[data-theme=dark] .wi.on .wp,html[data-theme=dark] .wi.on .wl{background:var(--card3)}
html[data-theme=dark] .arc path{stroke:rgba(255,255,255,.14)}
html[data-theme=dark] .knob{background:linear-gradient(180deg,#EDEDF2,#B9BAC4)}
html[data-theme=dark] .name input:focus{background:var(--card2)}

/* chat app */
html[data-theme=dark] .msg.me .bub{color:#fff}
html[data-theme=dark] .hello h2,html[data-theme=dark] h1,html[data-theme=dark] h2,html[data-theme=dark] h3{color:var(--ink)}
html[data-theme=dark] .plan.best{box-shadow:0 0 0 1.5px var(--violet),0 24px 50px -28px rgba(139,125,242,.55)!important}
html[data-theme=dark] .rl input[type=range]::-webkit-slider-thumb{background:#EDEDF2}

/* Solana mark */
.sol-mark{width:16px;height:16px;flex:none;display:block}

/* screenshot mode: a finished-product look */
.shot .acct-me.has-dot{box-shadow:0 0 0 2px #fff,0 0 0 3px var(--line)}
html[data-theme=dark].shot .acct-me.has-dot{box-shadow:0 0 0 2px var(--card),0 0 0 3px var(--line)}
html[data-theme=dark] .score::before{background:var(--card)!important}
html[data-theme=dark] .score span,html[data-theme=dark] .score b{color:var(--ink)}
html[data-theme=dark] .amt input{background:transparent!important}
html[data-theme=dark] .amts button.on{box-shadow:0 0 0 1.5px var(--violet)!important;color:var(--violet)}
.shot #removePhoto{display:none!important}
/* hold-to-confirm buttons: ink (light) / pearl (dark), filling with the accent */
.hold::before{background:var(--violet)!important}
.hold.done::before{background:var(--up)!important}
.hold.sell::before{background:var(--down)!important}
html[data-theme=dark] .hold{background:#EDEDF2!important;color:#111218!important}
html[data-theme=dark] .hold.holding,html[data-theme=dark] .hold.done{color:#fff!important}
html[data-theme=dark] .acct-list a:focus-visible,html[data-theme=dark] .acct-list button:focus-visible,html[data-theme=dark] .acct-set button:focus-visible{background:var(--card2)!important}

/* ---------- primary navigation (nav.js): same on every page ---------- */
.primary{position:relative;display:flex;gap:2px;padding:3px;border-radius:999px;background:#EFEFF2}
.pnav{position:relative;z-index:1;display:flex;align-items:center;gap:7px;height:30px;padding:0 14px;border-radius:999px;font:600 13px var(--body);color:var(--ink2);text-decoration:none;transition:color .25s,transform .3s var(--ease);-webkit-tap-highlight-color:transparent}
.pnav:hover{color:var(--ink)}
.pnav.on{color:var(--ink)}
.pnav:active{transform:scale(.96);transition:transform .1s ease-out}
.pnav svg,.tnav svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.pind{position:absolute;z-index:0;top:3px;bottom:3px;left:0;border-radius:999px;background:#fff;box-shadow:0 0 0 1px rgba(17,18,24,.06),0 1px 3px rgba(17,18,24,.1);transition:transform .38s var(--ease),width .38s var(--ease),opacity .2s;pointer-events:none}
html[data-theme=dark] .primary{background:var(--card2)}
html[data-theme=dark] .pind{background:var(--card3);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 2px 6px rgba(0,0,0,.4)}

/* phone: a fixed bottom tab bar replaces the tabs in the top bar */
.tabbar{display:none}
@media (max-width:900px){
  .primary{display:none!important}
  .tabbar{position:fixed;z-index:45;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:6px;border-radius:22px;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);box-shadow:var(--e2)}
  html[data-theme=dark] .tabbar{background:rgba(10,10,12,.92);box-shadow:0 0 0 1px #1C1D22}
  .tnav{display:grid;justify-items:center;gap:3px;padding:8px 0 6px;border-radius:16px;font:600 11px var(--body);color:var(--ink3);text-decoration:none;transition:color .2s,background .2s,transform .3s var(--ease);-webkit-tap-highlight-color:transparent}
  .tnav svg{width:21px;height:21px}
  .tnav.on{color:var(--ink);background:rgba(106,90,224,.10)}
  html[data-theme=dark] .tnav.on{background:rgba(139,125,242,.14)}
  .tnav:active{transform:scale(.94);transition:transform .1s ease-out}
  html.has-tabbar body{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
}
.shot .tabbar{box-shadow:var(--e2)}
.appbar.glass{background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);box-shadow:var(--e2)}
html[data-theme=dark] .appbar.glass{background:#0A0A0C!important;box-shadow:0 0 0 1px #1C1D22!important}

/* practice balance pill in the top bar (app/practice.js) */
.practice-pill{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border-radius:999px;background:rgba(106,90,224,.08);box-shadow:inset 0 0 0 1px rgba(106,90,224,.2);color:var(--ink);text-decoration:none;font:600 12.5px var(--body);white-space:nowrap;transition:background .2s,transform .3s var(--ease)}
.practice-pill:hover{background:rgba(106,90,224,.13)}
.practice-pill:active{transform:scale(.97);transition:transform .1s ease-out}
.practice-pill small{font:600 10px var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--violet)}
.practice-pill b{font:600 12.5px var(--mono)}
.practice-pill em{font:600 11.5px var(--mono);font-style:normal}
.practice-pill em.up{color:var(--up)}.practice-pill em.dn{color:var(--down)}
html[data-theme=dark] .practice-pill{background:rgba(139,124,255,.12);box-shadow:inset 0 0 0 1px rgba(139,124,255,.28)}
@media (max-width:900px){.practice-pill small,.practice-pill em{display:none}}

/* links inside the Saints chat cards */
.ai-a{color:inherit;text-decoration:none}
.ai-a:hover{text-decoration:underline;text-underline-offset:3px}

/* chat page live mode */
.live-empty{padding:14px 6px;color:var(--ink3);font-size:13px}
.live-coin{position:relative;overflow:hidden}
.live-coin img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html.live #cvBal{display:none}
.dot.off{background:rgba(127,127,140,.45)!important;box-shadow:none!important;animation:none!important}
.acct-empty{padding:18px 10px;color:var(--ink3);font-size:13px;line-height:1.5;text-align:center}

/* the SOL price pill in the top bar read like a balance next to the practice pill: hidden (the price is still used for $ values) */
.stat:has(> .sol-mark){display:none!important}

/* dark mode: the quick-buy button on Pulse rows stays dark (it appears on hover, and a white pill made rows look like they turned white) */
html[data-theme=dark] .tok .btn.quick{color:#ECECF2!important}
html[data-theme=dark] .tok .btn.quick::before{display:none!important}
html[data-theme=dark] .tok .btn.quick::after{background:#24252E!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)!important}
html[data-theme=dark] .tok .btn.quick:hover::after{background:#2C2D37!important}
html[data-theme=dark] .tok .btn.quick svg{stroke:#ECECF2!important}
html[data-theme=dark] .tok .btn.quick.armed::after{background:var(--violet)!important}
html[data-theme=dark] .tok:hover{background:#17181E!important}

/* ---------- coin search (top bar button + panel, nav.js) ---------- */
.gs-btn{display:flex;align-items:center;gap:8px;height:36px;min-width:0;padding:0 8px 0 12px;margin-left:10px;border:0;border-radius:999px;background:#EFEFF2;color:var(--ink3);font:500 13px var(--body);cursor:pointer;transition:background .2s,color .2s}
.gs-btn:hover{color:var(--ink)}
.gs-btn svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.gs-btn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-btn kbd,.gs-in kbd{font:600 11px var(--body);padding:2px 7px;border-radius:6px;background:var(--card,#fff);color:var(--ink3);box-shadow:inset 0 0 0 1px var(--line)}
html[data-theme=dark] .gs-btn{background:var(--card2)}
@media (max-width:1180px){.gs-btn span,.gs-btn kbd{display:none}.gs-btn{width:36px;padding:0;justify-content:center}}
.gs{position:fixed;inset:0;z-index:90;display:flex;justify-content:center;align-items:flex-start;padding:10vh 16px 16px;background:rgba(10,11,16,.38);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.gs[hidden]{display:none}
.gs-panel{width:min(720px,100%);max-height:72vh;display:flex;flex-direction:column;border-radius:18px;background:#fff;box-shadow:var(--e3,var(--e2));overflow:hidden;animation:gsIn .18s ease-out}
html[data-theme=dark] .gs-panel{background:var(--card)}
@keyframes gsIn{from{opacity:0;transform:translateY(-6px) scale(.99)}}
.gs-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.gs-in svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--ink3);stroke-width:2;stroke-linecap:round}
.gs-in input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--ink);font:500 15px var(--body)}
.gs-in input::-webkit-search-cancel-button{display:none}
.gs-list{overflow-y:auto;padding:6px}
.gs-head,.gs-note{padding:10px 12px 6px;font:600 11px var(--body);letter-spacing:.05em;text-transform:uppercase;color:var(--ink3)}
.gs-note{text-transform:none;letter-spacing:0;font-size:13px;font-weight:500;padding:14px 12px}
.gs-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto 82px 82px 52px;align-items:center;gap:12px;width:100%;padding:9px 10px;border:0;border-radius:12px;background:none;color:var(--ink);text-align:left;cursor:pointer}
.gs-row.on,.gs-row:hover{background:rgba(106,90,224,.09)}
html[data-theme=dark] .gs-row.on,html[data-theme=dark] .gs-row:hover{background:rgba(139,125,242,.12)}
.gs-av{position:relative;display:grid;place-items:center;width:36px;height:36px;border-radius:10px;overflow:hidden;background:var(--card2,#EFEFF2)}
.gs-av b{font:700 14px var(--display,var(--body));color:var(--ink3)}
.gs-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gs-id{min-width:0}
.gs-id b{display:block;font:700 14px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-id small{display:block;font:500 12px var(--body);color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-tag{font:600 10.5px var(--body);padding:3px 8px;border-radius:999px;color:var(--violet);background:rgba(106,90,224,.1)}
.gs-tag:empty{display:none}
.gs-n{text-align:right}
.gs-n small{display:block;font:600 10px var(--body);letter-spacing:.04em;text-transform:uppercase;color:var(--ink3)}
.gs-n b{font:600 13px var(--mono);font-variant-numeric:tabular-nums}
@media (max-width:620px){.gs{padding-top:12px}.gs-row{grid-template-columns:36px minmax(0,1fr) auto 72px}.gs-hide{display:none}.gs-in kbd{display:none}}

/* ======================================================================
   SLEEK: a terminal, not a toy. Small corners, flat colour, no decorative gradients.
   Panels 6px · controls 4px · tags 3px. Avatars, coin logos-in-circles and status dots stay round.
   ====================================================================== */
:root{--r-panel:6px;--r-ctl:4px;--r-tag:3px}
/* panels */
body .card,body .glass,body .bar,body .appbar,body .mbar,body .lane,body .colbox,body .panel,body .sheet,body .drawer,body .pop,body .acct,body .gs-panel,body .qt,body .toast,body .composer,body .newchat,body .box,body .notice,body .work,body .item,body .plan,body .pick,body .starter,body .usage,body .locked,body .pontiff,body .tabbar,body .mnav,body .cover,body .bal,body .full,body .nl,body .spark,body .pc-box canvas,body .tok,body .wp{border-radius:var(--r-panel)!important}
/* controls */
body .btn,body .seg,body .seg button,body .seg .ind,body .ind,body .bs,body .bs button,body .bs .ind,body .stat,body .qb,body .qb input,body .pnav,body .pind,body .primary,body .tabs,body .tabs a,body .tnav,body .nav a,body .mnav a,body .gs-btn,body .gs-row,body .mk-tg,body .tr-tabs button,body .qbt,body .share-b,body .pc-act button,body .pc-act .pc-up,body .practice-pill,body .lane-switch,body .lane-switch button,body .subnav,body .subnav button,body .amt,body .amts button,body .cell,body .ca,body .mypos div,body .pnl-row,body .qt-b button,body .qt-b input,body .qt-h button,body .icon-btn,body .acct-set button,body .acct-sub button,body .acct-signin,body .acct-wallet,body .acct-note,body .acct-notes li,body .name input,body .pop select,body .custom li,body .holdings .hl,body .squad li,body .stats div,body .mine .grid div,body .filled,body .hold,body .banner,body .me .bub,body .bub,body .gs-btn kbd,body .gs-in kbd,body .ti span{border-radius:var(--r-ctl)!important}
/* tags and chips */
body .chip,body .badge,body .gs-tag,body .rn,body .acct-tag,body .acct-list em,body .plan .tag,body .tk-soc a,body .mk-b i{border-radius:var(--r-tag)!important}
/* coin logos drawn as squares */
body .coin:not(.av),body .tk-av,body .gs-av,body .wav,body .tile,body .d-head .coin,body .compact .coin{border-radius:var(--r-panel)!important}
/* progress bars: thin and square */
body .prog,body .prog .tr,body .prog i,body .stg .pgb,body .stg .pgb i,body .bsb{border-radius:1px!important}

/* flat colour: no holo rings, glossy buttons, gradient avatars or background glow */
body .bg{display:none!important}
body .btn.holo::before{display:none!important}
body .btn.holo::after{background:#14162B!important}
html[data-theme=dark] body .btn.holo::after{background:#EDEDF2!important}
body .btn.ink{background:#14162B!important;box-shadow:none!important}
html[data-theme=dark] body .btn.ink{background:#EDEDF2!important}
body .glass{background:#fff!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html[data-theme=dark] body .glass{background:#0A0A0C!important}
html:not([data-theme=dark]) body .glass{box-shadow:0 0 0 1px rgba(17,18,24,.08)!important}
html:not([data-theme=dark]) body{background:#F5F5F7!important}
body .coin:not(.av){background:hsl(var(--h,260) 22% 92%)!important;color:hsl(var(--h,260) 35% 35%)!important;box-shadow:inset 0 0 0 1px rgba(17,18,24,.06)!important}
html[data-theme=dark] body .coin:not(.av){background:hsl(var(--h,260) 12% 14%)!important;color:hsl(var(--h,260) 40% 72%)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)!important}
body .prog i{background:var(--violet)!important}
body .ind.line{background:var(--violet)!important}
body .stg .pgb i{background:var(--violet)!important}
body .fire{background:#F2C230!important}
/* quieter shadows: an edge, not a glow */
body .card,body .glass,body .tok{box-shadow:0 0 0 1px var(--line)!important}
html[data-theme=dark] body .card,html[data-theme=dark] body .glass,html[data-theme=dark] body .tok{box-shadow:0 0 0 1px #1C1D22!important}
body .rise{animation:none!important}
.practice-pill small.cash{font:500 11px var(--body);letter-spacing:0;text-transform:none;color:var(--ink3);padding-left:7px;box-shadow:inset 1px 0 0 var(--line)}
@media (max-width:620px){.practice-pill small.cash{display:none}}
/* SOL | USD switch (money.js) */
.unit-tg{display:inline-flex;flex:none;padding:2px;border-radius:var(--r-ctl,4px);box-shadow:inset 0 0 0 1px var(--line);background:rgba(17,18,24,.03)}
.unit-tg button{height:26px;padding:0 9px;border:0;border-radius:3px;background:none;color:var(--ink3);font:700 11px var(--body);letter-spacing:.04em;cursor:pointer}
.unit-tg button.on{background:var(--ink);color:#fff}
html[data-theme=dark] .unit-tg{background:#0F0F12;box-shadow:inset 0 0 0 1px #1C1D22}
html[data-theme=dark] .unit-tg button.on{background:#EDEDF2;color:#0B0C10}