@font-face{font-family:system-fallback;src:local("Segoe UI")}*{box-sizing:border-box}html{color-scheme:dark;font-size:16px}body{margin:0;background:#0b1723;color:#edf3f8;font-family:system-fallback,system-ui,sans-serif;line-height:1.5}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #ffd15a;outline-offset:4px}button{border:1px solid #30414f;border-radius:8px;background:#152532;transition:background .16s,color .16s,border-color .16s}button:hover{background:#233b4c;border-color:#688292}button[aria-pressed=true]{background:#ffd15a;color:#111d25;border-color:#ffd15a}h1,h2,h3,p{margin:0}h2{font-size:1rem;font-weight:600}h3{font-size:1.1rem;margin:24px 0 8px}.masthead{min-height:94px;display:flex;align-items:center;justify-content:space-between;padding:16px 30px;gap:20px;border-bottom:1px solid #253541}.identity{display:flex;align-items:center;gap:17px}.brand-mark{display:grid;place-content:center;width:46px;height:48px;border:1px solid #45535a;color:#ffd15a;font-size:35px;line-height:1;transform:skewY(-7deg)}h1{font-size:1.35rem;letter-spacing:.14em;text-transform:uppercase;font-weight:750}.identity p{color:#aabecb;font-size:.94rem}.quiet-button{padding:9px 13px;background:transparent;font-size:.9rem;white-space:nowrap}.quiet-button span{margin-right:6px;color:#ffd15a}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 356px;min-height:calc(100svh - 140px)}.viewport{min-width:0;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#243749,#101c29 80%);min-height:650px}#scene{position:absolute;inset:0;touch-action:none;outline-offset:-5px}canvas{display:block;width:100%;height:100%}.scene-heading{position:absolute;left:30px;top:26px;pointer-events:none;text-shadow:0 2px 14px #000}.eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.1em;color:#adc0cf}.scene-heading>div{font-size:1rem;margin-top:8px;color:#e4eef5}.scene-heading>div span{margin-left:10px;color:#ffd15a;font-weight:650}.view-tools{position:absolute;top:28px;right:23px;display:flex;gap:6px}.view-tools button{width:40px;height:40px;font-size:1.6rem;background:#0d1d2cbb;backdrop-filter:blur(10px)}.scene-bottom{position:absolute;bottom:24px;left:28px;right:24px;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;pointer-events:none}.scene-bottom p{font-size:.8rem;color:#c3d3df;padding:8px 12px;border-radius:6px;background:#0c1825bd;backdrop-filter:blur(6px)}.compass{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.75rem;color:#f0f4fa}.compass span{display:block;color:#ffd15a;font-size:2rem;line-height:1;transform-origin:center}.summit-label{position:absolute;display:flex;align-items:center;gap:7px;pointer-events:none;font-size:.75rem;color:#e3edf3;white-space:nowrap;text-shadow:0 1px 5px #000;background:#0b1723c7;padding:4px 8px;border-radius:6px;transform:translate(-50%,-135%)}.summit-label span{width:5px;height:5px;background:#fff;border-radius:50%}.panel{padding:24px;background:#0e1d2a;border-left:1px solid #293b49;display:flex;flex-direction:column;gap:22px;z-index:1}.segmented{display:flex;border:1px solid #304350;border-radius:9px;padding:4px;margin-top:10px;gap:5px;background:#091724}.segmented button{flex:1;border-color:transparent;background:transparent;padding:8px}.segmented button[aria-pressed=true]{background:#243a4b;border-color:#607d90;color:#fff}.section-line{display:flex;align-items:center;justify-content:space-between;gap:10px}#height-value{font-size:1.8rem;line-height:1.3;color:#ffd15a;font-weight:650;white-space:nowrap}#height-value small{font-size:1rem}.secondary{font-size:.85rem;color:#98adbe}.height-control>.secondary{margin-top:2px}input[type=range]{width:100%;height:28px;cursor:pointer;accent-color:#ffd15a;margin:16px 0 2px}.height-steps{display:grid;grid-template-columns:repeat(7,1fr);gap:0;align-items:stretch}.height-steps button{background:transparent;border:0;border-radius:5px;padding:6px 0;font-size:.8rem;min-height:35px;color:#b3c5d3}.height-steps button[aria-pressed=true]{color:#ffd15a;background:#ffd15a16;font-weight:700}.play-button{width:100%;padding:11px 7px;background:#233746;border-color:#3b5668;display:flex;gap:10px;justify-content:center;align-items:center;font-size:.9rem;margin-top:13px}.play-button span:first-child{font-size:.75rem;color:#ffd15a}.play-button[aria-pressed=true]{background:#294456;color:#fff;border-color:#607d90}.result{padding:18px 0 20px;border-top:1px solid #2a3d4b;border-bottom:1px solid #2a3d4b}.result .eyebrow{font-size:.72rem;letter-spacing:.065em}.big-number{font-size:3.8rem;color:#ffd15a;font-weight:700;line-height:1.12;letter-spacing:-.04em;margin:10px 0 3px;font-variant-numeric:tabular-nums}.big-number span{font-size:2.4rem;margin-left:3px}.result>p{font-size:.93rem;color:#d3e0eb}dl{margin:19px 0 0;font-size:.88rem}dl>div{display:flex;justify-content:space-between;gap:16px;margin:6px 0}dt{color:#97afc1}dd{margin:0;font-variant-numeric:tabular-nums;color:#e3edf6}.layers h2{margin-bottom:11px}.layers label{position:relative;display:flex;align-items:center;gap:11px;padding:9px 0;cursor:pointer;font-size:.9rem}.swatch{width:10px;height:10px;border-radius:2px;flex-shrink:0}.swatch.ortho{background:linear-gradient(135deg,#86a563,#314f41)}.swatch.base{background:#51d99a}.swatch.extra{background:#ffd15a}.layers input{position:absolute;right:0;width:38px;height:23px;opacity:0;cursor:pointer;z-index:1}.switch{margin-left:auto;width:34px;height:20px;border-radius:12px;background:#344554;position:relative;flex-shrink:0;transition:background .2s}.switch:after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:#abbccc;top:3px;left:3px;transition:transform .2s,background .2s}.layers input:checked+.switch{background:#587583}.layers input:checked+.switch:after{transform:translateX(14px);background:#f7fcff}.layers input:focus-visible+.switch{outline:3px solid #ffd15a;outline-offset:3px}.panel-note{font-size:.78rem;line-height:1.6;color:#8fa7b9;margin-top:auto}footer{padding:12px 28px;display:flex;justify-content:space-between;gap:18px;border-top:1px solid #263847;color:#8fa7b9;font-size:.75rem}footer a{color:#b5c9d8;text-decoration-color:#597386;text-underline-offset:3px}.loading{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;background:#102130ed;z-index:4;text-align:center;padding:25px}.loading p{color:#a9becc;font-size:.9rem}.loading[hidden],.error-card[hidden]{display:none}.spinner{width:32px;height:32px;border:2px solid #405562;border-top-color:#ffd15a;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-card{position:absolute;inset:25% 12%;z-index:5;background:#102231;border:1px solid #788489;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:24px;gap:15px;text-align:center}.error-card button{padding:10px 18px}dialog{background:#102231;color:#e4edf5;border:1px solid #4b626f;border-radius:15px;padding:34px;max-width:640px;width:calc(100% - 32px);max-height:88svh;line-height:1.7}dialog::backdrop{background:#030b13c9;backdrop-filter:blur(4px)}dialog h2{font-size:1.75rem;margin:10px 0 18px}dialog p{margin:12px 0;color:#c7d7e3;font-size:1rem}.dialog-close{position:absolute;right:15px;top:15px;width:35px;height:35px;font-size:1.5rem;background:transparent}.formula{padding:16px;background:#061521;border-left:3px solid #ffd15a;border-radius:4px;color:#f8dda1!important;font-size:.92rem!important}dialog .eyebrow{display:block;padding-right:24px}dialog .play-button{margin-top:20px}body:has(dialog[open]){overflow:hidden}@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 390px}.panel{padding:30px;gap:27px}.big-number{font-size:4.1rem}}@media(max-height:850px) and (min-width:901px){.panel{gap:14px;padding:18px 22px}.result{padding:12px 0 14px}.big-number{font-size:3.3rem}dl{margin-top:12px}.viewport{min-height:630px}}@media(max-width:900px){.masthead{padding:15px 18px;min-height:82px}.workspace{grid-template-columns:minmax(0,1fr) 310px}.panel{padding:18px;gap:18px}.big-number{font-size:3.3rem}.view-tools{top:90px;right:13px;flex-direction:column}.scene-heading{left:20px;top:20px}.scene-bottom{left:15px;bottom:16px;right:15px}.scene-bottom p{max-width:270px}.brand-mark{display:none}.identity p{font-size:.85rem}footer{padding:12px 18px;flex-wrap:wrap;gap:5px}}@media(max-width:650px){.masthead{padding:13px 16px;gap:10px}h1{font-size:1.1rem}.identity p{font-size:.8rem}.quiet-button{font-size:.8rem;padding:8px}.workspace{display:flex;flex-direction:column}.viewport{height:56svh;min-height:340px;max-height:620px}.panel{border-left:0;border-top:1px solid #304453;padding:22px;gap:22px}.view-tools{top:75px;right:14px}.view-tools button{width:35px;height:35px;font-size:1.35rem}.scene-heading>div{font-size:.9rem}.scene-heading{left:18px;top:16px}.scene-heading .eyebrow{font-size:.65rem}.scene-bottom p{font-size:.75rem;max-width:calc(100% - 42px)}.panel .scale-control{display:flex;align-items:center;justify-content:space-between;gap:12px}.segmented{margin-top:0;min-width:165px}.segmented button{padding:7px 10px}.height-steps button{font-size:.9rem;min-height:42px}.big-number{font-size:4rem}.result .eyebrow{font-size:.75rem}.result{padding:18px 0}.height-control>.secondary{font-size:.9rem}.panel-note{font-size:.8rem}.play-button{font-size:1rem}.layers label{font-size:1rem;padding:12px 0}footer{font-size:.75rem;gap:8px;padding:16px 20px}dialog{padding:28px 22px}.compass{margin-right:3px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}.spinner{animation-duration:2s}}