/* Strategy Lab application theme. */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap');

:root { --bg:#06100e; --panel:#0a1714; --panel2:#0d1d19; --line:rgba(190,218,208,.11); --muted:#839b92; --text:#e9f2ee; --green:#64d69b; --gold:#e6b85c; --red:#ef776d; --blue:#76aaf8; --sans:'Manrope',sans-serif; --mono:'DM Mono',monospace; }
* { box-sizing:border-box; }
body { margin:0; background:radial-gradient(circle at 50% -20%,#143029 0,var(--bg) 35rem); background-attachment:fixed; color:var(--text); font-family:var(--sans); font-size:14px; line-height:1.6; }
.app-shell { min-height:100vh; }.app-body { display:grid; grid-template-columns:220px minmax(0,1fr); min-height:calc(100vh - 66px); }.app-main { min-width:0; }.sidebar { position:sticky; top:66px; height:calc(100vh - 66px); border-right:1px solid var(--line); background:rgba(8,18,16,.72); padding:28px 16px; }.sidebar-section { border-top:1px solid var(--line); color:var(--muted); font-size:9px; font-weight:700; letter-spacing:.14em; margin-top:22px; padding:14px 10px 4px; text-transform:uppercase; }.app-nav-button { display:block; width:100%; border:0; border-left:2px solid transparent; background:transparent; color:var(--muted); cursor:pointer; font:12px var(--sans); padding:12px 10px; text-align:left; transition:background .15s,color .15s,border-color .15s; }.app-nav-button:hover,.app-nav-button.active { border-left-color:var(--green); background:rgba(100,214,155,.12); color:var(--green); }
.topbar { height:66px; border-bottom:1px solid var(--line); background:rgba(8,18,16,.72); backdrop-filter:blur(16px); display:flex; align-items:center; justify-content:space-between; padding:0 32px; position:sticky; top:0; z-index:4; }
.brand { display:flex; flex-direction:column; line-height:1.25; }.fund-name,.eyebrow { color:var(--muted); font-size:9px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }.product-name { font-size:16px; font-weight:700; }.data-status { color:var(--muted); font:11px var(--mono); }.live-dot { color:var(--green); margin-right:7px; }
.app-selector { max-width:1440px; margin:18px auto 0; padding:0 24px; }.app-selector .tab { background:transparent !important; border:0 !important; border-bottom:1px solid var(--line) !important; color:var(--muted) !important; font:12px var(--sans) !important; }.app-selector .tab--selected { border-bottom:2px solid var(--green) !important; color:var(--text) !important; }
.content { max-width:1440px; margin:0 auto; padding:32px 24px 56px; }.hero { border:1px solid var(--line); background:linear-gradient(135deg,rgba(16,40,34,.9),rgba(7,20,17,.8)); padding:28px 26px; margin-bottom:16px; }.hero h1 { margin:4px 0 5px; font-size:32px; font-weight:500; }.hero p { color:var(--muted); max-width:760px; margin:0; }
.placeholder-panel { border:1px solid var(--line); background:linear-gradient(135deg,rgba(16,40,34,.75),rgba(7,20,17,.8)); margin-top:20px; max-width:760px; padding:28px; }.placeholder-panel h2 { font-size:24px; font-weight:500; margin:0 0 6px; }.placeholder-panel p { color:var(--muted); margin:0; max-width:620px; }
.panel { border:1px solid var(--line); background:rgba(10,23,20,.88); padding:20px; margin-top:16px; }.panel-header { margin-bottom:16px; }.title { font-size:17px; font-weight:500; }.subtitle,.data-note { color:var(--muted); font-size:11px; }.form-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:12px; }.field { display:flex; flex-direction:column; gap:5px; }.field label,.metric-label { color:var(--muted); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }.field input { width:100%; border:1px solid var(--line); border-radius:4px; background:var(--panel2); color:var(--text); padding:9px 10px; font:13px var(--mono); }.field input#csp-min-dollar-volume:invalid { border-color:var(--line); box-shadow:none; outline:none; }.primary-button { align-self:end; min-height:39px; border:1px solid var(--green); border-radius:4px; background:rgba(100,214,155,.12); color:var(--green); cursor:pointer; font:600 12px var(--sans); }.primary-button:hover { background:rgba(100,214,155,.22); }.data-note { margin-top:14px; }
.state-banner { margin-top:16px; padding:13px 15px; border:1px solid var(--line); background:var(--panel2); color:var(--muted); font-size:12px; }.tabs { margin-top:20px; }.tabs .tab { background:transparent !important; color:var(--muted) !important; border:0 !important; border-bottom:1px solid var(--line) !important; font:12px var(--sans) !important; }.tabs .tab--selected { color:var(--text) !important; border-bottom:2px solid var(--green) !important; }
.metric-row { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.metric { display:flex; flex-direction:column; gap:3px; }.metric-value { color:var(--text); font-size:16px; }.mono { font-family:var(--mono); }.positive { color:var(--green) !important; }.negative { color:var(--red) !important; }.proposal-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.proposal-card { border:1px solid var(--line); border-top:2px solid var(--muted); background:var(--panel2); padding:16px; }.proposal-card.conservative { border-top-color:var(--blue); }.proposal-card.balanced { border-top-color:var(--green); }.proposal-card.income { border-top-color:var(--gold); }.tag { display:inline-block; padding:2px 7px; margin-bottom:15px; border:1px solid currentColor; font-size:10px; text-transform:uppercase; letter-spacing:.1em; }.tag-blue { color:var(--blue); }.tag-green { color:var(--green); }.tag-gold { color:var(--gold); }.proposal-metrics { display:grid; grid-template-columns:repeat(2,1fr); gap:13px; margin-top:16px; }
.guide { max-width:900px; border-top:1px solid var(--line); margin-top:20px; padding-top:8px; }.guide h3 { color:var(--text); font-size:15px; font-weight:500; margin:22px 0 7px; }.guide ul { color:var(--muted); line-height:1.8; margin:0; padding-left:20px; }
.wide-textarea { width:100%; min-height:80px; border:1px solid var(--line); border-radius:4px; background:var(--panel2); color:var(--text); padding:10px; font:13px var(--mono); }
.action-row,.selector-row { display:flex; gap:12px; align-items:center; margin-top:14px; }.selector-row { margin-top:18px; }.selector-row > *:first-child { flex:1; }
.text-button { border:1px solid var(--line); border-radius:4px; background:transparent; color:var(--muted); cursor:pointer; padding:9px 12px; font:12px var(--sans); }.text-button:hover { color:var(--text); border-color:var(--muted); }
.chart-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.dark-dropdown .Select-control { background:var(--panel2); border-color:var(--line); color:var(--text); }
.dark-dropdown .Select-value-label,.dark-dropdown .Select-placeholder,.dark-dropdown .Select-input input { color:var(--text) !important; }
.dark-dropdown .Select-menu-outer { background:var(--panel2); border:1px solid var(--line); color:var(--text); z-index:10; }
.dark-dropdown .Select-option { background:var(--panel2); color:var(--text); }.dark-dropdown .Select-option.is-focused,.dark-dropdown .Select-option.is-selected { background:#143029; color:var(--text); }
.dark-dropdown .Select-arrow { border-top-color:var(--muted); }.dark-dropdown .Select-clear { color:var(--muted); }
@media (max-width:900px) { .app-body { grid-template-columns:1fr; }.sidebar { position:static; height:auto; border-right:0; border-bottom:1px solid var(--line); padding:12px 16px; }.app-nav-button { display:inline-block; width:50%; padding:9px 8px; }.form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.proposal-cards { grid-template-columns:1fr; }.topbar { padding:0 16px; }.content { padding:20px 12px 40px; } }
@media (max-width:560px) { .form-grid,.metric-row,.chart-grid { grid-template-columns:1fr; }.hero h1 { font-size:25px; }.data-status { font-size:0; }.data-status .live-dot { font-size:14px; } }