/* style.css — base primitives only (Fable pass, 2026-09-20). Reset, the world canvas, and the JS-driven decode / orb-nav
 * cells. All presentation lives in after-hours.css. */
*{box-sizing:border-box}body{margin:0;background:#0b141e;color:#f1eade;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:disabled{opacity:.45;cursor:default}a{color:inherit;text-decoration:none}
#world,.scrim{position:fixed;inset:0}#world{background:radial-gradient(ellipse at 70% 35%,#48667c,#172335 65%,#080c13)}canvas{display:block;width:100%;height:100%}.scrim{pointer-events:none}
dialog{max-width:100vw;max-height:100vh}[hidden]{display:none!important}
/* Decode: .decode-text is the real sentence (a11y + resting visual); .decode-visual is the aria-hidden glyph overlay, painted only while decoding. */
[data-decode-text]{position:relative}[data-button-decode]{display:inline-block;white-space:nowrap}
/* The overlay's per-letter cells lose kerning, so they run a few % wider than the real line; nowrap keeps the scramble on the real line box instead of wrapping into the copy below. */
.decode-visual{display:none}[data-decoding]>.decode-visual{display:block;position:absolute;inset:0;pointer-events:none;white-space:nowrap}
[data-decoding]>.decode-text,[data-decoding]>.decode-text *{color:transparent!important;text-shadow:none!important}
.decode-word{display:inline-block;white-space:nowrap}.decode-gap{display:inline-block}.decode-gap::before{content:'\a0'}
.decode-char{display:inline-block;position:relative}.decode-char::before{content:attr(data-c)}.decode-char:not([data-locked])::before{visibility:hidden}
.decode-char:not([data-locked])::after{content:attr(data-g);position:absolute;inset:0;text-align:center;overflow:hidden;font-family:ui-monospace,SFMono-Regular,monospace;font-style:normal;color:#91b9c5}
#intro h1,#scene-caption{white-space:pre-line}
#orb-nav{position:fixed;inset:0;z-index:2;pointer-events:none}#orb-nav button{position:absolute;left:0;top:0;pointer-events:auto;padding:8px 10px;min-height:40px;font-size:12px;line-height:1.35;white-space:nowrap;text-shadow:0 1px 9px #000,0 2px 18px #000;color:#dcebea}#orb-nav button:hover,#orb-nav button:focus-visible{color:#fff}#orb-nav button::after{content:'Explore ↗';display:block;font-size:8px;letter-spacing:1px;color:#88a9b7;margin-top:3px}
/* Cells are pinned absolutely onto the real letters (text-decode.mjs placeCells); the visual line is their origin. */
[data-decoding]>.decode-visual .decode-line{position:relative}