/* TYPE — the same self-hosted Switzer family as the platform website. UI, display, and
       tabular figures all use one face; monospace is reserved for source/code only. */
    @font-face {
      font-family: 'Switzer'; src: url('/assets/Switzer-Regular.aefa3d21af6a.woff2') format('woff2');
      font-weight: 400; font-style: normal; font-display: swap;
    }
    @font-face {
      font-family: 'Switzer'; src: url('/assets/Switzer-Medium.2ea341e35c0d.woff2') format('woff2');
      font-weight: 500; font-style: normal; font-display: swap;
    }
    @font-face {
      font-family: 'Switzer'; src: url('/assets/Switzer-Semibold.04084ce10f3b.woff2') format('woff2');
      font-weight: 600; font-style: normal; font-display: swap;
    }
    @font-face {
      font-family: 'Switzer'; src: url('/assets/Switzer-Bold.5cb009dd2131.woff2') format('woff2');
      font-weight: 700; font-style: normal; font-display: swap;
    }
    @font-face {
      font-family: 'JetBrains Mono';
      src: url('/assets/JetBrainsMono-Variable.18be452724bf.woff2') format('woff2');
      font-weight: 100 900; font-style: normal; font-display: swap;
    }
    /* ═══ Taking Prophets · Indicator Lab — design system (hi-fi handoff, Jul 2026) ═══ */
    :root {
      color-scheme: dark;
      /* THE accent — one saturated blue, the platform's only chrome-level colour. Channel
         triplets because ~40 call sites here read them through rgb(var(--blue) / a). */
      --accent: 37 99 235;       /* #2563eb — matches the Backtester and the website verbatim */
      --accent-hi: 59 130 246;   /* #3b82f6 */
      --accent-ink: #ffffff;     /* label ON the accent — it was #221803, a brown that only made sense on gold */
      /* CAUTION ONLY. This gold used to be the Lab's default accent; it now speaks when
         something needs attention and nowhere else. Deliberately NOT wired into --blue/--gold. */
      --warn: 234 182 60;        /* #eab63c */
      --warn-hi: 247 207 95;     /* #f7cf5f */
      --warn-ink: #221803;
      /* Back-compat aliases. Both families were painting gold and both were being used as the
         accent, so both resolve to the accent; genuine caution sites read --warn by hand. */
      --blue: var(--accent);
      --blue-hi: var(--accent-hi);
      --gold: var(--accent);
      --gold-hi: var(--accent-hi);
      --bg: #09090b;
      --bg-2: #17171b;
      --pane: #0c0c0f;
      --raised: #101013;
      --row-hover: #0d0d10;
      --toolbar-bg: rgba(9,9,11,.78);   /* the chart toolbar AND its sticky action mask */
      --surface: rgba(255,255,255,.05);
      --surface-2: rgba(255,255,255,.09);
      --solid: #101013;
      --card-grad: linear-gradient(180deg, #16161a, #101013);
      --card-grad-2: linear-gradient(180deg, #141417, #101013);
      --bubble-grad: linear-gradient(180deg, #202024, #161619);
      --accent-grad: linear-gradient(180deg, #3b82f6, #2563eb);
      --gold-grad: var(--accent-grad);   /* alias — see --gold above */
      --line: #1f1f24;
      --line-2: #35353c;
      --text: #efeeea;
      --text-2: #c0bdb6;
      --body-ai: #c0bdb6;
      --sec: #c0bdb6;
      --muted: #a09d96;
      --faint: #7c7a74;
      --ghost: #55555e;
      --accent-text: #bcd4ff;
      --ok: #35c77c;             /* bull / positive money */
      --ok-text: #6ee7a0;
      --danger: #f0544a;
      --diff-red: #f28b8b;
      --r: 14px; --r-lg: 18px; --r-sm: 10px; --r-pill: 999px;
      --sh-primary: 0 4px 16px rgba(37, 99, 235,.32), inset 0 1px 0 rgba(255,255,255,.18);
      --sh-send: 0 3px 12px rgba(37, 99, 235,.35);
      --sh-modal: 0 40px 100px rgba(0,0,0,.6), 0 0 0 1px rgba(0,0,0,.4);
      --sh-card: 0 14px 34px rgba(0,0,0,.4);
      --ease: cubic-bezier(.4,0,.2,1);
      --spring: cubic-bezier(.2,.8,.3,1);
      --font: 'Switzer', -apple-system, 'Segoe UI', sans-serif;
      --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
      /* Drawing-tool context menu (.btctx, injected by the shared draw-layer). The engine falls back to the
         Proving Ground's black terminal skin; the Lab overrides to neutral-glass here. */
      --btctx-bg: linear-gradient(180deg, #16161a, #101013);
      --btctx-border: rgba(255,255,255, .16);
      --btctx-input-bg: #141417;
      --btctx-input-border: rgba(255,255,255, .18);
    }
    * { box-sizing: border-box; }
    /* the `hidden` attribute must always win — otherwise a class that sets `display`
       (e.g. .toast{display:flex}) defeats it and elements never hide. */
    [hidden] { display: none !important; }
    html, body { height: 100%; margin: 0; }
    @supports (height: 100dvh) { html, body { height: 100dvh; } }
    body {
      font: 400 14px/1.55 var(--font); color: var(--text);
      background: radial-gradient(1100px 500px at 18% -10%, rgba(37, 99, 235,.18), transparent 60%), var(--bg);
      -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow: hidden;
    }
    ::selection { background: rgba(37, 99, 235,.35); }
    a { color: #3b82f6; text-decoration: none; } a:hover { color: #bcd4ff; }

    /* ── scrollbars ── */
    *::-webkit-scrollbar { width: 8px; height: 8px; }
    *::-webkit-scrollbar-thumb { background: #1e1e22; border-radius: 8px; }
    *::-webkit-scrollbar-track { background: transparent; }
    * { scrollbar-width: thin; scrollbar-color: #1e1e22 transparent; }

    /* ── icons (lucide-style strokes) ── */
    .ic { width: 15px; height: 15px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .ic-fill { fill: currentColor; stroke: none; width: 17px; height: 17px; }

    /* ── buttons ── */
    button { font: inherit; cursor: pointer; border: 0; color: inherit; -webkit-tap-highlight-color: transparent; }
    .btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
      background: var(--accent-grad); color: #ffffff; font-weight: 600; font-size: 13px;
      border-radius: var(--r-sm); padding: 10px 18px; letter-spacing: -.005em;
      border: 1px solid rgba(37, 99, 235,.35);
      box-shadow: var(--sh-primary);
      transition: filter .15s var(--ease), transform .08s var(--ease); }
    .btn:hover { filter: brightness(1.08); }
    .btn:active { transform: scale(.975); }
    .btn:disabled { opacity: .5; filter: grayscale(.35); cursor: default; box-shadow: none; }
    /* ghost actions — 32px control height per spec */
    /* Default TRANSPARENT — and stated at a specificity that survives
       product-language.css, which build-static appends AFTER this file and
       whose .tp-button-secondary re-applies var(--tp-surface) at equal
       specificity. Two previous fixes landed in the losing stylesheet. Three
       adjacent filled buttons with an 8px gap read as one pale slab behind
       Inspect/Code/Publish; the border is the affordance, the fill is hover. */
    .gbtn { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px;
      background: transparent; color: var(--text-2); border: 1px solid var(--line-2); border-radius: var(--r-sm);
      font-size: 12.5px; font-weight: 550; white-space: nowrap; flex: none;
      transition: color .15s var(--ease), background .15s var(--ease), border-color .15s var(--ease), transform .08s var(--ease); }
    /* Was `color:#fff; background:rgba(255,255,255,.11)` — white-on-light, i.e.
       the label vanished on hover in light mode. */
    .gbtn:hover { color: var(--text); background: var(--surface-2); border-color: var(--line-2); }
    /* Wins over the later stylesheet without !important: two classes beat one. */
    .ctoolbar .gbtn.tp-button-secondary { background: transparent; }
    .ctoolbar .gbtn.tp-button-secondary:hover:not(:disabled) { background: var(--surface-2); }
    .gbtn:active { transform: scale(.96); }
    .gbtn.active { color: var(--accent-text); border-color: rgba(37, 99, 235,.45); background: rgba(37, 99, 235,.1); }
    .gbtn .ic { color: var(--ghost, #7f838c); }
    .gbtn:hover .ic, .gbtn.active .ic { color: currentColor; }
    .iconbtn { width: 32px; padding: 0; justify-content: center; }

    /* ── inputs ── */
    input, textarea, select { font: inherit; color: var(--text); background: var(--bg-2); border: 1px solid var(--line-2);
      border-radius: 11px; padding: 9px 12px; outline: none; transition: border-color .15s var(--ease); }
    input::placeholder, textarea::placeholder { color: var(--faint); }
    input:focus, textarea:focus, select:focus { border-color: rgba(37, 99, 235,.5); }

    /* ── brand: white tile + rotated diamond ── */
    .logo-tile { width: 30px; height: 30px; flex: none; border-radius: 9px; background: linear-gradient(180deg, #ffffff, #cdd7e4);
      display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 10px rgba(0,0,0,.45); }
    .logo-tile img { width: 22px; height: 22px; object-fit: contain; display: block; }
    .wordmark { font-size: 14.5px; font-weight: 700; letter-spacing: -.01em; white-space: nowrap; }
    .eyebrow { font-size: 11px; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; color: var(--muted); }
    .ver-chip { font-family: var(--mono); font-size: 9.5px; font-weight: 600; color: var(--accent-text);
      background: rgba(37, 99, 235,.13); border: 1px solid rgba(37, 99, 235,.28); border-radius: 5px; padding: 1.5px 5px; flex: none; }

    /* ══════════ LOGIN GATE ══════════ */
    .gate { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; padding: 24px; }
    .gate-card { width: 100%; max-width: 420px; position: relative; padding: 40px 36px 34px; text-align: left;
      background: var(--card-grad); border: 1px solid var(--line-2); border-radius: var(--r-lg);
      box-shadow: var(--sh-modal); animation: rise .5s var(--spring) both; }
    .gate-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 20px; }
    .gate-card h1 { margin: 14px 0 10px; font-size: 31px; font-weight: 700; letter-spacing: -.02em; line-height: 1.08;
      background: linear-gradient(112deg, #ffffff 40%, #bcd4ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
    .gate-card p { margin: 0 0 24px; color: var(--muted); font-size: 14px; line-height: 1.6; }
    .gate-card .btn { width: 100%; padding: 13px; font-size: 14px; border-radius: 12px; }
    .discord-btn { background: var(--accent-grad); color: #ffffff; border-color: rgba(37, 99, 235,.4); box-shadow: var(--sh-primary); }
    .gate-note { margin-top: 14px; color: var(--faint); font-size: 12.5px; line-height: 1.7; }
    .gate-learn { color: var(--muted); font-weight: 600; text-decoration: none; }
    .gate-learn:hover { color: var(--text); text-decoration: underline; }
    .gate-err { min-height: 18px; margin-top: 10px; color: var(--danger); font-size: 12.5px; }
    .gate-member-only ul { margin: 0 0 22px; padding: 0 0 0 18px; color: var(--muted); font-size: 13.5px; line-height: 1.65; }
    .gate-member-only li + li { margin-top: 6px; }
    /* The purchase button is an <a>: pin its label colour above the theme's generic link rule
       (html[data-theme="light"] a) and the link hover tint, or it reads as disabled in light. */
    .gate-member-only a.discord-btn, .gate-member-only a.discord-btn:hover, html[data-theme="light"] .gate-member-only a.discord-btn { display: block; text-align: center; text-decoration: none; color: #ffffff; }
    .gate-switch, html[data-theme="light"] .gate-switch { display: block; margin-top: 14px; font-size: 12.5px; color: var(--muted); }
    .gate-foot { z-index: 2; color: var(--faint); font-size: 12px; letter-spacing: .06em; text-align: center; }
    .gate-foot b { color: var(--sec); font-weight: 600; }
    .foot-legal { display: block; margin-top: 6px; color: var(--ghost); font-size: 11px; letter-spacing: .02em; }
    .foot-legal a { color: var(--faint); text-decoration: none; } .foot-legal a:hover { color: var(--text); text-decoration: underline; }

    /* ── post-checkout code landing (same card language) ── */
    .paid-wrap { position: fixed; inset: 0; z-index: 80; display: flex; align-items: flex-start; justify-content: center;
      padding: 6vh 20px calc(40px + env(safe-area-inset-bottom)); overflow-y: auto; background: rgba(6,6,8,.66); backdrop-filter: blur(10px); }
    .paid-card { max-width: 520px; }
    .paid-card h1 { font-size: 26px; margin: 12px 0 8px; }
    .paid-state { height: 40px; display: flex; align-items: center; }
    .paid-spin { width: 26px; height: 26px; border-radius: 50%; border: 2.5px solid rgba(37, 99, 235,.25); border-top-color: #3b82f6; animation: paidspin .8s linear infinite; }
    @keyframes paidspin { to { transform: rotate(360deg); } }
    .paid-state .ok { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
      background: rgba(34,197,94,.14); border: 1px solid rgba(34,197,94,.4); color: var(--ok-text); }
    .paid-state .ok svg { width: 20px; height: 20px; }
    .paid-dl { width: 100%; padding: 13px; font-size: 14px; margin: 4px 0 22px; border-radius: 12px; }
    .paid-dl:disabled { opacity: .45; cursor: default; }
    .paid-steps { border-top: 1px solid var(--line); padding-top: 18px; }
    .paid-steps > b { font-size: 14px; letter-spacing: -.01em; }
    .paid-steps ol { margin: 10px 0 0; padding-left: 20px; color: var(--muted); font-size: 13.5px; line-height: 1.65; display: flex; flex-direction: column; gap: 7px; }
    .paid-steps b { color: var(--text); font-weight: 600; }
    .paid-steps code { font-family: var(--mono); font-size: 12px; background: var(--surface-2); border: 1px solid var(--line-2); border-radius: 5px; padding: 1px 5px; }
    .paid-note { margin: 16px 0 0; color: var(--faint); font-size: 12.5px; line-height: 1.6; }
    .paid-back { width: 100%; margin-top: 20px; padding: 11px; background: var(--surface-2); border: 1px solid var(--line-2); color: var(--text); box-shadow: none; border-radius: 12px; }
    .paid-back:hover { border-color: rgba(37, 99, 235,.5); filter: none; }

    /* ══════════ LAB ══════════ */
    .lab { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; }
    header { position: relative; z-index: 20; height: 56px; flex: none; display: flex; align-items: center; gap: 14px;
      padding: 0 max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left));
      border-bottom: 1px solid var(--line); background: rgba(9,9,11,.85); backdrop-filter: blur(12px); }
    .hbrand { display: flex; align-items: center; gap: 11px; }
    .hsep { width: 1px; height: 14px; background: rgba(255,255,255,.22); }
    .hmuted { color: var(--muted); font-weight: 500; font-size: 13px; }
    .hspacer { flex: 1; }
    .hbrand-link { display: flex; align-items: center; gap: 11px; text-decoration: none; color: inherit; border-radius: 9px; }
    .hbrand-link:hover .wordmark { color: var(--gold-hi); }
    /* Platform switcher — Build · Prove · Trade, one bar across all three tools. */
    .bpt { display: flex; align-items: center; gap: 2px; margin-left: 2px; }
    .bpt-i { display: flex; align-items: baseline; gap: 7px; padding: 7px 11px; border-radius: 9px; text-decoration: none;
      color: var(--muted); font-size: 13.5px; font-weight: 500; white-space: nowrap; position: relative;
      transition: background .15s var(--ease), color .15s var(--ease); }
    .bpt-r { font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ghost); font-weight: 600; }
    .bpt-i:hover { background: var(--surface); color: var(--text-2); }
    .bpt-i:hover .bpt-r { color: var(--muted); }
    .bpt-i.active { color: var(--text); }
    .bpt-i.active .bpt-r { color: var(--gold); }
    .bpt-i.active::after { content: ''; position: absolute; left: 11px; right: 11px; bottom: -1px; height: 2px; background: var(--gold-grad); border-radius: 2px; }
    @media (max-width: 760px) { .bpt-r { display: none; } .bpt-i { padding: 7px 9px; font-size: 13px; } }
    @media (max-width: 560px) { .bpt-i:not(.active) { display: none; } .bpt-i.active::after { display: none; } }
    .hactions { display: flex; align-items: center; gap: 8px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
    .hactions::-webkit-scrollbar { display: none; }
    .hactions > * { flex: none; }
    .hdiv { width: 1px; height: 20px; background: rgba(255,255,255,.14); margin: 0 4px; }
    .btn.hnew { height: 32px; padding: 0 13px; font-size: 12.5px; border-radius: var(--r-sm); }
    /* usage meter: conic ring + label */
    .usage-chip { display: inline-flex; align-items: center; gap: 7px; background: none; border: 0; padding: 0 4px;
      color: var(--muted); font-size: 11.5px; font-weight: 500; cursor: pointer; }
    .usage-chip:hover { color: var(--text); }
    .usage-ring { width: 16px; height: 16px; border-radius: 50%; flex: none;
      background: conic-gradient(#3b82f6 0%, #202024 0); display: flex; align-items: center; justify-content: center; }
    .usage-ring::after { content: ''; width: 10px; height: 10px; border-radius: 50%; background: #0e0e10; }
    .usage-chip.hot { color: var(--danger); }
    /* notifications bell */
    .notif-btn { position: relative; }
    .notif-dot { position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px;
      background: var(--accent-grad); color: #ffffff; font-size: 9.5px; font-weight: 700; line-height: 16px; text-align: center;
      box-shadow: 0 2px 8px rgba(37, 99, 235,.5); font-variant-numeric: tabular-nums; }
    .notif-item { display: flex; gap: 10px; padding: 10px 11px; border-radius: 10px; cursor: pointer; transition: background .14s var(--ease); align-items: flex-start; }
    .notif-item:hover { background: var(--surface-2); }
    .notif-item .nic { width: 26px; height: 26px; flex: none; border-radius: 8px; display: flex; align-items: center; justify-content: center;
      background: rgba(37, 99, 235,.12); border: 1px solid rgba(37, 99, 235,.25); color: #f0c974; }
    .notif-item .nic .ic { width: 12px; height: 12px; }
    .notif-item .nb { min-width: 0; flex: 1; }
    .notif-item .nt { font-size: 12.5px; line-height: 1.45; color: var(--sec); }
    .notif-item .nt b { color: var(--text); font-weight: 650; }
    .notif-item .nq { font-size: 11.5px; color: var(--faint); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-style: italic; }
    .notif-item .nw { font-size: 10.5px; color: var(--faint); margin-top: 2px; font-family: var(--mono); }
    .notif-item.unread .nt { color: var(--text); }
    .notif-item.unread::after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #3b82f6; flex: none; margin-top: 6px; }

    /* segmented Chat / Chart tabs (mobile) */
    .tabs { display: none; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: 2px; gap: 2px; }
    .tab { position: relative; display: inline-flex; align-items: center; gap: 6px; background: none; color: var(--muted);
      font-weight: 600; font-size: 12px; padding: 5px 12px; border-radius: 8px; transition: color .15s var(--ease), background .2s var(--ease); }
    .tab .ic { width: 14px; height: 14px; }
    .tab.active { color: #ffffff; background: var(--accent-grad); box-shadow: 0 2px 8px rgba(37, 99, 235,.35); }
    .tab .pip { position: absolute; top: 2px; right: 3px; width: 6px; height: 6px; border-radius: 50%; background: rgb(var(--gold)); box-shadow: 0 0 8px rgb(var(--gold)); display: none; }
    .tab.updated .pip { display: block; animation: pulse 1.4s var(--ease) infinite; }

    /* header pop-over panels (saved / usage) */
    .saved-panel { position: absolute; top: 60px; right: 16px; z-index: 30; width: 344px; max-width: calc(100vw - 32px); max-height: 72vh; overflow-y: auto;
      background: var(--solid); border: 1px solid var(--line-2); border-radius: var(--r);
      box-shadow: var(--sh-modal); animation: pop .18s var(--spring) both; transform-origin: top right; }
    .saved-head { display: flex; justify-content: space-between; align-items: center; padding: 13px 15px; border-bottom: 1px solid var(--line); font-weight: 600; font-size: 13.5px; letter-spacing: -.01em; }
    .saved-list { padding: 7px; }
    .saved-empty { padding: 26px 16px; color: var(--muted); font-size: 13px; text-align: center; line-height: 1.6; }
    .saved-item { display: flex; align-items: center; gap: 10px; padding: 10px 11px; border-radius: 10px; cursor: pointer; transition: background .14s var(--ease); }
    .saved-item::before { content: ''; width: 8px; height: 8px; border-radius: 2px; background: var(--accent-grad); flex: 0 0 auto; }
    .saved-item:hover { background: var(--surface-2); }
    .saved-item .si-main { flex: 1; min-width: 0; }
    .saved-item .si-name { font-weight: 500; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .saved-item .si-date { font-size: 11px; color: var(--faint); margin-top: 1px; font-family: var(--mono); }
    .saved-item .si-del { background: none; border: 0; color: var(--faint); cursor: pointer; font-size: 14px; padding: 3px 7px; border-radius: 7px; opacity: 0; transition: opacity .14s, color .14s, background .14s; }
    .saved-item:hover .si-del { opacity: 1; } .saved-item .si-del:hover { color: var(--danger); background: rgba(242,109,109,.12); }
    .saved-item .si-test { background: none; border: 0; color: var(--faint); cursor: pointer; padding: 3px 6px; border-radius: 7px; opacity: 0; transition: opacity .14s, color .14s, background .14s; display: inline-flex; align-items: center; }
    .saved-item .si-test .ic { width: 14px; height: 14px; }
    .saved-item:hover .si-test { opacity: 1; } .saved-item .si-test:hover { color: #3b82f6; background: rgba(37, 99, 235,.12); }
    .shelf-head { border-top: 1px solid var(--line); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
    .shelf-item .si-dl { background: none; border: 1px solid var(--line-2); color: var(--muted); border-radius: 8px; width: 30px; height: 30px; cursor: pointer; font-size: 13px; flex: none; transition: all .14s var(--ease); }
    .shelf-item:hover .si-dl, .shelf-item .si-dl:hover { color: #ffffff; background: var(--accent-grad); border-color: transparent; }
    .library-panel { width: 480px; max-height: min(78vh, 760px); overflow: hidden; display: flex; flex-direction: column; }
    .library-head { flex: none; padding: 16px 18px 14px; }
    .library-head > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
    .library-head > div > span { color: var(--text); font-size: 14px; font-weight: 700; }
    .library-head > div::after { content: 'Every build and revision, ready when you need it.'; color: var(--faint); font-size: 11.5px; font-weight: 450; letter-spacing: 0; }
    .library-toolbar { flex: none; display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 54%, transparent); }
    .library-search { flex: 1; min-width: 0; position: relative; display: flex; align-items: center; }
    .library-search .ic { position: absolute; left: 11px; width: 13px; height: 13px; color: var(--faint); pointer-events: none; }
    .library-search .tp-field { width: 100%; min-height: 36px; padding-left: 32px; }
    .library-count { flex: none; color: var(--faint); font: 600 10px var(--mono); letter-spacing: .05em; text-transform: uppercase; }
    #savedList { flex: 1; min-height: 180px; overflow-y: auto; padding: 10px; }
    .lib-loading { padding: 4px; }
    .lib-card { position: relative; overflow: hidden; margin-bottom: 8px; border: 1px solid var(--line); border-radius: 13px; background: color-mix(in srgb, var(--solid) 88%, var(--surface)); transition: border-color .16s var(--ease), box-shadow .16s var(--ease); }
    .lib-card:hover { border-color: var(--line-2); box-shadow: var(--sh-card); }
    .lib-card[aria-busy="true"] { opacity: .72; }
    .lib-open { width: 100%; min-width: 0; display: grid; grid-template-columns: 30px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 13px 13px 9px; border: 0; background: transparent; color: var(--text); text-align: left; font: inherit; cursor: pointer; }
    .lib-open:disabled { cursor: wait; }
    .lib-glyph { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(37, 99, 235,.28); border-radius: 9px; background: rgba(37, 99, 235,.08); color: var(--accent-text); font-size: 15px; }
    .lib-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
    .lib-copy strong { overflow: hidden; color: var(--text); font-size: 13.5px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
    .lib-copy > span { color: var(--faint); font: 500 10.5px var(--mono); }
    .lib-access { min-height: 23px; display: inline-flex; align-items: center; padding: 0 8px; border: 1px solid var(--line-2); border-radius: 999px; color: var(--muted); font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
    .lib-access.protected { border-color: rgba(126,139,173,.3); background: rgba(126,139,173,.08); }
    .lib-access.visible { border-color: rgba(37, 99, 235,.28); background: rgba(37, 99, 235,.07); color: var(--accent-text); }
    .lib-actions { display: flex; align-items: center; gap: 2px; padding: 0 10px 10px 50px; }
    .lib-actions .tp-button { min-height: 28px; padding: 0 8px; font-size: 10.5px; }
    .lib-actions .lib-danger-link { margin-left: auto; }
    .lib-danger-link:hover:not(:disabled) { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, transparent); }
    .lib-inline-form, .lib-delete-confirm { margin: 0 10px 10px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
    .lib-inline-form label { display: flex; flex-direction: column; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
    .lib-inline-form > div, .lib-delete-confirm > div:last-child { display: flex; justify-content: flex-end; gap: 7px; margin-top: 10px; }
    .lib-field-error, .lib-item-error { display: block; color: var(--danger); font-size: 11px; line-height: 1.4; }
    .lib-item-error { padding: 0 13px 11px 50px; }
    .lib-delete-confirm { display: flex; align-items: center; justify-content: space-between; gap: 14px; border-color: color-mix(in srgb, var(--danger) 28%, var(--line)); }
    .lib-delete-confirm > div:first-child { display: flex; flex-direction: column; gap: 2px; }
    .lib-delete-confirm strong { color: var(--text); font-size: 12px; }
    .lib-delete-confirm span { color: var(--faint); font-size: 10.5px; }
    .lib-delete-confirm > div:last-child { flex: none; margin-top: 0; }
    .lib-versions { position: relative; margin: 0 10px 10px 50px; padding: 11px 11px 6px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--surface) 68%, transparent); }
    .lib-versions > p { margin: 0 0 10px; color: var(--faint); font-size: 10.5px; line-height: 1.45; }
    .lib-version { position: relative; min-height: 38px; display: grid; grid-template-columns: 12px minmax(0,1fr) auto; align-items: center; gap: 8px; }
    .lib-version:not(:last-child)::after { content: ''; position: absolute; left: 5px; top: 24px; bottom: -10px; width: 1px; background: var(--line-2); }
    .lib-version-marker { width: 11px; height: 11px; z-index: 1; border: 2px solid var(--surface); border-radius: 50%; background: var(--accent-grad); box-shadow: 0 0 0 1px rgba(37, 99, 235,.32); }
    .lib-version-copy { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
    .lib-version-copy strong { color: var(--text); font: 650 11px var(--font); }
    .lib-version-copy span, .lib-version-empty { color: var(--faint); font: 500 9.5px var(--mono); }
    .lib-version-restore { min-height: 27px; padding: 0 8px; font-size: 10px; }
    .lib-current { color: var(--accent-text); font: 700 9px var(--mono); letter-spacing: .05em; text-transform: uppercase; }
    .lib-empty { min-height: 210px; gap: 7px; }
    .lib-empty .tp-button { margin-top: 8px; }
    .note-link { display: inline; background: none; border: none; padding: 0; margin: 0; font: inherit; font-weight: 600; color: #3b82f6; cursor: pointer; text-decoration: none; }
    .note-link:hover { text-decoration: underline; }
    /* usage panel */
    .usage-panel { width: 320px; }
    .usage-body { padding: 12px; display: flex; flex-direction: column; gap: 8px; }
    .usage-note { font-size: 12.5px; color: var(--muted); line-height: 1.5; margin-bottom: 2px; }
    .buy { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 12px 14px; border-radius: 11px; background: var(--surface); border: 1px solid var(--line-2); color: var(--text); text-decoration: none; font: inherit; font-weight: 600; cursor: pointer; text-align: left; transition: all .14s var(--ease); }
    .buy:disabled { opacity: .6; cursor: default; }
    .buy:hover { background: rgba(37, 99, 235,.1); border-color: rgba(37, 99, 235,.45); }
    .buy .buy-price { font-size: 15px; font-family: var(--mono); } .buy .buy-sub { font-size: 11.5px; color: var(--faint); font-weight: 500; }
    .buy.buy-code { background: rgba(37, 99, 235,.07); border-color: rgba(37, 99, 235,.3); }
    .buy.buy-code:hover { border-color: rgba(37, 99, 235,.55); }
    .usage-div { height: 1px; background: var(--line); margin: 4px 0; }
    .usage-empty { color: var(--faint); font-size: 12.5px; text-align: center; padding: 16px 8px; line-height: 1.6; }
    .settings-close { background: none; border: 0; color: var(--muted); cursor: pointer; font-size: 19px; line-height: 1; padding: 0 4px; } .settings-close:hover { color: var(--text); }

    .toast { position: absolute; top: 62px; right: 16px; z-index: 70; display: flex; align-items: center; gap: 8px;
      background: var(--accent-grad); color: #ffffff; font-size: 13px; font-weight: 500;
      padding: 10px 16px; border-radius: 11px; box-shadow: var(--sh-send); animation: pop .22s var(--spring) both; }

    /* One authoring loop. This tape is a projection of the typed application state, not a
       second workflow store: it gives the request, current revision and next action one home. */
    .authoring-flow { position:relative;z-index:18;min-height:88px;flex:none;display:grid;
      grid-template-columns:minmax(170px,230px) minmax(440px,1fr) auto;grid-template-rows:auto auto;
      grid-template-areas:'current stages actions' 'current guidance actions';align-items:center;gap:3px 24px;
      padding:12px 16px 11px;border-bottom:1px solid var(--line-2);background:color-mix(in srgb,var(--pane) 96%,transparent); }
    .authoring-current { grid-area:current;min-width:0;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:5px 7px; }
    .authoring-current>span { grid-column:1/-1;color:var(--faint);font:600 9px/12px var(--font);letter-spacing:.09em;text-transform:uppercase; }
    .authoring-current>b { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font:650 13px/18px var(--font); }
    .authoring-current>em { color:var(--accent-text);font:650 9.5px/18px var(--mono);font-style:normal; }
    .authoring-stages { grid-area:stages;min-width:0;display:grid;grid-template-columns:repeat(4,minmax(82px,1fr));margin:0;padding:0;list-style:none; }
    .authoring-stages li { position:relative;min-width:0;display:flex;align-items:center;gap:8px;color:var(--faint); }
    .authoring-stages li:not(:last-child)::after { content:'';position:absolute;z-index:0;left:25px;right:5px;top:12px;height:1px;background:var(--line-2); }
    .authoring-stages i { position:relative;z-index:1;width:24px;height:24px;flex:none;display:grid;place-items:center;border:1px solid var(--line-2);border-radius:50%;background:var(--pane);font:650 9px var(--mono);font-style:normal; }
    .authoring-stages span { position:relative;z-index:1;min-width:0;padding-right:8px;background:var(--pane); }
    .authoring-stages b,.authoring-stages small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
    .authoring-stages b { color:inherit;font:600 11px/14px var(--font); }
    .authoring-stages small { color:var(--ghost);font:450 9.5px/12px var(--font); }
    .authoring-stages li[data-state='done'] i { border-color:color-mix(in srgb,var(--ok) 48%,var(--line));color:var(--ok-text);background:color-mix(in srgb,var(--ok) 10%,var(--pane)); }
    .authoring-stages li[data-state='done'] { color:var(--muted); }
    .authoring-stages li[data-state='current'] { color:var(--text); }
    .authoring-stages li[data-state='current'] i { border-color:rgb(var(--accent));background:rgb(var(--accent));color:#fff;box-shadow:0 0 0 3px rgba(37,99,235,.12); }
    .authoring-guidance { grid-area:guidance;min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font:450 10.5px/15px var(--font); }
    .authoring-flow[data-tone='safe'] .authoring-guidance { color:color-mix(in srgb,var(--warn-hi) 78%,var(--text)); }
    .authoring-actions { grid-area:actions;display:flex;align-items:center;justify-content:flex-end;gap:7px; }
    .authoring-actions .tp-button { height:32px;white-space:nowrap; }
    .authoring-actions .authoring-inspect .lbl-hide { display:inline; }
    .authoring-backtest .ic { width:13px;height:13px; }
    .authoring-menu { position:relative; }
    .authoring-menu-trigger { display:inline-flex;align-items:center;gap:8px;white-space:nowrap; }
    .authoring-menu-trigger>span { color:var(--faint);font-size:10px; }
    .authoring-popover { position:absolute;z-index:80;top:calc(100% + 7px);right:0;width:210px;padding:6px;border:1px solid var(--line-2);border-radius:11px;background:var(--solid);box-shadow:var(--sh-modal); }
    .authoring-popover .authoring-menu-item { width:100%;min-height:38px;display:flex;align-items:center;justify-content:flex-start;gap:9px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--sec);box-shadow:none;font:550 12px var(--font); }
    .authoring-popover .authoring-menu-item:hover { background:var(--surface-2);color:var(--text); }
    .authoring-popover .authoring-menu-item .ic { width:14px;height:14px;color:var(--muted); }
    .authoring-popover .authoring-menu-item :is(.lbl,.lbl-hide) { display:inline; }
    .authoring-popover .authoring-menu-item[data-menu-label]::after { content:attr(data-menu-label); }
    .authoring-loop .sess { height:40px;justify-content:flex-end; }
    .authoring-loop .sess-col { display:none; }
    .authoring-loop .sess-hist { margin-left:auto; }

    /* ── panes ── */
    #panes { flex: 1; display: flex; min-height: 0; background: var(--bg); }
    .pane { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
    #chatPane { flex: none; width: var(--builder-w, 400px); background: var(--bg); }
    #chartPane { flex: 1; position: relative; container-type: inline-size; background: var(--bg); border-left: 1px solid var(--line-2); }
    .workspace-splitter { position: relative; z-index: 12; width: 7px; flex: 0 0 7px; margin-right: -7px; padding: 0;
      border: 0; background: transparent; cursor: col-resize; touch-action: none; }
    .workspace-splitter::after { content: ''; position: absolute; inset: 0 2px; background: transparent; transition: background .14s var(--ease); }
    .workspace-splitter:hover::after, .workspace-splitter:focus-visible::after, .workspace-splitter.dragging::after {
      background: color-mix(in srgb, var(--accent-text) 58%, transparent); }
    .workspace-splitter:focus-visible { outline: none; }
    body.resizing-workspace { cursor: col-resize; user-select: none; }
    .lab[data-builder-collapsed] #chatPane, .lab[data-builder-collapsed] .workspace-splitter { display: none; }

    /* How it works is a technical reading rail, not a second stack of dashboard cards. */
    .how-panel { position:relative; z-index:4; flex:0 0 var(--how-w,316px); width:var(--how-w,316px);
      display:flex; flex-direction:column; min-height:0; color:var(--text); background:var(--bg);
      border-left:1px solid var(--line-2); }
    .how-splitter { position:relative; z-index:12; width:7px; flex:0 0 7px; margin-left:-7px; padding:0; border:0;
      background:transparent; cursor:col-resize; touch-action:none; }
    .how-splitter::after { content:''; position:absolute; inset:0 2px; background:transparent; transition:background .14s var(--ease); }
    .how-splitter:hover::after,.how-splitter:focus-visible::after,.how-splitter.dragging::after { background:color-mix(in srgb,var(--accent-text) 58%,transparent); }
    .how-splitter:focus-visible { outline:none; }
    .how-head { min-height:48px; padding:7px 12px 7px 20px; display:flex; align-items:center; justify-content:space-between;
      gap:16px; border-bottom:1px solid var(--line); background:var(--pane); }
    .how-head>div { display:flex; flex-direction:column; min-width:0; gap:0; }
    .how-head span { color:var(--faint); font:600 9px/12px var(--font); letter-spacing:.16em; text-transform:uppercase; }
    .how-head b { font:600 14px/18px var(--font); letter-spacing:-.012em; }
    .how-head .settings-close { width:32px; height:32px; padding:0; border-radius:8px; }
    .how-body { flex:1; min-height:0; overflow:auto; padding:22px 20px 32px; }
    .how-overview { padding-bottom:22px; border-bottom:1px solid var(--line); }
    .how-kicker { display:flex; margin-bottom:12px; }
    .how-overview h2 { margin:0; font:600 22px/28px var(--font); letter-spacing:-.025em; text-wrap:balance; }
    .how-overview p { margin:8px 0 0; color:var(--muted); font:400 13px/20px var(--font); text-wrap:pretty; }
    .how-section { padding-top:24px; }
    .how-section-title { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:12px; }
    .how-section-title b { font:600 12px/16px var(--font); letter-spacing:.01em; }
    .how-section-title span { color:var(--faint); font:500 11px/16px var(--font); font-variant-numeric:tabular-nums; }
    .how-rules { position:relative; display:flex; flex-direction:column; gap:0; padding-left:17px; }
    .how-rules::before { content:''; position:absolute; left:0; top:8px; bottom:8px; width:1px; background:#2a2a31; }
    .how-rule { position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:10px;
      min-height:54px; margin:0 -10px; padding:9px 10px; border:0; border-radius:8px; background:transparent;
      transition:background 120ms ease; }
    .how-rule:hover { background:var(--surface); }
    .how-rule.is-focused { background:var(--solid); outline:2px solid rgb(var(--accent)); outline-offset:1px; }
    .private-import-dialog { width:min(620px,calc(100vw - 28px)); max-height:min(820px,calc(100dvh - 28px)); padding:0; overflow:hidden;
      border:1px solid var(--line-2); border-radius:18px; background:var(--card); color:var(--ink); box-shadow:var(--shadow-lg); }
    .private-import-dialog::backdrop { background:rgba(0,0,0,.58); backdrop-filter:blur(5px); }
    .private-import-sheet { display:flex; flex-direction:column; gap:16px; padding:22px; max-height:inherit; overflow:auto; }
    .private-import-sheet header,.private-import-sheet footer { display:flex; align-items:center; justify-content:space-between; gap:12px; }
    .private-import-sheet header span { color:var(--accent); font:700 9px var(--mono); text-transform:uppercase; letter-spacing:.13em; }
    .private-import-sheet h2 { margin:3px 0 0; font-size:21px; } .private-import-sheet p { margin:0; color:var(--muted); line-height:1.55; }
    .private-import-sheet label:not(.private-import-file) { display:grid; gap:7px; color:var(--sec); font-size:12px; font-weight:650; }
    .private-import-sheet textarea { min-height:72px; resize:vertical; font:12px/1.55 var(--mono); }
    .private-import-file { position:relative; width:max-content; overflow:hidden; } .private-import-file input { position:absolute; inset:0; opacity:0; cursor:pointer; }
    .private-import-result { display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-height:22px; color:var(--muted); font-size:12px; }
    .private-import-sheet footer { justify-content:flex-end; padding-top:4px; }
    .how-rule-index { position:absolute; left:-20px; top:20px; width:7px; height:7px; overflow:hidden; padding:0;
      border:2px solid var(--bg); border-radius:50%; background:var(--ghost); color:transparent; font-size:0; }
    .how-rule b { display:block; font:500 13px/18px var(--font); color:var(--text-2); }
    .how-rule p { margin:3px 0 0; color:var(--faint); font:400 12px/18px var(--font); text-wrap:pretty; }
    .how-status { flex:none; display:inline-flex; align-items:center; gap:6px; min-height:18px; padding:0; color:var(--faint);
      background:transparent; border:0; font:500 10.5px/18px var(--font); text-transform:capitalize; white-space:nowrap; }
    .how-status i { width:5px; height:5px; flex:none; border-radius:50%; background:currentColor; }
    .how-status.tone-success { color:var(--ok-text); }
    .how-status.tone-info { color:var(--accent-text); }
    .how-status.tone-warning { color:rgb(var(--warn-hi)); }
    .how-notes { display:flex; flex-direction:column; gap:8px; margin:0; padding:0; list-style:none; }
    .how-notes li { position:relative; padding:8px 0 8px 16px; color:var(--muted); font:400 12px/18px var(--font); border-bottom:1px solid var(--line); }
    .how-notes li::before { content:''; position:absolute; left:0; top:.58em; width:5px; height:5px; border-radius:50%; background:rgb(var(--warn)); }
    .how-empty,.how-loading { min-height:180px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:7px; text-align:left; }
    .how-empty b,.how-loading b { font:600 15px/20px var(--font); }
    .how-empty span,.how-loading span { max-width:260px; color:var(--muted); font:400 13px/20px var(--font); }
    .how-empty.compact { min-height:100px; padding:16px 0; border:0; border-radius:0; }
    .how-empty.is-error b { color:var(--danger); }
    .how-empty .tp-button { margin-top:8px; }
    .cap-search { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
    .cap-search .tp-field { min-width:0; }
    .cap-results { display:flex; flex-direction:column; gap:0; margin-top:10px; }
    .cap-result { width:100%; padding:11px 0; display:flex; flex-direction:column; align-items:flex-start; gap:3px; text-align:left;
      color:var(--text); font:inherit; background:transparent; border:0; border-bottom:1px solid var(--line); border-radius:0; cursor:pointer; }
    .cap-result:hover,.cap-result:focus-visible { color:var(--text); background:var(--surface); outline:2px solid rgb(var(--accent)); outline-offset:2px; }
    .cap-result b { font:600 12.5px/17px var(--font); }.cap-result span { color:var(--muted); font:400 12px/18px var(--font); }
    .cap-result small,.cap-hint { color:var(--faint); font:500 10.5px/16px var(--font); }.cap-hint.is-error { color:var(--danger); }
    .change-fields{display:grid;gap:0}.change-fields label,.change-request{display:grid;grid-template-columns:minmax(0,1fr) minmax(96px,.8fr);align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);color:var(--muted);font:500 12px/18px var(--font)}.change-fields input{min-width:0}.change-request{display:grid;grid-template-columns:1fr;padding-top:18px;border:0}.change-request textarea{min-height:86px;resize:vertical}.change-status{min-height:18px;margin-top:8px;color:var(--muted);font:400 11px/18px var(--font)}.change-status.is-ready{color:var(--ok-text)}.change-status.is-error{color:var(--danger)}.change-apply{width:100%;margin-top:8px}
    .how-overview>small{display:block;margin-top:9px;color:var(--faint);font:400 11px/17px var(--font)}.how-inspect{margin-top:14px}

    /* ── chat: session header ── */
    .sess { height: 48px; flex: none; display: flex; align-items: center; gap: 10px; padding: 0 14px 0 12px; border-bottom: 1px solid var(--line); background:var(--pane); }
    .sess-col { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
    .sess-row { display: flex; align-items: center; gap: 7px; min-width: 0; }
    .sess-name { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .sess-sub { display: flex; align-items: center; gap: 5px; font-size: 10.5px; color: #7d818a; font-weight: 500; white-space: nowrap; }
    .sess-sub #sessStatus { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
    .sess-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ok); flex: none; animation: tpPulse 2.4s infinite; }
    .sess-dot.idle { background: var(--faint); animation: none; }
    .sess-hist { width: 30px; height: 30px; flex: none; border-radius: 9px; border: 1px solid transparent; background: transparent; color: #7f838c; display: flex; align-items: center; justify-content: center; cursor: pointer; }
    .sess-hist:hover { background: var(--surface-2); color: #d6e0ef; }

    /* ── chat: messages ── */
    #chat { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 18px 16px 8px; display: flex; flex-direction: column; gap: 16px; }
    /* A narrow Assistant must still hold its own text: long tickers, identifiers and links break inside the bubble. */
    .mcol > * { min-width: 0; max-width: 100%; }
    .daydiv { display: flex; align-items: center; gap: 10px; }
    .daydiv::before, .daydiv::after { content: ''; flex: 1; height: 1px; background: var(--line); }
    .daydiv span { font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #5a5f66; }
    .msg { max-width: 100%; font-size: 13px; line-height: 1.55; }
    .msg.user { align-self: flex-end; max-width: 86%; color: #e2e9f4; background: var(--bubble-grad);
      border: 1px solid rgba(255,255,255,.1); border-radius: 14px 14px 4px 14px; padding: 10px 13px; white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; min-width: 0; }
    .msg.assistant, .msg.working { align-self: stretch; display: flex; gap: 10px; }
    .ai-av { width: 26px; height: 26px; flex: none; border-radius: 8px; background: linear-gradient(180deg, #ffffff, #cdd7e4); display: flex; align-items: center; justify-content: center; margin-top: 2px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,.35); }
    .ai-av img { width: 19px; height: 19px; object-fit: contain; display: block; }
    .mcol { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 9px; color: var(--body-ai); white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; }
    .mcol code, .msg code { font-family: var(--mono); font-size: 12px; background: var(--surface-2); border: 1px solid var(--line-2); border-radius: 5px; padding: 1px 5px; white-space: pre-wrap; overflow-wrap: anywhere; }
    .msg.error { align-self: flex-start; background: rgba(242,109,109,.08); border: 1px solid rgba(242,109,109,.32); color: #f2969e;
      border-radius: 14px; padding: 10px 13px; white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; max-width: 100%; }

    /* Brief summary: the completed recorder and its source-free interpretation share one column. */
    .build-summary { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
    .brief-card { min-width: 0; padding: 14px 15px 4px; border-radius: 12px; background: var(--surface);
      color: var(--text); overflow-wrap: anywhere; }
    .brief-eyebrow { display: block; color: var(--text-2); font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
    .brief-title { display: block; margin-top: 7px; font-size: 14px; line-height: 1.45; font-weight: 600; }
    .brief-caption { color: var(--text-2); font-size: 12px; line-height: 1.6; margin: 6px 0 8px; }
    .brief-card summary { min-height: 44px; align-content: center; cursor: pointer; color: var(--text-2); font-size: 12px; border-radius: 5px; }
    .brief-card summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
    .brief-card ul { margin: 0 0 12px; padding-left: 18px; color: var(--text-2); font-size: 12px; }
    .brief-card li + li { margin-top: 6px; }
    .brief-empty { margin: 0 0 12px; color: var(--text-2); font-size: 12px; }
    .build-card[data-state="completed"] .build-eyebrow::before { animation: none; border-color: var(--faint); }
    html[data-theme="light"] .brief-card { background: rgba(53,47,36,.045); }
    @media (hover: hover) and (pointer: fine) { .brief-card summary:hover { color: var(--text); } }

    /* clarifying-question card — one question, option rows, one recommended, an Other field (plan D5) */
    .q-card { gap: 8px; white-space: normal; }
    .q-text { font-size: 13.5px; font-weight: 600; color: var(--text); letter-spacing: -.005em; }
    .q-why { font-size: 12px; color: var(--muted); margin-top: -2px; }
    .q-options { display: flex; flex-direction: column; gap: 6px; margin-top: 2px; }
    .q-opt { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; min-height: 44px; padding: 9px 12px; text-align: left; cursor: pointer;
      background: var(--surface); border: 1px solid transparent; border-radius: 10px; color: var(--text); font: inherit; transition: background 120ms ease, border-color 120ms ease; }
    .q-opt:hover:not(:disabled) { background: var(--surface-2); }
    .q-opt:focus-visible { outline: none; border-color: rgba(37, 99, 235,.55); box-shadow: 0 0 0 3px rgba(37, 99, 235,.18); }
    .q-opt-label { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; }
    .q-opt-detail { font-size: 11.5px; color: var(--text-2); }
    .q-rec { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--accent-text, #93b4ff); background: rgba(37, 99, 235,.14); border-radius: 999px; padding: 2px 7px; }
    .q-opt.q-chosen, .q-opt.q-chosen:disabled { border-color: rgba(37, 99, 235,.5); background: rgba(37, 99, 235,.12); opacity: 1; }
    .q-answered .q-opt:disabled:not(.q-chosen) { opacity: .45; }
    .q-opt:disabled { cursor: default; }
    .q-other { align-self: flex-start; background: none; border: 0; padding: 4px 2px; color: var(--muted); font: inherit; font-size: 12.5px; cursor: pointer; }
    .q-other:hover, .q-other:focus-visible { color: var(--text); outline: none; text-decoration: underline; }
    .q-answered .q-other { display: none; }
    .q-other-row { display: flex; gap: 8px; align-items: center; }
    .q-other-input { flex: 1; min-width: 0; font-size: 13px; }
    .q-other-send { width: 36px; height: 36px; flex: none; border-radius: 10px; padding: 0; }
    .q-other-send .ic { width: 15px; height: 15px; }
    @media (hover: none) and (pointer: coarse) { .q-other { min-height: var(--tp-touch-target); } }
    @media (prefers-reduced-motion: reduce) { .q-opt { transition: none; } }

    /* artifact card — the versioned build receipt attached to AI messages */
    .artifact { border: 1px solid rgba(255,255,255,.13); background: var(--card-grad); border-radius: 13px; overflow: hidden; white-space: normal; }
    .art-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,.09); }
    .art-head .ic { color: #f0c974; width: 13px; height: 13px; }
    .art-name { font-size: 12.5px; font-weight: 650; color: var(--text); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .art-meta { margin-left: auto; font-family: var(--mono); font-size: 10.5px; color: #5a5f66; flex: none; }
    .art-body { padding: 9px 12px; display: flex; flex-direction: column; gap: 5px; font-family: var(--mono); font-size: 11px; }
    .art-row { display: flex; justify-content: space-between; gap: 12px; }
    .art-row .k { color: #5a5f66; } .art-row .v { color: var(--sec); text-align: right; }
    .art-status { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-top: 1px solid rgba(255,255,255,.09); background: rgba(34,197,94,.05); }
    .art-status .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ok); flex: none; }
    .art-status span { font-size: 11px; font-weight: 600; color: var(--ok-text); }
    .art-revise { margin-left: auto; padding: 5px 9px; border: 1px solid var(--line-2); border-radius: 7px;
      background: var(--surface); color: var(--text-2); font: 600 10.5px var(--font); }
    .art-revise:hover, .art-revise:focus-visible { border-color: rgba(37, 99, 235,.42); color: var(--text); outline: none; }

    /* build flight recorder — durable, truthful lifecycle state without invented progress */
    .build-flight { color: var(--muted); align-items: flex-start; }
    .build-card { min-width: 0; flex: 1; overflow: hidden; border: 1px solid var(--line-2); border-radius: 14px;
      background: color-mix(in srgb, var(--solid) 94%, transparent); box-shadow: 0 10px 30px rgba(0,0,0,.18); }
    .build-card-head { min-height: 38px; padding: 0 13px; display: flex; align-items: center; justify-content: space-between;
      border-bottom: 1px solid var(--line); }
    /* The eyebrow IS the card's inline progress indicator, so it carries tp-progress-inline and the
       shared spinner it draws in ::before. The card itself must NOT: that primitive is display:inline-flex,
       which turned the card's five stacked sections into one squeezed row and printed the phase list
       on top of itself. Scoped under .build-card-head so the shared colour/gap don't win on tie. */
    .build-card-head .build-eyebrow { gap: 7px; color: var(--sec);
      font: 700 9.5px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
    .build-card-head .build-eyebrow::before { width: 10px; height: 10px; }
    .build-card .elapsed { color: var(--faint); font: 500 10.5px var(--mono); }
    .build-copy { display: flex; flex-direction: column; gap: 3px; padding: 13px 13px 11px; }
    .build-copy .wlabel { color: var(--text); font-size: 13.5px; font-weight: 650; letter-spacing: -.01em; }
    .build-detail { color: var(--muted); font-size: 11.5px; line-height: 1.45; }
    .build-phases { list-style: none; margin: 0; padding: 0 13px 13px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
    .build-phases li { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0;
      color: var(--faint); font: 600 9px var(--font); white-space: normal; overflow-wrap: anywhere; padding-right: 6px; }
    .build-phases li:not(:last-child)::after { content: ''; position: absolute; left: 9px; right: 0; top: 4px; height: 1px; background: var(--line-2); }
    .build-phase-dot { position: relative; z-index: 1; width: 9px; height: 9px; flex: none; border: 2px solid var(--line-2); border-radius: 50%; background: var(--solid); }
    .build-phases li.complete { color: var(--sec); }
    .build-phases li.complete .build-phase-dot { border-color: var(--ok); background: var(--ok); }
    .build-phases li.complete::after { background: color-mix(in srgb, var(--ok) 60%, var(--line)); }
    .build-phases li.current { color: var(--text-2); }
    .build-phases li.current .build-phase-dot { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235,.1); }
    .build-card .acts { margin: 0 13px 12px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
    .build-card .act { color: var(--sec); }
    .build-card .act.did { color: var(--muted); }
    .build-card-foot { min-height: 44px; padding: 7px 9px 7px 13px; display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--line); }
    .build-assurance { min-width: 0; flex: 1; color: var(--faint); font-size: 9.5px; line-height: 1.35; }
    .build-actions { display: flex; align-items: center; justify-content: flex-end; gap: 3px; }
    .build-actions button { min-height: 28px; padding: 0 8px; border-radius: 7px; background: transparent; color: var(--muted); font: 600 10px var(--font); }
    .build-actions button:hover, .build-actions button:focus-visible { color: var(--text); background: var(--surface-2); outline: none; }
    .build-actions .wstop:hover, .build-actions .wstop:focus-visible { color: var(--danger); }
    .build-actions button:disabled { opacity: .45; cursor: default; }
    .build-card[data-state="detached"], .build-card[data-state="resumed"] { border-color: rgba(37, 99, 235,.3); }
    /* A stopped build must not keep spinning — the ring freezes and recolours to match the state. */
    .build-card[data-state="detached"] .build-eyebrow::before { animation: none; border-color: var(--faint); }
    .build-card[data-state="failed"] { border-color: color-mix(in srgb, var(--danger) 38%, var(--line-2)); }
    .build-card[data-state="failed"] .build-eyebrow::before { animation: none; border-color: var(--danger); }
    .build-phases.failed .build-phase-dot { border-color: color-mix(in srgb, var(--danger) 55%, var(--line-2)); box-shadow: none; }
    .build-card[data-state="cancel_requested"] .build-eyebrow::before { border-top-color: var(--danger); }
    @media (max-width: 520px) {
      .build-card-foot { align-items: flex-start; flex-direction: column; padding-block: 9px; }
      .build-actions { width: 100%; justify-content: flex-start; }
      .build-assurance { order: 2; }
      .build-phase-label { display: none; }
      .build-phases li:not(:last-child)::after { right: 7px; }
    }
    .acts { display: flex; flex-direction: column; gap: 6px; margin-top: 9px; min-width: 0; }
    .act { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); min-width: 0;
      opacity: 0; transform: translateY(3px); animation: actin .24s var(--ease) forwards; }
    .act .aic { width: 14px; height: 14px; flex: none; display: flex; color: #f0c974; }
    .act .aic .ic { width: 14px; height: 14px; stroke-width: 2; }
    .act.live .aic { animation: pulse 1.15s ease-in-out infinite; }
    .act.did { color: var(--faint); }
    .act.did .aic { color: var(--ok-text); animation: none; }
    .act .atitle { font-weight: 600; white-space: nowrap; flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
    .act .adetail { font-family: var(--mono); font-size: 10.5px; color: var(--faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
    .act.more { font-size: 11px; color: var(--faint); }
    .dots { display: inline-flex; }
    .dots span { display: inline-block; width: 5px; height: 5px; margin: 0 2px; border-radius: 50%; background: var(--muted); animation: tpDot 1.2s infinite; }
    .dots span:nth-child(2) { animation-delay: .15s; } .dots span:nth-child(3) { animation-delay: .3s; }
    /* legacy chips kept for safety (superseded by .artifact) */
    .build-meta { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
    .bm-chip { font-size: 10.5px; font-weight: 600; color: var(--muted); padding: 3px 9px; border-radius: var(--r-pill); border: 1px solid var(--line-2); background: var(--surface); white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
    .bm-chip.gold { color: #ffffff; border-color: transparent; background: var(--gold-grad); }

    /* flywheel 👍/👎 */
    .fb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; padding-top: 8px; border-top: 1px solid var(--line); }
    .fb-q { font-size: 11px; color: var(--faint); margin-right: auto; }
    .fb-btn { background: var(--surface); border: 1px solid var(--line-2); border-radius: 8px; font-size: 13px; line-height: 1; padding: 4px 8px; cursor: pointer; opacity: .8; transition: all .14s var(--ease); }
    .fb-btn:hover { opacity: 1; border-color: rgba(255,255,255,.22); background: var(--surface-2); }
    .fb-btn.picked { opacity: 1; border-color: rgba(37, 99, 235,.5); background: rgba(37, 99, 235,.12); }
    .fb-btn:disabled { cursor: default; }
    .fb-note { flex: 1 1 100%; min-width: 0; margin-top: 6px; background: var(--bg-2); border: 1px solid var(--line-2); border-radius: 9px; color: var(--text); font: inherit; font-size: 12.5px; padding: 7px 10px; outline: none; }
    .fb-note:focus { border-color: rgba(37, 99, 235,.5); }
    .fb-send { background: var(--accent-grad); border: 0; color: #ffffff; font: inherit; font-size: 12px; font-weight: 600; padding: 6px 13px; border-radius: 9px; cursor: pointer; }
    .fb-send:disabled { opacity: .5; cursor: default; }
    .fb-skip { background: none; border: 0; color: var(--faint); font: inherit; font-size: 12px; cursor: pointer; padding: 6px 4px; }
    .fb-skip:hover { color: var(--muted); }

    /* hero empty state + one-tap starters */
    .hint { margin: auto; max-width: 430px; padding: 24px; text-align: center; color: var(--muted); font-size: 13.5px; line-height: 1.65; animation: msgin .4s var(--spring) both; }
    .hint .hint-mark { display: inline-flex; margin-bottom: 14px; width: 44px; height: 44px; border-radius: 12px; align-items: center; justify-content: center;
      background: rgba(37, 99, 235,.12); border: 1px solid rgba(37, 99, 235,.25); color: #f0c974; }
    .hint b { color: var(--text); font-weight: 700; letter-spacing: -.015em; font-size: 17px; }
    .hint-sub { margin: 10px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; font-weight: 400; }
    .starters { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 18px; }
    @media (max-width: 480px) { .starters { grid-template-columns: 1fr; } }
    .starter { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left; cursor: pointer;
      padding: 12px 14px; border-radius: 13px; border: 1px solid rgba(255,255,255,.13); background: var(--card-grad-2);
      font: inherit; color: var(--text); transition: border-color .15s var(--ease), transform .15s var(--ease), box-shadow .15s var(--ease); }
    .starter:hover { border-color: rgba(37, 99, 235,.32); transform: translateY(-2px); box-shadow: var(--sh-card); }
    .starter .st-t { font-size: 12.5px; font-weight: 650; letter-spacing: -.005em; }
    .starter .st-s { font-size: 10.5px; color: var(--faint); font-family: var(--mono); }

    /* composer */
    .composer { flex: none; padding: 10px 14px 14px; display: flex; flex-direction: column; gap: 8px; }
    .composer-field { display: flex; align-items: flex-end; gap: 9px; background: var(--solid); border: 1px solid transparent;
      border-radius: 10px; padding: 6px 6px 6px 14px; transition: border-color 120ms ease,background 120ms ease; }
    .composer-field:focus-within { border-color: rgba(37, 99, 235,.5); }
    #prompt { flex: 1; resize: none; height: 40px; min-height: 40px; max-height: 168px; border: 0; background: transparent; padding: 9px 0; box-shadow: none; font-size: 13px; border-radius: 0; }
    #prompt:focus { box-shadow: none; }
    #go { width: 34px; height: 34px; flex: none; border-radius: 11px; padding: 0; box-shadow: var(--sh-send); border: none; }
    #go .ic { width: 15px; height: 15px; stroke-width: 2.1; }
    .composer-hint { font-size: 10.5px; color: var(--ghost); padding-left: 4px; }

    /* ── chart pane ── */
    .ctoolbar { height: 48px; flex: none; display: flex; align-items: center; gap: 8px; padding: 0 10px;
      border-bottom: 1px solid var(--line); background: var(--toolbar-bg); min-width: 0; overflow-x: auto; scrollbar-width: none; }
    .ctoolbar::-webkit-scrollbar { display: none; }
    .ctoolbar > * { flex: none; }
    /* A scroll mask, not a panel: same colour as the bar it sits on, faded in
       over a longer run so there is no visible edge. */
    .chart-context { display:flex; align-items:center; gap:2px; min-width:0; }
    .chart-actions { position: sticky; right: -10px; z-index: 2; display: flex; align-items: center; gap: 7px; padding: 0 10px 0 20px;
      background: linear-gradient(90deg, transparent, var(--toolbar-bg) 20px); }
    @container (max-width: 820px) {
      .chart-actions { gap: 5px; padding-left: 6px; }
      .chart-actions :is(.lbl,.lbl-hide) { display: none; }
      .ind-pill { padding-inline: 8px; }
      .ind-pill :is(#indPillName,#indPillVer) { display: none; }
      .mkt-select { max-width: 146px; }
      .tf-btn { padding-inline: 7px; }
    }
    .tdiv { width: 1px; height: 20px; background: rgba(255,255,255,.12); }
    .color-input-pop { position: fixed; z-index: 10040; width: 208px; padding: 9px; background: var(--card-grad); border: 1px solid var(--line-2); border-radius: var(--r-sm); box-shadow: var(--sh-card); }
    .cip-grid { display: grid; grid-template-columns: repeat(10, 1fr); gap: 4px; }
    .cip-sw { width: 100%; aspect-ratio: 1; padding: 0; border-radius: 4px; border: 1px solid var(--line-2); cursor: pointer; }
    .cip-sw:hover { transform: scale(1.14); border-color: var(--accent-text); }
    .cip-sw.on { outline: 2px solid var(--accent-text); outline-offset: 1px; }
    .cip-row { margin-top: 8px; }
    .cip-hex { width: 100%; box-sizing: border-box; padding: 5px 7px; font-family: var(--mono); font-size: 11.5px; text-transform: lowercase; background: var(--bg-2); border: 1px solid var(--line-2); border-radius: 5px; color: var(--text); }
    .cip-hex.bad { border-color: var(--danger); }

    /* Hiding must be reversible. Only exists while collapsed, docked where the
       Builder was, so the way back is where the thing used to be. */
    .builder-reopen { display: none; }
    .lab[data-builder-collapsed] .builder-reopen {
      position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 6;
      display: inline-flex; flex-direction: column; align-items: center; gap: 6px;
      padding: 12px 5px; border: 1px solid var(--line-2); border-left: 0;
      border-radius: 0 var(--r-sm) var(--r-sm) 0;
      background: var(--card-grad); color: var(--text-2); cursor: pointer;
      box-shadow: var(--sh-card);
      transition: color .15s var(--ease), background .15s var(--ease); }
    .lab[data-builder-collapsed] .builder-reopen:hover { color: var(--text); background: var(--surface-2); }
    .lab[data-builder-collapsed] .builder-reopen span {
      font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
      writing-mode: vertical-rl; }
    .lab[data-builder-collapsed] .builder-reopen .ic { width: 15px; height: 15px; }

    /* Collapse control, in the Builder's own header at its left edge. */
    #chatPane .builder-toggle { flex: none; margin-right: 2px; width: 26px; height: 26px; }
    #chatPane .builder-toggle .ic { width: 14px; height: 14px; }

    /* Body-mounted so the scrolling .tf-switch cannot clip it. */
    .tf-more-menu { position: fixed; z-index: 300; display: none; grid-template-columns: repeat(3, minmax(64px, 1fr)); gap: 3px; width:min(280px,calc(100vw - 16px)); padding: 7px; background: var(--solid); border: 1px solid var(--line-2); border-radius: var(--r-sm); box-shadow: var(--sh-modal); max-height: 62vh; overflow-y: auto; }
    .tf-more-menu.open { display: grid; }
    .tf-more-entry { grid-column:1/-1; display:flex; align-items:center; gap:7px; margin-bottom:3px; }
    .tf-more-entry input { width:100%; min-width:0; height:34px; padding:0 10px; border:1px solid var(--line-2); border-radius:var(--r-xs); background:var(--surface); color:var(--text); font:650 12px var(--mono); text-transform:uppercase; }
    .tf-more-entry input:focus { outline:2px solid rgba(37,99,235,.45); outline-offset:1px; border-color:transparent; }
    .tf-more-entry small { flex:none; color:var(--faint); font:550 10px var(--font); white-space:nowrap; }
    .tf-more-row { display: flex; align-items: center; gap: 1px; }
    .tf-more-menu button { height: 27px; font: 600 12px var(--font, inherit); background: transparent; border: 1px solid transparent; color: var(--muted); border-radius: var(--r-sm); cursor: pointer; }
    .tf-more-pick { flex: 1 1 auto; min-width: 0; padding: 0 7px; text-align: left; }
    .tf-more-menu button:hover { color: var(--text); background: var(--surface-2); }
    .tf-more-pick.active { color:var(--text); background:var(--surface-2); }
    .tf-more-star { flex: none; width: 21px; padding: 0; font-size: 11px; line-height: 1; color: var(--ghost); }
    .tf-more-star.on { color: var(--accent-text); }
    .tspacer { flex: 1 !important; min-width: 10px; }
    /* active indicator pill → opens settings */
    .ind-pill { display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 11px; border-radius: var(--r-sm);
      border: 1px solid rgba(37, 99, 235,.28); background: rgba(37, 99, 235,.08); cursor: pointer; white-space: nowrap; }
    .ind-pill:hover { background: rgba(37, 99, 235,.13); }
    .ip-dot { width: 7px; height: 7px; border-radius: 2px; background: #3b82f6; flex: none; }
    #indPillName { font-size: 12.5px; font-weight: 600; color: #dbe6f8; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
    .ind-pill .ic { width: 11px; height: 11px; stroke-width: 2; color: #6a7078; }
    .indicator-visibility { position: relative; width: 30px; height: 30px; flex: none; display: grid; place-items: center; border-radius: 8px;
      color: var(--muted); background: transparent; border: 1px solid transparent; }
    .indicator-visibility:hover { color: var(--text); background: var(--surface); border-color: var(--line); }
    .indicator-visibility.is-hidden { color: var(--accent-text); background: rgba(37, 99, 235,.1); }
    .indicator-visibility.is-hidden::after { content: ''; position: absolute; width: 18px; height: 1px; background: currentColor; transform: rotate(-38deg); }
    /* Market + timeframe use the Backtester's one-row chart language: quiet at
       rest, a low-contrast fill for the active interval, and no blue capsule. */
    .mkt-select { appearance:none; -webkit-appearance:none; height:30px; display:flex; align-items:center;
      max-width:154px; background:transparent url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5"><path d="M1 1l3 3 3-3" stroke="%236f87ab" stroke-width="1.35" fill="none" stroke-linecap="round"/></svg>') no-repeat right 8px center;
      border:1px solid transparent; border-radius:var(--r-xs); color:var(--text);
      font-family:var(--font); font-size:12.5px; font-weight:700; padding:0 23px 0 9px; cursor:pointer; }
    .mkt-select:hover { border-color:var(--line-2); background-color:var(--surface); }
    .mkt-select:focus-visible { outline:2px solid rgba(37,99,235,.45); outline-offset:1px; border-color:transparent; }
    .tf-switch { display:flex; align-items:center; gap:1px; min-width:0; max-width:min(430px,40vw); overflow-x:auto; scrollbar-width:none; }
    .tf-switch::-webkit-scrollbar { display:none; }
    .tf-btn { flex:none; height:30px; background:transparent; border:1px solid transparent; color:var(--muted); font:600 12px var(--font);
      font-variant-numeric:tabular-nums; padding:0 9px; border-radius:var(--r-xs); cursor:pointer; transition:color .12s var(--ease),background .12s var(--ease),border-color .12s var(--ease); }
    .tf-btn:hover { color:var(--text); background:var(--surface); }
    .tf-btn.active { background:var(--surface-2); color:var(--text); box-shadow:none; }
    .tf-btn:focus-visible { outline:2px solid rgba(37,99,235,.45); outline-offset:1px; }
    .tbtn-accent { border-color: rgba(37, 99, 235,.4); background: rgba(37, 99, 235,.09); color: var(--accent-text); font-weight: 600; }
    .tbtn-accent:hover { background: rgba(37, 99, 235,.16); color: #cfe0ff; border-color: rgba(37, 99, 235,.4); }
    .tbtn-accent .ic { color: currentColor; }

    #chart { flex: 1; position: relative; min-width: 0; min-height: 0; }

    /* ── split screen (#329 / IL-5): independent comparison context, one focused workspace.
       The row is built at runtime by lab-panes.ts, so members who never split pay nothing for it. ── */
    .chart-split { flex: 1; display: flex; min-width: 0; min-height: 0; }
    .chart-split-col { flex: 1 1 0; display: flex; flex-direction: column; min-width: 0; min-height: 0; position: relative;
      outline: 1px solid transparent; outline-offset: -1px; }
    .chart-split-col > #chart { flex: 1 1 0; min-height: 0; }
    .chart-split-col.is-comparison-focused { outline-color: color-mix(in srgb,var(--accent) 60%,transparent); }
    .chart-split-pane { border-left: 1px solid var(--line); }
    .chart-split-pane.is-focused { outline-color: color-mix(in srgb,var(--accent) 64%,transparent); }
    /* The header is a ROW ABOVE the chart, the same height on both sides, so the HUD and the first
       candles are never under a control. It used to be an absolutely positioned strip over the pane. */
    .chart-split-header { flex: none; height: 34px; display:flex; align-items:center; gap:4px; padding:0 6px; overflow:hidden;
      border-bottom: 1px solid var(--line); background: var(--surface-1, var(--solid)); }
    .chart-split-focus { flex:none; padding:0 4px; color:var(--faint); font-size:9px; font-weight:650;
      letter-spacing:.08em; text-transform:uppercase; }
    .chart-split-pane.is-focused .chart-split-focus, .chart-split-col.is-comparison-focused .chart-split-focus { color:var(--accent-text); }
    .chart-split-context { color: var(--muted); font: 600 11px/1 Switzer,Inter,sans-serif; }
    .chart-split-collapsed-note { display: none; margin-left: auto; color: var(--faint); font-size: 11px; }
    .chart-split-sync { flex:none; height:26px; padding:0 7px; border:1px solid var(--line); border-radius:7px; background:transparent;
      color:var(--muted); font:600 11px/1 Switzer,Inter,sans-serif; cursor:pointer; }
    .chart-split-sync[aria-pressed="true"] { color:var(--accent-text); background:color-mix(in srgb,var(--accent) 14%,transparent); border-color:color-mix(in srgb,var(--accent) 45%,transparent); }
    .chart-split-sync:hover { color:var(--text); }
    .chart-split-sync:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
    .chart-split-select { min-width:0; height:26px; padding:0 24px 0 8px; border:1px solid var(--line);
      border-radius:7px; color:var(--text); font:600 11px/1 Switzer,Inter,sans-serif; appearance:none;
      background-color:var(--surface-2); background-repeat:no-repeat; background-position:right 7px center;
      background-size:8px 5px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='m1 1 3 3 3-3' fill='none' stroke='%238b93a1' stroke-width='1.4'/%3E%3C/svg%3E"); }
    .chart-split-market { width:62px; flex:none; }
    .chart-split-timeframe { width:54px; flex:none; }
    .chart-split-reference { flex:1 1 60px; width:84px; min-width:44px; max-width:150px; }
    .chart-split-settings { width:27px; height:27px; flex:none; display:grid; place-items:center; padding:0;
      border:1px solid transparent; border-radius:7px; background:transparent; color:var(--muted); cursor:pointer; }
    .chart-split-settings:hover { color:var(--text); background:var(--surface-2); border-color:var(--line); }
    .chart-split-settings[aria-pressed="false"] { color:var(--faint); opacity:.62; }
    .chart-split-settings:disabled { opacity:.28; cursor:default; }
    .chart-split-settings:focus-visible,.chart-split-select:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
    .chart-split-surface { position: relative; flex: 1 1 0; min-height: 0; }
    .chart-split-status { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 6;
      pointer-events: none; padding: 7px 14px; border-radius: var(--r-pill); border: 1px solid var(--line-2);
      background: rgba(9,9,11,.82); backdrop-filter: blur(8px); color: var(--muted); font-size: 12px; }
    /* Narrow, in two steps. The Lab's default laptop layout (1280 wide, Assistant open) leaves the
       chart pane ~540 px, and the comparison must still be there: below 720 px the row STACKS —
       clean now that each chart has a header row instead of a strip over it. Below 520 px a chart
       would be shorter than it is useful, so the comparison collapses and the header says so; it
       comes back the moment the pane is wide enough. */
    @container (max-width: 720px) {
      .chart-split { flex-direction: column; }
      .chart-split-pane { border-left: 0; border-top: 1px solid var(--line); } }
    @container (max-width: 520px) {
      .chart-split-pane { display: none; }
      .chart-split-collapsed-note { display: inline; } }
    #chartEmpty { position: absolute; left: 50%; bottom: calc(44px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 5; pointer-events: none;
      padding: 8px 16px; border-radius: var(--r-pill); border: 1px solid var(--line-2); background: rgba(9,9,11,.82); backdrop-filter: blur(8px);
      color: var(--muted); font-size: 12px; white-space: nowrap; max-width: calc(100% - 32px); overflow: hidden; text-overflow: ellipsis; }
    .chart-state { position: absolute; z-index: 11; top: 58px; left: 50%; max-width: min(540px, calc(100% - 28px)); min-height: 42px;
      transform: translateX(-50%); display: flex; align-items: center; gap: 10px; padding: 8px 10px 8px 11px;
      border: 1px solid var(--line-2); border-radius: 12px; background: color-mix(in srgb, var(--solid) 94%, transparent);
      box-shadow: 0 16px 38px -26px rgba(0,0,0,.72); backdrop-filter: blur(16px); }
    .chart-state-signal { width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--accent-text); box-shadow: 0 0 0 4px rgba(37, 99, 235,.1); }
    .chart-state-copy { min-width: 0; display: flex; align-items: baseline; gap: 8px; }
    .chart-state-copy b { flex: none; color: var(--text); font-size: 11.5px; font-weight: 650; white-space: nowrap; }
    .chart-state-copy > span { min-width: 0; overflow: hidden; color: var(--muted); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
    .chart-state > button { min-height: 28px; margin-left: 2px; padding: 0 9px; font-size: 10.5px; }
    .chart-state.kind-loading .chart-state-signal, .chart-state.kind-catching-up .chart-state-signal,
    .chart-state.kind-stale .chart-state-signal { animation: chart-state-pulse 1.2s var(--ease) infinite; }
    .chart-state.kind-disconnected .chart-state-signal, .chart-state.kind-render-failed .chart-state-signal {
      background: var(--danger); box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 13%, transparent); }
    .chart-state.kind-hidden .chart-state-signal { background: var(--faint); box-shadow: none; }
    .chart-state.is-blocking { top: 50%; min-width: min(390px, calc(100% - 32px)); min-height: 116px; padding: 20px;
      transform: translate(-50%,-50%); align-items: flex-start; flex-wrap: wrap; box-shadow: var(--sh-card); }
    .chart-state.is-blocking::before { content: ''; position: fixed; inset: 48px 0 28px; z-index: -1; background: color-mix(in srgb, var(--bg) 22%, transparent); }
    .chart-state.is-blocking .chart-state-signal { margin-top: 6px; }
    .chart-state.is-blocking .chart-state-copy { flex: 1; align-items: flex-start; flex-direction: column; gap: 4px; }
    .chart-state.is-blocking .chart-state-copy b { font-size: 14px; }
    .chart-state.is-blocking .chart-state-copy > span { overflow: visible; font-size: 12px; line-height: 1.5; text-overflow: initial; white-space: normal; }
    .chart-state.is-blocking > button { margin: 4px 0 0 17px; }
    @keyframes chart-state-pulse { 50% { opacity: .36; transform: scale(.76); } }

    /* status bar */
    .statusbar { height: 28px; flex: none; display: flex; align-items: center; gap: 14px; padding: 0 12px; border-top: 1px solid var(--line);
      background: var(--toolbar-bg); font-family: var(--mono); font-size: 10.5px; color: var(--faint); white-space: nowrap; overflow: hidden; }
    .statusbar .st-last { color: var(--muted); }
    .statusbar .st-last b { color: var(--text); font-weight: 600; }
    #stChg { font-weight: 600; }

    /* Historical inspection rail — compact chart instrument, not a replay/trading footer. */
    .replay-bar { position: absolute; left: 50%; bottom: calc(44px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 8;
      display: flex; align-items: center; gap: 7px; padding: 7px 9px 7px 7px; max-width: calc(100% - 16px);
      border-radius: 15px; border: 1px solid var(--line-2); background: color-mix(in srgb, var(--solid) 94%, transparent); backdrop-filter: blur(18px);
      box-shadow: 0 18px 46px -24px rgba(0,0,0,.5), inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent);
      animation: rail-fade .18s var(--ease) both; user-select: none; }
    @keyframes rail-fade { from { opacity: 0; } to { opacity: 1; } }
    .replay-bar.dragging { cursor: grabbing; box-shadow: 0 24px 56px -22px rgba(0,0,0,.58), 0 0 0 2px rgba(37, 99, 235,.12); }
    .rp-grip { width: 14px; height: 32px; flex: none; display: grid; grid-template-columns: repeat(2, 3px); place-content: center; gap: 3px;
      padding: 0; border-radius: 7px; background: transparent; color: var(--faint); cursor: grab; touch-action: none; }
    .rp-grip:hover, .rp-grip:focus-visible { background: var(--surface); color: var(--muted); outline: none; }
    .rp-grip:active { cursor: grabbing; }
    .rp-grip span { width: 3px; height: 3px; border-radius: 50%; background: currentColor; pointer-events: none; }
    .rp-primary, .rp-secondary { display: flex; align-items: center; gap: 5px; }
    .rp-primary { padding-right: 7px; border-right: 1px solid var(--line); }
    .rp-position { min-width: 112px; max-width: 132px; padding: 0 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
      color: var(--muted); font: 600 10px/1.2 var(--mono); text-align: center; font-variant-numeric: tabular-nums; }
    .rp-btn { width: 32px; height: 32px; flex: none; display: inline-flex; align-items: center; justify-content: center;
      border-radius: 9px; background: transparent; border: 1px solid transparent; color: var(--sec); cursor: pointer; padding: 0;
      transition: border-color .14s var(--ease), background .14s var(--ease), color .14s var(--ease); }
    .rp-btn:hover { border-color: rgba(37, 99, 235,.55); background: rgba(37, 99, 235,.12); }
    .rp-btn .ic { width: 14px; height: 14px; }
    .rp-btn.active { background: var(--accent-grad); border-color: transparent; color: #ffffff; }
    .rp-btn:focus-visible, .rp-wide:focus-visible, .rp-speed:focus-visible { outline: 2px solid rgba(37, 99, 235,.55); outline-offset: 2px; }
    .rp-play { border-radius: 50%; background: var(--accent-grad); color: #ffffff; box-shadow: 0 5px 14px -8px rgba(37,99,235,.75); }
    .rp-play:hover { color: #ffffff; filter: brightness(1.04); }
    .rp-close { color: var(--muted); }
    .rp-wide { height: 32px; flex: none; display: inline-flex; align-items: center; justify-content: center; padding: 0 11px;
      border-radius: 9px; border: 1px solid var(--line); background: var(--surface); color: var(--sec);
      font-size: 11.5px; font-weight: 650; white-space: nowrap; gap: 4px; }
    .rp-wide:hover { border-color: rgba(37,99,235,.48); background: rgba(37, 99, 235,.11); }
    .rp-jump-menu { position: absolute; right: 10px; bottom: calc(100% + 8px); width: 260px; padding: 7px;
      border: 1px solid var(--line-2); border-radius: 14px; background: var(--solid); box-shadow: var(--sh-modal); }
    .rp-jump-menu > button { width: 100%; min-height: 36px; display: flex; align-items: center; justify-content: space-between;
      padding: 0 10px; border-radius: 9px; background: transparent; color: var(--text); font-size: 12px; text-align: left; }
    .rp-jump-menu > button:hover { background: var(--surface-2); }
    .rp-jump-menu > button span { color: var(--muted); font: 10px var(--mono); }
    .rp-date-row { margin-top: 5px; padding: 8px 9px 5px; border-top: 1px solid var(--line); }
    .rp-date-row label { display: block; margin-bottom: 6px; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
    .rp-date-row > div { display: flex; gap: 6px; }
    .rp-date-row input { width: 100%; min-width: 0; height: 32px; padding: 0 8px; border-radius: 8px; font: 10.5px var(--mono); }
    .rp-date-row button { width: 40px; border-radius: 8px; background: var(--accent-grad); color: #ffffff; font-size: 11px; font-weight: 700; }
    .replay-bar.loading::after { content: ''; position: absolute; inset: -1px; border: 1px solid rgba(37, 99, 235,.7);
      border-radius: inherit; pointer-events: none; animation: rp-load 1s ease-in-out infinite alternate; }
    @keyframes rp-load { from { opacity: .25 } to { opacity: 1 } }
    #chart.selecting { cursor: crosshair; }
    .rp-glyph { font-size: 15px; line-height: 1; }
    .rp-speed-wrap { height: 32px; display: flex; align-items: center; gap: 5px; padding: 0 5px 0 8px; border: 1px solid var(--line);
      border-radius: 9px; background: var(--surface); color: var(--faint); font: 650 9px var(--font); letter-spacing: .04em; text-transform: uppercase; }
    .rp-speed { width: 48px; height: 26px; appearance: none; background: transparent; border: 0; color: var(--text);
      border-radius: 6px; font: 650 11px var(--mono); padding: 0 5px; cursor: pointer; text-align: center; }
    .rp-speed option { color: var(--text); background: var(--solid); }
    @media (max-width: 680px) {
      .replay-bar { gap: 5px; padding: 7px 9px; }
      #rpPrevSession { display: none; }
      .rp-position { min-width: 92px; max-width: 102px; }
      .rp-speed-wrap { display: none; }
      .rp-jump-menu { right: 0; }
    }
    @media (max-width: 500px) {
      .rp-position { display: none; }
      .rp-primary { padding-right: 4px; }
      .rp-grip { display: none; }
    }

    /* Code is a real drawer in the chart column. It consumes space instead of covering candles,
       and its horizontal separator shares the same pointer + keyboard contract as the side rails. */
    .code-splitter { position:relative; z-index:12; width:auto; height:7px; flex:0 0 7px; margin:0; padding:0;
      border:0; background:var(--pane); cursor:row-resize; touch-action:none; }
    .code-splitter::after { content:''; position:absolute; inset:2px 0; background:transparent; transition:background .14s var(--ease); }
    .code-splitter:hover::after,.code-splitter:focus-visible::after,.code-splitter.dragging::after {
      background:color-mix(in srgb,var(--accent-text) 58%,transparent); }
    .code-splitter:focus-visible { outline:none; }
    body.resizing-code { cursor:row-resize; user-select:none; }
    #code { position: relative; z-index: 6; display:flex; flex-direction:column;
      flex:0 0 var(--code-h,260px); min-width:0; min-height:220px; max-height:none;
      margin:0; padding:0; overflow:hidden; background:var(--solid); color:var(--sec); }
    .code-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
      flex:none; gap:10px 16px; padding:12px 16px; border-bottom:1px solid var(--line-2); background:var(--pane); }
    .code-heading { display:flex; flex-direction:column; gap:3px; flex:1 1 140px; min-width:0; }
    .code-heading strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; color:var(--text); }
    .code-heading span { font-size:11px; color:var(--muted); }
    .code-actions { display:flex; align-items:center; flex:none; gap:8px; font-family:var(--font); }
    .code-actions .tp-button { min-height:36px; white-space:nowrap; }
    .code-actions .code-close { width:36px; padding:0; font-size:20px; }
    .code-source { flex:1 1 auto; min-height:0; min-width:0; margin:0; padding:14px 18px;
      overflow:auto; white-space:pre; tab-size:4; font:12px/1.7 var(--mono); color:var(--text); }
    .code-source:focus-visible { outline:2px solid var(--accent-text); outline-offset:-2px; }
    .code-status { flex:none; padding:8px 16px; border-top:1px solid var(--line-2);
      font:11px/1.5 var(--font); color:var(--muted); overflow-wrap:anywhere; }
    @container (max-width: 440px) {
      .code-header { gap:8px; padding:10px 12px; }
      .code-heading { flex-basis:100%; }
      .code-actions { width:100%; }
      .code-actions .tp-button { min-height:44px; }
      .code-actions .code-close { margin-left:auto; width:44px; }
      .code-source { padding:12px; }
      .code-status { padding:7px 12px; }
    }
    .code-lock { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; max-width: 460px; margin: 6px auto 10px;
      padding: 18px 20px; border: 1px solid var(--line-2); border-radius: var(--r); background: var(--card-grad);
      font-family: var(--font); white-space: normal; }
    .code-lock .cl-h { font-size: 15px; font-weight: 700; color: var(--text); letter-spacing: -.01em; }
    .code-lock .cl-t { font-size: 12.5px; line-height: 1.55; color: var(--muted); }
    .cd-btn.gold { background: var(--accent-grad); border-color: transparent; color: #ffffff; }
    .cd-btn.gold:hover { filter: brightness(1.08); }

    /* ── "why?" popover: click a marking → the reason, from the bars ── */
    .why-pop { position: absolute; z-index: 9; width: 280px; max-width: calc(100% - 16px);
      background: var(--card-grad); border: 1px solid rgba(255,255,255,.16); border-radius: 13px;
      box-shadow: var(--sh-card); padding: 0 0 10px; animation: pop .16s var(--spring) both; }
    .why-head { display: flex; align-items: center; gap: 7px; padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,.09); }
    .why-head .ic { width: 13px; height: 13px; color: #f0c974; }
    .why-title { font-size: 12.5px; font-weight: 650; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .why-when { margin-left: auto; font-family: var(--mono); font-size: 9.5px; color: var(--faint); flex: none; }
    .why-x { background: none; border: 0; color: var(--muted); font-size: 16px; line-height: 1; padding: 0 2px; cursor: pointer; flex: none; }
    .why-x:hover { color: var(--text); }
    .why-lead { padding: 9px 12px 2px; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
    .why-line { display: flex; gap: 8px; padding: 4px 12px; font-size: 12px; line-height: 1.45; color: var(--sec); }
    .why-line .wmark { flex: none; font-weight: 700; color: var(--ok-text); }
    .why-line.fail .wmark { color: var(--diff-red); }
    .why-line .wnum { font-family: var(--mono); font-size: 11px; }

    /* ── community modal ── */
    .co { position: absolute; inset: 0; z-index: 26; display: flex; justify-content: center; align-items: flex-start; padding: 44px 28px;
      background: rgba(6,6,8,.66); backdrop-filter: blur(10px); animation: coin .2s var(--ease) both; }
    @keyframes coin { from { opacity: 0 } }
    .co-sheet { position: relative; width: min(1140px, 100%); max-height: calc(100% - 0px); display: flex; flex-direction: column; min-height: 0; border-radius: var(--r-lg);
      border: 1px solid var(--line-2); background: var(--solid);
      box-shadow: var(--sh-modal); overflow: hidden; animation: cosheet .28s var(--spring) both; }
    @keyframes cosheet { from { opacity: 0; transform: translateY(14px) scale(.985) } }
    .co-head { flex: none; display: flex; align-items: center; gap: 12px; padding: 16px 20px 12px; }
    .co-title { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16px; letter-spacing: -.01em; }
    .co-title > span:last-child { min-width: 0; display: flex; flex-direction: column; gap: 1px; white-space: nowrap; }
    .co-title > span:last-child::after { content: 'Preview, learn, then make it yours.'; color: var(--faint); font-size: 9.5px; font-weight: 500; letter-spacing: 0; }
    .co-title .ic { width: 15px; height: 15px; }
    .co-title .co-ic { width: 30px; height: 30px; border-radius: 9px; background: rgba(37, 99, 235,.12); border: 1px solid rgba(37, 99, 235,.25); color: #f0c974; display: flex; align-items: center; justify-content: center; }
    .co-tabs { display: flex; align-items: center; gap: 2px; height: 32px; padding: 2px; border-radius: var(--r-sm); border: 1px solid rgba(255,255,255,.1); background: var(--surface); margin-left: 6px; }
    .co-tab { height: 26px; border: 0; background: none; color: var(--muted); font: inherit; font-size: 12px; font-weight: 600; padding: 0 11px; border-radius: 8px; cursor: pointer; transition: all .14s var(--ease); }
    .co-tab:hover { color: #fff; }
    .co-tab.active { background: var(--accent-grad); color: #ffffff; box-shadow: 0 2px 8px rgba(37, 99, 235,.35); }
    .co-spacer { flex: 1; }
    .co-search { flex: 1; display: flex; align-items: center; gap: 8px; height: 34px; max-width: 360px; margin-left: auto; padding: 0 12px;
      border-radius: 11px; border: 1px solid var(--line-2); background: var(--bg-2); }
    .co-search .ic { width: 14px; height: 14px; color: var(--faint); }
    .co-search input { flex: 1; background: transparent; border: none; outline: none; color: var(--text); font: inherit; font-size: 12.5px; min-width: 0; padding: 0; border-radius: 0; }
    .co-body { flex: 1; display: flex; min-height: 200px; position: relative; }
    .co-catalog { flex: 1; min-width: 0; overflow-y: auto; padding: 2px 20px calc(20px + env(safe-area-inset-bottom)); }
    .co-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(252px, 1fr)); gap: 14px; align-content: start; }
    .co-empty { grid-column: 1 / -1; padding: 60px 20px; text-align: center; color: var(--faint); font-size: 13px; line-height: 1.7; }
    .co-empty .tp-button { margin-top: 9px; }
    .co-feature { min-height: 178px; display: grid; grid-template-columns: minmax(230px,1.05fr) minmax(220px,.9fr) minmax(180px,.72fr); margin: 0 0 18px; overflow: hidden; border: 1px solid var(--line-2); border-radius: 17px; background: linear-gradient(135deg,color-mix(in srgb,var(--solid) 94%,var(--surface)),color-mix(in srgb,var(--solid) 82%,rgba(37, 99, 235,.15))); box-shadow: var(--sh-card); }
    .co-feature-visual { position: relative; min-height: 176px; overflow: hidden; border: 0; border-right: 1px solid var(--line); background: linear-gradient(145deg,#151519,#09090b); }
    .co-feature-visual::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,transparent 64%,rgba(9,9,11,.25)); }
    .co-feature-visual > svg { position: absolute; inset: 18px; width: calc(100% - 36px); height: calc(100% - 36px); }
    .co-feature-copy { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 7px; padding: 22px; }
    .co-feature-eye { color: var(--accent-text); font: 700 9px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
    .co-feature-copy > strong { overflow: hidden; color: var(--text); font-size: clamp(17px,2vw,23px); line-height: 1.08; letter-spacing: -.025em; text-overflow: ellipsis; }
    .co-feature-copy > span:not(.co-feature-eye) { color: var(--faint); font: 500 10.5px var(--mono); }
    .co-feature-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 6px; }
    .co-feature-actions .ccard-add { min-height: 31px; margin-left: 0; }
    .co-feature-support { display: grid; grid-template-rows: 1fr 1fr; border-left: 1px solid var(--line); }
    .co-feature-row { min-width: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 3px; padding: 16px; border: 0; background: transparent; color: var(--text); text-align: left; }
    .co-feature-row + .co-feature-row { border-top: 1px solid var(--line); }
    .co-feature-row:hover { background: var(--surface); }
    .co-feature-row > span { color: var(--accent-text); font: 700 8.5px var(--mono); letter-spacing: .09em; text-transform: uppercase; }
    .co-feature-row strong { width: 100%; overflow: hidden; font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
    .co-feature-row small { color: var(--faint); font-size: 10px; }

    .ccard { position: relative; display: flex; flex-direction: column; border-radius: var(--r); border: 1px solid rgba(255,255,255,.11); background: var(--card-grad-2);
      overflow: hidden; transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
      animation: cardin .38s var(--spring) both; animation-delay: calc(min(var(--i), 16) * 26ms); }
    .ccard-open { display: block; width: 100%; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; }
    .ccard-open:focus-visible { outline-offset: -3px; border-radius: 12px; }
    .ccard:hover { transform: translateY(-2px); border-color: rgba(37, 99, 235,.32); box-shadow: var(--sh-card); }
    @keyframes cardin { from { opacity: 0; transform: translateY(8px) } }
    .ccard.gone { animation: cardout .26s var(--ease) both; }
    @keyframes cardout { to { opacity: 0; transform: scale(.92) } }
    .ccard-thumb { position: relative; height: 84px; background: linear-gradient(180deg, rgba(30,30,34,.5), rgba(16,16,19,.3)); border-bottom: 1px solid rgba(255,255,255,.07); }
    .ccard-thumb svg { position: absolute; inset: 8px 10px; width: calc(100% - 20px); height: calc(100% - 16px); }
    .ccard-thumb-ph { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 22px; color: var(--faint); }
    .ccard-hot { position: absolute; top: 8px; right: 8px; font-size: 9.5px; font-weight: 700; letter-spacing: .06em; color: #ffffff;
      background: var(--gold-grad); border-radius: 5px; padding: 2.5px 6px; box-shadow: 0 3px 10px rgba(37, 99, 235,.35); }
    .ccard-orig { position: absolute; top: 8px; left: 8px; font-size: 10px; font-weight: 700; color: #2563eb; background: rgba(37, 99, 235,.13); border: 1px solid rgba(37, 99, 235,.32); padding: 2px 7px; border-radius: 20px; backdrop-filter: blur(4px); }
    .ccard-pick { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; gap: 4px; font-size: 9.5px; font-weight: 700; letter-spacing: .06em; color: #ffffff; background: var(--gold-grad); padding: 2px 8px; border-radius: 20px; box-shadow: 0 3px 10px rgba(37, 99, 235,.3); }
    .ccard-pick .ic { width: 10px; height: 10px; }
    .cd-badge.pick { color: #2563eb; border-color: rgba(37, 99, 235,.4); background: rgba(37, 99, 235,.1); }
    .ccard-body { padding: 11px 13px 12px; display: flex; flex-direction: column; gap: 8px; }
    .ccard-title { font-weight: 650; font-size: 13.5px; letter-spacing: -.005em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ccard-lineage { font-size: 11px; color: var(--faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ccard-meta { font-size: 11.5px; color: var(--faint); display: flex; align-items: center; gap: 7px; min-width: 0; }
    .ccard-meta .a { color: var(--sec); font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .chip-you { flex: none; font-size: 8.5px; font-weight: 700; letter-spacing: .05em; color: var(--accent-text); background: rgba(37, 99, 235,.14); border: 1px solid rgba(37, 99, 235,.3); border-radius: 5px; padding: 1.5px 5px; }
    .ccard-foot { display: flex; align-items: center; gap: 7px; padding: 2px 13px 12px; }
    .vpill { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line-2); background: var(--surface-2); color: var(--sec);
      border-radius: 7px; padding: 3px 8px; font: inherit; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; cursor: pointer; transition: all .15s var(--ease); flex: none; }
    .vpill .ic { width: 11px; height: 11px; }
    .vpill:hover { border-color: rgba(37, 99, 235,.5); color: var(--text); }
    .vpill.voted { color: #ffffff; background: var(--gold-grad); border-color: transparent; box-shadow: 0 3px 10px rgba(37, 99, 235,.3); }
    .vpill.pop { animation: vpop .32s var(--spring); }
    .ccard:has(.ccard-hot) .vpill:not(.voted) { color: #ffffff; background: var(--gold-grad); border-color: transparent; box-shadow: 0 3px 10px rgba(37, 99, 235,.3); }
    @keyframes vpop { 40% { transform: scale(1.16) } }
    .cstat { display: inline-flex; align-items: center; gap: 5px; color: #7f838c; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; flex: none; }
    .cstat .ic { width: 12px; height: 12px; }
    .ccard-add { margin-left: auto; height: 26px; padding: 0 10px; border-radius: 8px; border: 1px solid rgba(37, 99, 235,.35); background: rgba(37, 99, 235,.09);
      color: var(--accent-text); font: inherit; font-size: 11px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; flex: none; }
    .ccard-add:hover { background: rgba(37, 99, 235,.18); color: #cfe0ff; }
    .ccard-add .ic { width: 11px; height: 11px; stroke-width: 2.2; }
    .ccard-del { border: 0; background: none; color: var(--faint); min-width: 26px; height: 26px; border-radius: 8px; cursor: pointer;
      display: inline-flex; align-items: center; justify-content: center; font: inherit; font-size: 13px; opacity: 0; transition: all .15s var(--ease); flex: none; }
    .ccard:hover .ccard-del { opacity: 1; }
    .ccard-del:hover { color: var(--danger); background: rgba(242,109,109,.12); }
    .ccard-del.arm { opacity: 1; color: #fff; background: #d2434f; font-size: 10.5px; font-weight: 700; padding: 0 9px; }

    .co-detail { width: 442px; max-width: 100%; flex: none; border-left: 1px solid var(--line); background: rgba(13,13,16,.55);
      display: flex; flex-direction: column; min-height: 0; animation: detin .26s var(--spring) both; }
    @keyframes detin { from { opacity: 0; transform: translateX(16px) } }
    .cd-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
    .cd-back { border: 0; background: none; color: var(--muted); font-size: 17px; line-height: 1; cursor: pointer; padding: 3px 7px; border-radius: 8px; }
    .cd-back:hover { color: var(--text); background: var(--surface-2); }
    .cd-title { flex: 1; min-width: 0; font-weight: 700; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .cd-scroll { flex: 1; overflow-y: auto; min-height: 0; }
    .cd-chart { position: relative; height: 218px; margin: 14px 16px 0; border-radius: 12px; border: 1px solid var(--line); overflow: hidden; background: #0a0c12; }
    .cd-chart-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--faint); font-size: 12.5px; }
    .cd-sec { padding: 13px 16px 0; }
    .cd-authorrow { display: flex; align-items: center; gap: 10px; }
    .cd-av { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; border: 1px solid var(--line-2); background: var(--surface-2); flex: none; }
    .cd-av-ph { width: 30px; height: 30px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center;
      font-weight: 700; font-size: 13px; color: #0b1220; background: linear-gradient(135deg, #bcd4ff, #3b82f6); }
    .cd-author { font-weight: 650; font-size: 13.5px; display: flex; align-items: center; gap: 6px; }
    .cd-when { color: var(--faint); font-size: 11.5px; margin-top: 1px; font-family: var(--mono); }
    .cd-badges { margin-left: auto; display: flex; gap: 6px; }
    .cd-badge { font-size: 10.5px; font-weight: 700; padding: 3px 8px; border-radius: 20px; border: 1px solid var(--line-2); color: var(--muted); white-space: nowrap; }
    .cd-access { margin: 13px 16px 0; display: flex; flex-direction: column; gap: 3px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
    .cd-access strong { color: var(--text); font-size: 11.5px; }
    .cd-access span { color: var(--faint); font-size: 10.5px; line-height: 1.45; }
    .cd-access.owner, .cd-access.unlocked { border-color: rgba(37, 99, 235,.28); background: rgba(37, 99, 235,.07); }
    .cd-lineage { padding: 10px 16px 0; font-size: 12px; color: var(--faint); }
    .cd-lineage button { background: none; border: 0; padding: 0; font: inherit; font-weight: 650; color: var(--muted); cursor: pointer; }
    .cd-lineage button:hover { color: var(--text); text-decoration: underline; }
    .cd-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 16px 4px; }
    .cd-btn { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line-2); background: var(--surface-2); color: var(--text);
      font: inherit; font-size: 12.5px; font-weight: 650; padding: 8px 14px; border-radius: var(--r-sm); cursor: pointer; transition: all .15s var(--ease); }
    .cd-btn .ic { width: 14px; height: 14px; }
    .cd-btn:hover { border-color: rgba(37, 99, 235,.5); background: rgba(37, 99, 235,.12); }
    .cd-btn.primary { background: var(--accent-grad); border-color: transparent; color: #ffffff; box-shadow: var(--sh-send); }
    .cd-btn.primary:hover { filter: brightness(1.08); }
    .cd-btn.danger { color: #f2969e; }
    .cd-btn.danger:hover { border-color: rgba(242,109,109,.5); background: rgba(242,109,109,.1); }
    .cd-btn.danger.arm { background: #d2434f; border-color: transparent; color: #fff; }
    .cd-comments { padding: 6px 16px 14px; }
    .cd-chead { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); margin: 10px 0 6px; }
    .cmt { display: flex; gap: 9px; padding: 7px 0; }
    .cmt-av { width: 24px; height: 24px; border-radius: 50%; flex: none; object-fit: cover; border: 1px solid var(--line-2); background: var(--surface-2); }
    .cmt-av-ph { width: 24px; height: 24px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: var(--muted); background: var(--surface-2); }
    .cmt-b { min-width: 0; }
    .cmt-a { font-size: 12px; font-weight: 650; }
    .cmt-a span { color: var(--faint); font-weight: 400; font-size: 11px; margin-left: 6px; font-family: var(--mono); }
    .cmt-t { font-size: 13px; line-height: 1.5; color: #cbd2de; white-space: pre-wrap; word-break: break-word; margin-top: 1px; }
    .cd-composer { display: flex; gap: 8px; padding: 10px 16px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(255,255,255,.012); }
    .cd-input { flex: 1; background: var(--bg-2); border: 1px solid var(--line-2); border-radius: 10px; color: var(--text); font: inherit; font-size: 12.5px; padding: 8px 11px; outline: none; }
    .cd-input:focus { border-color: rgba(37, 99, 235,.5); }
    .cd-send { background: var(--accent-grad); border: 0; color: #ffffff; font: inherit; font-size: 12px; font-weight: 600; padding: 7px 14px; border-radius: 10px; cursor: pointer; }
    .cd-send:disabled { opacity: .5; cursor: default; }
    .cd-loading { margin: 18px; }
    .cd-failed { min-height: 100%; }
    @media (max-width: 860px) {
      .co { padding: 0; }
      .co-sheet { border-radius: 0; border: 0; width: 100%; max-height: 100%; padding-top: env(safe-area-inset-top); }
      .co-detail { position: absolute; inset: 0; width: 100%; border-left: 0; background: rgba(10,10,12,.99); }
      /* the header wraps: row 1 = title · tabs · ✕ (always reachable), row 2 = search */
      .co-head { flex-wrap: wrap; row-gap: 10px; padding: 12px 14px 10px; }
      #coClose { margin-left: auto; padding: 4px 10px; font-size: 22px; }
      .co-search { order: 10; flex-basis: 100%; max-width: none; margin-left: 0; }
      .co-catalog { padding-inline: 14px; }
      .co-feature { grid-template-columns: minmax(200px,.9fr) minmax(220px,1fr); }
      .co-feature-support { display: none; }
    }
    @media (max-width: 560px) {
      .co-title > span:last-child::after { display: none; }
      .co-tabs { order: 3; width: 100%; margin-left: 0; overflow-x: auto; }
      .co-tab { flex: 1; min-width: max-content; }
      .co-feature { grid-template-columns: 1fr; }
      .co-feature-visual { min-height: 126px; border-right: 0; border-bottom: 1px solid var(--line); }
      .co-feature-copy { padding: 17px; }
      .co-grid { grid-template-columns: 1fr; }
    }
    @media (prefers-reduced-motion: reduce) { .co, .co-sheet, .ccard, .co-detail, .vpill.pop { animation: none; } }
    /* touch: reveal hover-only controls, grow small targets */
    @media (hover: none) {
      .saved-item .si-del, .saved-item .si-test, .ccard-del { opacity: .75; }
      .fb-btn { padding: 7px 11px; }
      .tf-btn { padding: 0 12px; }
    }

    /* settings panel (⚙ inputs) — legend header itself is hidden; the toolbar pill opens this */
    .legend { display: none; }
    /* ── indicator settings popout: the Backtester's sheet, on the Lab's tokens ──
       One list in Pine's own order and grouping (indicator-settings-form.ts); a colour sits in
       the row that uses it. Density is the tell: 42px rows, a 720px sheet, native Pine scale. */
    .indset-modal { position: absolute; inset: 0; z-index: 26; display: flex; align-items: center; justify-content: center; padding: 24px; }
    .indset-modal.tp-modal-backdrop { background: transparent; backdrop-filter: none; }
    .indset-sheet { width: min(720px, 100%); height: min(780px, 100%); display: flex; flex-direction: column; min-height: 0; overflow: hidden;
      background: var(--solid); border: 1px solid var(--line-2); border-radius: 14px; box-shadow: var(--sh-modal); animation: pop .18s var(--spring) both; }
    .indset-head { flex: none; min-height: 70px; display: flex; align-items: center; gap: 8px; padding: 16px 24px; border-bottom: 1px solid var(--line); }
    .indset-head > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
    .indset-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font: 600 15px var(--font); }
    .indset-head > div > span:last-child { font: 500 10px var(--font); letter-spacing: .06em; text-transform: uppercase; color: var(--faint); }
    .indset-close { width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border-radius: 9px; background: transparent; color: var(--muted); font-size: 13px; }
    .indset-close:hover { color: var(--text); background: var(--surface-2); }
    .indset-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
    .indform { height: 100%; display: flex; flex-direction: column; min-height: 0; background: var(--solid); }
    .indset-panels { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; }
    .indset-panel { display: block; padding: 16px 22px 28px; }
    .if-group { margin: 20px 0 5px; padding: 0 2px; font: 650 9.5px var(--font); letter-spacing: .1em; text-transform: uppercase; color: var(--faint); }
    .if-group:first-child { margin-top: 0; }
    .ifield { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 232px); align-items: center; gap: 18px; min-height: 42px; padding: 5px 2px; border-bottom: 1px solid var(--line); }
    .ifield:last-child { border-bottom: 0; }
    .if-copy { min-width: 0; display: flex; align-items: center; gap: 8px; }
    .if-copy label { min-width: 0; color: var(--sec); font: 500 12.5px/1.35 var(--font); }
    .if-info { flex: none; display: inline-grid; place-items: center; width: 16px; height: 16px; padding: 0; border: 0; border-radius: 50%; color: var(--faint); background: var(--surface-2); font: 700 9px var(--font); cursor: help; }
    button.if-info:hover:not(:disabled), button.if-info:focus-visible { color: var(--text); background: var(--surface-2); border-color: transparent; transform: none; }
    .ind-input-tooltip { position: absolute; z-index: 30; width: max-content; max-width: min(320px, calc(100% - 24px)); padding: 9px 11px; border: 1px solid var(--line-2); border-radius: 7px; background: var(--solid); color: var(--text); box-shadow: var(--sh-modal); font: 500 11.5px/1.42 var(--font); letter-spacing: 0; white-space: pre-line; text-align: left; pointer-events: none; }
    .ind-input-tooltip::before { content: ''; position: absolute; width: 0; height: 0; border: 6px solid transparent; }
    .ind-input-tooltip[data-side="right"]::before { right: 100%; top: calc(50% - 6px); border-right-color: var(--line-2); }
    .ind-input-tooltip[data-side="left"]::before { left: 100%; top: calc(50% - 6px); border-left-color: var(--line-2); }
    .ind-input-tooltip[data-side="below"]::before { bottom: 100%; left: calc(50% - 6px); border-bottom-color: var(--line-2); }
    .if-inline { display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; row-gap: 2px; padding: 4px 2px; border-bottom: 1px solid var(--line); }
    .if-inline > .ifield { display: flex; align-items: center; gap: 8px; min-height: 32px; padding: 0; border-bottom: 0; }
    .if-inline > .ifield > .if-copy { flex: none; }
    .if-inline > .ifield:first-child { flex: 1 1 auto; min-width: 0; }
    .if-inline > .ifield:first-child > .if-copy { flex: 1 1 auto; min-width: 0; }
    .if-inline > .ifield > :is(input,select,textarea) { width: auto; min-width: 0; }
    .if-inline > .ifield > select { min-width: 108px; }
    .if-inline > .ifield > input[type="number"] { width: 84px; }
    .ifield[data-inactive="1"] { opacity: .48; }
    .ifield[data-inactive="1"] :is(input,select,textarea) { cursor: not-allowed; }
    .ifield > input[type="number"], .ifield > input[type="text"], .ifield > input[type="datetime-local"], .ifield > select, .ifield > textarea { justify-self: stretch; width: 100%; height: 32px; padding: 0 10px; border: 1px solid var(--line-2); border-radius: 6px; font: 550 12px var(--font); color: var(--text); background-color: var(--surface); }
    .ifield > select { appearance: none; padding-right: 28px; background-image: linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%); background-position: calc(100% - 15px) 14px,calc(100% - 11px) 14px; background-size: 4px 4px,4px 4px; background-repeat: no-repeat; }
    .ifield > :is(input[type="number"],input[type="datetime-local"]) { font-family: var(--mono); }
    .ifield > textarea { min-height: 72px; height: auto; padding-block: 9px; resize: vertical; line-height: 1.4; }
    .ifield > :is(input,select,textarea):focus { outline: none; border-color: rgba(37,99,235,.6); box-shadow: 0 0 0 2px rgba(37,99,235,.18); }
    .indset-sheet select option { color: var(--text); background: var(--solid); }
    .if-check { position: relative; justify-self: end; width: 16px; height: 16px; cursor: pointer; }
    .if-check input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
    .if-check span { position: absolute; inset: 0; border: 1px solid var(--line-2); border-radius: 3px; background: var(--surface); transition: background .14s var(--ease), border-color .14s var(--ease); }
    .if-check span::after { content: ''; position: absolute; left: 5px; top: 2px; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg) scale(.7); opacity: 0; transition: opacity .12s var(--ease), transform .12s var(--ease); }
    .if-check input:checked + span { background: rgb(var(--accent)); border-color: rgb(var(--accent)); }
    .if-check input:checked + span::after { opacity: 1; transform: rotate(45deg) scale(1); }
    .if-check input:focus-visible + span { outline: 2px solid rgb(var(--accent)); outline-offset: 2px; }
    .if-session { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 7px; }
    .if-session > span { color: var(--faint); }
    .if-session input { width: 100%; height: 32px; padding: 0 9px; color: var(--text); background: var(--surface); border: 1px solid var(--line-2); border-radius: 6px; font: 550 11.5px var(--mono); }
    .if-color { display: grid; grid-template-columns: 82px 28px minmax(70px, 1fr) 36px; align-items: center; gap: 8px; }
    .if-color .if-color-hex { width: 82px; height: 30px; padding: 0 8px; border: 1px solid var(--line-2); border-radius: 6px; background: var(--surface); color: var(--text); font: 550 11px var(--mono); text-transform: uppercase; }
    .if-color .if-color-hex:focus { outline: none; border-color: rgba(37,99,235,.6); box-shadow: 0 0 0 2px rgba(37,99,235,.18); }
    .if-color .if-color-hex.bad { border-color: var(--danger); }
    .if-color input[type="color"] { width: 26px; height: 26px; padding: 2px; border: 1px solid var(--line-2); border-radius: 6px; background: var(--surface); cursor: pointer; overflow: hidden; }
    .if-color input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
    .if-color input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 4px; }
    .if-inline .if-color { display: flex; gap: 6px; }
    .if-inline .if-color :is(.if-color-hex, .if-transp, output) { display: none; }
    .if-color .if-transp { width: 100%; padding: 0; accent-color: rgb(var(--accent)); }
    .if-color output { color: var(--muted); font: 550 10.5px var(--mono); text-align: right; }
    .indset-empty { min-height: 240px; display: grid; place-content: center; gap: 5px; text-align: center; }
    .indset-empty b { color: var(--sec); font-size: 13px; }
    .indset-empty span { max-width: 280px; color: var(--faint); font-size: 11.5px; }
    .indset-foot { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 68px; padding: 12px 20px; border-top: 1px solid var(--line); background: var(--pane); }
    .indset-foot > .indset-actions { display: flex; gap: 8px; }
    .indset-foot button { min-width: 84px; height: 38px; padding: 0 12px; border: 1px solid var(--line-2); border-radius: 9px; background: var(--surface); color: var(--sec); font: 600 12.5px var(--font); cursor: pointer; }
    .indset-foot button:hover { color: var(--text); border-color: var(--line-2); background: var(--surface-2); }
    .indset-foot .iapply { color: #fff; border-color: transparent; background: rgb(var(--accent)); }
    .indset-foot .iapply:hover { color: #fff; background: rgb(var(--accent)); filter: brightness(1.08); }
    .indset-foot .iapplyall { display: none; } /* one chart in the Lab */
    .indset-foot .ireset-script { min-width: 0; padding-inline: 8px; border-color: transparent; background: transparent; color: var(--muted); }
    .color-ctrl { display: grid; grid-template-columns: minmax(78px,1fr) 32px minmax(58px,.8fr) 34px; align-items: center; gap: 7px; width: 100%; }
    .color-hex { width: 100% !important; height: 36px; font: 600 11px var(--mono); text-transform: uppercase; }
    .color-hex.bad { border-color: var(--danger); box-shadow: 0 0 0 2px color-mix(in srgb,var(--danger) 12%,transparent); }
    .color-swatch { width: 30px !important; min-width: 30px; height: 30px; padding: 2px !important; border: 1px solid var(--line-2); border-radius: 50%;
      background: var(--solid); box-shadow: inset 0 0 0 2px var(--solid); cursor: pointer; }
    .color-swatch:hover { border-color: rgba(37,99,235,.5); }
    .color-transp { flex: 1; width: auto !important; padding: 0 !important; }
    .color-pct { font-size: 11px; color: var(--muted); width: 30px; text-align: right; font-family: var(--mono); }
    .input-color-popover { position: fixed; z-index: 1100; width: 216px; padding: 9px; border: 1px solid var(--line-2); border-radius: 13px;
      background: color-mix(in srgb,var(--solid) 98%,transparent); box-shadow: var(--sh-modal); backdrop-filter: blur(18px); }
    .input-color-sv { position: relative; height: 132px; border-radius: 9px; cursor: crosshair; touch-action: none;
      background-image: linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent); }
    .input-color-dot { position: absolute; width: 11px; height: 11px; border: 2px solid #fff; border-radius: 50%;
      box-shadow: 0 0 0 1px rgba(0,0,0,.75),0 2px 4px rgba(0,0,0,.3); transform: translate(-50%,-50%); pointer-events: none; }
    .input-color-hue { width: 100%; height: 10px; margin: 10px 0 8px; padding: 0; border: 0; border-radius: 999px; appearance: none;
      background: linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00); cursor: pointer; }
    .input-color-hue::-webkit-slider-thumb { appearance: none; width: 14px; height: 14px; border: 2px solid #fff; border-radius: 50%; background: transparent; box-shadow: 0 0 0 1px rgba(0,0,0,.65); }
    .input-color-saturation { display: grid; grid-template-columns: auto 1fr 34px; align-items: center; gap: 8px; margin: 0 1px 8px; color: var(--muted); font: 600 10px var(--font,Switzer,system-ui,sans-serif); }
    .input-color-saturation input { min-width: 0; accent-color: var(--accent); }
    .input-color-saturation output { color: var(--text-2); font: 600 10px 'Geist Mono',ui-monospace,monospace; text-align: right; }
    .input-color-hex { width: 100%; height: 36px; padding: 0 9px; border-radius: 8px; font: 600 11px var(--mono); text-transform: uppercase; }
    @media (max-width: 480px) {
      .library-panel { position: fixed; inset: auto 8px 8px; width: auto; max-width: none; max-height: min(78dvh, 680px); border-radius: 18px; transform-origin: bottom center; }
      .library-toolbar { align-items: stretch; flex-direction: column; gap: 7px; }
      .library-count { align-self: flex-end; }
      .lib-open { grid-template-columns: 30px minmax(0,1fr); }
      .lib-access { grid-column: 2; justify-self: start; }
      .lib-actions { padding-left: 10px; overflow-x: auto; }
      .lib-versions { margin-left: 10px; }
      .lib-delete-confirm { align-items: stretch; flex-direction: column; }
      .lib-delete-confirm > div:last-child { justify-content: flex-end; }
      .indset-modal { padding: 0; align-items: flex-end; }
      .indset-sheet { inset: auto 0 0; width: 100%; height: min(76dvh, 680px); border-radius: 18px 18px 0 0; transform-origin: bottom center; }
      .ifield { grid-template-columns: minmax(104px,1fr) minmax(142px,1.2fr); gap: 12px; }
      .indset-panel { padding-inline: 14px; }
      .color-ctrl { grid-template-columns: minmax(70px,1fr) 30px minmax(46px,.7fr) 30px; gap: 5px; }
    }

    /* ── responsive: desktop split → mobile tabs ── */
    @media (max-width: 1100px) {
      .authoring-flow { grid-template-columns:minmax(150px,190px) minmax(390px,1fr) auto;gap-inline:14px; }
      .authoring-stages small { display:none; }
      .authoring-actions .authoring-inspect { width:32px;padding:0;justify-content:center; }
      .authoring-actions .authoring-inspect .lbl-hide { display:none; }
      #chatPane { width: min(var(--builder-w, 350px), 40vw); }
      .ctoolbar { gap: 6px; }
      .tf-btn { padding-inline: 9px; }
    }
    @media (max-width: 900px) {
      .authoring-flow { min-height:76px;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'current actions' 'stages stages';padding:9px 12px; }
      .authoring-guidance { display:none; }
      .authoring-stages { overflow-x:auto;scrollbar-width:none;grid-template-columns:repeat(4,minmax(104px,1fr));padding-bottom:1px; }
      .authoring-stages::-webkit-scrollbar { display:none; }
      .tabs { display: inline-flex; }
      #chatPane { width: auto; border-right: 0; }
      .workspace-splitter, .builder-toggle { display: none !important; }
      .lab[data-builder-collapsed] #chatPane { display: flex; }
      .lab[data-tab="chat"] #chartPane, .lab[data-tab="chart"] #chatPane { display: none; }
      .lab[data-tab="chat"] #chatPane, .lab[data-tab="chart"] #chartPane { flex: 1 1 100%; }
      .hbrand .hmuted, .hbrand .hsep { display: none; }
      .hactions .lbl-hide, .ctoolbar .lbl-hide { display: none; }
      .btn.hnew { padding: 0 10px; }
      #chat { padding: 18px 16px 8px; }
      /* iOS zooms the page when a focused input is under 16px — pin the chat inputs */
      #prompt, .cd-input, .fb-note, .co-search input { font-size: 16px; }
      .lab[data-tab="chat"] #chartPane,.lab[data-tab="chat"] #howItWorksPanel,
      .lab[data-tab="chart"] #chatPane,.lab[data-tab="chart"] #howItWorksPanel,
      .lab[data-tab="how"] #chatPane,.lab[data-tab="how"] #chartPane { display:none; }
      .lab[data-tab="how"] #howItWorksPanel { display:flex; flex:1 1 100%; width:auto; border-left:0; }
      .how-splitter { display:none !important; }
      .how-rule { grid-template-columns:minmax(0,1fr); }
      .how-rule .how-status { grid-column:1; justify-self:start; }
    }
    /* Touch devices: Apple's 44px tap-target floor on the nav + brighter secondary label tiers (outdoor screens) */
    @media (hover: none) and (pointer: coarse) {
      html:not([data-theme="light"]) { --faint: #858b94; --muted: #a7abb2; --sec: #c4d1e5; }
      .tab, .gbtn { min-height: 42px; }
    }
    @media (max-width: 560px) {
      .authoring-flow { min-height:72px;grid-template-columns:minmax(0,1fr) auto;gap:5px 10px; }
      .authoring-current>span { display:none; }
      .authoring-current { grid-template-columns:minmax(0,1fr) auto; }
      .authoring-actions .authoring-backtest { display:none; }
      .authoring-stages { grid-template-columns:repeat(4,minmax(90px,1fr)); }
      .authoring-stages li { gap:6px; }
      .authoring-stages small { display:none; }
      .authoring-resources>.authoring-menu-trigger { width:36px;padding:0;font-size:0;justify-content:center; }
      .authoring-resources>.authoring-menu-trigger::before { content:'•••';font-size:12px;letter-spacing:1px; }
      .authoring-resources>.authoring-menu-trigger>span { display:none; }
      .saved-panel { position: fixed; inset: auto 8px calc(8px + env(safe-area-inset-bottom)); width: auto; max-width: none; max-height: min(68dvh, 620px); border-radius: 18px; transform-origin: bottom center; }
      .library-panel { max-height: min(78dvh, 680px); }
      header { backdrop-filter: none; }
      .hbrand .wordmark { display: none; }
      header { gap: 10px; padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
      .tab { font-size: 0; gap: 0; padding: 7px 12px; }
      .tab .ic { width: 16px; height: 16px; }
      .toast { right: 12px; max-width: calc(100vw - 24px); }
      .usage-chip span:last-child { display: none; }
      .ctoolbar { padding-inline: 8px; }
      /* One horizontal rail on phones. A sticky action cluster used to sit on
         top of market/timeframe, so the controls traders need first were the
         only controls they could not see. */
      .chart-actions { position:static; right:auto; padding:0; background:none; }
      .tf-switch { max-width:none; overflow:visible; }
      .mkt-select { width:62px; max-width:62px; }
      #indPillName { max-width: 126px; }
      .chart-state { top: 56px; max-width: calc(100% - 16px); }
      .chart-state-copy > span { display: none; }
      .chart-state.is-blocking .chart-state-copy > span { display: block; }
    }
    @media (max-width: 430px) {
      .hbrand { display: none; }
      .gbtn { padding: 0 9px; }
      .gate-card { padding: 30px 22px 26px; }
      .gate-card h1 { font-size: 26px; }
      .paid-wrap { padding: 14px 12px calc(28px + env(safe-area-inset-bottom)); }
      .paid-card { padding: 28px 20px 24px; }
      .paid-card h1 { font-size: 22px; }
      .code-lock { margin: 6px 2px 10px; }
    }

    /* ── keyframes ── */
    @keyframes rise { from { opacity: 0; transform: translateY(16px) scale(.985); } to { opacity: 1; transform: none; } }
    @keyframes pop { from { opacity: 0; transform: translateY(-6px) scale(.97); } to { opacity: 1; transform: none; } }
    @keyframes msgin { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }
    @keyframes actin { to { opacity: 1; transform: none; } }
    @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }
    @keyframes tpPulse { 0% { box-shadow: 0 0 0 0 rgba(34,197,94,.45); } 70% { box-shadow: 0 0 0 6px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }
    @keyframes tpDot { 0%, 60%, 100% { opacity: .25; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
    @media (prefers-reduced-motion: reduce) { * { animation: none !important; } }

    /* ═══════════ LAUNCH DECK — focused post-login platform landing (all scoped under #launch) ═══════════ */
    #launch{position:relative;height:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain}
    #launch .lch-space{position:fixed;inset:0;z-index:0;pointer-events:none}
    #launch #lchStars{position:absolute;inset:0;width:100%;height:100%}
    #launch .lch-nebula{position:absolute;inset:0;
      background:radial-gradient(1200px 620px at 16% -12%,rgba(37, 99, 235,.10),transparent 58%),radial-gradient(1400px 700px at 50% 120%,rgba(34,34,40,.20),transparent 62%);
      animation:lchBreathe 14s ease-in-out infinite}
    @keyframes lchBreathe{0%,100%{opacity:.85}50%{opacity:1}}
    #launch .lch-horizon{position:absolute;left:50%;bottom:-4%;width:220%;height:60%;
      background-image:linear-gradient(rgba(37, 99, 235,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(37, 99, 235,.08) 1px,transparent 1px);
      background-size:66px 66px;-webkit-mask-image:radial-gradient(115% 105% at 50% 100%,#000 4%,transparent 74%);mask-image:radial-gradient(115% 105% at 50% 100%,#000 4%,transparent 74%);
      transform-origin:50% 100%;transform:translateX(-50%) perspective(560px) rotateX(70deg);opacity:0;animation:lchGridIn 1.2s .05s cubic-bezier(.2,.7,.2,1) forwards}
    @keyframes lchGridIn{from{opacity:0;transform:translateX(-50%) perspective(560px) rotateX(78deg) translateY(50px)}to{opacity:.9;transform:translateX(-50%) perspective(560px) rotateX(70deg)}}
    #launch .lch-core{position:absolute;left:50%;top:56%;width:1000px;height:420px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(37, 99, 235,.10),transparent 78%);filter:blur(6px)}
    #launch .lch-vignette{position:absolute;inset:0;background:radial-gradient(135% 125% at 50% 40%,transparent 48%,rgba(4,4,6,.62) 100%)}
    #launch .lch-scan{position:fixed;left:0;right:0;top:0;height:2px;z-index:2;pointer-events:none;
      background:linear-gradient(90deg,transparent,rgba(37, 99, 235,.75) 30%,rgba(219,234,254,.95) 50%,rgba(37, 99, 235,.75) 70%,transparent);box-shadow:0 0 22px 3px rgba(37, 99, 235,.55);opacity:0;animation:lchSweep 1.05s .12s ease-out forwards}
    @keyframes lchSweep{0%{opacity:0;transform:translateY(0)}8%{opacity:1}92%{opacity:.9}100%{opacity:0;transform:translateY(100vh)}}
    #launch .lch-hud{position:fixed;inset:0;z-index:1;pointer-events:none}
    #launch .lch-cnr{position:absolute;width:26px;height:26px;border:1.5px solid rgba(37, 99, 235,.32)}
    #launch .lch-cnr.tl{top:16px;left:16px;border-right:0;border-bottom:0}
    #launch .lch-cnr.tr{top:16px;right:16px;border-left:0;border-bottom:0}
    #launch .lch-cnr.bl{bottom:16px;left:16px;border-right:0;border-top:0}
    #launch .lch-cnr.br{bottom:16px;right:16px;border-left:0;border-top:0}
    #launch .lch-read{position:absolute;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;color:var(--faint);text-transform:uppercase}
    #launch .lch-read.br{bottom:20px;right:52px;text-align:right}
    #launch .lch-read.bl{bottom:20px;left:52px}
    #launch .lch-read b{color:rgba(37, 99, 235,.6);font-weight:500}

    #launch .lch-deck{position:relative;z-index:3;min-height:100%;display:flex;flex-direction:column;max-width:1160px;margin:0 auto;padding:0 40px}
    #launch .lch-top{position:relative;isolation:isolate;display:flex;align-items:center;gap:12px;height:56px;flex:none}
    #launch .lch-top::before{content:'';position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);border-bottom:1px solid var(--line);background:rgba(9,9,11,.82);backdrop-filter:blur(14px)}
    #launch .lch-brand{display:flex;align-items:center;gap:11px;color:var(--text);text-decoration:none}
    #launch .lch-brand:hover .lch-wm{color:var(--gold-hi)}
    #launch .lch-logo{width:30px;height:30px;border-radius:9px;background:linear-gradient(180deg,#fff,#cdd7e4);display:grid;place-items:center;box-shadow:0 2px 10px rgba(0,0,0,.4);cursor:pointer}
    #launch .lch-logo img{width:22px;height:22px;object-fit:contain}
    #launch .lch-wm{font-weight:600;font-size:14.5px;letter-spacing:-.01em}
    #launch .lch-sep{width:1px;height:15px;background:var(--line-2)}
    #launch .lch-muted{color:var(--muted);font-size:13px}
    #launch .lch-spacer{flex:1}
    #launch .lch-member{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--sec);padding:6px 11px;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.04)}
    #launch .lch-member .d{width:6px;height:6px;border-radius:50%;background:#6ee7a0;box-shadow:0 0 9px 1px rgba(110,231,160,.7)}
    #launch .lch-icobtn{width:32px;height:32px;border-radius:9px;border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--muted);display:grid;place-items:center;cursor:pointer}
    #launch .lch-icobtn:hover{color:var(--text);border-color:rgba(255,255,255,.24)}
    #launch .lch-icobtn svg{width:15px;height:15px}

    #launch .lch-main{flex:none;display:flex;flex-direction:column;justify-content:flex-start;padding:52px 0 72px}
    /* The kicker was a gold bar of type — the single most visible piece of the yellow. It now wears
       the platform section-label treatment (.tp-eyebrow-glass): neutral type on glass, one accent
       mark. Stated here because #launch out-specifies the shared primitive. */
    #launch .lch-eye{align-self:flex-start;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--sec);display:inline-flex;align-items:center;gap:9px;
      padding:6px 12px;border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
    #launch .lch-eye .rd{color:var(--faint)}
    #launch .lch-eye b{color:rgb(var(--accent-hi));font-weight:600}
    #launch .lch-h1{font-size:24px;line-height:1.25;letter-spacing:-.02em;font-weight:700;margin:8px 0 4px;color:var(--text)}
    #launch .lch-h1sub{color:var(--muted);font-size:15.5px}

    #launch .lch-panels{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0 34px}
    #launch .lch-panel{position:relative;isolation:isolate;width:100%;cursor:pointer;color:var(--text);text-align:left;font:inherit;border-radius:16px;padding:24px 24px 26px;min-height:210px;background:var(--panel-grad,linear-gradient(180deg,#16161a,#101013));border:1px solid var(--line-2);display:grid;grid-template-rows:44px 1fr;overflow:hidden;transition:transform .22s cubic-bezier(.2,.7,.2,1),border-color .22s,box-shadow .22s}
    #launch .lch-panel::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:16px;opacity:0;transition:opacity .25s;background:radial-gradient(120% 90% at 30% -10%,rgba(37, 99, 235,.20),transparent 60%)}
    #launch .lch-panel::after{content:'';position:absolute;top:0;left:16px;right:16px;height:1px;background:linear-gradient(90deg,transparent,rgba(37, 99, 235,.45),transparent);opacity:.5;transition:opacity .25s}
    #launch .lch-panel:hover{transform:translateY(-3px);border-color:rgba(37, 99, 235,.5);box-shadow:0 18px 44px -18px rgba(12,12,15,.9),0 0 0 1px rgba(37, 99, 235,.18),0 0 40px -6px rgba(37, 99, 235,.34)}
    #launch .lch-panel:hover::before,#launch .lch-panel:hover::after{opacity:1}
    #launch .lch-ret{position:absolute;width:13px;height:13px;border:1.5px solid rgba(37, 99, 235,.30);transition:border-color .25s}
    #launch .lch-ret.tl{top:12px;left:12px;border-right:0;border-bottom:0}
    #launch .lch-ret.tr{top:12px;right:12px;border-left:0;border-bottom:0}
    #launch .lch-ret.bl{bottom:12px;left:12px;border-right:0;border-top:0}
    #launch .lch-ret.br{bottom:12px;right:12px;border-left:0;border-top:0}
    #launch .lch-panel:hover .lch-ret{border-color:rgba(37, 99, 235,.75)}
    #launch .lch-pico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(180deg,rgba(37, 99, 235,.16),rgba(37, 99, 235,.05));border:1px solid rgba(37, 99, 235,.22);color:#cfe0ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
    #launch .lch-pico svg{width:19px;height:19px}
    #launch .lch-panel.dim{opacity:.5;filter:saturate(.5);cursor:default}
    #launch .lch-panel.dim:hover{transform:none;border-color:var(--line-2);box-shadow:none}
    #launch .lch-panel.dim:hover::before{opacity:0}
    #launch .lch-pbody{align-self:end;display:grid;grid-template-rows:18px 28px minmax(38px,auto);align-content:end;margin-top:18px;padding-right:42px}
    #launch .lch-ptag{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}
    #launch .lch-ptitle{align-self:start;font-size:19px;line-height:24px;font-weight:600;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    #launch .lch-psub{align-self:start;color:var(--muted);font-size:13px;margin-top:2px;line-height:1.42}
    #launch .lch-psub .mono{font-family:var(--mono);color:var(--sec)}
    #launch .lch-pgo{position:absolute;right:24px;bottom:26px;color:var(--ghost);transition:color .2s,transform .2s}
    #launch .lch-panel:hover .lch-pgo{color:rgb(var(--blue-hi));transform:translateX(3px)}
    #launch .lch-pgo svg{width:16px;height:16px}
    #launch .lch-skel{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    #launch .lch-skel span{display:block;height:148px;border-radius:14px;border:1px solid var(--line-2,rgba(255,255,255,.1));background:linear-gradient(100deg,transparent 32%,rgba(255,255,255,.05) 48%,transparent 62%) 0 0/220% 100%,color-mix(in srgb,var(--solid,#101013) 82%,transparent);animation:lchShimmer 1.4s ease-in-out infinite}
    @keyframes lchShimmer{from{background-position:130% 0,0 0}to{background-position:-70% 0,0 0}}
    @media (max-width:900px){#launch .lch-skel{grid-template-columns:1fr}}
    /* Contrast pass: the primary panel is NEUTRAL like its siblings — the blue lives on the solid
       icon chip and the go arrow, so it reads clickable rather than selected. */
    #launch .lch-panel.primary .lch-pico{background:linear-gradient(180deg,#3b82f6,#2563eb);color:#fff}
    #launch .lch-panel.primary .lch-pgo{color:#3b82f6}

    #launch .lch-bayhead{display:flex;align-items:center;gap:14px;margin-bottom:12px}
    #launch .lch-bayeye{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--sec)}
    #launch .lch-baycount{font-family:var(--mono);font-size:11px;color:var(--faint)}
    #launch .lch-srch{margin-left:auto;position:relative}
    #launch .lch-srch input{width:210px;background:rgba(255,255,255,.05);border:1px solid var(--line-2);border-radius:9px;padding:8px 11px 8px 30px;color:var(--text);font:inherit;font-size:13px;outline:none}
    #launch .lch-srch input::placeholder{color:var(--faint)}
    #launch .lch-srch input:focus{border-color:rgba(37, 99, 235,.4);background:rgba(255,255,255,.07)}
    #launch .lch-srch svg{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--faint)}
    #launch .lch-baylist{display:flex;flex-direction:column}
    #launch .lch-row{display:flex;align-items:center;gap:6px;padding:5px 8px;border-top:1px solid var(--line);transition:background .15s}
    #launch .lch-ropen{min-width:0;flex:1;display:flex;align-items:center;gap:14px;padding:8px;border:0;border-radius:9px;background:transparent;color:var(--text);text-align:left;font:inherit}
    #launch .lch-row:first-child{border-top:0}
    #launch .lch-row:hover{background:rgba(37, 99, 235,.06)}
    #launch .lch-rglyph{width:30px;height:30px;border-radius:8px;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid var(--line-2);color:var(--muted)}
    #launch .lch-rglyph svg{width:14px;height:14px}
    #launch .lch-row:hover .lch-rglyph{color:#cfe0ff;border-color:rgba(37, 99, 235,.3)}
    #launch .lch-rname{display:block;font-size:14px;font-weight:500}
    #launch .lch-rmeta{display:block;font-family:var(--mono);font-size:11px;color:var(--faint);margin-top:2px;letter-spacing:.02em}
    #launch .lch-rsp{flex:1}
    #launch .lch-rtime{font-family:var(--mono);font-size:11.5px;color:var(--muted)}
    #launch .lch-rmore{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;color:var(--ghost);opacity:0;transition:opacity .15s,color .15s;background:none;border:0;cursor:pointer}
    #launch .lch-row:hover .lch-rmore{opacity:1}
    #launch .lch-rmore:hover{color:var(--text);background:rgba(255,255,255,.1)}
    #launch .lch-rmore svg{width:15px;height:15px}
    #launch .lch-empty{padding:30px 20px;text-align:center;color:var(--muted)}
    #launch .lch-empty b{display:block;color:var(--sec);font-size:14px;margin-bottom:4px}

    #launch .lch-community{margin-top:52px;padding-top:42px;border-top:1px solid var(--line)}
    #launch .lch-community-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:20px}
    #launch .lch-community-eye{display:block;margin-bottom:8px;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--sec)}
    #launch .lch-community-head h2{margin:0;color:var(--text);font-size:26px;line-height:1.12;font-weight:650;letter-spacing:-.025em}
    #launch .lch-community-head p{max-width:620px;margin:8px 0 0;color:var(--muted);font-size:14px;line-height:1.55}
    #launch .lch-community-all{flex:none;display:inline-flex;align-items:center;gap:9px;min-height:40px;padding:0 15px;border:1px solid var(--line-2);border-radius:10px;background:var(--solid);color:var(--text);font:600 12.5px var(--font);cursor:pointer;box-shadow:var(--sh-card);transition:transform .18s var(--spring),border-color .18s,background .18s}
    #launch .lch-community-all:hover{transform:translateY(-1px);border-color:rgba(37, 99, 235,.42);background:var(--surface)}
    #launch .lch-community-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
    #launch .lch-community-card{min-width:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line-2);border-radius:16px;background:var(--card-grad-2);box-shadow:var(--sh-card);transition:transform .2s var(--spring),border-color .2s,box-shadow .2s}
    #launch .lch-community-card:hover{transform:translateY(-3px);border-color:rgba(37, 99, 235,.42);box-shadow:0 22px 48px -30px rgba(45,37,24,.38)}
    #launch .lch-community-open{display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer}
    #launch .lch-community-open:focus-visible{outline:2px solid rgba(37, 99, 235,.7);outline-offset:-3px;border-radius:14px}
    #launch .lch-community-preview{position:relative;aspect-ratio:16/8.7;overflow:hidden;background:linear-gradient(145deg,#151519,#09090b);border-bottom:1px solid var(--line)}
    #launch .lch-community-preview::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 62%,rgba(9,9,11,.34))}
    #launch .lch-community-preview img,#launch .lch-community-preview>svg{display:block;width:100%;height:100%;object-fit:cover}
    #launch .lch-community-preview>svg{padding:16px;box-sizing:border-box}
    #launch .lch-community-preview .ccard-thumb-ph{color:rgba(37, 99, 235,.6)}
    #launch .lch-community-pick{position:absolute;z-index:1;left:12px;top:12px;display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:999px;background:rgba(9,9,11,.76);border:1px solid rgba(37, 99, 235,.38);backdrop-filter:blur(8px);color:#3b82f6;font:700 9px var(--font);letter-spacing:.08em;text-transform:uppercase}
    #launch .lch-community-body{padding:16px 17px 2px}
    #launch .lch-community-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:15px;font-weight:650;letter-spacing:-.01em}
    #launch .lch-community-meta{display:flex;align-items:center;gap:6px;margin-top:6px;color:var(--faint);font:500 11px var(--mono)}
    #launch .lch-community-meta .author{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sec);font-family:var(--font);font-weight:600}
    #launch .lch-community-foot{display:flex;align-items:center;gap:12px;margin:13px 17px 0;padding:13px 0 17px;border-top:1px solid var(--line)}
    #launch .lch-community-stat{color:var(--muted);font:600 11px var(--mono)}
    #launch .lch-community-fork{margin-left:auto;min-height:32px;padding:0 12px;border:1px solid rgba(37, 99, 235,.34);border-radius:9px;background:rgba(37, 99, 235,.09);color:var(--accent-text);font:650 11.5px var(--font);cursor:pointer;transition:background .16s,border-color .16s}
    #launch .lch-community-fork:hover{background:rgba(37, 99, 235,.18);border-color:rgba(37, 99, 235,.55)}
    #launch .lch-community-empty{grid-column:1/-1;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:32px;border:1px dashed var(--line-2);border-radius:16px;background:color-mix(in srgb,var(--solid) 74%,transparent);color:var(--muted);text-align:center;font-size:13px;line-height:1.5}
    #launch .lch-community-empty b{color:var(--text);font-size:15px}

    #launch.lch-boot .lch-b{opacity:0;transform:translateY(10px);animation:lchRise .6s cubic-bezier(.2,.7,.2,1) forwards}
    #launch.lch-boot .lch-b1{animation-delay:.10s}
    #launch.lch-boot .lch-b2{animation-delay:.16s}
    #launch.lch-boot .lch-panel{opacity:0;transform:translateY(14px);animation:lchIgnite .5s cubic-bezier(.2,.7,.2,1) forwards}
    #launch.lch-boot .lch-panel:nth-child(1){animation-delay:.24s}
    #launch.lch-boot .lch-panel:nth-child(2){animation-delay:.32s}
    #launch.lch-boot .lch-panel:nth-child(3){animation-delay:.40s}
    #launch.lch-boot .lch-bay{opacity:0;transform:translateY(10px);animation:lchRise .55s .46s cubic-bezier(.2,.7,.2,1) forwards}
    /* #70: the workspace arriving as one settled piece. The envelope is deliberately IDENTICAL to
       the website's .tp-content-enter (lib/platform/content-transition.ts owns the numbers there) —
       the issue's whole point is that a member crossing surfaces should not feel two different
       transitions. Change one and change the other. */
    #lab.lab-enter{animation:labEnter .26s cubic-bezier(.22,1,.36,1)}
    @keyframes labEnter{
      /* Not 0: the deck has just left, and a blank frame here is the flash this replaces. */
      from{opacity:.45;filter:blur(6px);transform:translateY(8px) scale(.97)}
      to{opacity:1;filter:blur(0);transform:none}
    }
    @media (prefers-reduced-motion:reduce){
      #lab.lab-enter{animation:labEnterReduced 80ms linear}
      #launch .lch-skel span{animation:none}
      @keyframes labEnterReduced{from{opacity:.45}to{opacity:1}}
    }
    @keyframes lchRise{to{opacity:1;transform:none}}
    @keyframes lchIgnite{0%{opacity:0;transform:translateY(14px)}60%{box-shadow:0 0 0 1px rgba(37, 99, 235,.5),0 0 40px -4px rgba(37, 99, 235,.5)}100%{opacity:1;transform:none}}

    @media (max-width:820px){
      #launch .lch-deck{padding:0 20px}
      #launch .lch-panels{grid-template-columns:1fr;gap:12px}
      #launch .lch-panel{min-height:112px;grid-template-columns:44px minmax(0,1fr);grid-template-rows:1fr;align-items:center;padding:18px 20px}
      #launch .lch-pbody{align-self:center;grid-template-rows:16px 26px auto;margin:0;padding:0 34px 0 16px}
      #launch .lch-pgo{right:20px;bottom:auto;top:50%;transform:translateY(-50%)}
      #launch .lch-panel:hover .lch-pgo{transform:translate(3px,-50%)}
      #launch .lch-h1{font-size:24px}
      #launch .lch-srch input{width:150px}
      #launch .lch-read{display:none}
      #launch .lch-community-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    }
    @media (max-width:560px){
      #launch .lch-main{padding-top:26px}
      #launch .lch-h1{font-size:22px}
      #launch .lch-h1sub{font-size:14px}
      #launch .lch-panel{min-height:94px;padding:14px 16px}
      #launch .lch-pbody{grid-template-rows:22px auto;padding-left:13px}
      #launch .lch-ptag{display:none}
      #launch .lch-ptitle{font-size:16px;line-height:22px}
      #launch .lch-psub{font-size:12px;line-height:1.35}
      #launch .lch-bayhead{align-items:stretch;flex-wrap:wrap}
      #launch .lch-srch{order:3;width:100%;margin:0}
      #launch .lch-srch input{width:100%;font-size:16px}
      #launch .lch-rtime{display:none}
      #launch .lch-rmore{width:40px;height:40px;opacity:1}
      #launch .lch-community-head{align-items:flex-start;flex-direction:column;gap:16px}
      #launch .lch-community-grid{grid-template-columns:1fr}
      #launch .lch-community-all{width:100%;justify-content:center}
    }

    /* ══════════════════════════════════════════════════════════════════════════════════════════
       ONE-PLATFORM SHELL — mirrors takingprophets.com. The services remain independently deployed;
       this persistent spatial contract is the seam users see and use on every surface.
       ══════════════════════════════════════════════════════════════════════════════════════════ */
    html { --tp-shell-w:288px; } /* 56px spine + 232px context pane (P1) */
    html[data-sidebar="collapsed"] { --tp-shell-w:56px; } /* pane hidden, spine stays */
    /* A focused build keeps the product rooms reachable. Members can still collapse the context
       pane explicitly, but entering the Builder must never hide navigation on their behalf. */
    html[data-theme="light"] {
      color-scheme:light;
      /* Light mode kept its own brass accent, which is the gold left on the launch cards.
         These are the Backtester's light values verbatim — one accent, both themes. */
      --accent:37 99 235; --accent-hi:29 78 216;
      --accent-grad:linear-gradient(180deg,#2563eb,#1d4ed8);
      --bg:#f5f4f0; --bg-2:#f1efe9; --pane:#faf9f6; --raised:#fffefb; --row-hover:#f1efe9; --surface:rgba(53,47,36,.045); --surface-2:rgba(53,47,36,.08);
      --solid:#fcfbf8; --card-grad:linear-gradient(180deg,#fffefb,#fcfbf8); --card-grad-2:linear-gradient(180deg,#fffefb,#f8f6f1);
      --bubble-grad:linear-gradient(180deg,#f5f2eb,#eeebe4); --line:rgba(53,47,36,.08); --line-2:rgba(53,47,36,.14);
      --text:#171612; --text-2:#3f3b34; --body-ai:#4d4941; --sec:#56524a; --muted:#69645c; --faint:#736e65; --ghost:#948d82;
      --accent-text:#1d4ed8; --ok:#1f9d57; --ok-text:#197c47; --danger:#ce3b31; --diff-red:#b43c34;
      --sh-primary:0 8px 24px -12px rgba(37,99,235,.35),inset 0 1px 0 rgba(255,255,255,.35);
      --sh-send:0 6px 18px -10px rgba(37,99,235,.38); --sh-modal:0 30px 80px -36px rgba(45,37,24,.35),0 0 0 1px rgba(53,47,36,.04);
      --sh-card:0 18px 40px -26px rgba(45,37,24,.28); --btctx-bg:linear-gradient(180deg,#fffefb,#fcfbf8);
      --btctx-border:rgba(53,47,36,.16); --btctx-input-bg:#f1efe9; --btctx-input-border:rgba(53,47,36,.18);
    }
    html[data-theme="light"] body { background:radial-gradient(1000px 520px at 16% -12%,rgba(37, 99, 235,.17),transparent 64%),var(--bg); }
    html[data-theme="light"] a { color:#1d4ed8; }
    html[data-theme="light"] header { background:rgba(250,249,246,.9); }
    html[data-theme="light"] .gate-card h1,
    html[data-theme="light"] #launch .lch-h1 { background:linear-gradient(108deg,var(--text) 54%,#2563eb);-webkit-background-clip:text;background-clip:text;color:transparent; }
    html[data-theme="light"] #launch .lch-space { opacity:.34;filter:saturate(.76); }
    html[data-theme="light"] #launch .lch-nebula { background:radial-gradient(1000px 560px at 12% -8%,rgba(37, 99, 235,.24),transparent 60%),radial-gradient(760px 460px at 94% 2%,rgba(37, 99, 235,.12),transparent 66%); }
    html[data-theme="light"] #launch .lch-vignette { background:radial-gradient(135% 125% at 50% 40%,transparent 56%,rgba(53,47,36,.1) 100%); }
    html[data-theme="light"] #launch .lch-panel { --panel-grad:linear-gradient(180deg,rgba(255,254,251,.96),rgba(252,251,248,.94));box-shadow:var(--sh-card); }
    html[data-theme="light"] #launch .lch-panel:hover { border-color:rgba(37,99,235,.38);box-shadow:0 20px 44px -28px rgba(45,37,24,.36),0 0 0 1px rgba(37,99,235,.08); }
    html[data-theme="light"] #launch .lch-pico { color:#2563eb; }
    html[data-theme="light"] #launch .lch-panel.primary .lch-pico { color:#2563eb;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 5px 16px -12px rgba(37,99,235,.42); }
    
    html[data-theme="light"] #launch .lch-srch input { background:rgba(252,251,248,.8); }
    html[data-theme="light"] #chatPane { background:#faf9f6; }
    html[data-theme="light"] #chartPane { border-color:rgba(53,47,36,.12); }
    html[data-theme="light"] { --toolbar-bg:rgba(252,251,248,.92); }
        html[data-theme="light"] .tdiv,
    html[data-theme="light"] .tf-switch { border-color:rgba(53,47,36,.14); }
    html[data-theme="light"] .tf-btn:hover { color:var(--text); background:rgba(37,99,235,.08); }
    html[data-theme="light"] #indPillName { color:var(--text); }
    html[data-theme="light"] .mkt-select:hover { border-color:rgba(53,47,36,.28); }
    html[data-theme="light"] .msg.user { color:var(--text);border-color:var(--line-2); }
    html[data-theme="light"] .msg.question .q-opt { background:rgba(53,47,36,.05); }
    html[data-theme="light"] .msg.question .q-opt:hover:not(:disabled) { background:rgba(53,47,36,.09); }
    html[data-theme="light"] .msg.question .q-rec { color:#1d4ed8;background:rgba(37,99,235,.12); }
    html[data-theme="light"] .msg.question .q-opt.q-chosen { background:rgba(37,99,235,.1); }
    html[data-theme="light"] .hdiv { background:var(--line-2); }
    html[data-theme="light"] .usage-ring::after { background:var(--solid); }
    html[data-theme="light"] .co { background:rgba(53,47,36,.22); }
    html[data-theme="light"] .co-tabs { border-color:var(--line-2); }
    html[data-theme="light"] .co-tab:hover { color:var(--text); }
    html[data-theme="light"] .co-feature-visual,
    html[data-theme="light"] .ccard-thumb { background:linear-gradient(145deg,#25272c,#111216); }
    html[data-theme="light"] .co-detail { background:rgba(250,249,246,.98); }
    html[data-theme="light"] .cmt-t { color:var(--text-2); }
    html[data-theme="light"] .cd-composer { background:rgba(53,47,36,.025); }

    /* Northstar B: the shell owns its own visuals (deep OPAQUE black pane, one border on the right
       edge) — this override carries only what is app-specific: the width variable and the app's
       easing. No translucency, no blur, no shadow: the pane is a surface, not a veil. */




    #launch,.lab,.gate,.paid-wrap { width:calc(100% - var(--tp-shell-w));margin-left:var(--tp-shell-w);transition:width .3s var(--spring),margin-left .3s var(--spring); }
    #launch .lch-space { left:var(--tp-shell-w);transition:left .3s var(--spring); -webkit-mask-image:linear-gradient(180deg,#000 0,#000 26vh,rgba(0,0,0,.22) 48vh,transparent 68vh); mask-image:linear-gradient(180deg,#000 0,#000 26vh,rgba(0,0,0,.22) 48vh,transparent 68vh); }
    #launch .lch-hud,#launch .lch-scan,#launch .lch-ret,#launch .lch-horizon { display:none; }
    #launch .lch-deck { max-width:1240px;padding:0 48px; }
    #launch .lch-main { padding:52px 0 72px; }
    /* ── Northstar B launcher: the deck becomes a page — title row, collection tabs on the one
       rule, a composer that seeds a build, and a quiet 54px table of what is truthfully known
       about each saved indicator. Objects are lit, not outlined. ── */
    .lchb-head { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px; }
    .lchb-h1 { margin:0;font:700 32px/38px var(--font);letter-spacing:-.02em;color:var(--text); }
    .lchb-head .lch-srch { margin:0; }
    .lchb-tabs { display:flex;gap:24px;border-bottom:1px solid var(--line-2); }
    .lchb-tabs button { position:relative;margin-bottom:-1px;padding:0 0 12px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font:500 13px var(--font);cursor:pointer;transition:color .15s ease; }
    .lchb-tabs button:hover { color:var(--text); }
    .lchb-tabs button.on { color:var(--text);font-weight:600; }
    .lchb-support-label { margin-left:auto;padding-bottom:12px;color:var(--ghost);font:600 9px/18px var(--font);letter-spacing:.09em;text-transform:uppercase; }
    .lchb-tabs button.supporting { color:var(--faint);font-size:12px; }
    .lchb-workflow { display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:18px 0 0;padding:0;list-style:none; }
    .lchb-workflow li { position:relative;display:flex;align-items:baseline;gap:6px;min-width:0;color:var(--muted);font:500 10.5px/15px var(--font); }
    .lchb-workflow li:not(:last-child)::after { content:'';height:1px;flex:1;min-width:12px;margin:0 10px;background:var(--line-2); }
    .lchb-workflow b { color:var(--text-2);font-weight:600; }
    .lchb-workflow span { white-space:nowrap;color:var(--faint); }
    .lchb-composer { display:flex;align-items:center;gap:14px;height:52px;margin-top:24px;padding:0 8px 0 18px;border-radius:10px;background:rgba(16,16,19,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px); }
    .lchb-composer > svg { width:18px;height:18px;flex:none;color:rgb(var(--accent-hi)); }
    .lchb-composer input { flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--text);font:14.5px var(--font);outline:none; }
    .lchb-composer input::placeholder { color:var(--faint); }
    .lchb-composer button { flex:none;height:36px;padding:0 16px;border:0;border-radius:8px;background:rgb(var(--accent));color:#fff;font:600 13px var(--font);cursor:pointer;transition:filter .15s; }
    .lchb-composer button:hover { filter:brightness(1.08); }
    #labContinueConversation { min-height:44px;max-width:100%;margin-top:12px;white-space:normal; }
    .lchb-thead { display:grid;grid-template-columns:minmax(240px,1fr) 110px 130px 110px 88px;gap:16px;align-items:center;padding:26px 12px 6px;color:var(--faint);font-size:11.5px;font-weight:500; }
    .lchb-thead .ta-r { text-align:right; }
    .lchb-row { display:grid;grid-template-columns:minmax(240px,1fr) 110px 130px 110px 88px;gap:16px;align-items:center;min-height:54px;padding:0 12px;border-radius:8px;transition:background .12s ease; }
    .lchb-row:hover { background:rgba(255,255,255,.035); }
    .lchb-open { min-width:0;display:flex;align-items:center;padding:0;border:0;background:transparent;text-align:left;cursor:pointer; }
    .lchb-name { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 13.5px var(--font);color:var(--text); }
    .lchb-cell { font:500 13px var(--font);color:var(--sec);font-variant-numeric:tabular-nums; }
    .lchb-cell.ta-r { text-align:right; }
    .lchb-acts { display:flex;justify-content:flex-end;gap:2px;opacity:0;transition:opacity .12s ease; }
    .lchb-row:hover .lchb-acts, .lchb-acts:focus-within { opacity:1; }
    .lchb-insight { margin-top:32px;display:grid;grid-template-columns:1fr auto;gap:4px 24px;align-items:start; }
    .lchb-insight b { font:600 15px var(--font);color:var(--text); }
    .lchb-insight p { grid-column:1;margin:0;max-width:640px;font:13px/20px var(--font);color:var(--muted); }
    .lchb-insight button { grid-column:2;grid-row:1;padding:0;border:0;background:transparent;color:rgb(var(--accent-hi));font:600 13px var(--font);cursor:pointer; }
    .lchb-insight button:hover { text-decoration:underline; }
    html[data-theme="light"] .lchb-composer { background:rgba(252,251,248,.72); }
    html[data-theme="light"] .lchb-row:hover { background:rgba(45,37,24,.045); }
    html[data-theme="light"] .authoring-flow { background:color-mix(in srgb,var(--pane) 97%,transparent); }
    html[data-theme="light"] .authoring-stages span,html[data-theme="light"] .authoring-stages i { background:var(--pane); }

    @media (max-width:680px) {
      .lchb-support-label { display:none; }
      .lchb-tabs { gap:18px;overflow-x:auto; }
      .lchb-tabs button.supporting:first-of-type { margin-left:auto; }
      .lchb-workflow { overflow-x:auto;grid-template-columns:repeat(5,minmax(112px,1fr)); }
    }

    /* ── Partnered indicators — a quiet product shelf inside the Lab shell. The module is lazy;
       the CSS stays with the shared visual contract so light/dark paint correctly before it mounts. ── */
    .sr-only { position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important; }
    .partner-shelf { width:100%;color:var(--text); }
    .partner-shelf-loading,.partner-shelf-error { min-height:260px;display:grid;place-content:center;gap:6px;text-align:center;color:var(--muted);font:14px var(--font); }
    .partner-shelf-error strong { color:var(--text);font-size:16px; }
    .partner-shelf-head { display:flex;align-items:center;justify-content:space-between;gap:28px;padding-bottom:18px;border-bottom:1px solid var(--line-2);background:transparent; }
    .partner-shelf-head h1 { margin:0;color:var(--text);font:700 32px/38px var(--font);letter-spacing:-.025em;outline:none; }
    .partner-shelf-tools { display:flex;align-items:center;gap:8px; }
    .partner-shelf-sort select,.partner-shelf-search { height:38px;border:1px solid var(--line);border-radius:9px;background:color-mix(in srgb,var(--solid) 88%,transparent);color:var(--sec);box-shadow:0 9px 25px -24px rgba(0,0,0,.45); }
    .partner-shelf-sort select { min-width:158px;padding:0 34px 0 12px;font:600 12px var(--font);color-scheme:dark;cursor:pointer; }
    .partner-shelf-search { display:flex;align-items:center;gap:7px;padding:0 11px; }
    .partner-shelf-search svg { width:14px;height:14px;flex:none;color:var(--faint); }
    .partner-shelf-search input { width:92px;border:0;background:transparent;color:var(--text);font:13px var(--font);outline:none; }
    .partner-shelf-search input::placeholder { color:var(--faint); }
    .partner-shelf-sort select:focus-visible,.partner-shelf-search:focus-within { outline:2px solid rgb(var(--accent));outline-offset:2px;border-color:transparent; }
    .partner-shelf-results { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0); }

    .partner-featured { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:28px;margin-top:30px; }
    .partner-featured-body { align-self:center;min-width:0;padding:10px 0; }
    .partner-featured-eyebrow { display:flex;align-items:center;gap:10px;margin-bottom:13px; }
    .partner-featured-eyebrow span { min-height:23px;display:inline-flex;align-items:center;padding:0 8px;border-radius:999px;background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok-text);font:650 10px var(--font); }
    .partner-featured-eyebrow small { color:var(--faint);font:500 10.5px var(--mono); }
    .partner-featured-title { display:block;width:max-content;max-width:100%;color:var(--text)!important;text-decoration:none;font:700 25px/31px var(--font);letter-spacing:-.025em; }
    .partner-featured-title:hover,.partner-card-title:hover { color:rgb(var(--accent-hi))!important;text-decoration:underline;text-underline-offset:4px; }
    .partner-featured-title:focus-visible,.partner-card-title:focus-visible,.partner-action:focus-visible,.partner-shelf-reveal:focus-visible { outline:2px solid rgb(var(--accent));outline-offset:3px;border-radius:4px; }
    .partner-featured-creator { margin:3px 0 0;color:var(--faint);font:500 11.5px var(--font); }
    .partner-featured-description { margin:20px 0 18px;color:var(--sec);font:14px/21px var(--font); }
    .partner-featured-access { min-height:40px;display:flex;align-items:center;gap:9px;padding:0 12px;margin-bottom:11px;border-radius:8px;background:var(--surface);color:var(--sec);font:500 11.5px var(--font); }
    .partner-featured-access i { width:6px;height:6px;flex:none;border-radius:50%;background:var(--ok);box-shadow:0 0 12px color-mix(in srgb,var(--ok) 60%,transparent); }
    .partner-featured-body>small,.partner-card-body>small { display:block;margin-top:9px;color:var(--faint);font:500 10.5px/16px var(--font); }

    .partner-product-art { --partner-ink:#8aa8ff;position:relative;isolation:isolate;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:linear-gradient(145deg,#090a0d 4%,#111522 58%,#07080b);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 26px 56px -40px rgba(0,0,0,.78); }
    .partner-product-art::before,.partner-product-art::after { content:'';position:absolute;z-index:0; }
    .partner-product-art::before { inset:12% 8% 10% 42%;opacity:.5;background:repeating-linear-gradient(90deg,transparent 0 24px,rgba(255,255,255,.17) 25px 27px,transparent 28px 41px),linear-gradient(116deg,transparent 0 36%,var(--partner-ink) 37% 39%,transparent 40% 51%,color-mix(in srgb,var(--partner-ink) 72%,white) 52% 54%,transparent 55%);clip-path:polygon(0 82%,8% 58%,16% 69%,27% 36%,36% 50%,48% 22%,58% 43%,67% 16%,78% 31%,88% 4%,100% 17%,100% 100%,0 100%); }
    .partner-product-art::after { width:180px;height:180px;right:-60px;top:-72px;border-radius:50%;background:var(--partner-ink);filter:blur(70px);opacity:.23; }
    .partner-product-art-featured { min-height:272px;border-radius:14px; }
    .partner-product-hero { position:absolute;inset:0;z-index:4;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.012);transition:opacity .24s ease,transform .45s cubic-bezier(.2,.8,.2,1); }
    .partner-product-art-loaded .partner-product-hero { opacity:1;transform:none; }
    .partner-product-art-loaded::before,.partner-product-art-loaded::after,
    .partner-product-art-loaded .partner-art-grid,.partner-product-art-loaded .partner-art-trace,
    .partner-product-art-loaded .partner-art-glow,.partner-product-art-loaded .partner-art-lockup { opacity:0; }
    .partner-product-art[data-partner-id="ifvg-ultimate"] .partner-product-hero { object-fit:cover;background:#03060c; }
    .partner-art-grid { position:absolute;inset:0;z-index:-1;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(110deg,transparent 2%,#000 56%,transparent 98%); }
    .partner-art-trace { position:absolute;left:8%;right:8%;bottom:22%;height:1px;background:linear-gradient(90deg,transparent,var(--partner-ink),transparent);box-shadow:0 0 18px var(--partner-ink);opacity:.62; }
    .partner-art-trace::before,.partner-art-trace::after { content:'';position:absolute;width:7px;height:42px;bottom:-8px;border:1px solid var(--partner-ink);background:color-mix(in srgb,var(--partner-ink) 18%,transparent);box-shadow:44px -34px 0 -1px color-mix(in srgb,var(--partner-ink) 52%,transparent),86px -12px 0 -1px color-mix(in srgb,var(--partner-ink) 52%,transparent); }
    .partner-art-trace::before { right:15%; }.partner-art-trace::after { right:48%;transform:scale(.72);opacity:.55; }
    .partner-art-glow { position:absolute;inset:auto 14% -38% 14%;height:60%;border-radius:50%;background:var(--partner-ink);filter:blur(72px);opacity:.12; }
    .partner-art-lockup { position:absolute;z-index:2;left:8%;top:12%;right:8%;display:flex;align-items:center;gap:14px; }
    .partner-shelf-logo { width:48px;height:48px;flex:none;display:grid;place-items:center;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:rgba(4,5,8,.48);box-shadow:inset 0 1px rgba(255,255,255,.06); }
    .partner-shelf-logo img { grid-area:1/1;width:38px;height:38px;object-fit:contain; }
    .partner-logo-light { display:none; }
    .partner-shelf-logo-text { color:#f5f7ff;font:750 13px var(--mono);letter-spacing:.07em; }
    .partner-art-copy { min-width:0;display:flex;flex-direction:column;gap:3px;color:#fff; }
    .partner-art-copy strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:750 clamp(18px,2.2vw,28px)/1 var(--font);letter-spacing:-.035em;text-shadow:0 4px 24px #000; }
    .partner-art-copy>span { color:rgba(226,232,248,.65);font:600 8.5px var(--mono);letter-spacing:.16em;text-transform:uppercase; }
    .partner-art-model-2022 { --partner-ink:#b6d7c4;background:linear-gradient(140deg,#060807,#101411 56%,#050605); }
    .partner-art-trls { --partner-ink:#93ebff;background:linear-gradient(140deg,#05080a,#0b1720 58%,#050607); }
    .partner-art-orb { --partner-ink:#8c9cff;background:linear-gradient(140deg,#070812,#10142a 58%,#06070c); }
    .partner-art-quadz { --partner-ink:#ff6868;background:linear-gradient(140deg,#0c0708,#241012 58%,#070506); }
    .partner-art-r8 { --partner-ink:#9c8cff;background:linear-gradient(140deg,#08070d,#191329 58%,#060509); }
    .partner-art-golden-pocket { --partner-ink:#eabf6d;background:linear-gradient(140deg,#0d0a05,#231a0d 58%,#080604); }
    .partner-art-lotion { --partner-ink:#6ee7a0;background:linear-gradient(140deg,#050a08,#0b2017 58%,#040705); }
    .partner-art-ifvg { --partner-ink:#f2a53b;background:linear-gradient(140deg,#0b0805,#24190a 58%,#070503); }
    .partner-art-flow-state { --partner-ink:#74d9c2;background:linear-gradient(140deg,#050a09,#0a201b 58%,#040706); }

    .partner-shelf-section-title { display:flex;align-items:center;justify-content:space-between;gap:18px;margin:34px 0 16px;padding-bottom:14px;border-bottom:1px solid var(--line-2); }
    .partner-shelf-section-title h2 { margin:0;color:var(--text);font:700 20px/26px var(--font);letter-spacing:-.018em; }
    .partner-shelf-section-title span { color:var(--faint);font:500 10.5px var(--mono); }
    .partner-card-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px; }
    .partner-card { min-width:0; }
    .partner-card-body { padding-top:11px; }
    .partner-card-titleline { display:flex;align-items:baseline;gap:8px;min-width:0; }
    .partner-card-title { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)!important;text-decoration:none;font:700 14px/20px var(--font); }
    .partner-card-titleline>span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--faint);font:500 10.5px var(--font); }
    .partner-card-titleline>.partner-card-price { flex:none;margin-left:auto;color:var(--sec);font:650 10.5px var(--mono);font-variant-numeric:tabular-nums; }
    .partner-card-body>p { min-height:38px;margin:6px 0 12px;color:var(--muted);font:12px/18px var(--font); }
    .partner-card-actions { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px; }
    .partner-action { min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;border-radius:8px;text-decoration:none!important;font:650 11.5px var(--font);transition:transform .16s ease,filter .16s ease,background .16s ease,border-color .16s ease; }
    .partner-action:hover { transform:translateY(-1px); }
    .partner-action-primary { background:rgb(var(--accent));color:#fff!important;box-shadow:0 7px 18px -13px rgba(37,99,235,.7); }
    .partner-action-primary:hover { filter:brightness(1.08); }
    .partner-action-secondary { border:1px solid var(--line);background:var(--surface);color:var(--sec)!important; }
    .partner-action-secondary:hover { border-color:var(--line-2);background:var(--surface-2);color:var(--text)!important; }
    .partner-shelf-empty { grid-column:1/-1;min-height:190px;display:grid;place-content:center;gap:5px;text-align:center;color:var(--muted);font:13px var(--font); }
    .partner-shelf-empty strong { color:var(--text);font-size:15px; }
    .partner-shelf-note { display:flex;align-items:flex-start;gap:12px;margin-top:44px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted); }
    .partner-shelf-note>span { color:rgb(var(--accent));font-size:13px; }
    .partner-shelf-note p { margin:0;font:12px/18px var(--font); }

    html[data-theme="light"] .partner-shelf-sort select { color-scheme:light; }
    /* Product art is deliberately a dark, lit object in both app themes; keep the high-contrast
       partner mark in that object instead of swapping to the dark-ink mark used on light chrome. */
    html[data-theme="light"] .partner-product-art .partner-logo-dark { display:block; }
    html[data-theme="light"] .partner-product-art .partner-logo-light { display:none; }
    html[data-theme="light"] .partner-product-art { box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 26px 52px -38px rgba(45,37,24,.38); }

    @media (prefers-reduced-motion:reduce) {
      .partner-product-hero { transition:none; }
    }

    @media (max-width:920px) {
      .partner-featured { grid-template-columns:1fr;gap:18px; }
      .partner-featured-body { padding:0; }
      .partner-product-art-featured { min-height:230px; }
    }
    @media (max-width:680px) {
      .partner-shelf-head { align-items:flex-start;flex-direction:column;gap:16px; }
      .partner-shelf-head h1 { font-size:27px;line-height:33px; }
      .partner-shelf-tools { width:100%; }
      .partner-shelf-sort { flex:none; }
      .partner-shelf-sort select { min-width:150px; }
      .partner-shelf-search { flex:1; }
      .partner-shelf-search input { width:100%;font-size:16px; }
      .partner-card-grid { grid-template-columns:1fr;gap:26px; }
      .partner-card-body>p { min-height:0; }
    }
    @media (max-width:420px) {
      .partner-shelf-tools { align-items:stretch;flex-direction:column; }
      .partner-shelf-sort select,.partner-shelf-search { width:100%;box-sizing:border-box; }
      .partner-featured { margin-top:22px; }
      .partner-product-art-featured { min-height:190px; }
      .partner-art-lockup { left:6%;right:6%; }
      .partner-shelf-logo { width:42px;height:42px; }
      .partner-shelf-logo img { width:34px;height:34px; }
      .partner-card-actions { grid-template-columns:1fr; }
    }

    /* ── Taking Prophets publications — public TradingView work, inside our own shell. ── */
    .house-publications { width:100%;color:var(--text); }
    .house-publications-loading,.house-publications-error { min-height:260px;display:grid;place-content:center;gap:6px;text-align:center;color:var(--muted);font:14px var(--font); }
    .house-publications-error strong { color:var(--text);font-size:16px; }
    .house-profile { display:flex;align-items:center;justify-content:space-between;gap:32px;padding:2px 0 28px;border-bottom:1px solid var(--line-2);background:transparent; }
    .house-profile-identity { min-width:0;display:flex;align-items:center;gap:18px; }
    .house-profile-mark { width:68px;height:68px;flex:none;display:grid;place-items:center;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:0 20px 44px -34px rgba(0,0,0,.7); }
    .house-profile-mark img { grid-area:1/1;width:40px;height:40px;object-fit:contain; }
    .house-profile-copy { min-width:0; }
    .house-profile-copy>span { display:block;margin-bottom:3px;color:rgb(var(--accent-hi));font:650 10px/15px var(--font);letter-spacing:.08em;text-transform:uppercase; }
    .house-profile-copy h1 { margin:0;color:var(--text);font:700 30px/36px var(--font);letter-spacing:-.026em;outline:none; }
    .house-profile-copy p { max-width:610px;margin:6px 0 0;color:var(--muted);font:13px/20px var(--font); }
    .house-profile-aside { flex:none;display:flex;align-items:flex-end;flex-direction:column;gap:12px; }
    .house-profile-stats { display:flex;gap:22px;margin:0; }
    .house-profile-stats>div { display:flex;align-items:flex-end;flex-direction:column; }
    .house-profile-stats dd { margin:0;color:var(--text);font:650 17px/20px var(--mono);font-variant-numeric:tabular-nums; }
    .house-profile-stats dt { color:var(--faint);font:500 9.5px/15px var(--font); }
    .house-profile-link { color:var(--sec)!important;text-decoration:none;font:600 11.5px/18px var(--font); }
    .house-profile-link:hover { color:rgb(var(--accent-hi))!important;text-decoration:underline;text-underline-offset:4px; }

    .house-publication-controls { margin:25px 0 8px; }
    .house-publication-tools { display:flex;align-items:center;gap:8px; }
    .house-publication-search,.house-publication-tools select { height:40px;box-sizing:border-box;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--text);box-shadow:0 10px 25px -25px rgba(0,0,0,.5); }
    .house-publication-search { flex:1;min-width:0;padding:0 13px;font:13px var(--font);outline:none; }
    .house-publication-search::placeholder { color:var(--faint); }
    .house-publication-tools select { width:154px;padding:0 34px 0 12px;color:var(--sec);font:600 12px var(--font);color-scheme:dark;cursor:pointer; }
    .house-publication-search:focus-visible,.house-publication-tools select:focus-visible { outline:2px solid rgb(var(--accent));outline-offset:2px;border-color:transparent; }
    .house-category-strip { display:flex;gap:6px;margin-top:10px;padding:1px 0 8px;overflow-x:auto;scrollbar-width:thin; }
    .house-category-strip button { flex:none;min-height:32px;padding:0 11px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);font:600 11px var(--font);cursor:pointer; }
    .house-category-strip button:hover { background:var(--surface);color:var(--text); }
    .house-category-strip button.is-active { border-color:var(--line);background:var(--surface-2);color:var(--text); }
    .house-category-strip button:focus-visible { outline:2px solid rgb(var(--accent));outline-offset:1px; }
    .house-publication-count { margin:0 0 14px;color:var(--faint);font:500 10.5px/16px var(--mono); }

    .house-publication-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 18px; }
    .house-publication-card { min-width:0; }
    .house-publication-thumb { position:relative;display:block;isolation:isolate;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:linear-gradient(145deg,#090a0d,#121621);box-shadow:0 24px 50px -40px rgba(0,0,0,.7); }
    .house-publication-thumb::after { content:'View publication ↗';position:absolute;z-index:3;right:10px;bottom:10px;padding:6px 8px;border:1px solid rgba(255,255,255,.13);border-radius:7px;background:rgba(5,6,9,.76);color:#fff;font:600 9.5px var(--font);opacity:0;transform:translateY(3px);transition:opacity .16s ease,transform .16s ease; }
    .house-publication-thumb:hover::after,.house-publication-thumb:focus-visible::after { opacity:1;transform:none; }
    .house-publication-thumb:focus-visible { outline:2px solid rgb(var(--accent));outline-offset:3px; }
    .house-publication-thumb img { position:absolute;z-index:2;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .2s ease,transform .35s ease; }
    .house-publication-thumb.is-loaded img { opacity:1; }
    .house-publication-thumb:hover img { transform:scale(1.012); }
    .house-publication-fallback { position:absolute;z-index:1;inset:0;display:grid;place-items:end start;padding:20px;color:#fff;font:700 22px/27px var(--font);letter-spacing:-.025em;background:radial-gradient(circle at 75% 15%,rgba(233,178,76,.19),transparent 38%),linear-gradient(145deg,#0b0c10,#151821); }
    .house-publication-body { padding-top:12px; }
    .house-publication-badges { display:flex;align-items:center;gap:6px;margin-bottom:7px; }
    .house-publication-badges span { min-height:21px;display:inline-flex;align-items:center;padding:0 7px;border-radius:6px;background:var(--surface);color:var(--muted);font:600 9.5px var(--font); }
    .house-publication-badges span[data-access="open"] { color:var(--ok-text);background:color-mix(in srgb,var(--ok) 12%,transparent); }
    .house-publication-title { display:block;width:max-content;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)!important;text-decoration:none;font:700 15px/21px var(--font); }
    .house-publication-title:hover { color:rgb(var(--accent-hi))!important;text-decoration:underline;text-underline-offset:4px; }
    .house-publication-title:focus-visible,.house-action:focus-visible,.house-profile-link:focus-visible { outline:2px solid rgb(var(--accent));outline-offset:3px;border-radius:4px; }
    .house-publication-body>p { min-height:36px;margin:5px 0 9px;color:var(--muted);font:12px/18px var(--font); }
    .house-publication-meta { display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--faint);font:500 10px/16px var(--font); }
    .house-publication-meta span:last-child { flex:none;font-family:var(--mono);font-variant-numeric:tabular-nums; }
    .house-publication-actions { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:12px; }
    .house-action { min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;border-radius:8px;text-decoration:none!important;font:650 11.5px var(--font);transition:transform .16s ease,filter .16s ease,background .16s ease; }
    .house-action:hover { transform:translateY(-1px); }
    .house-action-primary { background:rgb(var(--accent));color:#fff!important; }
    .house-action-primary:hover { filter:brightness(1.08); }
    .house-action-secondary { border:1px solid var(--line);background:var(--surface);color:var(--sec)!important; }
    .house-action-secondary:hover { background:var(--surface-2);color:var(--text)!important; }
    .house-publication-actions>.house-action-secondary:only-child { grid-column:1/-1; }
    .house-publication-empty { grid-column:1/-1;min-height:220px;display:grid;place-content:center;gap:5px;text-align:center;color:var(--muted);font:13px var(--font); }
    .house-publication-empty strong { color:var(--text);font-size:15px; }
    html[data-theme="light"] .house-publication-tools select { color-scheme:light; }
    html[data-theme="light"] .house-profile-mark { box-shadow:0 20px 40px -34px rgba(45,37,24,.45); }
    @media (prefers-reduced-motion:reduce) { .house-publication-thumb img,.house-publication-thumb::after,.house-action { transition:none; } }
    @media (max-width:820px) {
      .house-profile { align-items:flex-start;flex-direction:column;gap:20px; }
      .house-profile-aside { width:100%;align-items:flex-start; }
      .house-profile-stats { justify-content:space-between;width:100%;max-width:380px; }
      .house-profile-stats>div { align-items:flex-start; }
    }
    @media (max-width:680px) {
      .house-profile-mark { width:58px;height:58px;border-radius:15px; }.house-profile-mark img { width:34px;height:34px; }
      .house-profile-copy h1 { font-size:27px;line-height:33px; }
      .house-publication-grid { grid-template-columns:1fr;gap:27px; }
      .house-publication-body>p { min-height:0; }
    }
    @media (max-width:420px) {
      .house-profile-identity { align-items:flex-start;gap:13px; }
      .house-profile-mark { width:48px;height:48px;border-radius:13px; }.house-profile-mark img { width:28px;height:28px; }
      .house-profile-copy h1 { font-size:24px;line-height:29px; }
      .house-profile-stats { gap:12px; }
      .house-publication-tools { align-items:stretch;flex-direction:column; }
      .house-publication-tools select { width:100%; }
      .house-publication-search { flex:none;width:100%;font-size:16px; }
      .house-publication-actions { grid-template-columns:1fr; }.house-publication-actions .house-action { grid-column:1; }
    }

    .lab > header { padding-left:18px; }
    .lab-deck-back { min-width:132px;height:34px;padding:0 10px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--sec);font:600 12px var(--font); }
    .lab-deck-back svg { transform:rotate(180deg); }
    .lab-deck-back:hover { color:var(--text);background:var(--surface-2); }

    @media (max-width:760px) {
      html { --tp-shell-w:0px; }








      #launch,.lab,.gate { width:100%;height:calc(100% - 60px);margin:60px 0 0; }
      .paid-wrap { width:100%;margin-left:0;top:60px; }
      #launch .lch-space { left:0;top:60px; }
      #launch .lch-deck { padding:0 18px; }
      #launch .lch-main { justify-content:flex-start;padding:34px 0 48px;overflow:visible; }
      #launch .lch-panels { margin:24px 0; }
      .lab-deck-back { min-width:34px;width:34px;padding:0;justify-content:center; }
      .lab-deck-back span { display:none; }
    }
:is(.pine-table-tooltip, .pine-label-tooltip) {
  position: absolute;
  pointer-events: none;
  max-width: 320px;
  padding: 8px 10px;
  border: 1px solid rgba(120, 123, 134, .62);
  border-radius: 5px;
  background: rgba(19, 23, 34, .97);
  color: #f0f3fa;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .38);
  font: 500 11px/1.45 -apple-system, BlinkMacSystemFont, "Trebuchet MS", Roboto, Ubuntu, sans-serif;
  font-variant-numeric: tabular-nums;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.pine-label-tooltip { z-index: 8; }

/* Chart screenshot intake: transient composer media, never stored in the conversation. */
.composer .composer-attach, .composer .attachment-remove { flex: none; width: 44px; min-width: 44px; height: 44px; padding: 0; color: var(--text-2); background: transparent; }
.composer-attach:focus-visible, .attachment-remove:focus-visible { outline: 2px solid rgb(var(--accent)); outline-offset: 2px; }
.composer-attach:active, .attachment-remove:active { transform: scale(.97); }
.composer-attachment { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 10px; background: var(--solid); min-width: 0; }
.composer-attachment[hidden], .composer-attach[hidden] { display: none; }
.composer-attachment img { width: 48px; height: 48px; object-fit: cover; border-radius: 6px; flex: none; }
.attachment-caption { min-width: 0; flex: 1; display: grid; gap: 3px; }
.attachment-caption strong { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; color: var(--text); font-weight: 550; }
.attachment-caption > span, .attachment-status { font-size: 11px; line-height: 1.5; color: var(--text-2); overflow-wrap: anywhere; }
.attachment-status:empty { display: none; }
.attachment-remove { font-size: 23px; }
.composer.dropping .composer-field { outline: 2px solid rgb(var(--accent)); outline-offset: 2px; }
.composer-field:has(.composer-attach:not([hidden])) #prompt { min-width: 0; }
.msg-attach { display: block; width: 120px; max-width: 100%; height: 80px; object-fit: contain; border-radius: 8px; margin-top: 8px; }
html[data-theme="light"] .composer-attachment { background: #f0f2f5; }
html[data-theme="light"] .composer-attach, html[data-theme="light"] .attachment-remove { color: #475569; }
html[data-theme="light"] .attachment-caption strong { color: #172033; }
html[data-theme="light"] .attachment-caption > span, html[data-theme="light"] .attachment-status { color: #475569; }
@media (hover: hover) and (pointer: fine) { .composer-attach:hover, .attachment-remove:hover { background: var(--tp-surface-hover); color: var(--text); } }
@media (prefers-reduced-motion: reduce) { .composer-attach:active, .attachment-remove:active { transform: none; } }

/* Script identity controls share the Lab palette; native radios retain keyboard behavior. */
.build-mode { display:flex; gap:4px; width:fit-content; max-width:100%; padding:3px; margin:10px 0; border:1px solid #343c49; border-radius:10px; background:#181d25; }
.build-mode label { position:relative; cursor:pointer; min-width:0; }
.build-mode input { position:absolute; opacity:0; width:1px; height:1px; }
.build-mode span { display:flex; align-items:center; justify-content:center; min-height:44px; padding:0 18px; border-radius:7px; color:#b6bfcd; font-size:13px; }
.build-mode input:checked + span { background:#303b4d; color:#f4f6fa; }
.build-mode input:focus-visible + span { outline:2px solid #a5bfff; outline-offset:2px; }
.build-mode input:disabled + span { opacity:.5; cursor:wait; }
.build-mode-notice { display:flex; align-items:center; gap:12px; padding:8px 12px; color:var(--text); font-size:13px; }
.build-mode-notice span { overflow-wrap:anywhere; }
.script-kind-filters { display:flex; flex-wrap:wrap; gap:6px; padding:8px 0; }
.script-kind-filters button { min-height:44px; padding:0 12px; border:1px solid #343c49; border-radius:8px; background:transparent; color:#b6bfcd; cursor:pointer; }
.script-kind-filters button[aria-pressed="true"] { background:#303b4d; color:#f4f6fa; }
.script-kind-filters button:focus-visible { outline:2px solid #a5bfff; outline-offset:2px; }
.script-kind-badge { display:block; color:#adc5f5; font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; line-height:1.6; }
.lchb-open:has(.script-kind-badge) { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; min-width:0; }
html[data-theme="light"] .build-mode { background:#f0f2f5; border-color:#ccd3df; }
html[data-theme="light"] .build-mode span, html[data-theme="light"] .script-kind-filters button { color:#475569; border-color:#ccd3df; }
html[data-theme="light"] .build-mode input:checked + span, html[data-theme="light"] .script-kind-filters button[aria-pressed="true"] { background:#dbe6f6; color:#16365f; }
html[data-theme="light"] .script-kind-badge { color:#355b8c; }
html[data-theme="light"] .build-mode input:focus-visible + span, html[data-theme="light"] .script-kind-filters button:focus-visible { outline-color:#315f9a; }
.build-mode-notice[hidden], .script-kind-filters[hidden], .authoring-backtest[hidden], .lib-actions button[hidden], .lch-rmore[hidden] { display:none; }
@media(max-width:600px) { .build-mode span { padding:0 14px; } .build-mode-notice { align-items:flex-start; } .script-kind-filters { gap:4px; } }

#chatPane > .build-mode { margin-left:14px; margin-right:14px; }

.library-panel > .script-kind-filters { padding:8px 18px; }

/* Pine intake keeps code distinct from the member's change request. */
.private-import-sheet .private-import-source{min-height:200px;white-space:pre;overflow:auto;tab-size:4}
.private-import-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.private-import-tools small{color:var(--muted)}
.private-import-sheet input,.private-import-sheet textarea{box-sizing:border-box;min-width:0;width:100%}
.private-import-sheet [readonly]{opacity:.75}
.private-import-result{overflow-wrap:anywhere}
.pine-start-button{align-self:flex-start;font-size:12px;min-height:32px}
html[data-theme="light"] .private-import-dialog{background:#fff;color:#18202d;border-color:#ccd3df}
html[data-theme="light"] .private-import-sheet .tp-field{background:#f7f9fc;color:#18202d;border-color:#c3cddb}
.private-import-sheet :focus-visible,.private-import-file:focus-within,.pine-start-button:focus-visible{outline:2px solid rgb(var(--accent));outline-offset:3px}
@media(max-width:560px){.private-import-sheet{padding:16px;gap:12px}.private-import-sheet .private-import-source{min-height:150px}.private-import-sheet footer{flex-wrap:wrap}.private-import-sheet .tp-button{min-height:40px}}

/* Guided tour (tours.ts / tours-lab.ts): the driver.js card in the Lab's palette. Tokens sit on :root, so the
   card, which driver.js mounts on <body>, inherits them and follows the light theme's overrides. */
:root {
  --tp-tour-surface: var(--bg-2);
  --tp-tour-line: var(--line-2);
  --tp-tour-ink: var(--text);
  --tp-tour-muted: var(--text-2);
  --tp-tour-accent: rgb(var(--accent));
  --tp-tour-accent-ink: var(--accent-ink);
}
.lchb-tour { all: unset; cursor: pointer; align-self: flex-start; margin-top: 10px; font: 500 12px/1 inherit; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.lchb-tour:hover { color: var(--text); }
.lchb-tour:focus-visible { outline: 2px solid rgb(var(--accent)); outline-offset: 2px; border-radius: 4px; }

/* Taking Prophets shared product language.
   Both Lab builds append this file after their app stylesheet. Product surfaces
   opt in with tp-* primitives; contextual chart chrome can remain app-specific. */
:root {
  --tp-space-0: 2px;
  --tp-space-1: 4px;
  --tp-space-2: 8px;
  --tp-space-3: 12px;
  --tp-space-4: 16px;
  --tp-space-5: 24px;
  --tp-space-6: 32px;
  --tp-control-compact: 30px;
  --tp-control: 36px;
  --tp-control-roomy: 44px;
  --tp-touch-target: 44px;
  --tp-radius-xs: 6px;
  --tp-radius-sm: 10px;
  --tp-radius: 14px;
  --tp-radius-lg: 18px;
  --tp-radius-pill: 999px;
  --tp-font-ui: var(--font, "Switzer", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  --tp-font-data: var(--mono, ui-monospace, "SF Mono", Menlo, monospace);
  --tp-text: var(--text, #e7eaee);
  --tp-text-secondary: var(--sec, #9aa1aa);
  --tp-text-muted: var(--muted, #6a7078);
  --tp-text-faint: var(--faint, #474d55);
  --tp-surface: var(--surface, rgba(255, 255, 255, .045));
  --tp-surface-hover: var(--surface-hi, var(--surface-2, rgba(255, 255, 255, .08)));
  --tp-panel: var(--card-solid, var(--solid, #141417));
  --tp-field-bg: var(--bg-2, var(--solid, #141417));
  --tp-border: var(--line, rgba(255, 255, 255, .08));
  --tp-border-strong: var(--line-strong, var(--line-2, rgba(255, 255, 255, .14)));
  --tp-focus: var(--focus, rgba(37, 99, 235, .7));
  --tp-success: var(--up, var(--ok, #35c77c));
  --tp-danger: var(--down, var(--danger, #f0544a));
  /* One accent across the platform — the same #2563eb the Backtester, the Lab and the website
     all resolve to. This file is appended after both app stylesheets, so a gold value here
     re-painted product surfaces gold no matter what the app tokens said. */
  --tp-accent: #2563eb;
  --tp-accent-hi: #3b82f6;
  --tp-accent-ink: #ffffff;
  --tp-warn: #eab63c;   /* caution only */
  --tp-shadow-pop: var(--shadow-pop, var(--sh-card, 0 12px 32px rgba(0, 0, 0, .45)));
  --tp-shadow-modal: var(--shadow-modal, var(--sh-modal, 0 24px 64px rgba(0, 0, 0, .6)));
  --tp-ease: var(--ease, cubic-bezier(.4, 0, .2, 1));
  --tp-spring: var(--spring, cubic-bezier(.2, .8, .3, 1));
}

/* Buttons */
.tp-button {
  min-height: var(--tp-control);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--tp-space-2);
  padding: 0 var(--tp-space-3);
  border: 1px solid transparent;
  border-radius: var(--tp-radius-sm);
  font: 600 12.5px/1 var(--tp-font-ui);
  letter-spacing: -.005em;
  white-space: nowrap;
  transition:
    color .14s var(--tp-ease),
    background .14s var(--tp-ease),
    border-color .14s var(--tp-ease),
    box-shadow .14s var(--tp-ease),
    transform .08s var(--tp-ease);
}
.tp-button:hover:not(:disabled) { transform: translateY(-1px); }
.tp-button:active:not(:disabled) { transform: translateY(0) scale(.985); }
.tp-button:disabled, .tp-button[aria-disabled="true"] {
  opacity: .42;
  cursor: default;
  box-shadow: none;
  transform: none;
}
.tp-button-primary {
  color: var(--tp-accent-ink);
  background: linear-gradient(180deg, var(--tp-accent-hi), var(--tp-accent));
  /* Derived from the accent, not restated as a literal — this border and glow were a hardcoded
     brass sitting on a blue gradient, i.e. the gold outline on every primary button on the
     platform. A literal here is how it drifted from the token in the first place. */
  border-color: color-mix(in srgb, var(--tp-accent) 38%, transparent);
  box-shadow: 0 7px 18px -10px color-mix(in srgb, var(--tp-accent) 65%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, .26);
}
.tp-button-primary:hover:not(:disabled) { filter: brightness(1.04); }
.tp-button-secondary {
  color: var(--tp-text);
  background: var(--tp-surface);
  border-color: var(--tp-border-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}
.tp-button-secondary:hover:not(:disabled) { background: var(--tp-surface-hover); }
.tp-button-quiet {
  color: var(--tp-text-secondary);
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
.tp-button-quiet:hover:not(:disabled) {
  color: var(--tp-text);
  background: var(--tp-surface);
}
.tp-button-danger { color: var(--tp-danger); }
.tp-button-icon {
  width: var(--tp-control);
  min-width: var(--tp-control);
  padding: 0;
}

/* Fields and selects */
.tp-field,
.tp-select {
  width: 100%;
  min-width: 0;
  min-height: var(--tp-control);
  padding: 7px 10px;
  color: var(--tp-text);
  background-color: var(--tp-field-bg);
  border: 1px solid var(--tp-border);
  border-radius: var(--tp-radius-sm);
  font: 500 12.5px/1.4 var(--tp-font-ui);
  transition: border-color .14s var(--tp-ease), box-shadow .14s var(--tp-ease), background .14s var(--tp-ease);
}
.tp-field:hover,
.tp-select:hover { border-color: var(--tp-border-strong); }
.tp-field:focus,
.tp-select:focus {
  border-color: var(--tp-focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tp-focus) 16%, transparent);
  outline: none;
}
.tp-field::placeholder { color: var(--tp-text-faint); }
textarea.tp-field { min-height: 88px; resize: vertical; }
.tp-select {
  width: auto;
  appearance: none;
  padding-right: 30px;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--tp-text-muted) 50%),
    linear-gradient(135deg, var(--tp-text-muted) 50%, transparent 50%);
  background-position: calc(100% - 15px) 15px, calc(100% - 10px) 15px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.tp-field[aria-invalid="true"] {
  border-color: var(--tp-danger);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tp-danger) 12%, transparent);
}

/* Segmented tabs */
.tp-tabs {
  align-items: center;
  gap: var(--tp-space-0);
  padding: var(--tp-space-0);
  border: 1px solid var(--tp-border);
  border-radius: var(--tp-radius-sm);
  background: var(--tp-surface);
}
.tp-tab {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 11px;
  color: var(--tp-text-muted);
  background: transparent;
  border: 0;
  border-radius: 8px;
  box-shadow: none;
  font: 600 12px/1 var(--tp-font-ui);
}
.tp-tab:hover:not(:disabled) { color: var(--tp-text); background: var(--tp-surface); }
.tp-tab:is(.active, [aria-selected="true"]) {
  color: var(--tp-text);
  background: var(--tp-panel);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .18), inset 0 0 0 1px var(--tp-border);
}

/* Tooltips and floating menus */
.tp-tooltip {
  max-width: min(300px, calc(100vw - 24px));
  padding: 8px 10px;
  color: var(--tp-text);
  background: var(--tp-panel);
  border: 1px solid var(--tp-border-strong);
  border-radius: 9px;
  box-shadow: var(--tp-shadow-pop);
  font: 500 11.5px/1.45 var(--tp-font-ui);
}
.tp-menu {
  color: var(--tp-text);
  background: var(--tp-panel);
  border: 1px solid var(--tp-border-strong);
  border-radius: var(--tp-radius);
  box-shadow: var(--tp-shadow-pop);
}
.tp-menu-item {
  min-height: var(--tp-control);
  display: flex;
  align-items: center;
  gap: var(--tp-space-2);
  width: 100%;
  padding: 0 10px;
  color: var(--tp-text);
  background: transparent;
  border: 0;
  border-radius: 9px;
  text-align: left;
}
.tp-menu-item:hover:not(:disabled) { background: var(--tp-surface-hover); }

/* Modals and sheets */
.tp-modal-backdrop {
  background: rgba(0, 0, 0, .72);
  backdrop-filter: blur(8px);
}
.tp-modal {
  color: var(--tp-text);
  background: var(--tp-panel);
  border: 1px solid var(--tp-border-strong);
  border-radius: var(--tp-radius-lg);
  box-shadow: var(--tp-shadow-modal);
}
.tp-modal-header,
.tp-modal-footer {
  min-height: 60px;
  display: flex;
  align-items: center;
  gap: var(--tp-space-3);
  padding: var(--tp-space-3) var(--tp-space-4);
}
.tp-modal-header { border-bottom: 1px solid var(--tp-border); }
.tp-modal-footer { justify-content: flex-end; border-top: 1px solid var(--tp-border); }

/* Feedback states */
.tp-toast {
  min-height: var(--tp-control-roomy);
  display: flex;
  align-items: center;
  gap: var(--tp-space-2);
  padding: 9px 12px;
  color: var(--tp-text);
  background: var(--tp-panel);
  border: 1px solid var(--tp-border-strong);
  border-radius: var(--tp-radius-sm);
  box-shadow: var(--tp-shadow-pop);
  font: 550 12.5px/1.4 var(--tp-font-ui);
}
.tp-empty {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--tp-space-2);
  padding: var(--tp-space-5);
  color: var(--tp-text-muted);
  text-align: center;
  font: 500 12.5px/1.55 var(--tp-font-ui);
}
.tp-empty > strong { color: var(--tp-text); font-weight: 650; }
.tp-empty > small { max-width: 36ch; color: var(--tp-text-faint); font: inherit; }

/* Section labels — the ONE treatment, platform-wide.
   Every surface had grown its own gold kicker ("◆ BUILD · INDICATOR LAB", "Prove it",
   "YOUR TRADING WORKSPACE"), which is most of the yellow a member actually sees. The pattern
   that already reads well is the Lab's "YOUR INDICATORS · 03 SAVED" bay label: neutral type on
   a translucent surface. That is generalised here and gold is out of the family entirely.
   .tp-eyebrow is the bare label; .tp-eyebrow-glass adds the chip so it can carry a header. */
.tp-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--tp-space-2);
  font: 600 10.5px/1 var(--tp-font-data);
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--tp-text-secondary);
}
.tp-eyebrow > b,
.tp-eyebrow .tp-eyebrow-mark {
  color: var(--tp-accent);
  font-weight: 600;
  font-style: normal;
}
.tp-eyebrow .tp-eyebrow-sep { color: var(--tp-text-faint); }
.tp-eyebrow-glass {
  padding: 6px 11px;
  border: 1px solid var(--tp-border-strong);
  border-radius: var(--tp-radius-pill);
  /* Glass, not a grey slab: translucent over whatever the surface is, plus a blur. */
  background: var(--tp-surface);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.tp-skeleton-stack {
  display: grid;
  gap: var(--tp-space-2);
  padding: var(--tp-space-2);
}
.tp-skeleton {
  display: block;
  min-height: 48px;
  overflow: hidden;
  border: 1px solid var(--tp-border);
  border-radius: var(--tp-radius-sm);
  background: var(--tp-surface);
  position: relative;
}
.tp-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .07), transparent);
  animation: tp-skeleton 1.35s ease-in-out infinite;
}
.tp-progress-inline {
  display: inline-flex;
  align-items: center;
  gap: var(--tp-space-2);
  color: var(--tp-text-secondary);
}
.tp-progress-inline::before {
  content: "";
  width: 12px;
  height: 12px;
  flex: none;
  border: 1.5px solid color-mix(in srgb, var(--tp-accent) 30%, transparent);
  border-top-color: var(--tp-accent);
  border-radius: 50%;
  animation: tp-spin .75s linear infinite;
}
.tp-progress-track {
  height: 4px;
  overflow: hidden;
  border-radius: var(--tp-radius-pill);
  background: var(--tp-surface-hover);
}
.tp-progress-bar {
  width: var(--tp-progress, 0%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--tp-accent), var(--tp-accent-hi));
  transition: width .24s var(--tp-ease);
}

:where(button, a[href], input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 2px solid var(--tp-focus);
  outline-offset: 2px;
}

@keyframes tp-skeleton { to { transform: translateX(100%); } }
@keyframes tp-spin { to { transform: rotate(360deg); } }

/* Breakpoint contract:
   1100px wide workspace · 900px compact workspace · 680px mobile chrome ·
   480px narrow phone. Contextual layout remains owned by each product. */
@media (max-width: 900px) {
  .tp-modal-header,
  .tp-modal-footer { padding-inline: 14px; }
}
@media (max-width: 680px) {
  .tp-menu-item { min-height: 40px; }
  .tp-shell-mobile-menu,
  .tp-shell-mobile-theme,
  .tp-shell-mobile-close {
    width: var(--tp-touch-target);
    min-width: var(--tp-touch-target);
    height: var(--tp-touch-target);
    min-height: var(--tp-touch-target);
  }
}
@media (max-width: 480px) {
  .tp-modal { border-radius: var(--tp-radius); }
  .tp-empty { min-height: 96px; padding: 18px 14px; }
}

/* Pointer precision, not viewport width, determines tap-target size. */
@media (hover: none) and (pointer: coarse) {
  .tp-button,
  .tp-tab,
  .tp-menu-item,
  .tp-field,
  .tp-select { min-height: var(--tp-touch-target); }
  .tp-button-icon { width: var(--tp-touch-target); min-width: var(--tp-touch-target); }
}

@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
  .tp-skeleton::after,
  .tp-progress-inline::before { animation: none; }
}

/* Shared chart settings — one TradingView-familiar information architecture for both Labs. */
.cs-modal {
  position: fixed;
  inset: 0;
  z-index: 10020;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: transparent;
  backdrop-filter: none;
}
.cs-modal.open { display: flex; }
.cs-sheet {
  width: min(760px, calc(100vw - 48px));
  height: min(720px, calc(100dvh - 48px));
  max-height: none;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  background: var(--tp-panel, var(--card-solid, var(--card, #141417)));
  border: 1px solid var(--tp-border-strong, var(--line-strong, rgba(128, 128, 128, .24)));
  border-radius: 14px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .38);
  color: var(--tp-text, var(--text, #e7eaee));
  font-family: var(--font, Switzer, system-ui, sans-serif);
}
.cs-head {
  display: flex;
  align-items: center;
  user-select: none;
  justify-content: space-between;
  min-height: 62px;
  padding: 0 20px;
  border-bottom: 1px solid var(--tp-border, var(--line, rgba(128, 128, 128, .16)));
}
.cs-head h2 { margin: 0; color: var(--tp-text, var(--text, #e7eaee)); font: 650 17px/1 var(--font, Switzer, sans-serif); letter-spacing: -.02em; }
.cs-close {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--tp-text-muted, var(--muted, #8b93a1));
  font: 400 18px/1 var(--font, Switzer, sans-serif);
  cursor: pointer;
}
.cs-close:hover { background: var(--tp-surface-hover, var(--surface-hi, rgba(128, 128, 128, .1))); color: var(--tp-text, var(--text, #e7eaee)); }
.cs-workspace { min-height: 0; display: grid; grid-template-columns: 206px minmax(0, 1fr); }
.cs-nav {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 10px;
  border-right: 1px solid var(--tp-border, var(--line, rgba(128, 128, 128, .16)));
  background: color-mix(in srgb, var(--solid, #0f0f12) 52%, transparent);
}
.cs-nav button {
  position: relative;
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 12px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--tp-text-muted, var(--muted, #8b93a1));
  font: 560 12.5px/1 var(--font, Switzer, sans-serif);
  text-align: left;
  cursor: pointer;
  transition: background .14s var(--ease, ease), color .14s var(--ease, ease);
}
.cs-nav button svg { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.cs-nav button:hover { color: var(--tp-text, var(--text, #e7eaee)); background: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07))); }
.cs-nav button[aria-selected="true"] { color: var(--tp-text, var(--text, #e7eaee)); background: var(--tp-surface-hover, var(--surface-hi, rgba(128, 128, 128, .12))); }
.cs-nav button[aria-selected="true"]::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  bottom: 9px;
  width: 2px;
  border-radius: 999px;
  background: var(--tp-accent, #e9b24c);
  box-shadow: 0 0 12px color-mix(in srgb, var(--tp-accent, #e9b24c) 38%, transparent);
}
.cs-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.cs-panel { width: min(430px, calc(100% - 48px)); margin: 0 auto; padding: 23px 0 34px; }
.cs-section-label {
  margin: 4px 0 12px;
  color: var(--tp-text-faint, var(--faint, #666d79));
  font: 650 9.5px/1 var(--font, Switzer, sans-serif);
  letter-spacing: .095em;
  text-transform: uppercase;
}
.cs-section-label:not(:first-child) { margin-top: 26px; }
.cs-row {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 6px 0;
}
.cs-row > label, .cs-label, .cs-row > div > label { color: var(--tp-text-secondary, var(--sec, #c6cad2)); font: 500 12.5px/1.35 var(--font, Switzer, sans-serif); }
.cs-row small { display: block; max-width: 280px; margin-top: 4px; color: var(--tp-text-faint, var(--faint, #666d79)); font: 450 10.5px/1.4 var(--font, Switzer, sans-serif); }
.cs-row-controls, .csctl, .cs-pair, .cs-autoctl { display: inline-flex; align-items: center; justify-content: flex-end; gap: 9px; }
.cs-row-controls { min-width: 180px; }
.cs-pair { gap: 8px; }
.cs-color { display: inline-flex; align-items: center; gap: 6px; color: var(--tp-text-faint, var(--faint, #666d79)); font: 500 9.5px/1 var(--font, Switzer, sans-serif); }
.cs-color > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.cs-color input[type="color"] {
  width: 34px;
  height: 34px;
  flex: none;
  padding: 4px;
  appearance: none;
  -webkit-appearance: none;
  overflow: hidden;
  border: 1px solid var(--tp-border-strong, var(--line-strong, rgba(128, 128, 128, .24)));
  border-radius: 8px;
  background: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07)));
  cursor: pointer;
}
.cs-color input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.cs-color input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 4px; }
.cs-color input[type="color"]::-moz-color-swatch { border: 0; border-radius: 4px; }
.cs-color input[type="color"]:hover { border-color: var(--tp-accent, #e9b24c); }
.cs-check { position: relative; width: 18px; height: 18px; flex: none; display: inline-grid; }
.cs-check input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.cs-check span {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border: 1px solid var(--tp-border-strong, var(--line-strong, rgba(128, 128, 128, .36)));
  border-radius: 4px;
  background: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07)));
  color: var(--tp-accent-ink, var(--accent-ink, #221803));
  pointer-events: none;
}
.cs-check input:checked + span { border-color: var(--tp-accent, #e9b24c); background: var(--tp-accent, #e9b24c); }
.cs-check input:checked + span::after { content: ''; width: 8px; height: 4px; margin-top: -2px; border-left: 1.7px solid currentColor; border-bottom: 1.7px solid currentColor; transform: rotate(-45deg); }
.cs-check input:focus-visible + span, .cs-nav button:focus-visible, .cs-close:focus-visible, .cs-foot :is(button, select):focus-visible, .chart-settings-gear:focus-visible { outline: 2px solid var(--tp-focus, var(--tp-accent, #e9b24c)); outline-offset: 2px; }
.cs-autoctl { gap: 10px; }
.cs-auto { display: inline-flex; align-items: center; gap: 6px; color: var(--tp-text-faint, var(--faint, #666d79)); font: 500 9.5px/1 var(--font, Switzer, sans-serif); white-space: nowrap; }
.cs-auto input { width: 14px; height: 14px; margin: 0; accent-color: var(--tp-accent, #e9b24c); }
.cs-row select, .cs-template-trigger, .cs-number input {
  height: 36px;
  border: 1px solid var(--tp-border-strong, var(--line-strong, rgba(128, 128, 128, .24)));
  border-radius: 8px;
  background-color: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07)));
  color: var(--tp-text, var(--text, #e7eaee));
  font: 500 11.5px/1 var(--font, Switzer, sans-serif);
}
.cs-row select, .cs-template-trigger {
  min-width: 188px;
  padding: 0 34px 0 11px;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--tp-text-muted, #8b93a1) 50%), linear-gradient(135deg, var(--tp-text-muted, #8b93a1) 50%, transparent 50%);
  background-position: calc(100% - 15px) 15px, calc(100% - 11px) 15px;
  background-size: 4px 4px, 4px 4px;
  background-repeat: no-repeat;
}
.cs-row input[type="range"] { width: 132px; margin: 0; padding: 0; border: 0; background: transparent; accent-color: var(--tp-accent, #e9b24c); }
.cs-val { min-width: 36px; color: var(--tp-text-muted, var(--muted, #8b93a1)); font: 600 10.5px/1 var(--mono, ui-monospace, monospace); text-align: right; }
.cs-number { display: inline-flex; align-items: center; gap: 8px; color: var(--tp-text-muted, var(--muted, #8b93a1)); font: 500 10.5px/1 var(--font, Switzer, sans-serif); }
.cs-number input { width: 88px; padding: 0 10px; font-family: var(--mono, ui-monospace, monospace); }
.cs-seg { display: inline-flex; padding: 2px; border: 1px solid var(--tp-border, var(--line, rgba(128, 128, 128, .16))); border-radius: 9px; background: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07))); }
.cs-seg button { min-width: 60px; padding: 6px 8px; border: 0; border-radius: 6px; background: transparent; color: var(--tp-text-muted, var(--muted, #8b93a1)); font: 600 10px/1 var(--font, Switzer, sans-serif); cursor: pointer; }
.cs-seg button:hover { color: var(--tp-text, var(--text, #e7eaee)); }
.cs-seg button.active { background: var(--tp-surface-hover, var(--surface-hi, rgba(128, 128, 128, .13))); color: var(--tp-text, var(--text, #e7eaee)); box-shadow: 0 1px 2px rgba(0, 0, 0, .16); }
.cs-btn { min-height: 34px; padding: 0 12px; border: 1px solid var(--tp-border-strong, var(--line-strong, rgba(128, 128, 128, .24))); border-radius: 8px; background: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07))); color: var(--tp-text-secondary, var(--sec, #c6cad2)); font: 600 10.5px/1 var(--font, Switzer, sans-serif); cursor: pointer; }
.cs-btn:hover { background: var(--tp-surface-hover, var(--surface-hi, rgba(128, 128, 128, .13))); color: var(--tp-text, var(--text, #e7eaee)); }
.cs-note, .cs-contrast { margin: 14px 0 0; padding: 10px 11px; border-radius: 8px; font: 500 10.5px/1.45 var(--font, Switzer, sans-serif); }
.cs-note { color: var(--tp-text-muted, var(--muted, #8b93a1)); background: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07))); }
.cs-contrast { color: var(--tp-text-secondary, #a36a00); background: color-mix(in srgb, var(--tp-warn, #e9b24c) 10%, transparent); border: 1px solid color-mix(in srgb, var(--tp-warn, #e9b24c) 30%, transparent); }
.cs-panel .disabled { opacity: .38; }
.cs-panel .disabled :is(input, select, button) { cursor: not-allowed; }
.cs-foot {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 14px;
  border-top: 1px solid var(--tp-border, var(--line, rgba(128, 128, 128, .16)));
  background: color-mix(in srgb, var(--tp-panel, #141417) 96%, transparent);
}
.cs-template, .cs-actions { position: relative; display: flex; align-items: center; gap: 8px; }
.cs-template > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.cs-template-trigger { min-width: 126px; max-width: 190px; height: 36px; display: inline-flex; align-items: center; cursor: pointer; }
.cs-template-trigger span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-template-list { left: 0; bottom: 45px; min-width: 186px; max-height: 264px; overflow: auto; }
.cs-template-list .cs-opt { width: 100%; min-height: 34px; display: flex; align-items: center; border: 0; border-radius: 6px; padding: 0 11px; background: transparent; color: var(--tp-text-secondary, var(--sec, #c6cad2)); text-align: left; }
.cs-template-list .cs-opt:hover, .cs-template-list .cs-opt:focus-visible { background: var(--tp-surface-hover, var(--surface-hi, rgba(128, 128, 128, .13))); color: var(--tp-text, var(--text, #e7eaee)); }
.cs-template-list .cs-opt[aria-selected="true"] { color: var(--tp-text, var(--text, #e7eaee)); }
.cs-template-list .cs-opt[aria-selected="true"]::after { content: '✓'; margin-left: auto; padding-left: 10px; color: var(--tp-accent, #e9b24c); font-weight: 700; }
.cs-list-group { display: block; padding: 8px 11px 4px; color: var(--tp-text-faint, var(--faint, #666d79)); font: 650 8.5px/1 var(--font, Switzer, sans-serif); letter-spacing: .08em; text-transform: uppercase; }
.cs-template-name { display: inline-flex; align-items: center; gap: 8px; }
.cs-template-name input { height: 36px; min-width: 176px; padding: 0 11px; border: 1px solid var(--tp-border-strong, var(--line-strong, rgba(128, 128, 128, .24))); border-radius: 8px; background-color: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07))); color: var(--tp-text, var(--text, #e7eaee)); font: 500 11.5px/1 var(--font, Switzer, sans-serif); }
.cs-template-name input:focus-visible { outline: 2px solid var(--tp-accent, #e9b24c); outline-offset: -1px; }
.cs-template.naming > :not(.cs-template-name):not(label) { display: none; }
.cs-foot button { min-height: 36px; padding: 0 14px; border: 1px solid var(--tp-border-strong, var(--line-strong, rgba(128, 128, 128, .24))); border-radius: 8px; background: var(--tp-surface, var(--surface, rgba(128, 128, 128, .07))); color: var(--tp-text-secondary, var(--sec, #c6cad2)); font: 620 11.5px/1 var(--font, Switzer, sans-serif); cursor: pointer; }
.cs-foot button:hover { background: var(--tp-surface-hover, var(--surface-hi, rgba(128, 128, 128, .13))); color: var(--tp-text, var(--text, #e7eaee)); }
.cs-foot #csReset { border-color: transparent; background: transparent; color: var(--tp-text-muted, var(--muted, #8b93a1)); }
.cs-template-menu { position:absolute;z-index:4;left:150px;bottom:45px;min-width:138px;padding:5px;border:1px solid var(--tp-border-strong,var(--line-strong,rgba(128,128,128,.24)));border-radius:10px;background:var(--tp-panel,var(--card-solid,#141417));box-shadow:0 18px 46px rgba(0,0,0,.2); }
.cs-template-menu[hidden] { display:none; }
.cs-template-menu button { width:100%;min-height:34px;display:block;border:0;background:transparent;text-align:left; }
.cs-template-menu button.danger { color:var(--tp-danger,var(--down,#f0544a)); }
.cs-template-status { max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tp-positive,var(--up,#35c77c));font:550 10px/1.2 var(--font,Switzer,sans-serif); }
.cs-template-status.error { color:var(--tp-danger,var(--down,#f0544a)); }
.cs-foot .primary { min-width: 58px; border-color: var(--tp-accent, #e9b24c); background: var(--tp-accent, #e9b24c); color: var(--tp-accent-ink, var(--accent-ink, #221803)); }
.cs-foot .primary:hover { border-color: var(--tp-accent-hi, #f5cd82); background: var(--tp-accent-hi, #f5cd82); color: var(--tp-accent-ink, var(--accent-ink, #221803)); }
.chart-settings-gear {
  position: absolute;
  z-index: 8;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid color-mix(in srgb, currentColor 18%, transparent);
  border-radius: 9px;
  background: color-mix(in srgb, var(--tp-panel, #141417) 86%, transparent);
  color: var(--tp-text-muted, var(--muted, #8b93a1));
  box-shadow: 0 4px 14px rgba(0, 0, 0, .13);
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: color .14s var(--ease, ease), border-color .14s var(--ease, ease), background .14s var(--ease, ease), transform .14s var(--ease, ease);
}
.chart-settings-gear::before { content: ''; position: absolute; inset: -6px; }
.chart-settings-gear svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; }
.chart-settings-gear:hover { color: var(--tp-accent, #e9b24c); border-color: color-mix(in srgb, var(--tp-accent, #e9b24c) 46%, transparent); background: color-mix(in srgb, var(--tp-panel, #141417) 96%, transparent); transform: translateY(-1px); }

@media (max-width: 660px) {
  .cs-modal { align-items: stretch; padding: 0; }
  .cs-sheet { width: 100%; height: 100dvh; border: 0; border-radius: 0; }
  .cs-head { min-height: calc(58px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 16px 0; }
  .cs-close, .cs-color input[type="color"] { width: 44px; height: 44px; }
  .cs-check::before { content: ''; position: absolute; inset: -13px; }
  .cs-workspace { display: grid; grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
  .cs-nav { flex-direction: row; overflow-x: auto; padding: 8px 10px; border-right: 0; border-bottom: 1px solid var(--tp-border, var(--line, rgba(128, 128, 128, .16))); scrollbar-width: none; }
  .cs-nav::-webkit-scrollbar { display: none; }
  .cs-nav button { width: auto; min-width: max-content; min-height: 44px; padding: 0 11px; }
  .cs-nav button[aria-selected="true"]::before { left: 11px; right: 11px; top: auto; bottom: 0; width: auto; height: 2px; }
  .cs-content { scrollbar-gutter: auto; }
  .cs-panel { width: auto; margin: 0; padding: 20px 16px 34px; }
  .cs-row { min-height: 52px; gap: 14px; }
  .cs-row-controls { min-width: 0; }
  .cs-row select { min-width: 174px; }
  .cs-row select, .cs-number input { height: 44px; }
  .cs-btn, .cs-seg button, .cs-foot button, .cs-template select { min-height: 44px; }
  .cs-auto { display: none; }
  .cs-foot { min-height: calc(62px + env(safe-area-inset-bottom)); padding: 0 12px env(safe-area-inset-bottom); }
  .cs-template #csReset { display: none; }
  .cs-template #csTemplateSave { display:none; }
  .cs-template-status { display:none; }
  .cs-template select { min-width: 112px; }
}
@media (max-width: 420px) {
  .cs-row { align-items: flex-start; flex-direction: column; padding: 9px 0; }
  .cs-row > :last-child { align-self: stretch; justify-content: flex-end; }
  .cs-color-row { flex-direction: row; align-items: center; }
  .cs-color-row > :last-child { align-self: auto; }
  .cs-row select { width: 100%; }
  .cs-autoctl { width: 100%; }
  .cs-seg { width: 100%; }
  .cs-seg button { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .cs-nav button, .chart-settings-gear { transition: none; }
}