:root {
    --bg: #071019;
    --panel: #0d1b27;
    --panel-2: #112535;
    --panel-3: #0a1721;
    --text: #dce9ef;
    --muted: #829dab;
    --cyan: #35b8ad;
    --blue: #4299bd;
    --green: #55ad79;
    --red: #d86678;
    --amber: #cda34b;
    --line: #203946;
    --sidebar: #08141d;
}

html { scroll-behavior: smooth; }
body, input, button { font-family: Inter, "Source Sans Pro", sans-serif; }
body.dashboard-body { background: var(--bg); color: var(--text); }
body.dashboard-body #header { background: #08141d; border-right: 1px solid #132a36; box-shadow: none; }
body.dashboard-body #header, body.dashboard-body #main, body.dashboard-body #footer { transition: margin-left .2s ease, width .2s ease, transform .2s ease; }
body.dashboard-body #main > section { padding: 4.5em 0; }
body.dashboard-body #main > section.two { background: #09141d; }
body.dashboard-body #main > section.three { background: #0b1822; }
body.dashboard-body #main > section.four { background: #08131c; }
body.dashboard-body #main > section.five { background: #0b1720; }
body.dashboard-body #footer { background: #061018; color: #607f91; padding: 2.2em 0; }
.wide-container { width: min(94%, 1500px); }

#logo { align-items: center; display: flex; gap: 14px; padding: 0 1.35em; }
#logo > div { min-width: 0; }
#logo h1 { color: var(--text); font-size: .95em; font-weight: 700; letter-spacing: .02em; }
#logo p { color: var(--muted); font-size: .66em; }
.fund-mark { align-items: center; background: #3aa9a2; border-radius: 12px; box-shadow: none; color: #041217; display: inline-flex; flex: 0 0 auto; height: 48px; justify-content: center; width: 48px; }
.fund-mark.large { border-radius: 18px; font-size: 1.35em; height: 66px; width: 66px; }
.sidebar-status { align-items: center; background: rgba(255, 255, 255, .035); border: 1px solid rgba(255, 255, 255, .055); border-radius: 12px; display: flex; gap: 10px; margin: 1.5em 1.3em 1.7em; padding: 12px; }
.sidebar-status strong, .sidebar-status small { display: block; }
.sidebar-status strong { color: #dff8f5; font-size: .75em; line-height: 1.2; }
.sidebar-status small { color: var(--muted); font-size: .58em; margin-top: 3px; }
.status-dot { background: var(--amber); border-radius: 50%; box-shadow: 0 0 0 4px rgba(205,163,75,.09); display: inline-block; height: 8px; width: 8px; }
.status-dot.online { background: var(--green); box-shadow: 0 0 0 4px rgba(85,173,121,.08); }
.status-dot.error { background: var(--red); box-shadow: 0 0 0 4px rgba(216,102,120,.08); }
#nav ul li a { align-items: center; border-left: 3px solid transparent; color: #7896a7; display: flex; font-size: .8em; min-height: 54px; padding: .7em 1.35em; transition: background-color .14s ease, border-color .14s ease, color .14s ease, transform .14s ease; }
#nav ul li a span { min-width: 0; overflow-wrap: anywhere; width: 100%; }
#nav ul li a span:before { color: #4d6d7f; transition: color .14s ease, transform .14s ease; }
#nav ul li a:hover { background: #0c202a; color: #b8ccd5; transform: translateX(2px); }
#nav ul li a:hover span:before { color: #6aa49f; }
#nav ul li a:active { background: #102a34; transform: translateX(1px); }
#nav ul li a:focus-visible { background: #0d242e; border-left-color: #4b9690; color: #d7e7ec; outline: 1px solid #315763; outline-offset: -2px; }
#nav ul li a.active { background: #0d292f; border-left-color: var(--cyan); color: #e0efef; }
#nav ul li a.active span:before { color: var(--cyan); }
.nav-collapse-button { align-items: center; background: #0b1d27 !important; background-image: none !important; border: 1px solid #1d3945; border-radius: 7px; color: #7896a7 !important; cursor: pointer; display: flex; height: 32px; justify-content: center; padding: 0; position: absolute; right: 10px; top: 10px; transition: background-color .14s ease, color .14s ease, transform .14s ease; width: 32px; z-index: 3; }
.nav-collapse-button:hover { background: #102b35 !important; color: #c0d4dc !important; transform: translateX(-1px); }
.nav-collapse-button:focus-visible { outline: 2px solid #4b9690; outline-offset: 2px; }
.sidebar-bottom { border-top: 1px solid rgba(255, 255, 255, .055); padding: 1.2em; }
.paper-lock { align-items: center; color: var(--cyan); display: flex; font-size: .62em; font-weight: 700; gap: 8px; justify-content: center; letter-spacing: .14em; margin-bottom: 10px; }
.text-button { background: transparent; border: 0; color: #7190a2; cursor: pointer; font-size: .68em; padding: 5px; width: 100%; }
.text-button:hover { color: var(--text); }
.hero-header > div, .panel-heading > div, .section-heading > div, .metric-card, .glass-panel, .data-panel, .decision-card, .control-card { min-width: 0; }
.hero-header h2, .hero-header p, .section-heading h2, .section-note, .metric-card small, .pulse-row small, .decision-thesis, .decision-risk, .timeline-item p, .control-card p { overflow-wrap: anywhere; }

body.dashboard-body #main > section.command-hero { background: #081720; min-height: 100vh; }
.command-hero:after { background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 64px 64px; content: ""; inset: 0; pointer-events: none; position: absolute; }
.command-hero .container { position: relative; z-index: 1; }
.hero-topline, .section-heading, .panel-heading { align-items: center; display: flex; justify-content: space-between; }
.eyebrow { color: var(--cyan); font-size: .64em; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.last-refresh, .section-note { color: var(--muted); font-size: .68em; }
.hero-header { align-items: center; display: flex; justify-content: space-between; margin: 3.2em 0 2.5em; text-align: left; }
.hero-header h2 { color: var(--text); font-size: clamp(2em, 4vw, 3.55em); font-weight: 300; letter-spacing: -.045em; line-height: 1.05; margin: 0; }
.hero-header h2 strong { color: #fff; font-weight: 700; }
.hero-header p { color: #9bb6c5; font-size: .92em; margin: 1.1em 0 0; max-width: 730px; }
.market-orb { align-items: center; background: #0b202a; border: 1px solid #1c3f49; border-radius: 14px; box-shadow: none; box-sizing: border-box; display: flex; flex: 0 0 175px; flex-direction: column; gap: 7px; height: 132px; justify-content: center; margin-left: 2em; padding: 16px 14px; }
.market-orb span { color: var(--muted); display: block; font-size: .55em; letter-spacing: .18em; line-height: 1.2; }
.market-orb strong { color: var(--green); display: block; font-size: 1.4em; line-height: 1; margin: 0; }
.market-orb.closed strong { color: var(--amber); }
.market-orb small { color: #7c99aa; display: block; font-size: .55em; line-height: 1.35; max-width: 135px; text-align: center; }
.metric-grid { display: grid; gap: 14px; grid-template-columns: repeat(4, 1fr); }
.metric-card { background: #0c1d28; border: 1px solid #193541; border-radius: 12px; box-shadow: none; padding: 1.2em 1.3em; text-align: left; }
.metric-card span { color: var(--muted); display: block; font-size: .63em; }
.metric-card strong { color: #fff; display: block; font-size: 1.65em; font-weight: 650; letter-spacing: -.03em; margin: .18em 0; }
.metric-card small { color: #648495; display: block; font-size: .56em; }
.metric-card .positive { color: #6fbe8d; }
.metric-card .negative { color: #df7b8a; }
.command-grid { display: grid; gap: 14px; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr); margin-top: 14px; }
.glass-panel, .data-panel, .control-card { background: #0a1b25; border: 1px solid #193541; border-radius: 13px; box-shadow: none; }
.glass-panel { min-height: 315px; padding: 1.2em 1.35em; text-align: left; }
.panel-heading { gap: 1em; margin-bottom: 1em; }
.panel-heading h3 { color: var(--text); font-size: .92em; font-weight: 600; margin: 0; }
.panel-heading p { color: var(--muted); font-size: .62em; margin: .3em 0 0; }
.chart-heading-tools { align-items: flex-end; display: flex; flex-direction: column; gap: 9px; }
.chart-legend { color: var(--muted); display: flex; font-size: .58em; gap: 16px; }
.chart-legend span:before { border-radius: 2px; content: ""; display: inline-block; height: 3px; margin-right: 6px; vertical-align: middle; width: 18px; }
.portfolio-key:before { background: var(--cyan); }
.spy-key:before { background: var(--blue); }
.chart-ranges { align-items: center; background: rgba(3,13,20,.62); border: 1px solid rgba(135,166,184,.1); border-radius: 8px; display: flex; padding: 2px; }
body.dashboard-body .chart-ranges button { background-color: transparent !important; background-image: none !important; border: 1px solid transparent; border-radius: 6px; color: #718b98 !important; cursor: pointer; font-size: .5em; font-weight: 750; height: 25px; letter-spacing: .04em; padding: 0 8px; width: auto; }
body.dashboard-body .chart-ranges button:hover { background-color: #102630 !important; color: #b6cbd4 !important; }
body.dashboard-body .chart-ranges button.active { background-color: #123432 !important; border-color: #28635f; color: #b8dfda !important; }
.chart-ranges button:focus-visible { outline: 1px solid var(--cyan); outline-offset: 1px; }
.line-chart { height: 255px; width: 100%; }
.stock-chart { height: 100%; position: relative; touch-action: pan-y; user-select: none; width: 100%; }
.stock-chart svg { display: block; height: 100%; overflow: visible; width: 100%; }
.chart-plot { cursor: crosshair; outline: none; }
.chart-plot:focus-visible { outline: 1px solid #397f7a; outline-offset: -1px; }
.chart-series { pointer-events: none; vector-effect: non-scaling-stroke; }
.chart-crosshair { opacity: 0; pointer-events: none; transition: opacity .12s; }
.stock-chart.interacting .chart-crosshair { opacity: 1; }
.chart-tooltip { background: #07151e; border: 1px solid #294652; border-radius: 8px; box-shadow: 0 8px 18px rgba(0,0,0,.2); color: #dcecf3; display: none; min-width: 145px; padding: 9px 11px; pointer-events: none; position: absolute; top: 8px; z-index: 3; }
.stock-chart.interacting .chart-tooltip { display: block; }
.chart-tooltip time { color: #6e8e9e; display: block; font-size: .53em; margin-bottom: 5px; }
.chart-tooltip span { align-items: center; display: flex; font-size: .58em; justify-content: space-between; line-height: 1.6; }
.chart-tooltip b { color: #eaf7fb; font-weight: 700; margin-left: 14px; }
.chart-tooltip .portfolio-value:before, .chart-tooltip .spy-value:before { border-radius: 50%; content: ""; display: inline-block; height: 6px; margin-right: 6px; width: 6px; }
.chart-tooltip .portfolio-value:before { background: var(--cyan); }
.chart-tooltip .spy-value:before { background: var(--blue); }
.chart-instruction { bottom: 5px; color: #456778; font-size: .48em; pointer-events: none; position: absolute; right: 3px; }
.chart-empty, .empty-state { align-items: center; color: var(--muted); display: flex; flex-direction: column; font-size: .7em; gap: 10px; justify-content: center; min-height: 170px; text-align: center; }
.chart-empty i, .empty-state i { color: #3d6275; font-size: 1.7em; }
.pulse-list { display: grid; gap: 10px; }
.pulse-row { align-items: center; background: rgba(255, 255, 255, .025); border: 1px solid rgba(255, 255, 255, .045); border-radius: 11px; box-sizing: border-box; display: grid; gap: 10px; grid-template-columns: 10px minmax(0, 1fr) minmax(0, max-content); min-width: 0; padding: 11px 12px; width: 100%; }
.pulse-row > div { min-width: 0; overflow: hidden; }
.pulse-row strong { color: #dceef7; display: block; font-size: .66em; }
.pulse-row small { color: #6f8d9e; display: block; font-size: .53em; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pulse-row .value { color: #94b2c2; font-size: .56em; max-width: 92px; min-width: 0; overflow: hidden; text-align: right; text-overflow: ellipsis; white-space: nowrap; }

.dashboard-section { color: var(--text); min-height: 80vh; text-align: left; }
.section-heading { margin-bottom: 1.8em; }
.section-heading h2 { color: var(--text); font-size: 1.8em; font-weight: 650; letter-spacing: -.035em; margin: .1em 0 0; }
.portfolio-grid, .market-grid { display: grid; gap: 18px; grid-template-columns: 1fr 1fr; }
.data-panel { min-width: 0; overflow: hidden; padding: 1.25em; }
.count-pill, .live-pill { background: rgba(56, 189, 248, .1); border: 1px solid rgba(56, 189, 248, .18); border-radius: 99px; color: var(--blue); font-size: .55em; font-weight: 700; padding: 4px 9px; }
.live-pill { background: rgba(74, 222, 128, .09); border-color: rgba(74, 222, 128, .16); color: var(--green); letter-spacing: .12em; }
.table-wrap { background: #081923; border-radius: 8px; overflow-x: auto; }
.data-table, .data-table thead, .data-table tbody, .data-table tfoot { background: transparent; background-image: none; }
.data-table { border-collapse: collapse; font-size: .67em; min-width: 720px; width: 100%; }
.data-table thead tr, .data-table thead tr:nth-child(2n+2) { background: #0c202a !important; background-image: none !important; }
.data-table tbody tr, .data-table tbody tr:nth-child(2n+2) { background: #081923 !important; background-image: none !important; transition: background-color .14s ease; }
.data-table tbody tr:nth-child(even) { background: #0a1d27 !important; }
.data-table tbody tr:hover { background: #102a35 !important; }
.data-table th { background: #0c202a !important; background-image: none !important; border-bottom: 1px solid var(--line); color: #7194a6; font-size: .8em; font-weight: 700; letter-spacing: .08em; padding: 11px 10px; text-align: left; text-transform: uppercase; }
.data-table td { background: transparent !important; background-image: none !important; border-bottom: 1px solid rgba(31, 59, 76, .58); color: #b9cfda; line-height: 1.45; overflow-wrap: anywhere; padding: 12px 10px; vertical-align: middle; }
.data-table tr:last-child td { border-bottom: 0; }
.ticker { color: #f3fbff; font-weight: 750; letter-spacing: .025em; }
.subvalue { color: #678697; display: block; font-size: .82em; margin-top: 2px; }
.action-badge { border-radius: 99px; display: inline-block; font-size: .78em; font-weight: 750; padding: 4px 8px; text-transform: uppercase; }
.action-badge.buy, .action-badge.filled { background: rgba(74, 222, 128, .11); color: var(--green); }
.action-badge.hold, .action-badge.accepted, .action-badge.new { background: rgba(56, 189, 248, .11); color: var(--blue); }
.action-badge.avoid, .action-badge.sell, .action-badge.rejected { background: rgba(251, 113, 133, .11); color: var(--red); }
.action-badge.canceled, .action-badge.dry_run { background: rgba(135, 166, 184, .1); color: #9ab4c3; }
.positive { color: var(--green) !important; }
.negative { color: var(--red) !important; }

.model-roster { display: flex; flex-wrap: wrap; gap: 10px; margin: -0.5em 0 1.3em; }
.model-chip { align-items: center; background: #0a1b25; border: 1px solid #1a3541; border-radius: 9px; color: #91aebb; display: grid; font-size: .57em; gap: 2px 9px; grid-template-columns: auto minmax(0, 1fr) auto; padding: 9px 12px; }
.model-chip > i { color: #6ebbb4; }
.model-chip strong { color: #dbe8ed; font-weight: 650; max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-chip small { color: #617f8e; grid-column: 2 / 4; }
.model-tier { background: rgba(66,153,189,.1); border-radius: 99px; color: #79afc5; font-size: .88em; padding: 2px 6px; text-transform: capitalize; }
.model-tier.primary { background: rgba(53,184,173,.1); color: #76c3bc; }
.decision-grid { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 18px; }
.decision-card { background: #0c1f2a; border: 1px solid #1b3946; border-radius: 12px; display: flex; flex-direction: column; min-width: 0; overflow: hidden; padding: 1.15em; position: relative; text-align: left; }
.decision-card:before { background: var(--blue); content: ""; height: 3px; inset: 0 0 auto; position: absolute; }
.decision-card.buy:before { background: var(--green); }
.decision-card.avoid:before { background: var(--red); }
.decision-head { align-items: center; display: flex; gap: 12px; justify-content: space-between; }
.decision-identity { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.decision-symbol { color: #fff; font-size: 1.12em; font-weight: 750; }
.decision-score { color: var(--muted); flex: 0 0 auto; font-size: .62em; }
.decision-score strong { color: #fff; font-size: 1.25em; }
.decision-meta { color: #86a1ae; display: flex; flex-wrap: wrap; font-size: .56em; gap: 7px; margin: .85em 0 1em; }
.decision-meta span { background: #0a1922; border: 1px solid #193541; border-radius: 6px; padding: 4px 7px; }
.decision-section-label { color: #648491; display: block; font-size: .5em; font-weight: 750; letter-spacing: .11em; margin-bottom: .42em; text-transform: uppercase; }
.decision-thesis { color: #b3c8d1; font-size: .63em; line-height: 1.58; margin: 0; text-align: left; }
.decision-risk { border-top: 1px solid #193541; color: #8ca6b1; font-size: .57em; line-height: 1.55; margin-top: 1em; padding-top: .85em; text-align: left; }
.decision-model { align-items: center; border-top: 1px solid #193541; color: #607e8d; display: flex; font-size: .51em; gap: 6px; margin-top: auto; padding-top: .85em; }
.decision-model i { color: #6ebbb4; }
.decision-model strong { color: #8eabb8; font-weight: 600; margin-right: auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evidence-panel { margin-top: 0; }
.source-link { color: var(--cyan); text-decoration: none; }
.source-link:hover { color: #8dd3cd; }

.timeline { max-height: 560px; overflow-y: auto; padding-right: 5px; }
.timeline-item { border-left: 1px solid var(--line); margin-left: 7px; padding: 0 0 1.15em 1.2em; position: relative; }
.timeline-item:before { background: var(--cyan); border: 3px solid var(--panel); border-radius: 50%; content: ""; height: 11px; left: -6px; position: absolute; top: 3px; width: 11px; }
.timeline-item.warning:before { background: var(--amber); }
.timeline-item.error:before { background: var(--red); }
.timeline-item strong { color: #dceef7; display: block; font-size: .67em; }
.timeline-item p { color: #7e9cac; font-size: .58em; line-height: 1.45; margin: .25em 0; }
.timeline-item time { color: #587788; font-size: .5em; }

.control-grid { display: grid; gap: 16px; grid-template-columns: repeat(4, 1fr); }
.control-card { padding: 1.35em; }
.control-card > i { color: var(--blue); font-size: 1.45em; }
.control-card h3 { color: #e8f6fc; font-size: .82em; margin: .85em 0 .45em; }
.control-card p { color: #7f9cab; font-size: .61em; line-height: 1.55; min-height: 66px; }
.critical-card { border-color: rgba(251, 113, 133, .2); }
.critical-card > i { color: var(--red); }
.action-button, .login-button { border: 0; border-radius: 9px; box-shadow: none; cursor: pointer; font-size: .61em; font-weight: 750; letter-spacing: .035em; padding: 11px 14px; text-transform: none; width: 100%; }
.action-button:disabled, .login-button:disabled { cursor: wait; opacity: .55; }
.action-button.warning { background: rgba(251, 191, 36, .13); color: var(--amber); }
.action-button.positive { background: rgba(74, 222, 128, .13); color: var(--green); }
.action-button.neutral { background: rgba(56, 189, 248, .12); color: var(--blue); }
.action-button.danger { background: rgba(251, 113, 133, .14); color: var(--red); }

.toast { background: #102b39; border: 1px solid var(--line); border-radius: 10px; bottom: 22px; box-shadow: 0 18px 55px rgba(0,0,0,.35); color: var(--text); font-size: .68em; opacity: 0; padding: 12px 16px; pointer-events: none; position: fixed; right: 22px; transform: translateY(12px); transition: .22s ease; z-index: 10003; }
.toast.visible { opacity: 1; transform: translateY(0); }
.toast.error { border-color: rgba(251,113,133,.35); color: #ffd8df; }
.modal { align-items: center; background: rgba(2, 9, 14, .78); display: none; inset: 0; justify-content: center; padding: 20px; position: fixed; z-index: 10002; }
.modal.open { display: flex; }
.modal-card { background: #0c1d28; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 35px 100px rgba(0,0,0,.5); max-width: 470px; padding: 1.6em; position: relative; width: 100%; }
.modal-card h3 { color: var(--text); font-size: 1.15em; margin: .35em 0; }
.modal-card p, .modal-card label { color: var(--muted); font-size: .67em; }
.modal-card label { display: block; margin: 1em 0 .35em; }
.modal-card input { background: #07131c; border: 1px solid var(--line); border-radius: 8px; color: var(--text); font-size: .75em; padding: 10px; width: 100%; }
.modal-close { background: transparent; border: 0; color: #678798; cursor: pointer; font-size: 1.5em; padding: 0; position: absolute; right: 17px; top: 10px; }
.modal-actions { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; margin-top: 1em; }
.modal.no-input label, .modal.no-input input { display: none; }

.login-body { background: #071019; color: var(--text); min-height: 100vh; overflow-x: hidden; }
.login-shell { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(440px, .85fr); min-height: 100vh; }
.login-brand { align-items: center; background: #0a202a; border-right: 1px solid #193541; display: flex; overflow: hidden; padding: clamp(50px, 7vw, 100px); position: relative; }
.login-chart { inset: 0; opacity: .46; position: absolute; }
.login-chart svg { height: 100%; width: 100%; }
.chart-grid { fill: none; stroke: rgba(135,166,184,.09); stroke-width: 1; }
.login-area { fill: rgba(53,184,173,.08); }
.login-line { fill: none; stroke: #3b9f99; stroke-width: 4; }
.login-brand-content { max-width: 620px; position: relative; z-index: 1; }
.login-brand-content .eyebrow { display: block; margin-top: 3.2em; }
.login-brand-content h1 { color: #fff; font-size: clamp(3.5em, 6vw, 5.6em); font-weight: 700; letter-spacing: -.065em; line-height: .86; margin: .32em 0; }
.login-brand-content p { color: #9db8c7; font-size: .92em; line-height: 1.65; max-width: 540px; }
.login-badges { display: flex; gap: 12px; margin-top: 2em; }
.login-badges span { background: rgba(7,16,25,.48); border: 1px solid rgba(135,166,184,.13); border-radius: 99px; color: #9fb9c6; font-size: .68em; padding: 8px 12px; }
.login-badges i { color: var(--cyan); margin-right: 6px; }
.login-panel { align-items: center; background: #08131c; display: flex; justify-content: center; min-width: 0; padding: clamp(28px, 4vw, 64px); }
.login-form { background: #0b1c26; border: 1px solid #1e3945; border-radius: 16px; box-shadow: none; box-sizing: border-box; max-width: 440px; padding: 42px; width: 100%; }
.login-form-brand { align-items: center; display: flex; gap: 12px; margin-bottom: 2.6em; }
.login-form-brand .fund-mark { border-radius: 11px; height: 44px; width: 44px; }
.login-form-brand div { display: flex; flex-direction: column; }
.login-form-brand strong { color: #eef8fc; font-size: .77em; font-weight: 700; letter-spacing: -.01em; }
.login-form-brand small { color: #5f8192; font-size: .58em; margin-top: 1px; }
.login-form h2 { color: #fff; font-size: 2.1em; font-weight: 700; letter-spacing: -.045em; margin: .25em 0; }
.login-form > p { color: var(--muted); font-size: .78em; line-height: 1.55; margin-bottom: 2em; }
.login-form label { color: #a9c0cb; display: block; font-size: .66em; font-weight: 600; letter-spacing: .01em; margin: 1.05em 0 .48em; }
.input-shell { align-items: center; background: #071019; border: 1px solid #183443; border-radius: 11px; display: flex; min-height: 52px; overflow: hidden; transition: border-color .2s, box-shadow .2s, background .2s; }
.input-shell:focus-within { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(45,212,191,.09); }
.input-shell:focus-within i { color: var(--cyan); }
.input-shell i { color: #527487; flex: 0 0 46px; font-size: .78em; text-align: center; transition: color .2s; }
body.login-body .input-shell input,
body.login-body .input-shell input:focus,
body.login-body .input-shell input:hover { -webkit-appearance: none; appearance: none; background: transparent !important; border: 0 !important; border-radius: 0; box-shadow: none !important; color: var(--text) !important; font-size: .78em; height: 50px; margin: 0; outline: 0 !important; padding: 0 15px 0 0; width: 100%; -webkit-text-fill-color: var(--text) !important; }
body.login-body .input-shell input:-webkit-autofill,
body.login-body .input-shell input:-webkit-autofill:hover,
body.login-body .input-shell input:-webkit-autofill:focus { caret-color: var(--text); -webkit-box-shadow: 0 0 0 1000px #071019 inset !important; -webkit-text-fill-color: var(--text) !important; transition: background-color 9999s ease-out 0s; }
.login-button { align-items: center; background: #3aa9a2; border: 0; border-radius: 10px; box-shadow: none; color: #041217; cursor: pointer; display: flex; font-size: .73em; font-weight: 700; justify-content: space-between; margin-top: 1.7em; padding: 15px 18px; transition: background .2s, transform .2s; width: 100%; }
.login-button:hover { background: #48b8b0; transform: translateY(-1px); }
.login-button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.login-button:disabled { cursor: wait; filter: saturate(.65); opacity: .75; transform: none; }
.login-error { color: var(--red) !important; font-size: .68em !important; margin: 1em 0 0 !important; min-height: 1.4em; }
.login-foot { align-items: center; color: #58798b; display: flex; font-size: .61em; gap: 9px; justify-content: center; margin-top: 2.2em; }

@media screen and (max-width: 1200px) {
    .metric-grid { grid-template-columns: repeat(2, 1fr); }
    .control-grid { grid-template-columns: repeat(2, 1fr); }
}

@media screen and (max-width: 1180px) {
    .command-grid { grid-template-columns: 1fr; }
}

@media screen and (min-width: 961px) {
    body.dashboard-body.nav-collapsed #header { width: 84px; }
    body.dashboard-body.nav-collapsed #main, body.dashboard-body.nav-collapsed #footer { margin-left: 84px; }
    body.dashboard-body.nav-collapsed #logo { justify-content: center; margin-left: 0; margin-right: 0; padding: 0; }
    body.dashboard-body.nav-collapsed #logo .fund-mark { height: 44px; width: 44px; }
    body.dashboard-body.nav-collapsed #logo > div,
    body.dashboard-body.nav-collapsed .sidebar-status > div,
    body.dashboard-body.nav-collapsed .paper-lock span,
    body.dashboard-body.nav-collapsed .text-button:not(.nav-collapse-button) { font-size: 0; }
    body.dashboard-body.nav-collapsed .sidebar-status { justify-content: center; margin: 1.5em auto 1.7em; padding: 12px 0; width: 52px; }
    body.dashboard-body.nav-collapsed #nav ul li a { border-left-width: 3px; justify-content: center; min-height: 56px; padding: 0; transform: none; }
    body.dashboard-body.nav-collapsed #nav ul li a span { font-size: 0; min-height: 42px; width: 100%; }
    body.dashboard-body.nav-collapsed #nav ul li a span:before { font-size: 18px; left: 50%; line-height: 42px; transform: translateX(-50%); width: 42px; }
    body.dashboard-body.nav-collapsed #nav ul li a:hover span:before { transform: translateX(-50%) scale(1.08); }
    body.dashboard-body.nav-collapsed .sidebar-bottom { padding: 1em .7em; }
    body.dashboard-body.nav-collapsed .paper-lock { margin-bottom: 12px; }
    body.dashboard-body.nav-collapsed .text-button { min-height: 38px; padding: 5px 0; }
    body.dashboard-body.nav-collapsed .text-button i { font-size: 16px; }
    body.dashboard-body.nav-collapsed .nav-collapse-button i { transform: rotate(180deg); }
}

@media screen and (max-width: 960px) {
    .nav-collapse-button { display: none; }
    .hero-header { align-items: flex-start; }
    .market-orb { flex-basis: 135px; height: 135px; width: 135px; }
    .command-grid, .portfolio-grid, .market-grid { grid-template-columns: 1fr; }
    .login-shell { grid-template-columns: 1fr; }
    .login-brand { display: none; }
    .login-panel { min-height: 100vh; }
}

@media screen and (max-width: 736px) {
    body.dashboard-body #main > section { padding: 3.5em 0; }
    .wide-container { width: 92%; }
    .hero-topline, .section-heading { align-items: flex-start; flex-direction: column; gap: 7px; }
    .command-hero .hero-topline { padding-top: 2.6em; }
    .command-hero .last-refresh { padding-left: 0; }
    .hero-header { display: block; margin-top: 1.7em; }
    .hero-header h2 { font-size: 2.05em; line-height: 1.08; }
    .market-orb { border-radius: 13px; display: grid; gap: 10px; grid-template-columns: auto auto minmax(0, 1fr); height: auto; margin: 1.6em 0 0; padding: 13px 15px; width: 100%; }
    .market-orb span { white-space: nowrap; }
    .market-orb strong { font-size: 1.15em; white-space: nowrap; }
    .market-orb small { margin-left: 0; max-width: none; text-align: right; }
    .metric-grid, .decision-grid, .control-grid { grid-template-columns: 1fr; }
    .metric-card strong { font-size: 1.35em; }
    .performance-panel .panel-heading { align-items: flex-start; flex-direction: column; }
    .chart-heading-tools { align-items: flex-start; width: 100%; }
    .chart-ranges { justify-content: space-between; width: 100%; }
    .chart-ranges button { flex: 1; }
    .line-chart { height: 230px; }
    .chart-instruction { display: none; }
    .data-panel { padding: 1em; }
    .control-card p { min-height: 0; }
    .login-panel { padding: 20px; width: 100%; }
    .login-form { border-radius: 16px; max-width: calc(100vw - 40px); padding: 30px 24px; }
    .login-form-brand { margin-bottom: 2.1em; }
    .login-form h2 { font-size: 1.8em; }
}