/* =====================================================================
   FOLIONAUT · design system
   deep-space glass · one brand gradient (cyan → indigo → violet) · crisp numbers
   ===================================================================== */
:root {
  /* surfaces */
  --bg: #03050b; --bg-2: #070c18;
  --panel: rgba(11, 19, 35, .68); --panel-hi: rgba(18, 31, 56, .62);
  --line: rgba(130, 190, 255, .11); --line-hi: rgba(110, 215, 255, .34);
  /* brand + signal colours */
  --cyan: #5ef0ff; --blue: #5b82ff; --violet: #a07dff;
  --text: #e8f3ff; --text-2: #b7c8da; --muted: #7d93aa;
  --red: #ff4f6b; --amber: #ffbe55; --green: #3ef2a4;
  --grad: linear-gradient(120deg, #6ef3ff 0%, #6d8bff 55%, #b57bff 100%);
  --grad-soft: linear-gradient(120deg, rgba(110,243,255,.16), rgba(109,139,255,.12) 55%, rgba(181,123,255,.14));
  --glow: 0 0 14px rgba(94, 240, 255, .32);
  --shadow: 0 24px 60px -28px rgba(0, 0, 0, .85), 0 1px 0 rgba(255, 255, 255, .035) inset;
  /* shape + motion */
  --r-lg: 18px; --r-md: 12px; --r-sm: 8px; --r-pill: 999px;
  --ease: cubic-bezier(.2, .8, .2, 1); --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
  /* type */
  --display: "Unbounded", "Space Grotesk", sans-serif;
  --ui: "Space Grotesk", system-ui, sans-serif;
  --hud: "Space Grotesk", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;
}
* { box-sizing: border-box; }
html { color-scheme: dark; scrollbar-color: rgba(120, 190, 255, .25) transparent; }
body { margin: 0; background: var(--bg); color: var(--text); font: 400 15px/1.5 var(--ui); overflow-x: hidden;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
::selection { background: rgba(110, 160, 255, .35); color: #fff; }
main { position: relative; z-index: 2; max-width: 1320px; margin: 0 auto; padding: 18px 20px 72px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
h2, h3 { margin: 0; }
h2 { font: 500 11.5px/1.2 var(--display); letter-spacing: .13em; color: #eef8ff; text-transform: uppercase; }
h3 { font: 600 11px var(--hud); letter-spacing: .16em; color: var(--muted); margin: 16px 0 10px; }
[hidden] { display: none !important; }
svg.defs { position: absolute; width: 0; height: 0; overflow: hidden; }
a { color: var(--cyan); }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.tablewrap, .claims, .nav-links { scrollbar-width: thin; }

/* ---------- background: deep space ---------- */
.bg-grid { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 10%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 10%, transparent 75%); }
.bg-grid::before { content: ""; position: absolute; left: -50%; right: -50%; top: -60%; height: 160%;
  background-image: linear-gradient(rgba(110, 200, 255, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(110, 200, 255, .07) 1px, transparent 1px);
  background-size: 56px 56px; transform: perspective(800px) rotateX(60deg) translateY(0); will-change: transform;
  animation: gridMove 9s linear infinite; }
@keyframes gridMove { to { transform: perspective(800px) rotateX(60deg) translateY(56px); } }
.bg-glow { position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(1000px 560px at 12% -12%, rgba(91, 130, 255, .22), transparent 62%),
              radial-gradient(760px 520px at 100% -4%, rgba(160, 125, 255, .16), transparent 60%),
              radial-gradient(900px 600px at 50% 115%, rgba(94, 240, 255, .07), transparent 60%); }
.bg-glow::after { content: ""; position: absolute; inset: 0; opacity: .55;
  background-image: radial-gradient(1px 1px at 12% 18%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 68% 8%, #cfe9ff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 84% 34%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 32% 52%, #bfe0ff 50%, transparent 51%),
    radial-gradient(1px 1px at 52% 78%, #fff 50%, transparent 51%), radial-gradient(1.5px 1.5px at 6% 88%, #d9c9ff 50%, transparent 51%),
    radial-gradient(1px 1px at 93% 72%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 42% 28%, #e6f3ff 50%, transparent 51%);
  background-size: 640px 520px; animation: twinkle 7s ease-in-out infinite alternate; }
@keyframes twinkle { from { opacity: .3; } to { opacity: .65; } }
.scanlines { position: fixed; inset: 0; z-index: 50; pointer-events: none; opacity: .12; overflow: hidden;
  background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .35) 0 1px, transparent 1px 3px); }
.scanlines::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 160px; transform: translateY(-160px);
  background: linear-gradient(transparent, rgba(94, 240, 255, .18), transparent); animation: scan 9s linear infinite; will-change: transform; }
@keyframes scan { to { transform: translateY(100vh); } }

/* ---------- boot ---------- */
#boot { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; align-content: center; gap: 22px; padding: 16px;
  background: radial-gradient(600px 400px at 50% 42%, rgba(91, 130, 255, .18), transparent 70%), var(--bg);
  transition: opacity .8s var(--ease), visibility .8s, transform .8s var(--ease); }
#boot.done { opacity: 0; visibility: hidden; transform: scale(1.04); }
.boot-core { position: relative; width: 172px; height: 172px; display: grid; place-items: center; }
.boot-core::before { content: ""; position: absolute; inset: 18%; border-radius: 50%;
  background: radial-gradient(circle, rgba(110, 160, 255, .35), transparent 70%); animation: breathe-core 2.6s ease-in-out infinite; }
.boot-ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.boot-ring circle { fill: none; stroke: url(#bootGrad); stroke-width: 1.6; stroke-linecap: round; transform-origin: center; transform-box: view-box; }
.boot-ring .r1 { stroke-dasharray: 90 30 6 30; animation: spin 3.2s linear infinite; }
.boot-ring .r2 { stroke-dasharray: 2 7; opacity: .55; animation: spin 7s linear infinite reverse; }
.boot-ring .r3 { stroke-dasharray: 150 260; stroke-width: 3; animation: spin 1.6s var(--ease) infinite; }
.boot-mark { position: relative; width: 78px; height: 78px; animation: float 3.2s ease-in-out infinite; }
@keyframes float { 50% { transform: translateY(-4px); } }
.boot-title { font: 600 22px var(--display); letter-spacing: .42em; padding-left: .42em; color: #fff;
  animation: wordIn 1.1s var(--ease) both; }
.boot-title span, .brand-name span { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
@keyframes wordIn { from { opacity: 0; letter-spacing: .9em; } to { opacity: 1; letter-spacing: .42em; } }
#bootLog { margin: 0; min-height: 118px; width: min(460px, 92vw); font: 11.5px/1.75 var(--mono); color: #9fdcf0; opacity: .9; white-space: pre-wrap; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- panels ---------- */
.panel { position: relative; background: linear-gradient(180deg, var(--panel-hi), var(--panel) 38%); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 18px; margin-top: 16px; overflow: hidden; box-shadow: var(--shadow);
  backdrop-filter: blur(14px) saturate(130%); -webkit-backdrop-filter: blur(14px) saturate(130%);
  transition: border-color .35s var(--ease); }
.panel:hover { border-color: rgba(130, 200, 255, .2); }
.panel::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(110, 243, 255, .9), rgba(181, 123, 255, .7), transparent);
  animation: shimmer 7s ease-in-out infinite; opacity: .55; }
@keyframes shimmer { 0%, 100% { transform: translateX(-55%); } 50% { transform: translateX(55%); } }
.corners { position: absolute; inset: 0; pointer-events: none; }
.corners::before, .corners::after { content: ""; position: absolute; width: 12px; height: 12px; border: 1.5px solid var(--cyan); opacity: .45; }
.corners::before { top: 9px; left: 9px; border-right: 0; border-bottom: 0; border-top-left-radius: 6px; }
.corners::after { bottom: 9px; right: 9px; border-left: 0; border-top: 0; border-bottom-right-radius: 6px; }
.panel-head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; min-height: 28px; }
.panel-head .seg { margin-left: auto; }
.panel-in { opacity: 0; transform: translateY(16px); }
body.ready .panel-in { animation: panelIn .8s var(--ease) forwards; animation-delay: calc(var(--i, 0) * 70ms); }
@keyframes panelIn { to { opacity: 1; transform: none; } }

.grid { display: grid; gap: 16px; }
.grid > .panel { margin-top: 16px; }
.grid > * { min-width: 0; }  /* let wide tables scroll inside their panel instead of stretching the column */
.grid.top { grid-template-columns: 390px 1fr; }
.grid.three { grid-template-columns: repeat(3, 1fr); }
.grid.wide { grid-template-columns: 1.6fr 1fr; align-items: start; }
.grid.two { grid-template-columns: 1fr 1fr; gap: 28px; }
@media (max-width: 1050px) { .grid.top, .grid.wide { grid-template-columns: 1fr; } .grid.three { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) { .grid.three, .grid.two { grid-template-columns: 1fr; } }

/* ---------- header ---------- */
.hud-top { display: flex; align-items: center; gap: 16px; justify-content: space-between; flex-wrap: wrap; padding: 4px 0 16px; }
.brand { display: flex; align-items: center; gap: 13px; }
.logo { width: 42px; height: 42px; flex: none; filter: drop-shadow(0 0 14px rgba(110, 160, 255, .35)); }
.brand .logo { animation: float 5s ease-in-out infinite; }
.brand-name { font: 600 17px/1.1 var(--display); letter-spacing: .2em; color: #fff; }
.brand-sub { font: 500 10.5px var(--mono); color: var(--muted); letter-spacing: .14em; margin-top: 4px; }
.hud-meta { display: flex; align-items: center; gap: 14px; font-family: var(--mono); }
.clock { font: 500 17px var(--mono); color: var(--text); letter-spacing: .06em; font-variant-numeric: tabular-nums; }
.sys { font: 600 11px var(--mono); color: var(--muted); letter-spacing: .12em; display: flex; align-items: center; gap: 8px;
  padding: 5px 11px; border: 1px solid var(--line); border-radius: var(--r-pill); background: rgba(8, 14, 26, .6); transition: color .3s, border-color .3s; }
.sys.live { color: var(--green); border-color: rgba(62, 242, 164, .3); }
.sys.busy { color: var(--amber); border-color: rgba(255, 190, 85, .35); }
.pulse { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; animation: blink 1.4s ease-in-out infinite; }
@keyframes blink { 50% { opacity: .25; } }
.controls { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; order: 1; margin-left: auto; }
.hud-meta { order: 2; }

/* ---------- controls ---------- */
button, select, input { font: 600 13px var(--ui); letter-spacing: .03em; color: var(--text); background: rgba(12, 22, 40, .78);
  border: 1px solid rgba(130, 200, 255, .2); border-radius: var(--r-sm); padding: 8px 13px;
  transition: border-color .2s, background-color .2s, color .2s, box-shadow .2s, transform .15s var(--ease); }
button { cursor: pointer; white-space: nowrap; }
button:hover:not(:disabled) { border-color: rgba(94, 240, 255, .55); color: #fff; background: rgba(24, 42, 72, .85); }
button:active:not(:disabled) { transform: scale(.97); }
input { flex: 1; min-width: 0; font: 500 12.5px var(--mono); }
input::placeholder { color: #5f7389; }
input:focus, select:focus { outline: none; border-color: rgba(94, 240, 255, .7); box-shadow: 0 0 0 3px rgba(94, 240, 255, .14); }
select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 32px;
  background: rgba(12, 22, 40, .78) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%237d93aa' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center; }
select option { background: #0b1323; color: var(--text); }
.narrow { max-width: 130px; }
.btn-primary { position: relative; overflow: hidden; isolation: isolate; font: 600 11px var(--display); letter-spacing: .18em; padding: 10px 22px;
  background: var(--grad); border: 0; color: #050b18; border-radius: var(--r-sm);
  box-shadow: 0 8px 24px -10px rgba(109, 139, 255, .9), inset 0 1px 0 rgba(255, 255, 255, .45); }
.btn-primary:hover:not(:disabled) { color: #050b18; background: var(--grad); transform: translateY(-1px);
  box-shadow: 0 12px 30px -10px rgba(109, 160, 255, 1), 0 0 0 3px rgba(110, 243, 255, .15), inset 0 1px 0 rgba(255, 255, 255, .5); }
.btn-primary::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .55), transparent 70%); transform: translateX(-110%); }
.btn-primary:hover::after { transition: transform .8s var(--ease); transform: translateX(110%); }
.btn-primary:disabled { cursor: progress; filter: saturate(.7); }
.btn-primary:disabled::after { animation: sheen 1.1s linear infinite; }
@keyframes sheen { from { transform: translateX(-110%); } to { transform: translateX(110%); } }
.seg { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: calc(var(--r-sm) + 3px); background: rgba(6, 11, 22, .7); }
.seg button { border: 0; border-radius: var(--r-sm); background: transparent; color: var(--muted); padding: 6px 11px; }
.seg button:hover:not(:disabled) { background: rgba(255, 255, 255, .04); color: var(--text); }
.seg button.on { background: var(--grad-soft); color: #fff; box-shadow: inset 0 0 0 1px rgba(110, 243, 255, .32); }
.seg.small button { font-size: 11px; padding: 4px 9px; letter-spacing: .06em; }
.toggle { display: inline-flex; align-items: center; gap: 9px; font: 600 11px var(--hud); letter-spacing: .12em; color: var(--muted); cursor: pointer; user-select: none; }
.toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.toggle span { width: 34px; height: 20px; border: 1px solid rgba(130, 200, 255, .25); border-radius: var(--r-pill); position: relative;
  background: rgba(6, 11, 22, .8); transition: background-color .25s, border-color .25s; }
.toggle span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%;
  background: var(--muted); transition: transform .3s var(--ease-spring), background-color .25s; }
.toggle input:checked + span { background: rgba(94, 240, 255, .14); border-color: rgba(94, 240, 255, .55); }
.toggle input:checked + span::after { transform: translateX(14px); background: var(--cyan); box-shadow: 0 0 10px rgba(94, 240, 255, .7); }
.toggle input:focus-visible + span { outline: 2px solid var(--cyan); outline-offset: 2px; }
.toggle:hover { color: var(--text); }

/* ---------- ticker ---------- */
.ticker { overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-md); background: rgba(6, 11, 22, .55);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.ticker-track { display: inline-flex; gap: 36px; padding: 8px 0; white-space: nowrap; font: 500 12px var(--mono); color: var(--text-2);
  animation: tick 48s linear infinite; font-variant-numeric: tabular-nums; }
.ticker:hover .ticker-track { animation-play-state: paused; }
.ticker-track b { color: #fff; margin-right: 7px; font-weight: 600; }

@keyframes tick { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- reactor ---------- */
.reactor-panel { display: flex; flex-direction: column; align-items: center; }
.reactor { position: relative; width: min(330px, 100%); aspect-ratio: 1; }
.reactor::before { content: ""; position: absolute; inset: 19.5%; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle at 50% 30%, rgba(40, 62, 110, .55), rgba(5, 9, 18, .92) 68%);
  box-shadow: inset 0 0 0 1px rgba(130, 200, 255, .1), inset 0 -18px 40px rgba(94, 240, 255, .05), 0 0 50px rgba(91, 130, 255, .12); }
.reactor svg { position: relative; width: 100%; height: 100%; overflow: visible; }
.ring { fill: none; transform-origin: 150px 150px; }
.ring.dash { stroke: var(--cyan); stroke-width: 1.2; stroke-dasharray: 2 10; opacity: .45; }
.ring.ticks { stroke: var(--blue); stroke-width: 7; stroke-dasharray: 1 6; opacity: .35; }
.ring.track { stroke: rgba(130, 200, 255, .08); stroke-width: 12; }
.ring.arc { stroke: url(#arcGrad); stroke-width: 10; stroke-linecap: round;
  stroke-dasharray: 729; stroke-dashoffset: 729; transform: rotate(-90deg); transition: stroke-dashoffset 1.6s var(--ease); }
.slow { animation: spin 50s linear infinite; }
.fast { animation: spin 22s linear infinite; }
.rev { animation-direction: reverse; }
.ring.ticks.rev { animation: spin 80s linear infinite reverse; }
.sweep { transform-origin: 150px 150px; animation: spin 6s linear infinite; }
.sweep path { fill: url(#arcGrad); opacity: .06; transition: opacity .4s; }
body:has(#refresh:disabled) .sweep { animation-duration: 1.3s; }  /* scanning: the sweep spins up */
body:has(#refresh:disabled) .sweep path { opacity: .16; }
.reactor-core { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; pointer-events: none; }
.reactor-core .label { font: 600 10px var(--hud); letter-spacing: .28em; color: var(--muted); max-width: 190px; margin: 0 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.total { font: 600 32px/1.15 var(--ui); color: #fff; letter-spacing: -.01em; margin: 6px 0 5px; font-variant-numeric: tabular-nums;
  text-shadow: 0 0 28px rgba(94, 240, 255, .35); }
.delta { font: 500 12.5px var(--mono); color: var(--muted); font-variant-numeric: tabular-nums; }
.up { color: var(--green) !important; }
.down { color: var(--red) !important; }
.reactor-foot { margin-top: 10px; font: 500 11px var(--mono); text-align: center; letter-spacing: .02em; }
.scan-warn { margin-top: 10px; padding: 8px 12px; border: 1px solid rgba(255, 190, 85, .4); border-radius: var(--r-sm); background: rgba(255, 190, 85, .07);
  color: var(--amber); font: 600 11px/1.5 var(--mono); text-align: center; }
.kind-split { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 8px; }
.kind-split:empty { display: none; }
.kind-split div { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 6px 12px; min-width: 78px;
  border: 1px solid var(--line); border-radius: var(--r-md); background: rgba(6, 11, 22, .5); }
.kind-split span { font: 600 9px var(--hud); letter-spacing: .2em; color: var(--muted); }
.kind-split b { font: 600 13.5px var(--mono); color: var(--text); font-variant-numeric: tabular-nums; }
.chip.kind { color: var(--amber); border-color: rgba(255, 190, 85, .4); background: rgba(255, 190, 85, .06); }
.chip.kind.loan { color: var(--red); border-color: rgba(255, 79, 107, .4); background: rgba(255, 79, 107, .06); }
.chip.kind.reward { color: var(--green); border-color: rgba(62, 242, 164, .4); background: rgba(62, 242, 164, .06); }

/* ---------- alert ---------- */
.alert { border-color: rgba(255, 79, 107, .35); background: linear-gradient(110deg, rgba(70, 10, 26, .6), rgba(11, 19, 35, .66) 60%); }
.alert .corners::before, .alert .corners::after { border-color: var(--red); }
.alert::before { background: linear-gradient(90deg, transparent, var(--red), transparent); }
.alert h2 { color: #ffd5dc; }
.headline { display: grid; grid-template-columns: 30px 1fr; gap: 12px; padding: 12px 0; border-top: 1px solid rgba(255, 79, 107, .15); }
.headline:first-child { border-top: 0; padding-top: 2px; }
.headline .n { font: 600 18px var(--display); color: var(--red); }
.headline .t { font-size: 18px; font-weight: 600; color: #fff; line-height: 1.35; }
.headline .t.typing::after { content: "▌"; color: var(--red); animation: blink .7s infinite; }
.headline .w { color: #f1c9d1; margin-top: 3px; }
.headline a { color: var(--muted); font: 500 11px var(--mono); text-decoration: none; }
.headline a:hover { color: var(--cyan); }
.tag { display: inline-flex; align-items: center; gap: 6px; font: 700 9.5px var(--hud); letter-spacing: .16em; padding: 4px 9px;
  border: 1px solid rgba(94, 240, 255, .35); border-radius: var(--r-pill); color: var(--cyan); background: rgba(94, 240, 255, .07); }
.tag-red, .tag-green { border-color: rgba(255, 79, 107, .5); color: #ff8fa2; background: rgba(255, 79, 107, .1); }
.tag-red::before, .tag-green::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor;
  box-shadow: 0 0 8px currentColor; animation: blink 1.4s ease-in-out infinite; }

/* ---------- briefing ---------- */
.briefing .summary { font-size: 17px; line-height: 1.55; color: #eef8ff; border-left: 2px solid transparent; padding-left: 14px;
  border-image: linear-gradient(var(--cyan), var(--violet)) 1; }
.drivers { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin: 16px 0; }
.driver { border: 1px solid var(--line); border-radius: var(--r-md); padding: 11px 12px; background: rgba(255, 255, 255, .02);
  transition: border-color .25s, transform .25s var(--ease); }
.driver:hover { border-color: rgba(130, 200, 255, .25); transform: translateY(-2px); }
.driver .h { display: flex; justify-content: space-between; gap: 8px; font: 600 13px var(--ui); letter-spacing: .04em; color: #fff; }
.driver .r { color: var(--text-2); font-size: 14px; margin-top: 4px; }
.news { display: flex; flex-direction: column; gap: 12px; }
.news-item { display: grid; grid-template-columns: 3px 1fr; gap: 13px; }
.news-item .bar { background: var(--muted); border-radius: 3px; }
.news-item.bullish .bar { background: var(--green); box-shadow: 0 0 8px rgba(62, 242, 164, .6); }
.news-item.bearish .bar { background: var(--red); box-shadow: 0 0 8px rgba(255, 79, 107, .6); }
.news-item .t { font-weight: 600; color: #fff; }
.news-item .s { color: var(--text-2); font-size: 14px; }
.news-item .m { font: 11px var(--mono); color: var(--muted); margin-top: 3px; }
.news-item .m a { color: var(--muted); }
.news-item .m a:hover { color: var(--cyan); }
.chip { display: inline-block; font: 600 10px var(--mono); padding: 1px 7px; border: 1px solid rgba(94, 240, 255, .3); border-radius: 6px;
  color: var(--cyan); background: rgba(94, 240, 255, .05); margin-right: 4px; letter-spacing: .02em; }
.outlook { margin-top: 16px; padding: 11px 14px; border: 1px dashed rgba(130, 200, 255, .25); border-radius: var(--r-md); color: #c6e6f3; font-size: 14px; }
.empty { position: relative; color: var(--muted); font: 500 12px/1.6 var(--mono); padding: 22px 16px; text-align: center;
  border: 1px dashed rgba(130, 200, 255, .16); border-radius: var(--r-md);
  background: repeating-linear-gradient(135deg, rgba(130, 200, 255, .025) 0 8px, transparent 8px 16px); }
.empty::before { content: ""; display: block; width: 8px; height: 8px; margin: 0 auto 10px; border-radius: 50%;
  background: var(--cyan); box-shadow: 0 0 0 4px rgba(94, 240, 255, .12); animation: blink 2s ease-in-out infinite; }

/* ---------- bars & movers ---------- */
.bars .b { display: grid; grid-template-columns: 92px 1fr 86px; gap: 12px; align-items: center; margin: 9px 0; font-size: 14px; font-weight: 500; }
.bars .k { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bars .track { height: 6px; background: rgba(130, 200, 255, .08); border-radius: var(--r-pill); position: relative; overflow: hidden; }
.bars .fill { height: 100%; width: 0; background: var(--grad); border-radius: inherit; box-shadow: 0 0 10px rgba(94, 200, 255, .45);
  transition: width 1.2s var(--ease); }
.bars .v { text-align: right; font: 500 12px var(--mono); font-variant-numeric: tabular-nums; }
.movers .mv { display: flex; justify-content: space-between; gap: 10px; padding: 8px 8px; margin: 0 -8px; border-bottom: 1px solid var(--line);
  font-size: 14px; font-weight: 500; border-radius: var(--r-sm); transition: background-color .2s; }
.movers .mv:last-child { border-bottom: 0; }
.movers .mv:hover { background: rgba(255, 255, 255, .03); }
.movers .mv span:last-child { font-family: var(--mono); font-variant-numeric: tabular-nums; }

/* ---------- table ---------- */
.tablewrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
th, td { padding: 10px 8px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; }
th:first-child, td:first-child, th:nth-child(2), td:nth-child(2) { text-align: left; }
th { font: 600 10px var(--hud); letter-spacing: .16em; color: var(--muted); padding-top: 4px; }
td { font: 500 13px var(--mono); }
td:first-child { font: 600 15px var(--ui); color: #fff; }
tbody tr { opacity: 0; animation: rowIn .45s var(--ease) forwards; transition: background-color .2s; }
tbody tr:hover { background: rgba(130, 200, 255, .045); }
@keyframes rowIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
details.sub { margin-top: 14px; }
details.sub summary { padding: 6px 0; }
details.sub summary:hover { color: var(--text); }
tbody.noanim tr { animation: none; opacity: 1; }
tr.expandable { cursor: pointer; }
.caret { display: inline-block; color: var(--cyan); transition: transform .25s var(--ease); }
.caret.open { transform: rotate(90deg); }
tr.detail { animation: none !important; opacity: 1 !important; }
tr.detail:hover { background: none; }
tr.detail td { white-space: normal; text-align: left; padding: 4px 0 16px; font: 500 14px var(--ui); color: var(--text); }
#holdings tr:not(.detail) > td[colspan] { text-align: center; padding: 30px 12px; font: 500 12px var(--mono); color: var(--muted); white-space: normal; }
.pos-wrap { position: sticky; left: 0; width: min(100%, var(--wrap-w, 100%)); }
.pos-sum { font: 12px var(--mono); color: var(--muted); margin: 6px 2px 12px; }
.pos-sum b { color: var(--green); }
.pos-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(330px, 100%), 1fr)); gap: 12px; }
.pos { border: 1px solid var(--line); border-radius: var(--r-md); padding: 14px; background: linear-gradient(180deg, rgba(94, 240, 255, .05), rgba(255, 255, 255, .01));
  animation: panelIn .45s var(--ease) forwards; }
.pos.out { border-color: rgba(255, 79, 107, .35); background: linear-gradient(180deg, rgba(255, 79, 107, .07), rgba(255, 79, 107, .01)); }
.pos-head { display: flex; align-items: center; gap: 10px; }
.pos-head b { margin-left: auto; font: 600 14px var(--mono); }
.pos-status { font: 700 9.5px var(--hud); letter-spacing: .16em; color: var(--green); }
.pos.out .pos-status { color: var(--red); animation: blink 1.6s infinite; }
.rbar { position: relative; height: 8px; margin: 18px 0 8px; background: rgba(130, 200, 255, .08); border-radius: var(--r-pill); }
.rrange { position: absolute; top: 0; bottom: 0; border-radius: var(--r-pill); background: var(--grad); box-shadow: 0 0 8px rgba(94, 200, 255, .5); }
.rrange.out { background: rgba(255, 79, 107, .55); box-shadow: 0 0 8px rgba(255, 79, 107, .5); }
.rmark { position: absolute; top: -5px; bottom: -5px; width: 2px; border-radius: 2px; background: #fff; box-shadow: 0 0 8px #fff; transform: translateX(-1px); }
.rmark::after { content: "NOW"; position: absolute; top: -14px; left: 50%; transform: translateX(-50%); font: 700 8px var(--hud); letter-spacing: .12em; color: #fff; }
.pos-range { display: flex; justify-content: space-between; gap: 8px; font: 11px var(--mono); }
.pos-range .muted { text-align: center; }
.pos-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1.1fr); gap: 10px; margin-top: 14px; padding-top: 12px;
  border-top: 1px solid var(--line); font: 11.5px/1.55 var(--mono); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.pos-grid span { display: block; font: 700 9px var(--hud); letter-spacing: .14em; color: var(--muted); margin-bottom: 2px; }
.pos-grid .pos-fees b { color: var(--green); }
.pos-grid b span, .pos-grid div > span.up, .pos-grid div > span.down { display: inline; font: inherit; letter-spacing: 0; }
summary { cursor: pointer; font: 600 11px var(--mono); color: var(--muted); letter-spacing: .08em; transition: color .2s; }

/* ---------- calendar ---------- */
.next-event { border: 1px solid rgba(255, 190, 85, .3); border-radius: var(--r-md); padding: 12px 14px; margin-bottom: 14px;
  background: linear-gradient(110deg, rgba(255, 190, 85, .08), rgba(255, 190, 85, .01) 70%); }
.next-event:empty { display: none; }
.next-event .lbl { font: 600 10px var(--hud); letter-spacing: .2em; color: var(--muted); }
.next-event .ttl { font-weight: 600; font-size: 16px; color: #fff; }
.next-event .cd { font: 600 22px var(--mono); color: var(--amber); font-variant-numeric: tabular-nums; }
.cal { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 4px 26px; align-items: start; }
.cal-col { min-width: 0; }
.cal-day { font: 600 10.5px var(--hud); letter-spacing: .16em; color: var(--cyan); margin: 10px 0 6px; padding-bottom: 7px; border-bottom: 1px solid var(--line-hi); }
.cal-day.today::after { content: " · TODAY"; color: var(--amber); }
.ev { display: grid; grid-template-columns: 50px 44px 1fr auto; gap: 8px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.ev.past { opacity: .4; }
.ev .tm { font: 12px var(--mono); color: var(--muted); }
.ev .cc { font: 700 11px var(--mono); }
.ev .imp { width: 7px; height: 7px; display: inline-block; margin-right: 7px; border-radius: 50%; background: var(--amber); }
.ev .imp.High { background: var(--red); box-shadow: 0 0 8px var(--red); }
.ev .imp.Holiday { background: var(--muted); }
.ev .fc { font: 11px var(--mono); color: var(--muted); text-align: right; }
.ev.crypto .cc { color: var(--cyan); }

/* ---------- config ---------- */
.config summary { display: flex; align-items: center; gap: 12px; list-style: none; }
.config summary::-webkit-details-marker { display: none; }
.config summary::before { content: "▸"; color: var(--cyan); transition: transform .25s var(--ease); }
.config[open] summary::before { transform: rotate(90deg); }
.config summary:hover h2 { color: var(--cyan); }
.config[open] > summary { margin-bottom: 6px; }
.row { display: flex; gap: 8px; flex-wrap: wrap; }
.list { list-style: none; margin: 0 0 12px; padding: 0; }
.list li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.addr { font: 12px var(--mono); word-break: break-all; color: var(--text-2); }
.x { border: 0; background: none; color: var(--muted); padding: 4px 8px; border-radius: 6px; }
.x:hover:not(:disabled) { color: var(--red); background: rgba(255, 79, 107, .1); }
.status { font-family: var(--mono); line-height: 1.75; }
.ok { color: var(--green); }
.err { color: var(--red); }

/* ---------- Arc Core ---------- */
.arc-segs circle { fill: none; stroke-width: 12; transform: rotate(-90deg); transform-origin: 150px 150px; cursor: pointer;
  transition: stroke-dasharray 1.4s var(--ease), stroke-dashoffset 1.4s var(--ease), stroke-width .25s var(--ease), opacity .25s; }
.arc-segs circle:hover, .arc-segs circle.hl { stroke-width: 18; }
.arc-segs.has-hl circle:not(.hl) { opacity: .22; }
.reactor::after { content: ""; position: absolute; inset: 30%; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, var(--mood) 0%, transparent 70%); opacity: .35; animation: breathe-core var(--mood-speed) ease-in-out infinite; }
.reactor.mood-up { --mood: rgba(94, 240, 255, .5); --mood-speed: 4.5s; }
.reactor.mood-flat { --mood: rgba(109, 139, 255, .45); --mood-speed: 3.5s; }
.reactor.mood-dip { --mood: rgba(255, 190, 85, .45); --mood-speed: 2.2s; }
.reactor.mood-down { --mood: rgba(255, 79, 107, .55); --mood-speed: 1.1s; }
@keyframes breathe-core { 0%, 100% { transform: scale(.85); opacity: .25; } 50% { transform: scale(1.12); opacity: .55; } }
.reactor.mood-down .total { animation: jitter 2.5s infinite; }
@keyframes jitter { 0%, 92%, 100% { transform: none; } 94% { transform: translateX(-1px); } 96% { transform: translateX(1px); } }
.ripples { position: absolute; inset: 0; pointer-events: none; }
.ripple { position: absolute; left: 50%; top: 50%; width: 60%; height: 60%; border: 1.5px solid var(--cyan); border-radius: 50%;
  transform: translate(-50%, -50%) scale(.6); opacity: .9; animation: ripple 1.6s ease-out forwards; }
.ripple.down { border-color: var(--red); }
@keyframes ripple { to { transform: translate(-50%, -50%) scale(1.75); opacity: 0; } }
.total { display: inline-flex; justify-content: center; }
.odo { display: inline-block; height: 1.15em; line-height: 1.15em; overflow: hidden; vertical-align: top; }
.odo-strip { display: flex; flex-direction: column; transition: transform 1.3s var(--ease); }
.odo-strip span { height: 1.15em; text-align: center; }
tr.hl td { background: rgba(94, 240, 255, .09); }
.tm-banner { margin-top: 10px; padding: 7px 12px; border: 1px solid rgba(255, 190, 85, .4); border-radius: var(--r-pill); background: rgba(255, 190, 85, .07);
  color: var(--amber); font: 600 11px var(--mono); text-align: center; }
.tm-banner button { margin-left: 8px; padding: 2px 10px; font-size: 11px; border-radius: var(--r-pill); }

/* ---------- Claim Radar ---------- */
.grid.radar-row { grid-template-columns: 1fr 1.25fr; }
@media (max-width: 1050px) { .grid.radar-row { grid-template-columns: 1fr; } }
.tag-green { border-color: rgba(62, 242, 164, .45); color: var(--green); background: rgba(62, 242, 164, .08); }
.thresh { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; letter-spacing: .08em; font-weight: 600; }
.thresh input { width: 74px; flex: none; padding: 4px 8px; }
.radar-wrap { display: grid; grid-template-columns: 240px 1fr; gap: 20px; align-items: center; }
@media (max-width: 600px) { .radar-wrap { grid-template-columns: 1fr; justify-items: center; } }
.radar { position: relative; width: 240px; height: 240px; }
.radar::before { content: ""; position: absolute; inset: 4%; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(62, 242, 164, .07), transparent 70%); }
.radar svg { width: 100%; height: 100%; overflow: visible; }
.rr { fill: none; stroke: rgba(62, 242, 164, .16); stroke-width: 1; }
.radar-sweep { transform-origin: 120px 120px; animation: spin 6s linear infinite; }
.sweep-line { stroke: var(--green); stroke-width: 1.5; }
.blip { fill: var(--green); filter: drop-shadow(0 0 5px var(--green)); transform-box: fill-box; transform-origin: center;
  animation: ping 6s linear infinite; cursor: pointer; }
.blip.ready { fill: var(--amber); filter: drop-shadow(0 0 7px var(--amber)); }
@keyframes ping { 0% { opacity: 1; transform: scale(1.6); } 12% { opacity: .9; transform: scale(1); } 100% { opacity: .35; transform: scale(1); } }
.radar-total { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; pointer-events: none; }
.radar-total span { font: 600 9px var(--hud); letter-spacing: .22em; color: var(--muted); }
.radar-total b { font: 600 21px var(--ui); color: #fff; font-variant-numeric: tabular-nums; text-shadow: 0 0 18px rgba(62, 242, 164, .45); }
.radar-total em { font: 500 11px var(--mono); color: var(--green); font-style: normal; }
.claims { display: flex; flex-direction: column; gap: 8px; max-height: 300px; overflow-y: auto; padding-right: 2px; }
.claim { border: 1px solid var(--line); border-radius: var(--r-md); padding: 10px 12px; display: grid; grid-template-columns: 1fr auto; gap: 2px 10px;
  background: rgba(255, 255, 255, .015); transition: border-color .3s, background-color .3s; }
.claim:hover { border-color: rgba(62, 242, 164, .3); }
.claim.hl { border-color: var(--green); background: rgba(62, 242, 164, .06); }
.claim.ready { border-color: rgba(255, 190, 85, .6); box-shadow: 0 0 18px -4px rgba(255, 190, 85, .3); }
.claim .c-name { font-weight: 600; color: #fff; }
.claim .c-name small { font: 700 9px var(--hud); letter-spacing: .14em; color: var(--amber); margin-left: 6px; }
.claim .c-val { font: 600 14px var(--mono); text-align: right; color: var(--green); }
.claim .c-proto { font: 11px var(--mono); color: var(--muted); }
.claim .c-rate { font: 11px var(--mono); color: var(--muted); text-align: right; }
.claim .c-bar { grid-column: 1 / -1; height: 3px; border-radius: 3px; overflow: hidden; background: rgba(62, 242, 164, .1); margin-top: 6px; }
.claim .c-bar i { display: block; height: 100%; background: var(--green); box-shadow: 0 0 6px var(--green); transition: width 1s var(--ease); }
.claim.ready .c-bar i { background: var(--amber); box-shadow: 0 0 6px var(--amber); }
.claim a { grid-column: 1 / -1; font: 700 10px var(--hud); letter-spacing: .14em; color: var(--cyan); text-decoration: none; justify-self: start; margin-top: 4px; }
.claim a:hover { text-shadow: var(--glow); }

/* ---------- Time Machine ---------- */
.tm-ctrl { margin-left: auto; }
.tm-chart { position: relative; height: 210px; }
.tm-chart > .empty { height: 100%; display: grid; place-content: center; }
.tm-chart svg { width: 100%; height: 100%; overflow: visible; }
.tm-area { fill: url(#tmFill); }
.tm-line { fill: none; stroke: var(--cyan); stroke-width: 2; stroke-linejoin: round; filter: drop-shadow(0 0 6px rgba(94, 240, 255, .6));
  stroke-dasharray: var(--len); stroke-dashoffset: var(--len); animation: draw 1.6s var(--ease) forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.tm-grid { stroke: var(--line); stroke-width: 1; }
.tm-axis { font: 10px var(--mono); fill: var(--muted); }
.tm-ev { stroke: var(--red); stroke-width: 1; stroke-dasharray: 3 3; opacity: .6; }
.tm-ev-dot { fill: var(--red); }
.tm-claim { fill: var(--green); filter: drop-shadow(0 0 4px var(--green)); }
.tm-cursor { stroke: #fff; stroke-width: 1; opacity: .7; }
.tm-cursor-dot { fill: #fff; filter: drop-shadow(0 0 6px #fff); }
.tm-tip { font: 600 11px var(--mono); fill: #fff; }
.tm-slider { -webkit-appearance: none; appearance: none; width: 100%; height: 22px; margin-top: 10px; background: transparent; border: 0; padding: 0; cursor: pointer; }
.tm-slider:disabled { cursor: default; opacity: .4; }
.tm-slider::-webkit-slider-runnable-track { height: 4px; border-radius: 4px; background: linear-gradient(90deg, rgba(94, 240, 255, .5), rgba(160, 125, 255, .5)); }
.tm-slider::-moz-range-track { height: 4px; border-radius: 4px; background: linear-gradient(90deg, rgba(94, 240, 255, .5), rgba(160, 125, 255, .5)); }
.tm-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; margin-top: -6px; border-radius: 50%; background: #fff;
  border: 3px solid var(--blue); box-shadow: 0 0 0 4px rgba(94, 240, 255, .15), 0 0 12px rgba(94, 240, 255, .6); transition: transform .2s var(--ease-spring); }
.tm-slider::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--blue); box-shadow: 0 0 12px rgba(94, 240, 255, .6); }
.tm-slider:hover:not(:disabled)::-webkit-slider-thumb { transform: scale(1.18); }
.tm-slider:focus-visible { outline: none; }
.tm-slider:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px rgba(94, 240, 255, .45); }
.tm-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; font-family: var(--mono); }
.tm-legend i { display: inline-block; width: 14px; height: 2px; vertical-align: middle; margin-right: 6px; border-radius: 2px; }
.lg-line { background: var(--cyan); } .lg-ev { background: var(--red); } .lg-claim { background: var(--green); height: 6px !important; width: 6px !important; border-radius: 50% !important; }
.tm-viewing #byAsset .fill { background: linear-gradient(90deg, var(--amber), #ffd78a); }

/* ---------- accounts ---------- */
.user-chip { display: inline-flex; align-items: center; gap: 8px; font: 500 12px var(--mono); color: var(--text);
  border: 1px solid var(--line); border-radius: var(--r-pill); padding: 4px 4px 4px 12px; background: rgba(8, 14, 26, .6); min-width: 0; }
.user-chip #userName { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 150px; }
.user-chip button { padding: 4px 10px; font-size: 11px; border-radius: var(--r-pill); }
.user-dot { width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); }
body.auth-open main { filter: blur(8px); pointer-events: none; }
.auth-panel { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 16px; overflow-y: auto;
  background: radial-gradient(700px 480px at 50% 30%, rgba(91, 130, 255, .2), transparent 70%),
              radial-gradient(500px 400px at 70% 80%, rgba(160, 125, 255, .12), transparent 70%), rgba(3, 5, 11, .88); }
.auth-box { width: min(430px, 100%); margin: 0; padding: 30px 28px 26px; display: flex; flex-direction: column; gap: 15px;
  border-color: rgba(130, 200, 255, .2); box-shadow: 0 40px 100px -30px rgba(0, 0, 0, .9), 0 0 0 1px rgba(110, 160, 255, .06), 0 0 80px -20px rgba(91, 130, 255, .35);
  animation: panelIn .7s var(--ease) both; }
.auth-brand { display: flex; align-items: center; gap: 14px; }
.auth-brand .logo { width: 52px; height: 52px; animation: float 5s ease-in-out infinite; }
.auth-brand .brand-name { font-size: 20px; }
.auth-lead { margin: -2px 0 2px; color: var(--text-2); font-size: 15px; line-height: 1.5; }
.auth-tabs { display: flex; }
.auth-tabs button { flex: 1; padding: 8px 10px; }
#authForm { display: flex; flex-direction: column; gap: 12px; }
#authForm label { display: flex; flex-direction: column; gap: 6px; font: 600 10px var(--hud); letter-spacing: .18em; color: var(--muted); }
#authForm input { font: 500 14px var(--ui); letter-spacing: .01em; padding: 11px 12px; }
#authForm .btn-primary { margin-top: 4px; padding: 13px 22px; }
.auth-or { display: flex; align-items: center; gap: 12px; color: var(--muted); font: 600 10px var(--hud); letter-spacing: .22em; }
.auth-or::before, .auth-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.wallet-btn { padding: 12px; font: 600 10.5px var(--display); letter-spacing: .14em; border-color: rgba(160, 125, 255, .55); color: #e2d6ff; border-radius: var(--r-sm);
  background: linear-gradient(110deg, rgba(160, 125, 255, .22), rgba(94, 240, 255, .1)); }
.wallet-btn:hover:not(:disabled) { border-color: #b59bff; color: #fff; background: linear-gradient(110deg, rgba(160, 125, 255, .34), rgba(94, 240, 255, .16)); }
.wallet-btn:disabled { opacity: .45; cursor: not-allowed; }
.auth-msg { min-height: 1em; color: var(--red); font: 600 12px var(--mono); }
.auth-msg:empty { min-height: 0; margin-top: -15px; }
.auth-note { margin: 0; line-height: 1.55; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .panel-in, tbody tr { opacity: 1; transform: none; }
}

/* ---------- section nav ---------- */
.section-nav { position: sticky; top: 10px; z-index: 20; display: flex; align-items: center; gap: 12px; margin: 14px 0 0; padding: 5px 5px 5px 6px;
  background: rgba(6, 10, 20, .74); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--line); border-radius: calc(var(--r-md) + 4px); box-shadow: 0 16px 40px -20px rgba(0, 0, 0, .9); }
.nav-links { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; flex: 1; min-width: 0; }
.nav-links::-webkit-scrollbar { display: none; }
.nav-links a { position: relative; font: 600 10.5px var(--hud); letter-spacing: .16em; color: var(--muted); text-decoration: none; padding: 9px 12px;
  white-space: nowrap; border-radius: var(--r-sm); transition: color .2s, background-color .2s; }
.nav-links a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 3px; height: 2px; border-radius: 2px; background: var(--grad);
  transform: scaleX(0); transition: transform .35s var(--ease); }
.nav-links a:hover { color: var(--text); background: rgba(255, 255, 255, .035); }
.nav-links a.on { color: #fff; background: rgba(94, 240, 255, .08); }
.nav-links a.on::after { transform: scaleX(1); box-shadow: 0 0 8px rgba(94, 240, 255, .7); }
.nav-total { display: flex; align-items: baseline; gap: 9px; padding: 7px 14px; white-space: nowrap; flex: none;
  font: 600 14px var(--mono); color: #fff; font-variant-numeric: tabular-nums;
  border-radius: var(--r-sm); background: var(--grad-soft); box-shadow: inset 0 0 0 1px rgba(110, 243, 255, .25); animation: panelIn .5s var(--ease) both; }
.nav-total i { font: 600 9px var(--hud); font-style: normal; letter-spacing: .2em; color: var(--muted); }
.nav-total em { font-style: normal; font-size: 11px; font-weight: 500; }
body.wallet-filtered .nav-total { box-shadow: inset 0 0 0 1px rgba(255, 190, 85, .5); background: rgba(255, 190, 85, .08); }
#secOverview, #secClaims, #secHistory, #secAllocation, #secHoldings, #secCalendar, #configPanel { scroll-margin-top: 74px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

/* ---------- onboarding ---------- */
.onboard { border-color: rgba(110, 200, 255, .26); padding: 22px;
  background: radial-gradient(520px 260px at 100% 0%, rgba(160, 125, 255, .16), transparent 70%),
              radial-gradient(420px 240px at 0% 100%, rgba(94, 240, 255, .1), transparent 70%), linear-gradient(180deg, var(--panel-hi), var(--panel)); }
.onboard h2 { font-size: 14px; }
.onboard-steps { list-style: none; counter-reset: ob; margin: 2px 0 20px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.onboard-steps li { position: relative; counter-increment: ob; border: 1px solid var(--line); border-radius: var(--r-md); padding: 14px 16px 15px;
  background: rgba(6, 11, 22, .55); display: flex; flex-direction: column; gap: 4px; transition: border-color .3s, transform .3s var(--ease); }
.onboard-steps li:hover { border-color: rgba(110, 215, 255, .3); transform: translateY(-2px); }
.onboard-steps li::before { content: "0" counter(ob); font: 600 22px/1 var(--display); margin-bottom: 8px;
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.onboard-steps li:not(:last-child)::after { content: ""; position: absolute; top: 25px; right: -15px; width: 16px; height: 1px;
  background: linear-gradient(90deg, rgba(110, 243, 255, .6), rgba(181, 123, 255, .6)); }
.onboard-steps b { color: #fff; font-weight: 600; font-size: 15.5px; }
.onboard-steps span { color: var(--text-2); font-size: 14px; line-height: 1.5; }
.onboard-form { margin-bottom: 8px; padding: 6px; border: 1px solid rgba(110, 215, 255, .22); border-radius: calc(var(--r-md) + 2px); background: rgba(4, 8, 16, .7); }
.onboard-form input { font-size: 14px; padding: 11px 12px; border-color: transparent; background: transparent; }
.onboard-form input:focus { background: rgba(94, 240, 255, .04); }
.onboard-form input.narrow { border-left: 1px solid var(--line); border-radius: 0; }
.onboard-form .btn-primary { padding: 11px 20px; }
#obHint { padding-left: 4px; }

/* ---------- holdings tools ---------- */
.hold-csv { margin-left: auto; padding: 6px 12px; font-size: 11px; letter-spacing: .1em; display: inline-flex; align-items: center; gap: 7px; }
.hold-csv::before { content: ""; width: 11px; height: 11px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v7M3 5.5 6 8.5l3-3M1.5 11h9' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v7M3 5.5 6 8.5l3-3M1.5 11h9' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.hold-csv:disabled { opacity: .35; cursor: default; }
.hold-tools { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.hold-tools input { max-width: 360px; padding: 9px 12px 9px 36px; -webkit-appearance: none; appearance: none;
  background: rgba(6, 11, 22, .7) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Ccircle cx='6' cy='6' r='4.5' fill='none' stroke='%237d93aa' stroke-width='1.5'/%3E%3Cpath d='M9.5 9.5 13 13' stroke='%237d93aa' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 13px center; }
.hold-tools input::-webkit-search-cancel-button { filter: grayscale(1) brightness(1.4); cursor: pointer; }
.holdings-table th[data-sort] { cursor: pointer; user-select: none; transition: color .2s; }
.holdings-table th[data-sort]:hover { color: var(--text); }
.holdings-table th.sorted { color: var(--cyan); }
.holdings-table th.sorted::after { content: "▲"; display: inline-block; margin-left: 5px; font-size: 8px; vertical-align: 1px; transition: transform .25s var(--ease); }
.holdings-table th.sorted.desc::after { transform: rotate(180deg); }
#walletFilter { max-width: 220px; border-radius: var(--r-pill); padding-left: 14px; font-size: 12px; letter-spacing: .06em; }
body.wallet-filtered #walletFilter { border-color: rgba(255, 190, 85, .7); color: var(--amber); background-color: rgba(255, 190, 85, .08);
  box-shadow: 0 0 0 3px rgba(255, 190, 85, .1); }
body.wallet-filtered .reactor-core .label { color: var(--amber); }

/* ---------- time machine range ---------- */
.tm-range { display: flex; align-items: center; gap: 12px; margin: -4px 0 12px; flex-wrap: wrap; }
.tm-change { font: 600 11.5px var(--mono); color: var(--muted); padding: 4px 11px; border: 1px solid var(--line); border-radius: var(--r-pill);
  background: rgba(6, 11, 22, .55); font-variant-numeric: tabular-nums; cursor: help; animation: panelIn .4s var(--ease) both; }
.tm-change:empty { display: none; }
.tm-change.up { border-color: rgba(62, 242, 164, .35); background: rgba(62, 242, 164, .08); }
.tm-change.down { border-color: rgba(255, 79, 107, .35); background: rgba(255, 79, 107, .08); }

/* ---------- mobile ---------- */
@media (max-width: 700px) {
  main { padding: 12px 12px 56px; }
  .panel { padding: 15px; border-radius: 16px; }
  .hud-top { gap: 12px; padding-bottom: 12px; }
  .brand { flex: 1; min-width: 0; }
  .logo { width: 36px; height: 36px; }
  .brand-name { font-size: 15px; letter-spacing: .16em; }
  .brand-sub { font-size: 9.5px; letter-spacing: .1em; }
  .hud-meta .clock { display: none; }
  .hud-meta { order: 0; }
  .controls { width: 100%; gap: 8px; }
  .controls #refresh { margin-left: auto; }
  #walletFilter { flex: 1 1 100%; max-width: none; order: 5; }
  .user-chip { width: 100%; justify-content: space-between; order: 6; }
  .section-nav { top: 6px; gap: 6px; padding: 4px; }
  .nav-links { mask-image: linear-gradient(90deg, #000 85%, transparent); -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .nav-links a { padding: 8px 10px; letter-spacing: .12em; }
  .nav-total { padding: 6px 10px; font-size: 12px; gap: 6px; }
  .nav-total i { display: none; }
  .nav-total em { display: none; }
  .onboard { padding: 16px; }
  .onboard-steps { grid-template-columns: 1fr; gap: 10px; }
  .onboard-steps li:not(:last-child)::after { top: auto; bottom: -11px; right: auto; left: 28px; width: 1px; height: 10px; }
  .onboard-form input, .onboard-form input.narrow { flex-basis: 100%; max-width: none; border-left: 0; }
  .onboard-form input.narrow { border-top: 1px solid var(--line); border-radius: 0; }
  .onboard-form .btn-primary { flex-basis: 100%; }
  .total { font-size: 28px; }
  /* phones: keep ASSET · CHAIN · VALUE (24h lives in MOVERS, the rest in the CSV export and the LP cards) */
  .holdings-table .col-amount, .holdings-table .col-price, .holdings-table .col-24h, .holdings-table .col-share,
  .holdings-table tr:not(.detail) td:nth-child(3), .holdings-table tr:not(.detail) td:nth-child(4),
  .holdings-table tr:not(.detail) td:nth-child(5), .holdings-table tr:not(.detail) td:nth-child(7),
  .holdings-table td:nth-child(2) .muted { display: none; }
  .holdings-table tr:not(.detail) td:first-child { white-space: normal; }
  .holdings-table th, .holdings-table td { padding: 9px 4px; }
  .hold-tools input { max-width: none; flex-basis: 100%; }
  .hold-tools .seg { width: 100%; overflow-x: auto; scrollbar-width: none; }
  .hold-tools .seg button { flex: 1; }
  .bars .b { grid-template-columns: 74px 1fr 76px; gap: 10px; }
  .ev { grid-template-columns: 44px 40px 1fr; }
  .ev .fc { display: none; }
  .cal { grid-template-columns: 1fr; }
  .auth-box { padding: 24px 18px 20px; }
  #bootLog { font-size: 10px; }
  .boot-title { font-size: 18px; }
  .tm-ctrl { margin-left: 0; }
}
.status .warn { color: var(--amber); }
/* one-click "scan my sign-in wallet" */
.mine-btn { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 16px; font-family: var(--hud); letter-spacing: .12em;
  border-color: #9b6bff; color: #e2d6ff; background: linear-gradient(90deg, rgba(155, 107, 255, .25), rgba(62, 230, 255, .12)); }
.mine-btn:hover { color: #fff; box-shadow: 0 0 18px -4px rgba(155, 107, 255, .6); }
.mine-btn.small { margin-top: 0; padding: 7px 12px; font-size: 11px; }
.mine-btn .addr { font-size: 11px; opacity: .75; letter-spacing: 0; }

/* ---------- admin: crew manifest ---------- */
.tag-amber { border-color: var(--amber); color: var(--amber); }
.admin-panel .admin-actions { margin-left: auto; display: flex; gap: 8px; }
.admin-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin-bottom: 14px; }
.admin-totals div { border: 1px solid var(--line); border-radius: var(--r-md, 10px); padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.admin-totals span { font: 700 9px var(--hud); letter-spacing: .16em; color: var(--muted); }
.admin-totals b { font: 600 22px var(--mono); color: var(--text); }
.admin-table td { vertical-align: top; }
.admin-table td:first-child { white-space: normal; word-break: break-all; max-width: 380px; }
.admin-table td:first-child .addr { font-size: 12px; }

/* ---------- footer + privacy ---------- */
.site-foot { display: flex; justify-content: center; gap: 14px; padding: 28px 0 8px; }
.site-foot a, .auth-note a { color: var(--cyan); text-decoration: none; }
.site-foot a:hover, .auth-note a:hover { text-decoration: underline; }
dialog.privacy { max-width: 560px; width: calc(100% - 32px); border: 1px solid var(--line-hi); border-radius: 14px; padding: 22px 24px;
  background: var(--bg); color: var(--text); font: 400 14px/1.55 var(--ui); }
dialog.privacy::backdrop { background: rgba(2, 6, 12, .75); backdrop-filter: blur(4px); }
dialog.privacy h3 { margin: 16px 0 6px; }
dialog.privacy ul { padding-left: 18px; margin: 0; }
dialog.privacy li { margin: 4px 0; }
dialog.privacy .btn-primary { margin-top: 16px; }