:root{--font-display: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;--font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: ui-monospace, "SF Mono", Menlo, "Cascadia Code", "Roboto Mono", monospace;--t-xs: .72rem;--t-sm: .82rem;--t-base: 1rem;--t-md: 1.18rem;--t-lg: 1.5rem;--t-xl: 1.95rem;--t-2xl: 2.6rem;--t-3xl: 3.4rem;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-5: 24px;--s-6: 32px;--s-7: 48px;--s-8: 64px;--r-sm: 7px;--r-md: 12px;--r-lg: 18px;--r-xl: 26px;--r-pill: 999px;--warm: #e23b3b;--cool: #3b6fe2;--contested: #8b3be2;--c1: var(--warm);--c2: color-mix(in oklch, var(--warm), var(--contested));--c3: var(--contested);--c4: color-mix(in oklch, var(--contested), var(--cool));--c5: var(--cool);--chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}:root{--bg: oklch(.17 .018 64);--bg-2: oklch(.2 .02 62);--surface: oklch(.22 .018 62);--raised: oklch(.26 .02 60);--line: oklch(.34 .018 60);--line-soft: oklch(.3 .015 60 / .6);--ink: oklch(.95 .012 82);--muted: oklch(.74 .02 72);--faint: oklch(.56 .018 68);--accent: oklch(.8 .135 72);--accent-ink: oklch(.2 .04 60);--sh-1: 0 1px 2px oklch(0 0 0 / .4), 0 0 0 1px oklch(1 0 0 / .025) inset;--sh-2: 0 18px 44px -22px oklch(0 0 0 / .7), 0 2px 0 oklch(1 0 0 / .04) inset;--glow: 0 0 0 1px oklch(.8 .135 72 / .4), 0 6px 22px -6px oklch(.8 .135 72 / .45);--board-frame: oklch(.3 .02 58);--bg-top: var(--bg-2);--panel: var(--surface);--text: var(--ink);--fill: oklch(1 0 0 / .06);--fill-strong: oklch(1 0 0 / .14);--input-bg: var(--bg-2);color-scheme:dark}html.theme-light{--bg: oklch(.965 .012 86);--bg-2: oklch(.985 .01 88);--surface: oklch(.995 .006 90);--raised: oklch(1 0 0);--line: oklch(.86 .015 80);--line-soft: oklch(.88 .012 80 / .8);--ink: oklch(.27 .022 62);--muted: oklch(.46 .02 66);--faint: oklch(.62 .018 70);--accent: oklch(.62 .145 64);--accent-ink: oklch(.99 .01 88);--sh-1: 0 1px 2px oklch(.4 .03 60 / .1), 0 0 0 1px oklch(.4 .03 60 / .05);--sh-2: 0 18px 40px -24px oklch(.4 .06 60 / .32), 0 1px 0 oklch(1 0 0 / .6) inset;--glow: 0 0 0 1px oklch(.62 .145 64 / .35), 0 6px 20px -8px oklch(.62 .145 64 / .4);--board-frame: oklch(.74 .03 68);--fill: oklch(0 0 0 / .05);--fill-strong: oklch(0 0 0 / .12);color-scheme:light}*{box-sizing:border-box}body{margin:0;font-family:var(--font-body);background:radial-gradient(120% 80% at 18% -10%,oklch(.78 .16 56 / .07),transparent 60%),radial-gradient(120% 80% at 88% -6%,oklch(.74 .13 226 / .06),transparent 60%),var(--bg);color:var(--ink);font-size:clamp(15px,.6vw + 13px,17px);line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden;transition:background .5s ease,color .4s ease}button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}select,input{font:inherit;color:inherit}::selection{background:#f3ae514d}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-sm)}#app{max-width:880px;margin:0 auto;padding:clamp(20px,3vw,44px) clamp(14px,3vw,32px) 64px;display:flex;flex-direction:column;gap:var(--s-5);align-items:stretch}.app-header{display:flex;flex-direction:column;gap:2px}.wordmark{font-family:var(--font-display);font-size:clamp(2rem,6vw,3.2rem);font-weight:400;letter-spacing:-.02em;line-height:.95;display:flex;align-items:baseline;gap:.06em}.wordmark .syn{background:linear-gradient(96deg,var(--warm),var(--contested) 54%,var(--cool));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;filter:drop-shadow(0 3px 18px oklch(.6 .18 320 / .18))}.wordmark .sixtyfour{font-family:var(--font-mono);font-size:.4em;font-weight:600;color:var(--accent);align-self:flex-start;margin-top:.12em}.tagline{font-size:var(--t-sm);color:var(--muted);margin-top:2px}.game-meta{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:var(--t-xs);color:var(--faint);margin:6px 0 0}.game-meta:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--warm);box-shadow:0 0 8px var(--warm);flex:0 0 auto}.input-host{width:100%;display:flex;flex-direction:column;gap:var(--s-2)}.input-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2);width:100%;padding:var(--s-3);background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r-lg);box-shadow:var(--sh-1)}.gallery-select{flex:1 1 220px;min-width:0;-moz-appearance:none;appearance:none;-webkit-appearance:none;padding:10px 36px 10px 14px;border-radius:var(--r-md);background-color:var(--raised);background-image:var(--chev);background-repeat:no-repeat;background-position:right 12px center;background-size:14px;border:1px solid var(--line);color:var(--ink);font-family:var(--font-display);font-size:var(--t-md);letter-spacing:-.01em;cursor:pointer;transition:border-color .16s ease}.input-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:var(--r-pill);background:var(--raised);border:1px solid var(--line);color:var(--muted);font-size:var(--t-sm);white-space:nowrap;cursor:pointer}.input-btn svg{width:15px;height:15px;display:block;color:var(--ph, var(--muted));transition:color .16s ease}.input-btn[data-act=pgn]{--ph: var(--c1)}.input-btn[data-act=link]{--ph: var(--c2)}.input-btn[data-act=flip]{--ph: var(--c3)}.input-btn[data-act=share]{--ph: var(--c4)}.input-btn[data-act=download]{--ph: var(--c5)}.input-btn:hover{color:var(--ink);border-color:color-mix(in oklch,var(--ph, var(--faint)),transparent 45%);box-shadow:0 5px 18px -10px var(--ph)}.pgn-panel{display:flex;flex-direction:column;gap:var(--s-2);width:100%}.pgn-input{width:100%;resize:vertical;background:var(--bg-2);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 12px;font-family:var(--font-mono);font-size:var(--t-sm);line-height:1.6}.pgn-input:focus,.url-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklch,var(--accent),transparent 82%)}.pgn-msg{font-size:var(--t-xs);color:var(--contested);min-height:1em}.import-row{display:flex;gap:var(--s-2);width:100%}.url-input{flex:1;background:var(--bg-2);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 14px;font-family:var(--font-mono);font-size:var(--t-sm)}.board-row{display:flex;align-items:stretch;justify-content:center;gap:clamp(8px,1.4vw,14px)}.evalwrap{display:flex;flex-direction:column;align-items:center;gap:6px;flex:0 0 auto}.evalnum{font-family:var(--font-mono);font-size:10px;color:var(--faint);min-width:36px;text-align:center;font-variant-numeric:tabular-nums}.evaltrack{position:relative;width:clamp(11px,1.6vw,15px);flex:1 1 auto;border-radius:var(--r-pill);background:linear-gradient(#2b2b33,#15151a);border:1px solid var(--line);overflow:hidden;box-shadow:var(--sh-1)}.evalfill{position:absolute;left:0;right:0;bottom:0;height:50%;background:linear-gradient(#f4f4ef,#cfcfca);transition:height .4s cubic-bezier(.4,0,.2,1)}.evalmid{position:absolute;left:-1px;right:-1px;top:50%;height:1px;background:var(--accent);opacity:.5}.board-host{width:min(82vw,620px);aspect-ratio:1 / 1;position:relative;padding:clamp(6px,1.1vw,12px);border-radius:var(--r-lg);background:linear-gradient(150deg,var(--board-frame),var(--surface));box-shadow:var(--sh-2)}.board-host:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--r-lg);box-shadow:0 0 0 1px #ffffff0d inset;pointer-events:none}.board-svg{width:100%;height:100%;display:block;border-radius:var(--r-md);overflow:hidden}.board-svg.flipped{transform:rotate(180deg)}.board-svg.flipped .piece,.board-svg.flipped .piece-img{transform:rotate(180deg);transform-box:fill-box;transform-origin:center}.square-layer rect.light{fill:var(--sq-light, #ead0b0)}.square-layer rect.dark{fill:var(--sq-dark, #9d7b53)}.heat-layer rect{transition:fill .14s linear,fill-opacity .14s linear}.trail-layer path,.trail-layer circle,.trail-active,.ripple-layer circle{stroke-linecap:round;pointer-events:none}.square-layer,.heat-layer{transition:opacity .9s ease}.board-svg.poster .heat-layer{opacity:.18}.board-svg.poster .square-layer{opacity:.82}.board-svg.hide-heatmap .heat-layer,.board-svg.hide-trails .trail-layer,.board-svg.hide-trails .trail-active,.board-svg.hide-ripples .ripple-layer{display:none}.piece{font-family:Segoe UI Symbol,Apple Symbols,Noto Sans Symbols2,sans-serif;paint-order:stroke;pointer-events:none;-webkit-user-select:none;user-select:none}.piece-img{pointer-events:none}.piece.w{fill:var(--pc-w-fill, #f7f7f2);stroke:var(--pc-w-stroke, #2a2a2a);stroke-width:.028}.piece.b{fill:var(--pc-b-fill, #1b1b1b);stroke:var(--pc-b-stroke, #d2d2d2);stroke-width:.02}.result{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1em;pointer-events:none;text-align:center;opacity:0}.result.show{animation:result-in 1.6s cubic-bezier(.2,.8,.2,1) forwards}.result-score{font-family:var(--font-display);font-size:clamp(3rem,14vw,7rem);font-weight:700;line-height:1;color:#fff;letter-spacing:1px;text-shadow:0 2px 22px rgba(0,0,0,.75)}.result-label{font-size:clamp(.85rem,3.4vw,1.35rem);font-weight:600;color:#fff;opacity:.85;text-transform:uppercase;letter-spacing:2px;text-shadow:0 2px 14px rgba(0,0,0,.75)}@keyframes result-in{0%{opacity:0;transform:scale(.7)}18%{opacity:1;transform:scale(1.04)}32%{transform:scale(1)}80%{opacity:1}to{opacity:.82;transform:scale(1)}}.intro{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--r-lg);pointer-events:none;opacity:0;background:radial-gradient(circle at 32% 30%,var(--warm),transparent 58%),radial-gradient(circle at 70% 66%,var(--cool),transparent 58%),radial-gradient(circle at 50% 50%,var(--contested),transparent 66%);animation:intro-spill 1.4s ease-out forwards}@keyframes intro-spill{0%{opacity:0;transform:scale(.25);filter:blur(10px)}35%{opacity:.95;transform:scale(1);filter:blur(3px)}70%{opacity:.8;filter:blur(1px)}to{opacity:0;transform:scale(1.06);filter:blur(0)}}.controls-host{width:100%;display:flex;flex-direction:column;gap:var(--s-4);padding:var(--s-4);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line-soft);box-shadow:var(--sh-1)}.transport{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap}.play-btn{flex:none;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(160deg,var(--accent),color-mix(in oklch,var(--accent),black 12%));color:var(--accent-ink);box-shadow:var(--glow)}.play-btn svg{width:22px;height:22px;display:block}.play-btn .ic-pause,.play-btn.playing .ic-play{display:none}.play-btn.playing .ic-pause{display:block}.step-btn{flex:none;width:40px;height:40px;border-radius:var(--r-md);display:grid;place-items:center;background:var(--raised);color:var(--ink);box-shadow:var(--sh-1)}.step-btn svg{width:18px;height:18px;display:block}.scrubber{flex:1 1 200px;min-width:120px;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:8px;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--accent) var(--prog, 0%),var(--line) var(--prog, 0%));cursor:pointer}.scrubber::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);border:2px solid var(--raised);box-shadow:0 0 0 4px color-mix(in oklch,var(--accent),transparent 80%),var(--sh-1)}.scrubber::-moz-range-thumb{width:18px;height:18px;border:2px solid var(--raised);border-radius:50%;background:var(--accent)}.readout{flex:none;min-width:56px;text-align:right;white-space:nowrap;font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--t-sm);color:var(--muted)}.readout b{color:var(--ink);font-weight:600}.seg{display:inline-flex;flex:0 0 auto;gap:2px;padding:3px;border-radius:var(--r-pill);background:var(--bg-2);border:1px solid var(--line)}.seg button{padding:6px 11px;border-radius:var(--r-pill);font-family:var(--font-mono);font-size:var(--t-xs);color:var(--muted);transition:background .14s ease,color .14s ease}.seg button:hover{color:var(--ink)}.seg button[aria-pressed=true]{background:var(--raised);color:var(--ink);box-shadow:var(--sh-1)}.layer-toggles{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center}.layer-toggles:before{content:"Layers";font-family:var(--font-mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-right:2px}.layer-toggle{display:inline-flex;align-items:center;gap:7px;padding:7px 13px 7px 11px;border-radius:var(--r-pill);background:var(--bg-2);border:1px solid var(--line);color:var(--muted);font-size:var(--t-sm);cursor:pointer}.layer-toggle:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--faint);transition:background .2s ease,box-shadow .2s ease}.layer-toggle:hover{color:var(--ink)}.layer-toggle.on{color:var(--ink);border-color:transparent;background:var(--raised);box-shadow:var(--sh-1)}.layer-toggle.on:before{background:var(--led, var(--accent));box-shadow:0 0 9px var(--led, var(--accent))}.layer-toggle[data-layer=heatmap]{--led: var(--warm)}.layer-toggle[data-layer=trails]{--led: var(--cool)}.layer-toggle[data-layer=ripples]{--led: var(--accent)}.layer-toggle[data-layer=poster],.layer-toggle[data-layer=tension]{--led: var(--contested)}.layer-toggle[data-layer=eval]{--led: var(--ink)}.layer-toggle[data-layer=rich]{--led: var(--warm)}.preset-row{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:flex-end}.preset{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0;font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}.preset-select{-moz-appearance:none;appearance:none;-webkit-appearance:none;text-transform:none;letter-spacing:normal;padding:9px 32px 9px 12px;border-radius:var(--r-md);background-color:var(--raised);background-image:var(--chev);background-repeat:no-repeat;background-position:right 11px center;background-size:14px;border:1px solid var(--line);color:var(--ink);font-family:var(--font-body);font-size:var(--t-sm);cursor:pointer;min-width:124px}.preset.vol{flex:1 1 160px}.vol-row{display:flex;align-items:center;gap:8px;width:100%}.vol-icon{display:grid;place-items:center;color:var(--muted);flex:0 0 auto}.vol-icon svg{width:16px;height:16px;display:block}.vol-slider{flex:1 1 auto;min-width:80px;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:6px;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--accent) var(--vprog, 50%),var(--line) var(--vprog, 50%));cursor:pointer}.vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:var(--accent);border:2px solid var(--raised);box-shadow:var(--sh-1)}.vol-slider::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--accent);border:2px solid var(--raised)}.dd{position:relative}.preset .dd{width:100%}.dd--game{flex:1 1 220px;min-width:0}.dd-trigger{display:flex;align-items:center;gap:8px;width:100%;min-width:124px;padding:9px 12px;border-radius:var(--r-md);background:var(--raised);border:1px solid var(--line);color:var(--ink);font-family:var(--font-body);font-size:var(--t-sm);cursor:pointer}.dd-trigger:hover,.dd-open .dd-trigger{border-color:var(--accent)}.dd--game .dd-trigger{font-family:var(--font-display);font-size:var(--t-md);letter-spacing:-.01em;padding:10px 14px}.dd-value{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.dd-value.dd-placeholder{color:var(--muted)}.dd-chev{flex:0 0 auto;display:grid;place-items:center;color:var(--muted);transition:transform .18s ease}.dd-chev svg{width:14px;height:14px;display:block}.dd-open .dd-chev{transform:rotate(180deg)}.dd-menu{position:fixed;z-index:90;min-width:140px;max-height:52vh;overflow-y:auto;padding:5px;border-radius:var(--r-md);background:var(--raised);border:1px solid var(--line);box-shadow:var(--sh-2);-webkit-overflow-scrolling:touch}.dd-option{display:block;width:100%;text-align:left;padding:9px 12px;border-radius:var(--r-sm);color:var(--ink);font-size:var(--t-sm);white-space:nowrap;transition:background .12s ease}.dd-option:hover{background:var(--bg-2)}.dd-option.selected{color:var(--accent)}.dd-option.selected:after{content:"✓";float:right;margin-left:16px}.preset-select:hover,.speed-select:hover,.gallery-select:hover{border-color:var(--accent)}.scorewrap{width:100%}.scorehead{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-2)}.scorehead h2{font-family:var(--font-display);font-weight:400;font-size:var(--t-md);margin:0;letter-spacing:-.01em}.scorehead .hint{font-family:var(--font-mono);font-size:var(--t-xs);color:var(--faint)}.note-list{position:relative;display:flex;gap:7px;overflow-x:auto;width:100%;min-height:56px;padding:6px 2px 12px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.note-list::-webkit-scrollbar{height:7px}.note-list::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px}.note-token{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:52px;padding:8px 9px;border:1px solid var(--line-soft);border-radius:var(--r-md);background:var(--surface);color:inherit;font:inherit;cursor:pointer;opacity:.55;transition:opacity .2s ease,transform .2s ease,box-shadow .2s ease,background .2s ease}.note-token:hover{opacity:1;border-color:var(--faint)}.note-token .nt-note{font-family:var(--font-mono);font-size:var(--t-sm);font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.note-token .nt-san{font-family:var(--font-mono);font-size:var(--t-xs);color:var(--muted);white-space:nowrap}.note-token.w{border-bottom:2px solid color-mix(in oklch,var(--warm),transparent 45%)}.note-token.b{border-bottom:2px solid color-mix(in oklch,var(--cool),transparent 45%)}.note-token.w .nt-note{color:color-mix(in oklch,var(--warm),white 22%)}.note-token.b .nt-note{color:color-mix(in oklch,var(--cool),white 28%)}.note-token.current{opacity:1;background:var(--raised);box-shadow:var(--glow);transform:translateY(-2px)}.note-token.current .nt-san{color:var(--ink)}.footgrid{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--s-5);align-items:start}.legend{display:flex;flex-direction:column;gap:9px;padding:var(--s-4);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line-soft);font-size:var(--t-sm);color:var(--muted)}.legend:before{content:"Reach heatmap";font-family:var(--font-mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}.legend-item{display:flex;align-items:center;gap:10px}.swatch{width:22px;height:14px;border-radius:5px;display:inline-block;flex:0 0 auto;box-shadow:var(--sh-1)}.swatch.warm{background:var(--warm)}.swatch.cool{background:var(--cool)}.swatch.contested{background:var(--contested)}.explainer{padding:var(--s-4);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line-soft);font-size:var(--t-sm);color:var(--muted)}.explainer summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:var(--t-md);color:var(--ink)}.explainer summary::-webkit-details-marker{display:none}.explainer summary:before{content:"+";width:26px;height:26px;flex:0 0 auto;display:grid;place-items:center;border-radius:var(--r-sm);background:var(--bg-2);color:var(--muted);font-family:var(--font-body);font-size:1.1rem;transition:transform .25s ease,color .25s ease}.explainer[open] summary:before{transform:rotate(45deg);color:var(--accent)}.explainer p{margin:var(--s-3) 0 0;line-height:1.6}.explainer strong{color:var(--ink);font-weight:600}.explainer ul{margin:var(--s-2) 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}.explainer li{line-height:1.5;padding-left:14px;position:relative}.explainer li:before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--accent)}.explainer li b{color:var(--ink);font-weight:600}.promo{margin:var(--s-2) 0 0;font-family:var(--font-mono);font-size:var(--t-xs);color:var(--faint);letter-spacing:.2px;transition:color .16s ease}.promo:hover{color:var(--muted)}.promo-link{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent}.promo-link:hover{border-bottom-color:currentColor}.theme-toggle{position:fixed;top:14px;right:14px;z-index:20;width:38px;height:38px;border-radius:var(--r-md);display:grid;place-items:center;background:var(--surface);border:1px solid var(--line-soft);color:var(--muted);font-size:1rem;line-height:1;cursor:pointer;box-shadow:var(--sh-1);transition:color .18s ease,background .18s ease,transform .18s ease}.theme-toggle:hover{color:var(--ink);background:var(--raised);transform:translateY(-1px)}.play-btn,.step-btn,.input-btn,.layer-toggle,.iconbtn{transition:background .16s ease,transform .16s ease,color .16s ease,box-shadow .18s ease,border-color .16s ease,opacity .16s ease}.play-btn:hover,.step-btn:hover,.input-btn:hover{transform:translateY(-1px)}.play-btn:hover{box-shadow:0 0 0 1px #f3ae5180,0 10px 28px -6px #f3ae518c}.play-btn:active,.step-btn:active,.input-btn:active,.layer-toggle:active{transform:translateY(0) scale(.96)}#prevBtn:hover{color:var(--c1)}#nextBtn:hover{color:var(--c5)}@media (max-width: 740px){.footgrid{grid-template-columns:1fr;gap:var(--s-4)}.board-host{width:min(88vw,620px)}.transport{justify-content:center}.scrubber{flex:1 1 100%;order:4;min-width:0}.readout{order:5}.speed-select{order:6}.preset{flex:1 1 42%}.preset-select{width:100%;min-width:0}.preset.vol{flex:1 1 100%}}@media (max-width: 480px){#app{padding:16px 12px 40px;gap:var(--s-4)}.controls-host{padding:var(--s-3);gap:var(--s-3)}.wordmark{font-size:clamp(1.8rem,9vw,2.4rem)}.gallery-select{flex:1 1 100%;font-size:var(--t-base)}.input-btn{padding:9px 12px}.play-btn{width:46px;height:46px}.step-btn{width:38px;height:38px}.preset{flex:1 1 100%}.scorehead .hint{display:none}.note-token{min-width:48px}.theme-toggle{top:8px;right:8px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.result.show{animation:none;opacity:.85}.intro{display:none}.square-layer,.heat-layer,.trail-layer,.evalfill{transition:none}}