@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0b1013;--panel:#10181d;--line:#243038;--muted:#839299;--white:#edf2ef;--lime:#d7ed9b;--teal:#61bebc}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font-family:'DM Sans',sans-serif;font-size:14px}button,input,select{font:inherit}button,select{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,.dropzone:focus-visible{outline:2px solid var(--lime);outline-offset:5px}header{height:86px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 4.5%;gap:20px}.brand{display:flex;align-items:center;gap:9px;color:var(--white);text-decoration:none;letter-spacing:2px;font-size:16px;font-weight:700}.brandmark{font-size:35px;color:var(--lime);margin-right:5px}.light{font-weight:400;color:var(--muted);margin-left:-6px}.header-note{color:var(--muted);font-size:12px}.quiet{background:none;border:0;color:var(--white);font-size:12px}main{max-width:1510px;margin:auto;padding:45px 4.5% 20px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.eyebrow,.panel-label{font-family:'Space Grotesk',sans-serif;font-size:10px;font-weight:500;letter-spacing:2px;color:var(--muted)}h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(27px,3.2vw,46px);letter-spacing:-1.8px;font-weight:500;margin:14px 0 10px}.intro p{color:var(--muted);margin:0;font-size:13px}.live{font-size:9px;letter-spacing:1.8px;color:var(--lime);display:flex;align-items:center;gap:8px}.live span{height:6px;width:6px;background:var(--lime);border-radius:50%;box-shadow:0 0 12px #d7ed9b55}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;border:1px solid var(--line);border-radius:12px;overflow:hidden}.stage{position:relative;min-height:670px;background:radial-gradient(ellipse at 65% 60%,#14202755,transparent 65%);overflow:hidden}.stage-heading{position:absolute;left:28px;right:28px;top:27px;display:flex;align-items:center;justify-content:space-between;z-index:1;pointer-events:none}h2{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:22px;margin:10px 0}h2 span{font-size:14px;color:var(--muted);margin-left:10px}.badge{font-size:8px;letter-spacing:1px;border:1px solid var(--line);padding:8px 10px;border-radius:20px;color:var(--muted)}canvas{display:block;width:100%;height:100%;position:absolute;inset:0}.axis-label{position:absolute;font-family:'Space Grotesk',sans-serif;font-size:13px;pointer-events:none}.axis-label small{font-family:'DM Sans',sans-serif;color:var(--muted);font-size:10px;margin-left:5px}.axis-label i{display:inline-block;width:5px;height:5px;border-radius:50%;background:currentColor;margin-right:6px}.x-label{color:var(--lime);top:41%;left:55%}.y-label{color:var(--teal);bottom:17%;left:5%}.stage-bottom{position:absolute;bottom:24px;left:28px;right:28px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.6px;color:var(--muted)}.progress{position:absolute;bottom:0;height:2px;width:100%;background:#1b272a}.progress div{height:100%;background:var(--lime);width:0}aside{padding:27px 24px;background:var(--panel);border-left:1px solid var(--line)}.panel-label{margin-bottom:22px}.select-label{display:block;font-size:12px;margin-bottom:10px}select{width:100%;background:#182228;border:1px solid #303d44;color:var(--white);padding:12px 10px;border-radius:6px;font-size:12px}.dropzone{display:flex;flex-direction:column;align-items:center;gap:8px;border:1px dashed #415052;border-radius:7px;padding:14px 8px;margin-top:15px;cursor:pointer;transition:background .2s}.dropzone:hover,.dropzone.drag{background:#d7ed9b0d;border-color:var(--lime)}.upload-icon{font-size:25px;color:var(--lime)}.dropzone strong{font-size:12px;font-weight:500}.dropzone span:last-child{font-size:10px;color:var(--muted)}.hint{font-size:10px;color:var(--muted);line-height:1.7}.divider{height:1px;background:var(--line);margin:23px 0}.range-label{display:flex;justify-content:space-between;font-size:12px}.range-label output{color:var(--lime);font-family:'Space Grotesk',sans-serif}input[type=range]{width:100%;accent-color:var(--lime);height:4px;margin:19px 0 10px;cursor:pointer}.range-captions{display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}.speed-label{margin-top:23px}.switch-row{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin-top:17px}.switch-row input{accent-color:var(--lime);width:15px;height:15px}.play-row{display:flex;gap:9px;margin-top:23px}button{border-radius:5px;transition:filter .2s}button:hover{filter:brightness(1.15)}.primary{flex:1;background:var(--lime);color:#182019;border:0;padding:12px;font-size:12px;font-weight:600}.square{width:42px;background:#1b262c;border:1px solid #354149;color:var(--white);font-size:23px}.export{width:100%;background:none;border:0;color:var(--muted);padding:15px 0 0;font-size:11px}.metrics{border-top:1px solid var(--line);margin-top:23px;padding-top:19px;display:flex;justify-content:space-between}.metrics strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:19px;font-weight:400}.metrics span{display:block;color:var(--muted);font-size:9px;margin-top:5px}#status{font-size:10px;line-height:1.5;color:var(--lime);margin:0}.explanation{padding:43px 0;display:grid;grid-template-columns:1fr 2fr;gap:30px;border-bottom:1px solid var(--line)}h3{font-family:'Space Grotesk',sans-serif;font-weight:400;font-size:26px;line-height:1.3;letter-spacing:-.6px;margin:15px 0}.explanation p{color:var(--muted);font-size:12px;line-height:1.8;max-width:690px;margin-top:0}.formula{display:flex;flex-wrap:wrap;gap:12px 28px;font-family:serif;font-size:16px;padding:12px 0 20px}.formula span:first-child{color:var(--lime)}.formula span:last-child{color:var(--teal)}footer{display:flex;justify-content:space-between;gap:15px;font-size:9px;color:var(--muted);padding-top:22px}footer a{color:var(--muted)}.dot{padding:0 10px;color:var(--lime)}@media(min-width:1450px){.stage{min-height:740px}}@media(max-width:900px){.header-note,.live{display:none}.workspace{grid-template-columns:minmax(0,1fr) 260px}aside{padding:24px 18px}.stage-heading{left:20px;right:20px}.badge{display:none}h2 span{display:block;margin:7px 0}.axis-label small{display:none}}@media(max-width:650px){header{height:70px;padding:0 6%}main{padding:30px 5% 20px}h1{letter-spacing:-1px}.intro p{line-height:1.6;max-width:300px}.workspace{grid-template-columns:1fr}.stage{min-height:480px}aside{border-left:0;border-top:1px solid var(--line);padding:25px}.stage-heading h2 span{display:inline;margin-left:8px}.badge{display:block;font-size:7px}.explanation{grid-template-columns:1fr;gap:6px;padding:32px 0}.explanation h3 br{display:none}footer{flex-direction:column;line-height:1.8}.axis-label small{display:inline}.x-label{top:38%;left:45%}.y-label{bottom:15%}.brand{font-size:13px}.quiet{font-size:10px}}