:root{--ink:#17252b;--muted:#5b6c70;--paper:#f5f1e8;--panel:#fffdf8;--line:#d9d1c1;--teal:#0e6b68;--orange:#d66b35;--yellow:#f2c66d;--shadow:0 10px 30px #20373712}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 system-ui,-apple-system,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.top{display:flex;justify-content:space-between;gap:2rem;align-items:center;padding:1.4rem max(1rem,calc((100% - 1160px)/2));border-bottom:1px solid var(--line);background:#f8f5ed}.brand h1{font-family:Georgia,serif;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1;margin:.2rem 0}.brand p{margin:0;color:var(--muted)}.eyebrow,.kicker{color:var(--teal);font-size:.75rem;letter-spacing:.13em;font-weight:800;text-transform:uppercase}.top-actions{display:flex;align-items:center;gap:1rem;color:var(--muted);font-size:.9rem}.button{border:1px solid transparent;border-radius:8px;min-height:44px;padding:.65rem 1rem;font-weight:750;transition:transform .15s,background .15s}.button:hover{transform:translateY(-1px)}.button:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}.primary{background:var(--teal);color:white}.secondary{background:#e5f0ed;color:var(--teal)}.ghost{background:transparent;border-color:var(--line);color:var(--ink)}.text-button{background:transparent;color:var(--teal);padding-left:0;padding-right:0}main{max-width:1160px;margin:auto;padding:1rem}.tabs{display:flex;gap:.35rem;flex-wrap:wrap;padding:.5rem 0 1rem}.tabs button{border:0;background:transparent;color:var(--muted);padding:.55rem .7rem;border-bottom:3px solid transparent}.tabs button[aria-current=true]{color:var(--teal);border-color:var(--orange);font-weight:800}.screen{display:none;padding:1.5rem 0 3rem}.screen.active{display:block}.hero{display:grid;grid-template-columns:1.5fr 1fr;gap:2rem;align-items:center;min-height:420px}.hero h2,h2{font:700 clamp(2rem,5vw,3.7rem)/1.06 Georgia,serif;max-width:760px;margin:.4rem 0 1rem}.lead{font-size:1.2rem;max-width:680px;color:#35494d}.case-card{border:1px solid var(--line);border-top:7px solid var(--orange);padding:1.5rem;background:var(--panel);box-shadow:var(--shadow);transform:rotate(1deg)}.case-card strong{display:block;font:700 1.6rem Georgia,serif;margin:1rem 0 .4rem}.stamp,.tag{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--teal)}.objectives{display:flex;gap:1rem;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:1rem;color:var(--muted);font-weight:700}.objectives span{padding-right:1rem;border-right:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;gap:1rem;align-items:end;border-bottom:1px solid var(--line);padding-bottom:1rem}.section-head h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:0}.intro{max-width:850px;font-size:1.08rem}.demo-note,.hint{background:#fff5d9;border-left:4px solid var(--yellow);padding:.8rem 1rem;max-width:850px}.graph-grid,.sample-grid,.corr-grid,.final-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:1rem;margin-top:1.2rem}.panel{background:var(--panel);border:1px solid var(--line);padding:1.2rem;box-shadow:var(--shadow)}.panel h3{margin-top:0;font:700 1.25rem Georgia,serif}.panel-title,.stat{display:flex;justify-content:space-between;gap:1rem;align-items:center}.panel-title output{font-weight:800;color:var(--teal)}label{display:block;margin:.8rem 0;color:#31484b;font-weight:650}input[type=range]{width:100%;accent-color:var(--teal)}input[type=number],select,textarea{display:block;width:100%;margin-top:.35rem;border:1px solid #aebdb7;border-radius:6px;background:#fff;padding:.65rem;color:var(--ink)}textarea{resize:vertical}.chart{min-height:250px;margin:1rem 0}.chart svg{width:100%;height:250px;display:block}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;background:#fff}th,td{border:1px solid var(--line);padding:.45rem .55rem;text-align:right;white-space:nowrap}th:first-child,caption{text-align:left}caption{font-weight:750;margin-bottom:.5rem}.stat{border-top:1px solid var(--line);padding:.55rem 0}.stat strong{color:var(--teal)}.feedback{min-height:3.2rem;padding:.75rem;background:#eef5f1;border-left:4px solid var(--teal)}.controls-row{display:flex;align-items:end;gap:.7rem;flex-wrap:wrap}.controls-row label{flex:1;min-width:140px}.controls-row .button{margin-bottom:.8rem}.sample-grid{grid-template-columns:.85fr 1.15fr}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;margin-bottom:1rem}.stats div{padding:.7rem;background:#eef5f1}.stats strong{display:block;font-size:1.25rem;color:var(--teal)}.muted-box{background:#f4f1e9;padding:1rem}.headline{font:700 clamp(1.5rem,4vw,2.5rem)/1.15 Georgia,serif;background:#173e3d;color:#fff;padding:1.2rem;margin:1.2rem 0;max-width:850px}.final-grid{grid-template-columns:1fr 1fr}.check{display:flex;gap:.6rem;align-items:flex-start;font-weight:500}.check input{width:20px;height:20px;accent-color:var(--teal);flex:none}.notebook{display:grid;gap:.7rem;margin:1rem 0}.note-card{background:var(--panel);border-left:4px solid var(--orange);padding:.8rem}.next-card{background:#e5f0ed;padding:1rem;max-width:650px;margin:1rem 0}.next-card strong{font:700 1.3rem Georgia,serif}footer{border-top:1px solid var(--line);padding:1rem max(1rem,calc((100% - 1160px)/2));display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.9rem}@media(max-width:700px){.top{align-items:flex-start;flex-direction:column;gap:.8rem}.top-actions{width:100%;justify-content:space-between}.hero,.graph-grid,.sample-grid,.corr-grid,.final-grid{grid-template-columns:1fr}.section-head{align-items:flex-start;flex-direction:column}.tabs{overflow-x:auto;flex-wrap:nowrap}.tabs button{white-space:nowrap}.panel{padding:1rem}footer{align-items:flex-start;flex-direction:column}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}.button:hover{transform:none}}
.axis{stroke:#31484b;stroke-width:1.5;fill:none}.grid line{stroke:#c4d0ca;stroke-width:1}.grid text,.axis-label{fill:#31484b;font-size:12px}.series{stroke:var(--orange);stroke-width:3;fill:none}.chart circle{fill:var(--teal);stroke:var(--panel);stroke-width:2}.dot{stroke:#173e3d;stroke-width:1.5}.dot.small{fill:#d66b35}.dot.medium{fill:#0e6b68}.dot.large{fill:#8059a6}.chart-pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.chart-pair h4,.final-chart-grid h3{margin:.4rem 0;font-size:.95rem}.final-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;background:var(--panel);border:1px solid var(--line);padding:1rem}.scroll-chart{min-width:480px;overflow-x:auto}.field-error{display:block;color:#a32c24;min-height:1.5em;font-size:.9rem}.summary-line{font-weight:700;color:var(--teal)}.tabs button,.check{min-height:44px}.tabs button{padding:.65rem .8rem}.chart:focus-within{outline:2px solid var(--yellow)}@media(max-width:700px){.chart-pair,.final-chart-grid{grid-template-columns:1fr}.scroll-chart{overflow-x:auto}}
.legend{display:flex;gap:1rem;flex-wrap:wrap;font-size:.9rem;font-weight:700}.legend-small{color:#d66b35}.legend-medium{color:#0e6b68}.legend-large{color:#8059a6}.summary-line{padding:.5rem 0}.final-chart-grid h3{font:700 1rem Georgia,serif}
.panel,.graph-grid>*,.sample-grid>*,.corr-grid>*,.final-grid>*,.chart-pair>*,.final-chart-grid>*{min-width:0}
.chart-pair{grid-template-columns:1fr}
.chart,.scroll-chart{min-width:0;max-width:100%;overflow-x:auto}
.chart svg{width:100%;min-width:480px;height:auto;min-height:240px}
.chart svg text{font:15px system-ui,sans-serif;fill:#263f43}
.chart svg .axis-label{font-size:14px}
.series{stroke:#a34620;fill:none}
.dot.small{fill:#a34620}.dot.medium{fill:#0e6b68}.dot.large{fill:#704b93}
.chart:focus-visible,.table-wrap:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #173e3d;outline-offset:3px}
.check{align-items:center;padding:5px 0}.tabs{flex-wrap:wrap}.tabs button{white-space:normal}
.panel.table-wrap{overflow:visible}.panel.table-wrap table{font-size:.9rem;table-layout:fixed}.panel.table-wrap td,.panel.table-wrap th{white-space:normal;overflow-wrap:anywhere}
.table-wrap:not(.panel){overflow:auto;max-height:390px}
.note-card p{white-space:pre-wrap;overflow-wrap:anywhere}
footer a{color:#0e6b68;display:inline-flex;align-items:center;min-height:44px}
@media(max-width:900px){.hero,.graph-grid,.sample-grid,.corr-grid,.final-grid,.final-chart-grid{grid-template-columns:1fr}.chart svg{min-width:480px}.top-actions{flex-wrap:wrap}.section-head{align-items:flex-start;flex-direction:column}}
.chart svg{min-width:0}.graph-grid,.sample-grid,.corr-grid,.final-grid{align-items:start}
input[type=number],select,textarea,.ghost{border-color:#687b74}input[type=range]{min-height:44px}