:root{color-scheme:dark;--bg:#080b12;--panel:#11151d;--edge:#3e3c3a;--gold:#d1ad77;--light:#e9e4da;--muted:#9b9c9e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--light);font-family:Inter,system-ui,sans-serif;font-size:13px} .layout{display:grid;grid-template-columns:minmax(0,1fr) 346px;min-height:100vh;max-width:2200px;margin:auto}.viewport{min-width:0;height:100vh;min-height:650px;position:relative;display:flex;flex-direction:column;background:radial-gradient(circle at 50% 35%,#242337 0,#0c111b 53%,#05070c 100%)}.head{display:flex;justify-content:space-between;align-items:start;padding:27px 33px 9px;z-index:2;pointer-events:none}.eyebrow,.sectioncap{color:#ad9672;font-size:10px;letter-spacing:.24em;font-weight:700}.head h1{font:700 clamp(30px,3.4vw,52px)/1.05 Cinzel,Georgia,serif;letter-spacing:.04em;margin:9px 0 3px}.head h1 em{font-weight:400;color:var(--gold);font-style:normal}.head h1 small{font-size:20px;color:#767d8c}.head p{font-size:10px;letter-spacing:.27em;color:#b4b1b0}.metric{text-align:right;line-height:1.8;color:#797d8a;font-size:10px;letter-spacing:.15em}.metric strong{color:var(--gold);font-size:18px}#canvasWrap{position:relative;min-height:0;flex:1}canvas{width:100%;height:100%;display:block;touch-action:none}.displaylabels{position:absolute;bottom:60px;left:34px;right:34px;display:flex;justify-content:space-between;pointer-events:none;font-size:10px;letter-spacing:.17em;color:#b7ad98}.viewportFoot{border-top:1px solid #ffffff16;display:flex;gap:32px;padding:20px 33px;color:#8a8b93;font-size:9px;letter-spacing:.15em}.sidebar{height:100vh;overflow:auto;background:linear-gradient(155deg,#151b24,#0c0f16);border-left:1px solid #444039;padding:34px 26px;scrollbar-color:#554936 #0b0e14}.sectioncap{font-size:11px;color:#d0b27a}.lede{line-height:1.85;color:#9ca0ac;padding:18px 0 20px;border-bottom:1px solid #ffffff1b;font-family:Georgia,serif;font-size:15px}.group{border-bottom:1px solid #ffffff19;padding:16px 0 19px}.group h2{color:var(--gold);letter-spacing:.16em;font-size:11px;font-weight:700;margin:2px 0 17px}.buttonRow{display:flex;gap:8px}button{border:1px solid #625743;color:#e4d7c0;background:#29282b;cursor:pointer;font-weight:600;letter-spacing:.08em;transition:background .2s;padding:12px 11px;font-size:11px}button:hover{background:#494033}button.primary{flex:1;background:#b48b4f;color:#100f11;border-color:#dcb56c}button.primary:hover{background:#d7ac6c}button.secondary{margin-top:15px;width:100%;background:transparent;color:#d0bd99}.rowlabel{display:flex;justify-content:space-between;color:#aab0b8;font-size:11px;margin:17px 0 11px}output{color:var(--gold)}label{display:block;margin:16px 0 8px;color:#979ba6;font-size:11px}select{width:100%;padding:11px;border:1px solid #4a4a4c;border-radius:0;color:#ddd5c5;background:#1d232d;font-size:12px}input[type=range]{accent-color:#c69d62;width:100%;cursor:pointer}.inspect{padding:14px;border:1px solid #63543e66;background:#080d15;min-height:115px}.inspect strong{display:block;margin-top:12px;letter-spacing:.05em;color:#e8cf9f;overflow-wrap:anywhere;font-size:12px}.inspect p{font-size:11px;color:#929aa6;line-height:1.6}.footer{font-size:9px;line-height:1.7;color:#737580;letter-spacing:.09em;margin:25px 0}.loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:19px;color:#cab18b;letter-spacing:.25em;font-size:10px}.spin{width:36px;height:36px;border:2px solid #63543c;border-top-color:#e9c28b;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.offline{position:absolute;inset:0;z-index:6;background:#0b0d12}.offline img{width:100%;height:100%;object-fit:contain}.err{position:absolute;bottom:20px;width:100%;text-align:center;background:#141923c9;padding:12px;color:#e6d5b4}
@media(max-width:900px){.layout{grid-template-columns:1fr}.viewport{height:75vh;min-height:480px}.sidebar{height:auto;overflow:visible;border-left:0;border-top:1px solid #45403b}.head{padding:18px}.head h1{font-size:27px}.head h1 small{font-size:14px}.viewportFoot{padding:17px;gap:14px;flex-wrap:wrap}.displaylabels{left:18px;right:18px}.metric{display:none}}