/* Wide, synchronized working surface. Small screens retain normal page scrolling. */
header{padding:8px 16px;gap:12px;min-height:52px}.logo{font-size:25px;width:32px;border-radius:7px}.brand{gap:10px}.brand strong{font-size:14px;white-space:nowrap}.brand h1{font-size:18px;letter-spacing:-.02em;border-left:1px solid var(--line);padding-left:14px}.header-actions{display:flex;align-items:center;gap:12px}.header-actions button{font-size:13px;padding:6px 10px}.badge{font-size:11px;padding:4px 8px}main{max-width:none;padding:10px 16px;margin:0}.panel{padding:14px;margin:0;border-radius:9px}.controls{gap:16px;padding:8px 12px;margin-bottom:10px;flex-wrap:nowrap}.controls label{flex:0 1 auto;min-width:100px;display:flex;align-items:center;gap:8px;white-space:nowrap}.controls select{width:auto;margin:0;max-width:310px}.controls #reset{margin-left:auto}.controls button,.controls select{font-size:14px;padding:6px 10px}h2{font-size:17px;margin-bottom:6px}h3{margin:10px 0 6px}.eyebrow{font-size:11px;margin-bottom:4px}.section-head{gap:8px;align-items:center}.section-head .tag{font-size:11px;padding:4px 6px}.price-row{margin:6px 0;gap:12px}.price-row strong{font-size:29px}.price-row span{font-size:12px}.callout{padding:7px 9px;margin:8px 0 0;font-size:13px;line-height:1.4}input[type=range]{margin:8px 0}button,select,input[type=number]{padding:6px 9px}.price-actions{gap:8px}.price-actions label{display:flex;align-items:center;gap:10px}.price-actions input{margin:0;width:130px}.position-controls{gap:10px}.position-controls select,.position-controls input{margin-top:3px}.metrics{margin:12px 0;gap:10px}.metric strong{font-size:22px}.metric small,.metric span{font-size:12px}.reference{padding:7px 0 0;font-size:12px;line-height:1.4}.section-head label{display:flex;gap:8px;align-items:center;font-size:12px}.section-head label select{margin:0;width:90px}.interval{gap:3px}.cell{padding:4px 2px;font-size:12px}.legend{font-size:12px;margin-top:6px}.flow-grid{gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}.flow-grid h2{font-size:15px}.flow-grid label{font-size:12px}.flow-grid svg{height:110px}.big{font-size:29px}.hedge-panel p,.regime-panel p{font-size:13px;margin:6px 0}.diverging{margin:10px 0}.regime{margin:16px 0 10px}.score{font-size:26px}.factor{padding:9px 0;font-size:14px;position:relative}.factor p{position:absolute;z-index:5;right:0;top:27px;width:100%;background:#22374b;color:var(--text);border:1px solid #537390;padding:12px;box-shadow:0 8px 24px #0009;border-radius:6px}.score-panel>label{margin-top:12px}#quiz p{font-size:13px;margin:5px 0}#quiz h2{font-size:15px}#quiz .eyebrow{display:none}#quiz button{font-size:13px;padding:4px 9px}#quiz .quiz-buttons{display:inline-flex;margin-right:10px}#quiz #feedback{font-size:12px}dialog{background:var(--panel);color:var(--text);border:1px solid #4a627f;border-radius:12px;width:min(760px,90vw);max-height:85vh;padding:24px}dialog::backdrop{background:#000a}dialog p{font-size:15px}dialog .section-head{position:sticky;top:-24px;background:var(--panel);padding:10px 0}dialog #lesson{margin:12px 0}
@media(min-width:1400px){
 .layout{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:minmax(450px,1.4fr) minmax(145px,.5fr) minmax(145px,.5fr);gap:10px;height:calc(100dvh - 144px)}
 .workspace,aside{display:contents}.price-panel{grid-column:1;grid-row:1}.option-panel{grid-column:2;grid-row:1}.strike-panel{grid-column:3;grid-row:1}.flow-panel{grid-column:1;grid-row:2/4}.hedge-panel{grid-column:2;grid-row:2}.regime-panel{grid-column:2;grid-row:3}.score-panel{grid-column:3;grid-row:2/4}#quiz{grid-column:1;grid-row:3}body.practicing .flow-panel{grid-row:2}
 .price-panel{display:flex;flex-direction:column}.price-panel #priceChart{flex:1;min-height:150px}.price-panel #priceChart svg{height:100%;max-height:270px}.price-panel .price-actions{margin-top:6px}.price-panel .callout{min-height:44px}
 #greeksChart svg{height:clamp(115px,15vh,170px)}#gexChart svg{height:clamp(140px,17vh,190px)}.strike-panel .cell{padding:3px 2px}.flow-panel{display:flex;flex-direction:column;justify-content:center}.flow-panel>.eyebrow{margin-bottom:16px}.flow-grid svg{height:clamp(90px,14vh,150px)}body.practicing .flow-panel>.eyebrow{margin-bottom:4px}body.practicing .flow-grid svg{height:40px}
}
@media(min-width:1400px) and (max-height:1000px){.layout .panel{padding:10px}.metrics{margin:8px 0;gap:7px}.metric strong{font-size:20px}#greeksChart svg{height:120px}#gexChart svg{height:140px}.strike-panel .cell{padding:2px}.factor{padding:6px 0}.score-panel>label{margin-top:7px}.hedge-panel .eyebrow{margin-bottom:2px}.hedge-panel h2{margin-bottom:2px}.hedge-panel .diverging{margin:6px 0}.reference{font-size:12px}.flow-panel>.eyebrow{margin-bottom:8px}}
@media(max-width:1399px){.layout{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.workspace,aside{display:contents}.flow-panel{grid-column:1/-1}.controls{flex-wrap:wrap}.brand h1{display:none}.header-actions{gap:6px}.badge{display:none}}
@media(max-width:800px){header{flex-wrap:wrap}.layout{grid-template-columns:1fr}.controls{gap:8px}.controls label{flex:1 1 45%;display:block;white-space:normal}.controls select{width:100%;max-width:none;margin-top:4px}.controls #reset{margin-left:0}.position-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.header-actions{flex-wrap:wrap}.flow-grid{grid-template-columns:1fr}.flow-grid svg{height:80px}.price-row{flex-wrap:wrap}.section-head{flex-wrap:wrap}main{padding:10px}.factor p{position:static}#quiz{grid-column:1}.brand h1{display:block;font-size:14px}}
.setup-status{display:flex;align-items:center;gap:8px}.setup-status>span:first-child{flex:1}.setup-info{position:relative;flex:none;align-self:center}.setup-info button{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;padding:0;color:var(--blue);font-weight:700;font-family:Georgia,serif}.setup-info [role=tooltip]{display:none;position:absolute;z-index:20;bottom:100%;right:0;width:min(440px,calc(100vw - 64px));padding:16px;background:#203449;color:var(--text);border:1px solid #577694;border-radius:9px;box-shadow:0 8px 28px #0009;font-size:14px;line-height:1.5;text-align:left}.setup-info ul{margin:10px 0 0;padding-left:20px}.setup-info li+li{margin-top:7px}.setup-info:not(.dismissed):hover [role=tooltip],.setup-info:not(.dismissed):focus-within [role=tooltip],.setup-info.pinned [role=tooltip]{display:block}
.scenario-control{display:flex;align-items:center;gap:8px;min-width:0}.scenario-info [role=tooltip]{top:100%;bottom:auto;white-space:normal;width:min(480px,calc(100vw - 64px))}.scenario-info ol{margin:0;padding-left:20px}.controls .scenario-info button{padding:0;font-size:14px}@media(max-width:800px){.controls .scenario-control{flex:1 1 100%}.scenario-control label{flex:1}.scenario-info{align-self:flex-end;margin-bottom:6px}}
.expiry-control{display:flex;align-items:center;gap:8px;min-width:0}.expiry-control select{max-width:220px}.option-panel .section-head{align-items:start;flex-wrap:wrap}.option-panel .section-head>div{flex:1}.option-panel #expiryBadge{white-space:nowrap;font-size:11px}.factor p{top:auto;bottom:100%;margin:0}.controls .expiry-control label{min-width:0}#expiryInfoTip p{color:var(--text);font-size:14px;margin:8px 0 0}@media(max-width:800px){.controls .expiry-control{flex:1 1 100%}.expiry-control label{flex:1}.expiry-control select{max-width:none}}
