/* Hallmark · pre-emit critique: P4 H5 E4 S5 R5 V4
 * genre: modern-minimal · macrostructure: Split Studio login + chart workspace
 * theme: existing ZetaChart · nav: N3 side/workspace · footer: Ft2
 * audience: ZetaChart members · use: inspect gold charts · tone: technical
 */
@import url('/tokens.css');
:root {
  --app-bg: oklch(15% .008 286); --app-surface: oklch(18% .009 286);
  --app-raised: oklch(22% .012 286); --app-line: oklch(29% .012 286);
  --app-ink: oklch(95% .004 286); --app-muted: oklch(72% .012 286);
  --app-subtle: oklch(62% .012 286); --app-accent: oklch(61% .22 286);
  --app-accent-hover: oklch(67% .2 286); --app-accent-soft: oklch(28% .06 286);
  --app-good: oklch(73% .13 165); --app-bad: oklch(75% .13 15);
  --app-gold: oklch(78% .12 80); --app-warning: oklch(80% .1 80);
  --app-error-bg: oklch(25% .045 15); --app-success-bg: oklch(25% .04 165);
  --chart-paper: #080a0a; --chart-grid: #141918;
  --chart-ink: #e5ebe7; --chart-muted: #9aa69f;
  --chart-level: #7e8b83; --chart-up: #20d000; --chart-down: #7137ff;
  --chart-bubble-buy: #43df75; --chart-bubble-sell: #9346ff;
  --chart-buy-soft: oklch(24% .05 150); --chart-sell-soft: oklch(24% .065 295);
  --chart-crosshair: #64736b; --chart-axis-label: #29352e;
  --chart-notice-bg: oklch(22% .025 85); --chart-notice-ink: oklch(82% .065 85);
  --app-shadow: oklch(8% .01 286 / .6); --app-scrim: oklch(8% .01 286 / .8);
  --app-radius: 8px; --app-fast: 140ms; --app-ease: cubic-bezier(.2,.7,.3,1);
}
* { box-sizing: border-box; }
html, body { margin:0; min-height:100%; overflow-x:clip; }
body { background:var(--app-bg); color:var(--app-ink); font:400 14px/1.5 var(--font-body); -webkit-font-smoothing:antialiased; }
button, input, select, textarea { font:inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color:transparent; }
button, a { touch-action:manipulation; }
button { cursor:pointer; color:inherit; }
button:disabled { cursor:wait; opacity:.55; }
button, input, select, a { transition:background var(--app-fast) var(--app-ease),border-color var(--app-fast) var(--app-ease),color var(--app-fast) var(--app-ease),transform var(--app-fast) var(--app-ease); }
button:active:not(:disabled), .button:active { transform:translateY(1px); }
:focus-visible { outline:2px solid var(--app-accent-hover); outline-offset:4px; }
a { color:inherit; text-decoration:none; }
[hidden] { display:none!important; }
h1,h2,h3,p { margin:0; }
h1,h2,h3 { font-style:normal; font-weight:500; letter-spacing:-.025em; overflow-wrap:anywhere; min-width:0; }
.muted, .small-muted { color:var(--app-muted); }
.small-muted { font-size:12px; line-height:1.6; }
.mono { font-family:var(--font-mono); }
.eyebrow { display:block; color:var(--app-muted); font:400 10px/1.5 var(--font-mono); letter-spacing:.12em; }
.wordmark { display:flex; align-items:center; gap:8px; font-size:23px; font-weight:500; letter-spacing:-.06em; white-space:nowrap; }
.z-mark { display:inline-block; color:var(--app-accent-hover); font-size:26px; font-weight:600; transform:skewX(-13deg); letter-spacing:-.16em; margin-right:3px; }
.wordmark-tag { font:400 9px var(--font-mono); color:var(--app-muted); margin-left:10px; letter-spacing:.1em; padding-left:16px; border-left:1px solid var(--app-line); }
.button { display:inline-flex; justify-content:center; align-items:center; gap:24px; min-height:44px; padding:11px 18px; border-radius:var(--app-radius); border:1px solid var(--app-line); font-weight:500; font-size:13px; white-space:nowrap; background:var(--app-raised); }
.button.primary { background:var(--app-accent); border-color:var(--app-accent); color:var(--app-ink); }
.button.primary:hover { background:var(--app-accent-hover); border-color:var(--app-accent-hover); }
.button.secondary { background:transparent; }
.button.secondary:hover { background:var(--app-raised); border-color:var(--app-subtle); }
.button.full { width:100%; }
.text-button { background:none; border:none; padding:6px 0; color:var(--app-muted); font-size:12px; white-space:nowrap; }
.text-button:hover { color:var(--app-ink); }
label { display:block; font-size:12px; font-weight:500; margin:20px 0 8px; }
input:not([type=checkbox]):not([type=color]), select, textarea { display:block; width:100%; min-height:44px; border:1px solid var(--app-line); border-radius:6px; background:var(--app-bg); color:var(--app-ink); padding:11px 12px; min-width:0; }
input::placeholder,textarea::placeholder { color:var(--app-subtle); }
input:hover,select:hover,textarea:hover { border-color:var(--app-subtle); }
input:focus,select:focus,textarea:focus { border-color:var(--app-accent); outline:2px solid var(--app-accent-soft); outline-offset:1px; }
input[type=date],input[type=time] { color-scheme:dark; }
input[type=color] { width:100%; height:44px; border:1px solid var(--app-line); border-radius:6px; padding:5px; background:var(--app-bg); }
input[type=checkbox] { width:17px; height:17px; accent-color:var(--app-accent); }
.checkbox-row { display:flex; align-items:center; gap:9px; cursor:pointer; }
.password-field { position:relative; }
.password-field input { padding-right:90px!important; }
.field-action { position:absolute; right:8px; top:5px; height:34px; border:0; background:transparent; padding:0 8px; color:var(--app-muted); font-size:11px; white-space:nowrap; }
.field-action:hover { color:var(--app-ink); }
.form-error,.form-success,.notice { padding:11px 12px; border-radius:6px; font-size:12px; margin:16px 0; line-height:1.6; }
.form-error { background:var(--app-error-bg); color:var(--app-bad); }
.form-success { background:var(--app-success-bg); color:var(--app-good); }
.notice { background:var(--app-accent-soft); }
.help-note { color:var(--app-muted); font-size:12px; line-height:1.7; margin:12px 0; }
.form-columns { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
.gold-dot,.status-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--app-subtle); flex:none; }
.gold-dot { background:var(--app-gold); margin-right:9px; }
.login-layout { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); min-height:100dvh; }
.login-intro { padding:44px clamp(32px,5.5vw,96px); display:flex; flex-direction:column; justify-content:space-between; background:var(--app-surface); border-right:1px solid var(--app-line); position:relative; }
.intro-copy { padding:80px 0; }
.intro-copy h1 { font-size:clamp(44px,5.2vw,82px); line-height:1.04; letter-spacing:-.06em; margin:25px 0; }
.intro-copy h1 span { color:var(--app-accent-hover); }
.intro-copy p { color:var(--app-muted); font-size:16px; line-height:1.8; }
.login-foot { display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--app-line); padding-top:20px; font-size:11px; color:var(--app-muted); }
.login-form-wrap { display:flex; align-items:center; justify-content:center; padding:60px 32px; }
.login-form-inner { width:100%; max-width:368px; }
.login-form-inner h2 { margin:12px 0; font-size:32px; line-height:1.15; letter-spacing:-.04em; }
.login-form-inner>.muted { font-size:13px; max-width:320px; margin-bottom:30px; }
#login-submit { margin-top:26px; justify-content:space-between; }
#access-help { display:block; margin:17px auto; }
.back-link { display:block; text-align:center; font-size:12px; color:var(--app-muted); margin-top:38px; white-space:nowrap; }
.back-link:hover { color:var(--app-ink); }
.login-disclosure { text-align:center; color:var(--app-subtle); font-size:11px; line-height:1.8; margin-top:36px; }
.app-header { height:68px; display:flex; align-items:center; gap:42px; padding:0 25px; border-bottom:1px solid var(--app-line); flex:none; }
.app-header .wordmark { font-size:21px; }
.workspace-nav { display:flex; height:100%; align-items:stretch; gap:28px; }
.workspace-nav a { display:flex; align-items:center; color:var(--app-muted); font-size:12px; white-space:nowrap; border-bottom:2px solid transparent; padding:2px 0 0; }
.workspace-nav a.active { border-color:var(--app-accent); color:var(--app-ink); }
.workspace-nav a:hover { color:var(--app-ink); }
.header-right { margin-left:auto; display:flex; align-items:center; gap:24px; min-width:0; }
.feed-pill { display:flex; align-items:center; gap:8px; font-size:11px; color:var(--app-muted); white-space:nowrap; }
.feed-pill.live .status-dot { background:var(--app-good); }
.feed-pill.historical .status-dot { background:var(--app-gold); }
.account-button { border:0; background:transparent; display:flex; gap:10px; align-items:center; font-size:12px; padding:5px 0; }
.avatar { width:29px; height:29px; display:grid; place-items:center; background:var(--app-accent-soft); color:var(--app-accent-hover); border:1px solid var(--app-line); border-radius:50%; font:400 10px var(--font-mono); }
.workspace-page { height:100dvh; display:flex; flex-direction:column; }
.terminal-layout { display:grid; grid-template-columns:minmax(0,1fr) 266px; flex:1; min-height:0; }
.chart-workspace { display:flex; flex-direction:column; min-width:0; min-height:0; }
.instrument-bar { display:flex; align-items:center; justify-content:space-between; padding:18px 24px; gap:16px; }
.instrument-title { display:flex; gap:13px; align-items:center; min-width:0; }
.gold-tile { display:grid; place-items:center; background:var(--app-raised); color:var(--app-gold); border:1px solid var(--app-line); border-radius:9px; width:42px; height:42px; font:500 18px var(--font-body); flex:none; }
.instrument-title h1 { display:flex; align-items:center; gap:12px; font-size:18px; line-height:1.5; letter-spacing:-.02em; }
.instrument-title h1 span { color:var(--app-muted); font-size:12px; font-weight:400; letter-spacing:0; }
.instrument-subtitle { color:var(--app-muted); font-size:11px; }
.quote { text-align:right; flex:none; }
.quote strong { display:block; font:400 23px/1.4 var(--font-mono); letter-spacing:-.04em; }
.quote>span { color:var(--app-muted); font-size:10px; }
.chart-toolbar { border-top:1px solid var(--app-line); display:flex; justify-content:space-between; padding:7px 20px; gap:12px; }
.timeframes,.toolbar-actions { display:flex; gap:3px; align-items:center; }
.timeframes button { border:0; background:transparent; color:var(--app-muted); font:400 11px var(--font-mono); padding:8px 11px; border-radius:5px; min-height:32px; white-space:nowrap; }
.timeframes button:hover { background:var(--app-raised); color:var(--app-ink); }
.timeframes button.selected { background:var(--app-accent-soft); color:var(--app-accent-hover); }
.toolbar-button { display:inline-flex; align-items:center; gap:10px; border:1px solid transparent; border-radius:5px; background:none; color:var(--app-muted); padding:7px 9px; font-size:11px; white-space:nowrap; }
.toolbar-button:hover { border-color:var(--app-line); color:var(--app-ink); }
.chart-surface { flex:1; min-height:260px; background:var(--chart-paper); position:relative; display:flex; flex-direction:column; }
.ohlc-bar { display:flex; flex-wrap:wrap; align-items:center; gap:17px; padding:10px 18px; color:var(--chart-muted); font:400 10px var(--font-mono); min-height:35px; }
.ohlc-bar strong { font-weight:400; color:var(--chart-ink); }
.ohlc-bar b { font-weight:400; color:var(--chart-ink); }
#price-chart { flex:1; min-height:225px; position:relative; }
.chart-empty,.chart-loading { position:absolute; inset:35px 0 0; z-index:3; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:30px; color:var(--chart-ink); background:var(--chart-paper); }
.chart-empty h2 { font-size:25px; margin:14px 0; }
.chart-empty p { max-width:340px; font-size:13px; line-height:1.7; color:var(--chart-muted); }
.chart-empty .button { margin-top:24px; color:var(--chart-ink); border-color:var(--chart-crosshair); }
.chart-empty .button:hover { background:var(--chart-grid); }
.empty-mark { font-size:36px; color:var(--app-accent); }
.chart-loading { gap:12px; font-size:12px; }
.spinner { width:22px; height:22px; border-radius:50%; border:2px solid var(--chart-grid); border-top-color:var(--app-accent); animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.chart-tooltip { position:absolute; pointer-events:none; z-index:8; background:var(--app-surface); color:var(--app-ink); border:1px solid var(--app-line); border-radius:6px; padding:8px 11px; font:400 11px var(--font-mono); box-shadow:0 4px 20px var(--app-shadow); max-width:230px; }
.chart-footnote { display:flex; justify-content:space-between; gap:10px; background:var(--chart-paper); color:var(--chart-muted); border-top:1px solid var(--chart-grid); font-size:9px; padding:7px 18px; }
.chart-footnote a { white-space:nowrap; text-decoration:underline; text-underline-offset:2px; }
.chart-sidebar { border-left:1px solid var(--app-line); overflow-y:auto; min-height:0; }
.chart-sidebar>section { padding:20px; border-bottom:1px solid var(--app-line); }
.panel-heading { display:flex; justify-content:space-between; gap:10px; align-items:center; }
.panel-heading h2 { font-size:12px; font-weight:500; letter-spacing:0; }
.count-tag,.small-tag { color:var(--app-muted); font:400 9px var(--font-mono); white-space:nowrap; }
.count-tag { background:var(--app-raised); padding:3px 6px; border-radius:4px; }
.panel-description { margin:7px 0 14px; color:var(--app-subtle); font-size:11px; }
.empty-note { color:var(--app-muted); font-size:12px; line-height:1.7; padding:18px 0; }
.signals-list { display:flex; flex-direction:column; gap:2px; max-height:43vh; overflow-y:auto; }
.signal-row { border:0; width:100%; background:transparent; padding:10px 0; display:grid; grid-template-columns:28px minmax(0,1fr) auto; align-items:center; gap:9px; text-align:left; border-bottom:1px solid var(--app-line); }
.signal-row:last-child { border-bottom:0; }
.signal-row:hover { background:var(--app-raised); border-radius:4px; padding-left:4px; }
.signal-arrow { display:grid; place-items:center; background:var(--chart-buy-soft); color:var(--chart-bubble-buy); width:26px; height:26px; border-radius:5px; font-size:14px; }
.signal-row.sell .signal-arrow { background:var(--chart-sell-soft); color:var(--chart-bubble-sell); }
.signal-info strong { display:block; font-size:11px; font-weight:500; }
.signal-info small { display:block; color:var(--app-subtle); font:400 9px var(--font-mono); margin-top:2px; }
.signal-price { font:400 10px var(--font-mono); }
.levels-list { padding:14px 0 8px; }
.level-row { display:flex; justify-content:space-between; align-items:center; padding:7px 0; font:400 11px var(--font-mono); }
.level-row .level-line { width:30px; height:1px; background:var(--app-muted); }
.level-row.center { color:var(--app-accent-hover); }
.level-row.center .level-line { background:var(--app-accent-hover); }
.workspace-footer { height:29px; display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--app-line); padding:0 18px; font-size:9px; color:var(--app-subtle); flex:none; }
.workspace-footer>span:first-child { display:flex; gap:7px; align-items:center; min-width:0; }
.app-dialog { background:var(--app-surface); color:var(--app-ink); border:1px solid var(--app-line); border-radius:12px; width:calc(100% - 32px); max-width:440px; max-height:calc(100dvh - 40px); overflow-y:auto; padding:28px; box-shadow:0 16px 90px var(--app-shadow); }
.app-dialog::backdrop { background:var(--app-scrim); }
.wide-dialog { max-width:560px; }
.dialog-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:17px; }
.dialog-heading h2 { font-size:25px; margin-top:9px; line-height:1.2; }
.close-button { background:transparent; border:1px solid var(--app-line); border-radius:5px; color:var(--app-muted); width:30px; height:30px; font-size:21px; line-height:1; flex:none; }
.close-button:hover { color:var(--app-ink); border-color:var(--app-subtle); }
.app-dialog .button { margin-top:22px; }
.app-dialog .small-muted { margin-top:9px; }
.dialog-divider { margin-top:25px; border-top:1px solid var(--app-line); }
.logout-button { color:var(--app-muted); }
.advanced-import { margin-top:15px; }
.advanced-import summary { font-size:12px; cursor:pointer; color:var(--app-muted); }
.advanced-import textarea { font:400 11px var(--font-mono); }
.toast { position:fixed; bottom:45px; left:50%; transform:translateX(-50%); background:var(--app-raised); border:1px solid var(--app-line); color:var(--app-ink); box-shadow:0 4px 20px var(--app-shadow); padding:12px 18px; border-radius:7px; font-size:12px; max-width:calc(100% - 32px); z-index:100; }
.skip-link,.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:clip; clip-path:inset(50%); white-space:nowrap; border:0; }
.skip-link:focus { position:fixed; width:auto; height:auto; margin:10px; padding:10px 15px; clip-path:none; z-index:200; background:var(--app-accent); color:var(--app-ink); }
.admin-main { max-width:1280px; padding:52px 40px 30px; margin:0 auto; }
.admin-page-heading { display:flex; justify-content:space-between; align-items:center; gap:25px; margin-bottom:35px; }
.admin-page-heading h1 { font-size:38px; letter-spacing:-.045em; margin:10px 0; line-height:1.15; }
.admin-page-heading .muted { font-size:13px; }
.admin-metrics { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.6fr); gap:0; border:1px solid var(--app-line); border-radius:8px; margin-bottom:44px; }
.admin-metrics article { padding:22px 25px; border-right:1px solid var(--app-line); min-width:0; }
.admin-metrics article:last-child { border-right:0; }
.admin-metrics article>span { display:block; color:var(--app-muted); font-size:11px; }
.admin-metrics strong { display:block; font:400 33px/1.25 var(--font-mono); margin:12px 0 5px; letter-spacing:-.06em; }
.admin-metrics .feed-metric strong { font:500 25px/1.6 var(--font-body); letter-spacing:-.03em; }
.admin-metrics p { font-size:10px; color:var(--app-subtle); }
.section-title { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:19px; }
.section-title h2 { font-size:18px; letter-spacing:-.02em; }
.section-title p { font-size:11px; color:var(--app-muted); margin-top:6px; }
.search-field { margin:0; min-width:0; width:240px; }
.search-field input { min-height:37px!important; font-size:11px; padding:9px 12px!important; }
.members-table { border:1px solid var(--app-line); border-radius:8px; }
.member-row { display:grid; grid-template-columns:minmax(0,2.2fr) minmax(0,.8fr) minmax(0,.85fr) minmax(0,1fr) 67px; gap:20px; align-items:center; padding:17px 22px; border-top:1px solid var(--app-line); min-width:0; }
.member-row.table-head { border:0; font-size:10px; color:var(--app-muted); padding-top:12px; padding-bottom:12px; background:var(--app-surface); border-radius:8px 8px 0 0; }
.member-identity { display:flex; align-items:center; gap:12px; min-width:0; }
.member-identity .avatar { width:33px; height:33px; flex:none; }
.member-identity strong { display:block; font-size:12px; font-weight:500; overflow-wrap:anywhere; }
.member-identity small { display:block; color:var(--app-muted); font-size:10px; overflow-wrap:anywhere; margin-top:3px; }
.member-cell { font-size:11px; color:var(--app-muted); }
.member-status { display:inline-flex; gap:6px; align-items:center; font-size:10px; color:var(--app-good); white-space:nowrap; }
.member-status .status-dot { background:var(--app-good); width:5px; height:5px; }
.member-status.suspended { color:var(--app-bad); }
.member-status.suspended .status-dot { background:var(--app-bad); }
.member-status.expired { color:var(--app-warning); }
.member-status.expired .status-dot { background:var(--app-warning); }
.member-manage { background:none; border:1px solid var(--app-line); border-radius:5px; color:var(--app-muted); font-size:10px; padding:7px 9px; white-space:nowrap; }
.member-manage:hover { border-color:var(--app-subtle); color:var(--app-ink); }
.admin-bottom-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px; margin-top:44px; }
.admin-section { border-top:1px solid var(--app-line); padding-top:23px; }
.detail-list { margin:0; }
.detail-list>div { display:flex; justify-content:space-between; gap:16px; padding:9px 0; font-size:11px; }
.detail-list dt { color:var(--app-muted); }
.detail-list dd { margin:0; text-align:right; }
.activity-section { margin-top:32px; border-top:1px solid var(--app-line); padding-top:24px; }
.audit-row { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-bottom:1px solid var(--app-line); font-size:11px; }
.audit-row p { overflow-wrap:anywhere; }
.audit-row small { color:var(--app-subtle); display:block; font-size:10px; margin-top:3px; }
.audit-row time { color:var(--app-muted); white-space:nowrap; font:400 9px/1.7 var(--font-mono); }
.admin-footer { max-width:1200px; margin:20px auto; padding:20px 0; border-top:1px solid var(--app-line); display:flex; justify-content:space-between; gap:15px; font-size:11px; color:var(--app-muted); }
@media(min-width:1600px) { .terminal-layout { grid-template-columns:minmax(0,1fr) 300px; } .chart-sidebar>section { padding:25px; } }
@media(max-width:1100px) { .app-header { gap:25px; padding:0 18px; } .header-right { gap:15px; } #user-name { display:none; } .terminal-layout { grid-template-columns:minmax(0,1fr) 235px; } .instrument-title h1 span { display:none; } .chart-sidebar>section { padding:17px; } .admin-main { padding:40px 24px 25px; } .admin-footer { margin:20px 24px; } .member-row { gap:12px; padding:16px; } }
@media(max-width:800px) { .workspace-page { height:auto; min-height:100dvh; } .terminal-layout { display:block; } .chart-workspace { height:calc(100dvh - 100px); min-height:520px; } .chart-sidebar { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); border-left:0; border-top:1px solid var(--app-line); } .signals-panel { border-right:1px solid var(--app-line); } .workspace-footer { height:auto; min-height:30px; } .feed-pill { display:none; } .app-header { gap:28px; } .account-button { gap:5px; } .workspace-nav { gap:18px; } .workspace-nav a { font-size:11px; } .admin-metrics { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .admin-metrics .feed-metric { grid-column:span 2; border-top:1px solid var(--app-line); } .admin-metrics article:nth-child(2) { border-right:0; } .admin-metrics .feed-metric strong { margin-top:5px; } .admin-bottom-grid { gap:24px; } .member-row { grid-template-columns:minmax(0,1.7fr) minmax(0,.8fr) 67px; } .member-row>:nth-child(3),.member-row>:nth-child(4) { display:none; } }
@media(max-width:600px) { .login-layout { display:block; } .login-intro { padding:24px; border-right:0; border-bottom:1px solid var(--app-line); } .intro-copy { padding:36px 0 20px; } .intro-copy h1 { font-size:42px; line-height:1.05; margin:17px 0; } .intro-copy h1 br:nth-child(2) { display:none; } .intro-copy p { font-size:13px; } .login-foot { display:none; } .login-form-wrap { padding:35px 24px; } .login-form-inner { max-width:440px; } .login-form-inner h2 { font-size:28px; } .login-form-inner>.muted { margin-bottom:20px; } .login-disclosure { margin-top:25px; } .app-header { height:60px; padding:0 12px; gap:20px; } .app-header .wordmark { font-size:19px; } .app-header .z-mark { font-size:23px; } .workspace-nav { gap:13px; } .workspace-nav a { font-size:10px; } .account-button>span:last-child { display:none; } .header-right { gap:5px; } .instrument-bar { padding:15px 13px; } .instrument-title { gap:9px; } .gold-tile { width:34px; height:36px; font-size:15px; border-radius:6px; } .instrument-title h1 { font-size:16px; } .instrument-subtitle { font-size:9px; } .quote strong { font-size:18px; } .quote>span { font-size:8px; } .chart-toolbar { padding:7px 8px; flex-wrap:wrap; gap:3px; } .timeframes { flex:1; gap:0; } .timeframes button { padding:8px 9px; font-size:10px; } .toolbar-actions { margin-left:auto; gap:0; } .toolbar-button { padding:7px; font-size:10px; } #fit-chart { display:none; } .ohlc-bar { gap:9px; padding:9px 10px; font-size:8px; } .chart-footnote { padding:6px 10px; font-size:8px; } .chart-footnote>span:first-child { display:none; } .chart-footnote { justify-content:flex-end; } .chart-workspace { min-height:480px; } .chart-sidebar { display:block; } .signals-panel { border-right:0; } .signals-list { max-height:280px; overflow-y:auto; } .chart-sidebar>section { padding:20px; } .workspace-footer { font-size:8px; padding:7px 12px; gap:10px; } .workspace-footer>span:last-child { display:none; } .app-dialog { padding:22px; } .dialog-heading h2 { font-size:23px; } .form-columns { gap:12px; } .admin-main { padding:30px 18px 20px; } .admin-page-heading { align-items:flex-start; flex-direction:column; gap:20px; margin-bottom:25px; } .admin-page-heading h1 { font-size:31px; } .admin-page-heading .muted { font-size:12px; } .admin-page-heading>.button { width:100%; } .admin-metrics { margin-bottom:30px; } .admin-metrics article { padding:17px; } .admin-metrics strong { font-size:28px; } .section-title { align-items:flex-start; flex-wrap:wrap; } .search-field { width:100%; } .member-row { gap:9px; padding:14px 12px; grid-template-columns:minmax(0,1fr) 64px; } .member-row>:nth-child(2) { grid-column:1; margin-left:45px; grid-row:auto; } .member-row .member-manage { grid-column:2; grid-row:1 / span 2; } .table-head { display:none; } .member-row:first-child { border-top:0; } .member-identity { gap:10px; } .member-identity strong { font-size:11px; } .member-identity small { font-size:9px; } .admin-bottom-grid { display:block; margin-top:30px; } .admin-section { margin-bottom:28px; } .activity-section { margin-top:10px; } .admin-footer { margin:10px 18px; font-size:10px; } .admin-page .header-right { display:none; } .admin-page .workspace-nav { margin-left:auto; } }
@media(max-width:350px) { .app-header { gap:13px; } .app-header .wordmark { font-size:17px; } .app-header .wordmark .z-mark { font-size:20px; } .workspace-nav { gap:11px; } .workspace-nav a { font-size:9px; } .avatar { width:25px; height:25px; font-size:9px; } .instrument-subtitle { font-size:8px; } .timeframes button { padding:8px 7px; } .toolbar-button { padding:7px 4px; } .quote strong { font-size:16px; } .wordmark-tag { font-size:8px; margin-left:5px; padding-left:10px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* Reviewed Unslop pass: readable signal metadata; approved chart tokens stay locked. */
.panel-description { color:var(--app-muted); font-size:12px; }
.signal-info small { color:var(--app-muted); font-size:11px; }
.signal-price { font-size:11px; }
.count-tag,.small-tag { font-size:10px; }


.session-settings-section { margin-top:32px; }
.session-settings-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); gap:16px; max-width:760px; }
.session-settings-fields .small-muted { margin-top:8px; }
@media(max-width:600px) { .session-settings-fields { grid-template-columns:minmax(0,1fr); } }

.expand-chart-button { display:inline-flex; align-items:center; gap:6px; }
.expand-chart-button svg { flex:none; }
.toolbar-button[aria-pressed=true] { background:var(--app-accent-soft); color:var(--app-accent-hover); }
.line-history-help { margin-top:-5px; margin-bottom:16px; }
.workspace-page.chart-expanded { height:100dvh; min-height:0; overflow:hidden; }
.chart-expanded .app-header,.chart-expanded .chart-sidebar,.chart-expanded>.workspace-footer { display:none; }
.chart-expanded .chart-workspace { position:fixed; inset:0; z-index:1000; width:100%; height:100dvh; min-height:0; background:var(--chart-paper); }
.chart-expanded .instrument-bar,.chart-expanded .chart-footnote { display:none; }
.chart-expanded .chart-surface { min-height:0; }
.chart-expanded .toast { z-index:1100; }

/* Client-provided logo; crop coordinates preserve the exact supplied image. */
.brand-logo { position:relative; display:block; flex:none; width:166px; aspect-ratio:11 / 3; overflow:hidden; mix-blend-mode:lighten; }
.brand-logo img { position:absolute; left:-9.090909%; top:-63.333333%; width:116.363636%; height:auto; max-width:none; display:block; }
.wordmark { flex-shrink:0; }
.login-intro .brand-logo { width:220px; }
@media(max-width:600px) { .app-header .brand-logo { width:132px; } .login-intro .brand-logo { width:180px; } }
@media(max-width:350px) { .app-header .brand-logo { width:116px; } }

.bubble-size-control { display:grid; grid-template-columns:90px minmax(0,1fr); gap:18px; align-items:center; }
.bubble-size-control input[type=range] { min-height:44px; padding:0; border:0; background:transparent; accent-color:var(--app-accent); cursor:pointer; }

.bubble-fill-labels {display:flex;justify-content:space-between;gap:12px;}
#bubble-fill-preview {display:block;width:100%;height:62px;margin-top:8px;border:1px solid var(--app-line);border-radius:6px;background:var(--chart-paper);}