:root{--bg: #000;--fg: #e8e8e8;--muted: #aaa;--panel: #161616;--border: #2a2a2a;--panel-border: #444;--accent: #7ab8ff;--warm: #cc9690;--hover: #555;--danger: #f88;--tile: #111;--pad-grid: rgba(255, 255, 255, .14);--pad-grid-center: rgba(255, 255, 255, .32);--preview-bg: #111;--preview-bg-live: #000;--preview-axis: #8a8a8a;--pivot: #fff;--th1: #f37b7b;--th2: #72a2f6;--pie-track: rgba(255, 255, 255, .08);--pie-zero: rgba(255, 255, 255, .55);--zoom-frame: #ffe600;--link: #e24b4b;--shadow: #000;--axis-outline: rgba(0, 0, 0, .92);--figure-outline: #000;--reticle-outline: rgba(0, 0, 0, .92);--reticle-core: rgba(255, 255, 255, .96);--pivot-outline: rgba(0, 0, 0, .75);--lesson-ring-1: rgba(243, 123, 123, .28);--lesson-ring-2: rgba(114, 162, 246, .34);--lesson-neighbor: #777;--overlay: rgba(0, 0, 0, .7);--swatch-border: rgba(255, 255, 255, .45);--slider-track: #3a3a3a;--slider-fill: #8d8d8d;--slider-thumb: #9a9a9a;--map-void-text: #f4f4f4;--track-h: 4px;--thumb: 14px;--ctrl-size: 36px;--ctrl-radius: 8px;--ctrl-gap: 10px;--ctrl-inset: 12px;--burger-bar: 18px;--burger-gap: 5px}*{box-sizing:border-box}input,textarea,select{user-select:auto;-webkit-user-select:auto}html,body{margin:0;overflow:hidden;background-color:var(--bg);color:var(--fg);font-family:Rubik,sans-serif;touch-action:none;overscroll-behavior:none;position:fixed;inset:0;width:100%;height:100%;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}body.is-chrome-hidden [data-viewer-ui],body.is-chrome-hidden #map-scale-x,body.is-chrome-hidden #map-scale-y,body.is-chrome-hidden #map-axes{visibility:hidden!important;pointer-events:none!important}body.is-menu-hud-hidden #map-hud{visibility:hidden;pointer-events:none}#stage{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center}#sidebar{position:absolute;top:max(var(--ctrl-inset),env(safe-area-inset-top));left:max(var(--ctrl-inset),env(safe-area-inset-left));z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:var(--ctrl-gap)}#zoom-bar{display:flex;flex-direction:column;align-items:stretch;gap:var(--ctrl-gap)}#zoom-bar button{appearance:none;width:var(--ctrl-size);height:var(--ctrl-size);padding:0;border:1px solid var(--border);border-radius:var(--ctrl-radius);background:var(--panel);color:var(--fg);font:inherit;font-size:20px;line-height:1;cursor:pointer}#zoom-bar button:hover:not(:disabled){border-color:var(--hover)}#zoom-bar button:disabled{opacity:.35;cursor:default}#zoom-bar button svg{display:block;width:18px;height:18px;margin:0 auto}#zoom-reset{margin-top:0}#map-axes,#probe-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}#probe-overlay{transform:translateZ(0)}#probe-overlay{z-index:3}#map-scale-x,#map-scale-y{position:absolute;inset:0;pointer-events:none;z-index:4;font:11px Rubik,sans-serif;font-variant-numeric:tabular-nums;-webkit-text-stroke:2px var(--shadow);paint-order:stroke fill}#map-scale-x span,#map-scale-y span{opacity:.5}#map-scale-x span{position:absolute;bottom:8px;color:var(--th1);transform:translate(-50%);white-space:nowrap}#map-scale-x span.probe-mark{bottom:14px}#map-scale-x span.probe-mark-left{transform:translate(-100%) translate(-5px)}#map-scale-x span.probe-mark-right{transform:translate(5px)}#map-scale-x span.probe-delta{bottom:26px;color:var(--th1);font-size:11px}#map-scale-y span{position:absolute;right:8px;color:var(--th2);transform:translateY(-50%);white-space:nowrap}#map-scale-y span.probe-mark{right:14px}#map-scale-y span.probe-mark-top{transform:translateY(-100%) translateY(-4px)}#map-scale-y span.probe-mark-bottom{transform:translateY(4px)}#map-clip{position:relative;width:100%;height:100%;overflow:hidden;background:var(--bg);cursor:default;touch-action:none}#map-shift{position:relative;z-index:1;width:100%;height:100%;transform-origin:center center;will-change:transform}#map-void{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:hidden;opacity:0;background:#000}#map-void text{fill:var(--map-void-text);font-family:"Press Start 2P",monospace;text-anchor:middle}canvas.map-view{position:relative;z-index:1;display:block;width:100%;height:100%;cursor:default;touch-action:none;image-rendering:pixelated}canvas.map-view.map-pending{position:absolute;left:100%;top:0;width:100%;height:100%}#ui-container{--pad-legend: 1.2em;--pad-legend-gap: 8px;display:none;position:absolute;top:calc(max(var(--ctrl-inset),env(safe-area-inset-top)) + var(--ctrl-size) + var(--ctrl-gap));right:max(10px,env(safe-area-inset-right));background:var(--overlay);padding:15px;border-radius:8px;border:1px solid var(--panel-border);-webkit-user-select:none;user-select:none;width:min(280px,calc(100vw - 20px));max-height:calc(100dvh - max(var(--ctrl-inset),env(safe-area-inset-top)) - var(--ctrl-size) - var(--ctrl-gap) - max(12px,env(safe-area-inset-bottom)) - var(--ctrl-size) - 8px);overflow-y:auto;z-index:4;touch-action:auto}#ui-container.is-open{display:block}.control-group{margin-bottom:10px}#ui-container label.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px}.slider-label{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;font-size:12px;color:var(--muted)}.slider-label[hidden]{display:none}.slider-label .row{display:flex;justify-content:space-between;gap:8px}.slider-label.choice-label .row{align-items:center}.slider-label.choice-label select{min-width:120px;max-width:65%;height:32px;margin:0;padding:0 8px;border:1px solid var(--border);border-radius:6px;background:var(--panel);color:var(--fg);font:inherit;font-size:13px;cursor:pointer}.slider-label input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:max(18px,var(--thumb));margin:0;background:transparent;cursor:pointer}.slider-label input[type=range]::-webkit-slider-runnable-track{height:var(--track-h);border:0;border-radius:99px;background:linear-gradient(to right,var(--slider-fill) 0 var(--fill, 0%),var(--slider-track) var(--fill, 0%) 100%)}.slider-label input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:var(--thumb);height:var(--thumb);margin-top:calc((var(--track-h) - var(--thumb)) / 2);border:0;border-radius:50%;background:var(--slider-thumb)}.slider-label input[type=range]::-moz-range-track{height:var(--track-h);border:0;border-radius:99px;background:var(--slider-track)}.slider-label input[type=range]::-moz-range-progress{height:var(--track-h);border:0;border-radius:99px;background:var(--slider-fill)}.slider-label input[type=range]::-moz-range-thumb{width:var(--thumb);height:var(--thumb);border:0;border-radius:50%;background:var(--slider-thumb)}.slider-label[data-tone=th1]{color:var(--th1);--slider-fill: var(--th1);--slider-thumb: var(--th1)}.slider-label[data-tone=th2]{color:var(--th2);--slider-fill: var(--th2);--slider-thumb: var(--th2)}.slider-label[data-scaled-thumb] input[type=range]{height:max(32px,var(--thumb))}.slider-label[data-scaled-thumb] input[type=range]::-webkit-slider-runnable-track{background:var(--slider-track)}.slider-label[data-scaled-thumb] input[type=range]::-moz-range-progress{background:var(--slider-track)}.segment-pads{display:flex;flex-direction:column;gap:16px;margin-bottom:20px}.segment-pad{display:grid;grid-template-columns:minmax(0,1fr) var(--pad-legend);column-gap:var(--pad-legend-gap);row-gap:6px;font-size:12px}.segment-pad[data-tone=th1]{color:var(--th1)}.segment-pad[data-tone=th2]{color:var(--th2)}.segment-pad-frame{grid-column:1;grid-row:1;position:relative;width:100%;aspect-ratio:1}.segment-pad-y{grid-column:2;grid-row:1;align-self:center;justify-self:center;writing-mode:vertical-rl;letter-spacing:.04em}.segment-pad-plot{position:absolute;inset:0;display:block;width:100%;height:100%;cursor:crosshair;touch-action:none;border:1px solid var(--panel-border);border-radius:6px;background:var(--tile);overflow:hidden}.segment-pad-plot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.segment-pad-x{grid-column:1;grid-row:2;text-align:center;letter-spacing:.04em}#resetParams,#map-extras,#ui-container .hint,#ui-container .learn-more{width:calc(100% - var(--pad-legend) - var(--pad-legend-gap))}#map-extras{margin-top:0;padding-top:0}#map-extras .slider-label{--slider-fill: #fff;--slider-thumb: #fff}#map-params-more:empty{display:none}.hint{font-size:12px;color:var(--muted);line-height:1.5;white-space:pre-line}.hint.is-mobile{display:none}.learn-more{display:inline-block;margin-top:12px;font-size:13px;color:var(--accent);text-decoration:none}.learn-more:hover{text-decoration:underline}.text-button{appearance:none;width:100%;margin:0 0 12px;padding:8px 10px;border:1px solid var(--border);border-radius:6px;background:var(--panel);color:var(--fg);cursor:pointer;font:inherit;font-size:13px}.text-button:hover{border-color:var(--hover)}.text-button.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:8px}.text-button.icon-button svg{display:block;width:16px;height:16px;flex:none}#map-hud{position:absolute;top:calc(max(var(--ctrl-inset),env(safe-area-inset-top)) + var(--ctrl-size) + var(--ctrl-gap));left:50%;z-index:5;display:flex;align-items:center;justify-content:center;gap:var(--ctrl-gap);width:auto;margin:0 auto;padding:0;transform:translate(-50%);border:0;background:transparent;pointer-events:auto;touch-action:auto}#probe-count{display:none;flex:1 1 200px;min-width:0;height:36px;outline:none;cursor:pointer;touch-action:none}#probe-count-track{position:relative;height:36px;margin:0 14px}#probe-count-track:before{content:"";position:absolute;left:0;right:0;top:8px;height:4px;border-radius:99px;background:var(--slider-track, #333)}#probe-count-fill{position:absolute;left:0;top:8px;height:4px;border-radius:99px;background:#fff;pointer-events:none}#probe-count-ticks{position:absolute;inset:0;pointer-events:none}.probe-count-tick{position:absolute;top:0;width:16px;height:36px;margin:0;padding:0;color:var(--muted);transform:translate(-50%);pointer-events:none;font:11px/1 Rubik,sans-serif;font-variant-numeric:tabular-nums}.probe-count-tick i{position:absolute;top:6px;left:50%;width:1px;height:8px;background:var(--muted);transform:translate(-50%)}.probe-count-tick span{display:none;position:absolute;top:20px;left:50%;transform:translate(-50%);text-align:center;white-space:nowrap}.probe-count-tick.is-labeled span{display:block}.probe-count-tick.is-on{color:var(--fg)}.probe-count-tick.is-on i{background:var(--fg)}#probe-count-thumb{position:absolute;top:3px;width:14px;height:14px;border-radius:50%;background:#fff;transform:translate(-50%);pointer-events:none}#probe-start,#probe-drop{appearance:none;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;width:auto;min-width:var(--ctrl-size);height:var(--ctrl-size);padding:0 12px;border:1px solid var(--border);border-radius:var(--ctrl-radius);background:var(--panel);color:var(--fg);cursor:pointer;flex:none}#probe-start:hover:not(:disabled),#probe-drop:hover:not(:disabled){border-color:var(--hover)}#probe-start:disabled,#probe-drop:disabled{opacity:.35;cursor:default}#probe-start svg,#probe-drop svg{display:block;width:16px;height:16px}#probe-start .icon-pause,#probe-start .icon-play{display:none}#probe-start .icon-grid{display:block}#probe-start.is-lesson .icon-grid{display:none}#probe-start.is-lesson .icon-play{display:block}#probe-start.is-lesson.is-playing .icon-play{display:none}#probe-start.is-lesson.is-playing .icon-pause{display:block}#probe-drop[hidden]{display:none}.probe-start-label{display:inline;font:13px Rubik,sans-serif}#mode-switch{position:fixed;top:max(var(--ctrl-inset),env(safe-area-inset-top));left:50%;z-index:7;display:inline-flex;height:var(--ctrl-size);padding:3px;transform:translate(-50%);border:1px solid var(--border);border-radius:var(--ctrl-radius);background:var(--panel);pointer-events:auto;touch-action:auto}#mode-switch button{appearance:none;min-width:84px;height:100%;padding:0 12px;border:0;border-radius:calc(var(--ctrl-radius) - 3px);background:transparent;color:var(--muted);cursor:pointer;font:13px Rubik,sans-serif}#mode-switch button.is-active{background:var(--fg);color:var(--bg)}body.is-pendulum-mode #probe-drop{display:none}body.is-pendulum-mode #map-clip{background:#000;cursor:grab}body.is-pendulum-mode #map-clip.is-bob-dragging{cursor:grabbing}body.is-pendulum-mode #probe-overlay{display:block;opacity:1}#narration-locale{appearance:none;position:fixed;top:max(var(--ctrl-inset),env(safe-area-inset-top));right:calc(max(var(--ctrl-inset),env(safe-area-inset-right)) + var(--ctrl-size) + var(--ctrl-gap));z-index:6;height:var(--ctrl-size);padding:0 10px;border:1px solid var(--border);border-radius:var(--ctrl-radius);background:var(--panel);color:var(--fg);font:inherit;font-size:13px;cursor:pointer;pointer-events:auto;touch-action:auto}#ask-prompt{position:absolute;inset:0 auto auto 0;z-index:0;max-width:40em;margin:0;padding:12px;pointer-events:none;color:var(--fg);font:16px/1.45 Rubik,sans-serif}#ask-prompt h2{margin:1.2em 0 .4em;font-size:1.1em}#ask-prompt p{margin:0 0 .8em}#site-credit{position:absolute;right:max(10px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));z-index:5;color:#cfcfcf;font:12px Rubik,sans-serif;letter-spacing:.02em;text-decoration:none;-webkit-text-stroke:3px #000;paint-order:stroke fill;pointer-events:auto;touch-action:auto}#site-credit:hover{color:#fff}#ask-bar{position:absolute;left:max(var(--ctrl-inset),env(safe-area-inset-left));bottom:max(8px,env(safe-area-inset-bottom));z-index:5;display:flex;align-items:center;gap:8px;pointer-events:auto;touch-action:auto}#ask-chatgpt{appearance:none;display:inline-flex;align-items:center;height:var(--ctrl-size);margin:0;padding:0 12px;border:1px solid var(--border);border-radius:var(--ctrl-radius);background:var(--panel);color:var(--fg);font:inherit;font-size:13px;line-height:1;text-decoration:none;white-space:nowrap;cursor:pointer}#ask-chatgpt:hover{border-color:var(--hover)}#ask-copy{appearance:none;width:var(--ctrl-size);height:var(--ctrl-size);padding:0;border:1px solid var(--border);border-radius:var(--ctrl-radius);background:var(--panel);color:var(--fg);cursor:pointer}#ask-copy:hover{border-color:var(--hover)}#ask-copy svg{display:block;width:16px;height:16px;margin:0 auto}#ask-copy .icon-copied,#ask-copy.is-copied .icon-copy{display:none}#ask-copy.is-copied .icon-copied{display:block}#menu-toggle{display:flex;position:absolute;top:max(var(--ctrl-inset),env(safe-area-inset-top));right:max(var(--ctrl-inset),env(safe-area-inset-right));z-index:6;width:var(--ctrl-size);height:var(--ctrl-size);padding:0;border:1px solid var(--border);border-radius:var(--ctrl-radius);background:var(--panel);color:var(--fg);cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:var(--burger-gap);touch-action:auto}#menu-toggle span{display:block;position:relative;width:var(--burger-bar);height:2px;background:var(--fg);border-radius:1px;transition:transform .15s ease,opacity .15s ease}#menu-toggle span:after{content:"";position:absolute;top:50%;width:5px;height:5px;border-radius:50%;background:var(--fg);box-shadow:0 0 0 1.5px var(--panel);transform:translateY(-50%);transition:opacity .12s ease}#menu-toggle span:nth-child(1):after{left:10px}#menu-toggle span:nth-child(2):after{left:2px}#menu-toggle span:nth-child(3):after{left:8px}#menu-toggle.is-open span:nth-child(1){transform:translateY(calc(var(--burger-gap) + 2px)) rotate(45deg)}#menu-toggle.is-open span:nth-child(2){opacity:0}#menu-toggle.is-open span:nth-child(3){transform:translateY(calc(-1 * (var(--burger-gap) + 2px))) rotate(-45deg)}#menu-toggle.is-open span:after{opacity:0}.is-narrate-on{outline:2px solid var(--accent);outline-offset:3px}@media(max-width:900px),(max-height:520px){:root{--ctrl-size: 32px;--ctrl-gap: 8px;--burger-bar: 16px;--burger-gap: 4px}#mode-switch button{min-width:70px;padding:0 9px;font-size:12px}}@media(max-width:700px),(max-height:500px){:root{--ctrl-size: 28px;--ctrl-radius: 7px;--ctrl-gap: 6px;--ctrl-inset: 8px;--burger-bar: 14px;--burger-gap: 4px}#zoom-bar button{font-size:16px}#zoom-bar button svg,#ask-copy svg{width:14px;height:14px}#mode-switch button{min-width:58px;padding:0 8px;font-size:12px}#narration-locale{padding:0 8px;font-size:12px}#ui-container{padding:10px;width:min(360px,calc(100vw - 16px))}.segment-pads{flex-direction:row;align-items:flex-start;gap:10px;margin-bottom:12px}.segment-pad{flex:1 1 0;min-width:0}#resetParams{margin-bottom:8px;padding:6px 8px;font-size:12px}.slider-label{margin-bottom:8px}.hint{font-size:11px}.learn-more{margin-top:8px;font-size:12px}#resetParams,#map-extras,#ui-container .hint,#ui-container .learn-more{width:100%}#probe-start,#probe-drop{padding:0 10px;gap:6px}.probe-start-label{font-size:12px}#ask-chatgpt{padding:0 10px;font-size:12px}body:has(#ui-container.is-open) #map-hud{visibility:hidden;pointer-events:none}.hint.is-desktop{display:none}.hint.is-mobile{display:block}}@media(hover:none)and (pointer:coarse){.hint.is-desktop{display:none}.hint.is-mobile{display:block}}
