/* V1 visual fidelity pass: design-reference cockpit, shared nine-page terminal.
 * All chart/graph marks are backed by the read-only app state; CSS decor
 * must never imply a filled order, a connected exchange, or healthy risk.
 */
:root {
  --v1-bg:#06111e; --v1-panel:#0c2033; --v1-line:#244861;
  --v1-text:#e0edf9; --v1-muted:#83a6c0; --v1-cyan:#35cefa;
  --v1-blue:#338bff; --v1-violet:#a188f7; --v1-good:#42d5a4;
  --v1-warn:#f4bf69; --v1-danger:#f47b8b;
}
body {
  color:var(--v1-text);
  background:radial-gradient(ellipse 85% 42% at 57% -6%,#123a5b 0%,transparent 64%),#06111e;
}
.topbar {
  height:70px; padding:0 23px; gap:28px;
  border-bottom:1px solid #1b425f;
  background:linear-gradient(90deg,#071929 0%,#091e33 52%,#081a2a 100%);
  box-shadow:0 8px 38px #010b1899;
}
.brand{min-width:236px}
.brand-symbol{
  border-color:#43cefa;background:radial-gradient(circle,#1b5282 4%,#0a1e38 70%);
  box-shadow:0 0 24px #278bdb50,inset 0 0 11px #2987c455;
}
.brand b {font-size:19px;letter-spacing:.45px}
.top-nav{gap:6px}
.top-nav button{
  border-radius:7px;color:#94b2c9;font-size:12px;font-weight:600;
  padding:11px 13px;border:1px solid transparent;min-height:39px;
}
.top-nav button[aria-current=page]{
  color:#eef9ff;background:linear-gradient(110deg,#164d84,#133754);
  border-color:#246eaa;box-shadow:inset 0 -2px #43c9ff,0 0 23px #176ec31e;
}
.status{display:inline-flex;align-items:center;border:1px solid #496380;border-radius:20px;padding:7px 11px;font-weight:600}
.status.good{border-color:#245d59;background:#0b3538}
.status.unknown{border-color:#735e3d;background:#342b1c}
.status.bad{border-color:#70434a;background:#381e29}
.workspace{min-height:calc(100vh - 110px)}
.sidebar{
  width:208px;padding:19px 12px 30px;
  background:linear-gradient(180deg,#0a2034 0%,#081b2d 48%,#071827 100%);
  border-right:1px solid #1b4563;
}
.side-heading{
  margin:24px 10px 10px;color:#5eadd4;font-weight:800;
  letter-spacing:1.8px;font-size:10px;
}
.side-link{padding:11px 12px;font-weight:520;font-size:12px;border:1px solid transparent;margin:3px 0}
.side-link[aria-current=page]{border-color:#1d638e;background:linear-gradient(90deg,#174f81,#102c4a)}
.side-icon{color:#6dc8f4}
.sidebar-note{
  background:linear-gradient(150deg,#122e4b,#0c2135);
  border-color:#24577e;padding:16px 11px;color:#89b8d7;line-height:1.8;
}
.main{padding:24px 28px 32px}
.breadcrumb{color:#6fadd9}
.page-heading h1{font-weight:800;font-size:25px;letter-spacing:.3px;margin:7px 0}
.page-heading p{font-size:12px;color:#83a8c3}
.page-heading{margin-bottom:21px}
.chip{background:#102e45;border-color:#285578;color:#9ccbef}
.chip.warning{border-color:#87623d;background:#30251b;color:#ffcb86}
.kpis{gap:13px;margin-bottom:16px}
.metric{
  padding:17px 17px 16px;min-height:121px;
  border:1px solid #254b68;background:
  radial-gradient(ellipse at 93% 110%,#1b4e7326,transparent 60%),
  linear-gradient(155deg,#112b43,#0a1d2f 80%);
  box-shadow:0 9px 29px #0007;
}
.metric:before{right:18%;height:2px;background:linear-gradient(90deg,#1c86d3,#42e5ff16)}
.metric .label{color:#92b4ce;font-size:11px}
.metric .value{font-size:26px;margin:13px 0 7px;color:#effbff}
.metric small{color:#73b2d3}
.metric:nth-child(3n) .value{color:#68dcca}
.metric:nth-child(4n) .value{color:#d3b4ff}
.panel{
  padding:17px 19px 18px;border-radius:11px;border:1px solid #254c68;
  background:linear-gradient(160deg,#10273d 0%,#0b1e30 58%,#081b2b 100%);
  box-shadow:0 10px 28px #0005,inset 0 1px #3375a220;
}
.panel-header{align-items:center;padding-bottom:12px;border-color:#1e445e}
.panel h2{font-size:14px;font-weight:750;letter-spacing:.1px}
.panel-header small{border:1px solid #21445f;color:#79b8d9;border-radius:6px;padding:5px 8px;background:#0c263a}
.empty{
  background:radial-gradient(ellipse at center,#0c3554 0%,#091d2f 65%);
  border-color:#2a5675;min-height:138px;
}
.empty .illustration{font-size:26px}
.data-table th{background:#0b263a;color:#82aecb;text-transform:none}
.data-table tr:hover td{background:#16304855}
.data-table td,.data-table th{padding:11px 10px}
.paper-notice{border-radius:8px}
/* The signed-off overview reference has a separate multi-row cockpit grid. */
.overview-cockpit .page-heading{margin-bottom:18px}
.overview-cockpit .overview-title-accent{color:#5ed3fd}
.overview-cockpit .kpis{grid-template-columns:repeat(6,minmax(0,1fr))}
.overview-cockpit .metric{min-height:126px}
.overview-cockpit .metric:after{
  content:"";position:absolute;bottom:9px;right:12px;
  width:54px;height:25px;opacity:.32;pointer-events:none;
  background:linear-gradient(134deg,transparent 13%,#46a5dc 15%,transparent 18%,
    transparent 30%,#46a5dc 34%,transparent 38%,transparent 50%,
    #46a5dc 54%,transparent 58%);
}
.overview-cockpit .metric:nth-child(4):after{background:linear-gradient(110deg,transparent,#b68eff33)}
.overview-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:13px}
.overview-grid>.panel{min-width:0}
.overview-grid .hero-research{grid-column:span 6;min-height:382px}
.overview-grid .hero-funnel{grid-column:span 3;min-height:382px}
.overview-grid .hero-money{grid-column:span 3;min-height:382px;border-color:#463d78}
.overview-grid .overview-agent{grid-column:span 4;min-height:250px}
.overview-grid .overview-feed{grid-column:span 4;min-height:250px}
.overview-grid .overview-holdings{grid-column:span 4;min-height:250px}
.overview-grid .overview-risk{grid-column:span 3;min-height:230px}
.overview-grid .overview-market{grid-column:span 3;min-height:230px}
.overview-grid .overview-events{grid-column:span 4;min-height:230px}
.overview-grid .overview-actions{grid-column:span 2;min-height:230px}
.overview-grid .panel-body{padding-top:14px}
.overview-grid .panel-header small{font-size:10px}
.overview-world-tag{
  display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:700;
  padding:5px 8px;border-radius:16px;color:#70d9fb;
  background:#0e3552;border:1px solid #1b7397;
}
.overview-world-tag:before{content:"";height:6px;width:6px;border-radius:100%;background:currentColor}
.overview-world-tag.money{color:#c8abff;background:#302347;border-color:#55447d}
.overview-world-tag.locked{color:#ffa4a9;background:#41202b;border-color:#8d4057}
.cockpit-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}
.cockpit-panel-head .subnote{font-size:10px;color:#77a8c7}
.cockpit-graph-caption{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;
  margin-top:7px;font-size:10px;color:#739eba;
}
.cockpit-graph-caption strong{color:#bee7f9}
.brain-svg{width:100%;height:auto;min-height:234px;max-height:284px;display:block;background:
  radial-gradient(ellipse at 50% 45%,#11518d48 0,transparent 55%),
  radial-gradient(ellipse at 72% 62%,#282e6b2b 0,transparent 35%);
  border:1px solid #225178;border-radius:10px;
}
.brain-svg .brain-link{stroke:#2e769d;stroke-width:1.5;stroke-opacity:.69}
.brain-svg .brain-orbit{stroke:#2e729055;fill:none;stroke-dasharray:3 7}
.brain-svg .brain-node{fill:#143e5d;stroke:#61b8e7;stroke-width:1.5}
.brain-svg .brain-node-label{fill:#c4e9ff;font-family:Inter,"PingFang SC",sans-serif;font-size:10px;pointer-events:none}
.brain-svg .brain-logo{fill:#112e58;stroke:#56c8ff;stroke-width:2;filter:drop-shadow(0 0 14px #138edca0)}
.brain-svg [data-node]{cursor:pointer}
.brain-svg [data-node]:focus-visible{outline:none;filter:drop-shadow(0 0 8px #45c6ff)}
.brain-svg [data-node]:hover .brain-node,.brain-svg [data-node]:focus .brain-node{stroke:#f3f8ff;stroke-width:3}
.brain-svg .brain-empty-text{fill:#80a7c4;font-size:12px;text-anchor:middle}
.cockpit-mini-flow{
  display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:8px;
  padding:8px;border:1px solid #204562;border-radius:8px;background:#071e31;
  font-size:10px;color:#b3daf0;
}
.cockpit-mini-flow .mini-stage{border-radius:5px;background:#153754;padding:4px 7px}
.cockpit-mini-flow .mini-arrow{color:#49bde8}
.cockpit-funnel{display:flex;align-items:center;flex-direction:column;gap:11px;padding:17px 3px 5px}
.cockpit-funnel .funnel-row{
  display:flex;justify-content:space-between;align-items:center;height:41px;
  padding:0 12px;clip-path:polygon(3% 0,97% 0,90% 100%,10% 100%);
  border-radius:4px;color:#e9f7ff;line-height:1.3;font-size:10px;
  background:linear-gradient(100deg,#165b9f,#268adb);
}
.cockpit-funnel .funnel-row:nth-child(2){background:linear-gradient(100deg,#207eb9,#35a9da)}
.cockpit-funnel .funnel-row:nth-child(3){background:linear-gradient(100deg,#138e9d,#2ab7af)}
.cockpit-funnel .funnel-row:nth-child(4){background:linear-gradient(100deg,#218b75,#36c9a1)}
.cockpit-funnel .funnel-row:nth-child(5){background:linear-gradient(100deg,#90793a,#d6a84a)}
.cockpit-funnel .funnel-row:last-child{background:linear-gradient(100deg,#885a57,#bd695e)}
.cockpit-funnel .funnel-row strong{font-size:15px}
.cockpit-money-value{font-weight:780;letter-spacing:.5px;font-size:29px;color:#cdb4ff;margin:15px 0 6px}
.cockpit-money-value .unit{font-size:12px;color:#a7b4d8;margin-left:5px}
.money-verified,.money-unknown{display:inline-block;font-size:10px;padding:5px 7px;border-radius:6px}
.money-verified{background:#113f3f;color:#64dbb7;border:1px solid #215956}
.money-unknown{background:#32231c;color:#ffd29f;border:1px solid #6b4a30}
.cockpit-money-divider{border-top:1px solid #3a3b67;margin:15px 0}
.cockpit-money-meta{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:13px}
.cockpit-money-meta small{display:block;color:#8d9ac1;font-size:10px}
.cockpit-money-meta strong{display:block;color:#e6daff;font-size:15px;margin-top:5px}
.cockpit-money-plot{
  background:radial-gradient(ellipse at 50% 35%,#4b3a7c24,transparent 70%),
  repeating-linear-gradient(to bottom,transparent 0 35px,#56608a25 36px 37px);
  min-height:90px;border-radius:7px;border:1px solid #423d6a;
  display:grid;place-items:center;color:#968bb7;font-size:11px;text-align:center;padding:14px;
}
.overview-list{display:grid;gap:8px}
.overview-list .overview-line{
  display:grid;grid-template-columns: minmax(0,1fr) auto;gap:11px;align-items:center;
  border-bottom:1px solid #234157;padding:8px 0;font-size:11px;
}
.overview-list .overview-line:last-child{border:0}
.overview-line strong{display:block;font-weight:650;color:#c9e7f8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.overview-line small{display:block;color:#688da9;font-size:10px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.overview-line .line-badge{font-size:10px;padding:5px 7px;border-radius:7px;background:#163a4b;color:#73c5df;border:1px solid #2a586f}
.overview-line .line-badge.alert{color:#f4bd84;border-color:#84593b;background:#32251f}
.cockpit-gauge{display:grid;place-items:center;padding:11px}
.cockpit-gauge-ring{
  width:126px;height:126px;border-radius:50%;display:grid;place-items:center;
  border:12px solid #1a5068;background:#0b263e;box-shadow:inset 0 0 23px #125a7948,0 0 18px #1775a724;
}
.cockpit-gauge-ring strong{font-size:13px;text-align:center;color:#f4bc78}
.cockpit-gauge small{font-size:10px;color:#7da5ba;text-align:center;margin-top:10px}
.cockpit-actions{display:grid;gap:8px}
.cockpit-action{
  min-height:40px;width:100%;display:flex;align-items:center;justify-content:center;
  border:1px solid #2871a4;background:linear-gradient(110deg,#164672,#123456);
  border-radius:8px;color:#bbebff;font-weight:700;font-size:11px;cursor:pointer;
}
.cockpit-action:hover{filter:brightness(1.2)}
.cockpit-action:focus-visible{outline:2px solid #5bd0ff;outline-offset:2px}
.cockpit-action.disabled{color:#ebafaa;background:#38202b;border-color:#744254;cursor:not-allowed}
.cockpit-actions .action-caption{color:#7c9cb4;line-height:1.6;font-size:10px}
.cockpit-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cockpit-tags .tag{border:1px solid #345775;border-radius:6px;padding:7px 9px;color:#87bbd9;background:#0b263b;font-size:11px}
.cockpit-locked-strip{
  padding:10px;border-radius:7px;border:1px solid #764154;background:#291b2b;
  color:#eda4ae;font-weight:650;font-size:10px;line-height:1.6;
}
.cockpit-sources{font-size:10px;color:#6c99b6}
.overview-cockpit .table-wrap{max-height:185px;overflow:auto}
.overview-cockpit .data-table{min-width:0}
.overview-cockpit .data-table td,.overview-cockpit .data-table th{padding:8px 7px}
@media(max-width:1550px){
 .overview-cockpit .kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
 .overview-grid .hero-research{grid-column:span 7}
 .overview-grid .hero-funnel{grid-column:span 5}
 .overview-grid .hero-money{grid-column:span 5}
 .overview-grid .overview-agent{grid-column:span 7}
 .overview-grid .overview-feed{grid-column:span 6}
 .overview-grid .overview-holdings{grid-column:span 6}
 .overview-grid .overview-risk{grid-column:span 4}
 .overview-grid .overview-market{grid-column:span 4}
 .overview-grid .overview-events{grid-column:span 4}
 .overview-grid .overview-actions{grid-column:span 12}
 .cockpit-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1070px){
 .topbar{height:auto;min-height:68px;flex-wrap:wrap;gap:8px}
 .top-nav{flex-basis:100%;order:3;max-width:100%}
 .sidebar{width:174px}
 .main{padding:17px}
 .overview-grid .hero-research,.overview-grid .hero-funnel,.overview-grid .hero-money,
 .overview-grid .overview-agent,.overview-grid .overview-feed,.overview-grid .overview-holdings,
 .overview-grid .overview-risk,.overview-grid .overview-market,.overview-grid .overview-events{grid-column:span 6}
}
@media(max-width:700px){
 .overview-cockpit .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .overview-grid .hero-research,.overview-grid .hero-funnel,.overview-grid .hero-money,
 .overview-grid .overview-agent,.overview-grid .overview-feed,.overview-grid .overview-holdings,
 .overview-grid .overview-risk,.overview-grid .overview-market,.overview-grid .overview-events,
 .overview-grid .overview-actions{grid-column:span 12;min-height:auto}
 .cockpit-actions{grid-template-columns:1fr 1fr}
 .sidebar{display:none}
 .main{padding:13px}
}
@media(prefers-reduced-motion:reduce){.top-nav button,.side-link{transition:none}}

/* A real UTC quote timestamp must not widen the reference Overview card. */
.cockpit-tags .tag{min-width:0;max-width:100%;overflow-wrap:anywhere}
.cockpit-tags .tag small{display:block;max-width:100%;overflow-wrap:anywhere}

/* Keep independently sourced mark and rolling-trade-change labels legible. */
.cockpit-tags .tag .market-trend{display:block;margin-top:5px;font-size:11px;font-weight:700}
.cockpit-tags .tag .market-trend-time{display:block;overflow-wrap:anywhere;font-size:9px}
.cockpit-tags .tag .market-trend.up{color:#66dabb}
.cockpit-tags .tag .market-trend.down{color:#efa1ae}
.cockpit-tags .tag .market-trend.flat{color:#c0d2de}
.cockpit-tags .tag .market-trend.unknown{color:#8ca8bf;font-weight:400}
