:root {
 --bg-0: #050507;
 --bg-1: #0a0a0f;
 --bg-2: #101018;
 --bg-3: #161624;
 --bg-4: #1f1f2d;
 --line: #1c1c28;
 --line-bright: #2a2a3a;
 --line-amber: rgba(34, 211, 238, 0.22);
 --silver-bright: #eef1f7;
 --silver: #b8bfcc;
 --ink-1: #8891a2;
 --ink-2: #5d6576;
 --ink-3: #3d4452;
 --amber: #22d3ee;
 --amber-bright: #67e8f9;
 --amber-dim: rgba(34, 211, 238, 0.18);
 --amber-glow: rgba(34, 211, 238, 0.45);
 --green: #7aaa87;
 --red: #c26565;
 --f-mono: 'Comfortaa', system-ui, monospace;
 --f-display: 'Inter', system-ui, sans-serif;
 --topbar-h: 56px;
 --fkey-h: 32px;
 --status-h: 30px;
 --rail-w: 54px;
 --navi-w: 280px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
 height: 100%;
 background: var(--bg-0);
 color: var(--silver);
 font-family: var(--f-mono);
 font-weight: 400;
 font-size: 12px;
 font-feature-settings: 'tnum' 1, 'cv11' 1;
 line-height: 1.55;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 overflow: hidden;
}
body {
 display: flex;
 flex-direction: column;
 position: relative;
 background:
 radial-gradient(ellipse 70% 50% at 50% 30%, rgba(14, 22, 40, 0.7) 0%, transparent 60%),
 radial-gradient(ellipse 60% 60% at 80% 80%, rgba(20, 15, 35, 0.4) 0%, transparent 60%),
 var(--bg-0);
}
body::before {
 content: '';
 position: fixed;
 inset: 0;
 z-index: 1;
 pointer-events: none;
 opacity: 0.06;
 mix-blend-mode: overlay;
 background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.82 0 0 0 0 0.93 0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
body > * { position: relative; z-index: 2; }
a { color: inherit; text-decoration: none; }
b, strong { font-weight: 600; color: var(--silver-bright); }
button, input { font-family: inherit; font-size: inherit; color: inherit; }
.mono { font-variant-numeric: tabular-nums; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: var(--bg-0); }
*::-webkit-scrollbar-thumb { background: var(--bg-3); border: 1px solid var(--line); }
*::-webkit-scrollbar-thumb:hover { background: var(--amber-dim); }
*::-webkit-scrollbar-corner { background: var(--bg-0); }
.cmdbar {
 height: var(--topbar-h);
 background: rgba(5, 5, 7, 0.88);
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px);
 border-bottom: 1px solid var(--line);
 display: flex;
 align-items: center;
 padding: 0 28px;
 flex-shrink: 0;
 gap: 24px;
}
.cmd-brand {
 display: inline-flex;
 align-items: baseline; 
 gap: 4px;
 flex-shrink: 0;
 text-decoration: none;
 line-height: 1;
 color: var(--silver-bright);
 cursor: pointer;
}
.cmd-brand .brand-bold {
 font-family: var(--f-display);
 font-weight: 900;
 font-size: 28px;
 letter-spacing: -0.02em;
 color: var(--silver-bright);
}
.cmd-brand .brand-dot {
 display: inline-block;
 width: 10px;
 height: 10px;
 border-radius: 50%;
 background: var(--amber);
 box-shadow: 0 0 12px var(--amber-glow);
 animation: pulse 2.4s ease-in-out infinite;
 flex-shrink: 0;
 margin-left: 4px;
 align-self: baseline;
}
.cmd-brand .brand-thin {
 font-family: var(--f-display);
 font-weight: 200;
 font-size: 10px;
 letter-spacing: 0.32em;
 text-transform: uppercase;
 color: var(--ink-1);
 margin-left: 14px;
 white-space: nowrap;
 align-self: baseline;
}
@keyframes pulse {
 0%, 100% { box-shadow: 0 0 6px var(--amber-glow); transform: scale(1); }
 50% { box-shadow: 0 0 14px var(--amber); transform: scale(1.18); }
}
.cmd-input-wrap {
 flex: 1;
 display: flex;
 align-items: center;
 gap: 10px;
 padding: 0 16px;
 border-left: 1px solid var(--line);
 border-right: 1px solid var(--line);
 height: 100%;
}
.cmd-prompt {
 font-family: var(--f-mono);
 color: var(--amber);
 font-size: 12px;
}
.cmd-input {
 flex: 1;
 background: transparent;
 border: none;
 outline: none;
 color: var(--silver-bright);
 font-family: var(--f-mono);
 font-size: 11px;
 letter-spacing: 0.06em;
 text-transform: uppercase;
}
.cmd-input::placeholder { color: var(--ink-2); }
.cmd-cursor {
 display: inline-block;
 width: 7px;
 height: 12px;
 background: var(--amber);
 animation: blink 1.1s steps(2, start) infinite;
 vertical-align: -1px;
 box-shadow: 0 0 4px var(--amber-glow);
}
@keyframes blink { to { background: transparent; } }
.cmd-go {
 background: transparent;
 color: var(--amber);
 border: 1px solid var(--amber-dim);
 border-radius: 2px;
 padding: 4px 10px;
 font-family: var(--f-mono);
 font-size: 10px;
 font-weight: 600;
 letter-spacing: 0.18em;
 cursor: pointer;
 transition: background 0.18s, color 0.18s, border-color 0.18s;
}
.cmd-go:hover { background: var(--amber); color: var(--bg-0); border-color: var(--amber); }
.cmd-status {
 display: flex;
 align-items: center;
 gap: 18px;
 flex-shrink: 0;
}
.cmd-status .item {
 display: inline-flex;
 align-items: center;
 gap: 7px;
 font-size: 9.5px;
 letter-spacing: 0.20em;
 text-transform: uppercase;
}
.cmd-status .label { color: var(--ink-1); }
.cmd-status .val { color: var(--silver-bright); }
.cmd-status .val.ok { color: var(--green); }
.cmd-status .val.warn { color: var(--amber); }
.cmd-status .val.err { color: var(--red); }
.cmd-status .val.run { color: var(--amber); }
#cls-credits-wrap { cursor: pointer; transition: opacity 140ms; }
#cls-credits-wrap:hover { opacity: 0.8; }
#cls-credits.low { color: var(--red); }
#cls-credits.unlimited { color: var(--amber-bright); }
#cls-plan { letter-spacing: 0.12em; }
.cmd-logout {
 display: inline-block;
 text-decoration: none;
 margin-left: 14px;
 padding: 5px 12px;
 background: transparent;
 border: 1px solid var(--line-bright);
 color: var(--ink-1);
 font-family: var(--f-display);
 font-weight: 300;
 font-size: 9px;
 letter-spacing: 0.32em;
 text-transform: uppercase;
 cursor: pointer;
 transition: color 140ms, border-color 140ms, background 140ms;
}
.cmd-logout:hover {
 color: var(--amber-bright);
 border-color: var(--amber);
 background: var(--amber-dim);
}
.tickertape {
 height: var(--status-h);
 background: var(--bg-1);
 border-bottom: 1px solid var(--line);
 overflow: hidden;
 position: relative;
 flex-shrink: 0;
 display: flex;
 align-items: center;
}
.tickertape-track {
 display: flex;
 align-items: center;
 gap: 28px;
 padding-left: 100%;
 white-space: nowrap;
 animation: tickermove 90s linear infinite;
 font-size: 10px;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 color: var(--ink-1);
}
@keyframes tickermove {
 from { transform: translateX(0); }
 to { transform: translateX(-100%); }
}
.tk-item { display: inline-flex; gap: 8px; align-items: center; }
.tk-item .tk { color: var(--amber); }
.tk-item .px { color: var(--silver); }
.tk-item .chg.up { color: var(--green); }
.tk-item .chg.dn { color: var(--red); }
.tk-item .chg.down { color: var(--red); }
.tk-item .sep { color: var(--ink-3); }
.fbar {
 display: flex;
 align-items: stretch;
 background: transparent;
 border-bottom: 1px solid var(--line);
 flex-shrink: 0;
 height: 44px;
 padding: 0 28px;
 gap: 22px;
}
.fbar .f-page,
.fbar .f-mode {
 display: flex;
 align-items: center;
 font-size: 9.5px;
 letter-spacing: 0.26em;
 text-transform: uppercase;
 color: var(--ink-2);
 flex-shrink: 0;
}
.fbar .f-page { color: var(--amber); }
.fbar .f-tabs {
 display: flex;
 align-items: stretch;
 gap: 22px;
}
.fbar .f-tab {
 background: transparent;
 border: none;
 color: var(--ink-1);
 font-size: 10px;
 letter-spacing: 0.26em;
 text-transform: uppercase;
 cursor: pointer;
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 0;
 position: relative;
 transition: color 0.18s;
 font-family: var(--f-mono);
}
.fbar .f-tab:hover { color: var(--silver-bright); }
.fbar .f-tab.active { color: var(--amber); }
.fbar .f-tab.active::after {
 content: '';
 position: absolute;
 left: 0; right: 0; bottom: -2px;
 height: 1px;
 background: var(--amber);
}
.fbar .f-tab .f-num { color: var(--amber); font-weight: 600; opacity: 0.7; }
.fbar .f-tab.active .f-num { opacity: 1; }
.fbar .f-tab .tb-count {
 padding: 1px 5px;
 background: var(--bg-3);
 color: var(--ink-1);
 font-size: 9px;
 border-radius: 2px;
 letter-spacing: 0.10em;
}
.fbar .f-tab.active .tb-count { background: var(--amber-dim); color: var(--amber-bright); }
.fbar .f-actions {
 margin-left: auto;
 display: flex;
 align-items: center;
 gap: 12px;
}
.fbar .filter-chip {
 display: inline-flex;
 align-items: center;
 padding: 4px 10px;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 background: var(--bg-1);
 font-size: 9px;
 letter-spacing: 0.20em;
 text-transform: uppercase;
 gap: 7px;
}
.fbar .filter-chip .ch-k { color: var(--ink-1); }
.fbar .filter-chip .ch-v { color: var(--silver-bright); font-family: var(--f-mono); }
.fbar .filter-chip.alt { border-color: var(--line-amber); }
.fbar .filter-chip.alt .ch-v { color: var(--amber); }
.classification, .appbar, .tabbar { display: none !important; }
.shell {
 flex: 1;
 display: grid;
 grid-template-columns: var(--rail-w) var(--navi-w) 1fr;
 grid-template-rows: 1fr;
 background: transparent;
 overflow: hidden;
 min-height: 0;
}
.shell > * { min-height: 0; min-width: 0; }
.rail {
 background: var(--bg-1);
 display: flex;
 flex-direction: column;
 align-items: center;
 padding: 16px 0;
 gap: 4px;
 border-right: 1px solid var(--line);
}
.rl {
 width: 36px;
 height: 36px;
 background: transparent;
 border: 1px solid transparent;
 border-radius: 2px;
 color: var(--ink-2);
 display: flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 transition: color 0.18s, background 0.18s, border-color 0.18s;
}
.rl:hover { color: var(--silver-bright); background: var(--bg-3); }
.rl.active {
 color: var(--amber);
 background: var(--amber-dim);
 border-color: var(--line-amber);
}
.rl-sep { width: 24px; height: 1px; background: var(--line-bright); margin: 6px 0; }
.navi {
 background: var(--bg-1);
 overflow-y: auto;
 display: flex;
 flex-direction: column;
 border-right: 1px solid var(--line);
}
.card, .panel {
 background: var(--bg-1);
 display: flex;
 flex-direction: column;
 flex-shrink: 0;
 border-bottom: 1px solid var(--line);
}
.card.grow, .panel.grow { flex: 1 1 auto; min-height: 0; }
.card-hd, .panel-hd {
 display: flex;
 align-items: center;
 justify-content: space-between;
 height: 36px;
 padding: 0 16px;
 background: transparent;
 border-bottom: 1px solid var(--line);
 position: relative;
}
.card-hd::before, .panel-hd::before {
 content: '';
 position: absolute;
 left: 16px;
 top: 50%;
 width: 16px;
 height: 1px;
 background: var(--amber);
 transform: translateY(-50%);
}
.hd-l {
 display: flex;
 align-items: center;
 gap: 10px;
 padding-left: 24px; 
}
.hd-title {
 font-size: 9.5px;
 letter-spacing: 0.26em;
 text-transform: uppercase;
 color: var(--silver-bright);
 font-weight: 500;
}
.hd-id, .panel-id {
 font-size: 9px;
 color: var(--amber);
 letter-spacing: 0.16em;
 font-family: var(--f-mono);
}
.hd-tag {
 font-size: 9px;
 color: var(--amber);
 background: var(--amber-dim);
 padding: 2px 6px;
 border: 1px solid var(--line-amber);
 border-radius: 2px;
 letter-spacing: 0.14em;
 text-transform: uppercase;
}
.hd-r { display: flex; align-items: center; gap: 10px; }
.hd-count {
 font-size: 10px;
 color: var(--silver-bright);
 padding: 2px 8px;
 background: var(--bg-3);
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 letter-spacing: 0.10em;
 font-family: var(--f-mono);
}
.icon-btn {
 background: transparent;
 border: 1px solid transparent;
 color: var(--ink-2);
 width: 22px;
 height: 22px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 border-radius: 2px;
 transition: color 0.18s, border-color 0.18s, background 0.18s;
}
.icon-btn:hover { color: var(--amber); border-color: var(--line-amber); background: var(--amber-dim); }
.card-bd, .panel-bd {
 padding: 14px 16px;
 overflow-y: auto;
 flex: 1;
 min-height: 0;
}
.card-bd.no-pad, .panel-bd.no-pad { padding: 0; }
.dot { display: none; }
.field-row {
 display: grid;
 grid-template-columns: 100px 1fr;
 align-items: center;
 gap: 12px;
 margin-bottom: 12px;
}
.fr-label {
 font-size: 9px;
 color: var(--ink-1);
 letter-spacing: 0.24em;
 text-transform: uppercase;
}
.seg {
 display: grid;
 grid-template-columns: 1fr 1fr 1fr;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 overflow: hidden;
}
.seg-btn {
 background: var(--bg-2);
 color: var(--ink-1);
 border: none;
 border-right: 1px solid var(--line);
 padding: 6px 2px;
 font-size: 10px;
 letter-spacing: 0.06em; 
 text-transform: uppercase;
 cursor: pointer;
 transition: background 0.18s, color 0.18s;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 min-width: 0;
 text-align: center;
}
.seg-btn:last-child { border-right: none; }
.seg-btn:hover { color: var(--silver-bright); background: var(--bg-3); }
.seg-btn.active { background: var(--amber-dim); color: var(--amber-bright); }
.num-row {
 display: grid;
 grid-template-columns: 28px 1fr 28px;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 overflow: hidden;
}
.num-row input {
 background: var(--bg-2);
 border: none;
 text-align: center;
 color: var(--silver-bright);
 padding: 6px;
 font-family: var(--f-mono);
 font-size: 13px;
 -moz-appearance: textfield;
}
.num-row input::-webkit-outer-spin-button,
.num-row input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.step-btn {
 background: var(--bg-3);
 color: var(--ink-1);
 border: none;
 cursor: pointer;
 transition: background 0.18s, color 0.18s;
}
.step-btn:hover { background: var(--amber-dim); color: var(--amber-bright); }
.btn-row { display: grid; grid-template-columns: 1fr; gap: 6px; margin-top: 12px; }
.prim-btn {
 background: var(--amber);
 color: var(--bg-0);
 border: 1px solid var(--amber);
 border-radius: 2px;
 padding: 9px 12px;
 font-family: var(--f-display);
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.22em;
 text-transform: uppercase;
 cursor: pointer;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 9px;
 box-shadow: 0 0 0 1px var(--amber-dim);
 transition: background 0.18s, box-shadow 0.18s;
}
.prim-btn:hover { background: var(--amber-bright); box-shadow: 0 0 12px var(--amber-glow); }
.prim-btn:disabled {
 background: var(--bg-3);
 color: var(--ink-2);
 border-color: var(--line-bright);
 cursor: not-allowed;
 box-shadow: none;
}
.ghost-btn {
 background: transparent;
 color: var(--ink-1);
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 padding: 6px 12px;
 font-size: 9.5px;
 letter-spacing: 0.20em;
 text-transform: uppercase;
 cursor: pointer;
 font-family: var(--f-mono);
}
.ghost-btn:hover:not(:disabled) { color: var(--red); border-color: var(--red); }
.ghost-btn:disabled { color: var(--ink-3); cursor: not-allowed; }
.kv-list { display: flex; flex-direction: column; }
.kvr {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 4px 0;
 font-size: 10.5px;
}
.kvr span {
 color: var(--ink-1);
 letter-spacing: 0.18em;
 text-transform: uppercase;
 font-size: 9.5px;
}
.kvr b { color: var(--silver-bright); font-weight: 500; }
.trunc { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pipe-v { display: flex; flex-direction: column; gap: 4px; }
.phase {
 display: grid;
 grid-template-columns: 10px 1fr auto;
 align-items: center;
 gap: 10px;
 padding: 7px 10px;
 border: 1px solid var(--line);
 border-radius: 2px;
 background: var(--bg-2);
 font-family: var(--f-mono);
}
.phase i {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: var(--ink-3);
}
.ph-name {
 font-size: 10px;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 color: var(--ink-1);
}
.ph-meta {
 font-size: 9px;
 color: var(--ink-2);
 letter-spacing: 0.10em;
}
.phase.active { border-color: var(--line-amber); background: var(--amber-dim); }
.phase.active .ph-name { color: var(--amber-bright); }
.phase.active i { background: var(--amber); box-shadow: 0 0 6px var(--amber-glow); animation: pulse 1.4s ease-in-out infinite; }
.phase.done { border-color: rgba(122, 170, 135, 0.3); }
.phase.done .ph-name { color: var(--green); }
.phase.done i { background: var(--green); }
.watchlists { list-style: none; }
.watchlists li {
 display: grid;
 grid-template-columns: 16px 1fr 28px;
 align-items: center;
 gap: 10px;
 padding: 7px 16px;
 border-bottom: 1px solid var(--line);
 cursor: pointer;
 transition: background 0.18s;
}
.watchlists li:hover { background: var(--bg-2); }
.wl-icon { color: var(--amber); font-size: 10px; }
.wl-name { font-size: 10.5px; color: var(--silver); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wl-count { color: var(--ink-1); font-size: 10px; text-align: right; font-family: var(--f-mono); }
.canvas {
 background: transparent;
 display: flex;
 flex-direction: column;
 min-height: 0;
 overflow: hidden;
 position: relative;
}
.view {
 display: none;
 flex: 1;
 min-height: 0;
 overflow: hidden;
}
.view.active { display: flex; flex-direction: column; }
.view-toolbar {
 height: 38px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 0 24px;
 background: transparent;
 border-bottom: 1px solid var(--line);
 flex-shrink: 0;
}
.view-title {
 font-size: 10px;
 color: var(--silver-bright);
 letter-spacing: 0.26em;
 text-transform: uppercase;
 display: flex;
 align-items: center;
 gap: 14px;
}
.view-title .vt-id { color: var(--amber); font-family: var(--f-mono); }
.view-title::before {
 content: '';
 width: 20px;
 height: 1px;
 background: var(--amber);
}
.view-actions { display: flex; align-items: center; gap: 10px; }
.view-actions .ab-btn,
.fbar .ab-btn {
 background: transparent;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 color: var(--ink-1);
 padding: 5px 12px;
 font-size: 10px;
 letter-spacing: 0.20em;
 text-transform: uppercase;
 cursor: pointer;
 font-family: var(--f-mono);
 transition: color 0.18s, border-color 0.18s, background 0.18s;
}
.view-actions .ab-btn:hover, .fbar .ab-btn:hover {
 color: var(--amber);
 border-color: var(--line-amber);
 background: var(--amber-dim);
}
.view-body {
 flex: 1;
 min-height: 0;
 overflow: auto;
 padding: 20px;
 background: transparent;
}
.view-body.no-pad { padding: 0; }
.view-scan.active {
 display: grid;
 grid-template-columns: 1fr 1fr;
 grid-template-rows: auto minmax(180px, 0.9fr) minmax(380px, 2.6fr);
 gap: 1px;
 background: var(--line);
 min-height: 0;
 overflow: hidden;
}
.canvas-row { display: flex; min-height: 0; min-width: 0; background: var(--bg-1); }
.canvas-row.top-row { grid-column: 1 / -1; grid-row: 1; flex: 0 0 auto; }
.canvas-row.mid-row { grid-column: 1 / -1; grid-row: 2; gap: 1px; background: var(--line); }
.canvas-row.bot-row { grid-column: 1 / -1; grid-row: 3; background: var(--bg-1); }
.canvas-row.mid-row > * { flex: 1 1 0; min-width: 0; }
.canvas-row.top-row > * { border-right: 1px solid var(--line); }
.canvas-row.top-row > *:last-child { border-right: none; }
.kpi {
 flex: 1;
 background: var(--bg-1);
 padding: 16px 20px;
 display: flex;
 flex-direction: column;
 gap: 6px;
 position: relative;
 overflow: hidden;
 min-height: 100px;
}
.kpi-k {
 font-family: var(--f-mono);
 font-size: 9px;
 letter-spacing: 0.26em;
 text-transform: uppercase;
 color: var(--ink-1);
}
.kpi-v {
 font-family: var(--f-display);
 font-size: 30px;
 font-weight: 300;
 color: var(--silver-bright);
 letter-spacing: -0.02em;
 line-height: 1;
}
.kpi-v.small { font-size: 18px; font-weight: 400; }
.kpi.accent .kpi-v { color: var(--amber); }
.kpi-d {
 font-size: 9.5px;
 color: var(--ink-2);
 letter-spacing: 0.08em;
}
.terminal {
 background: var(--bg-0);
 padding: 14px 18px;
 font-size: 11px;
 line-height: 1.6;
 font-family: var(--f-mono);
}
.stream-line {
 display: grid;
 grid-template-columns: 64px 60px 1fr;
 gap: 12px;
 align-items: baseline;
 padding: 3px 0;
}
.stream-line .ts { color: var(--ink-2); font-size: 10px; }
.stream-line .tag {
 font-size: 9px;
 padding: 1px 7px;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 text-align: center;
 color: var(--ink-1);
 letter-spacing: 0.16em;
 text-transform: uppercase;
}
.stream-line .msg {
 color: var(--silver);
 white-space: pre-wrap;
 word-break: break-word;
 font-size: 11px;
}
.tag-sys { color: var(--ink-1); border-color: var(--line-bright); }
.tag-step { color: var(--amber); border-color: var(--line-amber); background: var(--amber-dim); }
.tag-thought { color: var(--silver-bright); border-color: var(--line-bright); }
.tag-prog { color: var(--ink-1); border-color: var(--line-bright); }
.tag-score { color: var(--amber); border-color: var(--line-amber); }
.tag-err { color: var(--red); border-color: var(--red); }
.tag-final { color: var(--green); border-color: var(--green); }
.stream-line.stream-step .msg { color: var(--amber-bright); }
.stream-line.stream-thought .msg { color: var(--silver-bright); }
.stream-line.stream-error .msg { color: var(--red); }
.legend { display: inline-flex; align-items: center; gap: 4px; color: var(--ink-2); font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; }
.legend .lg { width: 8px; height: 8px; display: inline-block; border-radius: 50%; }
.lg-step { background: var(--amber); box-shadow: 0 0 6px var(--amber-glow); }
.lg-thought { background: var(--silver-bright); }
.lg-prog { background: var(--ink-1); }
.lg-score { background: var(--amber); }
.data-table {
 width: 100%;
 border-collapse: collapse;
 font-size: 10.5px;
}
.data-table thead th {
 position: sticky;
 top: 0;
 background: var(--bg-2);
 color: var(--ink-1);
 text-align: left;
 padding: 8px 14px;
 font-weight: 500;
 font-size: 9px;
 letter-spacing: 0.22em;
 text-transform: uppercase;
 border-bottom: 1px solid var(--line-amber);
 z-index: 1;
}
.data-table tbody tr {
 border-bottom: 1px solid var(--line);
 transition: background 0.12s;
}
.data-table tbody tr:hover { background: var(--bg-2); }
.data-table tbody tr.empty td {
 padding: 22px 18px;
 color: var(--ink-2);
 font-style: italic;
 text-align: center;
 font-size: 11px;
}
.data-table td { padding: 7px 14px; vertical-align: middle; color: var(--silver); }
.data-table td.rk { color: var(--ink-2); }
.data-table td.tk { color: var(--amber); font-weight: 500; letter-spacing: 0.04em; }
.data-table td.sc { color: var(--silver-bright); font-weight: 500; text-align: right; font-family: var(--f-mono); }
.data-table td.sc.hot { color: var(--amber-bright); }
.data-table td.sc.cold { color: var(--ink-2); }
.data-table td.rs { color: var(--silver); max-width: 380px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; }
.data-table td.num { text-align: right; font-family: var(--f-mono); }
.data-table .num.hot { color: var(--amber-bright); }
.w-rk { width: 32px; }
.w-tk { width: 60px; }
.w-sc { width: 50px; text-align: right; }
.w-bar { width: 70px; }
.dbar {
 height: 4px;
 background: var(--bg-3);
 border-radius: 2px;
 overflow: hidden;
}
.dbar i {
 display: block;
 height: 100%;
 background: linear-gradient(90deg, var(--amber-dim), var(--amber));
}
.badge {
 font-size: 9px;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 padding: 2px 8px;
 border: 1px solid;
 border-radius: 2px;
 font-family: var(--f-mono);
}
.badge.ok { color: var(--green); border-color: var(--green); }
.badge.warn { color: var(--amber); border-color: var(--line-amber); }
.badge.fail { color: var(--red); border-color: var(--red); }
.hist-table tbody tr[data-run-id] { cursor: pointer; }
.hist-table tbody tr[data-run-id]:hover { background: var(--bg-2); }
.hist-table .hist-nm { color: var(--silver); font-size: 9.5px; margin-left: 6px; letter-spacing: 0.05em; }
.view-scan .bot-row .dossier-strip {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(440px, 1fr));
 grid-auto-rows: minmax(380px, max-content);
 gap: 1px;
 width: 100%;
 height: 100%;
 background: var(--line);
 overflow-x: hidden;
 overflow-y: auto;
 align-content: start;
}
.view-scan .bot-row .dossier {
 background: var(--bg-1);
 display: flex;
 flex-direction: column;
 min-height: 0;
 min-width: 0;
}
@media (max-width: 920px) {
 .view-scan .bot-row .dossier-strip {
 grid-template-columns: 1fr;
 }
}
.dos-hd {
 display: grid;
 grid-template-columns: 10px auto 1fr auto auto;
 align-items: center;
 gap: 12px;
 padding: 12px 18px;
 background: var(--bg-2);
 border-bottom: 1px solid var(--line);
}
.dos-pin {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: var(--amber);
 box-shadow: 0 0 6px var(--amber-glow);
 animation: pulse 1.6s ease-in-out infinite;
}
.dos-pin.done { background: var(--green); box-shadow: 0 0 6px rgba(122,170,135,0.5); animation: none; }
.dos-tk {
 color: var(--silver-bright);
 font-family: var(--f-display);
 font-weight: 600;
 font-size: 14px;
 letter-spacing: 0.06em;
}
.dos-nm {
 color: var(--ink-1);
 font-size: 11px;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}
.dos-cls {
 font-size: 9px;
 color: var(--amber);
 letter-spacing: 0.16em;
 text-transform: uppercase;
 padding: 2px 7px;
 border: 1px solid var(--line-amber);
 border-radius: 2px;
}
.dos-sc {
 font-family: var(--f-mono);
 font-size: 13px;
 font-weight: 500;
 color: var(--amber);
 padding: 2px 10px;
 border: 1px solid var(--line-amber);
 border-radius: 2px;
 background: var(--amber-dim);
}
.dos-sg {
 font-family: var(--f-mono);
 font-size: 11.5px;
 font-weight: 600;
 padding: 2px 7px;
 border: 1px solid var(--line);
 border-radius: 2px;
 background: var(--bg-2);
 color: var(--ink-1);
 letter-spacing: 0.04em;
 cursor: help;
}
.dos-sg.sigma-hot { color: var(--amber-bright); border-color: var(--amber-bright); background: rgba(34, 211, 238, 0.12); box-shadow: 0 0 8px rgba(34, 211, 238, 0.25); }
.dos-sg.sigma-warm { color: var(--amber); border-color: var(--line-amber); background: var(--amber-dim); }
.dos-sg.sigma-neutral { color: var(--silver); border-color: var(--line-bright); }
.dos-sg.sigma-cold { color: var(--red); border-color: rgba(194, 101, 101, 0.4); background: rgba(194, 101, 101, 0.08); }
.dos-stats {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 border-bottom: 1px solid var(--line);
}
.dos-stats > div {
 padding: 8px 12px;
 border-right: 1px solid var(--line);
}
.dos-stats > div:nth-child(3n) { border-right: none; }
.dos-stats .k {
 display: block;
 color: var(--ink-1);
 font-size: 8.5px;
 letter-spacing: 0.18em;
 text-transform: uppercase;
}
.dos-stats .v {
 display: block;
 color: var(--silver-bright);
 font-family: var(--f-mono);
 font-size: 12px;
 margin-top: 4px;
 font-weight: 500;
}
.dos-stats > div.sigma-hot { background: rgba(34, 211, 238, 0.10); }
.dos-stats > div.sigma-hot .v { color: var(--amber-bright); }
.dos-stats > div.sigma-warm .v { color: var(--amber); }
.dos-stats > div.sigma-cold .v { color: var(--red); }
.dos-verdict {
 padding: 10px 18px;
 font-size: 10.5px;
 font-family: var(--f-mono);
 font-weight: 500;
 border-bottom: 1px solid var(--line);
 letter-spacing: 0.02em;
}
.v-buy { color: var(--green); background: rgba(122,170,135,0.06); }
.v-watch { color: var(--amber); background: var(--amber-dim); }
.v-pass { color: var(--red); background: rgba(194,101,101,0.06); }
.dos-body {
 padding: 14px 20px;
 overflow-y: auto;
 flex: 1;
 min-height: 0;
 font-size: 11px;
 line-height: 1.6;
 font-family: var(--f-mono);
}
.dos-body h2 {
 font-family: var(--f-display);
 font-size: 14px;
 font-weight: 600;
 color: var(--silver-bright);
 margin: 0 0 8px;
 padding-bottom: 6px;
 border-bottom: 1px solid var(--line);
 letter-spacing: 0.02em;
}
.dos-body h3,
.dos-body h4 {
 font-size: 9.5px;
 color: var(--amber);
 margin: 12px 0 6px;
 letter-spacing: 0.22em;
 text-transform: uppercase;
 font-weight: 600;
 padding-bottom: 4px;
 border-bottom: 1px solid var(--line);
}
.dos-body h3:first-child,
.dos-body h4:first-child { margin-top: 0; }
.dos-body p { margin: 4px 0 8px; color: var(--silver); font-size: 11px; line-height: 1.6; }
.dos-body strong { color: var(--amber); font-weight: 600; }
.dos-body em { color: var(--amber-bright); font-style: italic; }
.dos-body ul { margin: 4px 0 10px; padding-left: 16px; }
.dos-body li { color: var(--silver); margin: 4px 0; font-size: 11px; line-height: 1.55; }
.dos-body code { background: var(--bg-3); color: var(--amber); padding: 0 5px; border: 1px solid var(--line); border-radius: 2px; font-family: var(--f-mono); }
.view-scan .bot-row .dossier.expanded { grid-column: 1 / -1 !important; }
.view-scan .bot-row .dossier.expanded .dos-body {
 column-count: 2;
 column-gap: 32px;
 column-rule: 1px solid var(--line);
}
.view-scan .bot-row .dossier.expanded .dos-body h3,
.view-scan .bot-row .dossier.expanded .dos-body h4 { break-inside: avoid; }
.view-scan .bot-row .dossier.expanded .dos-body ul,
.view-scan .bot-row .dossier.expanded .dos-body p { break-inside: avoid; }
.wl-grid {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
 gap: 18px;
}
.wl-card {
 background: var(--bg-1);
 border: 1px solid var(--line);
 border-radius: 3px;
 display: flex;
 flex-direction: column;
}
.wl-card.archived { opacity: 0.6; }
.wl-card[data-wl-id] {
 border-radius: 0;
}
.wl-card[data-wl-id] .wl-hd {
 display: flex;
 align-items: baseline;
 gap: 12px;
 padding: 14px 18px;
 background: var(--bg-2);
 border-bottom: 1px solid var(--line);
}
.wl-card[data-wl-id] .wl-hd h3 {
 flex: 1;
 outline: none;
 cursor: text;
 padding: 2px 4px;
 margin: -2px -4px;
 border-radius: 2px;
 transition: background 120ms;
}
.wl-card[data-wl-id] .wl-hd h3:focus {
 background: var(--bg-0);
 box-shadow: 0 0 0 1px var(--line-amber);
}
.wl-del {
 background: transparent;
 border: 1px solid var(--line);
 color: var(--ink-1);
 width: 26px; height: 26px;
 cursor: pointer;
 font-family: var(--f-mono);
 font-size: 13px;
 transition: color 140ms, border-color 140ms, background 140ms;
}
.wl-del:hover { color: var(--red); border-color: var(--red); background: rgba(194,101,101,0.08); }
.wl-tickers {
 padding: 14px 18px 8px;
 display: flex;
 flex-wrap: wrap;
 gap: 6px;
 min-height: 44px;
}
.wl-chip {
 font-family: var(--f-mono);
 font-size: 11.5px;
 letter-spacing: 0.06em;
 padding: 4px 10px;
 background: var(--bg-0);
 border: 1px solid var(--line);
 color: var(--silver-bright);
 cursor: pointer;
 transition: color 120ms, border-color 120ms, background 120ms;
}
.wl-chip:hover { color: var(--red); border-color: var(--red); background: rgba(194,101,101,0.06); }
.wl-chip:hover::after { content: " ✕"; opacity: 0.7; }
.wl-empty {
 font-family: var(--f-mono);
 font-size: 10.5px;
 color: var(--ink-2);
 font-style: italic;
 letter-spacing: 0.06em;
}
.wl-add-form {
 display: flex;
 gap: 6px;
 padding: 8px 18px 14px;
 border-top: 1px solid var(--line);
}
.wl-add-form input {
 flex: 1;
 background: var(--bg-0);
 border: 1px solid var(--line);
 color: var(--silver-bright);
 font-family: var(--f-mono);
 font-size: 12px;
 padding: 7px 10px;
 outline: none;
}
.wl-add-form input:focus { border-color: var(--amber); }
.wl-add-form button {
 background: var(--bg-0);
 border: 1px solid var(--amber);
 color: var(--amber-bright);
 width: 32px;
 font-family: var(--f-display);
 font-weight: 700;
 cursor: pointer;
 transition: background 120ms;
}
.wl-add-form button:hover { background: var(--amber-dim); }
.wl-hd {
 display: grid;
 grid-template-columns: 10px 1fr auto;
 align-items: center;
 gap: 12px;
 padding: 14px 18px;
 background: var(--bg-2);
 border-bottom: 1px solid var(--line);
}
.wl-pin { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 6px var(--amber-glow); }
.wl-pin.archived { background: var(--ink-3); box-shadow: none; }
.wl-hd h3 {
 margin: 0;
 font-family: var(--f-display);
 font-size: 14px;
 font-weight: 500;
 color: var(--silver-bright);
 letter-spacing: 0.02em;
}
.wl-meta { font-size: 9.5px; color: var(--ink-2); margin-top: 3px; letter-spacing: 0.04em; }
.wl-score {
 font-family: var(--f-mono);
 font-size: 12px;
 color: var(--amber);
 padding: 3px 9px;
 border: 1px solid var(--line-amber);
 border-radius: 2px;
 background: var(--amber-dim);
 font-weight: 500;
}
.wl-score.muted { color: var(--ink-2); background: var(--bg-3); border-color: var(--line-bright); }
.wl-stats {
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 border-bottom: 1px solid var(--line);
}
.wl-stats > div {
 padding: 8px 10px;
 border-right: 1px solid var(--line);
}
.wl-stats > div:last-child { border-right: none; }
.wl-stats .k { display: block; color: var(--ink-1); font-size: 8.5px; letter-spacing: 0.18em; text-transform: uppercase; }
.wl-stats .v { display: block; color: var(--silver-bright); font-family: var(--f-mono); font-size: 12px; margin-top: 3px; }
.wl-tickers { padding: 12px 18px; display: flex; flex-wrap: wrap; gap: 5px; }
.tk-chip {
 font-family: var(--f-mono);
 font-size: 10px;
 color: var(--amber);
 background: transparent;
 border: 1px solid var(--line-amber);
 padding: 3px 8px;
 border-radius: 2px;
 letter-spacing: 0.04em;
 cursor: pointer;
 transition: background 0.18s, color 0.18s;
}
.tk-chip:hover { background: var(--amber); color: var(--bg-0); }
.wl-spark { width: 100%; height: 32px; padding: 0 18px 12px; box-sizing: content-box; }
.hist-table .num, .audit-table .num, .onto-members-tbl .num { text-align: right; }
.hist-table tbody tr, .audit-table tbody tr, .onto-members-tbl tbody tr { cursor: pointer; }
.hist-table td.tk.muted, .num.muted { color: var(--ink-3); }
.w-ts { width: 156px; }
.w-act { width: 156px; }
.w-ev { width: 170px; }
.w-sev { width: 60px; }
.audit-table .dt { color: var(--silver); font-size: 10px; }
.audit-table .actor,
.audit-table .ev,
.sev {
 font-family: var(--f-mono);
 font-size: 9px;
 padding: 2px 7px;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 letter-spacing: 0.14em;
 text-transform: uppercase;
}
.actor.user { color: var(--amber); border-color: var(--line-amber); }
.actor.agent { color: var(--silver-bright); }
.actor.system { color: var(--ink-1); }
.audit-table .ev { color: var(--amber); border-color: var(--line-amber); }
.ev.reject, .ev.abort, .ev.err { color: var(--red); border-color: var(--red); }
.sev.info { color: var(--ink-2); }
.sev.warn { color: var(--amber); border-color: var(--line-amber); }
.sev.err { color: var(--red); border-color: var(--red); }
.onto-grid {
 display: grid;
 grid-template-columns: 280px 1fr 320px;
 gap: 1px;
 background: var(--line);
 padding: 0;
 height: 100%;
}
.onto-tree, .onto-graph, .onto-members {
 background: var(--bg-1);
 display: flex;
 flex-direction: column;
 min-height: 0;
 overflow: hidden;
}
.onto-tree-hd {
 font-size: 9.5px;
 color: var(--silver-bright);
 padding: 12px 16px;
 letter-spacing: 0.22em;
 text-transform: uppercase;
 background: var(--bg-2);
 border-bottom: 1px solid var(--line-amber);
 position: relative;
 padding-left: 38px;
}
.onto-tree-hd::before {
 content: '';
 position: absolute;
 left: 16px;
 top: 50%;
 width: 16px;
 height: 1px;
 background: var(--amber);
 transform: translateY(-50%);
}
.tree { list-style: none; margin: 0; padding: 6px 0; overflow-y: auto; flex: 1; }
.tree ul { list-style: none; margin: 0; padding: 0; }
.tree li {
 display: grid;
 grid-template-columns: 12px 1fr auto;
 align-items: center;
 gap: 8px;
 padding: 5px 16px;
 font-size: 10.5px;
 cursor: pointer;
 font-family: var(--f-mono);
 transition: background 0.12s;
}
.tree li:hover { background: var(--bg-2); }
.tree li.t-sect { color: var(--silver-bright); letter-spacing: 0.04em; }
.tree li.t-sect.open > .t-arr { color: var(--amber); }
.tree li.t-ind { color: var(--silver); font-size: 10px; }
.tree li.t-ind.selected { color: var(--amber); background: var(--amber-dim); }
.tree li.t-ind.selected .t-ct { color: var(--amber-bright); border-color: var(--line-amber); }
.t-arr { color: var(--ink-2); }
.t-ct {
 color: var(--ink-1);
 font-size: 9px;
 padding: 1px 6px;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
}
.tree li.t-sublist { padding: 0; cursor: default; }
.tree li.t-sublist:hover { background: transparent; }
.tree li.t-sublist > ul {
 margin: 2px 0 4px 22px;
 padding: 0;
 border-left: 1px solid var(--line-bright);
}
.onto-graph .og-svg { flex: 1; width: 100%; height: 100%; background: var(--bg-1); }
.og-node circle { fill: var(--bg-2); stroke: var(--line-amber); stroke-width: 1.2; }
.og-node text { fill: var(--silver-bright); font-family: var(--f-mono); font-size: 9px; font-weight: 500; letter-spacing: 0.04em; }
.og-node.og-ticker text { fill: var(--silver); }
.og-node.og-ticker.og-emph circle { stroke: var(--amber); stroke-width: 1.4; }
.og-node.og-ticker.og-emph text { fill: var(--amber-bright); }
.og-node.og-industry rect { fill: var(--bg-2); stroke: var(--line-amber); stroke-width: 1; }
.og-node.og-industry text { fill: var(--amber); font-family: var(--f-mono); font-size: 9px; font-weight: 500; }
.og-node.og-industry text.og-ct { fill: var(--ink-2); font-size: 7px; letter-spacing: 0.10em; }
.og-node.og-industry.og-selected rect { fill: var(--amber-dim); stroke: var(--amber); stroke-width: 1.6; }
.og-node.og-industry.og-selected text { fill: var(--amber-bright); }
.og-node.og-center circle { fill: var(--amber-dim); stroke: var(--amber); stroke-width: 1.8; }
.og-node.og-center text { fill: var(--amber-bright); font-family: var(--f-display); font-size: 10px; font-weight: 600; letter-spacing: 0.18em; }
.og-node.og-center text.og-sub { fill: var(--silver-bright); font-size: 11px; letter-spacing: 0.06em; }
.fkeys {
 height: var(--fkey-h);
 display: grid;
 grid-template-columns: repeat(12, 1fr);
 background: var(--bg-1);
 border-top: 1px solid var(--line);
 flex-shrink: 0;
}
.fkey {
 display: flex;
 align-items: center;
 gap: 8px;
 padding: 0 12px;
 border-right: 1px solid var(--line);
 font-size: 9.5px;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 cursor: pointer;
 background: transparent;
 border-top: none;
 border-bottom: none;
 border-left: none;
 color: var(--ink-1);
 font-family: var(--f-mono);
 transition: color 0.18s, background 0.18s;
}
.fkey:hover { color: var(--amber); background: var(--bg-2); }
.fkey:last-child { border-right: none; }
.fkey .fk {
 color: var(--amber);
 font-weight: 600;
 font-size: 9px;
 letter-spacing: 0.10em;
}
.fkey .fl { color: var(--silver); }
.statusbar {
 display: flex;
 align-items: center;
 height: var(--status-h);
 padding: 0 24px;
 background: var(--bg-0);
 border-top: 1px solid var(--line);
 font-size: 9.5px;
 color: var(--ink-1);
 flex-shrink: 0;
 gap: 22px;
 font-family: var(--f-mono);
 letter-spacing: 0.18em;
 text-transform: uppercase;
}
.sb { display: inline-flex; align-items: center; gap: 7px; }
.sb b { color: var(--silver-bright); font-weight: 500; }
.sb-x { flex: 1; }
.sb-led {
 width: 7px; height: 7px;
 border-radius: 50%;
 background: var(--green);
 box-shadow: 0 0 6px rgba(122,170,135,0.6);
 display: inline-block;
}
.sb-led.warn { background: var(--amber); box-shadow: 0 0 6px var(--amber-glow); }
.sb-led.err { background: var(--red); box-shadow: 0 0 6px rgba(194,101,101,0.6); }
.sb-led.off { background: var(--ink-3); box-shadow: none; }
.empty-state {
 padding: 18px 16px;
 color: var(--ink-2);
 font-size: 11px;
 line-height: 1.6;
 text-align: center;
 letter-spacing: 0.02em;
 font-style: italic;
}
.empty-state.full {
 grid-column: 1 / -1;
 padding: 60px 36px;
 font-size: 13px;
}
.empty-state .hint {
 display: inline-block;
 margin-top: 6px;
 color: var(--ink-3);
 font-size: 10px;
 font-style: normal;
}
.empty-state strong { color: var(--amber); }
.obj-head .empty-state { padding: 12px 0; text-align: left; }
.toast-wrap {
 position: fixed;
 right: 24px;
 bottom: 60px;
 display: flex;
 flex-direction: column-reverse;
 gap: 8px;
 z-index: 9999;
 pointer-events: none;
}
.toast {
 background: rgba(10, 10, 13, 0.96);
 backdrop-filter: blur(8px);
 border: 1px solid var(--line-amber);
 border-radius: 3px;
 color: var(--silver-bright);
 padding: 10px 16px;
 font-family: var(--f-mono);
 font-size: 11px;
 letter-spacing: 0.06em;
 box-shadow: 0 10px 30px rgba(0,0,0,0.5), 0 0 0 1px rgba(34,211,238,0.18);
 animation: toast-in 0.22s ease-out;
 max-width: 360px;
 display: flex;
 align-items: center;
 gap: 10px;
}
.toast::before {
 content: '';
 width: 7px;
 height: 7px;
 border-radius: 50%;
 background: var(--amber);
 box-shadow: 0 0 6px var(--amber-glow);
 flex-shrink: 0;
}
.toast.warn { color: var(--amber); }
.toast.err::before { background: var(--red); box-shadow: 0 0 6px rgba(194,101,101,0.5); }
.toast.ok::before { background: var(--green); box-shadow: 0 0 6px rgba(122,170,135,0.5); }
.toast.fade { animation: toast-out 0.35s forwards; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes toast-out { to { opacity: 0; transform: translateY(8px); } }
.chip {
 font-family: var(--f-mono);
 font-size: 9px;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 padding: 2px 8px;
 border: 1px solid var(--line-bright);
 border-radius: 2px;
}
.chip-blue, .chip-amber { color: var(--amber); border-color: var(--line-amber); background: var(--amber-dim); }
.chip-grey { color: var(--ink-1); }
.obj-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.obj-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.obj-type {
 font-family: var(--f-mono);
 font-size: 9px;
 color: var(--amber);
 letter-spacing: 0.20em;
 text-transform: uppercase;
 padding: 2px 7px;
 border: 1px solid var(--line-amber);
 border-radius: 2px;
}
.obj-id { color: var(--ink-2); font-size: 10px; letter-spacing: 0.06em; }
.obj-title {
 font-family: var(--f-display);
 font-size: 24px;
 font-weight: 500;
 color: var(--silver-bright);
 margin: 8px 0 0;
 letter-spacing: -0.01em;
}
.obj-sub { font-size: 12px; font-weight: 300; color: var(--ink-1); margin-left: 8px; }
.act-list { display: flex; flex-direction: column; gap: 4px; }
.act {
 background: var(--bg-2);
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 color: var(--silver);
 padding: 7px 14px;
 text-align: left;
 font-size: 10.5px;
 letter-spacing: 0.10em;
 text-transform: uppercase;
 cursor: pointer;
 font-family: var(--f-mono);
 transition: color 0.18s, border-color 0.18s, background 0.18s;
}
.act:hover { color: var(--amber); border-color: var(--line-amber); background: var(--amber-dim); }
.act.danger { color: var(--red); border-color: rgba(194,101,101,0.4); }
.act.danger:hover { color: var(--red); border-color: var(--red); background: rgba(194,101,101,0.06); }
.rel-list { list-style: none; }
.rel-list li {
 display: grid;
 grid-template-columns: 52px 1fr 36px;
 align-items: center;
 gap: 10px;
 padding: 6px 16px;
 border-bottom: 1px solid var(--line);
 cursor: pointer;
 transition: background 0.12s;
}
.rel-list li:hover { background: var(--bg-2); }
.rl-tk { color: var(--amber); font-family: var(--f-mono); font-size: 11px; font-weight: 500; }
.rl-nm { color: var(--silver); font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rl-sc { color: var(--silver-bright); font-family: var(--f-mono); font-size: 11px; text-align: right; }
.rel-note { color: var(--ink-2); font-size: 10px; padding: 8px 16px; font-style: italic; line-height: 1.5; }
.px-head { display: flex; align-items: baseline; justify-content: space-between; }
.px-val { font-family: var(--f-display); font-size: 24px; font-weight: 500; color: var(--silver-bright); }
.px-chg { font-family: var(--f-mono); font-size: 11px; }
.px-chg.neg { color: var(--red); }
.px-chg.pos { color: var(--green); }
.px-spark { width: 100%; height: 70px; margin: 10px 0 4px; }
.px-axis { display: flex; justify-content: space-between; font-family: var(--f-mono); font-size: 9px; color: var(--ink-2); }
.px-axis .hot { color: var(--amber); }
.vdist { display: flex; flex-direction: column; gap: 6px; }
.vd-row { display: grid; grid-template-columns: 60px 1fr 42px; align-items: center; gap: 10px; }
.vd-k { font-family: var(--f-mono); font-size: 9px; color: var(--ink-1); letter-spacing: 0.10em; text-transform: uppercase; }
.vd-v { font-family: var(--f-mono); font-size: 11px; color: var(--silver-bright); text-align: right; }
.vd-bar { position: relative; height: 6px; background: var(--bg-3); border-radius: 3px; }
.vd-bar i { position: absolute; top: -3px; width: 2px; height: 12px; background: var(--amber); }
.vd-bar b { position: absolute; top: 0; left: 0; height: 100%; background: linear-gradient(90deg, var(--amber-dim), var(--amber)); border-radius: 3px; }
.watchlists li, .rel-list li, .kpi, .chip, .tk-chip, .act,
.dos-hd, .dos-verdict, .kvr,
.hist-table tbody tr, .audit-table tbody tr, .onto-members-tbl tbody tr,
.filter-chip, .sb, .cmd-status .item, .stream-line,
#rank-body tr, .phase, .wl-card,
.rl, .fkey, .f-tab, .icon-btn, .ab-btn { cursor: pointer; }
.kvr:hover { background: var(--bg-2); }
.kvr:hover b { color: var(--amber-bright); }
.kpi:hover { background: var(--bg-2); }
.chip:hover, .tk-chip:hover { background: var(--amber); color: var(--bg-0); border-color: var(--amber); }
.stream-line:hover { background: rgba(34, 211, 238, 0.04); }
.bc-canvas {
 position: relative;
 background: var(--bg-0);
 background-image:
 radial-gradient(circle at 1px 1px, var(--ink-3) 1px, transparent 0);
 background-size: 22px 22px;
 background-position: 11px 11px;
 overflow: hidden;
 padding: 0;
}
.bc-canvas::before {
 content: "";
 position: absolute;
 inset: 0;
 background:
 radial-gradient(ellipse 60% 50% at 50% 45%, rgba(34, 211, 238, 0.04), transparent 70%);
 pointer-events: none;
 z-index: 0;
}
.bc-edges {
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 pointer-events: none;
 z-index: 1;
}
.bc-nodes {
 position: absolute;
 inset: 0;
 z-index: 2;
}
.bc-node {
 position: absolute;
 background: var(--bg-1);
 border: 1px solid var(--line-bright);
 border-radius: 14px;
 padding: 11px 12px;
 width: 178px; 
 display: flex;
 flex-direction: column;
 gap: 6px;
 box-shadow:
 0 0 0 1px rgba(34, 211, 238, 0.05),
 0 0 14px rgba(34, 211, 238, 0.06),
 0 10px 28px rgba(0, 0, 0, 0.4);
 transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
 cursor: pointer;
}
.bc-node:hover {
 border-color: var(--amber);
 box-shadow:
 0 0 0 1px var(--amber),
 0 0 32px rgba(34, 211, 238, 0.35),
 0 12px 40px rgba(0, 0, 0, 0.5);
 transform: translateY(-2px);
 z-index: 3;
}
.bc-node.kind-agent {
 border-color: var(--line-amber);
 box-shadow:
 0 0 0 1px var(--amber),
 0 0 36px rgba(34, 211, 238, 0.35),
 0 14px 40px rgba(0, 0, 0, 0.5);
}
.bc-node.kind-input { width: 178px; }
.bc-node.kind-output { width: 178px; }
.bc-node.kind-llm { border-color: var(--line-amber); }
.bc-node.kind-external { border-color: rgba(122, 170, 135, 0.30); width: 178px; }
.bc-node.kind-external .bc-icon { color: var(--green); border-color: rgba(122, 170, 135, 0.35); }
.bc-node.kind-memory { border-color: rgba(184, 191, 204, 0.30); width: 178px; }
.bc-node.kind-memory .bc-icon { color: var(--silver); border-color: rgba(184, 191, 204, 0.35); }
.bc-node.kind-input .bc-icon { color: var(--silver-bright); }
.bc-node.kind-output .bc-icon { color: var(--silver-bright); }
.bc-node.kind-deliverable {
 width: 232px;
 border-color: var(--amber-bright);
 background:
 linear-gradient(180deg, rgba(34, 211, 238, 0.06), rgba(34, 211, 238, 0.02)),
 var(--bg-1);
 box-shadow:
 0 0 0 1px rgba(103, 232, 249, 0.45),
 0 0 26px rgba(34, 211, 238, 0.20),
 0 12px 32px rgba(0, 0, 0, 0.5);
}
.bc-node.kind-deliverable .bc-icon {
 background: rgba(34, 211, 238, 0.15);
 border-color: var(--amber-bright);
 color: var(--amber-bright);
 box-shadow: 0 0 8px rgba(34, 211, 238, 0.3);
}
.bc-node.kind-deliverable .bc-name {
 color: var(--silver-bright);
 font-weight: 600;
}
.bc-node.kind-deliverable .bc-sub {
 color: var(--amber-bright);
 letter-spacing: 0.14em;
}
.bc-node.kind-deliverable .bc-check {
 background: var(--amber-bright);
 color: var(--bg-0);
}
.bc-node.kind-deliverable::before {
 content: "";
 position: absolute;
 top: 0; left: 14px; right: 14px;
 height: 2px;
 background: linear-gradient(90deg,
 transparent, var(--amber-bright), transparent);
 border-radius: 14px 14px 0 0;
}
.bc-node.selected {
 background:
 linear-gradient(
 155deg,
 rgba(11, 132, 156, 0.32) 0%,
 rgba(34, 211, 238, 0.42) 45%,
 rgba(11, 132, 156, 0.22) 100%
 );
 border-color: rgba(34, 211, 238, 0.55);
 color: var(--silver-bright);
 box-shadow:
 0 0 0 1px rgba(34, 211, 238, 0.35),
 0 8px 24px rgba(0, 0, 0, 0.45);
 width: 248px;
}
.bc-node.selected .bc-name { color: var(--silver-bright); font-weight: 600; }
.bc-node.selected .bc-sub { color: rgba(238, 241, 247, 0.75); }
.bc-node.selected .bc-icon {
 background: rgba(255, 255, 255, 0.08);
 border-color: rgba(255, 255, 255, 0.22);
 color: var(--silver-bright);
 box-shadow: none;
}
.bc-node.selected .bc-meta { border-top-color: rgba(255, 255, 255, 0.15); }
.bc-node.selected .bc-meta-row .k { color: rgba(238, 241, 247, 0.55); }
.bc-node.selected .bc-meta-row .v { color: var(--silver-bright); }
.bc-node.selected .bc-check {
 background: var(--amber);
 color: var(--bg-0);
 box-shadow: 0 0 6px rgba(34, 211, 238, 0.4);
}
.bc-node.selected::after {
 content: "";
 position: absolute;
 inset: 0;
 border-radius: inherit;
 pointer-events: none;
 background: linear-gradient(
 180deg,
 rgba(255, 255, 255, 0.05) 0%,
 rgba(255, 255, 255, 0) 40%
 );
}
.bc-check {
 position: absolute;
 top: 8px;
 right: 8px;
 width: 16px;
 height: 16px;
 background: var(--amber);
 color: var(--bg-0);
 border-radius: 50%;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 10px;
 font-family: var(--f-display);
 font-weight: 700;
 box-shadow: 0 0 10px var(--amber-glow);
}
.bc-node-hd { display: flex; align-items: center; gap: 12px; }
.bc-icon {
 width: 34px;
 height: 34px;
 flex-shrink: 0;
 background: var(--bg-2);
 border: 1px solid var(--line-bright);
 border-radius: 7px;
 display: flex;
 align-items: center;
 justify-content: center;
 color: var(--amber);
}
.bc-node.kind-agent .bc-icon { background: var(--amber-dim); border-color: var(--line-amber); }
.bc-node-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bc-name {
 font-family: var(--f-display);
 font-size: 13px;
 font-weight: 500;
 color: var(--silver-bright);
 letter-spacing: 0.01em;
 line-height: 1.2;
}
.bc-sub {
 font-family: var(--f-mono);
 font-size: 9.5px;
 color: var(--ink-1);
 letter-spacing: 0.10em;
 text-transform: uppercase;
}
.bc-meta {
 display: flex;
 flex-direction: column;
 gap: 4px;
 padding-top: 8px;
 border-top: 1px solid var(--line);
}
.bc-meta-row {
 display: flex;
 justify-content: space-between;
 align-items: baseline;
 font-family: var(--f-mono);
 font-size: 10px;
 gap: 10px;
}
.bc-meta-row .k {
 color: var(--ink-1);
 letter-spacing: 0.10em;
 text-transform: uppercase;
 font-size: 9px;
 flex-shrink: 0;
}
.bc-meta-row .v {
 color: var(--silver-bright);
 text-align: right;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}
.bc-edge-halo-wide {
 fill: none;
 stroke: var(--amber);
 stroke-width: 10;
 stroke-opacity: 0.35;
 filter: blur(3px);
 pointer-events: none;
}
.bc-edge-halo {
 fill: none;
 stroke: var(--amber);
 stroke-width: 4.5;
 stroke-opacity: 0.55;
 filter: blur(0.8px);
 pointer-events: none;
}
.bc-edge {
 fill: none;
 stroke: #b8f6ff;
 stroke-width: 1.4;
 stroke-opacity: 1;
 filter: drop-shadow(0 0 1.5px rgba(34, 211, 238, 0.9));
}
.bc-edge.dashed {
 stroke: var(--amber);
 stroke-dasharray: 4 4;
 stroke-opacity: 0.4;
 filter: none;
}
.bc-edge-label-bg {
 fill: var(--bg-1);
 stroke: var(--line-amber);
 stroke-width: 1;
}
.bc-edge-label {
 font-family: var(--f-mono);
 font-size: 9.5px;
 fill: var(--silver-bright);
 letter-spacing: 0.06em;
}
.bc-legend {
 position: absolute;
 top: 18px;
 right: 24px;
 z-index: 3;
 background: rgba(10, 10, 15, 0.85);
 backdrop-filter: blur(8px);
 border: 1px solid var(--line-bright);
 border-radius: 4px;
 padding: 10px 14px;
 display: flex;
 flex-direction: column;
 gap: 6px;
 font-family: var(--f-mono);
 font-size: 9.5px;
 letter-spacing: 0.10em;
 text-transform: uppercase;
 color: var(--ink-1);
 min-width: 200px;
}
.bc-legend .ll {
 display: flex;
 align-items: center;
 gap: 8px;
}
.bc-legend .lswatch {
 width: 14px;
 height: 14px;
 border-radius: 3px;
 background: var(--bg-2);
 border: 1px solid var(--line-bright);
}
.bc-legend .lswatch.agent { border-color: var(--amber); box-shadow: 0 0 8px var(--amber-glow); }
.bc-legend .lswatch.llm { border-color: var(--line-amber); }
.bc-legend .lswatch.io { border-color: var(--line-bright); }
.bc-legend .lswatch.ext { border-color: rgba(122, 170, 135, 0.45); }
.bc-legend .lswatch.mem { border-color: rgba(184, 191, 204, 0.40); }
.bc-legend .ll b { color: var(--silver-bright); }
.modal-overlay {
 position: fixed;
 inset: 0;
 z-index: 1000;
 background: rgba(5, 5, 7, 0.78);
 backdrop-filter: blur(6px);
 -webkit-backdrop-filter: blur(6px);
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 40px;
 opacity: 0;
 pointer-events: none;
 transition: opacity 0.2s ease;
}
.modal-overlay.open {
 opacity: 1;
 pointer-events: auto;
}
.modal-dialog {
 background: var(--bg-1);
 border: 1px solid var(--line-bright);
 border-radius: 3px;
 width: 100%;
 max-width: 880px;
 max-height: 86vh;
 display: flex;
 flex-direction: column;
 box-shadow: 0 30px 60px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(34, 211, 238, 0.15);
 transform: translateY(8px);
 transition: transform 0.22s ease;
}
.modal-overlay.open .modal-dialog { transform: translateY(0); }
.modal-hd {
 height: 52px;
 display: flex;
 align-items: center;
 padding: 0 24px;
 border-bottom: 1px solid var(--line);
 gap: 16px;
 position: relative;
}
.modal-eyebrow {
 width: 24px;
 height: 1px;
 background: var(--amber);
 flex-shrink: 0;
}
.modal-title {
 flex: 1;
 font-family: var(--f-display);
 font-weight: 500;
 font-size: 14px;
 letter-spacing: 0.18em;
 color: var(--silver-bright);
 text-transform: uppercase;
 margin: 0;
}
.modal-close {
 background: transparent;
 border: 1px solid var(--line-bright);
 color: var(--ink-1);
 width: 28px;
 height: 28px;
 font-size: 16px;
 line-height: 1;
 cursor: pointer;
 border-radius: 2px;
 font-family: var(--f-display);
 transition: color 0.18s, border-color 0.18s, background 0.18s;
}
.modal-close:hover {
 color: var(--amber);
 border-color: var(--line-amber);
 background: var(--amber-dim);
}
.modal-bd {
 padding: 24px 28px 28px;
 overflow-y: auto;
 flex: 1;
 min-height: 0;
 font-size: 12px;
 line-height: 1.65;
 color: var(--silver);
}
.help-grid {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 24px 36px;
}
.help-grid h3 {
 font-family: var(--f-mono);
 font-size: 9.5px;
 color: var(--amber);
 letter-spacing: 0.24em;
 text-transform: uppercase;
 margin: 0 0 10px;
 padding-bottom: 6px;
 border-bottom: 1px solid var(--line);
 font-weight: 500;
}
.help-grid dl {
 display: grid;
 grid-template-columns: 88px 1fr;
 gap: 6px 14px;
 margin: 0;
 font-family: var(--f-mono);
 font-size: 11px;
}
.help-grid dt {
 color: var(--amber);
 letter-spacing: 0.08em;
}
.help-grid dd { margin: 0; color: var(--silver); }
.help-grid kbd {
 display: inline-block;
 font-family: var(--f-mono);
 font-size: 10px;
 padding: 1px 6px;
 background: var(--bg-3);
 color: var(--silver-bright);
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 letter-spacing: 0.04em;
}
.news-empty {
 text-align: center;
 padding: 30px 0 10px;
}
.news-empty .icon {
 font-size: 38px;
 color: var(--amber);
 opacity: 0.6;
 margin-bottom: 14px;
 letter-spacing: 0.18em;
}
.news-empty h4 {
 font-family: var(--f-display);
 font-size: 18px;
 font-weight: 500;
 color: var(--silver-bright);
 margin-bottom: 8px;
 letter-spacing: -0.01em;
}
.news-empty p { color: var(--ink-1); margin-bottom: 22px; }
.news-providers {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 14px;
 margin-top: 18px;
}
.news-providers .prov {
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 padding: 14px;
 background: var(--bg-2);
 text-align: left;
}
.news-providers .prov h5 {
 font-family: var(--f-mono);
 font-size: 11px;
 color: var(--amber);
 letter-spacing: 0.16em;
 text-transform: uppercase;
 margin-bottom: 6px;
}
.news-providers .prov p {
 font-size: 10.5px;
 color: var(--silver);
 line-height: 1.5;
 margin-bottom: 0;
}
.chart-meta {
 display: flex;
 gap: 22px;
 margin-bottom: 18px;
 font-family: var(--f-mono);
 font-size: 10px;
 letter-spacing: 0.12em;
 text-transform: uppercase;
}
.chart-meta .lbl { color: var(--ink-1); margin-right: 6px; }
.chart-meta .val { color: var(--silver-bright); }
.chart-svg-wrap {
 background: var(--bg-2);
 border: 1px solid var(--line);
 border-radius: 2px;
 padding: 20px;
}
.chart-svg { width: 100%; height: 280px; display: block; }
.chart-empty {
 text-align: center;
 color: var(--ink-2);
 font-style: italic;
 padding: 64px 0;
 font-size: 12px;
}
.chart-empty strong { color: var(--amber); font-style: normal; }
.quote-form {
 display: flex;
 gap: 10px;
 align-items: stretch;
 margin-bottom: 18px;
}
.quote-input {
 flex: 1;
 background: var(--bg-2);
 border: 1px solid var(--line-bright);
 border-radius: 2px;
 color: var(--silver-bright);
 padding: 10px 14px;
 font-family: var(--f-display);
 font-size: 16px;
 font-weight: 500;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 outline: none;
 transition: border-color 0.18s, background 0.18s;
}
.quote-input:focus { border-color: var(--amber); background: var(--bg-3); }
.quote-input::placeholder { color: var(--ink-2); letter-spacing: 0.10em; }
.quote-submit {
 background: var(--amber);
 color: var(--bg-0);
 border: 1px solid var(--amber);
 border-radius: 2px;
 padding: 0 22px;
 font-family: var(--f-display);
 font-weight: 700;
 font-size: 11px;
 letter-spacing: 0.20em;
 text-transform: uppercase;
 cursor: pointer;
}
.quote-submit:hover { background: var(--amber-bright); border-color: var(--amber-bright); }
.quote-result {
 border: 1px solid var(--line);
 border-radius: 2px;
 background: var(--bg-2);
 padding: 18px;
 margin-top: 14px;
 font-family: var(--f-mono);
}
.quote-result.miss { border-color: rgba(194,101,101,0.4); color: var(--red); }
.quote-result h4 {
 font-family: var(--f-display);
 font-size: 20px;
 color: var(--amber);
 margin-bottom: 4px;
 font-weight: 600;
 letter-spacing: 0.02em;
}
.quote-result .sub { color: var(--ink-1); font-size: 11px; margin-bottom: 14px; }
.quote-result .kvs { display: grid; grid-template-columns: 110px 1fr; gap: 4px 14px; font-size: 11px; }
.quote-result .kvs dt { color: var(--ink-1); letter-spacing: 0.08em; }
.quote-result .kvs dd { color: var(--silver-bright); margin: 0; }
.quit-body { text-align: center; padding: 20px 0; }
.quit-body h4 { font-family: var(--f-display); font-size: 18px; color: var(--silver-bright); margin-bottom: 10px; font-weight: 500; }
.quit-body p { color: var(--ink-1); margin-bottom: 20px; }
.quit-actions { display: flex; gap: 10px; justify-content: center; }
.quit-actions button {
 background: var(--bg-2);
 border: 1px solid var(--line-bright);
 color: var(--silver);
 padding: 8px 22px;
 font-family: var(--f-mono);
 font-size: 11px;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 cursor: pointer;
 border-radius: 2px;
}
.quit-actions button:hover { color: var(--amber); border-color: var(--line-amber); }
.quit-actions button.danger { color: var(--red); border-color: rgba(194,101,101,0.4); }
.quit-actions button.danger:hover { color: var(--red); border-color: var(--red); background: rgba(194,101,101,0.06); }
@media (max-width: 1400px) {
 :root { --navi-w: 240px; }
 .kpi-v { font-size: 24px; }
}
@media (max-width: 900px) {
 .navi { display: none; }
 .shell { grid-template-columns: var(--rail-w) 1fr; }
 .kpi { flex: 1 1 45%; }
}
.filter-chip.clickable {
 cursor: pointer;
 border: 1px solid var(--line-bright);
 background: var(--bg-2);
 transition: border-color 140ms, background 140ms;
}
.filter-chip.clickable:hover { border-color: var(--amber); background: var(--bg-3); }
.settings-overlay {
 position: fixed; inset: 0; z-index: 100;
 display: flex; align-items: center; justify-content: center;
 background: rgba(5, 5, 7, 0.78);
 backdrop-filter: blur(4px);
 padding: 24px;
}
.settings-overlay[hidden] { display: none; }
.settings-card {
 width: 100%; max-width: 540px;
 background: var(--bg-1);
 border: 1px solid var(--line-bright);
 box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.15), 0 24px 64px rgba(0,0,0,0.7);
 position: relative;
}
.settings-card::before,
.settings-card::after {
 content: ""; position: absolute; width: 20px; height: 20px;
 border: 1px solid var(--amber); opacity: 0.7;
}
.settings-card::before { top: -1px; left: -1px; border-right: none; border-bottom: none; }
.settings-card::after { bottom: -1px; right: -1px; border-left: none; border-top: none; }
.settings-hd {
 display: flex; align-items: center; justify-content: space-between;
 padding: 18px 24px;
 border-bottom: 1px solid var(--line);
}
.settings-hd h2 {
 margin: 0;
 font-family: var(--f-display); font-weight: 800;
 font-size: 14px; letter-spacing: 0.32em; color: var(--silver-bright);
}
.settings-close {
 background: transparent; border: 1px solid var(--line);
 color: var(--ink-1); width: 28px; height: 28px;
 font-family: var(--f-mono); font-size: 13px;
 cursor: pointer;
 transition: color 120ms, border-color 120ms;
}
.settings-close:hover { color: var(--red); border-color: var(--red); }
.settings-sub {
 padding: 14px 24px 0; margin: 0;
 font-family: var(--f-mono); font-size: 11.5px;
 color: var(--ink-1); letter-spacing: 0.03em;
}
.settings-grid {
 padding: 18px 24px 22px;
 display: grid; grid-template-columns: 1fr; gap: 16px;
}
.settings-field { display: flex; flex-direction: column; gap: 6px; }
.settings-label {
 font-family: var(--f-display); font-weight: 300;
 font-size: 9.5px; letter-spacing: 0.24em;
 text-transform: uppercase; color: var(--ink-1);
}
.settings-field select {
 background: var(--bg-0); border: 1px solid var(--line);
 color: var(--silver-bright); font-family: var(--f-mono);
 font-size: 13px; padding: 10px 12px; outline: none;
 cursor: pointer;
 transition: border-color 120ms;
}
.settings-field select:focus { border-color: var(--amber); }
.settings-foot {
 display: flex; justify-content: flex-end; gap: 10px;
 padding: 16px 24px;
 border-top: 1px solid var(--line);
}
.settings-btn-cancel,
.settings-btn-save {
 padding: 9px 22px; cursor: pointer;
 font-family: var(--f-display); font-weight: 700; font-size: 10.5px;
 letter-spacing: 0.28em; text-transform: uppercase;
 transition: all 140ms;
}
.settings-btn-cancel {
 background: transparent; border: 1px solid var(--line-bright);
 color: var(--ink-1);
}
.settings-btn-cancel:hover { color: var(--silver-bright); border-color: var(--silver); }
.settings-btn-save {
 background: var(--amber); border: 1px solid var(--amber); color: var(--bg-0);
}
.settings-btn-save:hover {
 background: var(--amber-bright);
 box-shadow: 0 0 16px var(--amber-glow);
}