/* Quant Desk visual foundation · typography uses rem for browser text scaling. */
:root { --ink:#182f35; --muted:#52666c; --line:#d7e1e3; --teal:#0c675b; --teal-light:#e9f5f0; --amber:#80570f; --red:#a53636; --sidebar:#132d31; --paper:#f3f6f7; --radius:16px; --focus:#096cba; --control-border:#7b9197}
* { box-sizing:border-box}
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; background:var(--paper); color:var(--ink); font-size:0.875rem; line-height:1.5}
button,input,select,textarea { font:inherit}
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent}
button,a { touch-action:manipulation}
button { cursor:pointer}
button:disabled { opacity:.48; cursor:not-allowed}
a { text-decoration:none; color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible { outline:3px solid #8bbcb3; outline-offset:3px}
[hidden] { display:none!important}
.sidebar { position:fixed; inset:0 auto 0 0; width:235px; background:var(--sidebar); color:#dce8e4; padding:31px 21px; z-index:20; display:flex; flex-direction:column}
.brand { display:flex; align-items:center; gap:12px; font-size:1.3125rem; letter-spacing:-.4px; font-weight:650}
.brand-mark { position:relative; width:37px; height:37px; display:grid; place-items:center; color:#133f36; background:#e0f1d8; border-radius:11px; font-weight:800; font-size:1.625rem; line-height:1}
.brand-mark>span { position:absolute; right:4px; bottom:2px; font-size:1.25rem}
.brand small { display:block; font-size:0.75rem; color:#91a6a0; letter-spacing:1.35px; margin-top:4px; font-weight:500}
.workspace-chip { display:flex; align-items:center; gap:10px; border:1px solid #344542; border-radius:10px; padding:13px 11px; margin-top:37px; font-size:0.875rem}
.workspace-icon { background:#364c45; width:29px; height:29px; display:grid; place-items:center; border-radius:7px; color:#cde1d7; font-size:0.875rem}
.workspace-chip small { display:block; font-size:0.8125rem; color:#849d95; margin-top:3px}
.workspace-chip .local-dot { margin-left:auto}
.local-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#8dbba2}
.nav-label { font-size:0.8125rem; letter-spacing:1px; color:#748e87; margin:34px 12px 12px}
.nav-item { width:100%; border:0; color:#91aaa2; background:none; text-align:left; border-radius:8px; display:flex; align-items:center; gap:13px; padding:13px 14px; margin:4px 0; font-size:0.875rem; transition:background .2s}
.nav-item:hover { background:#213b34; color:#e8f5ed}
.nav-item.active { background:#dcebd8; color:#294d3b; font-weight:650}
.nav-icon { font-size:1.25rem; line-height:1; width:20px; text-align:center}
.nav-end { margin-left:auto}
.sidebar-bottom { margin-top:auto; padding:24px 13px 0}
.side-badge { font-size:0.75rem; letter-spacing:1.5px; color:#9cac95}
.sidebar-bottom p { font-size:1.0625rem; line-height:1.85; font-weight:300; color:#a9bfb2; margin:15px 0 28px}
.sidebar-status { border-top:1px solid #2c423b; padding-top:20px; color:#7f9a8f; font-size:0.8125rem; letter-spacing:.4px}
.sidebar-status .local-dot { margin-right:7px}
.app-shell { margin-left:235px}
.topbar { height:75px; display:flex; align-items:center; justify-content:space-between; padding:0 39px; border-bottom:1px solid var(--line); background:#fff}
.breadcrumb { display:flex; gap:16px; font-size:0.875rem; color:var(--muted)}
.breadcrumb>span { color:var(--muted)}
.breadcrumb strong { font-weight:500; color:var(--muted)}
.topbar-right { display:flex; gap:17px; align-items:center}
.status-chip { display:flex; gap:7px; align-items:center; font-size:0.8125rem; color:var(--muted)}
.status-chip i { width:6px; height:6px; border-radius:50%; background:#80a18a}
.status-chip.busy i { background:#c69a50; box-shadow:0 0 0 3px #f5edda}
.status-chip.halted i { background:#bb6757}
.utc-label { font-size:0.8125rem; color:var(--muted); letter-spacing:1px; border-left:1px solid var(--line); padding-left:16px}
.icon-button { border:0; background:transparent; color:var(--muted); font-size:1.4375rem; padding:0 4px; line-height:1}
.icon-button:hover { color:var(--teal)}
main { max-width:1650px; margin:0 auto; padding:25px 39px 18px}
.environment-banner { display:flex; align-items:center; gap:10px; background:#faf3e3; border:1px solid #f0e2bc; color:var(--muted); border-radius:8px; padding:9px 14px; font-size:0.8125rem}
.banner-icon { font-size:1.125rem; line-height:1}
.environment-banner strong { font-weight:500}
.environment-banner>span:last-child { margin-left:auto; color:var(--muted); font-size:0.8125rem}
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:31px 0 24px}
.eyebrow { color:var(--muted); font-size:0.75rem; letter-spacing:2px; font-weight:600; margin:0 0 9px}
h1 { font-size:1.625rem; letter-spacing:-.9px; line-height:1.3; font-weight:650; margin:0 0 10px}
.page-subtitle { font-size:0.875rem; color:var(--muted); margin:0}
h2 { margin:0; font-size:0.9375rem; font-weight:600; letter-spacing:-.2px}
.heading-actions { display:flex; gap:9px; flex-shrink:0}
.button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:37px; padding:9px 15px; border:1px solid transparent; border-radius:7px; font-size:0.8125rem; font-weight:550; line-height:1.4; white-space:nowrap; transition:background .15s,box-shadow .15s}
.primary { background:var(--teal); color:#fff}
.primary:hover:not(:disabled) { background:#0e594f; box-shadow:0 3px 10px #126b6115}
.secondary { background:white; border-color:#dce5df; color:var(--muted)}
.secondary:hover:not(:disabled) { background:#f1f6f2}
.subtle { background:transparent; color:var(--muted)}
.subtle:hover:not(:disabled) { background:#f7f3ed}
.static-label { background:#e9f1eb; color:var(--muted)}
.full-width { width:100%}
.metrics-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:21px}
.metric { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:20px 21px 16px; min-width:0}
.metric-label { color:var(--muted); font-size:0.8125rem; display:flex; justify-content:space-between; align-items:center}
.small-pill { display:inline-flex; background:#f0f4f0; color:var(--muted); border:1px solid #e6ede6; font-size:0.75rem; line-height:1.5; letter-spacing:.3px; border-radius:4px; padding:2px 6px; white-space:nowrap}
.metric-value { font-variant-numeric:tabular-nums; font-size:2rem; font-weight:600; letter-spacing:-1.1px; margin:12px 0 13px; line-height:1.2}
.metric-value small { font-size:0.9375rem; letter-spacing:0; margin-left:2px; font-weight:500; color:var(--muted)}
.metric-foot { display:flex; align-items:center; gap:7px; font-size:0.75rem; color:var(--muted); white-space:nowrap}
.metric-foot strong { font-size:0.8125rem; color:var(--muted); font-weight:500}
.metric-symbol { color:var(--muted); font-size:1.1875rem; line-height:1}
.mini-bars { margin-left:auto; color:var(--muted); letter-spacing:1px; line-height:1.1; font-size:1.375rem}
.positive { color:var(--muted)!important}
.negative { color:var(--muted)!important}
.overview-grid { display:grid; grid-template-columns:minmax(0,2.25fr) minmax(255px,1fr); gap:20px; align-items:stretch}
.card { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px; min-width:0}
.card-heading { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:20px}
.card-heading p { font-size:0.8125rem; color:var(--muted); margin:6px 0 0; line-height:1.6}
.tiny-label { font-size:0.75rem; letter-spacing:1.3px; color:var(--muted)}
.chart-card { padding-bottom:0; display:flex; flex-direction:column}
.chart-tools { display:flex; gap:12px; align-items:center}
.chart-legend { display:flex; align-items:center; gap:6px; font-size:0.75rem; color:var(--muted); white-space:nowrap}
.chart-legend i { width:6px; height:6px; background:#398a74; border-radius:50%}
select { appearance:auto; border:1px solid #e3eae4; background:#fff; color:var(--muted); border-radius:6px; font-size:0.8125rem; padding:7px 9px}
input,textarea { border:1px solid #dfe8e1; background:#fff; color:var(--muted); border-radius:6px; padding:9px 10px; font-size:0.875rem; max-width:100%}
input::placeholder,textarea::placeholder { color:var(--muted)}
input:focus,select:focus,textarea:focus { border-color:#82aa95; outline:0; box-shadow:0 0 0 3px #dfeee440}
.chart-wrap { position:relative; min-height:247px; flex:1; display:flex; align-items:center; justify-content:center}
.chart-wrap svg { width:100%; height:auto; overflow:visible}
.chart-empty { text-align:center; color:var(--muted); padding:34px 10px}
.chart-empty>span { display:block; font-size:3.25rem; font-weight:200; line-height:1}
.chart-empty strong { display:block; font-size:0.875rem; color:var(--muted); font-weight:500; margin:14px 0 5px}
.chart-empty p { font-size:0.8125rem; margin:0; color:var(--muted)}
.chart-footer { border-top:1px solid #eff2ec; display:flex; justify-content:space-between; gap:10px; padding:14px 0; font-size:0.75rem; color:var(--muted); margin-top:15px}
.chart-tooltip { position:absolute; background:#193a30; color:#fff; padding:7px 10px; border-radius:6px; font-size:0.8125rem; pointer-events:none; z-index:2; box-shadow:0 4px 15px #21372f20; white-space:nowrap}
.run-card .card-heading { margin-bottom:19px}
.cursor-box { background:#f7f9f4; border:1px solid #eaf0e5; border-radius:7px; padding:11px 13px; margin-bottom:18px}
.cursor-box>span { font-size:0.75rem; color:var(--muted)}
.cursor-box strong { display:block; font-size:1.375rem; letter-spacing:.8px; font-weight:550; margin:3px 0}
.cursor-box small { font-size:0.75rem; color:var(--muted)}
.field-label { display:block; font-size:0.8125rem; color:var(--muted); margin:0 0 8px; font-weight:500}
.day-shortcuts { display:grid; grid-template-columns:repeat(3,1fr) 54px; gap:5px; margin-bottom:12px}
.day-shortcuts button { background:#fff; border:1px solid #e0e9dc; border-radius:5px; padding:7px 0; font-size:0.8125rem; color:var(--muted)}
.day-shortcuts button.selected { background:#edf4e9; border-color:#d7e4cf; color:var(--muted)}
.day-shortcuts input { padding:6px; width:54px; text-align:center; font-size:0.8125rem}
.fault-control { font-size:0.75rem; color:var(--muted); margin-bottom:14px}
.fault-control summary { cursor:pointer; list-style:none; padding:4px 0}
.fault-control summary:before { content:'＋'; margin-right:4px}
.fault-control[open] summary:before { content:'−'}
.fault-control summary>span { float:right; font-size:0.75rem; color:var(--muted)}
.fault-control .field-label { margin-top:10px}
.fault-control select { width:100%}
.fault-control p { font-size:0.75rem; line-height:1.6}
.run-secondary { display:flex; gap:4px; justify-content:center; margin-top:10px}
.run-secondary .button { font-size:0.75rem; min-height:30px; padding:6px 10px}
.job-progress { margin-top:15px; font-size:0.75rem; color:var(--muted)}
.job-progress>div { display:flex; justify-content:space-between}
progress { width:100%; height:4px; appearance:none; border:0; border-radius:5px; overflow:hidden; display:block; margin-top:8px}
progress::-webkit-progress-bar { background:#edf2e9}
progress::-webkit-progress-value { background:#4c8d65}
progress::-moz-progress-bar { background:#4c8d65}
.lower-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:20px; margin-top:20px}
.attribution { display:flex; flex-direction:column; gap:17px; padding:0 1px}
.attribution>div { display:flex; align-items:center; gap:12px; font-size:0.8125rem; color:var(--muted)}
.attribution small { display:block; font-size:0.75rem; color:var(--muted); margin-top:2px}
.attribution strong { margin-left:auto; font-weight:550; color:var(--muted); font-variant-numeric:tabular-nums; font-size:0.9375rem}
.attr-icon { display:grid; place-items:center; width:33px; height:33px; border-radius:8px; font-size:1.125rem; background:#f0f6ec; color:var(--muted)}
.funding-icon { background:#edf4ef; color:var(--muted)}
.fee-icon { background:#f8f4eb; color:var(--muted)}
.key-values { margin:0}
.key-values>div { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; padding:9px 0; font-size:0.8125rem}
.key-values dt { color:var(--muted); flex-shrink:0}
.key-values dd { margin:0; color:var(--muted); text-align:right}
.page-footer { display:flex; justify-content:space-between; font-size:0.75rem; color:var(--muted); padding:23px 2px 8px}
.feedback,.halt-alert { border:1px solid #e1e9d9; border-radius:8px; padding:12px 15px; margin-top:15px; font-size:0.8125rem; line-height:1.7}
.feedback { background:#edf5e8; color:var(--muted)}
.feedback.error,.halt-alert { background:#fff3ed; border-color:#f0dcd0; color:var(--muted)}
.halt-alert p { margin:3px 0; font-size:0.875rem}
.halt-alert>span { font-size:0.8125rem; color:var(--muted)}
.strategy-summary { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px}
.strategy-summary h2 { font-size:1.375rem; letter-spacing:.2px}
.strategy-summary p { margin:7px 0 0; font-size:0.8125rem; color:var(--muted)}
.strategy-pills { display:flex; gap:24px; flex-wrap:wrap; justify-content:flex-end}
.strategy-pills>div { font-size:0.8125rem; color:var(--muted)}
.strategy-pills strong { display:block; font-size:1.1875rem; color:var(--muted); font-weight:500; margin-top:5px; font-variant-numeric:tabular-nums}
.table-tools { display:flex; gap:8px}
.table-tools input { font-size:0.8125rem; max-width:160px; padding:8px 10px}
.table-scroll { overflow-x:auto; margin:0 -22px}
table { border-collapse:collapse; width:100%; font-size:0.8125rem; white-space:nowrap}
th { text-align:left; background:#fafbf8; color:var(--muted); font-size:0.75rem; font-weight:500; padding:12px 18px; border-bottom:1px solid #edf1e8}
td { padding:14px 18px; border-bottom:1px solid #f0f3eb; color:var(--muted); font-variant-numeric:tabular-nums}
tr:last-child td { border-bottom:0}
td:first-child,th:first-child { padding-left:22px}
td:last-child,th:last-child { padding-right:22px}
tbody tr:hover { background:#fcfdfb}
.table-empty { text-align:center!important; padding:42px 20px!important; color:var(--muted); white-space:normal}
.symbol-name { font-weight:600; color:var(--muted); font-size:0.8125rem}
.symbol-name small { display:block; font-weight:400; color:var(--muted); font-size:0.75rem; margin-top:3px; max-width:175px; overflow:hidden; text-overflow:ellipsis}
.direction,.order-status { display:inline-block; border-radius:4px; font-size:0.75rem; padding:3px 6px; color:var(--muted); background:#eef5e8}
.direction.short { background:#fcf2e3; color:var(--muted)}
.order-status.bad { background:#fff1e9; color:var(--muted)}
.order-status.pending { background:#f9f4e3; color:var(--muted)}
.row-reason { font-size:0.75rem; color:var(--muted); white-space:normal; min-width:85px; max-width:220px}
.table-footer { font-size:0.75rem; color:var(--muted); padding-top:16px}
.weight-cell { display:flex; align-items:center; gap:9px}
.weight-bar { height:3px; background:#edf3e8; width:48px; border-radius:3px; overflow:hidden}
.weight-bar i { display:block; height:100%; background:#87ad76}
.weight-bar.short i { background:#d5b978}
.current-positions,.event-card { margin-top:20px}
.events-list { display:flex; flex-direction:column; gap:0}
.event-row { border-bottom:1px solid #edf1e7}
.event-row:last-child { border:0}
.event-row summary { display:flex; align-items:center; gap:15px; cursor:pointer; padding:14px 0; font-size:0.8125rem; list-style:none}
.event-row summary:before { content:'＋'; color:var(--muted)}
.event-row[open] summary:before { content:'−'}
.event-time { color:var(--muted); font-size:0.75rem; min-width:134px}
.event-kind { color:var(--muted)}
.event-row pre,.import-grid pre { font-size:0.8125rem; white-space:pre-wrap; word-break:break-word; background:#f6f9f2; border:1px solid #e9efdf; border-radius:6px; padding:13px; color:var(--muted); max-height:350px; overflow:auto}
.data-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:20px}
.spacious>div { padding:12px 0; border-bottom:1px solid #f0f3e9}
.hash-details { font-size:0.8125rem; color:var(--muted); margin-top:17px}
.hash-details summary { cursor:pointer}
.hash-details code { font-size:0.75rem; display:block; word-break:break-all; margin-top:10px; color:var(--muted)}
.inline-form { display:flex; gap:8px}
.inline-form input { min-width:0; flex:1; font-size:0.8125rem}
.live-summary { font-size:0.8125rem; line-height:1.8; color:var(--muted); padding:15px 0}
.inline-error { font-size:0.8125rem; line-height:1.6; background:#fdf2e6; color:var(--muted); padding:10px; border-radius:6px; margin:8px 0; overflow-wrap:anywhere}
.rules-import,.boundaries { margin-top:20px}
.import-grid { display:grid; grid-template-columns:.85fr 1.4fr; gap:28px}
.import-grid input[type=file] { border:1px dashed #dce7cc; width:100%; padding:13px; background:#fafcf6; font-size:0.8125rem}
.import-grid textarea { width:100%; font-family:ui-monospace,SFMono-Regular,monospace; font-size:0.8125rem; line-height:1.7; resize:vertical; background:#fafcf7}
.muted { font-size:0.8125rem; color:var(--muted); line-height:1.8}
.import-grid .muted { font-size:0.8125rem; margin:13px 0 19px}
.boundaries ul { padding-left:17px; font-size:0.8125rem; color:var(--muted); line-height:2.1; margin:0}
.boundaries li::marker { color:var(--muted)}
dialog { border:1px solid #e0e9d5; border-radius:17px; padding:27px; width:480px; max-width:calc(100vw - 30px); box-shadow:0 30px 100px #0b2a262e; color:var(--ink)}
dialog::backdrop { background:#0d26284d; backdrop-filter:blur(3px)}
.dialog-heading { display:flex; justify-content:space-between; align-items:flex-start}
.dialog-heading h2 { font-size:1.125rem}
.dialog-heading .icon-button { font-size:1.5625rem}
dialog .muted { margin:17px 0 22px}
dialog input { width:100%}
dialog .field-label { margin-top:16px}
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px}
.field-hint { font-size:0.75rem; color:var(--muted); line-height:1.8; margin:10px 0 20px}
.dialog-actions { display:flex; justify-content:flex-end; gap:9px; border-top:1px solid #edf1e4; padding-top:19px}

@media(min-width:1550px) { main { padding-left:45px; padding-right:45px}
.metric-value { font-size:2.3125rem}
.chart-wrap { min-height:280px}
}
@media(max-width:1250px) { .sidebar { width:200px; padding:29px 15px}
.app-shell { margin-left:200px}
.brand { font-size:1.125rem; gap:9px}
.brand small { font-size:0.75rem}
.topbar { padding:0 25px}
main { padding:22px 25px}
.page-heading { align-items:flex-start}
.heading-actions { flex-direction:column; gap:6px}
.metric { padding:18px 16px}
.metric-value { font-size:1.75rem}
.mini-bars { display:none}
.metric-foot { font-size:0.75rem; gap:5px}
.metric-foot strong { font-size:0.75rem}
.card { padding:19px}
.table-scroll { margin:0 -19px}
.overview-grid { gap:16px; grid-template-columns:minmax(0,1.8fr) 260px}
.chart-legend { display:none}
.chart-footer { font-size:0.75rem}
.lower-grid { gap:16px}
.environment-banner { font-size:0.8125rem}
.data-grid { grid-template-columns:1fr}
.table-tools { flex-direction:column}
.strategy-pills { gap:16px}
}
@media(max-width:1000px) { .sidebar { width:72px; padding:24px 12px}
.brand { justify-content:center}
.brand>span:last-child,.workspace-chip,.nav-label,.nav-item:not(.active) .nav-end,.sidebar-bottom { display:none}
.sidebar nav { margin-top:40px}
.nav-item { font-size:0; padding:14px; justify-content:center; gap:0}
.nav-item .nav-end { display:none}
.nav-icon { font-size:1.3125rem}
.app-shell { margin-left:72px}
.overview-grid { grid-template-columns:minmax(0,1fr) 260px}
.page-heading h1 { font-size:1.4375rem}
.page-subtitle { font-size:0.8125rem}
.metrics-grid { gap:11px}
.metric-label { font-size:0.8125rem}
.metric-value { font-size:1.625rem}
.metric-foot>span:last-child:not(.mini-bars) { display:none}
.strategy-summary { align-items:flex-start; gap:20px}
.strategy-pills { max-width:55%; gap:15px}
.strategy-pills strong { font-size:1.0625rem}
.lower-grid { grid-template-columns:1fr 1fr}
.key-values>div { font-size:0.75rem; gap:7px}
.attribution>div { font-size:0.8125rem}
.attribution strong { font-size:0.875rem}
}
@media(max-width:780px) { .topbar { height:63px; padding:0 20px}
main { padding:17px 20px}
.environment-banner>span:last-child { display:none}
.page-heading { margin:25px 0 20px; flex-wrap:wrap; gap:15px}
.heading-actions { flex-direction:row}
.metrics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.metric-value { font-size:1.8125rem}
.metric-foot>span:last-child:not(.mini-bars) { display:inline}
.overview-grid { grid-template-columns:1fr}
.run-card { display:grid; grid-template-columns:1fr 1fr; gap:0 20px; align-items:center}
.run-card .card-heading { grid-column:1/-1; margin-bottom:17px}
.cursor-box { grid-row:2/5; margin:0; align-self:stretch; display:flex; flex-direction:column; justify-content:center}
.run-card .field-label { grid-column:2}
.day-shortcuts { grid-column:2; margin-bottom:9px}
.fault-control { grid-column:2; margin-bottom:8px}
.run-card>.full-width { grid-column:1; grid-row:5; margin-top:12px}
.run-secondary { grid-column:2; grid-row:5}
.job-progress { grid-column:1/-1}
.lower-grid { grid-template-columns:1fr}
.card-heading p { font-size:0.8125rem}
.key-values>div { font-size:0.8125rem}
.chart-wrap { min-height:210px}
.card.chart-card { padding-top:20px}
.strategy-summary { flex-direction:column}
.strategy-pills { max-width:100%; justify-content:flex-start}
.table-tools { flex-direction:row}
.import-grid { grid-template-columns:1fr; gap:20px}
.import-grid textarea { min-height:160px}
.page-footer { font-size:0.75rem}
.event-time { min-width:auto}
.event-row summary { gap:9px; font-size:0.75rem}
.topbar-right { gap:12px}
.utc-label { display:none}
}
@media(max-width:480px) { .sidebar { width:58px; padding:21px 8px}
.brand-mark { width:31px; height:33px; font-size:1.4375rem}
.nav-item { padding:14px 9px}
.app-shell { margin-left:58px}
.topbar { padding:0 15px}
.breadcrumb { font-size:0.8125rem; gap:9px}
.topbar-right { gap:8px}
.status-chip { font-size:0.75rem}
main { padding:14px 14px}
.environment-banner { font-size:0.75rem; padding:8px 10px; gap:6px}
.banner-icon { font-size:1rem}
.page-heading h1 { font-size:1.25rem; letter-spacing:-.7px}
.eyebrow { font-size:0.75rem}
.page-subtitle { line-height:1.8}
.button { font-size:0.8125rem; padding:8px 12px}
.metric { padding:15px 13px}
.metric-value { font-size:1.5625rem}
.metric-foot { font-size:0.75rem; gap:4px; flex-wrap:wrap}
.metric-foot>span:last-child:not(.mini-bars) { display:none}
.metric-label { font-size:0.75rem}
.small-pill { font-size:0.75rem}
.metric-symbol { font-size:0.9375rem}
.card { padding:17px}
.card-heading { gap:10px}
.card-heading h2 { font-size:0.875rem}
.card-heading p { font-size:0.75rem}
.table-scroll { margin:0 -17px}
.run-card { gap:0 12px}
.day-shortcuts { grid-template-columns:repeat(3,1fr)}
.day-shortcuts input { width:100%; grid-column:1/-1; padding:5px}
.cursor-box { padding:9px 10px}
.cursor-box strong { font-size:1.0625rem; letter-spacing:0}
.run-secondary { gap:0; flex-direction:column}
.run-secondary .button { padding:5px; min-height:25px; font-size:0.75rem}
.chart-tools { gap:6px}
.chart-footer { font-size:0.75rem}
.chart-wrap { min-height:180px}
.page-footer { flex-direction:column; gap:5px}
.table-tools { flex-direction:column; max-width:110px}
.inline-form { flex-direction:column}
.form-grid { grid-template-columns:1fr; gap:0}
.event-time { font-size:0.75rem}
.event-kind { overflow-wrap:anywhere}
.event-row summary { gap:7px}
.strategy-pills { gap:14px}
.strategy-pills strong { font-size:0.9375rem}
.strategy-pills>div { font-size:0.75rem}
}

/* v0.2: independent research experiments and persistent session navigation. */
.valuation-toggle { display:flex; gap:8px; align-items:flex-start; font-size:0.8125rem; color:var(--muted); margin:3px 0 12px; line-height:1.6}
.valuation-toggle input { margin:3px 0 0; accent-color:var(--teal)}
.valuation-toggle small { display:block; font-size:0.75rem; color:var(--muted)}
.session-library,.lab-card,.lab-history-card { margin-top:20px}
.session-select-row { display:flex; gap:10px}
.session-select-row select { flex:1; min-width:0; font-size:0.8125rem}
.research-note { display:flex; align-items:flex-start; gap:14px; padding:14px 17px; margin-bottom:20px; background:#eef4eb; border:1px solid #e0e9d9; border-radius:8px; color:var(--muted); font-size:0.8125rem; line-height:1.8}
.research-note strong { white-space:nowrap; color:var(--muted); font-weight:600}
.diagnostic-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; padding:5px 0 22px; border-bottom:1px solid var(--line)}
.diagnostic-metrics>div { min-width:0}
.diagnostic-metrics span { font-size:0.8125rem; color:var(--muted); display:block}
.diagnostic-metrics strong { font-size:1.6875rem; font-weight:550; letter-spacing:-.8px; display:block; margin:9px 0; color:var(--muted); font-variant-numeric:tabular-nums}
.diagnostic-metrics small { font-size:0.75rem; color:var(--muted); display:block; line-height:1.7}
.analysis-grid { display:grid; grid-template-columns:1fr 1fr; gap:35px; padding:15px 0}
.analysis-details { border-top:1px solid var(--line); padding-top:14px; font-size:0.8125rem; color:var(--muted)}
.analysis-details summary { cursor:pointer}
.analysis-details ul { padding-left:18px; line-height:2}
.analysis-details .muted { font-size:0.8125rem}
.lab-controls { display:flex; align-items:center; justify-content:space-between; gap:20px}
.lab-controls strong { font-size:0.875rem; color:var(--muted)}
.lab-controls p { font-size:0.8125rem; color:var(--muted); margin:5px 0}
.lab-card>progress { margin:14px 0 24px; height:5px}
.lab-table td { font-size:0.8125rem}
.lab-table .symbol-name { font-size:0.8125rem}
.case-status { white-space:normal; min-width:135px; max-width:280px}
.case-reason { font-size:0.75rem; color:var(--muted); margin-top:6px}
.case-reason summary { cursor:pointer}
.case-reason p { overflow-wrap:anywhere; line-height:1.7}
.lab-footnote { margin:15px 0 0}
.lab-history-row { display:flex; justify-content:space-between; align-items:center; gap:15px; border-bottom:1px solid var(--line); padding:12px 0}
.lab-history-row:first-child { padding-top:0}
.lab-history-row:last-child { border:0; padding-bottom:0}
.lab-history-row strong { display:block; font-size:0.8125rem; color:var(--muted); overflow-wrap:anywhere}
.lab-history-row small { display:block; font-size:0.75rem; color:var(--muted); margin-top:5px}

@media(max-width:1000px) { .diagnostic-metrics strong { font-size:1.4375rem}
.lab-controls { align-items:flex-start}
.lab-controls .heading-actions { flex-direction:column}
.analysis-grid { gap:20px}
}
@media(max-width:780px) { .diagnostic-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px}
.run-card>.valuation-toggle { grid-column:1/-1; grid-row:6; margin:13px 0 0}
.research-note { flex-direction:column; gap:4px}
.analysis-grid { grid-template-columns:1fr; gap:0}
.lab-controls { flex-direction:column; gap:12px}
.lab-controls .heading-actions { flex-direction:row; flex-wrap:wrap}
.session-select-row { flex-wrap:wrap}
.session-select-row select { flex-basis:100%}
.lab-history-row { align-items:flex-start}
}
@media(max-width:480px) { .diagnostic-metrics strong { font-size:1.375rem}
.lab-history-row { flex-direction:column; gap:9px}
.research-note { font-size:0.8125rem}
}

/* v0.3: operation health, recoverable workspace, and a concise first-run path. */
.quick-start { margin:-7px 0 21px; border:1px solid #dfe8df; border-radius:9px; background:#f9fbf7; font-size:0.8125rem; color:var(--muted)}
.quick-start summary { cursor:pointer; padding:13px 16px; font-weight:550}
.quick-start summary>span { float:right; font-size:0.75rem; font-weight:400; color:var(--muted)}
.quick-start-content { padding:0 18px 18px; border-top:1px solid #eaf0e6}
.quick-start-content p { font-size:0.8125rem; margin:14px 0 8px; color:var(--muted)}
.quick-start-content ol { padding-left:19px; font-size:0.8125rem; color:var(--muted); line-height:2.1; margin:0 0 14px}
.quick-start-content .heading-actions { flex-direction:row; flex-wrap:wrap}
.system-summary { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:17px 20px; background:#edf4ef; border:1px solid #dce8df; border-radius:10px; margin-bottom:20px}
.system-summary>div { display:flex; gap:13px; align-items:center}
.system-summary strong { font-size:0.875rem; font-weight:550; color:var(--muted)}
.system-summary p { font-size:0.8125rem; color:var(--muted); margin:4px 0 0; line-height:1.8}
.system-health-dot { height:10px; width:10px; flex-shrink:0; background:#a7b5a8; border-radius:50%; box-shadow:0 0 0 5px #ffffff78}
.system-health-dot.ok,.capability-dot.ok { background:#6a9e79}
.system-health-dot.warning,.capability-dot.warning { background:#c7a572}
.system-health-dot.error,.capability-dot.error { background:#ba735e}
.capability-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; margin-bottom:20px}
.capability-card { padding:19px 17px}
.capability-card>div { display:flex; align-items:center; justify-content:space-between}
.capability-dot { width:7px; height:7px; border-radius:50%; background:#b6bfae}
.capability-card h2 { font-size:0.875rem; margin-top:18px}
.capability-card p { font-size:0.8125rem; color:var(--muted); line-height:1.8; margin:9px 0 0}
.small-pill.ok { color:var(--muted); background:#edf5eb; border-color:#e0ead9}
.small-pill.warning { color:var(--muted); background:#faf5e9; border-color:#eee6d3}
.small-pill.error { color:var(--muted); background:#fff1ea; border-color:#f0dfd4}
.system-grid { display:grid; grid-template-columns:1fr 1.15fr; gap:20px}
.system-paths { margin-top:12px}
.system-paths>div { flex-direction:column; gap:5px}
.system-paths dd { text-align:left; overflow-wrap:anywhere; font-family:ui-monospace,SFMono-Regular,monospace; font-size:0.75rem}
.system-check { display:flex; align-items:flex-start; gap:11px; padding:12px 0; border-bottom:1px solid #edf1e9}
.system-check:first-child { padding-top:0}
.system-check:last-child { border-bottom:0; padding-bottom:0}
.check-symbol { font-size:0.875rem; line-height:20px; text-align:center; height:20px; width:20px; flex-shrink:0; border-radius:50%; background:#eef4ea; color:var(--muted)}
.check-symbol.error { color:var(--muted); background:#fcf0e8}
.check-symbol.warning { color:var(--muted); background:#f8f3e7}
.system-check>div { min-width:0; flex:1}
.system-check strong { font-size:0.8125rem; font-weight:500; color:var(--muted)}
.system-check p { font-size:0.8125rem; color:var(--muted); line-height:1.8; margin:4px 0 0; overflow-wrap:anywhere}
.check-status { font-size:0.75rem; color:var(--muted); white-space:nowrap; margin-top:3px}
.check-status.warning { color:var(--muted)}
.check-status.error { color:var(--muted)}
.backup-card,.getting-started { margin-top:20px; scroll-margin-top:20px}
.backup-summary { display:flex; justify-content:space-between; gap:12px; font-size:0.8125rem; color:var(--muted); margin:0 0 15px}
.backup-summary>span:last-child { color:var(--muted)}
.backup-actions { display:flex; gap:6px; flex-wrap:wrap}
.backup-actions .button { font-size:0.75rem; min-height:29px; padding:6px 9px}
.backup-subtext { display:block; font-size:0.75rem; color:var(--muted); margin-top:4px}
.backup-row-error { font-size:0.75rem; color:var(--muted); max-width:200px; white-space:normal; overflow-wrap:anywhere; line-height:1.6}
.backup-footnote { margin-bottom:0}
.operation-note,.operation-result { border:1px solid #e1e9d9; background:#f1f6ec; color:var(--muted); padding:12px 14px; margin:12px 0; border-radius:7px; font-size:0.8125rem; line-height:1.8}
.operation-note { background:#faf6eb; color:var(--muted); border-color:#eee5d0}
.operation-result strong { font-size:0.875rem; font-weight:550}
.operation-result p { margin:5px 0 0; font-size:0.8125rem}
.operation-result code { display:block; font-size:0.8125rem; overflow-wrap:anywhere; line-height:1.8; margin-top:8px}
.operation-result details { font-size:0.8125rem; margin-top:9px}
.operation-result summary { cursor:pointer}
.operation-result pre { white-space:pre-wrap; overflow-wrap:anywhere; font-size:0.75rem; max-height:200px; overflow:auto}
.guide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px}
.guide-number { color:var(--muted); font-size:1.375rem; font-weight:400; font-variant-numeric:tabular-nums}
.guide-grid h3 { font-size:0.875rem; font-weight:550; color:var(--muted); margin:8px 0}
.guide-grid p { font-size:0.8125rem; line-height:1.9; color:var(--muted); margin:0 0 14px}
.guide-grid .button { font-size:0.8125rem}
.usage-details { margin-top:22px; padding-top:16px; border-top:1px solid var(--line); font-size:0.8125rem; color:var(--muted)}
.usage-details summary { cursor:pointer}
.usage-details p { font-size:0.8125rem; line-height:1.9; color:var(--muted); margin:10px 0 0}

@media(max-width:1100px) { .capability-grid { grid-template-columns:repeat(2,minmax(0,1fr))}
.system-grid { grid-template-columns:1fr}
.capability-card h2 { margin-top:12px}
.guide-grid { gap:20px}
}
@media(max-width:780px) { .quick-start summary>span { float:none; display:block; padding:5px 0 0 14px}
.system-summary { align-items:flex-start}
.system-summary>.small-pill { display:none}
.guide-grid { grid-template-columns:1fr; gap:18px}
.guide-grid>div { border-bottom:1px solid var(--line); padding-bottom:18px}
.guide-grid>div:last-child { border:0; padding:0}
.guide-number { float:left; margin-right:14px; line-height:1.1}
.guide-grid h3 { margin-top:0}
.guide-grid p { margin-bottom:10px}
.backup-summary { flex-direction:column; gap:3px}
}
@media(max-width:480px) { .capability-grid { gap:10px}
.capability-card { padding:14px}
.capability-card h2 { font-size:0.8125rem}
.capability-card p { font-size:0.75rem}
.system-summary { padding:14px}
.system-summary strong { font-size:0.875rem}
.system-checks .check-status { display:none}
}

.unavailable-action { opacity:.48; cursor:not-allowed}

/* Mobile workspace and exchange snapshots: no fixed sidebar on a phone. */
.mobile-nav { display:none}
.logout-button { background:none; border:0; padding:6px; color:var(--muted); font-size:0.8125rem}
.connection-alert { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:14px; padding:13px 16px; border:1px solid #e8d4bd; background:#fff5e9; border-radius:8px; color:var(--muted); font-size:0.8125rem; line-height:1.7}
.connection-alert>span { flex:1; min-width:170px}
.exchange-notice { display:flex; align-items:flex-start; gap:15px; background:#edf4ef; border:1px solid #dae8dd; border-radius:9px; padding:15px 18px; font-size:0.8125rem; color:var(--muted); line-height:1.8; margin-bottom:20px}
.exchange-notice strong { white-space:nowrap; color:var(--muted); font-weight:550}
.binance-products { display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start}
.binance-product .eyebrow { font-size:0.75rem; margin-bottom:8px}
.binance-product h2 { font-size:1.25rem}
.environment-pill { display:inline-block; border:1px solid #dddcce; background:#f8f5e9; color:var(--muted); border-radius:6px; padding:6px 9px; font-size:0.8125rem; white-space:nowrap}
.environment-pill.testnet { background:#edf1fa; border-color:#dce3ed; color:var(--muted)}
.exchange-status { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:0.75rem; color:var(--muted)}
.exchange-config-note { font-size:0.8125rem; color:var(--muted); line-height:1.8; margin:16px 0}
.account-empty { text-align:center; margin:25px 0 12px; padding:20px 10px; color:var(--muted)}
.account-empty>span { display:block; font-size:2.25rem; color:var(--muted); line-height:1}
.account-empty strong { font-size:0.875rem; display:block; font-weight:500; margin:12px 0 7px}
.account-empty p { font-size:0.8125rem; line-height:1.8; margin:0}
.account-snapshot { margin-top:23px; padding-top:18px; border-top:1px solid var(--line)}
.account-snapshot-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap}
.account-snapshot-heading strong { font-size:0.8125rem; font-weight:550; color:var(--muted)}
.account-snapshot-heading>span { font-size:0.75rem; color:var(--muted)}
.account-table-note { font-size:0.75rem; line-height:1.8; color:var(--muted); margin:15px 0 10px}
.account-raw { margin-top:16px; padding-top:13px; border-top:1px solid var(--line); font-size:0.8125rem; color:var(--muted)}
.account-raw summary { cursor:pointer}
.account-raw pre { font-family:ui-monospace,SFMono-Regular,monospace; max-height:300px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; background:#f7faf3; padding:12px; border-radius:7px; font-size:0.75rem; line-height:1.8}
.mobile-guide { margin-top:20px}
.mobile-guide ol { font-size:0.8125rem; color:var(--muted); line-height:2.2; padding-left:19px}
.mobile-guide .field-hint { margin-bottom:0}
.mobile-access-status { border-top:1px solid var(--line); font-size:0.8125rem; line-height:1.8; color:var(--muted); margin-top:15px; padding-top:13px}
.mobile-menu { max-width:calc(100vw - 30px); width:380px}
.mobile-menu .dialog-heading { margin-bottom:18px}
.mobile-menu>.button { display:flex; width:100%; margin-top:10px; min-height:48px; font-size:0.875rem}
.login-page { min-height:100vh; min-height:100dvh; background:radial-gradient(ellipse at 30% 0%,#e1ece3 0%,#f4f7f6 70%)}
.login-shell { max-width:460px; margin:0 auto; padding:80px 20px 40px}
.login-brand { display:flex; align-items:center; gap:13px; font-size:1.4375rem; font-weight:600; letter-spacing:-.4px; margin:0 0 31px}
.login-brand img { border-radius:13px}
.login-brand small { display:block; font-weight:400; font-size:0.8125rem; color:var(--muted); letter-spacing:.5px; margin-top:4px}
.login-card { background:#fff; border:1px solid #e0e9e0; border-radius:19px; padding:29px; box-shadow:0 18px 65px #234d3310}
.login-card h1 { font-size:1.5625rem}
.login-intro { font-size:0.875rem; color:var(--muted); line-height:1.9; margin:16px 0 25px}
.login-card .field-label { font-size:0.875rem}
.login-card input { width:100%; font-size:1rem; min-height:48px; letter-spacing:1px}
.login-card .button { min-height:46px; font-size:0.875rem}
.login-card form>.button { margin-top:18px}
.login-card .field-hint { font-size:0.8125rem; margin:18px 0 0}
.login-card #login-open { margin-top:18px}
.login-footnote { font-size:0.8125rem; line-height:1.9; color:var(--muted); margin:22px 12px 0}
.is-offline .account-snapshot { opacity:.62}

@media(max-width:1100px) { .binance-products { grid-template-columns:1fr}
.binance-product h2 { font-size:1.1875rem}
}
@media(max-width:700px) { 
  body { padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}
.sidebar { display:none}
.app-shell { margin-left:0}
.topbar { position:sticky; top:0; z-index:25; height:calc(60px + env(safe-area-inset-top,0px)); padding:env(safe-area-inset-top,0px) 16px 0; background:#ffffffed; backdrop-filter:blur(14px)}
.breadcrumb { font-size:0.875rem; gap:10px}
.breadcrumb>span,.breadcrumb { white-space:nowrap}
.topbar-right { gap:12px}
.status-chip { font-size:0.8125rem}
.icon-button { min-height:40px; min-width:32px}
.logout-button { display:none}
main { padding:16px; max-width:100%; overflow:hidden}
.page-heading { margin:23px 0 19px; gap:14px}
.page-heading h1 { font-size:1.5rem; letter-spacing:-.7px}
.eyebrow { font-size:0.75rem}
.page-subtitle { font-size:0.875rem; line-height:1.8}
.heading-actions { gap:8px; flex-wrap:wrap}
.button { font-size:0.875rem; min-height:44px; padding:10px 13px}
.environment-banner { font-size:0.8125rem; line-height:1.8; padding:9px 11px}
.environment-banner strong { font-size:0.8125rem}
.connection-alert { font-size:0.875rem; gap:8px; align-items:flex-start}
.connection-alert>span { flex-basis:100%}
.connection-alert .button { margin-top:4px}
.feedback,.halt-alert { font-size:0.875rem}
.metrics-grid { gap:10px}
.metric { padding:16px 14px}
.metric-label { font-size:0.8125rem}
.metric-value { font-size:1.75rem}
.metric-foot { font-size:0.75rem; line-height:1.7; white-space:normal}
.metric-foot strong { font-size:0.8125rem}
.metric-foot>span:last-child:not(.mini-bars) { display:none}
.small-pill { font-size:0.75rem}
.card { padding:18px; border-radius:12px}
.card-heading { align-items:flex-start}
.card-heading h2 { font-size:1rem}
.card-heading p { font-size:0.8125rem; line-height:1.8}
.tiny-label { font-size:0.75rem}
.chart-wrap { min-height:185px}
.chart-footer { font-size:0.75rem; line-height:1.6}
.chart-tools select { font-size:1rem; min-height:44px}
.table-scroll { margin:0 -18px; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch}
.table-scroll td { font-size:0.875rem; padding-top:15px; padding-bottom:15px}
.table-scroll th { font-size:0.8125rem}
.symbol-name { font-size:0.875rem}
.symbol-name small { font-size:0.75rem}
.table-empty { font-size:0.8125rem!important}
.key-values>div { font-size:0.875rem; padding:11px 0; gap:14px}
.key-values dd { overflow-wrap:anywhere}
.run-card { display:block}
.run-card .card-heading { margin-bottom:18px}
.cursor-box { display:block; min-height:0; padding:14px 15px; margin-bottom:18px}
.cursor-box>span { font-size:0.8125rem}
.cursor-box strong { font-size:1.625rem; letter-spacing:.5px}
.cursor-box small { font-size:0.8125rem}
.field-label { font-size:0.875rem}
.day-shortcuts { display:grid; grid-template-columns:repeat(3,1fr) 66px; gap:7px; margin:0 0 16px}
.day-shortcuts button { font-size:0.875rem; min-height:44px}
.day-shortcuts input { grid-column:auto; width:66px; padding:6px; font-size:1rem}
.run-card>.valuation-toggle { margin:0 0 16px; font-size:0.875rem; gap:11px}
.valuation-toggle input { width:18px; height:18px}
.valuation-toggle small { font-size:0.8125rem}
.fault-control { font-size:0.875rem; margin:0 0 13px}
.fault-control summary { padding:8px 0}
.fault-control summary>span { font-size:0.8125rem}
.fault-control p { font-size:0.8125rem}
.run-card>.full-width { margin:0}
.run-secondary { flex-direction:row; gap:8px; flex-wrap:wrap; margin-top:10px}
.run-secondary .button { font-size:0.8125rem; min-height:42px; padding:8px 11px}
.job-progress { font-size:0.8125rem; margin-top:15px}
.lower-grid { margin-top:16px}
.attribution>div { font-size:0.875rem}
.attribution small { font-size:0.8125rem}
.attribution strong { font-size:1rem}
.session-select-row select { font-size:1rem; min-height:44px; width:100%}
.session-select-row .button { width:100%}
.field-hint { font-size:0.8125rem; line-height:1.9}
.quick-start summary { font-size:0.875rem; line-height:1.8}
.quick-start summary>span { font-size:0.8125rem}
.quick-start-content p,.quick-start-content ol { font-size:0.875rem}
.quick-start-content .heading-actions { flex-direction:column}
.diagnostic-metrics span { font-size:0.875rem}
.diagnostic-metrics strong { font-size:1.6875rem}
.diagnostic-metrics small { font-size:0.8125rem}
.analysis-details,.analysis-details .muted { font-size:0.8125rem; line-height:1.9}
.research-note { font-size:0.875rem}
.lab-controls strong { font-size:0.875rem}
.lab-controls p { font-size:0.8125rem}
.lab-controls .heading-actions { width:100%}
.lab-controls .heading-actions .button { flex:1}
.lab-table td,.lab-table .symbol-name { font-size:0.8125rem}
.case-reason { font-size:0.8125rem}
.case-status { min-width:160px}
.lab-history-row strong { font-size:0.8125rem}
.lab-history-row small { font-size:0.8125rem}
.system-summary strong { font-size:0.875rem}
.system-summary p { font-size:0.8125rem}
.capability-card h2 { font-size:0.875rem}
.capability-card p { font-size:0.8125rem}
.system-check strong { font-size:0.875rem}
.system-check p { font-size:0.8125rem}
.backup-summary { font-size:0.8125rem; line-height:1.8}
.backup-actions .button { min-height:42px; font-size:0.8125rem}
.backup-actions { flex-wrap:nowrap}
.operation-note,.operation-result { font-size:0.875rem}
.operation-result p,.operation-result code { font-size:0.8125rem}
.guide-grid h3 { font-size:0.875rem}
.guide-grid p,.usage-details,.usage-details p { font-size:0.875rem}
.guide-grid .button { font-size:0.875rem}
.page-footer { font-size:0.8125rem; line-height:1.8; padding-bottom:8px}
.exchange-notice { flex-direction:column; gap:5px; font-size:0.875rem}
.binance-product h2 { font-size:1.3125rem}
.environment-pill { font-size:0.875rem}
.exchange-status { font-size:0.8125rem}
.exchange-config-note,.account-empty p,.account-table-note { font-size:0.875rem}
.account-empty strong { font-size:0.875rem}
.account-snapshot-heading strong { font-size:0.875rem}
.account-snapshot-heading>span { font-size:0.8125rem}
.account-raw { font-size:0.875rem}
.account-raw pre { font-size:0.8125rem}
.mobile-guide ol { font-size:0.875rem; line-height:2}
.mobile-access-status { font-size:0.8125rem}
.inline-error { font-size:0.875rem}
.muted { font-size:0.875rem}
input,select,textarea { font-size:1rem; min-height:44px}
.inline-form input { font-size:1rem}
.table-tools input { font-size:1rem; max-width:135px}
.table-tools { max-width:135px}
.import-grid textarea { font-size:0.875rem}
.event-time { font-size:0.75rem; max-width:105px}
.event-row summary { font-size:0.875rem; gap:9px}
.event-row pre { font-size:0.8125rem}
dialog { padding:23px}
.dialog-heading h2 { font-size:1.125rem}
.dialog-actions .button { min-height:44px}
.mobile-nav { position:fixed; inset:auto 0 0; z-index:30; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); padding:5px 8px calc(5px + env(safe-area-inset-bottom,0px)); border-top:1px solid #dfE8df; background:#ffffffed; backdrop-filter:blur(16px)}
.mobile-nav .nav-item { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; padding:8px 2px; margin:0; min-height:59px; font-size:0.8125rem; color:var(--muted); border-radius:9px}
.mobile-nav .nav-icon { font-size:1.375rem; line-height:1; width:24px; height:23px}
.mobile-nav .nav-item.active { background:#eaf2e7; color:var(--muted)}
.mobile-nav .nav-item:hover { background:#edf4e9}
.mobile-menu { margin:auto auto calc(89px + env(safe-area-inset-bottom,0px)); border-radius:17px; width:calc(100vw - 28px); max-width:480px}
.login-page { padding-bottom:0}
.login-shell { padding:calc(42px + env(safe-area-inset-top,0px)) 22px 35px}
.login-card { padding:25px 22px}
.login-brand { font-size:1.5rem}
.login-intro { font-size:0.875rem}
.login-footnote { font-size:0.875rem}
.login-card .button { min-height:48px}
.login-card .field-hint { font-size:0.875rem}

}

.is-offline a[download] { opacity:.48; cursor:not-allowed}

/* v0.5: independent exchange-simulation execution and reconciliation. */
.sidebar nav { min-height:0; overflow-y:auto; overscroll-behavior:contain}
.sidebar-bottom { flex-shrink:0}
.execution-heading { margin:22px 0 17px; gap:14px}
.execution-heading h1 { font-size:1.5rem; margin-bottom:5px}
.execution-heading .page-subtitle { font-size:0.8125rem}
.execution-heading .button { flex-shrink:0; min-height:44px}
.execution-pause { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:15px 18px; margin-bottom:12px}
.execution-pause h2 { font-size:0.875rem}
.execution-pause p { font-size:0.8125rem; line-height:1.65; color:var(--muted); margin:5px 0 0; max-width:630px}
.execution-pause .button { flex-shrink:0; min-height:44px}
.execution-products { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:16px}
.execution-product { padding:10px 13px; background:#fff; border:1px solid var(--line); border-radius:8px; min-width:0}
.execution-product>div { display:flex; justify-content:space-between; align-items:center; gap:8px}
.execution-product strong { font-size:0.875rem; color:var(--muted); font-weight:550}
.execution-product p { font-size:0.8125rem; line-height:1.65; color:var(--muted); margin:7px 0 0; overflow-wrap:anywhere}
.execution-budget { grid-column:1/-1; display:flex; align-items:center; gap:5px 12px; flex-wrap:wrap; background:#edf3e9; border:1px solid #dfe9d6; border-radius:8px; padding:11px 14px; font-size:0.8125rem; color:var(--muted)}
.execution-budget strong { font-size:0.8125rem; font-weight:550; color:var(--muted)}
.execution-budget>span { margin-left:auto; font-variant-numeric:tabular-nums}
.execution-budget small { flex-basis:100%; font-size:0.8125rem; line-height:1.65}
.execution-compose { display:grid; grid-template-columns:1fr 1.06fr; gap:20px; align-items:start}
.execution-form-card .field-label { margin-top:15px}
.execution-form-card .form-grid>div:first-child .field-label,.execution-form-card .form-grid>div:last-child .field-label { margin-top:15px}
.execution-form-card input:not([type=checkbox]),.execution-form-card select { width:100%; min-width:0}
.execution-form-card input:not([type=checkbox]) { font-variant-numeric:tabular-nums}
.execution-form-card .valuation-toggle { margin-top:18px; margin-bottom:0}
.execution-form-card .valuation-toggle small { font-size:0.75rem}
.execution-form-card .field-hint { margin:17px 0}
.execution-draft-card { scroll-margin-top:80px}
.execution-draft-label { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:0.75rem; color:var(--muted); padding-bottom:15px; border-bottom:1px solid var(--line)}
.execution-draft-facts { margin:8px 0 13px}
.execution-draft-facts dd { font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.execution-checks { padding:4px 0 8px}
.execution-check { display:flex; gap:10px; align-items:flex-start; padding:9px 0; border-bottom:1px solid #eef2e7}
.execution-check:last-child { border:0}
.execution-check>div { min-width:0}
.execution-check strong { display:block; font-size:0.8125rem; line-height:1.8; color:var(--muted); font-weight:400; overflow-wrap:anywhere}
.execution-check small { display:block; font-size:0.75rem; color:var(--muted); line-height:1.8; overflow-wrap:anywhere; margin-top:3px}
.execution-gate-note { font-size:0.8125rem; color:var(--muted); line-height:1.9; margin:12px 0 6px; padding:10px 12px; border-radius:7px; background:#faf6e9}
.execution-draft-card .full-width { margin-top:17px}
.execution-draft-card .field-hint { margin-bottom:0}
.execution-orders-card { margin-top:20px}
.execution-orders { display:flex; flex-direction:column; gap:14px}
.execution-order { border:1px solid #e6ece0; border-radius:9px; padding:17px 18px; background:#fdfefa}
.execution-order-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap}
.execution-order-heading strong { font-size:0.875rem; font-weight:600; color:var(--muted)}
.execution-order-heading .direction { margin-left:4px}
.execution-order-heading small { display:block; font-size:0.75rem; line-height:1.8; color:var(--muted); margin-top:5px}
.execution-order-values { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; margin:17px 0 10px}
.execution-order-values span { display:block; font-size:0.75rem; color:var(--muted)}
.execution-order-values strong { font-size:0.875rem; font-weight:500; color:var(--muted); font-variant-numeric:tabular-nums; display:block; margin-top:6px; overflow-wrap:anywhere}
.execution-order-time { font-size:0.75rem; color:var(--muted); margin:8px 0}
.execution-order-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:13px}
.execution-order-actions:empty { display:none}
.execution-order-actions .button { font-size:0.8125rem; min-height:34px}
.execution-order-detail { font-size:0.8125rem; color:var(--muted); border-top:1px solid #eaf0e1; margin-top:15px; padding-top:12px}
.execution-order-detail summary { cursor:pointer}
.execution-order-detail .key-values { margin-top:10px}
.execution-order-detail .key-values>div { flex-wrap:wrap; gap:5px}
.execution-order-detail dd { overflow-wrap:anywhere; font-family:ui-monospace,SFMono-Regular,monospace; font-size:0.75rem; max-width:100%}
.execution-order-detail ol { list-style:none; padding:0; margin:14px 0 0}
.execution-order-detail li { border-bottom:1px solid #edf2e5; padding:9px 0; overflow-wrap:anywhere; line-height:1.8}
.execution-order-detail li:last-child { border:0}
.execution-order-detail li>span { display:block; font-size:0.75rem; color:var(--muted)}
.execution-order-detail li>strong { display:block; font-weight:400; font-size:0.8125rem; color:var(--muted)}
.execution-order-detail li p { margin:4px 0; font-size:0.75rem; white-space:pre-wrap}
.execution-uncertain { font-size:0.8125rem; color:var(--muted); background:#faf5e6; padding:9px 11px; border-radius:6px; line-height:1.8}
.execution-footnote { margin-bottom:0}

@media(max-width:1100px) { .execution-compose { grid-template-columns:1fr}
.execution-pause { align-items:flex-start}
.execution-budget>span { margin-left:0}
}
@media(max-width:700px) { .execution-heading { flex-direction:row; align-items:center; margin:16px 0 14px; gap:10px}
.execution-heading h1 { font-size:1.375rem; margin-bottom:4px}
.execution-heading .page-subtitle { font-size:0.8125rem; line-height:1.6}
.execution-heading .button { width:auto; min-height:44px}
.execution-pause { flex-direction:row; align-items:center; gap:10px; padding:13px 14px; margin-bottom:10px}
.execution-pause>div { min-width:0}
.execution-pause h2 { font-size:0.875rem}
.execution-pause p { font-size:0.8125rem; line-height:1.6; margin-top:4px}
.execution-pause .button { width:auto; min-height:44px; padding:9px 10px; font-size:0.8125rem}
.execution-products { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:12px}
.execution-product { padding:10px}
.execution-product strong { font-size:0.875rem}
.execution-product p { font-size:0.8125rem}
.execution-product .small-pill { font-size:0.75rem; padding:3px 5px; white-space:normal; text-align:right}
.execution-budget { padding:10px 12px; gap:4px; font-size:0.8125rem}
.execution-budget strong { font-size:0.8125rem}
.execution-budget small { font-size:0.8125rem; line-height:1.6}
.execution-budget>span { margin-left:0; flex-basis:100%; font-size:0.875rem}
.execution-form-card { padding:16px}
.execution-form-card .card-heading { margin-bottom:10px}
.execution-form-card .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.execution-form-card input:not([type=checkbox]),.execution-form-card select { font-size:1rem; min-height:44px}
.execution-compose { gap:16px}
.execution-form-card .field-label { font-size:0.875rem}
.execution-form-card .valuation-toggle { font-size:0.875rem}
.execution-form-card .valuation-toggle small { font-size:0.8125rem}
.execution-draft-label { font-size:0.8125rem}
.execution-check strong { font-size:0.875rem}
.execution-check small { font-size:0.8125rem}
.execution-gate-note { font-size:0.875rem}
.execution-order { padding:15px}
.execution-order-heading strong { font-size:0.9375rem}
.execution-order-heading small { font-size:0.8125rem}
.execution-order-heading .small-pill { font-size:0.8125rem; white-space:normal}
.execution-order-values { grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px}
.execution-order-values span { font-size:0.8125rem}
.execution-order-values strong { font-size:0.9375rem}
.execution-order-time { font-size:0.8125rem}
.execution-order-actions .button { min-height:44px; font-size:0.875rem}
.execution-order-detail { font-size:0.875rem}
.execution-order-detail dd { font-size:0.8125rem; text-align:left}
.execution-order-detail li>span { font-size:0.8125rem}
.execution-order-detail li>strong,.execution-order-detail li p { font-size:0.8125rem}
.execution-uncertain { font-size:0.875rem; line-height:1.9}
.execution-orders-card .card-heading { flex-wrap:wrap}
}

/* Reading hierarchy and interaction surfaces. These rules also cover legacy views. */
html { font-size:100%; scroll-padding-block:88px 112px; }
body { font-size:1rem; line-height:1.65; -webkit-text-size-adjust:100%; }
main { padding:28px 36px 24px; }
h1 { color:var(--ink); font-size:2rem; line-height:1.3; letter-spacing:-.035em; font-weight:700; }
h2 { color:var(--ink); font-size:1.125rem; line-height:1.5; font-weight:650; }
h3 { color:var(--ink); line-height:1.5; }
p { overflow-wrap:break-word; }
.page-heading { margin:28px 0 24px; }
.page-subtitle { font-size:.9375rem; line-height:1.75; color:var(--muted); }
.eyebrow { font-size:.75rem; letter-spacing:.12em; color:var(--muted); margin-bottom:8px; }
.card,.metric { border-color:var(--line); box-shadow:0 2px 4px #18323a04; }
.card { padding:24px; }
.card-heading { align-items:flex-start; }
.card-heading p { color:var(--muted); font-size:.875rem; line-height:1.7; }
.metric { padding:22px 20px 18px; }
.metric-label { font-size:.875rem; color:var(--muted); font-weight:500; gap:8px; }
.metric-value { color:var(--ink); font-size:2.125rem; line-height:1.25; letter-spacing:-.045em; margin:14px 0 12px; }
.metric-value small { color:var(--muted); font-size:1rem; }
.metric-foot { white-space:normal; flex-wrap:wrap; font-size:.75rem; line-height:1.65; gap:4px 8px; }
.metric-foot strong { font-size:.8125rem; color:var(--ink); }
.metric-symbol { color:var(--muted); }
.mini-bars { display:none; }
.small-pill,.direction,.order-status,.environment-pill { font-size:.75rem; font-weight:600; line-height:1.6; padding:3px 8px; color:var(--muted); background:#f0f4f5; border-color:var(--line); }
.button { font-size:.875rem; font-weight:600; min-height:44px; padding:10px 16px; border-radius:9px; white-space:normal; line-height:1.5; }
.primary { background:var(--teal); color:#fff; }
.secondary { color:var(--ink); background:#fff; border-color:var(--control-border); }
.secondary:hover:not(:disabled) { background:#edf4f3; border-color:var(--teal); }
.subtle { color:var(--muted); }
.subtle:hover:not(:disabled) { background:#e9eef0; }
button:disabled { opacity:1; color:#64747a; background:#edf1f2; border-color:#c9d4d7; box-shadow:none; cursor:not-allowed; }
.button:active:not(:disabled),.day-shortcuts button:active:not(:disabled) { transform:translateY(1px); }
.icon-button { display:inline-grid; place-items:center; min-width:44px; min-height:44px; border:1px solid var(--line); border-radius:10px; color:var(--muted); background:#fff; padding:4px; }
input:not([type=checkbox]):not([type=radio]),select,textarea { font-size:1rem; min-height:44px; line-height:1.5; border:1px solid var(--control-border); border-radius:9px; color:var(--ink); background:#fff; }
input::placeholder,textarea::placeholder { color:#62757a; opacity:1; }
input:disabled,select:disabled,textarea:disabled { color:#64747a; background:#f0f3f4; border-color:#c9d4d7; opacity:1; }
input[type=checkbox],input[type=radio] { width:20px; height:20px; flex-shrink:0; accent-color:var(--teal); }
.field-label { font-size:.875rem; color:var(--ink); line-height:1.6; font-weight:600; }
.field-hint,.muted { font-size:.875rem; color:var(--muted); line-height:1.8; }
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid var(--focus); outline-offset:3px; box-shadow:0 0 0 2px #fff; }
input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid var(--focus); outline-offset:3px; border-color:var(--focus); box-shadow:0 0 0 2px #fff; }
.tab-panel:focus { outline:none; }
.tab-panel:focus-visible { outline:2px solid var(--focus); outline-offset:8px; }
.skip-link { position:fixed; top:10px; left:16px; z-index:100; padding:12px 18px; background:var(--ink); color:#fff; border-radius:8px; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
.sidebar { width:236px; background:var(--sidebar); padding:28px 18px; overflow-y:auto; }
.brand { color:#f3f8f7; font-size:1.3125rem; }
.brand small { color:#afc4c6; font-size:.75rem; letter-spacing:.02em; }
.workspace-chip { margin-top:28px; padding:12px; border-color:#486367; font-size:.875rem; }
.workspace-chip small,.sidebar-status,.nav-label { color:#afc4c6; font-size:.75rem; }
.nav-label { margin:24px 12px 10px; }
.nav-item { min-height:46px; color:#bfd0d2; font-size:.875rem; padding:11px 13px; gap:12px; }
.nav-item:hover { background:#25464a; color:#fff; }
.nav-item.active { background:#dceee8; color:#153e37; box-shadow:inset 3px 0 0 #70b7a5; }
.nav-icon { flex-shrink:0; font-size:1.25rem; }
.sidebar-bottom { padding-top:22px; }
.side-badge { color:#bfd0d2; font-size:.75rem; }
.sidebar-bottom p { color:#bfd0d2; font-size:.9375rem; line-height:1.8; }
.app-shell { margin-left:236px; }
.topbar { padding-inline:36px; height:72px; }
.breadcrumb { color:var(--muted); font-size:.875rem; gap:12px; }
.breadcrumb strong { color:var(--ink); font-weight:600; }
.breadcrumb>span { color:#62757a; }
.status-chip { color:var(--muted); font-size:.8125rem; }
.status-chip i { background:var(--teal); width:7px; height:7px; }
.status-chip.halted { color:var(--red); }
.status-chip.halted i { background:var(--red); }
.utc-label,.logout-button { font-size:.75rem; color:var(--muted); }
.logout-button { min-height:44px; padding-inline:12px; }
.environment-banner { font-size:.8125rem; line-height:1.65; padding:11px 14px; gap:9px; border-color:#e1d1ad; background:#fff7e6; color:var(--amber); align-items:flex-start; }
.environment-banner strong { font-weight:600; }
.environment-banner>span:last-child { font-size:.75rem; color:var(--amber); flex-shrink:0; }
.banner-icon { margin-top:2px; }
.positive { color:var(--teal)!important; }
.negative { color:var(--red)!important; }
.small-pill.ok,.direction,.check-symbol,.check-status { color:var(--teal); background:#e9f5f0; }
.small-pill.warning,.direction.short,.order-status.pending,.check-symbol.warning,.check-status.warning { color:var(--amber); background:#fff4de; }
.small-pill.error,.order-status.bad,.check-symbol.error,.check-status.error { color:var(--red); background:#fff0ed; }
.feedback,.operation-result { color:var(--teal); background:#e9f5f0; border-color:#bddacf; font-size:.875rem; }
.feedback.error,.halt-alert,.inline-error { color:var(--red); background:#fff0ed; border-color:#e4b9b3; font-size:.875rem; }
.halt-alert>span,.halt-alert p { color:var(--red); font-size:.875rem; }
.connection-alert,.execution-uncertain,.execution-gate-note { color:var(--amber); background:#fff7e6; font-size:.875rem; border-color:#e1d1ad; }
.research-note { color:var(--amber); background:#fff7e6; border-color:#e1d1ad; font-size:.875rem; }
.environment-pill.testnet { color:#2858a0; background:#edf3ff; border-color:#c3d4f0; }
.quick-start { margin:0 0 24px; background:#fff; border-color:var(--line); }
.quick-start summary { min-height:48px; font-size:.875rem; color:var(--ink); padding:14px 18px; }
.quick-start summary>span { font-size:.75rem; color:var(--muted); }
.quick-start-content p,.quick-start-content ol { font-size:.875rem; color:var(--muted); }
.chart-wrap { min-height:280px; }
.chart-empty { color:var(--muted); padding:32px 16px; }
.chart-empty>span { color:var(--teal); }
.chart-empty strong { font-size:1rem; color:var(--ink); }
.chart-empty p { font-size:.875rem; color:var(--muted); }
.chart-footer { font-size:.75rem; color:var(--muted); flex-wrap:wrap; }
.chart-tooltip { font-size:.875rem; }
.chart-legend { font-size:.8125rem; color:var(--muted); }
.cursor-box { background:#f0f5f5; border-color:var(--line); padding:14px 16px; }
.cursor-box>span,.cursor-box small { font-size:.8125rem; color:var(--muted); }
.cursor-box strong { color:var(--ink); font-size:1.5rem; letter-spacing:0; }
.day-shortcuts { grid-template-columns:repeat(3,minmax(0,1fr)) 62px; gap:8px; }
.day-shortcuts button { min-height:44px; font-size:.875rem; color:var(--muted); border-color:var(--control-border); border-radius:8px; }
.day-shortcuts button.selected { color:var(--teal); border-color:var(--teal); background:var(--teal-light); font-weight:650; box-shadow:inset 0 0 0 1px var(--teal); }
.day-shortcuts input { width:62px; font-size:1rem; }
.valuation-toggle { min-height:48px; padding-block:6px; font-size:.875rem; gap:10px; }
.valuation-toggle small { font-size:.8125rem; line-height:1.65; color:var(--muted); }
.fault-control summary,.hash-details summary,.account-raw summary,.execution-order-detail summary,.usage-details summary,.analysis-details summary { min-height:44px; padding-block:10px; font-size:.875rem; }
.fault-control summary>span,.fault-control p { font-size:.8125rem; }
.run-secondary { flex-wrap:wrap; gap:8px; }
.run-secondary .button { min-height:44px; font-size:.875rem; padding:9px 12px; flex:1; }
.attribution>div { font-size:.875rem; color:var(--ink); }
.attribution small { color:var(--muted); font-size:.8125rem; }
.attribution strong { color:var(--ink); font-size:1.125rem; }
.attr-icon { color:var(--teal); }
.fee-icon { color:var(--amber); }
.key-values>div { font-size:.875rem; gap:16px; line-height:1.7; }
.key-values dt { color:var(--muted); flex-shrink:1; }
.key-values dd { color:var(--ink); overflow-wrap:anywhere; }
.table-scroll { margin-inline:-24px; overscroll-behavior-x:contain; }
table { font-size:.875rem; }
th { color:var(--muted); font-size:.8125rem; font-weight:600; background:#f3f6f7; padding-block:14px; }
td { color:var(--ink); padding-block:16px; }
.symbol-name { color:var(--ink); font-size:.875rem; }
.symbol-name small,.row-reason,.table-footer { color:var(--muted); font-size:.8125rem; }
.table-empty { color:var(--muted); font-size:.875rem; }
.table-tools input { font-size:1rem; max-width:200px; }
.event-row summary { min-height:48px; font-size:.875rem; flex-wrap:wrap; }
.event-time { font-size:.75rem; color:var(--muted); }
.event-kind { color:var(--ink); }
.page-footer { color:var(--muted); font-size:.75rem; gap:16px; flex-wrap:wrap; }
.account-empty strong { color:var(--ink); font-size:1rem; }
.account-empty p,.exchange-config-note,.account-table-note,.mobile-guide ol { color:var(--muted); font-size:.875rem; }
.account-empty>span { color:var(--teal); }
.exchange-status { color:var(--muted); font-size:.8125rem; }
.exchange-notice { color:var(--muted); font-size:.875rem; background:#edf5f3; }
.exchange-notice strong { color:var(--ink); white-space:normal; }
.execution-product strong { color:var(--ink); font-size:.9375rem; }
.execution-product p { color:var(--muted); font-size:.875rem; }
.execution-check strong,.execution-check small { font-size:.8755rem; line-height:1.75; }
.execution-order-actions .button { min-height:44px; font-size:.875rem; }
.execution-order-values strong { color:var(--ink); font-size:1.125rem; }
.execution-order-values span,.execution-order-heading small { color:var(--muted); font-size:.8125rem; }
dialog { padding:28px; border-color:var(--line); border-radius:20px; max-height:calc(100dvh - 32px); overflow:auto; }
dialog .dialog-heading { gap:16px; }
dialog .dialog-heading h2 { font-size:1.25rem; }
dialog .icon-button { flex-shrink:0; }
.mobile-menu>.button { min-height:48px; font-size:.9375rem; justify-content:space-between; }
@media(min-width:1550px) { .metric-value { font-size:2.375rem; } }
@media(min-width:701px) and (max-width:1080px) {
  .sidebar { width:200px; padding-inline:12px; }
  .app-shell { margin-left:200px; }
  .brand { font-size:1.0625rem; justify-content:flex-start; }
  .brand>span:last-child,.workspace-chip,.nav-label { display:initial; }
  .workspace-chip { display:flex; }
  .brand small { display:none; }
  .nav-item { font-size:.875rem; justify-content:flex-start; }
  .sidebar nav { margin-top:0; }
  main,.topbar { padding-inline:24px; }
  .metrics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .overview-grid,.lower-grid,.system-grid { grid-template-columns:1fr; }
  .run-card { display:block; }
}
@media(max-width:700px) {
  html { scroll-padding-block:88px 112px; }
  body { padding-bottom:calc(92px + env(safe-area-inset-bottom,0px)); }
  .sidebar { display:none; }
  .app-shell { margin-left:0; }
  main { padding:18px 16px 24px; overflow:visible; }
  .topbar { min-height:64px; height:auto; padding:8px 16px; padding-top:calc(8px + env(safe-area-inset-top,0px)); gap:8px; }
  .breadcrumb { font-size:.8125rem; gap:7px; }
  .topbar-right { gap:8px; }
  .status-chip { font-size:.75rem; }
  .page-heading,.execution-heading { margin:24px 0 20px; flex-direction:column; align-items:stretch; gap:16px; }
  .page-heading h1,.execution-heading h1 { font-size:1.75rem; line-height:1.35; margin-bottom:10px; }
  .page-subtitle,.execution-heading .page-subtitle { font-size:1rem; line-height:1.75; }
  .eyebrow { font-size:.75rem; }
  .heading-actions { display:flex; flex-direction:row; gap:10px; width:100%; }
  .heading-actions .button { flex:1; width:auto; font-size:.875rem; }
  .button { min-height:48px; font-size:.9375rem; }
  .environment-banner { padding:12px; font-size:.8125rem; }
  .environment-banner>span:last-child { display:none; }
  .metrics-grid { gap:12px; margin-bottom:20px; }
  .metric { padding:16px 14px; }
  .metric-label { font-size:.8125rem; flex-wrap:wrap; }
  .metric-value { font-size:1.75rem; line-height:1.25; margin:12px 0 10px; letter-spacing:-.04em; overflow-wrap:anywhere; }
  .metric-foot,.metric-foot strong { font-size:.75rem; }
  .metric-foot>span:last-child:not(.mini-bars) { display:inline; }
  .metric-symbol { display:none; }
  .card { padding:20px; }
  .card-heading { gap:12px; flex-wrap:wrap; }
  .card-heading h2 { font-size:1.125rem; }
  .card-heading p { font-size:.875rem; }
  .chart-wrap { min-height:210px; }
  .chart-tools { flex-wrap:wrap; gap:8px; }
  .chart-footer { font-size:.75rem; }
  .chart-empty p { font-size:.875rem; }
  .run-card { display:block; }
  .run-card>.full-width { margin-top:12px; }
  .run-card .cursor-box { margin-bottom:20px; }
  .run-secondary .button { font-size:.875rem; min-height:48px; }
  .field-label { font-size:.875rem; }
  .field-hint,.muted { font-size:.875rem; line-height:1.8; }
  .valuation-toggle { font-size:.9375rem; }
  .valuation-toggle small { font-size:.8125rem; }
  .key-values>div { font-size:.875rem; }
  .attribution>div { font-size:.9375rem; }
  .attribution strong { font-size:1.125rem; }
  .quick-start summary { font-size:.875rem; }
  .quick-start summary>span { float:none; display:block; margin-top:4px; font-size:.75rem; }
  .quick-start-content p,.quick-start-content ol { font-size:.9375rem; }
  .table-scroll { margin-inline:-20px; }
  table,.lab-table td,.lab-table .symbol-name { font-size:.875rem; }
  th { font-size:.8125rem; }
  .table-tools { width:100%; flex-wrap:wrap; }
  .table-tools input { max-width:100%; width:100%; }
  .research-note { font-size:.875rem; line-height:1.8; }
  .diagnostic-metrics small { font-size:.8125rem; }
  .execution-pause { flex-wrap:wrap; padding:18px; }
  .execution-pause h2 { font-size:1.125rem; }
  .execution-pause p,.execution-pause .button { font-size:.875rem; }
  .execution-product { padding:14px; }
  .execution-product>div { flex-wrap:wrap; }
  .execution-product p { font-size:.875rem; }
  .execution-product .small-pill { font-size:.75rem; }
  .execution-budget,.execution-budget small { font-size:.8125rem; }
  .execution-order-actions .button { font-size:.875rem; }
  .mobile-nav { padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px)); background:#fff; border-top:1px solid var(--line); box-shadow:0 -4px 20px #17323b08; }
  .mobile-nav .nav-item { min-height:56px; padding:6px 3px; margin:0; font-size:.75rem; gap:3px; color:var(--muted); border-radius:10px; box-shadow:none; }
  .mobile-nav .nav-icon { font-size:1.25rem; }
  .mobile-nav .nav-item.active { color:var(--teal); background:#e4f2ed; font-weight:650; }
  .mobile-nav .nav-item.active:before { display:none; }
  .mobile-menu { width:calc(100vw - 24px); max-width:440px; padding:22px; }
  .page-footer { font-size:.75rem; }
  .inline-form,.session-select-row { flex-wrap:wrap; }
  .inline-form .button { width:100%; }
  dialog .form-grid { grid-template-columns:1fr; }
  dialog .field-hint { font-size:.875rem; }
}
@media(max-width:360px) {
  main { padding-inline:12px; }
  .topbar { padding-inline:12px; }
  .breadcrumb { gap:5px; font-size:.75rem; }
  .topbar-right { gap:4px; }
  .status-chip { font-size:.75rem; }
  .metric { padding:14px 12px; }
  .metric-value { font-size:1.5rem; }
  .heading-actions { flex-direction:column; }
  .execution-products,.execution-form-card .form-grid { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
@media(prefers-contrast:more) {
  :root { --muted:#344b53; --line:#7b9197; --control-border:#52666c; }
}
@media(forced-colors:active) {
  .button,.small-pill,.nav-item.active { border:1px solid ButtonText; }
}

.nav-icon svg { display:block; width:22px; height:22px; }
.mobile-nav .nav-icon { display:grid; place-items:center; width:24px; height:24px; }
#refresh.is-loading { color:var(--teal); border-color:var(--teal); background:var(--teal-light); }
#refresh[aria-busy=true] { cursor:progress; }

/* Reflow at enlarged browser text settings, not only at device breakpoints. */
.topbar { flex-wrap:wrap; }
.topbar-right { flex-shrink:0; margin-left:auto; }
.status-chip { white-space:nowrap; }
@media(max-width:700px) {
  .topbar { row-gap:6px; }
  .metrics-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr)); }
  .heading-actions { flex-wrap:wrap; }
  .heading-actions .button { min-width:min(100%,8rem); }
}
html { scroll-padding-block:max(88px,6rem) max(112px,6rem); }
