/* FOMOBOT PWA UI v10 — dark iOS + neon accents · desktop pixel desk ≥1100px · PAPER always */
:root {
  --bg: #000;
  --text: #fff;
  --sec: rgba(235,235,245,0.6);
  --ter: rgba(235,235,245,0.3);
  --sep: rgba(84,84,88,0.55);
  --card: #1c1c1e;
  --card2: #2c2c2e;
  --green: #00d35a;
  --red: #ff453a;
  --orange: #ff9f0a;
  --cyan: #64d2ff;
  --blue: #0a84ff;
  --yellow: #ffd60a;
  --pink: #ff6b9a;
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);
  --tab-h: 56px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body {
  margin:0; padding:0; background:var(--bg); color:var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
  font-size: 15px; min-height: 100%; overscroll-behavior: none;
}
.hidden { display: none !important; }
.num, .odometer { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }

/* ----- Unlock ----- */
.auth-gate {
  min-height:100dvh; display:flex; align-items:center; justify-content:center;
  padding:24px; position:relative; overflow:hidden;
}
.auth-glow {
  position:absolute; width:280px; height:280px; border-radius:50%;
  background: radial-gradient(circle, rgba(0,211,90,0.35), rgba(10,132,255,0.12), transparent 70%);
  filter: blur(8px); top:18%; left:50%; transform:translateX(-50%);
  animation: glowPulse 4s ease-in-out infinite;
}
@keyframes glowPulse {
  0%,100% { opacity:.7; transform:translateX(-50%) scale(1); }
  50% { opacity:1; transform:translateX(-50%) scale(1.08); }
}
.auth-card {
  position:relative; z-index:1; width:100%; max-width:360px;
  background:rgba(28,28,30,0.92); border:1px solid rgba(0,211,90,0.25);
  border-radius:24px; padding:32px 22px; box-shadow:0 0 40px rgba(0,211,90,0.12);
}
.auth-logo {
  width:56px; height:56px; border-radius:16px; margin:0 auto 12px;
  display:flex; align-items:center; justify-content:center;
  font-size:28px; font-weight:800; color:#000; background:var(--green);
  box-shadow:0 0 24px rgba(0,211,90,0.55);
}
.auth-card h1 { margin:0 0 4px; font-size:28px; font-weight:700; text-align:center; }
.auth-card .sec { text-align:center; }
.auth-hint { color:var(--sec); font-size:13px; margin:14px 0 0; line-height:1.4; text-align:center; }
.auth-hint code { color:var(--cyan); font-size:12px; }
.auth-card input {
  width:100%; margin:16px 0 12px; padding:14px 16px; border-radius:14px;
  border:1px solid var(--sep); background:#000; color:#fff; font-size:16px; min-height:48px;
}
.auth-card input:focus { outline:none; border-color:var(--green); box-shadow:0 0 0 3px rgba(0,211,90,0.2); }
.auth-foot { margin-top:16px; font-size:12px; }
.err { color:var(--red); font-size:13px; min-height:18px; text-align:center; }

#app {
  min-height:100dvh; padding-bottom: calc(var(--tab-h) + var(--safe-b) + 8px);
  padding-top: var(--safe-t); position:relative;
}
.err-bar { background:rgba(255,69,58,0.15); color:var(--red); padding:8px 16px; font-size:13px; }

.nav {
  display:flex; align-items:center; gap:8px; padding:8px 12px; position:sticky; top:0;
  background:rgba(0,0,0,0.82); backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px); z-index:20; min-height:48px;
}
.nav-title { flex:1; font-size:17px; font-weight:600; }
.chev { color:var(--sec); }
.icon-btn {
  min-width:44px; min-height:44px; border:0; background:transparent; color:#fff;
  font-size:20px; border-radius:22px; position:relative;
  display:inline-flex; align-items:center; justify-content:center;
}
.avatar {
  background:linear-gradient(135deg, #2c2c2e, #1c1c1e); width:36px; height:36px;
  min-width:36px; min-height:36px; border-radius:18px; font-size:14px; font-weight:700;
}
.neon-ring { box-shadow:0 0 0 1.5px rgba(0,211,90,0.55), 0 0 12px rgba(0,211,90,0.25); }
.dot {
  position:absolute; top:10px; right:10px; width:8px; height:8px; border-radius:4px;
  background:var(--green); box-shadow:0 0 8px var(--green);
}

.pad { padding: 0 16px 24px; }

/* Tab slide */
.tab { display:none; opacity:0; transform:translateX(12px); }
.tab.active {
  display:block; animation: tabIn 280ms var(--ease) forwards;
}
@keyframes tabIn {
  from { opacity:0; transform:translateX(18px); }
  to { opacity:1; transform:translateX(0); }
}
.overlay {
  position:fixed; inset:0; background:#000; z-index:40; overflow-y:auto;
  padding-top: var(--safe-t); padding-bottom: calc(24px + var(--safe-b));
  transform: translateX(100%); transition: transform 320ms var(--ease);
}
.overlay.open { transform: translateX(0); }
.overlay.hidden { display:none !important; }

.bal-row { display:flex; align-items:baseline; gap:10px; margin-top:8px; flex-wrap:wrap; }
.odometer {
  font-family: -apple-system, "SF Pro Display", sans-serif; font-size:66px; font-weight:700;
  letter-spacing:-1.5px; line-height:1; display:inline-flex; align-items:flex-end;
}
.odometer.sm { font-size:40px; }
.odometer .od-digit {
  display:inline-block; height:1em; overflow:hidden; position:relative;
  width:0.58em; text-align:center; vertical-align:baseline;
}
.odometer .od-digit .strip {
  display:block; will-change: transform;
}
.odometer .od-digit .strip span {
  display:block; height:1em; line-height:1em; text-align:center;
}
.odometer .od-sep { display:inline-block; padding:0 1px; vertical-align:baseline; }

.bal-meta { display:flex; align-items:center; gap:8px; margin:6px 0 12px; color:var(--sec); }
.pnl.pos { color:var(--green); text-shadow:0 0 12px rgba(0,211,90,0.35); }
.pnl.neg { color:var(--red); text-shadow:0 0 12px rgba(255,69,58,0.35); }

.pill {
  display:inline-flex; align-items:center; padding:3px 8px; border-radius:999px; font-size:12px;
  font-weight:600; font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
.pill.paper { background:rgba(255,159,10,0.18); color:var(--orange); }
.pill.green { background:rgba(0,211,90,0.18); color:var(--green); }
.pill.cyan { background:rgba(100,210,255,0.18); color:var(--cyan); }
.pill.red { background:rgba(255,69,58,0.18); color:var(--red); }
.glow-orange { box-shadow:0 0 12px rgba(255,159,10,0.35); }
.glow-green { box-shadow:0 0 12px rgba(0,211,90,0.35); }

.chart-wrap { position:relative; height:180px; margin:4px 0 8px; border-radius:12px; overflow:hidden; }
.chart-wrap.tall { height:220px; }
.chart-wrap canvas { width:100%; height:100%; display:block; }
.chart-empty {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  color:var(--sec); font-size:14px; pointer-events:none;
}

.range-switch { display:flex; gap:4px; margin-bottom:18px; background:rgba(44,44,46,0.45); border-radius:10px; padding:3px; }
.range-switch button {
  flex:1; min-height:34px; border:0; border-radius:8px; background:transparent;
  color:var(--sec); font-size:13px; font-weight:600;
}
.range-switch button.on {
  background:var(--card2); color:#fff;
  box-shadow:0 0 0 1px rgba(0,211,90,0.25), 0 0 10px rgba(0,211,90,0.12);
}

.sec-head {
  display:flex; justify-content:space-between; align-items:center; margin:16px 0 10px;
  font-size:17px; font-weight:600;
}
.sec-head .link, .link { background:0; border:0; color:var(--blue); font-size:15px; min-height:44px; }
.sec { color:var(--sec); font-size:13px; }

.carousel {
  display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; padding-bottom:8px; margin:0 -16px;
  padding-left:16px; padding-right:16px;
}
.carousel::-webkit-scrollbar { display:none; }
.agent-card {
  flex:0 0 calc(100vw - 48px); max-width:420px; min-height:210px;
  border-radius:22px; background:var(--card); scroll-snap-align:start;
  padding:18px; display:flex; flex-direction:column; gap:8px;
  border:1px solid transparent; position:relative; overflow:hidden;
}
.agent-card::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,0.04), transparent 40%);
}
.agent-card h3 { margin:0; font-size:20px; font-weight:600; }
.agent-card .tag { font-size:13px; color:var(--sec); }
.agent-card .feed { flex:1; overflow:hidden; font-size:13px; color:var(--sec); }
.agent-card .feed .killed { color:var(--ter); text-decoration:line-through; }
.agent-card .feed .pass { color:var(--cyan); }
.agent-card[data-agent="scanner"] { border-color:rgba(100,210,255,0.35); }
.agent-card[data-agent="auditor"] { border-color:rgba(255,255,255,0.2); }
.agent-card[data-agent="analyst"] { border-color:rgba(255,214,10,0.35); }
.agent-card[data-agent="executor"] { border-color:rgba(0,211,90,0.4); box-shadow:0 0 20px rgba(0,211,90,0.08); }
.agent-card[data-agent="risk"] { border-color:rgba(255,107,154,0.4); }
.layer-grid { display:grid; grid-template-columns:1fr 1fr; gap:4px; }
.layer-strip { height:8px; border-radius:4px; background:var(--card2); }
.layer-strip.ok { background:var(--green); box-shadow:0 0 6px rgba(0,211,90,0.5); }
.layer-strip.bad { background:var(--red); }
.score-ring { width:72px; height:72px; min-width:72px; min-height:72px; align-self:center; }

.list { display:flex; flex-direction:column; }
.list .row-item {
  display:flex; align-items:center; gap:12px; min-height:56px; padding:10px 0;
  border-bottom:0.5px solid var(--sep); cursor:pointer;
}
.list .row-item .title { font-weight:600; }
.list .row-item .sub { color:var(--sec); font-size:13px; }
.list .row-item .right { margin-left:auto; text-align:right; font-variant-numeric:tabular-nums; }
.list .row-item .right.pos { color:var(--green); }
.list .row-item .right.neg { color:var(--red); }

.card { background:var(--card); border-radius:14px; padding:14px 16px; margin-bottom:10px; }
.ticket-banner { border:1px solid var(--orange); color:var(--orange); }
.row { display:flex; align-items:center; gap:8px; }
.row.between { justify-content:space-between; min-height:44px; }
.coin-meta { gap:8px; align-items:center; margin:8px 0; }
.stats { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:12px 0; }
.stats .stat { background:var(--card); border-radius:12px; padding:12px; }
.stats .stat .k { color:var(--sec); font-size:12px; }
.stats .stat .v { font-size:17px; font-weight:600; margin-top:4px; font-variant-numeric:tabular-nums; }

.legend-row { display:flex; gap:12px; flex-wrap:wrap; margin:-4px 0 8px; font-size:11px; color:var(--sec); }
.leg::before { content:""; display:inline-block; width:10px; height:2px; margin-right:5px; vertical-align:middle; }
.leg.buy::before { background:#0a84ff; }
.leg.trail::before { background:#ff9f0a; border-top:1px dashed #ff9f0a; height:0; }
.leg.stop::before { background:#ff453a; }

.btn {
  min-height:44px; border:0; border-radius:12px; padding:0 16px;
  font-size:16px; font-weight:600; cursor:pointer;
}
.btn.primary { background:var(--green); color:#000; width:100%; }
.glow-green-btn { box-shadow:0 0 20px rgba(0,211,90,0.35); }
.btn.block { display:flex; align-items:center; justify-content:center; text-decoration:none; margin-top:12px; }
.btn.ghost { background:var(--card); color:#fff; width:100%; margin-top:8px; }
.btn.ghost.danger { color:var(--red); }
.btn:disabled { opacity:0.4; }
.cmd-row { gap:8px; margin-top:8px; }
.cmd-row input {
  flex:1; min-height:44px; border-radius:10px; border:1px solid var(--sep);
  background:#000; color:#fff; padding:0 12px; font-size:16px;
}
.cmd-send { width:auto; padding:0 18px; }
.cmd-out { white-space:pre-wrap; margin-top:10px; font-size:13px; max-height:220px; overflow:auto; }

.seg { display:flex; background:var(--card2); border-radius:10px; padding:2px; }
.seg button {
  min-height:36px; min-width:72px; border:0; background:transparent; color:var(--sec);
  border-radius:8px; font-weight:600;
}
.seg button.on { background:#fff; color:#000; }

.switch { position:relative; width:51px; height:31px; }
.switch input { opacity:0; width:0; height:0; }
.switch span { position:absolute; inset:0; background:var(--card2); border-radius:31px; transition:.2s; }
.switch span:before {
  content:""; position:absolute; width:27px; height:27px; left:2px; top:2px;
  background:#fff; border-radius:50%; transition:.2s;
}
.switch input:checked + span { background:var(--green); }
.switch input:checked + span:before { transform:translateX(20px); }

.tabbar {
  position:fixed; left:0; right:0; bottom:0; height: calc(var(--tab-h) + var(--safe-b));
  padding-bottom: var(--safe-b); display:flex; background:rgba(28,28,30,0.92);
  backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-top:0.5px solid var(--sep); z-index:30;
}
.tabbar button {
  flex:1; border:0; background:transparent; color:var(--ter); font-size:10px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-height:44px;
}
.tabbar button .ti { font-size:18px; line-height:1; }
.tabbar button.on { color:var(--blue); text-shadow:0 0 10px rgba(10,132,255,0.45); }

.empty { text-align:center; color:var(--sec); padding:48px 16px; }
.skeleton {
  background:var(--card); border-radius:12px; height:56px; margin-bottom:8px;
  animation: pulse 1.2s ease-in-out infinite;
}
@keyframes pulse { 0%,100%{opacity:.5} 50%{opacity:1} }

.disc-stage { position:relative; height:168px; margin:8px 0 4px; }
.disc-stage canvas { width:100%; height:160px; display:block; }
.beam-glow {
  position:absolute; left:50%; width:4px; height:24px; margin-left:-2px; top:8px;
  background:linear-gradient(180deg, #64d2ff, transparent); border-radius:2px;
  box-shadow:0 0 16px #64d2ff; opacity:0; pointer-events:none;
}
.beam-glow.on { opacity:1; transition: top 280ms linear; }

.audit-status { font-size:20px; font-weight:600; margin:12px 0 8px; }
.audit-banner {
  border-radius:12px; padding:12px 14px; font-weight:600; margin-bottom:10px; font-size:15px;
}
.audit-banner.clear {
  background:rgba(0,211,90,0.15); color:var(--green);
  border:1px solid rgba(0,211,90,0.4); box-shadow:0 0 16px rgba(0,211,90,0.15);
}
.audit-banner.reject {
  background:rgba(255,69,58,0.15); color:var(--red);
  border:1px solid rgba(255,69,58,0.4); box-shadow:0 0 16px rgba(255,69,58,0.15);
}

.search {
  flex:1; min-height:40px; border:0; border-radius:10px; background:var(--card2);
  color:#fff; padding:0 12px; font-size:16px;
}
a.card { text-decoration:none; color:inherit; display:flex; }
button.card { width:100%; text-align:left; border:0; color:inherit; font:inherit; cursor:pointer; }
.agent-full { background:var(--card); border-radius:16px; padding:16px; margin-bottom:12px; }
.agent-full h3 { margin:0 0 4px; font-size:18px; }
.decisions { margin-top:8px; max-height:240px; overflow-y:auto; }
.decisions .d { padding:8px 0; border-bottom:0.5px solid var(--sep); font-size:13px; }
.decisions .d a { color:var(--cyan); text-decoration:none; }
.settings-group { background:var(--card); border-radius:14px; padding:12px 16px; margin-bottom:10px; }
.settings-group h4 { margin:0 0 8px; font-size:15px; color:var(--sec); font-weight:600; }
.settings-group .srow {
  display:flex; flex-direction:column; gap:4px; padding:10px 0;
  border-bottom:0.5px solid var(--sep);
}
.settings-group .srow:last-child { border-bottom:0; }
.settings-group label { font-size:14px; }
.settings-group .controls { display:flex; gap:8px; align-items:center; }
.settings-group input[type=range] { flex:1; }
.settings-group input[type=number], .settings-group input[type=text] {
  width:88px; min-height:36px; border-radius:8px; border:1px solid var(--sep);
  background:#000; color:#fff; padding:0 8px; font-variant-numeric:tabular-nums;
}
.pos-card { border:1px solid rgba(0,211,90,0.3); }

/* Confetti + sell banner */
.confetti-layer {
  position:fixed; inset:0; pointer-events:none; z-index:50; width:100%; height:100%;
}
.sell-banner {
  position:fixed; left:16px; right:16px; top: calc(12px + var(--safe-t)); z-index:60;
  background:rgba(0,211,90,0.95); color:#000; font-weight:700; text-align:center;
  padding:14px 16px; border-radius:14px; box-shadow:0 8px 32px rgba(0,211,90,0.4);
  transform: translateY(-120%); transition: transform 360ms var(--ease);
}
.sell-banner.show { transform: translateY(0); }
.sell-banner.loss { background:rgba(255,69,58,0.95); box-shadow:0 8px 32px rgba(255,69,58,0.4); }

@media (prefers-reduced-motion: reduce) {
  .skeleton, .auth-glow, .tab.active { animation:none; }
  .overlay { transition:none; }
  * { scroll-behavior:auto; }
}

/* =====================================================================
   v10 DESKTOP DESK (≥1100px) — pixel agents on pedestals, CSS grid shell
   ===================================================================== */
.drawer-close { display:none; }
.desk { display:none; }
@media (max-width: 1099px) {
  .desk { display:none !important; }
}
@media (min-width: 1100px) {
  :root {
    --d-bg:#05070d; --d-panel:#0b0f1a; --d-line:#1b2236; --d-blue:#3d4bff;
    --d-mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, Menlo, monospace;
  }
  html, body { background:var(--d-bg); overflow:hidden; height:100%; }
  body.authed .desk:not(.hidden) { display:grid; }
  .desk {
    position:fixed; inset:0; grid-template-columns: 300px 1fr; gap:8px; padding:8px;
    background:var(--d-bg);
  }
  /* mobile shell becomes a right drawer on desktop */
  body:not(.drawer-open) #app { display:none !important; }
  /* coin / audit / search overlays live inside #app — let them float over the desk */
  body.overlay-open:not(.drawer-open) #app:not(.hidden) {
    display:block !important; position:fixed; top:0; right:0; width:0; height:0; padding:0; overflow:visible; z-index:45;
  }
  body.overlay-open:not(.drawer-open) #app > :not(.overlay):not(.confetti-layer):not(.sell-banner) { display:none !important; }
  .overlay .nav { padding-right:12px; }
  body.drawer-open #app {
    position:fixed; top:0; right:0; bottom:0; width:440px; z-index:45; overflow-y:auto;
    background:#000; border-left:1px solid var(--d-line); box-shadow:-20px 0 60px rgba(0,0,0,.6);
    padding-bottom: calc(var(--tab-h) + 8px);
  }
  body.drawer-open #app .tabbar { left:auto; right:0; width:440px; }
  body.drawer-open .drawer-close {
    display:flex; position:fixed; top:8px; right:8px; z-index:46; width:36px; height:36px;
    align-items:center; justify-content:center; border-radius:18px; border:1px solid var(--d-line);
    background:#111; color:#fff; cursor:pointer;
  }
  body.drawer-open #app .nav { padding-right:52px; }
  .overlay { left:auto; width:480px; border-left:1px solid var(--d-line); }
  .agent-card { flex-basis:380px; }

  /* ---- sidebar ---- */
  .d-side {
    background:var(--d-panel); border:2px solid var(--d-blue); border-radius:10px;
    display:flex; flex-direction:column; min-height:0; overflow:hidden;
    box-shadow:0 0 24px rgba(61,75,255,.18);
  }
  .d-side-head { display:flex; align-items:center; gap:2px; padding:8px 10px; border-bottom:1px solid var(--d-line); }
  .d-side-head .nav-title { font-size:15px; }
  .d-side-head .icon-btn { min-width:32px; min-height:32px; }
  .d-conn { font-size:10px; margin-left:4px; }
  .d-conn.off { background:rgba(255,69,58,.18); color:var(--red); }
  .d-side-scroll { flex:1; overflow-y:auto; padding:10px 12px 12px; scrollbar-width:thin; }
  .d-badges { display:flex; align-items:center; gap:8px; }
  .d-badges .sec { font-size:11px; }
  .d-odo { font-size:44px; margin-top:8px; }
  .d-side .bal-meta { font-size:12px; margin:6px 0 4px; }
  .d-chart { height:110px; margin:0 0 6px; border-bottom:1px solid var(--d-line); border-radius:0; }
  .d-chart .chart-empty { font-size:11px; align-items:flex-start; padding-top:30px; }
  .d-range { margin-bottom:10px; }
  .d-range button { min-height:26px; font-size:11px; cursor:pointer; }
  .d-range button[data-r="LIVE"].on { color:var(--green); }
  .d-side .sec-head { font-size:14px; margin:12px 0 8px; }
  .d-side .sec-head .link { font-size:12px; min-height:24px; cursor:pointer; }
  .d-running { color:var(--green); font-size:12px; font-weight:600; }
  .d-cards { display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .d-cards::-webkit-scrollbar { display:none; }
  .d-card {
    flex:0 0 100%; scroll-snap-align:start; background:#141826; border:1px solid var(--d-line);
    border-radius:12px; padding:12px; min-height:210px; cursor:pointer;
  }
  .d-card .dc-head { display:flex; align-items:center; gap:8px; }
  .d-card .dc-head b { font-size:14px; }
  .d-card .dc-head .pill { margin-left:auto; font-size:10px; }
  .d-card .dc-big { font-size:38px; font-weight:800; margin:8px 0 0; font-variant-numeric:tabular-nums; line-height:1; }
  .d-card .dc-sub { color:var(--sec); font-size:11px; margin:4px 0 8px; }
  .d-card .dc-feed { font-family:var(--d-mono); font-size:11px; display:flex; flex-direction:column; gap:3px; }
  .d-card .dc-feed div { display:flex; gap:6px; white-space:nowrap; overflow:hidden; }
  .d-card .dc-feed .x { color:var(--red); }
  .d-card .dc-feed .ok { color:var(--green); }
  .d-card .dc-feed .nm { color:#fff; font-weight:700; overflow:hidden; text-overflow:ellipsis; max-width:120px; }
  .d-card .dc-feed .lq { color:var(--sec); margin-left:auto; }
  .d-dots { display:flex; justify-content:center; gap:5px; margin-top:8px; }
  .d-dots i { width:5px; height:5px; border-radius:3px; background:var(--ter); }
  .d-dots i.on { background:#fff; width:14px; }
  .d-activity .row-item { min-height:40px; padding:6px 0; font-size:12px; }
  .d-activity .row-item .sub { font-size:11px; }
  .d-tabs { display:flex; border-top:1px solid var(--d-line); background:#090c15; }
  .d-tabs button {
    flex:1; border:0; background:transparent; color:var(--ter); font-size:10px; padding:6px 0;
    display:flex; flex-direction:column; align-items:center; gap:2px; cursor:pointer;
  }
  .d-tabs button .ti { font-size:15px; }
  .d-tabs button.on { color:#fff; }

  /* ---- main column ---- */
  .d-main {
    display:grid; grid-template-rows: auto minmax(300px, 1.35fr) minmax(200px, 1fr);
    gap:8px; min-height:0; min-width:0; position:relative;
  }
  .d-stats {
    font-family:var(--d-mono); font-size:11px; letter-spacing:.06em; color:var(--green);
    background:#03060a; border:2px solid var(--d-blue); border-radius:8px; padding:6px 12px;
    white-space:nowrap; overflow:hidden; display:flex; gap:9px; align-items:center;
    text-shadow:0 0 8px rgba(0,211,90,.45);
  }
  .d-stats b { color:#7dffb0; font-weight:700; }
  .d-stats .st-dim { color:#2f8a55; }
  .d-stats .st-paper { margin-left:auto; color:var(--orange); text-shadow:0 0 8px rgba(255,159,10,.5); }
  .d-stats .st-clk { color:#fff; }
  .d-err {
    position:absolute; top:40px; left:50%; transform:translateX(-50%); z-index:10;
    font-family:var(--d-mono); font-size:12px; color:var(--red); background:rgba(255,69,58,.12);
    border:1px solid rgba(255,69,58,.4); border-radius:6px; padding:6px 10px;
  }

  /* ---- stage ---- */
  .d-stage {
    position:relative; overflow:hidden; border:2px solid var(--d-blue); border-radius:10px;
    background:
      radial-gradient(ellipse at 50% 60%, rgba(61,75,255,.10), transparent 60%),
      linear-gradient(#0d1120 0, #0d1120 26%, #0a0d18 26%);
    image-rendering:pixelated; min-height:0;
  }
  .st-wall {
    position:absolute; left:0; right:0; top:0; height:26%; display:flex; align-items:center;
    justify-content:center; gap:4%; border-bottom:3px solid #1d2440;
    background: repeating-linear-gradient(90deg, #10152a 0 46px, #0e1326 46px 48px);
  }
  .st-sign {
    width:84px; height:62px; background:#151a2e; border:3px solid #2a3150; display:flex;
    flex-direction:column; align-items:center; justify-content:center; font-family:var(--d-mono);
    font-weight:900; font-size:15px; line-height:1.05; color:#e9ecff; position:relative;
    box-shadow:0 4px 0 #070912;
  }
  .st-sign i { position:absolute; bottom:6px; left:12px; right:12px; height:4px; background:var(--green); box-shadow:0 0 8px var(--green); }
  .st-screen {
    width:min(34%, 300px); height:70%; background:#020403; border:4px solid #262d48; position:relative;
    box-shadow:0 0 0 2px #070912, 0 0 30px rgba(0,211,90,.12) inset;
  }
  .st-screen canvas { width:100%; height:100%; display:block; }
  .st-empty {
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-family:var(--d-mono); font-size:11px; color:#2fd877; text-shadow:0 0 6px rgba(0,211,90,.6);
  }
  .st-empty::before { content:""; position:absolute; left:8%; right:8%; top:62%; height:2px; background:#0f7a3c; box-shadow:0 0 6px #00d35a; }
  .st-clock {
    font-family:var(--d-mono); font-size:22px; font-weight:800; color:#53ffa0; background:#020403;
    border:3px solid #262d48; padding:4px 10px; letter-spacing:.06em; text-shadow:0 0 10px rgba(0,211,90,.7);
  }
  .st-paper { display:flex; flex-direction:column; align-items:center; gap:8px; }
  .st-paper span {
    background:var(--orange); color:#000; font-family:var(--d-mono); font-weight:900; font-size:13px;
    padding:3px 10px; border:2px solid #000; box-shadow:0 0 14px rgba(255,159,10,.55);
  }
  .st-paper i { width:44px; height:30px; background:#1b2036; border:3px solid #262d48; }
  .st-floor {
    position:absolute; left:0; right:0; top:26%; bottom:0;
    background:
      repeating-linear-gradient(0deg, transparent 0 39px, rgba(61,75,255,.10) 39px 40px),
      repeating-linear-gradient(90deg, transparent 0 39px, rgba(61,75,255,.10) 39px 40px);
  }
  .st-plant {
    position:absolute; width:16px; height:16px; background:#2f8f3a;
    box-shadow: 0 -8px 0 #3fbf4d, -6px -4px 0 #2f8f3a, 6px -4px 0 #2f8f3a, 0 10px 0 4px #6b3d1f;
  }
  .st-plant.p1 { left:10%; top:36%; } .st-plant.p2 { right:10%; top:36%; }
  .st-plant.p3 { left:10%; bottom:16%; } .st-plant.p4 { right:10%; bottom:16%; }

  .pod {
    position:absolute; transform:translate(-50%, -50%); display:flex; flex-direction:column;
    align-items:center; cursor:pointer; z-index:2;
  }
  .pod .sprite { width:clamp(42px, 4.4vw, 88px); height:clamp(42px, 4.4vw, 88px); image-rendering:pixelated; filter:drop-shadow(0 0 10px var(--glow)); }
  .pod .sprite svg { width:100%; height:100%; display:block; }
  .pod.bob .sprite { animation: bob 2.4s ease-in-out infinite; }
  .pod.paused .sprite { filter:grayscale(1) brightness(.6); animation:none; }
  @keyframes bob { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-4px); } }
  .pod .desk-unit {
    width:46px; height:22px; margin-top:2px; background:#141a2c; border:3px solid #2a3150; position:relative;
  }
  .pod .desk-unit::after {
    content:""; position:absolute; left:5px; right:5px; top:3px; height:7px;
    background:var(--glow); opacity:.75; box-shadow:0 0 8px var(--glow);
  }
  .pod .pedestal {
    width:clamp(88px, 8vw, 160px); height:clamp(28px, 2.4vw, 48px); margin-top:-6px; border-radius:50%;
    background: radial-gradient(ellipse at 50% 40%, #2a3150 0, #1a1f35 60%, #10142a 100%);
    border:2px solid #343c62; box-shadow:0 6px 0 #070912, 0 0 22px rgba(61,75,255,.12);
  }
  .pod .pod-label {
    margin-top:8px; font-family:var(--d-mono); font-size:11px; color:#d7dbff; background:rgba(5,7,13,.85);
    border:1px solid var(--d-line); border-radius:4px; padding:2px 7px; white-space:nowrap;
  }
  .pod .pod-label b { color:#fff; }
  .pod .pod-label em { font-style:normal; color:var(--glow); margin-left:6px; }
  .pod:hover .pedestal { border-color:var(--glow); box-shadow:0 6px 0 #070912, 0 0 26px var(--glow); }

  /* ---- bottom panels ---- */
  .d-bottom { display:grid; grid-template-columns: 1.1fr 1fr 1.1fr; gap:8px; min-height:0; }
  .d-panel {
    background:var(--d-panel); border:2px solid var(--d-blue); border-radius:10px; min-height:0;
    display:flex; flex-direction:column; overflow:hidden;
  }
  .d-ph {
    display:flex; justify-content:space-between; align-items:center; padding:6px 10px;
    border-bottom:1px solid var(--d-line); font-family:var(--d-mono); font-size:11px; font-weight:700;
    letter-spacing:.04em; color:#e9ecff;
  }
  .d-ph .sec { font-size:10px; text-transform:uppercase; }
  .d-red { color:var(--red); font-size:10px; text-transform:uppercase; }
  .d-edit { font-family:var(--d-mono); font-size:10px; min-height:0; color:var(--sec); cursor:pointer; }
  .d-pb { flex:1; overflow-y:auto; padding:6px 10px; scrollbar-width:thin; margin:0; }
  .lg { display:flex; gap:8px; align-items:flex-start; padding:5px 0; border-bottom:1px solid rgba(27,34,54,.7); cursor:pointer; }
  .lg:hover { background:rgba(61,75,255,.06); }
  .lg .lg-ico { width:16px; height:16px; flex:0 0 16px; margin-top:2px; }
  .lg .lg-ico svg { width:100%; height:100%; image-rendering:pixelated; display:block; }
  .lg .lg-t { font-size:12px; font-weight:700; }
  .lg .lg-s { font-family:var(--d-mono); font-size:10.5px; color:var(--sec); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .lg .lg-s .x { color:var(--red); } .lg .lg-s .ok { color:var(--green); }
  .lg .lg-time { margin-left:auto; font-family:var(--d-mono); font-size:10px; color:var(--ter); white-space:nowrap; }
  .lg > div:nth-child(2) { min-width:0; }
  .d-empty { color:var(--sec); font-size:12px; line-height:1.5; padding:6px 0; }
  .d-code {
    font-family:var(--d-mono); font-size:11px; line-height:1.55; color:#cfd6ff; white-space:pre;
    background:#070a12;
  }
  .d-code .c { color:#5a6488; } .d-code .k { color:#ff7ab6; } .d-code .s { color:#ffd479; }
  .d-code .n { color:#7dffb0; } .d-code .b { color:#64d2ff; } .d-code .v { color:#c7a6ff; }
}
@media (min-width:1100px) and (prefers-reduced-motion: reduce) {
  .pod.bob .sprite { animation:none; }
}
@media (min-width:1100px) and (max-width:1320px) {
  .d-stats { font-size:10px; gap:6px; letter-spacing:.02em; }
  .pod .pod-label { font-size:10px; }
}

.coin-actions{display:flex;gap:8px;margin-top:12px}.coin-actions .btn{flex:1}.coin-warn{color:var(--orange);font-size:12px;margin-top:10px}.coin-note{margin-top:8px;font-size:11px}.btn.danger{background:#ff5a3c;color:#fff;border:0;border-radius:14px;min-height:48px;font-weight:700}
