/* Synapse v3 design system. Midnight void, chrome silicon, one cyan. Serif display, Inter UI, mono for numbers only. */
:root{
  --void:#05070d;--s0:#070a12;--s1:#0a0e18;--s2:#0d1220;--s3:#101626;--s4:#161d31;--s5:#1f283f;--s6:#2a3450;
  --fg-1:#f8fafc;--fg-2:#e2e8f0;--fg-3:#cbd5e1;--fg-4:#94a3b8;--fg-5:#64748b;
  --hl-0:rgba(214,226,255,.08);--hl-1:rgba(214,226,255,.12);--hl-2:rgba(214,226,255,.18);--hl-3:rgba(214,226,255,.26);
  --glow:#5ee7ff;--glow-ink:#04202a;--glow-wash:rgba(94,231,255,.10);--glow-wash-2:rgba(94,231,255,.18);--glow-line:rgba(94,231,255,.45);
  --t0:#a78bfa;--t0-rgb:167,139,250;--t1:#6ee7c8;--t1-rgb:110,231,200;--t2:#f6b26b;--t2-rgb:246,178,107;
  --tier:var(--t0);--tier-rgb:var(--t0-rgb);
  --up:#34d399;--up-wash:rgba(52,211,153,.12);--down:#ff6b6b;--down-wash:rgba(255,107,107,.12);--warn:#e8b45a;--warn-wash:rgba(232,180,90,.12);
  --radius-card:18px;--radius-btn:999px;--radius-input:14px;--radius-pill:999px;--radius-row:12px;
  --rail:300px;--topbar:64px;--gutter:clamp(18px,3vw,44px);
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--serif:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;--mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.2,.75,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);--ease-soft:cubic-bezier(.33,1,.68,1);--ease-spring:cubic-bezier(.34,1.4,.64,1);
  --dur-fast:120ms;--dur:240ms;--dur-slow:480ms;
  --glass:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 40%),rgba(13,18,32,.66);
  --shadow-1:inset 0 1px 0 rgba(255,255,255,.06),0 1px 2px rgba(0,0,0,.4),0 18px 40px -24px rgba(0,0,0,.8);
  --shadow-2:inset 0 1px 0 rgba(255,255,255,.08),0 2px 4px rgba(0,0,0,.4),0 40px 80px -30px rgba(0,0,0,.9);
  --shadow-menu:inset 0 1px 0 rgba(255,255,255,.07),0 30px 80px -20px rgba(0,0,0,.85),0 0 0 1px var(--hl-1);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-width:thin;scrollbar-color:var(--s5) transparent;background:var(--void)}
body{margin:0;background:var(--void);color:var(--fg-2);font:14px/1.5 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100dvh;position:relative}
/* ambient depth: two slow gradients behind everything */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(1200px 700px at 85% -10%,rgba(94,231,255,.07),transparent 60%),
  radial-gradient(900px 600px at -10% 110%,rgba(167,139,250,.06),transparent 60%),
  linear-gradient(180deg,#070a12 0%,#05070d 100%)}
/* film grain, 4 percent */
body::after{content:"";position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.045;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:220px 220px}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--s5);border-radius:8px}::-webkit-scrollbar-track{background:transparent}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:not-allowed;opacity:.5}
img,svg,canvas{display:block;max-width:100%}
h1,h2,h3,h4,p{margin:0}
::selection{background:var(--glow-wash-2);color:#fff}
:focus-visible{outline:2px solid var(--glow-line);outline-offset:3px;border-radius:6px}
[hidden]{display:none!important}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-weight:500}
.serif{font-family:var(--serif);font-weight:400;letter-spacing:-.02em}
.serif em,.Display em{font-style:italic;font-weight:300;color:var(--fg-1)}
.Display{font-family:var(--serif);font-weight:400;letter-spacing:-.025em;line-height:1.02;color:var(--fg-1);text-wrap:balance}
.srOnly{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.up{color:var(--up)}.down{color:var(--down)}.warn{color:var(--warn)}.glow{color:var(--glow)}
.muted{color:var(--fg-4)}.dim{color:var(--fg-5)}
/* tier scoping: any element with data-tier gets its tint */
[data-tier="0"]{--tier:var(--t0);--tier-rgb:var(--t0-rgb)}
[data-tier="1"]{--tier:var(--t1);--tier-rgb:var(--t1-rgb)}
[data-tier="2"]{--tier:var(--t2);--tier-rgb:var(--t2-rgb)}
.Eyebrow{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-4);display:inline-flex;align-items:center;gap:10px}
.Eyebrow::before{content:"";width:18px;height:1px;background:linear-gradient(90deg,var(--glow),transparent)}

/* ---------- App shell ---------- */
.Shell{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);min-height:100dvh}
.Shell-rail{position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(10,14,24,.9),rgba(5,7,13,.95));border-right:1px solid var(--hl-0);padding:18px 14px 14px;z-index:40;overflow:hidden}
.Shell-rail::before{content:"";position:absolute;inset:0 auto 0 0;width:1px;background:linear-gradient(180deg,transparent,rgba(94,231,255,.25) 30%,transparent 70%);opacity:.5;pointer-events:none}
.Shell-railHead{display:flex;align-items:center;justify-content:space-between;padding:0 8px 16px}
.Brand{display:inline-flex;align-items:center;gap:11px;color:var(--fg-1);font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:-.02em;line-height:1}
.Brand-mark{width:30px;height:30px;border-radius:10px;background:radial-gradient(120% 120% at 25% 15%,#1a2a3c 0%,#0a111c 65%);border:1px solid var(--hl-2);display:grid;place-items:center;position:relative;overflow:hidden;flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 24px -6px rgba(94,231,255,.5)}
.Brand-mark::after{content:"";position:absolute;inset:auto -40% -60% auto;width:120%;height:120%;background:radial-gradient(circle at 70% 70%,var(--glow-wash-2),transparent 60%)}
.Brand-mark svg{position:relative;z-index:1}
.Brand-tag{font-family:var(--sans);font-size:9.5px;font-weight:600;color:var(--fg-5);letter-spacing:.14em;text-transform:uppercase;margin-left:4px;align-self:flex-end;padding-bottom:1px}
.Shell-close{display:none;width:32px;height:32px;border-radius:50%;color:var(--fg-4);place-items:center;border:1px solid transparent}
.Shell-close:hover{background:var(--s3);color:var(--fg-1)}
.Nav{display:flex;flex-direction:column;gap:2px;padding:0 0 14px}
.Nav-item{display:flex;align-items:center;gap:12px;height:40px;padding:0 12px;border-radius:var(--radius-row);color:var(--fg-3);font-weight:500;font-size:13.5px;position:relative;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.Nav-item:hover{color:var(--fg-1);background:rgba(255,255,255,.03)}
.Nav-item[aria-current="page"]{color:var(--fg-1);background:linear-gradient(90deg,rgba(94,231,255,.10),rgba(94,231,255,0) 70%)}
.Nav-item[aria-current="page"]::before{content:"";position:absolute;left:-14px;top:9px;bottom:9px;width:2px;border-radius:2px;background:var(--glow);box-shadow:0 0 14px 2px rgba(94,231,255,.5)}
.Nav-icon{width:18px;height:18px;display:grid;place-items:center;color:var(--fg-4);transition:color var(--dur) var(--ease)}
.Nav-item[aria-current="page"] .Nav-icon,.Nav-item:hover .Nav-icon{color:var(--glow)}
.Nav-kbd{margin-left:auto}

/* Rail feed */
.Feed{display:flex;flex-direction:column;flex:1;min-height:0;padding-top:12px;border-top:1px solid var(--hl-0)}
.Feed-tabs{display:flex;gap:2px;padding:3px;margin:0 4px;border-radius:999px;background:rgba(255,255,255,.03);border:1px solid var(--hl-0)}
.Feed-tabs button{position:relative;flex:1;height:28px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:600;color:var(--fg-4);transition:color var(--dur) var(--ease),background-color var(--dur) var(--ease)}
.Feed-tabs button:hover{color:var(--fg-2)}
.Feed-tabs button[aria-selected="true"]{color:var(--fg-1);background:var(--s4);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.Feed-caption{font-size:11.5px;color:var(--fg-5);padding:12px 10px 6px;display:flex;justify-content:space-between;align-items:center;gap:8px;line-height:1.4}
.Feed-list{list-style:none;margin:0;padding:0 2px 8px;overflow:auto;flex:1;min-height:0;scrollbar-width:thin}
.Feed-row{display:grid;grid-template-columns:16px 34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 10px;margin:2px 0;border-radius:var(--radius-row);color:var(--fg-2);position:relative;transition:background-color var(--dur) var(--ease);animation:rowIn .35s var(--ease-out) both}
.Feed-row:hover{background:rgba(255,255,255,.03)}
.Feed-row.is-active{background:linear-gradient(90deg,rgba(var(--tier-rgb),.12),rgba(var(--tier-rgb),0) 80%)}
.Feed-row.is-active::before{content:"";position:absolute;left:-2px;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--glow);box-shadow:0 0 14px 2px rgba(94,231,255,.5)}
.Feed-rank{font-size:11px;color:var(--fg-5);text-align:right}
.Feed-rank.is-top{color:var(--glow)}
.Feed-ident{min-width:0;display:flex;flex-direction:column;line-height:1.25}
.Feed-ident b{font-size:13px;font-weight:600;color:var(--fg-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em}
.Feed-ident i{font-style:normal;font-size:11px;color:var(--fg-4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.Feed-ident i::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--tier);margin-right:6px;vertical-align:1px;box-shadow:0 0 6px rgba(var(--tier-rgb),.7)}
.Feed-figs{display:flex;flex-direction:column;align-items:flex-end;line-height:1.25}
.Feed-figs b{font-size:12.5px;font-weight:500;color:var(--fg-1)}
.Feed-figs i{font-style:normal;font-size:11px}
.Feed-empty{padding:18px 10px;color:var(--fg-5);font-size:12.5px;text-align:center;border:1px dashed var(--hl-1);border-radius:var(--radius-row);margin:8px 4px}
.Rail-foot{padding:12px 8px 0;border-top:1px solid var(--hl-0);display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;font-size:11.5px;color:var(--fg-5)}
.Rail-foot a:hover{color:var(--fg-2)}
.Rail-foot .Pill{margin-left:auto}
@keyframes rowIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Chip thumbnails (tier artwork) */
.Chip-thumb{width:34px;height:34px;border-radius:10px;position:relative;flex:none;display:grid;place-items:center;background:radial-gradient(70% 70% at 50% 40%,rgba(var(--tier-rgb),.28),rgba(var(--tier-rgb),.04) 70%,transparent),var(--s2);border:1px solid rgba(var(--tier-rgb),.18);overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.Chip-thumb img{width:118%;height:118%;max-width:none;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
.Chip-thumb.lg{width:52px;height:52px;border-radius:15px}
.Chip-thumb.xl{width:72px;height:72px;border-radius:20px}
/* Model avatar fallback (initials) */
.Mark{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font:700 11px/1 var(--sans);letter-spacing:.02em;color:var(--fg-1);background:linear-gradient(160deg,var(--s4),var(--s2));border:1px solid var(--hl-1);flex:none;position:relative;overflow:hidden}
.Mark::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 30% 0%,rgba(255,255,255,.08),transparent)}
.Mark.lg{width:44px;height:44px;border-radius:12px;font-size:15px}
.Mark.xl{width:56px;height:56px;border-radius:14px;font-size:18px}

/* Topbar */
.Shell-main{min-width:0;display:flex;flex-direction:column}
.Topbar{position:sticky;top:0;z-index:30;height:var(--topbar);display:flex;align-items:center;gap:12px;padding:0 var(--gutter);background:linear-gradient(180deg,rgba(7,10,18,.82),rgba(7,10,18,.62));backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid var(--hl-0)}
.Topbar::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent)}
.Topbar-menu{display:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--hl-1);background:var(--s2);color:var(--fg-2);place-items:center;flex:none}
.Search{position:relative;display:flex;align-items:center;height:40px;width:min(440px,100%);background:rgba(255,255,255,.03);border:1px solid var(--hl-1);border-radius:999px;padding:0 8px 0 16px;gap:10px;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background-color var(--dur) var(--ease)}
.Search:focus-within{border-color:var(--glow-line);background:rgba(94,231,255,.04);box-shadow:0 0 0 4px var(--glow-wash),0 0 30px -8px rgba(94,231,255,.4)}
.Search svg{color:var(--fg-5);flex:none}
.Search input{flex:1;min-width:0;background:none;border:0;outline:0;height:100%;font-size:13.5px;color:var(--fg-1)}
.Search input::placeholder{color:var(--fg-5)}
.Kbd{font-family:var(--mono);font-size:11px;line-height:1;color:var(--fg-4);background:var(--s3);border:1px solid var(--hl-1);border-bottom-width:2px;border-radius:6px;min-width:20px;height:20px;display:inline-grid;place-items:center;padding:0 6px}
.Topbar-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.Wallet{position:relative}
.Wallet-menu{position:absolute;top:calc(100% + 10px);right:0;width:272px;background:var(--glass);backdrop-filter:blur(24px) saturate(1.3);-webkit-backdrop-filter:blur(24px) saturate(1.3);border-radius:var(--radius-card);box-shadow:var(--shadow-menu);padding:8px;transform-origin:top right;animation:popIn .22s var(--ease-out) both;z-index:50}
.Wallet-menu dl{margin:0;padding:10px 12px 12px;display:grid;grid-template-columns:1fr auto;gap:7px 12px;font-size:12.5px;border-bottom:1px solid var(--hl-0);margin-bottom:6px}
.Wallet-menu dt{color:var(--fg-4)}.Wallet-menu dd{margin:0;color:var(--fg-1);text-align:right}
.Wallet-menu button{display:flex;width:100%;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:12px;font-size:13px;color:var(--fg-2)}
.Wallet-menu button:hover{background:rgba(255,255,255,.05);color:var(--fg-1)}
@keyframes popIn{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}

/* Buttons: pills, press states, magnetic hook */
.Btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:999px;font-weight:600;font-size:13.5px;white-space:nowrap;border:1px solid transparent;position:relative;transition:transform var(--dur) var(--ease-out),background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.Btn:active:not(:disabled){transform:scale(.96)!important;transition-duration:60ms}
.Btn-primary{background:var(--fg-1);color:#0a0d14}
.Btn-primary:hover{background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.2),0 8px 20px -10px rgba(255,255,255,.35)}
.Btn-ghost{background:rgba(255,255,255,.03);border-color:var(--hl-2);color:var(--fg-1);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.Btn-ghost:hover{background:rgba(255,255,255,.06);border-color:var(--hl-3)}
.Btn-quiet{background:transparent;color:var(--fg-3);border-color:transparent}
.Btn-quiet:hover{background:rgba(255,255,255,.04);color:var(--fg-1)}
.Btn-glow{background:linear-gradient(180deg,#8df0ff,#5ee7ff 60%,#4fd8f2);color:var(--glow-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 0 0 1px rgba(94,231,255,.4),0 12px 34px -12px rgba(94,231,255,.65)}
.Btn-glow:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 0 0 1px rgba(94,231,255,.6),0 16px 44px -12px rgba(94,231,255,.85);filter:brightness(1.04)}
.Btn-danger{background:var(--down-wash);color:var(--down);border-color:rgba(255,107,107,.25)}
.Btn-danger:hover{background:rgba(255,107,107,.2)}
.Btn-sm{height:36px;min-height:36px;padding:0 14px;font-size:13px}
.Btn-lg{height:48px;padding:0 24px;font-size:14.5px}
.Btn-block{width:100%}
.Btn.is-loading{position:relative;color:transparent!important;pointer-events:none}
.Btn.is-loading::after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;border:2px solid var(--fg-3);border-right-color:transparent;border-top-color:transparent;animation:spin .7s linear infinite}
.Btn-primary.is-loading::after,.Btn-glow.is-loading::after{border-color:#0a0d14;border-right-color:transparent;border-top-color:transparent}
.Btn.is-done{background:linear-gradient(180deg,#5ef0c0,#34d399);color:#042014;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 0 0 1px rgba(52,211,153,.4),0 12px 34px -12px rgba(52,211,153,.6)}
@keyframes spin{to{transform:rotate(360deg)}}
.Btn svg{flex:none}

/* Pills, chips, tags */
.Pill{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 12px;border-radius:999px;border:1px solid var(--hl-1);background:rgba(255,255,255,.03);font-size:12px;font-weight:500;color:var(--fg-3);white-space:nowrap;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.Pill-dot{width:6px;height:6px;border-radius:50%;background:var(--fg-5);flex:none}
.Pill.is-net .Pill-dot{background:var(--up);box-shadow:0 0 8px var(--up)}
.Pill.is-glow{color:var(--glow);border-color:rgba(94,231,255,.3);background:var(--glow-wash)}
.Pill.is-glow .Pill-dot{background:var(--glow);box-shadow:0 0 8px var(--glow)}
.Tag{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 8px;border-radius:999px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.04);color:var(--fg-3);border:1px solid var(--hl-1);white-space:nowrap}
.Tag.is-tier{background:rgba(var(--tier-rgb),.12);color:var(--tier);border-color:rgba(var(--tier-rgb),.3)}
.Tag.is-live{background:var(--glow-wash);color:var(--glow);border-color:rgba(94,231,255,.3)}
.Tag.is-down{background:var(--down-wash);color:var(--down);border-color:rgba(255,107,107,.25)}
.Tag.is-up{background:var(--up-wash);color:var(--up);border-color:rgba(52,211,153,.25)}
.Chips{display:flex;gap:6px;flex-wrap:wrap}
.Chip{height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--hl-1);background:rgba(255,255,255,.03);color:var(--fg-3);font-size:12.5px;font-weight:600;display:inline-flex;align-items:center;gap:7px;transition:transform var(--dur-fast) var(--ease-out),background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.Chip:hover{background:rgba(255,255,255,.06);color:var(--fg-1)}
.Chip:active{transform:scale(.96)}
.Chip[aria-pressed="true"]{background:rgba(94,231,255,.12);color:var(--glow);border-color:rgba(94,231,255,.45);box-shadow:0 0 20px -8px rgba(94,231,255,.6)}
.Chip .Tag{height:16px;font-size:9.5px;padding:0 6px}
.Chip[aria-pressed="true"] .Tag{background:rgba(94,231,255,.15);color:var(--glow);border-color:transparent}
.Chip i.sw{width:7px;height:7px;border-radius:50%;background:var(--tier);box-shadow:0 0 8px rgba(var(--tier-rgb),.8)}

/* Tabs */
.Tabs{display:flex;gap:2px;border-bottom:1px solid var(--hl-0)}
.Tab{position:relative;height:40px;padding:0 14px;font-size:13.5px;font-weight:600;color:var(--fg-4);transition:color var(--dur) var(--ease)}
.Tab:hover{color:var(--fg-2)}
.Tab[aria-selected="true"]{color:var(--fg-1)}
.Tab[aria-selected="true"]::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px;background:var(--glow);box-shadow:0 0 12px rgba(94,231,255,.6)}
.Tab .Tag{margin-left:6px}

/* Live / sync indicator */
.Live{display:inline-flex;align-items:center;gap:8px;height:26px;padding:0 12px 0 10px;border-radius:999px;border:1px solid var(--hl-1);background:rgba(255,255,255,.03);font-size:12px;font-weight:500;color:var(--fg-3)}
.Live-dot{position:relative;width:6px;height:6px;border-radius:50%;background:var(--warn);flex:none}
.Live-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--warn);opacity:0;animation:ping 1.8s var(--ease-out) infinite}
.Live.is-live .Live-dot{background:var(--glow);box-shadow:0 0 8px var(--glow)}
.Live.is-live .Live-dot::after{border-color:var(--glow)}
@keyframes ping{0%{transform:scale(.6);opacity:.8}100%{transform:scale(1.7);opacity:0}}

/* Cards, glass panels, stats */
.Card,.Panel{position:relative;background:var(--glass);border:1px solid var(--hl-1);border-radius:var(--radius-card);box-shadow:var(--shadow-1),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);isolation:isolate}
.Card::before,.Panel::before{content:"";position:absolute;inset:0 18% auto 18%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);pointer-events:none;z-index:1}
.Card::after,.Panel::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(120% 60% at 50% 0%,rgba(94,231,255,.06),transparent 60%);pointer-events:none;z-index:0}
.Card::before,.Panel::before{content:"";position:absolute;inset:0 12% auto 12%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);pointer-events:none;border-radius:inherit}
.Panel{box-shadow:var(--shadow-2),inset 0 1px 0 rgba(255,255,255,.1);border-color:var(--hl-2)}
.Card>*,.Panel>*{position:relative;z-index:1}
.Card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--hl-0)}
.Card-title{font-size:14px;font-weight:600;color:var(--fg-1);display:flex;align-items:center;gap:8px;letter-spacing:-.01em}
.Card-body{padding:18px}
.Label{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-4)}
.Stat{display:flex;flex-direction:column;gap:5px;min-width:0}
.Stat b{font-size:17px;font-weight:500;color:var(--fg-1);line-height:1.15}
.Stat i{font-style:normal;font-size:11.5px;color:var(--fg-4)}
.Stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--hl-0);border:1px solid var(--hl-1);border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-1)}
.Stats .Stat{background:rgba(10,14,24,.75);padding:16px 18px}
.Stats .Stat b{font-size:19px}

/* Inputs */
.Field{display:flex;flex-direction:column;gap:10px}
.Field-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.Field-row .Label{line-height:1}
.Field-row .num{font-size:12px;color:var(--fg-3)}
.Input{display:flex;align-items:center;height:64px;background:rgba(5,7,13,.7);border:1px solid var(--hl-2);border-radius:var(--radius-input);padding:0 10px 0 18px;gap:10px;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);box-shadow:inset 0 2px 8px rgba(0,0,0,.4)}
.Input:focus-within{border-color:var(--glow-line);box-shadow:inset 0 2px 8px rgba(0,0,0,.4),0 0 0 4px var(--glow-wash)}
.Input input{flex:1;min-width:0;background:none;border:0;outline:0;height:100%;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:28px;font-weight:500;color:var(--fg-1);letter-spacing:-.02em}
.Input input::placeholder{color:var(--fg-5);font-weight:400}
.Input-unit{font-size:12.5px;font-weight:600;color:var(--fg-4);display:inline-flex;align-items:center;gap:6px;letter-spacing:.06em}
.Input.is-error{border-color:rgba(255,107,107,.5)}
.Presets{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin-top:12px;padding:3px;border-radius:999px;background:rgba(255,255,255,.03);border:1px solid var(--hl-0)}
.Presets button{height:38px;min-height:38px;padding:0 8px;border-radius:999px;border:1px solid transparent;background:transparent;color:var(--fg-3);font-size:13px;font-weight:500;font-family:var(--mono);font-variant-numeric:tabular-nums;transition:transform var(--dur-fast) var(--ease-out),background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.Presets button:hover{background:rgba(255,255,255,.05);color:var(--fg-1)}
.Presets button:active{transform:scale(.96)}
.Presets button[aria-pressed="true"]{background:var(--s4);color:var(--glow);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.Select{height:40px;padding:0 36px 0 16px;border-radius:999px;border:1px solid var(--hl-1);background:rgba(255,255,255,.03) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%237c8aa5' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5l3 3 3-3'/%3E%3C/svg%3E") no-repeat right 14px center;color:var(--fg-1);font-size:13px;font-weight:500;appearance:none;-webkit-appearance:none;outline:0;transition:border-color var(--dur) var(--ease)}
.Select:focus-visible{border-color:var(--glow-line)}
.Help{font-size:12px;color:var(--fg-4);line-height:1.5}
.Error{font-size:12px;color:var(--down)}

/* Tables */
.Table{width:100%;border-collapse:collapse;font-size:13px}
.Table th{text-align:left;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-4);padding:10px 16px;border-bottom:1px solid var(--hl-0);white-space:nowrap}
.Table td{padding:12px 16px;border-bottom:1px solid var(--hl-0);vertical-align:middle;color:var(--fg-2)}
.Table tr:last-child td{border-bottom:0}
.Table tbody tr{transition:background-color var(--dur) var(--ease)}
.Table tbody tr:hover{background:rgba(255,255,255,.025)}
.Table .r{text-align:right}
.Table-wrap{overflow:auto}

/* Skeleton, empty */
.Skel{position:relative;overflow:hidden;background:var(--s3);border-radius:6px;color:transparent!important}
.Skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);animation:shimmer 1.4s var(--ease-soft) infinite}
@keyframes shimmer{to{transform:translateX(100%)}}
.Empty{padding:32px 20px;margin:14px;justify-content:center;min-height:172px;text-align:center;border:1px dashed var(--hl-2);border-radius:var(--radius-card);color:var(--fg-4);font-size:13px;display:flex;flex-direction:column;align-items:center;gap:10px;background:radial-gradient(60% 80% at 50% 0%,rgba(94,231,255,.05),transparent)}
.Empty b{color:var(--fg-1);font-weight:400;font-family:var(--serif);font-size:19px;letter-spacing:-.01em}
.Empty svg{color:var(--fg-5)}
.Card-body>.Empty{margin:0}
.Empty.is-compact{padding:18px 14px;margin:0;gap:6px;min-height:0}
.Empty.is-compact b{font-size:16px}

/* Toast */
.Toast{position:fixed;right:20px;bottom:20px;z-index:80;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.Toast-item{pointer-events:auto;display:flex;align-items:center;gap:10px;min-width:260px;max-width:360px;padding:12px 16px;border-radius:14px;background:var(--glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--hl-2);box-shadow:var(--shadow-menu),inset 3px 0 0 var(--glow);font-size:13px;color:var(--fg-1);transition:transform 320ms var(--ease-out),opacity 220ms var(--ease)}
.Toast-item.is-enter{transform:translateY(12px);opacity:0}
.Toast-item.is-exit{transform:translateY(8px) scale(.98);opacity:0}
.Toast-item.is-ok{box-shadow:var(--shadow-menu),inset 3px 0 0 var(--up)}.Toast-item.is-err{box-shadow:var(--shadow-menu),inset 3px 0 0 var(--down)}.Toast-item.is-warn{box-shadow:var(--shadow-menu),inset 3px 0 0 var(--warn)}
.Toast-item small{display:block;color:var(--fg-4);font-size:11.5px;margin-top:2px}

/* Content + footer */
.Content{padding:10px var(--gutter) 56px;flex:1;display:flex;flex-direction:column;gap:20px}
.Content.is-in{animation:pageIn .4s var(--ease-out) both}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.PageHead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:22px}
.PageHead h1{font-family:var(--serif);font-size:clamp(30px,3.4vw,42px);font-weight:400;letter-spacing:-.025em;line-height:1.02;color:var(--fg-1)}
.PageHead h1 em{font-style:italic;font-weight:300}
.PageHead p{color:var(--fg-3);font-size:14px;margin-top:10px;max-width:62ch;line-height:1.6}
.Footer{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:22px var(--gutter) 26px;border-top:1px solid var(--hl-0);font-size:12px;color:var(--fg-5)}
.Footer nav{display:flex;gap:6px;flex-wrap:wrap}
.Footer a{display:inline-flex;align-items:center;height:32px;padding:0 13px;border-radius:999px;border:1px solid var(--hl-1);color:var(--fg-3);font-weight:500;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.Footer a:hover{background:rgba(255,255,255,.04);color:var(--fg-1)}

/* Sparkline */
.Spark{width:100%;height:36px}

/* Motion utilities: reveal on scroll, tilt, magnetic */
.rv{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease-out),transform .9s var(--ease-out)}
.rv.is-in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}.rv.d4{transition-delay:.32s}
.Tilt{transform-style:preserve-3d;will-change:transform;transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
.Tilt.is-tilting{transition:transform .08s linear,box-shadow .3s var(--ease)}
.Tilt .px{transform:translate3d(var(--px,0),var(--py,0),0);transition:transform .5s var(--ease-out)}
.Tilt.is-tilting .px{transition:transform .08s linear}
.Mag{transition:transform .35s var(--ease-out)}
.Mag.is-mag{transition:transform .12s linear}

/* Shell responsive */
.Scrim{position:fixed;inset:0;background:rgba(3,5,9,.66);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:35;opacity:0;pointer-events:none;transition:opacity 220ms var(--ease)}
@media (max-width:960px){
  .Shell{grid-template-columns:minmax(0,1fr)}
  .Shell-rail{position:fixed;left:0;top:0;bottom:0;width:min(300px,86vw);transform:translateX(-100%);transition:transform 300ms var(--ease-out);box-shadow:0 0 0 1px var(--hl-0),40px 0 80px -30px rgba(0,0,0,.8);background:rgba(7,10,18,.94);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
  .Shell[data-open] .Shell-rail{transform:none}
  .Shell[data-open] .Scrim{opacity:1;pointer-events:auto}
  .Shell-close{display:grid}
  .Topbar-menu{display:grid}
  .Kbd{display:none}
  .Nav-kbd{display:none}
}
@media (max-width:640px){
  .Topbar{gap:8px}
  .Search{width:auto;flex:1}
  .Topbar .Btn-cta span.t{display:none}
  .Topbar .Btn-cta{padding:0 12px}
  .Pill.is-net{display:none}
  .Toast{left:12px;right:12px;bottom:12px}
  .Toast-item{min-width:0;max-width:none}
  .Card,.Panel{backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media (hover:none){.Table tbody tr:hover{background:transparent}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .Live-dot::after{display:none}
  .rv{opacity:1;transform:none}
}

/* Shell branding: the rail carries a faint vertical aurora and a serif wordmark; the topbar gets a hairline light */
.Rail{background:linear-gradient(180deg,rgba(94,231,255,.05),transparent 22%),radial-gradient(80% 30% at 0% 100%,rgba(167,139,250,.07),transparent 70%),rgba(7,10,18,.72)}
.Rail::after{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);pointer-events:none}
.Topbar::after{content:"";position:absolute;inset:auto 10% 0 10%;height:1px;background:linear-gradient(90deg,transparent,rgba(94,231,255,.25),transparent);pointer-events:none}
.Stat i,.Stat small{color:var(--fg-4)}
.Search{background:rgba(255,255,255,.035);border-color:var(--hl-1)}

/* ---- v7 minimal pass ---- */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.38s;animation-timing-function:cubic-bezier(.16,1,.3,1)}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}::view-transition-old(root),::view-transition-new(root){animation:none}}
body::after{display:none}
body::before{background:linear-gradient(180deg,#070a12 0%,#05070d 100%)}
.Brand{font-family:var(--sans);font-weight:600;font-size:17px;letter-spacing:-.02em}
.Brand-mark{width:28px;height:28px;background:none;border:0;box-shadow:none;border-radius:0}
.Brand-mark::after{display:none}
.Brand-mark img{width:26px;height:26px;display:block}

/* polish: touch targets, consistent transitions, stable numeric widths */
a,button,.Btn,.Chip,.Tab,.Nav-item,.Feed-row,.Select,.Presets button,.CP-seg button,.Wallet-menu button{transition-timing-function:ease;transition-duration:200ms}
.Btn,.Btn-sm,.Chip,.Tab,.Nav-item,.Select,.Topbar-menu,.Shell-close,.Wallet-menu button{min-height:44px}
.Chip{height:auto}
.Btn[disabled],.Btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;transform:none!important;box-shadow:none}
.Stat b,.num,.Ex-stats b,.Feed-figs b,.Feed-figs i,.Cut-time{font-variant-numeric:tabular-nums}
.Ex-stats b.num{display:inline-block;min-width:3ch;text-align:right}
#st-sol,#s-sol,#s-jito{min-width:7ch}
#st-cut,#s-cut,#cut-time{min-width:8ch}
.Feed-row .Mark{width:34px;height:34px;border-radius:10px;font-size:11px}
.Input.is-disabled{opacity:.6;pointer-events:none}

/* ===== Polish layer (Oct 9): calmer controls, roomier deploy panel, real token logos ===== */
/* token logos in the rail */
.Mark.is-token{background:var(--s2);border-color:rgba(255,255,255,.08)}
.Mark.is-token img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;opacity:0;transition:opacity .4s var(--ease-out)}
.Mark.is-token.has-img img{opacity:1}
.Mark.is-token.has-img .Mark-txt{opacity:0}
.Mark.is-token.has-img::after{background:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);border-radius:inherit}
.Feed-ident i::before{display:none}
.Feed-ident i{color:var(--fg-5);font-size:11px;margin-top:2px}
.Feed-go{display:grid;place-items:center;color:var(--fg-5);opacity:0;transform:translateX(-4px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease-out)}
.Feed-row:hover .Feed-go,.Feed-row:focus-visible .Feed-go{opacity:1;transform:none;color:var(--fg-2)}
.Feed-row{transition:background-color .25s var(--ease),transform .25s var(--ease-out)}

/* tier filter: one quiet segmented control instead of glowing pills */
.Chips#tier-chips{display:inline-flex;gap:2px;padding:3px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.06);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.Chips#tier-chips::-webkit-scrollbar{display:none}
#tier-chips .Chip{height:32px;padding:0 14px;border:0;border-radius:9px;background:transparent;color:var(--fg-4);font-size:13px;font-weight:500;letter-spacing:-.005em;box-shadow:none;white-space:nowrap;transition:color .2s var(--ease),background-color .25s var(--ease)}
#tier-chips .Chip:hover{background:rgba(255,255,255,.04);color:var(--fg-2)}
#tier-chips .Chip:active{transform:none;background:rgba(255,255,255,.06)}
#tier-chips .Chip[aria-pressed="true"]{background:rgba(255,255,255,.08);color:var(--fg-1);border:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 1px 2px rgba(0,0,0,.35)}
#tier-chips .Chip .Tag{height:auto;padding:0;border:0;background:none;font:500 11px/1 var(--mono);color:var(--fg-5);letter-spacing:0}
#tier-chips .Chip[aria-pressed="true"] .Tag{color:var(--fg-3);background:none}
#tier-chips .Chip:focus-visible{outline:2px solid var(--glow-line);outline-offset:1px}

/* deploy panel: more air, cleaner rows, softer CTA */
.Panel.is-deploy{border-radius:22px}
.Panel.is-deploy .Deploy-head{padding:22px 24px 18px}
.Panel.is-deploy .Field{padding:22px 24px 0;gap:12px}
.Panel.is-deploy .Field-row .num{font-family:var(--sans);font-size:12px;color:var(--fg-4)}
.Panel.is-deploy .Input{height:68px;border-radius:16px;background:rgba(5,7,13,.55);border-color:rgba(255,255,255,.07)}
.Panel.is-deploy .Proj{margin:22px 24px 0;padding:6px 0 0;gap:0;border-top:0}
.Panel.is-deploy .Proj>div{padding:11px 0;border-bottom:1px solid rgba(255,255,255,.05);justify-content:space-between}
.Panel.is-deploy .Proj>div:last-child{border-bottom:0}
.Panel.is-deploy .Proj>div::after{display:none}
.Panel.is-deploy .Proj>div>:first-child{color:var(--fg-4)}
.Panel.is-deploy .Proj>div>:last-child{color:var(--fg-2)}
.Panel.is-deploy #deploy-btn{width:auto;margin:20px 24px 0;display:flex;height:50px;border-radius:14px}
.Panel.is-deploy #deploy-btn:disabled{background:rgba(255,255,255,.05);color:var(--fg-3);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);filter:none;cursor:default;opacity:1}
.Panel.is-deploy .Note{margin:14px 24px 24px;padding:0;background:none;border:0;font-size:12.5px;color:var(--fg-4);text-align:center;line-height:1.6}

/* disabled glow buttons everywhere: quiet, not neon */
.Btn-glow:disabled,.Btn-glow[aria-disabled="true"]{background:rgba(255,255,255,.05);color:var(--fg-3);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);filter:none;cursor:default}

/* smoother interactions */
.Btn,.Chip,.CCard,.Card{transition-timing-function:cubic-bezier(.22,1,.36,1)}
@media (prefers-reduced-motion:reduce){.Feed-go,.Mark.is-token img{transition:none}}
