/* Nexus Terminal styles — extracted from app.html 2026-07-04 */

    :root {
      --bg: #020409;
      --surface: #080d16;
      --surface2: #0d1422;
      --surface3: #111827;
      --border: #1a2235;
      --border2: #243048;
      --border3: #2d3e5a;
      --text: #e8edf5;
      --text-muted: #9aa8c0;
      --text-dim: #6f7fa0;
      --green: #00d68f;
      --green-dim: rgba(0, 214, 143, 0.12);
      --red: #ff4560;
      --red-dim: rgba(255, 69, 96, 0.12);
      --amber: #f59e0b;
      --amber-dim: rgba(245, 158, 11, 0.12);
      --cyan: #00c2ff;
      --cyan-dim: rgba(0, 194, 255, 0.1);
      --blue: #2563eb;
      --accent-cyan: #22d3ee;
      --gold: #f59e0b;
      --violet: #8b5cf6;
      --violet-dim: rgba(139,92,246,.14);
      --surface-accent: #0b111d;
      --shadow-soft: 0 8px 28px rgba(0,0,0,.36);
      --mono: 'Roboto Mono', monospace;
    }

    html[data-theme="day"] {
      color-scheme: light;
      --bg: #eef3fb;
      --surface: #f8fbff;
      --surface2: #edf4fd;
      --surface3: #e3edf8;
      --surface-accent: #ffffff;
      --border: #d4dfef;
      --border2: #bccbe0;
      --border3: #9cafc8;
      --text: #111827;
      --text-muted: #4b5d78;
      --text-dim: #71809a;
      --green: #008b68;
      --green-dim: rgba(0,139,104,.12);
      --red: #d7264b;
      --red-dim: rgba(215,38,75,.11);
      --amber: #b7791f;
      --amber-dim: rgba(183,121,31,.12);
      --cyan: #0077b6;
      --cyan-dim: rgba(0,119,182,.10);
      --blue: #315bdc;
      --accent-cyan: #0086c9;
      --gold: #b7791f;
      --violet: #6d28d9;
      --violet-dim: rgba(109,40,217,.12);
      --shadow-soft: 0 10px 28px rgba(30,54,90,.13);
    }

    * { box-sizing: border-box; margin: 0; padding: 0; }

    body {
      background: var(--bg);
      color: var(--text);
      font-family: 'Inter', sans-serif;
      overflow-x: hidden;
      min-height: 100vh;
    }

    /* === SCROLLBAR === */
    ::-webkit-scrollbar { width: 5px; height: 5px; }
    ::-webkit-scrollbar-track { background: var(--bg); }
    ::-webkit-scrollbar-thumb { background: var(--border2); border-radius: 3px; }
    ::-webkit-scrollbar-thumb:hover { background: var(--border3); }

    /* === QUOTE TICKER === */
    .market-ticker-tape { height:52px; overflow:hidden; background:#050a14; border-bottom:1px solid var(--border); position:relative; }
    .market-ticker-tape .tradingview-widget-container { height:52px !important; }
    .market-ticker-tape iframe { height:52px !important; }
    .ticker-control-btn {
      position:absolute;
      z-index:8;
      top:8px;
      right:10px;
      height:25px;
      padding:0 10px;
      border-radius:999px;
      border:1px solid rgba(34,211,238,.35);
      background:rgba(3,8,16,.86);
      color:var(--cyan);
      font-family:var(--mono);
      font-size:9px;
      font-weight:800;
      letter-spacing:.07em;
      cursor:pointer;
      opacity:0;
      pointer-events:none;
      transition:opacity .15s ease, border-color .15s ease, background .15s ease;
      text-transform:uppercase;
      white-space:nowrap;
    }
    .ticker-control-btn:hover { border-color:rgba(125,211,252,.8); background:rgba(7,18,32,.96); }
    .quote-ticker:hover .quote-submit-btn { opacity:1; pointer-events:auto; }
    .quote-ticker .ticker-control-btn { top:2px; right:8px; height:22px; font-size:8px; }
    .quote-submit-btn { right:8px; color:var(--text-muted); border-color:rgba(255,255,255,.16); }
    @media (min-width:901px) {
      body.market-tape-hidden .market-ticker-tape { display:none; }
      body.market-tape-hidden .app-container { height:calc(100vh - 78px); }
      /* Dashboard scrolls as one page inside the fixed-height app shell, so bottom
         content (System Thesis) is always reachable whether the tapes are shown or hidden. */
      #page-dashboard.page.active { flex:1 1 auto; min-height:0; height:auto; overflow-y:auto; }
    }
    .quote-ticker {
      background: #050a14;
      border-bottom: 1px solid var(--border);
      height: 28px;
      overflow: hidden;
      display: flex;
      align-items: center;
      position: relative;
    }
    .quote-ticker-label {
      flex-shrink: 0;
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 700;
      color: var(--cyan);
      letter-spacing: 0.08em;
      padding: 0 14px 0 14px;
      border-right: 1px solid var(--border);
      height: 100%;
      display: flex;
      align-items: center;
      background: #030810;
      text-transform: uppercase;
    }
    .quote-ticker-track {
      flex: 1;
      overflow: hidden;
      height: 100%;
      position: relative;
    }
    .quote-ticker-scroll {
      display: flex;
      align-items: center;
      height: 100%;
      white-space: nowrap;
      animation: tickerScroll 60s linear infinite;
    }
    .quote-ticker-scroll:hover { animation-play-state: paused; }
    .quote-item {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 11px;
      color: var(--text-muted);
      font-style: italic;
      padding: 0 40px;
    }
    .quote-item::before {
      content: '"';
      color: var(--cyan);
      font-size: 14px;
      font-style: normal;
    }
    .quote-item::after {
      content: '"';
      color: var(--cyan);
      font-size: 14px;
      font-style: normal;
    }
    @keyframes tickerScroll {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    /* === HEADER === */
    header {
      background: var(--surface);
      border-bottom: 1px solid var(--border);
      padding: 0 20px;
      height: 50px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: sticky;
      top: 0;
      z-index: 50;
    }

    .header-left { display: flex; align-items: center; gap: 20px; flex: 1; min-width: 0; }

    .logo-area {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .logo-area img { width: 22px; height: 22px; object-fit: contain; transform-origin: 50% 50%; transition: transform .15s ease; cursor: pointer; }
    .logo-area img:hover { transform: scale(1.08); }
    .logo-area img.spin { animation: nexusSpin .9s cubic-bezier(.4,0,.2,1); }
    @keyframes nexusSpin { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } }
    @media (prefers-reduced-motion: reduce) { .logo-area img.spin { animation: none; } }
    .logo-text {
      font-family: var(--mono);
      font-weight: 700;
      font-size: 13px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--text);
    }
    .logo-text span { color: var(--cyan); }

    .header-divider {
      width: 1px;
      height: 24px;
      background: var(--border);
    }

    /* BTC price in header */
    .header-price-widget {
      display: flex;
      align-items: center;
      gap: 12px;
      opacity: 0.62;
      padding: 3px 9px;
      border-radius: 6px;
      border: 1px solid transparent;
      transition: opacity .2s, background .2s, border-color .2s, box-shadow .2s;
    }
    .header-price-widget.active {
      opacity: 1;
      background: var(--surface2);
      border-color: var(--cyan);
      box-shadow: 0 0 10px rgba(0,194,255,0.18);
    }
    .header-price-widget.active .hpw-asset { color: var(--cyan); }
    .header-price-widget.active .hpw-price { color: var(--text); }
    .hpw-asset {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 700;
      color: var(--text-dim);
      letter-spacing: 0.06em;
    }
    .hpw-price {
      font-family: var(--mono);
      font-size: 15px;
      font-weight: 700;
      color: var(--green);
      letter-spacing: -0.01em;
      transition: color 0.15s;
    }
    .hpw-price.down { color: var(--red); }
    .hpw-change {
      font-family: var(--mono);
      font-size: 10px;
      padding: 2px 7px;
      border-radius: 3px;
      font-weight: 700;
    }
    .hpw-change.pos { background: var(--green-dim); color: var(--green); }
    .hpw-change.neg { background: var(--red-dim); color: var(--red); }

    .header-right { display: flex; align-items: center; gap: 12px; }

    .theme-toggle {
      display:inline-flex;
      align-items:center;
      gap:7px;
      height:30px;
      padding:0 10px;
      border-radius:999px;
      border:1px solid var(--border2);
      background:linear-gradient(135deg, rgba(0,194,255,.08), rgba(167,139,250,.08)), var(--surface2);
      color:var(--text-muted);
      font-family:var(--mono);
      font-size:9px;
      font-weight:800;
      letter-spacing:.08em;
      cursor:pointer;
      box-shadow:var(--shadow-soft);
      transition:all .15s ease;
      white-space:nowrap;
    }
    .theme-toggle:hover { border-color:var(--cyan); color:var(--cyan); transform:translateY(-1px); }
    .theme-toggle .theme-icon { font-size:12px; line-height:1; }
    .theme-toggle .theme-label { min-width:26px; text-align:left; }

    html[data-theme="day"] body {
      background:linear-gradient(180deg,#f6f9ff 0%, var(--bg) 160px);
    }
    html[data-theme="day"] .quote-ticker,
    html[data-theme="day"] .quote-ticker-label {
      background:#e8f0fb;
    }
    html[data-theme="day"] header,
    html[data-theme="day"] .sidebar,
    html[data-theme="day"] .panel,
    html[data-theme="day"] .main-area {
      box-shadow:0 1px 0 rgba(255,255,255,.6) inset;
    }
    html[data-theme="day"] .sidebar-scrim { background:rgba(15,23,42,.38); }
    html[data-theme="day"] .range-viz-bar { box-shadow:inset 0 0 0 1px rgba(15,23,42,.08); }
    html[data-theme="day"] input,
    html[data-theme="day"] textarea { color:var(--text); }
    html[data-theme="day"] .panel,
    html[data-theme="day"] .goods-card,
    html[data-theme="day"] .wire-item,
    html[data-theme="day"] .wire-side-top,
    html[data-theme="day"] .wire-side-bottom,
    html[data-theme="day"] .wire-mood-row,
    html[data-theme="day"] .wire-upcoming-item,
    html[data-theme="day"] .metric-box,
    html[data-theme="day"] .band-box,
    html[data-theme="day"] .next-forecast,
    html[data-theme="day"] .live-price-box,
    html[data-theme="day"] .dist-box,
    html[data-theme="day"] .sent-gauge {
      box-shadow: 0 1px 0 rgba(255,255,255,.75) inset, 0 10px 24px rgba(34,54,84,.07);
    }
    html[data-theme="day"] .wire-item.breaking { background:rgba(215,38,75,.045); }
    html[data-theme="day"] .wire-tape { background: #fff; }
    html[data-theme="day"] .wire-row:hover { background: rgba(139,92,246,.05); }
    html[data-theme="day"] .wire-row.wr-fresh { background: rgba(16,163,127,.05); }
    html[data-theme="day"] .wire-row.breaking { background: rgba(215,38,75,.045); }
    html[data-theme="day"] .wr-cat.cat-macro { color: #b45309; background: rgba(180,83,9,.10); }

    html[data-theme="day"] .wire-filter-btn.active,
    html[data-theme="day"] .goods-subbtn.active { color:#ffffff; }
    html[data-theme="day"] .range-bar-track,
    html[data-theme="day"] .cp-track,
    html[data-theme="day"] .dist-bar-track { background:#dbe7f6; }
    html[data-theme="day"] .chat-msg,
    html[data-theme="day"] .rail-wire-item,
    html[data-theme="day"] .reaction-chip { background:#ffffff; }
    html[data-theme="day"] .panel-head { background:#e7eff9; }
    html[data-theme="day"] .market-ticker-tape { background:#e8f0fb; }
    html[data-theme="day"] .tv-wrapper { background:#ffffff; }
    html[data-theme="day"] .chat-composer-v2 { background:linear-gradient(180deg,#f4f8fe,#e9f1fb); }
    html[data-theme="day"] .chat-composer-v2 input { background:#ffffff; border-color:var(--border2); box-shadow:none; }
    html[data-theme="day"] .chat-composer-v2 .gif-tool-btn { color:#075985; text-shadow:none; }
    /* day: mobile chat composer strip was hardcoded near-black (found in 2026-07-09 chat audit) */
    html[data-theme="day"] body.page-chat-active .chat-input-row,
    html[data-theme="day"] .chat-input-row {
      background:rgba(244,248,254,.98); border-top-color:rgba(30,64,120,.15);
      box-shadow:0 -10px 24px rgba(30,54,90,.12);
    }
    html[data-theme="day"] .chat-send-btn { text-shadow:none; }
    html[data-theme="day"] .chat-msg-actions,
    html[data-theme="day"] .emoji-pop,
    html[data-theme="day"] .gif-picker { box-shadow:0 4px 14px rgba(30,54,90,.16); }
    html[data-theme="day"] .ai-msg-body { box-shadow:0 1px 2px rgba(30,54,90,.10); }
    html[data-theme="day"] #ai-msgs { background:var(--bg); }

    .status-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      background: rgba(0, 214, 143, 0.06);
      border: 1px solid rgba(0, 214, 143, 0.2);
      color: var(--green);
      font-size: 10px;
      font-weight: 700;
      padding: 3px 10px;
      border-radius: 99px;
      font-family: var(--mono);
      letter-spacing: 0.04em;
    }
    .status-dot {
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: var(--green);
      animation: blink 2s infinite;
    }
    @keyframes blink {
      0%,100% { opacity: 1; box-shadow: 0 0 4px var(--green); }
      50% { opacity: 0.3; box-shadow: none; }
    }

    .utc-clock {
      font-family: var(--mono);
      font-size: 11px;
      color: var(--text-muted);
      letter-spacing: 0.04em;
    }



    .logout-btn {
      background: transparent;
      border: 1px solid var(--border2);
      color: var(--text-dim);
      cursor: pointer;
      font-family: var(--mono);
      font-size: 10px;
      padding: 4px 10px;
      border-radius: 3px;
      transition: all 0.2s;
      letter-spacing: 0.04em;
    }
    #logout-btn { display:none !important; }
    .logout-btn:hover { color: var(--red); border-color: var(--red); background: var(--red-dim); }
    .sidebar-disconnect {
      margin-top:10px;
      width:100%;
      height:34px;
      background:transparent;
      border:1px solid var(--border2);
      color:var(--text-dim);
      border-radius:6px;
      font-family:var(--mono);
      font-size:10px;
      font-weight:700;
      letter-spacing:.08em;
      cursor:pointer;
      display:none;
    }
    .sidebar-disconnect:hover { color:var(--red); border-color:var(--red); background:var(--red-dim); }
    /* ===== ALERTS ===== */
    .alert-bell { position:relative; background:transparent; border:1px solid var(--border); border-radius:6px; padding:4px 8px; font-size:14px; cursor:pointer; line-height:1; transition:all .15s ease; }
    .alert-bell:hover { border-color:var(--cyan); background:rgba(0,194,255,.08); }
    .alert-dot { position:absolute; top:1px; right:1px; width:8px; height:8px; background:var(--red); border-radius:50%; box-shadow:0 0 6px var(--red); }
    .alert-tray { position:absolute; top:52px; right:14px; width:340px; max-width:calc(100vw - 28px); max-height:60vh; overflow:hidden; background:var(--surface,#0d1117); border:1px solid var(--cyan); border-radius:10px; box-shadow:0 8px 40px rgba(0,0,0,.6); z-index:5000; display:flex; flex-direction:column; }
    .alert-tray-head { display:flex; justify-content:space-between; align-items:center; padding:10px 14px; border-bottom:1px solid var(--border); font-family:var(--mono); font-size:11px; font-weight:700; color:var(--cyan); letter-spacing:.06em; }
    .alert-clear-btn { background:transparent; border:none; color:var(--text-dim); font-family:var(--mono); font-size:10px; cursor:pointer; }
    .alert-clear-btn:hover { color:var(--red); }
    .alert-tray-body { overflow-y:auto; padding:6px; }
    .alert-empty { padding:24px 16px; text-align:center; color:var(--text-dim); font-family:var(--mono); font-size:10px; line-height:1.6; }
    .alert-item { display:flex; gap:9px; padding:9px 10px; border-radius:7px; margin-bottom:4px; background:var(--surface-accent,#11161f); border:1px solid var(--border); }
    .alert-item.unread { border-color:var(--cyan); background:rgba(0,194,255,.05); }
    .alert-ico { font-size:15px; line-height:1.2; flex-shrink:0; }
    .alert-body { flex:1; min-width:0; }
    .alert-title { font-family:var(--mono); font-size:11px; font-weight:700; color:var(--text); }
    .alert-sub { font-family:var(--mono); font-size:9.5px; color:var(--text-muted); margin-top:2px; line-height:1.4; }
    .alert-time { font-family:var(--mono); font-size:8.5px; color:var(--text-dim); margin-top:3px; }
    .al-edge .alert-ico { color:var(--amber); }
    .al-conv .alert-ico { color:var(--cyan); }
    .al-new .alert-ico  { color:var(--green); }
    .al-grade .alert-ico{ color:#a78bfa; }
    /* toggles */
    .alert-toggle-row { display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid var(--border); }
    /* Alert switches — modernized 2026-07-09 (same class names, zero JS change) */
    .alert-sw {
      position:relative; width:44px; height:24px; border-radius:24px; flex-shrink:0; border:none; cursor:pointer;
      background:#1c232e; box-shadow: inset 0 1px 3px rgba(0,0,0,.55), inset 0 0 0 1px rgba(148,163,184,.14);
      transition: background .22s cubic-bezier(.4,0,.2,1), box-shadow .22s;
    }
    .alert-sw:hover { box-shadow: inset 0 1px 3px rgba(0,0,0,.55), inset 0 0 0 1px rgba(148,163,184,.30); }
    .alert-sw.on {
      background: linear-gradient(90deg, #059669, var(--green, #34d399));
      box-shadow: inset 0 1px 2px rgba(0,0,0,.25), 0 0 10px rgba(52,211,153,.35);
    }
    .alert-sw::after {
      content:''; position:absolute; top:2px; left:2px; width:20px; height:20px; border-radius:50%;
      background: linear-gradient(180deg, #fff, #dbe3ee);
      box-shadow: 0 1px 3px rgba(0,0,0,.5);
      transition: transform .22s cubic-bezier(.34,1.4,.64,1);
    }
    .alert-sw.on::after { transform:translateX(20px); }
    .alert-sw:active::after { width:23px; }
    html[data-theme="day"] .alert-sw { background:#d7dfeb; box-shadow: inset 0 1px 2px rgba(34,54,84,.25); }
    .alert-chipset { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
    .alert-chip { padding:5px 11px; border-radius:6px; border:1px solid var(--border); background:transparent; color:var(--text-dim); font-family:var(--mono); font-size:10px; cursor:pointer; transition:all .12s; }
    .alert-chip:hover { border-color:rgba(0,194,255,.45); color:var(--text); }
    /* Selected: quiet cyan — professional, legible, no shouting */
    .alert-chip.on {
      border-color:var(--cyan); background:rgba(0,194,255,.14); color:var(--cyan); font-weight:700;
      box-shadow: inset 0 0 0 1px rgba(0,194,255,.25);
    }
    html[data-theme="day"] .alert-chip.on { background:rgba(0,140,200,.10); color:#0369a1; border-color:#0891b2; }
    .alert-armed-warn { color:var(--gold) !important; }
    .alert-setup-card.compact { padding:11px 14px !important; border-color:rgba(167,139,250,.55) !important; }
    .alert-setup-card.compact .alert-setup-body { display:none !important; }
    .alert-setup-top { display:flex; justify-content:space-between; align-items:center; gap:10px; }
    .alert-setup-toggle { background:rgba(167,139,250,.10); border:1px solid rgba(167,139,250,.45); color:#c4b5fd; border-radius:7px; padding:7px 10px; font-family:var(--mono); font-size:9px; font-weight:800; letter-spacing:.05em; cursor:pointer; white-space:nowrap; }
    .alert-setup-toggle:hover { background:rgba(167,139,250,.16); }
    .alert-setup-done { display:none; margin-top:4px; font-family:var(--mono); font-size:9px; color:var(--green); line-height:1.45; }
    .alert-setup-card.compact .alert-setup-done { display:block; }

    /* === LOCK SCREEN === */
    /* Boot view control — CSS wins over inline display so the correct view
       paints first with zero flash. */
    html[data-boot="app"] #locked-panel { display:none !important; }
    html[data-boot="signup"] #view-tiers,
    html[data-boot="login"]  #view-tiers,
    html[data-boot="app"]    #view-tiers { display:none !important; }
    html[data-boot="signup"] #view-signup { display:block !important; }
    html[data-boot="login"]  #view-login  { display:block !important; }
    .locked-screen {
      --bg: #020409;
      --surface: #080d16;
      --surface2: #0d1422;
      --surface3: #111827;
      --surface-accent: #0b111d;
      --border: #1a2235;
      --border2: #243048;
      --border3: #2d3e5a;
      --text: #e8edf5;
      --text-muted: #9aa8c0;
      --text-dim: #6f7fa0;
      --green: #00d68f;
      --green-dim: rgba(0, 214, 143, 0.12);
      --red: #ff4560;
      --red-dim: rgba(255, 69, 96, 0.12);
      --amber: #f59e0b;
      --amber-dim: rgba(245, 158, 11, 0.12);
      --cyan: #00c2ff;
      --cyan-dim: rgba(0, 194, 255, 0.1);
      --blue: #2563eb;
      --accent-cyan: #22d3ee;
      --gold: #f59e0b;
      position: fixed;
      top: 0; left: 0;
      width: 100vw; height: 100vh;
      background: rgba(2, 4, 9, 0.97);
      z-index: 200;
      display: flex;
      justify-content: center;
      align-items: center;
      backdrop-filter: blur(16px);
    }

    .locked-card {
      background: var(--surface);
      border: 1px solid var(--border2);
      border-radius: 12px;
      width: 460px;
      max-width: 92%;
      padding: 0;
      overflow: hidden;
      box-shadow: 0 30px 80px rgba(0,0,0,0.8), 0 0 0 1px rgba(0,194,255,0.05);
    }

    .locked-card-header {
      background: linear-gradient(135deg, #050d1c 0%, #080f1e 100%);
      border-bottom: 1px solid var(--border);
      padding: 28px 32px 24px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .locked-card-header::before {
      content: '';
      position: absolute;
      top: -40px; left: 50%; transform: translateX(-50%);
      width: 200px; height: 200px;
      background: radial-gradient(circle, rgba(0,194,255,0.06) 0%, transparent 70%);
      pointer-events: none;
    }

    .lock-logo {
      width: 48px;
      height: 48px;
      margin: 0 auto 14px;
      background: rgba(0,194,255,0.06);
      border: 1px solid rgba(0,194,255,0.15);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      overflow: hidden;
    }
    .lock-logo img { width: 38px; height: 38px; object-fit: contain; transform-origin: 50% 50%; cursor: pointer; transition: transform .15s ease; }
    .lock-logo img:hover { transform: scale(1.06); }
    .lock-logo img.spin { animation: nexusSpin .9s cubic-bezier(.4,0,.2,1); }
    img.spinmark { transition: transform .15s ease; }
    img.spinmark:hover { transform: scale(1.08); }
    img.spinmark.spin { animation: nexusSpin .9s cubic-bezier(.4,0,.2,1); }

    .locked-title {
      font-family: var(--mono);
      font-size: 16px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--text);
      margin-bottom: 6px;
    }
    .locked-title span { color: var(--cyan); }

    .locked-desc {
      font-size: 12px;
      color: var(--text-muted);
      line-height: 1.6;
    }

    .locked-card-body { padding: 24px 32px 28px; }

    .lock-feature-row {
      display: flex;
      gap: 10px;
      margin-bottom: 20px;
    }
    .lock-feature {
      flex: 1;
      background: #030710;
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 12px 10px;
      text-align: center;
      transition: all 0.3s ease;
    }
    .lock-feature-icon { font-size: 16px; margin-bottom: 4px; }
    .lock-feature-text { font-size: 10px; color: var(--text); font-family: var(--mono); }

    .lock-feature.cyan-glow {
      border-color: var(--cyan);
      box-shadow: 0 0 14px rgba(0, 194, 255, 0.25);
    }
    .lock-feature.cyan-glow .lock-feature-text {
      color: var(--cyan);
      text-shadow: 0 0 8px rgba(0, 194, 255, 0.4);
    }
    .lock-feature.green-glow {
      border-color: var(--green);
      box-shadow: 0 0 14px rgba(0, 214, 143, 0.25);
    }
    .lock-feature.green-glow .lock-feature-text {
      color: var(--green);
      text-shadow: 0 0 8px rgba(0, 214, 143, 0.4);
    }
    .lock-feature.gold-glow {
      border-color: var(--amber);
      box-shadow: 0 0 14px rgba(245, 158, 11, 0.25);
    }
    .lock-feature.gold-glow .lock-feature-text {
      color: var(--amber);
      text-shadow: 0 0 8px rgba(245, 158, 11, 0.4);
    }

    .unlock-label {
      display: block;
      font-size: 10px;
      font-weight: 700;
      color: var(--text-dim);
      text-transform: uppercase;
      letter-spacing: 0.08em;
      margin-bottom: 8px;
      font-family: var(--mono);
    }
    .unlock-row { display: flex; gap: 8px; margin-bottom: 10px; }
    .unlock-row input {
      flex: 1;
      height: 40px;
      padding: 0 14px;
      background: #020610;
      border: 1px solid var(--border2);
      border-radius: 6px;
      color: var(--text);
      font-family: var(--mono);
      font-size: 12px;
      transition: border-color 0.2s;
    }
    .unlock-row input:focus { outline: none; border-color: var(--cyan); box-shadow: 0 0 0 2px rgba(0,194,255,0.08); }
    .unlock-btn {
      height: 40px;
      padding: 0 18px;
      background: var(--cyan);
      border: none;
      border-radius: 6px;
      color: #000;
      font-weight: 700;
      cursor: pointer;
      font-family: var(--mono);
      font-size: 12px;
      letter-spacing: 0.04em;
      transition: all 0.2s;
      white-space: nowrap;
    }
    .unlock-btn:hover { box-shadow: 0 0 20px rgba(0,194,255,0.35); }
    .unlock-err {
      color: var(--red);
      font-size: 11px;
      font-family: var(--mono);
      display: none;
      margin-bottom: 12px;
    }
    .lock-footer-link {
      display: block;
      font-size: 11px;
      color: var(--text-dim);
      text-decoration: none;
      text-align: center;
      margin-top: 14px;
      transition: color 0.2s;
    }
    .lock-footer-link:hover { color: var(--cyan); }
    /* ===== Tier-first lock screen (B) ===== */
    .tier-cards { display:flex; flex-direction:column; gap:10px; margin-bottom:14px; }
    .tier-card { position:relative; text-align:left; padding:14px 16px; border:1px solid rgba(255,255,255,.10);
      border-radius:10px; background:rgba(255,255,255,.02); cursor:pointer; transition:border-color .18s, box-shadow .18s, transform .12s; }
    .tier-card:hover { border-color:var(--cyan); box-shadow:0 0 18px rgba(0,194,255,.18); transform:translateY(-1px); }
    .tier-card.tc-featured { border-color:rgba(251,139,30,.5); box-shadow:0 0 14px rgba(251,139,30,.12); }
    .tier-card.tc-featured:hover { border-color:var(--gold,#fb8b1e); box-shadow:0 0 22px rgba(251,139,30,.3); }
    .tc-ribbon { position:absolute; top:-9px; right:12px; background:var(--gold,#fb8b1e); color:#0b0e16;
      font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.1em; padding:2px 8px; border-radius:99px; }
    .tc-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:8px; }
    .tc-name { font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:.08em; color:var(--text); }
    .tc-price { font-family:var(--mono); font-size:20px; font-weight:700; color:var(--cyan); }
    .tc-price small { font-size:11px; color:var(--text-dim); font-weight:400; }
    .tc-featured .tc-price { color:var(--gold,#fb8b1e); }
    .tc-feats { list-style:none; padding:0; margin:0 0 10px; }
    .tc-feats li { font-size:11px; color:var(--text-muted); line-height:1.7; }
    .tc-btn { width:100%; padding:9px; font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:.06em;
      color:#0b0e16; background:var(--cyan); border:none; border-radius:7px; cursor:pointer; transition:box-shadow .2s; }
    .tc-featured .tc-btn { background:var(--gold,#fb8b1e); }
    .tier-card:hover .tc-btn { box-shadow:0 0 16px rgba(0,194,255,.4); }
    .auth-input { width:100%; box-sizing:border-box; padding:11px 13px; margin-bottom:4px; font-family:var(--mono);
      font-size:13px; color:var(--text); background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.12); border-radius:7px; }
    .auth-input:focus { outline:none; border-color:var(--cyan); box-shadow:0 0 0 2px rgba(0,194,255,.08); }
    .unlock-btn.full { width:100%; margin-top:10px; }
    .lock-switch-link { display:block; text-align:center; margin-top:14px; font-size:11px; color:var(--text-dim);
      text-decoration:none; cursor:pointer; transition:color .2s; }
    .lock-switch-link:hover { color:var(--cyan); }
    .signup-tier-summary { display:flex; align-items:center; gap:10px; padding:9px 12px; margin-bottom:14px;
      background:rgba(0,194,255,.07); border:1px solid rgba(0,194,255,.25); border-radius:8px; font-family:var(--mono); font-size:12px; }
    .signup-tier-summary #sts-price { color:var(--cyan); font-weight:700; }
    .sts-change { margin-left:auto; font-size:10px; color:var(--text-dim); cursor:pointer; text-decoration:underline; }
    .sts-change:hover { color:var(--cyan); }
    #su-uname-hint { font-weight:400; letter-spacing:0; }

    /* === APP LAYOUT === */
    .app-container {
      display: flex;
      height: calc(100vh - 130px); /* market tape + quote ticker + header */
    }

    /* === SIDEBAR === */
    .sidebar {
      width: 240px;
      min-width: 240px;
      background: var(--surface);
      border-right: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      overflow-y: auto;
    }

    .sidebar-section {
      padding: 14px 14px 12px;
      border-bottom: 1px solid var(--border);
    }

    .section-label {
      font-size: 9px;
      font-weight: 700;
      color: var(--text-dim);
      text-transform: uppercase;
      letter-spacing: 0.12em;
      font-family: var(--mono);
      margin-bottom: 10px;
    }

    /* Asset buttons */
    .asset-btn {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 9px 12px;
      border-radius: 6px;
      background: transparent;
      border: 1px solid transparent;
      color: var(--text-muted);
      cursor: pointer;
      font-family: var(--mono);
      font-size: 12px;
      font-weight: 500;
      width: 100%;
      text-align: left;
      transition: all 0.15s;
      margin-bottom: 4px;
    }
    .asset-btn:hover { background: var(--surface2); border-color: var(--border); color: var(--text); }
    .asset-btn.active { background: var(--surface2); border-color: var(--cyan); color: var(--text); }
    .goods-assets-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
    .goods-assets-grid .goods-card { margin-bottom: 0 !important; height: 100%; }
    @media (max-width: 980px) { .goods-assets-grid { grid-template-columns: 1fr; } }
    .goods-assets-view .goods-card {
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
      background: linear-gradient(180deg, rgba(255,255,255,.012), rgba(255,255,255,0)) , var(--surface2);
    }
    .goods-assets-view .goods-card:hover {
      transform: translateY(-1px);
      border-color: rgba(255,255,255,.14);
      box-shadow: 0 14px 34px rgba(0,0,0,.24), 0 0 0 1px rgba(255,255,255,.03) inset;
    }
    .goods-assets-view .goods-card:hover .goods-emblem,
    .goods-assets-view .goods-card:hover .goods-emblem--spx {
      box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset, 0 10px 24px rgba(0,0,0,.34), 0 0 18px rgba(0,194,255,.08);
    }
    .goods-assets-view .goods-card:hover .goods-emblem--gld {
      box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset, 0 10px 24px rgba(0,0,0,.34), 0 0 18px rgba(250,204,21,.08);
    }
    .asset-btn-left { display: flex; align-items: center; gap: 8px; }
    /* scrollable asset list — holds 3 or 20 assets without breaking layout */
    .asset-scroll { max-height: 260px; overflow-y: auto; overflow-x: hidden; padding-right: 2px; }
    .asset-scroll::-webkit-scrollbar { width: 5px; }
    .asset-scroll::-webkit-scrollbar-thumb { background: var(--border2,#2a3548); border-radius: 3px; }
    .asset-scroll::-webkit-scrollbar-track { background: transparent; }
    .asset-controls { display:flex; flex-direction:column; gap:6px; margin:0 0 8px; }
    .asset-search { width:100%; box-sizing:border-box; padding:7px 10px; border-radius:6px; border:1px solid var(--border); background:rgba(255,255,255,.03); color:var(--text); font-family:var(--mono); font-size:11px; outline:none; }
    .asset-search:focus { border-color:var(--cyan); }
    .asset-search::placeholder { color:var(--text-dim); }
    .asset-filter-chips { display:flex; gap:6px; }
    .asset-empty { padding:10px 4px; color:var(--text-dim); font-size:11px; font-family:var(--mono); }
    /* "SOON" badge for assets whose engine forecast isn't wired yet */
    .asset-soon { font-size: 8px; font-weight: 700; letter-spacing: .05em; padding: 1px 5px; border-radius: 4px; background: rgba(34,211,238,.14); color: var(--accent-cyan,#22d3ee); text-transform: uppercase; }
    .asset-btn.coming-soon { opacity: .82; }
    .asset-btn.coming-soon:hover { opacity: 1; }
    /* Coming-soon overlay pinned over the forecast-bands panel */
    .cs-overlay { display:none; position:absolute; inset:0; z-index:20; align-items:center; justify-content:center;
      background:linear-gradient(180deg, rgba(8,12,20,.93), rgba(8,12,20,.97)); backdrop-filter:blur(3px); border-radius:8px; padding:20px; }
    .cs-card { text-align:center; max-width:340px; font-family:var(--mono); }
    .cs-emblem { font-size:30px; margin-bottom:10px; opacity:.9; }
    .cs-title { font-size:16px; font-weight:800; color:var(--text); letter-spacing:.02em; margin-bottom:8px; }
    .cs-sub { font-size:11px; color:var(--accent-cyan,#22d3ee); font-weight:700; margin-bottom:10px; }
    .cs-note { font-size:10px; color:var(--text-dim); line-height:1.6; margin-bottom:16px; }
    .cs-back { font-family:var(--mono); font-size:10px; letter-spacing:.03em; color:var(--text-muted); background:var(--surface2,rgba(255,255,255,.04));
      border:1px solid var(--border); border-radius:6px; padding:8px 14px; cursor:pointer; transition:.14s; }
    .cs-back:hover { border-color:var(--accent-cyan,#22d3ee); color:var(--accent-cyan,#22d3ee); }
    .asset-icon { width: 18px; height: 18px; border-radius: 50%; object-fit: contain; }
    .asset-name { font-weight: 600; }
    .asset-ticker { color: var(--text-dim); font-size: 10px; }
    .goods-emblem {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      display: block;
      flex: 0 0 auto;
      object-fit: contain;
      box-shadow: 0 0 0 1px rgba(255,255,255,.06) inset, 0 8px 18px rgba(0,0,0,.28);
    }
    .goods-emblem--qqq {
      padding: 4px;
      background: radial-gradient(circle at 35% 30%, rgba(34,211,238,.22), rgba(15,23,42,.96) 68%);
      border: 1px solid rgba(34,211,238,.42);
    }
    .goods-emblem--spy {
      padding: 4px;
      background: radial-gradient(circle at 35% 30%, rgba(96,165,250,.22), rgba(15,23,42,.96) 68%);
      border: 1px solid rgba(96,165,250,.42);
    }
    .goods-emblem--gld {
      padding: 4px;
      background: radial-gradient(circle at 35% 30%, rgba(250,204,21,.18), rgba(26,22,10,.97) 68%);
      border: 1px solid rgba(250,204,21,.42);
    }
    .goods-emblem--spx {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .03em;
      color: #93c5fd;
      background:
        radial-gradient(circle at 35% 30%, rgba(96,165,250,.24), rgba(30,41,59,.95) 68%),
        linear-gradient(135deg, rgba(96,165,250,.18), rgba(15,23,42,.78));
      border: 1px solid rgba(96,165,250,.5);
      box-shadow: 0 0 0 1px rgba(255,255,255,.05) inset, 0 10px 20px rgba(59,130,246,.12), 0 8px 18px rgba(0,0,0,.28);
      text-shadow: 0 0 12px rgba(96,165,250,.35);
    }
    .asset-rate {
      min-width: 42px;
      height: 18px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .035em;
      color: var(--green);
      background:
        radial-gradient(circle at 32% 18%, rgba(55,255,139,.18), transparent 58%),
        var(--green-dim);
      padding: 1px 7px;
      border-radius: 999px;
      border: 1px solid rgba(55,255,139,.24);
      box-shadow: 0 0 0 1px rgba(255,255,255,.035) inset, 0 0 14px rgba(55,255,139,.08);
      font-family: var(--mono);
      line-height: 1;
      text-shadow: 0 0 10px rgba(55,255,139,.22);
    }
    .asset-rate.asset-rate-live {
      color: var(--accent-cyan,#22d3ee);
      background:
        radial-gradient(circle at 32% 18%, rgba(34,211,238,.18), transparent 58%),
        rgba(34,211,238,.09);
      border-color: rgba(34,211,238,.3);
      box-shadow: 0 0 0 1px rgba(255,255,255,.035) inset, 0 0 14px rgba(34,211,238,.10);
      text-shadow: 0 0 10px rgba(34,211,238,.25);
    }
    .asset-rate.asset-rate-spy {
      color: #fb7185;
      background:
        radial-gradient(circle at 32% 18%, rgba(251,113,133,.18), transparent 58%),
        rgba(251,113,133,.08);
      border-color: rgba(251,113,133,.28);
      box-shadow: 0 0 0 1px rgba(255,255,255,.035) inset, 0 0 14px rgba(251,113,133,.09);
      text-shadow: 0 0 10px rgba(251,113,133,.22);
    }
    .asset-rate.asset-rate-xau {
      color: #facc15;
      background:
        radial-gradient(circle at 32% 18%, rgba(250,204,21,.20), transparent 58%),
        rgba(250,204,21,.09);
      border-color: rgba(250,204,21,.34);
      box-shadow: 0 0 0 1px rgba(255,255,255,.035) inset, 0 0 14px rgba(250,204,21,.10);
      text-shadow: 0 0 10px rgba(250,204,21,.24);
    }

    /* TF buttons */
    .tf-btn {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 10px;
      border: 1px solid transparent;
      border-radius: 5px;
      background: transparent;
      color: var(--text-muted);
      cursor: pointer;
      font-size: 11px;
      font-family: var(--mono);
      font-weight: 500;
      width: 100%;
      text-align: left;
      transition: all 0.15s;
      margin-bottom: 3px;
    }
    .tf-btn:hover { background: var(--surface2); color: var(--text); }
    .tf-btn.active { border-color: var(--border); background: var(--surface2); color: var(--text); box-shadow: inset 3px 0 0 var(--cyan); }
    .tf-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--border3); flex-shrink: 0; }
    .tf-btn.active .tf-dot { background: var(--cyan); }

    /* Nav buttons */
    .nav-btn {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 12px;
      border-radius: 6px;
      background: transparent;
      border: 1px solid transparent;
      color: var(--text-muted);
      cursor: pointer;
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      width: 100%;
      text-align: left;
      transition: all 0.15s;
      margin-bottom: 3px;
    }
    .nav-btn:hover { background: var(--surface2); border-color: var(--border); color: var(--text); }
    .nav-btn.active { border-color: var(--border); background: var(--surface2); color: var(--text); box-shadow: inset 3px 0 0 var(--accent-cyan); }
    .nav-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--border3); flex-shrink: 0; }
    .nav-btn.active .nav-dot { }

    /* Chat styles ── V2 Telegram-style messenger */
    .chat-container { display:flex; flex-direction:column; height:100%; min-height:400px; position:relative; }

    /* Jump-to-latest pill — appears when the reader is scrolled up and new
       messages land. Click to smooth-scroll back to the newest line. */
    .chat-jump-latest {
      position:absolute; left:50%; bottom:70px; transform:translate(-50%, 14px);
      display:flex; align-items:center; gap:7px; z-index:9;
      padding:7px 14px; border:none; border-radius:99px; cursor:pointer;
      font-family:var(--mono); font-size:10.5px; font-weight:700; letter-spacing:.02em;
      color:var(--bg);
      background:linear-gradient(135deg, var(--accent-cyan,#22d3ee), #00c2ff);
      box-shadow:0 6px 20px rgba(34,211,238,.34), 0 1px 3px rgba(0,0,0,.4);
      opacity:0; pointer-events:none; visibility:hidden;
      transition:opacity .22s ease, transform .22s ease, visibility .22s;
    }
    .chat-jump-latest.show { opacity:1; transform:translate(-50%, 0); pointer-events:auto; visibility:visible; }
    .chat-jump-latest:hover { filter:brightness(1.06); box-shadow:0 8px 24px rgba(34,211,238,.44), 0 1px 3px rgba(0,0,0,.4); }
    .chat-jump-latest:active { transform:translate(-50%, 1px); }
    .chat-jump-latest .cjl-arrow { font-size:12px; line-height:1; }
    #chat-jump-count { display:inline-flex; align-items:center; justify-content:center;
      min-width:16px; height:16px; padding:0 4px; border-radius:99px;
      background:rgba(0,0,0,.22); color:var(--bg); font-size:9px; font-weight:800; }
    #chat-jump-count:empty { display:none; }

    /* One-shot entrance for freshly arriving message bubbles. */
    @keyframes chatMsgIn {
      from { opacity:0; transform:translateY(7px) scale(.985); }
      to   { opacity:1; transform:translateY(0) scale(1); }
    }
    .chat-msg-enter { animation:chatMsgIn .26s cubic-bezier(.22,.61,.36,1) both; }
    @media (prefers-reduced-motion: reduce) {
      .chat-msg-enter { animation:none; }
      .chat-jump-latest { transition:opacity .18s ease; }
    }
    /* subtle textured backdrop so the message area never reads as a dead black box */
    .chat-msgs {
      flex:1; min-height:0; overflow-y:auto; padding:18px 16px 14px; display:flex; flex-direction:column; gap:3px;
      background:
        radial-gradient(900px 420px at 78% -8%, rgba(34,211,238,.055), transparent 60%),
        radial-gradient(700px 380px at 12% 108%, rgba(34,211,238,.035), transparent 60%),
        var(--bg);
    }
    .chat-msg {
      position:relative; max-width:74%; padding:7px 12px 6px; border-radius:14px;
      font-size:13px; font-family:var(--mono); line-height:1.45; margin-top:7px;
      box-shadow:0 1px 2px rgba(0,0,0,.35); word-break:break-word;
    }
    /* group spacing: consecutive bubbles from the same side hug closer */
    .chat-msg-own + .chat-msg-own, .chat-msg-other + .chat-msg-other { margin-top:3px; }
    .chat-msg-own {
      align-self:flex-end;
      background:linear-gradient(135deg, rgba(34,211,238,.22), rgba(0,194,255,.14));
      border:1px solid rgba(34,211,238,.34); color:var(--text);
      border-bottom-right-radius:5px;
    }
    .chat-msg-other {
      align-self:flex-start;
      background:var(--surface-accent); border:1px solid var(--border); color:var(--text);
      border-bottom-left-radius:5px; padding-left:42px; /* room for avatar */
    }
    /* colored initial avatar for incoming messages (initial set as data attr by renderer) */
    .chat-msg-other .chat-msg-user::before {
      content:attr(data-initial); position:absolute; left:8px; top:8px;
      width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center;
      font-size:11px; font-weight:700; color:#04141a; font-family:var(--mono); text-transform:uppercase;
      background:linear-gradient(135deg, var(--accent-cyan), #00c2ff);
      box-shadow:0 1px 3px rgba(0,0,0,.4);
    }
    .chat-msg-user { font-size:11px; font-weight:700; margin-bottom:3px; letter-spacing:.01em; }
    .chat-msg-user.own { color:var(--accent-cyan); display:none; } /* own bubbles don't need a name label */
    .chat-msg-user.other { color:var(--accent-cyan); }
    .chat-msg-time { font-size:9px; color:var(--text-dim); margin-top:3px; text-align:right; opacity:.8; }

    /* ── reactions, replies, hover actions, emoji picker ── */
    .chat-msg-reply { border-left:2px solid var(--accent-cyan); padding:3px 0 3px 8px; margin-bottom:5px; opacity:.85; background:rgba(34,211,238,.05); border-radius:0 6px 6px 0; }
    .chat-msg-reply .r-user { font-size:9px; font-weight:700; color:var(--accent-cyan); }
    .chat-msg-reply .r-text { font-size:10px; color:var(--text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:220px; }
    .chat-msg-gif { max-width:220px; max-height:220px; width:auto; height:auto; object-fit:contain; border-radius:8px; margin-top:5px; display:block; background:var(--bg,#0a0f14); }
    .chat-reactions { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
    .reaction-chip { display:inline-flex; align-items:center; gap:3px; padding:2px 8px; border-radius:11px; background:var(--surface2,rgba(255,255,255,.04)); border:1px solid var(--border); font-size:11px; cursor:pointer; line-height:1.4; user-select:none; transition:transform .08s ease; }
    .reaction-chip:hover { transform:translateY(-1px); }
    .reaction-chip.mine { background:rgba(34,211,238,.2); border-color:rgba(34,211,238,.55); }
    .reaction-chip .rc-count { font-size:9px; color:var(--text-dim); }
    .chat-msg-actions { position:absolute; top:-12px; right:8px; display:none; gap:2px; background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:3px 5px; box-shadow:0 3px 10px rgba(0,0,0,.5); }
    .chat-msg:hover .chat-msg-actions { display:flex; }
    .chat-msg-actions button { background:none; border:none; cursor:pointer; font-size:14px; padding:1px 5px; border-radius:8px; line-height:1; }
    .chat-msg-actions button:hover { background:var(--surface2,rgba(255,255,255,.08)); }
    .emoji-pop { position:absolute; z-index:50; background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:7px; box-shadow:0 4px 16px rgba(0,0,0,.5); display:flex; flex-wrap:wrap; gap:3px; width:184px; }
    .emoji-pop button { background:none; border:none; cursor:pointer; font-size:18px; padding:3px; border-radius:6px; line-height:1; }
    .emoji-pop button:hover { background:var(--surface2,rgba(255,255,255,.1)); }
    /* ── GIF picker (GIPHY) ── */
    .gif-picker { position:absolute; z-index:60; width:300px; height:320px; background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:0 6px 24px rgba(0,0,0,.55); display:flex; flex-direction:column; overflow:hidden; }
    .gif-picker-tabs { display:flex; gap:4px; padding:6px 6px 0 6px; }
    .gif-tab { flex:1; padding:5px 0; font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.06em;
      background:transparent; border:1px solid var(--border); border-radius:6px; color:var(--text-dim); cursor:pointer; transition:all .12s; }
    .gif-tab:hover { color:var(--text); border-color:rgba(0,194,255,.4); }
    .gif-tab.active { border-color:var(--cyan); background:rgba(0,194,255,.12); color:var(--cyan); }
    .gif-picker-head { display:flex; align-items:center; gap:8px; padding:8px 10px; border-bottom:1px solid var(--border); }
    .gif-search { flex:1; height:32px; padding:0 10px; background:var(--bg); border:1px solid var(--border); border-radius:7px; color:var(--text); font-family:var(--mono); font-size:11px; }
    .gif-search:focus { outline:none; border-color:var(--accent-cyan); }
    .gif-attrib { display:flex; align-items:center; justify-content:center; gap:6px; padding:6px 8px; border-top:1px solid var(--border); background:rgba(0,0,0,.28); }
    .gif-attrib-pb { font-family:var(--mono); font-size:8.5px; font-weight:700; letter-spacing:.06em; color:var(--text-dim); text-transform:uppercase; }
    .gif-attrib-mark { height:14px; width:auto; display:block; }
    .gif-grid { flex:1; overflow-y:auto; padding:8px; display:grid; grid-template-columns:1fr 1fr; gap:6px; align-content:start; }
    .gif-cell { width:100%; border-radius:6px; cursor:pointer; display:block; background:var(--surface2,rgba(255,255,255,.04)); transition:transform .1s, outline .1s; }
    .gif-cell:hover { transform:scale(1.03); outline:2px solid var(--accent-cyan); }
    .gif-empty { grid-column:1 / -1; text-align:center; color:var(--text-dim); font-family:var(--mono); font-size:10px; padding:24px 8px; }
    .gif-close { display:none; background:none; border:1px solid var(--border); color:var(--text-dim); border-radius:8px; font-size:14px; line-height:1; padding:6px 10px; cursor:pointer; font-family:var(--mono); }
    @media (max-width:900px) {
      /* mobile: GIF picker is a bottom sheet, not a floating popover */
      .gif-picker {
        position:fixed !important; left:0 !important; right:0 !important;
        top:auto !important; bottom:0 !important;
        width:100vw !important; height:min(430px, 58dvh);
        border-radius:16px 16px 0 0; border-left:0; border-right:0; border-bottom:0;
        z-index:210; box-shadow:0 -8px 28px rgba(0,0,0,.55);
        padding-bottom:env(safe-area-inset-bottom, 0px);
      }
      .gif-close { display:block; }
    }

    /* ── empty / welcome state for the community chat (single inline-styled child kept for JS) ── */
    .chat-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; padding:36px 20px; height:100%; min-height:320px; }
    .chat-empty-icon { width:72px; height:72px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:34px;
      background:radial-gradient(circle at 30% 25%, rgba(34,211,238,.28), rgba(34,211,238,.06)); border:1px solid rgba(34,211,238,.35);
      box-shadow:0 0 30px rgba(34,211,238,.18); }
    .chat-empty-title { font-family:var(--mono); font-size:16px; font-weight:700; color:var(--text); letter-spacing:.02em; }
    .chat-empty-sub { font-family:var(--mono); font-size:11px; color:var(--text-muted); line-height:1.6; max-width:300px; }
    .chat-empty-tag { font-family:var(--mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-cyan); padding:4px 12px; border:1px solid rgba(34,211,238,.3); border-radius:99px; background:rgba(34,211,238,.06); }

    .reply-bar { display:none; align-items:center; gap:8px; padding:7px 12px; background:var(--surface2,rgba(34,211,238,.07)); border-top:1px solid var(--border); border-left:3px solid var(--accent-cyan); font-family:var(--mono); font-size:11px; }
    .reply-bar.active { display:flex; }
    .reply-bar .rb-text { flex:1; color:var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .reply-bar .rb-user { color:var(--accent-cyan); font-weight:700; }
    .reply-bar .rb-close { cursor:pointer; color:var(--text-dim); font-size:15px; padding:0 4px; }
    .chat-tool-btn { height:42px; width:44px; flex-shrink:0; background:var(--surface2,rgba(255,255,255,.04)); border:1px solid var(--border); border-radius:10px; color:var(--text-muted); cursor:pointer; font-size:18px; transition:.12s; }
    .chat-tool-btn:hover { border-color:var(--accent-cyan); color:var(--accent-cyan); background:rgba(34,211,238,.08); }
    .chat-input-row { display:flex; gap:8px; align-items:center; padding:12px 14px; border-top:1px solid var(--border); background:var(--surface); flex:0 0 auto; flex-shrink:0; }
    .chat-input-row input { flex:1; height:42px; padding:0 16px; background:var(--bg); border:1px solid var(--border); border-radius:21px; color:var(--text); font-family:var(--mono); font-size:13px; transition:.12s; }
    .chat-input-row input::placeholder { color:var(--text-dim); }
    .chat-input-row input:focus { outline:none; border-color:var(--accent-cyan); box-shadow:0 0 0 3px rgba(34,211,238,.12); }
    .chat-input-row button { height:42px; padding:0 22px; background:linear-gradient(135deg, var(--accent-cyan), #00c2ff); border:none; border-radius:21px; color:#04141a; font-weight:700; cursor:pointer; font-family:var(--mono); font-size:12px; letter-spacing:.03em; transition:.12s; }
    .chat-input-row button:hover { filter:brightness(1.08); box-shadow:0 0 16px rgba(34,211,238,.35); }

    /* ── COMMUNITY LOUNGE: two-panel layout (chat left + live market rail right) ── */
    .lounge { display:flex; flex:1; min-height:0; gap:0; }
    .lounge-chat { flex:1; display:flex; flex-direction:column; min-width:0; min-height:0; }
    .lounge-rail { width:280px; flex-shrink:0; border-left:1px solid var(--border); background:var(--surface); display:flex; flex-direction:column; overflow-y:auto; }
    .rail-section { padding:12px 14px; border-bottom:1px solid var(--border); }
    .rail-head { font-family:var(--mono); font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-dim); margin-bottom:8px; display:flex; align-items:center; gap:6px; }
    .rail-fc-asset { font-family:var(--mono); font-size:15px; font-weight:700; color:var(--text); letter-spacing:.02em; }
    .rail-fc-horizon { font-family:var(--mono); font-size:9px; color:var(--text-dim); margin-top:1px; }
    .rail-fc-price { font-family:var(--mono); font-size:18px; font-weight:700; color:var(--accent-cyan); margin-top:8px; }
    .rail-fc-chg { font-family:var(--mono); font-size:10px; margin-top:2px; }
    .rail-fc-chg.up { color:var(--green); } .rail-fc-chg.down { color:var(--red,#ff5470); }
    /* Live Forecast card: left = asset/price, right = HIGH(top)/LOW(bottom) bands */
    .rail-fc-row { display:flex; align-items:stretch; justify-content:space-between; gap:10px; }
    .rail-fc-left { flex:0 0 auto; }
    .rail-fc-bands { flex:1; display:flex; flex-direction:column; justify-content:space-between; gap:8px; min-width:0; }
    .rail-band { display:flex; align-items:center; justify-content:flex-end; gap:7px; padding:6px 9px; border-radius:7px; border:1px solid var(--border); background:var(--bg); transition:border-color .25s, box-shadow .25s; }
    .rail-band-val { display:flex; flex-direction:column; align-items:flex-end; line-height:1.15; }
    .rail-band-lbl { font-family:var(--mono); font-size:7px; letter-spacing:.08em; color:var(--text-dim); text-transform:uppercase; }
    .rail-band-val > span:last-child { font-family:var(--mono); font-size:13px; font-weight:700; }
    .rail-band-high .rail-band-val > span:last-child { color:var(--red,#ff5470); }
    .rail-band-low  .rail-band-val > span:last-child { color:var(--cyan,#00c2ff); }
    /* three-dot proximity meter — identical mechanic to the forecast deck */
    .rail-band-dots { display:inline-flex; gap:3px; line-height:1; }
    .rail-band-dots i { width:6px; height:6px; border-radius:50%; background:var(--border3,#2a3548); transition:background .25s, box-shadow .25s; }
    .rail-band-dots i.on { background:var(--green,#00d68f); box-shadow:0 0 6px var(--green,#00d68f); }
    /* escalating glow per level, mirrors .dist-box lvl1-4 */
    .rail-band.lvl1 { border-color:rgba(0,214,143,0.30); }
    .rail-band.lvl2 { border-color:rgba(0,214,143,0.50); box-shadow:0 0 8px rgba(0,214,143,0.15); }
    .rail-band.lvl3 { border-color:rgba(0,214,143,0.75); box-shadow:0 0 12px rgba(0,214,143,0.28); }
    .rail-band.lvl4 { border-color:var(--green,#00d68f); box-shadow:0 0 18px rgba(0,214,143,0.45); }
    .rail-band.lvl4 .rail-band-dots i.on { animation:distPulse 0.7s ease-in-out infinite; }
    .rail-fc-link { margin-top:10px; display:block; text-align:center; font-family:var(--mono); font-size:9px; letter-spacing:.04em; color:var(--text-muted); padding:6px; border:1px solid var(--border); border-radius:5px; cursor:pointer; text-decoration:none; }
    .rail-fc-link:hover { border-color:var(--accent-cyan); color:var(--accent-cyan); }
    .rail-wire-item {
      font-family:var(--mono); font-size:11px; line-height:1.4; color:var(--text-muted);
      padding:9px 10px; margin-bottom:6px; cursor:pointer; border-radius:8px;
      background:var(--surface-accent,rgba(255,255,255,.02));
      border:1px solid var(--border); border-left:2px solid var(--accent-cyan);
      transition:.14s ease;
    }
    .rail-wire-item:last-child { margin-bottom:0; }
    .rail-wire-item:hover { color:var(--text); border-color:var(--accent-cyan); transform:translateX(2px); background:rgba(34,211,238,.05); }
    .rail-wire-head { display:flex; align-items:center; gap:6px; margin-bottom:4px; flex-wrap:wrap; }
    .rail-wire-tag { font-size:8px; font-weight:700; letter-spacing:.06em; padding:1px 6px; border-radius:4px; background:rgba(34,211,238,.14); color:var(--accent-cyan); text-transform:uppercase; }
    .rail-wire-item .src { font-size:8px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.04em; }
    .rail-wire-ago { font-size:8px; color:var(--text-dim); margin-left:auto; }
    .rail-wire-title { font-size:11px; color:var(--text); font-weight:500; line-height:1.4; }
    .rail-sent { font-size:8px; font-weight:700; padding:1px 5px; border-radius:4px; letter-spacing:.04em; }
    .rail-sent.bullish { background:rgba(34,197,94,.16); color:#34d399; }
    .rail-sent.bearish { background:rgba(255,69,96,.16); color:#ff5470; }
    .rail-wire-item.breaking { border-left-color:var(--red,#ff5470); background:rgba(255,69,96,.05); }
    .rail-wire-item.breaking .rail-wire-tag { background:rgba(255,69,96,.18); color:var(--red,#ff5470); }
    /* Asset-aware market sentiment gauge */
    .sent-gauge { background:var(--surface-accent,rgba(255,255,255,.02)); border:1px solid var(--border); border-radius:8px; padding:11px 12px; }
    .sent-loading { font-family:var(--mono); font-size:10px; color:var(--text-dim); }
    .sent-top { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:7px; }
    .sent-score { font-family:var(--mono); font-size:22px; font-weight:800; line-height:1; }
    .sent-score .sent-unit { font-size:10px; font-weight:600; color:var(--text-dim); margin-left:3px; }
    .sent-rating { font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:.03em; text-align:right; }
    .sent-bar { height:5px; border-radius:3px; background:rgba(255,255,255,.07); overflow:hidden; }
    .sent-bar-fill { height:100%; border-radius:3px; transition:width .5s ease, background .3s; }
    .sent-label { font-family:var(--mono); font-size:8px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.05em; margin-top:7px; display:flex; justify-content:space-between; }
    @media (max-width:760px) {
      .lounge { flex-direction:column; }
      .lounge-rail { width:auto; border-left:none; border-top:1px solid var(--border); max-height:200px; }
    }

    /* Community Chat V2 — readable tools, stronger lounge surface, mobile composer always visible */
    .chat-tool-btn {
      background:rgba(34,211,238,.08);
      border-color:rgba(34,211,238,.22);
      color:var(--accent-cyan);
      display:inline-flex;
      align-items:center;
      justify-content:center;
      font-family:var(--mono);
      font-weight:800;
    }
    .chat-tool-btn:hover { background:rgba(34,211,238,.14); }
    .gif-tool-btn { font-size:11px; letter-spacing:.08em; }
    .chat-composer-v2 {
      gap:10px;
      background:linear-gradient(180deg, rgba(10,16,31,.98), rgba(6,10,19,.98));
    }
    .chat-tool-group {
      display:flex;
      align-items:center;
      gap:6px;
      padding:4px;
      background:rgba(255,255,255,.025);
      border:1px solid rgba(148,163,184,.12);
      border-radius:18px;
      flex-shrink:0;
    }
    .chat-composer-v2 .chat-tool-btn {
      width:34px;
      height:34px;
      border-radius:14px;
      background:rgba(34,211,238,.10);
      border-color:rgba(34,211,238,.30);
      color:var(--accent-cyan);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
    }
    .chat-composer-v2 .emoji-tool-btn { font-size:18px; }
    .chat-composer-v2 .gif-tool-btn {
      width:44px;
      font-size:12px;
      color:#ffffff;
      background:linear-gradient(135deg, rgba(0,194,255,.30), rgba(125,211,252,.18));
      border-color:rgba(125,211,252,.85);
      text-shadow:0 0 8px rgba(125,211,252,.75);
      box-shadow:0 0 14px rgba(34,211,238,.24), inset 0 0 0 1px rgba(255,255,255,.08);
    }
    .chat-composer-v2 .gif-tool-btn:hover { filter:brightness(1.08); }
    .chat-composer-v2 input {
      background:#020611;
      border-color:rgba(148,163,184,.22);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);
    }
    .chat-composer-v2 input:focus { border-color:rgba(34,211,238,.65); }
    .chat-send-btn {
      min-width:66px;
      background:linear-gradient(135deg, var(--accent-cyan), #7dd3fc) !important;
      color:#ffffff !important;
      border:1px solid rgba(125,211,252,.85) !important;
      text-shadow:0 0 8px rgba(125,211,252,.75);
      box-shadow:0 0 16px rgba(34,211,238,.26), inset 0 0 0 1px rgba(255,255,255,.08);
    }
    #chat-community-view .panel-body {
      background:linear-gradient(180deg, rgba(34,211,238,.025), transparent 110px), var(--bg);
    }
    #chat-community-view .lounge-chat { background:var(--bg); }
    #chat-community-view .lounge-rail { background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01)); }

    @media (max-width:900px) {
      body.page-chat-active { overflow:hidden; }
      /* Keep market ticker bars visible in chat — traders need the tape. */
      body.page-chat-active .app-container {
        display:flex;
        height:calc(100dvh - 52px - 28px - 52px);
        min-height:330px;
        overflow:hidden;
      }
      body.page-chat-active.chat-tape-collapsed .market-ticker-tape,
      body.page-chat-active.chat-tape-collapsed .quote-ticker { display:none; }
      body.page-chat-active.chat-tape-collapsed .app-container { height:calc(100dvh - 52px); }
      body.page-chat-active .main-area { height:100%; min-height:0; overflow:hidden; }
      body.page-chat-active .top-strip { display:flex; flex:0 0 auto; padding:6px 10px; font-size:9px; gap:8px; }
      body.page-chat-active .top-strip .strip-left { gap:8px; overflow:hidden; white-space:nowrap; }
      body.page-chat-active #page-chat.page.active {
        height:auto; min-height:0; overflow:hidden; flex:1 1 auto;
      }
      body.page-chat-active #page-chat .subsel-bar {
        flex:0 0 auto;
        padding:8px 10px;
        background:var(--surface);
        border-bottom:1px solid var(--border);
      }
      /* mobile auto-hide of the chat sub-tab bar (js/mobile-chat-subsel.js) */
      body.page-chat-active #page-chat .subsel-bar {
        max-height:56px; overflow:hidden;
        transition:max-height .28s ease, padding .28s ease, opacity .22s ease, border-bottom-width .28s ease;
      }
      body.page-chat-active.chat-subsel-collapsed #page-chat .subsel-bar {
        max-height:0; padding-top:0; padding-bottom:0; opacity:0; border-bottom-width:0;
      }
      body.page-chat-active #chat-community-view,
      body.page-chat-active #chat-ai-view,
      body.page-chat-active #chat-t3-view {
        min-height:0; overflow:hidden; border:0; border-radius:0;
      }
      body.page-chat-active #chat-community-view .panel-head,
      body.page-chat-active #chat-ai-view .panel-head,
      body.page-chat-active #chat-t3-view .panel-head { display:none; }
      body.page-chat-active #chat-community-view .panel-body,
      body.page-chat-active #chat-ai-view .panel-body,
      body.page-chat-active #chat-t3-view .panel-body {
        min-height:0; overflow:hidden; flex:1;
      }
      body.page-chat-active #t3-config { flex:0 0 auto; max-height:112px; overflow-y:auto; }
      body.page-chat-active .lounge {
        height:100%; min-height:0; overflow:hidden; flex-direction:column;
      }
      body.page-chat-active .lounge-chat {
        flex:1 1 auto; min-height:0; order:1;
      }
      body.page-chat-active .chat-container {
        height:100%; min-height:0; display:flex; flex-direction:column;
      }
      body.page-chat-active .chat-msgs {
        flex:1 1 auto; min-height:0; overflow-y:auto; padding:14px 12px 10px;
      }
      body.page-chat-active .chat-msg { max-width:86%; }
      body.page-chat-active .chat-msg-actions { display:none; opacity:.96; }
      body.page-chat-active .chat-msg.msg-actions-open .chat-msg-actions { display:flex; }
      body.page-chat-active .reply-bar { flex:0 0 auto; padding:6px 10px; }
      body.page-chat-active .chat-input-row {
        flex:0 0 auto;
        position:sticky;
        bottom:0;
        z-index:10;
        gap:8px;
        padding:8px 10px calc(8px + env(safe-area-inset-bottom));
        border-top:1px solid rgba(34,211,238,.18);
        background:rgba(7,12,24,.98);
        box-shadow:0 -10px 24px rgba(0,0,0,.35);
      }
      body.page-chat-active .chat-tool-group { gap:4px; padding:3px; border-radius:17px; }
      body.page-chat-active .chat-composer-v2 .chat-tool-btn { width:34px; height:34px; border-radius:13px; }
      body.page-chat-active .chat-composer-v2 .gif-tool-btn { width:42px; }
      body.page-chat-active .chat-input-row input { min-width:0; height:40px; padding:0 12px; font-size:12px; }
      body.page-chat-active .chat-input-row .chat-send-btn { height:40px; min-width:58px; padding:0 12px; font-size:11px; }
      body.page-chat-active .lounge-rail {
        order:2;
        width:auto;
        flex:0 0 auto;
        max-height:132px;
        overflow-y:auto;
        border-left:none;
        border-top:1px solid var(--border);
      }
      body.page-chat-active .rail-section { padding:10px 12px; }
      body.page-chat-active .rail-section:nth-child(n+3) { display:none; }
    }

    @media (max-width:480px) {
      body.page-chat-active .logo-text { font-size:11px; max-width:none; overflow:visible; text-overflow:clip; white-space:nowrap; letter-spacing:.06em; }
      body.page-chat-active .status-badge { display:none; }
      body.page-chat-active .logout-btn { padding:0 10px; font-size:10px; }
      body.page-chat-active .chat-msg { max-width:92%; font-size:12px; }
      body.page-chat-active .chat-msg-gif { max-width:190px; max-height:190px; }
      body.page-chat-active .chat-tool-group { gap:3px; }
      body.page-chat-active .chat-composer-v2 .chat-tool-btn { width:32px; height:32px; }
      body.page-chat-active .chat-composer-v2 .gif-tool-btn { width:40px; font-size:11px; }
      body.page-chat-active .chat-input-row .chat-send-btn { min-width:52px; padding:0 10px; }
      body.page-chat-active .lounge-rail { max-height:116px; }
      body.page-chat-active .rail-wire-item { padding:7px 8px; }
      body.page-chat-active .rail-wire-title { font-size:10px; }
    }

    /* Fleet page */
    .page-refresh-btn { height:28px; padding:0 12px; background:var(--surface2); border:1px solid var(--border); border-radius:4px; color:var(--text-muted); cursor:pointer; font-family:var(--mono); font-size:10px; }
    .page-refresh-btn:hover { background:var(--border); color:var(--text); }

    /* Page containers */
    .page { display:none; height:100%; }
    .page.active { display:flex; flex-direction:column; }
    #page-dashboard.page.active { display:block; } /* dashboard keeps original behavior */
    #page-fleet.page.active { display:flex; flex:1; min-height:0; } /* fleet fills full height */
    #page-chat.page.active { display:flex; flex:1; min-height:0; }
    #page-data.page.active, #page-goods.page.active { display:flex; flex-direction:column; flex:1; min-height:0; }

    /* Track record mini */
    .tr-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 5px 0;
      font-family: var(--mono);
      font-size: 11px;
      border-bottom: 1px solid var(--border);
    }
    .tr-row:last-child { border-bottom: none; }
    .tr-tf-lbl { color: var(--text-muted); font-size: 10px; }
    .tr-pct { font-weight: 700; color: var(--green); }
    .tr-cnt { color: var(--text-dim); font-size: 9px; }

    /* Convergence panel */
    .conv-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 5px 0;
      font-size: 10px;
      font-family: var(--mono);
      border-bottom: 1px solid var(--border);
    }
    .conv-row:last-child { border-bottom: none; }
    .conv-lbl { color: var(--text-dim); font-size: 9px; }
    .conv-badge {
      font-size: 9px;
      font-weight: 700;
      padding: 2px 7px;
      border-radius: 3px;
      letter-spacing: 0.04em;
    }
    .cb-neutral { color: var(--text-dim); background: rgba(255,255,255,0.03); }
    .cb-high { color: var(--red); background: var(--red-dim); animation: glowRed 1.5s infinite alternate; }
    .cb-low { color: var(--cyan); background: var(--cyan-dim); animation: glowCyan 1.5s infinite alternate; }
    .cb-combine { color: var(--amber); background: var(--amber-dim); animation: flashAmber 1.2s infinite; }
    @keyframes glowRed { to { box-shadow: 0 0 6px rgba(255,69,96,0.3); } }
    @keyframes glowCyan { to { box-shadow: 0 0 6px rgba(0,194,255,0.3); } }
    @keyframes flashAmber { 50% { opacity: 0.6; } }

    .conv-master {
      margin-top: 8px;
      padding: 8px;
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 5px;
      text-align: center;
    }
    .conv-master-lbl { font-size: 9px; color: var(--text-dim); font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 3px; }
    .conv-master-val { font-size: 11px; font-weight: 700; font-family: var(--mono); color: var(--text-dim); }

    .sidebar-footer {
      margin-top: auto;
      padding: 12px 14px;
      border-top: 1px solid var(--border);
    }
    .sidebar-footer-text { font-size: 9px; color: var(--text-dim); font-family: var(--mono); line-height: 1.7; }

    /* === MAIN AREA === */
    .main-area {
      flex: 1;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    .top-strip {
      background: var(--surface2);
      border-bottom: 1px solid var(--border);
      padding: 8px 18px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 11px;
      font-family: var(--mono);
      color: var(--text-muted);
      flex-shrink: 0;
    }
    .strip-left { display: flex; gap: 20px; align-items: center; }
    .strip-field span { color: var(--text); font-weight: 700; }
    .strip-candle-close { color: var(--cyan); font-weight: 700; }

    /* THE WIRE — vertical-scrolling news ticker in the top strip */
    .wire-ticker {
      flex: 1;
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
      padding: 0 14px;
      height: 30px;
      background: transparent;
      border: none;
      border-left: 1px solid var(--border);
      border-radius: 0;
      cursor: pointer;
      overflow: hidden;
      transition: background .2s;
    }
    .wire-ticker:hover { background: rgba(255,255,255,0.02); }
    .wire-ticker-label {
      flex-shrink: 0;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: .14em;
      color: var(--text-dim);
      border-right: 1px solid var(--border);
      padding-right: 10px;
    }
    .wire-ticker-viewport { flex: 1; min-width: 0; height: 30px; overflow: hidden; position: relative; }
    .wire-ticker-rail { display: flex; flex-direction: column; transition: transform .6s cubic-bezier(.22,.61,.36,1); }
    .wire-ticker-item {
      height: 30px;
      line-height: 30px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      font-size: 11px;
      font-weight: 500;
      color: var(--text-muted);
    }
    .wire-ticker-item .wt-tag {
      color: var(--text-dim); font-weight: 700; font-size: 9px;
      margin-right: 9px; letter-spacing: .05em;
    }
    .wire-ticker-item.breaking .wt-tag { color: var(--red); }
    .wire-ticker-item.breaking { color: var(--text); }

    /* The Goods sub-nav + Wire page */
    .goods-subnav { display: flex; gap: 8px; margin-top: 12px; }
    .goods-subbtn {
      background: var(--surface2); border: 1px solid var(--border);
      color: var(--text-muted); font-family: var(--mono); font-size: 11px;
      font-weight: 700; letter-spacing: .03em; padding: 6px 16px;
      border-radius: 6px; cursor: pointer; transition: all .15s;
    }
    .goods-subbtn:hover { color: var(--text); border-color: var(--cyan); }
    .goods-subbtn.active { background: rgba(0,194,255,0.1); color: var(--cyan); border-color: rgba(0,194,255,0.4); }
    .wire-cols { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; }
    @media (max-width: 820px) { .wire-cols { grid-template-columns: 1fr; } }
    /* Wire V2 square grid: big center news + stacked right column (Upcoming / X feed) */
    .wire-grid {
      display: grid;
      grid-template-columns: 1.7fr 1fr;
      grid-template-areas: "main side-top";
      gap: 14px;
      align-items: stretch;
    }
    .wire-main { grid-area: main; min-width: 0; }
    .wire-side-top { grid-area: side-top; min-width: 0; display: flex; flex-direction: column; min-height: 0; }
    .wire-side-bottom { grid-area: side-bottom; min-width: 0; }
    .wire-side-top, .wire-side-bottom {
      background: var(--surface2); border: 1px solid var(--border);
      border-radius: 10px; padding: 14px;
    }
    .wire-side-bottom {
      background: linear-gradient(135deg, rgba(0,194,255,.05), rgba(255,255,255,.015)), var(--surface2);
    }
    .wire-x-logo { font-weight: 800; color: var(--text); margin-right: 4px; }
    @media (max-width: 900px) {
      .wire-grid {
        grid-template-columns: 1fr;
        grid-template-areas: "main" "side-top";
      }
      #wire-upcoming-list { max-height: 60vh; }
    }
    #alert-asset-chips { display:block; }
    .alert-quick-row { display:flex; gap:6px; margin:2px 0 10px; flex-wrap:wrap; }
    .alert-quick { font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.05em;
      padding:4px 11px; border-radius:999px; border:1px solid var(--border); background:transparent;
      color:var(--text-dim); cursor:pointer; transition: color .15s, border-color .15s, background .15s; }
    .alert-quick:hover { color:var(--text); border-color: rgba(0,194,255,.45); background: rgba(0,194,255,.07); }
    .alert-quick.on { color:var(--cyan,#22d3ee); border-color: rgba(0,194,255,.55); background: rgba(0,194,255,.12); }
    .alert-group-label { font-family:var(--mono); font-size:8.5px; font-weight:700; letter-spacing:.1em;
      color:var(--text-dim); text-transform:uppercase; margin:9px 0 5px; }
    .pb-tip { cursor: default; border-bottom: 1px dotted rgba(148,163,184,.35); }
    .pb-tip:hover { border-bottom-color: rgba(34,211,238,.6); }
    .chat-msgs.chat-loading { visibility: hidden; }
    .wire-desk-status {
      display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
      font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .08em;
      text-transform: uppercase; color: var(--text-dim); margin-bottom: 10px;
    }
    .wire-live-dot { width: 7px; height: 7px; border-radius: 50%; background: #34d399; animation: wireLivePulse 2s ease-in-out infinite; }
    @keyframes wireLivePulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }
    .wire-desk-breaking { color: var(--red); font-weight: 800; }
    .wire-mood-row { background: var(--surface2); border: 1px solid var(--border); border-radius: 6px; padding: 10px 11px; }
    .wire-mood-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 7px; }
    .wire-mood-name { font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .06em; color: var(--text-dim); }
    .wire-mood-score { font-family: var(--mono); font-size: 9px; font-weight: 800; text-align: right; }
    .wire-mood-sub { margin-top: 6px; font-size: 9px; color: var(--text-dim); font-family: var(--mono); }
    .wire-filterbar {
      display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px;
    }
    .wire-filter-btn {
      font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .05em;
      text-transform: uppercase; padding: 8px 11px; border-radius: 999px;
      border: 1px solid var(--border); background: var(--surface2); color: var(--text-dim);
      cursor: pointer; transition: .15s ease;
    }
    .wire-filter-btn:hover { color: var(--text); border-color: var(--cyan); }
    .wire-filter-btn.active { color: var(--bg); background: var(--cyan); border-color: var(--cyan); }
    .wire-filter-count { margin-left: 6px; opacity: .8; }
    .wire-col-head {
      font-size: 10px; font-weight: 800; letter-spacing: .08em;
      color: var(--text-dim); font-family: var(--mono); margin-bottom: 10px;
      text-transform: uppercase;
    }
    .wire-social-card {
      background: linear-gradient(135deg, rgba(0,194,255,.07), rgba(255,255,255,.02));
      border: 1px solid rgba(0,194,255,.18); border-radius: 8px; padding: 12px 12px 13px;
      margin-top: 10px;
    }
    .wire-social-card-head {
      display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px;
      font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
    }
    .wire-social-chip { font-size: 8px; padding: 1px 6px; border-radius: 999px; background: rgba(0,194,255,.12); color: var(--cyan); }
    .wire-social-empty { font-size: 10px; color: var(--text-dim); line-height: 1.6; }
    .wire-social-list { display: grid; gap: 8px; }
    .wire-social-item {
      display: block; text-decoration: none; color: inherit;
      background: var(--surface2); border: 1px solid var(--border); border-radius: 6px; padding: 10px 11px;
      transition: border-color .15s, transform .12s;
    }
    .wire-social-item:hover { border-color: var(--cyan); transform: translateX(2px); }
    .wire-social-top { display:flex; align-items:center; gap:8px; margin-bottom:4px; }
    .wire-social-tag { font-size:8px; font-weight:700; letter-spacing:.06em; color:var(--cyan); }
    .wire-social-src { font-size:8px; color:var(--text-dim); margin-left:auto; }
    .wire-social-title { font-size:11px; color:var(--text); line-height:1.45; }
    .wire-social-note { margin-top: 8px; font-size: 9px; color: var(--text-dim); font-family: var(--mono); line-height: 1.5; }
    .wire-col-head {
      font-size: 10px; font-weight: 800; letter-spacing: .08em;
      color: var(--text-dim); font-family: var(--mono); margin-bottom: 10px;
      text-transform: uppercase;
    }
    /* ── WIRE DESK TAPE — dense time-first rows (2026-07-09 redesign) ── */
    .wire-tape { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: var(--surface2); }
    .wire-row {
      display: flex; align-items: baseline; gap: 10px; padding: 9px 14px 9px 10px;
      border-bottom: 1px solid var(--border); border-left: 3px solid transparent;
      text-decoration: none; cursor: pointer; transition: background .12s, border-left-color .12s;
    }
    .wire-row:last-child { border-bottom: none; }
    .wire-row:hover { background: rgba(139,92,246,.06); border-left-color: var(--accent, #8b5cf6); }
    .wr-time { font-family: var(--mono); font-size: 10px; color: var(--text-dim); min-width: 36px; flex: none; letter-spacing: .03em; }
    .wr-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--border); flex: none; align-self: center; }
    .wr-cat {
      font-family: var(--mono); font-size: 8.5px; font-weight: 800; letter-spacing: .08em;
      padding: 2px 6px; border-radius: 4px; flex: none; text-transform: uppercase;
      background: rgba(148,163,184,.10); color: var(--text-dim);
    }
    .wr-cat.cat-crypto   { background: rgba(247,147,26,.12);  color: #f7931a; }
    .wr-cat.cat-tech     { background: rgba(139,92,246,.14);  color: #a78bfa; }
    .wr-cat.cat-equities { background: rgba(34,211,238,.12);  color: var(--cyan, #22d3ee); }
    .wr-cat.cat-macro    { background: rgba(250,204,21,.12);  color: #facc15; }
    .wr-title { font-size: 12px; font-weight: 600; color: var(--text); line-height: 1.35; flex: 1 1 auto; min-width: 0; }
    .wr-sent { font-size: 9px; margin-left: 6px; font-family: var(--mono); }
    .wr-sent.bull { color: var(--green, #34d399); }
    .wr-sent.bear { color: var(--red, #ff5470); }
    .wr-src { font-family: var(--mono); font-size: 9px; color: var(--text-dim); flex: none; text-transform: uppercase; letter-spacing: .04em; }
    .wr-ago { font-family: var(--mono); font-size: 9.5px; color: var(--text-dim); flex: none; min-width: 30px; text-align: right; }
    /* Freshness tiers: newest = brightest */
    .wire-row.wr-fresh { background: rgba(52,211,153,.035); }
    .wire-row.wr-fresh .wr-dot { background: var(--green, #34d399); animation: wr-pulse 1.6s ease-in-out infinite; }
    .wire-row.wr-fresh .wr-ago { color: var(--green, #34d399); font-weight: 700; }
    .wire-row.wr-fresh .wr-time { color: var(--text); }
    .wire-row.wr-recent .wr-dot { background: rgba(52,211,153,.45); }
    .wire-row.wr-aged .wr-title { color: var(--text-muted, #94a3b8); font-weight: 500; }
    @keyframes wr-pulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.72); } }
    /* Breaking: red rail, always bright */
    .wire-row.breaking { border-left-color: var(--red, #ff5470); background: rgba(255,69,96,.05); }
    .wire-row.breaking .wr-cat { background: rgba(255,69,96,.16); color: var(--red, #ff5470); }
    .wire-row.breaking .wr-title { color: var(--text); font-weight: 700; }
    @media (max-width: 900px) {
      .wire-row { flex-wrap: wrap; gap: 6px 8px; padding: 10px 12px 10px 9px; }
      .wr-title { flex-basis: 100%; order: 5; }
      .wr-src { margin-left: auto; }
    }
    .wire-item.breaking .wt-tag { color: var(--red); }
    .wire-upcoming-item {
      background: var(--surface2); border: 1px solid var(--border); border-left: 3px solid var(--cyan);
      border-radius: 6px; padding: 10px 12px; margin-bottom: 8px;
    }
    .wire-upcoming-item.high { border-left-color: var(--red); }
    .wire-upcoming-item.medium { border-left-color: var(--amber); }
    .wire-up-title { font-size: 11px; color: var(--text); font-weight: 600; }
    .wire-up-date { font-size: 9px; color: var(--text-dim); font-family: var(--mono); margin-top: 4px; }

    /* ── Econ calendar: FinancialJuice-style event board ── */
    #wire-upcoming-list { position: relative; flex: 1 1 0; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
    .wire-cal-day {
      font-size: 10.5px; font-weight: 700; letter-spacing: .12em; font-family: var(--mono);
      color: var(--text-dim); padding: 8px 2px 4px; border-bottom: 1px solid var(--border);
      position: sticky; top: 0; background: var(--surface2); z-index: 2;
    }
    .wire-cal-day.today { color: var(--cyan, #22d3ee); }
    .wire-cal-row {
      display: flex; align-items: flex-start; gap: 8px; padding: 7px 2px;
      border-bottom: 1px solid rgba(148,163,184,.07);
    }
    .wire-cal-row:last-child { border-bottom: none; }
    .wire-cal-row:hover { background: rgba(139,92,246,.05); }
    .wc-time { font-family: var(--mono); font-size: 11.5px; color: var(--text-dim); line-height: 17px; flex-shrink: 0; width: 40px; }
    .wc-dot { width: 7px; height: 7px; border-radius: 50%; margin-top: 5px; flex-shrink: 0; background: var(--text-dim); opacity: .5; }
    .wire-cal-row.imp-3 .wc-dot { background: var(--red, #ff5470); opacity: 1; box-shadow: 0 0 6px rgba(255,84,112,.5); }
    .wire-cal-row.imp-2 .wc-dot { background: var(--amber, #fbbf24); opacity: .95; }
    .wire-cal-row.imp-1 .wc-dot { background: #facc15; opacity: .35; }
    .wc-ccy { font-family: var(--mono); font-size: 10.5px; font-weight: 700; letter-spacing: .05em; color: var(--text-muted); line-height: 17px; flex-shrink: 0; width: 34px; }
    .wc-body { flex: 1; min-width: 0; }
    .wc-title { font-size: 12.5px; font-weight: 600; color: var(--text); line-height: 17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .wire-cal-row.imp-3 .wc-title { font-weight: 700; }
    .wc-period { font-size: 9.5px; color: var(--text-dim); font-family: var(--mono); }
    .wc-vals { display: flex; gap: 12px; margin-top: 3px; font-family: var(--mono); font-size: 11px; color: var(--text-dim); }
    .wc-val { white-space: nowrap; }
    .wc-actual.has { color: var(--cyan, #22d3ee); font-weight: 700; }
    .wire-cal-row.awaiting .wc-time { color: var(--amber, #fbbf24); font-weight: 700; }
    .wire-cal-row.released .wc-title { color: var(--text-muted); font-weight: 500; }
    .wire-cal-row.released.imp-3 .wc-title { color: var(--text); }
    .wire-cal-tz { font-size: 9px; color: var(--text-dim); font-weight: 600; letter-spacing: .08em; margin-left: 6px; }

    /* ── Top wire ticker: category-colored tags (matches wire page chips) ── */
    .wire-ticker-item .wt-tag.wt-crypto   { color: #f7931a; }
    .wire-ticker-item .wt-tag.wt-tech     { color: #a78bfa; }
    .wire-ticker-item .wt-tag.wt-equities { color: var(--cyan, #22d3ee); }
    .wire-ticker-item .wt-tag.wt-macro    { color: #facc15; }
    .wire-ticker-item .wt-tag.wt-breaking { color: var(--red, #ff5470); }
    .wire-empty { font-size: 11px; color: var(--text-dim); font-family: var(--mono); padding: 12px 0; }
    /* ── Market Mood strip: lives in the Goods page header, dials side by side ── */
    .goods-head-row { display:flex; justify-content:space-between; align-items:flex-end; gap:18px; flex-wrap:wrap; }
    .goods-mood-wrap { min-width:0; }
    .goods-mood-head { font-family:var(--mono); font-size:9px; font-weight:800; letter-spacing:.08em; color:var(--text-dim); text-transform:uppercase; margin-bottom:5px; }
    .goods-mood-strip { display:flex; gap:8px; align-items:stretch; }
    .goods-mood-strip .wire-mood-row { width:200px; min-width:160px; padding:6px 10px; }
    .goods-mood-strip .wire-mood-sub { margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    @media (max-width: 1050px) { .goods-mood-strip .wire-mood-row { width:160px; } }
    @media (max-width: 760px) { .goods-mood-strip { flex-wrap:wrap; } .goods-mood-strip .wire-mood-row { flex:1; } }
    .wire-intel-card {
      margin-bottom:12px; padding:13px 14px; border-radius:10px;
      border:1px solid rgba(34,211,238,.28);
      background:linear-gradient(135deg, rgba(34,211,238,.08), rgba(167,139,250,.045)), var(--surface2);
    }
    .wire-intel-kicker { font-family:var(--mono); font-size:9px; font-weight:800; letter-spacing:.08em; color:var(--cyan); text-transform:uppercase; margin-bottom:6px; }
    .wire-intel-title { font-size:13px; font-weight:800; color:var(--text); line-height:1.35; }
    .wire-intel-note { margin-top:6px; font-size:10.5px; color:var(--text-muted); line-height:1.55; }
    .wire-impact { margin-top:8px; font-family:var(--mono); font-size:9px; color:var(--text-dim); display:flex; flex-wrap:wrap; gap:6px; }
    .wire-impact span { border:1px solid var(--border); background:var(--surface-accent); border-radius:999px; padding:3px 7px; }
    .library-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }
    @media (max-width:820px){ .library-grid{ grid-template-columns:1fr; } }
    .library-resource-card { background:var(--surface2); border:1px solid var(--border); border-radius:8px; padding:14px 15px;
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
    .library-resource-card:hover { transform: translateY(-1px); border-color: rgba(0,194,255,.35);
      box-shadow: 0 14px 34px rgba(0,0,0,.24); }
    .library-resource-card button { transition: background .15s ease, color .15s ease; }
    .library-resource-card button:hover { background: rgba(0,194,255,.12) !important; }
    .library-resource-title { font-size:13px; font-weight:800; color:var(--text); font-family:var(--mono); }
    .library-resource-meta { font-size:9px; color:var(--cyan); font-family:var(--mono); margin-top:2px; text-transform:uppercase; letter-spacing:.04em; }
    .library-resource-text { font-size:10.5px; color:var(--text-muted); margin-top:7px; line-height:1.6; }
    .library-pill-row { display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
    .library-pill { font-family:var(--mono); font-size:8px; color:var(--text-dim); border:1px solid var(--border); background:var(--surface-accent); border-radius:999px; padding:3px 7px; }

    .terminal-grid {
      flex: 1;
      display: grid;
      grid-template-columns: 3fr 2fr;
      gap: 0;
      overflow: hidden;
    }

    .col-left, .col-right {
      padding: 16px;
      display: flex;
      flex-direction: column;
      gap: 14px;
      overflow-y: auto;
    }
    .col-right { border-left: 1px solid var(--border); }

    /* === PANELS === */
    .panel {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 8px;
      overflow: hidden;
    }

    .panel-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 10px 14px;
      border-bottom: 1px solid var(--border);
      background: #070c18;
    }

    .panel-title {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 700;
      color: var(--text);
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .panel-subtitle { font-family: var(--mono); font-size: 10px; color: var(--text-dim); }
    .panel-body { padding: 14px; }

    /* === FORECAST BANDS === */
    .band-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      margin-bottom: 12px;
    }
    .band-box {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 6px;
      padding: 14px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .band-box-high { border-color: rgba(255,69,96,0.2); }
    .band-box-low { border-color: rgba(0,194,255,0.2); }
    .band-box::before {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 2px;
    }
    .band-box-high::before { background: linear-gradient(90deg, transparent, var(--red), transparent); }
    .band-box-low::before { background: linear-gradient(90deg, transparent, var(--cyan), transparent); }
    .band-label { font-size: 9px; font-weight: 600; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.08em; font-family: var(--mono); margin-bottom: 6px; }
    .band-value { font-size: 22px; font-weight: 800; font-family: var(--mono); letter-spacing: -0.02em; line-height: 1; }
    .band-box-high .band-value { color: var(--red); }
    .band-box-low .band-value { color: var(--cyan); }

    /* Range visualizer */
    .range-viz {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 6px;
      padding: 12px;
      margin-bottom: 12px;
    }
    .range-viz-header { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 9px; color: var(--text-dim); margin-bottom: 8px; }
    .range-bar-track {
      background: var(--surface2);
      border-radius: 4px;
      height: 8px;
      position: relative;
      overflow: visible;
      margin: 0 4px;
    }
    .range-bar-fill {
      position: absolute;
      top: 0; bottom: 0;
      border-radius: 4px;
      background: linear-gradient(90deg, rgba(0,194,255,0.4), rgba(255,69,96,0.4));
      transition: all 0.4s ease;
    }
    .range-bar-price {
      position: absolute;
      top: 50%;
      transform: translate(-50%, -50%);
      width: 10px; height: 10px;
      border-radius: 50%;
      background: #fff;
      border: 2px solid var(--cyan);
      box-shadow: 0 0 6px var(--cyan);
      transition: left 0.4s ease;
      z-index: 2;
    }
    .range-viz-labels { display: flex; justify-content: space-between; margin-top: 6px; font-family: var(--mono); font-size: 9px; }
    .rvl-low { color: var(--cyan); }
    .rvl-price { color: var(--text-muted); text-align: center; }
    .rvl-high { color: var(--red); }

    /* Meta metrics row */
    .metrics-row {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1.4fr;
      gap: 8px;
      margin-bottom: 12px;
    }
    @media (max-width: 640px) { .metrics-row { grid-template-columns: 1fr 1fr; } }

    /* ============================================================
       MOBILE RESPONSIVE LAYER (phone / tablet) — additive only
       ============================================================ */
    .mobile-menu-btn {
      display: none;
      flex-direction: column;
      justify-content: center;
      gap: 4px;
      width: 34px; height: 34px;
      background: none; border: none; cursor: pointer;
      padding: 6px; margin-right: 4px;
    }
    .mobile-menu-btn span {
      display: block; width: 20px; height: 2px;
      background: var(--text-muted); border-radius: 2px; transition: all .2s;
    }
    .sidebar-scrim {
      display: none;
      position: fixed; inset: 0; z-index: 119;
      background: rgba(0,0,0,0.6);
      backdrop-filter: blur(2px);
    }
    .sidebar-scrim.open { display: block; }

    @media (max-width: 900px) {
      /* Header: compact, room for hamburger */
      .mobile-menu-btn { display: flex; }
      header { padding: 0 12px; height: 52px; }
      .header-left { gap: 10px; }
      .header-divider { display: none; }
      .header-price-widget { display: none; }
      .header-price-widget:first-of-type { display: flex; }
      .wire-ticker { display: none; }
      .header-right { gap: 8px; flex-shrink:0; }
      .theme-toggle { height:30px; width:36px; padding:0; justify-content:center; }
      .theme-toggle .theme-label { display:none; }
      .header-right .utc-clock { display: none; }
      .status-badge { display:none; }
      header .logout-btn { display:none !important; }
      .sidebar-disconnect { display:block; }
      .logo-area { min-width:0; flex:1 1 auto; }
      .logo-text { max-width:none; overflow:visible; text-overflow:clip; white-space:nowrap; font-size:12px; letter-spacing:.08em; }

      /* App container: let it scroll naturally instead of fixed-height flex */
      .app-container { display: block; height: auto; min-height: calc(100vh - 52px - 28px - 52px); }

      /* Sidebar -> slide-out drawer */
      .sidebar {
        position: fixed;
        top: 0; left: 0; bottom: 0;
        width: 270px; min-width: 270px;
        z-index: 120;
        transform: translateX(-100%);
        transition: transform .25s ease;
        box-shadow: 0 0 40px rgba(0,0,0,0.6);
      }
      .sidebar.open { transform: translateX(0); }

      /* Main area: full width, natural height */
      .main-area { overflow: visible; height: auto; }
      .terminal-grid {
        display: block;
        overflow: visible;
        height: auto;
      }
      .col-left, .col-right {
        overflow: visible;
        padding: 12px;
        height: auto;
      }
      .col-right { border-top: 1px solid var(--border); }

      /* Chart: give it real height on phone so it isn't squished */
      #tv-chart-container, .tv-wrapper { min-height: 60vh !important; height: 60vh !important; }

      /* Top strip: wrap instead of overflow */
      .top-strip { flex-wrap: wrap; gap: 6px 14px; padding: 8px 12px; }
      .strip-left { flex-wrap: wrap; gap: 8px 14px; }

      /* Collapse all rigid multi-column grids to single column */
      .terminal-grid > *,
      .col-left > *, .col-right > * { min-width: 0; }
    }

    @media (max-width: 640px) {
      /* Force the big interior grids to stack */
      .conv-matrix-grid,
      [style*="grid-template-columns:3fr 2fr"],
      [style*="grid-template-columns: 3fr 2fr"] { grid-template-columns: 1fr !important; }
      .metrics-row { grid-template-columns: 1fr 1fr !important; }
      .logo-text { font-size: 11px; max-width:none; overflow:visible; text-overflow:clip; letter-spacing:.06em; }
      .logo-area img { width:20px; height:20px; }
      .hpw-price { font-size: 12px; }
    }

    .metric-box {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 5px;
      padding: 10px;
    }
    .metric-lbl { font-size: 8px; font-weight: 600; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.08em; font-family: var(--mono); margin-bottom: 4px; }
    .metric-val { font-size: 12px; font-weight: 700; font-family: var(--mono); }
    .mc { color: var(--cyan); }
    .mg { color: var(--green); }
    .mr { color: var(--red); }
    .ma { color: var(--amber); }

    /* Candle progress */
    .candle-prog {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 6px;
      padding: 12px;
      margin-bottom: 12px;
    }
    .cp-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
    .cp-lbl { font-size: 9px; color: var(--text-dim); font-family: var(--mono); text-transform: uppercase; }
    .cp-pct { font-size: 12px; font-weight: 700; font-family: var(--mono); color: var(--cyan); }
    .cp-track { background: var(--surface2); height: 5px; border-radius: 3px; overflow: hidden; }
    .cp-fill { height: 100%; width: 0%; background: linear-gradient(90deg, var(--cyan), var(--green)); transition: width 1s ease; border-radius: 3px; }
    .cp-tags { display: flex; justify-content: space-between; margin-top: 8px; gap: 8px; }
    .hit-tag {
      flex: 1;
      text-align: center;
      font-size: 9px;
      font-weight: 700;
      font-family: var(--mono);
      padding: 3px 8px;
      border-radius: 3px;
      letter-spacing: 0.04em;
    }
    .ht-untagged { color: var(--text-dim); background: rgba(255,255,255,0.03); border: 1px solid var(--border); }
    .ht-tagged { color: #000; background: var(--green); }
    .ht-triggered { color: #000; background: var(--amber); }

    /* Next forecast */
    .next-forecast {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 6px;
      padding: 12px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .nf-left { }
    .nf-center { text-align: center; padding: 0 14px; border-left: 1px solid var(--border); border-right: 1px solid var(--border); }
    .nf-lbl { font-size: 9px; color: var(--text-dim); font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 3px; }
    .nf-val { font-size: 18px; font-weight: 800; font-family: var(--mono); color: var(--cyan); }
    .nf-sub { font-size: 10px; color: var(--text-muted); font-family: var(--mono); margin-top: 2px; }
    .nf-right { text-align: right; }
    .nf-center, .nf-right, #prev-candle-box, #rollvar-val, #rollvar-sub {
      font-family: var(--mono);
      font-variant-numeric: tabular-nums;
      font-feature-settings: "tnum";
    }
    .nf-center { min-width: 130px; }
    .nf-right { min-width: 148px; }
    #prev-candle-box { line-height: 1.35; min-height: 58px; }
    #prev-candle-box span { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }
    @media (max-width:640px) {
      .nf-center { min-width: 118px; padding: 0 10px; }
      .nf-right { min-width: 132px; }
      #prev-candle-box { font-size: 9px !important; line-height: 1.35; }
    }

    /* === TACTICAL COMMAND POST === */
    .live-price-box {
      background: var(--bg);
      border: 1px solid var(--border2);
      border-radius: 6px;
      padding: 14px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 12px;
    }
    .lpb-price {
      font-size: 28px;
      font-weight: 900;
      font-family: var(--mono);
      letter-spacing: -0.02em;
      transition: color 0.12s;
      font-variant-numeric: tabular-nums;
      font-feature-settings: "tnum";
    }
    /* Fixed-width digits everywhere live numbers tick, so values don't shift layout */
    .hpw-price, .dist-val, .strip-field, #strip-price, .mc, .mr, .mg, .cp-pct, .tr-pct {
      font-variant-numeric: tabular-nums;
      font-feature-settings: "tnum";
    }
    .lpb-price.up { color: var(--green); }
    .lpb-price.dn { color: var(--red); }
    .lpb-price.nc { color: var(--cyan); }
    .lpb-label { font-size: 9px; color: var(--text-dim); font-family: var(--mono); text-transform: uppercase; margin-bottom: 2px; }
    .lpb-sub { font-size: 10px; color: var(--text-muted); font-family: var(--mono); }

    .dist-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .dist-box { background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 12px; }
    .dist-lbl { font-size: 9px; color: var(--text-dim); font-family: var(--mono); text-transform: uppercase; margin-bottom: 6px; }
    .dist-val { font-size: 12px; font-weight: 700; font-family: var(--mono); margin-bottom: 8px; }
    .dist-bar-track { background: var(--surface2); height: 4px; border-radius: 2px; overflow: hidden; }
    .dist-bar-fill { height: 100%; width: 0%; border-radius: 2px; transition: width 0.4s; }
        /* Escalating proximity meter (fractions of MAE / 5-candle avg):
       lvl1 0.75-1.0x -> 1 dot | lvl2 0.50-0.75x -> 2 dots
       lvl3 0.25-0.50x -> 3 dots solid | lvl4 <0.25x -> 3 dots flashing.
       Box glow brightens with each level. Dots SOLID until lvl4. */
    .prox-meter { display:none; margin-left:6px; line-height:1; }
    .dist-box.lvl1 .prox-meter, .dist-box.lvl2 .prox-meter, .dist-box.lvl3 .prox-meter, .dist-box.lvl4 .prox-meter { display:inline-block; }
    .prox-meter i { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--border3); margin-left:3px; vertical-align:middle; transition: background .25s, box-shadow .25s; }
    .prox-meter i.on { background:var(--green); box-shadow:0 0 6px var(--green); }
    /* flashing only at the closest level */
    .dist-box.lvl4 .prox-meter i.on { animation: distPulse 0.7s ease-in-out infinite; }
    /* box glow ramps brighter as price closes in */
    .dist-box.lvl1 { border-color: rgba(0,214,143,0.30) !important; }
    .dist-box.lvl2 { border-color: rgba(0,214,143,0.50) !important; box-shadow: 0 0 8px rgba(0,214,143,0.15); }
    .dist-box.lvl3 { border-color: rgba(0,214,143,0.75) !important; box-shadow: 0 0 12px rgba(0,214,143,0.28); }
    .dist-box.lvl4 { border-color: var(--green) !important; box-shadow: 0 0 18px rgba(0,214,143,0.45); }
    .dist-box.lvl3 .dist-bar-fill, .dist-box.lvl4 .dist-bar-fill { background: var(--green) !important; }
    @keyframes distPulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.45; transform:scale(.78); } }

    /* === TV CHART === */
    .tv-wrapper { width: 100%; height: 360px; border-radius: 0 0 8px 8px; overflow: hidden; background: #050a15; }

    /* === FORECAST HISTORY === */
    .history-wrap {
      background: var(--bg);
      border-radius: 0 0 8px 8px;
      overflow: hidden;
    }

    .hist-table {
      width: 100%;
      border-collapse: collapse;
      font-family: var(--mono);
      font-size: 10px;
    }
    .hist-table thead th {
      background: var(--surface2);
      padding: 7px 10px;
      text-align: left;
      font-size: 9px;
      font-weight: 700;
      color: var(--text-dim);
      text-transform: uppercase;
      letter-spacing: 0.06em;
      border-bottom: 1px solid var(--border);
      position: sticky;
      top: 0;
    }
    .hist-table th:nth-child(2), .hist-table th:nth-child(3) { text-align: right; }
    .hist-table th:nth-child(4) { text-align: center; }

    .hist-table tbody tr { border-bottom: 1px solid var(--border); }
    .hist-table tbody tr:hover td { background: rgba(255,255,255,0.015); }
    .hist-table td { padding: 7px 10px; }
    .hist-table td:nth-child(2), .hist-table td:nth-child(3) { text-align: right; }
    .hist-table td:nth-child(4) { text-align: center; }

    .td-tf { font-size: 8px; font-weight: 700; padding: 1px 5px; border-radius: 2px; color: var(--text-dim); background: var(--surface2); border: 1px solid var(--border); }
    .td-key { font-size: 10px; color: var(--text-muted); }
    .td-high { color: var(--red); }
    .td-low { color: var(--cyan); }

    .badge {
      display: inline-block;
      font-size: 9px;
      font-weight: 700;
      padding: 2px 7px;
      border-radius: 3px;
      letter-spacing: 0.04em;
    }
    .badge-hit { color: #000; background: var(--green); }
    .badge-partial {
      color: var(--amber);
      background: var(--amber-dim);
      border: 1px solid rgba(245,158,11,0.25);
    }
    .badge-miss {
      color: var(--red);
      background: var(--red-dim);
      border: 1px solid rgba(255,69,96,0.25);
    }
    .badge-pending { color: var(--text-dim); background: rgba(255,255,255,0.04); border: 1px solid var(--border); }

    .history-scroll { max-height: 340px; overflow-y: auto; }

    /* === CONVERGENCE MATRIX FULL GRID === */
    .matrix-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 8px;
    }
    .matrix-cell {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 5px;
      padding: 10px;
    }
    .matrix-cell-asset { font-size: 9px; font-weight: 700; color: var(--text-dim); font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 8px; }
    .matrix-tf-row { display: flex; align-items: center; justify-content: space-between; padding: 3px 0; border-bottom: 1px solid var(--border); font-family: var(--mono); font-size: 9px; }
    .matrix-tf-row:last-child { border-bottom: none; }
    .mtfr-lbl { color: var(--text-dim); }
    .mtfr-conf { font-weight: 700; }
    .mtfr-bias { font-size: 8px; color: var(--text-dim); }

    /* ── FORECAST DROP-IN ANIMATION ────────────────── */
    @keyframes forecastDropIn {
      0% { opacity: 0; transform: translateY(-12px); }
      100% { opacity: 1; transform: translateY(0); }
    }
    .fc-drop-in {
      animation: forecastDropIn 0.5s ease-out forwards;
    }
    .fc-drop-in-children > * {
      animation: forecastDropIn 0.4s ease-out forwards;
      opacity: 0;
    }
    .fc-drop-in-children > *:nth-child(1) { animation-delay: 0s; }
    .fc-drop-in-children > *:nth-child(2) { animation-delay: 0.1s; }
    .fc-drop-in-children > *:nth-child(3) { animation-delay: 0.2s; }
    .fc-drop-in-children > *:nth-child(4) { animation-delay: 0.3s; }
    .fc-drop-in-children > *:nth-child(5) { animation-delay: 0.4s; }

    /* ===== TIER SYSTEM UI ===== */
    .tier-badge { display:inline-flex; align-items:center; gap:5px; font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:.1em; padding:3px 10px; border-radius:99px; text-transform:uppercase; }
    .tier-badge.tb-1 { color:#8aa0ff; background:rgba(138,160,255,.12); border:1px solid rgba(138,160,255,.35); }
    .tier-badge.tb-2 { color:var(--accent-cyan,#22d3ee); background:rgba(34,211,238,.12); border:1px solid rgba(34,211,238,.4); }
    .tier-badge.tb-3 { color:var(--gold,#fb8b1e); background:rgba(251,139,30,.14); border:1px solid rgba(251,139,30,.45); box-shadow:0 0 10px rgba(251,139,30,.25); }
    /* locked feature wrapper */
    .tier-locked { position:relative; }
    .tier-locked > :not(.tier-lock-overlay) { filter:blur(3px) grayscale(.4); opacity:.45; pointer-events:none; user-select:none; }
    .tier-lock-overlay { position:absolute; inset:0; z-index:20; display:flex; align-items:center; justify-content:center; background:rgba(6,8,15,.55); backdrop-filter:blur(1px); border-radius:inherit; }
    .tier-lock-overlay .tlo-inner { display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; padding:16px; }
    .tier-lock-overlay .tlo-lock { font-size:22px; filter:drop-shadow(0 0 6px rgba(251,139,30,.5)); }
    .tier-lock-overlay .tlo-txt { font-family:var(--mono); font-size:12px; color:#cbd5e1; letter-spacing:.04em; }
    .tier-lock-overlay .tlo-txt b { color:var(--gold,#fb8b1e); }
    .tier-lock-overlay .tlo-cta { font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:.06em; color:#0a0d1a; background:var(--gold,#fb8b1e); padding:6px 16px; border-radius:7px; text-decoration:none; text-transform:uppercase; }
    .tier-lock-overlay .tlo-cta:hover { filter:brightness(1.1); }

    /* ===== sub-selector bar (Nexus|Yours, AI|Community) ===== */
    .subsel-bar { display:flex; gap:6px; padding:10px 16px; background:var(--surface); border-bottom:1px solid var(--border); flex-shrink:0; }
    .subsel-btn { position:relative; font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); background:var(--surface2); border:1px solid var(--border); border-radius:7px; padding:7px 18px; cursor:pointer; }
    .subsel-btn:hover { color:var(--text); border-color:var(--border2); }
    .subsel-btn.active { color:#fff; background:var(--violet,#8b5cf6); border-color:var(--violet,#8b5cf6); box-shadow:0 0 12px var(--violet-dim,rgba(139,92,246,.2)); }
    .subsel-lock { font-size:9px; margin-left:4px; opacity:.8; }
    /* your-bot slots */
    .yourbot-slot { background:var(--surface-accent,var(--surface2)); border:1px dashed var(--border2); border-radius:10px; padding:18px 16px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:6px; min-height:130px; justify-content:center; }
    .yourbot-slot.ghost { opacity:.5; border-style:dotted; }
    .ybs-plus { font-size:26px; color:var(--violet,#8b5cf6); font-weight:300; line-height:1; }
    .ybs-title { font-size:12px; font-weight:700; color:var(--text); font-family:var(--mono); }
    .ybs-sub { font-size:10px; color:var(--text-muted); line-height:1.4; }
    .ybs-btn { margin-top:6px; font-family:var(--mono); font-size:10px; font-weight:700; color:#fff; background:var(--violet,#8b5cf6); border:none; border-radius:6px; padding:6px 16px; cursor:pointer; text-transform:uppercase; letter-spacing:.05em; }
    /* AI assistant chat ── V2 richer layout */
    #ai-msgs { background:
        radial-gradient(800px 400px at 80% -10%, rgba(34,211,238,.05), transparent 60%),
        var(--bg); }
    .ai-welcome { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:32px 20px; gap:0; height:100%; min-height:360px; }
    .ai-welcome-orb { width:78px; height:78px; border-radius:22px; display:flex; align-items:center; justify-content:center; font-size:34px; margin-bottom:18px;
      background:linear-gradient(135deg, rgba(34,211,238,.28), rgba(0,194,255,.1)); border:1px solid rgba(34,211,238,.4);
      box-shadow:0 0 36px rgba(34,211,238,.22); }
    .ai-welcome-title { font-size:20px; font-weight:700; color:var(--text); font-family:var(--mono); letter-spacing:.01em; }
    .ai-welcome-sub { font-size:12px; color:var(--text-muted); margin-top:8px; line-height:1.6; max-width:440px; }
    .ai-chip-row { display:flex; flex-wrap:wrap; gap:9px; justify-content:center; margin-top:22px; max-width:520px; }
    .ai-chip { font-family:var(--mono); font-size:11px; color:var(--accent-cyan,#22d3ee); background:rgba(34,211,238,.08); border:1px solid rgba(34,211,238,.32); border-radius:99px; padding:9px 16px; cursor:pointer; transition:.12s; }
    .ai-chip:hover { background:rgba(34,211,238,.18); border-color:rgba(34,211,238,.6); transform:translateY(-1px); }
    .ai-disclaimer { font-size:9px; color:var(--text-dim); margin-top:22px; font-family:var(--mono); line-height:1.6; max-width:420px; }

    /* populated AI conversation: user vs assistant bubbles */
    .ai-msg { display:flex; flex-direction:column; padding:8px 16px; border-bottom:none; max-width:84%; }
    .ai-msg.ai-user { align-self:flex-end; align-items:flex-end; }
    .ai-msg.ai-assistant { align-self:flex-start; align-items:flex-start; }
    .ai-msg-role { font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:4px; }
    .ai-msg.ai-user .ai-msg-role { color:var(--text-muted); }
    .ai-msg.ai-assistant .ai-msg-role { color:var(--accent-cyan,#22d3ee); }
    .ai-msg-body { font-size:13px; color:var(--text); line-height:1.55; font-family:var(--mono); padding:9px 14px; border-radius:14px; box-shadow:0 1px 2px rgba(0,0,0,.3); }
    .ai-msg.ai-user .ai-msg-body { background:linear-gradient(135deg, rgba(34,211,238,.22), rgba(0,194,255,.14)); border:1px solid rgba(34,211,238,.34); border-bottom-right-radius:5px; }
    .ai-msg.ai-assistant .ai-msg-body { background:var(--surface-accent); border:1px solid var(--border); border-bottom-left-radius:5px; }
    .ai-typing .ai-msg-body { color:var(--text-dim); }
    /* Nexus Data page */
    .data-card { background:var(--surface-accent,var(--surface2)); border:1px solid var(--border); border-radius:8px; padding:14px 16px; }
    .dc-label { font-size:9px; color:var(--text-dim); font-family:var(--mono); text-transform:uppercase; letter-spacing:.08em; }
    .dc-val { font-size:22px; font-weight:700; color:var(--text); font-family:var(--mono); margin-top:5px; }
    .data-feed-row { display:grid; grid-template-columns:1.2fr 1.4fr 1.4fr .8fr; gap:8px; font-family:var(--mono); font-size:10px; color:var(--text-muted); background:var(--surface2); border:1px solid var(--border); border-radius:6px; padding:8px 12px; }
    .data-feed-row .dfr-perfect { color:var(--green); font-weight:700; }
    .data-feed-row .dfr-partial { color:var(--gold,#fb8b1e); font-weight:700; }
    .data-feed-row .dfr-breach { color:var(--red,#ff4560); font-weight:700; }
  
    /* ===== DESKTOP CHAT POLISH (>=901px): centered columns, premium presence ===== */
    @media (min-width:901px) {
      #chat-ai-view .chat-container, #chat-t3-view .chat-container {
        max-width: 880px; width: 100%; margin: 0 auto;
        border-left: 1px solid var(--border); border-right: 1px solid var(--border);
        background: linear-gradient(180deg, rgba(255,255,255,.014), rgba(255,255,255,0));
      }
      #chat-ai-view .chat-msgs, #chat-t3-view .chat-msgs { padding: 28px 34px; }
      .ai-welcome { max-width: 580px; margin: 9vh auto 0; }
      .ai-welcome-orb { font-size: 42px; filter: drop-shadow(0 0 18px rgba(34,211,238,.35)); }
      .ai-welcome-title { font-size: 22px; }
      .ai-welcome-sub { font-size: 13px; line-height: 1.7; }
      .ai-chip { font-size: 11px; padding: 9px 14px; }
      #chat-ai-view .chat-input-row, #chat-t3-view .chat-input-row {
        max-width: 880px; width: 100%; margin: 0 auto 22px;
        border: 1px solid var(--border); border-radius: 12px;
        background: var(--surface2); padding: 8px;
      }
      #chat-ai-view .chat-input-row input, #chat-t3-view .chat-input-row input { font-size: 13px; padding: 12px 14px; }
      #chat-community-view .chat-msgs { padding: 22px 26px; }
      #chat-community-view .chat-msg { max-width: 68%; }
      #chat-community-view .lounge-chat { border-left: 1px solid var(--border); }
      #chat-community-view .chat-input-row { margin-bottom: 22px; }
    }

    /* ===== DESKTOP CHAT VIEWPORT FIT: tape stays, input always visible ===== */
    @media (min-width:901px) {
      #page-chat.page.active.chat-fitted { display:flex; flex-direction:column; overflow:hidden; }
      #page-chat.chat-fitted .subsel-bar { flex:0 0 auto; }
      #page-chat.chat-fitted #chat-ai-view,
      #page-chat.chat-fitted #chat-t3-view,
      #page-chat.chat-fitted #chat-community-view { flex:1 1 auto; min-height:0; height:auto !important; }
      #page-chat.chat-fitted .panel-body, #page-chat.chat-fitted .chat-container,
      #page-chat.chat-fitted .lounge, #page-chat.chat-fitted .lounge-chat { min-height:0; }
      #page-chat.chat-fitted .chat-msgs { overflow-y:auto; min-height:0; }
    }


    /* -- favorites star in the asset selector -------------- */
    .asset-btn-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }
    .asset-fav {
      display:inline-flex; align-items:center; justify-content:center;
      width:18px; height:18px; font-size:13px; line-height:1;
      color: var(--text-dim); cursor:pointer; border-radius:4px;
      opacity:.5; transition: opacity .15s, color .15s, transform .1s;
      -webkit-user-select:none; user-select:none;
    }
    .asset-btn:hover .asset-fav { opacity:.85; }
    .asset-fav:hover { color: var(--cyan); opacity:1; transform: scale(1.12); }
    .asset-fav.on { color:#facc15; opacity:1; }
    .asset-fav.on:hover { color:#fde047; }

/* ===== iOS input auto-zoom prevention (2026-07-09) =====
   Safari zooms the page when a focused input's font-size is under 16px.
   Applies to all text-entry controls at mobile width; heights unchanged. */
@media (max-width: 900px) {
  input[type="text"], input[type="password"], input[type="search"],
  input[type="email"], input[type="number"], textarea, select,
  .chat-input-row input, .gif-search {
    font-size: 16px !important;
  }
}


/* Hosted Paper Lab preview controls */
.pb-preview-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:10px;
  margin-top:14px;
  align-items:end;
}
.pb-field{
  font-size:9px;
  color:var(--text-dim);
  font-family:var(--mono);
  letter-spacing:.05em;
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
  text-transform:uppercase;
}
.pb-field select,
.pb-field input{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  background:var(--surface2);
  border:1px solid var(--border);
  color:var(--text);
  border-radius:6px;
  padding:8px 9px;
  font-family:var(--mono);
  font-size:12px;
  min-height:38px;
}
.pb-field select{ overflow:hidden; text-overflow:ellipsis; }

/* Paper Lab offset steppers + anchor pulse/colors (2026-07-19) */
.pb-stepper{ position:relative; display:block; width:100%; min-width:0; }
.pb-stepper input{ padding-right:32px; }
.pb-step-col{ position:absolute; top:1px; right:1px; bottom:1px; width:26px; display:flex; flex-direction:column; border-left:1px solid var(--border); border-radius:0 6px 6px 0; overflow:hidden; }
.pb-step-btn{ flex:1; display:flex; align-items:center; justify-content:center; background:var(--surface2); border:none; color:var(--text-dim); font-size:8px; line-height:1; cursor:pointer; padding:0; user-select:none; -webkit-user-select:none; touch-action:none; }
.pb-step-btn + .pb-step-btn{ border-top:1px solid var(--border); }
.pb-step-btn:hover{ color:var(--accent-cyan,#22d3ee); }
.pb-step-btn:active{ color:#06080f; background:var(--accent-cyan,#22d3ee); }
@keyframes pbAnchorPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.72; } }
.pb-field select.pb-pulse{ animation:pbAnchorPulse 1.5s ease-in-out infinite; }
.pb-field select.pb-anchor-high{ color:var(--red); }
.pb-field select.pb-anchor-low{ color:var(--cyan,#00c2ff); }
.pb-field select.pb-anchor-center{ color:var(--green); }
.pb-field select.pb-anchor-ref{ color:#a78bfa; }
.pb-field select.pb-anchor-off{ color:var(--text-dim); }
@media (max-width:720px){
  .pb-preview-grid{ grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); }
}