/* M-BOX: a quiet control room, with stage lighting reserved for headline data. */
:root{--bg:#101522;--side:#141b2b;--card:#1b2436;--border:#344055;--text:#f4f1eb;--muted:#aab5c9;--purple:#b6a4ef;--up:#ff929b;--down:#65c78c;--stage-hover:#263149;--stage-soft:#202b40;color-scheme:dark}
body{font-family:'Segoe UI','Microsoft YaHei',sans-serif;line-height:1.55;background:var(--bg);font-variant-numeric:tabular-nums}
aside{width:232px;padding:34px 20px 20px;background:var(--side);border-color:var(--border);z-index:3;overflow-y:auto}
.brand{font-family:'Arial Narrow','Segoe UI',sans-serif;letter-spacing:-1px;font-size:26px;gap:12px}
.brandmark{border-radius:4px 14px 4px 4px;transform:none;width:42px;height:46px;background:var(--purple);box-shadow:none}
.brand small{font-size:9px;letter-spacing:.7px;margin-top:7px}.nav-label{letter-spacing:.5px;font-size:11px;color:var(--muted);margin:40px 12px 14px}
nav a{padding:12px 14px;margin:6px 0;border-radius:8px;gap:12px;transition:background .18s,color .18s}
nav a.active{background:#b6a4ef16;color:var(--text);box-shadow:inset 3px 0 var(--purple)}nav a:hover{background:var(--stage-hover)}
.aside-bottom{margin-top:auto;padding-top:24px;line-height:2.2}.aside-bottom small{font-size:11px}.live-dot{background:var(--purple)}
main{margin-left:232px;max-width:1820px;padding:42px clamp(24px,3.4vw,64px) 24px}
header{position:relative;padding:4px 0 27px;margin-bottom:25px;border-bottom:1px solid var(--border);gap:24px}
header:after{content:none}
.eyebrow{letter-spacing:1px;font-size:10px;color:var(--muted)}h1{font-size:clamp(28px,2.8vw,42px);font-weight:700;letter-spacing:-1px;margin:8px 0 10px;line-height:1.22}header p{font-size:13px;max-width:55ch}h2{font-size:18px;font-weight:650;letter-spacing:.1px}
button,input,select{min-height:40px;border-radius:7px}button{background:var(--stage-soft);transition:background .16s,border-color .16s;color:var(--text)}button:hover{background:var(--stage-hover);border-color:var(--purple)}button:active:not(:disabled){filter:brightness(.94)}
input,select{background:var(--bg);border-color:var(--border)}.primary{background:var(--purple);color:#171d2e}.primary:hover{background:#c9baf9}.account-actions{gap:10px}.account-actions span{border-right:1px solid var(--border);padding-right:12px}
.toolbar{background:var(--side);padding:14px 16px;border-color:var(--border);border-radius:10px;gap:14px}.presets button.chosen{background:#b6a4ef24;color:var(--text)}
.analysis-controls{gap:12px;margin:18px 0}.analysis-controls label{font-size:12px;gap:7px}.analysis-controls button,.analysis-controls select{font-size:12px}.advanced-controls{padding:14px 16px;border-radius:8px;background:var(--side)}.advanced-controls summary{font-size:12px;min-height:24px}.freshness{padding:10px 0 10px 14px;border-left:2px solid var(--purple);font-size:12px;margin:20px 0 24px}
.period-caption{margin:0 0 18px;font-size:14px}.period-caption span{font-size:12px;margin-top:5px}.north-grid{gap:24px}
.metric-card{border-radius:10px;padding:24px;background:var(--card);border-color:var(--border);box-shadow:none;transition:border-color .18s,background .18s}
.metric-card:hover{background:var(--stage-hover);border-color:#7885a0}.metric-card .label{color:var(--text);font-size:13px;align-items:center;gap:8px}.metric-card .label span{color:var(--purple)}
.north-card{position:relative;isolation:isolate;overflow:hidden;padding:30px 32px;min-height:245px;background:linear-gradient(115deg,#302d4d 0%,#202b40 72%);border-color:#555474;border-radius:12px}
.north-card:after{content:'';position:absolute;inset:-70px -20px auto auto;width:160px;height:370px;background:linear-gradient(90deg,transparent,#b6a4ef0d,transparent);transform:rotate(25deg);z-index:-1;pointer-events:none}
.north-card:hover{background:linear-gradient(115deg,#383456,#263149 72%)}.north-card .label{font-size:15px}.north-card .metric-number{font-family:'Bahnschrift','Segoe UI',sans-serif;font-size:clamp(36px,4vw,64px);font-weight:600;letter-spacing:-1.8px;line-height:1.15;margin:22px 0 18px}.metric-number small{letter-spacing:0;margin-left:4px;color:var(--muted);font-family:'Microsoft YaHei',sans-serif;font-size:12px}.metric-card p{font-size:12px;line-height:1.75;margin:12px 0}.owner{font-size:11px}.delta{font-size:12px}
.section-label{margin:36px 0 18px;gap:16px}.health-grid{gap:16px}.health-grid .metric-card{padding:22px 18px}.health-grid .metric-number{font-size:28px;line-height:1.3;margin:18px 0 14px}.panel{border-radius:10px;border-color:var(--border);padding:24px}.panel-head{margin-bottom:24px}.panel-head small{font-size:12px}.grid{gap:24px;margin-bottom:24px}
.action-grid{gap:20px}.action-card{background:var(--card);border-radius:8px;padding:22px 24px;border-color:var(--border);border-left-color:#ddb467}.attention{font-size:11px}.action-card h3{font-size:15px}.explore-grid a{background:transparent;border-radius:8px;padding:19px 22px;transition:background .18s}.explore-grid a:hover{background:var(--stage-soft)}
.kpi{border-color:var(--border);border-radius:10px}.kpi.hero{background:#302d4d}.chart text{fill:var(--muted);font-size:11px}.chart .gridline{stroke:var(--border)}.bar-track{background:var(--border)}.bar-row .value{color:var(--text)}
th{background:var(--stage-soft);font-size:12px;font-weight:600;padding:15px 14px}td{border-color:var(--border);padding:15px 14px}tbody tr:hover{background:var(--stage-soft)}.table-wrap{border-radius:6px}.month{border-color:var(--border)}.month summary{color:var(--text)}.insight{background:var(--side);border-color:var(--border)}.dropzone{background:var(--stage-soft)}
dialog{background:var(--side);border-color:var(--border);border-radius:14px;padding:28px;box-shadow:0 24px 100px #0006}dialog[open]{animation:stage-enter .2s ease-out}dialog::backdrop{background:#050915b8;backdrop-filter:blur(6px)}#login{width:min(420px,94vw)}#login form{gap:18px}#toast{background:var(--card);color:var(--text);border-color:var(--purple)}footer{font-size:11px;letter-spacing:0;color:var(--muted);padding:28px 0 12px;gap:16px}
:where(button,a,input,select,summary):focus-visible{outline:2px solid var(--purple);outline-offset:4px}@keyframes stage-enter{from{opacity:.7;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
[data-theme=light]{--bg:#f1f3f7;--side:#e8ecf3;--card:#fff;--border:#d3dbe7;--text:#202b40;--muted:#5a687f;--purple:#6951a5;--stage-hover:#eef0f8;--stage-soft:#e8edf5;color-scheme:light}[data-theme=light] .north-card{background:linear-gradient(115deg,#e5ddf6,#f9faff 72%);border-color:#c6b9df}[data-theme=light] .north-card:hover{background:#eae3f7}[data-theme=light] .toolbar,[data-theme=light] th{background:var(--side)}[data-theme=light] .primary{background:var(--purple);color:#fff}[data-theme=light] .presets button.chosen{background:#ddd4ee;color:var(--text)}[data-theme=light] .kpi.hero{background:#e5ddf6}[data-theme=light] .insight strong{color:var(--text)}
@media(min-width:1600px){.health-grid .metric-card{padding:25px}.health-grid .metric-number{font-size:32px}}
@media(max-width:1100px){aside{width:196px;padding:28px 14px}main{margin-left:196px;padding:28px 24px}.north-card{padding:24px}.north-card .metric-number{font-size:38px}.report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){aside{position:static;width:100%;padding:18px 16px 8px;overflow:visible}.brand{font-size:24px}.brandmark{width:34px;height:38px;font-size:24px}nav{gap:5px;margin-top:16px;padding-bottom:6px}nav a{padding:10px 12px;margin:0;min-height:40px}main{margin-left:0;padding:24px 16px}header{gap:16px;padding-bottom:20px;margin-bottom:20px}h1{font-size:30px}header p{font-size:12px}.account-actions{justify-content:flex-start;gap:8px}.account-actions button{font-size:12px}.north-grid{gap:12px}.north-card{padding:18px 15px;min-height:225px}.north-card .label{font-size:13px}.north-card .metric-number{font-size:clamp(25px,6.8vw,40px);letter-spacing:-1px;margin:20px 0 14px}.metric-number small{font-size:11px;margin-left:0}.metric-card p{font-size:11px}.north-card .owner{font-size:10px}.health-grid{gap:12px}.health-grid .metric-card{padding:18px 15px}.health-grid .metric-number{font-size:26px}.section-label{margin:28px 0 16px}.section-label h2{font-size:16px}.panel{padding:18px}.analysis-controls{gap:10px}.analysis-controls>button{font-size:12px;padding:9px 12px}.toolbar{padding:12px}.freshness{font-size:11px}.date-range{gap:5px}.date-range input{width:0;min-width:0}.grid{gap:16px}.action-card{padding:20px}footer{flex-wrap:wrap}.connections-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Operate-mode refinement: fixed type scale, semantic surfaces, progressive controls. */
:root{--font-ui:'Segoe UI','PingFang SC','Microsoft YaHei','Noto Sans CJK SC',sans-serif;--radius-panel:12px;--radius-control:8px;--control-border:#748199;--selection:#343247;--warning:#e4bd7c;--duration-fast:160ms;--duration-reveal:200ms}
body{font-family:var(--font-ui);font-size:14px;line-height:1.6}
::selection{background:var(--purple);color:var(--bg)}input,textarea{caret-color:var(--purple)}input::placeholder{color:var(--muted);opacity:1}
button,input,select{border-radius:var(--radius-control)}input,select{border-color:var(--control-border)}button{transition:background var(--duration-fast),border-color var(--duration-fast);white-space:nowrap}button:disabled{cursor:not-allowed;opacity:.6}a{text-underline-offset:4px}
main{padding-top:28px;max-width:1760px}header{padding:0 0 20px;gap:20px;margin-bottom:20px}h1{font-size:30px;letter-spacing:-.025em;line-height:1.25;margin:0 0 8px}header p{font-size:13px}h2{font-size:18px;line-height:1.45}h3{font-size:15px}
nav{margin-top:32px}nav a.active{box-shadow:none;background:var(--selection);color:var(--text)}nav a i{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.ui-icon{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.mobile-menu{display:none}.skip-link{position:fixed;top:8px;left:8px;z-index:20;padding:12px;background:var(--card);transform:translateY(-180%)}.skip-link:focus{transform:none}
.account-actions{gap:8px}.account-actions button{font-size:12px}.account-actions #themeToggle{background:transparent;color:var(--muted)}
.advanced-controls{background:transparent;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:8px 0;margin:0}.advanced-controls summary{padding:6px 0;font-size:13px;min-height:36px}.date-controls .toolbar{background:transparent;border:0;padding:8px 0;margin:0}.analysis-controls{margin:8px 0 12px}.freshness{border:0;padding:0;margin:18px 0 20px;font-size:13px;line-height:1.65}.period-caption{font-size:13px;margin-bottom:16px}.period-caption span{font-size:12px}
.north-grid{gap:20px}.metric-card,.panel,.kpi,.action-card{border-radius:var(--radius-panel);white-space:normal}.north-card{background:var(--card);border-color:var(--border);padding:24px 28px;min-height:220px}.north-card:after{content:none}.north-card:first-child{background:var(--selection)}.north-card:hover{background:var(--stage-hover)}.north-card .metric-number{font-family:var(--font-ui);font-variant-numeric:lining-nums tabular-nums;font-size:48px;letter-spacing:-.03em;line-height:1.2;margin:16px 0 12px}.north-card .label{font-size:14px}.metric-card p{font-size:12px;line-height:1.7}.owner{font-size:12px}.metric-number small{font-family:var(--font-ui);font-size:12px}
.health-grid{gap:0;border:1px solid var(--border);border-radius:var(--radius-panel);overflow:hidden;background:var(--card)}.health-grid .metric-card{border:0;border-right:1px solid var(--border);border-radius:0;background:transparent;padding:20px}.health-grid .metric-card:last-child{border-right:0}.health-grid button.metric-card:hover{background:var(--stage-hover)}.health-grid .metric-number{font-family:var(--font-ui);font-size:28px;letter-spacing:-.025em}.health-grid .metric-card .label{font-size:13px}.metric-card:not(button):hover{border-color:var(--border);background:var(--card)}
.action-card{border-left-width:1px;border-color:var(--border)}.attention{color:var(--warning);font-size:12px}.action-card:hover{border-color:var(--warning)}.section-label{margin:32px 0 16px}.explore-grid{gap:0;border-top:1px solid var(--border)}.explore-grid a{border:0;border-bottom:1px solid var(--border);border-radius:0;padding:18px 12px}.panel .panel{border:0;background:transparent;padding:0;border-radius:0}
.note,.panel-head small,.metric-card .owner,.kpi small{font-size:12px}.chart text{font-family:var(--font-ui)}.bar-row{font-size:13px}.empty{font-size:14px}.tag{font-size:12px}.warn-box{line-height:1.8}.primary{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:10px 14px}
[data-theme=light]{--selection:#ede7f6;--control-border:#7d899e;--warning:#82570c;--up:#bb2941;--down:#116d3c}[data-theme=light] .north-card{background:var(--card);border-color:var(--border)}[data-theme=light] .north-card:first-child{background:var(--selection)}[data-theme=light] .north-card:hover{background:var(--stage-hover)}[data-theme=light] .date-controls .toolbar{background:transparent}[data-theme=light] .attention{color:var(--warning)}[data-theme=light] .warn-box{background:#faf1dd;color:#714a0b;border-color:#bfa16b}[data-theme=light] .error{color:#b32c42}
@media(min-width:701px) and (max-width:1299px){.health-grid .metric-card{border-bottom:1px solid var(--border)}.health-grid .metric-card:last-child{border-bottom:0}.report-grid .metric-card:last-child{grid-column:auto}}
@media(max-width:1100px){.north-card .metric-number{font-size:36px}.account-actions{max-width:320px}.health-grid .metric-card{padding:18px}}
@media(max-width:700px){
 aside{display:grid;grid-template-columns:1fr auto;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border)}.brand small{font-size:9px;margin-top:3px}.brandmark{width:32px;height:36px}.mobile-menu{display:block;min-height:44px;font-size:12px}aside nav{display:none;grid-column:1/-1;margin:12px 0 0;overflow:visible;padding:0}aside.nav-open nav{display:grid;grid-template-columns:1fr 1fr;gap:4px}nav a{min-height:44px;padding:10px 12px}nav a i{display:flex}main{padding:18px 16px}header{gap:10px;padding-bottom:14px;margin-bottom:10px}h1{font-size:24px;margin:0 0 4px}header p{font-size:12px;margin:0}.account-actions{width:100%;max-width:none;gap:6px}.account-actions button{min-height:36px;padding:7px 9px;font-size:12px}.account-actions span{font-size:11px;padding-right:8px}.advanced-controls summary{min-height:40px;padding:9px 0;font-size:12px}.freshness{font-size:12px;margin:12px 0}.period-caption{font-size:12px;margin:0 0 12px}.period-caption span{font-size:11px;margin-top:4px}.north-grid{gap:12px}.north-card{padding:16px 14px;min-height:210px}.north-card .metric-number{font-size:28px;letter-spacing:-.035em;margin:16px 0 10px;white-space:nowrap}.north-card .label{font-size:12px}.north-card .metric-number small{font-size:11px}.north-card .metric-card p{min-height:0}.north-card .owner{font-size:11px}.health-grid .metric-card{padding:16px;border-bottom:1px solid var(--border)}.health-grid .metric-card:last-child{border-bottom:0}.health-grid .metric-number{font-size:26px}.report-grid .metric-card:last-child{grid-column:auto}.section-label{margin:24px 0 14px}.section-label h2{font-size:16px}.date-range input{font-size:12px}.presets button{padding:8px}.panel{padding:18px}.metric-card p{font-size:12px}.explore-grid a{font-size:13px}.form-grid{grid-template-columns:1fr}dialog{padding:20px}.analysis-controls>button,.analysis-controls select{min-height:44px}
}
@media(max-width:360px){.north-grid{grid-template-columns:1fr}.north-card{min-height:0}.north-card .metric-number{font-size:36px}}