:root { color-scheme:dark; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; background:#07110f; color:#f3f8f5; --bg:#07110f; --surface:#0d1a17; --surface-2:#11231e; --line:#29443c; --muted:#9db5ad; --green:#69ddb0; --amber:#e4b75c; --red:#ef7777; --blue:#83b7ff; }
* { box-sizing:border-box; }
html { min-width:320px; }
body { margin:0; min-width:320px; min-height:100vh; background:radial-gradient(circle at top right,#183a30 0,var(--bg) 34rem); overflow-x:hidden; }
button,input,select,textarea { font:inherit; }
button { min-width:44px; min-height:44px; border-radius:9px; cursor:pointer; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid #83b7ff88; outline-offset:2px; }
.primary { border:0; background:var(--green); color:#052119; font-weight:800; padding:.72rem 1rem; }
.secondary { border:1px solid #46675d; background:#10231e; color:#f3f8f5; padding:.65rem 1rem; }
.danger { border:1px solid var(--red); background:#581f1f; color:#ffe9e9; font-weight:800; padding:.65rem 1rem; }
.compact-button { min-height:44px; padding:.45rem .8rem; }
.text-button { min-height:44px; border:0; background:transparent; color:var(--green); font-weight:750; padding:.35rem .45rem; }
h1,h2,h3,p { margin-top:0; }
h1 { margin:0; font-size:1.05rem; }
h2 { margin-bottom:.35rem; font-size:clamp(1.55rem,3vw,2.15rem); }
h3 { margin:0; font-size:1rem; }
h3 small { color:var(--muted); font-size:.78rem; font-weight:500; }
.eyebrow { margin:0 0 .22rem; color:var(--green); font-size:.69rem; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }
.muted { color:var(--muted); }
.app-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:70px; padding:.7rem max(1rem,calc((100vw - 100rem)/2)); border-bottom:1px solid var(--line); background:#07110ff2; backdrop-filter:blur(14px); }
.brand,.header-status { display:flex; align-items:center; gap:.75rem; }
.brand-mark { display:grid; place-items:center; width:42px; height:42px; border:1px solid #417363; border-radius:11px; background:#143229; color:var(--green); font-size:.72rem; font-weight:900; }
.header-status form { margin:0; }
.primary-nav { position:sticky; top:70px; z-index:15; display:flex; justify-content:center; gap:.3rem; padding:.45rem 1rem; border-bottom:1px solid var(--line); background:#091511f2; backdrop-filter:blur(14px); }
.nav-item { display:flex; align-items:center; justify-content:center; gap:.42rem; min-height:44px; border:0; border-radius:9px; background:transparent; color:var(--muted); padding:.55rem .9rem; font-weight:750; text-decoration:none; }
.nav-item.active { background:#18342c; color:#fff; box-shadow:inset 0 -2px var(--green); }
.dashboard { width:min(100rem,100%); margin:auto; padding:1rem max(1rem,env(safe-area-inset-right)) calc(4rem + env(safe-area-inset-bottom)); }
.dashboard-view { display:grid; gap:1rem; }
.dashboard-view[hidden] { display:none; }
.page-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; padding:.8rem 0 .15rem; }
.page-heading p:last-child { margin:0; color:var(--muted); }
.clock-block { min-width:15rem; text-align:right; }
.clock-block span,.clock-block small,.clock-block strong { display:block; }
.clock-block span,.clock-block small { color:var(--muted); font-size:.76rem; }
.clock-block strong { margin:.15rem 0; font-variant-numeric:tabular-nums; }
.connection { margin:0 0 .6rem; padding:.58rem .75rem; border-left:3px solid var(--green); background:#0d1a17; color:var(--muted); font-size:.82rem; }
.stale-banner { display:flex; align-items:center; gap:.6rem; margin-bottom:.65rem; padding:.75rem 1rem; border:1px solid #765d29; border-radius:10px; background:#382d16; color:#ffe2a4; }
.stale-banner[hidden] { display:none; }
.panel,.kpi-card { min-width:0; border:1px solid var(--line); border-radius:13px; background:#0d1a17e8; box-shadow:0 12px 38px #0002; }
.panel { padding:1rem; }
.panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:.75rem; }
.panel-heading p { margin:.18rem 0 0; font-size:.82rem; }
.widget-freshness { display:inline-flex; align-items:center; width:max-content; max-width:100%; min-height:26px; border:1px solid #46675d; border-radius:999px; padding:.18rem .5rem; color:#b9cbc5; font-size:.68rem; font-weight:700; white-space:nowrap; }
.widget-freshness.stale { border-color:#80652e; background:#3a2e15; color:#ffe09b; }
.kpi-card .widget-freshness { margin-top:.55rem; color:#b9cbc5; font-size:.65rem; letter-spacing:0; text-transform:none; }
.badge { display:inline-flex; align-items:center; width:max-content; max-width:100%; min-height:26px; border:1px solid #46675d; border-radius:999px; padding:.2rem .58rem; background:#14241f; color:#dbe8e3; font-size:.72rem; font-weight:800; }
.badge.good { border-color:#348468; background:#12382e; color:#9ff0cf; }
.badge.warning { border-color:#80652e; background:#3a2e15; color:#ffe09b; }
.badge.bad { border-color:#8d4141; background:#3c1d1d; color:#ffb0b0; }
.badge.neutral { color:#c3d2cd; }
.kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }
.kpi-card { min-height:120px; padding:1rem; border-top:3px solid #46675d; }
.kpi-card.good { border-top-color:var(--green); }
.kpi-card.warning { border-top-color:var(--amber); }
.kpi-card.bad { border-top-color:var(--red); }
.kpi-card span,.kpi-card strong,.kpi-card small { display:block; }
.kpi-card span { color:var(--muted); font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.kpi-card strong { margin:.45rem 0 .25rem; font-size:1.42rem; font-variant-numeric:tabular-nums; }
.kpi-card small { color:var(--muted); line-height:1.35; }
.overview-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:1rem; }
.action-list,.summary-list,.gate-list,.freshness-list { display:grid; gap:.55rem; }
.action-item,.summary-item,.gate-item,.freshness-item { display:grid; grid-template-columns:auto 1fr auto; align-items:start; gap:.7rem; padding:.7rem; border:1px solid #28463d; border-radius:9px; background:#10201b; }
.action-item strong,.action-item small,.summary-item strong,.summary-item small,.gate-item strong,.gate-item small,.freshness-item strong,.freshness-item small { display:block; }
.action-item small,.summary-item small,.gate-item small,.freshness-item small { margin-top:.16rem; color:var(--muted); line-height:1.35; }
.severity-dot { width:9px; height:9px; margin-top:.35rem; border-radius:999px; background:var(--blue); }
.severity-dot.warning { background:var(--amber); }
.severity-dot.critical { background:var(--red); }
.summary-item,.gate-item,.freshness-item { grid-template-columns:1fr auto; }
.funnel-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.65rem; }
.funnel-step { position:relative; padding:.8rem; border:1px solid var(--line); border-radius:9px; background:#10201b; }
.funnel-step span,.funnel-step strong { display:block; }
.funnel-step span { color:var(--muted); font-size:.75rem; }
.funnel-step strong { margin-top:.25rem; font-size:1.15rem; }
.watchlist-panels { display:grid; grid-template-columns:1fr 1fr 1.35fr; gap:.75rem; align-items:start; }
.watchlist-panel { padding:.8rem; }
.watchlist-header,.watchlist-row { display:grid; gap:.45rem; align-items:center; }
.price-watchlist-columns { grid-template-columns:minmax(0,1fr) 8.5rem; }
.candidate-watchlist-columns { grid-template-columns:minmax(0,1fr) 5rem 6rem 7rem; }
.watchlist-header { padding:.32rem .58rem; color:#829b93; font-size:.67rem; font-weight:850; letter-spacing:.05em; text-transform:uppercase; }
.watchlist-header span:not(:first-child),.watchlist-row span:not(:first-child) { text-align:right; }
.watchlist-table { display:grid; gap:.2rem; }
.watchlist-row { min-height:34px; border-left:3px solid #46675d; border-radius:6px; padding:.38rem .58rem; background:#12201c; font-size:.8rem; font-variant-numeric:tabular-nums; }
.watchlist-row strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.watchlist-row.positive { border-left-color:#42c995; background:#123027; }
.watchlist-row.negative { border-left-color:#df6b6b; background:#321b1b; }
.watchlist-row.neutral { border-left-color:#829b93; }
.table-panel { padding:.8rem; }
.table-wrap { width:100%; max-height:30rem; overflow:auto; border:1px solid var(--line); border-radius:9px; scrollbar-gutter:stable; }
.data-table { width:100%; min-width:62rem; border-collapse:collapse; font-size:.8rem; font-variant-numeric:tabular-nums; }
.data-table th { position:sticky; top:0; z-index:2; padding:.55rem .65rem; background:#11251f; color:#91aaa2; font-size:.68rem; letter-spacing:.055em; text-align:left; text-transform:uppercase; white-space:nowrap; }
.sort-button { display:inline-flex; align-items:center; gap:.35rem; min-width:0; min-height:32px; border:0; border-radius:5px; background:transparent; color:inherit; padding:.18rem .25rem; font:inherit; font-weight:inherit; letter-spacing:inherit; text-transform:inherit; white-space:nowrap; }
.sort-button:hover { background:#1a382f; color:#fff; }
.sort-indicator { color:#6e8c82; font-size:.72rem; }
.mobile-sort { display:none; }
.data-table td { padding:.58rem .65rem; border-top:1px solid #223c34; vertical-align:top; line-height:1.35; }
.data-table tbody tr:hover { background:#12231e; }
.data-table tr.warning td:first-child { box-shadow:inset 3px 0 var(--amber); }
.data-table tr.critical td:first-child,.data-table tr.error td:first-child { box-shadow:inset 3px 0 var(--red); }
.data-table tr.information td:first-child { box-shadow:inset 3px 0 var(--green); }
.cell-stack { display:grid; gap:.1rem; min-width:0; }
.cell-stack strong,.cell-stack span,.cell-stack small { overflow-wrap:anywhere; }
.cell-stack small { color:var(--muted); }
.raw-id { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.72rem; color:#b8cbc4; }
.state-line { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; margin:.15rem 0; }
.empty-state { padding:1.2rem !important; color:var(--muted); text-align:center; }
.table-search { display:grid; grid-template-columns:auto minmax(12rem,18rem); align-items:center; gap:.5rem; margin:0; color:var(--muted); font-size:.78rem; }
.table-search input,.filter-row input,.filter-row select { min-height:44px; }
.filter-row { display:flex; gap:.5rem; }
.filter-row select { width:9rem; }
.filter-row input { width:16rem; }
.table-actions { display:flex; flex-wrap:wrap; gap:.4rem; }
.table-actions button { min-height:44px; padding:.45rem .6rem; white-space:nowrap; }
.result-line { min-height:1.2rem; margin:.6rem 0 0; }
details.inline-details summary,details.settings-snapshot summary { min-height:44px; color:var(--green); cursor:pointer; }
details.inline-details p { max-width:42rem; color:var(--muted); }
.diagnostic-panel { border-color:#69572f; }
.alert-panel,.kill-switch-panel { border-color:#784040; }
.pnl-periods { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem; }
.pnl-period { min-width:0; border-left:3px solid var(--amber); padding:.75rem; background:#181d17; overflow:auto; }
.pnl-period > strong,.pnl-period > span { display:block; }
.pnl-period > span { margin-top:.2rem; color:var(--muted); font-size:.76rem; }
.pnl-table { width:100%; min-width:42rem; margin-top:.55rem; border-collapse:collapse; font-size:.75rem; }
.pnl-table th,.pnl-table td { padding:.35rem .4rem; border-top:1px solid #31453e; text-align:right; white-space:nowrap; }
.pnl-table th:first-child,.pnl-table td:first-child { text-align:left; }
.chart-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.bar-chart { display:grid; gap:.65rem; min-height:8rem; align-content:start; }
.line-chart { min-height:15rem; overflow:hidden; border:1px solid #29443b; border-radius:9px; background:#07110f; }
.line-chart svg { display:block; width:100%; height:15rem; }
.line-chart .chart-grid-line { stroke:#29443b; stroke-width:1; }
.line-chart .chart-zero-line { stroke:#65766f; stroke-width:1; stroke-dasharray:4 4; }
.line-chart .chart-series { fill:none; stroke-width:2.5; vector-effect:non-scaling-stroke; }
.line-chart .chart-axis-label { fill:#8fa39c; font-size:10px; }
.line-chart .chart-legend { display:flex; flex-wrap:wrap; gap:.75rem; padding:.55rem .7rem; color:var(--muted); font-size:.75rem; }
.line-chart .chart-legend span::before { content:''; display:inline-block; width:.7rem; height:.18rem; margin-right:.3rem; vertical-align:middle; background:var(--series-color); }
.chart-row { display:grid; grid-template-columns:minmax(8rem,1fr) minmax(8rem,2.4fr) auto; align-items:center; gap:.65rem; }
.chart-label { min-width:0; overflow:hidden; color:#dbe8e3; font-size:.78rem; text-overflow:ellipsis; white-space:nowrap; }
.chart-track { position:relative; height:1rem; overflow:hidden; border-radius:999px; background:#07110f; }
.chart-bar { position:absolute; top:0; bottom:0; min-width:2px; border-radius:999px; background:var(--green); }
.chart-bar.negative { right:50%; background:var(--red); border-radius:999px 0 0 999px; }
.chart-bar.positive { left:50%; border-radius:0 999px 999px 0; }
.chart-bar.exposure { left:0; background:var(--blue); }
.chart-value { color:#c3d2cd; font-size:.76rem; font-variant-numeric:tabular-nums; text-align:right; }
.detail-dialog { width:min(70rem,calc(100% - 2rem)); }
.dialog-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.detail-section { margin-top:1rem; padding-top:1rem; border-top:1px solid var(--line); }
.detail-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; margin:.7rem 0 0; }
.detail-grid div { min-width:0; padding:.65rem; border:1px solid var(--line); border-radius:8px; background:#10201b; }
.detail-grid dt { color:var(--muted); font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.detail-grid dd { margin:.22rem 0 0; font-weight:750; overflow-wrap:anywhere; }
.kill-switch-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; }
.kill-switch-card { display:grid; gap:.5rem; padding:.85rem; border:1px solid #4d615b; border-radius:9px; background:#101d1a; }
.kill-switch-card small { min-height:2.4rem; color:var(--muted); overflow-wrap:anywhere; }
.kill-switch-card strong.active { color:#ff9a9a; }
.venue-symbol-block-form { display:grid; grid-template-columns:minmax(9rem,.6fr) minmax(14rem,1.4fr) auto; gap:.75rem; align-items:end; margin-bottom:1rem; }
.venue-symbol-block-form button { min-height:44px; }
.owner-symbol-block-table button { min-height:44px; white-space:nowrap; }
.settings-snapshot { margin:.7rem 0; }
.settings-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin:.7rem 0 0; }
.settings-grid div { padding:.6rem; border:1px solid var(--line); border-radius:8px; background:#10201b; }
.settings-grid dt { color:var(--muted); font-size:.73rem; }
.settings-grid dd { margin:.2rem 0 0; font-weight:700; overflow-wrap:anywhere; }
.settings-form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; margin-top:1rem; padding-top:1rem; border-top:1px solid var(--line); }
label { display:block; font-weight:700; }
input,select,textarea { width:100%; min-height:44px; margin-top:.38rem; border:1px solid #46675d; border-radius:9px; background:#07110f; color:#fff; padding:.67rem; }
textarea { min-height:7rem; resize:vertical; }
.check-row { display:flex; align-items:center; gap:.6rem; min-height:44px; }
.check-row input,.dialog-confirmation input { width:44px; min-width:44px; margin:0; accent-color:var(--green); }
.settings-note,.sticky-save { grid-column:1/-1; }
.sticky-save { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.65rem 0; }
.credential-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.credential-panel button { margin-top:.8rem; }
dialog { width:min(36rem,calc(100% - 2rem)); max-height:calc(100vh - 2rem); overflow:auto; border:1px solid #6f3535; border-radius:13px; background:#0d1a17; color:#f4f8f5; padding:1.2rem; }
dialog::backdrop { background:#000c; }
dialog label { margin-top:1rem; }
.dialog-actions { display:flex; justify-content:flex-end; gap:.65rem; margin-top:1.2rem; }
.dialog-confirmation { display:grid; grid-template-columns:44px 1fr; align-items:center; gap:.65rem; }
.login-page,.startup-page { display:grid; place-items:center; padding:1rem; }
.login-card,.startup-card { width:min(100%,42rem); padding:clamp(1.2rem,5vw,2.3rem); border:1px solid var(--line); border-radius:16px; background:#0d1a17f5; box-shadow:0 24px 80px #0008; }
.login-card { max-width:28rem; }
.password-row { display:grid; grid-template-columns:1fr auto; gap:.5rem; }
.full { width:100%; margin-top:1rem; }
.error { border:1px solid var(--red); border-radius:9px; background:#3b1717; color:#ffd6d6; padding:.8rem; }
.startup-progress { height:.75rem; margin:1.5rem 0 1.1rem; overflow:hidden; border:1px solid #38564c; border-radius:999px; background:#06110e; }
.startup-progress span { display:block; width:0; height:100%; background:linear-gradient(90deg,#2e9876,#d6a84b); transition:width .25s ease; }
.startup-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; }
.startup-stats div { padding:.7rem; border:1px solid var(--line); border-radius:9px; background:#10201b; }
.startup-stats span,.startup-stats strong { display:block; }
.startup-stats span,.startup-note { color:var(--muted); font-size:.78rem; }
@media (max-width:1100px) {
  .kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .watchlist-panels { grid-template-columns:1fr 1fr; }
  .signal-candidate-panel { grid-column:1/-1; }
  .pnl-periods { grid-template-columns:1fr; }
  .detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .settings-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:800px) {
  body { padding-bottom:calc(66px + env(safe-area-inset-bottom)); }
  .app-header { min-height:62px; padding:.55rem .75rem; }
  .brand-mark { width:38px; height:38px; }
  .header-status > .badge { display:none; }
  .primary-nav { position:fixed; top:auto; right:0; bottom:0; left:0; z-index:30; display:grid; grid-template-columns:repeat(6,1fr); gap:0; padding:.25rem max(.25rem,env(safe-area-inset-right)) calc(.25rem + env(safe-area-inset-bottom)); border-top:1px solid var(--line); border-bottom:0; }
  .nav-item { display:grid; gap:.1rem; min-width:0; min-height:58px; padding:.25rem .1rem; border-radius:5px; font-size:.66rem; }
  .nav-item span { font-size:1rem; }
  .dashboard { padding:.7rem .65rem 1.5rem; }
  .page-heading { align-items:flex-start; }
  .clock-block { min-width:0; }
  .overview-grid,.watchlist-panels,.credential-grid,.chart-grid { grid-template-columns:1fr; }
  .signal-candidate-panel { grid-column:auto; }
  .funnel-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .settings-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kill-switch-grid { grid-template-columns:1fr; }
  .venue-symbol-block-form { grid-template-columns:1fr; }
  .table-panel { padding:.7rem; }
  .table-wrap { max-height:none; overflow:visible; border:0; }
  .data-table { display:block; min-width:0; }
  .data-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .mobile-sort { display:grid; grid-template-columns:auto minmax(10rem,1fr); align-items:center; gap:.55rem; margin:.35rem 0 .65rem; color:var(--muted); font-size:.75rem; }
  .mobile-sort select { margin:0; }
  .data-table tbody,.data-table tr,.data-table td { display:block; width:100%; }
  .data-table tbody { display:grid; gap:.65rem; }
  .data-table tr { overflow:hidden; border:1px solid var(--line); border-radius:9px; background:#10201b; }
  .data-table td { display:grid; grid-template-columns:minmax(6.5rem,35%) minmax(0,1fr); gap:.6rem; padding:.52rem .65rem; border-top:1px solid #223c34; overflow-wrap:anywhere; }
  .data-table td:first-child { border-top:0; }
  .data-table td::before { content:attr(data-label); color:#88a199; font-size:.67rem; font-weight:850; letter-spacing:.045em; text-transform:uppercase; }
  .data-table td[colspan] { display:block; }
  .data-table td[colspan]::before { content:none; }
  .table-search { grid-template-columns:1fr; width:100%; }
  .filter-row { width:100%; }
  .filter-row input { min-width:0; width:100%; }
  .panel-heading { flex-wrap:wrap; }
  .settings-grid { grid-template-columns:1fr; }
  .detail-grid { grid-template-columns:1fr 1fr; }
  .sticky-save { position:sticky; bottom:66px; z-index:4; margin:0 -.4rem; padding:.65rem; border:1px solid var(--line); border-radius:9px; background:#0b1814f5; }
}
@media (max-width:520px) {
  .kpi-grid { grid-template-columns:1fr 1fr; gap:.55rem; }
  .kpi-card { min-height:108px; padding:.75rem; }
  .kpi-card strong { font-size:1.13rem; }
  .page-heading { display:block; }
  .clock-block { margin-top:.65rem; text-align:left; }
  .stale-banner { display:grid; gap:.2rem; }
  .candidate-watchlist-columns { grid-template-columns:minmax(3.5rem,1fr) minmax(3.5rem,.8fr) minmax(4.2rem,.9fr) minmax(4.8rem,1fr); }
  .watchlist-header { font-size:.59rem; }
  .watchlist-row { font-size:.73rem; }
  .settings-form { grid-template-columns:1fr; }
  .dialog-actions { flex-direction:column-reverse; }
  .dialog-actions button { width:100%; }
  .filter-row { display:grid; grid-template-columns:1fr; }
  .filter-row select { width:100%; }
  .chart-row { grid-template-columns:minmax(6rem,1fr) minmax(7rem,1.5fr); }
  .chart-value { grid-column:2; }
  .detail-grid { grid-template-columns:1fr; }
  .dialog-heading { display:grid; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; transition:none !important; } }