/* All ink is drawn live. The current world supplies every pigment. */
:root{--accent-ink:#20231c}
.kinetic-svg .bumper+text{fill:var(--accent-ink)}.kinetic-svg .lit text{fill:var(--paper)}
.machine-handle{cursor:grab;touch-action:none;outline:none}.machine-handle:active{cursor:grabbing}.machine-handle:focus-visible{filter:drop-shadow(0 0 4px var(--lime))}.flipper-touch{stroke:transparent;stroke-width:100;stroke-linecap:round;fill:none;pointer-events:stroke}.flipper-touch:focus-visible{stroke:var(--lime);stroke-width:36;opacity:.4}.plunger-spring{fill:none;stroke:var(--ink);stroke-width:3;stroke-linejoin:round}.plunger-ring{fill:var(--paper);stroke:var(--ink);stroke-width:4}.plunger-mark{fill:none;stroke:var(--ink);stroke-width:2}.plunger-handle:hover .plunger-ring{fill:var(--lime);stroke:var(--accent-ink)}.plunger-handle:hover .plunger-mark{stroke:var(--accent-ink)}.machine-touch-region,.crane-grab,.crane-drop{fill:transparent;stroke:none}.crane-drop:focus-visible{stroke:var(--ink);stroke-width:2;stroke-dasharray:3 8}.crane-load.machine-handle{pointer-events:bounding-box}
.kinetic-world{position:relative;isolation:isolate;padding:42px 5vw 34px;margin:28px 0;border-block:1px solid var(--ink);color:var(--ink);background:var(--paper);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:18px 5vw;overflow:hidden;scroll-margin-top:18px}
.kinetic-caption{align-self:center;min-width:0}.kinetic-kicker{font:12px/1.5 monospace;letter-spacing:.12em}.kinetic-caption h2{font-size:clamp(34px,5vw,82px);line-height:.94;letter-spacing:-.065em;margin:20px 0}.kinetic-caption p{font-size:17px;line-height:1.5;max-width:370px}.kinetic-machine{--board-ratio:.7317;grid-column:2;grid-row:1/4;min-width:0;align-self:center;max-width:min(600px,calc((100svh - 110px)*var(--board-ratio)));width:100%;margin:auto}.kinetic-svg{display:block;width:100%;height:auto;overflow:visible;touch-action:none;fill:var(--ink);font-family:Arial,sans-serif;font-weight:900}.kinetic-status{font:14px/1.55 monospace;min-height:3em;margin:0;align-self:end}.kinetic-controls{display:flex;flex-wrap:wrap;gap:10px;align-self:start}.kinetic-controls button{font:700 12px/1.3 monospace;min-width:0;min-height:48px;padding:13px 15px;flex:1 1 90px;width:auto;touch-action:none;box-shadow:3px 3px 0 var(--lime)}
.machine-grid{fill:none;stroke:var(--ink);stroke-width:.6;opacity:.13}.machine-rail{fill:none;stroke:var(--ink);stroke-width:8;stroke-linecap:round;stroke-linejoin:round}.bumper{fill:var(--lime);stroke:var(--ink);stroke-width:3}.bumper-halo{fill:none;stroke:var(--ink);stroke-width:1;stroke-dasharray:3 6;transform-box:fill-box;transform-origin:center}.lit .bumper-halo{stroke-width:5;transform:scale(1.15);stroke:var(--lime)}.lit .bumper{fill:var(--ink)}.lit text{fill:var(--paper)}.flipper{fill:none;stroke:var(--ink);stroke-width:20;stroke-linecap:round}.pinball{fill:var(--paper);stroke:var(--ink);stroke-width:4}.ball-trail{fill:none;stroke:var(--ink);stroke-width:5;stroke-linecap:round;opacity:.25}.machine-small{font:14px monospace;letter-spacing:1px}.crane-gantry{fill:var(--lime);stroke:var(--ink);stroke-width:4;stroke-linejoin:round}.crane-cable{fill:none;stroke:var(--ink);stroke-width:2;stroke-dasharray:7 3}.crane-carriage{fill:var(--ink)}.crane-load{fill:var(--ink);paint-order:stroke;stroke:var(--paper);stroke-width:3}.foundation{fill:var(--lime);stroke:var(--ink);stroke-width:2}.stamp-target{fill:var(--paper);stroke:var(--ink);stroke-width:4}.sling-band{fill:none;stroke:var(--ink);stroke-width:4}.shattered{opacity:0;transform-box:fill-box;transform-origin:center;animation:stamp-vapor .7s both}.sling-letter{fill:var(--ink);paint-order:stroke;stroke:var(--paper);stroke-width:2}
.kinetic-world[data-kind=pinball].unfolding{animation:pinball-unfold 1s cubic-bezier(.16,1,.3,1) both}.kinetic-world[data-kind=crane].unfolding{animation:crane-hoist 1.25s cubic-bezier(.2,.8,.2,1) both}.kinetic-world[data-kind=slingshot].unfolding{animation:paper-uncrumple 1s cubic-bezier(.16,1,.3,1) both}.kinetic-world[data-kind=pinball].folding-away{animation:pinball-fold .9s ease-in both}.kinetic-world[data-kind=crane].folding-away{animation:crane-depart .9s ease-in both}.kinetic-world[data-kind=slingshot].folding-away{animation:paper-shred .9s steps(12) both}.machine-won .kinetic-machine{animation:machine-celebrate .7s ease-in-out 2}.machine-lost .kinetic-machine{filter:grayscale(1);opacity:.35;transition:opacity 1s}
.reward-pinball .ticker{box-shadow:inset 0 0 0 4px var(--ink),inset 0 0 0 8px var(--lime);text-shadow:1px 0 var(--paper),-1px 0 var(--paper)}.reward-pinball .dot{box-shadow:0 0 0 4px var(--lime),0 0 0 6px var(--ink);animation:dot-orbit 4s ease-in-out infinite}.reward-crane .spec{position:relative;padding-bottom:50px}.reward-crane .spec::after{content:'╱╲     ╱╲';font:32px monospace;position:absolute;bottom:0;left:10%;letter-spacing:16px;transform-origin:top;animation:stilts 5s ease-in-out infinite}.reward-slingshot .ticker::before{content:'APPROVED BY ABSOLUTELY NOBODY';display:block;text-align:center;font:700 12px monospace;letter-spacing:.15em;white-space:normal;margin:0 12px 12px}
.mystic-glyph-row{position:relative!important}.mystic-glyph-row>svg{position:absolute;inset:-.07em 0;overflow:visible;width:100%;height:calc(100% + .14em);pointer-events:none;display:block}.glyph-awake #headline .mystic-glyph-row{color:transparent!important;-webkit-text-stroke:0!important;text-shadow:none!important}.glyph-awake #headline .mystic-glyph-row .secret-letter{color:transparent!important;-webkit-text-stroke:0!important;text-shadow:none!important}.glyph-ink{fill:none;stroke:var(--ink);stroke-linecap:round;stroke-linejoin:round;stroke-width:7;vector-effect:non-scaling-stroke}.glyph-echo{fill:none;stroke:var(--lime);stroke-width:11;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.glyph-ornament{fill:none;stroke:var(--ink);stroke-width:1.4;vector-effect:non-scaling-stroke;opacity:.6}.glyph-ribbon .glyph-ink{stroke-width:6;stroke-dasharray:90 5;animation:ribbon-flow 4s linear infinite}.glyph-ribbon .glyph-echo{stroke-width:12;stroke-dasharray:12 50;animation:ribbon-flow 7s linear infinite reverse}.glyph-orbit .glyph-ink{stroke-width:3;stroke-dasharray:90 10;animation:ribbon-flow 9s linear infinite}.glyph-orbit .glyph-ornament{stroke-dasharray:2 8;animation:ribbon-flow 15s linear infinite}.glyph-aurora .glyph-ink{stroke-width:4;stroke-dasharray:160 6;animation:rune-glow 6s ease-in-out infinite}.glyph-aurora .glyph-echo{stroke-width:8;stroke-dasharray:2 14;animation:ribbon-flow 12s linear infinite}.glyph-unit{transform-box:fill-box;transform-origin:center;animation:letter-levitate var(--float-duration,7s) ease-in-out infinite;animation-delay:var(--glyph-delay)}
.glyph-drawing .glyph-ink{stroke-dasharray:700;animation:letter-materialize 1.9s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--glyph-delay)}.glyph-ribbon.glyph-drawing .glyph-unit{animation:letter-liquid 1.7s both;animation-delay:var(--glyph-delay)}.glyph-orbit.glyph-drawing .glyph-unit{animation:letter-orbit-in 2s both;animation-delay:var(--glyph-delay)}.glyph-aurora.glyph-drawing .glyph-unit{animation:letter-rune-in 1.6s both;animation-delay:var(--glyph-delay)}
.mystic-trails{position:fixed;inset:0;width:100%;height:100%;z-index:12;pointer-events:none;overflow:hidden}.mystic-trail{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round}.mystic-trail-echo{fill:none;stroke:var(--lime);stroke-width:7;opacity:.6}.mystic-spark{fill:var(--paper);stroke:var(--ink);stroke-width:1.5}.mystic-ring{fill:none;stroke:var(--ink);stroke-width:1;stroke-dasharray:2 6;transform-origin:center;transform-box:fill-box;animation:seal-expand 1.7s ease-out both}.mystic-note{position:relative;z-index:3;margin:0;padding:16px 5vw;font:14px/1.5 monospace;border-block:1px solid var(--ink);background:var(--lime);color:var(--accent-ink);overflow:hidden;animation:note-inscribe .8s both}.mystic-note.evaporating{animation:note-evaporate 1.1s ease-in both}.mystic-note.unspooling{animation:note-unspool 1.4s ease-in both}.mystic-note.starfall{animation:note-starfall 1s ease-in both}.mystic-note b{font-weight:900}.brand{touch-action:none}.line{position:relative;cursor:grab;touch-action:none}.line::before{content:'';position:absolute;inset:-16px -6px}.line:focus-visible{outline:2px dashed var(--ink);outline-offset:12px}
@keyframes pinball-unfold{from{clip-path:inset(49% 0);transform:scaleY(.06)}to{clip-path:inset(0);transform:none}}@keyframes crane-hoist{from{clip-path:inset(100% 0 0);transform:translateY(90px)}to{clip-path:inset(0);transform:none}}@keyframes paper-uncrumple{0%{clip-path:polygon(50% 40%,55% 48%,50% 60%,45% 50%);transform:scale(.5)}65%{transform:scale(.97)}100%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:none}}@keyframes pinball-fold{to{transform:scaleY(.03);opacity:0}}@keyframes crane-depart{to{transform:translateY(-130px);clip-path:inset(0 0 100%);opacity:0}}@keyframes paper-shred{to{clip-path:polygon(0 0,8% 100%,16% 0,24% 100%,32% 0,40% 100%,48% 0,56% 100%,64% 0,72% 100%,80% 0,88% 100%,100% 0);transform:translateY(80px);opacity:0}}@keyframes stamp-vapor{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(2.2) rotate(25deg)}}@keyframes machine-celebrate{50%{transform:rotate(-1deg) scale(1.025)}}@keyframes stilts{50%{transform:skew(-10deg)}}@keyframes dot-orbit{25%{translate:4px -5px}75%{translate:-4px 5px}}@keyframes ribbon-flow{to{stroke-dashoffset:-190}}@keyframes rune-glow{50%{stroke-width:6;stroke-dashoffset:65}}@keyframes letter-levitate{50%{transform:translateY(-2px) rotate(1.5deg)}}@keyframes letter-materialize{from{stroke-dashoffset:700}to{stroke-dashoffset:0}}@keyframes letter-liquid{from{transform:scaleY(.05) skewX(40deg);opacity:0}to{transform:none;opacity:1}}@keyframes letter-orbit-in{from{transform:rotate(180deg) scale(.1);opacity:0}to{transform:none;opacity:1}}@keyframes letter-rune-in{0%{transform:translateY(40px);opacity:0}40%{opacity:.4}60%{transform:translateY(-5px)}100%{transform:none;opacity:1}}@keyframes seal-expand{from{transform:scale(.1);opacity:1}to{transform:scale(2);opacity:0}}@keyframes note-inscribe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes note-evaporate{to{filter:blur(9px);letter-spacing:.6em;opacity:0}}@keyframes note-unspool{to{clip-path:inset(0 0 0 100%);transform:skewX(-15deg)}}@keyframes note-starfall{to{clip-path:inset(100% 0 0);transform:translateY(50px)}}
@media(max-width:650px){.kinetic-world{grid-template-columns:minmax(0,1fr);padding:24px 5vw;gap:16px;margin-inline:0}.kinetic-caption h2{font-size:clamp(30px,9vw,52px);margin:14px 0}.kinetic-caption p{font-size:15px;margin-bottom:0}.kinetic-machine{grid-column:1;grid-row:auto;max-width:390px}.kinetic-machine{max-width:min(390px,calc(450px*var(--board-ratio)))}.kinetic-status{font-size:12px;min-height:2.8em}.kinetic-controls{position:sticky;bottom:8px;z-index:2}.kinetic-controls button{padding:12px 9px;font-size:11px;flex-basis:75px}.glyph-ink{stroke-width:3.5}.glyph-echo{stroke-width:6}.glyph-ribbon .glyph-ink{stroke-width:3}.glyph-ribbon .glyph-echo{stroke-width:6}.glyph-orbit .glyph-ink{stroke-width:2}.glyph-aurora .glyph-ink{stroke-width:2.5}.glyph-aurora .glyph-echo{stroke-width:4}.mystic-note{font-size:12px}.kinetic-world:has(.kinetic-svg){overflow:clip}}
@media(prefers-reduced-motion:reduce){.glyph-unit,.glyph-ink,.glyph-echo,.glyph-ornament,.kinetic-world,.mystic-note{animation:none!important}.mystic-trails{display:none}.folding-away,.mystic-note.evaporating,.mystic-note.unspooling,.mystic-note.starfall{opacity:0}}

.kinetic-world[data-kind=crane] .kinetic-machine{--board-ratio:.9677}.kinetic-world[data-kind=slingshot] .kinetic-machine{--board-ratio:1.25}

/* Each borrowed alphabet retires before the original ink is revealed. */
.glyph-retiring .glyph-ink,.glyph-retiring .glyph-echo,.glyph-retiring .glyph-ornament{animation:none!important}
.glyph-retiring .glyph-unit{animation-delay:calc(var(--glyph-delay,0s)*.55)!important;animation-fill-mode:both!important;animation-iteration-count:1!important}
.glyph-aurora.glyph-retiring .glyph-unit{animation:letter-rune-retire 1.1s cubic-bezier(.65,0,.8,.4) both}
.glyph-ribbon.glyph-retiring .glyph-unit{animation:letter-ribbon-retire 1.3s cubic-bezier(.45,0,.75,.45) both}
.glyph-orbit.glyph-retiring .glyph-unit{animation:letter-orbit-retire 1.2s cubic-bezier(.6,-.15,.8,.5) both}
.glyph-retirement-paused .mystic-font *{animation-play-state:paused!important}
@keyframes letter-rune-retire{0%{opacity:1;transform:none}30%{transform:scale(1.05,1.02)}68%{opacity:.9;transform:skewY(-18deg) scale(.09,1.28)}100%{opacity:0;transform:translateY(-9px) scale(.001,1.7)}}
@keyframes letter-ribbon-retire{0%{opacity:1;transform:none}34%{transform:skewX(-28deg) scale(1.15,.72)}68%{opacity:1;transform:translateX(18px) skewX(42deg) scale(.2,1.12)}100%{opacity:0;transform:translateX(80px) skewX(-55deg) scale(.001,.12)}}
@keyframes letter-orbit-retire{0%{opacity:1;transform:none}28%{transform:rotate(-34deg) scale(1.08,.92)}65%{opacity:.85;transform:rotate(135deg) scale(.42)}100%{opacity:0;transform:rotate(520deg) scale(.001)}}
@media(prefers-reduced-motion:reduce){.glyph-retiring .glyph-unit{animation:none!important}}
