:root{color-scheme:dark;--bg:#0c1819;--ink:#eae7dc;--muted:#aab8b5;--line:#29403d;--accent:#e3b77b;--green:#b2d5cb;--panel:#132221;--paper:#f5efe2;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink)}body{font-size:13px}.shell{margin:auto;max-width:1920px;min-height:100vh;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 27px;border-bottom:1px solid var(--line);background:#111f1f}.eyebrow{letter-spacing:.18em;font-size:10px;font-weight:760;color:var(--accent)}.identity{min-width:0}.logotype{font-family:Georgia,serif;font-size:24px;letter-spacing:-.04em;margin-top:5px;color:var(--paper)}.logotype span{font-size:16px;color:#b6c2b8;letter-spacing:0}.identity p{margin:4px 0 0;color:#afbfbc;font-size:12px}.head-actions{display:flex;gap:9px;flex-wrap:wrap}.head-actions button,.camera{border:1px solid #40504a;background:#1a2a29;color:#e9eee8;padding:10px 12px;border-radius:6px;cursor:pointer;font-weight:660;font-size:12px}.head-actions button:hover,.camera:hover{border-color:var(--accent)}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #d8b685;outline-offset:2px}.head-actions .pill{background:var(--accent);color:#17201c;border-color:var(--accent)}.layout{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 347px;min-height:0}.stage-wrap{min-width:0;display:flex;flex-direction:column;background:#101d1d;position:relative}.stage-top{display:flex;justify-content:space-between;gap:8px;align-items:center;min-height:40px;padding:10px 24px;color:#abbcb4;border-bottom:1px solid #283934}.stage-label{font-size:11px;letter-spacing:.14em;color:var(--accent);font-weight:760}.stage-help{font-size:10px;letter-spacing:.08em}.stage{flex:1;position:relative;min-height:420px;overflow:hidden;background:linear-gradient(#a7bdc4,#e0d4bb)}#world{position:absolute;width:100%;height:100%;display:block;touch-action:none;outline:0}.camera-bar{display:flex;gap:7px;flex-wrap:wrap;justify-content:center;padding:11px;border-top:1px solid #2c433e;border-bottom:1px solid #2c433e}.camera{background:none;border-color:#40544d;padding:9px 12px}.camera.active{color:#16211f;background:#b8c8bb;border-color:#b8c8bb}.attribution{text-align:center;color:#a3b7b0;padding:9px 12px;font-size:11px}.side{min-height:0;overflow:auto;max-height:calc(100vh - 97px);background:#10201f;border-left:1px solid #2c4540;scrollbar-color:#53665f transparent}.pane{border-bottom:1px solid #2c423d;padding:23px}.intro h1{font-family:Georgia,serif;font-size:29px;font-weight:500;margin:9px 0;color:#f4e9d6}.intro p{margin:0;color:#afc1ba;line-height:1.65}.section-title{display:flex;align-items:center;gap:11px;margin-bottom:19px}.section-title span{font-size:11px;color:var(--accent);font-weight:700}.section-title h2{font-size:15px;font-weight:700;margin:0}.control-line{display:flex;justify-content:space-between;gap:10px;align-items:center;color:#c8d9d1;font-size:12px;margin:17px 0 6px}.control-line output{color:#f5cd91;font-variant-numeric:tabular-nums;white-space:nowrap}.controls input[type=range]{width:100%;accent-color:#d5b88b;height:18px;cursor:pointer}.controls select{background:#263a34;border:1px solid #52685b;color:white;border-radius:5px;padding:8px 9px;width:100%;font-size:12px}.readout-grid{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:9px}.readout{background:#1d302b;border:1px solid #355048;padding:12px 11px 10px;border-radius:5px;min-width:0}.readout span{font-size:9px;line-height:1.35;color:#aac1b2;letter-spacing:.07em;display:block;min-height:25px}.readout strong{font-size:27px;letter-spacing:-.055em;color:#f2ebdc;display:inline-block;margin-top:5px;font-variant-numeric:tabular-nums;font-weight:600}.readout small{margin-left:5px;color:#e6c795}.check{border-left:2px solid #d8b787;padding-left:12px;margin-top:17px}.check>span{font-size:9px;letter-spacing:.1em;color:#d1c4a6}.check div{display:flex;gap:8px;align-items:baseline;margin-top:6px}.check b{font-size:18px;color:#ede3d2}.check small{font-size:10px;color:#aebeb7}.check p{font-size:10px;color:#9ebfb4;margin:8px 0 0}.hint{font-size:11px;line-height:1.6;color:#adc1b7;margin:5px 0 0}.science{padding:0}.science summary{cursor:pointer;padding:20px 22px;display:flex;justify-content:space-between;font-weight:700;font-size:12px;letter-spacing:.07em;list-style:none}.science summary::-webkit-details-marker{display:none}.science[open] summary span:last-child{transform:rotate(45deg)}.science-body{padding:0 23px 21px;color:#b9cdc2;line-height:1.65}.science-body h2{color:#eedcc2;font-size:15px;margin:20px 0 6px}.science-body p{margin:7px 0 12px}.science-body .equation{background:#22362e;color:#f4e4c6;padding:12px;font-family:ui-monospace,monospace;overflow-x:auto}.science-body li{word-break:break-word;margin-bottom:12px}.science-body ul{padding-left:18px}.science-body .educational{color:#f1d4a4;font-weight:600}.keyboard{padding:0 20px 17px;line-height:1.7;color:#829c92;font-size:11px}.hotspot-layer{position:absolute;inset:0;pointer-events:none}.hotspot{position:absolute;display:flex;align-items:center;justify-content:center;width:25px;height:25px;transform:translate(-50%,-50%);background:#f8ecce;color:#1c312a;border:2px solid #263d31;border-radius:50%;font-size:15px;font-weight:700;box-shadow:0 0 0 4px #f6e7bb44;pointer-events:auto;cursor:pointer;transition:background .2s}.hotspot:hover{background:#ffe0a1}.info-card{position:absolute;right:22px;bottom:22px;width:min(310px,calc(100% - 44px));background:#142623ef;border:1px solid #b89b68;z-index:8;padding:17px 19px;color:#e9e6d9;box-shadow:0 18px 40px #0006}.info-card h3{font-family:Georgia,serif;font-size:21px;font-weight:500;margin:8px 22px 9px 0}.info-card p{line-height:1.6;font-size:12px;color:#cadbd0}.info-close{position:absolute;right:12px;top:10px;font-size:22px;color:#e6cda4;border:0;background:transparent;cursor:pointer}.fallback{position:absolute;inset:0;background:linear-gradient(155deg,#244443,#b3c9bd);display:grid;place-items:center;text-align:center;color:#fff;padding:30px;z-index:9;font-size:15px}.fallback[hidden],.info-card[hidden]{display:none}.fallback p{max-width:420px;line-height:1.7}.fallback strong{font-size:24px;display:block}.embed-mode{height:100vh;height:100dvh;overflow:hidden}.embed-mode .shell{height:100vh;height:100dvh;min-height:0}.embed-mode .header{display:none}.embed-mode .layout{height:100%;min-height:0}.embed-mode .side{max-height:100dvh}.embed-mode .stage{min-height:120px}@media(max-width:1000px){.layout{grid-template-columns:minmax(0,1fr) 310px}.stage-help{display:none}.head-actions .quiet{padding:8px}}@media(max-width:700px){.header{padding:13px 13px;display:block}.identity p{display:none}.logotype{font-size:21px}.logotype span{font-size:12px}.head-actions{margin-top:12px}.head-actions button{font-size:11px;flex:1;padding:9px 5px}.layout{display:flex;flex-direction:column}.stage-wrap{flex:none}.stage-top{padding:7px 15px;min-height:30px}.stage{min-height:0;height:clamp(285px,49dvh,530px);flex:none}.camera-bar{padding:7px 4px;gap:4px}.camera{font-size:10px;padding:8px 7px}.attribution{font-size:10px;padding:6px}.side{overflow:visible;max-height:none;border-left:0}.pane{padding:17px}.intro h1{font-size:24px}.intro p{max-width:520px}.info-card{bottom:10px;right:10px;width:min(260px,calc(100% - 20px));padding:12px}.info-card h3{font-size:17px}.info-card p{font-size:11px}.hotspot{width:21px;height:21px}.embed-mode .layout{display:flex}.embed-mode .stage-wrap{flex:1;min-height:0}.embed-mode .stage{flex:1;height:auto;min-height:100px}.embed-mode .side{overflow:auto;max-height:225px;flex:none;min-height:0}.embed-mode .intro,.embed-mode .alternate,.embed-mode .science,.embed-mode .keyboard{display:none}.embed-mode .controls{padding:8px 14px}.embed-mode .section-title{margin-bottom:5px}.embed-mode .control-line{margin:5px 0 3px}.embed-mode .readout-grid{grid-template-columns:repeat(4,1fr);gap:3px;margin-top:6px}.embed-mode .readout{padding:5px}.embed-mode .readout strong{font-size:15px}.embed-mode .readout span{font-size:7px;min-height:22px}.embed-mode .check{display:none}.embed-mode .camera-bar{padding:3px}.embed-mode .attribution{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

@media(max-width:700px){.stage-wrap>.info-card{position:relative;right:auto;bottom:auto;width:100%;max-width:none;box-shadow:none;border-width:1px 0;padding:10px 15px}.stage-wrap>.info-card p{margin:4px 0}.stage-wrap>.info-card h3{margin:5px 22px 6px 0}}
