<!-- Equil v4.77 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.77: Light-mode win-wave tiles keep their cream background
     instead of flashing white.

     PER SAM:
     "On light mode, the win sequence of the number bank tiles
      bursting — they turn into having a white background. They should
      just keep the background color they had before the win, like how
      dark mode keeps the same look when they pop."

     CAUSE.
     The btBurst keyframe (the per-tile pop in _winWaveSequence) ramps
     filter:brightness from 1 → 2.2 over the burst. On the DARK tile
     background that reads as a tasteful glow. But the light-mode tile
     background is cream (var(--bg-secondary)); brightness(2.2) pushes
     that to near-white, so the bursting tiles flashed white.

     FIX.
     New btBurstLight keyframe — identical transform + opacity (the pop
     scale/rotate/fade) but WITHOUT the brightness ramp, so the tile
     holds its normal cream background through the burst. A
     body.light-mode .bt.bursting rule swaps to it in light mode.
     Dark mode keeps the original glow.
-->

<!-- Equil v4.76 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.76: Bank display-mode toggles (xN / mini / cyan) no longer
     snap the page to the top.

     PER SAM:
     "The buttons down below — the ones that display the number of
      tiles — that is still snapping it back up to the top. Maybe it
      has to do with how it resizes the amount of tiles down below."

     CAUSE (distinct from v4.75).
     v4.75 guarded render() and renderBank() against the innerHTML-
     rebuild scroll clamp. But the display-mode toggles do MORE than a
     plain renderBank: _toggleCondense / _toggleMini / _toggleCyan each
     change TILE_SCALE and TILE_GAP via applyPctH/applyGapPct, which
     RESIZE the bank. That resize changes the bank's height (and thus
     the page's total scrollable height) in steps that happen between
     and around the renderBank calls — outside any single renderBank's
     guarded window — so the page max-scroll shrinks and the browser
     snaps to the top. The resize can also reflow asynchronously on a
     later frame, after the synchronous restore would have run.

     FIX.
     Wrap each toggle's ENTIRE body in a scroll capture/restore, and
     restore not just synchronously but again on the next two animation
     frames (double-rAF) to catch the async bank reflow from the resize.
     Applied to all three: _toggleCondense, _toggleMini, _toggleCyan.

     (Sam earlier noted in code comments that these display buttons had
      a history of scroll-to-top trouble — v1.78 routed them through
      _equilToggle* helpers to avoid synthetic-click focus-into-view.
      This is the same family of issue, now addressed at the resize level.)
-->

<!-- Equil v4.75 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.75: No action jerks the page to the top on tall puzzles.

     PER SAM:
     "The undo button, when you scroll down, pops it back up — horrible.
      All the buttons that change the display of the number bank tiles,
      when you hit one it scrolls way back up. Even tapping a number in
      the bank to send it up to a highlighted cell scrolls the screen
      back up. All of it really annoying."

     CAUSE.
     On tall puzzles (Jumbo/Large) the PAGE scrolls. render() does
     grid.innerHTML='' and renderBank() does bank.innerHTML='', then
     both rebuild. While a container is momentarily empty it has zero
     height, so the page's max scroll drops and the browser clamps the
     scroll to the top; the position isn't restored when height returns.
     EVERY re-rendering action hits this: tapping a cell, placing a bank
     tile, undo, and the bank-display toggle buttons (which call
     renderBank directly).

     FIX.
     Instead of patching each call site (selCell, place, undo, each
     toggle), the scroll-preservation guard now lives INSIDE the two
     functions that actually rebuild DOM:
       - render(): capture window.scrollY at the top, restore at the end
         (after grid + renderBank have rebuilt at full height).
       - renderBank(): same, for the display-toggle buttons that call it
         directly without going through render().
     This covers all current and future re-render paths in one place.
     Both restores are no-ops when nothing moved the scroll. The earlier
     selCell-only attempt was reverted in favor of this.
-->

<!-- Equil v4.74 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.74: NEW COMPACT JUMBO (preview — Template A only).

     PER SAM:
     "It's time to retire that size of a Jumbo. Keep the name Jumbo,
      just reduce the size — take it down a notch. Bigger than Large
      but nowhere near as big as it is now. I like the 7-side (7-cell
      equations), it spices things up, we just don't need so much of
      it. Let me look at what you're working with while you add to the
      puzzles."

     WHAT CHANGED.
     The old Jumbo (TX2_sq_A..D) was ~29×27 with 54 seven-cell
     equations — a tedious marathon. New Template A (TXN_A) keeps the
     distinctive 7-cell "A op1 B op2 C = D" format but at 20 equations,
     25 crossings, 13×19 footprint. Bigger/meatier than Large (24
     five-cell equations) thanks to the two-operator format, but a
     fraction of the old Jumbo's bulk.

     POOL: TMPL_XL2 = [TXN_A] for this preview build so the size can be
     eyeballed on-device and its in-game generation confirmed before
     the B/C/D variety templates are added. The old templates remain
     DEFINED (TMPL_XL2_OLD) but unpooled — nothing deleted.

     DESIGN METHOD (this session): read the engine's real construction
     rules (genNumsXL H-first value gen, canSolveXL, the arc-consistency
     solver isSolvableViaPropagation, buildCellMap) and wrote them up in
     /home/claude/equil_template_rules.md, plus a faithful offline
     validator (validate_tpl.js) that matches the engine (crossings at
     number cells only, perpendicular, parallel-shared-endpoints allowed,
     connectivity BFS). TXN_A validates ok=true. Crossing density 1.25
     is close to the original's 1.07 and well below the level that
     historically caused values-gen fallback.

     STILL TODO (next build): confirm TXN_A generates in-game without a
     "from xl2/..." fallback warning, then add B/C/D for pool variety.

     The 'xl2' size key and all Jumbo stats are unchanged — existing
     records still resolve.
-->

<!-- Equil v4.73 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.73: Light-mode drag glow darkened; puzzle-board dividers kept
     dark in light mode.

     PER SAM:
     "Make the glow for dragging in light mode a darker cyan — the
      brighter cyan works good in dark mode but in light mode turn it
      into a darker cyan. Also the two dividing lines in light mode,
      keep them dark — there's one on top of the puzzle board and one
      below it, horizontal, and they turn light cyan in light mode.
      Keep them the same darkness from dark mode."

     1) DRAG GHOST GLOW — theme-aware.
        _createGhost now picks the glow color by window._lightModeOn:
          dark  : 0 0 10px rgba(0,217,255,0.45) + soft black drop
          light : 0 0 10px rgba(14,116,144,0.50) + soft brown drop
        The bright cyan washed out on cream; the deeper teal-cyan
        (same family as the rest of the light palette) stays visible.

     2) PUZZLE-BOARD DIVIDERS.
        The two horizontal lines above/below the board are .gscroll's
        border-top / border-bottom. Base rule sets them to
        rgba(0,217,255,0.5) cyan. The light-mode .gscroll override
        only changed box-shadow, not the borders, so they rendered as
        a pale cyan on cream. Added border-top-color /
        border-bottom-color: rgba(14,116,144,0.7) to the light-mode
        override so they read as crisp deep-teal dividers, matching
        the defined look they have on the dark board.
        (The .mast bottom border already used var(--cyan) so it
        themed to deep teal on its own — only the gscroll borders were
        hardcoded.)
-->

<!-- Equil v4.72 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.72: Drag ghost glow → light cyan (both themes).

     PER SAM:
     "For both dark and light, when you're dragging a tile, instead
      of a purple glow behind it, can you have it be kind of a light
      cyan glow? Not too much."

     CHANGE.
     The drag ghost's box-shadow in _createGhost was
       0 0 12px rgba(168,85,247,0.6)   (purple)
       0 4px 12px rgba(0,0,0,0.5)      (drop shadow)
     Changed to
       0 0 10px rgba(0,217,255,0.45)   (light cyan, dialed back)
       0 4px 10px rgba(0,0,0,0.35)     (softer drop)
     Same for both themes — cyan reads fine on dark and on cream.
     No other code mutates the ghost's box-shadow, so the cyan holds
     through the whole drag and the snap-in animation.
-->

<!-- Equil v4.71 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.71: Restore the bank-tile selection glow in light mode.

     PER SAM:
     "Something got rid of a feature in dark mode — when you go to
      light mode and select a blank cell, it turns purplish, and all
      the number bank tiles should get a glow around them in the same
      color. In dark mode you tap a blank cell, it turns magenta, and
      all the bank cells get a magenta glow. Keep that going in light
      mode — a purplish glow around them."

     CAUSE.
     The `.bt.lit` class is the selection glow on candidate bank
     tiles (applied when a board cell is selected). It uses #a855f7
     purple and worked in dark mode. But the v4.49/v4.54 light-mode
     overrides added:
       body.light-mode .bt { border-color:...; box-shadow:... !important; }
     CSS specificity: body.light-mode .bt = (0,2,1), .bt.lit = (0,2,0).
     With !important on both, the higher-specificity selector wins,
     so in light mode the light-mode `.bt` override clobbered the
     `.bt.lit` glow — selecting a cell did nothing visible to the
     bank tiles.

     FIX.
     New higher-specificity rule:
       body.light-mode .bt.lit { border + box-shadow !important; }
     Restores the glow in light mode using the light-mode selected-
     cell purple (#7c3aed) so the bank tiles glow the same color the
     selected cell turns — matching the dark-mode magenta behavior.
-->

<!-- Equil v4.70 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.70: Drop detection measures from the tile, not the finger;
     ghost lifted higher.

     PER SAM:
     "You really were going off where my finger released. Since
      there's a little deflection — once you pick up the tile it
      moves above your finger in y space so you can see it — when
      you release we should go off the tile position, not the finger
      position, because you're looking at the tile when you place it.
      Also bump it up another half a tile width because sometimes it
      still gets a little under my finger."

     BUG.
     The v4.68 release-time grace check and the elementFromPoint
     fallback both measured from the raw fingertip position. But the
     ghost floats FINGER_OFFSET_Y px ABOVE the fingertip (so the user
     can see it past their finger). The user aims with the tile they
     can see, so a release that looked dead-on over a cell was being
     measured ~48px too low — often missing the intended cell. The
     live magnet was already correct (my = fy - FINGER_OFFSET_Y); only
     the two touchend paths had the bug.

     FIX 1 — measure from tile center.
       - Grace check: fy = t2.clientY - FINGER_OFFSET_Y
       - elementFromPoint fallback: hit-test at
         (clientX, clientY - FINGER_OFFSET_Y)
     Now all three drop paths (live magnet, grace, elementFromPoint)
     measure from the same tile-center reference.

     FIX 2 — ghost lifted higher.
       FINGER_OFFSET_Y 48 → 72 (+24px ≈ half a tile width). The ghost
       was still sometimes partly under the fingertip; the extra lift
       keeps it clearly visible. The constant is referenced by all
       position-aware paths so bumping it shifts them together.
-->

<!-- Equil v4.69 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.69: Magnet skips filled cells; ghost text solid not hollow.

     PER SAM:
     1) "Magnet snapping should only happen over blank cells. I don't
         want it to snap onto cells that have numbers that you placed
         in. They're glowing a little bit, pulsing, and color green —
         but still, just don't have them snap onto those. If anyone
         really wants to kick them out they can just tap on them."
     2) "When you're dragging the tile, I want to keep it the same
         black text. Right now it kinda goes into a hollow text — we
         were playing with outlines a long time ago — just keep it
         the same black text the whole time."

     1) MAGNET FILLED-CELL SKIP.
        _buildCellCache already filtered to cells with isBlank=true.
        Added `cell.value != null` skip so already-placed cells are
        excluded entirely from the cache. The live magnet, the
        release-time grace check (v4.68), and the elementFromPoint
        fallback all defer to the cache for valid drop targets.
        Mirror filter added to the elementFromPoint path so that
        direct-finger-on-cell hits also reject filled cells. To swap
        a value: tap the filled cell to return it to the bank, then
        drag the new tile in (cache is rebuilt at each drag start so
        the slot reappears).

     2) GHOST TEXT SOLID.
        The ghost number span had been styled as outline-only:
          color: transparent
          -webkit-text-stroke: 0.5px <color>
          text-stroke: 0.5px <color>
        This was a leftover from an earlier visual iteration. Switched
        to solid color using the same var(--text-primary) value the
        bank tile resolves to, so the ghost reads as a continuation
        of the bank tile through the drag — same digit, same color,
        same weight. No new variable; just inverts the styling.
-->

<!-- Equil v4.68 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.68: Release-time grace snap for fast drags.

     PER SAM:
     "When you drag a tile over a cell, if you release the tile
      somewhere near the cell, it should automatically find its way
      into that cell even if it hadn't snapped yet. Sometimes I
      release it a little bit earlier — if I move it up there really
      quick I don't have the time to wait for it to snap in. Have it
      animate so that it just kinda snaps into place after you leave
      your finger off — keeps going the distance, doesn't just
      teleport."

     CONTEXT.
     The live magnet has both a proximity gate (0.7 cell-widths) AND
     a velocity gate (smoothed finger velocity must drop below
     snapOn=48 to engage). The velocity gate prevents jitter during
     fast drags — the ghost would otherwise dance between cells.
     Side effect: when the user moves fast and releases before the
     velocity smoother settles, the live magnet has never locked, so
     the tile drops at the finger position. With v4.67's "drag tiles"
     workflow this routes through the existing elementFromPoint
     fallback, which only catches releases LITERALLY on a blank cell
     — releases slightly short or over a wrapper gap fall through to
     "return to bank."

     CHANGE.
     New release-time grace check inserted between the existing
     elementFromPoint fallback and "return to bank":

       if no locked cell AND no cell directly under finger:
         scan cellCache, find nearest blank cell within grace radius
         (1.1 cell-widths by default), place there if found.

     The live magnet's strictness is unchanged — the grace check
     ONLY runs at touchend, never affects the dragging-feel. The
     existing 110ms ghost-slide animation (transition: left/top
     110ms ease-out) already plays from the release position to the
     cell center, so the grace placement looks like the ghost being
     "sucked" into the slot rather than teleporting. No new animation
     code needed.

     New live-tunable global: window._equilDropGrace = {cells: 1.1}.
     Distance is straight-line from finger to cell center, compared
     squared (avoids sqrt). Nearest-within-radius wins ties.

     UNCHANGED:
     - Release over empty space (outside grace radius) → return to bank.
     - Release over a non-blank cell (op, eq, given) → return to bank.
     - Release when live magnet IS locked → drop there (existing path).
     - Live magnet velocity gate (separate config, separate purpose).
-->

<!-- Equil v4.67 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.67: Returning a placed tile to bank no longer leaves the cell
     selected when drag-tiles is ON.

     PER SAM:
     "When you reject a number that's in the cell and send it back to
      the tile bank, it should not stay selected. Because then you go
      to tap and drag it, and it auto places it, and you're in the
      behavior of actually dragging them. As soon as you click on a
      number that you had placed to send it back, then it doesn't
      stay selected."

     CONTEXT.
     Tapping a placed tile returns it to the bank (selCell at line
     ~17902). What happens to SEL after the return has flipped twice
     before:
       v2.31: cleared SEL (return = undo intent)
       v2.74: kept SEL = k (saves a tap when user is about to place a
              different number in the same cell)

     Both rationales are right for their workflow. The conflict:
       - drag-tiles OFF (tap-to-place): user expects SEL kept so a
         bank tap re-fills the cell quickly.
       - drag-tiles ON (drag-to-place): user expects to start dragging
         from the bank, and the leftover SEL causes the bank tap to
         auto-place into the just-vacated cell instead of beginning a
         drag.

     FIX.
     Split by workflow. selCell now reads window._dragTilesEnabled:
       - true  → SEL = null after return (drag-friendly)
       - false → SEL = k after return (v2.74 behavior preserved)

     Setting persisted unchanged. Users who toggle drag-tiles can
     observe both behaviors immediately without reloading.
-->

<!-- Equil v4.66 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.66: When drag-tiles is ON, touching a tile no longer scrolls
     the page.

     PER SAM:
     "When you grab a tile, it starts scrolling on you too while
      you're grabbing it, and that's frustrating, especially on a
      puzzle that you don't really even need to scroll."

     CAUSE.
     The `.bt` CSS rule had `touch-action: pan-y` so the browser
     would pan the page in response to vertical finger movement on
     tiles. The browser's pan threshold (~2-3px) is much smaller
     than our drag pickup threshold (DRAG_THRESHOLD = 8px), so the
     page would start scrolling before our drag handler decided
     "yes, this is a drag." We were calling preventDefault() on
     touchmove inside the drag handler, but by the time we got
     there, the page was already in motion.

     FIX.
     New body class `drag-tiles-on` reflects window._dragTilesEnabled.
     _applyTuning toggles the class whenever the setting changes.
     CSS rule:
       body.drag-tiles-on .bt { touch-action: none; }
     With touch-action:none, the browser doesn't initiate panning on
     touches that land on a tile. Drag handler has full ownership of
     the gesture from touchdown forward.

     When drag-tiles is OFF (default), `.bt` keeps `pan-y` so swiping
     across the tile row scrolls like any other content — preserves
     the original behavior for users who haven't enabled dragging.

     AUTO-SCROLL DURING DRAG (Sam's request #2) DEFERRED.
     Will land in a future version: while dragging a tile, if the
     finger nears the top or bottom edge of the viewport, scroll the
     page in that direction. Useful on long puzzles where the target
     cell is off-screen. Not in this version per Sam.
-->

<!-- Equil v4.65 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.65: Layout cleanup — subtitle no-wrap, template label
     relocated, theme toggle moved out of bank toolbar.

     PER SAM:
     "Top: wrapping issue with the small and less easy. Want less
      easy to be on the same line straight so it doesn't wrap.
      Template name TA next to undo — rather have that right next
      to the dev button. And for the darkness/lightness setting put
      it somewhere else — perhaps to the right of the timer."

     1) SUBTITLE NO-WRAP.
        .mast-info gets white-space:nowrap so "SMALL · LESS EASY"
        stays on one line. Was wrapping because the masthead's
        center slot doesn't have enough width when the label is
        longer than ~14 characters.

     2) TEMPLATE LABEL RELOCATED.
        #_dbgTplLabel was in the left group beside UNDO. Moved to
        the right group, just to the left of #_dbgDevBtn so the
        dev-side controls (template name + DEV opener) cluster
        together. UNDO stays alone on the left.

     3) THEME TOGGLE RELOCATED.
        #themeToggle was centered in the bank toolbar between the
        UNDO group and the DEV group. Moved to the right end of the
        timer row inside the masthead, adjacent to the mistakes
        wrap. Smaller pill (3px vs 5px vertical padding, 28px
        min-width vs 34px) to fit cleanly there.

     All click handlers unchanged — IDs preserved, only the DOM
     parent changes for theme toggle and template label.
-->

<!-- Equil v4.64 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.64: Difficulty labels: Easy / Less Easy / Hard.

     PER SAM:
     "Intermediate starts to get really condensed in there, takes up
      too much space. Easy and Hard on the outside are about equal
      length, so they can be equal sizes on the ends. In the middle
      you can make it spaced out pretty good with 'Less Easy' with a
      little bit of padding on the sides."

     CHANGE:
     v4.63's BEGINNER / INTERMEDIATE / ADVANCED → EASY / LESS EASY /
     HARD. Keeps the visual symmetry of v4.62-and-earlier (Easy and
     Hard are similar length on the ends; "Less Easy" sits in the
     middle with room). Avoids the original two-MEDIUMs problem since
     the masthead subtitle now reads e.g. "SMALL · LESS EASY".

     Internal values still 'easy' / 'medium' / 'hard'. Only display
     labels changed via diffLabel().
-->

<!-- Equil v4.63 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.63: Difficulty display labels renamed to Beginner /
     Intermediate / Advanced.

     PER SAM:
     "I'd like to change the difficulty settings to beginner,
      intermediate, and advanced. That way we don't have two mediums,
      both size and difficulty."

     APPROACH: display-only rename. Internal values stay 'easy' /
     'medium' / 'hard' so every persisted stat key, template pool
     reference, and localStorage record continues to resolve to the
     same buckets — no data migration needed, no stats lost. Only
     the user-facing labels change.

     NEW HELPER: diffLabel(d) next to the existing sizeLabel(s).
       easy   → BEGINNER
       medium → INTERMEDIATE
       hard   → ADVANCED

     UPDATED DISPLAY SITES:
     - Menu screen difficulty buttons (Beginner / Intermediate /
       Advanced)
     - Masthead subtitle (e.g. "SMALL · INTERMEDIATE")
     - Win card subtitle (same format as masthead)
     - Share-to-clipboard text ("Equil SMALL INTERMEDIATE — 0:42")

     UNCHANGED (intentional — internal):
     - data-diff attribute values on the menu buttons
     - DIFF global, localStorage records, template pool keys
     - TIMES/COUNTS debug panels (still show internal labels —
       those panels are dev-facing)
-->

<!-- Equil v4.62 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.62: Pinned header for settings panels; default-closed
     sections per panel type.

     PER SAM:
     "Have them all default to closed to begin with, but if they
      were left maximized, keep that memory? Actually, have that
      behavior for dev tools because I'm sometimes in and out of
      there. But for the settings, have that just always default to
      both being minimized."
     Plus from the prior message: "have a done button at the top so
      you can close out by hitting a done button at top. And then
      also the restore defaults should also be pinned to the top
      somewhere. So those shouldn't scroll around with everything
      else."

     PER-PANEL DEFAULT BEHAVIOR.
     New _mkSection opts.forceClosed: when true, the section starts
     closed every time the panel opens regardless of saved state,
     and toggling it inside the panel doesn't persist to localStorage.
     - User panel ("OPTIONS"): Tile interaction + Audio sections
       both pass `{forceClosed: true}` → always start collapsed.
     - Dev panel ("DEV TOOLS"): unchanged — sections remember their
       expanded/collapsed state across opens (Sam is "in and out of
       there").

     PINNED HEADER LAYOUT.
     The box element is now a flex column with two children:
       - hdr: padding+border-bottom, doesn't scroll. Holds:
           - Title ("OPTIONS" or "DEV TOOLS")
           - Action row: [Restore defaults] [Done] (50/50 split)
           - Dev-mode only: TIMES/COUNTS launcher row below
       - body: overflow-y:auto, flex:1. Holds all the sections.
     Previously the entire panel was one scrollable region with
     Reset and Close at the bottom — required scrolling past every
     section to dismiss. Now they're always reachable.

     The old reset click handler is preserved verbatim (50-line
     reset of every option) — just rebound to the new header
     `reset` button. The old `close` button is replaced by `done`
     which has the same close behavior with a different label
     matching the pinned-header context.

     Backdrop tap-to-dismiss unchanged.
-->

<!-- Equil v4.61 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.61: Settings panel anchored at top instead of centered.

     PER SAM:
     "On that new settings window, when you maximize one of the two
      things in there, it makes the whole window grow from the
      center. I don't like that. I would like it to stay anchored at
      the top — then maybe have the bottom move down. It jumps
      around when it moves from the center like that."

     CAUSE: panel overlay used `align-items:center` so the modal
     centered vertically. When a collapsible section expanded, the
     panel grew taller and had to move UP to stay centered — both
     edges shifted, creating the "jumping from center" feel.

     FIX: changed `align-items` to `flex-start` and added
     `padding-top:8vh` to the overlay. Panel now anchors near the
     top of the viewport. Section expansions only push the bottom
     down — the title and top sections stay in place.

     max-height stays at 88vh which fits within the viewport even
     with the 8vh top padding (8 + 88 = 96vh total).
-->

<!-- Equil v4.60 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.60: Split settings into user + dev panels. New DEV button in
     the toolbar (replaces TIMES + COUNTS). Master sound effects
     toggle in user panel's Audio section.

     PER SAM:
     "Add times and counts buttons into the settings. And I want the
      settings to be activated by a new button in the place where
      times and counts was, just called 'dev'. Keep the old settings
      button in the upper right, but that is going to be just a
      simpler settings for users, it will keep the audio and tile
      interaction sections, the rest can go to dev tools button. And
      in audio just also add an option to turn off sound effects."

     PANEL SPLIT.
     _buildPanel now takes a `mode` argument: 'user' or 'dev'. Each
     section gated by mode.
       USER (⚙ button, top-right of masthead, unchanged location):
         - Tile interaction
         - Audio (with new Sound effects toggle at the top)
       DEV (new DEV button, replaces TIMES + COUNTS pair):
         - Top row: TIMES + COUNTS launchers (close dev panel, open
           the corresponding debug overlay)
         - Visual effects
         - Placed-tile pulse
         - Legibility
         - Debug — win card
         - Debug — snap tuning
         - Pace stats
         - Pace rings
         - Pace boxes

     TITLE swaps to "OPTIONS" or "DEV TOOLS" by mode. Both panels
     share the Reset / Close buttons at the bottom (reset preserves
     current mode).

     SOUND EFFECTS MASTER TOGGLE.
     New DEF.sfxOn (default true). Gated at the top of:
       - All dispatch entry points: playSelEmpty / playSelFilled /
         playPlace / playReturn / playError / playNewGame / playFanfare
       - Standalone: playScaleNote / playTilePickup / playTileSnap /
         playTileSnapWhoosh / playTileReturn / playUIClick / playGreeting
       - Modal chirps: _modalOpenChirp / _modalCloseChirp
       - Button SFX: window._btnFx
     Pattern: `if(window._sfxOn===false||!AC)return;` piggybacks on
     the existing AC short-circuit so no extra lines.

     TOOLBAR.
     The TIMES and COUNTS buttons (#_dbgTimesBtn, #_dbgCountsBtn)
     are gone from the toolbar. Replaced by a single #_dbgDevBtn
     labeled "DEV". Its click handler is in the same IIFE that used
     to wire the old pair (around line 12398); the old IDs are still
     queried but guarded since they no longer exist in the toolbar.
     The actual debug-overlay close buttons (_dbgPanelClose,
     _dbgTimesPanelClose) inside the floating overlays themselves
     still get their handlers wired since those IDs do exist.

     Light-mode CSS extended to also target #_dbgDevBtn so the new
     button picks up the same deep-teal styling.

     Exposed `window._openDevPanel` and `window._openOptionsPanel`
     for any future call sites that need to launch a specific panel.

     APIs UNCHANGED for any of the debug-overlay opacity buttons,
     tabs, reset buttons inside the TIMES and COUNTS panels — all
     wired separately and still work as before. Only the way you
     OPEN those panels changed (now via dev panel button instead of
     directly from the toolbar).
-->

<!-- Equil v4.59 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.59: Experiment — remove cell wrapper frames in light mode.

     PER SAM:
     "Can I see what it looks like if on only the light mode you get
      rid of borders around the cells. Except for blank cells, they
      need that thin outline. Oh, that's right, it's not actually a
      border, it's like a container the other cells sit on that look
      like a border because only the edges show through. That's what
      I want to remove in light mode and see how it looks."

     What he's describing: op/eq/given cells render with a wrapper
     div sized CS×CS that has `background:var(--bk);` plus an inner
     pill (the rounded colored chip) that sits inside it. The visible
     "frame" is just var(--bk) peeking around the pill edges since
     the pill is smaller than the wrapper.

     CHANGE:
     --bk in body.light-mode flipped from #e6dcbe (slightly deeper
     cream) to #f4ecd8 (same as --bg, the page bg). Wrappers become
     invisible — pills appear to float directly on the cream page.

     This also affects:
     - Pill background compositing. Pills use bgLayer:
         linear-gradient(rgba,rgba), var(--bk)
       So the alpha-tinted pill colors now composite over plain cream
       instead of the deeper-cream wrapper. Effective pill colors
       shift slightly lighter, which is the intended look for the
       wrapperless aesthetic.
     - Blank cells already used var(--bg) as their base layer
       (different code path) so blank-cell visuals are unchanged.

     Easy revert: change --bk back to #e6dcbe in body.light-mode.

     Dark mode unchanged.
-->

<!-- Equil v4.58 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.58: Win-card PB bursts no longer force-show; new settings
     toggle for troubleshooting visibility.

     PER SAM:
     "We can take off the part where best moves always shows up on the
      win card. Maybe add a toggle in settings to turn the display on
      for troubleshooting. But I want people to play this without it
      showing up every time they win."

     ROOT CAUSE:
     v4.11 set `window._forceMovesBurst = true` as a dev shortcut so
     Sam could see the moves-burst visual treatment without organically
     beating his best (his test puzzles were tying his record). A note
     said "Flip both to false for normal play" but it never got flipped.
     The burst display logic OR's the real PB detection with this flag:
       _showMovesBurst = _newMovesBest || !!window._forceMovesBurst
     So with the flag stuck at true, the moves burst fired on every
     solve regardless of whether the run was an actual PB.

     FIX:
     1) Flipped the v4.11 hardcoded `_forceMovesBurst = true` to false.
        Initial values now both false at script-load time.
     2) Added new DEF entry `forceWinBursts: false`.
     3) _applyTuning now sets `_forceTimeBurst` and `_forceMovesBurst`
        from `window._optForceWinBursts` (or DEF if unset). When the
        toggle is OFF (default), bursts only appear on legit PBs.
        When ON, both bursts force-show on every solve.
     4) Load/save plumbing in _loadOpts/_saveOpts/reset section.
     5) New settings section "Debug — win card" with single toggle
        "Always show PB bursts" + description explaining troubleshooting
        use. Section default closed (most players won't touch it).
        Sits right after the "Audio" section in the panel.

     Burst visuals themselves unchanged (vibrant yellow + dense
     drop-shadow stack from v4.57).
-->

<!-- Equil v4.57 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.57: Restore vibrant yellow burst with denser shadow + add UI
     click to mode buttons.

     PER SAM:
     "The new burst looks bad. I want the same vibrant yellow, just
      either more dark shadow or more dense glow for the shadow. And
      chalant and nonchalant buttons should have the same sound other
      menu buttons have."

     1) WIN BURST — VIBRANT YELLOW + DENSER SHADOW.
        Reverted v4.56's amber color swap. The yellow stays the
        original #ffd84a vibrant brand color. Contrast on cream
        achieved entirely via a denser layered drop-shadow filter:
          drop-shadow(0 0 1px rgba(42,36,24,0.95))  ← tight outline 1
          drop-shadow(0 0 1px rgba(42,36,24,0.95))  ← tight outline 2
          drop-shadow(0 1px 2px rgba(42,36,24,0.6)) ← soft drop
        The two stacked zero-spread outlines build up a near-black
        edge around every yellow pixel without compositing under the
        strokes (drop-shadow only shadows non-transparent pixels —
        so the yellow stays yellow, the dark just outlines it).
        Kept v4.56's font-size:16 (up from 14).

     2) MODE BUTTONS — CLICK SOUND.
        [data-mode] selector wasn't included in the sel-screen
        click-sound bootstrap (where size, diff, sound, play buttons
        get playUIClick). Added a parallel forEach for [data-mode]
        right after the data-diff one. Capture-phase listener like
        the others so it fires before the state handler.
-->

<!-- Equil v4.56 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.56: Burst readability + menu screen cyan cleanup.

     PER SAM:
     "Darker on the shadow for best moves text and burst though, it
      almost looks gray now. Possibly because of how small it is,
      maybe increase text size just a bit as well? And on menu screen,
      version number in light mode is that bright cyan I dont want,
      as well as the stats button outline."

     1) WIN BURST READABILITY.
        v4.55's drop-shadow approach was muddying the yellow because
        the dual filter shadows composited UNDER the already-low-
        opacity (0.85 outer, 0.6 inner) yellow strokes, mixing to
        gray-brown.

        New approach: swap stroke + text fill to saturated darker
        amber (#b45309) in light mode — it holds up on cream without
        relying on heavy shadow. Plus:
          - Group opacity 0.85 → 1.0 (full saturation)
          - Inner polygon opacity stays at 0.7 (subtle layered look)
          - Text font-size 14 → 16 (more readable per Sam)
          - Single tight drop-shadow at 0.25 alpha for subtle outline
        Dark mode unchanged — bursts stay the original #ffd84a yellow
        on black where they're already crisp.

     2) MENU SCREEN CYAN.
        Two inline rgba(0,217,255,...) sites I'd missed:
          - #_seqVersionTag: version number → deep teal at 0.7 alpha
          - #statsBtn border: → deep teal at 0.55 alpha
-->

<!-- Equil v4.55 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.55: Three tiny fixes.

     PER SAM (screenshot showing pause/back buttons + win card):
     1) "There is still some glow in the pause button, the pause icon."
     2) "Back button has always been off center for the arrow in it."
     3) "Yellow best time / best moves burst is hard to see in light
         mode. Add slight shadow to make it more readable."

     1) PAUSE ICON GLOW.
        The two vertical bars inside #pauseBtn are <span> children
        with inline `box-shadow:0 0 4px rgba(0,217,255,0.6)` each.
        My v4.54 #pauseBtn rule only hit the button border, not the
        children. Added `body.light-mode #pauseBtn > span { box-shadow:
        none !important; }`.

     2) BACK ARROW VERTICAL ALIGNMENT.
        Long-standing issue. The `←` glyph has odd baseline metrics
        that place it visually below center. The existing fix was
        translateY(-3px) which wasn't enough. Bumped to -5px.

     3) WIN CARD PB BURSTS.
        #winBurstMoves and #winBurstTime are SVG with `stroke="#ffd84a"`
        (light yellow) on a cream bg — minimal contrast. Added a CSS
        `filter: drop-shadow(...)` in light mode: a soft brown shadow
        + tight outline shadow so the yellow burst + text reads
        clearly without changing the brand yellow color.

     Dark mode unchanged for all three.
-->

<!-- Equil v4.54 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.54: Expanded light-mode glow→shadow coverage.

     PER SAM:
     "Glow in light mode around pause, new, and settings is still
      there, I wanted like shadow looking but no shadows showed up.
      All of the buttons on the bottom row still are glowing bright
      cyan. Should be shadows."

     ADDED COVERAGE:
     - #backBtn / #pauseBtn / #newp / #optBtn — masthead buttons
       carry inline `box-shadow:0 0 8px rgba(0,217,255,0.3)`. Light
       mode override: `0 1px 3px rgba(42,36,24,0.18)` soft drop +
       deep teal border.
     - .tile-controls-row > button — TILE ADJUST / ×N / #### / ###
       buttons have `box-shadow:0 0 8px rgba(0,217,255,0.3)` in
       their CSS rule. Same soft drop-shadow + deep teal border +
       deep teal text in light mode.
     - .tile-controls-row > button.active — the purple "this mode
       is on" state gets the same drop-shadow treatment with deep
       purple instead of teal.

     RE: "tile glow in dark mode got removed"
     I traced through the CSS and all light-mode rules are correctly
     scoped via `body.light-mode .selector`. Dark mode should be
     fully restored to its v4.52 state when the toggle is off. If
     Sam still sees missing dark-mode glow, suspect:
       1. Browser CSS cache — hard reload might help
       2. Transition mid-flight when toggling — wait 150ms after
          toggle for transitions to settle
       3. A specific element I missed — please screenshot of dark
          mode and I'll investigate
-->

<!-- Equil v4.53 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.53: Soften neon-cyan glows to shadow-like in light mode.

     PER SAM (screenshot of win card after solving):
     "Can you darken the cyan glow around the menu and next puzzle
      buttons, and turn the bright cyan text in upper left to be
      darker, also darken glow around everything that glows in light
      mode, I think they need to look more like shadows in light mode,
      like around the timer and other places."

     APPROACH:
     Dark-mode glows are neon-cyan radiations (rgba(0,217,255, ...))
     which reads as "this thing is electric" against black. On cream
     they read as bright halos and feel out of place. Replaced major
     glow surfaces with soft brown drop-shadows (rgba(42,36,24, ...)
     — the dark text color, low alpha) so they read as subtle
     shadows rather than emissive glow.

     COVERAGE (body.light-mode CSS overrides with !important):
       - .mast bottom shadow
       - .gscroll outer + inset glow
       - .bt inset glow
       - .wcard outer drop shadow
       - #winSplitBtns pill button glow
       - #mastTimerWrap text-shadow (the cyan timer halo)
       - .sel-mast / .sel-btn.on / .sel-play (menu screen)
       - .seq-btn / .pro-btn variants (sequencer remnants)

     WIN CARD CYAN TEXT FIXES:
       - #winSizeDiff (the "SMALL · MEDIUM" line top-left): 
         rgba(0,217,255,0.85) → #0e7490 deep teal
       - #winHeader > div (TEMPLATE: line): deep teal at 0.85 alpha
       - #winHeader > div > span:first-child (the "TEMPLATE:" label):
         deep teal at 0.70 alpha
       - #winMenuBtn divider stroke: deep teal at 0.4 alpha

     Cyan text that uses var(--cyan) (like ".wt" Solved! title) was
     already themed via the variable to #0e7490 and didn't need
     explicit overrides.

     Dark mode unchanged.
-->

<!-- Equil v4.52 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.52: Light-mode tweaks for AVG pace stat and debug template label.

     PER SAM:
     "The average time in light mode is too bright of a cyan color,
      as is the template 2 letters by undo button. Maybe just make
      it a darker cyan color, but different than the worst time."

     CHANGES:
     1) Pace stats palette adjusted for light mode (overrides via
        body.light-mode CSS with !important to beat inline styles):
          BEST:  #c400ff (magenta neon) → #7c3aed (deep purple)
          AVG:   #00ffff (bright cyan)  → #0e7490 (deep teal,
                                          distinct from worst)
          WORST: #4a8fa0 (dark cyan)    → #355e6b (muted blue-gray,
                                          darker than avg)
        Order of distinctness: best clearly purple; avg/worst both
        blue-cyan but avg more saturated/lighter, worst more muted.

     2) _dbgTplLabel (debug template name shown next to UNDO):
        - JS now sets color theme-conditionally on every update.
        - body.light-mode CSS rule added as belt-and-suspenders.
        - Theme toggle re-fires _updateDbgTplLabel() so label
          re-themes immediately.

     Dark mode unchanged for both.
-->

<!-- Equil v4.51 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.51: Just-solved given cells in light mode no longer stay bright
     cyan.

     PER SAM (screenshot showing 5 × 2 = 10 just solved):
     "See that bright cyan in two cells right after I solved it,
      thats what I dont want"

     ROOT CAUSE:
     Different from the placed-cell flash fixed in v4.50. This bug is
     about GIVEN cells (the 5 and 10 in the example) in a just-solved
     equation. The stagger reveal code fires a `givenpop` keyframe
     animation on each given in the equation with `forwards` fill mode.
     The dark-mode `@keyframes givenpop` ends with `color:#00d9ff;
     background:rgba(0,217,255,0.2)` — neon cyan. With `forwards`,
     those colors PERSIST on the cell until the next render() call.

     On the placed-cell flash (the 2 in the screenshot) the v4.50 fix
     applied — those use inline-style setting which I made theme-aware.
     But the givens go through a different code path (animation only,
     no inline color/bg set) so they stayed locked at the keyframe's
     end state regardless of theme.

     FIX:
     New `@keyframes givenpop-light` variant with deep teal palette
     (background:rgba(14,116,144,...); color:#0e7490 end state).
     Stagger code picks variant by `window._lightModeOn`:
       light → 'givenpop-light'
       dark  → 'givenpop'
     Given cells in just-solved equations now end on the same deep
     teal they'd render to anyway. No persistent neon flash.

     Dark mode unchanged.
-->

<!-- Equil v4.50 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.50: Light-mode just-solved flash fix.

     PER SAM (clarified from v4.49 attempt):
     "I still want the breathing pulse for green numbers. I was
      referring to when you place all the correct numbers in an
      equation, and that equation is still highlighted, there is some
      different color scheme being applied than the other green when
      you deselect that equation. I just dont want them to turn that
      super bright green as soon as it sees you have solved it
      correctly."

     ROOT CAUSE (different from v4.49's fix):
     The bright flash wasn't the .ok-breath animation peak (that's
     for fully-dimmed cells with no unsolved-equation intersections).
     It was the STAGGER REVEAL inside render() around line 20215 —
     the setTimeout sequence that fires per-cell as each newly-
     completed cell animates in. That code hardcoded:
       el.style.background='rgba(74,222,128,0.28)'
       el.style.color='#4ade80'
       el.style.boxShadow='0 0 8px rgba(74,222,128,0.6)'
     Neon green which on cream reads as "bright flash that calms
     down" once render() takes over with the deeper palette.

     v4.49's _writePulseKeyframes change was still correct (breath
     animation should also be hunter green in light mode) but it
     wasn't the visible bug.

     FIX:
     Made the stagger reveal theme-aware. Reads window._lightModeOn
     at fire time and uses:
       light: rgba(22,101,52,...) + #166534 (hunter green)
       dark:  rgba(74,222,128,...) + #4ade80 (neon green)
     Same logic for the eq cell cyan in the same block.

     The "just solved → still highlighted" cells now show calm hunter
     green in light mode from the moment they reveal. No more bright
     flash that settles.
-->

<!-- Equil v4.49 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.49: Light-mode bug fixes (pace stats not showing) + palette
     tuning per Sam's tester feedback.

     PER SAM:
     1) Pace stats don't show up even with toggle on.
     2) Solved-cell green is too light/neon in light mode.
     3) Selected-equation cyan highlight too bright in light mode.
     4) Already-placed numbers turn really light cyan briefly.
     5) Bank tile numbers look dimmed/desaturated.

     FIXES:

     1) PACE STATS REGRESSION.
        Root cause: _initPaceStats had a `if(_equilMode==='nonchalant')
        return;` gate copied from the ghost bar. _equilMode defaults
        to 'nonchalant' on fresh installs, so pace stats never
        appeared. Pace RINGS don't have this gate and worked fine.
        Pace stats now match: gate removed. Master toggle in settings
        is the only on/off. Players who don't want pace pressure can
        toggle "Show pace stats" off.

     2 & 4) BREATHING GREEN PULSE BRIGHT IN LIGHT MODE.
        The "really light cyan" Sam saw was actually the .ok-breath
        animation peak — rgba(74,222,128,0.95) — on solved blank cells
        when no unsolved equations are touching them. The animation
        keyframes are written by _writePulseKeyframes (hardcoded green
        RGB). Made theme-aware: light mode uses rgba(22,101,52,...)
        for a deep hunter green. Also call _writePulseKeyframes from
        _applyTheme so the keyframes get rewritten on theme toggle.

     3) DEEPER GREEN PALETTE for light mode.
        Bumped from forest #15803d to hunter #166534. _P map values:
          green06   0.10 → 0.12
          green20   0.28 → 0.30
          green25   0.32 → 0.35
          greenText #15803d → #166534
          greenTextDim 0.55 alpha kept

     5) BANK TILE TEXT/BORDER LIGHT-MODE OVERRIDES.
        The .bt CSS rule hardcodes `color:#c8c8d0` (light gray) and
        `border:rgba(0,217,255,0.5)` (neon cyan). On cream both read
        washed out. Added body.light-mode .bt rule with !important:
          color: #2a2418  (dark brown-near-black)
          border-color: rgba(14,116,144,0.55) (deep teal)
          box-shadow: rgba(14,116,144,0.15) inset
        !important needed to beat applyTileColor's inline border
        shorthand on uncolored tiles.

     Remaining for next pass (not addressed this version):
       - Mini-number badges on tiles (._btMiniNum) hardcode #0093aa.
         Probably still OK on cream but worth checking.
       - Win card, settings panel, splash, modals not yet themed.
-->

<!-- Equil v4.48 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.48: Light mode (first pass) + theme toggle button.

     PER SAM:
     "Make a light mode toggle. Her version was yellowish off-white.
      Still force testers to try this new dark version first. Toggle
      button shows sun in dark mode (tap for light), moon in light
      mode (tap for dark). Centered above tile bank, right of UNDO.
      Make button push sound on tap."

     PALETTE (warm parchment / cream feel):
       bg            #0f0f0f → #f4ecd8 (cream)
       bg-secondary  #1a1a1a → #ede4cc (deeper cream)
       bg-tertiary   #151515 → #e6dcbe (deepest cream)
       text-primary  #f0f0f0 → #2a2418 (dark brown-tinted near-black)
       text-secondary#b0b0b0 → #5a5040 (warm gray)
       cyan          #00d9ff → #0e7490 (deep teal)
       magenta       #c400ff → #7c3aed (deep purple)
       green         #2afc8a → #15803d (forest)
       red           #ff2a55 → #b91c1c (brick)

     IMPLEMENTATION:
     1) Light-mode CSS variables defined under body.light-mode. The
        existing variable system (--bg, --bk, --br, etc.) themes
        automatically.
     2) Inline-styled cell colors converted to a per-render() palette
        map (_P) that picks dark or light values based on
        window._lightModeOn. ~25 color references in render() are
        now theme-aware.
     3) Lattice CSS gets a body.light-mode override (deep teal at
        0.18 alpha vs neon cyan at 0.32).
     4) Toolbar buttons (UNDO, theme, TIMES, COUNTS) get inline-style
        overrides via body.light-mode selectors with !important.

     TOGGLE BUTTON:
     - <button id="themeToggle"> in the toolbar row above bank,
       centered between UNDO and TIMES/COUNTS.
     - Sun icon (☀) in dark mode, moon icon (☽) in light mode.
     - Same pill styling as UNDO so the row reads as a coherent strip.
     - Click → playUIClick() + toggle + localStorage save.

     PERSISTENCE:
     - Separate localStorage key 'equil_theme' (string 'dark'|'light').
       Kept out of equil_opts_v2 because theme is a more global setting
       and shouldn't trigger full opts re-save on toggle.
     - Default: 'dark'. Testers see the polished dark version first
       and must opt into light explicitly.

     SCOPE (first pass):
     Main play surface (grid, cells, bank, masthead, toolbar) themes
     fully. Modals, win card, settings panel, splash, particle colors
     may still read as dark-on-cream in spots — those need follow-up
     polish. The framework is in place; subsequent versions can pick
     off the remaining inline color sites.
-->

<!-- Equil v4.47 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.47: Pace stats labels replace pace rings as default feedback;
     defaults flipped per testers (high contrast on, lattice off,
     pace rings off).

     PER SAM:
     "Change default to high contrast on, and grid lattice off. It
      really is just easier to play that way. And also turn off the
      timer lines, they are distracting. Maybe keep them around just
      in case, but I think something better would just to have a best
      time, average time, and least worst time displayed by the timer,
      and each one grays out when you get past it."

     NEW: PACE STATS
     New element #paceStats sits where the ghost bar used to live
     (right below the timer row). Shows three time targets in a
     single line: "BEST 0:15 · AVG 0:23 · WORST 0:31"
     Color-matched to the pace ring palette so the two feedback modes
     stay visually consistent if anyone enables both:
       best  → magenta  (#c400ff)
       avg   → bright cyan (#00ffff)
       worst → dark cyan (#4a8fa0)
     Each label drops to 0.25 opacity ("grayed out") when elapsed
     passes its target. Passed targets stay visible so you can still
     see what you beat.

     Stats are gated by count exactly like pace rings:
       count 1: best only
       count 2: best + worst
       count 3+: best + avg + worst
     Separators between stats auto-hide if a neighboring stat is empty.

     New IIFE adds _initPaceStats / _updatePaceStats on window. Hooks
     into all four _initPaceRings call sites + _applyTuning, and into
     _renderTimer's per-tick update alongside _updatePaceRings.

     The ghost-runner bar and its "Best time: X:XX" label are hidden
     via inline style display:none. The machinery (_initGhostBar /
     _updateGhostBar, state, CSS) is intact — to revive, remove the
     inline display:none and toggle the visibility-vs-display logic.

     DEFAULTS FLIPPED:
       paceRings:    true   → false   (replaced by pace stats)
       highContrast: false  → true    (cell borders read clearly)
       showLattice:  true   → false   (lattice was the main legibility
                                       complaint from older testers)
     New default added:
       paceStats:    true            (the new feedback mode)

     UI:
     New "Pace stats" section in the options panel above "Pace rings".
     Single "Show pace stats" toggle. Pace rings section stays as-is
     for users who liked the rings.

     Reset button also resets paceStats to default.
-->

<!-- Equil v4.46 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.46: Legibility Path B — quick contrast fixes before the full
     light mode in a later version.

     PER SAM:
     "Two testers in 60s/70s. One says it's too dark, the other found
      it hard to tell empty cells from grid lattice. Start with Path B
      (high-contrast toggle + lattice toggle), then build full light
      mode later."

     ROOT (visual hierarchy bug):
     - Lattice gridlines: rgba(0,217,255,0.32) — alpha 0.32
     - Blank-cell borders: rgba(0,217,255,0.25) — alpha 0.25
     The lattice was BRIGHTER than the cell borders that defined empty
     cells, so testers couldn't tell which squares were actual cells
     vs grid pattern. Fixing this required either reducing lattice
     alpha, increasing border alpha, or both.

     NEW SETTINGS SECTION: "Legibility" (default open, near top of
     options panel just above Audio):
       - "High contrast" toggle (default OFF — preserves existing look)
         When ON:
           * blank-cell border alpha: 0.25 → 0.6
           * given-number text: #d8d8d8 → #ffffff
           * given-cell bg alpha: 0.10 → 0.18
           * lattice opacity: 1.0 → 0.4
       - "Show grid lattice" toggle (default ON)
         Master switch that hides the lattice gridlines entirely.
         Independent of high contrast.

     PERSISTENCE:
       - DEF.highContrast=false, DEF.showLattice=true.
       - Load/save handlers in equil_opts_v2.
       - Reset button restores defaults.

     PLUMBING:
       - _applyTuning sets window._highContrastOn and window._showLatticeOn,
         applies lattice display/opacity directly to the DOM, then
         calls window.render() (newly exposed) so cell borders
         re-render.
       - window.render added at top-level so the options IIFE can
         reach it cross-scope.
       - Cell render code reads window._highContrastOn at draw time:
         blank-cell border alpha and given-cell colors switch based
         on the flag.

     This is intentionally NOT a theme — just a contrast adjustment.
     Full light mode (white bg, dark elements, brand-respectful palette)
     in v4.47+.
-->

<!-- Equil v4.45 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.45: Bluetooth/wireless audio latency compensation.

     PER SAM:
     "Is there any way to adjust for if there are blue... Bluetooth
      headphones in since there's a little bit of a delay to kind of
      start some of the audio in advance? for the victory sound or
      when the victory sign pops up, make it go a little bit earlier
      so that it shows up right when the victory sign pops up."

     APPROACH:
     Web Audio's AC.outputLatency reports actual output latency in
     seconds. Bluetooth typically reports 40-200ms; wired/built-in
     reports 5-15ms. We use the latency value itself as the signal
     (no Bluetooth-specific detection — privacy-restricted anyway,
     and this catches AirPlay/HDMI/etc too).

     Strategy:
       - INPUT-triggered sounds (tap/drag tiles, UI clicks, errors):
         not compensated. The latency is baked in regardless of when
         we schedule. Visual feedback has its own delay so they
         feel mostly aligned anyway.
       - SCHEDULED sounds tied to a known visual event:
         * win wave per-tile pops — audio fires `comp` ms before
           visual burst so they land in sync
         * post-wave fanfare→win card — card pop delayed by `comp`
           ms so it lands on actual audio finish

     HELPER:
     _audioCompensateMs() — returns compensation in ms, or 0 if:
       - user disabled the feature
       - AC.outputLatency missing/zero (some browsers don't report)
       - reported latency < 20ms (wired output, no help needed)
     Clamped to 250ms max.

     UI:
     New "Audio" section in the options panel between "Tile
     interaction" and "Debug — snap tuning":
       - "Latency compensation" toggle. Default ON. Persists in
         equil_opts_v2 alongside other options.

     The toggle reads in _applyTuning, exposed as
     window._audioCompensateOn. _audioCompensateMs() checks this at
     every call so toggling takes effect immediately.
-->

<!-- Equil v4.44 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.44: Restored the dark CS×CS wrapper bg behind op/eq/given pills.

     PER SAM:
     "I realize we need those containers back, or was it wrappers,
      that the cells were on. The things I thought were borders on the
      cells. I realize when placing some tiles it feels empty now
      without that there, and also the cells are not lined up perfectly
      in the lattice."

     ROOT:
     v4.37 removed the wrapper bg (Sam had misread it as black borders).
     But the wrapper served two purposes:
       1) Visual frame — each cell occupied a full CS×CS dark slot
          aligned with the lattice gridlines. Without it, the rounded
          pill floated inside the slot with empty corners showing
          background, reading as misalignment.
       2) Tactile presence — placing a tile felt anchored when there
          was a visible slot to drop into.

     FIX:
     Restored the conditional wrapBg = 'background:var(--bk);' for
     cell.role==='op'/'eq'/cell.isGiven (line ~19523). Inner rounded
     pills sit inside the dark CS×CS wrapper as colored chips, same
     as pre-v4.37. Blank cells continue without a wrapper bg since
     their cyan border defines the slot.
-->

<!-- Equil v4.43 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.43: Pace ring settings exposed in the options panel.

     PER SAM:
     "Put the fuses back on, add settings in the global settings for
      to turn on and off pace rings, to turn on and off the fuse glow,
      and also a slider to adjust opacity of pace rings."

     NEW OPTIONS PANEL SECTION: "Pace rings"
       - "Show pace rings" toggle (master on/off for the system).
         When on, contains a sub-slider: "Ring opacity" (0.10–1.00).
       - "Fuse glow" toggle (the bright square riding each ring's
         erasing front).

     PERSISTENCE:
       - Added paceRings/paceFuses/paceRingOpacity to DEF.
       - Load/save handlers added in equil_opts_v2 localStorage key.
       - Defaults: paceRings=true, paceFuses=true, paceRingOpacity=0.4.

     PLUMBING:
       - _applyTuning sets window._paceRingsOn, _paceFusesOn,
         _paceRingOpacity from the opt values, then calls
         _initPaceRings so toggles take effect mid-puzzle.
       - _initPaceRings checks window._paceRingsOn at the top and
         exits early if false.
       - Fuse setup checks window._paceFusesOn (replaces the
         hardcoded _FUSES_ON flag from v4.42).
       - Each active ring gets its stroke-opacity attribute set from
         window._paceRingOpacity on init.

     Reset button also resets the three new prefs to defaults.
-->

<!-- Equil v4.42 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.42: Fixed rings being clipped at viewport edges + disabled
     fuse squares for a cleaner look.

     PER SAM:
     1) "half of avg and all of worst ring get eaten up on left and
         right edges of my phone."
     2) "can we try it without the glowing ends now that they aren't
         competing with the cells. I want to see if maybe they are
         still pretty easy to pick up on without the extra highlight."

     FIXES:
     1) RING CLIPPING AT SCREEN EDGE.
        Root cause: v4.41 made grid-clip 16 px wider than the original
        grid (8 px gutter on each side). On puzzle sizes where the
        grid was already near viewport width (Small/Medium and up),
        this pushed the gutter past .gscroll's overflow:hidden edge,
        clipping the rings on left/right.
        Fix: getCellSize() now subtracts an additional 16 px from
        available width (line ~16713), so cells shrink slightly on
        affected sizes to leave room for the gutter. Net result:
        rings now stay within viewport on all sizes.

     2) FUSES DISABLED.
        Added _FUSES_ON = false flag at top of the pace rings IIFE.
        All fuse setup/positioning code in _initPaceRings and the
        fuse SVG itself short-circuit on this flag. To revive: set
        _FUSES_ON = true and the markup/JS are otherwise intact.

     If rings are still hard to track on Sam's eye-test, we can:
       (a) bump ring stroke-opacity from 0.4 → 0.6 for more contrast
       (b) flip _FUSES_ON back to true
-->

<!-- Equil v4.41 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.41: Grid gutter so pace rings sit JUST OUTSIDE the cells.

     PER SAM:
     "Is there any way we can just shrink the grid down a little and
      have the pace rings just kissing the outer edge of the cells?"

     APPROACH:
     Instead of shrinking the grid, kept the grid the same size and
     enlarged grid-clip by 8 px on each side (GUTTER=8). Made grid-clip
     a flex container that centers the grid in the enlarged box. The
     pace rings sit at grid-clip's outer edge, which is now 8 px
     outside the grid → "just kissing" the outer edge of cells from
     OUTSIDE rather than overlapping cells.

     CHANGES:
     1) grid-clip sized to (gridW+16) × (gridH+16) instead of grid
        exact extent.
     2) grid-clip given display:flex, align-items+justify-content:center
        so the grid sits centered.
     3) Lattice positioned inline with left/top/right/bottom = 8px so
        it fills only the cell area, not the gutter. Pattern still
        aligns with cell boundaries.
     4) Lattice clip-path:inset(3px) removed from CSS — no longer
        needed since rings don't overlap lattice.
     5) Pace ring SVG z-index 1 (above .gscroll bg), fuse SVG z-index
        2. Neither needs to be behind cells anymore.
     6) Reverted v4.40's cell opacity 0.7 → back to opaque var(--bk)/
        var(--bg). No need for translucent cells since rings don't
        sit behind them.

     Net visual: cells fully opaque and crisp; rings sit in a clean
     8-px band outside the cells, no overlap, fully visible; lattice
     still inside the cell area aligned to cell boundaries.
-->

<!-- Equil v4.40 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.40: Fuses pushed behind cells, cells made 70% opaque so rings
     + fuse glow subtly visible through cell pixels.

     PER SAM:
     "Okay, now put them under the cells in z, same as pace lines.
      I think if we can somehow make the cells like .7 opacity maybe,
      that might be enough to track the bright light under it but not
      feel weird that its just some light going over it."

     CHANGES:
     1) #paceRingFuses SVG z-index changed from 2 → -1. Now sits at
        the same z-level as #paceRings, both behind .grid-clip.
     2) Cell background alpha lowered from 1.0 to 0.7 by swapping the
        opaque base color from var(--bk)/var(--bg) to rgba(*,0.7):
          - blank cells: var(--bg) → var(--bg)
          - op/eq/given pills: var(--bk) → rgba(21,21,21,0.7) (5 sites)
        Text and borders are untouched — only the background alpha
        changes, so puzzle readability stays the same.

     Net effect: cells read as nearly-opaque tiles against the dark
     bg, but the moving fuse light and ring stroke are subtly visible
     through them — enough to track motion without feeling like
     bright lines are running across the puzzle face.
-->

<!-- Equil v4.39 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.39: Fuse shape simplified per Sam — "make each of them the same
     size as the actual lines, and just square. So basically just like
     the very end of the line is bright."

     CHANGES:
     1) Markup: <circle r=2.5> + feGaussianBlur filter REPLACED with
        <rect width=2 height=2>. No filter — just a flat square the
        same size as the stroke (stroke-width:2). Full opacity same
        color as the ring's stroke (rings paint at 0.4 stroke-opacity,
        the fuse fills at 1.0 fill-opacity), so the fuse reads as a
        bright accent on the erasing end.
     2) JS: cx/cy attribute updates changed to x/y, with a -1 offset
        on both axes to center the 2×2 box on the perimeter point.
        Otherwise positioning logic is unchanged.

     Visual result: the very end of the line that's currently being
     erased glows brightly — looks like the line is extinguishing
     from a lit tip, with no halo extending into surrounding pixels.
-->

<!-- Equil v4.38 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.38: Glowing "fuse" dot rides the erasing front of each pace
     ring, making the lines easier to track behind the cells.

     PER SAM:
     "Im still having a little trouble tracking the lines behind cells.
     Let's try adding a bright glowing light at the end that is erasing
     the ring. Like a fuse that is lit."

     IMPLEMENTATION:
     - New <svg id="paceRingFuses"> sibling of #paceRings, at z-index:2
       (above .grid-clip so dots are visible OVER cells, while the
       rings themselves stay at z-index:-1 behind cells). Same px
       coordinate space as #paceRings.
     - Three <circle> fuses, one per ring, colored to match its ring:
         worst → #4a8fa0 (dark cyan)
         avg   → #00ffff (bright cyan)
         best  → #c400ff (magenta)
       Each has a feGaussianBlur+feMerge filter for a glow halo.
     - JS: per-ring geometry (rx, ry, rw, rh) is captured during
       _initPaceRings. _pointOnRect() converts progress 0..1 to an
       (x,y) point on the rect's perimeter starting top-left and
       going clockwise. _updatePaceRings sets the fuse's cx/cy each
       frame in addition to the existing stroke-dashoffset update.
     - When a ring reaches done state, its fuse also gets hidden.

     The dot itself is r=2.5 px solid color, with a Gaussian-blurred
     halo merged on top to give it the lit-fuse glow look. The halo
     extends well beyond the dot so the eye picks up "moving point
     of light" even when the dot is over a cell.
-->

<!-- Equil v4.37 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.37: Restored blank-cell cyan border + removed the dark wrapper
     bg around non-blank cell pills.

     CORRECTING v4.36 MISREAD:
     I interpreted Sam's "black borders on cells" as the cyan borders
     on blank cells and removed those. Wrong. The "black borders" he
     meant are the DARK SQUARE wrappers behind the rounded pills on
     op/eq/given cells — the var(--bk) bg that shows in the corners
     around the rounded pill. Restored cyan border on blank cells,
     removed wrapper bg on the others.

     CHANGES:
     1) Blank-cell cyan border restored.
        else _bord='border:1px solid rgba(0,217,255,0.25);';

     2) gc wrapper bg always transparent.
        Previously op/eq/given cells got 'background:var(--bk);' on
        the wrapper to mask the pace boxes from showing through the
        translucent pill rgba. Now wrappers are transparent for all
        cell types — pills float against puzzle bg.

     3) Op, eq, and given pill backgrounds rewritten to layer over
        var(--bk). Same trick used for blank cells in v4.36:
          background: linear-gradient(rgba,rgba), var(--bk);
        The rgba tint becomes a gradient layer composited over an
        opaque base, so pills are visually identical to before but
        no longer let pace rings show through cell pixels.

     Net result: black squares around rounded pills are gone; pills
     still appear with their original color tints; rings still
     correctly masked behind every cell type, visible only in
     inter-cell gaps.
-->

<!-- Equil v4.36 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.36: Two fixes.

     1) BLANK-CELL MASKING ACTUALLY WORKS NOW.
        v4.35's attempt used `background:`+bg+`, var(--bg)` which is
        INVALID CSS — the `background` shorthand accepts only one
        color value; subsequent comma-separated values are treated as
        background IMAGES (gradients/urls), not colors. Browser
        silently ignored the second value and the rings still showed
        through cell pixels.

        Fix: wrap the rgba tint in linear-gradient() to make it a
        background-image layer that composites correctly over an
        opaque var(--bg) base:
          background: linear-gradient(rgba,rgba), var(--bg);
        The 'transparent' default case shortcuts to just 'var(--bg)'.

     2) DEFAULT CELL BORDERS REMOVED.
        Per Sam: "Can you also get rid of black borders on cells, I
        want to see what that looks like. ...they cover up most of
        the pace lines." Removed the
          'border:1px solid rgba(0,217,255,0.25);'
        that was on every non-selected, non-solved blank cell.
        Selected (purple) and solved (no border) states unchanged.

        Net result: cells now read as floating tinted rectangles via
        their bg color, no outline. Rings show through inter-cell
        gaps without an additional 2 px of border blocking the view.
-->

<!-- Equil v4.35 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.35: Two surgical changes per Sam.

     1) BLANK CELLS NOW MASK PACE RINGS.
        Pace rings live at z-index:-1 inside .gscroll (v4.34). Cells
        compositied on top, but blank cells had rgba/transparent
        backgrounds — rings showed through. Fix: layered every blank
        cell's bg over an opaque var(--bg) baseline in the cssText
        assignment (line 19273). Multi-background syntax means the
        rgba tint composites on top of opaque bg, masking the ring
        underneath the cell pixels but keeping the rgba tint visible.

        Rings now only show through the 1 px gaps BETWEEN cells —
        the "cracks" Sam asked for.

     2) BEST TIME LABEL NO LONGER PUSHES CONTENT DOWN.
        Previously the swap from #mastGhost (3px bar) to
        #mastGhostLabel (~12px text) at best-time-hit pushed
        everything below down by ~9 px. Fix:

        a) #mastGhostLabel CSS changed display:none → visibility:hidden.
           Element now reserves its full vertical space from the start
           but is invisible until best-time-hit.
        b) Placeholder &nbsp; content added to the label in markup so
           the box has its natural line-height even before real text.
        c) JS: _initGhostBar resets label.textContent to '\u00a0' (nbsp)
           and label.style.visibility='hidden'. The best-time-hit branch
           in _updateGhostBar sets bar.style.visibility='hidden' (NOT
           display:none) so the bar's 3 px row also stays in layout —
           then label.style.visibility='visible' to reveal it.

        Net: total reserved height stays at bar(3) + label(~12) = 15 px
        throughout the puzzle. The swap at best-time-hit changes WHICH
        of the two is visible, but the layout doesn't shift.
-->

<!-- Equil v4.34 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.34: Pace rings moved behind cells in z-depth, opacity bumped.

     PER SAM:
     "Now, just put those pace lines behind cells in z, so we just see
     them through the cracks, maybe that will be enough. Bump up their
     opacity to .4 though."

     CHANGES:
     1) Pace rings SVG z-index dropped from 1 to -1.
        With this change, rings paint BEHIND .grid-clip (and thus
        behind all the cells). They show through:
          - The 1px gaps between cells (background is transparent)
          - The partially-transparent cell backgrounds (rgba alpha
            values of 0.05-0.25 typically)
        Net effect: rings appear as subtle "glow" along grid lines
        rather than as bold overlays on top.

     2) stroke-opacity bumped 0.2 → 0.4.
        Compensates for the partial occlusion now that cells are on
        top. At 0.2 with cells covering most of the ring area, the
        rings would have been nearly invisible. 0.4 keeps them
        readable through cell pixels.

     3) .gscroll given z-index:0 to establish a stacking context.
        Without this, the SVG's z-index:-1 would escape into body's
        root context (because .gscroll had position:relative but no
        explicit z-index, which doesn't make a stacking context).
        The rings would have paint behind .gscroll's background and
        be invisible. z-index:0 contains them properly.
-->

<!-- Equil v4.33 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.33: Grid-clip sized to match actual cell extent.

     PROBLEM (per Sam testing v4.32):
     - Lattice still extended past the cells on right/bottom
     - Pace rings overlapped cells on left, off cells on right
     - Both symptoms pointed to the same root: cells were left-aligned
       within a grid-clip that was wider than the cells, leaving
       asymmetric empty space on right/bottom

     ROOT CAUSE:
     The gridW/gridH formula:
       gridW=cols*CS+(cols-1)+2+6
     included +2 px for the .grid 1px borders on each side. v4.31
     removed that border, so the +2 became excess width. Plus +6
     headroom for subpixel rendering. Total: 8 px of empty space on
     right and bottom, since cells sit flush at top-left of grid-clip.

     FIX:
     Simplified gridW=cols*CS+(cols-1) and gridH=rows*CS+(rows-1).
     No border allowance, no headroom. grid-clip now matches the
     actual cell extent exactly.

     This should fix:
     - Lattice no longer extends past cells
     - Pace rings now align with grid edges symmetrically
     - The 2 leftover edge lines from v4.32 (which were the lattice
       extending past cells into empty headroom space)
-->

<!-- Equil v4.32 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.32: Fixed lattice alignment that broke when v4.31 removed
     .grid's 1px border.

     PROBLEM (per Sam testing v4.31):
     - On Jumbo puzzle the lattice grid was visibly offset by 1px
       from where cells actually sit — most apparent because Jumbo
       has many cells and the misalignment compounds visually.
     - Small/Medium showed the same offset but it was less obvious.

     ROOT CAUSE:
     The lattice's `backgroundPosition='1px 1px'` (set in JS at
     line ~19024) was compensating for the .grid element's 1px
     border that pushed cells 1px inward from the grid's outer edge.
     v4.31 removed that border (it was the perimeter line we were
     chasing). With border gone, cells now start at 0px, but the
     lattice was still offset by 1px → 1px misalignment everywhere.

     FIX:
     Changed lattice backgroundPosition from '1px 1px' to '0px 0px'.

     REMAINING ISSUES TO INVESTIGATE (next iteration):
     - Sam reported 2 lines on lower edge and right edge of grid
       in Small/Medium even after pace lines erase. May be interior
       lattice lines that look like edge lines because surrounding
       cells are empty; may resolve with this v4.32 alignment fix,
       or may need separate investigation.
     - Pace rings didn't appear at all on Jumbo. Possibly because
       puzzle was brand new with no stats history.
-->

<!-- Equil v4.31 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.31: FOUND THE CULPRIT and restored everything else.

     The faint perimeter cyan rectangle that survived v4.24-v4.30
     diagnostic eliminations was an inline border:1px solid
     rgba(0,217,255,0.12) being set on the .grid element via
     `grid.style.cssText='...border:1px solid rgba(0,217,255,0.12);'`
     at line 18975. This cssText is reassigned on every grid render,
     clobbering the CSS rule .grid{border:none} that v4.24 had added
     to remove the same border. The CSS rule was correct; the JS was
     overriding it on every redraw.

     v4.31 FIX:
     Dropped the `border:1px solid rgba(0,217,255,0.12)` segment from
     the grid.style.cssText assignment. The grid frame perimeter line
     is now actually gone.

     RESTORED FROM DIAGNOSTIC:
       - Lattice (was hidden in v4.26)
       - Pace rings init/update calls (commented out in v4.27)
       - Pace rings SVG inline style (gutted in v4.29)
       - .gscroll inset box-shadow (removed in v4.29)
       - Cell borders rule (overridden in v4.30)

     KEPT FROM DIAGNOSTIC (per Sam's preference):
       - #gridEdgeMask div removed (v4.28) — Sam said "we can keep
         that thing off"

     With the actual culprit found, the lattice's perimeter cyan
     lines from v4.24's clip-path:inset(3px) are still clipped 3px
     inward, but now there's no .grid border interfering with the
     pace rings either. The full ring system should work cleanly.
-->

<!-- Equil v4.30 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.30: Diagnostic — all cell borders killed via !important.

     Every cell has an inline `border:1px solid rgba(0,217,255,0.25)`
     set in JS at line ~18946. To override without touching that JS
     logic, added a CSS rule:
       .grid [data-cell-key]{border:none !important;}

     This wins over the inline style. All cells will have no borders
     at all — they'll look like floating numbers/operators with no
     boxes. The point is purely diagnostic: if perimeter lines are
     gone, cell borders are the source. If still there, the source
     is something else entirely.

     Reverting: remove the !important rule.
-->

<!-- Equil v4.29 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.29: Two more diagnostic eliminations.

     1) pace ring SVG stripped of all inline geometry styles, only
        display:none !important and visibility:hidden remain. Wanted
        to rule out the SVG element somehow leaking visible geometry.

     2) .gscroll inset box-shadow removed. The original CSS had:
          box-shadow:0 0 4px rgba(0,217,255,0.12),
                     inset 0 0 3px rgba(0,217,255,0.04);
        The inset portion (3 px cyan at 4% opacity) would paint a faint
        cyan rectangle inside the .gscroll element. But .gscroll spans
        full screen width while the lines are at grid-edge — so this
        is unlikely to be the source. Still worth checking.

     Lattice off, pace rings disabled and SVG hidden, gridEdgeMask
     removed, gscroll inset glow removed.

     If lines persist with all of the above off, next candidates are:
       - cell borders themselves
       - some other element painting at grid-clip boundary
       - browser sub-pixel rendering at edges
-->

<!-- Equil v4.28 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.28: Diagnostic — gridEdgeMask removed.

     Sam noticed in v4.27 testing that cells were getting clipped at
     the top and left edges (just a sliver). That clipping is the
     #gridEdgeMask div I added in v4.25 doing its work — it's a 3-px
     border-only div in the page background color, positioned absolute
     inset:0 inside .grid-clip, intended to mask cell borders at the
     perimeter. But:
       1. It was clipping cell content along with cell borders, and
       2. Its bg-color border was likely also the source of the faint
          perimeter lines (subpixel rendering of #0f0f0f against #0f0f0f
          can produce a visible seam on some displays/browsers).

     With gridEdgeMask removed, expected results:
       - Cells should no longer be clipped at top/left
       - The faint perimeter lines should disappear
       - Cell borders themselves will still be visible at the
         perimeter, but those are not the lines Sam was seeing

     Lattice still hidden (v4.26), pace rings still disabled (v4.27).
     Reverting: paste back the gridEdgeMask div per the comment in
     the markup.
-->

<!-- Equil v4.27 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.27: Diagnostic — pace rings fully disabled (no init, no tick).

     Sam's testing of v4.26 (lattice hidden) showed faint lines still
     present on the grid perimeter, varying which sides they appeared
     on depending on the puzzle (bottom+right on Small Medium, top+
     right on Jumbo). To isolate whether those lines come from the
     pace ring system itself, this version turns off pace rings too.

     This way Sam can see the puzzle with:
       - lattice: hidden (v4.26)
       - pace rings: disabled (v4.27)
       - pace boxes: still disabled (v4.20)
       - gridEdgeMask: still present
       - cell borders: still present
       - .grid border: still removed (v4.24)

     If the lines persist with rings off, source is gridEdgeMask or
     cell borders. If they go away, source is the rings.

     Reverting: uncomment the five `_initPaceRings` / `_updatePaceRings`
     call sites (search for v4.27 in the file).
-->

<!-- Equil v4.26 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.26: Diagnostic — entire lattice hidden via display:none.

     Sam's confirmation that the faint perimeter lines are the lattice
     means the v4.24 clip-path:inset(3px) isn't doing enough work.
     Rather than guess at the right amount of inset or alternative
     masking strategy, this version turns the lattice off entirely
     so we can verify the lines actually disappear. Once confirmed,
     the next iteration can either:
       (a) leave the lattice off if Sam likes the cleaner look, or
       (b) re-enable it with a more aggressive masking approach
           (larger inset, different clipping strategy, or background
           shift), now that we know exactly what we're targeting.

     All other lattice CSS is preserved below the display:none rule.
     Reverting is a one-line change.
-->

<!-- Equil v4.25 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.25: One more attempt at killing the perimeter cyan lines.

     WHAT WAS STILL VISIBLE AFTER v4.24:
     The perimeter cells' own borders (border:1px solid rgba(0,217,
     255,0.25) — set inline on every cell at render time, line ~18946).
     Each cell has its own faint cyan outline. The OUTER borders of
     the cells in the first/last row and first/last column form a
     thin rectangle around the entire grid — that's what was still
     showing in Sam's v4.24 screenshot.

     v4.24 cleared the lattice's outer lines and the .grid border,
     but cell borders were still painting.

     v4.25 FIX:
     New element #gridEdgeMask: a 3-px-wide border-only div with the
     page background color, positioned absolute inset:0 inside .grid-
     clip at z-index:2.
       - Cells live at z-index:1, so the mask paints OVER cell borders
         in the outer 3-px band.
       - Pace rings (#paceRings, sibling of .grid-clip in .gscroll at
         z-index:1) paint OVER the entire .grid-clip composited layer,
         so the rings sit on top of the mask.

     Z-stack inside .grid-clip (top to bottom):
       #gridEdgeMask  (z-index:2) — bg-color border, masks cell edges
       .grid + cells  (z-index:1)
       .grid-lattice  (z-index:-1) — already inset-clipped 3px in v4.24

     At the .gscroll level (top to bottom):
       #paceRings     (z-index:1) — visible rings
       .grid-clip     (z-index:0) — everything else

     The 3-px mask width matches the lattice clip-path inset from
     v4.24 so both masks are the same band. Trade-off: perimeter
     cells lose 3 px of their outer edge. Cell content (numbers,
     operators) is centered and well clear of that band, so this
     should be visually invisible.

-->

<!-- Equil v4.24 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.24: Proper fix for the lattice-fighting-pace-rings issue.
     Sam's screenshot from v4.23 still showed thin cyan lines around
     the entire perimeter at 0:41 (when all pace rings had long since
     erased) — meaning the v4.23 inset box-shadow attempt was not
     masking anything.

     ROOT CAUSE OF v4.23's FAILURE:
     `.grid-clip` has `position:relative; z-index:0` which establishes
     a new stacking context. Inside that context, the lattice's
     `z-index:-1` does NOT push it behind the parent's background —
     it just places it below z-index:0 siblings within the same
     context. So the lattice was painting ABOVE the box-shadow layer,
     not below it. The mask had nothing to mask.

     v4.24 PROPER FIX (two changes):

     1) clip-path:inset(3px) ON THE LATTICE ITSELF.
        Doesn't rely on stacking context tricks — the lattice simply
        doesn't paint in its outer 3 px. Interior lattice lines
        unchanged.

     2) .grid border REMOVED.
        Was border:1px solid rgba(0,217,255,0.12) — a separate faint
        cyan frame at the grid's outer edge. Even at 0.12 alpha it
        contributed to the perimeter line visible in the screenshot.
        Cells render their own borders/backgrounds independently, so
        the removal has no functional impact.

     The v4.23 inset box-shadow attempt is reverted (it wasn't doing
     anything useful; left in CSS would just be a dead treatment).
-->

<!-- Equil v4.23 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.23: Masked the lattice's outermost grid lines so the pace
     rings have a clear visual lane at the grid edge.

     PROBLEM (per Sam):
     The lattice's outer-edge cyan lines (.grid-lattice background-
     gradients paint 1-px stripes at x=0 and y=0 plus every CS+1
     interval after) sit exactly where the pace ring strokes live.
     Both elements are cyan-tinted in that band, and the lattice was
     "fighting" the rings visually — making the rings hard to read.

     APPROACH:
     Add inset box-shadow:inset 0 0 0 3px var(--bg) to .grid-clip.
     This paints a 3-px-wide band of the page background color along
     the inner edge of grid-clip.

     Z-STACKING LOGIC:
       1. .grid-lattice paints first (z-index:-1 — escapes into the
          .grid-clip stacking context, sits BEHIND the parent's
          background and box-shadow).
       2. .grid-clip's inset box-shadow paints ON TOP of the lattice
          in the outer 3-px band.
       3. .grid (z-index:1) and its cells paint after, but the
          perimeter cells lose at most 3 px of their outer transparent
          margin — cell content is centered and well clear of that band.
       4. #paceRings (z-index:1) paint LAST, fully visible against
          the now-clean band.

     The interior lattice lines (cell boundaries at all the non-edge
     positions) are unchanged — the mask only kills the outer 3 px.

-->

<!-- Equil v4.22 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.22: Pace rings tightened to touching, outset zeroed.

     OUTSET → 0.
     v4.21's 5 px outset was still getting clipped on Large/Hard
     puzzles where the grid runs nearly flush with .gscroll. Rather
     than fight .gscroll's overflow:hidden (which is intentional
     for other clipping behaviors), the simpler fix is to sit the
     outermost ring AT the grid's outer edge instead of extending
     past it. Trade-off acknowledged: rings now sit just inside the
     grid bounds, overlapping the perimeter cells. At 0.2 opacity
     (v4.21) they should read as soft borders rather than visual
     noise.

     RING INSETS → 0/2/4 (touching).
     v4.21 had 0/4/8 inset spacing — visible gaps between the three
     rings. Sam wants them touching as one continuous 6-px-thick
     dissolving band. With 2 px strokes centered at insets 0/2/4,
     each stroke spans (inset-1) to (inset+1) px from the outer edge,
     so adjacent strokes share an edge with no visual gap. The total
     band reads as one coherent moving border rather than three
     separate orbits.

-->

<!-- Equil v4.21 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.21: Pace ring tweaks based on v4.20 testing.

     1) OUTSET REDUCED 10 → 5 px.
        On Large/Hard puzzles the grid extends to within a few px of
        .gscroll's full width, so the 10 px outset was getting
        clipped by .gscroll's overflow:hidden on the left and right
        edges. Top and bottom rings were fine (more vertical room
        from .gscroll's 16 px padding). 5 px is enough breathing
        room to sit just outside the grid line without bumping into
        gscroll's bounds even on the tightest fits.

     2) NEW COLOR PALETTE (per Sam):
          worst (outermost) → dark cyan  #4a8fa0
          avg   (middle)    → bright cyan #00ffff
          best  (innermost) → magenta    #c400ff
        Old amber/purple/cyan palette retired. Cyan family + magenta
        keeps the rings on-brand with the rest of the cyan-and-
        magenta UI, and the three values are visually distinct.

     3) STROKE OPACITY → 0.2.
        Old rings were fully opaque, which was still a bit louder
        than ideal once the colors changed. 0.2 opacity puts them
        firmly in the "ambient peripheral signal" category instead
        of grabbing attention. Opacity lives on stroke-opacity
        (rather than baked into the color) so the colors stay
        tweakable independently — e.g. flipping opacity to 0.4 for
        the last 20% of each ring's life (intensity ramp) would be
        a straightforward future addition if desired.

-->

<!-- Equil v4.20 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.20: Three pace-ring refinements based on v4.19 feedback.

     1) RING ORDER FLIPPED: worst is now OUTERMOST.
        v4.19 had best outermost (touching the grid edge). Sam's
        intuition is to put worst outermost — the "outer boundary
        you've already beaten" if you finish before it erases.
        Slowest-erasing ring sits in the most peripheral position;
        the eye naturally follows the action inward as time runs out.
        New layout (from outside in):
          Worst (amber) → Avg (purple) → Best (cyan)

     2) RINGS PUSHED OUTSIDE THE GRID.
        The SVG moved from inside .grid-clip to be a sibling within
        .gscroll. JS positions it to wrap .grid-clip with a 10 px
        outset on all sides, putting the rings in the .gscroll
        padding region (16 px top/bottom) just past the grid's edge.
        They no longer overlap any cells. The outset is JS-driven
        from gridClip.offsetLeft/offsetTop/offsetWidth/offsetHeight
        so it adapts to any puzzle size or screen.

        Trade-off considered: rings could have sat UNDER the cells in
        z-depth (Sam's fallback option), but that meant the outermost
        cell row/column would partially obscure them. Putting them
        outside the grid keeps them fully visible without competing
        with the playable cells.

     3) OLD PACE BOXES FULLY DISABLED.
        The four _initPaceBoxes call sites and the one _updatePaceBoxes
        tick call are now commented out. The functions themselves
        (definitions in lines ~19375-19440), the DOM (#paceBoxes), and
        the CSS classes (.paceBox-best/avg/worst) all remain in place
        per the no-machinery-removal principle. To revive the old
        inward-marching boxes:
          - uncomment the five call sites (search "v4.20" in the file)
          - hide #paceRings via CSS

-->

<!-- Equil v4.19 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.19: Replaced the pace BOXES with pace RINGS at the grid edge.

     PROBLEM:
     The pace box system (rectangles shrinking toward the grid center
     as time passed) was too distracting — they cut through the play
     area and competed with the equations for attention.

     SOLUTION:
     Three concentric rectangular STROKES around the grid edge that
     erase clockwise from the top-left corner. They sit at the
     periphery, never overlap the playable cells, and convey the
     same information (best/avg/worst time budgets vs your current
     elapsed time) much more subtly.

     RING POSITIONS:
       - Best   (outermost, touches the grid edge)   — soft cyan #7dd3e0
       - Avg    (middle, inset 4px from outer)        — soft purple #a78bfa
       - Worst  (innermost, inset 8px from outer)     — muted amber #f0b86e
     Colors match the existing pace box palette so users who had
     a mental model from the old system carry it over.

     ERASE DIRECTION:
     The visible stroke disappears starting at the top-left corner
     going CLOCKWISE around the rectangle. So the top edge erases
     left-to-right first, then the right edge top-to-bottom, then
     the bottom edge right-to-left, then the left edge bottom-to-top.

     ERASE PACE:
     Each ring erases over its own time budget. Best ring (shortest
     budget) erases fastest — you watch it disappear first. If you
     finish before a ring is fully erased, you beat that pace.

     IMPLEMENTATION:
     - SVG with three <rect>s inside .grid-clip, position:absolute
       inset:0, pointer-events:none. Painted on top of the grid
       (z-index:3) so the strokes sit above all the cells.
     - Each rect uses pathLength=100 so stroke-dashoffset works in
       0-100 percentages regardless of actual perimeter pixel length.
     - Erase animation: stroke-dasharray="100 100", stroke-dashoffset
       animates from 0 (full ring) to -100 (fully erased). NEGATIVE
       offset is what makes the FRONT of the path (top-left going
       clockwise) erase first; positive offset would erase from the
       END inward toward the start, which is the wrong direction.
     - rect dimensions set by JS at init time (reading grid-clip's
       getBoundingClientRect) so the rings fit the actual rendered
       grid size at any puzzle size or device.

     OLD MACHINERY:
     The pace box DOM (#paceBoxes), CSS classes (.paceBox-best/avg/
     worst), and JS functions (_initPaceBoxes / _updatePaceBoxes)
     are all kept in place per the no-machinery-removal principle.
     #paceBoxes stays display:none. The functions still run but
     operate on hidden DOM. Reverting to the old visual is just:
     flip #paceBoxes back to display:block, hide #paceRings.

     The new ring system parallels the old one in every way — same
     stats source (getGhostStats), same visibility gating by count,
     same preferences (window._paceBox.showBest/showAvg/showWorst),
     same tick cadence (called right after _updatePaceBoxes in _tick).

-->

<!-- Equil v4.18 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.18: Current-run moves and time on the win card switched from
     green (#4ade80) to cyan (var(--cyan), #00d9ff). Better palette
     consistency — green was carried over from the grid's "correct
     equation" coloring, but on the win card cyan reads as the
     primary brand color and harmonizes with the row labels and
     column headers. Magenta PB highlight unchanged: current-run
     values still tint magenta when this run set a per-template PB.

     The four spots updated:
       - Initial markup style="color:#4ade80" on winMoves and
         winTimer spans (changed to var(--cyan))
       - JS ternary in _showWinCard that toggles between PB-magenta
         and non-PB color (changed both branches' fallback to cyan)

     Other #4ade80 references in the file (grid cell correct-state
     coloring around lines 18640/18641/18720) are left alone — those
     are a different visual signal (equation solved correctly) and
     should stay green.

-->

<!-- Equil v4.17 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.17: OG image — bigger logo, single-line tagline.

     Logo width bumped from 380 to 520 px so it claims the right
     side of the canvas as the dominant element. Anti-positioning
     subtitle ("no coins. just the puzzle.") removed entirely; only
     "MATH CROSSWORD." remains below the logo. The result is a
     cleaner, more brand-forward composition that lets the screenshot
     do the explanatory work and the logo do the recognition work.

     DEPLOY: replace assets/og-image.png. Same caching notes apply.

-->

<!-- Equil v4.16 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.16: OG image tagline updated. Dropped "no hints." from the
     anti-positioning subtitle since Sam is considering adding hints
     in a future version. Tagline is now:
       MATH CROSSWORD.
       no coins.
       just the puzzle.

     Keeping "no coins" because the no-microtransaction stance is
     non-negotiable; "just the puzzle" stays as the through-line.
     Re-running build_og.py with the updated tagline regenerates the
     same composition (gameplay left, logo+tagline right), just with
     the trimmed copy.

     DEPLOY: replace assets/og-image.png with the new file. Caching
     notes from v4.15 still apply (Reddit/Discord/Facebook cache
     aggressively — fresh posts pick up the new image, old posts
     don't).

-->

<!-- Equil v4.15 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.15: OG image swapped from logo-only to gameplay+logo composition.

     RATIONALE:
     The v4.14 OG image was the Equil logo centered on black at the OG
     spec aspect ratio (1200x630). It was on-brand but uninformative —
     for Reddit specifically, where users scroll fast and "what is this
     puzzle?" is a stronger thumbnail hook than "what is this brand?",
     a gameplay shot answers the curiosity question instantly. Logo
     cards also tend to read as "an ad" in subreddit feeds.

     NEW COMPOSITION (built by /home/claude/build_og.py):
     - LEFT 45% of canvas: gameplay screenshot crop showing a Large/
       Hard puzzle mid-solve. Masthead and bank cropped out so it's
       pure grid; cyan border outline gives it some visual lift on
       the black background.
     - RIGHT 55%: Equil crystal logo at top, then a prominent cyan
       "MATH CROSSWORD." tagline in monospace, then the anti-
       positioning subtitle "no coins. no hints. just the puzzle."
       in a softer grey.

     The screenshot used was Sam's own gameplay (Large size, Hard
     difficulty, 16 moves in at 3:12, best time 1:54 — meaning it's
     genuinely mid-solve, not a contrived demo board).

     META TAGS: unchanged from v4.14. The filename assets/og-image.png
     is the same — we're just swapping the image content. This means
     no HTML edit is strictly required, but a re-scrape will be needed
     to clear caches:
       - Reddit / Discord / Facebook aggressively cache OG scrapes
       - For Reddit, the fix is delete + repost the link, not edit
       - For Discord, suffix the URL with ?v=2 once to force re-fetch
       - For first-time posts after deploy: just works.

     DEPLOY: replace assets/og-image.png in the Equil/assets/ folder
     with the new file. Then re-verify with https://www.opengraph.xyz/
     by pasting the equil.pages.dev URL — should show the gameplay
     card now.

-->

<!-- Equil v4.14 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.14: Open Graph + Twitter Card meta tags so link previews
     in Reddit / Discord / iMessage / X show the Equil logo and
     a short description instead of a bare URL.

     ASSET:
     - assets/og-image.png (240 KB). 1200x630 (Open Graph standard).
       Equil crystal-lettering logo centered on black background.
       Source was the 1072x960 logo art; placed at 85% of canvas
       height with black bleed on either side. Identical visual
       to the logo, just letterboxed to the OG aspect ratio so it
       previews correctly across all platforms.
     - Filename is lowercase to match GitHub Pages case-sensitivity
       and to match the existing assets/ naming convention.

     META TAGS (in <head>):
     - og:title, og:description, og:image, og:url, og:type, og:site_name
     - og:image:width / height / alt (helps some scrapers display
       at correct dimensions on first load)
     - twitter:card=summary_large_image and matching twitter:title /
       description / image
     - generic <meta name="description"> as a fallback for scrapers
       that don't read og: properties.
     - og:url points to equil.pages.dev (the canonical Cloudflare
       Pages URL). og:image points to the GitHub Pages assets path
       since that's where the asset folder lives.

     NOTE ON CACHING: Reddit / Facebook / Discord aggressively cache
     scrape results. Posts made BEFORE this version shipped will
     continue to show no preview; only NEW posts will pick up the
     image. For the existing Reddit post, leave a top-level comment
     with a direct link to the image instead.

     DEPLOY: drop og-image.png into the Equil/assets/ folder on
     GitHub Pages. Then verify with https://www.opengraph.xyz/ by
     pasting the equil.pages.dev URL — should show the logo card.

-->

<!-- Equil v4.13 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.13: New trophy artwork on the win card.

     ASSET:
     - assets/equil-trophy.webp (81 KB). Photographic image of a
       crystal trophy filled with cyan-numbered amethyst tiles, on
       a base of more tiles. Matches the cyan + purple/magenta
       palette of the rest of the app perfectly.
     - Source JPG (1072x960, 217 KB) was processed the same way as
       the logo asset: downscaled to 480 px wide, then luminance-
       based alpha keying (BLACK_FLOOR=14, WHITE_CEIL=120, GAMMA=0.85)
       so the black background becomes transparent with a soft falloff
       on the cyan glow at the trophy's base. WebP quality 85.

     MARKUP:
     - The 48px 🏆 emoji is replaced with <img src="assets/equil-
       trophy.webp"> sized 96px tall in the headline cluster.
     - Fail-silent fallback: an emoji <div> sibling stays in DOM
       hidden. The img's onerror handler reveals the emoji if the
       webp fails to load (e.g. local testing without assets/).
       So the card works with or without the asset deployed.
     - Subtle cyan drop-shadow filter on the img matches the rest
       of the card's accent treatment.

     DEPLOY: drop equil-trophy.webp into the Equil/assets/ folder
     on GitHub Pages alongside equil-logo.webp. Filenames are case-
     sensitive on Pages — keep lowercase.

<!-- Equil v4.12 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.12: Four win-card polish tweaks from Sam's screenshots.

     1) MOVES BURST RELOCATED.
        Previously sat top-left of the headline wrap, overlapping
        the Template: line. Now anchored to the upper-left of the
        card itself, top:32px left:-22px — sits BELOW the size/diff
        and template labels. Header gets z-index:3, burst gets
        z-index:0 so the cyan header always reads in front when
        they overlap.

     2) POLYGON POINTS REGENERATED.
        The hand-written sunburst points had a coincident pair on
        one spike that rendered as a squared-off end. Replaced both
        the outer and inner polygons with proper 9-point stars
        generated from polar coordinates — every point is at outer
        radius 92, every valley at inner radius 38, equal angular
        spacing. No squared ends possible with this geometry. Same
        change applied to both time burst and moves burst.

     3) "LEAST BEST" LABEL TIGHTENED.
        The two words wrap naturally in the narrow column. The cell
        now has line-height:0.95 (was 1.9 inherited) so when "Least"
        and "Best" stack, they sit almost touching. display:inline-
        block lets line-height take effect inside the grid cell.

     4) ROW DIVIDERS BETWEEN STATS.
        Best / Avg / Least Best rows are now separate grid blocks
        with cyan-tinted border-bottom on the Best and Avg rows.
        Visual rhythm matches the cyan divider above the current-run
        row, so the whole stats area reads as four clearly separated
        rows.

<!-- Equil v4.11 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.11: Win card polish pass based on Sam's screenshots.

     LAYOUT — UNIFIED STATS GRID:
     - Current-run stats moved INTO the same grid as the historical
       template stats. Now everything aligns vertically:
         [empty]      MOVES   TIME
         (mistakes)   9       0:21      ← current run, green text
         ────────────────────────────
         Best         9       0:21
         Avg          10      0:35
         Least Best   13      1:00
       The eye reads down each column to compare current vs. best.

     - Mistake indicator moved from "below the moves line" to the
       label column of the current-run row. It stays invisible (via
       visibility:hidden, not display:none) when zero so the row
       height doesn't jump.

     - Old winStats <div> kept in DOM as display:none with stub
       legacy IDs (_winStatsLegacyTimer, _winStatsLegacyMoves,
       winMistakesWrap, winMistakes) so any downstream lookups still
       resolve. The active winTimer/winMoves/winCurMistakes IDs
       now live in the unified grid.

     COLOR PASS:
     - Row labels (Best/Avg/Least Best, TEMPLATE:) switched from
       muted grey to cyan-tinted with low opacity.
     - Column headers MOVES/TIME: cyan-tinted (was muted).
     - Historical stat numbers: white (was muted grey).
     - Current-run numbers (moves, time): GREEN (#4ade80) by
       default, magenta on PB. Green distinguishes "what you just
       did" from "your record book" at a glance.
     - PB-tinted Best row values: magenta (unchanged from v4.10).
     - CLEAN SOLVE label: magenta (unchanged).

     MOVES-BURST FORCED VISIBLE FOR THIS BUILD:
     - Two new dev flags alongside _skipSplash:
         window._forceTimeBurst  = false;
         window._forceMovesBurst = true;
       _forceMovesBurst=true for v4.11 so Sam can actually see the
       moves burst — his current puzzles tie his best move count
       rather than beating it, so the organic gate never fires.
       Real PB-detection logic untouched; the override just OR's
       with the real condition. Flip back to false for normal play.

<!-- Equil v4.10 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.10: Major win card rebuild based on Sam's hand-drawn mock.

     LAYOUT CHANGES:
     - Top-left header: SIZE · DIFFICULTY on line 1, "Template: NAME"
       on line 2. Identifies the puzzle the player just beat.
     - Headline cluster (trophy + Solved!) unchanged in content but
       now wrapped in a relative-positioned div that hosts the PB
       bursts as absolute-positioned overlays.
     - "CLEAN SOLVE" indicator: small magenta text, only when mks===0.
       Per Sam: "small text under 'solved' for now ... squeeze some
       space in there for it to pop ... in magenta perhaps."
     - Per-template stats table (3 rows × 3 cols): label | moves | time
       for Best / Avg / Least Best. "Least Best" is intentional
       terminology per Sam ("for the lols", on-brand anti-positioning).
     - The old winLabel (PERSONAL BEST / SOLVED / CLEAN / Best:0:34)
       is now redundant — bursts handle PB celebration, the magenta
       label handles clean. winLabel kept in DOM as display:none so
       downstream code doesn't break.

     PER-METRIC PB BURSTS:
     - Two independent SVG bursts (top-right and top-left of headline).
       Yellow stroke-only sunburst, ~30% opacity sit-behind so the
       "Solved!" text reads on top. Fade in with stagger if both fire.
     - winBurstTime fires when this solve's TIME beats the previously-
       recorded template best.
     - winBurstMoves fires when this solve's MOVES beats the
       previously-recorded template best moves.
     - Gated on "we have prior data to compare against" — first-ever
       solve doesn't burst. Skipped runs (nonchalant, skipRecord) also
       don't burst since the prior stats don't include this run.

     MOVES STATS PERSISTENCE:
     - _recordTplStats now takes (size, diff, tplName, ms, moves) and
       tracks bestMoves / worstMoves / totalMoves / movesCount.
     - getGhostStats returns these alongside time stats. Pre-v4.10
       entries lack the move fields; they're added lazily on next
       solve. Pre-v4.10 records show "--" in the moves columns until
       enough new solves accumulate.
     - Backwards-compatible: old records keep working for time stats.

     BUTTONS:
     - Old two-separate-button row replaced with a split-pill (MENU
       and NEXT PUZZLE inside one cyan border). Old two-button markup
       commented out in place for one-line revert.

     PB DETECTION REWORK:
     - We now snapshot prior template stats BEFORE recordWin runs,
       then compare this run's ms/moves to that snapshot. Previously
       the per-template "is this a PB" check compared current ms to
       (already-updated) tpl.best, which was always true after this
       run was recorded. The snapshot-then-record-then-compare order
       is what makes the bursts actually fire correctly.

<!-- Equil v4.09 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.09: Per-template best/avg/worst row on the win card.

     New row sits between the existing PERSONAL BEST/CLEAN/etc label
     and the Menu/Next Puzzle buttons:
       BEST 0:34  ·  AVG 0:52  ·  WORST 1:18
     Compact monospaced row at 11px with letter-spacing matching the
     rest of the card's typography. BEST tints magenta when the
     current solve set it (i.e. this run's ms === stats.best after
     the record-and-display ordering).

     Data source: _mc113.getGhostStats(size, diff, tplName) — already
     existed, used by the grid-edge pace boxes. No new storage; the
     stats are baked by _recordTplStats which already runs in
     _showWinCard before the card renders.

     Visibility rules:
       - count >= 2: show the row (we have at least one solve to
         compare against, even if it's just the current one + one
         prior).
       - count === 1: hide. First-ever solve of this template means
         best === avg === worst === current time. Nothing to compare.
       - No tpl name, getGhostStats throws, or storage missing: hide.

     Daily puzzles, chalant/nonchalant: the row reads whatever the
     existing recording rules have already saved. Nonchalant and
     skipRecord (e.g. WIN! debug button) don't write to tpl stats,
     so for those modes the row shows prior chalant stats only —
     useful historical reference without polluting the comparison.

<!-- Equil v4.08 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.08: BUGFIX — undo was firing twice per click.

     When v4.07 re-added the undo button, an old wire-up from when
     the button was first removed (~v2.33) was still hooked into the
     DOMContentLoaded init block:
       (function(){ var u=document.getElementById('undo');
                    if(u) u.addEventListener('click',undo); })();
     It guarded for null (sensible when the button didn't exist) but
     now that v4.07 restored the button it fired alongside the proper
     v4.07 handler. Each click → two undos.

     Fix: commented out the old wire-up. The undo() function itself
     stays. Sole click handler now lives next to the playBtn handler
     and does the sound + win-check + AC-resume work.

<!-- Equil v4.07 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.07: Three additions.

     1) SPLASH DURATION → 3 seconds total.
        200ms fade-in + 2600ms hold + 200ms fade-out. No audio at
        the splash — cold-boot autoplay is blocked on mobile, so
        per Sam's direction we don't even try; the opening sound
        moved to the Play button instead.

     2) OPENING FANFARE on Play button.
        Sound-only ascending pop sequence (C5 → C6 over 7 pops at
        ~95ms apart). Reuses the _winPop helper from the win wave
        but with no DOM/particles/CSS side effects. Fires on every
        Play tap whether we end up showing the resume prompt or
        starting a fresh puzzle. New function: _playOpeningFanfare,
        exposed on window. Tap unlocks the AudioContext via the
        existing resumeAC() call so the pops reliably play.

     3) UNDO BUTTON back in the UI.
        Sits in the debug row below the grid, above the bank — left
        side, opposite the existing TIMES/COUNTS buttons. Pill-
        rounded cyan styling consistent with the app palette. The
        undo() function and the renderBank disable-management hook
        already existed (a previous UI removal left the machinery
        intact, per Sam's no-machinery-removal principle). All we
        added was the visible <button id="undo">, a click handler,
        and the disabled-state CSS.

        Semantics: linear undo. Place A, B, C → undo twice (C and
        B return to bank) → place D → undo pulls D, then A. B and
        C are gone from the stack (HIST.pop() truncated them on the
        original undos).

        Disabled when HIST is empty OR when isWon() returns true
        (locks after victory). Plays the existing playReturn()
        sound (descending tritone) for audio consistency with
        drag-back returns.

<!-- Equil v4.06 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.06: Splash logo now has a proper alpha channel. The black
            JPEG background is gone; soft cyan glow falloff at the
            edges is preserved instead of being clipped at a hard
            rectangle. Format swapped to WebP for ~3.5x smaller file
            than equivalent-quality PNG with no visible degradation.

     Alpha generation strategy (logged for future reference):
       - Per-pixel alpha from luma, not a hard black-key. Pure black
         → alpha 0, crystal interior → alpha 255, glow region in
         between → semi-transparent. Preserves the soft edge fade.
       - Rec.709 luma weighting, BLACK_FLOOR=14, WHITE_CEIL=120,
         GAMMA=0.85. Lower ceiling + gamma<1 keep letter interiors
         opaque so the logo still reads cleanly over non-black bgs.
       - WebP quality 85 chosen over PNG (787KB → 224KB) — WebP
         supports alpha and ships on every modern browser.

     DEPLOY NOTE: asset path is now assets/equil-logo.webp (was .jpg).
     If the old .jpg is still in your assets/ folder you can delete it
     — the code no longer references it.

<!-- Equil v4.05 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.05: Boot splash screen with the crystal "Equil" logo, ~2s
            display, fades in/out. Asset lives EXTERNAL to the HTML
            at assets/equil-logo.jpg — not embedded, not base64 —
            so the HTML stays lean. This establishes the assets-
            outside-the-HTML workflow as the standard going forward.

     Fail-silent behavior: the splash probes the image with a fresh
     Image() before showing anything. If the file isn't there (e.g.
     opening the HTML directly without the assets folder for local
     testing), the splash element is removed and nothing visible
     happens. No broken image icon, no toggle to remember between
     test and deploy.

     Dev override: window._skipSplash=true in the IIFE near the top
     of <body> force-skips the splash even when the asset is present.

     DEPLOY NOTE: On GitHub Pages, drop equil-logo.jpg into an
     `assets/` folder at the SAME LEVEL as the deployed HTML, so the
     relative path `assets/equil-logo.jpg` resolves. Filenames are
     case-sensitive on Pages — keep it all lowercase.

<!-- Equil v4.04 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.04: Hid the cyan edge vignette around the grid. The lattice
            (thin cyan lines at every cell boundary) stays — only
            the wash that fades from the edges toward center is gone.

     Removal is non-destructive: the .grid-vignette div now carries
     inline display:none, but the CSS rule, the DOM element, and
     every reference to it elsewhere remain untouched. Reviving the
     vignette is a one-character edit (delete the display:none) and
     all the v3.99 / v4.00 / v4.01 z-stack/containment work is still
     intact underneath it.

<!-- Equil v4.03 | Built: 2026-05-19 CT | github.com/Spamboni
     v4.03: Removed the READY/GO overlay from the new-puzzle flow.
            Puzzles now start the timer immediately on Play or New —
            no intermediate "tap GO to start" screen.

     The READY overlay machinery (_showReady, _hideReady, the
     readyOverlay div, the GO button, blur pane, and all positioning
     code) is intentionally left in place per the keep-machinery-
     available principle. Only the two call sites that triggered
     _showReady() (the new-puzzle paths around lines 14924 and 18310)
     now call _mc113.startTimer() directly instead.

     Skip on resume still applies on the resume-aware path — that
     branch was already a no-op when isResume was true, and remains
     so (the new direct startTimer call is also gated on !isResume).

<!-- Equil v4.02 | Built: 2026-05-15 CT | github.com/Spamboni
     v4.02: Restored the cyan grid lattice (FINALLY understood what
            Sam was actually asking about).

     I was looking at the wrong element this entire arc. Sam's been
     asking about the cyan GRID LATTICE — thin cyan lines tracing
     every cell boundary across the puzzle area, brighter at edges
     and fading toward center. I was fiddling with .grid-vignette
     which is a different feature (a four-direction GRADIENT WASH).

     From the v1.41 changelog: pre-v3.95 the lattice was an emergent
     effect. .grid::before painted a cyan gradient over the whole
     area, and opaque var(--bk) cell wrappers covered the gradient
     everywhere except the 1px grid gaps — so cyan only "leaked"
     through those 1px slits, producing crisp lattice lines.

     v3.95 made empty wrappers transparent to support pace boxes
     showing through empty grid regions. That inadvertently killed
     the lattice — without opaque wrappers to mask the gradient,
     the cyan now bled across whole cells as a continuous wash
     rather than crisp lines.

     v4.02 restores it as a deliberate element:
       - New <div class="grid-lattice"> sibling of .grid-vignette
         inside .grid-clip.
       - Two repeating linear-gradients on its background-image
         create the crosshatch pattern; background-size set inline
         to (CS+1)px (cell+gap stride).
       - A radial-gradient mask fades the pattern toward the
         center so it's brightest at corners/edges and softest
         in the middle.
       - z-index:-1 alongside .grid-vignette so pace boxes and
         grid cells paint over it.

     Net visual: matches the pre-v3.95 "cool grid backdrop" look
     while preserving v3.95's pace-box visibility through empty
     cells. Both effects coexist now instead of fighting each
     other.

     v4.01: Vignette restored at higher cyan opacity.

     v4.00 diagnostic confirmed the vignette WAS rendering all along
     — it just couldn't be seen. The original 0.12 alpha was
     calibrated against opaque var(--bk) cell wrappers (pre-v3.95)
     that the vignette composited against. With v3.95+ transparent
     wrappers and the v3.99 push to z:-1 (one layer further from
     the eye), the effective on-screen brightness dropped below
     the threshold of perception against the gscroll background.

     Fix: bumped cyan alpha 0.12 → 0.22. Roughly doubles the tint
     intensity, bringing the perceived brightness back in line
     with what it used to look like. May need further tuning;
     easy to dial up or down from here.

     v4.00: TEMP DIAGNOSTIC — vignette painted bright red.

     Sam says the cyan edge vignette is still gone after the v3.99
     z-index:-1 fix. I've been guessing at causes. This build paints
     the vignette in bright red rgba(255,0,0,0.85) instead of cyan,
     so we can see for certain:
       1. If RED edges appear → vignette IS rendering, but the cyan
          was just too dim against the bg (.12 alpha is barely
          visible on #0f0f0f).
       2. If NO red appears → something is genuinely occluding
          .grid-vignette and we need to dig elsewhere.

     v3.99: FIX — cyan edge vignette restored (was being painted over
            by pace boxes). [Apparently didn't actually fix it.]

     Sam noticed the cyan edge-fade vignette around the grid was
     missing. Cause: v3.98 put #paceBoxes inside .grid-clip as a
     sibling of .grid-vignette, both at z:auto. Per tree order,
     pace boxes paint AFTER the vignette — so pace boxes (which
     start at the outer grid edge and shrink inward) sat right on
     top of the cyan tint zone for the entire first portion of
     every solve, obscuring the vignette completely.

     Fix:
       - .grid-vignette gets z-index:-1 so it sits BELOW pace boxes
         and grid.
       - .grid-clip gets z-index:0 + position:relative so it
         establishes a stacking context that CONTAINS the -1 (else
         the vignette would escape into body's root and land
         behind .gscroll's background, hiding it for real).

     Layering inside .grid-clip is now:
       z:-1   .grid-vignette  (cyan edge fade, painted first)
       z:auto #paceBoxes      (the three pace rectangles)
       z:1    .grid           (cells, painted last atomically)

     v3.98: Real fix — pace boxes moved inside .grid-clip; .grid
            keeps its stacking context.

     v3.97 hit two problems by removing .grid's z-index:1:
       1. Vignette disappeared (turns out it needed grid's stacking
          context to paint in the right order — without it, paint
          order put cells above pace boxes which appeared on top
          of everything, somehow occluding the vignette too).
       2. Pace boxes painted on top of cells.

     The fundamental issue was that pace boxes lived OUTSIDE .grid's
     stacking context, but transparent grid regions can't reveal
     elements outside that context — they composite against the
     parent context's content at the same pixel, after the grid's
     atomic layer paints.

     Real fix: move pace boxes INSIDE .grid-clip as a sibling of
     .grid, between .grid-vignette and .grid in tree order. Now
     inside .grid-clip (which doesn't create a stacking context):
       vignette   (z:auto, painted first per tree order)
       paceBoxes  (z:auto, painted over vignette per tree order)
       grid       (z:1,    painted atomically above both)
     .grid's stacking context restored so cells (inside it) sit
     above pace boxes. But pace boxes now share the same parent
     stacking context as the vignette, so they all composite
     against the gscroll background correctly. Transparent grid
     regions reveal whatever was painted underneath in the parent
     context — pace boxes on top of vignette — exactly the
     three-layer stack we wanted from v3.94 onwards but finally
     get correctly.

     Empty cell wrappers remain transparent (v3.95 change kept);
     op/eq/given filled-cell wrappers keep var(--bk) backgrounds
     to block pace box bleed through their translucent inner
     content.

     v3.97: FIX — pace boxes were trapped under .grid's stacking
            context. Remove .grid's z-index:1. (REVERTED in v3.98.)

     The v3.96 magenta diagnostic confirmed empty cell wrappers were
     indeed the dark squares, AND that pace boxes weren't visible
     through them. The magenta painted as flat uniform magenta with
     no pace-box tinting bleeding through, proving pace boxes weren't
     behind the cells at all.

     Cause: .grid had position:relative + z-index:1 (originally to
     keep cells above the .grid::before cyan vignette, back when
     the vignette lived inside .grid). v3.94 extracted the vignette
     out of .grid entirely, but the z-index:1 stayed. That meant
     .grid still created its own stacking context — and an atomic
     stacking context isolates its transparent regions from layers
     below: pace boxes at z:0 in the root context could never
     composite *through* the grid context, even where the grid had
     transparent backgrounds.

     Fix: remove z-index:1 from .grid. The grid no longer creates
     its own stacking context. Its transparent regions (gaps between
     cells, transparent wrappers on empty cells) now composite
     directly against tree-order-earlier layers, which includes
     #paceBoxes (positioned with z:0 in the root context).

     Order in body's stacking context now:
       1. .grid-clip (positioned z:auto, tree-first)
            └─ .grid-vignette (z:auto, no stacking context)
            └─ .grid (now z:auto, no stacking context — transparent
               regions reveal whatever's behind in compositing)
       2. #paceBoxes (positioned z:0, paints AFTER .grid-clip per
          tree order at the same effective z-level)

     Wait — that means pace boxes paint ON TOP of the grid now,
     not under it. That's not what we want. Let me re-think.

     Actually the v3.94 design wanted three layers:
       below: vignette  →  middle: pace boxes  →  above: grid
     Tree order alone won't give us that without explicit z-indices.

     Solution: re-add a stacking context on .grid via z-index:2 to
     put it definitively above pace boxes, and give pace boxes
     z-index:1. But the v3.96 evidence shows transparent regions
     of .grid don't reveal pace boxes when .grid has a stacking
     context.

     Hmm. The fundamental problem: an atomic stacking context's
     transparent content can't reveal layers from OUTSIDE the
     context. They composite against whatever's behind the entire
     atomic layer in the parent context.

     So if pace boxes are below grid AND grid has a stacking
     context, transparent grid regions show what's below GRID's
     layer in the parent context — which is the gscroll bg, not
     the pace boxes (since pace boxes' z-context isn't pierced).

     Real fix: pace boxes must be INSIDE grid's stacking context,
     not outside. OR grid must not have its own stacking context.
     This version goes with the second option.

     Tradeoff: pace boxes now paint OVER cells when they cross.
     Cells lose their "above pace boxes" property unless I also
     handle them specially. v3.97 ships the no-stacking-context
     change to confirm the basic visibility issue gets fixed.
     If pace boxes are now visible everywhere in the grid area,
     I'll add per-cell z-index in a follow-up to put cells back
     above pace boxes.

     v3.96: TEMP DIAGNOSTIC — paint empty cell wrappers bright magenta.

     v3.95 was supposed to make empty cell wrappers transparent so
     pace boxes show cleanly through empty grid regions. Sam reports
     the result still shows a regular cell-pattern of dark squares
     with thin "cracks" between them through which pace boxes peek.

     I've been guessing about the cause from the code. This build
     instead paints the empty/blank cell wrappers in bright magenta
     (rgba(255,0,200,0.45)) so we can see exactly which DOM elements
     are at the cell positions where the dark squares appear.

     Two possible outcomes:
       1. Magenta squares appear everywhere the "dark squares" used
          to be. Then the empty wrappers ARE the culprit and the v3.95
          transparency change didn't actually do what I expected
          (cascade override? cache? something else painting on top?).
       2. Magenta appears only at some positions; the "dark squares"
          remain unchanged elsewhere. Then the dark squares come from
          a different element I haven't identified, and I need to keep
          looking.

     Either way, will know what to do next from Sam's screenshot.

     v3.95: Empty cell wrappers stop blocking pace boxes.

     Sam noticed a "feathered black grid" still gobbling up the pace
     boxes — caused by every cell wrapper (including empty ones)
     getting an opaque var(--bk) background. Originally this was
     to block the .grid::before cyan vignette from bleeding through
     translucent inner-cell colors, but v3.94 extracted the vignette
     out of .grid entirely so that bleed-through can't happen anymore.

     Fix: only paint the wrapper bg for cells with truly translucent
     fills underneath the pace-box-blocking concern — operator pills
     (rgba 0.22 cyan), equation =-cells (rgba 0.25 purple), and given
     numbers (rgba 0.10-0.20 cyan/white). Those need a solid backdrop
     so their thin-alpha fills don't pick up pace-box lines.

     EMPTY cells (no entry in CM) and blank cells (whether unfilled
     or filled with a placed number) get NO wrapper bg. Empty grid
     regions now reveal pace boxes cleanly. Placed numbers in blank
     cells read fine over pace box lines since the number itself
     is opaque text.

     v3.94: Pace boxes — proper three-layer z stack (vignette below,
            boxes middle, cells above).

     Sam reported the v3.93 pace-boxes-under-cells fix still had the
     boxes hidden in highlighted yellow regions of his screenshot —
     the areas inside .grid but outside any cell. Cause: the cyan
     edge-vignette (.grid::before) was painting OVER the pace boxes
     because it sat inside .grid's stacking context. There was no
     way to interleave a third party (pace boxes) between the
     vignette and the cells while the vignette was a pseudo-element
     of .grid.

     Fix: extract the vignette to its own <div class="grid-vignette">
     inside .grid-clip as a sibling of .grid. Now in body's root
     stacking context we have three positioned descendants:
       .grid-vignette  (z:auto, tree order: first)
       #paceBoxes      (z:0,    tree order: after vignette)
       .grid           (z:1)
     Per CSS spec, same-z positioned elements paint in tree order,
     so #paceBoxes paints over the vignette (tree-later) but under
     .grid (lower z). Cells inside .grid sit at z:auto in .grid's
     own context, which is atomic at z:1 — so cells cover pace
     boxes properly while gaps between cells reveal them.

     Also reverted v3.93's --bk transparency hack now that it's no
     longer needed (cells back to opaque #151515). The grid's own
     background changed from var(--bk) to transparent so the 1px
     gaps between cells reveal what's behind .grid (pace boxes
     when present, gscroll background otherwise).

     v3.93: Pace boxes — paint UNDER cells (with transparency
            for see-through), round the corners.

     1. #paceBoxes drops to z-index:0 (under .grid at z:1).
        Per-element z-index removed from .paceBox.
     2. Grid cells become slightly transparent: --bk changed from
        #151515 (opaque) to rgba(21,21,21, 0.78). That 22%
        see-through alpha lets pace box lines remain faintly
        visible when crossing under cells. Cells still read as
        near-black because the .gscroll background sits at full
        opacity behind them — only pace-box pixels that happen
        to land in a cell region leak through.
     3. Base box opacity bumped 0.18 → 0.30 so the see-through
        portion under cells reads as "barely there" rather than
        "invisible." The .pace-intense final-stretch class still
        ramps to 0.85 unchanged.
     4. Box corners rounded — border-radius:6px. Some amount of
        rounding, definitely under 10 billion px.

     v3.92: Pace boxes — paint above grid cells + per-mode prefs.

     1. The v3.91 fix lifted #paceBoxes to z-index:2 to clear the
        grid's vignette pseudo-element, but grid CELLS still had
        opaque dark backgrounds that obscured the box lines where
        they crossed cells. Bumped #paceBoxes to z-index:50 (set
        both via CSS rule AND inline style as belt-and-suspenders),
        and added z-index:5 to each individual .paceBox. Box lines
        should now be visible across the entire grid area, not just
        in the .gscroll padding band.

     2. Pace-box preferences are now per-mode. Previously a single
        flat prefs object was shared between chalant and nonchalant
        — turning the boxes off in nonchalant carried over when
        switching back to chalant, even though chalant's defaults
        were "all on" and the user had presumably never asked them
        to be off in chalant.

        New schema equil_pace_boxes_v2:
          { chalant:    {showBest, showAvg, showWorst},
            nonchalant: {showBest, showAvg, showWorst} }

        window._paceBox is now a *view* of the active mode's
        bucket (window._paceBoxAll[mode]). _swapPaceBoxModePrefs()
        is called from the mode click handler when the mode
        actually changes — it rebinds window._paceBox to point
        at the new mode's bucket and re-inits the on-screen boxes
        so the change is immediate.

        Migration: existing v1 (flat) prefs are folded into BOTH
        mode buckets on first run of v3.92 so nobody loses their
        setup. The two modes diverge from there.

     v3.91: FIX — pace boxes were getting painted under the grid's
            vignette overlay.

     Sam saw the pace boxes flash visible for a frame then get
     covered by the cyan fade-toward-center vignette around the
     grid edges. Cause: .grid carries z-index:1 (which creates a
     stacking context), and .grid::before paints the vignette at
     z-index:0 inside that context — but the whole .grid box sits
     above #paceBoxes since #paceBoxes had no explicit z-index
     (auto, which behaves as 0 in the parent's stacking context).
     One-frame flash happened because of paint timing on the
     initial transition kick.

     Fix: #paceBoxes gets z-index:2 so the wrapper paints above
     .grid. The boxes spend most of their inward travel in
     .gscroll's padding band (visible outside the grid border)
     and only cross over the cells in the final stretch, which
     matches the intended "closing in" feel.

     v3.90: Grid-edge pace boxes (best / average / worst), top ghost
            bar visually disabled.

     New peripheral feedback: three concentric rectangles inside the
     .gscroll container that shrink toward the grid center, each timed
     to a different reference solve from your history on the current
     template.

       outermost  — BEST    (2px, brighter cyan)
       middle     — AVERAGE (1.5px, soft purple-cyan)
       innermost  — WORST   (1px, muted amber)

     Horizontal and vertical edges use independent CSS transitions so
     that — regardless of the puzzle's aspect ratio — all four edges
     of a given box meet at center at the same instant (the box's
     target time). Low base opacity (~0.18) keeps the boxes from
     dominating the puzzle; each box gets a .pace-intense class in
     the final ~20% of its life that brightens the line and adds a
     soft glow. On completion the box plays a brief pulse keyframe
     and is removed from view.

     Stagger insets (best=0, avg=3px, worst=6px) keep the three rings
     visually distinct at t=0 even though they're all anchored to the
     boundary. Box selection by count:
       count === 1: best only (avg === worst === best, no point
                    drawing duplicates).
       count === 2: best + worst (avg is just the midpoint of the
                    two, no new information).
       count >= 3: all three available, subject to user toggles.

     Settings panel gains a new "Pace boxes" section (defaultOpen)
     with one absolute on/off toggle per box. Defaults are mode-aware
     on cold start (all on in chalant, all off in nonchalant) and
     persisted in localStorage thereafter; once the user toggles
     anything in the panel, their explicit choices win on every
     subsequent load regardless of mode. Toggles take effect
     immediately mid-puzzle via a re-init from _savePaceBoxPrefs.

     Data layer:
       - New storage key equil_template_stats_v1 mapping
         "size|diff|template" → {best, worst, total, count}.
         total/count drives the average. Recorded into via
         _recordTplStats from _showWinCard, gated identically to
         the existing _recordTplBest (chalant mode + valid tpl).
       - Parallel migration _seedTplStatsFromDbgTimes seeds the
         richer schema from _dbgTimes history on first run, gated
         by equil_tpl_stats_seeded_v1='yes'. Independent from
         v3.86's bests-only seed.
       - New API _mc113.getGhostStats(size, diff, tplName) returns
         {best, worst, avg, count} or null.

     Top ghost-runner bar is now visually disabled via the
     body.ghost-bar-disabled class (CSS !important on #mastGhost).
     The bar's underlying JS state machine still runs each tick so
     the code path stays exercised — easy to re-enable later by just
     removing the body class. Static "Best time: X:XX" label below
     the bar is still allowed to appear (it's a separate element)
     since the reference value is useful regardless of which gauge
     is showing the live race.

     v3.89: Reset the ghost-runner bar on Next Puzzle / New.

     Sam noticed that hitting "New" or "Next Puzzle" after a solve
     left the bar in its previous end-state (collapsed scaleX(0)
     with the static "Best time: X:XX" label still showing). Looked
     like the prior best was still active on a fresh template.

     Cause: _initGhostBar was only being called from showGame(), not
     from newPuzzle(). The newPuzzle() path runs buildPuzzle + reset()
     directly without going through showGame, so the bar's state never
     got refreshed.

     Fix: added the _initGhostBar() call to newPuzzle(). Both the
     masthead "New" button (#newp) and the win card "Next Puzzle"
     button (#nxt) route through newPuzzle, so the single fix covers
     both entry points.

     Also fixed a stale line in newPuzzle that still ordered mastInfo
     as DIFF · SIZE — v3.86 swapped the order in showGame but missed
     this parallel site, so masthead text would flip between orders
     depending on whether the puzzle was launched from menu or from
     New/Next.

     v3.88: New-player friendly defaults + first-time mode info popup.

     Default settings on the menu changed:
       Puzzle Size:  jumbo → small
       Difficulty:   hard  → medium
       Mode:         chalant → nonchalant

     Rationale: someone opening Equil for the first time should land
     on settings that read as approachable. A 30×25 jumbo on hard
     with stats-tracked timing is the right combo for an experienced
     player, but it's a steep first impression. Small + medium gives
     a puzzle that fits on screen and uses all four operators (the
     "real" Equil experience, not the +/− only easy mode). Nonchalant
     keeps the pressure off until the player opts in. Saved
     preferences in localStorage continue to win — only the cold-start
     defaults move.

     First-time mode info popup. On the very first tap of either
     chalant or nonchalant (per-mode flag in localStorage), a small
     themed modal appears explaining what changed:
       Chalant     → "Stats will be recorded."
       Nonchalant  → "Take your time. Stats not recorded."

     Modal uses Equil's standard cyan-border / dark-bg / IBM Plex
     Mono visual language so it doesn't feel like a foreign system
     prompt. Dismissed by tapping OK or the backdrop outside the
     card. Once dismissed for a given mode, never shown again
     (gated by equil_seen_chalant_v1 / equil_seen_nonchalant_v1).

     v3.87: Ghost-runner bar — drop the cyan lines that sandwich it.

     The 1px masthead bottom-border above the bar and the 2px gscroll
     top-border below were competing with the bar in peripheral
     vision, making it harder to track the bar's shrink at a glance.
     Suppressing them when the bar is showing gives the bar a clean
     band of background on either side — much easier for peripheral
     attention to lock onto.

     Implementation: body class .has-ghost-bar is added by
     _initGhostBar only when (a) chalant mode AND (b) a best time
     exists for the current template. CSS selectors strip the
     border on those two specific edges when the class is present.
     All other screens (menu, etc.) and any puzzle where the bar
     wouldn't show anyway keep their normal framing.

     v3.86: Seed per-template bests from history + masthead label
            order swap.

     1. Seed per-template bests so the ghost-runner bar works on
        first run instead of requiring re-solves. Sam reported
        v3.85's bar didn't appear on a small-medium TA puzzle he
        had solved before. Cause: the bar reads from
        equil_template_bests_v1, which only started being populated
        by v3.84's _recordTplBest in _showWinCard. All pre-v3.84
        solves recorded their stats to mc_stats_v1 (size|diff
        aggregate only — no template field) and to _dbgTimes
        (which DOES carry a per-entry tpl field, since v3.37).

        So _dbgTimes is the right source to seed from. The migration:
          a) Runs once, gated by equil_tpl_bests_seeded_v1='yes' so
             it doesn't re-run on every page load.
          b) Iterates every entry across {size, diff, []}, picks the
             minimum ms per (size, diff, tpl) tuple, writes to
             equil_template_bests_v1.
          c) Merges (doesn't overwrite) — fresh post-v3.84 records
             take precedence if they exist for the same key.
          d) Entries without entry.tpl (pre-v3.37 solves) are
             skipped since we can't attribute them.

        Result: per-template bests should populate from history,
        and the bar should appear on the next play of any template
        with a prior solve.

     2. Masthead subtitle now reads "SIZE · DIFF" instead of
        "DIFF · SIZE", matching the menu selection layout where
        Puzzle Size sits above Difficulty.

     v3.85: Ghost-runner refinements — per-template only, plus
            compact chalant/nonchalant row.

     1. getGhostBest() no longer falls back to the size|diff
        aggregate when there's no per-template record. A brutal
        sub-30s small-hard best would become the ghost time for a
        fresh medium-hard template — visually impossible to race
        and bad UX. Now the bar simply doesn't appear until you've
        completed that exact template at that size+diff at least
        once. Storage schema, recording, and the chalant gating
        are unchanged.

     2. Chalant / nonchalant row stripped of the descriptions
        ("times averaged, stats tracked" and "big brother isn't
        watching") to test whether users figure out the pair
        unaided. New .sel-btn-compact variant gives the row a
        tighter padding/font/border-radius so it reads as a
        binary toggle rather than another full selection row.
        Section margin-bottom tightened 24px → 18px.

     v3.84: Ghost-runner bar + chalant/nonchalant modes.

     Ghost-runner bar. A thin cyan bar under the masthead that
     shrinks symmetrically from both edges over the player's best
     time for the current template+size+diff. As the bar's last 25%
     closes in, it brightens and gains a soft glow — peripheral
     pressure without nagging. Once elapsed crosses the best, the
     bar collapses and is replaced by a small static "Best time:
     X:XX" reference label in the same slot.

     Fallback chain when the bar looks up the target:
       1. size|diff|template (exact match) → "Best time: X:XX"
       2. size|diff (broader best from existing stats) → "~ Best
          time: X:XX" (the ~ marks borrowed reference, since
          different templates in the same tier can have genuinely
          different difficulty)
       3. nothing known → bar hidden entirely

     Per-template bests are stored in a new localStorage key
     (equil_template_bests_v1), kept separate from the v2.68
     mc_stats_v1 schema so existing stats are untouched.

     Symmetric shrink is implemented as transform:scaleX(N) with
     transform-origin:center on a single fill div — one cheap GPU
     property, no wrapper math. Short 0.08s linear transition
     smooths frame jitter while still tracking the rAF tick.

     Chalant / nonchalant modes. Two-pill selector on the menu
     screen, same style as the size and difficulty rows. Chalant
     records solves to stats + per-template bests, shows the
     ghost-runner bar. Nonchalant runs the timer for personal
     reference only — nothing is recorded, no bar appears. Mode
     persists in localStorage (equil_mode).

     Implementation:
       - _mc113._recordTplBest(size, diff, tplName, ms)
       - _mc113.getGhostBest(size, diff, tplName) →
         {ms, exact} | null
       - window._initGhostBar() called from showGame()
       - window._updateGhostBar(elapsedMs) called from _renderTimer
       - recordWin (the existing stats writer) now skips entirely
         when window._equilMode === 'nonchalant'

     Best-time win animation deferred — will polish later.

     v3.83: FIX — hide the rebuilt tile under the spin clone in
            condensed display modes (### / xN / mini).

     v3.82 fixed the no-spin bug for condensed-mode tiles, which
     exposed a separate v3.72-era issue that had been hidden by the
     missing spin: the post-place rebuilt tile sits fully visible
     underneath the spinning clone, so the user can see content
     "through" the clone footprint.

     Cause: same data-bank-idx instability that caused the v3.82 bug.
     In condensed modes, the rendered tile uses firstUnused as its
     data-bank-idx. After place(), firstUnused shifts (10 → 11), so
     the rebuilt tile carries a DIFFERENT data-bank-idx than the
     source. v3.82's post-place hide queried by the old
     data-bank-idx, found nothing in #bank, applied no hide.

     Fix: query by data-collapsed-value (the tile's value), which is
     value-stable across renders. The value-group exists before AND
     after place() — only the firstUnused-pointing index changes.
     For non-condensed modes (source tile has no data-collapsed-value)
     we fall back to data-bank-idx, which IS stable in plain mode
     because each slot has its own permanent index.

     Implementation: a local _selFindRebuilt() / _clkFindRebuilt()
     helper at each spin site does the value-or-index lookup. Both
     the post-place hide and the cleanup unhide use it.

     v3.82: FIX — place-spin works for cyan/xN multi-instance tiles.
            Removes the v3.77–v3.81 diagnostic scaffolding.

     ROOT CAUSE: in condensed display modes (### / xN / mini), the
     rendered tile carries data-bank-idx = firstUnused for its value
     group, NOT the actual bank slot index. So a value=4 with 5
     unused instances at bank indices 10..14 renders ONE tile with
     data-bank-idx="10".

     When the user taps it, place(10) marks bank[10].used=true and
     re-renders. The new firstUnused for value=4 is now 11, so the
     rebuilt tile in the bank has data-bank-idx="11".

     The spin clone (cloneNode(true)) still has data-bank-idx="10".

     My post-place code was:
       var slot = document.querySelector('.bt[data-bank-idx="10"]');
       if(slot) slot.style.visibility='hidden';

     That document-wide query DID find a matching element — the
     CLONE in <body>, not the new bank tile. So I was hiding the
     clone itself, killing the spin. Plain (non-condensed) modes
     were unaffected because each bank slot has its own permanent
     data-bank-idx that the new tile keeps.

     The v3.81 visibility-forensics diag confirmed this exactly:
       t=0:   visibility: visible
       t=300: visibility: hidden   ← something hides it during spin

     FIX (defense in depth):
       1. Strip data-bank-idx (and data-snd-idx) from the clone
          immediately after cloneNode(true) so no querySelector can
          ever match it.
       2. Scope post-place / cleanup queries to inside #bank with
          _bankEl.querySelector(...) instead of document.querySelector.
       Applied at both spin sites.

     ALSO: ripped out v3.77–v3.81 diagnostic scaffolding:
       - _spinDiag function definition (large block above _dbgTogglePanel)
       - _spinDiag call sites at both spin sites
       - hot-pink #ff00aa outline + outline-offset on the clone

     Net behavior in v3.82: smooth spin for all tile types, soft
     fade-in unhide, no visual debug residue.

     v3.81: Spin diagnostic — visibility forensics (REMOVED in v3.82).
     v3.80: TEMP — make the spin clone visually unmissable (REMOVED).
     v3.79: Spin diagnostic overlay — moved out from over the bank
            (REMOVED).
     v3.78: Enhanced spin diagnostic — capture transform at three
            timestamps (REMOVED in v3.82).
     v3.77: TEMP — on-screen spin diagnostic (REMOVED in v3.82).
     v3.76: Defensive inline animation (kept — harmless, slightly
            more robust than the .placing-blend class version).

     v3.75: xN display mode — hide the ×N badge for counts of 1 or 0.

     The cyan ×N multiplier badge now only renders for unused counts
     of 2 or more (×2, ×3, ×4, ...). At unused=1 the badge is dropped
     so the tile reads as just the white main digit — "×1" was
     redundant. At unused=0 the tile is already .used (dimmed by
     .bt.used opacity:0.25), but the badge gate previously still
     rendered "×0" inside the dimmed tile; that's also gone now.

     Change is a one-condition tightening on the badge gate in the
     xN render branch: hasMultiple → hasMultiple && unused >= 2.
     Layout unchanged: white digit stays anchored at xnTopPct, so no
     visible jump in white-digit position when unused crosses 2→1.
     Other display modes (### / mini) untouched.

     v3.74: ### display mode — legibility fix for fully-used tiles.

     In cyan-only (###) display mode, when every instance of a value
     has been placed, the bank tile was rendering its number at
     rgba(0,147,170, 0.25) — a 25%-alpha cyan. Combined with the
     .bt.used class's opacity:0.25, the effective alpha came out to
     ~0.0625 (i.e. ~6%), which on a black background reads as
     basically invisible.

     Other display modes don't have this problem because their
     .used tiles still show a WHITE outlined main digit; white at 25%
     opacity is plenty legible on black. The cyan-only mode has no
     white fallback, so the cyan had to do all the work — and it
     wasn't enough.

     Fix in the if(cyanOn && condenseOn) → else (all-used) branch:
       - Drop the redundant 0.25-alpha color override. Use full-alpha
         #0093aa so .bt.used's opacity is the only dimming layer —
         matching the effective dimming of other modes' .used tiles.
       - Add -webkit-text-stroke / text-stroke of 0.3px in #7dd3e0
         (slightly lifted cyan) so the glyph silhouette has visual
         weight. Hairlines on a black background disappear regardless
         of color saturation; a stroke widens the rendered pixel
         footprint without making the tile look fully bright.

     Scoped to ### mode only via the enclosing branch — other modes
     untouched, since per Sam's feedback their dimming is correct.

     v3.73: Place-spin underlay — two fixes on the v3.72 surgical
            hide (duplicate place(idx); soft fade-in unhide).

       1. Duplicate place(idx) call at the SEL touchstart site. The
          v3.72 edit accidentally left the original `place(idx)` line
          in place AND added a new copy below my post-place hide
          block, so place() was being called twice per tap. The
          second call early-returned via the `if(t.used)return;`
          guard at the top of place(), so no double-placement or
          double-render actually occurred — but it was dead code and
          a misleading footprint. Removed the duplicate, plus the
          duplicate `_mxSelTouchHandledAt = performance.now()` that
          went with it.

       2. "Dimmer than before" perception on placed tiles. With v3.72,
          the tile under the spinning clone was visibility:hidden for
          the full spin duration, then snapped to visible on the same
          frame the clone was removed. When the placement consumed
          the last instance of a value, the .used class fired and the
          tile appeared at opacity:0.25 instantly with no
          transitional reference frame — the eye reads this as "more
          dim than usual" because there was no gradient leading into
          it. Fix: replace the hard visibility-snap with a quick
          opacity fade-in. At cleanup time:
            - clear inline visibility:hidden
            - set transition: opacity 0.18s ease-out
            - set inline opacity:0 (overriding the .used 0.25 baseline)
            - force layout flush
            - clear inline opacity (lets CSS take over — 0.25 for
              .used tiles, 1 for non-.used)
            - 220ms later, clear the inline transition so the tile
              returns to its default transition settings.
          Effect: tile fades in over 180ms to its natural opacity,
          which feels like a settle rather than a snap. Applied at
          both spin sites (SEL touchstart, click handler).

     v3.72: Place-spin underlay — surgical replacement for v3.71 mask.

     The v3.71 inflated-rectangle mask was clipping neighboring tiles'
     borders and glow because its 10px inflate overlapped them.
     Replaced with a precise approach: set visibility:hidden directly
     on the source bank tile DOM node itself. This hides exactly the
     tile's border, inner glow, and number — nothing else, since
     visibility only affects the element it's set on, not its
     neighbors. Layout is preserved (visibility, not display:none).

     The wrinkle: place(idx) below the clone-creation calls render()
     which rebuilds the bank, destroying the original tile node and
     creating a new one in the .used state. So:
       1. Hide source tile BEFORE creating the clone.
       2. After place(idx) returns synchronously, re-query
          .bt[data-bank-idx="idx"] and hide that new tile too.
       3. In the cleanup setTimeout (frame-aligned with clone
          removal), re-query the slot again — in case any other
          render happened during the spin window — and unhide
          whatever lives there now.

     Both spin sites (SEL touchstart fast-path and click handler)
     use the same pattern. The spinning clone itself gets an
     explicit visibility:visible inline style as belt-and-suspenders
     so it cannot accidentally inherit hidden if the source was
     hidden at clone-time.

     v3.71: Place-spin — underlay mask hides whatever sits in the
            tile's footprint for the duration of the spin.

     A small rectangle the color of the bank background is placed at
     the bank slot the moment the spinning clone is created, sitting
     one z-layer below the clone (z-index 9998 vs the clone's 9999).
     This hides:
       - the original .lit yellow-glowing bank tile for the first
         few ms (until place() rebuilds the bank)
       - the rebuilt .used greyed-out tile that takes its place

     so the eye locks onto the spinning clone with nothing visible
     directly underneath. The mask is removed in the SAME setTimeout
     callback as the clone, so the un-ghost happens on the exact
     frame the spin ends. Footprint is inflated by 10px on each side
     so any outer glow from .lit on the underlying tile is also
     covered; corners use a 14px border-radius matching the inflated
     rect (tile is 10px radius + 4px extra for the inflation).

     Applied at both place sites: the SEL touchstart fast-path and
     the click handler.

     v3.70: Tap-to-place spin — faster, smoother, no ghost outline.

     Three changes to the place-spin animation that fires when a bank
     tile is tapped into a selected grid cell:

       1. Dashed cyan ghost border at the original bank position is
          no longer drawn. The .bt-ghost CSS class and the JS that
          creates the ghost div are both kept in the file — class
          intact, JS commented out — so the anchor outline can be
          revived later without re-tracing the implementation.

       2. Base spin duration dropped 850ms → 500ms at both place
          sites (the SEL touchstart fast path and the click handler).
          Still scaled by window._spinDurMult so the OPTIONS panel
          speed control keeps working; floor is still 80ms.

       3. bt-spin keyframes simplified and easing changed. The old
          keyframes paced rotation asymmetrically: 0→200° over the
          first 40% of duration (5°/%), then 200→320° over the next
          30% (4°/%), then only 320→360° over the last 30% (1.33°/%).
          With the old cubic-bezier(0.25,0.46,0.45,0.94) ease-out
          stacked on top, the final quarter of the rotation crawled
          and read as "the tile hung near the end." New pacing is
          uniform — 0°/180°/360° at 0%/50%/100% — with a single
          mid-spin scale dip to 0.78 keeping a subtle "puff" feel.
          Easing changed to cubic-bezier(0.4,0.0,0.2,1.0) (Material
          standard), so the start, middle, and end of the spin all
          move at perceptually similar rates.

     Net result on Galaxy Brave: the spin should feel ~40% faster
     and rotate evenly through its full arc. Any residual hitch is
     more likely a Chromium GPU compositor quirk than CSS pacing.

     v3.69: Debug-panel pinch-zoom — passive touchstart, preserve
            dragged position when zooming back to 1x.

       1. COUNTS panel's collapsible group headers (CURRENT PUZZLE,
          PUZZLE AVERAGES, TEMPLATE COUNTS, FAIL REASONS) were no
          longer toggling on tap. Root cause: the v3.68 touchstart
          listener on _dbgPanelBody was registered as {passive: false},
          which on mobile Chromium (incl. Brave) suppresses the
          synthesized click that the collapse handlers listen for.
          Fix: register touchstart as {passive: true}. preventDefault
          was never actually needed there — touch-action:pan-y on the
          body already disables the browser's native pinch, so the
          two-finger gesture flows to JS without us blocking anything
          at touchstart. touchmove stays {passive: false} so we can
          still cancel scroll/pan during an active pinch or drag.

       2. Pinch-out-to-1× was snapping the panel back to its pre-zoom
          position. Root cause: the inner translate (tx, ty) was being
          zeroed whenever scale hit 1, which discarded any visual offset
          accumulated from the zoom-anchored math (and from one-finger
          panning at >1× before zooming back out).
          Fix: at scale=1, *bake* tx/ty into panel.style.left/top so
          the visual position is preserved with identity transform.
          This happens on touchend (after a user pinch-out), inside
          touchcancel, and inside _dbgZoomReset (before the close
          animation starts). Mid-gesture math is left continuous —
          no baking happens during an active pinch, so re-zooming
          smoothly without releasing fingers still works.
          Side benefit: future header drags via _dbgMakeDraggable now
          see a clean left/top with no hidden translate component,
          which keeps the two systems composable.

     v3.68: Pinch-to-zoom on debug panels (COUNTS + TIMES).

     v3.67: PLAY button — divider aligned with triangle tip,
            PLAY/RESUME centered.

     Two small refinements:
       1. Divider y-position moved from 28px → 25px so it lines up
          horizontally with the triangle's tip (the triangle's
          geometric center sits at half of stack-height ≈ 25.5px).
          Width unchanged — still spans the full stack.
       2. PLAY and RESUME both now centered horizontally within
          the stack (text-align:center on each, left:0 right:0)
          rather than sharing a left edge. RESUME (narrower than
          PLAY) is no longer aligned with PLAY's left; both center
          on the same vertical axis through the divider midpoint.

     Triangle, button height, animation behavior all unchanged.

     v3.66: only PLAY moves.
     v3.65: tried height-collapse.
     v3.64: triangle separated.

     v3.66: PLAY button — ONLY the PLAY word moves.

     v3.65 changed the button height and moved the triangle along
     with PLAY. Sam wanted JUST the PLAY word to animate; everything
     else stays put.

     Restructured the .play-stack as a fixed-height (51px) relative
     container with PLAY, divider, and RESUME absolutely positioned
     inside. PLAY translates between two positions:
       - No save: translateY(13px) — PLAY sits centered, aligned
         vertically with the triangle.
       - Has save: translateY(0) — PLAY sits at top of stack so
         RESUME has room below.
     Divider and RESUME fade via opacity only (no layout shift).
     Triangle is unchanged in all states. Button height is constant.

     Transitions 150ms on transform, 120ms on opacity.

     v3.65: tried height-collapse (button got bigger, triangle moved).
     v3.64: triangle separated.
     v3.63: same-font + left-align + divider.

     v3.65: PLAY button — animated reveal of RESUME slot.

     v3.63/3.64 used visibility:hidden to keep RESUME's space
     reserved at all times, so the button was always tall. Sam
     wanted the button to be compact when there's no save, and
     to smoothly grow when there is.

     Wrapped the divider + RESUME in a new .play-extra block with
     max-height:0 / opacity:0 by default. .has-save expands
     max-height to 60px and opacity to 1, with a 150ms ease
     transition on both. Because the triangle uses
     align-items:center against the stack, as the stack shrinks
     the triangle re-centers vertically — so PLAY appears to
     animate down to center on collapse and back up on expand.
     overflow:hidden on .play-extra prevents flash during the
     transition.

     v3.64: triangle separated, RESUME aligned with P.
     v3.63: same-font + left-align + divider.
     v3.62: RESUME sub-label first cut.

     v3.64: PLAY button — triangle separated for RESUME alignment.

     v3.63 left-aligned both PLAY and RESUME within the button,
     which meant RESUME aligned with the triangle's left edge,
     not with the P of PLAY. Sam wanted RESUME's left edge under
     the P specifically.

     Restructured:
       .play-row    flex-row: triangle on left, stack on right
         .play-tri  the ▶ glyph, centered vertically against stack
         .play-stack flex-column: PLAY, divider, RESUME
       Outer button centers .play-row as a unit, so the whole
       triangle+stack group sits centered, but RESUME aligns under
       PLAY (not under the triangle).

     Divider stretches to PLAY's width via align-self:stretch on
     the stack column, since PLAY is wider than RESUME at the
     current font sizes.

     v3.63: same-font + left-align + divider.
     v3.62: RESUME sub-label first cut.
     v3.61: ready overlay — only GO dismisses.

     v3.63: PLAY button refinements.

       - Button is now a constant size whether or not RESUME shows.
         Previously the button grew taller when a save existed.
         Now the RESUME row and divider are always present in the
         layout; their visibility is hidden when there's no save
         so the ink disappears but the slot remains, keeping the
         button height stable.
       - Both labels use the same font (Abril Fatface) instead of
         the serif/mono mix.
       - Left-aligned instead of centered (align-items:stretch +
         text-align:left).
       - Horizontal cyan divider between the two lines, also
         visibility-toggled with the save state.

     v3.62: RESUME sub-label first cut.
     v3.61: ready overlay — only GO dismisses.
     v3.60: grid-clip outline removed.
     v3.59: grid edge-to-edge.

     v3.62: PLAY button shows "RESUME" sub-label when a save exists.

     Visual cue for per-mode save slots: when the currently-selected
     (size, diff) combination has a saved in-progress game, the PLAY
     button now shows a small "RESUME" line under "▶ PLAY".
       - Main label: "▶ PLAY" (Abril Fatface, 20px)
       - Sub-label: "RESUME" (IBM Plex Mono, 11px, 0.75 opacity)
     Stacked vertically with a small gap. Hidden by default;
     toggled via the .has-save class on the button.

     Triggered:
       - Whenever a size button is tapped
       - Whenever a difficulty button is tapped
       - On showMenu (so returning from a just-exited puzzle shows
         the cue immediately)
       - At page load (so a save from a previous session shows
         the cue)

     Tapping PLAY still routes through the existing v3.50 prompt
     flow (Resume vs Start New) — the sub-label just gives advance
     notice that a save is there, so the player doesn't have to
     tap PLAY and wait for the modal to find out.

     v3.61: ready overlay — only GO dismisses.
     v3.60: grid-clip outline removed + cells bigger.
     v3.59: grid edge-to-edge.
     v3.58: actually boosted return sound.
     v3.56: resume-clock drift fix.
     v3.50: per-mode save slots.
     v3.52: pulse on placed tiles.

     v3.61: Ready overlay — only GO dismisses + masthead stays
     tappable while ready is up.

     Previously: tapping ANYWHERE on the ready overlay would
     dismiss it and start the timer. This meant:
       - Tapping NEW to roll a new puzzle accidentally triggered
         GO on the in-flight overlay before the new puzzle's
         overlay appeared.
       - Tapping anywhere on the masthead (settings, pause, back)
         had similar issues.

     Now: pointer-events:none on the overlay container so taps fall
     through to underlying elements. The blur pane gets
     pointer-events:auto, swallowing taps on the puzzle and bank
     area (so the player can't place tiles or select cells while
     ready is up). The GO button also has pointer-events:auto and
     is the only thing that dismisses.

     Net effect: tapping NEW now actually gives you a new puzzle.
     Settings, pause, back also work normally. Only the puzzle/
     bank area is locked, and only GO triggers the timer start.

     v3.60: grid-clip outline removed + cells bigger.
     v3.59: grid edge-to-edge.
     v3.58: actually boosted return sound.
     v3.56: resume-clock drift fix.
     v3.50: per-mode save slots.
     v3.52: pulse on placed tiles.

     v3.60: Remove grid-clip outline + reclaim horizontal margin.

     1. GRID-CLIP OUTLINE REMOVED. The 1px cyan outline that drew
        around the puzzle grid is gone. The grid cells themselves
        delineate the puzzle area; the extra outline was redundant
        now that .gscroll's left/right borders are also gone
        (v3.59). Cleaner look.

     2. CELLS BIGGER ON SMALL SCREENS. The getCellSize "extra
        margin" calc still assumed v3.58's 48px horizontal padding
        + 4px side borders even after v3.59 zeroed those out. The
        60px reservation was eating into available width and
        keeping cells smaller than necessary. Reduced to 10px
        (just grid border + small safety margin).

        On a 360px-wide phone with a Large puzzle (13 col canonical):
          - Before: (360 - 60) / 13 ≈ 23px cells, grid ≈ 299px wide.
          - After:  (360 - 10) / 13 ≈ 26.9px cells, grid ≈ 350px wide.
        That's about 17% more grid width, capped at the existing
        per-tier maxCS (36px for Large, etc) so it doesn't blow up
        on tablets.

     v3.59: grid area edge-to-edge.
     v3.58: actually boosted placed-tile-tap return sound.
     v3.56: resume-clock drift fix.
     v3.50: per-mode save slots.
     v3.52: pulse on placed tiles.

     v3.59: Grid area extends to screen edges.

     .gscroll (the cyan-bordered region containing the puzzle grid)
     was constrained to max-width:520px with 24px horizontal
     padding. Removed both — now spans full screen width with zero
     horizontal padding. Top/bottom padding kept at 16px for
     breathing room.

     The grid itself stays horizontally centered via the existing
     justify-content:center, so on wider screens (tablets, desktop)
     the grid sits centered in the surrounding cyan area instead
     of pinning to a side.

     Cyan border trimmed to top + bottom only. Left/right vertical
     borders against a screen edge would look pinched without
     padding to give them visual room. The horizontal lines plus
     the grid-clip outline still delineate the puzzle area
     cleanly.

     Corner accents (Jumbo-only per v2.98) recalibrate
     automatically — they're positioned relative to gscroll's
     bounding rect, so they still land at the corners after this
     change.

     v3.58: actually boosted placed-tile-tap return sound.
     v3.57: back arrow centered.
     v3.56: resume-clock drift fix.
     v3.50: per-mode save slots.
     v3.52: pulse on placed tiles.

     v3.58: Actually boost the placed-tile-tap return sound.

     v3.55→v3.57 boosted the wrong function. There are two return
     sounds:
       - playTileReturn() fires when a dragged tile is RELEASED
         without dropping on a cell — it bounces back to the bank.
         This is what I'd been bumping.
       - playReturn() → playSA_Return() (style A) fires when a
         PLACED tile is TAPPED to send it home. THIS is the sound
         Sam meant.

     playSA_Return changes:
       - Peak gain 0.14 → 0.55 (~4x).
       - Duration 60ms → 110ms.
       - Frequency 175 Hz → 220 Hz. Low F3 sines get masked easily
         by HVAC hum / dehumidifier / fan noise; lifting to mid-A3
         pulls it into a frequency range that cuts through.

     playTileReturn restored to original 0.18 — that path was fine,
     it just wasn't the one being heard.

     v3.57: back arrow translateY -2 → -3.
     v3.56: resume-clock drift fix.
     v3.55: section state persisted.
     v3.54: pulse speed slider.
     v3.53: collapsible sections + pulse controls.
     v3.52: pulse on placed tiles.
     v3.50: per-mode save slots.

     v3.57: Back arrow centered properly + return sound louder again.

     1. BACK ARROW translateY bumped from -2px to -3px. The 2px
        wasn't quite enough — the ← glyph's visible shaft was still
        landing slightly below the button's geometric center.

     2. TILE-RETURN SOUND from 0.55 → 0.85. Now at the loud end of
        the SFX range without clipping.

     v3.56: resume-clock drift fix + return 0.32→0.55.
     v3.55: section state persisted + return 0.18→0.32.
     v3.54: pulse speed slider + sections all closed.
     v3.53: collapsible sections + pulse controls.
     v3.52: pulse on dimmed-green placed tiles.
     v3.50: per-mode save slots.

     v3.56: Resume-clock drift fix + tile-return sound louder again.

     1. RESUMED-GAME CLOCK DRIFT. Bug: exit a puzzle at 6:00, sit on
        menu for 5 min, resume — clock reads 11:00 instead of 6:00.
        The 5 min "wait time" leaked into the resumed elapsed.

        Root cause: showMenu() saved the elapsed correctly before
        switching screens, but did NOT pause the timer. startTs
        remained pointing at a wall-clock anchor while the player
        was on the menu screen. If a visibilitychange event then
        fired (e.g. screen lock, app switch, Claude in-app
        backgrounding), the saveIfActive listener called
        _saveProgress() — which read (Date.now() - startTs) and
        wrote that wall-clock-inflated elapsed over the good save.
        On resume, the inflated elapsed became the new starting
        point.

        Fix: showMenu() now calls mc113.pause() after saveProgress.
        Pause sets paused=true, captures pauseStartElapsed, cancels
        the rAF tick. After pause, both _curMs and _saveProgress
        return the frozen pauseStartElapsed regardless of how much
        wall-clock time passes. restoreState already sets
        paused=false on resume, so the resume flow is unaffected.

        First-play case is fine: if no moves have been made,
        startTs is null and pause() early-returns. saveProgress
        also early-returns on moves===0.

     2. TILE-RETURN SOUND LOUDER. Bumped from 0.32 → 0.55. Still
        below the place sound's volume but now clearly audible.

     v3.55: section state persisted + tile-return 0.18→0.32.
     v3.54: pulse speed slider + all sections closed.
     v3.53: collapsible sections + pulse controls.
     v3.52: subtle pulse on dimmed-green placed tiles.
     v3.50: per-mode save slots.
     v3.42: READY overlay.

     v3.55: Sections remember their state + louder tile-return sound.

     1. SECTION OPEN/CLOSED STATE PERSISTED. The OPTIONS panel
        sections now remember their open/closed state across panel
        opens via a new localStorage key 'equil_opt_sections' (a
        map of title → boolean). _mkSection reads this on each
        build; the section's click handler writes the new state on
        each toggle. Falls back to opts.defaultOpen on first run.

        Reset-to-defaults wipes this key alongside the other
        settings, so the panel returns to all-closed after a reset.

     2. TILE-RETURN SOUND VOLUME bumped from gain 0.18 → 0.32
        (roughly 78% louder). The return sound was too quiet
        relative to place and snap and was easy to miss — players
        couldn't always tell that a tap on a placed tile had
        registered as a return. Still under the place sound so
        it doesn't become the dominant tile-action sfx.

     v3.54: pulse speed slider + all sections closed by default.
     v3.53: collapsible sections + pulse controls.
     v3.52: subtle pulse on dimmed-green placed tiles.
     v3.50: per-mode save slots.
     v3.42: READY overlay.

     v3.54: All sections default closed + pulse speed slider.

     1. ALL OPTIONS SECTIONS NOW DEFAULT CLOSED. Visual effects was
        previously default-open; now it matches the others. Player
        opens just the section they want to tweak, no scrolling
        past expanded content they don't care about.

     2. PULSE SPEED SLIDER. New control under Placed-tile pulse:
        seconds per full breath cycle, range 1.2s → 7.0s, default
        3.6s (matches v3.52/v3.53).
          - 1.2s = quick attention-getter, almost a heartbeat
          - 3.6s = the original gentle breath
          - 7.0s = very slow, almost imperceptible background motion

        Implementation note: the static .ok-breath CSS rule with
        its hardcoded "3.6s" duration was removed. _writePulseKeyframes
        now emits BOTH the @keyframes okBreath block AND the
        .ok-breath { animation: ... } rule, so the duration is
        injected dynamically alongside the peak brightness.

        The per-cell hash phase was also rescaled. Previously the
        phase was `(hash % 360) / 100` which produced 0.00..3.60
        seconds — a hardcoded fraction of 3.6s. Now it's
        `(hash % 1000) / 1000 * duration` so phases stay spread
        across one full cycle regardless of the duration. Without
        this, a 7s pulse with the old formula would have all tiles
        bunched into the first half of the cycle.

     v3.53: collapsible sections + pulse controls.
     v3.52: subtle pulse on dimmed-green placed tiles.
     v3.50: per-mode save slots.
     v3.42: READY overlay.
     v3.33: trivial-equation crackdown.

     v3.53: Options panel — collapsible sections + pulse controls.

     1. COLLAPSIBLE SECTIONS. The options panel is now organized into
        four labeled drawers with chevron toggles:
          - Visual effects (open by default)
          - Placed-tile pulse (closed by default — new)
          - Tile interaction (closed by default)
          - Debug — snap tuning (closed by default)
        Each section has a header strip with the section title and
        a ▾ chevron. Tapping the header expands or collapses the
        drawer with a 220ms max-height transition. Default open/
        closed state is reapplied each time the panel opens — not
        persisted, since reopening a section is one tap and tracking
        per-section state is unwarranted complexity.

        Helper added: _mkSection(title, builders, {defaultOpen}).
        The builders array is a list of fns that return DOM elements
        for the drawer body. Lazy build: section contents are only
        constructed when the section first opens, so closed sections
        don't pay any DOM cost.

     2. PLACED-TILE PULSE controls. The pulse introduced in v3.52
        now has three tunable settings under its own section:
          - Enabled (toggle): when off, dim-green tiles render
            static like pre-v3.52. The render path checks
            window._pulseEnabled before applying the .ok-breath
            class.
          - Max brightness (slider, 0.35 → 1.0): peak alpha at the
            midpoint of the breath cycle. 0.9 is v3.52's hardcoded
            peak; 0.35 = base (no pulse); in between dims the
            effect. Glow intensity scales proportionally with peak
            so dimmer pulses also have weaker glow.
          - Synchronize pulses (toggle): when on, every tile shares
            phase 0 so the board pulses in unison. When off (default),
            each tile uses its cell-key-derived hash phase so they
            breathe irregularly (v3.52 behavior).

        Implementation note: CSS @keyframes can't read JS variables,
        so the brightness slider is implemented by injecting a
        runtime <style> element with a regenerated @keyframes rule
        whenever the slider value changes. The runtime rule wins
        the cascade over the static one in the main <style> block.

     3. PULSE SETTINGS PERSISTED. _optPulseEnabled, _optPulsePeak,
        and _optPulseSync are now serialized to localStorage under
        the existing equil_opts_v2 key so settings survive reloads.
        Reset-to-defaults button resets them along with everything
        else.

     v3.52: subtle pulse on dimmed-green placed tiles.
     v3.51: orphaned-comment leak fix.
     v3.50: per-mode save slots.
     v3.42: READY overlay.
     v3.33: trivial-equation crackdown.

     v3.52: Subtle pulse on dimmed-green placed tiles.

     When a player completes an equation, the placed tiles dim to a
     muted green to indicate "this equation is done." Those tiles
     can still be tapped to return them to the bank — useful if the
     player later realizes a placement was wrong despite the equation
     being locally valid (the value fits one equation but breaks
     another that crosses it).

     New @keyframes okBreath gently animates color from the muted
     base to a brighter green and back over 3.6s, with a soft text-
     shadow glow at peak. Applied via the .ok-breath class to dim-
     green blanks in the render path.

     Phase per cell is derived from the cell key (c,r string) so:
       1. Each tile stays at a consistent phase across re-renders.
          render() wipes the grid on every move and rebuilds each
          tile from scratch — without a stable per-tile phase, all
          dim-green tiles would restart animation at 0% on each
          move and stutter instead of breathing continuously.
       2. Different tiles land at different phases so they don't
          pulse in lockstep (which would look like a stutter on
          board-wide moves).

     v3.51: orphaned-comment leak fix.
     v3.50: per-mode save slots.
     v3.42: READY overlay.
     v3.33: trivial-equation crackdown.

     v3.51: Orphaned-comment leak fix.

     When v3.50 added the resume prompt modal HTML, the str_replace
     ate the opening dash-marker of the original v3.42 READY-overlay
     comment block while leaving the body and closing marker intact.
     The parser then rendered all that body text as visible page
     content — Sam noticed it underneath the menu screen ("Shown
     after a puzzle builds (entry from menu, or New tap)...").

     Fix: deleted the orphaned text. The replacement v3.48 comment
     describing the current single-blur design stays.

     v3.50: per-mode save slots.
     v3.49: scrollable stats + single-slot resume.
     v3.42: READY overlay.

     v3.50: Per-mode resume slots + save bug fixes.

     1. PER-(SIZE,DIFF) SAVE SLOTS. Storage changed from a single
        '_equilProgress' key to '_equilProgressMap' — an object
        keyed by 'size|diff'. The player can now have multiple
        in-progress puzzles, one per mode: small-hard, large-medium,
        jumbo-easy, etc. all paused independently.

        One-time migration from v3.49's single-slot format runs on
        first read of _readMap — slurps the legacy key into the new
        map at its (size, diff) slot, removes the old key. Harmless
        if absent.

     2. RESUME PROMPT MOVED FROM MENU TO PLAY. The menu-screen
        Resume banner is removed. Instead, when the player taps
        Play with a saved game for the chosen mode, a modal
        appears: "Resume?" with elapsed time + move count, plus
        RESUME and START NEW buttons. START NEW clears that
        mode's slot and builds a fresh puzzle.

        Discoverability is fine because the prompt only appears
        when relevant (the player just chose the matching mode).
        Cleaner than always-on banners.

     3. SAVE BUG FIX #1: No-move saves suppressed. The previous
        version saved an "empty" puzzle (moves=0, startTs=null)
        every time _saveProgress was called for a freshly-built
        puzzle the player hadn't touched. Now skipped — no point
        offering to resume a zero-progress puzzle.

     4. SAVE BUG FIX #2: Menu button now triggers explicit save.
        Previously, only pagehide/visibilitychange/beforeunload
        events captured exits — the in-app Menu button bypassed
        all of these, so the very last moves before exit weren't
        persisting. showMenu() now calls saveProgress() up front
        so the latest state is always preserved. This addresses
        the v3.49 bug where resumed games kept reverting to the
        first save's state instead of the latest.

        (Note: noteMove also saves on every move, so this is
        belt-and-suspenders. The Menu-button save catches edge
        cases where the player makes a move and exits before the
        save write completes, or where a buggy save earlier in
        the session might have been the last successful write.)

     v3.49: stats scrollable + single-slot save.
     v3.48: ready overlay simplified.
     v3.42: READY overlay.
     v3.33: trivial-equation crackdown.

     v3.49: Scrollable stats + resume-in-progress puzzle.

     1. STATS SCREEN scrollable. Modal inner panel now flex-column
        with max-height:90vh; #statsBody gets overflow-y:auto so
        long lists scroll instead of getting clipped. Title and
        RESET/CLOSE buttons stay pinned, only the data scrolls.

     2. RESUME IN-PROGRESS PUZZLE. The full puzzle state (PZ object
        + mc113 timer/moves/mistakes) is now auto-saved to
        localStorage on every move, on pause, and when the app
        backgrounds (visibilitychange/pagehide). On the menu screen,
        a Resume banner appears if a saved puzzle exists with
        elapsed > 30s and not yet won. Banner shows size, difficulty,
        elapsed time, and move count. Tap to resume; small ✕
        discards.

        Resume flow:
          - showGame({resume: payload}) skips buildPuzzle (uses saved
            PZ), skips _dbgRecordPuzzle (already recorded), skips
            READY overlay (player already committed).
          - mc113.restoreState() back-dates startTs so (Date.now -
            startTs) equals the saved elapsed; timer continues
            from where it left off.
          - mc113.reset({skipClearProgress:true}) avoids wiping
            the save before restore reads from it.

        30s threshold: below this, starting fresh is less friction
        than dealing with a Resume choice. Configurable as
        RESUME_MIN_MS in the banner IIFE.

        The save is cleared automatically on win, on RESET COUNTS-
        style menu actions, and on every fresh puzzle build via the
        existing reset() path.

     v3.48: single blur pane, GO over grid, scroll lock, glow burst.
     v3.47: gray-rectangle fix.
     v3.42: READY overlay.
     v3.41: expanded per-solve data capture.
     v3.33: trivial-equation crackdown.

     v3.48: Ready overlay simplified.

     1. SINGLE BLUR PANE. Two-pane setup left a visible seam between
        grid and bank where you could see numbers when scrolling.
        Replaced with one continuous pane spanning .gscroll top
        through bank-outer bottom, fixed at 4px blur + 0.05 tint.
        No more peek-through gaps.

     2. SCROLL LOCKED while overlay is up. body.style.overflow set
        to hidden on showReady, restored on hideReady. Player can't
        scroll the bank into view to count tiles before tapping GO.

     3. GO BUTTON OVER GRID CENTER, not screen center. Reads as
        "starting in the puzzle area" and centers visually within
        the blurred zone. Position computed dynamically from the
        grid's bounding rect. Resize handler keeps it positioned
        correctly through orientation changes.

     4. TIMER MORPH ABANDONED. Three pill-shapes lined up at the
        masthead top read as cluttered. Removed the timer pill
        outline entirely. Timer is now bare cyan numbers (font-size
        18px, weight 700, letter-spacing 3px) with a soft cyan
        text-shadow.

     5. GLOW-BURST ON GAME START. The "draw attention to timer
        starting" intent is preserved without the morph: when GO
        is tapped, the timer's text-shadow flashes bright (14px +
        28px layered cyan glow), then simmers down to its calm
        steady-state (6px soft glow) over 500ms. Achieves the
        attention-grab without the visual gymnastics.

     6. ANIMATION SIMPLIFIED. GO fades out via CSS opacity (0.4s),
        blur pane fades to 0 via rAF (500ms), timer fades in with
        glow burst, scroll unlocks, overlay hides. Total ~550ms
        instead of the previous ~1100ms. Feels snappier.

     v3.47: two-pane blur + gray-rectangle fix.
     v3.46: masthead cleanup + timer pill (now reverted).
     v3.45: GO morph animation (now removed).
     v3.42: READY overlay before timer starts.
     v3.41: expanded per-solve data capture.
     v3.33: trivial-equation crackdown.

     v3.47: Two-pane blur, gray-rectangle bug fix, arrow centering.

     1. TWO-PANE BLUR. Instead of one full-screen blur, the READY
        overlay now uses two stacked blur panes: 2px over the grid
        (.gscroll), 5px over the number bank (.bank-outer). The
        masthead and stats row stay clear so the GO→timer animation
        and the buttons render sharp through them. Pane positions
        are computed dynamically via getBoundingClientRect on each
        showReady so they track layout/zoom correctly.

        Why different blurs: the grid is information-dense (numbers
        in cells) but you'd want to see the layout to feel ready.
        2px keeps the structure visible. The bank is tile-icons —
        slightly heavier 5px softens the "let me start counting
        which numbers I have" reflex.

        A true gradient blend between the two values isn't possible
        with backdrop-filter, but the gap between the grid and bank
        is a natural visual seam so two distinct zones reads cleanly.

     2. SLIDER REMOVED. Was useful for finding sweet-spot during
        development; values now hardcoded.

     3. GRAY RECTANGLE BUG FIXED. After the first puzzle's GO
        animation, the cleanup did `removeAttribute('style')` to
        reset the button. This stripped EVERY inline style — border,
        background, glow, color, font — leaving the browser default
        gray rectangle that animated up to the timer on the next
        puzzle. Now the original style string is cached once at
        IIFE init, and showReady reapplies it with setAttribute.
        Clean restoration, no surprises.

     4. BACK ARROW OPTICAL CENTERING. Previous fix used line-height:1
        + flex centering, but the ← glyph's ink sits in the upper
        half of its em-box, so flex centered the bounding box (which
        looks low). Wrapped the arrow in a span with translateY(-2px)
        for proper optical centering.

     v3.46: masthead cleanup + timer pill.
     v3.45: GO morph animation.
     v3.42: READY overlay before timer starts.
     v3.41: expanded per-solve data capture.
     v3.33: trivial-equation crackdown.

     v3.46: Masthead cleanup + timer pill + matching button heights.

     1. GRAY HINTS REMOVED. The "Tap a square · then a number..."
        hint line under the masthead is hidden. Will revisit as a
        one-time startup overlay later if needed.

     2. BUTTON HEIGHTS LOCKED. Back, Pause, New, and ⚙ all now sit
        at 28px tall. Settings was already 28x28; the others were
        slightly taller from .mast-back's default vertical padding.
        Visual rhythm across all four masthead buttons.

     3. BACK ARROW CENTERED. The previous line-height:0.5 trick
        (necessary to keep the big ← from inflating the button)
        floated the arrow upward off-center. Replaced with flex
        centering + line-height:1 so the arrow sits dead center.
        Font size dropped 32px → 24px to fit cleanly inside 28px
        height.

     4. STATS ROW REORDERED. Moves moved from RIGHT of timer to
        LEFT — they were getting bunched up with mistakes on the
        right side. Now: [moves]  [TIMER PILL]  [mistakes]. Clean
        three-zone layout.

     5. TIMER STYLED AS A PILL. The timer is now a cyan-outlined
        pill with a soft glow, ~2x its previous visual footprint
        (font-size 11px → 14px, plus border + padding + glow).
        Matches the visual language of the other masthead buttons.
        No ⏱ icon — just the numbers in cyan.

     6. GO → TIMER ANIMATION UPDATED. The GO button still has its
        original size and color on the READY overlay. On tap, it
        now morphs to the timer pill's EXACT rect (width, height,
        position, padding, glow, border-width all match) — so it
        lands as a perfect pill, not just shrunken text. Result
        reads as "the GO button stretched into the new timer pill".

     v3.45: blur slider + GO morph animation.
     v3.44: masthead button polish.
     v3.42: READY overlay before timer starts.
     v3.41: expanded per-solve data capture.
     v3.33: trivial-equation crackdown.

     v3.45: READY overlay — blur slider + GO-becomes-timer animation.

     Three things landed:

     1. BLUR SLIDER. A range slider sits below the GO button on the
        ready overlay, 0-20px range with 0.5 step. Live updates the
        backdrop-filter as you drag, displays "N.Npx" beside it.
        Final value persists in localStorage so the sweet-spot
        survives reloads. Default 4px (already a real improvement
        from v3.42's 12px). Slider taps don't bubble up to the
        overlay's tap-to-dismiss handler — only taps on background
        or the GO button dismiss.

     2. GO BUTTON ANIMATES INTO THE TIMER. On tap:
        a. Button captures its current rect, then pins itself fixed
           at that exact pixel position so the rest of the overlay
           can fade away without dragging it along.
        b. Slider fades out immediately.
        c. Backdrop blur eases from current value down to 0 over
           600ms (rAF loop since backdrop-filter doesn't transition
           reliably across browsers); tint fades alongside.
        d. Button transitions over 700ms to the timer's slot —
           shrinks to match the timer's font-size, drops its filled
           background and inner glow, keeps just an outline.
        e. Mid-animation (350ms in) the button's label swaps from
           "▶ GO" to the live timer reading. From here the button
           IS the timer, visually and numerically.
        f. After dock completes (720ms): real #mastTimerWrap fades
           back in (it was hidden at opacity:0 during showReady),
           button fades out in parallel. The actual timer element
           takes over seamlessly.
        g. Button styles reset for the next puzzle.

        The actual mc113.startTimer() fires immediately on tap so
        the live numbers are correct when they appear in the button
        mid-animation. No "started but showed 0:00 for a beat" lag.

     3. STATS ROW restructured. Was: [⏱ 0:00 · 0 moves] all centered
        with a · between. Now 3-slot layout: empty left, timer
        center, moves+mistakes right-aligned. The empty left slot
        keeps the timer optically centered. The animated GO button
        needs the timer in a predictable centered location to dock
        into, and the new layout makes "moves to the right" trivial.

     Per-solve data still includes mv (moves) and all the v3.41
     metrics — the new animation doesn't change recorded data.

     v3.44: masthead button polish.
     v3.43: lighter ready overlay.
     v3.42: READY overlay before timer starts.
     v3.41: expanded per-solve data capture.
     v3.33: trivial-equation crackdown.

     v3.44: Masthead button polish + lighter ready overlay.

     1. Back button restored to default size (matches New). Arrow
        sized up ~5x via inline font-size:32px so it dominates the
        button. line-height:0.5 keeps the button height normal —
        without that override, the tall ← character pushed the
        button vertically.

     2. Pause button switched from the ⏸ emoji to two CSS-drawn
        vertical cyan bars. The emoji rendered yellow on Android
        Chrome/Brave despite the inline color:var(--cyan) — emoji
        glyphs ignore CSS color. Bars are 3px×14px with a soft cyan
        glow matching the rest of the masthead palette.

     3. Both buttons share the same padding:8px 14px so they have
        equal proportions next to each other.

     4. Ready overlay further lightened: tint 0.15→0.05, blur 6px→4px.
        Puzzle behind is now clearly visible with just enough soft-
        ening to feel "not yet active". GO button stands out via
        its glow rather than against a dark backdrop.

     v3.43: ready overlay first lighten.
     v3.42: READY overlay before timer starts.
     v3.41: expanded per-solve data capture.
     v3.33: trivial-equation crackdown.

     v3.43: READY overlay — lighter tint, less blur.

     Previous values (rgba(0,0,0,0.45) + blur(12px)) made the
     puzzle behind look like a black smear. Lowered to rgba 0.15
     and blur 6px so the puzzle shapes show through clearly while
     still being too soft to actually solve. The GO button glow
     still pops against the lighter tint.

     v3.42: READY overlay before timer starts.
     v3.41: expanded per-solve data capture.
     v3.33: trivial-equation crackdown.

     v3.42: READY overlay before timer starts.

     After a puzzle builds (Play from menu, New from masthead,
     Daily, etc), a full-screen blurred overlay with a single GO
     button appears. The puzzle is visible behind through the
     backdrop-filter blur — the player can see they're in the
     game and ready to start, but everything's softened so they
     can't actually start solving yet. Tapping GO (or anywhere on
     the overlay) dismisses it and explicitly kicks off the timer
     via the new mc113.startTimer() method.

     Why: hard puzzles with only 3-4 given numbers can take 1-2
     minutes of "where do I even start" thinking before the player
     makes their first move. Previously the timer was started by
     the first noteMove() call, so all that thinking time wasn't
     counted. This polluted the calibration dataset (especially
     for harder difficulties) and also wouldn't reflect what a
     real timed mode would feel like — in production timer mode,
     the clock should start when the player commits to playing.

     Implementation:
       - mc113 gains a startTimer() method that sets startTs
         without incrementing moves. noteMove still works as
         a fallback (so testing flows that skip the overlay
         continue to function).
       - readyOverlay z-index 320, uses backdrop-filter:blur(12px)
         + rgba(0,0,0,0.45) tint for the blurred-frosted look.
       - showMenu hides the overlay if user backs out before
         tapping GO.
       - Tap-anywhere-to-dismiss matches the pause overlay UX.

     v3.41: expanded per-solve data capture.
     v3.40: pause moved to left of menu.
     v3.39: TIMES export/import.
     v3.38: pause feature.
     v3.33: trivial-equation crackdown.

     v3.41: TIMES — expanded per-solve data capture.

     Beyond v3.37's existing fields, each recorded solve now also
     captures (short keys to keep storage compact):
       col, row, cells   — grid dimensions and total cell count
       xlEq, mainEq      — XL (4-cell) vs main (5-cell) eq split
       maxA, minA, avgA  — answer-value distribution (max/min/avg
                            of all answer values in the puzzle)
       uVl, dup          — bank uniqueness: distinct values count
                            and duplicate-instance count
       mv                — total moves at win
       dly               — 1 if daily puzzle, 0 if random
       ddate             — daily date string (only present for
                            daily puzzles)
       t                 — timestamp at solve (ms since epoch)

     The display still shows what it showed before (template, time,
     mistakes, basic metrics) — these new fields are stored for
     analysis later. Easy to extract: every entry is a flat JSON
     object with all variables, ready to drop into a spreadsheet,
     pandas DataFrame, or any other tool for filtering/regression/
     pivoting.

     Useful queries this enables:
       - "avg ms per blank tile, segmented by div count"
       - "do puzzles with maxA>50 take longer than maxA<20?"
       - "moves-per-blank efficiency by template"
       - "am I faster solving on Sunday morning vs Tuesday night?"
       - "do bank-duplicate-heavy puzzles solve faster?"
       - eventually: full multi-feature regression for timer formula

     v3.40: pause moved to left of menu.
     v3.39: TIMES export/import.
     v3.38: pause feature.
     v3.37: per-solve dataset.
     v3.33: trivial-equation crackdown.

     v3.40: Pause button repositioned to left of Menu.

     Moved the ⏸ pause button from the right side (next to New) to
     the left side (next to Menu). The right side was crowded —
     two cyan-glow buttons risked overlapping the EQUIL title on
     narrow viewports.

     Menu button trimmed from "← Menu" to just "←" with tightened
     padding (6px 14px → 6px 10px). The arrow alone reads as "back"
     clearly enough in context, and the freed space lets the pause
     button sit comfortably next to it without the layout shifting.

     Pause button uses the same tight padding for visual symmetry.

     v3.39: TIMES export/import.
     v3.38: menu size-highlight + pause feature.
     v3.33: trivial-equation crackdown (4.56 → 0.25 trivials).

     v3.39: TIMES — EXPORT / IMPORT.

     Added two buttons above RESET TIMES in the TIMES panel.
       EXPORT: downloads all _dbgTimes data as
               equil-times-YYYY-MM-DDTHH-MM-SS.json
       IMPORT: opens a file picker; loads a previously-exported
               JSON. Merges with current data (appends to each
               size,diff bucket) — for a clean slate, hit RESET
               TIMES first then IMPORT.

     Why: the Claude in-app webview treats each HTML file as a
     fresh ephemeral session, so localStorage doesn't persist
     across versions opened in the app. Now Sam can export before
     closing one version and import into the next to preserve the
     calibration dataset across builds.

     Format is wrapped with metadata for future-proofing:
       { version:1, kind:'equil-times', exportedAt, data }
     IMPORT also accepts a raw _dbgTimes object as a fallback so
     hand-edited or older formats still work.

     Visual feedback: button text shows SAVED ✓ / LOADED ✓ on
     success or ERROR / BAD FILE / READ ERR on failure, then
     reverts after 1.2-1.5s.

     v3.38: menu size-highlight + Pause feature.
     v3.37: full per-solve dataset + ANALYSIS tab.
     v3.33: trivial-equation crackdown (4.56 → 0.25 trivials).

     v3.38: Menu size-highlight persistence + Pause feature.

     1. SIZE PERSISTENCE ON MENU RETURN
        Returning to the menu via the Menu button left all size
        buttons un-highlighted because the .on class only got toggled
        by direct clicks. Now showMenu() re-applies .on to whichever
        size matches the global SIZE so the user sees their last
        selection without re-tapping. Also re-applies the xl2-mode
        body class.

        Side fix: the size-button click handler used a broad
        querySelectorAll('[data-size]') which also swept the new
        TIMES panel tabs. Scoped to '.sel-btn[data-size]' so the
        two systems no longer cross-contaminate.

     2. PAUSE BUTTON
        New ⏸ button squeezed into the right side of the masthead,
        left of the New button. Same .mast-back chassis as Menu/New
        so it visually fits. Tapping it:
          - Pauses the timer (mc113.pause() shifts startTs on resume
            so no time leaks during the pause).
          - Shows a full-screen overlay (#pauseOverlay) with "PAUSED"
            heading, "tap to resume" hint, and a ▶ RESUME button.
          - Tapping anywhere on the overlay (including the button)
            calls mc113.resume() and dismisses.
        The pause button is a no-op before the first move (timer
        hasn't started) and after a win (puzzle is locked).
        Position is temporary — better real estate may exist later.

     v3.37: full per-solve dataset + ANALYSIS tab.
     v3.36: per-time mistakes display.
     v3.33: trivial-equation crackdown (4.56 → 0.25 trivials).
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver.

     v3.37: TIMES — full per-solve dataset + ANALYSIS tab.

     Per-solve recording now captures:
       - template name (TS, TQ, TS3, etc)
       - total equations, blanks, givens (non-blank num cells)
       - 1/2/3-blank equation counts
       - +/-/×/÷ operator counts
       - trivial-eq count
     ...in addition to the existing time, mistakes.

     List view now shows:
       - line 1: template, time, ✕mistakes/✓clean, ★ best marker
       - line 2 (muted): "21bk 5/9/0b 8+ 8- 4× 4÷ · 2tr"
                          blanks · 1/2/3-blank eqs · op counts · trivials

     New ANLZ tab next to the size tabs. Three sections:
       1. BY (SIZE, DIFF) — n, avg time, avg mistakes per bucket
       2. BY TEMPLATE — same but grouped by template name
       3. SCALING (ms/unit) — for each feature (blank, given, eq,
          op, trivial), shows avg count per puzzle and rough seconds-
          per-unit. Useful for deriving timer-formula coefficients
          like "each blank takes ~3s, each ÷ adds ~5s".

     The scaling numbers are intentionally simple (avg time / avg
     feature, not a real regression). Once we have enough samples
     across diff sizes, can upgrade to least-squares.

     Goal: empirical timer calibration. Play a sample of puzzles
     across all (size, diff) combinations, then read off coefficients
     from the ANLZ tab to derive a formula like:
       target_seconds = base + 3*blanks + 2*ops + 5*divs - 4*trivials

     Legacy entries (pre-v3.37) without metrics still display in the
     list view (just no second-line metrics) and are excluded from
     analysis aggregation.

     v3.36: per-time mistakes display.
     v3.35: separate TIMES panel.
     v3.33: trivial-equation crackdown (4.56 → 0.25 trivials).
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver.

     v3.36: TIMES panel — mistakes tracking + solid default opacity.

     Each recorded time now also stores the mistake count for that
     run. Display additions:
       - Each column's header now shows "avg ✕" (avg mistakes per
         solve) under the existing best/avg time pills
       - Each listed time shows its mistake count inline:
           1:23 ✓     (clean run, zero mistakes)
           1:45 ✕2    (2 mistakes)
           1:12 ★     (best time, marker stays)
           1:12 ✓ ★   (best time + clean — both shown)

     Storage migrated from bare ms numbers to {ms, mk} objects.
     Legacy entries (just numbers) still display correctly — they
     just lack the mistake count badge. The avg ✕ calculation only
     averages over entries that have a recorded mistake count, so
     a column with mixed legacy and new entries shows a number
     based on the new ones. If none have mistake data yet, displays
     "—".

     TIMES panel now defaults to ● solid (idx 2) instead of ◐ see-
     through. It's a reference-lookup panel — being able to read
     the times clearly matters more than seeing the puzzle behind.
     User's saved choice still wins if they've cycled it before.

     v3.35: separate TIMES panel.
     v3.34: opacity toggle button.
     v3.33: trivial-equation crackdown (4.56 → 0.25 trivials).
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver.

     v3.35: Second debug panel — TIMES.

     New TIMES button next to COUNTS opens a separate panel for
     tracking solve times. Same green styling, drag, opacity cycle
     (◐/◑/●), close button, and two-tap reset as the COUNTS panel.

     Layout:
       - 4 size tabs at top: SMALL / MEDIUM / LARGE / JUMBO
       - 3 columns under: EASY / MEDIUM / HARD
       - Each column shows count, best time, avg time at top, then
         every recorded time newest-first, scrollable
       - Best time gets a ★ marker

     Recording: hooks into mc113.recordWin so every solved puzzle
     gets logged automatically. Independent storage from the user-
     facing stats — RESET TIMES doesn't touch user records.

     Active size tab persists in localStorage so it doesn't reset
     between sessions.

     Setup for upcoming timer mode: now we can play a few dozen
     puzzles per (size, diff) and read off baseline solve times to
     calibrate the timer budget.

     v3.34: opacity toggle button.
     v3.33: trivial-equation crackdown (4.56 → 0.25 trivials).
     v3.32: PUZZLE AVERAGES section.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver.

     v3.34: Debug panel — opacity toggle button.

     New ◐/◑/● button next to the close ✕. Cycles three background
     opacity states:
       ◐  see-through (0.10 alpha) — puzzle visible behind panel
       ◑  medium      (0.55 alpha) — values clear, puzzle hinted
       ●  solid       (0.95 alpha) — values pop, puzzle hidden
     Persists in localStorage so the choice survives reloads.

     v3.33 trivial-eq fix shipped: 820-roll baseline avg of 4.56
     trivials/puzzle dropped to 0.25 in fresh data (Large/Medium,
     ~263 puzzles). 76% of puzzles now have 0 trivials, 22% have 1,
     1% have 2. Op mix shifted slightly: + and − each rose by less
     than 0.5 per puzzle (expected — the solver falls back to
     additive ops when ×÷ would have been trivial). Net win.

     v3.33: trivial-equation crackdown.
     v3.32: PUZZLE AVERAGES + collapsible CURRENT.
     v3.31: operator counts + trivial detection.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver.

     v3.33: TRIVIAL EQUATION CRACKDOWN.

     820-puzzle data (Large/Medium) showed avg 4.56 trivials per
     puzzle. Trivials hist: 0t=11, 1t=45, 2t=398 (modal), 3t=130,
     4t=166, 5t=128, 6t=96, 7+t=140. 30%+ of puzzles had 5 or more
     trivial eqs. Two-pronged fix:

     (1) Solver bias against 1s.
       genNums BFS solver setCount=0 and setCount=1 branches now use
       ri(2,N) instead of ri(1,N) for free-choice values. With 1s
       not in the random pool, trivials seeded into setCount=0 (a=1
       with op=x: 1xn=n) and setCount=1 (b=1 with op=/: n/1=n) drop
       dramatically. setCount=2 (where crossings force values) still
       allows 1s when the math demands it, but the op-rank sort puts
       +/- before x/÷ when a 1 is locked, so 1*5=5 is avoided in
       favor of 1+5=6 etc.
     (2) Post-gen reject.
       After buildPuzzle completes a candidate, count trivials. If
       above 12% of total eqs (Large=2 max, Medium=1 max), retry up
       to 30 times. With the solver bias already cutting trivials,
       this catches the remaining cases where structure forces them.

     Expected: avg trivials should drop from 4.56 to ~1-2.

     v3.32: PUZZLE AVERAGES + collapsible CURRENT.
     v3.31: operator counts + trivial detection.
     v3.30: column alignment.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver.

     v3.32: PUZZLE AVERAGES section + collapsible CURRENT PUZZLE.

     Added a new collapsible section that tracks running stats across
     every puzzle rolled in the session:
       - puzzles recorded
       - avg 1/2/3-blank eqs per puzzle
       - avg + - × ÷ ops per puzzle
       - avg trivials per puzzle
       - histogram of trivial-count distribution (how many puzzles
         had 0 trivials, how many had 1, etc.)

     CURRENT PUZZLE section is now also collapsible (default open).

     Recording happens after every successful puzzle build. State
     persists in localStorage and resets with RESET COUNTS.

     User reported seeing puzzles with 11 and 13 trivial equations
     (out of 24 total!) — that's huge. The histogram will tell us
     whether that's an outlier or a common mode. If avg trivials is
     >3 we should probably gate generation to retry trivial-heavy
     rolls. Will decide after seeing real distribution data.

     Also fixed: the panel-refresh-after-build hooks were checking
     display==='block' but the panel uses 'flex' since v3.27, so
     auto-refresh on New tap was silently broken. Now corrected.

     v3.31: operator counts + trivial detection.
     v3.30: column alignment with CSS grid.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.31: Debug panel — operator + trivial-eq stats.

     Added to CURRENT PUZZLE section:
       + ops: count of addition operators in the puzzle
       - ops: subtraction
       × ops: multiplication
       ÷ ops: division
       trivial eqs: count of equations that give the player no real
         deduction work. A 5-cell equation is trivial when:
           - both 1*1, 1+1, 1-1 etc (a=1 and b=1)
           - any cell is 1 with op = × or ÷ (1×n=n or n÷1=n)
           - both operands equal with op = ÷ (always 1)
         Trivials are reported only — not yet stripped from generation.
         This is groundwork for a future tweak: either reroll puzzles
         with too many trivials, or add cost in the future timer-mode
         calculation.

     Use case: helps see at a glance whether a Hard puzzle is genuinely
     hard or just busy with single-digit arithmetic. Also lets us spot
     templates whose values-gen produces trivial-heavy puzzles.

     Future work hinted at: timer mode where each (size, diff) gets a
     calibrated time budget, possibly tweaked by op mix and trivial
     count. Not implementing yet — needs baseline play data first.

     v3.30: column alignment with CSS grid.
     v3.29: live update + gray pills.
     v3.28: half-size text.
     v3.27: drag/scroll conflict fix.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.30: Debug panel column alignment.

     - Switched the three sections from inline text+br layout to CSS
       grid. Every value now lines up vertically with the values in
       its peer rows.
       - CURRENT PUZZLE: 2 columns (label, value).
       - TEMPLATE COUNTS: 3 columns (name, pick=N, final=N).
       - FAIL REASONS: 2 columns (label, value).
     - Columns auto-size to max-content, so the value pills sit
       directly after the longest label rather than being shoved to
       the panel's right edge.
     - Removed the side margin on the pill span (was creating tiny
       offset that broke perfect alignment).

     v3.29: live update + gray pills.
     v3.28: half-size text, no blur.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.29: Debug panel polish.

     - Body text 4px (was 6px). Headers stay at 6px so the hierarchy
       reads at a glance.
     - Number values get a subtle gray pill behind them (60% gray
       background, slight padding, rounded corners) so they pop out
       from the surrounding label text. Applied to puzzle stats,
       template counts, and fail reasons.
     - Live update: panel re-renders every time _dbgBumpPick,
       _dbgBumpFinal, or _dbgBumpFail fires. Throttled via
       requestAnimationFrame so rapid retries (1000+ mismatch bumps
       per genNums attempt) coalesce into one DOM update per frame.

     v3.28: half-size text, blur removed.
     v3.27: drag/scroll conflict fixed.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.28: Debug panel — half text size, no backdrop blur.

     - Font size 12px to 6px (everywhere: body text, headers, buttons,
       arrow icons). All padding, gaps, border radii halved to match.
     - Max-width halved 440 to 220 since content is now tighter.
     - Removed backdrop-filter:blur(2px). The blur was deliberately
       softening the puzzle behind the panel for readability, but the
       puzzle should stay sharp. The 10% alpha background gives a
       subtle dimming only.

     v3.27: Drag/scroll conflict fixed.
     v3.26: Background opacity layer change.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.27: Drag/scroll conflict fixed.

     - Drag handle is now the header bar only (the row with ⋮⋮ DEBUG
       and the ✕). Header label updated to "⋮⋮ DEBUG (drag here)" so
       it's discoverable.
     - The middle scrollable section uses touch-action:pan-y, allowing
       finger scroll without competing with drag gestures.
     - Background opacity dropped from 30% to 10% per request.
     - Panel uses max-width again (was 'width' fixed at 440px which
       made it always max-wide regardless of content) so it shrinks
       to its content.

     v3.26: Background opacity layer change, scroll fix attempt 1,
            two-tap reset confirm.
     v3.25: green palette.
     v3.24c: comment-leak fix.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.26: Debug panel readability and reset fix.

     - Background switched from CSS opacity 0.5 (which dimmed everything
       inside, including text) to rgba alpha 0.30 on the background only.
       Text and accents now render at full opacity; window-behind shows
       through 70% only on the background layer. Much clearer reading.
     - Width fixed (was max-width); panel grows downward only, never
       sideways. Combined with overflow-x:hidden so long content lines
       no longer push the layout wider than the panel.
     - Panel max-height tightened to 75vh and box-sizing:border-box so
       padding stays inside the height limit. Combined with overflow-y:
       auto, the panel always scrolls when content exceeds the limit.
       The RESET COUNTS button at the bottom is reachable on every
       device once you scroll within the panel.
     - Reset button now uses a two-tap in-page confirm. First tap arms
       and shows TAP AGAIN TO CONFIRM in red. Second tap within 3s
       executes. Replaces browser confirm() which is blocked in some
       webviews including the Claude in-app browser, where the reset
       button silently did nothing in v3.25.
     - Added subtle backdrop-filter:blur(2px) so text remains legible
       even with 30% background alpha.

     v3.25: Green palette, drag-anywhere, default collapsed sections.
     v3.24c: comment-leak fix.
     v3.24b: comment-leak fix.
     v3.24: opacity, drag, position absolute.
     v3.23: debug panel UX overhaul.
     v3.22: LRG2 cleanup.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.25: Debug panel cosmetics + drag rework.

     - Color: cyan to green. Background near-black with green accents,
       text in soft mint. Easier to glance at against the cyan game UI.
     - Opacity: 0.40 to 0.50 (slightly more readable, still ghostly).
     - Both collapsible sections (TEMPLATE COUNTS, FAIL REASONS) now
       default to closed. Panel opens compact; tap a header to expand.
     - Drag handle expanded from header-only to whole panel. Excluded
       zones: the close button, RESET COUNTS button, and the two
       section-header rows. Tapping any of those still triggers their
       click action; tapping anywhere else starts a drag.

     v3.24c: comment-leak fix (literal close-comment chars in changelog).
     v3.24b: comment-leak fix (premature close in changelog).
     v3.24: opacity, drag, position absolute.
     v3.23: debug panel UX overhaul.
     v3.22: LRG2 cleanup.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver fixed Large fallback bug.

     v3.24c: Fix v3.24b changelog itself containing literal close-comment
     character sequences inside quoted strings. HTML parsers don't care
     about quotes inside comments — the first occurrence of the close
     sequence ends the comment, period. Replaced all literal close
     sequences in the new changelog text with safe descriptions.
     Removed the stray close tag that ended the v3.24 entry; the original
     wrapping comment now continues uninterrupted to its real close at
     line 3806.

     This is the FOURTH time this exact bug has happened in this session
     (v3.24c needed because v3.24b's changelog itself contained literal
     close-comment sequences in quoted strings, which still close the
     HTML comment regardless of being quoted in source).
     Lesson logged for future Claude: when adding a new entry to the
     top of an existing comment block, never add a closing tag, AND
     never write the literal close-comment characters (dash-dash-gt)
     anywhere inside a comment, even in quotes.

     v3.24: Debug panel — opacity 0.40, draggable, position absolute.

     - Default opacity dropped from 0.92 → 0.40. Sits ghostly over
       the puzzle; values still readable but the puzzle is the focus.
     - Panel is now draggable by its header bar (which shows ⋮⋮ DEBUG
       and a move cursor on desktop). Mouse + touch both supported.
       First drag switches the panel from "centered via transform" to
       explicit left/top so the position sticks where you put it.
     - Position changed from `fixed` to `absolute`. The Claude in-app
       webview was likely clipping fixed-positioned overlays, which
       explained why the panel didn't show up there. Absolute + a
       very high z-index (99999) should render reliably.
     - Default top is 80px so the panel doesn't cover the masthead
       on first open.

     v3.23: Debug panel UX overhaul.
     v3.22: LRG2 cleanup.
     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver — fixed Large fallback bug.

     - LRG2 debug size removed. v3.20c proved values-gen reliability,
       so the A/B test served its purpose. Pool selection, minDiv,
       TILE_VALUE_CAP, maxR, cascade, canonicalCols, maxCS — all
       lrg2-conditional branches stripped.

     - COUNTS dialog: no longer accidentally resets on OK tap.
       Quick tap = view counts (alert, no buttons that delete data).
       Long-press (650ms) = reset confirm (separate gesture, second
       confirm + audio feedback + post-reset alert).

     - COUNTS dialog now shows current puzzle stats:
         equation count, total blanks, blank distribution
         (1-blank/2-blank/3-blank counts). Useful for tuning future
         template designs and difficulty curves.

     - Audio feedback on COUNTS open (modal-open chirp), reset confirm
       and reset success (modal-close chirp). Tap registration is now
       audible.

     v3.21: Hard mode 3-blank bias.
     v3.20c: Backtracking BFS-order solver — fixed Large fallback bug.
     v3.20b/v3.20: bridge pre-seed + fail-reason logging.
     v3.19: LRG2 debug size (now removed).
     v3.18d-b: picker history fixes.
     v3.18: original Large diagnosis.

     Pre-v3.21 Hard puzzles averaged ~1 three-blank equation per puzzle
     (sometimes zero). Players couldn't tell Hard from Medium-diff
     except by total blank count. Root cause: random shuffle in step 2
     spreads blanks evenly, and the "every eq has at least 1 blank"
     seeding leaves only 2-3 blanks of the target as "extras" — those
     extras land randomly, rarely concentrating into 3-blank patterns.

     Fix: when allowAll3 is true, score each candidate cell by how much
     adding it would help complete a 3-blank equation. Cells in fully-
     crossed equations with 2 already-blank cells get top priority,
     then 1-blank fully-crossed eqs, etc. Random tiebreaker preserves
     variety across rolls.

     Result on TS Hard Large (Node simulation): avg 3-blank eqs went
     from 2.24 to 5.16 per puzzle. Distribution {2:2,3:2,4:15,5:30,
     6:22,7:8} — most puzzles now have 4-7 three-blank equations.

     v3.20c: backtracking BFS-order solver fixed the Large fallback
     bug. v3.20c is foundational; without it, Hard puzzles fell back
     to Medium-diff so often the 3-blank issue was masked.
     Fixes the root cause of Large/Medium fallback rates (~37% in v3.18,
     ~13-17% in v3.20b after partial fix).

     Diagnosis: TS-family templates have bridge V equations whose all 3
     num cells are crossings with H equations on rows 6, 8, 10. When the
     legacy genNums propagation reached these bridges, all 3 cells were
     locked by upper/lower H equations. Only ~3% of random integer
     triples (a,b,c) satisfy ANY of +/-/×/÷ as op (verified by Node
     simulation). 97% of attempts fired integrity check "mismatch".

     Counter data confirmed: TS3:mismatch=1196, TS5:mismatch=1148,
     TS9:mismatch=1209 with only 7-8 picks each — meaning ~150 mismatch
     retries per pick.

     Fix (multi-step):
       1. Build cell→equation map and adjacency graph.
       2. Identify "fully-crossed" eqs: all 3 cells shared with another eq.
       3. Pick a fully-crossed root. BFS from it, prioritizing fully-
          crossed neighbors at each level.
       4. For each eq in BFS order, count its already-set cells:
            setCount=0 → free choice of op + values
            setCount=1 → pick op + 2 values, anchor on the set cell
            setCount=2 → solve constructively for 3rd cell
            setCount=3 → check if existing op satisfies; backtrack if not
       5. On failure, backtrack to predecessor and retry.
       6. Up to 5 fresh BFS-tree restarts.
       7. Legacy solveOne propagation runs after as no-op fallback (when
          BT solver succeeds, every equation already has all 3 cells +
          OPS assigned, so solveOne's hA&&hB&&hC path returns immediately).

     Node simulation across all templates: 74-88% success rate per
     attempt. With buildPuzzle's 120-retry budget, fallback rate should
     drop to effectively 0%.

     v3.20b (predecessor): bridge pre-seed only — fully-crossed eqs
     seeded with random satisfying values, then legacy propagation. Cut
     fallback ~37% → 13-17%. Worked partially because eqs that started
     with 0-2 crossings could still hit the all-3-locked state during
     propagation.

     v3.20: failure-reason instrumentation in COUNTS dialog (kept).
     v3.19: LRG2 debug size (kept for A/B testing — will remove once
            confirmed).
     v3.18d-b: picker history fixes.
     v3.18: original Large-rolls-give-Medium-templates diagnosis.
     v3.04 onwards: target-blank-count system. Full history below.

     v3.19: Add a temporary "LRG2" size for A/B testing loose vs tight
     values-gen constraints on Large templates.

     v3.18d data showed Large still has 30-40% fallback rate to TP/TO
     even after fixing the retry-history bug. The values generator
     simply can't satisfy TS-family templates often enough at current
     constraints. Three things might be the actual blockers:
       1. minDiv=4 (4 forced division ops) is hard with tight crossings
       2. TILE_VALUE_CAP=10 rejects any layout with 11+ duplicates
       3. Both compounded with target=21/26 blanks

     LRG2 is a 5th size, identical to Large in pool/cells/canonical/
     target, but with loosened values-gen constraints:
       - minDiv: 4 → 2  (Large stays at 4)
       - TILE_VALUE_CAP: 10 → 14 (Large stays at 10)

     Side-by-side comparison: roll Large 30 times, roll LRG2 30 times,
     compare orange-fallback rates from the debug counter. If LRG2
     drops fallback to <10%, we know constraints were the issue.

     Fallback cascade for LRG2 still ends at Medium-size templates,
     same as Large — the goal is to never trigger the cascade in the
     first place.

     The user also flagged that Hard puzzles haven't been showing
     3-blank equations recently. That's noted but not addressed in
     this version — diagnosing the 3-blank issue takes its own session
     since it touches selectBlanks and the canSolveWithCrossings logic.

     Pool state: unchanged.
       Small: [TA, TJ, TM]
       Medium: [TN, TO, TP, TQ, TQ2]
       Large: [TS, TS3, TS5, TS9]
       Lrg2: [TS, TS3, TS5, TS9]  (same pool, different gen constraints)
       Jumbo: [TX2_sq_A..D]

     LRG2 is a temporary diagnostic; if it works, the looser constraints
     graduate to regular Large and LRG2 gets removed.

     v3.18d: Retry picks ignore history so 120 retries can land on any
     of the 4 Large templates instead of just the 1 not-recently-picked.
     v3.18: Diagnose and partially fix the "Large rolls give Medium
     templates 80% of the time" bug + add debug template label +
     fix retry-template-swap bug.

     User reported in v3.17: 80% of Large rolls came out as
     Medium-pool templates. Then in v3.18 v2: 90% of Medium rolls
     came out as TP. Took THREE rounds of diagnosis to find the
     full picture.

     ROUND 1 (v3.18 v1): Lower Hard target from 30 to 26 (was too
     tight, causing fallback). Add debug label so user can identify
     templates without screenshots.

     ROUND 2 (v3.18 v2): Found that the flag-clearing logic for
     window._fallbackFrom was wrong — recursive fallback calls
     (which use _retry=0, _divRetry=0) were tripping the entry-line
     clearer and wiping the warning. Fixed by passing _opts._isFallback
     on cascade recursions so the clearer can distinguish.

     ROUND 3 (v3.18 v3 — this version): Even with the warning fixed,
     90% of Medium rolls were TP with no orange warning. Tracked
     down to the values-gen retry loop calling _pickTemplate AGAIN
     on each retry — silently swapping templates. So the user
     requested Medium/Hard, the picker chose (say) TQ, values-gen
     failed, retry recursion entered buildPuzzle, _pickTemplate
     picked again — possibly a different template — and so on for
     up to 60 retries. Templates with poor values-gen reliability
     (TN, TO, TQ, TQ2) effectively never won; only TP, the most
     reliably-generatable Medium template, made it to the user.
     The label (set by _pickTemplate on its final success) showed
     TP, with no orange because no cascade fired.

     Fix: retries now preserve the same template via _opts._stickyTmpl.
     A template that fails values-gen exhausts its 60 retries on
     ITS OWN values, then triggers a real fallback (with orange
     warning) instead of silently borrowing TP's success. divRetry
     also preserves the sticky template (only values are
     regenerated). Fallback cascade calls strip _stickyTmpl so
     the new (size,diff) gets a fresh pick from its own pool.

     ALSO in this version:

     1) TT removed from Large pool, TS-family restored (TS, TS3,
        TS5, TS9). TT was failing values-gen 80% of the time
        which masked the bug as a Large-pool issue.

     2) Hard target stays at 26 (reverted from 30). Less ambitious
        but won't trigger fallback as often.

     EXPECTED USER-VISIBLE CHANGES with v3.18 v3:
     - Pool distributions become honest. If a template can't
       generate values, the user will see a fallback warning
       instead of getting a different template silently.
     - Likely MORE orange warnings now, especially on Medium/Hard
       and Large/Hard. Each warning says "X ⚠ from medium/hard"
       (or whatever) — the X is the template that ultimately
       succeeded in the cascade, and the "from" tells what was
       requested. We can use these warnings to identify which
       templates have generation problems and need replacement.

     Pool state:
       Small  : [TA, TJ, TM]
       Medium : [TN, TO, TP, TQ, TQ2]
       Large  : [TS, TS3, TS5, TS9]
       Jumbo  : [TX2_sq_A..D]

     v3.17: Replace TS-family with denser TT-family Large templates.

     v3.16 attempted to fix Large feel via maxCS bump (26→36) and
     Hard target bump (26→30). User feedback after v3.16: "Both
     don't belong in large" — neither Medium-diff nor Hard-diff
     Large rolls felt Large despite the changes. The maxCS bump
     didn't help because on small phones (~360px wide), Large
     cells are constrained by available width, not the cap. Cells
     render at ~22px on Large vs ~26px on Medium — Medium cells
     are bigger.

     Hypothesis for this version: the perceived "smallness" comes
     from TS-family's hollow-frame structure. The interior is
     mostly empty (frame around hollow middle), so the puzzle
     reads as "frame with empty space" rather than "dense large
     grid." Trying a denser template that fills more of the
     interior to see if that changes the perception.

     NEW TEMPLATE: TT (replaces TS-family).

     13×13 footprint, 25 equations, 44 unique num cells, 31
     crossings, 13 uncrossed cells.

     Structure:
       Rows 0/4/8/12: H pairs (h_l + h_r) covering corners
       Rows 2/6/10:   h_mid only (cols 4-8) covering middle column
       Outer V cols (0/2/10/12): stacks rows 0-4 + rows 8-12
       Inner V cols 4/8: stacks rows 0-4 + rows 6-10 (BRIDGE)
       Center V col 6:  stacks rows 2-6 + rows 8-12

     The inner V's at cols 4 and 8 spanning rows 6-10 (instead of
     rows 8-12 like the outer V's) are the key bridge — they have
     num cells at rows 6, 8, 10, which gives them crossings into
     both the upper cluster (h6m at row 6) and lower cluster
     (h8l/h8r at row 8). Without these bridges, the layout splits
     into top and bottom halves at the row 5-7 gap.

     Comparison to TS-family:
       TS:     24 eq, 42 cells, 30 crossings, 12 uncrossed
       TT:     25 eq, 44 cells, 31 crossings, 13 uncrossed

     Modest density increase. If TT also doesn't feel Large in
     play, the problem isn't density — likely cell pixel size
     (Large cells render smaller than Medium cells on small
     phones because of the canonical-cols/avail-width interaction)
     or absolute pixel footprint (grid total takes same screen
     space as Medium).

     Pool state:
       Small  : [TA, TJ, TM]            (unchanged)
       Medium : [TN, TO, TP, TQ, TQ2]   (unchanged)
       Large  : [TT]                    (was TS, TS3, TS5, TS9)
       Jumbo  : [TX2_sq_A..D]           (unchanged)

     TS, TS3, TS5, TS9 stay defined in the file but unpooled. If
     TT works better, Medium-style variant variations of TT can
     follow in v3.18+ to refill the Large pool.

     Note: Hard target stays at 30 from v3.16. Cell-size maxCS=36
     for Large stays from v3.16 (still binding on larger screens
     even if not on small ones).

     v3.16: Fix Large rendering smaller than Medium + bump Large
     Hard target.

     Two related issues from v3.15 feedback:

     1) "Footprint seemed smaller" — Large templates were
        rendering with SMALLER cells than Medium. Tracked to a
        leftover constant: getCellSize() has a maxCS cap per size,
        and Large was capped at 26px while Medium was capped at
        42px. So even with 13-col canonical, Large grids were
        13×26 = 338px wide, while Medium grids were 11×42 = 462px
        wide. Medium rendered visibly bigger than Large — the
        opposite of intended. The 26px cap was set when Large
        templates had varying widths up to 13 cols and we wanted
        to ensure fit; now that Large is consistently 13 cols and
        cells are tier-canonical, the cap can come up.

        New maxCS values:
          Small  : 52 (unchanged)
          Medium : 42 (unchanged)
          Large  : 36 (was 26)
          Jumbo  : 26 (unchanged)

        At 36px × 13 cols = 468px wide — fits comfortably in
        ~460px avail on a typical phone with 1-2px squeeze. Large
        will now render visibly bigger than Medium (Medium tops
        out at 11×42 = 462px wide, but most Medium templates use
        less than full width). The size hierarchy reads correctly
        in the UI.

     2) "Not enough blank cells" on Large/Hard. Target was 26 on
        42-cell templates (38% blanks) — only +5 over Large/Medium
        (which is 21 = 50% blanks). User reported Hard didn't feel
        harder than Medium. Bumping Hard target from 26 to 30
        (71% of cells blank, +9 over Medium-diff). Now Hard means
        only 12 givens on a 42-cell template — real "almost all
        blank" challenge.

        Updated table:
                    Easy   Medium   Hard
          Small      6      9       13
          Medium    11     15       21
          Large     15     21       30   ← was 26

        This restores the +9 Hard bonus for Large that was on the
        table back in v3.04-v3.07 era. Reachability check: TS
        family has 42 cells, 12 uncrossed (which limit 12
        equations to max 2 blanks), and 12 fully-crossed equations
        (max 3 blanks). Position budget = 12×2 + 12×3 = 60. Target
        30 is well within budget. Production genNums should hit
        30 reliably; bench harness can't validate at this density
        (15+ equations, simple greedy generator fails).

     Note on "doesn't feel large" beyond the cell-size fix: the
     TS-family template has an empty interior (frame structure
     with hollow middle), which can read as "less dense" than a
     fully-packed template. The cell-size fix should resolve the
     primary footprint complaint, but if Large still feels too
     hollow, future versions can author denser templates (more
     equations packed into the middle) for visual variety. For
     now, sticking with TS-family — the priority is fixing the
     observable bug (smaller cells than Medium) and the missing
     Hard challenge.

     v3.15: Large pool fully on new system — TS3, TS5, TS9 added
     as TS-family variants; TF, TG, TL removed.

     Replaces all three legacy Large templates with TS-family
     variants in one ship. The TS-family share the same outer
     structure (16 outer equations forming a 13×13 frame) but vary
     the 8 inner equations — middle H bridges and middle V's at
     cols 4, 6, 8. All four (TS, TS3, TS5, TS9) hit the same Large
     targets (15/21/26) reliably and look 13×13 sized in play.

     TS-family inner structure variations:

       TS  (current, v3.14): col 4 stacks rows 2-6 + 8-12,
                              col 8 stacks rows 2-6 + 8-12,
                              v6_bridge rows 6-10 (lower-middle)

       TS3: col 4 stacks rows 2-6 + 8-12,
            col 8 stacks rows 0-4 + 6-10 (shifted up),
            v6_bridge rows 4-8 (centered)

       TS5: col 4 stacks rows 0-4 + 6-10 (shifted up),
            col 8 stacks rows 2-6 + 8-12,
            v6_bridge rows 6-10 (lower-middle)

       TS9: col 4 stacks rows 0-4 + 6-10 (shifted up),
            col 8 stacks rows 2-6 + 8-12,
            v6_bridge rows 4-8 (centered)

     All four pass the same audits: connectivity PASS, no cell-type
     collisions, no same-direction overlaps. 42-43 unique num cells,
     29-30 crossings each. Different operator/equals cell positions
     mean different math paths through the middle even though the
     overall shape stays consistent.

     During design I also tried symmetric variants (both cols using
     the same row pattern); those failed connectivity — the inner V
     columns need to interlock or have a v6_bridge in the right
     position to keep the upper and lower halves bridged.

     LEGACY TF/TG/TL REMOVED FROM POOL. They stay defined in the
     file (matching TR/TB/TC/TD/TE/TK pattern). All three were
     14-equation templates with 24-26 cells, designed for the
     legacy blanks-per-equation system. Couldn't hit Medium=21 or
     Hard=26 on the new system.

     Pool state (all sizes now fully on the new system):
       Small  : [TA, TJ, TM]                  (3 templates)
       Medium : [TN, TO, TP, TQ, TQ2]         (5 templates)
       Large  : [TS, TS3, TS5, TS9]           (4 templates)
       Jumbo  : [TX2_sq_A..D]                 (4 templates, untouched)

     This is the milestone: blank counts are now consistent across
     every (size, diff) roll in Small, Medium, and Large. A good
     time on any size/difficulty represents real improvement, not
     luck-of-the-template.

     Note on Large variety: TS-family all share the 13×13 outer
     frame, so visually they look similar at a glance. The math
     paths through the middle differ enough that solving still
     varies, but if you find Large feels too samey across rolls,
     v3.16+ can author genuinely different shapes (taller-narrower
     like 9×15, or wider-shorter like 15×9) for visual variety.
     This was the "variants for now" path — fastest way to get all
     Large rolls feeling Large. New shapes can come later.

     v3.14: TR replaced with TS — bigger Large footprint.

     User feedback on v3.13's TR: "doesn't feel large." Diagnosis:
     TR's 11×13 footprint sat right next to Medium templates
     (Medium maxes at 11×11 / 7×13), so visually it didn't read
     as a clearly larger size class. To feel Large, the template
     needs to be wider AND taller than any Medium template.

     NEW LARGE TEMPLATE TS. 13×13 footprint, 24 equations, 42
     unique num cells, 30 crossings, 12 uncrossed.

     TS extends TR's frame-with-bridge concept into a 13×13 grid
     and fills the new space with more equations. Compared to TR
     (35 cells, 22 crossings, 11×13), TS has 7 more cells, 8 more
     crossings, and is 2 cols wider — a real density increase
     paired with a real footprint increase.

     Visual: H equations on rows 0/4/8/12 in left/right pairs (cols
     0-4 and 8-12), middle bridge H equations on rows 2/6/10 (cols
     4-8). Outer V equations stacked on cols 0/2/10/12 (rows 0-4
     top stack + rows 8-12 bottom stack). Middle V equations on
     cols 4 and 8 stacked the same way (rows 2-6 + rows 8-12).
     Single V at c=6,r=6 spanning rows 6-10 ties the upper and
     lower halves through the middle (without it the layout splits
     into disconnected halves — caught during design).

     Equation list (24 total):
       Row 0:   h0l c=0,r=0    h0r c=8,r=0
       Row 2:   h2_mid c=4,r=2
       Row 4:   h4l c=0,r=4    h4r c=8,r=4
       Row 6:   h6_mid c=4,r=6
       Row 8:   h8l c=0,r=8    h8r c=8,r=8
       Row 10:  h10_mid c=4,r=10
       Row 12:  h12l c=0,r=12  h12r c=8,r=12
       V outer top:    v0t  v2t  v10t  v12t  (all c=col,r=0)
       V outer bottom: v0b  v2b  v10b  v12b  (all c=col,r=8)
       V middle top:   v4t (c=4,r=2)  v8t (c=8,r=2)
       V middle bottom: v4b (c=4,r=8) v8b (c=8,r=8)
       v6_bridge c=6,r=6  ← KEY BRIDGE rows 6-10

     Audit clean: connectivity PASS, no cell-type collisions, no
     same-direction overlaps. Structural reachability: 42 cells
     with target 26 (Hard) means 16 givens — plenty of headroom.
     12 uncrossed cells limit 12 equations to max 2 blanks each;
     remaining 12 equations are fully crossed (max 3 each).
     Position budget 60 vs target 26.

     Bench harness reliability: my simple +/- generator fails on
     24-equation templates so I can't bench-verify. Production
     genNums handles dense templates fine (mul/div pre-seeding,
     forward propagation, retry layers).

     TR REMOVED from Large pool (not from file — stays defined as
     unpooled, matching the TB/TC/TD/TE/TK pattern). TR served as
     a useful intermediate but didn't carry "Large feel"; TS
     replaces it as the new-system Large representative.

     Pool state:
       Small  : [TA, TJ, TM]            (unchanged)
       Medium : [TN, TO, TP, TQ, TQ2]   (unchanged)
       Large  : [TF, TG, TL, TS]        (was [..., TR])
       Jumbo  : [TX2_sq_A..D]           (unchanged)

     Large canonical width: TS at 13 cols means Large needs to
     handle 13 col templates. TL is also 13 cols. Other Large
     templates are 9 cols (TF, TG). Setting Large canonical to
     13 in this version so all Large templates render at the
     same cell size, just like Small (canonical 9) and Medium
     (canonical 11). 9-col templates render with empty space
     around them rather than blowing up cell sizes.

     v3.13: New Large template TR — first Large on the new system.

     Same playbook as Medium: author one bigger template that hits
     the Large targets (Easy=15, Medium=21, Hard=26), ship it
     alongside the legacy templates, then gradually replace TF, TG,
     and TL over later versions.

     NEW LARGE TEMPLATE TR. 11×13 footprint, 19 equations, 35
     unique num cells, 22 crossings.

     Visual: an oversized "frame with bridge" — like TP scaled up.
     Eight H equations split into left (cols 0-4) and right (cols
     6-10) halves on rows 0/4/8/12, plus stacked V equations on
     outer cols (0, 2, 8, 10) with top stack (rows 0-4) and bottom
     stack (rows 8-12). Two middle V equations at cols 4 and 6
     spanning rows 4-8 form the vertical center spine. A single
     horizontal bridge (h6_mid at c=2,r=6) spans cols 2-6 to
     connect the left and right halves through the center — without
     it the layout splits into disconnected halves (caught during
     design).

     Equation list:
       h0l c=0,r=0    h0r c=6,r=0
       h4l c=0,r=4    h4r c=6,r=4
       h8l c=0,r=8    h8r c=6,r=8
       h12l c=0,r=12  h12r c=6,r=12
       v0t c=0,r=0    v0b c=0,r=8
       v2t c=2,r=0    v2b c=2,r=8
       v8t c=8,r=0    v8b c=8,r=8
       v10t c=10,r=0  v10b c=10,r=8
       v4 c=4,r=4     v6 c=6,r=4    (middle spine)
       h6_mid c=2,r=6                ← BRIDGE

     Audit clean: connectivity PASS, no cell-type collisions, no
     same-direction overlaps. Bench-verified hits Easy=15 and
     Medium=21 100%, Hard=26 ~74% exact (most others at 24-25,
     occasionally falling back). 35 cells gives real headroom over
     the 26-blank Hard target.

     Visual character: 11×13 — clearly larger than any Medium
     template (Medium maxes at 11×11 / 7×13). Sets the bar for
     "Large feels Large." When TF/TG/TL are eventually replaced
     they should match this footprint or larger.

     Pool state:
       Small  : [TA, TJ, TM]            (unchanged)
       Medium : [TN, TO, TP, TQ, TQ2]   (unchanged)
       Large  : [TF, TG, TL, TR]        (was 3, now 4)
       Jumbo  : [TX2_sq_A..D]           (unchanged)

     Inconsistency note (gradual rollout): rolling TR gives the new
     15/21/26 blank counts; rolling TF/TG/TL gives Easy=15 (works)
     and Medium=~18, Hard=~20 (legacy fallback). 1 of 4 Large
     templates is on the new system. Will resolve as TF, TG, TL
     get replaced over v3.14+.

     Large canonical width still uses actual cols (no canonical
     scaling) per v3.05's deferral. Worth revisiting once Large
     pool stabilizes — TR is 11 cols, TL is 13, etc., so consistent
     cell sizing across rolls would help "good time = improvement"
     here too.

     v3.12: TQ2 added — TQ-family variant with rearranged inner V's.

     Cheap-variety experiment: take TQ's outer structure (the 7 H
     equations forming the spine and the 4 outer V equations on
     cols 0 and 6) and rearrange just the 4 inner V's at cols 2
     and 4 to make a new template that shares TQ's 7×13 narrow-tall
     identity but has different equation paths through the middle.

     TQ uses:    col 2 = (rows 2-6) + (rows 8-12)
                 col 4 = (rows 0-4) + (rows 6-10)

     TQ2 uses:   col 2 = (rows 0-4) + (rows 6-10)
                 col 4 = (rows 2-6) + (rows 8-12)

     Both pass connectivity, no cell-type collisions, no same-
     direction overlaps. Both have 26 cells and 19 crossings.
     During design I also tried symmetric variants (both cols
     using the same row pattern); those failed connectivity —
     the inner V columns need to interlock to keep the middle of
     the grid bridged.

     Visual impact: TQ2 looks very similar to TQ at a glance
     since the H spine and outer V's are the same. The
     differences are subtle — operator/equals signs in different
     middle positions, different cell-sharing paths. Players will
     feel "this puzzle is shaped like the last one but the math
     flows differently." Not a dramatic visual shift, but a
     genuine new template (different equations between same num
     cells, different solving paths).

     Equation list for TQ2:
       h0 c=0,r=0   h2 c=2,r=2   h4 c=0,r=4   h6 c=2,r=6
       h8 c=0,r=8   h10 c=2,r=10 h12 c=0,r=12
       v0a c=0,r=0  v0b c=0,r=8
       v2a c=2,r=0  v2b c=2,r=6   ← inner col 2, shifted
       v4a c=4,r=2  v4b c=4,r=8   ← inner col 4, shifted
       v6a c=6,r=2  v6b c=6,r=8

     Pool state:
       Small  : [TA, TJ, TM]                   (unchanged)
       Medium : [TN, TO, TP, TQ, TQ2]          (was 4, now 5)
       Large  : [TF, TG, TL]                   (unchanged)
       Jumbo  : [TX2_sq_A..D]                  (unchanged)

     Medium pool reaches 5 templates. With pool.length=5 the
     no-recent-repeats picker excludes the last 4 picks, so every
     New click cycles through all 5 before any can repeat.
     Two of those 5 (TQ and TQ2) share visual identity but have
     different math.

     v3.11: New Medium template TQ + TK removed.

     This finishes the Medium pool conversion to the new target-based
     blank system. After v3.11, every Medium template can hit the
     Easy/Medium/Hard targets (11/15/21) reliably, so blank counts
     are consistent across rolls — meaning a good time on Medium
     means real improvement, not luck-of-the-template.

     1) NEW MEDIUM TEMPLATE TQ. 7×13 footprint, 15 equations, 26
        unique num cells, 19 crossings. Visual: narrow vertical
        column with H equations on alternating rows (0/2/4/6/8/10/12)
        in alternating-offset zigzag pattern (left-edge c=0 and
        slightly-indented c=2), plus 8 V equations stacked two-per-
        column on cols 0/2/4/6 (top half rows 0-4 and bottom half
        rows 8-12, gap at rows 5-7). The interior is highly
        connected — only 7 cells are uncrossed, the densest crossing
        structure of any template (19 crossings).

        Equation list:
          h0 c=0,r=0   h2 c=2,r=2   h4 c=0,r=4   h6 c=2,r=6
          h8 c=0,r=8   h10 c=2,r=10 h12 c=0,r=12
          v0a c=0,r=0  v0b c=0,r=8
          v2a c=2,r=2  v2b c=2,r=8
          v4a c=4,r=0  v4b c=4,r=6
          v6a c=6,r=2  v6b c=6,r=8

        Audit clean: connectivity PASS, no cell-type collisions, no
        same-direction overlaps. Bench validation was hampered by
        the simple test-harness generator failing on 15-equation
        templates, but structural analysis confirms Hard target=21
        is reachable: 9 of 15 equations are fully-crossed (can go
        all-3-blank in Hard mode), only 6 limited by an uncrossed
        cell. Production genNums (with mul/div pre-seeding and
        forward propagation) handles dense templates fine.

        Visual character: narrow-tall (7×13). Restores the "narrow
        column" identity that TK had at 7×9, but at the bigger cell
        count needed to hit new Medium targets. Distinct from TN
        (11×9 wide), TO (9×11 tall), TP (11×11 square).

     2) TK REMOVED FROM MEDIUM POOL. TK was the last legacy 16-17
        cell Medium template, falling through to legacy on Medium/
        Hard difficulties. Removing it makes the Medium pool fully
        consistent on the new target system.

        TK definition stays in the file unpooled, matching the
        TB/TC/TD/TE/TH_final/TI_stair pattern.

     Pool state:
       Small  : [TA, TJ, TM]          (unchanged — all on new system)
       Medium : [TN, TO, TP, TQ]      (was [TK, TN, TO, TP]) — all on new system ✓
       Large  : [TF, TG, TL]          (unchanged — legacy)
       Jumbo  : [TX2_sq_A..D]         (unchanged)

     Both Small AND Medium are now fully target-consistent. Every
     (size, diff) → blank count is the same regardless of which
     template rolled. The "good time = real improvement" principle
     holds for these tiers.

     Next: same treatment for Large. v3.12 should author a bigger
     Large template that hits Large targets (15/21/26), then
     gradually replace TF, TG, TL.

     v3.10: New Medium template TP + TE removed.

     Two changes continuing the Medium pool replacement:

     1) NEW MEDIUM TEMPLATE TP. 11×11 footprint, 15 equations, 31
        unique num cells, 14 crossings. Square "frame with bridge"
        shape — H equations at rows 0/4/6/10 in two halves (left
        cols 0-4, right cols 6-10), V equations forming a ring
        (left col 0, right col 10, with stacked top/bottom V's),
        plus middle V equations at c=4 and c=6 spanning rows 2-6,
        plus a horizontal bridge at r=2 connecting the middle V's.

        Without h_bridge the layout splits into disconnected left
        and right halves (caught during design). h_bridge at
        c=4,r=2 spans cols 4-8 — its num cells (4,2)/(6,2)/(8,2)
        crossings v_m at (4,2) and v_m2 at (6,2), tying the two
        clusters together via two paths.

        Equation list:
          h_top_l c=0,r=0   h_top_r c=6,r=0
          h_mid_l c=0,r=4   h_mid_r c=6,r=4
          h_lm_l  c=0,r=6   h_lm_r  c=6,r=6
          h_bot_l c=0,r=10  h_bot_r c=6,r=10
          v_l_t c=0,r=0   v_l_b c=0,r=6
          v_r_t c=10,r=0  v_r_b c=10,r=6
          v_m c=4,r=2   v_m2 c=6,r=2
          h_bridge c=4,r=2  ← BRIDGE

        Audit clean: connectivity PASS, no cell-type collisions,
        no same-direction overlaps. Bench-verified hits Easy=11
        (100%), Medium=15 (100%), Hard=21 (~98% exact, ~2% at
        19-20 falling back). Best Hard reliability of any Medium
        template — 31 cells gives real headroom over the 21-blank
        target.

        Visual character: square 11×11 "frame" with cross-shaped
        interior. Distinct from TN (11×9 wide), TO (9×11 tall),
        and TK (7×9 narrow vertical staircase) — TP is the
        biggest, squarest Medium.

     2) TE REMOVED FROM MEDIUM POOL. TE was the surviving duplicate
        of TB after v3.09 (we removed TB last version). Same shape
        as TB (visually identical wide-Z), 16 cells, can't hit the
        new Medium targets. Removing it makes room for TP without
        bloating the pool.

        TE definition stays in the file unpooled, matching TB / TC
        / TD / TH_final / TI_stair pattern.

     Pool state:
       Small  : [TA, TJ, TM]          (unchanged — all on new system)
       Medium : [TK, TN, TO, TP]      (was [TE, TK, TN, TO]) — 3 of 4 on new system
       Large  : [TF, TG, TL]          (unchanged — legacy)
       Jumbo  : [TX2_sq_A..D]         (unchanged)

     TK is now the lone legacy template in Medium. v3.11 should
     replace TK with a bigger version, after which the entire
     Medium pool is on the new system and (size, diff) → blank
     count is fully consistent in Medium just like in Small.

     v3.09: New Medium template TO + TB removed (was duplicate of TE).

     Two changes:

     1) NEW MEDIUM TEMPLATE TO. 9×11 footprint, 14 equations, 27
        unique num cells, 15 crossings. Vertical version of TN's
        "lattice with wing" pattern — top and bottom 5×5 H/V
        lattices stacked, bridged by a vertical span (v6_bridge at
        c=6 spanning rows 2-6) that connects through the middle.

        Design: H equations on rows 0, 2, 4, 6, 8, 10 (6 rows
        possible on an 11-tall grid). V equations stacked: most
        cols have a "top half V" (rows 0-4) and a "bottom half V"
        (rows 6-10), with a gap at row 5 to avoid same-direction
        adjacency. The bridging V at c=6 spans rows 2-6 to tie
        the two halves into one connected component.

        Equation list:
          v0a c=0,r=0   v0b c=0,r=6   v4a c=4,r=0   v4b c=4,r=6
          v8a c=8,r=0   v8b c=8,r=6   v2  c=2,r=2
          v6_bridge c=6,r=2  ← BRIDGE
          h0  c=0,r=0   h4  c=0,r=4   h8  c=0,r=8   h10 c=0,r=10
          h0w c=4,r=6   h0w2 c=4,r=2

        Audit clean: connectivity PASS, no cell-type collisions,
        no same-direction overlaps. Bench-verified hits Easy=11
        and Medium=15 reliably; Hard target=21 reaches 19-20 most
        rolls, occasionally 21 (close to ceiling of what 27 cells
        can support).

        Adds vertical-tall variation to the new-system Medium pool
        — TN was wide-and-short (11×9), TO is tall-and-narrow
        (9×11). Together they bracket the visual range.

     2) TB REMOVED FROM MEDIUM POOL. TB and TE were confirmed back
        in v3.02 to render to identical cell maps (the "Z-shape"
        and "L-shape" labels suggested different visuals but the
        actual num/op cell positions were the same). Keeping both
        was wasted pool space. TB removed from TMPL_MEDIUM; TE
        stays as the legacy version of that shape until replaced.

        TB definition stays in the file (just unpooled), matching
        the TC/TD/TH_final/TI_stair pattern from earlier removals.

     Pool state:
       Small  : [TA, TJ, TM]          (unchanged)
       Medium : [TE, TK, TN, TO]      (was [TB, TE, TK, TN])
       Large  : [TF, TG, TL]          (unchanged)
       Jumbo  : [TX2_sq_A..D]         (unchanged)

     2 of 4 Medium templates are now on the new system (TN + TO).
     TE and TK still fall through to legacy on Medium/Hard (TE has
     16 cells, TK 17). Each remaining replacement extends new-
     system reach further. v3.10 should grow or replace TE next.

     v3.08: Three-tier difficulty restored (Easy ≠ Medium ≠ Hard).

     Problem with v3.07's structure: Easy and Medium shared blank
     count (e.g. Medium got 15 blanks for both Easy and Medium
     diff). Theory was that ×/÷ vs +/- would carry the difficulty
     difference. In actual play it didn't — 15 blanks across 9
     equations means ~1.7 blanks/eq, which already requires real
     crossing-deduction. So Medium-Easy felt almost as hard as
     Medium-Medium, just with simpler arithmetic. And Medium-Hard
     at +3 (target 18) didn't feel meaningfully harder either.

     Solution: three real difficulty levels via blank count, with
     operators as a secondary axis. Each step has a distinct feel:

                 Easy   Medium   Hard
       Small      6      9       13
       Medium    11     15       21
       Large     15     21       26

     Per-equation averages by tier:
                  Easy        Medium      Hard
       Small      0.75 b/eq   1.1 b/eq    1.6 b/eq
       Medium     0.85        1.15        1.6
       Large      1.07        1.5         1.85

     Easy ≈ 1 blank or fewer per equation. Most equations have a
     blank you can solve from the other two given cells — light
     and immediate. Medium ≈ 1-1.5 blanks/eq, occasional 2-blank
     equations needing a crossing. Hard ≈ 1.6-1.9 blanks/eq with
     several 3-blank equations forcing multi-step deduction
     chains through crossings.

     The 3-blank-equation rule from v3.04 stays unchanged —
     all-3-blank only allowed when every cell is a crossing,
     so puzzles always have a solution path.

     Implementation: targetBlanks() rewritten to use a flat lookup
     table instead of base+bonus. Cleaner to reason about, easier
     to tune individual cells.

     Reachability with current templates:
       Small: TM (17 cells) hits 6/9/13 reliably. TA (16 cells)
         hits 6/9/13 reliably. TJ (14 cells) — Easy/Medium fine,
         Hard 13 means only 1 given on a 14-cell template, may
         fall through occasionally.
       Medium: TN (24 cells) hits 11/15/21 reliably. TB/TE/TK
         (16-17 cells) — Easy 11 reachable, Medium/Hard fall
         through to legacy. Will resolve as TB/TE/TK get replaced.
       Large: TF/TL (26 cells) hit 15/21 reliably; Hard 26 means
         basically all-blank, will be tight. TG (24 cells) — Hard
         falls through. Existing Large templates need replacement
         to fully support new Hard.

     Net effect: Easy gets noticeably lighter across all sizes
     (especially Medium-Easy from 15→11 and Large-Easy 21→15).
     Hard gets meaningfully harder than Medium (+4/+6/+5 step
     instead of +3/+3/+3). Medium-difficulty stays where it was.

     v3.07: New Medium template TN + Medium Hard target lowered to 18.

     Two changes that go together (same pattern as v3.06's Small fix):

     1) Medium Hard target lowered from 22 to 18. Original target=22
        required ~28 num cells per Medium template, which forces ~14-
        15 equations and 9×11+ footprint. That puts Medium visually
        in the same zone as Large (TF is also 9×11). Lowering Medium
        Hard to 18 (+3 bonus) keeps Medium clearly between Small and
        Large in visual size while still adding a meaningful Hard
        step up from the Easy/Medium count of 15.

        Updated table:
                  Easy   Medium   Hard
          Small      9      9      12
          Medium    15     15      18   ← was 22
          Large     21     21      30
          Jumbo  (untouched)

        Implementation: targetBlanks() medium-bonus changed from 7
        to 3. Both Small and Medium now use +3, Large still uses +9.

     2) New Medium template TN added. 11×9 footprint, 13 equations,
        24 unique num cells, 15 crossings. Visual: a 5×5 lattice of
        H equations on rows 0/2/4/6/8 with V equations stitching
        every other column, plus a "wing" of two extra H equations
        on the right at rows 0 and 4 (h0b at c=6, h2b at c=6) and a
        bridging V at c=10. The wing is what brings the cell count
        from ~19 (a 9×9 lattice would max out there) to 24.

        Equation list:
          h0 c=0,r=0 ; h0b c=6,r=0 ; h1 c=4,r=2 ;
          h2 c=0,r=4 ; h2b c=6,r=4 ; h3 c=4,r=6 ; h4 c=0,r=8 ;
          v0 c=0,r=0 ; v1 c=2,r=4 ; v2 c=4,r=0 ;
          v3 c=6,r=2 ; v4 c=8,r=2 ; v5 c=10,r=0

        Audit clean: connectivity PASS, no cell-type collisions, no
        same-direction overlaps. Bench-verified hits Easy/Medium=15
        and Hard=18 reliably; existing Medium templates (TB, TE, TK)
        cap at ~12-13 blanks regardless of target, so they still
        fall through to legacy on Medium Easy/Medium/Hard for now.

        Pool state:
          Small  : [TA, TJ, TM]      (unchanged from v3.06)
          Medium : [TB, TE, TK, TN]  (was [TB, TE, TK]) — 4 templates
          Large  : [TF, TG, TL]      (unchanged)
          Jumbo  : [TX2_sq_A..D]     (unchanged)

        Medium pool reaches 4 templates. With pool.length=4 the
        no-recent-repeats picker excludes the last 3 picks, so every
        New click cycles through the entire pool before any can
        repeat — a real shape rotation across all four shapes.

     Inconsistency note: rolling TN gives 15/15/18 blanks (new
     system); rolling TB/TE/TK gives 11/11/13 blanks (legacy). This
     is the expected gradual-rollout pattern — Medium tier is
     transitioning, will fully convert as the older templates get
     replaced or grown in v3.08+.

     v3.06: New Small template TM + Small Hard target lowered to 12.

     Two changes that go together:

     1) Small Hard target lowered from 14 to 12. Original v3.04 plan
        was Easy/Medium=9, Hard=14 (a +5 bonus). To hit 14 reliably,
        a Small template needs ~21 num cells, which forces ~10
        equations and a 9×11 footprint. That makes "Small" puzzles
        as visually big as Large ones (TF is also 9×11), breaking
        the size hierarchy. Lowering Small Hard to 12 (+3 bonus)
        keeps Small visually small (9×9 footprint, 8 equations,
        ~17 cells) while still adding a meaningful Hard step up
        from the Easy/Medium count of 9.

        Updated table:
                  Easy   Medium   Hard
          Small      9      9      12   ← was 14
          Medium    15     15      22
          Large     21     21      30
          Jumbo  (untouched)

        Implementation: targetBlanks() small-bonus changed from 5
        to 3. Other tiers unchanged.

     2) New Small template TM added. 9×9 footprint, 8 equations,
        17 unique num cells, 7 crossings. Visual character: vertical
        staircase formed by 5 H equations on alternating rows
        (0/2/4/6/8) bridged by 3 V equations (col 0 lower half,
        col 4 upper half, col 8 middle). Distinct from TA's
        diagonal-down staircase and TJ's corner-corner interlock.

        Equation list:
          h0 c=0,r=0 ; h1 c=4,r=2 ; h2 c=0,r=4 ; h3 c=4,r=6 ;
          h4 c=0,r=8 ; v0 c=0,r=4 ; v1 c=4,r=0 ; v2 c=8,r=2

        Audit clean: connectivity PASS, no cell-type collisions,
        no same-direction overlaps. Bench-verified to hit all
        three Small targets (9/9/12) in well over 90% of trials,
        consistent with TA and TJ on the new Hard=12.

        Pool state:
          Small  : [TA, TJ, TM]      (was [TA, TJ])
          Medium : [TB, TE, TK]      (unchanged)
          Large  : [TF, TG, TL]      (unchanged)
          Jumbo  : [TX2_sq_A..D]     (unchanged)

        Small pool reaches 3 templates; no-recent-repeats picker
        will exclude the most recent 2 picks, so every New click
        cycles through all three before any can repeat.

     With Hard target lowered to 12, the entire Small pool (TA, TJ,
     and TM) now hits the new system reliably. v3.06 is the first
     version where Small Hard does NOT fall through to legacy.

     v3.05: Tier-canonical cell sizing for Small and Medium.

     Problem: cell size in getCellSize was computed from the actual
     template's column count, divided into the available width. So
     a 7-col template (TJ in Small, TK in Medium) got ~30% bigger
     cells than the 9-col templates in the same tier (TA, TB, TE).
     Visually, Small puzzles felt inconsistent — chunky tiles when
     TJ rolled, smaller tiles when TA rolled.

     Fix: compute cell size using the WIDEST template in the tier
     ("canonical cols"), regardless of which template actually
     rolled. This way every Small puzzle uses TA's width (9 cols)
     to compute cell size, every Medium puzzle uses TB/TE/TF's
     width (9 cols). Narrower templates render with their natural
     col count but at the canonical cell size, so they take up
     less screen real estate horizontally — but the tiles look
     identical in size to other puzzles in the tier.

     Canonical cols by tier:
       Small  : 9 (TA)             — applies to TA, TJ
       Medium : 9 (TB, TE)         — applies to TB, TE, TK
       Large  : (UNCHANGED)        — see note below
       Jumbo  : (UNCHANGED, xl2)

     Large not addressed: TL is 13 cols (the widest), so canonical=13
     would shrink TF/TG (9 cols) cell sizes by ~30%. That's a
     regression, not a fix. Deferred until either TL gets retired
     or a wider TF/TG replacement is authored. Today nobody has
     complained about Large's slight inconsistency in practice.

     Implementation: getCellSize gains a small lookup that maps SIZE
     to canonical cols, falls back to the passed-in cols for sizes
     not in the table. The cap from v2.69-era (maxCS) stays as the
     upper bound to keep cell sizes reasonable on big screens.

     v3.04: Target-based blank selection — framework + Small enabled.

     Problem: pre-v3.04 selectBlanks used "blanks per equation"
     (1 for easy, 2 for medium, ~1 for hard via blank-then-restore).
     Bank size therefore varied with template — TB and TE in Medium
     gave ~11 blanks while TK gave ~13. Worse, Medium TB at 11
     blanks felt nearly identical to Small TA at 11 blanks. The
     player-facing experience is bank size, not equation count, and
     it was leaking template-shape variance into difficulty variance.

     Solution: define a fixed target by (size, diff). selectBlanks
     hits that target if achievable, else falls through to legacy
     pre-v3.04 logic preserving today's behavior on tiers that
     can't yet hit the target.

     Targets:
                Easy   Medium   Hard
       Small      9      9      14
       Medium    15     15      22
       Large     21     21      30
       Jumbo  (untouched — selectBlanksXL, separate codepath)

     Easy and Medium share the count by design — Medium gets its
     difficulty bump from allowing × and ÷ rather than from more
     blanks. Hard adds +5/+7/+9 over Easy/Medium, scaling with size.

     **Reachability reality:** the Hard targets exceed the unique
     num cells in many existing templates (TJ has 14 cells, target
     14 means "all blank" which is impossible; TB/TE have 16 cells,
     Medium Hard target 22 is impossible). The targets describe the
     *intended* gameplay, not what every existing template can
     deliver today. Behavior:

       Small Easy/Medium (target 9): TA hits target consistently.
         TJ has 14 cells — also achievable. Both templates
         enabled. Player-visible change: Small Easy goes from ~6
         blanks to 9 (a real bump but still easy with +/- only).
         Small Medium goes from ~11 to 9 (slightly down).
       Small Hard (target 14): TJ can't reach it. Falls through to
         legacy. No visible change vs v3.03.
       Medium / Large: ALL targets unreachable on current templates.
         Falls through to legacy. No visible change vs v3.03.

     v3.05+ will introduce bigger templates one at a time, and as
     each tier reaches "all templates can hit the target," that
     tier flips to the new behavior. v3.04 is mostly framework with
     Small Easy/Medium being the only visible behavior change.

     Algorithm changes in selectBlanks:
     1) New helper targetBlanks(size, diff) returns the target.
     2) Greedy fill: shuffle the unique num cells, walk the list,
        add each cell to BS if doing so keeps the puzzle locally
        solvable. Stop when target reached or no more cells fit.
     3) Validation unchanged (canSolve per eq, crossing agreement,
        mul-both-blank bank check) except for the all-3-blank
        case below.
     4) All-3-blank equations are now allowed in Hard mode IF all
        three cells are crossings (each shared with another eq).
        Pre-v3.04 canSolve hardcoded "n===3 → false." A new wrapper
        canSolveWithCrossings adds the "OK if all crossings" path
        for Hard. Easy and Medium retain strict no-all-3-blank.
     5) Outer retry: 80 attempts as before. On failure, falls
        through to _selectBlanksLegacy which is a verbatim copy
        of pre-v3.04 selectBlanks (1/2/restore-1 per eq depending
        on diff) — chosen instead of a minimal-blanks fallback so
        falling-through doesn't change difficulty noticeably.

     This change does NOT touch selectBlanksXL (Jumbo's path).
     Jumbo stays as-is — user prefers it that way.

     v3.03: New Large template TL added. Brings Large to 3 templates.

     TL design: wide horizontal compound, 13×7 footprint, 14 equations.
     Two TB-like clusters at left (cols 0-4) and right (cols 8-12)
     bridged by an H equation at row 2 (h2: c=4,r=2 spans 4-8) and a
     V equation at col 6 (v6: c=6,r=2 spans rows 2-6). Without those
     two bridges the layout would be two disconnected 5×7 islands —
     this was caught in TL v1 audit; bridges added in v6.

     Equation breakdown: 7 H + 7 V = 14. Connectivity, cell-type
     collisions, and same-direction adjacency all clean. 16
     crossings, matching TF's density.

     The point of TL: TF and TG are both narrow and tall (9×11 and
     9×13). Both feel like "two TB's stacked vertically," because
     that's what they are. TL is the lateral version — wide and
     short, with the bridge going horizontally rather than the join
     going vertically. With three Large templates now (TF, TG, TL)
     and the no-recent-repeats picker excluding the most-recent 2
     (since pool.length=3 → maxHist=2), every Large roll cycles
     through all three before any can repeat — which means the
     wide vs tall variation will always show up within 3 New
     button clicks.

     Bench note: TL benches at ~9% first-attempt success in my
     simulator. For comparison, TF benches at 19% — and TF has
     been the production Large template for many versions with
     no observed generation failures. The production genNums has
     mul/div pre-seeding, forward propagation, and a 120-retry
     budget for Large. The bench is a relative indicator at best.

     Pool state after v3.03:
       Small  : [TA, TJ]         (2 templates)
       Medium : [TB, TE, TK]     (3 templates)
       Large  : [TF, TG, TL]     (3 templates) — added TL
       Jumbo  : [TX2_sq_A..D]    (4 templates)

     Next: Small is the only pool still at 2. v3.04 should focus
     there — author a third Small template. After that, all four
     pools will have at least 3, and the no-recent-repeats picker
     will give players genuine variety.

     v3.02: New Medium template TK added. Brings Medium back to 3
     templates after TD's v3.01 removal.

     TK design: vertical staircase, 7×9 footprint, 9 equations.
     5 H equations stacked at rows 0/2/4/6/8 with alternating
     left-aligned (c=0) and slightly-indented (c=2) starting cols,
     making a Z/staircase pattern. 4 V equations: v0,v1 in the
     upper half (rows 0-4) at cols 0,2; v3 mid-right (rows 2-6)
     at col 6; v2 lower-mid (rows 4-8) at col 4. Connected,
     verified by audit. 10 crossings.

     The point of TK: visually different proportions from TB and
     TE. TB and TE both render to the same 9×7 wide-ish shape
     (despite different equation lists, their cell maps are
     nearly identical). TK is taller-than-wide, breaking the
     "wide Z" feel that dominated v3.01 Medium. With the no-
     recent-repeats picker, players cycling through Medium will
     now hit a 7×9 vertical layout 1/3 of the time, which should
     read as a real shape change.

     Generator load: my simple bench-simulator shows ~40% first-
     attempt success on TK vs ~95% on TB/TE. Production genNums
     is significantly more sophisticated (mul/div pre-seeding,
     forward propagation, partial-cell solve fallback) and has
     a 60-retry outer budget for Medium, so the actual user-
     visible failure rate should be near zero.

     Pool state after v3.02:
       Small  : [TA, TJ]       (unchanged from v3.01)
       Medium : [TB, TE, TK]   (added TK)
       Large  : [TF, TG]       (unchanged)
       Jumbo  : [TX2_sq_A..D]  (unchanged)

     Next: v3.03 should focus on Large and Small (each at 2
     templates). A new Large would also benefit from a fresh
     visual approach since TF and TG share TB/TE-derived
     structure.

     v3.01: Connectivity rule for templates + first new template (TJ).

     1) CONNECTIVITY RULE established and enforced. Every equation
        in a template must connect — directly or transitively
        through shared num cells — to every other equation. A
        template with disconnected equations creates "islands"
        that can be solved independently with no cross-constraint,
        which makes the puzzle feel disjoint and hides what should
        be a tight constraint graph.

        Audit of v3.00 pools found two violations:
          - TC (Small): 2 islands. Cluster {h0,v0,v1,v2,h1} solved
            independently from {h2,v3} at the bottom-right. This
            is what made TC the "Two-pillars" template literally —
            two disconnected vertical groups.
          - TD (Medium): 3 islands, including a fully-orphaned h3
            with zero crossings to anything. TD only just moved to
            Medium in v3.00 (was Small before); inherited the
            disconnection.

        Both removed from their pools. Their declarations stay in
        the file (TA-block region) for potential rework later;
        only the pool array entries are gone.

        TA, TB, TE, TF, TG, TX2_sq_A..D all pass the rule.
        TH_final, TI_stair pass too (already unpooled in v3.00 for
        unrelated footprint reasons).

     2) NEW TEMPLATE TJ added to TMPL_SMALL. 7×7 footprint, 8
        equations, "diagonal-step interlock" shape — two H/V
        clusters at opposite corners interlocked through shared
        num cells at (2,2), (2,4), (4,2). All 8 equations in one
        connected component. 10 crossings (vs TA's 6) — denser
        constraint graph, the densest we've authored.

        Generator load: bench-tested 200 generations per template
        with all 4 ops. TA: 100% first-attempt success. TJ: ~50%
        first-attempt success, but the production buildPuzzle
        retry loop (maxR=30 for Small) easily absorbs this — TJ
        always produces a valid puzzle, just sometimes after a
        few internal retries that are invisible to the player.

        Pool state after v3.01:
          Small  : [TA, TJ]       (was [TA, TC])
          Medium : [TB, TE]       (was [TB, TD, TE])
          Large  : [TF, TG]       (unchanged)
          Jumbo  : [TX2_sq_A..D]  (unchanged)

        Per-size best times for Small and Medium reset (TJ being
        added to Small effectively replaces TC; TD removal from
        Medium leaves the average difficulty roughly unchanged,
        all three were 9-eq templates).

        Next: v3.02 should author a Medium replacement to bring
        Medium back to 3 templates, matching the goal of 4+ per
        pool eventually.

     v3.00: Two related changes to puzzle template selection.

     1) REPOOL by equation count for size-tier consistency. Before,
        each size pool mixed templates with very different equation
        counts — Medium ranged from 9 (TB,TE) to 14 (TF,TG). That
        made "best time" records depend on which template you
        rolled, not on play. New pools group by workload:

          Small  : TA(8eq), TC(7eq)        — was TA,TC,TD
          Medium : TB(9eq), TD(9eq), TE(9eq) — was TB,TE,TF,TG
          Large  : TF(14eq), TG(14eq)     — was TH_final,TI_stair
          Jumbo  : TX2_sq_A..D            — unchanged

        Equation curve across tiers is now ~7→9→14→28+ — roughly
        a doubling each step. Previously: ~8→11(avg)→28→30+, with
        the Small→Medium step nearly flat and a huge gap before
        Large. TD moved Small→Medium (it was always 9-eq). TF/TG
        moved Medium→Large (always 14-eq). TH_final and TI_stair
        are unpooled — 28-eq fits Jumbo by workload but their
        17×11 / 17×17 footprints render with too-small cells under
        xl2-mode's 26px cell cap, leaving a half-empty container.
        They stay in code for revival later. Internal SIZE keys
        unchanged so the four buttons keep working — just what's
        *inside* each pool changed. Per-size best times reset
        (user OK with this; nobody else is playing yet).

     2) NO-RECENT-REPEATS picker. New _pickTemplate(pool,size)
        function maintains a per-size recent-history list of
        template *array references* in localStorage under
        'equil_recentTemplates'. When picking, excludes the last
        N entries (N = min(3, pool.length-1)) so consecutive
        rolls of the New button can't yield the same template
        back-to-back, and a player cycling through to "find one
        they like" sees genuinely different shapes for several
        clicks before any can repeat. With Small at 2 templates,
        N=1 (no immediate repeat). Medium has 3 → N=2. Large has
        2 → N=1. Jumbo has 6 → N=3.

        Identity is by ARRAY REFERENCE not by a name string —
        templates are pure data with no id field, so we store the
        index into the pool. localStorage value shape:
          { small:[idx,idx,...], medium:[...], large:[...], xl2:[...] }
        Caps at N entries per size; older entries shift out.

        Daily mode bypasses the history (buildPuzzle called with
        {daily:true} → picker ignores history and uses the seeded
        RNG to choose). This keeps daily puzzles deterministic
        per (date,size,diff) across all players regardless of
        their personal recent-templates state.

        Failure modes considered:
        - localStorage quota / parse errors → catch and treat as
          empty history (graceful degrade to v2.99 behavior).
        - Pool shrinks below history length (e.g. on a future
          repool) → indices that no longer exist are filtered out
          on read.
        - Race with daily-mode call inside withSeed → daily flag
          short-circuits before any history read/write.

     v2.99: Fixed the win wave not firing on actual solves. Tiles
     would just sit there, the win card would appear without the
     cascade of pops and particles.

     Root cause: in place(), the order was:
       1. winCheck → start _winWaveSequence (captures .bt refs,
          schedules setTimeouts to burst each one)
       2. render() — synchronous, calls renderBank which does
          `be.innerHTML=''` and destroys every .bt element
       3. setTimeouts later fire and try to add .bursting to
          detached DOM nodes → no visible effect
     This was always broken on real solves; the v2.84 WIN! debug
     button worked because it didn't trigger a render() between
     reference capture and burst, so I never noticed the bug
     until the WIN! button got removed in v2.97.

     Fix: hoist render() above the win-handling block so the
     bank is at its final state BEFORE the wave captures tile
     references. The wave's setTimeouts now operate on attached
     DOM that survives until newPuzzle. winCheck's result is
     stashed in a local before render() so we can check it
     after.

     v2.98: Hid the four diagonal corner accents on .gscroll for
     all puzzle sizes EXCEPT Jumbo (xl2-mode). The diagonals were
     pixel-sized to land exactly on .grid-clip's outer outline
     corners in the Jumbo layout (gscroll padding + grid-clip
     offset positioning), where they "point at" the puzzle from
     the panel corners. In Small / Medium / Large sizes the panel
     is narrower than gscroll's max-width and the diagonals don't
     align with anything — they read as decorative cruft.

     Implementation: added display:none to the .gscroll::before
     base rule, then re-enabled it under body.xl2-mode with a
     more-specific selector. The SVG backgrounds and positioning
     are otherwise unchanged so reverting is just removing the
     two new lines.

     v2.97: Removed the WIN! debug button from the masthead (added
     in v2.84). Win sequence is dialed in — wave timing, particle
     bursts, fanfare rhythm, win card emergence — so the on-screen
     tester no longer earns its real estate. Both the button HTML
     and its click-handler IIFE are gone.

     Kept in place across the codebase:
       - The {skipRecord:true} flag on _showWinCard (added v2.84)
         — costs nothing, easy revival hook.
       - All the underlying win-wave machinery
         (_winWaveSequence, _winBurstTile,
          _winSpawnParticlesFromTile, .bursting CSS) — fires on
         actual solves now and stays untouched.

     Visible difference: masthead right side is back to just
     [New] [⚙] with no magenta WIN! between them.

     v2.96: Two follow-ups to the v2.94/v2.95 stats overlay work.

     1. Toast pill (#toast — used for "Stats cleared" and other
        ephemeral messages) rounded from 4px to 999px, padding
        nudged 18px → 22px so the rounded ends sit balanced. Now
        consistent with the rest of the app's pill styling.

     2. RESET button charging visual rewritten. The v2.94 fill
        bar (left → right red wash, gain visibility under finger)
        was mostly invisible during a real press because the
        user's finger covers the button. Replaced with an outward
        RED GLOW that grows from the button's border outward
        — visible AROUND the finger so the charge progress reads
        clearly without lifting up. Implemented as an inline
        box-shadow transition driven from JS. Two-layer shadow:
          - Inner halo: 0 0 18px 4px rgba(255,107,107,0.95)
          - Outer bloom: 0 0 42px 12px rgba(255,107,107,0.55)
        Border-color also brightens to full red during the
        charge for added punch. Cancel reverses smoothly in
        180ms, commit holds peak 80ms then fades in 240ms. Fill
        bar div + label-wrapping span are gone; the glow needs
        no extra DOM.

     v2.95: Stats overlay rounded to match the rest of the app's
     pill aesthetic.
       - Panel border-radius : 0 → 18px (matches the win card)
       - RESET button radius : 3px → 999px (full pill)
       - CLOSE button radius : 3px → 999px (full pill)
     Button horizontal padding nudged a couple of px wider so the
     pill shape sits balanced (full-radius pills with tight
     padding can look squished).

     Note on RESET: the v2.94 long-press fill bar is an absolute-
     positioned child with parent overflow:hidden. The 999px
     border-radius means the fill now clips against the rounded
     edge of the button, which is exactly what we want — a
     rounded fill following the button's pill shape.

     v2.94: Two more sound + interaction tweaks.

     1. ADVANCED toggle (in TILE ADJUST modal) gets a fwoosh
        sound — short filtered noise burst (~280ms) with a
        lowpass sweep. Direction matches the gesture: opening
        sweeps cutoff 500→2800 Hz (air rushing IN), closing
        sweeps 2800→500 Hz (air rushing OUT). Custom-built
        rather than reusing _dragWind because that module is
        velocity-driven (designed for continuous drag input)
        and we want a one-shot transition burst. Peak gain 0.08
        — a touch quieter than the modal chirps because noise
        has more spectral density than a sine and over-loud
        noise reads as harsh.

     2. RESET button (in Stats overlay) — replaced the old
        two-tap-confirm pattern with a long-press-to-confirm.
        Why: two-tap requires an awkward "TAP AGAIN" affordance
        state, and feels like two separate decisions instead of
        one sustained commitment. Long-press is gesturally
        clearer — the fill bar shows exactly when the action
        will commit. New behavior:
          • Press and hold 650ms to commit.
          • A red fill bar animates left → right across the
            button during the hold.
          • A rising sawtooth tone (130 Hz → 440 Hz, bandpass-
            filtered for smoothness) plays during the charge.
          • At 650ms: a square-wave "pop" (440 → 110 Hz, 100ms),
            stats clear, "Stats cleared" toast, fill snaps back.
          • Release before 650ms: timer clears, charge tone
            fades, fill rewinds in 180ms (no sound — visual is
            enough). No commit.
        Wired for both touch (touchstart/touchend/touchcancel)
        and mouse (mousedown/mouseup/mouseleave) so it works on
        phones and desktops alike. preventDefault on touchstart
        blocks the synthetic mouse events the OS dispatches so
        the press isn't double-armed.

     v2.93: Stats button joins the chirp family. The 📊 Stats
     button on the menu screen now plays the open chirp on tap;
     the Close button inside the stats overlay plays the close
     chirp on dismiss. Replaced the older playUIClick on the
     open path so the open/close pair is directional.

     Note: the stats overlay has only ONE close path (the Close
     button) — no backdrop tap-to-dismiss is wired, so unlike the
     settings panel from v2.91, there's no second close site to
     instrument. The "RESET" / two-tap-clear flow inside the
     overlay was deliberately left alone since it's a destructive
     action mid-flow, not a navigation event — chirping there
     would muddle the gestural meaning.

     v2.92: New button sound shipped from the v2.91 audition page —
     user picked the "Air puff" candidate. Filtered noise burst
     ~90ms with a lowpass sweep 2400→900 Hz, gain peak 0.10. Pure
     texture, no melodic content — reads as a quick tactile
     "phft" exhale. Replaces the old 220ms sine sweep 260→520 Hz
     (playSA_NewGame, original sound).

     Audio palette now reads:
       - Place (gameplay)    : double-tick (sine octaves, musical)
       - Modal/menu chirps   : sine sweeps (tonal, directional)
       - New button          : filtered noise (textural)
     Each event has a distinct sonic identity so the user can
     recognize what just happened from the sound alone, while
     still being family-related (all gentle, all short, all in
     the same gain register).

     Other sound styles (B–E playSB_NewGame etc.) untouched —
     only Style A (Classic, the default) was replaced.

     v2.91: Extended the modal chirp family to three more
     navigation buttons. Now they all sing in the same key:

     1. Settings ⚙ button (gear icon in masthead) — open chirp
        on click, close chirp on every dismiss path: the Close
        button inside the panel AND backdrop tap-to-dismiss.
        Replaced the old playUIClick (generic UI click) on the
        open path so the open/close pair has consistent
        directionality.

     2. Masthead Menu button (← Menu in the top-left) — close
        chirp before navigating back to the puzzle-size selector.
        Wrapped showMenu in a small closure rather than passing
        it directly to addEventListener so we can fire the
        chirp first.

     3. Win-card Menu button — close chirp before tearing down
        the win overlay and going to the menu screen. Fits the
        same "leaving this screen" gestural family.

     The "Reset" button in the settings panel was deliberately
     NOT chirped: it removes-and-reopens the panel as a refresh,
     not a true close, so adding chirps there would make a
     trivial redraw sound like a substantive navigation.

     v2.90: Found why the v2.88/v2.89 chirp wiring "didn't change"
     the display-mode button sounds. The chirps WERE playing —
     but the toggle functions (_toggleCondense / Mini / Cyan)
     internally call window._btnFx('tool_on'|'tool_off') which
     plays a fully-baked WOODBLOCK SFX (noise transient + body
     resonance + bright overtone) at much higher gain than our
     80ms sine chirp. The user heard the woodblock and assumed
     no chirp was playing. Both were firing.

     Fix: a one-shot suppression flag. When _relay handles a
     click on a display-mode button, it sets
     window._btnFxSuppressOnce = true BEFORE calling the toggle.
     window._btnFx checks this flag at the top — if set, it
     consumes the flag (resets to false) and returns early
     without playing the woodblock. The flag also gets cleared
     defensively after the toggle returns in case something
     skipped consuming it.

     Why this rather than removing _btnFx from the toggle
     functions: the toggles also still get called by the
     original dynamically-created condBtn/miniBtn/cyanBtn
     elsewhere in the code, and those paths probably want the
     woodblock retained. The flag-based approach surgically
     suppresses _btnFx ONLY for relay-driven clicks, leaving
     other call sites untouched.

     v2.89: Display-mode button chirp follow-up after the user
     reported v2.88 didn't seem to actually do anything.

     Theory of why v2.88 might have missed: the chirps WERE
     wiring (verified in source) and TILE ADJUST chirps work
     fine, so the same code path should have run for the mode
     buttons. Most likely the chirps were firing but at peak
     gain 0.10 and only ~80ms long, they were too quiet to
     stand out from a tap on a phone speaker. Two changes:

     1. Chirp peak gain bumped 0.10 → 0.16 on both
        _modalOpenChirp and _modalCloseChirp. Affects the TILE
        ADJUST modal too, but the modal already worked fine at
        0.10, and the louder version still reads as a quick
        UI cue, not a beep.

     2. Switched the _relay click handler to call the chirp
        functions DIRECTLY (via closure) rather than through
        window._modalOpenChirp / window._modalCloseChirp. Both
        live in the same IIFE and JS function declarations are
        hoisted, so the closure binding is safe. If the closure
        call throws for any reason, falls back to the window-
        exposed copies via try/catch. This eliminates the
        global accessor as a possible failure point — if v2.88
        was failing because something in the global namespace
        was clobbering window._modalOpenChirp between the
        assignment and the click, the closure path is immune.

     v2.88: Display-mode buttons (xN / #### / cyan) reuse the
     v2.87 modal chirps. Same C5↔A5 sine sweep family. The button
     you tap drives the direction:
       inactive → tap → open chirp (you're turning this mode on)
       active   → tap → close chirp (you're turning it off)
     Modes are mutually exclusive, so tapping xN while mini is
     active turns mini off as a side effect — but only the
     directly-tapped button chirps, since that's the one the
     user associates the sound with. Implementation: hoisted
     _modalOpenChirp / _modalCloseChirp from the modal IIFE onto
     window so the _relay function (which wires the three mode
     buttons) can call them. Reads the button's .active state
     BEFORE invoking the toggle function so we know which way
     the gesture is going.

     v2.87: Tile Adjust modal — sounds + bigger drag target.

     1. Open and close chirps for the modal. Both are short sine
        sweeps (~80ms): C5 → A5 on open, A5 → C5 on close. Live
        outside the SOUND_STYLE dispatch (like the wind sound)
        because navigation cues are style-independent. Wired
        directly into _openModal / _closeModal so they fire
        regardless of how the open/close was initiated (TILE
        ADJUST button, DONE button, future shortcuts).

     2. The whole modal box (#tileAdjustModalBox) is now a drag
        target — not just the side handles flanking DONE and the
        title bar. The user pointed out there are empty padding
        areas around the sliders and toggle that were just
        sitting there unused.

        Implementation: _attachDrag now accepts an optional
        `interactiveSel` selector. When a touch starts on an
        element matching the selector (or a descendant of one),
        the drag bails so the element's own click/touch handler
        runs normally. The box gets attached with a filter that
        excludes inputs, buttons, labels, the slider container,
        the advanced-spacing container, and the existing drag
        handles. Net effect: tapping a slider thumb still moves
        the slider; tapping anywhere else on the modal initiates
        a drag with the existing wind sound.

        Also fixed a minor pre-existing bug: dragHandles.forEach
        was passing the loop INDEX as the second arg to
        _attachDrag. Harmless before (the function only took one
        param), but with the new optional second parameter it
        would have been treated as the interactiveSel and broken
        the side handles. Wrapped the forEach in an arrow-style
        explicit single-arg call.

     v2.86: Tile-controls-row buttons (TILE ADJUST + xN / #### /
     cyan display-mode buttons) brought into the app-wide pill
     style. Was: 4px radius, dim 40%-opacity cyan border, muted
     text-secondary color — the row felt like a separate visual
     family from the rest of the rounded-and-glowing UI. Now:
       border-radius : 4px → 999px (full pill ends)
       border        : rgba(0,217,255,0.4) → var(--cyan)
       color         : --text-secondary → var(--cyan)
       box-shadow    : added 0 0 8px rgba(0,217,255,0.3) glow
     to match the menu Play pill, masthead Menu/New/⚙, and win
     card buttons. Active state (.active class flipping to purple
     #a855f7 to mark the currently-selected display mode) is
     UNCHANGED — that purple-on-active is a meaningful semantic
     ("this mode is on") and worth keeping distinct from the
     cyan-default. Net result: row reads as "four live buttons,
     one is selected" instead of "four dim buttons, one is bright".

     v2.85: Win sequence polish — card emergence + fanfare rhythm.

     1. Win card now emerges from the puzzle grid's center instead
        of the viewport's center. Was: .wov flex-centered the card
        across the whole overlay (display:flex with justify+align
        center), which read as "low" because the user's eye is
        anchored on the grid (which sits in the upper portion of
        the layout). Now: .wov is just position:fixed, the .wcard
        is absolutely positioned with its left/top set to the
        grid's center via JS at show-time. Width is also clamped
        to roughly the grid's width (with sane min/max of
        280px-460px so tiny grids on phones don't squash the card
        and big grids don't make it absurdly wide). The pp scale-up
        keyframe was updated to compose with the centering
        translate(-50%,-50%) so scale-up still emanates from the
        anchor point rather than the card's top-left.

        New helper: _positionWinCardOverGrid (called from
        _showWinCard right before the .show class is added). Reads
        #gridClip's bounding rect and writes inline left/top/
        max-width onto the card. Falls back to viewport center if
        the grid isn't found (early call before render, etc.).

     2. Fanfare rhythm: the four ascending notes now accelerate
        instead of being perfectly evenly-spaced.
          Was: offsets [0.00, 0.12, 0.24, 0.36] sec — even 120ms
          Now: offsets [0.00, 0.18, 0.31, 0.40] sec — 180/130/90ms
        First interval is slightly longer (anticipatory pause),
        each subsequent gap shrinks. The sustained climax chord
        follows 80ms after the last attack so it reads as its own
        moment rather than another beat in the run-up. Total
        fanfare time is similar to before (~480ms attack run);
        only the contour changes. Other styles (B-E) untouched.

     v2.84: Win-sequence test rig + a fix for why nothing was
     showing up.

     1. Root cause for "I heard something but didn't see anything":
        PARTICLES_ON defaults to false in this build (line 7460),
        and the v2.83 wave honored that toggle. So the pops fired
        and the .bursting CSS animation ran, but no particle
        debris emitted. Fixed: the win wave now ALWAYS spawns
        particles regardless of the PARTICLES_ON toggle. The
        rationale: the toggle exists for users who find the
        per-tap burst distracting (it fires hundreds of times
        per puzzle), but the win wave is once per puzzle — a
        celebration moment, not an ergonomic concern. Tap-burst
        behavior is unchanged; only the win wave is unconditional.

     2. Pop sound peak gain bumped 0.09 → 0.13 so it's
        unambiguously audible against the fanfare-incoming
        anticipation. Easy to dial back if it feels too loud.

     3. New magenta WIN! debug button in the masthead's right-
        side group, between New and ⚙. Clicking it re-runs the
        full win sequence (wave → fanfare → pause → win card)
        on the current bank without solving. The button:
          - Clears any leftover .bursting state from a prior
            test fire so the animation re-triggers.
          - Hides any leftover win card (so we see the full
            card-show animation again).
          - Calls _showWinCard with a new {skipRecord:true} flag
            so test fires don't write fake solves into the
            localStorage stats. Old call sites without the opts
            argument (production solve flow) still record
            normally because the flag defaults to falsy.
        Magenta accent so it reads as obviously distinct from
        production buttons. Easy to remove or hide behind a
        ?debug=1 URL flag once the wave is dialed in.

     v2.83: Win-screen cosmetics + the bank-tile burst wave.

     1. Win card border-radius bumped from 0 to 18px so the card's
        corners match the rest of the app's pill aesthetic. 18px
        is a soft-rectangle (not full pill) since the card is too
        big to look right with 999px radius.

     2. New victory wave: when the puzzle is solved, every bank
        tile bursts in sequence — top-left to bottom-right (DOM
        order, which renderBank already builds row-major) —
        before the fanfare and win card show up. Each burst is
        three things firing together:
          a) A small particle burst from the tile (~22 particles
             radiating outward with gravity, drag, and color
             matching the tile)
          b) A short sine "pop" sound, frequency rising linearly
             across the wave from C5 (523 Hz) to C6 (1047 Hz) so
             the cascade feels like building tension into the
             fanfare climax
          c) A CSS .bursting class that scales/spins/fades the
             tile out (350ms keyframe animation)

        Auto-paced: total wave budget ~1600ms, per-tile delay
        scales with tile count between 35ms (big banks) and 180ms
        (small banks). User asked for "around 2 seconds, maybe
        too long" so we err under that to keep the climax tight.

        After the last tile finishes its animation, the fanfare
        plays, then a 450ms pause, then the win card. Old flow
        was fanfare-immediate + win-card 600ms later; new flow
        is wave (~1.6s) → fanfare → pause → card.

        Implementation note: the existing renderBank
        spawnParticles is closure-scoped and can't be called from
        the win sequence, so v2.83 ships a self-contained
        _winSpawnParticlesFromTile that pushes into the SAME
        global particle pool (window._particlePool) and runs the
        SAME RAF animation loop. Sharing the pool means the 800-
        particle hard cap upstream still applies, and an existing
        loop won't double-start. Particle generation honors the
        PARTICLES_ON options toggle — if off, the wave still
        runs visually + audibly, just no debris.

        Future work the user mentioned: tile shards (break each
        tile into geometric pieces that fly apart instead of just
        scaling/fading). Skipped for v2.83 to ship the rough
        version first; the .bursting class is the hook to extend
        when we revisit.

     v2.82: Win card cleanup.
     1. Both buttons (.wnxt) rounded from border-radius:3px to
        999px, padding nudged 11px×24px → 12px×26px so the pill
        ends read correctly. Now visually consistent with the
        menu screen Play/Stats pills, the masthead Menu/New/⚙
        buttons, and the size/difficulty segmented rows. The win
        card was the last screen still using the old square-ish
        button shape.
     2. Replaced the Share button with a Menu button. Share was
        a "copy results to clipboard" action — useful for daily
        puzzles or leaderboards, but with neither shipped right
        now (daily was removed in v2.70) it was a feature
        looking for a use case. Menu here mirrors the masthead
        Menu button — quick exit from the win card back to the
        puzzle-size selector after solving. Old share handler
        is removed; underlying buildShareText() and copyText()
        functions are KEPT on the _mc113 export (lines 7165 and
        7221) since they're cheap to keep and would be the bulk
        of the work to recreate if we revive sharing later.

     v2.81: Two more sounds shipped from the v2.80 sound-auditions-2
     page, both chosen to match the minimalist family established
     by the v2.80 double-tick place sound.

     1. SelEmpty (tap a blank cell to select for placement) is now
        the "High pip" candidate — single E6 sine (1318.51 Hz),
        25ms, gain 0.07. Same pitch as the upper octave of the
        place sound, almost subliminal. Replaces the v2.80 sine
        drop 440→380 Hz at gain 0.45 which felt heavy compared to
        the new minimalist anchor. SelEmpty fires before EVERY
        placement so quietness matters.

     2. Return (tap a placed tile to send it back to the bank) is
        now the "Muffled tap" candidate — single F3 sine (175 Hz),
        60ms, gain 0.14, with a slower 8ms attack for a soft
        "press" feel rather than a click. Replaces the v2.79
        descending tritone (B4 → F4) which read as a busy two-
        note phrase next to the minimalist place/select sounds.
        Note: muffled tap was originally designed as a candidate
        for the SelFilled (filled-cell tap) sound, but the user
        wanted to try it for return instead — the soft-press feel
        does fit the "putting something back" gesture nicely.

     Note discovered while wiring this: playSelFilled is currently
     DEAD CODE. Its only callsite (selCell line 7434) is wrapped
     in `else if(cell.isBlank)` after an early-return path that
     handles all blank+has-value cells. Net: blank+empty hits
     SelEmpty, blank+has-value returns the tile (and plays the
     return sound) before reaching that else-if. So SelFilled
     never plays. Function definitions left in place across all
     5 sound styles since they're harmless and easy to re-wire if
     a "tap a placed tile to highlight without returning" gesture
     ever comes back. User confirmed they don't currently want
     that gesture.

     v2.80: Place-tile sound shipped from the v2.79 audition page —
     user picked the "double tick" candidate after rapid-tapping
     each option. E5 (659 Hz) + E6 (1319 Hz) sines stacked an
     octave apart, both very short (~45ms / 35ms), played
     simultaneously. The lower octave carries the body, the upper
     octave adds sparkle at lower gain so it doesn't dominate.
     Replaces the old triangle-wave upward chirp (420→820 Hz at
     gain 0.22, 70ms). Big win on repeat tolerance: pure sines
     have no upper harmonics to fatigue the ear over hundreds of
     placements per puzzle, and the brevity means even fast-paced
     solving doesn't pile sounds on top of each other. Other
     sound styles (B-E) unchanged.

     v2.79: Reverted tap-to-return sound back to the v2.77 descending
     tritone (B4 → F4). The v2.78 attempt to mirror the new minor-
     2nd error with a descending minor 2nd worked logically but
     evidently sat too close to the error cue in practice. The
     wider tritone interval gives return a more distinct character
     and a clearer "tumbling back down" feel without competing
     with the close-interval family the error now occupies. So:
     error = simultaneous E5+F5 cluster (minor 2nd), return =
     staggered B4→F4 (tritone). Different families, both gentle
     sines.

     v2.78: Error sound shipped from the v2.77 audition page —
     user picked the "tense minor 2nd" candidate. E5 + F5 played
     simultaneously as pure sines, gain 0.07/note, ~180ms. The
     close interval reads as immediately wrong, tighter than the
     v2.76 tritone but still smooth (no harsh harmonics).

     Return sound updated to mirror the new error. The minor 2nd
     plays its two notes simultaneously so there's no temporal
     direction to literally reverse — instead, the return version
     staggers F5 → E5 with a 60ms gap (descending half-step). Same
     close-interval family, same sine timbre, same gain — but the
     stagger gives it a "tumbling back down" motion that preserves
     the directional symmetry we built in v2.77 (error rises,
     return falls). Other sound styles (B-E) unchanged.

     v2.77: Tap-to-return sound is now a reversed (descending) version
     of the v2.76 error sound. Same two-note tritone interval, same
     gentle sine waves, same gain, just B4 first then F4 instead of
     F4 → B4. This gives the error / return pair a directional
     symmetry that reads naturally: error rises (uh-oh), return
     falls (ok, taking it back). Replaces the v2.74 single sine
     blip. Old code is preserved in the comment block at the top
     of playSA_Return for reference. Other sound styles (B-E)
     unchanged.

     Also shipped alongside this: a standalone error-sound
     audition page (error-sounds-test.html) — 8 candidate
     "wrong placement" sounds the user can A/B before deciding
     which (if any) to swap in for v2.76. Includes the current
     v2.76 sound, a thunk, an "uh-oh", a glassy ping, a typewriter
     noise burst, a wood block, a minor 2nd cluster, and the
     original pre-v2.76 sawtooth rumble for direct reference.

     v2.76: Two small polish items.
     1. Settings ⚙ button diameter dropped 32→28px to match the
        New button's computed height (11px font + ~13px line-
        height + 6px×2 padding + 1.5px×2 border = ~28px). Was
        sitting visibly taller than its row-mates. Glyph font-
        size dropped 14→12 so the gear isn't crammed in the
        smaller circle.
     2. Style A (Classic — default) error sound rewritten. Old
        version was a sawtooth dropping 160→70 Hz at gain 0.18 —
        sounded like a buzzy flatulent rumble on phone speakers
        because sawtooth waves have a lot of harsh upper
        harmonics and low frequencies on tiny speakers tend
        toward distortion. New version: two short sine tones a
        tritone apart (F4 351 Hz then B4 494 Hz, 60ms offset),
        gain 0.10, fast fade. Tritone interval = the classic
        "something's wrong" musical signal (used in horror
        scores, alert tones), but rendered with smooth sine
        waves instead of distorted ones so it reads as polished
        rather than aggressive. User wants to A/B with the old
        sound — old code is preserved in the comment block at
        the top of the function for easy revert.

     v2.75: Game-screen masthead restructure to match the rounded /
     centered aesthetic of the menu screen.
     1. EQUIL title geometrically centered. Was using flex
        space-between with 3-or-4 children, which placed the title
        approximately-but-not-truly center and depended on the
        widths of the side buttons. New layout: three equal-flex
        slots (.mast-side left / .mast-center / .mast-side right),
        title sits in the center slot.
     2. Difficulty/size text (HARD · JUMBO) moved out of the row
        and now sits directly UNDER the EQUIL title inside the
        center slot. Same muted styling, same letter-spacing,
        just a few px below the title with line-height:1 on both
        for a tight stack.
     3. New button now matches the Menu button in size, shape, and
        styling — both use .mast-back. The old inline font-size:8px
        and padding:4px 7px overrides are gone. New keeps its cyan
        accent color via inline override.
     4. New + ⚙ grouped on the right side of the row (Menu stays
        on the left).
     5. All three masthead buttons rounded with border-radius:999px
        — pill ends regardless of computed height. ⚙ also got a
        fixed 32×32 width/height so it reads as a full circle
        rather than a long pill (single icon, square footprint).

     v2.74: Two small puzzle-interaction tweaks.
     1. Softened the tap-to-return chirp on Style A (Classic — the
        default). Was a triangle wave dropping 820→420 Hz at gain
        0.18, which read as harsh/piercing on phone speakers
        because triangle harmonics in the 700-2000 Hz range are
        pretty bright. Switched to a sine wave, dropped start
        frequency 820→700, dropped gain 0.18→0.11. Net effect: a
        softer "blip" that still reads as the same direction
        (downward chirp = giving back) but doesn't poke at the
        ear. Other styles' return sounds (B-E) left alone.
     2. Reversed the v2.31 "clear selection on tap-return"
        decision. Tapping a placed tile to return it to bank now
        leaves the cell SELECTED again. User changed their mind —
        they're more often replacing the returned number than
        undoing it, and pre-selecting the cell saves the
        otherwise-needed re-tap. The whole code change is one
        line in selCell() (SEL=null → SEL=k) but I kept both old
        comments in place so the reversal history is visible.

     v2.73: Killed the startup greeting sound. Original design was a
     friendly 4-note "hello" jingle (G-C-E-G ascending sines) that
     played on page load — but browser audio policies block sound
     before user gesture, so it was deferred to the first
     touchstart/click anywhere on the page. Result: every player's
     very first interaction with Equil was a random four-tone
     bloop, regardless of whether they tapped PLAY, a size button,
     or just scrolled by accident. Felt like a wrong-place jingle.
     Removed the touchstart/click listeners and the _greetOnce
     handler. The playGreeting() synth function and the
     _greetingPlayed flag are intentionally left in place upstream
     (lines 6617 and 5447) so we can revive the greeting later as
     an opt-in setting or wire it to a specific moment if we want.
     AudioContext still unlocks correctly on first interaction —
     every existing audio call already wraps resumeAC() and the
     PLAY button calls it directly.

     v2.72: Mom-readability pass on the menu screen. The size and
     difficulty buttons were tiny (11px main / 8px sub) — fine
     for me-up-close but unreadable at arm's length. Bumped:
       .sel-label  : 9px → 13px (PUZZLE SIZE / DIFFICULTY headers)
       .sel-btn    : 11px → 16px main text
       .sel-btn small : 8px → 13px sub text (the "~9×9", "+ and −"
                       descriptions under each button)
       .sel-btn padding: 12px → 16px so the bigger text has room
     Not literally 2× — that hits 22px, which wraps "Medium" and
     blows out the row to ~80px tall. 16px is the largest size that
     still fits all four labels on one line on a typical phone.
     Also bumped the outer-corner border-radius from 24px to 30px
     so the near-semicircle ends still look right at the new
     ~58px button height.

     v2.71: Two small menu tweaks.
     1. Centered the "PUZZLE SIZE" and "DIFFICULTY" section labels
        (added text-align:center to .sel-label). They were
        defaulting left while the buttons below them sit in a
        full-width flex row — looked off-center against the now-
        centered Play / Stats pills.
     2. Tagline → "A math crossword puzzle for humans" (added
        the leading article). User noted they're second-guessing
        the change; ship it and revisit after living with it.

     v2.70: Menu screen pass.
     1. Removed the "★ DAILY PUZZLE" button from the menu. Without
        an established player community there's no social loop
        around a shared daily puzzle, so the slot was eating
        prime above-the-fold real estate without paying for it.
        Underlying daily-mode code (showGame({daily:true}), the
        _mc113 daily seed/tracking, the daily-streak stats) is
        all left intact; only the entry-point button is gone.
        The click handler at the bottom of the file is guarded by
        `if(dailyBtn)` so it just no-ops on missing element.
     2. Pill-rounded the Size and Difficulty segmented rows.
        Outer corners (.sel-btn:first-child / :last-child) bumped
        from radius 4px to 24px — at the rows' ~46px computed
        height that's half the height, so the ends read as
        near-full semi-circles. Inner shared edges stay flat so
        the segmented look still reads as one connected pill.
     3. Play and Stats buttons reshaped to centered auto-width
        pills instead of full-column slabs. Both got new flex
        wrapper rows (.sel-cta-row) for centering, generous
        horizontal padding for the "around the text" feel the
        user wanted, and big border-radius (28px on Play, 18px
        on Stats) so their rounded ends are also near
        semi-circular at their respective heights.

     v2.69: Size button labeling cleanup. XL2 → "Jumbo", and all
     four size buttons now use round-number dimensions for
     consistency: Small ~9×9, Medium ~10×10, Large ~15×15,
     Jumbo ~30×25. (Earlier mix of "wide organic" / "4-num
     rows" / fake-precise dims like "~11×11" was inconsistent.)
     Underlying internal SIZE keys ('small'/'medium'/'large'/
     'xl2') are unchanged so existing localStorage stats keep
     working — only the human-facing labels changed. New
     sizeLabel() helper centralizes the key→label map and is
     used by the masthead pill (e.g. "HARD · JUMBO"), the
     Wordle-style share text ("Equil JUMBO HARD — 4:21"), and
     the per-record headers in the stats screen. The actual
     puzzle dimensions vary across templates within each pool
     (Medium ranges 9×7 to 9×13, Large 17×11 to 17×17, etc.) —
     fixing that variance is a separate item the user wants to
     tackle later.

     v2.68: Mistake tracking. New counter that increments every time
     an equation in the current puzzle transitions from a non-bad
     state (inc/ok) into 'bad' as a result of a placement. The
     counter is forward-only — undoing a bad placement does NOT
     decrement (a mistake was made), but undoing DOES re-sync the
     internal badEqs map so a re-made bad row will count again.
     Equations that go bad → ok → bad on a later move count twice.
     This counts whole-equation failures rather than red cells, so
     the "two reds for one wrong placement" issue (per user — when
     a wrong number completes a row, both blanks in that row turn
     red even though only one was actually misplaced) doesn't
     double-count. Display points: (a) masthead pip next to moves,
     hidden at zero so clean runs stay visually quiet; (b) win card
     gets a red ✕ count if non-zero, plus a CLEAN SOLVE / PERSONAL
     BEST · CLEAN label upgrade for zero-mistake wins; (c) share
     text appends "· clean ✓" or "· N ✕"; (d) stats screen now
     shows fewest moves, fewest mistakes, and a clean-run tally
     per size/difficulty record. Stats schema gained two new
     fields (bestMistakes, cleanRuns) — old records lacking them
     render an em dash and pick up the values on next solve.
     Implementation lives in window._mc113 (noteEval) and is wired
     into place() and undo() in features-module.

     v2.67: Removed the XL puzzle size button from the menu.
     XL has been a dead branch — its template pool (TMPL_XL)
     never seemed to branch from midpoints in practice, and
     XL2 has been the only XL-class size getting tested.
     Underlying XL code (templates, isXL checks in buildPuzzle,
     xl branch in fallback chain at line 5193-5194) all kept
     intact in case we revisit. Stats-screen size list also
     keeps 'xl' in it so any historical XL stats still render —
     they just won't accumulate new entries. Other size labels
     (Small/Medium/Large) left as-is for now; user wants to
     fix the underlying template-pool variance first before
     re-labeling.

     v2.66: Menu tagline cleanup. Replaced
     "Math crossword · No coins · No hints · No BS" with
     "Math crossword puzzle for humans" — less defensive,
     less try-hard, just says what it is.

     v2.65: Three modal/menu cleanup tweaks.
     1. The tile-controls-row (TILE ADJUST + xN/####/cyan buttons)
        was always visible at the bottom of the screen, including
        on the menu where it didn't belong. Added a "menu-active"
        body class set by showMenu() and cleared when a puzzle
        starts. CSS hides the row when this class is present.
        Body now starts with the class set since the page loads
        on the menu screen.
     2. Removed the border + background on the "ADJUST TILES"
        title in the modal — it was reading as a button (which
        confused the user since tapping it just dragged). Kept
        the grab cursor and a faint press-feedback tint so it
        still reads as draggable.
     3. The advanced panel previously stretched to match the main
        box's height (align-self:stretch), leaving xN's panel
        with a lot of empty dark space at the bottom (xN has 4
        sliders vs ####'s 6). Now the panel sizes to its content
        and ends with a small drag-handle strip at the bottom —
        same horizontal-line pattern as the bottom drag strips
        flanking DONE. Both modes get the same compact bottom
        area, and that area is now an additional drag handle.
     ---- previous changelog ----
     v2.64: Two TILE ADJUST modal usability tweaks.
     1. ADJUST button now TOGGLES the modal — open when closed,
        close when open. Saves a hop when the user wants to
        dismiss the modal (no need to reach the small DONE button
        at the bottom; just tap the same ADJUST that opened it).
        DONE button still works as a close path.
     2. The "ADJUST TILES" title bar at the top of the modal is
        now a drag handle. Much larger grab target than the slim
        horizontal-line strips flanking DONE — useful since the
        ADVANCED panel slides out to the side now (v2.60), so the
        modal stays short and the title is always at a comfortable
        thumb position near the top edge. Title gets a subtle
        purple border + background tint to read as interactive,
        and a grab cursor on hover. The bottom drag strips remain
        as a backup grab area.
     ---- previous changelog ----
     v2.63: Per-mode size slider position persistence. Each display
     mode (xN, mini, cyan, off) now remembers where the user last
     had the size slider, restored when switching back to that mode
     or reloading the page. Falls back to 50% (the "Default" anchor)
     for any mode the user hasn't yet positioned the slider in.
     Implementation:
       - New localStorage key 'equilSliderPosByMode_v1' stores
         {xn: pct, mini: pct, cyan: pct, off: pct}.
       - Saving happens ONLY on user-driven slider movements (the
         <input> input event and the canvasWrap touchmove handler);
         applyPctH calls from page init, mode toggles, and other
         programmatic paths do NOT save (would clobber state).
       - Loading happens on page init AND on every mode-switch in
         the _relay handler. Old code applied the current slider
         pct after toggle; new code looks up the new mode's saved
         pct and applies that, with current slider pct as fallback.
       - Cyan gets its own bucket separate from off, even though
         they share anchor data (cyan tuning is too varied for
         dedicated anchors yet, but the slider position can still
         be remembered independently).
     ---- previous changelog ----
     v2.62: Tuning anchor system. Replaces the formula-driven size
     slider with a 3-anchor interpolation model. The user dialed in
     preferred values for Small / Default / Large per display mode
     (xN, off, ####); those values are now hard-anchored to slider
     positions 0% / 50% / 100%, with linear interpolation between.
     The size slider drives EVERY tunable now (tile size, font
     multipliers, spacing offsets) — not just tile size.
     Behavior:
       - Move size slider → all settings recompute from current
         mode's anchors at that slider position. ADVANCED-panel
         slider knobs visibly update to match.
       - Switch display mode → size slider re-applies at current
         position using the new mode's anchors. Tiles can change
         size on mode switch (intentional — different modes have
         different "default tile size" anchors).
       - Manual nudge of an ADVANCED slider → value sticks until
         the size slider moves again, then snaps back to calculated.
       - Initial slider default changed from 39% to 50% so first
         render lands directly on the user's "Default" anchors.
     Anchor data hard-coded from user's hand-recorded values
     (collected at 2XL bank size). Cyan mode falls through to
     "off" anchors as a sensible approximation since cyan tuning
     is too varied to dial in for now.
     ---- previous changelog ----
     v2.61: Two mini-mode tweaks.
     1. Bumped mini-mode WHITE FONT SIZE max from 2.0× to 3.0×.
        The white digit is the dominant visual in mini mode (often
        the only text on single-instance tiles) and benefits from
        being able to go bigger. Cyan max stays at 2.0× since the
        grid doesn't need to grow that much.
     2. Fixed double-digit white numbers drifting right when font
        gets large. Root cause: the white span had width:100% which
        caused asymmetric overflow when the digit pair approached
        or exceeded the tile's content width (after the 18%
        horizontal padding). With width:100% gone and the span
        sized to its content, the tile's existing
        justify-content:center keeps the digit centered regardless
        of how wide the glyphs become. Overflow (when it happens)
        is now even on both sides instead of rightward.
     ---- previous changelog ----
     v2.60: Advanced panel slides RIGHT instead of DOWN. The previous
     v2.59 implementation slid the advanced sliders downward inside
     the modal box, which made the modal taller and started covering
     the bank tiles below — exactly what the user is tuning against
     and needs to keep visible. Top-of-screen clamping prevented
     repositioning the modal high enough to clear the bank.
     New layout:
       - Outer flex-row wrapper holds main box (left) + advanced
         panel (right) as siblings.
       - Advanced panel animates width 0→220px and opacity 0→1 on
         expand. When collapsed, it takes no horizontal space.
       - Drag handles still control modal position, but now position
         the OUTER wrapper so both pieces move together.
       - Clamping uses MAIN BOX dimensions (not wrapper width), so
         the advanced panel can extend off the right side of the
         screen — covering the puzzle area, which the user said is
         fine since they're focused on the tile bank below.
     ---- previous changelog ----
     v2.59: TILE ADJUST modal upgraded with drag, advanced toggle,
     mode-aware sliders, and position persistence.
     1. Modal box is draggable. Two horizontal-line drag handles
        flank the DONE button at the bottom. Dragging triggers the
        same wind sound the floating pill uses (window._dragWind),
        and the new position persists in localStorage so reopening
        the modal puts it back where the user left it.
     2. Advanced toggle ▶/▼. The spacing/font sliders are hidden
        by default behind a collapsible "ADVANCED" expander. Click
        the toggle to slide the sliders down; click again to collapse.
        Toggle state persists in localStorage. Arrow rotates to
        match.
     3. Mode-aware slider rebuild. When the user taps the xN, ####,
        or cyan display-mode buttons, the modal's slider set rebuilds
        to show the appropriate controls for that mode (xN sliders
        for xN, mini sliders for ####, NO advanced sliders for cyan).
        Previously the modal only rebuilt on open.
     4. Cyan/no-mode hides the ADVANCED toggle entirely since those
        modes don't have any tunable spacing/font sliders.
     ---- previous changelog ----
     v2.58: ROW/COLUMN SPACING sliders in mini mode now go negative.
     CSS row-gap/column-gap clamp negative values to 0 (same issue
     as padding in v2.55), so negative gap is implemented via
     per-grid-item negative margins:
       - Items past row 0 get margin-top set to the negative gap
       - Items past col 0 get margin-left set to the negative gap
     Layout still uses CSS gap = max(0, value) so cells size
     sensibly; the negative margins are purely visual overlap.
     Slider ranges reduced from 0..20 to -10..+5 since the user
     said most tuning happens in that band.
     Changed grid overflow from hidden to visible so overlapped
     content isn't clipped at the grid container's edges.
     ---- previous changelog ----
     v2.57: Mini-mode (####) tuning support. The xN-mode tuning
     sliders (TILE ADJUST modal) now have parallel siblings for
     mini mode, with separately persisted values so each display
     mode can be dialed in independently.
     New mini-mode settings (all percentages of tileSize):
       - miniTopPct: white digit's distance from top border
       - miniGapPct: gap from white digit to first cyan row
       - miniRowGapPct: vertical gap between cyan rows (NEW concept)
       - miniColGapPct: horizontal gap between cyan columns (NEW)
       - miniWhiteMult: multiplier on white font (1.0 = no change)
       - miniCyanMult: multiplier on cyan font (1.0 = no change)
     The TILE ADJUST modal now detects which display mode is
     active and shows the appropriate slider set (header label
     shows "xN MODE TUNING" or "#### MODE TUNING"). Slider set
     gets rebuilt every time the modal opens.
     Implementation:
       - _computeMiniGrid now accepts rowGap/colGap params
         (previously hardcoded GAP=1)
       - mini-mode render block reads all six new settings
       - Top offset uses same positive=padding / negative=marginTop
         split as v2.55's xN fix
       - Cyan font multiplier applied on top of grid.fontPx
     ---- previous changelog ----
     v2.56: Inline size readout. Replaces the floating viewport-
     anchored readout (v2.51-2.55) with a compact box that lives
     INSIDE the slider panel (#sizeCanvasWrap) at the top, above
     the SIZE/GAP slider columns. Always visible — no need to tap
     the slider to see the values. Travels with the slider whether
     it lives in the in-bank dock or in the ADJUST modal because
     it's a child of the wrap that gets moved between contexts.
     Also kept the show/hide hooks as no-op functions for backward
     compat — older code paths that called them won't error.
     ---- previous changelog ----
     v2.55: Fix WHITE TOP OFFSET not working below 0%. Root cause:
     CSS clamps negative padding values to 0 silently. v2.54 was
     setting tile.style.paddingTop to a negative pixel value, which
     the browser ignored — explaining why the slider appeared to do
     nothing past 0% (and the mysterious horizontal jitter was just
     re-render noise from value changes that had no visible effect).
     Fix: split positive vs negative top offsets:
     - Positive: tile gets paddingTop as before, pushing white down.
     - Negative: tile gets paddingTop:0 AND the white SPAN gets
       margin-top set to the negative pixel value. Negative margin
       on a flex item IS valid CSS and pulls the item upward,
       exposing area above where it would normally sit (and
       allowing the white digit to poke into / above the top
       border at large negative values).
     ---- previous changelog ----
     v2.54: Tuning prep for dialing in per-display-mode bounds.
     1. WHITE TOP OFFSET slider now goes negative (-20% to +20%,
        was 0 to +20%). At top=0% there's still a visible gap above
        the white digit because of font line-box ascender padding;
        negative values eat into that ascender space. Same reasoning
        as v2.53's negative NUMBER GAP. Removed the corresponding
        Math.max(0,...) clamp in the render code.
     2. Two new sliders in the TILE ADJUST modal:
        - WHITE FONT SIZE — multiplier on the auto-computed white
          font size. Default 1.0 (no change). Range 0.3× to 2.0×.
        - CYAN FONT SIZE — multiplier on the auto-computed cyan
          font size (which itself is 0.6× of the post-multiplier
          white). Default 1.0. Range 0.3× to 2.0×.
        Multipliers applied in renderBank: _whiteFont and mulSize
        both multiplied by their respective settings. Persisted in
        localStorage alongside the existing xnTopPct/xnGapPct.
     With all four sliders, the user can dial in low-end and high-end
     limits per display mode (xN, mini-grid, all-cyan) and report
     concrete numerical values back. From those numbers we'll build
     a better proportional scale that adjusts automatically as the
     size slider changes, without needing to manually re-tune.
     ---- previous changelog ----
     v2.53: Two fixes for v2.52.
     1. Size readout wasn't updating during canvas drag. Root cause:
        the actual touch handling for the size slider lives on the
        canvasWrap element (which sets sl.value programmatically),
        not on the <input> itself. Programmatic .value changes don't
        fire input events, so my sl.input listener never ran during
        a drag. Fix: exposed the readout's update/show/hide hooks on
        window, and called them from the canvasWrap touch handlers
        AND from inside applyPctH (so every code path that changes
        the size triggers the readout refresh).
     2. NUMBER GAP slider now goes negative (-30% to +30%, was
        0 to 30%). At gap=0% there was still a visible space between
        white and cyan because the white span's line-height:1 includes
        font ascender/descender padding above and below the visible
        glyph. Negative margin-top eats into that padding so the
        cyan can sit flush against (or even overlap) the white.
        Removed the Math.max(0,...) clamp in the render code that
        was preventing negative pixel values from passing through.
     ---- previous changelog ----
     v2.52: Two fixes for v2.51 issues.
     1. Size-slider readout was appearing under the user's thumb
        (next to the slider), making it unreadable. Moved to
        TOP CENTER of the viewport — well clear of any normal
        thumb position. Also bumped the font from 12px to 18px
        and added a stronger border so it's easy to glance at
        from across the screen.
     2. Moved the xN tile spacing sliders (white top offset,
        number gap) from the OPTIONS panel to the TILE ADJUST
        modal where they belong. They now sit directly below
        the size/gap slider strip with a purple border-top
        separator. Same percentage-based scaling as before;
        same DEF values; same persistence in localStorage.
        Implementation: exposed _applyTuning and _saveOpts via
        window so the modal-wiring IIFE can drive the same
        save+apply chain the OPTIONS panel uses.
     ---- previous changelog ----
     v2.51: Two improvements for tuning xN tile spacing.
     1. Floating size readout. While the user actively drags the
        size slider, a small overlay appears next to the slider
        showing the current pct value (0-100) plus the resulting
        tile and font sizes in pixels. Hides on touch release.
        Useful for picking concrete numerical values when dialing
        in size limits or per-mode bounds.
     2. New OPTIONS panel section "xN tile spacing" with two
        sliders:
        - "White top offset" (% of tile size, 0-20%) — distance
          from the tile's top border to the white digit.
        - "Number gap" (% of tile size, 0-30%) — distance between
          the white digit and the cyan ×N badge.
        Both are percentages so they scale proportionally as the
        user changes tile size with the size slider. Replaces the
        previous hardcoded margin-top:auto on the cyan span (which
        was pushing it to the bottom of the flex container) with
        an explicit pixel gap, so the white + gap + cyan stack
        tightly at the top with the remaining space as natural
        breathing room above the bottom border.
     ---- previous changelog ----
     v2.50: Found the actual cause of "fonts don't scale". The
     condense/xN mode had a hardcoded 28px minimum tile size
     enforcement that I'd missed across the v2.42-v2.49 debugging.
     When the user slid the size slider smaller, the tile would
     clamp at 28px and STAY there. Both fonts therefore stayed
     locked at the cap value, and the cyan kept its fixed flex-
     layout position relative to the white — so the cyan kept
     poking through the bottom border (the layout proportions
     broke at the floor: padTop/padBot hit their own minimums,
     fonts hit the cap, cyan had nowhere to go).
     Fix: removed the 28px floor entirely. The snapping pass's
     existing floor of 15px (line ~6796) is still in place, so
     tiles can't disappear; but fonts now scale all the way down
     with the tile size as the user expected. At very small
     sizes both white and cyan become illegible, but they stay
     INSIDE the tile.
     ---- previous changelog ----
     v2.49: Fix cyan ×N overflowing past tile bottom at small tile
     sizes. The cyan font had a Math.max(8, ...) minimum size floor
     dating back to before the size-slider work. The white digit
     scales freely down with the tile (no min cap), but cyan would
     hit 8px and stop shrinking — so as the user dragged the size
     slider smaller, cyan took up proportionally more and more of
     the tile's vertical space until the flex layout's
     margin-top:auto couldn't fit it inside the tile and pushed it
     past the bottom border.
     Fix: removed the 8px floor. Cyan now scales freely with the
     white font (still 0.6× the white font size). At very small
     tile sizes the cyan becomes too tiny to read, but it stays
     INSIDE the tile — and the white digit at that size is also
     barely readable, so the cyan being readable doesn't matter.
     Also: bumped the on-screen version tag from v2.34 to v2.49.
     The version tag had been stale since the cross-browser CSS
     work started — easy to forget to update it. Going forward it
     gets updated every shipped version.
     ---- previous changelog ----
     v2.48: Firefox cell tap fix. User reported cells felt like
     they had pinhead-sized hitboxes on Firefox (mom's browser),
     and that the cell-tap audio sounded clipped — both pointing
     to the same cause: Firefox was canceling the click event
     when the finger landed and reported tiny movement (touch
     "squish" producing 1-2px jitter), reclassifying the gesture
     as an attempted pan. Chromium-based browsers tolerate this;
     Firefox doesn't.
     Root cause: blank cells inherit touch-action:pan-y from
     .gscroll, which tells the browser "this area can be panned
     vertically" — Firefox interprets any movement on touchdown
     as the start of a pan and suppresses the click. The audio
     sounding clipped fits: touchstart audio fires immediately,
     then Firefox cancels the gesture mid-way through.
     Fix: add touch-action:manipulation to blank cells. This
     tells the browser the element handles taps and pinch-zoom
     but is not involved in pan gestures, so click events fire
     reliably regardless of finger jitter.
     ---- previous changelog ----
     v2.47: Fix lower-right tile spinning on every place. The click
     handler at line ~8313 was using `tile`, the IIFE-captured
     parameter that was actually the LAST tile from renderBank's
     loop (lower-right) due to how the loop variable closes over
     all iterations. The DEL-mode fallback already had a comment
     and a fix for this exact issue at line ~8163: `var _tileEl =
     document.querySelector('.bt[data-bank-idx="'+idx+'"]') || tile`.
     The bug had been present since v1.34 but was masked because
     the click handler's spin block almost never ran on mobile —
     the touchstart-SEL path at line ~7999 placed first and
     short-circuited the click handler via _mxSelTouchHandledAt.
     v2.46 disabled the touchstart-place path when drag-tiles is
     OFF, which now causes the click handler's spin block to run
     on every place, exposing the latent bug.
     Fix: query the actual tile by data-bank-idx at the top of the
     spin block and use that everywhere instead of the stale
     captured reference.
     ---- previous changelog ----
     v2.46: Found and fixed the actual instant-place culprit. v2.45's
     tap-track gate on the click handler was correct logic but only
     covered ONE of the place(idx) call sites. There was a SECOND
     path: the per-tile touchstart handler has a SEL branch (v1.34)
     that calls place(idx) directly on touchdown, completely
     bypassing the click event. That's why v2.45's gate had no
     visible effect — clicks still fired but the touchstart path
     had already placed before the click ever ran.
     Fix: gate the touchstart SEL branch on window._dragTilesEnabled.
     When drag is OFF, the touchstart-place is skipped entirely; the
     subsequent click event reaches the click handler, where v2.45's
     tap-track suppress check decides whether to place based on
     touch duration and movement.
     End-to-end behavior now matches the spec:
       - Quick tap (<200ms, <12px movement) on tile + SEL set → place
       - Held tap (>200ms) → no place, scroll works
       - Tap that moves >12px → no place, scroll works
       - No SEL → tiles inert (per existing _mxSelTouchHandledAt logic)
     ---- previous changelog ----
     v2.45: Manual tap detection when drag-tiles is OFF. v2.44 relied
     on the browser's native click event for tap-to-place, which
     turned out to fire essentially instantly on modern Android — so
     the user couldn't scroll past tiles when a cell was selected
     because every touch landing on a tile placed immediately.
     Fix: track touch start time + position in window._equilTapTrack
     during the bank's touchstart/touchmove/touchend chain (drag-
     disabled path). If the touch lasts >200ms or moves >12px, set
     a suppress flag. The per-tile click handler checks this flag
     before calling place() and bails out if set.
     Net result: quick, still tap = place. Held tap (>200ms) =
     scroll, no place. Tap that turns into scroll motion = scroll,
     no place. The user can now freely scroll past tiles even with
     a cell selected, as long as they don't tap and release within
     200ms.
     ---- previous changelog ----
     v2.44: Major UX overhaul driven by user's mom test session.
     1. Tile dragging is now OFF by default. Touching a tile no
        longer initiates a drag — the bank-level touchstart handler
        bails out before claiming the touch, and since all bank-
        level handlers are passive (or only act when state is set),
        the page scrolls naturally as if the user touched dead
        space. Tap-to-place still works through the browser's
        native click event: a quick non-scrolled tap fires click,
        and the existing per-tile click handler calls place(idx)
        if a cell is selected (SEL set). No manual time threshold
        needed — the browser already implements "click only after
        quick non-scrolled tap" with platform-tuned thresholds.
     2. Bank side padding now driven by settings. When drag is
        OFF, padding is 0 on both sides (the whole bank area is
        usable for tiles). When drag is ON, padding returns at
        a user-configurable width (default 40px) on the user's
        chosen side(s) — both, left only, or right only — for
        finger-size and handedness preferences.
     3. New OPTIONS panel section "Tile interaction" with:
        - Toggle: Drag tiles (default OFF)
        - Slider: Side padding width (0–80 px), only shown when
          drag toggle is ON
        - Segmented selector: Padding side (BOTH / LEFT / RIGHT),
          only shown when drag toggle is ON
        Settings persist in localStorage under equil_opts_v2 and
        are included in the Reset to defaults flow.
     ---- previous changelog ----
     v2.43: Bank tile numbers changed from hollow-outlined white to
     solid soft off-white. Was: color:transparent + -webkit-text-stroke
     for an outline-only neon look (read as bright white edges against
     dark bg). Now: color:#c8c8d0 — a soft cool-gray-tinted off-white
     that's easier on the eyes for extended play. Solid fill instead
     of outlined glyphs. The text-stroke property removed entirely
     since color is now opaque.
     ---- previous changelog ----
     v2.42: Cap tileFontSize at the default-size value. v2.41 doubled
     the slider's max range so users could go bigger to make the cyan
     ×N drift insignificant, but the font scaled UP with the tile
     proportionally — so the cyan still hung below the bottom border
     at any size. Now: at tile sizes bigger than default, the font
     stops growing and all the extra tile space becomes clean empty
     room inside the tile. Cyan ×N tucks comfortably into the lower
     portion regardless of how large the tile gets. Smaller-than-
     default tiles still scale font DOWN as before.
     ---- previous changelog ----
     v2.41: Doubled the size slider's max range (1.2x → 2.4x) per user
     request. The cross-browser cyan ×N positioning drift across v2.36-
     v2.40 was a real but tiny absolute issue — measured in a few pixels.
     At larger tile sizes those few pixels become a much smaller fraction
     of the visible tile, making the drift effectively invisible to a
     player. So instead of fighting it through more CSS, just give users
     the option to make tiles big enough that they don't notice it.
     Changes:
     - _puzzlePctToScaleH: formula 0.3 + (pct/100)*2.1 (was *0.9).
       Slider 0% → TILE_SCALE 0.3, slider 100% → TILE_SCALE 2.4.
     - _puzzleScaleToPctH: inverse formula updated to match.
     - All applyPctH(90) call sites changed to applyPctH(39) so the
       default tile size visually stays the same (TILE_SCALE ≈ 1.119,
       essentially identical to old 1.11).
     - Snapshot fallback values 90 → 39 to match.
     Also reverted v2.40's cyan font shrink (0.45×) back to the previous
     0.6× — the bigger-tile-range approach is the better fix.
     ---- previous changelog ----
     v2.40: Shrink cyan ×N font from 0.6× to 0.45× whiteFont so it fits.
     The diagnostic chain across v2.36-v2.39 finally landed on the actual
     root cause: the combined intrinsic height of (white digit line-box +
     cyan line-box + paddings) was exceeding the tile content area in
     Chrome/Brave/Firefox. DDGo happened to fit because its line-box
     rendering is tighter than the others.
     v2.39 confirmed this — with overflow:hidden, the cyan was getting
     CLIPPED at the bottom border, meaning it really was rendering past
     the tile edge.
     Fix: shrink the cyan font to 0.45× the white font (was 0.6×). Still
     readable, leaves clearance for line-box overhead in every browser.
     Also removed overflow:hidden from the tile (no longer needed once
     the math fits, and keeping it would clip the rounded corners
     unnecessarily).
     Layout: flex-column, justify-content:flex-start (white at top),
     cyan has margin-top:auto (pushes to bottom of available space).
     Tune by changing the 0.45 multiplier in the xN MODE block.
     ---- previous changelog ----
     v2.39: Switch from space-between to margin-top:auto + overflow:hidden.
     v2.38 used justify-content:space-between which works correctly when
     children fit within the container, but distributes negative space by
     pushing the last child past the bottom edge when content is too tall.
     User reported the cyan ×N was rendering with its midpoint at the tile's
     bottom edge in Chrome/Brave/Firefox (DDGo got it right because its
     line-box rendering left enough room). Switched to:
     - flex-direction:column, justify-content:flex-start (white sits at top)
     - cyan ×N has margin-top:auto (pushes to bottom of available space,
       but won't overflow past it like space-between can)
     - tile has overflow:hidden as safety net — if content is genuinely
       too tall to fit, it gets clipped at the tile border instead of
       rendering outside the tile entirely
     ---- previous changelog ----
     v2.38: Switch from absolute positioning to flex space-between for
     xN tile layout. v2.37 used position:absolute on both the white
     digit and cyan ×N badge, but the inline styles were apparently
     being overridden somewhere — both elements ended up squished
     toward the center of the tile instead of pinned to top/bottom.
     New approach: tile uses flex-direction:column with
     justify-content:space-between (when there's a cyan ×N to anchor
     to the bottom) or flex-start (when there's only a white digit).
     space-between naturally pushes the first child to the top edge
     and the last child to the bottom edge, with leftover space
     becoming the gap between them. Top/bottom padding on the tile
     creates the breathing room from the borders.
     This is the natural flexbox way to do top-and-bottom anchoring
     and isn't affected by font line-box drift between browsers.
     ---- previous changelog ----
     v2.37: Pin both white digit AND cyan ×N badge with absolute
     positioning. v2.36 only pinned the cyan from the bottom, which
     fixed the clipping in Brave/Firefox but left the white digit
     in flex-flow. Result: cyan landed at a consistent bottom offset
     but the white above it sat at slightly different vertical
     positions per browser, sometimes overlapping into the cyan.
     Now both:
     - white digit:  position:absolute; top:3px;
     - cyan ×N:      position:absolute; bottom:3px;
     Fixed pixel offsets (not scaled with tile size) since "a couple
     px from the border" reads the same visually at any tile size.
     The vertical gap between white and cyan is now fully determ-
     inistic: (tileSize - 3px - whiteFontSize - 3px - cyanFontSize).
     Tune the gap by changing either the top:3px or the bottom:3px
     value in the xN MODE block (~line 6878 / ~line 6900).
     ---- previous changelog ----
     v2.36: Pin cyan ×N badge with absolute positioning from tile bottom.
     Real cross-browser visual bug found via side-by-side screenshots:
     in xN mode, the cyan "×N" multiplier badge below each tile's white
     number was landing at different vertical offsets in different
     rendering engines:
     - Chrome: well above bottom border (correct).
     - DDgo: low but contained.
     - Brave: clipped by bottom border.
     - Firefox: dropping fully below the tile.
     Root cause: the badge was positioned via flex-column flow with a
     negative margin-top:-2px. Even with line-height:1 explicitly set
     on both the white digit above it and the cyan span, browsers
     compute the white digit's line-box height differently because
     line-height:1 shrinks line spacing but doesn't override the
     font's intrinsic ascent/descent metrics. So the cumulative
     vertical position of the cyan span — which depended on however
     tall the white line-box ended up being — drifted across engines.
     Fix: changed the cyan span to position:absolute with
     bottom:Xpx anchoring (X scales with tile size at ~6%, min 3px).
     The tile already had position:relative set, so the badge now
     anchors deterministically to the tile's bottom border in all
     browsers regardless of how the white digit's line-box renders.
     ---- previous changelog ----
     v2.35: Cross-browser normalization pass. Targets the rendering drift
     between Chrome, Brave, DuckDuckGo, and the Claude in-app browser on
     mobile that user has been seeing — different font weights, cyan
     numbers spilling past tile borders in some browsers but not others,
     and missing scroll deadzone on tile bank padding.
     Changes:
     1) Google Fonts loaded via <link rel="stylesheet"> in <head> instead
        of @import inside <style>. @import was a render-blocking
        sequential request — browsers had to download the HTML, parse it,
        find the @import, then download the fonts CSS, then download the
        font files. The <link>+preconnect approach kicks the font
        connection off in parallel with HTML parsing. Eliminates most of
        the FOUC drift between browsers.
     2) Added a normalization layer at the top of <style>:
        - text-size-adjust:100% on html (prevents Chrome mobile from
          auto-inflating font sizes in landscape).
        - -webkit-font-smoothing:antialiased / -moz-osx-font-smoothing:
          grayscale on body (pins rasterizer mode for consistent weight).
        - text-rendering:optimizeLegibility (uniform kerning).
        - font-feature-settings:"tnum" + font-variant-numeric:tabular-nums
          on body (consistent digit widths — "11" and "23" now occupy
          the same horizontal space, fixes drift when fallback fonts
          render before IBM Plex Mono loads).
     3) Added line-height:1 to .bt (bank tile) so the tile number is
        vertically locked inside the flex-centered box and can't drift
        past the rounded border in browsers with looser default
        line-heights.
     4) Removed orphaned animation rules (lines previously sat without a
        @keyframes wrapper after a prior refactor — silently ignored by
        browsers but flagged "unexpected token" by CSS validators).
     ---- previous changelog ----
     v2.34: Tile bounce-back animation + sound on cancel/release.
     When the user releases a dragged tile WITHOUT dropping it on
     a valid blank cell, the ghost previously vanished instantly.
     Now it animates back to the source bank tile's position and
     plays a home-arrival pop.
     Animation:
     - 180ms transition on left/top/width/height/border-radius/
       opacity using cubic-bezier(0.2,0.8,0.2,1) — ease-out.
       Fast departure, gentle settle.
     - Ghost shrinks from MAGNET_BASE_SCALE (1.05× source) back
       to 1.0× source while flying home.
     - Opacity fades to 0 over the same window so the ghost
       dissolves into the bank tile rather than landing on top.
     - Source bank tile's opacity restored after the animation.
     Sound — playTileReturn():
     - Mirror of playTilePickup. Same waveform (sine), duration
       (90ms env, 70ms sweep), and gain (0.18 peak).
     - Pitch sweep is 180→280 Hz (rising), the inverse of
       pickup's 280→180 Hz (falling). Reads as "coming back
       up" to where the pickup pop started.
     The cancel path (touchcancel — multi-touch interrupt etc.)
     still skips the animation and goes straight to cleanup.
     ---- previous changelog ----
     v2.33: Three small UI polish changes.
     1) Settings (gear ⚙) button restyled to match the New button:
        cyan border, cyan icon, transparent background, soft cyan
        glow shadow.
     2) Undo button (↩) removed from the in-game toolbar. JS that
        referenced it is guarded with null-checks; the undo
        function itself is still wired (the .seq history still
        records moves), the button is just gone from view.
     3) Logo flipped: was "EQU" white + "IL" cyan; now "E" cyan
        + "QUIL" white. Same .mast-title span rule, just moved
        around the E. Applied to both the menu screen H1 and the
        in-puzzle masthead.
     ---- previous changelog ----
     v2.32: Magnet stripped down to bare-minimum proximity logic.
     Many layered systems were causing more problems than they
     solved (push-off, ignored-set, directional-bias cones,
     handoff lock-start tracking) — replaced with one rule:
     ghost locks to a cell only when the magnet origin is within
     LOCK_RANGE cell-widths of that cell's center. No memory, no
     state machine.
     Removed:
     - PUSH_OFF_CELLS, DIRECTIONAL_LATERAL_CELLS,
       UNLOCK_RANGE_CELLS, CLEAR_IGNORE_CELLS tunables.
     - The ignored-set and lastPushOffCell tracking.
     - The directional cone / alignment-discount weighting.
     - lockStartX / lockStartY tracking.
     - Smoothed velocity vector fields (_smoothVx / _smoothVy).
       _smoothVel scalar kept for the velocity gate.
     Kept:
     - Velocity-gated snap (still works as before).
     - Lock visual + snap sound.
     - Hint highlight when finger is within ~3 cell-widths
       (gives a soft "you're close" cue without snapping).
     New tunable:
     - window._equilLockRange.cells (default 0.7) — slider in
       OPTIONS panel debug section. 0.7 means "finger basically
       has to be on the cell."
     ---- previous changelog ----
     v2.31: Two changes.
     1) Stronger directional bias for the magnet's nearest-cell
        search. v2.30 added directional weighting only to the
        post-push-off recompute. Now it applies to BOTH searches
        (the top-of-frame nearest-cell pass and the post-push-off
        recompute). The cone is also tighter — 60° half-angle
        (cos 0.5) instead of ~80° (cos 0.17) — and the discount
        is steeper. eff = rawDistance / (0.3 + 1.5 * align), so
        align=1 cells get a 44% discount, align=0.5 cells get
        ~5% discount, align<0.5 cells are excluded entirely.
        Motion direction is taken from lock-start → locked-cell
        when locked, falling back to a smoothed velocity vector
        otherwise. The currently-locked cell is exempt from the
        cone exclusion so an established lock can't be dropped
        just because the user paused or wiggled.
        Also added _smoothVx / _smoothVy fields tracking the
        smoothed velocity vector (was just _smoothVel scalar).
     2) Tap-to-return no longer auto-selects the cell. Previously
        tapping a placed number returned it to bank AND selected
        the cell with the magenta outline. User wanted the
        selection cleared after return — they're undoing, not
        starting a new placement.
     ---- previous changelog ----
     v2.30: Two changes addressing magnet jumpiness.
     1) Sideways-jump fix. When the magnet pushed off cell A and
        searched for the next cell to lock to, it used pure
        Euclidean distance from the magnet origin. After push-off
        the magnet origin sits right at A's position, so all four
        adjacent cells (above, below, left, right) are
        approximately equidistant. Finger jitter could pick a
        sideways neighbor when the user clearly intended to
        continue in the direction of motion (e.g. dragging
        straight up).
        Now the recompute uses directional weighting: the motion
        direction is computed from lock-start → A, and candidate
        cells are scored by effective distance =
        rawDistance / (0.5 + alignment), where alignment is the
        dot product of (cell - A) and motion direction. Cells
        more than ~80° off the motion direction (alignment < 0.17)
        are excluded entirely. Cells aligned with motion get up
        to a ~67% distance discount.
        Net effect: when dragging up, B (one cell up) wins over
        R (one cell right) even if finger jitter put R slightly
        closer in raw distance.
     2) Re-lock delay reduced. CLEAR_IGNORE_CELLS was 2.5 (cell
        widths the magnet origin must travel from a pushed-off
        cell before the cell becomes eligible again). Reduced to
        1.5. With ~50px cells that's ~75px of finger travel
        instead of 125px before the magnet can re-lock to a
        recently-departed cell — feels much more responsive
        when the user reverses direction.
     ---- previous changelog ----
     v2.29: Snap velocity slider range narrowed to 30–100 px/s
     (was 30–3000) with step 1 (was 10) and default 60. The
     px/sec values that map to actual placement vs fly-across
     drags are tiny on this device — finger movements that look
     fast still register as low double-digit values after the
     EMA smoothing. The wide range made the useful zone too
     compressed at the slider's left edge.
     ---- previous changelog ----
     v2.28: Slider range now 30–3000 px/s (was 300–3000), step 10
     (was 50), so finer values are reachable. Hysteresis gap is
     now adaptive instead of fixed ±100 — scales as 20% of the
     threshold value with a minimum of 10 px/s. At a midpoint of
     30 the gap is ±10; at 1000 it's ±200; at 3000 it's ±600.
     Fixed ±100 didn't work at low values (would push snapOn
     negative).
     ---- previous changelog ----
     v2.27: Collapsed the two snap-velocity sliders into one.
     Hysteresis (the gap between ON-below and OFF-above
     thresholds) is real and prevents flicker when velocity
     hovers exactly at the boundary, but it's a small benefit
     and not worth the UI confusion of two sliders. Now one
     slider sets the midpoint; the actual ON and OFF thresholds
     are auto-derived as ±100 px/s around it (200 px/s fixed
     hysteresis gap, plenty to prevent flicker without being
     noticeable to the user).
     Internal state: window._equilDragMagnet.snapMid (slider
     value) drives snapOn = snapMid-100 and snapOff = snapMid+100.
     ---- previous changelog ----
     v2.26: Added in-app debug controls for tuning the velocity-
     gated snap thresholds without needing a console. The user
     is on a phone without remote DevTools access, so the values
     get tuned via UI instead of console.
     OPTIONS panel now has a "Debug — snap tuning" section with:
     - "Drag velocity overlay" toggle: when on, a small floating
       readout appears at the top of the screen during any tile
       drag, showing live velocity (px/s) and whether the magnet
       is currently ON or OFF. Cyan when on, orange when off.
       Lets the user see what speeds their hand actually
       produces during fast vs slow drags.
     - "Magnet ON below" slider (200-3000 px/s, default 1000)
     - "Magnet OFF above" slider (400-3500 px/s, default 1400)
     - The two sliders are linked: setting one too close to the
       other auto-bumps the other to keep at least 200 px/s of
       hysteresis gap.
     ---- previous changelog ----
     v2.25: Velocity-gated snapping. The magnet now activates only
     when the finger's velocity drops below a threshold. Dragging
     fast across the board no longer triggers a chain of snap-
     locks and snap-sounds on every cell the ghost passes over.
     Mechanics:
     - Per-frame finger velocity computed from position and time
       deltas, smoothed with a 0.3-alpha exponential moving
       average (~3 frames of smoothing — enough to ignore jitter,
       not enough to feel laggy).
     - Hysteresis: `snapOff` (default 1400 px/s) disables the
       magnet when smoothed velocity rises above it; `snapOn`
       (default 1000 px/s) re-enables it when velocity drops
       below it. The gap between the two thresholds prevents
       on/off flicker when velocity hovers near the boundary.
     - When the magnet is gated off, any active lock is released
       and cell highlights are cleared. Ghost continues to follow
       the finger at base scale.
     Tunables exposed at:
       window._equilDragMagnet = { snapOn: 1000, snapOff: 1400 }
     Edit those values in the browser console to test different
     thresholds without re-shipping.
     ---- previous changelog ----
     v2.24: Two changes.
     1) Ghost border-radius now scales with the ghost's size and
        the radius/cap is tighter (0.15 ratio, 8px cap, was 0.22
        ratio, 10px cap). When the ghost shrunk to snap size, the
        previously-fixed-pixel radius dominated the small box and
        made it look almost circular. Both _createGhost and
        _setGhostTransform compute radius from current width;
        border-radius is in the transition list so the change is
        smooth alongside width/height/font-size.
     2) Magnet ranges dialed back further: lock 4→3, unlock
        6.5→5, push-off 1.5→1.2, lateral tolerance 2→1.8,
        clear-ignore 3→2.5. Snap zones noticeably tighter so the
        ghost locks only when the user is genuinely on a cell.
     ---- previous changelog ----
     v2.23: Drag ghost rebuilt as a fresh element instead of a
     clone of the bank tile.
     Why: cloning carried over the xN/mini/cyan child structure
     (×N badges, mini grids, etc.), which didn't scale when the
     ghost's width/height shrank during snap — the tile box
     shrank, but the inner number(s) stayed full size. The user
     also wanted the ghost to display ONE clean number while
     dragging, not the full docked-tile structure.
     New ghost:
     - Single span containing the value, centered.
     - White outline-stroke (-webkit-text-stroke) by default.
     - Dark cyan (#0093aa) when ### (all-cyan) mode is on —
       same color used for mini/cyan-mode small numbers in the
       docked state.
     - Border + background match the .bt rule visually.
     - font-size is computed as ~55% of ghost width and updated
       in _setGhostTransform on every position/scale change.
       font-size is also in the transition list so the number
       smoothly scales during the snap-shrink animation.
     ---- previous changelog ----
     v2.22: Two changes.
     1) Floating zoom-pan pill is now opt-in. Default OFF (was
        always shown when entering puzzle mode). User can enable
        it via OPTIONS panel → "Zoom pill" toggle. When toggled
        on, the pill spawns at the bottom-right of the puzzle
        area and plays a brief pop sound on appearance.
        State persists in localStorage like other options.
     2) Ghost-stuck bug, attempt #5. v2.21 used left/top for
        position and transform:scale for sizing. The ghost-at-
        upper-left issue was gone, but a new manifestation
        appeared: on fast pickup, the snap-shrink animation
        sometimes failed (ghost arrived at the cell at wrong/
        full size). That's transform:scale racing with the rAF
        transition setup.
        New approach: NO transforms at all. Sizing now via
        width/height directly. The "scale" multiplier in
        _setGhostTransform multiplies the source tile's base
        dimensions and writes width/height. The lock-fly + snap-
        shrink animation transitions left/top/width/height
        together. Pure layout, zero compositor.
        Should also handle the original ghost-stuck bug since
        no transforms means no compositor races at any phase.
     ---- previous changelog ----
     v2.21: Two changes.
     1) Text-stroke 0.3px → 0.5px. Even more visible across all
        browsers without overcrowding digit interiors.
     2) Ghost-stuck bug — fundamentally different approach. The
        v2.19 (rAF + transition:none) and v2.20 (opacity:0 +
        rAF + force reflow) attempts both failed on Chrome/Brave
        on Android. Switching positioning model entirely:
        - Ghost is now positioned via left/top properties.
        - transform is used ONLY for the scale factor.
        - The lock-fly animation transitions left, top, AND
          transform together over 180ms.
        This sidesteps every transform-related compositor race
        in Chromium because position changes are now pure layout
        operations rather than composited transforms. Slightly
        less GPU-friendly than pure transform animation but
        should be reliable across all Chromium variants.
     ---- previous changelog ----
     v2.20: Two changes.
     1) Text-stroke 0.1px → 0.3px. The 0.1px value was effectively
        invisible in mainline Chrome/Brave on Android — only the
        Claude app and DuckDuckGo were rendering it visibly. 0.3px
        is a compromise between visibility everywhere and not
        being so thick that the digit interiors close up.
     2) More aggressive fix for the "ghost stuck upper-left" bug.
        v2.19's `transition:none + rAF` approach didn't fully
        eliminate the issue on Chrome/Brave. New approach: append
        the ghost at opacity:0, force a layout read with `void
        ghost.offsetHeight`, then in requestAnimationFrame:
        - re-set the transform one more time
        - fade opacity in
        - enable the 180ms transition
        - enable will-change:transform
        Net effect: the user never sees the initial paint of the
        freshly-appended element, so even if Chrome's compositor
        is racing on the transform, the visible state is always
        "ghost at finger position". Also moved will-change off
        the initial cssText since promoted layers seemed
        correlated with the bug.
        This works around a Chromium-on-Android bug where
        transforms applied via inline style on a freshly-
        appended element occasionally fail to render on the
        first paint, leaving the element at viewport origin.
        DuckDuckGo (Chromium-based with different defaults) was
        not affected, which pointed at compositor/will-change
        defaults as the trigger.
     ---- previous changelog ----
     v2.19: Fix the ghost-stuck-at-upper-left bug (more thoroughly
     this time). User reported it was speed-dependent and ~80%
     reproducible at moderate-to-fast pickup speeds — slow drags
     never triggered it.
     Hypothesis: when the ghost was created with the 180ms
     transform transition already enabled, on a fast initial drag
     the freshly-appended element seemed to either:
       (a) Animate FROM transform:none (origin) TO the initial
           finger position over 180ms, sometimes never completing
           the animation, or
       (b) Drop the inline transform during initial layout, leaving
           the element at its computed default (origin position).
     Fix:
     - Initial cssText now sets transition:none, so no animation
       happens during the first paint of the freshly-created
       element.
     - Transform is also set redundantly via style.transform after
       cssText, in case the cssText parsing dropped it.
     - The 180ms transition is enabled in a requestAnimationFrame
       callback, so subsequent updates (which fly the ghost
       between cells during magnet locks) still animate smoothly.
     ---- previous changelog ----
     v2.18: Two bug fixes.
     1) Middle-cell skip when hopping through a column. Before:
        ghost locked to cell A, user dragged through A toward B
        and beyond, ghost jumped from A directly to C (the cell
        beyond B) — B was skipped. Cause: when push-off from A
        triggered a handoff to B, B's lock-start was set to the
        current ghost position (which is at A's location since
        the lock just transferred). That made B's "approach
        distance" effectively zero, so the directional push-off
        for B fired almost immediately, bouncing the ghost
        through to C. Fix: when push-off occurs, save the cell
        that was pushed off. On the next fresh lock, use THAT
        cell's center as lock-start instead of the current ghost
        position. Now B's approach axis spans A→B (one cell
        width) and directional push-off requires the ghost to
        travel from A past B by another cell width.
     2) Defensive ghost rendering. The "ghost stuck in upper-
        left corner" bug was likely a combination of:
        - `.bt` class CSS rules (flex, min-width, aspect-ratio)
          fighting the cloned ghost's inline width/height,
        - rect.width somehow ending up zero in some edge cases
          (mid-render, hidden tile, etc.),
        - bad numeric inputs producing malformed CSS transforms
          that the browser silently dropped.
        Fixes: ghost dimensions fall back to 50px if rect is
        zero; cssText now includes `flex:none; min-width:0;
        max-width:none; aspect-ratio:auto` to override the .bt
        rule's layout properties; _setGhostTransform validates
        finite numbers before constructing the transform string
        and uses safe fallback dimensions.
     ---- previous changelog ----
     v2.17: Three changes.
     1) Snap sound switched from the bandpass-noise whoosh to a
        sine pop (playTileSnap) that's a higher-pitched, slightly
        quieter variant of the pickup pop (playTilePickup).
        Pickup is 280→180 Hz, snap is 360→520 Hz with an upward
        contour — they read as related but distinct (down for
        leaving, up for arriving). Snap peak gain 0.10 (was 0.18
        for pickup, 0.09 for whoosh).
     2) Magnet ranges dialed back to feel less aggressive than
        v1.94's 6/8. Lock 6→4, unlock 8→6.5, push-off 2→1.5,
        clear-ignore 3.5→3.0. Tighter snap zones overall.
     3) FINGER_OFFSET_Y doubled: 24 → 48. Ghost now sits about
        half an inch above the finger so there's plenty of clear
        air between fingertip and tile. Magnet origin uses this
        same point (per v1.94's offset model), so the ghost is
        what's "interacting" with cells from the cells'
        perspective, not the fingertip.
     ---- previous changelog ----
     v2.16: Several changes.
     1) ADJUST button now reads "TILE" / "ADJUST" on two lines.
        Cyan border by default (matching the inactive display-
        mode buttons in the same row), turning purple via the
        existing .active class only when the modal is open. The
        `active` class is now toggled by the modal open/close
        handlers. Removed the always-purple #tileAdjustBtn
        style override that previously kept it permanently
        magenta. line-height tightened to 1.15 so the two lines
        sit cleanly within the button.
     2) New playTilePickup() — a quiet low sine-wave pop (~280Hz
        → 180Hz over 70ms, peak gain 0.18). Plays when the user
        first picks up a tile from the bank (drag enters dragging
        state). Confirms the lift audibly even if the visual
        ghost is hidden under the finger.
     3) New playTileSnapWhoosh() — short bandpass-filtered noise
        burst (90ms, 900Hz→1700Hz sweep, peak gain 0.09 — about
        half the perceived volume of the previous snap click).
        Replaces the playSelEmpty() click that fired on every
        fresh magnet lock since v1.92. Character matches the
        pill's drag-wind sound rather than a UI button click,
        per user request.
     ---- previous changelog ----
     v2.15: Two refinements.
     1) Multi-digit white centering: v2.14's 1px left-nudge went
        too far. User reports right gap is correct but left gap
        is about half what it should be — digit needs to come
        back to the right. Switched from padding-right:1px to
        padding-left:0.5px. Sub-pixel CSS values resolve to the
        nearest device-pixel boundary at the device DPR.
     2) Cyan ×N opacity reduced (color:#0093aa → rgba(0,147,170,
        0.6)) only in xN mode. Now that cyan numbers are larger
        after the v2.11 sizing, a slightly dimmer cyan reads
        more clearly as secondary to the white digit. Mini-mode
        and cyan-mode renderings unchanged — they have their
        own color logic that wasn't affected.
     ---- previous changelog ----
     v2.14: Two refinements.
     1) Centering nudge for multi-digit whites: 2px → 1px. v2.13's
        2px overshot by a hair.
     2) Cyan ×N pulled up off the bottom border. Was: margin-top:
        +2px, putting a 2px gap above cyan. Now: margin-top: -2px,
        pulling cyan upward by 2px. Combined with the 10% bottom
        padding from v2.13, cyan now sits well clear of the
        border with the empty space below where there used to be
        empty space above.
     ---- previous changelog ----
     v2.13: Three small fixes.
     1) Tile border opacity 0.85 → 0.5. Updated both the .bt CSS
        rule AND the inline border set in applyTileColor (which
        runs at render time and beats the CSS rule) so all
        uncolored tile borders read at the new lighter weight.
     2) xN mode: cyan ×N was bleeding into the bottom border.
        Split the symmetric padding into separate top/bottom —
        top stays at 5% (white position unchanged), bottom
        doubles to 10% so cyan sits clearly inside the tile.
     3) Double-digit white numbers appearing right-shifted: this
        is an optical artifact of "1" being narrower than other
        digits in IBM Plex Mono — when "10" or "12" is centered,
        the visible ink leans right because the "1" doesn't
        extend leftward as much as the second digit extends
        rightward. Fixed with a 2px padding-right on the white
        span when the value has 2+ digits, which nudges the
        text slightly leftward to balance optically. Single
        digits get no nudge.
     ---- previous changelog ----
     v2.12: xN mode layout refinement.
     - Layout switched from space-between to flex-start so cyan
       sits right under white instead of being pushed to the
       tile's bottom edge. 2px margin between them.
     - Cyan ×N font size: 0.84× of white → 0.6×. Was too big in
       v2.11.
     - White position uniform across all xN tiles regardless of
       whether they have duplicates — single-instance tiles now
       use the same top-anchored layout (just without the cyan
       ×N), so all white digits sit in the same spot row-to-row.
     - White size unchanged (still 1.6× tileFontSize).
     - White span gets margin-top:-1px to shift it up 1 device
       pixel from the top padding (per user request — wanted a
       small upward bump independent of tile size).
     - Padding 6% → 5% of tile size top/bottom.
     ---- previous changelog ----
     v2.11: xN mode redesigned to a vertically-stacked layout.
     Was: white number flex-centered (single line in middle of
     tile), with a small cyan ×N label absolutely-positioned at
     the bottom. The cyan was ~42% of the white digit's font.
     Now: white number on top, cyan ×N on bottom, both filling
     most of the tile's vertical space. Tile is switched to
     flex-column with justify-content:space-between when xN
     fires, and equal top/bottom padding (~6% of tile size).
     White digit keeps the v2.10 size (1.6× tileFontSize).
     Cyan ×N is now ~84% of the white digit's size — net ~3.2×
     bigger than before, roughly matching the white digit's
     visual presence.
     Single-instance tiles (where ×N would be ×1, hidden) keep
     the centered layout via the existing else branch.
     For reference: in default + xN modes the white digit is
     typically rendering at ~22-24px in XL2 mode (was ~14px
     before v2.10), and the cyan ×N is now ~18-20px (was ~6-7).
     ---- previous changelog ----
     v2.10: White main-number font size bumped 1.6× in xN mode
     and default mode (no display style chosen). The outline-only
     stroke renders cleaner at larger sizes and there's plenty of
     room when no cyan content is layered. Mini and cyan modes
     keep the original font size since the cyan numbers around/
     over the main digit need that breathing room.
     ---- previous changelog ----
     v2.09: text-stroke 0.7px → 0.1px. Sub-pixel CSS values are
     valid; rendering is up to the browser. On Android Chrome
     this typically resolves to the thinnest renderable line
     (one device pixel) or an alpha-blended near-invisible
     trace. Either way, this is as thin as the outline can go.
     ---- previous changelog ----
     v2.08: Two fixes for v2.07.
     1) Outline thickness — 1px stroke at 24px font was filling
        the glyph interiors. Bumped font to 28px and thinned
        stroke to 0.7px so digit interiors are clearly visible.
     2) Cyan ×N multiplier badge (._btXN) was inheriting the
        outline treatment and turning into a white-outlined
        version of the cyan number. Added it to the stroke-
        disabling rule alongside the cyan/mini grid children.
        Also explicitly added ._btMiniNum since v2.07's wildcard
        selector might not have been catching it on all browsers.
     ---- previous changelog ----
     v2.07: Three changes.
     1) Pill tab lengthened from 24px to 36px. Gives more visual
        presence to the grip area now that the top portion is
        hidden behind the circle.
     2) Tile number font bumped from 20px to 24px so the 1px
        text-stroke doesn't fully close the narrow interior gaps
        in glyphs like 8, 5, 0 — letting the transparent interior
        actually show through as expected.
     3) Cyan-mode and mini-mode child number elements now have
        text-stroke explicitly disabled, so only the WHITE main
        tile numbers get the outline treatment. Cyan numbers
        render as solid cyan fills as before.
     ---- previous changelog ----
     v2.06: Two unrelated changes.
     1) Floating pill: connected the tab's vertical border lines
        to the circle. Was: TAB_GAP=2 — small gap between circle
        and tab so they looked like two stacked shapes. Now:
        TAB_GAP=-11, raising the tab into the circle so the
        tab's top corners sit ON the circle's bottom arc at
        x=±22 from circle center (where chord coords land at
        y=45.32 on a 28-radius circle). Added z-index ordering
        (circle:2, tab:1) so the circle covers the part of the
        tab that's inside its silhouette — the visible result
        is the tab's vertical borders cleanly meeting the
        circle. Grip dots also pushed to the bottom of the tab
        with align-items:flex-end + 5px bottom padding so they
        sit in the visible portion (the upper half of the tab
        is now hidden behind the circle).
     2) Bank tile numbers: switched from filled white text to
        1px outline (-webkit-text-stroke). Color is transparent
        so only the stroke is visible. Font size bumped from
        18px to 20px to compensate for the slight visual loss
        of stroked-only text.
     ---- previous changelog ----
     v2.05: Fix v2.04 — the .btiles CSS padding update I made
     was being overridden by an inline style set in renderBank
     (line ~5852) that pinned puzzle-mode left/right padding to
     0px. Updated those inline assignments to 40px.
     ---- previous changelog ----
     v2.04: Added 40px horizontal padding inside .btiles (the bank
     tile container). Gives the user a clear band on either side
     of the tile row to grab for vertical scrolling without
     accidentally landing on a tile and starting a drag-to-place
     operation. Tiles still center-justify within the remaining
     space so spacing between them is unchanged.
     ---- previous changelog ----
     v2.03: Corner diagonals 10.5×11.5 → 10.3×11.3. Sub-half-pixel
     OCD calibration. SVG handles arbitrary float precision in
     viewBox/coords, so this resolves to whatever the device
     actually renders.
     ---- previous changelog ----
     v2.02: Corner diagonals 10×11.5 → 10.5×11.5.
     ---- previous changelog ----
     v2.01: Corner diagonals 10.5×11 → 10×11.5. Steeper angle.
     ---- previous changelog ----
     v2.00: Corner diagonals 11×11 → 10.5×11. Slight asymmetry —
     a hair shorter horizontally than vertically.
     ---- previous changelog ----
     v1.99: Corner diagonals 11.5×11.5 → 11×11. Tightens up the
     inner-end overlap with grid-clip border by half a pixel.
     Held off on the variable-width taper experiment — it's
     genuinely doable (replace <line> with <polygon>, compute
     wedge vertices for each of the 4 corners) but adds enough
     complexity per corner that I'd want to confirm the taste
     for it before changing it.
     ---- previous changelog ----
     v1.98: Two refinements to the corner diagonals.
     1) 12×12 → 11.5×11.5. Slight shortening to avoid overlap
        with the grid-clip border at the inner end. (Yes,
        fractional viewBox values are valid SVG.)
     2) Bright end stop-opacity dropped from 1 to 0.5 to match
        the gscroll outer border (rgba(0,217,255,0.5)) — the
        diagonals were noticeably brighter than the border at
        the upper-left corner. Now the line color blends
        smoothly into the border rather than glowing past it.
     ---- previous changelog ----
     v1.97: Corner diagonals to 12×12 — perfect 45° angle, slightly
     shorter than 15×12.
     ---- previous changelog ----
     v1.96: Corner diagonal SVGs adjusted from 14×12 to 15×12.
     v1.95's grid-clip padding bump (+3 → +6) moved the grid-
     clip corners ~3px further from gscroll's corners, throwing
     off the diagonals which were tuned to land on the grid-clip
     corners. Bumping the horizontal extent compensates.
     ---- previous changelog ----
     v1.95: Grid-clip padding bumped from +3 to +6 on both
     dimensions, so the bottom (and right) edge of the grid
     isn't clipped. Previously the bottom horizontal line of
     the grid was getting eaten by the clip layer. The +3
     fudge from earlier wasn't quite enough — apparent
     subpixel rounding, outline-style cell borders, and the
     inner box-shadow seem to push the visible content a
     couple pixels past the clip box. +6 gives comfortable
     headroom on both edges.
     ---- previous changelog ----
     v1.94: The 24px above-finger offset is now the "magnet origin"
     for all distance and lock checks — not just where the ghost is
     drawn. Cells react to the ghost's position as if it were the
     finger. Net effect: the ghost behaves like it actually IS the
     finger from the cell's perspective, just in a place where you
     can see it.
     Lock ranges dialed back from 10/13 to 6/8 cell widths now that
     the offset model means the ghost is closer to cells than the
     finger is.
     ---- previous changelog ----
     v1.93: Ghost is now offset 24px above the finger (~1/4 inch
     on most phones) when in the "follows finger" state, so it
     pops out above the fingertip the moment the drag starts and
     stays visible during the unlocked portion of any drag.
     Locked-in-cell state is unchanged — the ghost still snaps
     to the cell center where it can be seen on its own.
     Magnet distance calculations still use the raw finger
     position, not the ghost position, so cell pull/lock
     behavior is unaffected by the visual offset.
     ---- previous changelog ----
     v1.92: Two changes.
     1) Lock range pushed to 10 cell widths (was 7), unlock to 13.
        Magnet pulls in from much farther — by the time you're
        anywhere near the grid, the closest blank should already
        be sucking the ghost in.
     2) Snap sound on every fresh lock. Reuses the existing
        playSelEmpty() click — same sound played when tapping an
        empty cell to select it. Audible cue lets the user "hear"
        the snap when their finger covers the visual.
        Sound only fires on a NEW lock (cell key changes), not
        every move event, so a stable lock doesn't keep clicking.
     ---- previous changelog ----
     v1.91: Directional push-off. Previously push-off only fired
     when the finger got radially close to the locked cell's
     center. If the user dragged up past the cell with even a
     small lateral drift, the radial distance might never shrink
     enough — push-off would never trigger. So sliding "past" the
     cell didn't bump the ghost off, only sliding straight into it.
     New check: at lock time, record where the finger was. As the
     finger continues moving, project its current displacement onto
     the lock-start → cell-center axis. If the projection length
     reaches or exceeds the original approach distance (i.e. the
     finger has traveled at least as far as the cell), AND the
     lateral offset from that axis is within ~2.5 cell widths,
     push-off fires.
     Net effect: drag at an angle past a locked cell — even
     significantly off-axis — and the ghost still releases as
     soon as you've moved "past" it along your approach direction.
     The radial check still fires too as a fallback, so direct
     hover-on-cell push-off still works.
     ---- previous changelog ----
     v1.90: Push-off model exaggerated.
     - PUSH_OFF_CELLS: 1.0 → 2.0. Lock breaks when finger gets
       within 2 cell widths of the locked cell (was 1). The ghost
       gets bumped off well before the finger reaches it.
     - LOCK_RANGE_CELLS: 5.0 → 7.0. Lock kicks in from much
       farther away, so as soon as one cell pushes the ghost off,
       the next cell up snags it almost immediately.
     - UNLOCK_RANGE_CELLS: 7.0 → 9.0 (matched ratio).
     - CLEAR_IGNORE_CELLS: 2.5 → 3.5. Pushed-off cells stay
       disqualified for a bit longer so the finger doesn't
       accidentally re-lock onto the cell it just escaped.
     ---- previous changelog ----
     v1.89: Push-off model for cell-to-cell hopping.
     Previous "lock handoff" assumed a different cell would
     organically become the closest as the finger crossed cell
     boundaries. But in practice, finger drags from below a column
     stayed closest to the bottom cell even as the finger reached
     and moved past it.
     New behavior:
     - Locks normally when finger gets within 5 cell widths.
     - Once locked to cell A, ghost stays at A while finger keeps
       moving — even if finger gets noticeably closer than the
       ranges that would normally maintain a lock.
     - When finger gets WITHIN 1 cell width of the locked cell A's
       center (PUSH_OFF_CELLS), the lock breaks and A is added to
       a temporary "ignored" set. Ghost flies back to under the
       finger and immediately searches for the next-nearest blank
       cell that ISN'T in the ignored set.
     - If another blank cell B is within lock range, ghost
       immediately locks onto B.
     - A cell stays in the ignored set until the finger has moved
       2.5 cell widths from its center (CLEAR_IGNORE_CELLS), at
       which point it becomes lockable again.
     Net effect: drag up a column from below, ghost snaps onto
     the bottom blank, stays there as your finger rises, gets
     pushed off when your finger arrives, immediately snaps onto
     the next blank above. Continue and it walks up the column.
     ---- previous changelog ----
     v1.88: Two changes.
     1) Magnet range pushed further: LOCK_RANGE_CELLS 3.5 → 5.0,
        UNLOCK 5.0 → 7.0. Bigger neighborhood for the snap.
     2) Lock-handoff between cells. Previously, once the ghost was
        locked to cell A, the finger had to move fully past the
        unlock distance before any other cell could grab the lock.
        That made it really hard to hop from one blank to an
        adjacent blank — you'd have to overshoot.
        Now: if a different cell becomes the nearest while the
        ghost is locked, the lock transfers directly to that new
        cell (provided the finger is still within the unlock
        range — i.e. still in the grid neighborhood). The ghost
        flies straight from one cell center to the next.
        Hysteresis still applies for fully unlocking — if the
        finger leaves all cells past the unlock range, the ghost
        flies back to the finger.
     ---- previous changelog ----
     v1.87: Magnetism: bigger ghost, more aggressive lock range.
     - SNAPPED_FILL: 0.7 → 1.5. Locked ghost is now 1.5× cell
       width, so it's clearly visible during the fly motion
       instead of shrinking into a tiny dot. Bigger than the
       cell, sits like a magnified preview.
     - Lock range switched from "tile edge touches cell edge"
       (which was tight) to "finger within 3.5 cell widths of
       cell center". Lock kicks in much earlier in the drag.
     - Unlock at 5.0 cell widths (hysteresis: finger has to move
       1.5 cell widths past the lock zone before releasing).
     ---- previous changelog ----
     v1.86: Magnetism redesigned as a binary-state lock instead
     of a continuous pull. The continuous-pull approach kept the
     ghost too close to the finger to ever escape the fingertip
     occlusion problem.
     New behavior:
     - Ghost is either UNDER FINGER (full size, follows touch) or
       LOCKED IN CELL (sized to fit inside cell, sitting at cell
       center). No partial states, no in-between.
     - Lock triggers when finger gets close enough that the tile's
       visual edge would meet the cell's edge if the ghost stayed
       under the finger. At that point, the ghost flies to the
       cell center over ~180ms (CSS transition).
     - Snapped ghost is sized to 70% of the cell's width — fits
       cleanly inside the cell, doesn't poke out near finger.
     - Hysteresis on unlock: finger has to move 30px past the
       lock threshold before the ghost releases, so jitter at the
       boundary doesn't cause flicker.
     - Cell highlight shows up as a hint outline within ~3 cell
       widths of the nearest blank, even before locking — gives
       the user some advance signal of the snap target.
     The result: when the user drags toward a cell, the ghost
     visibly leaves the finger and slides into the cell. They can
     see it sitting in the cell, then either release (place) or
     pull finger far enough away to break the lock.
     ---- previous changelog ----
     v1.85: Magnetism cranked up substantially — v1.84 was barely
     perceptible because the cells are tiny in XL2 mode and the
     bank is far from the grid, so the 2.5-cell range only kicked
     in when finger was already on the cell.
     Tunable changes:
     - MAGNET_RANGE_CELLS: 2.5 → 6.0. Tease pull starts much
       earlier in the drag — user feels something happening
       throughout the drag-up motion, not just at the very end.
     - MAGNET_SNAP_CELLS: 0.75 → 1.5. Bigger snap zone so the
       dramatic yank kicks in from farther away.
     - MAGNET_MIN_SCALE: 0.3 → 0.2. Snapped ghost is even smaller,
       clearly visible beside a fingertip.
     - MAGNET_TEASE_MAX: 0.15 → 0.45. Outer-zone pull is a real
       pull now (up to 45% lerp), not a near-imperceptible 15%.
     - Ghost transform transition: 60ms → 120ms. Snap motion is
       a clear visible slide rather than instantaneous catch-up.
     - Locked cell highlight: 2px outline → 3px + outer glow.
       The cell lights up dramatically the moment magnet locks.
     ---- previous changelog ----
     v1.84: Magnetism rebuilt with two distinct zones for a more
     dramatic snap.
     - Outer zone (0.75 to 2.5 cell widths from center): just a
       slight tease — pull strength capped at 15%. Ghost stays
       mostly under the finger; user only feels a hint of magnetism.
     - Inner zone (within ~0.75 cell widths, ~one finger width):
       the dramatic snap. Pull goes from 15% rapidly to 100% via a
       smoothstep curve over a short distance, so the ghost yanks
       out from under the finger and slides to the cell center.
     - MIN_SCALE shrunk from 0.5 to 0.3 — fully snapped ghost is
       small enough to be visible beside a fingertip rather than
       hidden under it.
     - Pulling the finger back across the inner-zone boundary
       smoothly releases the ghost back to under the finger at
       full size — the curve runs in reverse.
     - Added a 60ms transform transition on the ghost so the snap
       is visibly animated rather than tracking the finger 1:1.
       Short enough that normal drag still feels responsive.
     ---- previous changelog ----
     v1.83: Magnetic drag-to-place. As the dragged ghost approaches
     a blank cell, two things happen smoothly together:
     - Position is pulled from finger toward cell center.
     - Scale shrinks from 1.05 (base) to 0.5 (locked-on).
     The pull is computed via smoothstep over a 2.5-cell-width range
     so the ramp feels organic — no hard threshold. As the user
     drags away from a cell, the effect reverses smoothly.
     The cell highlight uses a subtle outline at the edge of the
     pull range and a brighter outline + inset glow once the magnet
     is "locked" (>70% pull strength).
     On release while locked: ghost slides into the cell center and
     fades out in 110ms, then place() runs to commit the placement.
     If the user releases outside any pull range, falls back to the
     old elementFromPoint hit-test as a safety net.
     ---- previous changelog ----
     v1.82: Drag-to-place. New touch handler on the bank: drag a
     tile and drop it on a cell to place it.
     - Active regardless of whether a cell is selected (the existing
       tap-to-select-cell-then-tap-tile flow still works untouched).
     - Drag is detected by movement threshold (8px). Below that
       it's still a tap, so the existing tile-tap behavior is
       preserved.
     - Ghost element follows the finger while dragging; the source
       tile dims to ~30% opacity to indicate origin.
     - On move, the cell under the finger gets a magenta outline
       to preview the drop target. Only blank cells highlight.
     - On release, if the finger is over a blank cell, place(idx)
       is called with SEL set to that cell. place()'s existing
       logic handles "drop replaces existing value" automatically:
       if the target already has a value, that value is returned
       to the bank before the new one is placed.
     - On release outside a blank cell, the ghost is silently
       removed and the source tile restored — no error.
     Existing place(idx) function is untouched; we just feed it
     the drag target by setting window.SEL before invoking.
     ---- previous changelog ----
     v1.81: ADJUST modal repositioned and de-darkened.
     - Anchored to the left side of the viewport
       (justify-content: flex-start) instead of horizontally
       centered. Sits flush to the left edge with 8px padding.
     - Removed the dark rgba(0,0,0,0.78) backdrop. Modal is now
       just the slider box itself with no overlay tinting the
       rest of the page.
     - Set pointer-events:none on the overlay container so taps
       outside the box pass through to the page instead of being
       absorbed. The inner box re-enables pointer-events:auto.
       Side effect: the backdrop-click-to-close path no longer
       fires (taps outside don't dismiss). Close via DONE button.
     ---- previous changelog ----
     v1.80: Two changes.
     1) Disabled FULL zoom on the floating pill. Pill is now
        restricted to OFF and HALF only. The HALF→FULL promotion
        in touchmove is gated behind `if(false && ...)` so it's
        easy to re-enable later — just remove the false guard.
     2) Made the ADJUST modal as compact as possible. Was a
        360px-wide box with 22px padding, 14px gaps, 200px slider
        min-height, 13px title, and a 120px-wide bottom button.
        Now: width auto-fits content, padding 10px, gap 8px,
        slider min-height 140px, title 11px, close button 80px
        wide and smaller font. Killed the wrap's own internal
        padding inside the modal too — that was adding dead
        space around the sliders themselves.
     ---- previous changelog ----
     v1.79: Floating zoom-pan pill edge padding adjusted.
     - RIGHT_NOGO_PX: 32 → 20 (pill can sit a hair closer to the
       right edge).
     - LEFT_NOGO_PX added at 20px to mirror the right padding.
       Previously the left edge clamped to 0, so the pill could
       go flush to the left side. Now it has the same comfortable
       breathing room on both sides.
     Three clamp sites updated: drag, glide, and re-clamp on show.
     ---- previous changelog ----
     v1.78: Fix scroll-to-top on tile-mode button presses.
     Two changes that together should kill it:
     1) Added type="button" to all the new buttons (ADJUST, ×N,
        ####, ###, DONE). Default <button> type is "submit", which
        in some browsers triggers default scroll-to-top behavior
        even when not inside a form.
     2) Switched the mode-button relay from "dispatch synthetic
        click on the original (display:none) button" to "call the
        toggle function directly via window._equilToggleCondense
        etc." A click on a display:none element can trigger weird
        browser defaults (focus-into-view scrolling, etc.). A
        direct function call has none of those side effects. The
        original toggle functions are now exposed on window so
        the relay can reach them without going through the DOM
        click pathway.
     ---- previous changelog ----
     v1.77: Found the actual cause of the display-mode bug.
     My _wireWhenReady() attached click listeners to the relay
     buttons. It was registered for BOTH DOMContentLoaded AND
     load, intentionally as a safety net. But both events fired
     in sequence, the function ran twice, and each invocation
     called .addEventListener('click', ...) on the same buttons.
     Result: each button had TWO relay listeners. One tap →
     both listeners ran → each dispatched a synthetic click on
     the original toggle button → original toggled twice → flag
     ended up back where it started. The slider-snap side
     effect from the first toggle still fired, so tile size
     changed, but the mode flag never stuck. v1.76's per-handler
     re-entry guard didn't help because the two listeners were
     separate handler instances with independent _firing
     variables.
     Fix: idempotency guard at the top of _wireWhenReady so the
     wiring code runs at most once total.
     ---- previous changelog ----
     v1.76: Added a 200ms re-entry guard in the tile-mode relay
     handlers. Hypothesis: on Android, the browser was firing both
     a synthetic click (from touchend) AND a separate native click
     for the same tap, ~50ms apart. With no guard, the relay
     dispatched the toggle twice — flag flipped on then off, mode
     never stuck visually, but the slider-snap side effect from
     toggle-on still ran (which is why tiles changed size but
     never entered xN/mini/cyan rendering). Guard suppresses any
     second fire within 200ms, so one tap = one toggle.
     Also kept v1.75's preventDefault + stopPropagation on the
     relay handler to be safe against any other event-doubling.
     ---- previous changelog ----
     v1.75: Two fixes attempted on v1.74's restructure.
     1) FIXED: page no longer snaps to top when toggling the
        bottom-row buttons. Removed the bank-position drift
        compensation in applyPctH/applyGapPct that was the cause —
        it called window.scrollBy on every size/gap change, which
        was harmless when the call was triggered by a slider drag
        (small drift) but caused a visible scroll-snap when called
        from button toggles (large drift). Cost: when dragging the
        SIZE slider, the bank may shift a few pixels — acceptable.
     2) ATTEMPTED: replaced .click() relay with explicit MouseEvent
        dispatch in case .click() was unreliable on display:none
        elements. NOT confirmed whether this fixes the display-mode
        bug ("buttons make sound but tiles don't change to cyan/
        mini view") — need a test pass to verify.
     ---- previous changelog ----
     v1.74: Bottom-panel restructure (Ship 2 of 2). The vertical
     SIZE/GAP slider strip that used to occupy the left edge of the
     tile bank is hidden via CSS in puzzle mode. The bank now uses
     the full row width, so tiles can be larger.
     A new full-width tile-controls-row sits below the bank with
     four equally-spaced amethyst-bordered buttons:
       ADJUST · ×N · #### · ###
     ADJUST opens a modal containing the SIZE+GAP sliders. The
     slider DOM is physically moved into the modal on open and back
     to its original spot on close, so the existing slider IIFE's
     captured element references still work — no rebuilds, no event-
     listener re-wiring. The ×N/mini/cyan buttons forward clicks to
     the original (now-hidden) buttons via .click() so the toggle
     logic is identical, and a 500ms-interval poll keeps the new
     buttons' active state in sync with window._condensePuzzleTiles
     etc. (the original IIFE doesn't expose change events).
     The original mode buttons inside the slider strip are also
     hidden when the strip is moved into the modal, so the modal
     only shows the SIZE+GAP sliders. SEQ-mode behavior is
     unchanged — strip stays inline there since the sequencer uses
     it directly.
     ---- previous changelog ----
     v1.73: Display-mode toggles (xN, mini, cyan) now snap sliders
     to the new 90/25 default instead of 100/0 when entering a
     mode. Restore-defaults fallback (used when no snapshot exists,
     e.g. mode was loaded from localStorage on a fresh page) also
     bumped from 50/33 to 90/25. Three blocks updated to match.
     ---- previous changelog ----
     v1.72: Three small changes (Ship 1 of 2 — saving the structural
     ADJUST-button restructure for the next ship to keep the change
     surface manageable).
     1) Brought back some glow on .bt.lit but tighter than v1.70.
        Now a 4px+1px halo plus a fading 8px outer at lower opacity,
        instead of v1.70's 24px+4px bloom or v1.71's flat 6px. Glow
        dies off in ~4-6px from the tile edge.
     2) Tile size + gap defaults bumped from 50/33.33 to 90/25 (i.e.
        TILE_SCALE ≈ 1.11, TILE_GAP_MULT ≈ 0.75) — tiles default
        large with a small visible gap, matching the screenshot.
        Sliders still tune both as before.
     3) Vertical SIZE/GAP slider bar color changed from blue
        (#4b7bb5) to amethyst (#a855f7) so the slider matches the
        new accent color scheme.
     ---- previous changelog ----
     v1.71: Tightened the bank tile glow on .bt.lit. Was a stack of
     three layers (4px inset + 12px outer with 2px spread + 24px
     outer with 4px spread). The 24px+4px halo was bleeding way past
     the tile edges. Reduced to two layers: the same 4px inset and a
     single 6px outer with 0 spread (slightly bumped opacity to 0.55
     to compensate for the lost halo so the tile still reads as
     lit). Bumped opacity slightly. Same change to bt-place-blend
     keyframe on both 0% (magenta) and 100% (cyan) ends so the
     spin-into-place animation doesn't visually expand the glow.
     ---- previous changelog ----
     v1.70: Two changes.
     1) Shifted the magenta hue from #d946ef toward purple — now
        #a855f7 (rgba(168,85,247,...)). Less pink, more violet.
        Applied wherever the previous magenta showed: bank tile
        glow (.bt.lit), bt-place-blend keyframe, selected cell
        background/text/glow, placed-but-unsubmitted cell text.
     2) Selected cell now also shows a magenta BORDER at 0.85
        opacity instead of the regular cyan empty-cell border, so
        when you tap a cell the magenta state is visible from
        every direction (border + tinted bg + glow + text).
     ---- previous changelog ----
     v1.69: Yellow → magenta. The selected-cell glow, placed-but-
     unsubmitted cell text, and bank-tile "lit" glow (the candidate
     tiles when a cell is selected) all changed from amber/yellow
     to a vibrant purple-magenta (#a855f7 / rgba(168,85,247,...)).
     Also updated the bt-place-blend keyframe so the spin-into-
     place animation starts magenta (matching .bt.lit) and fades
     to cyan as before. Sequencer slot indicators (a separate
     feature) kept their yellow.
     ---- previous changelog ----
     v1.68: Empty-cell border switched from grey-white
     rgba(255,255,255,0.18) to cyan rgba(0,217,255,0.25). Bumped
     opacity slightly because cyan reads dimmer than white at the
     same alpha on a dark background — net perceived visibility
     stays about the same.
     ---- previous changelog ----
     v1.67: Grid edge starting opacity dropped from 0.22 to 0.12 —
     applied to both the .grid border and the four gradient stops
     so the cyan crosshatch and outermost grid line stay subtle.
     ---- previous changelog ----
     v1.66: Diagonal back to 14×12 (smaller). Reverted v1.65's
     top-only 2px nudge — restoring uniform corner anchoring across
     all four. Same slope ratio as 20×17 but shorter line. Should
     fall short of the grid corner but reach the grid-clip corner.
     ---- previous changelog ----
     v1.65: Nudged the top two corner diagonal SVGs down 2px via
     background-position. Bottom corners aligned correctly with
     20×17 in v1.64, but the top corners showed a small gap above
     the diagonal start — likely subpixel rounding or some other
     vertical asymmetry I can't easily diagnose without DOM tools.
     Just adding a top:2px offset to the top SVGs; bottom stays at
     bottom:0.
     ---- previous changelog ----
     v1.64: Diagonal shortened from 23×20 to 20×17. v1.63 overshot
     into the grid area. 20×17 is roughly halfway between v1.62
     (18×16, short of grid corner) and v1.63 (23×20, past grid
     corner) — should land between the two grid-clip corner and
     the grid's actual corner.
     ---- previous changelog ----
     v1.63: Diagonal lengthened from 18×16 to 23×20 — same slope
     (multiplied both axes by ~1.25) so the angle stays right but
     the line extends further inward toward the grid corner.
     ---- previous changelog ----
     v1.62: Diagonal to 18×16 — rotated steeper (vertical from 12
     to 16, +4 = 2x the previous step) and shortened horizontally
     (22 → 18) to compensate so the line doesn't overshoot when
     coming down at the steeper angle.
     ---- previous changelog ----
     v1.61: Diagonal vertical to 12 — midpoint between v1.59's 14
     (line overshot below the grid-clip corner) and v1.60's 10 (line
     stopped above the corner). 12 should land on the corner exactly.
     ---- previous changelog ----
     v1.60: Diagonal vertical pulled from 14 to 10. The diagonal was
     overshooting downward — its endpoint extended past the grid-clip
     corner. Horizontal (22) stays since the line was hitting the
     correct horizontal position; only the vertical was off.
     ---- previous changelog ----
     v1.59: Corner diagonals back to 22×14. v1.58's 24×16 overshot
     the grid-clip corner by a few pixels (poked into the grid
     area). 22×14 should land closer.
     ---- previous changelog ----
     v1.58: Corner diagonals lengthened from 20×12 to 24×16. The
     v1.57 numbers were short of the grid-clip corners by about
     4px in each direction. Likely cause: `.gscroll::before` with
     `inset:0` is positioning relative to the border-box (or near
     equivalent), so the gscroll's 2px border IS contributing to
     the visible offset and the box-shadow may be adding a pixel
     or two as well. Just bumped the SVG dimensions to match what
     the cropped photo showed. If still off, tune the numbers
     further.
     ---- previous changelog ----
     v1.57: Corner diagonals re-targeted to actually hit the grid-
     clip outer corners. v1.56's 22×14 SVG box was based on the
     wrong reference origin — `.gscroll::before` with `inset:0` is
     positioned relative to the padding-box (inside the 2px gscroll
     border), not the border-box. So the +2px for the gscroll border
     shouldn't have been included. Corrected to 20×12: 24px h-padding
     − 4px outline-offset = 20, 16px v-padding − 4 = 12. Diagonals
     now go from gscroll's inner-border corner to grid-clip's outer-
     outline corner exactly, with the natural angle that geometry
     produces (about 31°, not 45°).
     ---- previous changelog ----
     v1.56: Two changes.
     1) Swapped brightness of the two outer borders. .gscroll's outer
        border was rgba(0,80,95,0.75) (muted blue-cyan); now it's
        rgba(0,217,255,0.5) (brighter cyan). .grid-clip's outline
        was rgba(0,217,255,0.5); now it's rgba(0,80,95,0.75). Net
        effect: outermost is the bright one, inset is the muted one,
        matching what the screenshot showed should be reversed.
     2) Restructured corner diagonals from one stretched 100×100 SVG
        to four small per-corner SVGs sized exactly to the pixel
        distance from gscroll's outer corner to grid-clip's outer
        outline corner: 22px × 14px (2px gscroll border + 24/16 px
        padding − 4px outline-offset). Stacked via multi-background
        with corner-anchored background-position. Diagonals now hit
        the grid-clip corners exactly instead of relying on a
        stretched aspect ratio that misaligned them.
     ---- previous changelog ----
     v1.55: Halved the four corner diagonal accent lines so they
     stop at the outer edge of the .grid-clip outline rather than
     extending into the grid content area. SVG endpoints went from
     14 to 7 (% of viewBox). Same per-line opacity gradient
     (1.0 → 0.22) just over half the distance.
     ---- previous changelog ----
     v1.54: Three coordinated cyan-accent changes.
     1) .grid border opacity dropped from 0.4 to 0.22 — same floor
        as the gradient edge tint. Inner grid border now reads as a
        subtle accent rather than a frame.
     2) .grid-clip outline opacity bumped from 0.4 to 0.5 — middle
        stop in the three-layer fade. Order is now:
          .gscroll border (existing rgba(0,80,95,0.75)) → outer
          .grid-clip outline (0.5)                      → middle
          .grid border (0.22)                           → inner
     3) Added four diagonal corner accents on .gscroll::before via
        an inline SVG data-URI. Each line goes from an outer corner
        of .gscroll inward toward the matching corner of .grid-clip,
        with its own linear-gradient that fades from full opacity
        at the outer corner to 0.22 at the inner end. Lines use
        vector-effect="non-scaling-stroke" so they stay 1px wide
        regardless of how the SVG stretches.
     ---- previous changelog ----
     v1.53: Added a thin cyan border at the very outermost pixel of
     the zoomable grid content itself (1px, 0.4 opacity). Sits on
     the .grid element which is what pans and zooms, so the border
     follows the content — invisible most of the time when zoomed
     in (it's beyond the visible window), but appears at the
     corresponding edge of the viewport when the user pans all the
     way to that edge. Two corners visible when panned into a corner.
     Implementation: changed the inline grid.style.cssText border
     from `2px solid var(--bk)` (invisible structural border) to
     `1px solid rgba(0,217,255,0.4)` (visible cyan), and adjusted
     the grid-clip width/height computation from +4 (2px*2 sides) to
     +2 (1px*2 sides) so overflow:hidden still clips correctly.
     v1.52's outer outline on .grid-clip is kept as the static
     outer frame.
     ---- previous changelog ----
     v1.52: Cyan outline traced around the outer rectangle of the
     zoomable grid area at 0.4 opacity. v1.51's box-shadow inset on
     .grid::before sat under the cells and was hidden — replaced
     with `outline:1px solid rgba(0,217,255,0.4); outline-offset:4px`
     on .grid-clip so it draws a few pixels outside the grid itself,
     framing the puzzle exactly like the orange line in the screenshot.
     ---- previous changelog ----
     v1.51: Added a 1px cyan outline at the very outermost pixel of
     the zoomable puzzle area, same opacity (0.22) as the gradient's
     edge tint. Implemented via box-shadow inset on the .grid::before
     pseudo-element so it sits inside the zoomable area and pans/
     zooms with the content — distinct from the existing .grid 2px
     cyan border which lives OUTSIDE the zoomable area.
     ---- previous changelog ----
     v1.50: Two changes.
     1) Templates are shifted up after selection so the topmost cell
        anchors to row 0. Some XL2 templates were authored with
        verticals starting at r:0 (good) but others started at r:2 or
        r:3, leaving a band of mostly-empty rows at the top of the
        rendered puzzle. The shift compresses that out — same shape,
        just no dead space above the first content. Done by copying
        the chosen template (so the source pool isn't mutated) and
        subtracting min(r) from every equation's r.
     2) Right-edge no-go zone for the floating zoom-pan pill dropped
        from 100px to 32px (~1/4 inch on a typical phone). Was
        feeling closer to a full inch on Galaxy at high DPI.
     ---- previous changelog ----
     v1.49: Grid edge tint tuning. Edge opacity halved from 0.45 to
     0.22 so the outermost row of empty cells stays readable against
     the cyan tint, and fade distance widened from 8% to 12% so on
     XL2 the gradient covers ~3 cells inward instead of ~2. No
     change to puzzle generation or anything else.
     ---- previous changelog ----
     v1.48: Hard XL puzzles now generate visibly sparser layouts.
     The single-step propagator (v1.44) was the actual bottleneck —
     it could only resolve an equation when exactly 1 of its cells
     was blank, so the restore loop conservatively gave away ~64%
     of cells. Replaced with an arc-consistency oracle that
     maintains candidate sets per blank cell and narrows them
     iteratively, and added a wall-clock-bounded prune pass that
     re-blanks cells the new oracle can resolve through chains.
     Verified via headless test harness: XL2 hard now produces
     ~49% blanks (up from 36%), with 14% of equations having
     3-of-4 cells blank and 1.5% having all 4 cells blank — close
     to the pre-rebrand density.
     Standard 3-cell puzzles (medium/large) reverted to the v1.44-
     style per-equation greedy restore: arc consistency added
     overhead without payoff for short equation chains, and was
     causing multi-second hangs on large hard puzzles.
     Performance: 50,000-op budget per oracle call + 300ms wall
     clock budget on the prune pass. XL2 hard averages ~500ms,
     peaks around 1s. Standard sizes unchanged.
     Required two rounds of headless testing in jsdom to confirm
     the change actually moved density. Tile-cap loosening in v1.47
     turned out to be unrelated (the cap was rarely binding).
     ---- previous changelog ----
     v1.47: One change — loosened TILE_VALUE_CAP from 6/5/5/4 to
     12/10/10/8 across the four puzzle sizes. This cap (added in
     v1.29) was rejecting sparse hard puzzles because they naturally
     pool more answers into the bank, and math constraints push
     those answers toward small values (1, 2, 3 appear most often
     in valid arithmetic). With the old cap of 6 on XL, layouts
     with 8-12 copies of "1" got rejected, the retry loop ran 40
     times, and the only layouts that survived were dense ones with
     2-of-3 cells given per equation. Cap is now 12 for XL — bank
     can have more duplicates of common small values, but hard mode
     produces visibly sparser puzzles again. This was the actual
     reason for the density regression, not the validator.
     ---- previous changelog ----
     v1.46: One change shipped + one rolled back.
     1) Grid backdrop: bright cyan along the four edges of the puzzle
        area, falling off sharply inward so only the outermost row/
        column is fully tinted and the center is dark. Four edge
        gradients, no radial, no center fill.
     2) v1.45's backtracking-solver-based blank-density change has been
        rolled back. The backtracker froze the menu screen when
        loading a puzzle — the search budget per oracle call (50k ops)
        sounded fine in isolation, but the restore loop calls the
        oracle up to 200 times inside an outer 120-attempt retry, and
        each restore-step's most-ambiguous picker is itself O(blanks ×
        equations × candidates). Worst case is over a billion ops
        synchronously, well past what the puzzle generator can do
        without locking the page. Reverted to v1.44's hard-mode logic
        (single-step propagation oracle), which loads fine but
        produces denser puzzles than the user wants. Sparsity needs
        a different approach — see thread.
     ---- previous changelog ----
     v1.44: Two changes.
     1) Hard mode now generates dramatically more blank cells. The
        previous restore/prune logic was using LOCAL solvability
        checks (canSolve / canSolveXL) which only know about a single
        equation in isolation. Even with the v1.43 prune pass added,
        the system couldn't see that an equation with 2-3 blanks
        might be solvable through chained one-step deductions across
        crossing equations. The pre-rebrand puzzles were noticeably
        sparser because of that missing chain logic, not different
        templates.
        Added a fixpoint propagation oracle (isSolvableViaPropagation)
        that repeatedly applies requiredValXL across all equations
        until no new cells can be derived. Hard mode now mass-blanks
        every num cell, then walks a restore loop: each iteration it
        finds cells the propagator can't yet resolve and restores the
        smallest-value one as a given. Stops when the puzzle becomes
        propagation-solvable. This is what the original generator
        was implicitly relying on. Equations whose values are pinned
        by chains of crossings can now have ALL their cells blank.
     2) The .grid::before cyan glow has been re-shaped from
        edge-strong + corner-radial to a centered vignette that
        fades to transparent toward the edges of the puzzle area.
        Previously the grid crosshatch (cyan showing through 1px cell
        gaps) was brightest in the outer ring; now it peaks in the
        middle and softens at the edges of the zoomable area.
     ---- previous changelog ----
     v1.43: Four targeted changes.
     1) Hard XL: added a global-aware prune pass after the existing
        per-equation restore. The restore can only see local
        solvability (canSolveXL on a single equation), so it tends
        to over-restore. The prune walks every kept-given in random
        order and tries re-blanking it; the cell stays blanked if
        every equation that touches it is still solvable under the
        same effective-blanks/effective-vals model the main validator
        uses (which DOES propagate values across equations). Should
        produce noticeably more blanks on grids where many cells
        cross multiple equations.
     2) Floating zoom-pan pill spawns at bottom-right of the viewport
        with a 100px no-go band along the right edge. The pill cannot
        be dragged, glided, or re-shown inside that band — keeps it
        out of Android back-swipe / browser edge-pull territory and
        gives a predictable safe column on the right.
     3) PROMOTE_MAX_PAN_PX dropped from 30 to 15. The radius around
        the user's touchdown point inside which pressure-zoom keeps
        engaging is now half what it was; small pan motions commit
        the gesture to panning sooner and lock out further zoom
        changes.
     4) Pan velocity is now zoom-aware. At HALF zoom the multiplier
        is 1.0 (feel preserved); at FULL zoom it is 2.0 (panning is
        twice as fast). Linearly interpolated for in-between zoom
        values during the smoother's ramp.
     ---- previous changelog ----
     v1.42: Hard difficulty has more blank cells.
     1) XL 7-cell hard: always blank all 4 numbers (D + all 3 operands).
        Previously the 3rd operand was a 50/50 coin flip; now it's
        always blanked. The existing per-equation "restore minimum
        givens" pass still runs, so unsolvable equations get one cell
        unblanked — but equations whose crossings can pin values stay
        fully blank.
     2) Standard 3-cell hard: added a post-restore prune pass. After
        the existing "blank all → keep 1 given per equation" step, we
        try re-blanking each keeper. If the local-solvability check and
        crossing-agreement check both still pass, the keeper stays
        blanked. This shaves additional givens off equations whose
        crossing cells already pin the values, without breaking the
        invariants the rest of the generator relies on.
     ---- previous changelog ----
     v1.41: Filled puzzle cells were letting the .grid::before cyan
     gradient bleed through their translucent inner-cell backgrounds,
     making outer-area equation cells look cyan-tinted (the gradient
     is strongest at the grid edges). Cell wrappers now get an opaque
     dark background so the gradient only shows through the 1px gaps
     between cells — preserving the "cool grid" crosshatch backdrop
     without staining the equations.
     ---- previous changelog ----
     v1.40: Rebrand from MathCross to Equil. App name (PWA manifest,
     apple-mobile-web-app-title), share-card footer (equil.app),
     localStorage key (equil_opts_v2), in-DOM titles on menu screen
     and in-puzzle masthead (now "<span>E</span>QUIL"), and menu
     version tag all updated. NOTE: localStorage key change means
     existing users will see options reset to defaults on first load
     after upgrade. Manifest start_url points to ./Equil.html (the
     deployed name on GitHub Pages); index.html at the repo root
     redirects there.
     ---- previous changelog ----
     Fix for 1.10/1.11: re-restored held-voice no-op stubs (_startHeldVoice,
     _playHeldFromBuffer, _releaseHeldVoice). These were stubbed in 1.01 but
     accidentally classified as "duplicate" in 1.10's cleanup pass and removed.
     They're bare-name called from renderBank (3 sites in touchstart, 3 in
     touchend) — branches never reach them in puzzle mode but JS still
     evaluates the call expression.
     Also did a comprehensive bare-name reference scan to find any other
     missing decls; only these 3 functions and the 9 vars from 1.11 turned up.
     New test (test_full.js) walks 12 puzzle interaction paths under real
     touch events; all pass on 1.12 with 0 real errors. -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0">
<meta name="theme-color" content="#0f0f0f">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="Equil">

<!-- Open Graph (Reddit, Discord, iMessage, Facebook, LinkedIn, Slack) -->
<meta property="og:title" content="Equil — math crossword">
<meta property="og:description" content="A math crossword puzzle. No coins, no hints, no daily login bonuses. Just the puzzle.">
<meta property="og:image" content="https://rekursivestudios.github.io/Equil/assets/og-image.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Equil logo — cyan and amethyst crystal lettering on black">
<meta property="og:url" content="https://equil.pages.dev">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Equil">

<!-- Twitter / X card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Equil — math crossword">
<meta name="twitter:description" content="A math crossword puzzle. No coins, no hints, no daily login bonuses. Just the puzzle.">
<meta name="twitter:image" content="https://rekursivestudios.github.io/Equil/assets/og-image.png">

<!-- Generic description fallback -->
<meta name="description" content="A math crossword puzzle. No coins, no hints, no daily login bonuses. Just the puzzle.">
<link rel="apple-touch-icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALQAAAC0CAIAAACyr5FlAACs00lEQVR42uy9ZZwk1dU/Xl7t3j09beOuOzM76zbrvjjBJYFAkAgheRKChECAJGgS3Amwi6y7+7hrj/VMu7uU/18U7G/DwrLwPP93ez/zoqe6uurWrXPPPed7vudckOM44HK73L6tQZeH4HK7LByX22XhuNwuC8fldlk4LrfLwnG5XRaOy+2ycFxul4XjcrssHJfbZeG43C63y8JxuV0WjsvtsnBcbpeF43K7LByX22XhuNwuC8fldlk4LrfLwnG5XRaOy+1yuywcl9v3NuTCQwzDZDIZEAS/9QcgCPLZDOc+fNc551+B//e88zkAAPkz+W+/Pgjwx7/rjudf8Huf7fw7nuvSNzr/3x34zoc6d+sLv/3Wn4AgyHEsAPCDAH79vOC5Z7zE/p+740U68K3Dfv4Tfccr+K9f4TgOw/D3CwfLsiRJXkQ4Ljx4/i2/9wQAAEAQOP/AN97iJcr1hW/0e1/5ueMXDtmFkvctPQEBgAO+IWTfmADf6CMAAOc/3LkLfWPEvv4XBAAWAMBvdOnbrvw9w37hT751bvCfWZZFUfSShIP/wbf25ru6yJ9/kfl94Q/PP3Du2wvnx3c9M8dxEASdOw2CoIurrm/c4huXPf/bcz/8TjEFAeC8i58vcBf8hP+XA0EOAIBzw3N+177RSY4Dv7WTF3bmwtf/jae++Bu8+MUvJhzfJaoXkdxv6IZLvMK33vd8GT9f0r8x7y9+90vp83d9y3Ecy7Ln7gtBEARBvDhDMASBIARCHMDRNE3T9Dmx+N7n5b//1q7yNzr31bf28Ru65FKe4gdp4ksVju8Sum9Vwt/1DBc+wKWox/Mf7LsOXsq7v+igsOc0PH86y7L8DyEIgmEYx3Ecx8+/QiaToWmaZthMJk0QBJHJQBCoVCqVSiV/QjqdJgiCYRjwvHZel843p7ivP4Bfrzv/ZY1x3FeahjdT+G++dVguIhM/aEr8MOH4rtX3fHX3I+73v5Hi/9sbcRzLshwEQTCMoCiK44Jz0zoajdqmbCPDI9YRq9Pl8PkCNpstHApSNM2yAEFkSJKkaUooFIlEQoPBVFtbM2fO7IaGhtzcPBRFAAAgKYLIZGiaAgAQBOGv3/Q5ixv6b4sE/O+58f8Gm19i/pftf5ML/S3mK0VRyWTyG9bQRV2Pi9nY32X8X2KnLzzzInbWt+qnbyxGLMsyDCMSiYRCIUlS8XjM4/NOTdmGBgZ7e/usVqvf74cRWCFXyGQyj8ftdDpnNc6uqChXabRajVatUgnFIrVaHQlHQ6GA1TrS3t5hs02m02mDwVBTVV1VXVVdU1NYWKhWqwEAIAiCogiO4762Nr6a3DTNAAAAQTAIAiAAcQD7tUbhLo4yfOuAfK8Lc/FZxLKsWCxGUfQHCMelL1o/zsL4P2nfsEUu3meapjEMk0qlNpvtySefbG/vCAYDNEPLZFKT0VRVVV1dXV1cXCwSi9PptFAgiMUiIAirVeqioqJkOp1KJlmWpRlmcHAYBIHs7CwyQ7AcRxCE3WEfGx1rb2/v6elmGUaXlVVTW7Ng3vwFCxfqtFoQgmAYhqCvVmQYRkQiEQAAFE2lUimGZjiOhaBvGC7geWvft7geF7G+f9CI8R9+sHB810S8dGPifynXP0LTfJcaYxgGRVGpVBoKhV588cWXX345Pz+/cVZj05KmmpqarKwshUIBAIDP5+vv76doOifHIpVIe3t7Fi9u6uvtlcllRqMRRdFMJjMwMMBxQHFpMUVRZIaCIAiCoWQq4bA7BwcHms+eHRsdHRwYTKZTAAAIBIKc3FwcwyiKomiaZVhef5hM5mXLlzY1NZVXlCvlSgAASDJDEARFUQAHQDAEQfBFnvgieMaPm1c/Ujh+0Eu6RHP6Qu/jUs6/cJn4VqjnGyPFMAwMwzKZLJPJvPvuu88++6xKpbz55psffPCXPn9gbNRaVVUBgvD4+Pjk5KRAgFdUVGZnZwMAsG/fvrraGSqtJhgMOuz2hoaG0dGxkZHh3NxciyUnnkiEQ6F4IuZ0ODs6O9ra2oeHBgW4oL6hIScnj2M5nV4nlYknJiaydEaZTJKly1IqVRiOUWTK5wsMDg4eOnxkYmxMJBZXVlY0NTXNmtVYUlKsVKoBAEinkhkiA0HI9478pU/Lbz3zxy8rFwKLP2iy/lCD8eLQ5CWaO+dWd34R4bVFJpP59NNPn332WYIgnnjiibq6uuzsbIFAgOGCYMD/xRefCYWi/PyC4uIitVpFEASGCVpaWlUqZX5+fjpDqFXKQ4ePRsLhQMBXVlYmk8n27ts3NDQ0PjYWCAQAANDpdPPmLVixfFlxSXE0Go1GY3q9Pr8gP5GMDw4MgACSpdfap6d5RaJUK7N02RKxGAAAp9PZ3Nx89OjRlpaW6elpFEXLy8vWrl131VVXmkzmaDTKsuw3IJzvcoMv8I9+wMv6wcJxPsT0/5OF8X1wOHcOkDvvNOA8k+1bEUbunN8hlyvS6fQHH3zw8ssvp9PpBx544J57fj46OkpRdHV1td/v7+7tiYbDpaUlOTk5IpGY90REIvGUbdrpdM6bPw+CoGQieeDA/hGrFYagn9xwQyQUvv/BB2w2W3l5eW1N7dy5c3PzcmfMmAEAQH9/v8vjVqvVRUVFQpGQIql0KhUJhxOJhFCIFxcXx+PxaDTq9wfC4QgMIwqFPC8vXyaTAQCQyqTtDnvLmeatW7du27bNZDL96le/+sUvfoEgSCQSgSAQguDzUdqLv4hvzJ9LiQmIRKL/7bJyiQbppVsSF/HLQZD7tqjE/wOhv/UuLMuwLINhGIKgb7/9zltvvY0g8M0333zLLbcqlYrjx4/BMJSbk9vR0ZHOpIuKi4uLijAMJ4gMD1EgCJJIJFua21atWpVIJsbHxnft2kaSZEVlpVqlOnz46AsvvNDQ0PDQQw9t2LgRgSEQAD1+7549e4KBUHFJSV5+nkwmJQiSYzkQAkEAsE1OZGfrrSOj2QYDjuM8vEYQmXA4PDU1TdO0xZIrEOAkRYZCoUQiWVhQ8OFHHwIgePTwUaPR8OKLzy9Z0kQQRDwRhxH0PDcX+BFLzIXBpnPw+f+NQXpx4/mHapRLWIO4C1XF+W7eOTQTgiAMw3AMhxGYA4ArN10xPDy8bv36n/3sp8XFxQAAdHV2DQ0NqTWqWDRaVlaam5fHG5jnq24Yhs+caa6pqQ34/D6fZ8RqLSzMX7Z85fDw8P33/WJqamrV6lW/+uUvKZru6uq66uore3p6XU43hmEmk0EikWcyaZZl+VHlOE4oxPv6+1RKZUFBcSqV4rvKcRyKwiKRWCqVEkTG4/F6PN50Oq1SqfLy8hiGOXTwgFgijSdSX375+cEDB1auXPXYY4/X18+IJ+IESaII8v+UKvcDNPpFAnIAAPwAzZFKpS685UWUFfcdsYaLWwkXiZucd85XUYnzsWeO+2r0eTRTIBDwhqfL5RoZGbFN2Xbu2Ll//36rdVSr1Zw9ewbH0ZERa0d7+/LlKyqragoK8kEQJAiCYRmWofkXRtO0TCYb6B+MRWLhSFgmlwIAh2HC2XNmPfnkn5966q8zZsx4+umnOA6YO2+uQCDo7Gg/dOjwihUrSkpKBQKcJDMMc26gIN4lEQgEk5O2QCCQl5cHwzCKogKBAMMwksz4fAG73R6JhIRCkdls1uv1CIKiKHr69GmXw9G0bPkXW7fV1dcN9ve++cZbg4NDP/3pHQ899JBerw+HwwAIQjB0vmR8L6p0ERP+IssK8oMsgwvl40KB/V4L+UfYLuckg2VYEIJQFBEKhRAEEyQ5Njba2tJ67NixgYGBYDDodrsJggAA4PPPPzcaswmCWLJk8fPPP//vf7/+4ot/FwoEVuuI1TosEAhkMplELBZLxCKRCIZhtVozMTG2e/fOoqLixsZZPp83FAoKBOL58+Y1t7QuWrTgyNFjn3/2+bx581AEtVqtyWSyrq7e4XBVlFfGYnEAYEEQ+jo+AvHBepblJBKJ3+8TS8ShUJiKxSAI9Hq8Ho9HKBAYjMaSklKxWMQwDE3TFJXmOC6RSAgEQqVS0VBf5/P6FsxbUDejfteu3R+8/96XX375+BOP33LzLQRBJJNJBEF+0Lr/Iwb/OzXHD4UWfijU8Y3g57fK3H8rD45lOZlcDoKgx+Nua2vfu3fvkSNH3G5PdrZ+/rz5paWlXp/3nbffQVDkd7/73UO/eYiiiLGxsddff33hwsWHDh++6cYb5s6ZEwgGCZKIx+OJeCKVTMbjcZIkxRJxOBw+ffrUNddcW1FZMTw03Nbacvz4ia3bduTm5C5f0XTLLTdzAIzASG1tbXtHBwBw5aVlao2mrb3d43E3LVlCkiQIQhAEwjDMx74ZhiNJIhIJnzlzxmyxQBB08OBBl8t9xRVXzJ8/XyaVplJpgiA4joPhr/QNRZFnzjTrdLrSkhJcgJ88cdJssVAMKcCFTqfz0MGDn376aUlJyYsvvlhUVBSLRRmGgWHkEoGDi1JPuB+2rPwg7OF/g2x+38VBEORYlgFBSC5XfP7F588880wkHMEwrKSkZOnSpU1NTTkWy9DwkHV09K9//avT6fzNQw/9+sFfIih88uTJAwcO3HDDT7TarHfffc9isaxevUYgwDkAQGAYBCEOYEEWgGG4s6vjgw8/2LRxk1qjfvLJJ0EAOHHyVCAQ/MfzzxcWFBUW5Y2PjcXjyfnz5zudTpPZZDSZaJKiGVYkFPT09kYi4UULF/l8Poqi4/FYLBaNRqOZDMEwDIIg4VCovqEunU653d7c3DyCJN1ut8Vsyc3Lw1AknU7z7qRQKBobHXU43RqNuri4CMMF4VC4paWlaekSh8ORTmcYmnG73R9//PGZM2fuvPPO3/3udziOh8PhC3kYF7E2vou/8gMM0guF4xvSdxEv9CLg/3eZnxcn+9A0JZGIMEz4pz/96amnnvrjH/949dVXl5aW4jgej8cHBgYcdjvL0lu2fHb8xMlf/+bXN910swDH9+zZHY/Hrr76ar1e39PTZx2xiiVinU5bXVWZTGVAEGQYRiAQMDRz5vRpgVAQT8QWL1p03XXXj4xaM6mUUq3Zvn1HMBjhOLayqvznd929fPmK2tpauVyWyWR465Lh2Ewmo5QrvvxyayIRX7NmbSKRFItFcrlMJpOJxWKBQCAWiZLJxNT0FJHJVFRWTU1NFxcXhULhiYlxvz+g1+vLyspQFEmlkhKJ+NDBw2ZLTjIZF4qEYpE0Jyd3YmJ8amqyqWmp0+mOx2OBQIBhGLvd/uqrr6ZS6eeff3758mXJZJIkSV5EvnVsLyWU/a3CAT/++OMXeIMsRVEXJ8VcimPyjcj1RVye7zgH5E1FpVJls9luuOGGzz7/4vPPPv/5z3+uVqunbFPNZ5udTqdMItVoNYcPH/n000+fee65+voGuUy2e/duFEWvvvpqgQDnOM5ud+ACXCwWR2NRqVSK4wKWZaUSqd/nPXb8eElJiVgsohlq957dW7Z8ZjIaU6nU//z+f7xuz9EjByPh0Buvvx4MBhsa6jNEOhaLpdNpvvMQCCnkChxD7PZpkVBsMpuWL19mMBh0Oq1EIkZRlGVZAOAmJsYnxscXLFzIsFwkGhFgqEAoMJmMOl2W1+sdHBykaUqr1UAQ1NfbW1dXLxCIZFJZJpPx+bxarcZmm4RhJCcnRyyWyGSyVCqTSMQXLVokFOJPP/304OBQU1MTD/R9F1x2KW/qW5lg3++tXMRX/hHR829wMv7723NHQI7jGIYWiUQCgfC999594MEHNWrt3r17cyym/oH+YCCAIGhxcQkuENinp9vb2+/9xS/+88knEAjn5eb29fXo9frFixczDE1RpEQiOXr0uMFo9LhdRqPB6/XPmzeH46C+vr7p6al58+Yqlcq9e/exHP3MM09zLDgyMvrmm2909/Zk0mmdWq3Pzmpv75DLVU88+WciQ8AwzIsFy7G86mppacYwzGI2e7w+fyCwauWKeDwBQTDHcQgCx2OxU6dPrly5EoYREIKcDqdCLsVxnGEYDMPEEkkymRocHAwGgyiKsSxTVVU7PT0lk0klEgnDMKlk0uPxnDx16rbbbgdBCIZhDMfT6fSY1Wp3TAeD/v37D0xMTL773nuzZs+KRWMoglwiy/XHa45zHNJv5aJdCi3oe8//DioeLxksx3EqlWpycvKmG2/85JNPr73mutWr17jdLpqixWJJWXl5cUkJy3L9/f1uj+fW22577/33QQgCQSgQ8BcUFCxYsIAgMrylAkFQf/9AcWGRddQ6Y8YMq3VUr9f39fVHo/ElS5YIhUKnwzE4ONTS0hyPx5ub215++ZWioqK//OXJK6+4avWa1RRNGQwGo8EQDIbNZnMymaRpmqRIAGR9Pt/JEyfq6utjsSgAcvX1DQ6HY2hoqLKykiBIHjU5fOTwrMZGsURCURSGYclEEoJAhUKBIAhFMz6f3+VyQRCUTmdeffXfVqvVaDQQRCYYDPr9/mAwlEynpFKZ3+fbvWtXbm6O1+vx+32RSEQkkgAANzQ0mJefKxIKn/3b335yww0yqYym6e8KoFy8YRj2AzikF374Vjrrdy1yl9KhCy4OAgDwtcIQvPrqq0888cScOXOefOLPAAiWV1Q4HHaZXF5VVRWJRBOJVH9/fzgcvummm+6///4sne7s2bPz5i3AMFSn0wWDQalUAgAQz6QnSVKlVoEQRBBkQ0P9Bx98uGzZssbGxlg8LhGJ+vv7picnvB5PZ3vXdddee8utt3z04QdbNn9WW1t74sQxsUgsEUm0Wq3L7Z2enjaZTCRJCARYKBQ8fvzEvHnzFUplsj9pMGTH49ElixcdOHBwx44da9asAQDg6NGjpaVlObn5BJFGUYzjAAzHA0G/z+/3+fzpDIHjuEKhyMrSyRXKa669ZnRkBEURmUxeWloGQTBJUSAIQiAgFgm1Wi2KonPmzEkkkiAIkSRZVVW+YMHChx76VU1tTSKZuurKK0+fOkURJPAdFNrvC0j9cCbYRWCT/yUr7BtX4G/EMIxKpRodtd5///2Dg8OPPvpodna23++fNWt2SUlpSXHxtm1btVptli7rk08/mZyYeObZZ2vrZtx2++3vvvP2ooWLCgoLsw16j8ftDwSC4aBSLleqlBRJYRjGsmw0Eo3HEzk55gULFiQSMZalUASORsOdbW3pZPLUyVOW3Jxf/+ZXrS1ntVrNjBkzdu7cUVxUGAqHNGpNMpGorCzv6uqxWCwcx3Z399AkM3/+QrPFzLA0giAqlUooFBBEZtWqVXwgTa1U0RSlUCiam5vTqVQikURQ1DY5eeL08Y0bNtbW1pnMJgiCQBAU4oLjp06WlJSZso3RSFSj0R45criiskqj1TIU7fb54slk07Klhw8dMhiMUpmcJEkMRePxREdH++LFTWqNas6c+df/5Po777zzg/c/CIVCCIL8CBL/he17lpXv8jh+UOLChebnhZqJYRgERuQK+UcffXT99dfr9fp//OMfeXm54XBk1arVeXm5JElIJRKBUNDX29vV3TUyYj146EAkEn3uub/958MPV61cvXLVarVGRdG0XKZQqZUIgoRCIb/XOz427nS4CosKEomERCJRqVRGo9Htdk1N2YqKSk6dOD42Nnr0xEmHy/30M3+1WHK0Wh0EgdPTNoFAWFBY1NHROX/+PNvUlNFk9vt8ff19Pr8fQwVut5vjWJ/X67A7BgYGGIZzOJwut2d0bEyn0+7bt+fV116dN3duJpPmOEAkEhUWFep0OrlCptVoamtnuFyuRDypUMkRFLPZpnweb0VFWTqdxgXCSCxSX1/f3tYGcKDJZOjr6y0sKGAZNitL39vTk5efzwecOzs7Z85snJqaQlFEoVTMnzv36af/CgDAihUrEokEDEPnx6G+d2X4AcvKj4bYvuvgRQNsIE3Tcrk8EU/cddddn3/+2d13//zGG2+kKGp4eHjmzMZ4PD4xMUaSFE1RWq324MH9DMuaTJbm5pY//vGPb7z+etOSxcXFRZ2d7RRFAyBIkRTD0DAMIwgkk8l27dxpMecGA0GAA5wOp16flUgkCgsKBwcHduzY1nL2TG9ff1t757y5c8tKSktLSn0+7/j4eGlpaXV1bXd3l16vjUajY2NjkWg8kyZOnDyRk5NbWVGh0ai0WjUAQIl4QiyWmMwWjgMQBBJLxNFwWC6X6/V6k9kEw7DRaJbLFYlE3Gq15ubkul0uiVgyc+bM3t6+06fOlJeWTk/ZiouLOI4Nh0NV1bWHDx+I5+bW1NS0tLT19/fqdDqtVutwOAwGYyaTGhzonzWr8fCRo8XFRTiOIwhMUwxN03p99pYtn61Zs7qsrHzTpo2hUABFsYu8u0uhQCCXqPx/aIztexeac1emaVqpVDQ3t/7sZz9FEOTvf38uL69gaGho+/bta9asGRwclEjEMplMpZIq5Yp0JqVSqxrqG5555m8KhTyTTq1evXL9ug3hSEij0aIoiqIIDCMYhkEQpFTIzzafvfqaaxAY1Wl1p06e8gcCQpGQINJKhQpBsbffflOAYaNj4xiGFRTkEwRx8NDBs6dPZxsMKIr19HTv3LkjPy8/kyYoipKIxYWF+RDCBgPBYMh37TXXJpJJgUDgdnuMRlNuXm48lhCLBFNTU2NjY7NmzdLqshKJVE6OZXhoUCiSBIOB6upqEITEYmkqldJnZ1dVVVhHrO+8/VYkGr3yyqvFItHExCQHQFqt7tVXX126dLlGo962dSvDMqlUSqFQDg2N5OSYe3u7m5vPzpkzx2DQJ5MpFEW1Wh3HgMlksrCw4PXX37zyyisHBgYKC/MSidTF8bHvZfMjl2IzXhykunQK8YXXYRhGoVBs27btyiuvKioqvv3220AQxFD06JGjKpVq48aNMIycuyGZIXp7ewzZBpvN1tffl1+QX1ZWWlCQn52drcvK4nvCN4ZhxGJJV3dXIOBft279vj37G+rrVRqNWCqdP39+KpNsOdsGQVDtjBmTY+MTk5OVlZVSqUyj0VIUSdPs3HnzQQiORGM4Jiwrq8zNtQQCfhiFR0asWq1OqVQODw5PTU2p1GqSJMPhEIYhZIbAMcRmsw0NDc2dO6evr3fGjBnjExNG2jizsbGlpVkkFlIUAYIgyzA+n8/n9SVTicLCgkWLFg8ODofD0dzc/KXLsoRCUSadcZZ7a2pnRCLhe+65x2F3BoNBqVhmNBocDjtDkx3tbQ119e2t7VKZVCwWAQCQpdcHAr6Bgb4bb/rJ6dOnrrzyio6OdgSBWfbbg6aX6MhAl76mnLMVLiV74iKu7NdHOI5jBQKB3+//6U9/VlNT88orL61fv+66627QaHVZet3Nt9x09PgxAASSyWQymQIAoKu7MytLLxHLxsYn4vG4Sq0pq6hgWNbr81IUTRAESZI0TVMUheO40+mYnppaunQpwzBSmdg2ZUNhWK1W2R32I4ePanVanU4DApzd4WBZrrCg0GLJ7+zslEhES5oWFRQU6LP1iUTirrvv9vg8cpXSaMlRKtUGg9FkNImE0htvvKW5pZVhGBTFSJISicQCAe5yeYaGhpuampLJJAQhOI5XVFRM2CaCwUBeXl5paZnd4Tx86Ognmz/Z+uXnAMDV1tQKBXg6k161Zk1BYVEoHG7vaN+zZ1c6k161euWBg/t9Pl9JaUlpeZlKo87K1k9PT6k12tlz5jU1LUYw2JxjOHhw/8DAgFqtgiEoS58lFIrbWlrffOsNEIRvueVWqVR2KdHai4gI9IOsjYusXt84+K0q69zM5v9jWVYkEt17771ms/m9996rq6vLyytIp9MtLS15eXkV5eUAAIyMDItEIpFIaB0ZEokEWq3W4XT29w8AAKDVagvyCyAIDodCKPYV+MOyLAzDqVSqo6Nj0eLFDMPSNK3Vavv7B8rLy/1+35nTpyvKK/Lz8s6cOcNyYHdPPwAAWp0GRsDenm6G5lKJDIbhZ0+fNRmNcoVMIpENDgxr1LpQMIwg8MTEhEajxoWCqqrqffv2YRgeDkfUSpVt0tbb0zlnziwYhn0+v1wmE+ACgUAUDkVeeunlycmp06dOwxBktpjXrduwcdMmEAJCocDY6AhDk5FoqLOjZcw61Hz2VF9fbyQaOnH8eF9395RtsrWtLZVOplJx6+iQ3pDtmnZMTkwWFhdP2WwjIyMVVZUESZ45c1YkEmnUuty8XH8g4LA7duzYceDAgX/+859yuZxhmIsw+i7+6qFLRyMuBfL6BnD+jd+e3xiGUSpVH3/8yZdffvnyyy8XFhZ2dnUDINjd3V1cVKRUykAQnDVrVn//AEmR8Vh0yjY5o67B6XIlkgmn04EgSEF+gUqlRBDY43EjMMRxDACwEATAMHTq1MmG+nqBQMBnqahUqubms4GAr6+nu6KiDEORHTu2AQDncroikQiCIAq5AoKhgsJCFMVkCpnLaQcApry8NBaLVlZX2GwTLEvH41GHwy6XK/XZhkgkVlJaJhZLTpw4jmGoP+CbmBhfuWqlTCbDMTyVSmEYPmWbOnvmrMfjtY6OkiS5bNnywsLiQDCYV5BvMBgKCwthGJmadigVqtER6/DQSCgcuePOnz388MPxaDSRTCxevFguk+j1OpalaZresnnzmdOnaJax2WybP/2U45hYNJaTk7tixapYLPbFl58hCJyTk6vWqI8eOVJUVPDII3/697//zZOrgYumyF5kZfnO2MqFqcmXopHOz6gGviNBmZdZDMMSicTq1as3bNjwm9/8hiAIFMOGhgYFuCArSxcOB/Py8hAEhWHY6/E47NNlJWUKpaq1re348WNnzzYXFxffftvtRcXFHM04nM68vDyapnlG0+FDB3Nzc3Jzc9LpFATDEATSNLNr1+4lSxcnU8lYLAoCYDqdDIfD3V09o6NjRUXFi5csMZnNSpWKJAiFQjo1ZautrYFhmKYZAY6TBDE0NBQOhSVSycyZjQzNCUUigONKS0sHBwZa29oIIlNaVuZye8atYyPDQ2+//bYAx+VymUgkMBiy582dm06nhSLR0PAIgqLlZSUsyyUSiVA4bJ92RCJRs8Uye85sAAS6OttHBvtZjjOZzCMj1sHBQYqisnRZZpOlsbExlYxLZBKNWjU9PWWymGVSqUgkyRDk7FkzP/roQ4ZlpVJZbU3NyeMnEEyg02pffPGFa66+Rq/XfyNSdv68PWcn/DBX9nurKnwj1xn4jsIHF8LwPKtPLJY88MCDsVjslltucTqdIAhm6XSffPzxT3/604mJcaPRjKJYJh6vran+4x//tGzZMlNOTjwet9sdLpeboigYgREEpghKm5UFcFwqmUQQRCwWt7e3a7S60rKyeDwBwwjLsjiODfZ3Lm5aDMGQWqN2OTyLFjUJhYLBwUGvzwsAQElJCU0zU1OTOq0+Hovk5eUaDAaVSk0QhFAoAEGorq6utbV1aHBg46bHM0QmEonGotFwOERkMplM5rPPPrv99jvs03apRGLOMU9MTAhFopKy0tzc3Nde/VdOjgWCUQwVDLKDmAAbHx8lM8lEInX8+PGK8pKZjbO6e/uPHD3idjrb2tuDgYBaqbDkWnp6+2UyhRAX7N27+4Ybblq4cDFJEaWlZW1tLQaD8Yorr5bJ5AMDff5AcGbjLBAEFy1cKBaKe7p6piZt6zdu3L171/JVK3W6rMNHDldWVSYSie+lsP8Yb+XiaQTfBX5cJHBM04xIJBQIBC+99OI777zzxBN/lkgk0WhUIBCcPXt2zpzZLMsGfAG5XOZ0OnFcMDY2HgqFcBxnOTaeiHu9XofDDgBAWVmZwWCwjlpzc3M1Wq3X6y0vL+/s7CQIcs7ceXzoi2VZHMftdgdJkUajCUXwLK0hHIjjOO71eoPBkG1yCgAAgz6bY9i+vt7c3Nj05IQhW19dVZ1IJjMZIub1B0MBCAA5hnI67LbJSbfHAwIQgiIqhaIwP39q2nbNNVcbjUazySyRiCmKymSodes2JpJpl8u1bv1G+7Q9kUwoNaod27fjGIbiCEOn5VKlTCY9cer05s8+j4RjJcUlNbXVBYVFIAjqs/VlpSWZDNHZ2XX29OlUOv6Pf/zt1X+/mpeX3zh75vJlS4PB4NS0fe269Y2NM5959pmCggJ9lq60pIQDYKVSGYlExsZGVUqVbWLi2muv2bVz589/fvdFEgku3i5Wn+N8esglwmLn64zzf84bGRzHqlSq8bGxh3/38Jdfbi0sLLruumuj0XBRUaHH44UheOGCRcMjwyAEqtVaCIKCwWB7e8eMGTN8Ph9JUolkYtJmczgcYpGotLQUxxG9Pnt6egoC4XQ6Y5+2BwOhxUsWZwgCw/gAI4QgyNDQ0MyGmWPjo4lkQqlUmcyWsbExu90+ODgUCoUBAMAwnGHYgYGhY8eOV5SXwAh6/OSpWCyGwLBIJMJxXJOls1gsJqMhk06tW7eOZSiGYSAIdjodEAyv37hxYsImV8hbWlqmp6cKCouUKgWvw5YuW+52u2PRCE3Ts2fPdjqmCwryHQ7X3pP7du7aVVFdfddddxUXFg4MDMZi0d7e3nA4kkwlw6EgiqIVFZWNs2fl5lruuecXn3zy6elTZ3x+T093Z23tjNa2dqFQPHv2zDmz5+zcsRNBkOFh64y6+uHhQZ1Wo1YpXI7p999975rrrjt99kxfX39NTc2F6QSXglchP05nfG8dnG/8S1GUWCTEBcIP3n//gQfuj8biEAw/+OD9yWSMj8F2dHTUz2yAEZSi6AxBZGVlBYKBUChcU12TITIOhyMciQSCQafTwTCMWqOpramlaRrH8by8PKvVeuzI0eKS0qrKSofDybA0zx5DUdTldtM0ieEYw9CRcFgolOQX5HV2tHl8XtvUFPcV4xxKpZJerxuEQAhGjh499tuHH5ZKJRAIYxgOQEAqmRBKJKvWrp2cmnB5nLU1NWazhSSp3p6+OfPmBEJBhqE///KLFcuW5+bmJJKJQCCYyaSqqmu6urskIkk6lURAqNs6cuDgAZqkRALx2vXr//HCi9F4YtfOPUcOH4xGI4VFhRKxeGhwkCApfsTa2zsAAKitqQYh+IpNm6688iqCyDz99FN79x0qKSlub29fuGCeSChesXJlKBQyGI2RaIQH3CRicUlx8aebt4xaR0pLSvbs2dvQ0MBz0oAfWEMLurgTe77zee7Dd8nBhV4rb2GwLKtSqdwe75VXXPHgg7986KGHLRbzDTfcsH79evu0Xa1Sd3R0KBQKjVrNsoxQKLBYzKFQsLO9s6ysgqKorKwslUoV8AembFOTkxMAABQWFpWUFCMISpKkUCh0u1279uxEcRRCIYIkEATDcVwoFApFYqfT1dg4G4Zhs9kSDkeFQoHZZErEE6dOnnK6XAjCm2BcJpNKpZIWk9Fhd0Qiwb17d8djcRiG4vEoTVFjo6Mmo0koFFrMFiJFHD10NB5POBwOsURKEOS0zZZjMVdXVUfCkVQyacg2gAAYCoa0Ok0injp58tjQwNC/Xnt9//4DWTq9Ptvw/IvPz6irefrppx/+za+2fvlZIh7DMGxsdMzj8axYvry6qur8Uc0QGb/f/+hjj/3ivvsmbVN/eeqvTU1NIyPWnp7up/7yl1giVlhYYMg29Pf1iIR4NBo1mcwKpYqgmSuuulKjVpUUF+/Zs5emad7mOJfGcYkN+qEGx4UmxXfYHyAIghRNCQQChULxyiuvlJWXhcPhwYEBu2OaZZk7br8Nw4TxeCoajXq9nlmzZnMcl06nNm/e7HI6+3r7lAplMpUMBANarba4uHhycrKjvdPjdgMA0NhYr9FocByHIOjYsaOtra2PPvoYCIAUSZWUFKvVaoVClW0webw+rVan0+lYgNPp9AzDxOLRUNjPsExHR1ci/pWmRVE0EAjCEFJUVDI4OISiKIzAu/fs7h/o50AgnU4Hg0Gj0RAOR3t6B+bMX2DOze3p6d61aweKwUqlqr5+plwqNxr0/f29TqdjaHCgtbnF5XB+9umnMMSiCNLR1cVyDIqi4+Njy5c1gRB00003T9kmIRgCAIBhWZIkEQTJZIjRsfF58+b/+c9PrF69sqSkRKvTDA9bS0uLNRqNz+d75JFHXnrppQceeGDLli119XWt7e1D/YMet8fnD3R3d49ah0tLS/LyC6LRaDqdbqhvGB0dNRkN09O2EydOSCSS88Ti3FRnv077+IFlny4Ov3+X4XleXUCOoVm1Sj0xOfnzu+/u6Oj4x9/+du8v7vvi8y1vvPHmb3/7m+LiYpFYGE8mrFbrsuUrXC7n6Oio1+t1OZ01NTXz5s1PZzI+nz8UCo0Mj8gVcpIkjp04RtO0SqUqKCgQigQkSezcuROCoBkzZphMJoPBtG//PpZjTEZTIplkk9zI8FDTkiUMy+AoxjJsf19POGw0ZBuyDdkSiTQQCPJjIpFKJybHCwryPR4PTTPHjp2sq2+UyeVTU9MgCBEEAYCcy+0hSUat1cRTSZFUfPb0aX1Wllqj7e7uzaRSsUQ0Lz9XJpOl0wkEBssrSlgWDIcCiVhkbHS8sKjQ4/WeOXP2lltuueba6xYtWkxRFAAACIKWVpXmWnLy8/M4ALDb7f19/f/5+D+zZ82aP29eMBCqqqwgCXJweHD+/Hnbtm3X6XRtrW2bNm269557Hn/8cafDsXv3bovFfN311z/88MPBYPD06dNmswngWLPF0tHZPT3lmD9/ocVieeONN5qams7lbn2dUsrxquQipQ2/h0N6iZjrfxutHAAADMMqlcrXXnvtJ9f/pKKifOeO7Uualk6Mj/7xD3/U63VNS5YiKI4J8K1bv9Cq1SRFOZ3OGTNmxOLxOXPnaLN0Vqu1vKwsGAxKRGJzjjmVSra0tGzfto0giJrq6o3r1+fl5+3YuSMYCF6xadP4xERpaSmCIHn5+SdPnsJx3GQyd3R2qpUqk8k0Pj4xMDAQj8fs9ulIJDxr1uyhwcEvvtzKchwEgjTNLFvWFI6Epu32YChCEAQMQ2Xl5aXFJU6HPZlMHD12dNbs2Wq1NhgMRyKRVColEgqNBoNarYlGY2KJhGFpCAJT6ZRQKERQxO5wppLJTCohlUlHrGNiiWh8dHxwsH/J0qann/7rxg0bEslkVVVVdXX1TTffzLFsd2fXiHXU6/HiGFpWVk5SZEtzc1d3z9y5c1tbW0mKyjYYCwtzM5nM5KStqqbK6/W1trYODg498efHh0eGKYKsqa6OJ+JancZktnz5+RdDIyN5eXlyhUKXlVVQWKhQyF955ZUbb7yRR0u/jXoHAcC34xzfLhw8oPS9pem+S3ooilGr1S+88PyDDz747rvvPP74EziO+ryeffv27dy187bbb0+nU1ddfXV/f9+unTvqGxqys7Pr6xsGBgZoilIolSWlpdbREalU6nQ6BUJBfn6Bx+MdGBg4duwoTTMrVixrWrZ0dGzspRdfvOKKK5VqVcAfKC8vT6czEAgV5Be0tLRgGOL1eKUSqW1qimVZg8FYVFyk1qghCOE4YOfOne0dHRiGsixH0/TSpUtjsVgqldbpskgiDYKQyWQsLy9HUUSlVlksOSMjowP9A1qNWiKVGAzZwUBQp8vKzjb29vaJxEIIAu12e8AfAEBOIBRiGL5/3/7+gaEtn3/R19c3NWVzOl1XX3P1o48/cc8990AQaLFYUBRJJJIH9u8Ph0O4QMCPrUCAC4WS+fPm33rrrQRBuNzuX/ziFzt376IISpelKyws9ng8EokknU7TND08MlxZUT6zYeZfnno6EokCIOjzeSmSqqysQlEsk6EAkBMKBMPDw01NSw4ePJROp1etWsXnx1/Iy/xhwsGTfb4V/P4uKui5b2maViqVhw8dvPnmW26+6Se//93v4vEYSRADff1ffLlNoVBUV1ezNG3JsZw6dbKmpuamm25Sq9UOh3N6enrZsmUej0ehkOv1+o6OTo5llUrlqTOnRUIRw7BffPEFx3FXXXUVCEIvvvjy8aPHV61ejQkwmUyq0WoQBEFRLJFIMAz9wAP3+7weiyVHl5WVk5OjUmlQDA2GQnK5IpFIdHS0d3R0CgVCAABIkmxoaNBqNTt37FSplBRFxeNxHMfnzJmdlZXV3NJcO6OG45hEPMKxFEGQo2OjsXhcrdGMT04UFuR5PW6WoZOplFQqgRFkenr6zOlTk5OTY+MTDocjO1sfiUR+/etf//yee+++++enT51KJpNjY2MsywwNDaMoWl1dW11TtbSpKT8vr6i4wON2DQ70d3S0r12ztrunu7u7+56f/3zf/gN5efkMC5IEoVIqUqlUIBBEUdQ6MvrLX/4ylUrv3rM3Fo2qleq1a9cKRSKZTEqRDEkSKIoNDQ1l6bOKi4pfeumlO+644/wkOZ7IfS5z8wcIx0WWle9lfOE4HotFly1bunzZsltvvUUikShVqra2tgxBvPDiy7fffnt7e2t2tkGlUgEAkJebLxKLWJZtaWltamrCcTyeTMjlcplMNjY6unfvXqPZxPuou3btOnz4sEqlXLlqzbvvvn/s2FEAACoqy/VZurq6GTCEOJ3ulpYWh8MJAGAqmeBYrri0WCQSuTzuiYmJYCAwaRsXCkU221Rfb8/AwCDHcQiCkCSZm5trMBhbW1snJ23Z2dk4hp05c1aukOfk5XjcLooiErGYyWQKBEMuj4ekSJlUynKARCoFAUgslnZ0dh47dnRgYPDjjz/98MOPgsHQ5MSkWq0qLCzUaVTr16698aab16xd39bWCgBcKpWaPXt2aWnZVVddddddd8eTsbGx8UgoNDw8ks5kzOacRQsXISjS3tZeXV01MTGh1enq6+o//fSTlStX7d27t6K8RCqVjo6OiYQiAAROnTr91FNPv//++2KxpLOrK5VMFxUWu5xOmqGampYMDAym02mGZXBc8Pnnn1dUVMyYMeOc8vjv+lLcDyMYf2tS03cXg+NA8Ct9JZFIrrjiiuKiooceeogvnzI2Np6ly372uWfKyyrEYhGVJmc2NiIIWlhYLMQxr8fT3d3TOHs2y3HWUevA4KDP50MQJBaLJeLxpiVNkVicoCh/wA8AgEKh4AB2fHy0oaHB4XCMDA0tX7p0eGh0xGrVaLTl5ZUqtWJgcHDjpivcbnfAH0in09XV1WKpFAIhh9PR3HI2GokGgyGNRgPDMMMw8XjcbrfPmTMnnc7o9FkdHZ1FhQUzamuPHD6apVWrVEqSoCViGcMAOXn5HDi1a8eumTMb4/GUfdo+Njbm9/koilApFO2dXaFQUCQSZWmzpqamXU53aXFxNBpdumLFqtWrx8bHMRxlWe5X9z+Ql5d79PiJtraOrVu3bti4ftmKlbFIIpls7+rsbj7bGo1GZs+ek63PZlnw6quuO3X25NKmJqlU5vW66+pq21rbf/mrB3fv2QdCgEKhOHX61MmTp379m998tmWLdXTsmeeeG5+YyNZny2QSfzDQ3NwSjURtO6YYipZIRCUlxQTx/3Jb/jvN7MfC55dmcPBGKKNUKp944onenp73339XpVIzDJ0hiK7u7nHr2GefffHvV984fHjf2MR4KpmKxWKrVq12ue3/fPafeXn59mn78PAwhmICHC8qKFSp1elUKr+goKW1taamFuC4gD/A11kQCUUulysajWZl6ZxO5+lTp5cvX7lgwQKtNgvD0MOHD5WUlARDIVkyYTKVDwz09/f3mXNy1WpNbm6OAMdaW1sAABSLxT6fjyeMeb1ejUYbj8cLCwu8As/E5IRUIrXk5E5NT7W0tkklMqPJSFJUIBRMxBKRcOTo0aMul2twsJ+fc/osncvlMBiyBQI8nU673C6dTldYUNjS2vbPf/7zxZdeGRsfR1EUhpA7br/V5Xa/9fZb5eXl69at83lzQBB+8fl/BPwBIpP5ClqAoN27dwEAoFCoiouLq2tqfR7/wgULW9ta169b19bcLJdJi4ryA/4gBEEQCL7w4guffvLpqRMnBLjQH/AfO35Mo9ZKJeKzLc3pTGb2nNlqtfrsmbONM2dWVFTE4xcLslyScFx6GZZztB0AAGmaVigUra2tjz/++H8++hCGoYLCwpHhkc2fbtHp9ceOH1uyZGk0GtqxY2durtnrdc+eM29waHD7tq3lFRVlpWVCoXjR4kXBQGBqaspg0Pf29XMcsHLl8u7u7sryShrkHA4HAAAURSMIiuN4MpmcmJjU67OmHXaj2ahSqSmK7urqlMvlOp3O6/HKZHKhSFRbVzc8PJRKpvVZyL69e1mG9Xl8I8NDAqGIZdlkMikQCCKRiFgsEgqFdrs9JydnZGSEIEmv1+v1BWiK2b5jJ01TfB4KAABms9nn85VXVGg0mnA4DIKgSqV0eTzeocGiouLCwiKSIiPh8JmzZ37/u4ejsfjOnTsxFAVA6CfXXx+NRjdv3rxy1apFC+dFIuFAIPDJp5sDgQAMAyiKnCMD8+o9Ho+2tjYDHNjQ0FBRWRkKB3NzcjVarW3KJpPKMAxnGIbluKGhwY8+/OCmm27+2c9+VlRcZLPZWJYLhqD8/PypKbtCoUwlUyKhaMGCBQiCsixwTjYupd48dClUnfNB0guPcxzAshyKoolEYv2GDX/4w//kWMxqtSYcDr///vv67OxbbrllYGCwvr7+1MnjJkO2Wq2IRkOTkxPhULihofHGG2+uqqoOhwOJRDwWi7MsS5L0+Nh4fV2dUqmMRSMTE+OJRGJychIAAJIgaZoSiyUgCNbVzbDZbCiG/vNf/0ylUvF4LBqNVlVXxZMJhmP0+iyvx1NUWCSRSN1OV8vZZgRBVGr1/oOHhCKh1+sxm80cx4pEomAwCEFQfn5+IBAQCAQqlSorS59Opwf6BmyT01lZWRRFoyiKophAIBCJRBzHjQwP5+fnS6VSmqYRBEsmkgzDxmMxrVYzPTU1PDysVqtXr13z5FNPgiDIctzKVSsnxieOHzv+s7vuqqwo37Z1K0UxW7fvCAaDOIZBIMJxXw0m+3Xja9H09nWfPnvS5XLCCOL2eCAE8Xi98XgMQzAYgnnW+N/+8XeWY2+97da+vr7a2tp0Oj0xMREMhisrqwYGBjxud15ebk1NDU3T55XL/cYb/CEc0ksBRs9vDMMqFNIrr9xUWJC3cuWKAwcP1c1oiERjqVQCANj//OdjhmZwHG1ta2cY2pxj1mVlNzTURSIxp9MFgiCColKZ3O1yiUQSqVQ2Nj6ebdDL5TIEQYQiQSaT6uvrT6bSAABQFMlyAASBJmN2MplwuTxisdhg0P37X69UVlavXL2S4zgIgEAAUKnUU1P2aCQye9asf77ySjqdWrhw8VtvvRUKBQ1GI8875HNAaJomCKK4uHhgoD8YChpNpoGBAZZhTCbj+PiEQqGoq6vr6+sjCALDxHzRBJIke3t7a2pqJicnOY5TqdQmsymdzuzdtyeVTAMA8Ohjj+3Zs882YUMQ5LrrrmtuPisUCu+7/77Ozs5IOLh+/cbPv/giQ2RwDGMY5huVSM5V3AZBgGHogf7+GbU1xUWF8Vi8vLQ0Hk9GorEZtfVtHR3nNM111133wQcfPPLIIzCC5Obm0hQDAIBKrWIYxuf1vfLKS9XV1RdJpv2RIfvv2kXg/CM0TavV6ueff/7AgQOvvfaGz+tfvnzljLr6UevIoUOHFi9eAEGoRCoRS0ThcEgkEplMlqwsQyqVGRkZtlhyeT6w2WKZGB/Ly5OAIDdqHV60aFEqlRSJxIZsAwgA9ukpguRT41mGprKyskiSGBkZBQBgYtyWl5srEomPHTuu1mgMJmMsFuU4Vi6X4zju8Xh9fo9MJi8sLDx79vT27du1Wk0ymQQAwOfz6bP1Xo8HAACXy1VQUACCoNvllsvlcpk8HA7xM9jr9TIMU1tbOzAwwD8s78rRND0+Pr5kyWKSJDiQG7VaY7E4AAAFBQWPP/5EfmHBsqYmBEGWLVva3d1FEMQzzz773LN/i0bDr7zyyvbtO3p6erH/koxvVLf6yk6EIJim6ZaWlquvunJqyt4ws4GX1/KK8i+3bYMgiGFoAACvv/76o0eP8hhXc0sLS7MkRSTicZqmR6zW22+7zWQy8clO/5fCcZHileeSkZRK5d69ex566KFbbrk5NzcvlUrLFUqBUGi1jtrtdoZhQsGATqslyAwEgWazeWxsDIDAlpYWEARycnIQBAZBUKvROqanopGI3W63WCwikSiVSgIcq9FkhUKhnu5ufiXmMRiDwdDfP8DXjw6FgnK5csHiZQ67Y3jEKhQLaZry+3xOp6urq7ugMB8X4I2Ns4RC/PXX30gmU9kGLB4OAwCQTCbD4bBYLIlGYzabraCgkBfTsdGx2tra3t4eFEV4zzwQCGQy6aKiIoIgaZo2Go0KhQLH8Uwm3d7eHotFg8EwAAC1tTPuv/++0pLSfQcO/PSndxIEsWLVSpvNNjw88tBvfvPl5593d3c+8MB9+/fvnZiwXTgNv95s5ZysgOfUvtvtTqZSIMihKOpwODIEAcEQRVEwDKMotn79uvr6WqPRHAqFAoFAOBx96aUXv1IqEGwym37961/G47H/V4/wkr0N5EeQioHz6lfiOG6z2W688SatVr1y5UoYhlOptFKlSqVSo6MjJEVP2x0TEzajyRQOhYqLikes1pKSUpPRdPzoUSKTtlhySJKWSiVKpSIvL3/Pnj1SqXRJU00qlQJBiGJohVLZ3d154MB+oUAYBaOpTFosEgoFuFqjcdinU6nk2NjotH1aIBCFw2GFVHrqxMmCgvx4IrFn3x6xRIKiGMtyJSUle/ftHRwcysnJFeAClvlqu4xwKFxcXOT3B7xe7+IlS3Ac12g0gUDA7XbX1dVbrSP8phkgCCIIGotGq2tq7Q57LBafmJhIp9PntPqqVavuuutuk9n00Ycf/vrXv4nG4oWFBZYc8+DAoMNuhyAoGomcPHnyn6+8vGfPHkuOZXp6CgBAjmP+u9I5eH6pTH5ichyHomgqleZYVq5QsCw3PT1dXFRstzt5AOvxxx7FUASEALfTJVfIKysq47HknXfe+fEnH6MIqlIqq6uqTSZzIBCAYeRbE+B+jM3xXfH+84/z9PFdu3aRJPnKK6+WlpaXlZUdOXJUJpVOT9kCAS/HcdN2R29vz6KFS5RKdSQWjUZjSpn84P4DYolYLBTgGI7jgmAw6HDYZRJZ89nmxtmzYrE4RZFikRjHhWkifba5xef1S2VSjgMokkRQRKFUuk6fkcvlqVRqcnKqu6t7duNsmVRSXFJ86tSpltZWGEbq6+vFYvHuXbvnL5x/7MSxLZu3hMMhi8VcXFw4OTnJV1KgKIrjWL0+q7m55R//eL68vNzr9RYVFSWTyaKiourqapKkamprpFK5QIBn0mm/3zeLnYWgmFwul8sVKIbBEAzDgEIh//g/H7/11ltGg+Gxxx6VSBUqldrr9XrcjpdffjEajcUTcYVSEYsnUql0VWXFgQOHvn73fFEr6DxtAX69xEDnCunTNO1x+5qWLR0c6NNn6epnzDh8+CjHcfPnz9Gq5LhAmCTIWDg6Pe3wB8MymWz2rNljY2PHjx8vLCzctWf3Pffc8+qrr4VCIeDSNvX5AZrjeykh7e3tDTMbVq9Zm0gkBwYHYBjCUHTaPo3jAgAAJsYm3G5vdU3Nrj27rCOjIAgmU0mGoUtKSjiGSWcyDQ0NJEkwDJ1OpyuqKgYG+i0Wi0Qi5VgWALiTJ08l4nEMRwkiA4EAywE+X0AsFqfTaRAEq6urJiYm9+zZM7N+5pw5cyLRGC4UzZk7b2hgQCoRm82W5cuXZ4j0rl27x8dHZ86cKZVKqqoqu7t7cBxnWYZlAYVCJZHI2trannrqqSeffHLdunWBQIBl2c7OjqVLl9E0ffjQIX6qYBgml8uFQqHd4UgkE+FwOJFIptMpjuVCwWA8Hr/uuut+9rOfxeMJgqQ4jpXLZeVlSx0O+2effZ5MZWbNmtPa2tbY2JBOZxKJJPBtBTS/dZayHIsgCACCGrX6nbff+dlPfzppmwwEfWqVsrio6MTxE3PmLmAhqLOn12odMZqMjTMblQp5Tk4Of4VFCxZu3rwZRbGXX345HA5/q036gzPevncvC960Jkmyra3tiiuuHB8fr6yo9vv9iURi0maTy6Q0ywIAMDE5SVGkUChw2R0ikYggiJGxEY/bQ7NMjtk0aZvEcVSn0ymVqv7+gQULF0ulnTiOS6XS/Pzcgwf2ITCkkMtlMmkmQ/L9CQaD8XhCo1HF48mpqWmZTEJR9LHjxy0WC+dyxuIxnU4rkUi2b9/udLiisWh/f5/b7eVXwJqaqv/85xOW5YaHh1EUBQAwEAiAIJibm/vSSy/OnNnwk5/85JNPPoFhOB5PvPrqqyqVil/yz60gCILw1QrPb0qlUq/XL1261GodoxkqmUzAMArDSCwaqqmpQVFcqVSePHU8HAo31M/web0zGxqcTif0lWfJfS++yDCM2WxqaW2x5Fjy8vNffeON0pLiFStXToyNm0xGmuNQGEmlUh3t7VPTUzNm1PJZsrxMCwSCJx57/Nm//x1G4BeefyESiVx6DPWHma//LW6sQIBPT0+NjY0tXrwYgRGfzysWibKz9U6nw2DICofC/OoEQZDf7zMaDJFIxO/35+ZZUARmaZqiKJ02a3BwCEaQ/oGhYDA4s3HW9NQ0igkEAsGBAwf6+npjseTBQ4ctOZZoNMqPYyqV0uuzQqFQUVHx2Nh4NBpVq1UMS/UN9IIABILAqZMnWlpaPR4viqLJZMJgMDqdbolEMqOutq+3LxKJVlVVCQRCgiBAEIzFYgAAZDIZrVb77LPPvvzSyzt37cpkMgiC0jTt8XhMJlNj4yyrdSQajRYWFgaDQYZhAIBjOQ7DcIEA59NzLZYcmqYikQTLcSRJBANOhVIhEAiMBqNOpyVJsqure2ZDA0kSIAjCCAzDMMuyX+8d+a0i8lURd4Zh9Xq9SCjaf3D/L+67/9TJE0Kh8Jprrjl56syZ5pZrrr26r7+vpqZ25syZ0WjUYMguKS6xT9u9Hi/HcZFwJC8nx+Nxnz17ZkbtDKVc+fv/+X0ymYRh+FIoxz+Asf4NKIxhWIFAeObMGYqi8vJyVSqVw2GnKMrn9+n1ukg4HIvFOI7LZAiSpFLJ9NDQcDqTgWA4nSJ7+ntttsloNJrOpBAUA0AIgkGL2Tg0OIjhuG1y4uSpUz6fH4bgrVu3wwhqNBqLigr5Hnm97qLCgmQybTAatVqdxZKDoGh7e8eOHTuPnzixd9/+ffsOjIxYA4EATdM1NbU0TUuk0oaZ9b09vdFoDARBt9ttsVi+fjcABEF80ebx8fEjR4888cQTDE0DwFe8henp6cGBgcL8AqlUGg6H4/E4iqIymdxoMOqzslAEpSlKKBLK5XKbbQpBYYlYePL06bfefPPI4cOJRIqmmawsTWvLWZ1Gq9Pq7HaHVqcVCYUymexr/OmckXH+H3D+Pk6lpWWTk7bSkhKf3//Rfz4pLCwEQHjfvn3JVMrt9rAsY7WOqFWKa665+qqrrkAgaHTMGolFhEKhz+crKys/dvxEJBy6847bn/zLk2NjYwKB4Bvgyg9mn18aMgYdOnRILlcolUoEQSYnJ6enp1PJVGlpaUdHu9vtzsvLs1gsTqczFolI5bL+wYE5c+ZM26d3791nMhh7uvukMqnJbN67e3fjrJl5efl+v83t9sokknQmnV+Qf+TI4dHR0aKiomQyhWGYSqUKhUIejwfDMAxHnU4nw9BTUzYABFiGRRB0ym5PJZImk6m2tpZlWZfLhSJwTo4FF+DdXT3RaIyfMaFQSK/XC4VChmH4Td1YliUIAobgF198cefOnffdd98HH3wgkUj4ssMsw0zb7TNnzgRBcGRkhGdUhEIhvqYggiA4LgiFQnxgk+U4AOAYgIvFYggCZjIpp9MOgkA0EpbLZBPjE1VVlZacnGuuueaNN95AEOQ8Zi4EfLVf0zkODgCCoEgk0um0ubk5/oD/rTffqK+vu/2OOx9/7M8sy0Eg2NbaNjQ8UlJcDACcUIi7nFMOu8Pl8o5axzKZzPJly2UymVAoSsQTs+fM1v1H09HRUVZWxte35AmCPyZv5Xs36kIQJJGInThxoqioUCwW81mH27dvX7Vi5dEjRyia0uv1vb19arU6mUql0mmZVErT9MT4RGlZaSQa1ao1g4ODXr+vuKiosrLCPj3tdruKi8u1Oh0MgxRNHjt67NDhI9U11aFgqL29nWU5vV4Xj8dCwaBMJlOrVFO2KRiGS0tLraOjvOskFAgCPr/VaoVhWCAQSKVStVpVVFT41tvvRSIRAAR49hfDMF6vV6/XO51OgUAQi8VAEARAkAO5eDz+xBNPvPbaa0eOHMlkMryahECIJAmr1bphw4ZoNBoIBDweD28R8yVpOY4Lh8JdXR0zG+fI5fLGhnqTwaiQK7L12aFQIJ1MT01NIygikYkJkgBBYGx8rLS0rKCgYHx8HEXRr+l67Ne6nDvHkCEIsr6+auHChTu2bx+fGK+rr6udMePdd971+z0cx4olklA4HI1GI+FQf19f46yZHo/H5XJTJMMXYrzhxp9s37a1bka1Wq3SaNQzGxpPnDhx8803n/NeL76xFXTxNeW7fsYwjFAgsNmmp6amq6qqcBynaUapVA0NDcMYWlBY3LR0uVAoTCYSKIwE/H6RRKzWaAAAUKtV/QMDlRUVBqNRKpNlZenj8XhvX5/FkmPQG51O+969uycmxoKhwNDwkEQiHR4edjgcGo2GpkmPx63V6qanHUqlymzOIUmSL6xWVFgEAEAylQIBEARBFEUYhmFZRqvRDA9b9+zdp1Qoi4uLdVodDEM8jBgIBHAcR1H0XDYp/8xqlfro0aMHDx289bZbJycnxsfHJyYmxsbHpu32QCDQ3d1NUVQkEikqKsrJyRGJRAzD8FUrHQ47RdG2yYlYJGwyGubMapw/f048Hpuetvf1D7g9vkg0Fo1EJBLxydNn8vPz7XbHvffeW1lRSVEURdEMw4IgBEEIX+EOBAGKohiGWbN61W233rp9+/ZMJv0/f/iDLitrz579gUAAhsBFixbJ5HIEgRmWlUqkIpFo1649XV29druD5dhYLLZgwQIQBAMB38y6urbmls+2bMnLy2lpaf66aCl3XvnGH8U+/9bcta9cOxx/9933AACoq6vjU4NaW1tLS0tmz56dnW1kWc5kNOVYcn1+H483S6VSAABYjvV6PN1d3QiKNDQ2yOTSWDzu9wc7OjrFEimMogsWzE+lMmNj4x6POxGPC3CBWCyGICiTycTjSQzDUul0MpUpKSnh62H6/X6fz1tVWUURBB8VoyjaYrGUl1cEgoG+/v5AIBQMBScnJwUCQVFhkeHrrS18Pp9arU6n07xwQDAkk0rTmTSCIE888ecFC+ZfffVVOI6jCIqiKAiCZrPZbrerVCqBQNDb25tIJPR6fV5enkKhoGiKIEmHwxkKhVxu9/S0Y2hoaGhosKurc3x8IhqP8zuPjo6OZemzN3/6mVKuGBkZZgH22uuvve22O/Lz8+VyBUUxJElSFEWSNAeAGrVmzeo11RXlXZ0dKIpu2Lhpz569Bw8c7urslCsUa9atD4fDHrebppnc3NyKykqX2w2CIMvxG4PAEATdf/8DH//nY5JiHC6nzTbd299vNGYHAgGXy4VhGE89/5HeykWWIp4C/sI/nn/++X/AMJyXlweCYE93p1ajLioqstsdubm5oYA/W2/INmS3d7TzgQy5TCYQCHhgkaTIYDg0b+7strZWjUZDUVRLS6vf52MhDgQAl8vrdDpQBE2nMwIBLpVKWZalKBoAAblC7nQ6OzpaV6xcvnffXolYkkgkUslkJByurKrKEBmFUpmXmxuPx3t6enhwk6ZpiUQSCATsdjuKomq1urCwMJVKud1umUwGQRCf1sEXbiAJEkVRv8/37DPP/uY3vx4bn+zq6kJg+ByOPjg4uGnTptdffz0ajUYiEZFIlJubazQa+a9isRhf8SErK4sgMuFwZHJysrS0dP78BSdPHu/t65s7b67BYDh95kxdXe2///WvjZs2RmPh22+71ePxDA4N6XRau91OUZQh22AyGYPBQG9fr06fbTabX3nln263K0un27h+PYTAx4+f4KNCRYVFpWWl+/bt+8pXYDkQBBOJxIYNG1AUPXTwUHlF6c7du2EYSSSTc2bPEggEY2NjZrM5k0mf05j/N+xzEARpmlIqVXv37L733ns0Gk0qlX7qqae8Xk8ilTIYjcFQRCgSmnNMdrvD5/UeOXLE5/cBAGAxmUuLS880n4lGo0KhsKqqyjYx6XZ5IAgeHR2Nx+OZTHpy0uZwOBmKkUjE/X39AoFAIhG73W6jIZtXP6VlZclELBIJj4+PP/LHR9o7O8OhsEgs0mp1fD2/BfPmoija3z/gcrk4jkNQhLfa5HJFMBTkSwrHYjE+BMUb0Uaj0eVy8RvSMCwLgRDHcRiK9g8MlJQUNy1b2tfXx/vkBqMxFAwGg0GTyaRQKKanpyGIp2GCTqeztLSUZVmn00mSZCgU8vv9o6OjPp+P4zin06lWa2bNmjU4OBiPJ/JyLWPjY01Llo5YrTqttrametfu3SazyWQ0wBBQXVOVn5NbWVFOUKRWo1MoVTt37Y5Goxq1ZsPGTYsWL7KOju7YviOVTAIAUFFRUVVdtXPnzm+YAZlM5plnnnnz9TcYhpbJpE6nk6FpoVBkNpki0TBF0cuXL+cd2nNLx/8Bh5RlWaFQ4PW4V65atWnTxmAwYDAY16xZ53A6FyxcMD46bjQaAoGgOSfH7XLSJDU0PDw9ZeM4Ljcvf9GihTu2b5fJZSaTaWBgIBaL4TgeCoVzc3MCgYBIKJTKZW63WywW0TTNl/bS6/WZTEauUCQSiZLiYqfT6XK5RSJRIBCEUXTF8hXvvftuOBz2+/2xWMxmm2QYdnrarlAohEJhJpOhSApCEYZhDAZ9MBgEQfAcHYU3NrOysr7eNUfI4w0wCAIgyLAsBEFnzpy56667NTrd6dOnIRBUKJUupxOGYbvdft2117W1tXMcV1RU4PP5IpGIx+PJ1mfrDVkej5dlWSKTgSEYRmAIghAEcTjsFEU2NTUN9PdrNGq7w0HR1MoVKz784EMIAquqqrdv22Yxm9OpjNvtCYWDx06ctNtdwyMjo6Nj1157zdy5c7KyspLJxGuvvT4w0I/jOE3T1dU1NbXVX3zxBQhCvPfAsl8RQm644YampqY//elPuixdIBAoKizy+wPdvX19/f0kxezYsaO4uGTWrFmJRIyPevKZXT++muA5wRTggltvvb2wsGDhwnmnT5205OYFgsHZs+fRFBOLRXNycsLhaCqejEUiOIosW7bs5MmTDEuSJCmRSCw5ORAEDQwMnOOzBINBDEOLS4pHR0e1Oi0Mw2KxeGhomOMAuVyWSMRXrlwOQCACw9ax8Xg8jiAIxwEqlerNN948c/p0Q0NDZ2cnb1eCIBCNxiYmJ4UCAZ/4xDCs1+eNhMMsw2IYnkqlhEKhQi4XSyQ4hsfisc7Ozq/JeQDvdND0VysxjuOJROo3v/71F1u/7Ors2rdnD5HJ8PuPxuPx9va2+fPn9vb2ud2eeDwBwxDHccMjw0VFhevXrz958nQ4HIRAgH9G3t2dmJjIZDJLm5b2D/SZzJZdO/eUFBXd9bOfffTRR7FYfMXKFc3NrQDA1dTU1NRWz5u/aHx80jY5zjDMvn37/P4AzdBul4fvGEEQVVVVM+pmfPyf//DeOJ+nLhaLFQrZ2rXrXnzx5Q0b1nMAEI/HIuFoV3ff/Pnz581fVFhcZDZbWlqb77vvPpPJtGDBgnA4CMPo/wFCyjurf37iz0eOHj14cK9t0pYmCIFAoNPpGIbCMCHDMBiO8Qu8y+WuqaqQqVUKpSrg96ZSCZlcFo1G+T0QeUmnKEokFjudjtKysvz8fJIgjEZDKBTmtwamKCqZTCWTCYIkunt6QPAryIFlWb7G6BtvvP7II49s2rSJAwAW4FAIgkAQhiGSJF0ul8fjUSiVWo1GpZDL5bKCgvxgMARBAEEQ0WiUYRiZQj5r9myxSFRYWFBaWlxQUIBhuM/n37//wM6dO+PxOAAAvb29f//bc4899ieHwz5mHQUAAEZgqVQ6PDKyevXK/oEBvz+MoijDUCAIoSg6OjqWyRDr1q3r7evp6e7mAxl8HiKKYy6Xa+/+fevWrpuatmVn6196+Z9XX3l1Tk7u5OSUSqWunTHDZps6eOhwR0enXC5XKJS5uTl9/f00RclkstHRMR6vIwiitLSkpqaalwytRiMSiyYnbQUF+TiO5+Tk/PnPf7nuuusOHTrU2DjT43YXFRffdtudV151RSwWI0myr7/vlw880NjQsHHjxm3bts2ePZvfIePbdcElbgDIMIxMJjt+/PiyZcueeeYvt9x8y7/+9dp77793+513ymXy8vJyXZZ+2ja5avWqeCLV09vX3dG6ccNaEIZvvunW1tY2uVy+bdu2559/fv/+/TRFwQhCUZTFYolEYol4DITAkpJig0Hv9wenp+0KlUokFGTSmUgkEgwGRSKB2ZI7Pj7BMiQEIzAEy+XyUCjEh+X+9KdHDx06BKMwjmN5OXnDw8PnLYIMAABSqdhoMDAMi2F4RUW5xZJTVVuL4zgMQoFAwO/3WSxmf8A/PjaJIIjFYkYQWCaTezzu3bt3t7a20zS9Z+8uimbvvP0Ok8lEswzLMKFgSK1W19fXtbd3DA4OnsOyIIjfqUO4bNkyfvedVCrFl8FnAQ6CIIaiJRLJFVdsJAhi//4DGYKsqqwEAQDD8HgirtFoksmk2+VOxKMqlZIgaaVSIZZIXC43y7JSqZTfoGnBgvkfffQRAIAURW3asMHr87AsF41GCZLcuXPXk0/+ZfPmT4uKikwmQ8PMxiWLm1iWO3vmTFFxQV1d3b59+91u17333vvPV/71wYcf9vR0qdUagiAkEsmP3FIDBAEIgmEYvv766yvLK9auW+vxer0e38iQtaqmlmHZ6669JpWIDwwMciyL4djRI4eFQnz27Dkcw9lsNofTyTBMcXFxXl5+Z2e3QqkKh8N8vAoAgGQyAcOw1+ttaKhXa1UeTyCdTjvs9mAwyPuZJEmxDJOTk5NOEyRJowgiFAoymQxF0QAAPPDAA++99y4EgjiGCwSCYDB4fhUsGIY4DvB5/XUzam+97ZaamtoNG64oKSnVZ+slEgmGYuvXb9Dq9EqlanJi4u233961a9fp06cGB/qDwfDCBQsQGJy220+ePPXII4+otZr333svGAj7vN5EIiGVitvaOubMmZ2fnzsyYuWnNQAAIARRFDUyMoIi6Jo1qymKcrlcfNCOZVkIAjOZzNDQ8Pz58/Ly8zvaO1wuVyQaTcQTKIbSNF1VVdm0tEmn06EYJhaLUAznnSmSJKPRKEmSixYt2rLlc5qmWY5VKhQPPnif1To6MDjIMOyBAwf+/ve/f/TRR2q1miCJwcFBo9G4aNESpVLu8/kSiWRObk5lVQUAgDRJz5s//8OPPlyyeFFRUVEmk8Fx/EcapCzLyuXy3bt3v/DCC3PnzrdYcufOmXvo0KFgMFBQWNjc3DqrsTFLq1Molfn5+clEYu/uXWqVSiAQOJzOWCR26MhhEATD4dANN9zw7jvvaDUamUwWjoT5MoHhcBgCwYLCgkgk7PF4CYL0+3wwDEEQzK8+EASmUul0KmWxmEkiw5svsVgMhuHe3t6f/exnDodrdNQql8n4QBoEQbyDKhQKNRoNjgt++9vfrlu/oaqqSiKReLxeDEPz8wsmJm0FBYXhUDgUDmMYNnvW7JWrVixd2jR3zpyf/OQnDMt0dXUHQyGVSuV2eT744KM//uGP2izdsaNHBQIhCIJ6fbbX6x0YGDAajQsWzB8ZsfLULN6ZRFHU7XGPj4+vW7u2srKqv7+foigMxxmWhUGYBbjWltY5c+eaTKbh4WG+2zzw2t3d3dbW1tc/YLWOTk1N2+12p9Pp8/ni8Xgikfjtb38LQdDp06eEQiHLsH965JGTJ0/t2LlbJpMfPHjg+eeff+edd4RCodlsVqk1c+fMueeeu7OzDU6no3F2Y0NDQ09PT9Dv12l1kUgIQZBTJ0/m5+c1Ns5KpZI4LviRwsEwjEgk+uij/1itI//zh0fWb9xAZIin/vLkzMaZFEWNjAwXFRWgKGrINojFYrvdPjVts1gsRUVFOl1WNBrb8tkWi8XS19u7bNmyaCTa3NKs1Wq0Ot3XZF2irKIsnU6NjIwF/MHsLK1enxUKhTEMFwqFEARxAMCDYJFwWK/PkkgkGIZFo1GhUJTJpJPJxMO/e/idd96RyeX8Bnq8ZOh0OrPZbLNNP/LIY/MXLGBYLp1KV1VWFBWXeDyuvzz5ZFtrayqZzBAZmUymUCgnbRPZxuyy8kqRRILjgttvu2PRooUcALQ0NxcVF4XD4VdfffXJJ/9syck9dPCAABeIRCI+njI+Pk5R9Jo1axwORyKR4A1blmURGEln0m1tbYX5BX/4wx88Xs/kxCQIwBAM8oZqW2tbTU1NTk7O8PAwgiA81oIgCEGQ54I+fMNxnKKopUuXvvbaaw8//LDf72dZTqvVGrIN73/wgV6v37Vr50svvfTuu++iKKrRaEmSkIilCxcugCEwEAx2d/cIxSK5XJGMJ0RCUTweb21tByGQoanhIeu1116bTMYFgh8rHBzHCoWid999lyAyN918UzKZ7ups37Vz+4KFi7o6OyPRoEQisZhzQQhqa2sVCHCZTFpdVeX2+nLz8+PJxP59+xQqhcftxTCsaWnT3r17w5EQRdElJSVlZSUYjrndbr/fL8BxBEH4/ACpVBYKBlmOg2FYJBaqVEqVSiUSiUmSMBiyAQAMhcIMy0IgODAwcOcddyZTqfb2dpFIHI/HQRDMyckRCoWjo9byyuqXXnll0jZZkJ/vdNhNJpPNZotGo1KxODc3B8VQGAJxId589gzD0DRJDw4NogjSfPbs/gMH7HYHCMEataakpFQqFXd2dn78n4///OST+XmF+/fv5b1EfqXw+fwej2fhggU0Tfn9AX7TAn5nUxRF+/r7JiYnHn/88YqKytbWlnQ6DcEwv9D09fVZLJbqquqxsbFzg3+utvO5NAUexzty5MjExMRTTz2FIAjD0Pn5ecePnZAr5J998fnrr73+/vvvi4QChUIBgGAw6IdhZHR0hGPYvJy8stLS3Py8gN8/OjLi93saZtZzHNDa2rxq1apX/vnPNWtW63RaEIQvpB9finBwAMBhGP7222/jGLJ+w3ocF/7nPx/6fX6zyXzq7BmRQAwCAEERWVpdTW0tyzI4hiMYWltbOzo6Go2Ep6en+vsGCIKIRCJ33XX3tm1bKYpJp1OZTEokFI2Nj4MQhOE4BMMYjkkkUpqmC/ILMAzlC+ZzLJfOZDLpTCKRSKUyDoedpmmxWBqPRxEEoWl6cnLitw//dufOXUQ6LRQJc3NzYrGEy+VkGPaBB39ZWVHp9rjKykoOHTwAAIBSqc7OzlZrNFlZ2RqtrqKisquzJ7+gcPnKVQqFSiDAQ6GQXK4YHxuLRWM1NTWr16ye1dhYUFDodNijkegbb7z5/PMv1NfP+OTTTyiSEgpF/FaxiXh8bGysprY6Nzd3amqKzwPlrVSeFbx586cLFsx/9NFHw+HI4MAAr11QFB0bG8NQtKKi0u6w8xU+IQjiy5Gp1Sqz2VhUVFxeXn7rrbfW19f/5S9/6e3t5QAuL8ciwHEOAPbu3fvKyy9/+OFHOI7JZQqD0ejz+6RiWW3tjGQydfz4MQgCWI7R6XQ+n58iyXg8CULQ3HlzcYEoPz/f7XaOjo6uX7+RosgfZ5ByIABxAPDiiy8uXrxYJpUlE8l9+3arlSqP12uz2cbHxqVSSeOsen121uTkhM/vpyl6xDqSTqeNRsPIyPCZM2fGxsZxDAuHw8uWLYUgqLe3BwRBjUZrm5oMhcLpVCqZSqZTqXQ6nYwnKIqKJ+Jl5aV1dXVKpVKpUBEEEYqE0+k0j/Ok02kcR1EUJQgCw7CxsbGFCxYU5OeNj41JZZLx8Ylzlsff//ZcLBoVCFCXy7V9+46rr7q6pLTE7XaBIFhcXDw4OEwQGaFQlEwkTpw8Ho9HS0tKdLosGIEXLVpYXV09PDgok0mz9HqaYRAEHRgYMJtNL774wuOPP960pAlFcZKkUqm0QCjS6XQKhcrj8RYUFNTX1/n9gUgkAgAgBEG87w1B8KFDh5LJ1JYtWwoLC0Oh0KxZs+rr66oqKwGAi0TCjY2zlEqlVqfTaDSlpaXl5eVSmRSBEYqio9FoS0vL3/72t+bmZhiGERjOz8/HMXzX7t3PPffchx9+qFDIpVKJTCaDIDgUCgEgYLaYk8lEhsgEgyEUx5KptFgkLi8v5Tjg6NEjRUXFEAjxHsqnn3563XXX8gGs7xcOPmnna80BchyLY3goFHryySc3bdykz9KfOHGira1Vo9ak0qlAIJBIJGiKxnGBVpuVyWTq6+sDwQCKojx1u6Wlra2tIxwOwQjM0AxFURs3bti6dRsIgrznxjAsDMO8bQGwXGVl5b333vvMM3/99a9/M3fO7CuvunLBwvl19bVmk4lhGLfbrcvKEgqFwWCQn5R8bHp4eOhPf3rkyNGjfn8AADiapvnC5H/84x9gGGIYNplIVNfUiMTiRCLBATSCQqFQKBAM/OejD00Wc2PjzCVLFlM0xdI0SRCBQECj1hQVFiEIbB0ZkYilHZ0ds+Y0fvLJZiKTrqqoePW110iS3LBhww03/KS6pjqZSHR393g8rmg0Mjg46LA7ci05paWlLpeTJMmvdwIEUAzr6e5euGjBxo2bjh879sWXX/b29vr9PpIkx8fHJyYmvV6v1+32+v1T9mmX0xkJR0KhkNvtdjqdwWAwk8mgGMpxnFKuaFq27N//fu33//P7Dz/8kMd50+l0NBbjKSYgCKZTqZwcy4033SiRSrIM+kgwwrGM0ZSN4QKT2QiB4ODAEEmRBQWFb735Zk6OZcaM+nMr2sWEg2GY85cVmqHkcsXfnnvuzNmzD/32twq5/MWXXkqlUgiK5ObmWkfHUqkUhqLpNDFsHYEgwO/3eX0+mUzKcezY2Pg///mqUqnyeD0ACHAA4HQ4br315sOHDycSSbVaHYlE+DtCEKTVaNauW/ebX/962dJlNE21t7edOH48Ho+HYzGFUrVo0eLFixfX1c1oaJj50zt/OnvWrN7eXt5xRRDE4/Hm5FhKS0sPHz5iNBrVao1Go06l0nV1dTiORyKRioryjs6O7Ozs1pazRw4fVam0HABptdq6uhl5ubkDAwOxaLSkuHRocFCukLmcToVMzjB0XkEegiAulwvHMRiBERg5cfxYJBKdNWtWJpN59tlnDh46qJDLN2xYf/vtt8+bNx8XCBx2ZyQadrqcQqFwwfwFiWQiGAxCCMwBHAgBDM3EY/Hrrrvus8+2dHV15+fn8ZA/RdMkRdEMA4Bf7b9NkhRJkRAMy+SybH02n6STSCQ4jrvv/vseffTR2++4Y8fOHUaTMZFIRGNRuUyeIdKpVEogwCw5OTU11ZXl5fF4nKJot8tNkRRD0xiGQCgCw5DTPi3AUa/XZzRmW0esEIQsW778XF2oS1pWeHwMw3Cv13v7HXesW7dh8eKFU1O2I4cPUyQNgEBhQb59ejoYDMnlcrlCHo9G47H4W2+/G4vFrSNWpVL1/vsfjowM5+TkOl0Onh+USaeXLV2KYVh3d4/ZbPb5vCzLKpUKqVS2fv2GJ//8F5FIGAwEJsbHrVar0WCAYRQCYZlElkjEg0H/tddeC4IgQ9NXbNpUVFzY3d3tD/g5lkMQpLOz68knn9i1a/fo6GgikaBpOjvbUFpa1tHRXliY393d1XL2bDweSyTiLMtee/31RqPF7fYAAFCYX5Cdne31ekdHrUqlcnJyUq/P0mXppqZs7W1tEAw0nz0dikTKSsti0UgiEQ+FQjbbVF5e3k9+8pNPP/20ubl5y5YtR44ehRF0/fr1t99++/wF83Acb2tt6+npqSyv0Gq1/oCfY1kAAGAIGhgYrKysaGtrS6dTqVTK7w/AMILACAhDIAgwLMvQNEszLMPQFJ1Op2PRGK+es7Ozi4qKbr755l/96lebNm06ffq0QqH0+XxEhhAIBEKhMBaNQhDEMCwEgqlUyul0JhLxQCgSDIbHxsc8bncoGJyent62dcfJEydAEJBKJXKZdNruyNZnL1i4kOMACAIvlSbIx7sVCsXf/vY3k9k8Z84cBMODwVB+Xv7Z5rMQDAEcYDQaJicnZTLpqNW6bGnT0PCwyWRSKOSpTHrL518YjAYEQVAUFeCCVDIJcAAIgrv27L3qyis/+eRTgiBIkjKZDHK5IhAIPnD/fc3NpyYnJ8vLy00Wk1ypMBoM4xOTFE0lEvFkIjE6amU4Lltv6Ojo7O/rv/raq1944flX//3qqdOnY/FEMBh8/fXXX3j+Hxs3XQGCYCAQLCwuW7p8xf2/uJdl2Orq8tKy4kAgVF1dQ7P00OBQTe2MaDRkMpoyRIZhmIaGhlQq2dfXd+rkSZlMvnbdBplcqdFmKRRyGEb9/sCJ4ychkENgFIJQu932ySefLFmyRKfT8XtCO+z2D99/78P338s2GJYuXbrpiivuv+/+wYGBXTt3MQxTVlo2ODjI0AyCwBKJ5NFHH41Goy6X+2tImj438kKhUK6RazQanU5nNBpzcnKys7N1Op1EIpHL5QKBIJVKLVu2rL+/Xy6XBwMBGIZBGPyazwYBAASCsN8fCAaDYrGopKREKpdH4hGSpkQSzaHDhyEYkcmVmQzx8aefVVSUl1dUNTe31NfXA18prEvLW+E1B47jHo/n9ddfe+g3D8vl8qlJ27p1G+x2x8HDB/XZWZFwVKlQabWaTDoVjycikUgimczWZ5eVlRlMRrlc6bTb33n7nZzcfKPBnE4lwpFwMpk8cPDA/ffdV19f397eXliYj+OCsbGxxx59JJNKDA8MrFyzRqvVdXd3dXV2JhKJqqoao8lE03SaIG6+9bbu7k6aYa6+7povPv8iFIqsXr22pbnV7fbYHXa/P/Daa29ceeVVN9xww8cffwyC4Nx580+cOuV0OzZvnhgfr5+/cK5AJIzFEmUVpT5/IBGPZ9IZiUTCU2OGR0ZcLqfRaLzm2mtpmuE4pqCglPcp/IEgxdAIikqlUktufmdnT2VlRX//gMfjmTdv3tatW/mMeAiCQADwuN0fffjhRx9+aDKb16xefdfP75ZIJF6fr6uz84033qBp1mQyRSIRGIZnzZql1+sNRmNObk62Xq9WqyViCYIgvOZOpVLRaNTj9YyPjx8/ftzn89ntdj7+DACAWCLh2fP8Hqs8SwgEQY5jYRjiU+XS6XQ4HCYJEocRDsMjkahObwAAICfHolIqOzu7fL7A5s1bUsmkRCL5wRlvDMNIJJJ//etfOCa48oor9x/YTxIZhqEEAiwnx1JbUxOLx1mORVEsHA7r9XqKZmc2NI5aR8bGxoLBUCKZmDGjViQWBYPBQMDHMLRCoZBKpT6fr6Oj85prrnE4plmWGxgYXLx4wdq1a6OR6Nx586VSmS5LH4lES0pLZzU2KhTKRDzZ2dHJUPThwwcryiuOHD1aUlZ21bXXuOyuru7uWDw2PT0tl0klErHd7rz3F7/YsnnLiRMnHA5HMpF4/dVXAQCUyCSnTp+SKeVr161z2h3RaKSosGh8bBRFUZlM6vF4nC4XLhBUVdVo1Oq2tpaK8vJwJHLixPGZM2dCEDg41D9zZkOWTiuWycOR8M6d22LxmF6vP3HixJo1a7Zu3foVHYRhQADEUAyEIRiCHHb7G2+88cYbbxQWFa1etWr58uXLli2LxeJqrVoukwmFwkQiGQwEAqGg1+Pt7e1zOp3TU1NerzcYDMbj8W8QxLOzsz/9dPMDDzzQ09ONC3CaphAYIUmSJ7+RJMkwDAiBOI5jGIYgSDweLy4uRVGEphizyWQ0mzKZTFdXdyQStdlsUzYbAsNen89mswX8AZlU+gMCb+cidTiOl1eU33n7T396550PP/xQeUX5vHnzGIa+5bY7JELhjPoaEILs0w6X251KpimKfOD++wYHB/v6+ysrKxEYNpqMb7/9HgRBMAw5nS4EQfi8piuvvPLOO++89tprEok4AEDP/+NvN910k93uZBiGoZmevp55c+cKhAKBQDA8Mnz65Kni4lKZTDplnw6FInV19R6PB0KQFcuWfvHFlxSZev/9D63WUZZlsrJ0Lqf7jjvvmD9//s0336JSqdPplEKhMBj1YpGQYcHamprZs2emMuScOXMH+wd0Oq0uSx+PxXLzcqVSKUVQNEP39nSXlZVqtVqf39/T28My7JkzZ8QSsXVkmANAj9uNYYKxsTG5XDYxMfn000//9rcP8+yh80cSgiAI4ospgJmvq/ZUVFQYjcZ4IhEI+KPRaDAYZGjmW2cmD48CAAACIAB+BRD//R8vXHnlpsrKinQ6g30d2eahVb6wKcsxIrEYAqBEIrF48eLCwvxEItHQ0GizTZw8dTIRTzYtXdbd3TU9bS8tLrFarRAMB4OBRYsWffLJxwiCYhh2qdUEGYaRy+U7duzYvm3HI3/4485d2wCAveqqqwiSNmQbTp48MWWbNOeYI+GoWCx2OZ3T03aKIsOh0OSkze3xyBWK8YnJ5rPNXq9XKBRiGM5HQwiCoGm6rq5OKBQeOHCQoqj169ffddfPUQyZnJxUqVTvvPOmSiHPz889ePAggiBisUQmk/T29oyPTWTSBMsAY+Pj1dU1mVQ6lUpqtVqCyMyYMaOjo9Pn84uEQpPJ0Nbe9sc//vHYsWPT01MymYwH8cpKy48cOdLX22efns7LK0Ax5MDBg26PJzcnt7CgAMcFLMvw1TKSyYTJZHI4HIlk0mKxnD516vU33jx75mxHewdBENNT9nAwkkqlzBazWCwqKiqQiKW9vb1fOdUg/z6/KqnOMCzLcgiCYBgGgqDH4xkfH3fY7aFgKJ1KITCMYgiK8n8ogiC8Sy8QCHiMFYIgDuB4qBRGkL17dl973bVLmpo+27yFr97ME1mEQiGv5hmWxXEcgZE1a9bgOH7g4AGn07llyxYEhmfNmhUMhU+fOXXVVVdRJJWTm5NIJSiSwnF8165dGIaAIPQDEFIAAFAU+fnP76mqql64YAEIcmq1ymAw5xcUBAM+6+gIDHIkRSlVqoMHD1ZVVUWiMQRF/f4Ay7CFhUUACPb39UejMZZlURQWiUSRSASCII1Gk8lkysvLVSrV/v37URRrbGxcuXL15ORkJBSKx2MIAq5duzaZTI6PjW7YuKG1rcPudCYSSRwTSGRSkqZYhk4k4gZjtlqlcjpd2dn6+fPmcxzT29cPAODU9HQ8lrjiio0Oh7O3t08mkwEAaLc7ZFIZSRFSqTQQCHZ1dlZXlYtEoroZdTCCjIyMUBRls9l6e3oomvL7vMPDw2Pj46lksre39+ixYzTDymRyrU7X1dlNEiQLcC6Xa2pqWqlQzp7VmJubu33HDgRDua+z1sCvc0X5DV/OUTr4HWFAEIQRhFcMfFEk/u8cnMpxHI7h/FV4KI/PgYBAcO++fS+98CKRzpw4eUKn01EUhSAIwzDJZJLjOIVcoVQor7rqqlgsOj4+vnbNmtKSkuuuvV4oEo6MjM6ZMwdF0UyaIAgKhiE+R7WiomLliqUgBGLYJUdlCYIQi8W9vT1//vMTv/jFPUuXLrWOWXNycmmG0Wq1Fovp2NHDbrcHwzCj0eRyucfGxstKyyYnbRAEEplMhsjEYjEEQbKysjAMi8fjAoGQ4zidTkeSZDKZnDVrNoqix44dq6goa25uufrqa7MNeofTTtP0wgULnQ57JBKpqqpq7+gYHByCYYihWZKi3R5XOp2Sy2UKpZxlqGg0iiIoH2vGMNg2OTk8YmUYFgAAiUS6du2azZu3yGQyhmGkUqnNZhOLxfkFuWq1lt/268YbbiitqIBhiGM5tUYZDAQ9Hu+OHTtee+31w4eP9A8M7ty16+DBQ9FobN68uQRBeD3eVStX//SnP125cuWSJctuvOmmlatX5+XlzZk9B8Wxo0eOoijKsRz4dVYSx3EgCJ1bavgXzzDM18YEd866O1eyXiKRgCCYTKVoli80habTaZIk+ROEAoHf788vLPz97x6emJxsbm7m8aFUKoVgKI5jAAdYLJZQKLRr1+7qqqqhoaFwJOpyO0EQnDt3bjAYKi4uHrEOL1y4sKe7p7Kqqr2tNTs7SygUzaito2gKQdBLXVZEIpHVat28efPdd98VCgcjkWhxcTHLMjAMnT179sTxk319A0qlQiQUqTXarq5ujmNzcnKdTidF0yqVKpVKhUKhZDKpVCqqqqpycizRaMzn86fTKZZl586dS1HU2NgohqEOh9NsNpeVlgz09xcVFwkFom3bviwtqwiEona7naeOAhDg83k//s+nOq0mKyvL6/MsXdrkdLosOTmJeILIEPkF+Vbr8PDIqFariUajXV1dN910o0ajPXv2bFZWFk8f4Thu3rw5JrPZ6XKFgqFMhujp7Xv77bc3b948PDySpdO6Xe4PPviAohjblM3lcpEkKRSJZDJZMpEoKCjYtHFTYWFxJpOGIABFwU8+/fTtt9/67LPP9+/b9+qr/46Ewi0tLRiGsSxzrsDGuXS6r4x/BOEJ8d+o4HOuRCcfjRMKBQKBAAJAqVSqUCh4yhwMwwRFcRy3aPHiuXPmrF231mAwnj51KhaLSSQSiqJQBMFQVK1WTk5O3nnnHfrsbJFINKuxEWC56uoqEAAVCoVAJBIKRZFwiKZpg9EAgEAmnXY63WvXrQVBEIaRS6UJsizLY/U221R+ft7IyEh+fr5Wo2ltaX7t9Tfa2jqKCgu9Pr/JZJFKJTqdzuPxIghaVFRktVohCEqn0zKZjGVZnsJPkkQ8HieIjEAg4AdIIBBkMoTVOgaC4Oefb1GrlCUlxcFgkKIopUqrVGlmzS758AOPw24vKS7t7u0qLi68/xe/gBEYhkGtWhMORSVSmcGQnUomIAjMLyjAcWEkErFYzCzL+f2BO+64c//+/XxUwmAw8BWlW5pbMUwYCUf8fv+03en3+wEAMBgMXZ1dRw4fAgAgEolotVqJVIrjmD4ra8HC+WtWr8UwdHR07I0332hvb8dRTC6XZxuzf/ObX3u9TS++8PLpM2fuueeePz3y6MDQ4MmTJ4VCAU1TfA0WhmER5CuCJ0/vvnAfeF5n8E6HQCAAQVAiFeMYnkymotFoOp1Sq9UikSgWi6EYlojHA4EAAADRWOLuu+5asXzFrbfe2trawoMOMAyyDFtdXWWxmP/979eWL1ueTmWWLlnuC/imXfZwJLxw4UK1Wt185ozRaHA4phUKeSQY7erqPnv27MKFiy4s1HExDqlYLIZhGEFQGEa0Wi1NUbu272hpa+3q7gmHw0IRHgoHJycnFy1anE6nZTLp1NRUfn5Bbe2MWCzKm+4oipIk2d3dwxfL4u1cfsbk5uUhKJqfX4AJsFA49M47b73z9rsIBtMMvXzZCrfHw3BsSWmJSqU4ffJEWXH54NCQVqeRSGTZBj3DMATJFJeUoChy+vSpNWvW+nyBTIYAQXBgYLC0tFQikQ0PDz744IMvvvji2rVrI5FIOp1GEKSoqKCnpz83N0coEhIkIZfJCJIEABDHcYVCOTg4pNPpcnNzR0ett95689q1691u1+5du0+dPkXTdFVV9dVXXc0yXDgc6Orp2LVr95rVa2668cY9e/eMjAzfeccdz7/4wg033jQxPo7jGHvOiOA4XmHAMMxbct+oEcvTvvnNchKJBL/pcCwalUikRqNRLBZNTExkZxtwHI9GIiqV6vjRY+k0gaGYPxDKy8t97LHHli1bqtNo4/G4yWgoKi6Sy+Uff/xJbU11Xm6ORCLv6ev7ZPPHHo+H47jde3ZfdeUVlZXlmXSmqydMkJTH44knYm+++eaiRYsvjK1A34Vz8OFyEAQdDgdFUoX5+adPnfz0s89OnDorEUuKi4tkMplSoTjb3IoJULFYRBCkUqmYmBiHYCg7W6/VammajkajPO0RQRCHw6FWq/m4sFAsNJnNer0+HAkPDQxOT00HAsG/PvsMBEABrw/F0EULF3pcrqGhgVQ8EQiGJFLJvPlzy8rKNRr1tN0hUyh9fm86lRofH1+1erVGo07EIyKRAAQAEILGx8dNRkN+fv6JEye+/PLLJ598Mp1OIzCclaWNRqMcx05PT5uMJhzDY/E4juOZTCo7OysWi/Grfmdn58pVq35+zy9++ctf3vWzu19/4414PFFSUpJMxv/96qv7DuwmKbK6asaRo4eHrMPjE2MymWzhwsUj1pGnn3r6i88/UygVNM1C50HMvHycH7Hi60hhGIYgkEgkxDCMpzUZjAZtllYml+fm5cvkikg0EgqFy8srvF6vWq1WqtQSibizs2Pbtq0ymQRBkEg0Pm/evIULF9IMRRBEfV2D2WhyOp1VlRVKpTKVSqpUiiNHD/PxhHQ6bZ+2b/1yG8dxgZA/Pz8/GY9L5dLs7Ox9+/Z1dnbwAeRLSofk2V8ikWhiYiwej58+2/zZ51+0d3RKxKLJyUmCIGQyWVVVFQiCIyPWjRs3ZjIZkqQQBB4fGxscHIrH41KpNDs7W6PR8G4ez+cQiUQgCO7fv1+tUpIEkZebW1JSDIIgCEGbt2z+61+famtt83g8drs9KytroL8/nUk/+MtfR2JRm20KADiWoTdt2CiXyrRatT5Lr9dn19TU4gLR1q3bpqfshUVFJpPRaDSkM2lcgCMo8pe//EWhUNx55500w4jF4lAozBd8GhkZMWRnq1XqdDqt1erUak0gEOA5AGq16qGHHlqzenVXV/fGq67897///fvf/37u3Dm1tbXr169dsHDh8RMnMRx/+Le/6+num9k4p7OrW6lU3HjTDTt27jh+/PgH77/PcQzL8QYHCMMQw1AKhYL3O3ha19dpEDSPnYtEIhiGYQhmaCaZSLAMnUokOJbWqFVKpQIEucLCfIamhAJcJBTKpNIXnv9HMpmEEZADGIEA//nPf55KpyEIkisUfYODOI6fOXNal6UDQDAYDLg97q+8Yo7jrV2n08V7vw6XW61WITCUn5/P13v5YbsmvPXWW2q1Kh6Pv/DCS16vLy8vTywWUBSVk5vT3t6RSqWFIglNkbNmzWptbYvH4zCMqFQqXg542iMIghKJRKFQYBjGY2tisXhyYrKwsLCoqGjLli0ajSY3N0en0xpNhuGh4fqZs3RZOr0+22Q2G40G29SUx+vJ1hvKystxHItEoseOHVMqFRWVFQRJRiPhnp7e5557bseOndNTdgRGkum0fdouEonsdjsPMR08ePDvf//70NCg3x8Mh8N8zS2GYYKBoMlkysvPMxqN/f39mQzBJws999yzW7d+GQlHHn3sUZVStXvnzu07todCQZLIKJVKk9E0f8H8vXv3qNUqjmMZli0pLQ74fTVVVSOjo21t7TNqaxcsXLBv3z6GYWia905Y4us8Xp7WRVEUx3E8m0kgECSTSZqm6xvqAwG/TqPBcEwsEfMJHGKxmGPZWCwmk0lpmuI4TiQSDg0Pzpk9p7SklKYohmFKS0t37NjpcrkEQkEkEvV43PPnz3c67Xk5eRAMj4yOupwuCAJ5GFej0SxetFAuk46OjytVar/Xl0wmzZac+++/n+O4S4rK8u6TQCB4++23Q8GwUqXkM/skErFao1IoFD5/wG53KhQKn88PQ9DixYuPnzyRSqY4jhOJRDyRUyqR4AIBBIEURfM5LzqtDkERmUwWT8S7urse+eMju3btmp6ejkajjY2NCIwkU+kHHvyVTqd32O1KlTKeSNTU1LA0debs2UgsLpZIMQzLy89PplM2m629tfXzLZ+98sorZ8+eRVE0mYy73B65XG42mzOZjN/vh2CYX8h9Pu8zzzzzwQcfKZVKtVajUCiUSqVSpQQAzmKx9Pf3x2IxoVCYyaTvvvvnxcVF27ZtE4lE0XD4ub/9TafLWrN2dXFRocGQLRZLFHIFw7A1tbUOp9NoMEEQbDabWYa2jo5WVlUHAoHt27auW7tm9959N9xw44rlKzZdsemuu+4ym81HjhzhjY+v6IMYRlM0ywIoiiIIbDKZeEYtCAJCoQiEoGQimUgkCSIjl8sxHOcAjqYZGEEpispkCIZhN23alMlkWJaRSmUwjOzcuQMEQBzHi4oKGIZKptJ5uXlSmUwkEk5M2JLJFMsyCIKsWLGivKy0p7evpLS4+WyLRq3p6eu/62d319XVXWiQXixkD0HQm2++GYtFIQhyudwKhRIEwRkzZoyPTw4PjwAAgOEYiiLBQGDZsqWnTp0mCUIul6vVao7jxCIRwAGpVCqRStIkmUqlo7EowzB8LjVF0+FQuKSkpLa29vjx4zKJJBwOR6IRn8+/c+fOabtdqVRSFElmMiiKQBBstphZlpXJpAgCsxzb19u3c9u2XTt39fUNkiQpkYgVcplEIpPL5RAEymQyj8dzzmlEUXRwcLCmpmrJkiWbN2+mKSYSCUcikVg0ykcxUqlULBbjKz898cTjzzzz7JkzZzVqFUFmZs6addU110xPTSUTicLCIoPBFI5EvH5/hiAqKyohEMyxWCYmxoqKCvYfOCiXytKZTDoREwrFQ8PWfXv3bNy0cd68eeXl5StWrGhraxsaGuKRTRzHSZLkRUEmkyEIGg6HaIosryj3+wNancbt8Vito5FQhC9Wo1ZrYASORqIMTZMkoVarh4aGN2zYoNVqKYqmKKqionzPnn3T01PpTLqxceapEyeXLGmKRqMYhhUVFppMRpVGLRJL5i+Yv6ypKZXOJBIJ+7QjlUpLpLLhkZG/Pv0U/3IvSTh4/lIwGPz73//OQ7mTk7ZwOJzJZMLhEIIgUqlUKBQSmXRxcUkiGdfpdLm5ObFYDMMwh8OhVCprZ8xYvGihSqMmMplINAoAgEQs4TiOryjHARzAAcPDw4899tiXX34plUrjiYTP5zMYskdGRrq7Ord++eXx48fdbldPd3d7e0c0GhPgArfbY5uY2LN7z3PPPjc9ZUsk4iAIVlVVrFixvL6hLpPJ2B3OVDppm5xMpzO8DcgwDILAEIIc2H/gt799GMfx06dP8zYQy7K8e8kn1jIMk59fQFH03r17MwRx9TVXa7XaLH323r17GxoaZs5shGD4vQ8//OLzL8+ePdvR3h6NRgvy85QqZTKVLi0r6+rqVmvUNE1zHAMh0Nj4+KaNG1UqVTQaSadTEATMnTvv448/JggCxbE0H20BQQiC1Gp1MBgsrygDYdDhsGdl6WPxuG3SxrIcCAEACFIkTdN0YUEBCIIAB4SjEaVaZZu0BYPB9evX0zRNUbRSqURRZOvWrRKxGIIggiRNZrPX5+UAFgQBnU5bXl5eV1dXWlIcjoSCwUAqnbBarVqNuq29rb6+4ac//dm5vUUvKWSPYZjL5UqlUnl5uV6vZ+HCeQvmz5dKJCdOnDx9tpmiGZVSWVRcYrFYzp49Mz4xXlFRYbVaJVLpT274yXXXXieXy3PzcmiKtI6MNDc3f/zJ5hHrKALD58QTRVG73b579+577733jTfeiMXimUwmFArl5uba7XaWZQkic+TIEZ1GFwiGnC6nABdotRqny1lYUDRn9iylXOrx+eLxBAhwb775VrYhe1lTE4ZhbW1tOl2WWCRKptIIDOMCfHx8QiAUEkTm+uuvP3z4cGdnZ0tLC1+iQywWEwSBoqhYLCZJEoKgZDIRj8cXLV60bNny3z38u+ramtlzZppM5lAwsnvvzoP7D/A10RiG3rFjezIe++WvHrRYTD09vfn5BZr/r70vj4+qPvc++5k1s09mkslCNrIAWSEkgYRdFtkEBFyx9pZqrRdF215ta1utva1Wq7XWbmKRHQRBpVbZIQkIISEJCdkXMvu+nnPmbO8fB8aYZQje+/7zvvn9wSecZM6c5fk9y/d5nu+j13V2dU+bPv1KQwMdpSmSRFEUhiEIggRi0xdeeGH79u0YhkG3hjJzMoWSpumkJKPX4w0EA+lp6RAERymapqIACHI8B4IQDwBEOALwAMdxDMuIxSI6GkVRrLW1VeiURxAoEAisW7futdde43m+s7N71qyZ58/XlpeXBwPhq5bGjIxMpVIZigR5jh8aMjMMHQyGZTKpy+NxOJw/+MGCMSkS4zH7IAjS1dWVnJw8q7xcKpXKpBJTsjEvd6pCqcRwPBIOO5yOcDjc0dEhpJcwDIcg6Jlntj3//I9QDDtz5szVhqvd3T3NLc36RP3f//633Kk5BEEAwmhT/laT8TvvvDN37lyFQiGXy+Ryuc1mhyAIwzGFQiGXJ1it9mstLVKZxJCYiKEoisJKhYKkiGg0StGMVK4oLimJRunERAPPgUePfYrA0JrVq3VardPpUioU0wryH3n4Qa1WQxIEjuNms/mpp576y1/+olKpaJrGcZzjOJKihGBbyIYQBEHT9JrVq3fu/BBBkKqKioG+/lAw6PV5r15tZBgaBDgO4BAU4Xnuetv1662tcrm0u7uTokgyQl5rbMrLy7NYbDwPuD2e2JxwBEH8fv8TTzyxYMECIkLgGC6k2yQSiVqtZhjWYjFnZmRYrVapRAYCPH+LdufWYG+lWgnCAE3T4VBYhItJgkyQy0pLSlRKlWA9aZpWKpU/+tGPfF4fy7LX29rTp2QcO/YJDCP6xMSBmwNnz531ef0tLa0wjOC42O8PGI3J5iGzXJ6wdOlSgiDG5CeF4ndOR6N0ztQcsVhqsznr6i/t3LX37LnzEolYLpdNzcnp7e0Rak8qyiu6unp+9KPnKisrLBbLkNmSmZVFEGSYIKrm1gQCYalU9vbbf8zNzYURBATBKEUJeszpdF68ePGHP/why7Km5KSCadPkcnl1dU1hcZHH41Gr1SqVyulwGIyGadOnmUwparV66dIli5cszs7JLSwskicos6fmLl269Mknn9i69XtOl9titTz6yMPPbn/W6/O1tLZ89dXluXOrhQBKLJWcOHHi73/72759+wSIlmYYjudomo5GowKBWjgcgWFIhIvPnj2blpZ64cL5tLTMxES9026z2x0QBHEcD/IAx3IABLk93mAgIkKlSUkmo9FUV1eXnp4OAJDH7QEBzm63C9U3twnWOASB33rrLZlcGolEhOrrgM8PwzBBECZTSjRK4ziOIKBWqxWLJQDPIxAMAIBcLk9MNAjFf0aj0el0ikQ4wzKlZWUgJKhhUBC+Rx99dMuWLT6fz2a3mYduGo3Gnu7u+vq66dNmiCS4y+1KTkp2uz0nT55EUaSh4bLH677vvrUZGRkkSY7ZSz2uzyE05Lz55pszZkyvu1gfCAZDoYjd4YhSdGJiIoqivT29BElKpVKapletXCmTy+67b53VYtUlJiIwajAmOpwOBEE5loNhlCSjxcVFcrn89OnTarU6Vu+Eoui5c+e+//3vEwRx+vQZkiAikYhOq9VqNF6vVy6XYygmkUpJkgAAsKOjQ5+YtHXr1p///KWGy5evt7X19fUlGg0NDQ0fffQRRZF5efkDgzf3Hzy4ZPESpSLBbLFIZLLBwcHKqsrOjk6e53CRqLa2trCwcPHixZ999hnHcTzHCZPeMAxLTNSrVAoEgYOhEMADhYXTfX5venp60B9AUfjUqZNfz/qGhHmOosWLFyckKFiev/zV5SlT0hAEtlpt7e3tHMdXVFTMmTMnEonEendJkkhLS1coVJ9++okQqdI0HQqFpFKpTpdotVoVCjnHsnq9TiqVCGR0CoUyKzPDaDREwuEoTff09iUlJweCAZ7lfvazn8tkstg0UOFsK1euTEhI+PKLL1Qqlc/nkyfIYRg5cuTjGTNmtLW13+jo1Om006fP6OnpZVnut//9u61btwqjNsbk5xh3dCjHcRqNZseOHRKJJDs7p662zm63kySVYjJlZWU1NjZSFIUgMATBUql0wYL5NTU1Q0ODGRmZLMP0dHV53K5wKOR0OgcGBtRqjdPh0ifqS2eWhYLBEydOiEQio9GIYRhBRGiaPnfu/J///Odz588NDQ1FIhGfzxcKhewOu9ls9vq8Xq/X5/M5HA6Kir700s9++9vf9ff3FRUXrV+/vrS0FEPRpKTkx77zHY1GGwqFZ1fMSjQYWlpaBWr9zZs2Hz9+PBwOlRSX9A8M0HQUx/Hjx4+vWrUqEAjYbDahDZChGQgEk0xJ6Wlpfn/gxo0bWq22unruwMBAQX4eLsJRDO3o6HA6XdAtOh+IZdmpebn3rrhXo9F8fPQIDMGlpSUHDx4wJZv6evtAECwoKLjnnnsIInL7oYMQBEciRFXVnObmltbWFrFYHBvQIRaLLRbz7PJZVquVYRmpVK5SqeRyeXJSUoJchmHIzZtDBEkqFEqe5wcHB2cUFj711FMURQkJ/ZgnRxDEvHnziouLT58+zfOAy+1JMiVpdfrevv6kpOTERIPH7T5//kJKSuquXbsrKipi8wDvQjgEKjuFQlFfX3/hwoVHt2y5UFsrFkllcpnT5ezq6jYYDcFgCOABDMOVCnl+fl5xcfHNm0MAD1BRKhIKISjq8/t9Xi/NsAkKhTxBRlGkxWJdee+9p0+f8Xo9VJRCUJQkSRiGPR6vxWL579/+du+evSAICiSQen0iSRI8CAq0fwzDfOc737HbbW3XW7c986xUJjt//qzb47k5dBNBkXA4HI1SEonoqyuX09KnyGTy9PS0Y58cK8jPhyCos7NTJBLl5+f7A4FQKIzj+MmTJx0ORygU4jhOpVJBEERHoxkZGRUVFXv37oNAcNasmT6vz+FwwiAkk8uSTUlTs3MsFovD6QRgCEbgnJypmzdvMplSvvziy6m5ueWzy//rJz9Zt+6+3v7+np4eGIaefPLJgoICiqIgCL7NeC8oHr6ysmr//n2CryMoaa1W43a5Q6EgisI4LrbbbXq9juf5SDjkdDoIggQAnqYZfyAYjVLhcGTz5s2LFy8ZPic2pj/C4XBhYWFZaekf3norFA63t7cFAoFgINjW1m61Wtwud1XVnEOHPpJKZYGA/3ZZyV2ODhVqBPfs2d3QcLWosBDDcKfD6fV6QsEgRVEogqqUSq/Xy/NsZkYGzdDBYEguT8BFoikZU/z+QFdn15DFrFFrUBjpH+hP1OtFIhEIgcZEo91uu3z5cjAQRFCUoiiO43Ecb21tzcvNW7Bw0ef/Oq5UqJwuJ8swUomUiBAoglIUOWPGjIcffuRf/zqu1Wq8Xu/+AwdnziqfUViUqNcUFxdNSc/KzMhITk7JyysAABDkgShF5efnmm/exHHckJhotzslUqlOq+vp7hb2qzBip7y8vL+/PxwJq1QqgiBgGPT7A2qNZt26df94f8eq1StBEKQZxul0lpUUFxUVpaenl5SUzJ83b+W99xYU5JnNZr1ev2fv3s8//zwpyTi7ouLDDz9Ua9Q52Tkvv/wyTdO3xeLrRVGUyZRsMpkOHDjAMIyApoMgAMGwTCb1erwSqUwsFl1taMBQNEKGYQQW4SJ/IEBFo4kGg8/rQ2D4zTf/IBaLhVTZiEJPCIIIktDr9UePHhu6OQgC4IMPPPiDH/yAZZimxsZgMLRp48aFixb6fN7h/Y9jCse4DimOYxaLuaGhwWAwHP7oIwgEWZZOT0tLS08ThpKAIKhSKWEYUqtV/X19r776KoZhUqn03LlzUSoaDkeUClVdXZ3dYROJRXa7HYRhq93udrtlUolcJlOpVCDHCzV1AuTw4osvTp82be196x1Op1qtQVFUIpEIlWMgAGzbtu348c8uXbpssdr9gcDTT/8wIzPDarGolZpwkLDb7fX1F0+eON3Z3ikTSzLSpxgNSRiK52TnXLnSMLO8gmYYq9UqcMNVV1e//MortbW1Z86cOXjwYGNj4+pVq4XfNjY2WSwWlVJJEKTD6SiYNu30mXNSqQxFsctXr8IIMqeycsmihRWzZiIIeOrUycamq80tjfdvWLd9+3axWHbw0EGZXKpWa1auXKlQKGKZtuGEbiiKejyedevWvffee4JqCYVCAqU6SZA6na6luVkqlaWkpPj9AbVSjaM4RVEiXCSTJVgsFvPQ0NNPP52TkyOEGCOmndyyLzwgFovz8/OE4+s3rN+4ceOjjz4iFAcZk5IEpPyO9OfIeMUcIpGooeGK0+nKzMxsa29PTk4WS8Q3btzQaDVikdhoNFIUZTQaHQ6HXJbgcDhLiosSlAkGo8HjdYM8lGgwUDSdaEiCESxBIU9QKkQiLODz8TzffqPTZrdnZWeFw5FQJCwkrIXy0hdffOHP7/3l3LlzKAJHo2Q4HAYAiAcAsUTcev16Y1Mjy3KrVq1WqRSnzpyJUkzF7PKCgoLr19tPnvqypaWJpKIyqXzKlPSHHtyoVsubm31lJWUMy/Ecp1GrQAg0my0ymWz37t0CXC0U7yuVyp07d0YikWPHjpFkFMdFX12+nJmdg8DY+XO1ubm5Lc0tyckGqURy7JOjVRVVHo8HFaEIjEAQnJ+bd625uaHh6pEjH+fm55lMSQxNBwLBhx9+eMTLGz6VF4KgYDD43e9+9/777z969Ohf//rX+vr6UCgCgQCKIFqt7lpTo1Qmk8mk/f2DNM2gGMrzQCAQCAaDq1avfvbZ7V6vd0RJ8wh2UBiG09LSQBAEIBBBUGGGiUardbtcWq12BHHxeFIyLs4BQfBXX12ORqNerw+GofMXLkyZMkUqlXrcnqGhIbvdHgqF3G4PQZBavS7ZlCKWStUq9eDgUCREKpSqjMwMDIWnTSvAcDw7KydBLnW5nIsWLTJbLb19fSkpKRiKpZhMPA+wPCcQ+OEi0ZUrl8+fO7t9+3abzRohSYZhaDqqSJAzDONyuwYHBxcsmF9aVvrb3/4uPS1jzeqVqalpNrt9z749p0+fcLndoXDQ7rBevFh36KPDPMvnTJ1qtlpzsrMcdjsEQSkmk8vtIklyyGKOEIRA1oAgCEmSFEXt2LGjpKSkr69PJBJrtfpzZ8/PKi9varp28VL90qVLurq6SZIsKio6d/4sLhZDENzR2dHe3nHw4EG/33u14cry5UtXrVzZ2dHV0tyybOmyjIyMGHgweqyRkJoQimq3bNly6tSpY8eOzptX4/F6nS43QRDJySkYhgcCIaVSmaBQoCjGsDSCIGVlZbt37RLorMakmI55pjzPBQMBnueLS0pKSkqEKQZCjU5ubu4EhwGO/RdCZUptbZ0QgIEgFI1Gmxobs7OzQRBEcYwHgQhJ+P1+lmXUao1YJL5yueHUqdNanZagSJ/fl5efl5JqSjYl1dTMJQgCRdFp+QUDA/2vvvprh90eDAYDfn9PdxcIAAAPgCAAAgDHsRiGvfjiC+XlM+fNX0ASJI6LCCICQzCGYRzHhYKhgoKCg4cOFhcVzphecPrMqayszJaWtt7ePhhFBF5HCAJBCPzqq8s3Orv1Oq1IhGdlZxMU6fN5c3KmhkJhmmasFotYJIo9HcErlEqlBw4cMBgMHo/HaEzu6+vt7++tqZ7b3dm9c+cumUy2Y8cHwtDrD3Z80H69vXB6UU1NzdTc3ORkU2FRoVKpfPONN7q7utRq9caNGwWupuF+4ugfBOTN4/FQFHXvvSs///xf7733nsFo9Hi9N7o6nW53lGZar7d1dXWZzWafz+/1emUymUiE3+anHnny4W4HwzBNTU1isfhvf/mrVCyBYbitrc3tcr322mvDhWN4pHMXIBgIgkIBYwww9fn8Ho872WSiqSiKosLZpVIpCICBQFAiEn918aJWq5k2vWBG4fSzZ8+o1RphREFmZkZSsunJJ596bMtjFvOQ0ZhYVVU5e/asKE1Ho1EYgoRiW5AHQRAkCGL7c9v/64X/0mp1ESLC8xxN0xKxJBwO6fV6CIba2zuyMjO7uzuKiopdLqfP54lSFASAsQpuAAJphiZJMlGvv369ZVrB9P7+QWOSUSyRADwAwaB5yDxiN8MwHAqF0tLSDh8+LBaLOI5RqhRdnZ0dHR3LVyzv7u6WSqUqlWrLlsctVmtJacmVhoZjR4/t37+vvr7+zTffunjx0vvvv+/1enU63cyZM2fNmhUMBic4p1N4zV6vNxKJPPbYY3V1des3bKAIMhyJOJ3Ohx9++Pz586WlJRRJgSDo8XhIkhp/Wgp4O/RA7XZHY1PTu+++W1Jc7PN7YRj+9NNPV61a/cQTTwj9dhOhqobitEM+9dRTQvpKSI0iCOT1eqIUpVQqeY7nWY5hWJKkRBLxkNkMIfDBQ4c2b3qgqbGJoekkvYFj2KX3LJXLZXV1tS/9/BftN9rTMzJMKalen29gYMDpcs2dOyc/P+92qlqQDUgkEjVdbfz000+2P7c9Eg5jGB6NUjAEsTQ9u3xmc/M1rUZrSErq6OwCeM7usEIwKBKJOI4HwVt8bQAHiEQinU47ODQIQ8hA/8DNgb6qysovvzwhlUlBnrfbLIJndes7bw2BQH0+7+zZs/bs2WOzWZ0OJwiBx44dc7vdLre7rf3G+g0bVqxYcebM2WAwWD23mmFZtUpZXFS4edP96elpWVnZ5eWzhSm1I8RiIpORhI4Vt9slwkV/ePPN9ClTeI7jWDY9PXXOnDmvvPIrDMMFUqvxoO7bXwQKRMJNjY3f2fLYli1bvF4PjmPBYDAhIeGdd/40gicyvk86LghGkVRubm5zc3Nffz+MIEqVal5Ntdfrc7ncKIrKZTKRWMSyNM0wjz66pb6+PhQOSiXy1tbmK1eu9Pf3Azx/7NjREydP/Otfxy/VXVy0ePGs2RVJyclGQ6JEKhV4ZG02e3KScW51tcvlZFkmRtWOIMiVy5d9Xm+EiEjEEgRBGZYuLi6USmWnTp1asnhhWmpqZ2d3Xl6+0ZAIgUBPd6/b4wZ4AAQAjmV5np9XPW/unEqSjHo87oGB/rlz59TXX2q7fh3FkIQEhU6fuGbNGoIgQHB48MbDMBQOhwsK8hcuXMjzwMDAoM/nZRg6Oyv7zJkzLa2tyUnG/Pz8CxfqvvzyhEKpVKnVZstQS3OrzWYPh8N2u83r9drt9vXr1wuE7mOKxfgD90AYRgiCMBgMMAJ/9smnAABkZmbde++9aempPq/v4sWLIAg+9thjw4HRUcOdeGH6rkQiXbZsGcuyAMBBEByN0rNmzVIoEoT84ujvvgucIxqN8jyHYejevXvD4VAoGJo/r3rZsmU+n7e3ty8cDgslXjCCEBFiw4b7SYI6d+6MPlEfDodVKtX58+d7enpYlhkYHGxtaV1x74rPP//82LFPhgZvchyXZEwKBAIEEZk6dSqKojabbeXKVc3NLZmZGQzDCsz5Ag7Isqzf749G6WiUqqysJEiyqak5MzMTRTG3y42LEYqk9DptUlJiMBiAEYRlWb0hccXyFZs2bkhQyJuaGju7utauXbtjxw6A5xmWSU5Kcjoc9923rrKyMhIZsQWFClSYIEiDIXHt2rVr1qxJSTF1dXb5fL7yWeUgCAwNmaPR6MKFC6urqwmCuHLlak9vr8fjjUYpgTkDRdFIJDJ9+vQY+WssQom9y/iKRMjCaDSaPfv2kgSRl5e/bt0almUhCN69e/e8efMef/xxIYMa5zwCaaxQ+iXkjAQWk9Fa7dsIB0VRUqnk6tWG1157zZRsstlsCILYbLaL9fUszy9ZsqhwxvSW1us8xzMMA4HQxs0P7N61k2NZgyERAECdXkfT9MDAIIqgc+bMuTl0MxgIPLD5Aa1OEwz4O250ZGZkJOp1DVcaCmcU3ujoJAhKoVD4/X6B/RgX4UItP89zVVVzLFYLx/HRKI0JBBBZWX19/TKZDIZRiUSu0WoVioSFC+anpqaVzSxdsnjJ3DlVNBNtbGxMUCiKior++te/9vX1L7lnidVqNZuHMBz//eu/F0o6xny+EAQxDB2JhLVaXU1NzSOPPKJQqK42Xu3p6XE6nf39/W1tbQ0NDW1tbRzHSiSSTRs3vvb67wiCFJoiWZZlGGbz5s1CF/wIhzHOnM5vXgC7Z/cev9//i1+8lJ2dA8PIlStXDh8+/M9//lOocxv9jkfMC2dZVvgu4RJ4/muu7WF/fGu0cawIfqI+B46Ldu/ezTAMQ9MAAFy71nzq1GmaYXEcT05OzsvL02hUHMegKPLZ8U8hGFywcDFJEiqlqqS0lCRJq9UaDoflsgSFQgkAfEVFxccff9Ta2mI0GKqqKiEYCkcijzzyUEdHZ0lJiUiEIQicaDQkGg0wAtM0g+EYQzMMw/7zn//cvXcPgqBDQ+b29nav15uZmeV0uS5evLh69ZrLVy52dnVwPDh4c8hoNBZOn67XaRqvXmm/3qrV6k+fOnPkyBGlQvnLX/6yq7uno6MzGAytWbM2PT19+PMdaxg7BMMISZJut4tlme9+9/GPP/74iy++2Ldv3/r164PBoJDUCIfDMpnsT396d/78he+///4zzzwjOAR1dXU3btyQiMW3Xw94V/6HgE0Hg8GysrLly5cLPcYul6umpqayslKgO7vjCJRR33uLmGXYccEG8bdnh4ETckiF7pq+vr6jRz/R63V2h10ml3E8F2UYGEZQFD1y5OjefQeCwTAAQDCMhMPhV371y1/+6leyBAVBEiAAUFRUIpFmZGQ899xz/QMDCIx03Oj43veeKMgvgGBQrVbWzKteu3atwWAsLiqWy2Ucx2dkZPj9/tTkFLVSZTQYWIYFQODHP/6J0WhYt/a+Xbt2eb2eQCCA49je3R+mmowMy1y92gCBiNvtrq2rFYsTrjW3nDx1hmU4mVxOs1z9xbpFi+YvW7pUJpcdOHDw5ImTEqlUIpE9/NDDAmnfiMGG36zKvzUrA0FQngeFcb25ublr167dv3//T3/6U0E4cBwfHLz55YkT0WiUJMk33njj5Vd+zfN8IBDo7uzEMIzjufGmmYyPX3E8zwkA1+OPPy5g5AJutm3btuG8DLG+mPG29+1IMzb2fMQHAQCAeB4EAKFnk5+QQyrw0gt58IQEud1uT0hQBINBCAQJggAhCIJgq9kcA/ZxHO/r61UqVRvWr9+xYwcI8mazmSCIOVVVvb09x48fr6goLywu6u/r1et0FeWVUpm8v+/m6TNnbTZbXm5eTnb2QH+fVqf1+/wMw3q8nqLikuZr16qr53744YfhcNDv98+cOTMjI3P37l0arRYCod7evqysLKvN1tTYtHDhwigVvVBfu2H9eotlqL+/r63thsfjmT59Wlv7jdd//ybLchaLJSsnWyaRzpw5c9u2bUL984gNHW+aFQTFmCmi0ejy5cvFYvG///1vwYprNOqVK1dGIhGWZctKy/bs2ev3+7dteybRkEhH6eH6KY4KidHzgSAIwxBJknV1dc8//7xQo8mybGpqak5OjlDaMxoyueNM8W+SlX8D24gzUgMabxaTSqUCQVCv18vlcpblcBwXKGPD4TARiShVKhzHY+ZNJBa9+cbrOp1u9epVTqcTw3CeByKRSG3dherqOUVFM86fO5ealpqVlRkI+A9+9NHrb7y5f/+Bv/39H6+99vqNtrZZs8r6BvqnF0yz2azTpk2z220AAOh0eoFFDcNQh8P+4IMPvPvuu+ahIZ1OT1HUV19dkkhEqakpv/71qwRFIAj8g6d+GCFIEIR4gDcYDYePfHzp0lfLVyzPz883JhkJgujo6FixYoVQsDNi78bgnHhBPwQJr8rlcv34xz/+zW9+I+zjkydPut1ugWRYqVRUVlZgGJaSmkIz9PCs2JgnH87nGRu6xnE8DEMvvPCCRqMRQh6GYbVa7Zh4+YjczQTnbt2+mDvcNTSm0LEsK9TSeTweiUQqk0lVahUP3KKaiNJRj8cT6+0U7BcEQj/72c+3bt0KQTCKYiAIYThOklRVZcUf3ny7rLSEZVmxSNzUdO3c+fMRIgTDEMdx3T1djY2NMrkcQSCdToOisMGg8/u9AABIJGJhFB4AgBiGuVyurVu3Pvf8c9dbW2UyGc/xX/77i3nzaiorK0+cOJmXm5+fX7Br974rDU24SNTT05uamrpmzVoRLrp06VJXV5cQ+1y4cF5Q3XccjxpnMqYw0OMnP/nJ8uXLBfxKgLyEjyxdujQlJUWtVjM0c0cPY/ic3mGxBodhIqHX/Lb08NFoNGb47jiecSKKZNi847uEz4V2N41GA0GwyWSCIEgmlSEQHIlEyAjBA4Ber6coKhwOQzAEQpCQVm1vv37w4KFnn9lOkiSCIBiKpaelWSwWoactEgrJE+RdPd0USSG3Ou9AhmXMdgtNMyZjUnNLiynF1N3dA0OIQJ0m3AAIQkIlnMfj+c2rv/nPbf8ZDAZJigoEQ6dOnoAggGXYtuvXl69YvmH9OrvdfmD/QYvF2t8/8Mc//vHw4cNujweGEYDjEQQ5dOijtrY2qVQy5kjlEc89/thljuM2bNggjHtSqVRClEiSZFlZWU1NjRBGThBrink5w88/onQPBGPDiL++tvg+x7c4MiHNIfR9MwzjdrsVCsXQ0FBHR4dA8zCrfPa0/Ok5U3PWrl2bPiUdw3FAmCHFcziO79ixQ6lSzp1bxTDRjMwMhULucNhzcrJtNodSqfB6PRiGcywbk12eBxD4VvinVmtvDg4pFEphEM7XamkYGVIoFH755ZcvXbr0yiuvFBUVNTY1DQwMQBBcW1f7p3feCYVCmzbe/+yzz2o0Gr/fp1SpQBBmOT4UDAqWMRAIfPDBBzguFiK9u9Ucsd8KNALV1dUikUij0UilUsEDo2lar9c/9thjcRCw8f474udv4pi3/uX5WwIxXlZl4mHRtx9XzjBMQkLC/fdv6O8fqKurCwaDMpl02bJlGo0md2r2rFmlKSaT3+/feP/G/Lz8jIwpQq8fDwIgBP7+969Pnz5d6AsNBIK5uXkWiy3ZZKJpBkHQ8pllep2OpmmBYS0hIWHmrHIiFA74A8FgsLi4hIpGbQ7b7bwUONwlFB6Fz+dNSTG9+OKLZ8+effutt1AUE4vFGrXa43YdOXLk92+88d5779VeuOB0urwe770rV3zx789f+sVLPM+Fw2EURXfu3NnX1yMWi/lha7zc6ZgPVBBTiqJMJlNpaWmsJDZWmFJcXCz0wY5+VeP4oXewAsO0Cx/nZcf3mSZug+5cCcYwTEVFxZkzp3t7+/Q6/ZJ7loZCQY1Wq1DIKTICAmBWdvalry5nZWaKMBzFMPPQEARCEAQ5HM4bN25QFOVyuWiGTUlJPXHyRHl5eU9PryklVaVSlpSU8ByHYkhWVvbyZcvz8/O7uzpAAJLIpP0Dfa3XW+Uyucfjeeihh2bOnEkQ5De9aF7orwyHwzAMVVVVbd60ubSsNC8vV6vV4jhus9lJkoRgiGFYgOc/3LVrTlVVTfXcmpqa5uZmq9UWCgXLyspKS8uG19iN+QrHGs/+DSIeqVRqtVqVSuWCBQsikUgsAhKw7eFn4+9o3seXoRGve4TcjOl/TAS2H3GPYyKk47IJ0jSt1Wr/8Y9//PhHP/6P7/1HW3t7UpKRIgkcw03JJpplbg7dxFAchuFAIECQRO2FCwIRVIyuWiQSAQCwaNEi89BNiUQ8fcYMnU5HM9HUlBSZVOJ2uxEEwzARz3OdnR0gCB899klpabHV4ag7X5uVlXX27FkBcIyjGgUgVSIRQxACAABNR2tr6x588EGLxYKLRRRBbti4cc+uXR6PS6vV+nyBxYvvaWq6umvX7s2bN8VmOk1kH49psDEMM5vNwWBw6tSpsdbzMT8yEeEYDzyduPsZY4+9WyUh9HeNnpoAxf8aq9Uqk8s+O/4pw1AoAut1Op1Wm5mVlZuXt2bVmkULF6IIAoI8iiIZGVOEoDfWrE3TNMMyXT3dKrVGq9O3tLbIEqROp8NsMd8cGmIY1ulwBoL+xsZGs9kyMDBQXl4ejpANDQ0cz7766q+VSqXQzz3+ywNhGGFZzu8PeTwet9sTDAbmzZt37NgxnU5HESSG48eOftzQ0KBUqpxOp1qtfuaZp2+j5nx8CRgv0B1uhiiKMhgMOTk5Y/L1jMqlj3RpJ/juh7tB8d3P0UI8/CP/Ow7p8MsaHBx0OBxZmVkZUzI8Xi8uEmdl5+w7cODFn/7sd6+9FolE9Ik6qVTKc6xMJk1KSgLBr2+GY9lolJZJZY2NjdOmTW9tvd7R1hH0B8Ph8Of//oLjOH8g0Ha9DUZQqVTa3t7W19dTX18rwvDvb31i+YoVHo9nxM4e/WRvF62BMAwhCIwgmNvtLCoqOnTokFqtYRmGIqkPPvgAw3AUxYLBwLJly/T6RIqiRqvMO8IeI5S5sAdivQV33Jo8wMePYMdzGib4ZxM/1URc0TvQPgn3O2Q2y+Ryg8Ew0D9QXl5hSknp7Oo8evRjgAd6u7tJIvLs9u0cy5FEBNQoBwdvsuzXzPsQgkQJor293e/z9fb1zpxV7vP7gwF/IBisqJh9+uxZjVqtUqnDYaKvb8CUktradh1DMa1W99JLL4WCodEmMI43wPO3LhhBMJ/PW11dfejQwbVr7wsE/EIbNwBCNM1oNNo1a1YP9zdHZ01jW3BMn2OECRgzATYG2DWMWHw8n1SwSiN0wAQNRJyU74gbvKtEDzS+9AEAAJQUF4tEosGbgyq1qrPrBopAXq8X4AEcF0EQ5HK7g4Ggw+mwWm2JOqPL5UFRJDacjCSI2RWzX3zhhaysrH379nvcnv7+/qq5Vd3dvf86/oVKpRoYvHns2GdWu91gMLS13wABKBql3377bYEeL86lj94Ww4FCBEGdTtf8+fO3fv97PM8jCDy8eO7+++9PSjLGktfj7cIxQ5WJ7LwxbRM4MXhqtAkYAbBOENUYYU3GM5ffMpSNhfKPPPQwQ0VFuJgHQJlMBsNQfn5+UpKJokiO4+bOrdZotVKpVK1W+vwBEASFFJSwNm3adPijw88//3xtbe0z27a5nM5r15r37N4/Z05VampKf98gAiFTc3M5lq2vr1erVFar1WAwFBUVCWP04sOU44nObaI6JBQK/ufTT8vl8qA/GMukhcPhsrKykpKS4QVRd+W+3dXDvaPMTRD8jhOAxEHl/4dxbLxoBQB4hqFVKvXq1WvsNltBwTRchOdPy09LSXW5XJcuXdTrNDMKizs6ujo6Ovx+L45hxz//t16nX7hoYW5eXnFhUU1NTTQaJQgCx3GZTDY4OLhnz563337bZrNlZWWaTKa+3r6BmzcBnp+SPqWvv0+IL44cObJq1apYneNwrThaWwxXwsP/AARBmo5qNNrnn3+urq6+trbW6/UOr/iNjweM9u/GNhbjhJRxVFEcJ2bigdK3E8fRhjJ2RAjLJzrjTQgTOI6XSmUul/PkyZNTp+aEwsH+3n6O42RSSXVVlUQiaWy8arc7OB5Qq1Tnzp9PTEy6cOH8A5sfqKqsTE1NDQaDHMcJLK3hcFguly9YsOC++9Y5HPZz587fNJsBAOA57v333//Tu++AIHD61GkQBHmeXb1mbTRKD/dtR8RpEyuZgXmez88vuHjx4pIlS8Yvyo2nHoYb/jEN2Yhrm0h0Gsc0jDhJfMM63t74dkri7tohBdUt5CEPHz5itdmMRiNNs1abDeD5y5evNDY1MywbpRmOY681N0skkgMH9iclJfl8HpKgonQUvk3VIlB3CyKiUqk2bdoEgODp06cAHoxGqbVr15SWlsyrqeF54OzZsyiKPLD5gdEdHyPSzcPzzqNTSrGRIEqlMj8/XyKRCNtiPFxrvFz2mP8dne8e89rGc5/H6wYYfZI4ZnQ0fD7mp8Y7PvrImCn7O8yyF6Ce48ePb9u2LT19ij4xEUNRh8MuT5BJpTK7zabXJ3Z3d0MguHff/tTUFKFsKY6wC+ihSqV69NFHd+7cCQDAunXr9u3bGwwExFJZXn6eKcl06tTJWGl//Oh/vJ0dey5CuUkspTl6b40ZrfwPNXkc0zDa/AH/N9cIV3dMi3nXINjw50tR1Pr16z/c+WF3d7fDYbfZrCmmZCIS8fv9U6Zk2mw2k8n02WfHk5KMfr8PhsH4z0gQnXA4/Prrr+dPKwBB0Gw20zTDsjyOYfPnL1CrNCiK8jwX3zkYnn+K3fCInSocJwgiliCNH4PEMfxjfnyCsNJ4EvktcMxvLZTxc0bfIpTlY2GLw2Gfv2D+D558svbChWvN1z7++Fhzc6vdZj906ODq1auPHDmCYmg4HIZhJFaUFudyhayVTqd75+0/8jyfkJCAoqgwduaexYuzczKHR39x7iSOszZiLs5oDGOCIME3zgmORFXjBAV3hBO+hc74FsI02vyBIHhHDG2imuMWUoYgLMtMyZgCgqDP63vo4YfeeecdiUTi9/uXLFlMEITA7R2nKG3ErxAE8Xq98+fPr6qqEtrpQBCMEJGKiorVq1cLFZrjmefxTH589zD+24pjrb9pp+/QPziRvN0dvz3+8YlH4PH31US01x01Bx8r/5k6dSqGYwAAlJWWrV+//sGHH5JKJQqFYjgqOiZYOybmLSQ2n3rqqYQE+e3gk1apVKWlpUJpeMxkjIfw3FWGesxAdLzqjXHzEfyENPyY2ZP4OY5vHUndrSWKkzS4C/h8uMcKghBJkpmZmSaTaaB/oLC4kGXZYDBYXV2TnGzyeDzD3+UE3xYMw5FIpLKywufzxBoFBHrQ/4lXOPHQccRri1OPOewIGP9s8WuF7vaO7urvx4QxRujRsQVr/CoR5I6PWPiZYViVSpWTnaNIUEwrmAaCoF6r27RpUxztfcfFsqxCobz//k2js5p35WSMeCvjJS9uPSAQgOK+43FxlDvl3eP4FqMlb4RDMNy/niACdkdQZCKAkFBrwkP8mLc2LnnLiJMKRwoLC0EQxDDM4/HMmzdPJBIJZf53vy2+rogU4KkR9znBXo/xoo/x4lLhzKzgNsc9YewJxM/jT6R+LE6yfrTEjBb0iVeJjrlVYicZR+J5HgQFQukJwecMw8Ra+YafRCQSXb9+HUXR7OxskiSFUXUjymjvRnPww/TaXa9vUdISCzoAjp9g4cxE/mYETDlxexHHj/52Ue5o7GfMOxp5nSDA84AIxycEgk2uyXWHaCW+bpxc/z+sSc0xuf6XNMfkmhSOyTW5JoVjck0Kx+SaFI7JNSkck2tSOCbXpHBMrknhmFyTwjG5JoVjck0Kx+SaFI7JNbkmhWNyTQrH5JoUjsk1KRyTa1I4JtekcEyuSeGYXP8vrP8DGh4PTodnpeoAAAAASUVORK5CYII=">
<script>
(function(){
  var m=JSON.stringify({
    name:'Equil',
    short_name:'Equil',
    start_url:'./Equil.html',
    display:'standalone',
    background_color:'#0f0f0f',
    theme_color:'#0f0f0f',
    icons:[{
      src:"data:image/png;base64,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",
      sizes:"192x192",
      type:"image/png",
      purpose:"any maskable"
    }]
  });
  var b=new Blob([m],{type:'application/json'});
  var link=document.createElement('link');
  link.rel='manifest';
  link.href=URL.createObjectURL(b);
  document.head.appendChild(link);
})();
if('serviceWorker' in navigator){
  navigator.serviceWorker.register('./sw.js').catch(function(){});
}
</script>

<title>Equil</title>
<!-- v2.35: Fonts loaded via <link rel="stylesheet"> instead of @import inside
     CSS. @import inside a stylesheet is a render-blocking sequential request
     (browser downloads HTML → parses → discovers @import → downloads fonts
     CSS → downloads font files). Using <link> in <head> with preconnect lets
     the browser kick off the font connection in parallel with HTML parsing.
     Eliminates most of the FOUC drift between Chrome / Brave / DuckDuckGo /
     Claude in-app browser. -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Abril+Fatface&family=IBM+Plex+Mono:wght@400;700&display=swap">
<style>
:root{
  /* Dark theme */
  --bg:#0f0f0f;--bg-secondary:#1a1a1a;--bg-tertiary:#151515;
  --text-primary:#f0f0f0;--text-secondary:#b0b0b0;--text-muted:#555555;
  /* Neon accents */
  --cyan:#00d9ff;--cyan-bright:#00ffff;--magenta:#c400ff;--magenta-bright:#ff00ff;--purple:#9d4edd;
  /* Transport button accents — green for play (leans cyan), red for record
     (leans magenta), so both blend with the neon aesthetic while clearly
     signaling go/stop. */
  --green:#2afc8a;--green-bright:#5cffb0;
  --red:#ff2a55;--red-bright:#ff5577;
  /* Legacy compat */
  /* [v3.94] --bk back to fully opaque #151515. v3.93's transparency
     hack was a workaround for pace boxes painting under the cyan
     vignette pseudo-element. v3.94 fixes that properly by extracting
     the vignette out of .grid's stacking context, so pace boxes can
     sit above it. Cells can be fully opaque again, and the gaps
     between cells reveal pace boxes underneath because the GRID's
     own background is now transparent (see #grid inline style at
     render time). */
  --w:#f0f0f0;--bk:#151515;--br:#00d9ff;--ac:#c400ff;--bl:#9d4edd;--gn:#00d9ff;--mu:#b0b0b0;
}
/* [v4.48] Light mode — applied when body has class .light-mode. The
   theme is a warm parchment/cream feel per Sam's mom's preference for
   "yellowish off-white". Variables are overridden so any CSS or inline
   styles using them retheme automatically. Inline styles that hardcode
   colors (rgba(0,217,255,...) etc.) won't pick this up — those need
   per-site adjustments in JS render code (see _lightModeOn checks).
   This first pass focuses on the main play surface; modals/win card/
   settings panel may need polish in a later version.

   Palette rationale:
     bg / bg-secondary / bg-tertiary: cream tones, slightly deepening
       for layered panels.
     w / text-primary: dark brown-tinted near-black so primary text
       reads warm against the cream.
     bk: cell wrapper bg in dark was #151515; in light it's a slightly
       deeper cream so wrappers still read as a frame around pills.
     cyan family: deep teal (#0e7490) since neon cyan is unreadable
       on cream; still recognizably the brand cyan.
     magenta/purple: deep purple, darkened for legibility.
     green/red: status colors darkened. */
body.light-mode{
  --bg:#f4ecd8;--bg-secondary:#ede4cc;--bg-tertiary:#e6dcbe;
  --text-primary:#2a2418;--text-secondary:#5a5040;--text-muted:#8a7d65;
  --cyan:#0e7490;--cyan-bright:#0891b2;--magenta:#7c3aed;--magenta-bright:#9333ea;--purple:#6d28d9;
  --green:#15803d;--green-bright:#16a34a;
  --red:#b91c1c;--red-bright:#dc2626;
  /* [v4.59] --bk in light mode set to match --bg so the op/eq/given
     cell wrappers (which fill their full CS×CS slot with background:
     var(--bk) and show as a visible frame around the inner pill)
     become invisible — pills float directly on the page. Sam wants
     to see how that reads. Cell pill bg layers (which composite
     alpha-tinted rgba over var(--bk)) also pick this up so the pills
     stay opaque against cream rather than against the original
     deeper-cream wrapper color.
     If this doesn't read well, revert by setting --bk back to
     #e6dcbe. */
  --w:#2a2418;--bk:#f4ecd8;--br:#0e7490;--ac:#7c3aed;--bl:#6d28d9;--gn:#0e7490;--mu:#5a5040;
}
body.light-mode{background:#f4ecd8;color:#2a2418;}
/* [v4.48] Light-mode lattice: deep teal at low alpha instead of
   neon cyan. The lattice is off by default in v4.47+ but if turned
   on, it should be visible on cream not invisible. */
body.light-mode .grid-lattice{
  background-image:
    linear-gradient(to right, rgba(14,116,144,0.18) 0px, rgba(14,116,144,0.18) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14,116,144,0.18) 0px, rgba(14,116,144,0.18) 1px, transparent 1px) !important;
}
/* [v4.48] Toolbar buttons (UNDO, theme toggle, TIMES, COUNTS) carry
   hardcoded cyan rgba inline. Override via attribute selector so the
   cream theme reads correctly. */
body.light-mode #undo,
body.light-mode #themeToggle,
body.light-mode #_dbgTimesBtn,
body.light-mode #_dbgCountsBtn,
body.light-mode #_dbgDevBtn{
  background:rgba(14,116,144,0.12) !important;
  border-color:rgba(14,116,144,0.55) !important;
  color:#0e7490 !important;
}
/* [v4.49] Bank tile styling for light mode. The .bt rule has
   hardcoded color:#c8c8d0 (light gray) and border:rgba(0,217,255,0.5)
   (neon cyan) which read as washed-out / desaturated on cream. Light
   mode swaps both for a saturated dark numeric on cream — same
   approach as cell text. */
body.light-mode .bt{
  color:#2a2418 !important;
  border-color:rgba(14,116,144,0.55) !important;
  box-shadow:0 0 4px rgba(14,116,144,0.15) inset !important;
}
body.light-mode .bt._btMain,
body.light-mode .bt ._btMain{
  color:#2a2418 !important;
}
/* [v4.52] Pace stats colors in light mode. Inline-style colors on
   the spans (#c400ff, #00ffff, #4a8fa0) are bright neon — on cream
   the avg's #00ffff reads as washed out. Light-mode palette:
     BEST:  #7c3aed deep purple (darker but still magenta-leaning)
     AVG:   #0e7490 deep teal (still cyan-leaning, distinct from worst)
     WORST: #355e6b muted blue-gray (darker than avg, less saturated)
   Order of distinctness: best (purple) clearly different; avg vs
   worst both blue-cyan but avg more saturated/lighter, worst more
   muted/darker. */
body.light-mode #paceStatBest { color:#7c3aed !important; }
body.light-mode #paceStatAvg  { color:#0e7490 !important; }
body.light-mode #paceStatWorst{ color:#355e6b !important; }
/* [v4.52] Debug template-name label (_dbgTplLabel) by the UNDO
   button. Inline style sets cyan via rgba(0,217,255,0.55) which is
   bright on cream. Override to a deeper teal at similar alpha. */
body.light-mode #_dbgTplLabel{ color:rgba(14,116,144,0.85) !important; }
/* [v4.53] LIGHT-MODE GLOW SOFTENING.
   In dark mode, glows are neon-cyan radiations against black, which
   read as the brand "this thing is electric" feel. In light mode the
   same glows on cream read as bright neon halos and look out of
   place. This block reskins the major glow surfaces so they read as
   subtle drop-shadows rather than emissive halos.

   Pattern: replace `rgba(0,217,255, X)` shadows with
   `rgba(42,36,24, Y)` (dark brown-near-black, same as text color)
   at lower alpha for a soft "this is a card sitting above the page"
   feel.

   Coverage:
     - .mast bottom shadow
     - .gscroll outer + inset glow
     - .bt inset glow
     - .wcard outer glow + #winSplitBtns pill glow + headline pills
     - .sel-mast / .sel-btn.on / .sel-play / .pro-btn variants
       (menu screen elements; lower priority but trivial to add)
     - .seq-btn variants (sequencer remnants visible on bank toolbar)
     - #mastTimerWrap text-shadow (the cyan timer glow)
   Inline cyan text overrides on the win card header pieces. */
body.light-mode .mast{
  box-shadow:0 2px 8px rgba(42,36,24,0.10) !important;
}
body.light-mode .gscroll{
  box-shadow:0 0 4px rgba(42,36,24,0.08), inset 0 0 3px rgba(42,36,24,0.04) !important;
  /* [v4.73] The two horizontal dividers above/below the puzzle board
     are .gscroll's border-top / border-bottom. The base rule sets
     them to rgba(0,217,255,0.5) cyan, which on cream reads as a pale
     washed-out line. Per Sam, keep them dark/defined like they look
     on the dark board. Deep teal at higher alpha gives a crisp
     divider on cream instead of a faint cyan one. */
  border-top-color:rgba(14,116,144,0.7) !important;
  border-bottom-color:rgba(14,116,144,0.7) !important;
}
body.light-mode .bt{
  box-shadow:0 0 4px rgba(42,36,24,0.06) inset, 0 1px 2px rgba(42,36,24,0.08) !important;
}
body.light-mode .wcard{
  box-shadow:0 6px 20px rgba(42,36,24,0.18) !important;
}
body.light-mode #winSplitBtns{
  box-shadow:0 2px 8px rgba(42,36,24,0.15) !important;
}
/* Win card cyan text → darker teal text. Selectors target the
   inline-styled spans by ID so they win over inline. */
body.light-mode #winSizeDiff{ color:#0e7490 !important; }
body.light-mode #winHeader > div{ color:rgba(14,116,144,0.85) !important; }
body.light-mode #winHeader > div > span:first-child{ color:rgba(14,116,144,0.70) !important; }
/* Win card buttons — text color and divider already use var(--cyan)
   which themes via the variable to #0e7490 in light mode. The
   divider stroke (border-right rgba) needs explicit darkening. */
body.light-mode #winMenuBtn{
  border-right-color:rgba(14,116,144,0.4) !important;
}
/* Mast timer text-shadow → soft brown shadow instead of cyan glow */
body.light-mode #mastTimerWrap{
  text-shadow:0 1px 2px rgba(42,36,24,0.20) !important;
}
/* Sel-screen (start menu) — same softening for the bigger buttons */
body.light-mode .sel-mast{
  box-shadow:0 2px 8px rgba(42,36,24,0.12) !important;
}
body.light-mode .sel-btn.on{
  box-shadow:0 0 6px rgba(42,36,24,0.10) !important;
}
body.light-mode .sel-play{
  box-shadow:0 2px 10px rgba(42,36,24,0.15) !important;
}
/* Sequencer buttons (remnants visible in toolbar / debug areas) */
body.light-mode .seq-btn:hover,
body.light-mode .seq-btn:active,
body.light-mode .seq-btn.playing{
  box-shadow:0 1px 4px rgba(42,36,24,0.15) !important;
}
body.light-mode .pro-btn,
body.light-mode .pro-btn:hover,
body.light-mode .pro-btn.active,
body.light-mode .pro-slot.active{
  box-shadow:0 0 4px rgba(42,36,24,0.10) !important;
}
/* [v4.54] Masthead buttons (←, ‖, NEW, ⚙) carry inline
   box-shadow:0 0 8px rgba(0,217,255,0.3). Replace with soft brown
   drop-shadow so they read as buttons sitting above the page rather
   than glowing. */
body.light-mode #backBtn,
body.light-mode #pauseBtn,
body.light-mode #newp,
body.light-mode #optBtn{
  box-shadow:0 1px 3px rgba(42,36,24,0.18) !important;
  border-color:rgba(14,116,144,0.55) !important;
}
/* [v4.54] Tile-controls-row buttons (TILE ADJUST, ×N, ####, ###).
   The .tile-controls-row > button CSS rule has
   box-shadow:0 0 8px rgba(0,217,255,0.3) for the inactive (cyan)
   state. Override to soft brown drop-shadow in light mode. */
body.light-mode .tile-controls-row > button{
  box-shadow:0 1px 3px rgba(42,36,24,0.18) !important;
  border-color:rgba(14,116,144,0.55) !important;
  color:#0e7490 !important;
}
body.light-mode .tile-controls-row > button.active{
  box-shadow:0 1px 3px rgba(42,36,24,0.18) !important;
  border-color:#7c3aed !important;
  color:#7c3aed !important;
  background:rgba(124,58,237,0.10) !important;
}
/* [v4.55] Pause icon spans — the two vertical bars inside #pauseBtn
   carry inline `box-shadow:0 0 4px rgba(0,217,255,0.6)` (a glow on
   each bar). The v4.54 #pauseBtn override only hit the button, not
   the children. Drop the inner glows in light mode. */
body.light-mode #pauseBtn > span{
  box-shadow:none !important;
}
/* [v4.55] Win card PB bursts (#winBurstMoves, #winBurstTime).
   The yellow #ffd84a stroke + text on cream is barely visible.
   [v4.57] Reverted v4.56's amber color swap — Sam wants the original
   vibrant yellow preserved. The contrast is achieved entirely via
   denser shadow now: a layered drop-shadow stack that creates a
   "dark glow" outline behind the yellow. Each layer adds outline
   contribution without compositing under the strokes (drop-shadow
   only shadows non-transparent pixels).
   Also keeping the v4.56 font-size bump (16 vs original 14). */
body.light-mode #winBurstMoves text,
body.light-mode #winBurstTime text{
  font-size:16px !important;
}
body.light-mode #winBurstMoves,
body.light-mode #winBurstTime{
  filter:
    drop-shadow(0 0 1px rgba(42,36,24,0.95))
    drop-shadow(0 0 1px rgba(42,36,24,0.95))
    drop-shadow(0 1px 2px rgba(42,36,24,0.6)) !important;
}
/* [v4.56] Menu screen — version tag and stats button. Both carry
   inline rgba(0,217,255,...) cyan styling. In light mode they read
   as the neon cyan we're trying to avoid. Same deep-teal swap. */
body.light-mode #_seqVersionTag{
  color:rgba(14,116,144,0.7) !important;
}
body.light-mode #statsBtn{
  border-color:rgba(14,116,144,0.55) !important;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;user-select:none;}
/* v2.35: Cross-browser normalization layer. These rules prevent browser
   defaults from drifting between Chrome / Brave / DuckDuckGo / WebView /
   Safari / etc. on mobile.
   - text-size-adjust:100% prevents iOS/Android Chrome from auto-inflating
     font sizes when the page is "unreadable narrow" (small landscape etc.).
   - font-smoothing pins the rasterizer mode so antialiased glyphs render
     at consistent weight across rendering engines.
   - text-rendering:optimizeLegibility enables kerning + ligatures uniformly.
   - tabular-nums on the body keeps digit widths consistent (1, 2, 3 all
     occupy the same horizontal space). Critical for the puzzle-cell
     numbers and the bank tile numbers — without this, "11" and "23" can
     have visibly different widths on browsers that fall back to a
     proportional font before IBM Plex Mono loads. */
html{
  -webkit-text-size-adjust:100%;
  -moz-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-feature-settings:"tnum" 1, "kern" 1;
  font-variant-numeric:tabular-nums;
}
html,body{width:100%;overflow-x:hidden;background:var(--bg);}
body{font-family:'IBM Plex Mono',monospace;background:var(--bg);color:var(--text-primary);min-height:100dvh;display:flex;flex-direction:column;align-items:center;overflow-y:auto;}

/* [v3.84] Ghost-runner bar — sits directly under the masthead and
   shrinks symmetrically from both edges over the user's best time
   for the current template+size+diff combo (with fallback to the
   broader size+diff best if the template hasn't been solved yet).
   Last quarter of the duration ramps glow + saturation.

   Visual: a thin cyan bar centered horizontally. Width is the visual
   "remaining" of best time. We achieve symmetric shrink by setting
   transform-origin:center and animating scaleX, not by changing
   `width` — that gives us a single GPU-cheap property to animate
   and keeps the bar centered without a wrapper. */
/* [v3.90] Top ghost-runner bar is temporarily disabled in favor of the
   grid-edge boxes. The .ghost-bar-disabled body class hides the bar's
   container outright via !important so the JS state machine can keep
   running and writing transform values harmlessly to a hidden element.
   Static "Best time: X:XX" label below the bar is still allowed to
   appear — we're keeping that visible since it's useful regardless
   of which gauge is active. To re-enable, just stop adding the body
   class in _initGhostBar. */
body.ghost-bar-disabled #mastGhost{ display:none !important; }
#mastGhost{
  width:100%;max-width:520px;height:3px;
  flex-shrink:0;position:relative;overflow:hidden;
  background:transparent;
  display:none;  /* shown only in chalant mode w/ a known best */
}
#mastGhostFill{
  position:absolute;left:0;top:0;right:0;bottom:0;
  background:var(--cyan);
  transform-origin:center center;
  transform:scaleX(1);
  opacity:0.45;
  box-shadow:0 0 0 0 rgba(0,217,255,0);
  /* Short transition keeps the bar tracking the rAF-driven scaleX
     updates closely while still smoothing out tiny frame jitter. */
  transition:transform 0.08s linear,
             opacity 0.4s linear,
             box-shadow 0.4s linear,
             background 0.4s linear;
  will-change:transform,opacity,box-shadow;
}
/* Final-quarter intensification — class added by JS when remaining<=25%. */
#mastGhostFill.intense{
  opacity:0.95;
  background:#7dd3e0;
  box-shadow:0 0 8px 1px rgba(0,217,255,0.55);
}
/* [v3.87] When the ghost-runner bar is showing, drop the two cyan
   lines that would otherwise sandwich it (the masthead's bottom
   border above, the gscroll's top border below). Without these
   neighboring lines, the bar sits alone in a clean band of
   background — much easier to track in peripheral vision as it
   shrinks. Body class is toggled by _initGhostBar in chalant
   when a best exists; cleared otherwise so all other screens
   keep their normal framing. */
body.has-ghost-bar #mastStats{ border-bottom:none; }
body.has-ghost-bar .gscroll{ border-top:none; }

/* [v3.90/v3.93] Grid-edge pace boxes. Three concentric rectangles
   inside .gscroll that shrink toward the center at independent
   rates, each completing exactly when elapsed time crosses its
   target. Horizontal and vertical edges have separate transitions
   so all four edges meet at center at the same moment regardless
   of the container's aspect ratio.

   [v3.93] Boxes drop BELOW the grid cells in z. Cells become
   slightly transparent (--bk → rgba(.., .82)) so the lines stay
   faintly visible when passing under cells. Base box opacity
   bumped 0.18 → 0.30 so the see-through portion under cells reads
   as "barely there" rather than "invisible." Reads as "behind the
   action" rather than overlay-on-puzzle.

   Visual hierarchy:
     best:  outermost,  weight 2px,  brightest cyan
     avg:   middle,     weight 1.5px, dimmer cyan-violet
     worst: innermost,  weight 1px,  faint amber
   Inset stagger (best=0, avg=3px, worst=6px) keeps the three rings
   visually distinct at t=0 even though they're all "at the
   boundary." Low base opacity so they don't dominate the puzzle;
   each box gets a .pace-intense class in its final ~20% of life
   that brightens it. */
#paceBoxes{ z-index:0; }
.paceBox{
  position:absolute;
  pointer-events:none;
  border-style:solid;
  /* [v3.93] Corners rounded — 6px is "somewhere within" the
     1px–10-billion-px range Sam graciously gave me to work with. */
  border-radius:6px;
  /* Top/right/bottom/left are set inline by JS each frame so
     horizontal and vertical edges can travel at different speeds.
     Transition durations are also set inline (per-axis) at start. */
  top:0;right:0;bottom:0;left:0;
  box-sizing:border-box;
  /* Opacity ramps via JS-applied .pace-intense class. Box-shadow
     ramps with it for the glow effect Sam asked for. */
  opacity:0.30;
  transition:opacity 0.45s linear, box-shadow 0.45s linear;
  will-change:top,right,bottom,left,opacity;
}
.paceBox.pace-intense{ opacity:0.85; }
.paceBox-best{
  border-width:2px;
  border-color:#7dd3e0;
}
.paceBox-best.pace-intense{
  box-shadow:0 0 6px rgba(0,217,255,0.55),
             inset 0 0 4px rgba(0,217,255,0.30);
}
.paceBox-avg{
  border-width:1.5px;
  /* Soft purple-cyan so it reads as "middle" between best and worst. */
  border-color:#a78bfa;
}
.paceBox-avg.pace-intense{
  box-shadow:0 0 6px rgba(167,139,250,0.50),
             inset 0 0 4px rgba(167,139,250,0.28);
}
.paceBox-worst{
  border-width:1px;
  /* Muted amber so it's clearly the "you should be done by now" line
     without screaming red. */
  border-color:#f0b86e;
}
.paceBox-worst.pace-intense{
  box-shadow:0 0 6px rgba(240,184,110,0.50),
             inset 0 0 4px rgba(240,184,110,0.25);
}
/* Brief pulse when a box reaches center. Class added by JS for the
   pulse duration, then the box is removed. */
@keyframes paceBoxPulse{
  0%   { opacity:0.85; transform:scale(1); }
  60%  { opacity:1.00; transform:scale(0.94); }
  100% { opacity:0;    transform:scale(0.88); }
}
.paceBox.pace-done{
  animation:paceBoxPulse 0.45s ease-out forwards;
}
/* When the bar is replaced by the static "Best time: X:XX" text. */
#mastGhostLabel{
  width:100%;max-width:520px;
  flex-shrink:0;
  text-align:center;
  font-family:'IBM Plex Mono',monospace;
  font-size:9px;letter-spacing:2px;text-transform:uppercase;
  color:rgba(0,217,255,0.55);
  padding:2px 0 1px;
  /* [v4.35] visibility:hidden (not display:none) reserves the label's
     vertical space from the start. Without this, when best-time-hit
     swapped bar for label, content below pushed down by the height
     difference (~9 px). With visibility:hidden, the label's box is
     in the layout from the start — it's just not painted until it
     becomes visibility:visible. Combined with placeholder content
     below (a non-breaking space) so the box has a definite height
     even before the real "Best time:" text is set. */
  visibility:hidden;
}

/* ── Selection screen ── */
.sel-screen{width:100%;max-width:520px;display:flex;flex-direction:column;align-items:center;padding:0 16px 24px;flex:1;}
.sel-mast{width:100%;padding:20px 0 16px;border-bottom:2px solid var(--cyan);text-align:center;margin-bottom:28px;box-shadow:0 2px 12px rgba(0,217,255,0.3);}
.sel-mast h1{font-family:'Abril Fatface',serif;font-size:32px;letter-spacing:2px;color:var(--text-primary);}
.sel-mast h1 span{color:var(--cyan);}
.sel-mast p{font-size:8px;letter-spacing:3px;text-transform:uppercase;color:var(--text-muted);margin-top:3px;}
.sel-section{width:100%;margin-bottom:24px;}
/* [v2.72] Bumped from 9px → 13px so the "PUZZLE SIZE" /
   "DIFFICULTY" headers don't read as fine print at the top of
   each segmented row. Letter-spacing kept at 3px so the all-caps
   header still feels distinct from button labels. */
.sel-label{font-size:13px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--cyan);margin-bottom:10px;text-align:center;}
.sel-row{display:flex;gap:0;width:100%;}
/* [v2.72] Main button text bumped 11px → 16px and padding 12px →
   16px so the size/difficulty labels are readable at arm's length
   (mom test). True 2× would be 22px which wraps "Medium" and
   blows out the row height, so 16px is the comfortable ceiling. */
.sel-btn{flex:1;padding:16px 0;background:none;border:1.5px solid var(--br);font-family:'IBM Plex Mono',monospace;font-size:16px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--text-secondary);cursor:pointer;transition:all .15s;line-height:1.3;}
/* [v3.85] Compact variant for the Mode row — chalant/nonchalant
   don't carry sub-text descriptions (Sam is testing whether users
   figure the pair out unaided), so the row reads as a simple
   binary toggle. Shorter padding and smaller font keep the menu
   from feeling crowded now that there are four selection rows
   above the PLAY button. */
.sel-btn.sel-btn-compact{padding:10px 0;font-size:13px;letter-spacing:1.5px;}
.sel-btn-compact:first-child{border-radius:22px 0 0 22px;}
.sel-btn-compact:last-child{border-radius:0 22px 22px 0;}
/* [v2.70] Pill-style outer rounding for the size/diff segmented rows.
   Each button is ~46px tall once content + padding is computed; a
   24px radius gets the outer corners essentially semi-circular while
   keeping the inner shared edges flat. Inner buttons stay square so
   the segmented look reads as a single connected pill.
   [v2.72] Bumped 24px → 30px to match the taller buttons after the
   font-size + padding bump (computed height ~58px now). */
.sel-btn:first-child{border-radius:30px 0 0 30px;}.sel-btn:last-child{border-radius:0 30px 30px 0;}.sel-btn+.sel-btn{border-left:none;}
.sel-btn.on{background:rgba(0,217,255,0.15);color:var(--cyan);border-color:var(--cyan);box-shadow:0 0 10px rgba(0,217,255,0.4);}
/* [v2.72] Sub-text (the "~9×9" / "+ and −" descriptions) bumped
   8px → 13px. Roughly tracks the main label bump in proportion. */
.sel-btn small{display:block;font-size:13px;font-weight:400;letter-spacing:1px;opacity:.7;margin-top:2px;}
/* [v2.70] Play button reshaped to a centered pill — auto-width
   (sized to its text + horizontal padding) instead of full-row
   width, with a 28px radius that gets the rounded ends to nearly
   full semi-circles at the current ~52px tall computed height.
   Centering is achieved by wrapping in a flex row (#playRow). */
/* [v3.66/v3.67] sel-play — only the PLAY word moves between states.
   [v3.67] Divider y-position moved up from 28px → 25px to align
   horizontally with the triangle's tip (triangle's geometric
   center sits at stack-height/2 = 25.5px from stack top). PLAY
   and RESUME now centered within the stack width via
   text-align:center, so they're each centered over the divider
   rather than sharing a left edge. RESUME (narrower than PLAY)
   no longer aligns with PLAY's left edge — both center on the
   same vertical axis through the divider's midpoint. */
.sel-play{margin-top:8px;padding:14px 28px;background:transparent;border:2px solid var(--cyan);border-radius:28px;font-family:'Abril Fatface',serif;letter-spacing:2px;color:var(--cyan);cursor:pointer;transition:all .15s;box-shadow:0 0 16px rgba(0,217,255,0.4);display:flex;align-items:center;justify-content:center;line-height:1.05;min-width:200px;}
.sel-play .play-row{display:inline-flex;align-items:center;gap:14px;}
.sel-play .play-tri{display:inline-block;font-size:20px;line-height:1;flex-shrink:0;}
/* Fixed-height stack so the button stays the same size whether or
   not RESUME is showing. Height = PLAY(~22) + divider(~13) + RESUME(~16). */
.sel-play .play-stack{position:relative;display:inline-block;width:auto;min-width:96px;height:51px;}
/* PLAY centered horizontally within stack; translates vertically
   to align with triangle when no save, or sits at top when has-save. */
.sel-play .play-main{position:absolute;top:0;left:0;right:0;text-align:center;font-size:20px;line-height:1.05;transform:translateY(13px);transition:transform 0.15s ease;}
.sel-play.has-save .play-main{transform:translateY(0);}
/* Divider: positioned to align horizontally with the triangle's
   geometric center (its tip), not at PLAY's baseline. Stays the
   same width (full stack). */
.sel-play .play-divider{position:absolute;top:25px;left:0;right:0;height:1px;background:rgba(0,217,255,0.35);opacity:0;transition:opacity 0.12s ease;}
.sel-play.has-save .play-divider{opacity:1;}
/* RESUME centered horizontally within stack, below the divider. */
.sel-play .play-resume{position:absolute;top:35px;left:0;right:0;text-align:center;font-size:14px;letter-spacing:3px;opacity:0;line-height:1.05;transition:opacity 0.12s ease;}
.sel-play.has-save .play-resume{opacity:0.85;}
.sel-play:active{opacity:.85;background:rgba(0,217,255,0.1);}
/* Centered row wrapper so the auto-width Play / Stats buttons sit
   in the middle of the column instead of left-aligned. */
.sel-cta-row{display:flex;justify-content:center;width:100%;}

/* ── Game screen ── */
.game-screen{width:100%;max-width:520px;display:none;flex-direction:column;align-items:center;background:var(--bg);}
/* [v2.75] Masthead restructured. Old layout was 3-or-4 flex items
   spaced via justify-content:space-between, which placed the title
   roughly-but-not-truly centered and put the difficulty/size pill
   in a 4th-item slot that drifted depending on screen width. New
   layout: three equal-flex slots so the title's slot is geometrically
   centered. .mast-side wraps each button group; the title slot keeps
   text-align:center. Difficulty/size text moves into a small line
   under the title, kept inside the same masthead block. */
.mast{width:100%;max-width:520px;padding:9px 14px 6px;border-bottom:2px solid var(--cyan);flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--bg-tertiary);box-shadow:0 2px 12px rgba(0,217,255,0.2);}
.mast-side{display:flex;align-items:center;gap:6px;flex:1 1 0;min-width:0;}
.mast-side.right{justify-content:flex-end;}
.mast-center{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;}
.mast-title{font-family:'Abril Fatface',serif;font-size:20px;letter-spacing:2px;color:var(--text-primary);line-height:1;}
.mast-title span{color:var(--cyan);}
/* [v2.75] mast-info was a sibling of the title; now lives directly
   under it inside .mast-center. Same muted color, same letter-
   spacing, just smaller margin + tighter typography. */
/* [v4.65] white-space:nowrap so longer labels like
   "SMALL · LESS EASY" don't wrap to two lines and visually push the
   masthead taller. */
.mast-info{font-size:8px;letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);line-height:1;white-space:nowrap;}
/* [v2.75] All three masthead buttons (Menu, New, ⚙) share a
   pill-rounded style with a 999px radius so the ends fully round
   off regardless of computed height. Sizes match across the three:
   same font-size, same vertical padding. The ⚙ icon button gets
   a square aspect via min-width=height so it reads as a circle
   not a long pill. */
.mast-back{background:none;border:1.5px solid var(--br);border-radius:999px;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--cyan);padding:6px 14px;cursor:pointer;}
/* [v3.59] gscroll now spans the full screen width on all sizes.
   Removed max-width:520px and dropped horizontal padding from
   24px to 0 so the cyan-bordered grid area extends edge-to-edge.
   Top/bottom padding kept at 16px for breathing room from the
   masthead above and bank below. The grid itself stays
   horizontally centered via justify-content:center, so on wide
   screens (tablets) the grid will sit centered in a wider
   surround rather than awkwardly stuck to one side.
   Note: corner accents only render in xl2-mode (Jumbo) per
   v2.98; they're calibrated to gscroll's actual rect and still
   land on the corners after this change.
   Bordering trimmed to top/bottom only — left/right cyan borders
   would awkwardly hug the screen edge without symmetric padding
   to give them visual room. The horizontal lines plus the grid-
   clip outline are sufficient to delineate the puzzle area. */
.gscroll{width:100%;padding:16px 0;display:flex;justify-content:center;flex-shrink:0;overflow:hidden;touch-action:pan-y;position:relative;z-index:0;background:var(--bg);border-top:2px solid rgba(0,217,255,0.5);border-bottom:2px solid rgba(0,217,255,0.5);box-shadow:0 0 4px rgba(0,217,255,0.12), inset 0 0 3px rgba(0,217,255,0.04);}
/* [v4.34] Added z-index:0 to .gscroll to establish a new stacking
   context. Needed so #paceRings (z-index:-1 sibling) is contained
   within .gscroll instead of escaping to body's root context. Without
   the explicit z-index, position:relative alone doesn't make a
   stacking context, and z-index:-1 children paint behind the parent's
   background — which would hide the rings entirely. */
/* [v1.56] Diagonal corner accents on the .gscroll outer container.
   Switched from one stretched 100×100 SVG to four small per-corner
   SVGs stacked via multi-background, each sized to the exact pixel
   distance from gscroll's outer corner to grid-clip's outer outline
   corner: 22px horizontal (2px gscroll border + 24px padding − 4px
   grid-clip outline-offset) × 14px vertical (2 + 16 − 4). Each SVG
   draws a single diagonal from one of its corners to the opposite,
   with a per-line linear-gradient fading from full opacity at the
   outer-corner end to 0.22 at the inner end. Pixel sizing means the
   diagonals hit grid-clip's outer corners exactly, regardless of
   how the gscroll's overall aspect ratio shifts with viewport.
   [v2.98] Hidden by default. The diagonals were sized for the
   xl2-mode (Jumbo) layout, where gscroll's padding lines up with
   .grid-clip's outer outline corners — they "point at" the grid
   from the panel corners. In other puzzle sizes the panel is
   narrower and the diagonals don't land on anything meaningful,
   so they read as decorative cruft. Now displayed only when
   body.xl2-mode is set; other sizes keep the gscroll border
   without the diagonal accents. */
.gscroll::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
  display:none;
  background-image:
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.3 11.3"><defs><linearGradient id="g" x1="0" y1="0" x2="10.3" y2="11.3" gradientUnits="userSpaceOnUse"><stop offset="0%25" stop-color="%2300d9ff" stop-opacity="0.5"/><stop offset="100%25" stop-color="%2300d9ff" stop-opacity="0.22"/></linearGradient></defs><line x1="0" y1="0" x2="10.3" y2="11.3" stroke="url(%23g)" stroke-width="1"/></svg>'),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.3 11.3"><defs><linearGradient id="g" x1="10.3" y1="0" x2="0" y2="11.3" gradientUnits="userSpaceOnUse"><stop offset="0%25" stop-color="%2300d9ff" stop-opacity="0.5"/><stop offset="100%25" stop-color="%2300d9ff" stop-opacity="0.22"/></linearGradient></defs><line x1="10.3" y1="0" x2="0" y2="11.3" stroke="url(%23g)" stroke-width="1"/></svg>'),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.3 11.3"><defs><linearGradient id="g" x1="0" y1="11.3" x2="10.3" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0%25" stop-color="%2300d9ff" stop-opacity="0.5"/><stop offset="100%25" stop-color="%2300d9ff" stop-opacity="0.22"/></linearGradient></defs><line x1="0" y1="11.3" x2="10.3" y2="0" stroke="url(%23g)" stroke-width="1"/></svg>'),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.3 11.3"><defs><linearGradient id="g" x1="10.3" y1="11.3" x2="0" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0%25" stop-color="%2300d9ff" stop-opacity="0.5"/><stop offset="100%25" stop-color="%2300d9ff" stop-opacity="0.22"/></linearGradient></defs><line x1="10.3" y1="11.3" x2="0" y2="0" stroke="url(%23g)" stroke-width="1"/></svg>');
  background-position: top left, top right, bottom left, bottom right;
  background-size: 10.3px 11.3px;
  background-repeat: no-repeat;
}
/* [v2.98] Re-enable the diagonals only in xl2-mode (Jumbo). Higher
   specificity than `.gscroll::before` so it wins despite source
   order. */
body.xl2-mode .gscroll::before{ display:block; }
.xl2-mode .gscroll,.xl2-mode .mast,.xl2-mode .bank-outer,.xl2-mode .bot,.xl2-mode .bsound-row,.xl2-mode .info-bar{max-width:100%;}
/* [v3.98] .grid keeps z-index:1 so cells (which paint within
   .grid's atomic stacking context) sit visually ABOVE the pace
   boxes that now live as a sibling of .grid inside .grid-clip.
   Tree order inside .grid-clip: vignette → paceBoxes → grid.
   Z order: vignette (auto) and paceBoxes (auto) paint at step 6
   per tree order, then .grid (z:1) paints at step 7 atomically
   above them. Empty grid regions (transparent wrappers, inter-
   cell gaps) reveal pace boxes underneath because they're truly
   transparent and pace boxes share the parent stacking context
   under .grid. */
.grid{display:inline-grid;border:none;background:transparent;flex-shrink:0;position:relative;z-index:1;}
/* [v4.24] Border on .grid removed. Was border:1px solid rgba(0,217,255,0.12)
   — a faint outer frame around all cells. Contributed to the same
   perimeter cyan line that the pace rings live in, "fighting" the
   rings visually. Cells render their own borders/backgrounds so the
   removal has no functional impact. Border can be revived by
   restoring `border:1px solid rgba(0,217,255,0.12)`. */
/* [v1.52] Cyan grid backdrop. Soft cyan tint along the four edges
   of the puzzle area, fading inward over the first ~12% of the
   grid's dimension. Edge opacity is 0.22 — about half as bright as
   v1.46/1.48 so the outermost row of grey-bordered empty cells stays
   readable against the tint.
   Implementation: four linear-gradients, one per edge. They overlap
   at the corners and overlay across the center where they're all
   transparent and the dark grid bg shows through unchanged. The 1px
   cell gaps reveal the gradient where it paints, so the visible
   crosshatch is brightest at the edges and absent in the middle.
   Sits at z:0 inside .grid; cells paint above at default z-auto.
   pointer-events:none so it doesn't block taps. */
/* [v3.94] Grid edge vignette. Was previously .grid::before but
   sat INSIDE .grid's stacking context (z-index:0 below cells at
   z-auto). That meant any element OUTSIDE .grid couldn't ever
   layer between vignette and cells — pace boxes drawn under .grid
   were below both, drawn above .grid were above both. Sam wanted
   pace boxes above the vignette but under cells, so we extract
   the vignette to its own element inside .grid-clip as a sibling
   of .grid. Now its z-stack is independent of .grid's: vignette
   sits at z:auto (no stacking context), pace boxes at z:0 paint
   above it via DOM order, and .grid at z:1 paints above pace
   boxes. */
.grid-vignette{
  position:absolute;
  left:0; right:0; top:0; bottom:0;
  pointer-events:none;
  /* [v3.99] z-index:-1 puts the vignette BELOW the pace boxes (which
     sit at z:auto/0 in the same parent). Without this, pace boxes
     paint on top of the vignette near the grid edges, hiding the
     cyan edge-fade tint entirely. Containment relies on .grid-clip
     creating its own stacking context (z-index:0 added below) so
     this -1 doesn't escape and land behind .gscroll's background.
     [v4.01] Cyan alpha bumped from 0.12 → 0.22. v4.00 diagnostic
     confirmed the vignette WAS rendering all along; it was just
     too dim to perceive. The original 0.12 was calibrated back
     when cell wrappers were opaque var(--bk) that the vignette
     composited against — with v3.95+ transparent wrappers and the
     z:-1 layer push, the effective on-screen brightness dropped
     enough that the tint became invisible. 0.22 brings it back to
     comparable visual strength. */
  z-index:-1;
  background:
    linear-gradient(to right,  rgba(0,217,255,0.22) 0%,  rgba(0,217,255,0) 12%),
    linear-gradient(to left,   rgba(0,217,255,0.22) 0%,  rgba(0,217,255,0) 12%),
    linear-gradient(to bottom, rgba(0,217,255,0.22) 0%,  rgba(0,217,255,0) 12%),
    linear-gradient(to top,    rgba(0,217,255,0.22) 0%,  rgba(0,217,255,0) 12%);
}
/* [v4.02] Cyan grid lattice — thin vertical + horizontal cyan lines
   at every cell boundary across the entire puzzle area, brighter at
   edges, fading toward center.
   
   Pre-v3.95 the lattice was an emergent effect: .grid::before
   painted a cyan gradient over the whole area, and opaque cell
   wrappers (var(--bk)) covered it everywhere except the 1px grid
   gaps. v3.95 made wrappers transparent to support pace boxes
   showing through empty cells, which inadvertently destroyed the
   lattice (the cyan now bled across whole cells as a wash instead
   of crisp lines).
   
   v4.02 restores it as a deliberate element. Background uses two
   repeating linear gradients to create a crosshatch pattern at
   cell stride. The cell stride is dynamic (CS pixels + 1px gap)
   so background-size is set inline by JS at render time.
   
   A radial-gradient mask fades the lattice toward the center
   matching the v1.45 design (brightest at edges, dim in the
   middle).
   
   Sits at z:-1 alongside .grid-vignette so pace boxes paint over
   it and grid cells paint over it. */
.grid-lattice{
  position:absolute;
  left:0; right:0; top:0; bottom:0;
  pointer-events:none;
  z-index:-1;
  background-image:
    linear-gradient(to right, rgba(0,217,255,0.32) 0px, rgba(0,217,255,0.32) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(0,217,255,0.32) 0px, rgba(0,217,255,0.32) 1px, transparent 1px);
  /* background-size set inline at render time to (CS+1)px (CS+1)px */
  /* Mask fades the lattice toward the puzzle center so it's
     brightest at corners/edges and softest in the middle. */
  -webkit-mask-image: radial-gradient(ellipse at center, transparent 0%, transparent 25%, black 90%);
  mask-image: radial-gradient(ellipse at center, transparent 0%, transparent 25%, black 90%);
  /* [v4.41] Lattice clip-path:inset(3px) removed. Was originally there
     so the lattice's perimeter cyan lines didn't compete with the
     pace rings at the grid's outer edge. With v4.41's grid gutter,
     rings are now OUTSIDE the cells in the gutter band, so there's
     no overlap to avoid. The lattice can extend to the cell perimeter
     freely. Also, JS now positions the lattice with inline left/top/
     right/bottom = GUTTER so it fills only the cell area, not the
     gutter. */
}
/* [v1.52] Thin cyan outline traced around the outer rectangle of the
   zoomable grid area, a few pixels outside the grid itself so it
   reads as a frame around the entire puzzle (not as part of the cell
   art). Uses outline + outline-offset on .grid-clip — outline doesn't
   take up layout space the way border does, and outline-offset pushes
   it the few pixels beyond the grid edge that the user wanted. Sits
   inside .gscroll's 16/24px padding so it doesn't get clipped. */
/* [v3.99] z-index:0 + position:relative gives .grid-clip its own
   stacking context, which is necessary to contain the v3.99
   .grid-vignette z-index:-1 (otherwise -1 would escape into body's
   root context and land behind .gscroll's background, hiding the
   vignette entirely). Side effect: this also isolates everything
   inside .grid-clip from compositing against elements outside it,
   but since the only thing outside .grid-clip in .gscroll is the
   masthead row above and the bank below, no compositing-through
   was needed. */
/* [v4.23] Attempted an inset box-shadow on .grid-clip to mask the
   lattice's outer perimeter lines, but it didn't work because
   .grid-clip's stacking context (z-index:0; position:relative)
   contains the z-index:-1 lattice such that the lattice paints
   above the parent's box-shadow layer. v4.24 moved the masking
   onto the lattice itself via clip-path. The box-shadow is removed
   here so we don't have a dead visual treatment lingering. */
.grid-clip{overflow:hidden;flex-shrink:0;position:relative;z-index:0;}
@keyframes shk{0%,100%{transform:translateX(0)}30%{transform:translateX(-3px)}70%{transform:translateX(3px)}}
@keyframes vib{0%,100%{transform:translateX(0)}15%{transform:translateX(-2px)}35%{transform:translateX(2px)}55%{transform:translateX(-2px)}75%{transform:translateX(2px)}}
@keyframes eqpop{0%{transform:scale(1)}40%{transform:scale(1.18)}70%{transform:scale(0.95)}100%{transform:scale(1)}}
@keyframes givenpop{0%{transform:scale(1);background:rgba(0,217,255,0.05)}50%{transform:scale(1.15);background:rgba(0,217,255,0.3);color:#00ffff}100%{transform:scale(1);background:rgba(0,217,255,0.2);color:#00d9ff}}
/* [v4.51] Light-mode variant of givenpop. The dark-mode keyframe
   ends with bright neon cyan (#00d9ff) which persists on the cell
   via `forwards` fill. On cream that reads as the placed-given
   cells "stuck" in bright cyan after a just-solved equation. This
   variant uses the deep teal palette so given cells settle into
   their normal solved-light-mode color (`#0e7490`). JS picks
   which animation to fire based on window._lightModeOn. */
@keyframes givenpop-light{
  0%{transform:scale(1);background:rgba(14,116,144,0.06);}
  50%{transform:scale(1.15);background:rgba(14,116,144,0.32);color:#0e7490;}
  100%{transform:scale(1);background:rgba(14,116,144,0.22);color:#0e7490;}
}
/* [v3.53] .ok-breath rule + @keyframes okBreath are written to a
   runtime <style> element by _writePulseKeyframes (in the OPTIONS-
   panel IIFE) so the user-tunable peak brightness AND animation
   duration can be applied dynamically. CSS keyframes/duration can't
   read JS variables, and an inline animation-duration would break
   the per-tile phase-delay math (the phase derives from a fraction
   of the duration). Keep this comment so anyone grepping for
   .ok-breath finds the actual definition site. */
.bank{flex:1;min-width:0;background:var(--bg-secondary);touch-action:pan-y;}
.blbl{font-size:8px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--cyan);}
.btiles{display:flex;flex-wrap:wrap;gap:6px;padding:4px 40px;flex:1;touch-action:pan-y;justify-content:center;}
.info-bar{width:100%;max-width:520px;padding:4px 14px 2px;display:flex;flex-direction:column;gap:4px;flex-shrink:0;}
.info-bar .blbl{color:var(--text-muted);font-size:7px;}
.bsize-wrap{display:flex;flex-direction:column;align-items:stretch;flex-shrink:0;gap:4px;padding-bottom:4px;border-right:2px solid var(--cyan);}
.bright-bar{display:none;}
.bright-btn{display:none;}

.bank-outer{width:100%;max-width:520px;border-top:none;background:var(--bg-secondary);flex-shrink:0;display:flex;flex-direction:column;align-items:stretch;touch-action:pan-y;position:relative;}
.seq-toolbar{width:100%;display:none;flex-direction:column;align-items:stretch;background:var(--bg-tertiary);border-bottom:1px solid rgba(0,217,255,0.12);border-top:1px solid rgba(0,217,255,0.12);padding:4px 6px;gap:3px;box-sizing:border-box;flex-shrink:0;}
.seq-toolbar-row{display:flex;flex-direction:row;align-items:center;gap:3px;flex-wrap:wrap;overflow:hidden;}
.seq-toolbar.active{display:flex;}
.bank-row{display:flex;flex-direction:row;align-items:flex-start;flex:1;touch-action:pan-y;}
.bsize-col{position:relative;flex-shrink:0;width:28px;height:96px;cursor:pointer;touch-action:none;border-bottom:2px solid var(--cyan);display:flex;align-items:stretch;}
#sizeCanvasWrap,#sizeCanvasWrap *{touch-action:none;}
/* Horizontal version of size slider for seq toolbar */
.bsize-col-h{position:relative;height:18px;cursor:ew-resize;touch-action:none;border:1.5px solid var(--cyan);border-radius:3px;background:var(--bg-secondary);overflow:hidden;display:flex;align-items:center;min-width:40px;}
.bsize-col-h .sizebar-fill{position:absolute;left:0;top:0;bottom:0;background:rgba(0,217,255,0.4);border-radius:2px 0 0 2px;pointer-events:none;}
.bsize-col-h .sizebar-handle{position:absolute;top:50%;width:10px;height:14px;background:var(--bg);border:1px solid var(--cyan);border-radius:2px;transform:translate(-50%,-50%);z-index:3;cursor:ew-resize;pointer-events:none;}
.bsize-col-h .sizebar-arrows{position:absolute;top:50%;transform:translateY(-50%);font-size:7px;color:var(--cyan);pointer-events:none;z-index:5;font-weight:700;display:flex;flex-direction:column;align-items:center;line-height:1;gap:0;}
.sizebar-lock{display:none;}
.seq-btns{display:none;}
.seq-btn{height:28px;min-width:28px;font-size:13px;display:flex;align-items:center;justify-content:center;border:1.5px solid rgba(0,217,255,0.35);border-radius:3px;background:transparent;color:var(--text-primary);cursor:pointer;user-select:none;touch-action:manipulation;padding:0 5px;transition:all .12s;box-shadow:none;}
.seq-btn-lg{height:56px;min-width:56px;font-size:22px;}
.seq-btn-sq{width:28px;padding:0;}
.seq-btn:hover{box-shadow:0 0 12px rgba(0,217,255,0.6);border-color:var(--cyan-bright);}
.seq-btn:active{border-color:var(--cyan);box-shadow:0 0 10px rgba(0,217,255,0.5);}
.seq-btn.active{background:rgba(196,0,255,0.2);border-color:var(--magenta);box-shadow:0 0 14px rgba(196,0,255,0.8);color:var(--magenta);}
.seq-pro-btn{font-size:8px;font-weight:700;letter-spacing:.5px;}
.seq-save-btn{font-size:14px;}
#seqFileInput{display:none;}
.seq-pro-btn.active{background:rgba(196,0,255,0.2);border-color:var(--magenta);color:var(--magenta);box-shadow:0 0 12px rgba(196,0,255,0.7);}
.pro-panel{width:100%;max-width:520px;background:var(--bg-secondary);border-top:1px solid rgba(0,217,255,0.12);padding:6px 10px 8px;flex-shrink:0;gap:5px;display:flex;flex-direction:column;}
.xl2-mode .pro-panel{max-width:100%;}
.pro-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.pro-top{margin-bottom:2px;margin-left:-10px;margin-right:-10px;padding-left:2px;padding-right:2px;}
.pro-lbl{font-size:7px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);white-space:nowrap;}
.pro-btn{font-family:"IBM Plex Mono",monospace;font-size:9px;font-weight:700;padding:4px 7px;border:1.5px solid var(--cyan);border-radius:3px;background:transparent;color:var(--text-primary);cursor:pointer;transition:all .1s;letter-spacing:.5px;box-shadow:0 0 4px rgba(0,217,255,0.15);}
.pro-btn:hover{box-shadow:0 0 10px rgba(0,217,255,0.5);}
.pro-btn.active{background:rgba(0,217,255,0.15);color:var(--cyan);border-color:var(--cyan-bright);box-shadow:0 0 12px rgba(0,217,255,0.7);}
.pro-bar-btns{display:flex;gap:3px;}
.pro-bpm{font-family:"IBM Plex Mono",monospace;font-size:14px;font-weight:700;width:52px;border:1.5px solid var(--cyan);border-radius:3px;padding:3px 5px;background:var(--bg-secondary);color:var(--text-primary);text-align:center;}
.pro-tap{font-family:"IBM Plex Mono",monospace;font-size:9px;font-weight:700;letter-spacing:1px;padding:4px 8px;border:1.5px solid var(--magenta);border-radius:3px;background:transparent;color:var(--magenta);cursor:pointer;box-shadow:0 0 8px rgba(196,0,255,0.4);}
.pro-beats{display:flex;gap:4px;flex-wrap:wrap;align-items:center;justify-content:center;opacity:1;pointer-events:auto;}
.pro-slot-btns{display:flex;gap:2px;margin-left:4px;}
.pro-slot{min-width:20px;padding:3px 4px;font-size:8px;}
.pro-slot.active{background:rgba(0,217,255,0.2)!important;color:var(--cyan)!important;border:1.5px solid var(--cyan)!important;font-weight:700;box-shadow:0 0 8px rgba(0,217,255,0.6)!important;}
.pro-slot.has-data{border-color:var(--magenta);color:var(--magenta);}
.pro-slot.clone-src{background:rgba(196,0,255,0.3)!important;border-color:var(--magenta)!important;color:var(--magenta)!important;}
.pro-slot.clone-tgt{border-color:var(--magenta)!important;border-style:dashed!important;}
.pro-beat{border-radius:50%;border:1.5px solid rgba(196,0,255,0.35);flex-shrink:0;background:rgba(196,0,255,0.18);transition:transform 0.08s ease, box-shadow 0.08s ease, background 0.08s ease;}
.pro-beat.accent{border:2.5px solid rgba(196,0,255,0.7);background:rgba(196,0,255,0.35)!important;}
.pro-beat.mid-accent{background:rgba(196,0,255,0.25);border:2px solid rgba(196,0,255,0.5);}
.pro-beat.active{background:var(--magenta)!important;border-color:var(--magenta-bright)!important;box-shadow:0 0 10px 3px rgba(196,0,255,0.9),0 0 22px 6px rgba(196,0,255,0.4)!important;}
.pro-beat.erase-range{background:#fde047!important;border-color:#ca8a04!important;box-shadow:0 0 3px #fbbf24!important;}
.pro-beat.erase-sel{background:#f97316!important;border-color:#c2410c!important;box-shadow:0 0 4px #f97316!important;}

.seq-btn.playing{background:rgba(0,217,255,0.15);border-color:var(--cyan-bright);box-shadow:0 0 14px rgba(0,217,255,0.8);}

.sizebar-fill{position:absolute;bottom:0;left:0;right:0;background:rgba(0,217,255,0.5);transition:height .05s;}
.sizebar-handle{position:absolute;left:-2px;right:-2px;height:8px;background:var(--bg);border:1px solid var(--cyan);border-radius:2px;pointer-events:none;transition:bottom .05s;z-index:3;}
.sizebar-arrows{position:absolute;left:50%;transform:translate(-50%,50%);width:5px;height:16px;border:1.5px solid var(--cyan);border-radius:3px;background:var(--bg-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:6px;line-height:1;color:var(--cyan);pointer-events:none;transition:bottom .05s;z-index:4;}
.sizebar-lbl{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:7px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--cyan);text-align:center;line-height:1.6;pointer-events:none;user-select:none;}
.bt{min-width:44px;height:44px;padding:0 8px;border:1.5px solid rgba(0,217,255,0.5);background:var(--bg-secondary);color:#c8c8d0;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;font-family:'IBM Plex Mono',monospace;line-height:1;cursor:pointer;box-shadow:0 0 4px rgba(0,217,255,0.18) inset;transition:transform 0.04s,box-shadow 0.15s,background 0.1s,border-color 0.15s;touch-action:pan-y;aspect-ratio:1;isolation:isolate;}
/* [v4.66] When drag-tiles mode is ON, touches on bank tiles are
   owned by the drag handler — disable the browser's built-in pan
   behavior so the page doesn't scroll while the user is trying to
   pick up a tile. With pan-y left in place, the browser would start
   panning as soon as the finger moved a couple pixels (its internal
   threshold), before our DRAG_THRESHOLD of 8px tripped — the user
   would feel "the page is sliding under me as I try to grab a tile."
   When drag-tiles is OFF, `.bt` keeps pan-y so swiping across the
   tile row still scrolls the page (the original behavior). The
   `.drag-tiles-on` body class is toggled by _applyTuning. */
body.drag-tiles-on .bt{touch-action:none;}
/* [v2.07] Cancel the outline-style on cyan-mode and mini-mode child
   number elements so they render as solid colored fills, not as
   white outlines (which would happen because they inherit
   color:transparent + text-stroke from the .bt parent rule).
   [v2.08] Also covers the xN multiplier badge (._btXN) which is the
   small "×6" cyan label below tile numbers when xN mode is on — it
   was inheriting the stroke too. */
.bt ._btCyanGrid, .bt ._btCyanGrid *,
.bt ._btMiniGrid, .bt ._btMiniGrid *,
.bt ._btXN, .bt ._btMiniNum{
  -webkit-text-stroke:0;
  text-stroke:0;
}
/* Waveform canvas sits behind tile content via z-index:-1 (inside the tile's
   isolation:isolate stacking context so the negative z stays scoped to this
   tile). Uses border-radius matching the tile so the canvas's pixel content
   visually conforms to the rounded corners without needing overflow:hidden
   on the parent — overflow:hidden was making the spin animation stutter
   because the browser had to recompute the clipping region every frame. */
.bt-wave{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;opacity:0.55;border-radius:10px;}
/* Progressive border animation — shown for hold-tagged pads while playing.
   Renders a bright rounded-rect border stroke using SVG, with a clip region
   that grows left-to-right in sync with the waveform playhead so the border
   "draws in" matching the fill sweep. Sits on top of the waveform but below
   the text/labels via z-index:1. */
.bt-border-anim{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible;}
.bt-border-anim svg{width:100%;height:100%;display:block;overflow:visible;}
.bt._noNums{color:transparent !important;}
/* Pad edit mode — pulsing purple outline on all pads to signal they're "pickable" */
#bank._padEditMode .bt{animation:_padEditPulse 1.2s ease-in-out infinite;border-color:rgba(74,222,128,0.75)!important;box-shadow:0 0 8px rgba(34,197,94,0.4)!important;cursor:pointer;}
#bank._padEditMode .bt:active{transform:scale(0.95);}
@keyframes _padEditPulse{
  0%,100%{box-shadow:0 0 8px rgba(34,197,94,0.4);}
  50%{box-shadow:0 0 14px rgba(34,197,94,0.75);}
}
/* v2.35: Removed orphaned animation rules that previously sat here without
   a @keyframes wrapper — they were stray after a prior refactor and silently
   ignored by browsers, but they tripped some CSS validators and showed up
   as "unexpected token" warnings in dev tools. */
/* Highlight the EDIT button itself when active — green fill to match
   the HLD BTN / COLOR / DEL pattern (colored fill + glow when on).
   The fill alpha is kept on the higher end so the lit state reads
   clearly on small pill-shaped buttons against the dark bg. */
#padsBarEdit.active{background:rgba(34,197,94,0.4)!important;color:#86efac!important;border-color:#22c55e!important;box-shadow:0 0 10px rgba(34,197,94,0.7)!important;}
#padsBarMultiHit{box-shadow:0 0 4px rgba(34,197,94,0.15);}
#padsBarMultiHit.active{background:rgba(34,197,94,0.4)!important;color:#86efac!important;border-color:#22c55e!important;box-shadow:0 0 10px rgba(34,197,94,0.7)!important;}
/* COPY button — green in copy-armed state (same pattern as EDIT), red
   fill with label "PASTE" once a source pad has been selected. The
   -paste variant overrides the -active variant via specificity order
   so the red styling always wins when both classes are present. */
#padsBarCopy{box-shadow:0 0 4px rgba(34,197,94,0.15);}
#padsBarCopy.active{background:rgba(34,197,94,0.4)!important;color:#86efac!important;border-color:#22c55e!important;box-shadow:0 0 10px rgba(34,197,94,0.7)!important;}
#padsBarCopy.paste{background:rgba(239,68,68,0.28)!important;color:#fecaca!important;border-color:#ef4444!important;box-shadow:0 0 10px rgba(239,68,68,0.55)!important;}
/* Pad-copy mode — pulsing green outline on all pads (matches EDIT's
   look since both are "tap a pad to pick it" modes). Re-use the same
   animation as EDIT so the motion feels identical. */
#bank._padCopyMode .bt{animation:_padEditPulse 1.2s ease-in-out infinite;border-color:rgba(74,222,128,0.75)!important;box-shadow:0 0 8px rgba(34,197,94,0.4)!important;cursor:pointer;}
#bank._padCopyMode .bt:active{transform:scale(0.95);}
/* Pad-paste mode — pulsing RED outline on all pads to signal
   "tap to paste here". Uses its own keyframes so the decay color
   stays red throughout. */
#bank._padPasteMode .bt{animation:_padPastePulse 1.2s ease-in-out infinite;border-color:rgba(248,113,113,0.8)!important;box-shadow:0 0 8px rgba(239,68,68,0.4)!important;cursor:pointer;}
#bank._padPasteMode .bt:active{transform:scale(0.95);}
@keyframes _padPastePulse{
  0%,100%{box-shadow:0 0 8px rgba(239,68,68,0.4);}
  50%{box-shadow:0 0 14px rgba(239,68,68,0.75);}
}
/* Hold-select mode — pulsing yellow outline on all pads to signal they're tappable for hold-tag toggling */
#bank._holdSelectMode .bt{animation:_holdSelectPulse 1.2s ease-in-out infinite;border-color:rgba(251,191,36,0.7)!important;box-shadow:0 0 8px rgba(251,191,36,0.35)!important;cursor:pointer;}
@keyframes _holdSelectPulse{
  0%,100%{box-shadow:0 0 6px rgba(251,191,36,0.3);}
  50%{box-shadow:0 0 12px rgba(251,191,36,0.65);}
}
/* Yellow hold-tag mark — small dot in upper-right of tagged pads. Mirrors
   the .bt-mic position (upper-left) but on the opposite corner so the two
   indicators don't collide. Stays visible at all times, not just in select mode. */
.bt-holdtag{position:absolute;top:2px;right:2px;width:5px;height:5px;border-radius:50%;background:#fbbf24;box-shadow:0 0 4px rgba(251,191,36,0.9);pointer-events:none;z-index:3;}
/* Loop variant: hold-tagged AND looping. Replaces the simple dot with a
   13px SVG showing a smaller center dot surrounded by a circular arrow. */
.bt-holdtag-loop{position:absolute;top:2px;right:2px;width:15px;height:15px;pointer-events:none;z-index:3;filter:drop-shadow(0 0 3px rgba(251,191,36,0.8));}
.bt-holdtag-loop svg{width:100%;height:100%;display:block;}
/* On-tap variant — pads in the new "On Tap" hold mode get a small CYAN
   dot in the upper-right (mirrors the yellow hold-tag dot but in the
   app's accent cyan, so the two modes are visually distinct at a
   glance). Same position/size/z-index as .bt-holdtag so the two never
   collide — a pad can only be in one mode at a time. */
.bt-holdtag-ontap{position:absolute;top:2px;right:2px;width:5px;height:5px;border-radius:50%;background:#00d9ff;box-shadow:0 0 4px rgba(0,217,255,0.9);pointer-events:none;z-index:3;}
/* On-beat variant — pads in the "On Beat" hold mode get a small GREEN
   dot. Same position/size/z-index as the other hold-tag dots so they
   never collide — a pad lives in exactly one mode. Green is the
   "snap" / "rhythm" affordance color (matches DONE buttons elsewhere
   so it reads as an on/snap state). */
.bt-holdtag-onbeat{position:absolute;top:2px;right:2px;width:5px;height:5px;border-radius:50%;background:#22c55e;box-shadow:0 0 4px rgba(34,197,94,0.9);pointer-events:none;z-index:3;}
.bt._exprGrid{position:relative;overflow:hidden;}
.bt._exprGrid::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;
  background:var(--expr-grid-bg, none);
}
.bt:hover{border-color:rgba(0,217,255,0.35);box-shadow:none;}
/* On touch devices, suppress hover state entirely so tapped tiles don't stay lit */
@media(hover:none){
  .bt:hover{border-color:rgba(0,217,255,0.35)!important;box-shadow:none!important;background:var(--bg-secondary)!important;}
}
.bt.pressed{transform:translate(1px,1px)!important;transition:none!important;}
.bt.active-flash{transition:none!important;}
@keyframes seqTextPop{
  0%   { font-size:1.8px; opacity:0.01; }
  30%  { font-size:1.8px; opacity:0.01; }
  50%  { font-size:8px;   opacity:1; }
  70%  { font-size:12px;  opacity:1; letter-spacing:2px; }
  85%  { font-size:10px;  opacity:1; }
  95%  { font-size:10px;  opacity:1; }
  100% { font-size:1.8px; opacity:0.01; }
}
/* [v3.70] bt-spin reworked for snappier, more uniform rotation.
   Old keyframes had asymmetric pacing — 0→200° in 40%, then 200→320°
   in 30%, then only 320→360° in the last 30%. With the cubic-bezier
   ease-out also stacked on top, the last quarter of the rotation
   crawled and the tile read as "hanging" near the end. New pacing
   is uniform 1.8°/% with a single mid-spin scale dip; easing is
   shifted from the back-loaded ease-out to Material-standard so
   the start, middle, and end of the spin all move at perceptually
   similar rates. Duration default also dropped from 850ms to 500ms
   at the call sites — see the two _selSpinDur/_clkSpinDur formulas. */
@keyframes bt-spin{
  0%  {transform:rotate(0deg) scale(1);}
  50% {transform:rotate(180deg) scale(0.78);}
  100%{transform:rotate(360deg) scale(1);}
}
@keyframes _hitGlow{
  0%{opacity:1;transform:translate(-50%,-50%) scale(0.6);}
  50%{opacity:0.8;transform:translate(-50%,-50%) scale(1.1);}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.3);}
}
@keyframes _hitPinpoint{
  /* Pop to full size quickly, hold through most of the duration so the
     snap point stays visible after finger-lift, then fade. */
  0%  {opacity:0;transform:translate(-50%,-50%) scale(0.4);}
  20% {opacity:1;transform:translate(-50%,-50%) scale(1);}
  70% {opacity:1;transform:translate(-50%,-50%) scale(1);}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.3);}
}
@keyframes _hitCrosshair{
  /* Fade in quick, hold most of the time, then fade out. Same timing as the
     pinpoint so crosshair + dot vanish in sync. */
  0%  {opacity:0;}
  20% {opacity:1;}
  70% {opacity:1;}
  100%{opacity:0;}
}
.bt.spinning{animation:bt-spin var(--spin-dur,380ms) cubic-bezier(0.4,0.0,0.2,1.0) forwards;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;}
/* [v1.36] Yellow → cyan blend during the placing-spin. Applied to the
   clone created by the SEL click/touchstart handlers so the tile
   visibly transitions from its "selectable" yellow glow back to the
   neutral cyan as it spins into place. The spin transform animation
   is on the same element via .bt.spinning + .bt.lit; this rule adds a
   parallel animation on border-color and box-shadow over the same
   duration. The `forwards` fill mode holds the final cyan state in
   case the clone lingers an extra frame before removal. */
@keyframes bt-place-blend{
  0%   { border-color:#a855f7;
         box-shadow:0 0 4px rgba(168,85,247,0.30) inset,
                    0 0 4px 1px rgba(168,85,247,0.65),
                    0 0 8px 0 rgba(168,85,247,0.35); }
  100% { border-color:rgba(0,217,255,0.85);
         box-shadow:0 0 4px rgba(0,217,255,0.18) inset,
                    0 0 4px 1px rgba(0,217,255,0.50),
                    0 0 8px 0 rgba(0,217,255,0.25); }
}
.bt.placing-blend{
  animation:
    bt-spin var(--spin-dur,380ms) cubic-bezier(0.4,0.0,0.2,1.0) forwards,
    bt-place-blend var(--spin-dur,380ms) ease-in-out forwards !important;
  will-change:transform,border-color,box-shadow;
}
/* [v1.36] Ghost border — a static outline left at the original tile
   position when the placing-spin starts. Acts as a "you tapped here"
   anchor so the eye has somewhere stable to look while the clone
   spins above. Fades out over the same duration as the spin. */
@keyframes bt-ghost-fade{
  0%   { opacity:1; }
  70%  { opacity:0.5; }
  100% { opacity:0; }
}
.bt-ghost{
  position:fixed;
  pointer-events:none;
  z-index:9998;
  border:1.5px dashed rgba(0,217,255,0.6);
  border-radius:10px;
  box-shadow:0 0 6px rgba(0,217,255,0.20) inset,
             0 0 8px rgba(0,217,255,0.18);
  animation:bt-ghost-fade var(--spin-dur,380ms) ease-out forwards;
}
/* particles via canvas */
.bt-mic{position:absolute;top:2px;left:2px;width:5px;height:5px;border-radius:50%;pointer-events:none;}
.bt:active{transform:translate(1px,1px);transition:none;}
.bt.used{opacity:.25;cursor:pointer;pointer-events:all;box-shadow:none;}
/* [v1.33] When a board cell is selected (SEL active), candidate tiles
   below get a yellow GLOW rather than a yellow fill — same visual
   treatment as the cyan border, just with a warm amber color and an
   added soft outer halo. Background stays bg-secondary so the glow
   reads as ambient light, not a paint job. The number itself stays
   white (no color change). On tap the existing tap handler adds the
   spin + particles animations as usual.
   [v1.34] !important on border to override inline style set by
   applyTileColor (which runs at render time and otherwise wins). */
.bt.lit{
  border:1.5px solid #a855f7 !important;
  box-shadow:0 0 4px rgba(168,85,247,0.30) inset,
             0 0 4px 1px rgba(168,85,247,0.65),
             0 0 8px 0 rgba(168,85,247,0.35) !important;
}
/* [v4.71] Light-mode .bt.lit glow. The v4.49/v4.54 light-mode `.bt`
   override (border-color + box-shadow with !important) has higher
   specificity than `.bt.lit` — body.light-mode .bt = (0,2,1) beats
   .bt.lit = (0,2,0) — so when a cell is selected in light mode the
   candidate bank tiles lost their selection glow entirely (the
   override clobbered it). This rule restores the glow with a
   higher-specificity selector. Uses the light-mode selected-cell
   purple (#7c3aed) to match the cell highlight color, so tapping a
   blank cell glows the bank tiles in the same purple the cell
   turned — same behavior as dark mode's magenta. */
body.light-mode .bt.lit{
  border:1.5px solid #7c3aed !important;
  box-shadow:0 0 4px rgba(124,58,237,0.22) inset,
             0 0 4px 1px rgba(124,58,237,0.55),
             0 0 9px 0 rgba(124,58,237,0.40) !important;
}
.bot{width:100%;max-width:520px;padding:7px 12px 16px;display:flex;gap:8px;border-top:1px solid rgba(0,217,255,0.3);flex-shrink:0;background:var(--bg);}

/* [v1.74] Hide the in-bank vertical slider strip (#sizeCanvasWrap)
   in puzzle mode so the bank itself can use the full width. The
   sliders + state-logic still live in the DOM; they're moved into
   the ADJUST modal when the user opens it. SEQ mode (window.
   _seqVisible) keeps the strip visible since the sequencer uses
   it inline. */
body:not(.seq-mode) #sizeCanvasWrap{display:none!important;}
/* [v1.74] Hide the original mode buttons inside the slider strip.
   The new tile-controls-row presents them at the bottom; we only
   want SIZE+GAP sliders visible when the wrap is moved into the
   ADJUST modal. */
#sizeCanvasWrap > #condenseTilesBtn,
#sizeCanvasWrap > #miniTilesBtn,
#sizeCanvasWrap > #cyanTilesBtn{display:none!important;}

/* [v1.74] Full-width controls row beneath the tile bank.
   Holds ADJUST + the three tile-display-mode buttons (×N / mini /
   cyan) that previously lived in the in-bank slider strip. */
.tile-controls-row{
  width:100%;max-width:520px;
  padding:6px 12px 8px;
  display:flex;flex-direction:row;align-items:stretch;gap:6px;
  flex-shrink:0;background:var(--bg-secondary);
  border-top:1px solid rgba(0,217,255,0.12);
}
/* [v2.65] Hide the tile-controls-row when the menu screen is
   visible. The row is for puzzle-mode UI only; on the menu it
   was just floating at the bottom looking out of place. */
body.menu-active .tile-controls-row{ display:none!important; }

/* [v4.07] Undo button disabled state. The disabled flag is set by
   renderBank whenever HIST is empty (and after victory, the click
   handler ignores taps too). Visual treatment: dim to ~35% opacity
   and remove the interactive cursor so it reads as "nothing to undo
   right now" without disappearing entirely. */
#undo:disabled{
  opacity:0.35;
  cursor:default;
  background:rgba(0,217,255,0.05);
  border-color:rgba(0,217,255,0.25);
}
#undo:not(:disabled):active{
  background:rgba(0,217,255,0.25);
}
.tile-controls-row > button{
  flex:1;
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;font-weight:700;letter-spacing:1px;
  padding:8px 6px;
  /* [v2.86] Pill-rounded outer corners (999px) so these buttons
     match the app-wide pill aesthetic. Border + color bumped to
     full var(--cyan) (was rgba(0,217,255,0.4) — visibly dim) and
     box-shadow added for the same subtle cyan glow used on the
     menu Play button, masthead Menu/New/⚙, and win card pills.
     Text color also lifted to full cyan so the inactive state
     reads as "live, but not selected" rather than "deactivated".
     The .active state below still flips them to purple to mark
     the currently-selected display mode — that semantic was
     deliberate (purple = "this mode is on") and is preserved. */
  border-radius:999px;
  border:1.5px solid var(--cyan);
  background:transparent;
  color:var(--cyan);
  box-shadow:0 0 8px rgba(0,217,255,0.3);
  cursor:pointer;touch-action:manipulation;
  transition:all .15s;
}
.tile-controls-row > button:active{
  background:rgba(0,217,255,0.1);
}
.tile-controls-row > button.active{
  border-color:#a855f7;
  color:#a855f7;
  background:rgba(168,85,247,0.1);
  box-shadow:0 0 8px rgba(168,85,247,0.35);
}
/* [v2.16] Removed the always-purple #tileAdjustBtn override — it
   now inherits the default cyan-bordered look from
   .tile-controls-row > button when inactive, and turns purple
   only when its .active class is set (matching the display-mode
   buttons). The active class is toggled by the modal open/close
   handlers below. line-height tightened so the two-line "TILE /
   ADJUST" text fits cleanly. */
#tileAdjustBtn{ line-height:1.15; }
#tileAdjustBtn:active{ background:rgba(0,217,255,0.1); }

/* [v1.74] ADJUST modal — overlay containing the SIZE+GAP sliders
   (which are physically moved into here when the modal opens, then
   moved back when it closes, so the existing slider IIFE keeps its
   element references). */
#tileAdjustModal{
  display:none;position:fixed;inset:0;z-index:600;
  /* [v1.81] No dark backdrop — modal is just the slider box,
     anchored to the left side of the viewport. The overlay div
     itself uses pointer-events:none so taps outside the box
     pass through to the page; the inner box re-enables them. */
  background:transparent;
  pointer-events:none;
  /* [v2.59/v2.60] Removed flex centering — outer wrapper now
     positions itself with absolute left/top so the user can drag
     it. The wrapper's first-show position is set in JS. */
  padding:0;
}
#tileAdjustModal.open{display:block;}
/* [v2.60] Outer wrapper: contains main box (left) and the slide-out
   advanced panel (right) as flex row siblings. Dragging operates on
   THIS element so both pieces move together. */
#tileAdjustModalOuter{
  pointer-events:auto;
  position:absolute;
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  /* No background/border on the wrapper — they live on the
     inner box and panel. */
}
#tileAdjustModalBox{
  background:var(--bg-secondary);
  border:2px solid #a855f7;
  border-radius:8px;
  padding:10px;
  width:auto;
  font-family:'IBM Plex Mono',monospace;
  box-shadow:0 0 24px rgba(168,85,247,0.35);
  display:flex;flex-direction:column;align-items:stretch;gap:8px;
  /* No more position:absolute — the OUTER wrapper handles position.
     The box itself is just a normal flex item. */
  flex-shrink:0;
}
#tileAdjustModalTitle{
  font-weight:700;font-size:11px;letter-spacing:1.5px;
  color:#a855f7;text-align:center;
  /* [v2.64] Title doubles as a drag handle — large, easy-to-grab
     area along the top edge of the modal. The smaller bottom drag
     strips are still functional as a backup.
     [v2.65] Removed border (was reading as a button); kept just
     the grab cursor and a faint background tint on press so it
     reads as draggable without looking tappable. */
  cursor:grab;
  touch-action:none;
  user-select:none;
  padding:4px 4px;
}
#tileAdjustModalTitle:active{ cursor:grabbing; background:rgba(168,85,247,0.08);border-radius:4px; }
#tileAdjustModalSliders{
  /* Container into which we move #sizeCanvasWrap when modal opens.
     The wrap is column-flexed with vertical sliders inside; give it
     just enough height for the sliders to be usable, and no
     horizontal padding/min-width — let the content size itself. */
  display:flex;flex-direction:row;align-items:stretch;justify-content:center;
  min-height:140px;
  background:var(--bg);
  border-radius:4px;
  padding:4px;
}
#tileAdjustModalSliders #sizeCanvasWrap{
  display:flex!important; /* override the body:not(.seq-mode) hide */
  padding:0!important;    /* the wrap's own padding adds dead space */
}
/* [v2.59] DONE row — DONE button flanked by drag handles on each side.
   The handles are wide flex-stretching strips with horizontal lines
   so they read as "grab here." Tapping/dragging anywhere on a handle
   moves the modal. The DONE button stays the only tappable element
   that closes the modal. */
#tileAdjustModalDoneRow{
  display:flex;flex-direction:row;align-items:center;
  gap:6px;
}
.tileAdjustDragHandle{
  flex:1;
  height:30px;
  background:linear-gradient(
    to bottom,
    transparent 0%, transparent 30%,
    rgba(168,85,247,0.3) 30%, rgba(168,85,247,0.3) 36%,
    transparent 36%, transparent 50%,
    rgba(168,85,247,0.3) 50%, rgba(168,85,247,0.3) 56%,
    transparent 56%, transparent 70%,
    rgba(168,85,247,0.3) 70%, rgba(168,85,247,0.3) 76%,
    transparent 76%, transparent 100%
  );
  border-radius:3px;
  cursor:grab;
  touch-action:none;
  user-select:none;
}
.tileAdjustDragHandle:active{ cursor:grabbing; background-color:rgba(168,85,247,0.08); }
#tileAdjustModalClose{
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;font-weight:700;letter-spacing:1px;
  padding:5px 10px;
  border:1.5px solid #a855f7;
  border-radius:3px;
  background:rgba(168,85,247,0.1);
  color:#a855f7;
  cursor:pointer;
  min-width:80px;
}
#tileAdjustModalClose:active{ background:rgba(168,85,247,0.25); }
/* [v2.59] Advanced section toggle — collapsed by default. */
#tileAdjustModalAdvancedToggle{
  font-family:'IBM Plex Mono',monospace;
  font-size:9px;font-weight:700;letter-spacing:1.5px;
  color:rgba(168,85,247,0.85);
  background:rgba(168,85,247,0.08);
  border:1px solid rgba(168,85,247,0.3);
  border-radius:3px;
  padding:5px 8px;
  cursor:pointer;
  text-align:left;
  display:flex;align-items:center;gap:6px;
}
#tileAdjustModalAdvancedToggle:active{ background:rgba(168,85,247,0.16); }
#tileAdjustModalAdvancedToggle .arrow{ display:inline-block; width:10px; }
/* [v2.60] Advanced panel — slides out to the RIGHT of the main box.
   Animates width from 0 to content width. Background and border match
   the main box's purple theme so they read as connected.
   Width-based animation is used because the panel sits as a flex
   sibling of the main box; expanding to the right doesn't displace
   the main box, just adds new flex items. */
#tileAdjustModalXnSpacing{
  display:flex;flex-direction:column;gap:6px;
  background:var(--bg-secondary);
  border:2px solid #a855f7;
  border-left:none;
  border-radius:0 8px 8px 0;
  box-shadow:0 0 24px rgba(168,85,247,0.35);
  /* Slide-out animation. When collapsed, width and padding are 0
     so the panel takes no horizontal space. When expanded, width
     becomes the content's natural width (~220px target) and padding
     gives the inner sliders breathing room. */
  overflow:hidden;
  width:0;
  padding:0;
  opacity:0;
  flex-shrink:0;
  transition:width 0.28s ease, padding 0.28s ease, opacity 0.22s ease;
  /* [v2.65] No more align-self:stretch — let the panel size to its
     own content + a small bottom drag area. Previously it stretched
     to match the main box height, leaving xN's panel with a lot of
     unused dark space at the bottom (xN has 4 sliders vs ####'s 6).
     Now both modes get a compact panel sized to content. */
  align-self:flex-start;
}
#tileAdjustModalXnSpacing.expanded{
  width:220px;
  padding:10px 10px 0 10px; /* zero bottom — drag area provides its own */
  opacity:1;
}
/* [v2.65] Bottom drag handle inside the advanced panel — a small
   strip below the sliders that the user can grab to drag the modal.
   Same horizontal-line pattern as the bottom drag handles for
   visual consistency. */
.tileAdjustAdvancedDragArea{
  height:24px;
  margin-top:8px;
  margin-bottom:6px;
  background:linear-gradient(
    to bottom,
    transparent 0%, transparent 30%,
    rgba(168,85,247,0.3) 30%, rgba(168,85,247,0.3) 36%,
    transparent 36%, transparent 50%,
    rgba(168,85,247,0.3) 50%, rgba(168,85,247,0.3) 56%,
    transparent 56%, transparent 70%,
    rgba(168,85,247,0.3) 70%, rgba(168,85,247,0.3) 76%,
    transparent 76%, transparent 100%
  );
  border-radius:3px;
  cursor:grab;
  touch-action:none;
  user-select:none;
  flex-shrink:0;
}
.tileAdjustAdvancedDragArea:active{ cursor:grabbing; background-color:rgba(168,85,247,0.08); }
.bbtn{font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:10px 12px;border-radius:3px;cursor:pointer;border:1.5px solid;}
.bundo{background:none;border-color:var(--cyan);color:var(--text-secondary);}.bundo:not(:disabled):active{background:rgba(0,217,255,0.1);}.bundo:disabled{opacity:.3;cursor:default;}
.bnew{flex:1;background:transparent;border-color:var(--cyan);color:var(--cyan);box-shadow:0 0 8px rgba(0,217,255,0.3);}.bnew:active{background:rgba(0,217,255,0.12);}
.bsound-row{width:100%;max-width:520px;padding:0 12px 12px;display:flex;gap:6px;flex-shrink:0;}
.bsnd{font-family:'IBM Plex Mono',monospace;font-size:8px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:8px 2px;border-radius:3px;cursor:pointer;border:1.5px solid rgba(0,217,255,0.4);background:none;color:var(--text-secondary);flex:1;transition:all .15s;}
.bsnd:hover{border-color:var(--cyan);color:var(--cyan);}
.bsnd.active{background:rgba(0,217,255,0.15);border-color:var(--cyan);color:var(--cyan);box-shadow:0 0 10px rgba(0,217,255,0.5);}
.bsnd-label{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.5px;color:var(--text-muted);opacity:.8;text-align:center;padding-bottom:2px;width:100%;max-width:520px;padding-left:12px;}
/* [v2.85] Win card emergence anchored to the puzzle grid.
   Was: flex-centered in the .wov overlay, animated scale .6→1
   from the card's own center. Visually felt like the card was
   slightly low because the .wov spans the full viewport but the
   user's eye is anchored on the grid (which is biased upward in
   the layout). Now: the card is positioned absolutely with its
   center on the grid's center via JS (see _positionWinCardOverGrid
   in features-module). The CSS keyframe also has a transform-
   origin at center so the scale-up reads as "expanding from where
   the puzzle is" rather than "popping in from somewhere generic".
   Width is capped at the grid's width (with sensible min/max so
   tiny grids on phones don't squash the card unreadably). */
.wov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.87);z-index:300;}
.wov.show{display:block;animation:fi .3s ease;}@keyframes fi{from{opacity:0}to{opacity:1}}
/* [v2.83] Win card rounded — was sharp 90° corners which felt out
   of step with the rest of the app's pill aesthetic now that
   buttons everywhere are 999px. 18px is a tasteful soft-rectangle
   radius (not full pill — the card is too big for that to look
   right) that matches the other rounded panels in the app. */
.wcard{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1);transform-origin:center center;background:var(--bg-secondary);border:2px solid var(--cyan);border-radius:18px;padding:28px 36px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;animation:pp .4s cubic-bezier(.36,2,.6,1) .1s both;box-shadow:0 0 30px rgba(0,217,255,0.4);box-sizing:border-box;}
/* [v3.88] First-time mode info modal — fires once when a user
   first taps chalant or nonchalant so they know what each mode
   means. Backdrop dims the menu; card uses the same cyan border
   + glow language as .wcard but with a closer-to-the-prompt feel
   (smaller, no animation overshoot — just a clean fade-in). */
.mtInfoBackdrop{
  position:fixed;left:0;top:0;right:0;bottom:0;
  background:rgba(0,0,0,0.72);
  display:flex;align-items:center;justify-content:center;
  z-index:9000;
  font-family:'IBM Plex Mono',monospace;
  opacity:0;animation:mtFadeIn 0.22s ease-out forwards;
  padding:24px;
}
.mtInfoCard{
  background:var(--bg-secondary);
  border:1.5px solid var(--cyan);
  border-radius:14px;
  padding:24px 28px 20px;
  max-width:340px;width:100%;
  text-align:center;
  box-shadow:0 0 28px rgba(0,217,255,0.32);
  transform:translateY(10px);
  animation:mtRiseIn 0.32s cubic-bezier(.2,.9,.3,1) 0.04s forwards;
}
.mtInfoTitle{
  font-size:14px;font-weight:700;letter-spacing:3px;
  color:var(--cyan);text-transform:uppercase;
  margin-bottom:12px;
}
.mtInfoBody{
  font-size:13px;line-height:1.5;letter-spacing:0.5px;
  color:var(--text-primary);
  margin-bottom:18px;
}
.mtInfoOk{
  background:transparent;
  border:1.5px solid var(--cyan);
  color:var(--cyan);
  font-family:inherit;
  font-size:11px;font-weight:700;letter-spacing:2.5px;
  text-transform:uppercase;
  padding:9px 28px;
  border-radius:22px;
  cursor:pointer;
  transition:background 0.15s, box-shadow 0.15s;
}
.mtInfoOk:active{
  background:rgba(0,217,255,0.18);
  box-shadow:0 0 12px rgba(0,217,255,0.35);
}
@keyframes mtFadeIn{ to{opacity:1;} }
@keyframes mtRiseIn{ to{transform:translateY(0);} }
/* [v2.83] Bank-tile victory-burst class. Applied to each .bt in
   sequence during the win wave (see _winWaveSequence). Quick
   scale-up + spin + fade so the tile reads as "exploding outward"
   while the particle system throws debris from its edges. After
   the animation finishes the tile keeps opacity:0 (forwards) so
   it doesn't pop back into view while the wave is still in
   progress on later tiles. Animation duration is short (350ms)
   so even at the fastest per-tile cadence (~35ms for big banks)
   the visual feels punchy, not soupy. */
@keyframes btBurst {
  0%   { transform: scale(1)    rotate(0deg);   opacity: 1; filter: brightness(1); }
  35%  { transform: scale(1.25) rotate(20deg);  opacity: 1; filter: brightness(1.6); }
  100% { transform: scale(0.4)  rotate(180deg); opacity: 0; filter: brightness(2.2); }
}
/* [v4.77] Light-mode burst keyframe. The dark-mode keyframe ramps
   filter:brightness up to 2.2, which on the DARK tile background reads
   as a nice glow. But in light mode the tile background is cream
   (var(--bg-secondary)), and brightness(2.2) blows that out to near-
   white — Sam saw the bursting tiles turn white. This variant drops
   the brightness ramp (stays at 1) so the tile keeps its normal cream
   background through the burst, matching how dark mode keeps its look.
   Transform/opacity (the actual pop motion + fade) are identical. */
@keyframes btBurstLight {
  0%   { transform: scale(1)    rotate(0deg);   opacity: 1; }
  35%  { transform: scale(1.25) rotate(20deg);  opacity: 1; }
  100% { transform: scale(0.4)  rotate(180deg); opacity: 0; }
}
.bt.bursting {
  animation: btBurst 0.35s cubic-bezier(0.45, 0, 0.55, 1) forwards;
  pointer-events: none;
}
body.light-mode .bt.bursting {
  animation: btBurstLight 0.35s cubic-bezier(0.45, 0, 0.55, 1) forwards;
}
/* [v2.85] Updated to compose with the centering translate from the
   .wcard rule (translate(-50%,-50%) is what positions the card on
   its target point). Keeping the translate in both keyframes
   means the scale-up happens FROM the anchor point, not from the
   top-left of the card. Without the translate here, the card
   would jump to the top-left corner of its bounding box during
   animation. */
@keyframes pp{from{transform:translate(-50%,-50%) scale(.6)}to{transform:translate(-50%,-50%) scale(1)}}
.wico{font-size:48px;}.wt{font-family:'Abril Fatface',serif;font-size:30px;color:var(--cyan);}
.ws{font-size:8px;letter-spacing:3px;text-transform:uppercase;color:var(--text-muted);}
/* [v2.82] Win-card action buttons rounded from 3px to 999px so
   their pill ends match the menu screen's Play/Stats buttons,
   the masthead's Menu/New buttons, and the size/difficulty
   segmented rows. Padding nudged from 11px 24px to 12px 26px
   so the wider radius reads correctly at the new pill shape. */
.wnxt{margin-top:4px;background:transparent;color:var(--cyan);border:1.5px solid var(--cyan);border-radius:999px;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:12px 26px;cursor:pointer;box-shadow:0 0 12px rgba(0,217,255,0.4);}
@keyframes winFlashAnim{0%{opacity:0}15%{opacity:1}100%{opacity:0}}
#winFlash.active{display:block;animation:winFlashAnim 0.7s ease-out forwards;}
@keyframes toastAnim{0%{opacity:0;transform:translate(-50%,10px)}15%{opacity:1;transform:translate(-50%,0)}85%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-6px)}}
#toast.show{display:block;animation:toastAnim 1.8s ease-out forwards;}

.cslider-wrap { position:relative; flex:1; cursor:ew-resize; touch-action:none; flex-shrink:0; }
.cslider-canvas { display:block; width:100%; height:100%; }

/* Canvas-overlay sliders (invisible inputs layered on top of a drawn canvas) */
.cslider-wrap input[type=range] { -webkit-appearance:none; appearance:none; background:transparent; }
.cslider-wrap input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:0; height:0; }
.cslider-wrap input[type=range]::-webkit-slider-runnable-track { background:transparent; }
.cslider-wrap input[type=range]::-moz-range-thumb { width:0; height:0; border:none; }
.cslider-wrap input[type=range]::-moz-range-track { background:transparent; }

/* ── Neon glow overrides ─────────────────────────────────── */
.seq-btn {
  box-shadow: none;
  transition: box-shadow 0.15s, transform 0.1s, background 0.15s, border-color 0.15s;
}
.seq-btn:active { box-shadow: 0 0 14px rgba(0,217,255,0.8); transform: translateY(1px); }

#seqPuz  { box-shadow: none; }
/* Play/Record transport look (matte black recessed discs with glowing rings)
   is defined in the .seq-play-btn / .seq-rec-btn rules below. */
#seqSave { box-shadow: none; }
#seqLoad { box-shadow: none; }
#seqClear { box-shadow: none; }
#seqSndBtn { box-shadow: none; }
#seqScrollLock { box-shadow: 0 0 6px rgba(0,217,255,0.2); border-radius:50%; border-color:rgba(0,217,255,0.45); }
#seqScrollLock.active { background:rgba(196,0,255,0.15); border-color:var(--magenta); color:var(--magenta); box-shadow: 0 0 12px rgba(196,0,255,0.7); }
/* Snap-to-dock hover state — no extra outline/highlight needed. The pill's
   SVG border glow is the visual feedback; the docked scroll-lock slot stays
   neutral while the pill is hovered over it, avoiding double-outline artifacts. */
#seqErase { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#seqErase.active { background:rgba(196,0,255,0.15); border-color:var(--magenta); color:var(--magenta); box-shadow: 0 0 14px rgba(196,0,255,0.8); }
#colorTagBtn { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#copyModeBtn { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnGlowToggle { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnGlowToggle.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnSensToggle { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnSensToggle.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnHapticToggle { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnHapticToggle.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnPadDsply { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnPadDsply.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnPadFx { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnPadFx.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnPadPanToggle { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnPadPanToggle.active { background:rgba(34,197,94,0.15); border-color:#22c55e; box-shadow: 0 0 12px rgba(34,197,94,0.7); color:#22c55e; }
#btnHoldMode { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnHoldMode.active { background:rgba(251,191,36,0.15); border-color:#fbbf24; box-shadow: 0 0 12px rgba(251,191,36,0.7); color:#fbbf24; }
#padsBarHoldMode { box-shadow: 0 0 4px rgba(34,197,94,0.15); }
#padsBarHoldMode.active { background:rgba(34,197,94,0.4)!important; border-color:#22c55e!important; box-shadow: 0 0 10px rgba(34,197,94,0.7)!important; color:#86efac!important; }
/* DEL button — destructive action styled in red (record-button palette)
   so it reads as distinctly dangerous vs the cyan/green mode toggles. */
#padsBarDel { box-shadow: 0 0 4px rgba(239,68,68,0.15); }
#padsBarDel.active { background:rgba(239,68,68,0.4)!important; border-color:#ef4444!important; box-shadow: 0 0 10px rgba(239,68,68,0.7)!important; color:#fecaca!important; }
/* Shard particle used by the delete explosion animation. Positioned
   absolutely by JS at the tile's centre; each shard gets a randomized
   shape (square/triangle/pentagon) drawn via clip-path. */
._delShard { position: fixed; pointer-events: none; background: #ef4444; will-change: transform, opacity; z-index: 999; }
@keyframes _delShardFly {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}
#padsBarColor.active { background:rgba(34,197,94,0.4)!important; border-color:#22c55e!important; box-shadow: 0 0 10px rgba(34,197,94,0.7)!important; color:#86efac!important; }
#btnExprCross { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnExprCross.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnPadExprToggle { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnPadExprToggle.active { background:rgba(251,191,36,0.15); border-color:#fbbf24; box-shadow: 0 0 12px rgba(251,191,36,0.7); color:#fbbf24; }
#btnExprGrid { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnExprGrid.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnHideNums { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnHideNums.active { background:rgba(249,115,22,0.15); border-color:#f97316; box-shadow: 0 0 12px rgba(249,115,22,0.7); color:#f97316; }
#btnSnapX { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnSnapX.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnSnapY { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnSnapY.active { background:rgba(251,191,36,0.15); border-color:#fbbf24; box-shadow: 0 0 12px rgba(251,191,36,0.7); color:#fbbf24; }
#btnSpinToggle { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnSpinToggle.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#btnParticleToggle { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#btnParticleToggle.active { background:rgba(0,217,255,0.15); border-color:var(--cyan-bright); box-shadow: 0 0 12px rgba(0,217,255,0.7); }
#seqPro { box-shadow: 0 0 8px rgba(196,0,255,0.3); border-color:var(--magenta); color:var(--magenta); }
#seqPro.active { background:rgba(196,0,255,0.2); box-shadow: 0 0 16px rgba(196,0,255,0.8); border-color:var(--magenta-bright); color:var(--magenta-bright); }

.pro-btn {
  box-shadow: 0 0 4px rgba(0,217,255,0.15);
  transition: box-shadow 0.1s, transform 0.1s, background 0.1s;
}
.pro-btn:active { box-shadow: 0 0 10px rgba(0,217,255,0.6); transform: translateY(1px); }
.pro-btn.active { background:rgba(0,217,255,0.15); box-shadow: 0 0 12px rgba(0,217,255,0.7); }

.pro-slot {
  box-shadow: 0 0 4px rgba(0,217,255,0.1);
  transition: box-shadow 0.1s;
  background: transparent;
  color: var(--text-secondary);
  border-color: rgba(0,217,255,0.3);
}
.pro-slot.active { box-shadow: 0 0 10px rgba(0,217,255,0.6); }

.pro-feel { box-shadow: 0 0 4px rgba(0,217,255,0.1); }
.pro-feel.active { background:rgba(0,217,255,0.15); box-shadow: 0 0 10px rgba(0,217,255,0.6); border-color:var(--cyan); color:var(--cyan); }

#barsMenuBtn { box-shadow: 0 0 6px rgba(0,217,255,0.2); }
#proClick.active { background:rgba(0,217,255,0.15); box-shadow: 0 0 10px rgba(0,217,255,0.6); border-color:var(--cyan); color:var(--cyan); }
#proAccent.active { background:rgba(0,217,255,0.15); box-shadow: 0 0 10px rgba(0,217,255,0.6); border-color:var(--cyan); color:var(--cyan); }
#proTap, #tbTapBtn { box-shadow: 0 0 8px rgba(196,0,255,0.4); border-color:var(--magenta); color:var(--magenta); }
#eraseConfirm { box-shadow: 0 0 8px rgba(249,115,22,0.5); background:rgba(249,115,22,0.15); border-color:#f97316; color:#f97316; }
.bsnd { box-shadow: 0 0 3px rgba(0,217,255,0.1); }
.bsnd.active { box-shadow: 0 0 10px rgba(0,217,255,0.5); }
.seq-pro-btn { box-shadow: 0 0 8px rgba(196,0,255,0.3); }

/* ── Sequence Bank Panel ──────────────────────────────────── */
.seq-bank-panel{width:100%;max-width:520px;background:var(--bg-secondary);border-top:1px solid rgba(0,217,255,0.12);border-bottom:1px solid rgba(0,217,255,0.12);display:none;flex-direction:row;align-items:stretch;gap:0;flex-shrink:0;}
.xl2-mode .seq-bank-panel{max-width:100%;}
.seq-bank-panel.active{display:flex;}

/* Left: A/B/C bank selector */
.seq-abc-col{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:6px 4px 6px 6px;border-right:1px solid rgba(0,217,255,0.2);flex-shrink:0;}
.seq-abc-btn{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--cyan);background:transparent;color:var(--text-secondary);font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.15s;flex-shrink:0;}
.seq-abc-btn.active{background:rgba(0,217,255,0.2);color:var(--cyan);border-color:var(--cyan-bright);box-shadow:0 0 10px rgba(0,217,255,0.6);}

/* Center: 3x5 slot grid */
.seq-slot-area{display:flex;flex-direction:column;flex:1;min-width:0;padding:6px 4px;}
.seq-slot-col-labels{display:flex;gap:3px;padding:0 0 3px 0;}
.seq-slot-col-lbl{flex:1;text-align:center;font-family:'IBM Plex Mono',monospace;font-size:7px;font-weight:700;color:var(--text-muted);letter-spacing:1px;}
.seq-slot-grid{display:flex;flex-direction:column;gap:3px;}
.seq-slot-row{display:flex;gap:3px;}
.seq-slot-btn{flex:1;height:28px;border-radius:6px;border:1.5px solid rgba(0,217,255,0.3);background:var(--bg);color:var(--text-secondary);font-family:'IBM Plex Mono',monospace;font-size:9px;font-weight:700;cursor:pointer;position:relative;overflow:hidden;transition:all 0.12s;padding:0;display:flex;align-items:center;justify-content:center;}
.seq-slot-btn.active{border-color:var(--cyan);color:var(--cyan);background:rgba(0,217,255,0.12);box-shadow:0 0 8px rgba(0,217,255,0.5);}
.seq-slot-btn.has-data{border-color:var(--magenta);}
.seq-slot-btn.has-data::after{content:'';position:absolute;bottom:0;right:0;width:0;height:0;border-style:solid;border-width:0 0 8px 8px;border-color:transparent transparent #ffe250 transparent;}
.seq-slot-btn.active.has-data{border-color:var(--cyan);}

/* Beat dots row below grid */
.seq-bank-beat-row{padding:4px 0 2px;display:flex;justify-content:center;}

/* Bottom row: color + del */
.seq-bank-bottom{display:flex;gap:5px;align-items:center;padding:4px 0 0;}
.seq-del-btn{height:28px;padding:0 10px;border-radius:5px;border:2px solid var(--cyan);background:rgba(0,217,255,0.07);color:var(--cyan);font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:700;cursor:pointer;letter-spacing:1.5px;flex-shrink:0;transition:all 0.12s;}
.seq-del-btn:hover{background:rgba(0,217,255,0.18);box-shadow:0 0 8px rgba(0,217,255,0.5);}
.seq-color-btn{height:28px;padding:0 8px;border-radius:5px;border:1.5px solid rgba(0,217,255,0.4);background:transparent;color:var(--text-secondary);font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:700;cursor:pointer;letter-spacing:1px;flex-shrink:0;transition:all 0.12s;}
.seq-color-btn:hover{border-color:var(--cyan);color:var(--cyan);}

/* Right: Transport panel */
.seq-transport-col{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:6px 8px 6px 6px;border-left:1px solid rgba(0,217,255,0.2);flex-shrink:0;min-width:100px;}
.seq-bpm-row{display:flex;flex-direction:row;align-items:center;gap:4px;width:100%;}
.seq-bpm-label{font-family:'IBM Plex Mono',monospace;font-size:8px;font-weight:700;color:var(--text-muted);letter-spacing:1px;flex-shrink:0;}
.seq-bpm-input{width:42px;font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:700;border:1.5px solid var(--cyan);border-radius:4px;padding:2px 3px;background:var(--bg);color:var(--text-primary);text-align:center;flex-shrink:0;}
.seq-tap-btn{height:24px;padding:0 10px;border-radius:12px;border:1.5px solid var(--magenta);background:transparent;color:var(--magenta);font-family:'IBM Plex Mono',monospace;font-size:8px;font-weight:700;cursor:pointer;letter-spacing:1px;flex-shrink:0;transition:all 0.12s;}
.seq-tap-btn:hover{background:rgba(196,0,255,0.15);box-shadow:0 0 8px rgba(196,0,255,0.4);}
.seq-play-btn{
  width:68px;height:68px;border-radius:50%;
  border:none;padding:0;
  background:#0a0a0a;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:all 0.15s;
  flex-shrink:0;
  box-shadow:
    inset 0 0 0 2.5px rgba(90,255,180,0.25),
    inset 0 0 4px 1px rgba(140,255,200,0.12),
    0 0 0 1px rgba(42,252,138,0.18),
    0 0 5px 1px rgba(60,255,160,0.12),
    0 0 12px 3px rgba(42,252,138,0.07);
}
.seq-play-btn.playing{
  background:#051a0c;
  box-shadow:
    inset 0 0 0 2.5px rgba(90,255,180,1),
    inset 0 0 8px 3px rgba(140,255,200,0.85),
    0 0 0 1.5px rgba(42,252,138,0.95),
    0 0 12px 3px rgba(60,255,160,0.8),
    0 0 34px 10px rgba(42,252,138,0.5),
    0 0 60px 16px rgba(42,252,138,0.22);
}
/* SVG triangle inside the play button */
.seq-play-btn svg{display:block;width:40%;height:40%;overflow:visible;transition:all 0.15s;}
.seq-play-btn .play-tri-face{fill:url(#playTriGradientDim);stroke:rgba(90,180,120,0.2);stroke-width:1.2;stroke-linejoin:round;}
.seq-play-btn .play-tri-highlight{fill:none;stroke:rgba(220,255,235,0.3);stroke-width:0.9;stroke-linejoin:round;stroke-linecap:round;}
.seq-play-btn svg{filter:drop-shadow(0 0 1px rgba(90,255,180,0.25));}
.seq-play-btn.playing .play-tri-face{fill:url(#playTriGradient);stroke:rgba(180,255,210,0.85);stroke-width:1.2;}
.seq-play-btn.playing .play-tri-highlight{stroke:rgba(220,255,235,0.9);}
.seq-play-btn.playing svg{filter:drop-shadow(0 0 3px rgba(90,255,180,0.8)) drop-shadow(0 0 6px rgba(42,252,138,0.45));}
.seq-rec-btn{
  width:40px;height:40px;border-radius:50%;
  border:none;
  background:#0a0a0a;
  color:#3a0810;
  font-family:'IBM Plex Mono',monospace;
  font-size:8.5px;font-weight:700;letter-spacing:0.5px;
  text-shadow:none;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:all 0.15s;
  flex-shrink:0;
  box-shadow:
    inset 0 0 0 2px rgba(255,80,110,0.22),
    inset 0 0 3px 1px rgba(255,140,160,0.1),
    0 0 0 1px rgba(255,42,85,0.15),
    0 0 4px 1px rgba(255,80,100,0.1),
    0 0 10px 3px rgba(255,42,85,0.06);
}
.seq-rec-btn.active{
  background:#1a0508;
  color:#ff5577;
  text-shadow:0 0 4px rgba(255,90,120,0.9);
  box-shadow:
    inset 0 0 0 2px rgba(255,80,110,1),
    inset 0 0 5px 2px rgba(255,140,160,0.85),
    0 0 0 1.5px rgba(255,42,85,0.95),
    0 0 8px 2px rgba(255,80,100,0.8),
    0 0 22px 6px rgba(255,42,85,0.5),
    0 0 40px 10px rgba(255,42,85,0.22);
}
.seq-transport-btns-row{display:flex;gap:6px;align-items:center;}
.seq-transport-micro-row{display:flex;gap:3px;align-items:center;}
.seq-scroll-lock-wrap{display:flex;flex-direction:column;align-items:center;gap:1px;}
.seq-scroll-lock-lbl{font-family:'IBM Plex Mono',monospace;font-size:6px;font-weight:700;color:var(--text-muted);letter-spacing:0.5px;text-transform:uppercase;line-height:1;}
.seq-panel{width:100%;max-width:520px;background:var(--bg-secondary);border:1px solid rgba(0,217,255,0.12);border-radius:6px;overflow:hidden;transition:all 0.3s ease;flex-shrink:0;}
.xl2-mode .seq-panel{max-width:100%;}
.seq-panel-header{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--bg-tertiary);border-bottom:1px solid rgba(0,217,255,0.3);cursor:pointer;user-select:none;}
.seq-panel-toggle{width:18px;height:18px;background:transparent;border:1px solid var(--cyan);border-radius:3px;color:var(--cyan);font-size:9px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform 0.3s;padding:0;flex-shrink:0;}
.seq-panel.collapsed .seq-panel-toggle{transform:rotate(-90deg);}
.seq-panel-label{font-size:8px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--cyan);flex:1;}
.seq-panel-body{overflow:hidden;max-height:2000px;transition:max-height 0.3s ease,opacity 0.3s ease,padding 0.3s ease;}
.seq-panel.collapsed .seq-panel-body{max-height:0;opacity:0;}

/* ── Slim arrow-style collapsible panel ────────────────────── */
/* Open: just a tiny ▲ in the corner, no bar */
/* Collapsed: slim labeled bar */
.slim-panel{width:100%;max-width:520px;flex-shrink:0;position:relative;margin:0;padding:0;}
.xl2-mode .slim-panel{max-width:100%;}
.slim-panel-bar{display:flex;width:100%;height:18px;background:var(--bg-secondary);border-top:1px solid rgba(0,217,255,0.12);border-bottom:1px solid rgba(0,217,255,0.12);align-items:center;gap:6px;cursor:pointer;flex-shrink:0;padding:0 8px;}
.slim-panel-bar-arrow{background:transparent;border:none;color:rgba(0,217,255,0.7);font-size:16px;cursor:pointer;padding:0;line-height:1;flex-shrink:0;transition:transform 0.25s;transform:scaleX(0.4) rotate(180deg);transform-origin:center center;display:inline-flex;align-items:center;justify-content:center;position:relative;}
.slim-panel-bar-arrow::after{content:none;}
.slim-panel.collapsed .slim-panel-bar-arrow{transform:scaleX(0.4) rotate(0deg);left:0;}
.slim-panel:not(.collapsed) .slim-panel-bar-arrow{left:8px;}
.slim-panel-bar span{font-family:'IBM Plex Mono',monospace;font-size:7px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:rgba(0,217,255,0.55);flex:1;transition:color 0.2s ease, text-shadow 0.2s ease;}
/* Light up the panel's label when the panel is open (not collapsed).
   Brighter cyan + a soft glow so each maximized panel reads clearly
   from a glance at the row of bars. Collapsed panels keep the dim
   baseline so you can tell "what's open" at a distance. */
.slim-panel:not(.collapsed) > .slim-panel-bar span{color:var(--cyan);text-shadow:0 0 6px rgba(0,217,255,0.55);}
.slim-panel:not(.collapsed) > .slim-panel-bar > .slim-panel-bar-arrow{color:var(--cyan);}
.slim-panel-body{overflow:hidden;}
.slim-panel-body>.slim-panel-body-inner{transform:translateY(0);transition:transform 0.2s ease;}
.slim-panel.collapsed .slim-panel-body{max-height:0;overflow:hidden;opacity:0;}
.slim-panel.collapsed .slim-panel-body>.slim-panel-body-inner{transform:translateY(-100%);}
.slim-panel+.slim-panel>.slim-panel-bar{margin-top:-1px;}
#padPanelBar{border-bottom:1px solid rgba(0,217,255,0.12);}
/* Drawer tucks away with the PADS panel when it collapses — overrides
   any inline max-height the drawer-toggle JS may have set. The JS
   state is preserved, so reopening the panel restores the drawer to
   whatever open/closed state the user last chose. */
.slim-panel.collapsed #padsBarToolsDrawer,
.slim-panel.collapsed #padsBarAdjDrawer,
.slim-panel.collapsed #padsBarKitsDrawer,
.slim-panel.collapsed #seqCtrlMenuDrawer,
.slim-panel.collapsed #seqCtrlAdjDrawer{max-height:0!important;opacity:0!important;border-bottom:none!important;}
/* When the PADS panel is collapsed, force the MENU and ADJUSTMENTS
   toggle buttons into their dull/inactive look — even if they would
   otherwise be marked .active (drawer open). The drawers are hidden
   by the rule above, so showing the buttons as "on" would be
   misleading. The .active class itself isn't touched; reopening
   PADS restores the normal active styling automatically. */
.slim-panel.collapsed #padsBarToolsToggle,
.slim-panel.collapsed #padsBarAdjToggle,
.slim-panel.collapsed #padsBarKitsToggle,
.slim-panel.collapsed #seqCtrlMenuToggle,
.slim-panel.collapsed #seqCtrlAdjToggle{
  background:transparent!important;
  box-shadow:none!important;
  border-color:rgba(0,217,255,0.35)!important;
  color:rgba(0,217,255,0.55)!important;
}
.slim-panel.collapsed .slim-panel-body{max-height:0!important;height:0!important;opacity:0;padding:0!important;margin:0!important;border:none!important;overflow:hidden!important;}

/* ───────────────────────────────────────────────────────────────
   DULL-INACTIVE OVERRIDES
   Goal: buttons that aren't toggled-on read as "resting" with a dim
   border (35% cyan / magenta alpha) instead of the full-brightness
   stroke they used to default to. Active / .active / toggled-on
   states keep their full-brightness look because the existing
   active rules explicitly set border-color + box-shadow to bright
   values and come later or at equal specificity with !important
   where needed.
   The pattern for each selector: the base style is dimmed, and the
   active override (where one exists) re-brightens.
   ─────────────────────────────────────────────────────────────── */

/* Sequence bank A/B/C buttons — A is active by default; B/C dim. */
.seq-abc-btn{border-color:rgba(0,217,255,0.35);box-shadow:none;}
.seq-abc-btn.active{border-color:var(--cyan-bright);box-shadow:0 0 10px rgba(0,217,255,0.6);}

/* BPM input + TAP pill on the sequence bank transport. TAP keeps its
   magenta tint but dimmer. */
.seq-bpm-input{border-color:rgba(0,217,255,0.35);}
.seq-tap-btn{border-color:rgba(196,0,255,0.35);color:rgba(196,0,255,0.75);}
.seq-tap-btn:hover{border-color:var(--magenta);background:rgba(196,0,255,0.15);box-shadow:0 0 8px rgba(196,0,255,0.4);color:var(--magenta);}

/* DEL button on the sequence bank (clears sequence events). */
.seq-del-btn{border-color:rgba(0,217,255,0.35);color:rgba(0,217,255,0.7);background:transparent;box-shadow:none;}
.seq-del-btn:hover{border-color:var(--cyan);background:rgba(0,217,255,0.18);box-shadow:0 0 8px rgba(0,217,255,0.5);color:var(--cyan);}

/* Pro toolbar buttons inside SEQUENCER CONTROLS (CLICK/ACCENT/FEEL/
   QUANTIZE density + quantize selectors etc.). Dim when not .active. */
.pro-btn{border-color:rgba(0,217,255,0.35);box-shadow:none;color:var(--text-secondary);}
.pro-btn.active{border-color:var(--cyan-bright);box-shadow:0 0 12px rgba(0,217,255,0.7);color:var(--cyan);}

/* BPM input + TAP pill inside SEQUENCER CONTROLS panel too. */
.pro-bpm{border-color:rgba(0,217,255,0.35);}
.pro-tap{border-color:rgba(196,0,255,0.35);color:rgba(196,0,255,0.75);box-shadow:none;}
.pro-tap:hover,.pro-tap:active{border-color:var(--magenta);color:var(--magenta);box-shadow:0 0 8px rgba(196,0,255,0.4);}

/* BARS menu button sits in the SEQUENCER CONTROLS bar header. Its
   inline style sets cyan border directly, so we need to over-specify.
   The active styling is applied via the JS at setBars() so we just
   dim the resting state here. */
#barsMenuBtn:not(.active){border-color:rgba(0,217,255,0.35)!important;color:rgba(0,217,255,0.7)!important;box-shadow:none!important;}

/* PITCH · VOL · PAN undock + lock buttons (⊞ / 🔓 icons). They carry
   inline cyan border in the HTML — dim them with !important. */
#pitchUndockBtn,#volLockBtn,#volUndockBtn,#panUndockBtn{border-color:rgba(0,217,255,0.35)!important;color:rgba(0,217,255,0.7)!important;}

/* Master EQ tabs are styled inline by JS (purple when active, dim when
   not). The RESET button is always "resting" — dim its inline border.
   BASIC/PARAMETRIC tabs stay JS-controlled to avoid stomping on the
   active-state purple fill. */
#eqResetBtn{border-color:rgba(0,217,255,0.35)!important;color:rgba(0,217,255,0.7)!important;}

/* MENU / ADJUSTMENTS toggle text/border dulling is already handled by
   the inline JS toggle — border inactive is already 0.35 alpha. Dull
   the text colour too so the whole button reads as resting. */
#padsBarToolsToggle:not(.active),#padsBarAdjToggle:not(.active),#padsBarKitsToggle:not(.active){color:rgba(0,217,255,0.75);}
#padsBarToolsToggle.active,#padsBarAdjToggle.active,#padsBarKitsToggle.active{color:var(--cyan);}

/* CLASSIC button on the MENU drawer. Dim border + slightly muted cyan
   text when resting; tapping opens the style popup so there's no
   persistent active state. */
#padsBarClassic{border-color:rgba(0,217,255,0.35)!important;color:rgba(0,217,255,0.85)!important;}

/* SAVE button on the MENU drawer. Keeps its amber theme but dims
   slightly so it matches the resting look of its neighbours. */
#padsBarSaveKit:not(.active){border-color:rgba(251,191,36,0.35)!important;color:rgba(251,191,36,0.85)!important;}

/* MENU-drawer buttons EDIT / HLD BTN / COLOR / DEL already have dim
   inactive borders from their inline styles. Their text colours were
   set fully saturated — match that to the border-alpha for a more
   consistent resting look. The active overrides defined earlier
   (#padsBarHoldMode.active etc) already re-saturate everything. */
#padsBarEdit:not(.active){color:rgba(74,222,128,0.85);}
#padsBarHoldMode:not(.active){color:rgba(74,222,128,0.85);}
#padsBarColor:not(.active){color:rgba(74,222,128,0.85);}
#padsBarDel:not(.active){color:rgba(248,113,113,0.85);}
/* COPY dim resting (green) — when neither active nor paste classes set. */
#padsBarCopy:not(.active):not(.paste){color:rgba(74,222,128,0.85);}
</style>
</head>
<body class="menu-active">
<div id="_err" style="display:none;position:fixed;inset:0;z-index:9999;background:#0f0f0f;color:#00d9ff;padding:20px;font-family:monospace;font-size:12px;overflow:auto;border:2px solid #00d9ff;"></div>

<!-- [v4.05] Boot splash. External asset at assets/equil-logo.jpg so
     the HTML stays lean (per the assets-outside-the-HTML decision).
     Fails silent: if the image doesn't load (e.g. local testing with
     no assets/ folder), the splash never appears — no broken image
     icon, no toggle to remember. Set window._skipSplash=true below
     to force-skip during testing without touching assets. -->
<div id="bootSplash" style="display:none;position:fixed;inset:0;z-index:9000;background:#0a0a0a;align-items:center;justify-content:center;opacity:0;transition:opacity 200ms ease;pointer-events:none;">
  <img id="bootSplashImg" alt="" style="max-width:80vw;max-height:70vh;width:auto;height:auto;display:block;filter:drop-shadow(0 0 24px rgba(0,217,255,0.18));">
</div>
<script>
(function(){
  // Dev override — set to true to skip the splash entirely (useful
  // when iterating and you don't want to wait 2s every reload).
  window._skipSplash = false;

  // [v4.11] Dev overrides for the win-card PB bursts. When true, the
  // corresponding burst displays on EVERY solve regardless of whether
  // it was a real per-template PB. Useful for screenshots or design
  // iteration when you can't organically beat your best.
  // [v4.58] Both now default false here AND are wired to the settings
  // panel ("Debug — win card → Always show PB bursts"). _applyTuning
  // overwrites these from the saved option after this script runs;
  // these initial values only matter for the brief window before
  // _loadOpts/_applyTuning fires, which is well before any solve
  // could occur. Sam's complaint that "best moves always shows up"
  // was the v4.11 dev flag (line said _forceMovesBurst = true) that
  // never got reverted.
  window._forceTimeBurst  = false;
  window._forceMovesBurst = false;

  if(window._skipSplash) return;

  var splash = document.getElementById('bootSplash');
  var img    = document.getElementById('bootSplashImg');
  if(!splash || !img) return;

  // Probe the image first. Only show the splash if it actually loads.
  // If it 404s (local testing without the assets folder), do nothing.
  var probe = new Image();
  probe.onload = function(){
    img.src = probe.src;
    splash.style.display = 'flex';
    // Force reflow so the opacity transition takes effect.
    void splash.offsetWidth;
    splash.style.opacity = '1';

    // [v4.07] Timing now totals ~3s: 200ms fade-in + 2600ms hold +
    // 200ms fade-out. The "hold" setTimeout fires at fade-in+hold
    // (200+2600 = 2800ms) and starts the fade-out, which finishes
    // ~220ms later when the element is removed.
    setTimeout(function(){
      splash.style.opacity = '0';
      setTimeout(function(){
        if(splash.parentNode) splash.parentNode.removeChild(splash);
      }, 220);
    }, 2800);
  };
  probe.onerror = function(){
    // Silent fail — asset isn't there, just skip the splash entirely.
    if(splash && splash.parentNode) splash.parentNode.removeChild(splash);
  };
  probe.src = 'assets/equil-logo.webp';
})();
</script>

<script>
window.onerror=function(msg,src,line,col,err){
  var d=document.getElementById("_err");
  d.style.display="block";
  d.innerHTML="<b>JS ERROR:</b><br>"+msg+"<br>Line:"+line+"<br>"+src;
  return false;
};
// Hide selScreen until fonts are loaded to prevent the flash of unstyled
// text (serif fallback) before Abril Fatface arrives from Google Fonts.
// The sel-mast h1 was showing in the wrong font for ~100-500ms after page
// load, then re-rendering in the correct font once the webfont finished
// downloading. Revealing only after fonts are ready eliminates that flash.
(function(){
  function revealSel(){
    var el=document.getElementById('selScreen');
    if(el) el.style.visibility='';
  }
  // Safety timeout — reveal no matter what after 1.2s so the screen isn't
  // stuck hidden if the fonts API is unreliable or fonts fail to load.
  setTimeout(revealSel, 1200);
  if(document.fonts && document.fonts.ready && document.fonts.ready.then){
    document.fonts.ready.then(revealSel);
  } else {
    // Fallback for old browsers — reveal immediately.
    revealSel();
  }
})();
</script>
<!-- SELECTION SCREEN -->
<div class="sel-screen" id="selScreen" style="visibility:hidden;">
  <div class="sel-mast">
    <h1><span>E</span>QUIL</h1>
    <p>A math crossword puzzle for humans</p>
  </div>

  <!-- [v3.49] Resume banner — populated and shown on menu reveal if
       a saved in-progress puzzle exists with elapsed > 30s and !won.
       Tapping the banner resumes the puzzle (skips the READY overlay
       since the player already started). The small ✕ on the right
       discards the save and starts fresh. -->
  <div id="resumeBanner" style="display:none;margin:6px auto 18px;width:90%;max-width:480px;font-family:'IBM Plex Mono',monospace;">
    <div style="display:flex;align-items:stretch;gap:0;border:1.5px solid var(--cyan);border-radius:14px;background:rgba(0,217,255,0.10);box-shadow:0 0 12px rgba(0,217,255,0.25);overflow:hidden;">
      <button id="resumeBannerBtn" style="flex:1;background:transparent;border:0;color:var(--cyan);font-family:inherit;font-size:12px;font-weight:700;letter-spacing:1.5px;padding:12px 18px;cursor:pointer;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:3px;">
        <span style="font-size:13px;letter-spacing:2px;">▶ RESUME</span>
        <span id="resumeBannerInfo" style="font-size:9px;font-weight:400;letter-spacing:1px;opacity:0.75;color:var(--text-secondary);">— · — · — moves</span>
      </button>
      <button id="resumeBannerDismiss" title="Discard" style="background:transparent;border:0;border-left:1px solid rgba(0,217,255,0.3);color:var(--cyan);font-family:inherit;font-size:14px;font-weight:700;padding:0 16px;cursor:pointer;opacity:0.6;">✕</button>
    </div>
  </div>

  <!-- [v2.70] Daily Puzzle button removed for now. Reason: with no
       established player community there's no social loop around a
       shared daily — the slot was competing with PLAY for attention
       without paying its way. The handler at the bottom of the file
       (~line 13628) is guarded by `if(dailyBtn)` so it just no-ops
       when the element isn't present; underlying daily-mode code in
       _mc113 / showGame is left intact in case we revive this. -->

  <div class="sel-section">
    <div class="sel-label">Puzzle Size</div>
    <div class="sel-row">
      <button class="sel-btn on" data-size="small">Small<small>~9×9</small></button>
      <button class="sel-btn" data-size="medium">Medium<small>~10×10</small></button>
      <button class="sel-btn" data-size="large">Large<small>~15×15</small></button>
      <button class="sel-btn" data-size="xl2">Jumbo<small>~30×25</small></button>
    </div>
  </div>

  <div class="sel-section">
    <div class="sel-label">Difficulty</div>
    <div class="sel-row">
      <button class="sel-btn" data-diff="easy">Easy<small>+ and −</small></button>
      <button class="sel-btn on" data-diff="medium">Less Easy<small>+ − × /</small></button>
      <button class="sel-btn" data-diff="hard">Hard<small>More blanks</small></button>
    </div>
  </div>

  <!-- [v3.84/v3.85] Chalant / nonchalant — Equil's two-mode selector.
       Chalant: timer counts toward your stats, per-template best
       times update, ghost-runner bar visible.
       Nonchalant: pure puzzle. Timer runs for self-reference but
       nothing is recorded and the ghost-runner bar stays hidden.
       [v3.85] Descriptions stripped (testing whether users figure
       the pair out unaided) and the row uses the compact .sel-btn
       variant so it reads as a tidy binary toggle rather than
       another full-height selection row. -->
  <div class="sel-section" style="margin-bottom:18px;">
    <div class="sel-label">Mode</div>
    <div class="sel-row">
      <button class="sel-btn sel-btn-compact" data-mode="chalant">Chalant</button>
      <button class="sel-btn sel-btn-compact on" data-mode="nonchalant">Nonchalant</button>
    </div>
  </div>

  <!-- [v2.70] Play and Stats buttons each wrapped in a flex-centered
       row so they sit centered as auto-width pills instead of being
       full-column-width slabs. Stats inline styles overridden:
       width:auto, generous horizontal padding, and an 18px radius
       which is half the ~36px computed button height — so its ends
       go nearly fully semi-circular like Play does. -->
  <div class="sel-cta-row"><button class="sel-play" id="playBtn"><span class="play-row"><span class="play-tri">▶</span><span class="play-stack"><span class="play-main">PLAY</span><span class="play-divider"></span><span class="play-resume" id="playResumeLbl">RESUME</span></span></span></button></div>
  <div class="sel-cta-row"><button id="statsBtn" style="margin-top:10px;width:auto;padding:10px 28px;background:transparent;border:1.5px solid rgba(0,217,255,0.4);border-radius:18px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text-secondary);cursor:pointer;font-weight:700;">📊 Stats</button></div>
  <div id="_seqVersionTag" style="margin-top:14px;font-family:'IBM Plex Mono',monospace;font-size:12px;color:rgba(0,217,255,0.55);letter-spacing:3px;text-align:center;font-weight:700;">v4.77</div>
</div>

<!-- GAME SCREEN -->
<div class="game-screen" id="gameScreen">
  <!-- [v2.75] Masthead restructured into 3 equal-flex slots so the
       EQUIL title is geometrically centered (was approximate before).
       Difficulty/size info moved from a sibling element to a small
       line directly under the title inside .mast-center. New + ⚙
       grouped on the right; Menu stays on the left. All three
       buttons share matching pill-rounded styling via .mast-back
       (Menu/New) and an inline-styled circular ⚙. -->
  <div class="mast">
    <div class="mast-side left">
      <!-- [v3.47] Back arrow optical-centering fix. line-height:1 was
           still placing the ← visually low because the glyph's ink
           sits in the upper-middle of its em-box.
           [v3.57] 2px wasn't enough — bumped to 3px. The IBM Plex
           Mono ← glyph's visible shaft lands slightly above the em-
           box midline, so a 3px lift gets the visual center of the
           arrow shape (not its bounding box) onto the button's
           geometric center. -->
      <button class="mast-back" id="backBtn" style="height:28px;padding:0 12px;font-size:24px;line-height:1;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;" title="Menu"><span style="display:inline-block;transform:translateY(-5px);">←</span></button>
      <!-- [v3.46] Pause locked to 28px to match. Vertical bars sized
           proportionally — 12px tall x 3px wide, slightly smaller
           than the previous 14px so they fit cleanly inside a 28px
           button. -->
      <button class="mast-back" id="pauseBtn" style="height:28px;color:var(--cyan);border-color:var(--cyan);box-shadow:0 0 8px rgba(0,217,255,0.3);padding:0 10px;margin-left:6px;display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;" title="Pause">
        <span style="display:inline-block;width:3px;height:12px;background:var(--cyan);border-radius:1px;box-shadow:0 0 4px rgba(0,217,255,0.6);"></span>
        <span style="display:inline-block;width:3px;height:12px;background:var(--cyan);border-radius:1px;box-shadow:0 0 4px rgba(0,217,255,0.6);"></span>
      </button>
    </div>
    <div class="mast-center">
      <div class="mast-title" id="mastTitle"><span>E</span>QUIL</div>
      <div class="mast-info" id="mastInfo">HARD · JUMBO</div>
    </div>
    <div class="mast-side right">
      <!-- [v2.75] "New" button uses .mast-back styling. [v3.46] Locked
           to height:28px to match the settings ⚙ for visual rhythm
           with the left-side back/pause buttons. -->
      <button class="mast-back" id="newp" style="height:28px;padding:0 14px;color:var(--cyan);border-color:var(--cyan);box-shadow:0 0 8px rgba(0,217,255,0.3);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;">New</button>
      <!-- [v2.97] WIN! debug button removed. Was the magenta tester
           that fired the full win sequence on demand (wave →
           fanfare → win card) for tuning. Win sequence is now
           dialed in, so the button no longer earns its masthead
           real estate. The handler IIFE that wired its click is
           also removed below. The _showWinCard {skipRecord:true}
           flag added in v2.84 is left in place — harmless, and
           handy if we ever revive the test rig. -->
      <button id="optBtn" style="font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:700;width:28px;height:28px;padding:0;border-radius:999px;border:1.5px solid var(--cyan);background:transparent;color:var(--cyan);box-shadow:0 0 8px rgba(0,217,255,0.3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;" title="Options">⚙</button>
    </div>
  </div>
  <!-- [v3.48] Stats row — timer is bare cyan numbers (no pill outline).
       Too many pill shapes lined up at the top read as visual clutter.
       The numbers carry a strong cyan text-shadow that pulses brighter
       on game start (handled by the GO transition) then settles into
       a softer steady glow. -->
  <div id="mastStats" style="width:100%;max-width:520px;padding:5px 14px 3px;display:flex;align-items:center;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;letter-spacing:2px;color:var(--cyan);background:var(--bg-tertiary);border-bottom:1px solid rgba(0,217,255,0.2);flex-shrink:0;">
    <div style="flex:1;display:flex;justify-content:flex-start;align-items:center;">
      <span><span id="mastMoves">0</span> moves</span>
    </div>
    <div style="flex:0 0 auto;text-align:center;">
      <span id="mastTimerWrap" style="display:inline-flex;align-items:center;justify-content:center;font-size:18px;letter-spacing:3px;color:var(--cyan);text-shadow:0 0 6px rgba(0,217,255,0.55);transition:opacity 0.4s ease, text-shadow 0.5s ease;font-weight:700;">
        <span id="mastTimer">0:00</span>
      </span>
    </div>
    <div style="flex:1;display:flex;justify-content:flex-end;align-items:center;gap:8px;">
      <span id="mastMistakesWrap" style="display:none;align-items:center;gap:6px;color:#ff6b6b;">
        <span><span id="mastMistakes">0</span> ✕</span>
      </span>
      <!-- [v4.65] Theme toggle relocated here from the toolbar row
           below the bank. Now lives at the right end of the timer
           row, opposite the moves count. Same pill styling.
           Original location got crowded with UNDO/template/DEV; this
           spot is naturally adjacent to other status info (timer,
           mistakes). -->
      <button id="themeToggle" title="Toggle light/dark theme" style="background:rgba(0,217,255,0.12);border:1.5px solid rgba(0,217,255,0.55);color:rgba(0,217,255,0.95);font:13px/1 'IBM Plex Mono',monospace;padding:3px 8px;border-radius:999px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:opacity 0.15s ease,background 0.15s ease,border-color 0.15s ease,color 0.15s ease;min-width:28px;line-height:1;">
        <span id="themeToggleIcon" style="line-height:1;font-size:13px;">☀</span>
      </button>
    </div>
  </div>
  <!-- [v3.84] Ghost-runner bar. Only visible in chalant mode when a
       best time is known for this template+size+diff (or fallback
       to size+diff). Width represents time remaining vs that best;
       symmetric shrink from both edges via scaleX with origin:center.
       Replaced by a static "Best time: X:XX" label once elapsed
       crosses the best.
       [v4.47] Hidden via display:none (was visibility:hidden). The
       new paceStats element below replaces this. The ghost-bar
       machinery (state, _initGhostBar, _updateGhostBar) is still
       wired up but its DOM is hidden. To revive: remove the inline
       display:none and adjust the ghost-bar JS accordingly. -->
  <div id="mastGhost" style="display:none;"><div id="mastGhostFill"></div></div>
  <div id="mastGhostLabel" style="display:none;">&nbsp;</div>
  <!-- [v4.47] Pace stats — three time targets near the timer that
       gray out as elapsed time passes them. Replaces the pace rings
       (now off by default) and the ghost-runner bar as the primary
       way to feel pace pressure. Numeric is more accessible than
       peripheral-vision-dependent rings, especially for testers
       with vision concerns. Style is set inline to keep this
       self-contained; if it sticks, the inline styles should move
       to a CSS rule. -->
  <div id="paceStats" style="display:none;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:1.5px;text-align:center;padding:4px 12px;color:rgba(0,217,255,0.85);">
    <span id="paceStatBest"  style="color:#c400ff;"></span><span id="paceStatSepAB" style="opacity:0.4;"> · </span><!--
 --><span id="paceStatAvg"   style="color:#00ffff;"></span><span id="paceStatSepBC" style="opacity:0.4;"> · </span><!--
 --><span id="paceStatWorst" style="color:#4a8fa0;"></span>
  </div>
  <!-- [v3.46] Removed: the .info-bar with the long "Tap a square ·
       then a number..." hints line. The puzzle's interaction model
       is straightforward enough that the always-on hint isn't
       earning its real estate. May reintroduce as a one-time
       startup overlay later. -->
  <div class="info-bar" style="display:none;"><span class="blbl">Tap a square · then a number · tap placed to return · tap thumb circle to zoom · double-tap to zoom out</span></div>
  <!-- [v3.98] #paceBoxes moved INSIDE .grid-clip between
       .grid-vignette and .grid. Reason: pace boxes need to paint
       above the vignette but below the grid (so cells cover them).
       Tree order inside .grid-clip gives us:
         vignette (first, painted as backdrop)
         paceBoxes (second, painted over vignette)
         grid (third, z-index:1 lifts it as atomic stack above both)
       The grid's stacking context keeps cells above pace boxes;
       transparent regions of the grid no longer need to "look
       through" the grid context to find pace boxes — they're not
       behind the grid anymore, they're INSIDE the same parent. -->
  <div class="gscroll"><div class="grid-clip" id="gridClip"><div class="grid-vignette" style="display:none;"></div><div class="grid-lattice" id="gridLattice"></div><div id="paceBoxes" style="position:absolute;inset:0;pointer-events:none;display:none;">
    <div id="paceBoxWorst" class="paceBox paceBox-worst"></div>
    <div id="paceBoxAvg"   class="paceBox paceBox-avg"></div>
    <div id="paceBoxBest"  class="paceBox paceBox-best"></div>
  </div><div class="grid" id="grid"></div><!-- [v4.25] Perimeter mask. Sits ABOVE the cells (.grid is z-index:1)
       so it paints over the outer borders of perimeter cells, but
       BELOW the pace rings (which are siblings of .grid-clip outside
       it, painting on top of grid-clip as a whole). Border-only div
       with the same color as the page background — visually invisible
       except where it covers what's underneath (the perimeter cell
       borders that v4.24 left behind). 3 px wide on all sides. -->
  <!-- [v4.28] #gridEdgeMask removed for diagnostic. The 3px bg-color
       border was masking cell edges to hide cell borders at the grid
       perimeter, but Sam's testing showed it was also clipping
       cell content (sliver of top/left cells getting cut) AND
       likely causing the faint perimeter lines via subpixel rendering
       of the bg-color border against the surrounding bg. Markup
       restored to pre-v4.25 state. To revive, paste back:
         <div id="gridEdgeMask" style="position:absolute;inset:0;
              pointer-events:none;z-index:2;border:3px solid var(--bg);">
         </div>
       --></div><!-- [v4.20] Pace RINGS moved OUTSIDE .grid-clip to be a sibling
       within .gscroll. This lets the rings extend a few pixels
       beyond the grid's outer edge into the .gscroll padding area
       (16px top/bottom) rather than sitting on top of the cells
       or hidden behind them. Position computed in JS from
       gridClip.offsetTop/Left + RING_OUTSET. The SVG itself uses
       overflow:visible so strokes can extend a bit; .gscroll has
       overflow:hidden but the rings stay well within its content
       box. The pace BOXES (#paceBoxes above) are still display:none
       and their init/update calls are now commented out — see the
       v4.20 notes elsewhere. -->
  <svg id="paceRings" style="position:absolute;pointer-events:none;overflow:visible;display:none;z-index:1;left:0;top:0;width:0;height:0;" preserveAspectRatio="none" aria-hidden="true">
    <!-- [v4.34] stroke-opacity 0.4. [v4.41] z-index back to 1 (was -1
         in v4.34-v4.40). With the v4.41 grid gutter, rings sit in
         the gutter band OUTSIDE the cells. They no longer need to
         be behind cells for visual cleanliness. -->
    <rect id="paceRingWorst" pathLength="100" stroke="#4a8fa0" stroke-opacity="0.4" stroke-width="2" fill="none" stroke-dasharray="100 100" stroke-dashoffset="0"></rect>
    <rect id="paceRingAvg"   pathLength="100" stroke="#00ffff" stroke-opacity="0.4" stroke-width="2" fill="none" stroke-dasharray="100 100" stroke-dashoffset="0"></rect>
    <rect id="paceRingBest"  pathLength="100" stroke="#c400ff" stroke-opacity="0.4" stroke-width="2" fill="none" stroke-dasharray="100 100" stroke-dashoffset="0"></rect>
  </svg>
  <!-- [v4.38] Fuse glow SVG. Separate from #paceRings because it needs
       z-index above .grid-clip (so dots are visible) while the rings
       themselves stay at z-index:-1 (behind cells). Each dot is a
       small glowing circle that rides along its corresponding ring's
       erasing front like a fuse being lit. JS computes the (cx,cy)
       at each frame from the current progress and the rect dimensions
       in _updatePaceRings.
       [v4.39] Per Sam: shapes changed from glowing circles to plain
       2×2 px squares matching stroke-width. The intent is "just the
       very end of the line is bright" rather than a halo'd dot. The
       feGaussianBlur filter is removed; the squares are full opacity
       same-color as their ring (which is at 0.4 opacity), so they
       read as a bright accent at the erasing front. JS positions them
       by their top-left corner (x,y), offset by -1 from the perimeter
       point to center the 2×2 box. -->
  <!-- [v4.38/v4.43] Fuse SVG. Visibility now controlled by JS based
       on the user setting window._paceFusesOn. SVG starts hidden;
       _initPaceRings shows it when both _paceRingsOn and _paceFusesOn
       are true. -->
  <svg id="paceRingFuses" style="position:absolute;pointer-events:none;overflow:visible;display:none;z-index:2;left:0;top:0;width:0;height:0;" preserveAspectRatio="none" aria-hidden="true">
    <rect id="paceFuseWorst" width="2" height="2" fill="#4a8fa0" style="display:none;"></rect>
    <rect id="paceFuseAvg"   width="2" height="2" fill="#00ffff" style="display:none;"></rect>
    <rect id="paceFuseBest"  width="2" height="2" fill="#c400ff" style="display:none;"></rect>
  </svg>
<!-- [Equil 1.04] Removed: seqPuz (Unified SEQ/PUZ toggle) button HTML — sequencer-only. -->
  </div>
  <!-- [v3.18b] DEBUG: template-name label. Outside .gscroll so the grid's
       touch handlers don't intercept the tap. Tap to show counts.
       [v4.07] Undo button lives on the left side of this row — sits
       between the grid and the bank, "below the puzzle, above the
       tiles" per the request. The undo() function and its disable-
       management logic already existed (a previous UI removal kept
       the machinery in place); we just re-added the visible entry
       point with id="undo" so renderBank's existing
         _undoBtn.disabled = HIST.length === 0
       hook lights it up automatically. Disable after victory is
       handled via the isWon() check in the click handler. -->
  <div style="width:100%;max-width:520px;display:flex;justify-content:space-between;align-items:center;padding:2px 14px;font:11px/1.2 monospace;color:rgba(0,217,255,0.55);letter-spacing:1px;user-select:none;flex-shrink:0;">
    <div style="display:flex;gap:6px;align-items:center;">
      <button id="undo" title="Undo last placement" style="background:rgba(0,217,255,0.12);border:1.5px solid rgba(0,217,255,0.55);color:rgba(0,217,255,0.95);font:11px/1 'IBM Plex Mono',monospace;font-weight:700;letter-spacing:1px;padding:6px 12px;border-radius:999px;cursor:pointer;display:flex;align-items:center;gap:5px;transition:opacity 0.15s ease,background 0.15s ease;">
        <span style="font-size:13px;line-height:1;">↶</span><span>UNDO</span>
      </button>
    </div>
    <!-- [v4.65] Theme toggle moved out of this toolbar row to the
         right of the timer (inside the masthead). See themeToggle
         markup inside the mast-center block above. -->
    <!-- [v4.65] Template label moved here from beside UNDO. Sits to
         the left of the DEV button so the dev-side controls
         (template name, DEV opener) cluster together while the
         left-side controls (UNDO) stay alone. -->
    <div style="display:flex;gap:6px;align-items:center;">
      <span id="_dbgTplLabel"></span>
      <!-- [v4.60] Single DEV button replacing the v3.35-era TIMES +
           COUNTS pair. Opens the new dev tools panel which contains
           the Times/Counts launchers along with the dev-side
           settings sections (Visual effects, Placed-tile pulse,
           Legibility, Debug — win card, Debug — snap tuning, Pace
           stats/rings/boxes). The user-facing settings panel reached
           by the ⚙ button keeps only Tile interaction + Audio. -->
      <button id="_dbgDevBtn" style="background:rgba(0,217,255,0.10);border:1px solid rgba(0,217,255,0.40);color:rgba(0,217,255,0.85);font:10px/1 monospace;letter-spacing:1px;padding:4px 8px;border-radius:6px;cursor:pointer;">DEV</button>
    </div>
  </div>

  <!-- [v3.29] Debug HUD panel.
       Body text 4px, headers stay 6px so the hierarchy remains
       readable. Number values get a subtle gray pill behind them so
       they stand out from labels. Live update on every counter bump. -->
  <div id="_dbgPanel" style="display:none;flex-direction:column;position:absolute;top:80px;left:50%;transform:translateX(-50%);z-index:99999;background:rgba(8,16,8,0.10);border:1px solid rgba(80,255,140,0.85);border-radius:6px;font-family:'IBM Plex Mono',monospace;font-size:4px;color:rgba(140,255,180,1);max-width:min(220px,90vw);max-height:75vh;box-shadow:0 2px 12px rgba(80,255,140,0.30);box-sizing:border-box;">
    <div id="_dbgPanelHeader" style="display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(80,255,140,0.50);padding:6px 8px 3px;user-select:none;flex-shrink:0;cursor:move;touch-action:none;">
      <span style="letter-spacing:1px;font-weight:700;font-size:6px;color:rgba(160,255,200,1);">⋮⋮ DEBUG (drag)</span>
      <div style="display:flex;gap:3px;">
        <button id="_dbgPanelOpacity" title="cycle background opacity" style="background:transparent;border:1px solid rgba(80,255,140,0.70);color:rgba(160,255,200,1);font:6px/1 monospace;padding:2px 5px;border-radius:3px;cursor:pointer;">◐</button>
        <button id="_dbgPanelClose" style="background:transparent;border:1px solid rgba(80,255,140,0.70);color:rgba(160,255,200,1);font:6px/1 monospace;padding:2px 5px;border-radius:3px;cursor:pointer;">✕</button>
      </div>
    </div>

    <!-- Scrollable middle section -->
    <div id="_dbgPanelBody" style="flex:1 1 auto;overflow-y:auto;overflow-x:hidden;padding:5px 8px;min-height:0;touch-action:pan-y;">
      <!-- CURRENT PUZZLE — collapsible, default open -->
      <div style="margin-bottom:6px;">
        <div id="_dbgCurrentHeader" style="display:flex;align-items:center;gap:3px;letter-spacing:0.7px;font-weight:700;font-size:6px;color:rgba(160,255,200,1);margin-bottom:3px;cursor:pointer;user-select:none;">
          <span id="_dbgCurrentArrow" style="display:inline-block;width:5px;transform:rotate(0deg);transition:transform 0.15s;">▼</span>
          CURRENT PUZZLE
        </div>
        <div id="_dbgPuzzleStats" style="padding-left:4px;line-height:1.7;color:rgba(140,255,180,1);"></div>
      </div>

      <!-- [v3.32] PUZZLE AVERAGES — collapsible, default open. Tracks
           running averages over every successfully-built puzzle in this
           session, plus a histogram of trivial-eq counts. Resets when
           the user hits RESET COUNTS. -->
      <div style="margin-bottom:6px;">
        <div id="_dbgAvgHeader" style="display:flex;align-items:center;gap:3px;letter-spacing:0.7px;font-weight:700;font-size:6px;color:rgba(160,255,200,1);margin-bottom:3px;cursor:pointer;user-select:none;">
          <span id="_dbgAvgArrow" style="display:inline-block;width:5px;transform:rotate(0deg);transition:transform 0.15s;">▼</span>
          PUZZLE AVERAGES
        </div>
        <div id="_dbgAvgBody" style="padding-left:4px;line-height:1.7;color:rgba(140,255,180,1);"></div>
      </div>

      <!-- TEMPLATE COUNTS — collapsible, default closed -->
      <div style="margin-bottom:6px;">
        <div id="_dbgTplCountsHeader" style="display:flex;align-items:center;gap:3px;letter-spacing:0.7px;font-weight:700;font-size:6px;color:rgba(160,255,200,1);margin-bottom:3px;cursor:pointer;user-select:none;">
          <span id="_dbgTplCountsArrow" style="display:inline-block;width:5px;transform:rotate(-90deg);transition:transform 0.15s;">▼</span>
          TEMPLATE COUNTS
        </div>
        <div id="_dbgTplCountsBody" style="padding-left:4px;line-height:1.7;color:rgba(140,255,180,1);display:none;"></div>
      </div>

      <!-- FAIL REASONS — collapsible, default closed -->
      <div style="margin-bottom:6px;">
        <div id="_dbgFailHeader" style="display:flex;align-items:center;gap:3px;letter-spacing:0.7px;font-weight:700;font-size:6px;color:rgba(160,255,200,1);margin-bottom:3px;cursor:pointer;user-select:none;">
          <span id="_dbgFailArrow" style="display:inline-block;width:5px;transform:rotate(-90deg);transition:transform 0.15s;">▼</span>
          FAIL REASONS
        </div>
        <div id="_dbgFailBody" style="padding-left:4px;line-height:1.7;color:rgba(140,255,180,1);display:none;"></div>
      </div>
    </div>

    <!-- Sticky bottom: reset button always visible -->
    <div style="flex-shrink:0;padding:4px 8px 6px;border-top:1px solid rgba(80,255,140,0.30);">
      <button id="_dbgResetBtn" style="width:100%;background:rgba(255,140,80,0.20);border:1px solid rgba(255,180,120,0.85);color:rgba(255,200,150,1);font:6px/1 monospace;letter-spacing:0.7px;padding:4px;border-radius:3px;cursor:pointer;">RESET COUNTS</button>
    </div>
  </div>

  <!-- [v3.35] TIMES panel — separate window for tracking solve times.
       Same drag/opacity/close behavior as the COUNTS panel. Tabs at
       top select size (Small/Medium/Large/Jumbo). Body is three
       side-by-side scrollable columns: Easy / Medium / Hard. Each
       column shows solve times for that (size, diff) combo, newest
       first, with count and best at the top. -->
  <div id="_dbgTimesPanel" style="display:none;flex-direction:column;position:absolute;top:80px;left:50%;transform:translateX(-50%);z-index:99999;background:rgba(8,16,8,0.10);border:1px solid rgba(80,255,140,0.85);border-radius:6px;font-family:'IBM Plex Mono',monospace;font-size:5px;color:rgba(140,255,180,1);width:min(280px,92vw);max-height:75vh;box-shadow:0 2px 12px rgba(80,255,140,0.30);box-sizing:border-box;">
    <div id="_dbgTimesPanelHeader" style="display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(80,255,140,0.50);padding:6px 8px 3px;user-select:none;flex-shrink:0;cursor:move;touch-action:none;">
      <span style="letter-spacing:1px;font-weight:700;font-size:6px;color:rgba(160,255,200,1);">⋮⋮ TIMES (drag)</span>
      <div style="display:flex;gap:3px;">
        <button id="_dbgTimesPanelOpacity" title="cycle background opacity" style="background:transparent;border:1px solid rgba(80,255,140,0.70);color:rgba(160,255,200,1);font:6px/1 monospace;padding:2px 5px;border-radius:3px;cursor:pointer;">◐</button>
        <button id="_dbgTimesPanelClose" style="background:transparent;border:1px solid rgba(80,255,140,0.70);color:rgba(160,255,200,1);font:6px/1 monospace;padding:2px 5px;border-radius:3px;cursor:pointer;">✕</button>
      </div>
    </div>

    <!-- Size tabs. Active tab gets a brighter bg + bottom highlight. -->
    <div id="_dbgTimesTabs" style="display:flex;border-bottom:1px solid rgba(80,255,140,0.30);flex-shrink:0;font-size:6px;">
      <button data-size="small"  class="_dbgTimesTab" style="flex:1;background:transparent;border:0;color:rgba(140,255,180,0.65);font:6px/1.4 monospace;letter-spacing:0.7px;padding:4px 2px;cursor:pointer;border-right:1px solid rgba(80,255,140,0.20);">SMALL</button>
      <button data-size="medium" class="_dbgTimesTab" style="flex:1;background:transparent;border:0;color:rgba(140,255,180,0.65);font:6px/1.4 monospace;letter-spacing:0.7px;padding:4px 2px;cursor:pointer;border-right:1px solid rgba(80,255,140,0.20);">MEDIUM</button>
      <button data-size="large"  class="_dbgTimesTab" style="flex:1;background:transparent;border:0;color:rgba(140,255,180,0.65);font:6px/1.4 monospace;letter-spacing:0.7px;padding:4px 2px;cursor:pointer;border-right:1px solid rgba(80,255,140,0.20);">LARGE</button>
      <button data-size="xl2"    class="_dbgTimesTab" style="flex:1;background:transparent;border:0;color:rgba(140,255,180,0.65);font:6px/1.4 monospace;letter-spacing:0.7px;padding:4px 2px;cursor:pointer;border-right:1px solid rgba(80,255,140,0.20);">JUMBO</button>
      <!-- [v3.37] ANALYSIS tab — cross-sample regression on all
           recorded solves to derive timer-formula coefficients. -->
      <button data-size="analysis" class="_dbgTimesTab" style="flex:1;background:transparent;border:0;color:rgba(140,255,180,0.65);font:6px/1.4 monospace;letter-spacing:0.7px;padding:4px 2px;cursor:pointer;">ANLZ</button>
    </div>

    <!-- Body: three side-by-side difficulty columns (size tabs) OR
         a single full-width analysis pane (analysis tab). The analysis
         pane is hidden by default and shown only when ANLZ is active. -->
    <div id="_dbgTimesBody" style="flex:1 1 auto;display:flex;min-height:0;touch-action:pan-y;">
      <div data-diff="easy" class="_dbgTimesCol" style="flex:1;display:flex;flex-direction:column;min-width:0;border-right:1px solid rgba(80,255,140,0.20);">
        <div style="text-align:center;padding:3px 2px;font:6px/1 monospace;letter-spacing:0.7px;font-weight:700;color:rgba(160,255,200,1);border-bottom:1px solid rgba(80,255,140,0.20);flex-shrink:0;">EASY</div>
        <div data-diff="easy" class="_dbgTimesList" style="flex:1;overflow-y:auto;padding:3px 2px;line-height:1.5;text-align:center;"></div>
      </div>
      <div data-diff="medium" class="_dbgTimesCol" style="flex:1;display:flex;flex-direction:column;min-width:0;border-right:1px solid rgba(80,255,140,0.20);">
        <div style="text-align:center;padding:3px 2px;font:6px/1 monospace;letter-spacing:0.7px;font-weight:700;color:rgba(160,255,200,1);border-bottom:1px solid rgba(80,255,140,0.20);flex-shrink:0;">MEDIUM</div>
        <div data-diff="medium" class="_dbgTimesList" style="flex:1;overflow-y:auto;padding:3px 2px;line-height:1.5;text-align:center;"></div>
      </div>
      <div data-diff="hard" class="_dbgTimesCol" style="flex:1;display:flex;flex-direction:column;min-width:0;">
        <div style="text-align:center;padding:3px 2px;font:6px/1 monospace;letter-spacing:0.7px;font-weight:700;color:rgba(160,255,200,1);border-bottom:1px solid rgba(80,255,140,0.20);flex-shrink:0;">HARD</div>
        <div data-diff="hard" class="_dbgTimesList" style="flex:1;overflow-y:auto;padding:3px 2px;line-height:1.5;text-align:center;"></div>
      </div>
      <div id="_dbgAnalysisPane" style="flex:1;display:none;flex-direction:column;min-width:0;overflow-y:auto;padding:5px 8px;line-height:1.6;"></div>
    </div>

    <!-- Sticky bottom: export / import / reset row.
         [v3.39] EXPORT downloads a JSON of all recorded times so the
         data survives browser data-clearing (Brave's aggressive cookie/
         storage wipe-on-close, file:// origin quirks, etc). IMPORT
         loads it back. Both use a hidden file input. -->
    <div style="flex-shrink:0;padding:4px 8px 6px;border-top:1px solid rgba(80,255,140,0.30);display:flex;gap:3px;flex-direction:column;">
      <div style="display:flex;gap:3px;">
        <button id="_dbgTimesExportBtn" style="flex:1;background:rgba(80,200,255,0.15);border:1px solid rgba(120,200,255,0.75);color:rgba(180,220,255,1);font:6px/1 monospace;letter-spacing:0.7px;padding:4px;border-radius:3px;cursor:pointer;">EXPORT</button>
        <button id="_dbgTimesImportBtn" style="flex:1;background:rgba(80,255,140,0.10);border:1px solid rgba(120,255,170,0.60);color:rgba(180,255,200,1);font:6px/1 monospace;letter-spacing:0.7px;padding:4px;border-radius:3px;cursor:pointer;">IMPORT</button>
      </div>
      <button id="_dbgTimesResetBtn" style="width:100%;background:rgba(255,140,80,0.20);border:1px solid rgba(255,180,120,0.85);color:rgba(255,200,150,1);font:6px/1 monospace;letter-spacing:0.7px;padding:4px;border-radius:3px;cursor:pointer;">RESET TIMES</button>
      <input id="_dbgTimesImportFile" type="file" accept="application/json,.json" style="display:none;">
    </div>
  </div>

  <div class="bank-outer">
    <!-- PAD TOOLS slim panel (SEQ mode only) -->
    <div class="slim-panel collapsed" id="padToolsSlimPanel" style="display:none;">
      <div class="slim-panel-bar" id="padToolsBar"><button class="slim-panel-bar-arrow" id="padToolsArrow">▲</button><span>TOOLBAR</span></div>
      <div class="slim-panel-body" id="padToolsBody" style="max-height:3000px;border-bottom:1px solid rgba(0,217,255,0.18);">
        <div style="display:flex;flex-direction:row;align-items:center;gap:0;padding:4px 6px;">
          <!-- Left: Save + Load -->
          <div style="display:flex;gap:3px;flex-shrink:0;">
            <button class="seq-btn seq-btn-sq" id="seqSave" title="Save" style="flex-shrink:0;">💾</button>
            <button class="seq-btn seq-btn-sq" id="seqLoad" title="Load" style="flex-shrink:0;">📂</button>
          </div>
          <!-- Center: Touch Sense + Haptic + L-R + EXPR + (hidden Spin/Particle/Glow — moved to PAD FX menu) -->
          <div style="display:flex;gap:3px;flex:1;justify-content:center;align-items:center;">
            <button class="seq-btn" id="btnSensToggle" title="Tap sensitivity (hold for settings)" style="flex-shrink:0;font-size:10px;padding:2px 5px;">&#x1F44B;</button>
            <button class="seq-btn" id="btnHapticToggle" title="Pad haptics (hold for settings)" style="flex-shrink:0;font-size:10px;padding:2px 5px;">&#x1F4F3;</button>
            <button class="seq-btn" id="btnPadFx" title="Pad FX (long-press for menu)" style="flex-shrink:0;font-size:7px;font-weight:700;padding:2px 3px;line-height:1;display:flex;flex-direction:column;justify-content:center;letter-spacing:0.5px;"><span>PAD</span><span style="margin-top:1px;">FX</span></button>
            <button class="seq-btn" id="btnPadDsply" title="Pad display options (long-press for menu)" style="flex-shrink:0;font-size:7px;font-weight:700;padding:2px 3px;line-height:1;display:flex;flex-direction:column;justify-content:center;letter-spacing:0.5px;"><span>PAD</span><span style="margin-top:1px;">DSPLY</span></button>
            <button class="seq-btn seq-btn-sq" id="btnPadPanToggle" title="Pad pan (tap position = L/R pan)" style="flex-shrink:0;font-size:9px;font-weight:700;padding:2px 4px;">L·R</button>
            <button class="seq-btn seq-btn-sq" id="btnPadExprToggle" title="Expression — tap to toggle, hold for menu (X=volume, Y=pitch)" style="flex-shrink:0;font-size:8px;font-weight:700;padding:2px 4px;">EXPR</button>
            <button class="seq-btn seq-btn-sq" id="btnSpinToggle" title="Spin on/off" style="font-size:10px;flex-shrink:0;display:none;">&#x1F300;</button>
            <button class="seq-btn seq-btn-sq" id="btnParticleToggle" title="Particles on/off" style="font-size:10px;flex-shrink:0;display:none;">&#x2728;</button>
            <button class="seq-btn seq-btn-sq" id="btnGlowToggle" title="Tap glow on/off" style="font-size:10px;padding:0;overflow:hidden;flex-shrink:0;display:none;"><canvas id="glowIconCanvas" width="26" height="26" style="display:block;width:26px;height:26px;"></canvas></button>
          </div>
          <!-- Right: Settings (Color tiles + Sound Style hidden — moved to PADS bar / menus) -->
          <div style="display:flex;gap:3px;flex-shrink:0;">
            <button class="seq-btn seq-btn-sq" id="colorTagBtnOld" title="Color tiles" style="flex-shrink:0;display:none;">🎨</button>
            <button class="seq-btn seq-btn-sq" id="seqSndBtn" title="Sound Style" style="flex-shrink:0;font-size:11px;display:none;">♪</button>
            <button class="seq-btn seq-btn-sq" id="seqSettingsBtn" title="Settings" style="flex-shrink:0;font-size:12px;">⚙</button>
          </div>
        </div>
        <!-- Row 2: additional controls -->
        <!-- Row 2: legacy buttons hidden (moved into long-press menus). Kept in DOM
             so existing handlers, refresh functions, and ID lookups still work. -->
        <div style="display:none;">
          <button class="seq-btn" id="padLabelsBtn" title="Show sample names on pads">ABC</button>
          <button class="seq-btn" id="btnExprGrid" title="Show EXPR grid on pads">GRID</button>
          <button class="seq-btn" id="btnHideNums" title="Hide numbers on pads">123</button>
          <button class="seq-btn" id="btnSeqNums" title="Show sequential pad numbers (reading order)">1,2,3</button>
          <button class="seq-btn" id="btnSnapX" title="Snap volume to grid">SX</button>
          <button class="seq-btn" id="btnSnapY" title="Snap pitch to grid">SY</button>
          <button class="seq-btn" id="btnExprCross" title="EXPR crosshair">XHR</button>
          <button class="seq-btn" id="btnHoldMode" title="Hold mode"><span>HLD</span><span>BTN</span></button>
          <button class="seq-btn" id="btnGridEdit" title="Edit grid divisions">⊞#</button>
          <button class="seq-btn" id="btnWaveToggle" title="Show waveforms on pads">WAV</button>
        </div>
      </div>
    </div>
    <!-- PAD ADJUSTMENTS slim panel (SEQ mode only) — sliders built by JS -->
    <!-- Hidden placeholders so legacy code that references these IDs doesn't break -->
    <div style="display:none;">
      <div id="tbSizeSlider"></div>
      <div id="tbGapSlider"></div>
      <button id="seqRecOld">⏺</button>
      <button id="seqPlayOld">▶</button>
      <div id="tbRow2"><button id="seqErase">✂</button><button id="copyModeBtnOld">📋</button></div>
      <div id="tbBpmRow"><input id="tbBpmInputOld" type="number" min="40" max="300" value="120"><button id="tbTapBtnOld">TAP</button>
        <button class="pro-slot" data-slot="0">1</button><button class="pro-slot" data-slot="1">2</button><button class="pro-slot" data-slot="2">3</button><button class="pro-slot" data-slot="3">4</button>
        <button class="pro-slot" data-slot="4">5</button><button class="pro-slot" data-slot="5">6</button><button class="pro-slot" data-slot="6">7</button><button class="pro-slot" data-slot="7">8</button>
      </div>
      <div id="toolbarBeatOld"><div id="toolbarBeatDotsOld"></div></div>
      <button id="seqScrollLockOld">🔓</button>
      <button id="seqClearOld">🗑</button>
    </div>
    <!-- Pitch top dock -->
    <div id="_pitchTopDock" style="display:none;width:100%;background:var(--bg-secondary);padding:2px 4px;align-items:center;gap:4px;"></div>
    <!-- PADS slim panel -->
    <div class="slim-panel" id="padSlimPanel"><div class="slim-panel-bar" id="padPanelBar" style="display:none;"><button class="slim-panel-bar-arrow" id="padPanelArrow">▲</button><span>PADS</span><span style="flex:1;"></span><button id="padsBarKitsToggle" style="font-family:monospace;font-size:8px;font-weight:700;padding:0 2px;height:16px;line-height:16px;border:1px solid rgba(0,217,255,0.35);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;min-width:48px;" title="Kits — tap to open swipe strip, long-press for kit menu">KITS</button><button id="padsBarToolsToggle" style="font-family:monospace;font-size:8px;font-weight:700;padding:0 2px;height:16px;line-height:16px;border:1px solid rgba(0,217,255,0.35);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:4px;min-width:48px;" title="Toggle pad tools drawer (CLASSIC · EDIT · HLD · COLOR · SAVE)">MENU</button><button id="padsBarAdjToggle" style="font-family:monospace;font-size:8px;font-weight:700;padding:0 2px;height:16px;line-height:16px;border:1px solid rgba(0,217,255,0.35);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:4px;min-width:80px;margin-right:4px;" title="Toggle pad adjustments drawer">ADJUSTMENTS</button></div><!-- Slide-down drawer for pad adjustments (ADJUSTMENTS). Placed ABOVE the tools drawer so when both are open, adjustments sit directly under the PADS bar with tools below. Wraps the existing #padAdjBody element so the slider-injection code (which queries #padAdjBody by id) still finds it. Collapses with the PADS panel via the CSS rule on .slim-panel.collapsed #padsBarAdjDrawer. The inner element is translated vertically in sync with the max-height transition so content appears to slide out from UNDER whatever's above the drawer (the bar or the other drawer) rather than just expanding in place. --><div id="padsBarAdjDrawer" style="display:none;overflow:hidden;max-height:0;opacity:0;transition:max-height 0.2s ease, opacity 0.2s ease;background:var(--bg-secondary);border-bottom:1px solid rgba(0,217,255,0.12);"><div id="padAdjBody" class="_drawer-inner" style="max-height:3000px;transform:translateY(-100%);transition:transform 0.2s ease;"><!-- Content injected by the pad-adjustments IIFE further down in this file --></div></div><!-- Slide-down drawer for pad tools (MENU). Sits BELOW the adjustments drawer. Collapses with the PADS panel via the same CSS rule. --><div id="padsBarToolsDrawer" style="display:none;overflow:hidden;max-height:0;opacity:0;transition:max-height 0.2s ease, opacity 0.2s ease;background:var(--bg-secondary);border-bottom:1px solid rgba(0,217,255,0.12);"><div class="_drawer-inner" style="display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:4px;padding:3px 8px;height:22px;box-sizing:border-box;transform:translateY(-100%);transition:transform 0.2s ease;"><button id="padsBarClassic" style="display:none;font-family:monospace;font-size:7px;font-weight:700;padding:0 6px;height:16px;line-height:16px;border:1px solid rgba(0,217,255,0.35);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" title="Current sound style — tap to load a style">CLASSIC</button><button id="padsBarEdit" style="font-family:monospace;font-size:7px;font-weight:700;padding:0 5px;height:13px;line-height:13px;border:1px solid rgba(34,197,94,0.35);border-radius:3px;background:transparent;color:#4ade80;cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;" title="Edit a pad's sample — tap this, then tap a pad">EDIT</button><button id="padsBarCopy" style="font-family:monospace;font-size:7px;font-weight:700;padding:0 5px;height:13px;line-height:13px;border:1px solid rgba(34,197,94,0.35);border-radius:3px;background:transparent;color:#4ade80;cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:2px;min-width:34px;" title="Copy a pad's sample — tap to copy to one pad, long-press to copy to multiple">COPY</button><button id="padsBarHoldMode" style="font-family:monospace;font-size:7px;font-weight:700;padding:0 5px;height:13px;line-height:13px;border:1px solid rgba(34,197,94,0.35);border-radius:3px;background:transparent;color:#4ade80;cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:2px;" title="Hold mode — tap to select which pads use hold behavior">HLD BTN</button><button id="padsBarColor" style="font-family:monospace;font-size:7px;font-weight:700;padding:0 5px;height:13px;line-height:13px;border:1px solid rgba(34,197,94,0.35);border-radius:3px;background:transparent;color:#4ade80;cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:2px;" title="Color tiles">COLOR</button><button id="padsBarSaveKit" style="font-family:monospace;font-size:7px;font-weight:700;padding:0 5px;height:13px;line-height:13px;border:1px solid rgba(251,191,36,0.35);border-radius:3px;background:transparent;color:#fbbf24;cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:4px;" title="Save current pad assignments as a sound style">SAVE</button><button id="padsBarDel" style="font-family:monospace;font-size:7px;font-weight:700;padding:0 5px;height:13px;line-height:13px;border:1px solid rgba(239,68,68,0.35);border-radius:3px;background:transparent;color:#f87171;cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:4px;" title="Delete pads — tap to toggle, then tap pads to remove them. Long-press for undo/redo.">DEL</button><button id="padsBarMultiHit" style="font-family:monospace;font-size:7px;font-weight:700;padding:0 5px;height:13px;line-height:13px;border:1px solid rgba(34,197,94,0.35);border-radius:3px;background:transparent;color:#4ade80;cursor:pointer;touch-action:manipulation;letter-spacing:0.5px;margin-left:auto;" title="Multi-hit — tap to toggle: pad fires twice per tap. Long-press for note-value menu.">MULTI-HIT</button></div></div><!-- Slide-down drawer for KITS — a swipeable strip showing the current kit sequence. Placed BELOW the tools (MENU) drawer so it sits last in the bar's drawer stack: ADJUSTMENTS → MENU → KITS. Collapses with the PADS panel via the same CSS rule. The strip itself shows kit name "buttons" and accepts horizontal swipes to change the active kit; the actual swipe handling will be wired up in a later iteration. For v7.32 this is just the empty-shell drawer with a placeholder. --><div id="padsBarKitsDrawer" style="display:none;overflow:hidden;max-height:0;opacity:0;transition:max-height 0.2s ease, opacity 0.2s ease;background:var(--bg-secondary);border-bottom:1px solid rgba(0,217,255,0.12);"><div id="padsBarKitsBody" class="_drawer-inner" style="display:block;padding:6px 8px;height:32px;box-sizing:border-box;transform:translateY(-100%);transition:transform 0.2s ease;overflow:hidden;touch-action:pan-y;position:relative;"><div id="padsBarKitsStrip" style="position:absolute;left:0;right:0;top:6px;bottom:6px;overflow:hidden;"><div id="padsBarKitsInner" style="position:absolute;left:0;top:0;display:flex;flex-direction:row;align-items:center;gap:8px;height:100%;will-change:transform;"></div></div><div id="padsBarKitsFadeLeft" style="position:absolute;left:0;top:0;bottom:0;width:24px;pointer-events:none;background:linear-gradient(to right, var(--bg-secondary), rgba(0,0,0,0));display:none;align-items:center;justify-content:flex-start;padding-left:2px;color:rgba(0,217,255,0.7);font-family:monospace;font-size:14px;font-weight:700;">&#x2039;</div><div id="padsBarKitsFadeRight" style="position:absolute;right:0;top:0;bottom:0;width:24px;pointer-events:none;background:linear-gradient(to left, var(--bg-secondary), rgba(0,0,0,0));display:none;align-items:center;justify-content:flex-end;padding-right:2px;color:rgba(0,217,255,0.7);font-family:monospace;font-size:14px;font-weight:700;">&#x203A;</div></div></div><div class="slim-panel-body" id="padPanelBody" style="max-height:3000px;"><div class="bank-row" style="position:relative;"><div id="_pitchLeftDock" style="display:none;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;width:28px;background:var(--bg-secondary);"></div><button class="seq-btn seq-pro-btn seq-btn-sq" id="seqPro" title="Toggle Sequencer" style="display:none;width:0;height:0;padding:0;border:none;overflow:hidden;position:absolute;pointer-events:none;">SEQ</button><div class="bank"><div class="btiles" id="bank"></div></div><div id="_pitchRightDock" style="display:none;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;width:28px;background:var(--bg-secondary);"></div></div><div id="_pitchBottomDock" style="display:none;width:100%;background:var(--bg-secondary);padding:1px 4px;align-items:center;gap:4px;overflow:hidden;"></div><div id="_volBottomDock" style="display:none;width:100%;background:var(--bg-secondary);padding:1px 4px;align-items:center;gap:4px;overflow:hidden;"></div><div style="display:none;"><div id="brightBar"></div><button id="seqStop"></button><div class="sizebar-lock" id="sizeBarLock"></div><div id="sizeBar_legacy"></div></div></div></div></div>
  </div></div></div></div>


  <!-- SEQUENCE BANK PANEL — always visible when SEQ active -->
  <div class="slim-panel" id="seqBankSlimPanel" style="display:none;"><div class="slim-panel-bar" id="seqBankPanelBar"><button class="slim-panel-bar-arrow" id="seqBankPanelArrow">▲</button><span>SEQUENCE BANK</span></div><div class="slim-panel-body" id="seqBankPanelBody" style="max-height:3000px;"><div class="seq-bank-panel" id="seqBankPanel">
    <!-- A/B/C bank selector -->
    <div class="seq-abc-col">
      <button class="seq-abc-btn active" id="seqBankA" data-bank="0">A</button>
      <button class="seq-abc-btn" id="seqBankB" data-bank="1">B</button>
      <button class="seq-abc-btn" id="seqBankC" data-bank="2">C</button>
    </div>

    <!-- 3×5 slot grid -->
    <div class="seq-slot-area">
      <div class="seq-slot-col-labels">
        <span class="seq-slot-col-lbl">1</span>
        <span class="seq-slot-col-lbl">2</span>
        <span class="seq-slot-col-lbl">3</span>
        <span class="seq-slot-col-lbl">4</span>
        <span class="seq-slot-col-lbl">5</span>
      </div>
      <div class="seq-slot-grid" id="seqSlotGrid">
        <div class="seq-slot-row">
          <button class="seq-slot-btn active" data-slot="0">1</button>
          <button class="seq-slot-btn" data-slot="1">2</button>
          <button class="seq-slot-btn" data-slot="2">3</button>
          <button class="seq-slot-btn" data-slot="3">4</button>
          <button class="seq-slot-btn" data-slot="4">5</button>
        </div>
        <div class="seq-slot-row">
          <button class="seq-slot-btn" data-slot="5">6</button>
          <button class="seq-slot-btn" data-slot="6">7</button>
          <button class="seq-slot-btn" data-slot="7">8</button>
          <button class="seq-slot-btn" data-slot="8">9</button>
          <button class="seq-slot-btn" data-slot="9">10</button>
        </div>
        <div class="seq-slot-row">
          <button class="seq-slot-btn" data-slot="10">11</button>
          <button class="seq-slot-btn" data-slot="11">12</button>
          <button class="seq-slot-btn" data-slot="12">13</button>
          <button class="seq-slot-btn" data-slot="13">14</button>
          <button class="seq-slot-btn" data-slot="14">15</button>
        </div>
      </div>
      <!-- Mini beat dots -->
      <div class="seq-bank-beat-row" id="seqBankBeatRow">
        <div id="toolbarBeatDots" style="display:flex;gap:2px;flex-wrap:wrap;align-items:center;justify-content:center;"></div>
      </div>
      <!-- DEL + color row -->
      <div class="seq-bank-bottom">
        <button class="seq-del-btn" id="seqClear" title="Clear">DEL</button>
        <button class="seq-color-btn" id="colorTagBtn" title="Color tiles">Color</button>
        <button class="seq-btn seq-btn-sq" id="copyModeBtn" title="Copy sample" style="font-size:11px;display:none;">📋</button>
      </div>
    </div>

    <!-- Transport panel -->
    <div class="seq-transport-col">
      <div class="seq-bpm-row">
        <span class="seq-bpm-label">BPM</span>
        <input class="seq-bpm-input" id="tbBpmInput" type="number" min="40" max="300" value="120">
        <!-- TAP button with STOP slot below it. The "stop all sounds"
             button is injected into seqPlayStopWrap by the sequence
             bank init code; moving that div here puts STOP directly
             under TAP per the user's layout request. -->
        <div style="display:flex;flex-direction:column;align-items:center;gap:3px;">
          <button class="seq-tap-btn" id="tbTapBtn">TAP</button>
          <div id="seqPlayStopWrap" style="display:flex;justify-content:center;align-items:center;"></div>
        </div>
      </div>
      <!-- CLICK on/off toggle directly below BPM, mirroring the
           proClick toggle in SEQUENCER CONTROLS so the user can
           reach metronome on/off from the sequence bank too. Both
           buttons share the clickOn state and update each other. -->
      <div class="seq-click-row" style="display:flex;flex-direction:row;align-items:center;gap:4px;width:100%;">
        <span class="seq-bpm-label">CLICK</span>
        <button id="seqBankClickBtn" class="seq-tap-btn" style="border-color:var(--cyan);color:var(--cyan);background:rgba(0,217,255,0.15);box-shadow:0 0 10px rgba(0,217,255,0.6);" title="Toggle metronome click">ON</button>
      </div>
      <button class="seq-play-btn" id="seqPlay" title="Play/Stop">
        <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
          <defs>
            <linearGradient id="playTriGradientDim" x1="0%" y1="0%" x2="100%" y2="100%">
              <stop offset="0%" stop-color="#2a3d32"/>
              <stop offset="45%" stop-color="#1a3328"/>
              <stop offset="100%" stop-color="#0d1f15"/>
            </linearGradient>
            <linearGradient id="playTriGradient" x1="0%" y1="0%" x2="100%" y2="100%">
              <stop offset="0%" stop-color="#b6ffd4"/>
              <stop offset="45%" stop-color="#5cffb0"/>
              <stop offset="100%" stop-color="#1fb069"/>
            </linearGradient>
            <linearGradient id="playTriGradientBright" x1="0%" y1="0%" x2="100%" y2="100%">
              <stop offset="0%" stop-color="#ffffff"/>
              <stop offset="40%" stop-color="#c2ffdb"/>
              <stop offset="100%" stop-color="#5cffb0"/>
            </linearGradient>
          </defs>
          <polygon class="play-tri-face" points="22,18 22,82 86,50"/>
          <path class="play-tri-highlight" d="M 26 22 L 64 42"/>
        </svg>
      </button>
      <div class="seq-transport-btns-row">
        <div class="seq-scroll-lock-wrap">
          <button class="seq-btn seq-btn-sq" id="seqScrollLock" title="Lock Scroll" style="font-size:11px;width:28px;height:28px;overflow:hidden;padding:0;"></button>
          <span class="seq-scroll-lock-lbl">Scroll<br>Lock</span>
        </div>
        <button class="seq-rec-btn" id="seqRec" title="Record">REC</button>
      </div>
    </div>
  </div><!-- /seq-bank-panel --></div></div></div>

<!-- PITCH / VOL / PAN slim panel -->
<div class="slim-panel" id="pvpSlimPanel" style="display:none;"><div class="slim-panel-bar" id="pvpBar"><button class="slim-panel-bar-arrow" id="pvpArrow">▲</button><span>PITCH · VOL · PAN</span></div>
<div class="slim-panel-body" id="pvpBody" style="max-height:3000px;">
<div style="display:flex;flex-direction:column;gap:3px;padding:4px 6px;">
<!-- PITCH row -->
<div id="pitchBendRow" style="display:flex;align-items:center;gap:4px;">
<span class="pro-lbl" style="font-size:7px;white-space:nowrap;min-width:30px;">PITCH</span>
<div class="cslider-wrap" id="pitchSliderWrap" style="height:22px;flex:1;max-width:calc(100% - 160px);filter:drop-shadow(0px 3px 6px rgba(196,0,255,0.6));"><canvas class="cslider-canvas" id="pitchSliderCanvas"></canvas><input type="range" id="pitchBendSlider" min="-1" max="1" step="0.01" value="0" style="position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:ew-resize;z-index:5;-webkit-appearance:none;appearance:none;background:transparent;pointer-events:auto;"></div>
<span class="pro-lbl" id="pitchBendLbl" style="font-size:7px;min-width:18px;text-align:right;">0</span>
<span class="pro-lbl" style="font-size:7px;white-space:nowrap;">RNG</span>
<select id="pitchBendRange" style="font-family:monospace;font-size:8px;border:1px solid var(--cyan);border-radius:3px;background:var(--bg-secondary);color:var(--text-primary);padding:1px 2px;">
<option value="1">1</option><option value="2">2</option><option value="3" selected>3</option><option value="4">4</option><option value="5">5</option><option value="7">7</option>
</select>
<button id="pitchUndockBtn" title="Undock pitch slider" style="font-family:monospace;font-size:8px;padding:2px 5px;border:1px solid var(--cyan);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;flex-shrink:0;margin-right:6px;">⊞</button>
</div>
<!-- VOL row -->
<div id="volRow" style="display:flex;align-items:center;gap:4px;">
<span class="pro-lbl" style="font-size:7px;white-space:nowrap;min-width:30px;">VOL</span>
<div class="cslider-wrap" id="volSliderWrap" style="height:22px;flex:1;max-width:calc(100% - 160px);filter:drop-shadow(0px 3px 6px rgba(0,217,255,0.5));"><canvas class="cslider-canvas" id="volSliderCanvas"></canvas><input type="range" id="tbVolSlider" min="0.05" max="1" step="0.05" value="1" style="position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:ew-resize;z-index:5;-webkit-appearance:none;appearance:none;background:transparent;pointer-events:auto;"></div>
<span class="pro-lbl" id="volLbl" style="font-size:7px;min-width:28px;text-align:right;">100%</span>
<button id="volLockBtn" title="Lock volume" style="font-family:monospace;font-size:8px;padding:2px 5px;border:1px solid var(--cyan);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;flex-shrink:0;">🔓</button>
<button id="volUndockBtn" title="Undock volume slider" style="font-family:monospace;font-size:8px;padding:2px 5px;border:1px solid var(--cyan);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;flex-shrink:0;margin-right:6px;">⊞</button>
</div>
<!-- PAN row -->
<div id="panRow" style="display:flex;align-items:center;gap:4px;">
<span class="pro-lbl" style="font-size:7px;white-space:nowrap;min-width:30px;">PAN</span>
<div class="cslider-wrap" id="panSliderWrap" style="height:22px;flex:1;max-width:calc(100% - 160px);filter:drop-shadow(0px 3px 6px rgba(34,197,94,0.5));"><canvas class="cslider-canvas" id="panSliderCanvas"></canvas><input type="range" id="panSlider" min="-1" max="1" step="0.01" value="0" style="position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:ew-resize;z-index:5;-webkit-appearance:none;appearance:none;background:transparent;pointer-events:auto;"></div>
<span class="pro-lbl" id="panLbl" style="font-size:7px;min-width:28px;text-align:right;">C</span>
<button id="panUndockBtn" title="Undock pan slider" style="font-family:monospace;font-size:8px;padding:2px 5px;border:1px solid var(--cyan);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;flex-shrink:0;margin-right:6px;">⊞</button>
</div>
</div>
</div></div>
<!-- [Equil 1.04] Removed: SEQUENCER CONTROLS slim panel + proPanel + eraseRow HTML — sequencer-only. -->

  <!-- [v1.74] Full-width tile-controls row: ADJUST opens slider modal,
       and the three tile-display buttons (×N, mini, cyan) toggle the
       same modes the in-bank strip's buttons do. The actual mode
       toggle handlers live in the existing IIFE; we just forward
       clicks to those original buttons. -->
  <div class="tile-controls-row" id="tileControlsRow">
    <button type="button" id="tileAdjustBtn" title="Adjust tile size and gap">TILE<br>ADJUST</button>
    <button type="button" id="tileModeXn"   title="Condense repeated tiles">×N</button>
    <button type="button" id="tileModeMini" title="Mini-numbers display">####</button>
    <button type="button" id="tileModeCyan" title="All-cyan display">###</button>
  </div>

  <!-- [v1.74] ADJUST modal — overlay containing the SIZE+GAP sliders.
       The slider DOM (#sizeCanvasWrap) lives inside .bank-row by
       default; when this modal opens, we move the wrap into
       #tileAdjustModalSliders, and move it back when it closes.
       The IIFE that built the wrap captures element references in
       closures, so they keep working regardless of where in the DOM
       the wrap currently lives. -->
  <div id="tileAdjustModal">
    <!-- [v2.60] Outer wrapper holds the main box and the side-
         extending advanced panel as flex siblings. The advanced
         panel slides out to the right when expanded — keeping it
         away from the bank tiles below the modal (which the user
         is tuning against and needs to keep visible). -->
    <div id="tileAdjustModalOuter">
      <div id="tileAdjustModalBox">
        <div id="tileAdjustModalTitle">ADJUST TILES</div>
        <div id="tileAdjustModalSliders"></div>
        <!-- [v2.59] Advanced toggle — collapsed by default since the
             spacing/font sliders are rarely needed for casual use. -->
        <button type="button" id="tileAdjustModalAdvancedToggle">
          <span class="arrow">▶</span><span>ADVANCED</span>
        </button>
        <!-- [v2.59] DONE button flanked by drag handles for moving
             the modal anywhere on screen. Position persists. -->
        <div id="tileAdjustModalDoneRow">
          <div class="tileAdjustDragHandle" data-side="left"></div>
          <button type="button" id="tileAdjustModalClose">DONE</button>
          <div class="tileAdjustDragHandle" data-side="right"></div>
        </div>
      </div>
      <!-- [v2.60] Advanced panel — slides in/out from the right of
           the main box. Position is to the right of the main box;
           expanded width animates from 0 to its content width. -->
      <div id="tileAdjustModalXnSpacing"></div>
    </div>
  </div>

  <div class="bsnd-label" id="sndLabel" style="display:none;">Sound Style</div>
  <div class="bsound-row" id="sndRow" style="display:none;visibility:hidden;height:0;overflow:hidden;padding:0;margin:0;">
    <button class="bsnd active" id="sndA" onclick="setSoundStyle('A')">♪ Classic</button>
    <button class="bsnd" id="sndB" onclick="setSoundStyle('B')">♪ 8-Bit</button>
    <button class="bsnd" id="sndC" onclick="setSoundStyle('C')">♪ Sci-Fi</button>
    <button class="bsnd" id="sndD" onclick="setSoundStyle('D')">♪ Nature</button>
    <button class="bsnd" id="sndE" onclick="setSoundStyle('E')">♪ Industrial</button>
    <button class="bsnd" id="sndF" onclick="setSoundStyle('F')">🎹 Piano</button>
    <button class="bsnd" id="sndG" onclick="setSoundStyle('G')">🎻 Violin</button>
    <button class="bsnd" id="sndH" onclick="setSoundStyle('H')">🪈 Flute</button>
    <button class="bsnd" id="sndI" onclick="setSoundStyle('I')">🎸 Guitar</button>
    <button class="bsnd" id="sndJ" onclick="setSoundStyle('J')">🎸 Bass</button>
    <button class="bsnd" id="sndK" onclick="setSoundStyle('K')">⚗️ Elemental</button>
  </div>
    </div><!-- /slim-panel-body sequencer -->
  </div><!-- /slim-panel sequencer -->
</div><!-- /game-screen -->

<div class="wov" id="win">
  <!-- [v4.10] Win card rebuild based on the new sketch.
       - Header row top-left: SIZE · DIFFICULTY then Template: NAME.
       - Solved! headline with optional yellow SVG bursts behind it,
         absolutely positioned. Two independent bursts (time PB and
         moves PB) so both can fire on the same solve.
       - "CLEAN SOLVE" magenta one-liner sits between headline and
         current-run stats (per user direction — burst handles PB,
         this just signals zero-mistakes).
       - Three-column table: label | moves | time, with rows for
         Best / Avg / Least Best. "Least Best" is the deliberate
         label for worst (per anti-positioning Equil philosophy).
       - Bottom: split-pill MENU | NEXT PUZZLE. Old two-separate-
         buttons markup left intact but commented out, easy revert
         (per the no-machinery-removal principle). -->
  <div class="wcard">
    <!-- Header row: top-left identification of the puzzle. -->
    <div id="winHeader" style="position:absolute;top:14px;left:18px;font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:2px;text-align:left;line-height:1.5;pointer-events:none;z-index:3;">
      <div id="winSizeDiff" style="font-weight:700;color:rgba(0,217,255,0.85);">SMALL · MEDIUM</div>
      <div style="color:rgba(0,217,255,0.75);"><span style="opacity:0.85;">TEMPLATE:</span> <span id="winTplName" style="color:var(--text-primary);font-weight:700;">--</span></div>
    </div>

    <!-- [v4.12] MOVES PB burst — now positioned relative to the
         card itself (not the headline wrap) so it sits in the
         empty upper-left zone BELOW the size/diff/template header
         instead of overlapping the Solved! cluster. Header gets
         z-index:3 so the SIZE · DIFFICULTY and TEMPLATE: lines
         always render in front; burst sits at z-index:0 so it
         layers behind everything except the card background.
         Anchored to the LEFT (Sam's preferred spot for the moves
         celebration since time burst already lives on the right). -->
    <svg id="winBurstMoves" viewBox="0 0 200 200" style="display:none;position:absolute;top:32px;left:-22px;width:120px;height:120px;pointer-events:none;opacity:0;transition:opacity 0.5s ease;z-index:0;" aria-hidden="true">
      <g stroke="#ffd84a" stroke-width="2" fill="none" stroke-linejoin="round" opacity="0.85">
        <polygon points="100.0,8.0 113.0,64.3 159.1,29.5 132.9,81.0 190.6,84.0 137.4,106.6 179.7,146.0 124.4,129.1 131.5,186.5 100.0,138.0 68.5,186.5 75.6,129.1 20.3,146.0 62.6,106.6 9.4,84.0 67.1,81.0 40.9,29.5 87.0,64.3"/>
        <polygon points="100.0,35.0 109.6,73.7 141.8,50.2 124.2,86.0 164.0,88.7 127.6,104.9 156.3,132.5 118.0,121.4 122.2,161.1 100.0,128.0 77.8,161.1 82.0,121.4 43.7,132.5 72.4,104.9 36.0,88.7 75.8,86.0 58.2,50.2 90.4,73.7" opacity="0.6"/>
      </g>
      <text x="100" y="98" text-anchor="middle" font-family="'IBM Plex Mono',monospace" font-size="14" font-weight="700" fill="#ffd84a" letter-spacing="1">NEW BEST</text>
      <text x="100" y="116" text-anchor="middle" font-family="'IBM Plex Mono',monospace" font-size="14" font-weight="700" fill="#ffd84a" letter-spacing="1">MOVES</text>
    </svg>

    <!-- Headline cluster with burst overlays. The bursts are absolute
         children of this wrapper so they pin to the trophy/title
         group regardless of card resizing. -->
    <div id="winHeadlineWrap" style="position:relative;display:flex;flex-direction:column;align-items:center;width:100%;margin-top:18px;">
      <!-- TIME PB burst (top-right, behind the headline). Hidden by
           default; _showWinCard reveals it on a time PB. SVG sunburst
           with a yellow stroke-only outline, low-opacity so the
           headline reads on top. -->
      <svg id="winBurstTime" viewBox="0 0 200 200" style="display:none;position:absolute;top:-22px;right:-28px;width:120px;height:120px;pointer-events:none;opacity:0;transition:opacity 0.5s ease;z-index:1;" aria-hidden="true">
        <!-- [v4.12] Polygon points regenerated as a proper 9-point
             sunburst: every point sits at outer radius 92, every
             valley at inner radius 38, evenly spaced around the
             circle. The previous hand-written points had a coincident
             pair that rendered as a squared-off end. Inner polygon
             is the same shape scaled down for the layered effect. -->
        <g stroke="#ffd84a" stroke-width="2" fill="none" stroke-linejoin="round" opacity="0.85">
          <polygon points="100.0,8.0 113.0,64.3 159.1,29.5 132.9,81.0 190.6,84.0 137.4,106.6 179.7,146.0 124.4,129.1 131.5,186.5 100.0,138.0 68.5,186.5 75.6,129.1 20.3,146.0 62.6,106.6 9.4,84.0 67.1,81.0 40.9,29.5 87.0,64.3"/>
          <polygon points="100.0,35.0 109.6,73.7 141.8,50.2 124.2,86.0 164.0,88.7 127.6,104.9 156.3,132.5 118.0,121.4 122.2,161.1 100.0,128.0 77.8,161.1 82.0,121.4 43.7,132.5 72.4,104.9 36.0,88.7 75.8,86.0 58.2,50.2 90.4,73.7" opacity="0.6"/>
        </g>
        <text x="100" y="98" text-anchor="middle" font-family="'IBM Plex Mono',monospace" font-size="14" font-weight="700" fill="#ffd84a" letter-spacing="1">NEW BEST</text>
        <text x="100" y="116" text-anchor="middle" font-family="'IBM Plex Mono',monospace" font-size="14" font-weight="700" fill="#ffd84a" letter-spacing="1">TIME</text>
      </svg>
      <!-- [v4.12] MOVES PB burst was moved OUT of this headline
           wrapper and into the top-left area of the card (below the
           header). See winBurstMoves below as a sibling of .wcard's
           child structure. Sam's note: it was previously over the
           Template line; moved so it sits just below the header
           where there's empty card real estate. -->
      <!-- [v4.13] Trophy image replaces the emoji. External asset
           at assets/equil-trophy.webp following the assets-outside-
           the-HTML workflow. Fail-silent: if the image fails to
           load (local testing with no assets/ folder), the onerror
           handler hides it and reveals the emoji fallback sibling,
           so the win card still displays correctly without the
           asset. Sized 96px tall — roughly twice the emoji's 48px,
           since the photo has more detail to read. The cyan
           drop-shadow gives it a subtle glow that matches the rest
           of the card's accent treatment. -->
      <img id="winTrophyImg" src="assets/equil-trophy.webp" alt=""
           style="position:relative;z-index:2;height:96px;width:auto;display:block;filter:drop-shadow(0 0 14px rgba(0,217,255,0.25));margin-bottom:-4px;"
           onerror="this.style.display='none';var f=document.getElementById('winTrophyFallback');if(f) f.style.display='block';">
      <div id="winTrophyFallback" class="wico" style="display:none;position:relative;z-index:2;">🏆</div>
      <div class="wt" style="position:relative;z-index:2;">Solved!</div>
    </div>

    <!-- Clean-solve indicator. Appears in magenta only when current
         run had zero mistakes. Smaller than headline, larger than
         the table labels. Independent of PB status (a clean run can
         also be a PB, in which case the burst+this text both show). -->
    <div id="winCleanLabel" style="display:none;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:2.5px;color:var(--magenta);font-weight:700;margin-top:2px;">CLEAN SOLVE</div>

    <!-- [v4.11] Unified stats grid: current-run row + divider + 3
         template-stat rows, all in ONE grid so moves/time columns
         align perfectly between current run and historical stats.
         The eye reads top-to-bottom in the MOVES column and the
         TIME column to compare what you just did with your best/
         avg/least-best history.

         Column structure (3 cols):
           [ label/mistake-indicator ] [ MOVES ] [ TIME ]

         Color scheme (v4.11):
           - Column headers MOVES/TIME: cyan-tinted
           - Row labels Best/Avg/Least Best: cyan-tinted (was grey)
           - Current run numbers (moves, time): GREEN — distinguishes
             "what you just did" from historical
           - Mistake count: red on the left (was a separate line)
           - Stat numbers: white (was muted grey)
           - PB-tinted values: magenta (unchanged from v4.10)

         The old winStats element is kept in DOM as display:none so
         downstream code that might reference winTimer/winMoves
         (e.g. for save/restore) still finds them — those IDs now
         live in this new grid. -->
    <div id="winTplStats" style="display:none;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:1.5px;margin-top:10px;width:100%;max-width:300px;">
      <!-- Column header row -->
      <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;font-size:9px;letter-spacing:2px;margin-bottom:4px;color:var(--cyan);opacity:0.75;">
        <span></span>
        <span style="text-align:center;">MOVES</span>
        <span style="text-align:right;">TIME</span>
      </div>
      <!-- Current run row (above the divider). Numbers in green so the
           eye sees them as "just now" vs. the white historical values.
           Mistake indicator lives in the label column so it doesn't
           disrupt moves/time column alignment. Hides if no mistakes
           (i.e. on clean solves the indicator slot is just blank). -->
      <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:baseline;line-height:1.6;padding-bottom:8px;border-bottom:1px solid rgba(0,217,255,0.35);">
        <span id="winCurMistakes" style="text-align:left;color:#ff6b6b;font-weight:700;font-size:12px;visibility:hidden;">0 ✕</span>
        <span id="winMoves" style="text-align:center;color:var(--cyan);font-weight:700;font-size:14px;">0</span>
        <span id="winTimer" style="text-align:right;color:var(--cyan);font-weight:700;font-size:14px;">0:00</span>
      </div>
      <!-- Historical stats — Best / Avg / Least Best. Each row is
           its own grid so we can put cyan-tinted dividing lines
           between them. The "Least Best" cell uses a tighter
           line-height so when the two words wrap (they always do in
           the column) they sit nearly stacked. -->
      <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:baseline;line-height:1.9;padding-top:6px;padding-bottom:6px;border-bottom:1px solid rgba(0,217,255,0.35);">
        <span style="text-align:left;color:var(--cyan);opacity:0.75;">Best</span>
        <span id="winTplBestMoves" style="text-align:center;color:var(--text-primary);font-weight:700;">--</span>
        <span id="winTplBest" style="text-align:right;color:var(--text-primary);font-weight:700;">--</span>
      </div>
      <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:baseline;line-height:1.9;padding-top:6px;padding-bottom:6px;border-bottom:1px solid rgba(0,217,255,0.35);">
        <span style="text-align:left;color:var(--cyan);opacity:0.75;">Avg</span>
        <span id="winTplAvgMoves" style="text-align:center;color:var(--text-primary);font-weight:700;">--</span>
        <span id="winTplAvg" style="text-align:right;color:var(--text-primary);font-weight:700;">--</span>
      </div>
      <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:baseline;line-height:1.9;padding-top:6px;">
        <!-- [v4.12] line-height:0.95 squeezes "Least" and "Best" onto
             stacked rows that nearly touch. white-space:normal allows
             the wrap; display:inline-block lets the tighter line
             height take effect inside a grid cell. -->
        <span style="text-align:left;color:var(--cyan);opacity:0.75;display:inline-block;line-height:0.95;">Least Best</span>
        <span id="winTplWorstMoves" style="text-align:center;color:var(--text-primary);font-weight:700;">--</span>
        <span id="winTplWorst" style="text-align:right;color:var(--text-primary);font-weight:700;">--</span>
      </div>
    </div>

    <!-- [v4.11] Legacy single-line winStats kept as display:none.
         The winTimer / winMoves / winMistakes IDs have moved up
         into the unified grid above; these dummy spans satisfy any
         downstream code that might still look them up by id (none
         currently spotted, but safer than ripping the references). -->
    <div id="winStats" style="display:none;">
      <span id="_winStatsLegacyTimer">0:00</span>
      <span id="_winStatsLegacyMoves">0</span>
      <span id="winMistakesWrap" style="display:none;"><span id="winMistakes">0</span></span>
    </div>

    <!-- The PERSONAL BEST/SOLVED/Best:0:34 label from v4.09 is now
         redundant on PB (burst handles it) and on clean (the magenta
         label above handles it). Kept in DOM as display:none so any
         downstream code referencing winLabel doesn't break, and so
         we can revive it if we want a fallback "Best: 0:34" hint
         when neither PB nor clean fires. -->
    <div id="winLabel" class="ws" style="display:none;margin-top:2px;">PERSONAL BEST</div>

    <!-- [v4.10] Split-pill button replacing the two-button row. Both
         halves of the pill are full buttons (so accessibility/focus
         work), separated by a thin cyan divider. -->
    <div id="winSplitBtns" style="display:flex;margin-top:14px;border:1.5px solid var(--cyan);border-radius:999px;overflow:hidden;background:transparent;box-shadow:0 0 12px rgba(0,217,255,0.4);">
      <button id="winMenuBtn" style="flex:1;background:transparent;border:none;color:var(--cyan);font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:12px 22px;cursor:pointer;border-right:1px solid rgba(0,217,255,0.5);">MENU</button>
      <button id="nxt" style="flex:1.4;background:transparent;border:none;color:var(--cyan);font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:12px 22px;cursor:pointer;">NEXT PUZZLE</button>
    </div>
    <!-- [v4.10] OLD two-separate-button markup left here commented
         out for easy revert. To revive: delete the split-pill div
         above and uncomment this block. winMenuBtn and nxt IDs are
         already used above so the click handlers wired elsewhere
         work either way.
    <div style="display:flex;gap:8px;margin-top:8px;">
      <button class="wnxt" id="winMenuBtn">Menu</button>
      <button class="wnxt" id="nxt">Next Puzzle</button>
    </div>
    -->
  </div>
<!-- Save/Load Modal -->
<div id="seqModal" style="display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.8);align-items:center;justify-content:center;"><div id="seqModalBox" style="background:var(--bg-secondary);border:2px solid var(--cyan);border-radius:6px;padding:18px;width:min(340px,90vw);font-family:'IBM Plex Mono',monospace;box-shadow:0 0 20px rgba(0,217,255,0.3);"><div id="seqModalTitle" style="font-weight:700;font-size:13px;letter-spacing:1px;margin-bottom:12px;color:var(--text-primary);"></div><div id="seqModalBody" style="color:var(--text-secondary);"></div><div style="display:flex;gap:8px;margin-top:14px;justify-content:flex-end;"><button id="seqModalCancel" style="font-family:'IBM Plex Mono',monospace;font-size:11px;padding:6px 12px;border:1.5px solid var(--cyan);border-radius:3px;background:transparent;color:var(--cyan);cursor:pointer;">Cancel</button><button id="seqModalOk" style="font-family:'IBM Plex Mono',monospace;font-size:11px;padding:6px 12px;border:1.5px solid var(--cyan);border-radius:3px;background:rgba(0,217,255,0.15);color:var(--cyan);cursor:pointer;">OK</button></div></div></div>
</div>

<!-- Stats overlay -->
<div id="statsOverlay" style="display:none;position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.87);align-items:center;justify-content:center;padding:18px;box-sizing:border-box;">
  <!-- [v3.49] Inner panel now flex-column with max-height:90vh and
       overflow-y:auto on statsBody so long stats lists scroll instead
       of getting clipped off-screen. Title/RESET/CLOSE stay pinned
       top/bottom while only the data scrolls. -->
  <div style="background:var(--bg-secondary);border:2px solid var(--cyan);border-radius:18px;padding:24px 28px;text-align:center;box-shadow:0 0 30px rgba(0,217,255,0.4);max-width:380px;width:90vw;max-height:90vh;display:flex;flex-direction:column;font-family:'IBM Plex Mono',monospace;box-sizing:border-box;">
    <div style="font-family:'Abril Fatface',serif;font-size:24px;color:var(--cyan);margin-bottom:14px;flex-shrink:0;">Stats</div>
    <div id="statsBody" style="color:var(--text-secondary);font-size:11px;letter-spacing:1px;line-height:1.7;text-align:left;overflow-y:auto;flex:1 1 auto;min-height:0;padding-right:4px;"></div>
    <div style="display:flex;gap:8px;margin-top:18px;justify-content:center;flex-shrink:0;">
      <button id="statsClearBtn" style="font-family:'IBM Plex Mono',monospace;font-size:10px;padding:8px 18px;border:1.5px solid rgba(255,107,107,0.5);border-radius:999px;background:transparent;color:#ff6b6b;cursor:pointer;letter-spacing:1px;font-weight:700;">RESET</button>
      <button id="statsCloseBtn" style="font-family:'IBM Plex Mono',monospace;font-size:10px;padding:8px 22px;border:1.5px solid var(--cyan);border-radius:999px;background:rgba(0,217,255,0.15);color:var(--cyan);cursor:pointer;letter-spacing:1px;font-weight:700;">CLOSE</button>
    </div>
  </div>
</div>

<!-- [v3.50] Resume prompt modal. Appears when the player taps Play
     and there's a saved in-progress puzzle for the chosen (size,
     diff). Shows the saved elapsed time + move count, with two
     choices: RESUME (continue where you left off) or START NEW
     (discard the save and build a fresh puzzle). -->
<div id="resumeOverlay" style="display:none;position:fixed;inset:0;z-index:410;background:rgba(0,0,0,.87);align-items:center;justify-content:center;padding:18px;box-sizing:border-box;">
  <div style="background:var(--bg-secondary);border:2px solid var(--cyan);border-radius:18px;padding:24px 28px;text-align:center;box-shadow:0 0 30px rgba(0,217,255,0.4);max-width:360px;width:90vw;font-family:'IBM Plex Mono',monospace;">
    <div style="font-family:'Abril Fatface',serif;font-size:24px;color:var(--cyan);margin-bottom:6px;">Resume?</div>
    <div id="resumePromptInfo" style="color:var(--text-secondary);font-size:11px;letter-spacing:1px;line-height:1.7;margin-bottom:18px;">— · — · — moves</div>
    <div style="display:flex;gap:8px;justify-content:center;flex-wrap:wrap;">
      <button id="resumeNewBtn" style="font-family:'IBM Plex Mono',monospace;font-size:10px;padding:9px 18px;border:1.5px solid rgba(255,107,107,0.5);border-radius:999px;background:transparent;color:#ff6b6b;cursor:pointer;letter-spacing:1px;font-weight:700;">START NEW</button>
      <button id="resumeResumeBtn" style="font-family:'IBM Plex Mono',monospace;font-size:10px;padding:9px 22px;border:1.5px solid var(--cyan);border-radius:999px;background:rgba(0,217,255,0.15);color:var(--cyan);cursor:pointer;letter-spacing:1px;font-weight:700;">▶ RESUME</button>
    </div>
  </div>
</div>

<!-- [v3.48] READY overlay — single blur pane that covers grid +
     bank as one continuous region, eliminating the seam where you
     could see through between two separate panes. The pane is
     positioned dynamically to span from the top of .gscroll to the
     bottom of the bank-outer wrapper. Blur is set to 4px (between
     the previous 2/5 split — a single value that softens both grid
     and bank enough to obscure but still hint at the layout).
     The GO button is positioned over the grid center, not screen
     center, so it sits inside the blurred zone at a comfortable
     reading height.
     The overlay also locks body scroll while shown so the player
     can't peek at the bank by scrolling.
     [v3.61] The overlay itself is pointer-events:none so taps fall
     through to underlying elements — this lets the masthead buttons
     (NEW, settings, pause, back) stay tappable while ready is up.
     The blur pane sets pointer-events:auto to swallow taps on the
     grid+bank area (so the player can't place tiles or select cells
     while the overlay is showing). The GO button also gets
     pointer-events:auto via its own positioning. Net effect: only
     GO and the masthead buttons respond to taps; the puzzle area
     is locked. -->
<div id="readyOverlay" style="display:none;position:fixed;inset:0;z-index:320;background:transparent;font-family:'IBM Plex Mono',monospace;color:var(--cyan);pointer-events:none;">
  <!-- Single blur pane spanning grid → bank. Position computed in JS.
       pointer-events:auto so the player can't tap-through onto cells
       or bank tiles while the overlay is up. -->
  <div id="readyBlurPane" style="position:fixed;background:rgba(0,0,0,0.05);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);pointer-events:auto;"></div>
  <!-- GO button positioned over grid center via JS in showReady. -->
  <button id="readyGoBtn" style="font-family:'IBM Plex Mono',monospace;font-size:18px;padding:18px 56px;border:2px solid var(--cyan);border-radius:999px;background:rgba(0,217,255,0.20);color:var(--cyan);cursor:pointer;letter-spacing:6px;font-weight:700;box-shadow:0 0 32px rgba(0,217,255,0.5);text-shadow:0 0 12px rgba(0,217,255,0.6);position:fixed;z-index:1;pointer-events:auto;">▶ GO</button>
</div>

<!-- Cyan win flash overlay -->
<div id="winFlash" style="display:none;position:fixed;inset:0;z-index:250;background:radial-gradient(ellipse at center, rgba(0,217,255,0.45) 0%, rgba(0,217,255,0.15) 40%, rgba(0,0,0,0) 75%);pointer-events:none;"></div>

<!-- [v3.38] Pause overlay. Covers the puzzle when the pause button
     is tapped. Tap the overlay (or the RESUME button) to dismiss.
     z-index 350 — above gameScreen but below win card (300 base, but
     win card uses z-index:300 only when shown; we sit above it anyway
     and the win flow can still cover us with its own animation.
     Actually keep us at 250 to match winFlash so the win sequence's
     z-index:300 wins). On second thought: 250 is below win, so a
     win during pause would correctly draw over the pause overlay.
     But we'll use 350 so the pause is dominant — the user explicitly
     paused, and the win can't fire while paused anyway since input
     is suspended. Going with 350. -->
<div id="pauseOverlay" style="display:none;position:fixed;inset:0;z-index:350;background:rgba(0,0,0,0.92);align-items:center;justify-content:center;flex-direction:column;cursor:pointer;font-family:'IBM Plex Mono',monospace;color:var(--cyan);">
  <div style="font-family:'Abril Fatface',serif;font-size:48px;letter-spacing:6px;color:var(--cyan);text-shadow:0 0 20px rgba(0,217,255,0.5);margin-bottom:8px;">PAUSED</div>
  <div style="font-size:11px;letter-spacing:3px;color:var(--text-muted);text-transform:uppercase;margin-bottom:24px;">tap to resume</div>
  <button id="pauseResumeBtn" style="font-family:'IBM Plex Mono',monospace;font-size:12px;padding:10px 28px;border:1.5px solid var(--cyan);border-radius:999px;background:rgba(0,217,255,0.15);color:var(--cyan);cursor:pointer;letter-spacing:2px;font-weight:700;box-shadow:0 0 18px rgba(0,217,255,0.4);">▶ RESUME</button>
</div>

<!-- Toast (for share copy confirmation) -->
<!-- [v2.96] Toast border-radius bumped 4px → 999px so the pill
     ends fully round, matching the rest of the app's button and
     panel rounding. Used by the "Stats cleared" message after a
     successful long-press reset, plus a few other places that
     call window._mc113.showToast. -->
<div id="toast" style="display:none;position:fixed;bottom:30px;left:50%;transform:translateX(-50%);z-index:600;background:var(--bg-secondary);border:1.5px solid var(--cyan);padding:10px 22px;border-radius:999px;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:1.5px;color:var(--cyan);font-weight:700;box-shadow:0 0 14px rgba(0,217,255,0.5);"></div>

<script>
// ═══════════════════════════════════════════════════════════
// CORE HELPERS
// ── Standard 5-cell equation helpers ──
function seq(dir,c,r){
  if(dir==='h')return[{c,r},{c:c+1,r},{c:c+2,r},{c:c+3,r},{c:c+4,r}];
  return[{c,r},{c,r:r+1},{c,r:r+2},{c,r:r+3},{c,r:r+4}];
}
function nk(p){return p.c+','+p.r;}
function numPts(e){var s=seq(e.dir,e.c,e.r);return[s[0],s[2],s[4]];}

// ── XL 7-cell equation helpers: A op1 B op2 C = D ──
// Cell layout: pos0=A, pos1=op1, pos2=B, pos3=op2, pos4=C, pos5==, pos6=D
// Num cells at positions 0,2,4,6. Crossings only at num cells.
function seqXL(dir,c,r){
  if(dir==='h')return[{c,r},{c:c+1,r},{c:c+2,r},{c:c+3,r},{c:c+4,r},{c:c+5,r},{c:c+6,r}];
  return[{c,r},{c,r:r+1},{c,r:r+2},{c,r:r+3},{c,r:r+4},{c,r:r+5},{c,r:r+6}];
}
function numPtsXL(e){var s=seqXL(e.dir,e.c,e.r);return[s[0],s[2],s[4],s[6]];}

// Evaluate A op1 B op2 C with proper order of operations
// Returns null if any intermediate or final result is non-integer or out of range
function evalXL(a,op1,b,op2,c){
  if(a==null||b==null||c==null)return null;
  var isMul1=(op1==='x'||op1==='/');
  var isMul2=(op2==='x'||op2==='/');
  var result;
  if(!isMul1&&isMul2){
    // op2 binds tighter: A op1 (B op2 C)
    var t=ev(b,op2,c);
    if(t==null||!Number.isInteger(t)||t<1)return null;
    result=ev(a,op1,t);
  } else {
    // op1 first (left-to-right, or op1 is high-precedence): (A op1 B) op2 C
    var t=ev(a,op1,b);
    if(t==null||!Number.isInteger(t)||t<1)return null;
    result=ev(t,op2,c);
  }
  if(result==null||!Number.isInteger(result)||result<1)return null;
  return result;
}

var SYM={'+':'+','-':'−','x':'×','/':'/'};
function ri(a,b){return Math.floor(Math.random()*(b-a+1))+a;}
function rp(arr){return arr[Math.floor(Math.random()*arr.length)];}

// [v3.00] No-recent-repeats template picker.
// Maintains per-size history (indices into the pool) in localStorage so
// consecutive New-button rolls can't yield the same template back-to-back,
// and a player browsing through several puzzles sees genuinely different
// shapes before any can repeat. Daily mode bypasses this entirely so the
// (date,size,diff) seed remains deterministic across players.
//
// History size N = min(3, pool.length-1). With pool.length=2 → N=1
// (avoid only the most recent). pool.length=3 → N=2. pool.length>=4 → N=3.
// localStorage shape: { small:[idx,...], medium:[...], large:[...], xl2:[...] }
var _RECENT_KEY='equil_recentTemplates';
function _readRecent(){
  try{
    var raw=localStorage.getItem(_RECENT_KEY);
    if(!raw)return{};
    var obj=JSON.parse(raw);
    return (obj&&typeof obj==='object')?obj:{};
  }catch(e){return{};}
}
function _writeRecent(obj){
  try{localStorage.setItem(_RECENT_KEY,JSON.stringify(obj));}catch(e){}
}
function _pickTemplate(pool,size,opts){
  // Daily mode: defer to plain rp() so the seeded RNG inside withSeed()
  // produces the same template for every player on a given (date,size,diff).
  // Also short-circuits the localStorage read/write — daily picks should
  // never affect personal recent-history.
  // [v3.18b] _isRetry suppresses pick counter bump (but still labels).
  var skipCounter=!!(opts&&opts._isRetry);
  if(opts&&opts.daily){
    var t=rp(pool);
    if(t&&_TEMPLATE_NAMES.has(t)){
      var nm=_TEMPLATE_NAMES.get(t);
      window._currentTplName=nm;
      if(!skipCounter)_dbgBumpPick(nm);
    }
    return t;
  }
  if(!pool||pool.length===0)return null;
  if(pool.length===1){
    if(_TEMPLATE_NAMES.has(pool[0])){
      var nm=_TEMPLATE_NAMES.get(pool[0]);
      window._currentTplName=nm;
      if(!skipCounter)_dbgBumpPick(nm);
    }
    return pool[0];
  }

  var historyMap=_readRecent();
  var hist=(historyMap[size]||[]).filter(function(i){
    return typeof i==='number' && i>=0 && i<pool.length;
  });
  var maxHist=Math.min(3,pool.length-1);

  // [v3.18c] On retry picks, ignore history entirely. Otherwise the
  // candidate set is just (pool minus 3 recently-picked templates),
  // which on retry leaves only 1 candidate — and 120 retries all on
  // that one failing template defeats the purpose of retrying. With
  // history ignored, retries can land on any of the 4 templates and
  // values-gen gets 120 chances across the full pool.
  var excluded={};
  if(!skipCounter){
    for(var i=Math.max(0,hist.length-maxHist);i<hist.length;i++)excluded[hist[i]]=true;
  }
  var candidates=[];
  for(var j=0;j<pool.length;j++)if(!excluded[j])candidates.push(j);

  if(candidates.length===0)candidates=pool.map(function(_,k){return k;});

  var chosenIdx=candidates[Math.floor(Math.random()*candidates.length)];

  // [v3.18b] On retry picks, don't write to history. Otherwise rapid
  // retries on a failing template would fill history with templates
  // the user didn't actually see, and the no-recent-repeats logic
  // would exclude templates the user genuinely hasn't played recently.
  if(!skipCounter){
    hist.push(chosenIdx);
    while(hist.length>maxHist)hist.shift();
    historyMap[size]=hist;
    _writeRecent(historyMap);
  }

  if(_TEMPLATE_NAMES.has(pool[chosenIdx])){
    var nm=_TEMPLATE_NAMES.get(pool[chosenIdx]);
    window._currentTplName=nm;
    if(!skipCounter)_dbgBumpPick(nm);
  }

  return pool[chosenIdx];
}
function ev(a,op,b){
  if(op==='+')return a+b;
  if(op==='-')return a-b;
  if(op==='x')return a*b;
  if(op==='/')return(b>0&&a%b===0)?a/b:null;
  return null;
}

// ═══════════════════════════════════════════════════════════
// TEMPLATES
// [v3.00] Repooled by equation count.
// [v3.01] TC and TD removed (failed connectivity rule);
//         TJ added (new 7×7 diagonal-step interlock).
// [v3.02] TK added (new 7×9 vertical staircase).
// [v3.03] TL added (new 13×7 wide horizontal compound).
// [v3.06] TM added (new 9×9 vertical-staircase, brings Small to 3).
// [v3.07] TN added (new 11×9 lattice-with-wing, brings Medium to 4).
// [v3.09] TO added (new 9×11 vertical lattice-with-wing).
//         TB removed (was visually duplicate of TE).
// [v3.10] TP added (new 11×11 square frame-with-bridge).
//         TE removed (legacy 16-cell, can't hit new Medium targets).
// [v3.11] TQ added (new 7×13 narrow-tall dense lattice).
//         TK removed (legacy 17-cell; Medium pool now fully on new system).
// [v3.12] TQ2 added (TQ-family variant, inner V's rearranged).
// [v3.13] TR added to Large (new 11×13 frame-with-bridge, first Large on new system).
// [v3.14] TS added to Large (new 13×13, 42 cells, denser); TR removed (didn't feel Large).
// [v3.15] TS3, TS5, TS9 added (TS-family variants); TF, TG, TL removed.
//         All Large templates now on new system.
// [v3.17] TT added (denser 13×13, 44 cells); TS-family removed (didn't feel Large enough).
// [v3.18] TT removed (failed values-gen 80% of the time, causing fallback to
//         Medium templates); TS-family restored.
// Now: Small={TA,TJ,TM}, Medium={TN,TO,TP,TQ,TQ2},
// Large={TS,TS3,TS5,TS9}, Jumbo unchanged.
// TB, TC, TD, TE, TF, TG, TK, TL, TR, TT, TH_final, TI_stair stay
// defined but unpooled.
// ═══════════════════════════════════════════════════════════

// TA: Staircase 9×9
var TA=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:2,r:4},{id:'h2',dir:'h',c:4,r:8},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:4},{id:'v4',dir:'v',c:8,r:4}
];
// TB: Z-shape 9×7
var TB=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:2},{id:'v4',dir:'v',c:8,r:2}
];
// TC: Two-pillars 7×9
var TC=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:0,r:4},{id:'h2',dir:'h',c:2,r:8},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:4}
];
// TD: Pinwheel 9×9
var TD=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:0,r:4},{id:'h2',dir:'h',c:4,r:6},{id:'h3',dir:'h',c:0,r:8},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:4},{id:'v4',dir:'v',c:8,r:4}
];
// TE: L-shape 9×7
var TE=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:4,r:0},{id:'v2',dir:'v',c:8,r:2},
  {id:'v3',dir:'v',c:2,r:0},{id:'v4',dir:'v',c:6,r:2}
];
// TF: TB core + lower extension 9×11
var TF=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:2},{id:'v4',dir:'v',c:8,r:2},
  {id:'h4',dir:'h',c:0,r:8},{id:'h5',dir:'h',c:4,r:10},
  {id:'v5',dir:'v',c:4,r:6},{id:'v6',dir:'v',c:0,r:6},{id:'v7',dir:'v',c:2,r:6}
];
// TG: TE core + lower extension 9×11
var TG=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:4,r:0},{id:'v2',dir:'v',c:8,r:2},
  {id:'v3',dir:'v',c:2,r:0},{id:'v4',dir:'v',c:6,r:2},
  {id:'hx0',dir:'h',c:4,r:8},{id:'hx1',dir:'h',c:4,r:10},
  {id:'vx2',dir:'v',c:4,r:6},{id:'vx0',dir:'v',c:8,r:8},{id:'vx1',dir:'v',c:6,r:8}
];

// [v3.01] TJ: Diagonal-step interlock 7×7, 8 equations, 10 crossings.
// Two H/V clusters at opposite corners interlocked via shared num cells
// at (2,2), (2,4), (4,2). All equations in one connected component
// (verified by connectivity audit). Denser than TA (10 crossings vs 6),
// which means slightly higher generator-retry rate (~50% first-attempt
// vs 100% for TA in bench tests) but well within the maxR=30 retry
// budget. Adds shape variety to Small alongside TA's staircase.
var TJ=[
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:0,r:2},
  {id:'h2',dir:'h',c:2,r:4},{id:'h3',dir:'h',c:2,r:6},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},
  {id:'v2',dir:'v',c:4,r:2},{id:'v3',dir:'v',c:6,r:2}
];

// [v3.06] TM: Vertical-staircase Small template, 9×9, 8 equations,
// 17 unique num cells, 7 crossings. Visual: five horizontal equations
// stacked on alternating rows (0/2/4/6/8) with three vertical bridges
// — v0 covers rows 4-8 on the left, v1 covers rows 0-4 in the middle,
// v2 covers rows 2-6 on the right. The H staircase alternates left
// edge (c=0) and middle (c=4) start columns, like TK does for Medium.
// Distinct from TA (diagonal-down staircase) and TJ (corner-to-corner
// interlock). Audit clean: connectivity PASS, no cell-type collisions,
// no same-direction overlaps. Hits Small Easy/Medium target (9) and
// Hard target (12) reliably in bench tests. Brings Small pool to 3.
var TM=[
  {id:'h0',dir:'h',c:0,r:0},
  {id:'h1',dir:'h',c:4,r:2},
  {id:'h2',dir:'h',c:0,r:4},
  {id:'h3',dir:'h',c:4,r:6},
  {id:'h4',dir:'h',c:0,r:8},
  {id:'v0',dir:'v',c:0,r:4},
  {id:'v1',dir:'v',c:4,r:0},
  {id:'v2',dir:'v',c:8,r:2}
];

// [v3.07] TN: Lattice-with-wing Medium template, 11×9, 13 equations,
// 24 unique num cells, 15 crossings. Visual: a 5×5 lattice on cols
// 0-4 / rows 0-8 (5 H equations + 4 V equations) extended on the
// right by an upper-right "wing" — two extra H equations at c=6
// (rows 0 and 4) plus a V at c=10 stitching their right ends. The
// wing is what brings the cell count from 19 (a pure 9×9 lattice
// caps there) to 24, enough headroom for Hard target=18 with all-3-
// blank equations allowed in some places. Audit clean: connectivity
// PASS, no cell-type collisions, no same-direction overlaps. Bench-
// verified to hit Easy/Medium=15 and Hard=18 reliably. Brings Medium
// pool to 4. Distinct shape from TB/TE (9×7 wide-Z) and TK (7×9
// vertical staircase) — TN is wide-and-short with right-side wing.
var TN=[
  {id:'h0',dir:'h',c:0,r:0},
  {id:'h0b',dir:'h',c:6,r:0},
  {id:'h1',dir:'h',c:4,r:2},
  {id:'h2',dir:'h',c:0,r:4},
  {id:'h2b',dir:'h',c:6,r:4},
  {id:'h3',dir:'h',c:4,r:6},
  {id:'h4',dir:'h',c:0,r:8},
  {id:'v0',dir:'v',c:0,r:0},
  {id:'v1',dir:'v',c:2,r:4},
  {id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:2},
  {id:'v4',dir:'v',c:8,r:2},
  {id:'v5',dir:'v',c:10,r:0}
];

// [v3.09] TO: Vertical lattice-with-wing Medium template, 9×11, 14
// equations, 27 unique num cells, 15 crossings. Vertical companion
// to TN. Two 5×5 H/V lattices stacked vertically (rows 0-4 and
// rows 6-10), bridged by v6_bridge at c=6 spanning rows 2-6 to
// connect the halves into one component. Plus two "wing" H
// equations (h0w at r=6, h0w2 at r=2) extending the lattice
// horizontally on rows 2 and 6 to reach c=8.
//
// Audit clean: connectivity PASS, no cell-type collisions, no
// same-direction overlaps. Bench-verified hits Easy=11 and
// Medium=15 reliably; Hard target=21 reaches 19-20 most rolls,
// occasionally 21. Together with TN forms a wide/tall pair in
// Medium's new-system pool — TN is 11×9 (wide-short), TO is
// 9×11 (tall-narrow).
var TO=[
  {id:'v0a',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:6},
  {id:'v4a',dir:'v',c:4,r:0},
  {id:'v4b',dir:'v',c:4,r:6},
  {id:'v8a',dir:'v',c:8,r:0},
  {id:'v8b',dir:'v',c:8,r:6},
  {id:'v2',dir:'v',c:2,r:2},
  {id:'v6_bridge',dir:'v',c:6,r:2},
  {id:'h0',dir:'h',c:0,r:0},
  {id:'h4',dir:'h',c:0,r:4},
  {id:'h8',dir:'h',c:0,r:8},
  {id:'h10',dir:'h',c:0,r:10},
  {id:'h0w',dir:'h',c:4,r:6},
  {id:'h0w2',dir:'h',c:4,r:2}
];

// [v3.10] TP: Square frame-with-bridge Medium template, 11×11, 15
// equations, 31 unique num cells, 14 crossings. Visual: a "frame"
// of H equations on rows 0, 4, 6, 10 (each row split into left
// half cols 0-4 and right half cols 6-10) plus stacked V's on
// the outer cols 0 and 10. The interior has two middle V's at
// c=4 and c=6 (rows 2-6), connected via a horizontal bridge at
// r=2 (cols 4-8). Without the h_bridge equation the layout splits
// into disconnected left/right halves — bridge ties them together.
//
// Audit clean: connectivity PASS, no cell-type collisions, no
// same-direction overlaps. Bench-verified to hit Easy=11 100%,
// Medium=15 100%, Hard=21 ~98% — best Hard reliability of any
// Medium template since 31 cells gives real headroom over the
// 21-blank target. Adds the square-and-large variation to Medium
// alongside TN (wide), TO (tall), and TK (narrow vertical).
var TP=[
  {id:'h_top_l',dir:'h',c:0,r:0},
  {id:'h_top_r',dir:'h',c:6,r:0},
  {id:'h_mid_l',dir:'h',c:0,r:4},
  {id:'h_mid_r',dir:'h',c:6,r:4},
  {id:'h_lm_l',dir:'h',c:0,r:6},
  {id:'h_lm_r',dir:'h',c:6,r:6},
  {id:'h_bot_l',dir:'h',c:0,r:10},
  {id:'h_bot_r',dir:'h',c:6,r:10},
  {id:'v_l_t',dir:'v',c:0,r:0},
  {id:'v_l_b',dir:'v',c:0,r:6},
  {id:'v_r_t',dir:'v',c:10,r:0},
  {id:'v_r_b',dir:'v',c:10,r:6},
  {id:'v_m',dir:'v',c:4,r:2},
  {id:'v_m2',dir:'v',c:6,r:2},
  {id:'h_bridge',dir:'h',c:4,r:2}
];

// [v3.11] TQ: Narrow-tall lattice Medium template, 7×13, 15
// equations, 26 unique num cells, 19 crossings. Visual: a tall
// narrow column with H equations on alternating rows in zigzag
// pattern (rows 0,2,4,6,8,10,12 with starting c=0 and c=2
// alternating), bridged by V equations stacked two-per-column
// on cols 0/2/4/6 (top half rows 0-4, bottom half rows 8-12,
// gap at rows 5-7 to avoid same-direction overlap). Densest
// crossing structure of any template (19 crossings) — only 7
// of 26 cells are uncrossed.
//
// Audit clean: connectivity PASS, no cell-type collisions, no
// same-direction overlaps. Hard target=21 reachable per
// structural analysis (9 of 15 equations fully-crossed, can
// be all-3-blank in Hard mode). Restores the "narrow column"
// visual identity TK had at 7×9 but at the bigger 26-cell
// count needed for the new system.
var TQ=[
  {id:'h0',dir:'h',c:0,r:0},
  {id:'h2',dir:'h',c:2,r:2},
  {id:'h4',dir:'h',c:0,r:4},
  {id:'h6',dir:'h',c:2,r:6},
  {id:'h8',dir:'h',c:0,r:8},
  {id:'h10',dir:'h',c:2,r:10},
  {id:'h12',dir:'h',c:0,r:12},
  {id:'v0a',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2a',dir:'v',c:2,r:2},
  {id:'v2b',dir:'v',c:2,r:8},
  {id:'v4a',dir:'v',c:4,r:0},
  {id:'v4b',dir:'v',c:4,r:6},
  {id:'v6a',dir:'v',c:6,r:2},
  {id:'v6b',dir:'v',c:6,r:8}
];

// [v3.12] TQ2: TQ-family variant. Same 7×13 footprint, same outer
// structure (7 H equations + 4 outer V equations on cols 0 and 6),
// but the 4 inner V equations on cols 2 and 4 are rearranged. TQ's
// inner pattern was col 2 = (2-6)+(8-12), col 4 = (0-4)+(6-10);
// TQ2 swaps to col 2 = (0-4)+(6-10), col 4 = (2-6)+(8-12). Both
// patterns pass connectivity (the inner V's must interlock — both
// cols using the same row-pattern fails connectivity). Same cell
// count (26), same crossing count (19), same target reachability.
// Visually similar to TQ but with different op/eq cell positions
// and different equation paths through the middle.
var TQ2=[
  {id:'h0',dir:'h',c:0,r:0},
  {id:'h2',dir:'h',c:2,r:2},
  {id:'h4',dir:'h',c:0,r:4},
  {id:'h6',dir:'h',c:2,r:6},
  {id:'h8',dir:'h',c:0,r:8},
  {id:'h10',dir:'h',c:2,r:10},
  {id:'h12',dir:'h',c:0,r:12},
  {id:'v0a',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2a',dir:'v',c:2,r:0},
  {id:'v2b',dir:'v',c:2,r:6},
  {id:'v4a',dir:'v',c:4,r:2},
  {id:'v4b',dir:'v',c:4,r:8},
  {id:'v6a',dir:'v',c:6,r:2},
  {id:'v6b',dir:'v',c:6,r:8}
];

// [v3.13] TR: First Large template on the new target system. 11×13
// footprint, 19 equations, 35 unique num cells, 22 crossings, 13
// uncrossed. "Frame with bridge" pattern scaled up from TP — eight
// H equations forming left/right halves on rows 0/4/8/12, stacked
// V equations on outer cols 0/2/8/10 (top stack rows 0-4, bottom
// stack rows 8-12), middle V spine at cols 4/6 (rows 4-8), and a
// single horizontal bridge h6_mid at c=2,r=6 connecting the left
// and right halves through the center. Without h6_mid the layout
// splits into disconnected halves (caught during design).
//
// Audit clean: connectivity PASS, no cell-type collisions, no
// same-direction overlaps. Bench-verified hits Easy=15 100%,
// Medium=21 100%, Hard=26 ~74% exact (others at 24-25). 35 cells
// gives real headroom over the 26-blank Hard target.
//
// Sets the visual bar for "Large feels Large" — clearly larger
// than any Medium template (Medium maxes at 11×11 or 7×13). When
// TF/TG/TL are replaced over v3.14+ they should match this size.
var TR=[
  {id:'h0l',dir:'h',c:0,r:0},
  {id:'h0r',dir:'h',c:6,r:0},
  {id:'h4l',dir:'h',c:0,r:4},
  {id:'h4r',dir:'h',c:6,r:4},
  {id:'h8l',dir:'h',c:0,r:8},
  {id:'h8r',dir:'h',c:6,r:8},
  {id:'h12l',dir:'h',c:0,r:12},
  {id:'h12r',dir:'h',c:6,r:12},
  {id:'v0t',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2t',dir:'v',c:2,r:0},
  {id:'v2b',dir:'v',c:2,r:8},
  {id:'v8t',dir:'v',c:8,r:0},
  {id:'v8b',dir:'v',c:8,r:8},
  {id:'v10t',dir:'v',c:10,r:0},
  {id:'v10b',dir:'v',c:10,r:8},
  {id:'v4',dir:'v',c:4,r:4},
  {id:'v6',dir:'v',c:6,r:4},
  {id:'h6_mid',dir:'h',c:2,r:6}
];

// [v3.14] TS: 13×13 frame-with-bridge — replaces TR as the new-
// system Large template. 24 equations, 42 unique num cells, 30
// crossings. Significant size jump from TR (11×13, 35 cells) for
// "Large feels Large" — TS is wider than any Medium template
// (Medium maxes 11×11) and taller than most.
//
// Layout: H equations in left/right halves on rows 0/4/8/12 (cols
// 0-4 and 8-12), middle bridge H equations on rows 2/6/10 (cols
// 4-8). Outer V equations on cols 0/2/10/12, stacked rows 0-4 top
// + rows 8-12 bottom. Middle V equations on cols 4 and 8, same
// stack pattern (rows 2-6 + rows 8-12). v6_bridge at c=6,r=6
// spans rows 6-10 — the single column-6 vertical that bridges
// upper and lower halves through the middle (without it the
// layout splits into disconnected halves; caught during design).
//
// Audit clean: connectivity PASS, no cell-type collisions, no
// same-direction overlaps. 42 cells with target 26 (Hard) means
// 16 givens — generous headroom. 12 uncrossed cells; the other
// 30 are crossings (densest Large template).
var TS=[
  {id:'h0l',dir:'h',c:0,r:0},
  {id:'h0r',dir:'h',c:8,r:0},
  {id:'h4l',dir:'h',c:0,r:4},
  {id:'h4r',dir:'h',c:8,r:4},
  {id:'h8l',dir:'h',c:0,r:8},
  {id:'h8r',dir:'h',c:8,r:8},
  {id:'h12l',dir:'h',c:0,r:12},
  {id:'h12r',dir:'h',c:8,r:12},
  {id:'h2_mid',dir:'h',c:4,r:2},
  {id:'h6_mid',dir:'h',c:4,r:6},
  {id:'h10_mid',dir:'h',c:4,r:10},
  {id:'v0t',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2t',dir:'v',c:2,r:0},
  {id:'v2b',dir:'v',c:2,r:8},
  {id:'v10t',dir:'v',c:10,r:0},
  {id:'v10b',dir:'v',c:10,r:8},
  {id:'v12t',dir:'v',c:12,r:0},
  {id:'v12b',dir:'v',c:12,r:8},
  {id:'v4t',dir:'v',c:4,r:2},
  {id:'v4b',dir:'v',c:4,r:8},
  {id:'v8t',dir:'v',c:8,r:2},
  {id:'v8b',dir:'v',c:8,r:8},
  {id:'v6_bridge',dir:'v',c:6,r:6}
];

// [v3.15] TS-family variants. Same 13×13 outer frame as TS (the 16
// outer equations: 8 corner H pairs + 8 outer V stacks). Inner 8
// equations rearranged. All pass the same audits as TS: connectivity
// PASS, no collisions, no overlaps. 42-43 cells, 29-30 crossings.
//
// TS3: col 4 stacks at rows 2-6 + 8-12 (same as TS).
//      col 8 stacks at rows 0-4 + 6-10 (shifted UP from TS).
//      v6_bridge at rows 4-8 (centered, vs TS's rows 6-10).
var TS3=[
  {id:'h0l',dir:'h',c:0,r:0},
  {id:'h0r',dir:'h',c:8,r:0},
  {id:'h4l',dir:'h',c:0,r:4},
  {id:'h4r',dir:'h',c:8,r:4},
  {id:'h8l',dir:'h',c:0,r:8},
  {id:'h8r',dir:'h',c:8,r:8},
  {id:'h12l',dir:'h',c:0,r:12},
  {id:'h12r',dir:'h',c:8,r:12},
  {id:'h2_mid',dir:'h',c:4,r:2},
  {id:'h6_mid',dir:'h',c:4,r:6},
  {id:'h10_mid',dir:'h',c:4,r:10},
  {id:'v0t',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2t',dir:'v',c:2,r:0},
  {id:'v2b',dir:'v',c:2,r:8},
  {id:'v10t',dir:'v',c:10,r:0},
  {id:'v10b',dir:'v',c:10,r:8},
  {id:'v12t',dir:'v',c:12,r:0},
  {id:'v12b',dir:'v',c:12,r:8},
  {id:'v4t',dir:'v',c:4,r:2},
  {id:'v4b',dir:'v',c:4,r:8},
  {id:'v8t',dir:'v',c:8,r:0},
  {id:'v8b',dir:'v',c:8,r:6},
  {id:'v6_bridge',dir:'v',c:6,r:4}
];

// TS5: col 4 stacks at rows 0-4 + 6-10 (shifted UP).
//      col 8 stacks at rows 2-6 + 8-12 (same as TS).
//      v6_bridge at rows 6-10 (same as TS).
var TS5=[
  {id:'h0l',dir:'h',c:0,r:0},
  {id:'h0r',dir:'h',c:8,r:0},
  {id:'h4l',dir:'h',c:0,r:4},
  {id:'h4r',dir:'h',c:8,r:4},
  {id:'h8l',dir:'h',c:0,r:8},
  {id:'h8r',dir:'h',c:8,r:8},
  {id:'h12l',dir:'h',c:0,r:12},
  {id:'h12r',dir:'h',c:8,r:12},
  {id:'h2_mid',dir:'h',c:4,r:2},
  {id:'h6_mid',dir:'h',c:4,r:6},
  {id:'h10_mid',dir:'h',c:4,r:10},
  {id:'v0t',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2t',dir:'v',c:2,r:0},
  {id:'v2b',dir:'v',c:2,r:8},
  {id:'v10t',dir:'v',c:10,r:0},
  {id:'v10b',dir:'v',c:10,r:8},
  {id:'v12t',dir:'v',c:12,r:0},
  {id:'v12b',dir:'v',c:12,r:8},
  {id:'v4t',dir:'v',c:4,r:0},
  {id:'v4b',dir:'v',c:4,r:6},
  {id:'v8t',dir:'v',c:8,r:2},
  {id:'v8b',dir:'v',c:8,r:8},
  {id:'v6_bridge',dir:'v',c:6,r:6}
];

// TS9: col 4 stacks at rows 0-4 + 6-10 (shifted UP).
//      col 8 stacks at rows 2-6 + 8-12 (same as TS).
//      v6_bridge at rows 4-8 (centered).
var TS9=[
  {id:'h0l',dir:'h',c:0,r:0},
  {id:'h0r',dir:'h',c:8,r:0},
  {id:'h4l',dir:'h',c:0,r:4},
  {id:'h4r',dir:'h',c:8,r:4},
  {id:'h8l',dir:'h',c:0,r:8},
  {id:'h8r',dir:'h',c:8,r:8},
  {id:'h12l',dir:'h',c:0,r:12},
  {id:'h12r',dir:'h',c:8,r:12},
  {id:'h2_mid',dir:'h',c:4,r:2},
  {id:'h6_mid',dir:'h',c:4,r:6},
  {id:'h10_mid',dir:'h',c:4,r:10},
  {id:'v0t',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2t',dir:'v',c:2,r:0},
  {id:'v2b',dir:'v',c:2,r:8},
  {id:'v10t',dir:'v',c:10,r:0},
  {id:'v10b',dir:'v',c:10,r:8},
  {id:'v12t',dir:'v',c:12,r:0},
  {id:'v12b',dir:'v',c:12,r:8},
  {id:'v4t',dir:'v',c:4,r:0},
  {id:'v4b',dir:'v',c:4,r:6},
  {id:'v8t',dir:'v',c:8,r:2},
  {id:'v8b',dir:'v',c:8,r:8},
  {id:'v6_bridge',dir:'v',c:6,r:4}
];

// [v3.17] TT: Denser 13×13 Large template — replaces TS-family.
// 25 equations, 44 cells, 31 crossings. Compared to TS (24/42/30),
// modest density increase. Key structural change: the inner V's
// at cols 4 and 8 span rows 6-10 (instead of stacks rows 0-4 +
// rows 8-12 like outer V's). This bridges the row 5-7 gap that
// caused TS-family to feel "hollow" in the middle. The h_mid
// equations on rows 2/6/10 (cols 4-8) give the center column
// crossings, eliminating empty interior rows.
//
// Audit clean: connectivity PASS, no cell-type collisions, no
// same-direction overlaps. Hard target=30 reachable on 44 cells
// (14 givens) with the 31-crossing structure.
var TT=[
  // Top corner H pair
  {id:'h0l',dir:'h',c:0,r:0},
  {id:'h0r',dir:'h',c:8,r:0},
  // Mid-row H pairs
  {id:'h4l',dir:'h',c:0,r:4},
  {id:'h4r',dir:'h',c:8,r:4},
  {id:'h8l',dir:'h',c:0,r:8},
  {id:'h8r',dir:'h',c:8,r:8},
  // Bottom corner H pair
  {id:'h12l',dir:'h',c:0,r:12},
  {id:'h12r',dir:'h',c:8,r:12},
  // Middle bridge H equations (cols 4-8) on rows 2/6/10
  {id:'h2m',dir:'h',c:4,r:2},
  {id:'h6m',dir:'h',c:4,r:6},
  {id:'h10m',dir:'h',c:4,r:10},
  // Outer V's: cols 0/2/10/12 stacks rows 0-4 + rows 8-12
  {id:'v0t',dir:'v',c:0,r:0},
  {id:'v0b',dir:'v',c:0,r:8},
  {id:'v2t',dir:'v',c:2,r:0},
  {id:'v2b',dir:'v',c:2,r:8},
  {id:'v10t',dir:'v',c:10,r:0},
  {id:'v10b',dir:'v',c:10,r:8},
  {id:'v12t',dir:'v',c:12,r:0},
  {id:'v12b',dir:'v',c:12,r:8},
  // Inner V's: cols 4/8 with BRIDGE (rows 6-10 instead of rows 8-12)
  {id:'v4t',dir:'v',c:4,r:0},     // rows 0-4
  {id:'v4mid',dir:'v',c:4,r:6},   // rows 6-10 — KEY BRIDGE
  {id:'v8t',dir:'v',c:8,r:0},     // rows 0-4
  {id:'v8mid',dir:'v',c:8,r:6},   // rows 6-10 — KEY BRIDGE
  // Center V col 6: rows 2-6 + rows 8-12 (gap row 7)
  {id:'v6t',dir:'v',c:6,r:2},
  {id:'v6b',dir:'v',c:6,r:8}
];

// [v3.02] TK: Vertical staircase 7×9, 9 equations, 10 crossings.
// Five H equations stacked at rows 0/2/4/6/8, alternating left-edge
// (c=0) and slightly-indented (c=2) start columns, forming a Z down
// the page. Four V equations stitch them together at cols 0, 2, 4, 6
// at staggered row offsets so no two V's share a cell. Connectivity,
// cell-type collisions, and same-direction adjacency all audited
// clean. Adds taller-than-wide proportions (7×9) to Medium —
// distinctly different from TB and TE which both render as 9×7 wide
// Z shapes. Bench notes same as TJ: my simulator shows 40% first-
// attempt success but production retries make this invisible.
var TK=[
  {id:'h0',dir:'h',c:0,r:0},
  {id:'h1',dir:'h',c:2,r:2},
  {id:'h2',dir:'h',c:0,r:4},
  {id:'h3',dir:'h',c:2,r:6},
  {id:'h4',dir:'h',c:0,r:8},
  {id:'v0',dir:'v',c:0,r:0},
  {id:'v1',dir:'v',c:2,r:0},
  {id:'v2',dir:'v',c:4,r:4},
  {id:'v3',dir:'v',c:6,r:2}
];

// [v3.03] TL: Wide horizontal compound 13×7, 14 equations, 16 crossings.
// Two TB-like clusters at left (cols 0-4) and right (cols 8-12) bridged
// by h2 (c=4,r=2 spans 4-8, num cells at cols 4/6/8) and v6 (c=6,r=2
// spans rows 2-6, num cells at rows 2/4/6). Without these two bridges
// the layout would split into disconnected halves — bridges are what
// make connectivity pass. Pattern: 7 H + 7 V. The Large pool's first
// wide template — TF and TG are both narrow-tall (9×11 / 9×13), both
// "two TB's stacked vertically," so TL's wide-short shape gives the
// pool a real proportion variation. Audit clean: connected, no cell
// collisions, no same-direction adjacency.
var TL=[
  {id:'h0',dir:'h',c:0,r:0},
  {id:'h1',dir:'h',c:8,r:0},
  {id:'h2',dir:'h',c:4,r:2},  // BRIDGE — middle row 2, spans 4-8
  {id:'h3',dir:'h',c:0,r:4},
  {id:'h4',dir:'h',c:8,r:4},
  {id:'h5',dir:'h',c:2,r:6},
  {id:'h6',dir:'h',c:8,r:6},
  {id:'v0',dir:'v',c:0,r:0},
  {id:'v1',dir:'v',c:4,r:0},
  {id:'v2',dir:'v',c:8,r:0},
  {id:'v3',dir:'v',c:12,r:0},
  {id:'v4',dir:'v',c:2,r:2},
  {id:'v5',dir:'v',c:10,r:2},
  {id:'v6',dir:'v',c:6,r:2}   // BRIDGE — middle col 6, spans rows 2-6
];

// TH: Large — two TB blocks stacked, sharing via bridges. ~17×17
// Upper TB-like: rows 0-6, cols 0-8
// Lower TB-like: rows 10-16, cols 8-16
// Bridge: equations spanning the gap at rows 6-10 and cols 4-12
var TH=[
  // Upper block (TB on cols 0-8, rows 0-6)
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:2},{id:'v4',dir:'v',c:8,r:2},
  // Middle extension (rows 6-10, cols 4-12)
  {id:'h4',dir:'h',c:8,r:6},{id:'h5',dir:'h',c:4,r:8},  // h3 ends at (8,6)=h4.A; h5 bridges
  {id:'v5',dir:'v',c:4,r:6},{id:'v6',dir:'v',c:8,r:6},{id:'v7',dir:'v',c:12,r:6},
  // Lower block (TE-like on cols 8-16, rows 10-16)
  {id:'h6',dir:'h',c:8,r:10},{id:'h7',dir:'h',c:12,r:12},{id:'h8',dir:'h',c:8,r:14},{id:'h9',dir:'h',c:12,r:16},
  {id:'v8',dir:'v',c:8,r:10},{id:'v9',dir:'v',c:12,r:10},{id:'v10',dir:'v',c:16,r:12},
  {id:'v11',dir:'v',c:10,r:10},{id:'v12',dir:'v',c:14,r:12}
];

// TI: Large — staircase version ~17×17
// Three TB-like clusters connected by shared V equations
var TI=[
  // Top cluster (cols 0-8, rows 0-6)
  {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
  {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
  {id:'v3',dir:'v',c:6,r:2},{id:'v4',dir:'v',c:8,r:2},
  // Bridge down-right (rows 6-10, cols 4-12)
  // h3.C=(8,6), v4.C=(8,6): starting point for bridge
  {id:'h4',dir:'h',c:8,r:6},   // A=(8,6)=h3.C=v4.C  B=(10,6)  C=(12,6)
  {id:'v5',dir:'v',c:8,r:6},   // v4 ends r=6; v5 starts r=6 -> adjacent! Use c=10
  // Fix: v5 on c=10
  {id:'v5b',dir:'v',c:10,r:6}, // A=(10,6)=h4.B  C=(10,10)
  {id:'v6',dir:'v',c:12,r:6},  // A=(12,6)=h4.C  C=(12,10)
  {id:'h5',dir:'h',c:8,r:8},   // A=(8,8)  B=(10,8)=v5b.B  C=(12,8)=? no, v6.B=(12,8). h5.C=(12,8) ✓
  // Middle cluster (cols 8-16, rows 8-14)
  {id:'h6',dir:'h',c:12,r:10}, // A=(12,10)=v6.C  connects down
  {id:'v7',dir:'v',c:12,r:10}, // v6 ends r=10; v7 starts r=10 -> adjacent! Use c=16
  {id:'v7b',dir:'v',c:16,r:10},{id:'v8',dir:'v',c:14,r:10},
  {id:'h7',dir:'h',c:12,r:12},{id:'h8',dir:'h',c:12,r:14},
  {id:'v9',dir:'v',c:12,r:12}  // v6/h6 chain to h7/h8
];
// TI is getting complex; use a cleaner version:
// Three offset TB-blocks, each shifted by (8,8) from the previous, sharing corner cells.

// Clean TI: three TB blocks offset by (0,0), (8,4), (0,8) — staircase of TBs
var TI_clean=[
  // Block 1: TB at offset (0,0) rows 0-6 cols 0-8
  {id:'a_h0',dir:'h',c:0,r:0},{id:'a_h1',dir:'h',c:4,r:2},{id:'a_h2',dir:'h',c:0,r:4},{id:'a_h3',dir:'h',c:4,r:6},
  {id:'a_v0',dir:'v',c:0,r:0},{id:'a_v1',dir:'v',c:2,r:0},{id:'a_v2',dir:'v',c:4,r:0},
  {id:'a_v3',dir:'v',c:6,r:2},{id:'a_v4',dir:'v',c:8,r:2},
  // Bridge from block1 to block2: v starting at (8,2) goes to row 6 (v4 ends r=6).
  // Block 2 needs to start at col 8. h_bridge at r=6 starting c=8: A=(8,6)=a_v4.C
  {id:'ab_h',dir:'h',c:8,r:6}, // connects a_v4.C=(8,6) to block 2 start
  // Block 2: TB-like at offset (8,6) rows 6-12 cols 8-16
  {id:'b_h0',dir:'h',c:8,r:8},{id:'b_h1',dir:'h',c:12,r:10},{id:'b_h2',dir:'h',c:8,r:12},{id:'b_h3',dir:'h',c:12,r:14},
  // b_h0.A=(8,8). Need V from (8,6) to (8,8)? ab_h.A=(8,6). v: c=8,r=6 -> (8,6)=ab_h.A AND end of a_v4!
  // a_v4 is c=8,r=2 ends r=6. New V at c=8,r=6: adjacent to a_v4. VIOLATION.
  // Use c=12 for bridge V instead.
  // ab_h.C=(12,6). V at c=12,r=6: A=(12,6)=ab_h.C, connects to b_h0 via (12,8)?
  // b_h0.C=(12,8). V c=12,r=6: (12,6)=pos0, (12,8)=pos2. Cross b_h0.C=(12,8) ✓
  {id:'ab_v',dir:'v',c:12,r:6}, // A=(12,6)=ab_h.C; mid=(12,8)=b_h0.C ✓
  {id:'b_v0',dir:'v',c:8,r:8},{id:'b_v1',dir:'v',c:10,r:8},
  {id:'b_v2',dir:'v',c:12,r:8},{id:'b_v3',dir:'v',c:14,r:10},{id:'b_v4',dir:'v',c:16,r:10}
];

// The large templates are getting complex to hand-verify. Use a proven approach:
// Take TF (9×11, well-tested) and duplicate it side-by-side with a shared column.
// TF ends at col 8. Second TF starts at col 8 (shared). Total: 17 cols × 11 rows.
// Crossings at col 8: TF equations ending at c=8 share with second-TF equations starting at c=8.
// TF equations reaching c=8: h1.C=(8,2), h3.C=(8,6) [from h1:c4+4=8, h3:c4+4=8]
// Second TF (offset by c=8): all c values +8.
// h0_b at (8,0): but TF_a.h0 doesn't reach c=8. Fine — no crossing there.
// h1_b at (12,2): no crossing with TF_a at c=12.
// The shared column c=8 is only in TF_a's h1.C=(8,2) and h3.C=(8,6).
// TF_b h0 starts at c=8: h0_b.A=(8,0). TF_a has no cell at (8,0). Uncrossed. Fine.
// TF_b v2 at c=12,r=0: no conflict.
// This gives a 17×11 grid with 28 equations — large and complex.

function makeTFb(colOffset,idSuffix){
  // TF template shifted right by colOffset with suffixed IDs
  var base=[
    {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
    {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
    {id:'v3',dir:'v',c:6,r:2},{id:'v4',dir:'v',c:8,r:2},
    {id:'h4',dir:'h',c:0,r:8},{id:'h5',dir:'h',c:4,r:10},
    {id:'v5',dir:'v',c:4,r:6},{id:'v6',dir:'v',c:0,r:6},{id:'v7',dir:'v',c:2,r:6}
  ];
  return base.map(function(e){return{id:e.id+idSuffix,dir:e.dir,c:e.c+colOffset,r:e.r};});
}
// Large template: TF (cols 0-8) + TF shifted right by 8 (cols 8-16) + TF shifted right by 4 down by 6
// Actually simplest: just two TF side by side (cols 0-8 and 8-16) = 17 cols × 11 rows
var TH_final=makeTFb(0,'_a').concat(makeTFb(8,'_b'));
// The shared column c=8 has TF_a cells at (8,2),(8,4),(8,6) and TF_b cells at (8,0),(8,2),(8,4),(8,6),(8,8),(8,10).
// Some cells will be shared — the cellMap handles this correctly (num wins over op/eq).
// Crossings at c=8:
//   (8,2): TF_a h1.C (pos4) × TF_b v2.A (pos0) ✓ — both num
//   (8,6): TF_a h3.C (pos4) × TF_b v5.A (pos0) ✓ — both num
//   Wait TF_b v2 is at c=4+8=12, not c=8. Let me check:
//   TF_b = TF offset by 8: v0 at c=0+8=8,r=0. So TF_b.v0 is at c=8,r=0: nums r=0,2,4.
//   (8,0): TF_b.v0.A. TF_a has no eq at (8,0) → uncrossed ✓
//   (8,2): TF_b.v0.B AND TF_a.h1.C=(8,2)[h1:c=4,pos4=c+4=8] ✓ both num
//   (8,4): TF_b.v0.C AND TF_a has (8,4)? TF_a.v4 is c=8,r=2: nums r=2,4,6. (8,4)=TF_a.v4.B ✓
//   (8,6): TF_b.v5.A [TF_b.v5=c=4+8=12... wait v5:c=4,r=6 -> TF_b: c=12,r=6. Not c=8.]
//   TF_b.v0 covers (8,0),(8,2),(8,4) only. v6:c=0+8=8,r=6 -> TF_b.v6 at c=8,r=6!
//   (8,6): TF_b.v6.A [v6:c=0,r=6 -> TF_b: c=8,r=6. nums r=6,8,10] × TF_a.h3.C=(8,6) ✓
//   (8,8): TF_b.v6.B × TF_b.h4.A [h4:c=0+8=8,r=8. pos0=(8,8)] — both from TF_b, same direction: H×V ✓
//   All good! This should work.

// Also stack two TG side by side for variety
var TI_final=makeTFb(0,'_c').concat(makeTFb(8,'_d'));
// Slight variation: offset second block vertically too
function makeTFShifted(colOffset,rowOffset,idSuffix){
  var base=[
    {id:'h0',dir:'h',c:0,r:0},{id:'h1',dir:'h',c:4,r:2},{id:'h2',dir:'h',c:0,r:4},{id:'h3',dir:'h',c:4,r:6},
    {id:'v0',dir:'v',c:0,r:0},{id:'v1',dir:'v',c:2,r:0},{id:'v2',dir:'v',c:4,r:0},
    {id:'v3',dir:'v',c:6,r:2},{id:'v4',dir:'v',c:8,r:2},
    {id:'h4',dir:'h',c:0,r:8},{id:'h5',dir:'h',c:4,r:10},
    {id:'v5',dir:'v',c:4,r:6},{id:'v6',dir:'v',c:0,r:6},{id:'v7',dir:'v',c:2,r:6}
  ];
  return base.map(function(e){return{id:e.id+idSuffix,dir:e.dir,c:e.c+colOffset,r:e.r+rowOffset};});
}
// TI: two TF blocks with vertical offset — staircase layout ~17 cols × 17 rows
// Block A at (0,0), Block B at (8,6): (8,6) = TF_a.h3.C connects to TF_b.v0.A... 
// TF_b.v0 at c=8,r=6: A=(8,6). TF_a.h3.C=(8,6) ✓ — connected!
var TI_stair=makeTFShifted(0,0,'_e').concat(makeTFShifted(8,6,'_f'));

// [v3.00] Repooled by equation count for size-tier consistency.
// Equation counts: TA=8, TC=7, TB=9, TD=9, TE=9, TF=14, TG=14, TJ=8, TK=9, TL=14, TM=8, TN=13, TO=14, TP=15, TQ=15, TQ2=15, TR=19, TS=24, TS3=24, TS5=24, TS9=24, TT=25.
// [v3.01] TC removed from Small (2 disconnected islands).
//         TD removed from Medium (3 disconnected islands incl. orphaned h3).
//         TJ added to Small (new diagonal-step interlock, fully connected).
// [v3.02] TK added to Medium (new vertical staircase, 7×9 footprint).
// [v3.03] TL added to Large (new wide horizontal compound, 13×7 footprint).
// [v3.06] TM added to Small (new vertical-staircase 9×9, 17 cells).
// [v3.07] TN added to Medium (new lattice-with-wing 11×9, 24 cells).
// [v3.09] TO added to Medium (new vertical lattice-with-wing 9×11, 27 cells).
//         TB removed from Medium (was duplicate of TE; both rendered identically).
// [v3.10] TP added to Medium (new square 11×11 frame-with-bridge, 31 cells).
//         TE removed from Medium (was 16-cell legacy, can't hit new targets).
// [v3.11] TQ added to Medium (new narrow-tall 7×13 dense lattice, 26 cells).
//         TK removed from Medium (was 17-cell legacy; pool now fully on new system).
// [v3.12] TQ2 added to Medium (TQ-family variant, inner V's rearranged).
// [v3.13] TR added to Large (new 11×13 frame-with-bridge, 35 cells, first on new system).
// [v3.14] TS added to Large (13×13, 42 cells, denser); TR removed (didn't feel Large).
// [v3.15] TS3, TS5, TS9 added (TS-family variants); TF, TG, TL removed.
// [v3.00] Repooled by equation count for size-tier consistency.
// [...]
// [v3.13] TR added to Large (new 11×13 frame-with-bridge, 35 cells, first on new system).
// [v3.14] TS added to Large (13×13, 42 cells, denser); TR removed (didn't feel Large).
// [v3.15] TS3, TS5, TS9 added (TS-family variants); TF, TG, TL removed.
//         All Large templates now on new system.
// [v3.17] TT added to Large (denser 13×13, 44 cells); TS-family removed (didn't feel Large enough).
// [v3.18] TS-family RESTORED, TT removed. User reported 16/20 Large rolls
//         falling back to Medium templates. Reason: TT's 25 equations are
//         too many for the values generator to satisfy reliably. TS-family
//         (24 eq) generates more reliably even though they don't feel as
//         dense. Real fix for "feels large" is bigger templates that also
//         generate well — v3.19+ work, not a v3.18 fix.
var TMPL_SMALL=[TA,TJ,TM];
var TMPL_MEDIUM=[TN,TO,TP,TQ,TQ2];
var TMPL_LARGE=[TS,TS3,TS5,TS9];

// [v3.18] DEBUG ONLY: template name registry. Maps template-array
// references to short string names so the picker can label which
// template is currently active. Lets the user identify rolls
// without screenshot guesswork. Will be removed before public
// ship — anything keyed off window._currentTplName is debug code.
var _TEMPLATE_NAMES=new Map();
[
  ['TA',TA],['TJ',TJ],['TM',TM],
  ['TN',TN],['TO',TO],['TP',TP],['TQ',TQ],['TQ2',TQ2],
  ['TS',TS],['TS3',TS3],['TS5',TS5],['TS9',TS9],['TT',TT]
].forEach(function(pair){_TEMPLATE_NAMES.set(pair[1],pair[0]);});

// [v3.18 v4] DEBUG: counter system to diagnose pool-distribution issues.
// _dbgBumpPick(name)    — incremented each time _pickTemplate picks.
// _dbgBumpFinal(name)   — incremented each time a build returns successfully
//                          (so we see the FINAL template the player gets,
//                          which may differ from what was first picked if
//                          fallback fired).
// _dbgGetCounts()       — returns {picks: {...}, finals: {...}} from localStorage.
// _dbgResetCounts()     — clears the counters.
// _dbgFmtCounts()       — returns a string like "TN:3 TO:5 TP:18 TQ:0 TQ2:0".
// _dbgShowCounts()      — alert() formatted counts (call from console).
// Will be removed before public ship.
function _dbgBumpPick(name){
  try{
    var raw=localStorage.getItem('_dbgPickCounts')||'{}';
    var obj=JSON.parse(raw);
    obj[name]=(obj[name]||0)+1;
    localStorage.setItem('_dbgPickCounts',JSON.stringify(obj));
  }catch(e){}
  // [v3.29] Live refresh if panel is open.
  if(window._dbgRefreshIfOpen)window._dbgRefreshIfOpen();
}
function _dbgBumpFinal(name){
  try{
    var raw=localStorage.getItem('_dbgFinalCounts')||'{}';
    var obj=JSON.parse(raw);
    obj[name]=(obj[name]||0)+1;
    localStorage.setItem('_dbgFinalCounts',JSON.stringify(obj));
  }catch(e){}
  if(window._dbgRefreshIfOpen)window._dbgRefreshIfOpen();
}
function _dbgGetCounts(){
  try{
    return {
      picks: JSON.parse(localStorage.getItem('_dbgPickCounts')||'{}'),
      finals: JSON.parse(localStorage.getItem('_dbgFinalCounts')||'{}')
    };
  }catch(e){return{picks:{},finals:{}};}
}
function _dbgResetCounts(){
  try{
    localStorage.removeItem('_dbgPickCounts');
    localStorage.removeItem('_dbgFinalCounts');
    localStorage.removeItem('_dbgFailReasons');  // [v3.20]
    localStorage.removeItem('_dbgAvgState');     // [v3.32]
  }catch(e){}
}
function _dbgFmtCounts(){
  var c=_dbgGetCounts();
  var keys=Object.keys(Object.assign({},c.picks,c.finals)).sort();
  var lines=[];

  // [v3.22] Show stats of currently-rendered puzzle at the top.
  if(window.PZ&&window.PZ.tmpl){
    var eqCount=window.PZ.tmpl.length;
    var blankCount=window.PZ.bank?window.PZ.bank.length:0;
    var b3=0,b2=0,b1=0;
    for(var i=0;i<window.PZ.tmpl.length;i++){
      var e=window.PZ.tmpl[i];
      if(e.xl)continue; // count standard eqs only for blanks-per-eq
      var pts=numPts(e),CM=window.PZ.CM;
      var n=0;
      for(var j=0;j<pts.length;j++){
        var k=nk(pts[j]);
        if(CM[k]&&CM[k].isBlank)n++;
      }
      if(n===3)b3++;else if(n===2)b2++;else if(n===1)b1++;
    }
    lines.push('CURRENT PUZZLE');
    lines.push('  equations: '+eqCount);
    lines.push('  blanks: '+blankCount);
    lines.push('  blank distribution: 1-blank='+b1+', 2-blank='+b2+', 3-blank='+b3);
    lines.push('');
  }

  if(keys.length===0){
    lines.push('TEMPLATE COUNTS: (no data yet)');
    return lines.join('\n');
  }
  lines.push('TEMPLATE COUNTS');
  keys.forEach(function(k){
    lines.push('  '+k+': pick='+(c.picks[k]||0)+', final='+(c.finals[k]||0));
  });
  // Append failure-reason breakdown.
  try{
    var fr=JSON.parse(localStorage.getItem('_dbgFailReasons')||'{}');
    var frKeys=Object.keys(fr).sort();
    if(frKeys.length){
      lines.push('');
      lines.push('FAIL REASONS:');
      frKeys.forEach(function(k){lines.push('  '+k+': '+fr[k]);});
    }
  }catch(e){}
  return lines.join('\n');
}
window._dbgFmtCounts=_dbgFmtCounts;

// [v3.23] Render functions. Populate the panel sections.
// [v3.29] Helper: wrap a value (number or short string) in a subtle
// gray pill so it stands out from the surrounding label text.
function _dbgPill(v){
  return '<span style="display:inline-block;background:rgba(180,180,180,0.60);color:rgba(220,255,230,1);padding:0 3px;border-radius:2px;font-weight:700;">'+v+'</span>';
}

// [v3.30] Helper: build a CSS grid table from an array of row arrays.
// Each row is [label, value] or [label, value1, value2, ...]. Columns
// auto-size to their content (max-content). Labels left-aligned with
// their column-end, values left-aligned in their pill column. The
// result is that all values across rows line up vertically regardless
// of label length.
function _dbgGrid(rows,cols){
  var html='<div style="display:grid;grid-template-columns:repeat('+cols+',max-content);gap:1px 4px;align-items:center;">';
  for(var i=0;i<rows.length;i++){
    var r=rows[i];
    for(var j=0;j<r.length;j++){
      html+='<div>'+r[j]+'</div>';
    }
  }
  html+='</div>';
  return html;
}

// [v3.32] Compute the per-puzzle metrics from window.PZ. Returns null
// if no puzzle is loaded. Used by both the CURRENT PUZZLE render and
// the per-roll recorder that feeds running averages.
function _dbgComputeMetrics(){
  if(!window.PZ||!window.PZ.tmpl)return null;
  var eqCount=window.PZ.tmpl.length;
  var blankCount=window.PZ.bank?window.PZ.bank.length:0;
  var b3=0,b2=0,b1=0;
  var ops={'+':0,'-':0,'x':0,'/':0};
  var trivialCount=0;
  for(var i=0;i<window.PZ.tmpl.length;i++){
    var e=window.PZ.tmpl[i];
    if(e.xl)continue;
    var pts=numPts(e),CM=window.PZ.CM;
    var ka=nk(pts[0]),kb=nk(pts[1]),kc=nk(pts[2]);
    var n=0;
    for(var j=0;j<pts.length;j++){
      var k=nk(pts[j]);
      if(CM[k]&&CM[k].isBlank)n++;
    }
    if(n===3)b3++;else if(n===2)b2++;else if(n===1)b1++;
    var op=window.PZ.OPS&&window.PZ.OPS[e.id];
    if(op&&ops[op]!=null)ops[op]++;
    var va=CM[ka]&&CM[ka].answer,vb=CM[kb]&&CM[kb].answer,vc=CM[kc]&&CM[kc].answer;
    if(va!=null&&vb!=null&&vc!=null){
      var triv=false;
      if(va===1&&vb===1)triv=true;
      else if((op==='x'||op==='/')&&(va===1||vb===1))triv=true;
      else if(op==='/'&&va===vb)triv=true;
      if(triv)trivialCount++;
    }
  }
  return {eqCount:eqCount,blankCount:blankCount,b1:b1,b2:b2,b3:b3,ops:ops,trivialCount:trivialCount};
}

// [v3.41] Richer metrics for per-solve recording. Adds dimensions
// that aren't strictly needed for the live HUD but are valuable
// for after-the-fact analysis: grid dimensions, XL eq counts, max
// answer value, bank duplicate stats. These get folded into the
// _dbgTimes entries on win.
//
// The fields are deliberately short keys (mAns, uVl, dup) to keep
// the localStorage payload compact across many recorded solves.
function _dbgComputeFullMetrics(){
  var base=_dbgComputeMetrics();
  if(!base||!window.PZ)return null;
  var pz=window.PZ;
  var extra={
    cols: pz.cols||0,
    rows: pz.rows||0,
    cells: (pz.cols||0)*(pz.rows||0),
    xlEq: 0,
    mainEq: 0,
    maxAns: 0,
    minAns: null,
    sumAns: 0,
    nAns: 0,
    uniqVals: 0,   // distinct values in the bank
    bankDup: 0     // total duplicate instances (bank.length - uniqVals)
  };
  // XL vs main equation tally.
  for(var i=0;i<pz.tmpl.length;i++){
    if(pz.tmpl[i].xl)extra.xlEq++;
    else extra.mainEq++;
  }
  // Max/min/avg of answer values across all num cells.
  if(pz.CM){
    for(var k in pz.CM){
      if(!Object.prototype.hasOwnProperty.call(pz.CM,k))continue;
      var c=pz.CM[k];
      if(c&&typeof c.answer==='number'){
        if(c.answer>extra.maxAns)extra.maxAns=c.answer;
        if(extra.minAns===null||c.answer<extra.minAns)extra.minAns=c.answer;
        extra.sumAns+=c.answer;
        extra.nAns++;
      }
    }
  }
  // Bank value distribution.
  if(pz.bank&&pz.bank.length){
    var seen={};
    for(var bi=0;bi<pz.bank.length;bi++){
      var v=pz.bank[bi].value;
      if(!seen[v])seen[v]=0;
      seen[v]++;
    }
    var uniq=0;
    for(var sv in seen){
      if(Object.prototype.hasOwnProperty.call(seen,sv))uniq++;
    }
    extra.uniqVals=uniq;
    extra.bankDup=pz.bank.length-uniq;
  }
  // Average answer (rounded to 1 decimal for compactness).
  extra.avgAns=extra.nAns?Math.round((extra.sumAns/extra.nAns)*10)/10:0;
  delete extra.sumAns;
  delete extra.nAns;
  return {base:base, extra:extra};
}

// [v3.32] Running-averages storage. Each call to _dbgRecordPuzzle
// folds a fresh puzzle into the cumulative sums and trivial histogram.
// Stored in localStorage so they survive reloads but reset with the
// debug counts. Schema:
//   {n: count of puzzles, sum: {eqCount, blankCount, b1, b2, b3,
//    ops:{+,-,x,/}, trivial}, hist: {0:n, 1:n, 2:n, ...}}
function _dbgGetAvgState(){
  try{
    var raw=localStorage.getItem('_dbgAvgState');
    if(raw)return JSON.parse(raw);
  }catch(e){}
  return {n:0,sum:{eqCount:0,blankCount:0,b1:0,b2:0,b3:0,
    ops:{'+':0,'-':0,'x':0,'/':0},trivial:0},hist:{}};
}
function _dbgRecordPuzzle(){
  var m=_dbgComputeMetrics();
  if(!m)return;
  var s=_dbgGetAvgState();
  s.n++;
  s.sum.eqCount+=m.eqCount;
  s.sum.blankCount+=m.blankCount;
  s.sum.b1+=m.b1;s.sum.b2+=m.b2;s.sum.b3+=m.b3;
  s.sum.ops['+']+=m.ops['+'];s.sum.ops['-']+=m.ops['-'];
  s.sum.ops['x']+=m.ops['x'];s.sum.ops['/']+=m.ops['/'];
  s.sum.trivial+=m.trivialCount;
  s.hist[m.trivialCount]=(s.hist[m.trivialCount]||0)+1;
  try{localStorage.setItem('_dbgAvgState',JSON.stringify(s));}catch(e){}
  if(window._dbgRefreshIfOpen)window._dbgRefreshIfOpen();
}
window._dbgRecordPuzzle=_dbgRecordPuzzle;

function _dbgRenderPuzzleStats(){
  var el=document.getElementById('_dbgPuzzleStats');
  if(!el)return;
  var m=_dbgComputeMetrics();
  if(!m){el.textContent='(no puzzle loaded)';return;}
  var rows=[
    ['equations:',_dbgPill(m.eqCount)],
    ['blanks:',_dbgPill(m.blankCount)],
    ['1-blank eqs:',_dbgPill(m.b1)],
    ['2-blank eqs:',_dbgPill(m.b2)],
    ['3-blank eqs:',_dbgPill(m.b3)],
    ['+ ops:',_dbgPill(m.ops['+'])],
    ['- ops:',_dbgPill(m.ops['-'])],
    ['× ops:',_dbgPill(m.ops['x'])],
    ['÷ ops:',_dbgPill(m.ops['/'])],
    ['trivial eqs:',_dbgPill(m.trivialCount)]
  ];
  el.innerHTML=_dbgGrid(rows,2);
}

function _dbgRenderAverages(){
  var el=document.getElementById('_dbgAvgBody');
  if(!el)return;
  var s=_dbgGetAvgState();
  if(s.n===0){el.textContent='(no puzzles recorded)';return;}
  function avg(v){return(v/s.n).toFixed(2);}
  var rows=[
    ['puzzles recorded:',_dbgPill(s.n)],
    ['avg 1-blank eqs:',_dbgPill(avg(s.sum.b1))],
    ['avg 2-blank eqs:',_dbgPill(avg(s.sum.b2))],
    ['avg 3-blank eqs:',_dbgPill(avg(s.sum.b3))],
    ['avg + ops:',_dbgPill(avg(s.sum.ops['+']))],
    ['avg - ops:',_dbgPill(avg(s.sum.ops['-']))],
    ['avg × ops:',_dbgPill(avg(s.sum.ops['x']))],
    ['avg ÷ ops:',_dbgPill(avg(s.sum.ops['/']))],
    ['avg trivials:',_dbgPill(avg(s.sum.trivial))]
  ];
  // Trivial-count histogram. Sort numerically.
  var histKeys=Object.keys(s.hist).map(Number).sort(function(a,b){return a-b;});
  if(histKeys.length){
    rows.push(['',''])
    rows.push(['TRIVIALS HIST:','(N puzzles)']);
    histKeys.forEach(function(k){
      rows.push([k+' trivials:',_dbgPill(s.hist[k])]);
    });
  }
  el.innerHTML=_dbgGrid(rows,2);
}
function _dbgRenderTplCounts(){
  var el=document.getElementById('_dbgTplCountsBody');
  if(!el)return;
  var c=_dbgGetCounts();
  var keys=Object.keys(Object.assign({},c.picks,c.finals)).sort();
  if(keys.length===0){el.textContent='(no data yet)';return;}
  // [v3.30] 4-column grid: name, "pick=", pill, "final=", pill.
  // All TS-family rows align since their names are equal length, and
  // even mixed-length names (TJ vs TS3) line up at each column.
  var rows=keys.map(function(k){
    return [k+':','pick='+_dbgPill(c.picks[k]||0),'final='+_dbgPill(c.finals[k]||0)];
  });
  el.innerHTML=_dbgGrid(rows,3);
}
function _dbgRenderFailReasons(){
  var el=document.getElementById('_dbgFailBody');
  if(!el)return;
  try{
    var fr=JSON.parse(localStorage.getItem('_dbgFailReasons')||'{}');
    var keys=Object.keys(fr).sort();
    if(!keys.length){el.textContent='(no fails recorded)';return;}
    var rows=keys.map(function(k){return [k+':',_dbgPill(fr[k])];});
    el.innerHTML=_dbgGrid(rows,2);
  }catch(e){el.textContent='(error)';}
}
function _dbgRenderAll(){
  _dbgRenderPuzzleStats();
  _dbgRenderAverages();
  _dbgRenderTplCounts();
  _dbgRenderFailReasons();
}
window._dbgRenderAll=_dbgRenderAll;

// [v3.29] Live update: when a counter is bumped, refresh the panel
// if it's currently open. Throttled via requestAnimationFrame so
// rapid bumps (like 1000+ mismatch retries inside a single
// buildPuzzle attempt) coalesce into a single DOM update per frame.
function _dbgRefreshIfOpen(){
  var pnl=document.getElementById('_dbgPanel');
  if(!pnl||pnl.style.display!=='flex')return;
  if(_dbgRefreshIfOpen._scheduled)return;
  _dbgRefreshIfOpen._scheduled=true;
  (window.requestAnimationFrame||function(cb){setTimeout(cb,16);})(function(){
    _dbgRefreshIfOpen._scheduled=false;
    var pnl2=document.getElementById('_dbgPanel');
    if(pnl2&&pnl2.style.display==='flex')_dbgRenderAll();
  });
}
window._dbgRefreshIfOpen=_dbgRefreshIfOpen;

// [v3.23] Panel toggle. Pressing COUNTS toggles the panel; if the panel
// was visible, it closes, otherwise it opens. Auto-refreshes content
// when opening. Clicking outside the panel does NOT close it (avoids
// accidental dismiss while reading) — only the X button or COUNTS toggle.
window._dbgTogglePanel=function(){
  var panel=document.getElementById('_dbgPanel');
  if(!panel)return;
  // [v3.27] Panel is a flex column, so we toggle between 'flex' and 'none'.
  if(panel.style.display==='flex'){
    // [v3.68] If pinch-zoomed in, animate scale back to 1 before
    // hiding so the close feels like a smooth retraction rather than
    // a hard cut. Hides on the next frame after the transition ends.
    var didReset=false;
    try{if(panel._dbgZoomReset)didReset=panel._dbgZoomReset(true);}catch(e){}
    if(didReset){
      try{if(window._modalCloseChirp)window._modalCloseChirp();}catch(e){}
      setTimeout(function(){panel.style.display='none';},240);
    } else {
      panel.style.display='none';
      try{if(window._modalCloseChirp)window._modalCloseChirp();}catch(e){}
    }
  } else {
    _dbgRenderAll();
    panel.style.display='flex';
    try{if(window._modalOpenChirp)window._modalOpenChirp();}catch(e){}
  }
};
// Legacy entry points kept for any external callers.
window._dbgShowCounts=window._dbgTogglePanel;
window._dbgReset=function(){_dbgResetCounts();};

// [v3.35] TIMES panel — separate from COUNTS. Tracks solve times
// per (size, diff) combo. Mirrors COUNTS panel behaviors: drag,
// opacity cycle, persistent state, close, reset.

// Storage schema: each entry is {ms, mk} where mk is mistake count.
// Old format (just an array of ms numbers) is migrated transparently
// on read.
function _dbgGetTimes(){
  try{
    var raw=localStorage.getItem('_dbgTimes');
    if(raw){
      var p=JSON.parse(raw);
      if(p&&typeof p==='object')return p;
    }
  }catch(e){}
  return {small:{easy:[],medium:[],hard:[]},
          medium:{easy:[],medium:[],hard:[]},
          large:{easy:[],medium:[],hard:[]},
          xl2:{easy:[],medium:[],hard:[]}};
}
// Normalize an entry: legacy was a bare ms number. New is {ms, mk}.
function _dbgEntryMs(e){return (e&&typeof e==='object')?e.ms:e;}
function _dbgEntryMk(e){return (e&&typeof e==='object')?(typeof e.mk==='number'?e.mk:null):null;}

function _dbgRecordTime(size,diff,ms,mistakes){
  if(!size||!diff||typeof ms!=='number'||ms<=0)return;
  // Normalize: 'xl' rolls treated as 'xl2' since pool only uses xl2.
  if(size==='xl')size='xl2';
  if(['small','medium','large','xl2'].indexOf(size)<0)return;
  if(['easy','medium','hard'].indexOf(diff)<0)return;
  var t=_dbgGetTimes();
  if(!t[size])t[size]={easy:[],medium:[],hard:[]};
  if(!t[size][diff])t[size][diff]=[];
  var entry={ms:ms};
  if(typeof mistakes==='number')entry.mk=mistakes;
  // [v3.37] Capture full puzzle metrics for timer-formula derivation.
  // [v3.41] Expanded: now also captures grid dimensions, XL eq counts,
  // bank value distribution, max/avg answer values, daily flag, moves,
  // and timestamps. Short keys keep storage compact across many
  // recorded solves.
  try{
    var fm=(typeof _dbgComputeFullMetrics==='function')?_dbgComputeFullMetrics():null;
    if(fm&&fm.base){
      var m=fm.base, x=fm.extra;
      // Identity & template
      entry.tpl=window._currentTplName||null;
      // Core puzzle structure
      entry.eq=m.eqCount;
      entry.bk=m.blankCount;
      // Total num cells across all non-XL eqs = 3*eqCount. Givens =
      // num cells that are NOT blanks. (XL eqs are excluded from
      // metrics for the same reason _dbgComputeMetrics skips them —
      // they're 4-cell unevaluated equations whose cells already get
      // counted via crossing main equations.)
      entry.gv=(m.eqCount*3)-m.blankCount;
      entry.b1=m.b1; entry.b2=m.b2; entry.b3=m.b3;
      entry.opp=m.ops['+']; entry.opm=m.ops['-'];
      entry.opx=m.ops['x']; entry.opd=m.ops['/'];
      entry.tr=m.trivialCount;
      // [v3.41] Grid dimensions and XL distribution.
      entry.col=x.cols;
      entry.row=x.rows;
      entry.cells=x.cells;
      entry.xlEq=x.xlEq;
      entry.mainEq=x.mainEq;
      // [v3.41] Answer-value distribution. Larger numbers in the
      // grid correlate with perceived difficulty (more digits to
      // hold in working memory).
      entry.maxA=x.maxAns;
      entry.minA=x.minAns;
      entry.avgA=x.avgAns;
      // [v3.41] Bank composition. uniqVals = how many distinct
      // values; bankDup = duplicate-instance count. Higher dup
      // count = easier scanning (e.g., "I see three 2s, lots of
      // options to try"). Lower uniqVals on larger banks =
      // pattern-recognition advantage.
      entry.uVl=x.uniqVals;
      entry.dup=x.bankDup;
    }
  }catch(e){}
  // [v3.41] Player & session metadata.
  try{
    if(window._mc113){
      // Total moves at win time. Useful for moves-per-blank and
      // ms-per-move efficiency analysis.
      if(typeof window._mc113.getMoves==='function'){
        entry.mv=window._mc113.getMoves();
      }
      // Daily flag — daily puzzles are seeded so cross-player
      // comparisons would be possible later.
      if(typeof window._mc113.isDaily==='function'){
        entry.dly=window._mc113.isDaily()?1:0;
      }
      if(typeof window._mc113.dailyDateStr==='function'){
        var dd=window._mc113.dailyDateStr();
        if(dd)entry.ddate=dd;
      }
    }
  }catch(e){}
  // [v3.41] Timestamp at completion. Lets you see real-world time-
  // of-day patterns (am I faster in the morning?), session pacing
  // (puzzles back-to-back vs spaced out), and trends over weeks.
  entry.t=Date.now();
  t[size][diff].push(entry);
  try{localStorage.setItem('_dbgTimes',JSON.stringify(t));}catch(e){}
  _dbgRenderTimesIfOpen();
}
window._dbgRecordTime=_dbgRecordTime;
function _dbgClearTimes(){try{localStorage.removeItem('_dbgTimes');}catch(e){}}

// Format ms as M:SS or just S.S for under 1 minute (compact for tiny font).
function _dbgFmtMs(ms){
  var s=Math.floor(ms/1000);
  if(s<60)return s+'s';
  var m=Math.floor(s/60), r=s%60;
  return m+':'+(r<10?'0':'')+r;
}

// Track which size tab is active. Persisted so it doesn't reset.
function _dbgGetActiveTimesSize(){
  try{
    var v=localStorage.getItem('_dbgTimesActiveSize');
    if(v&&['small','medium','large','xl2','analysis'].indexOf(v)>=0)return v;
  }catch(e){}
  return 'medium';
}
function _dbgSetActiveTimesSize(s){
  try{localStorage.setItem('_dbgTimesActiveSize',s);}catch(e){}
  _dbgRenderTimes();
}

function _dbgRenderTimes(){
  var pnl=document.getElementById('_dbgTimesPanel');
  if(!pnl)return;
  var active=_dbgGetActiveTimesSize();
  // Update tab styling.
  var tabs=pnl.querySelectorAll('._dbgTimesTab');
  for(var i=0;i<tabs.length;i++){
    var t=tabs[i];
    if(t.getAttribute('data-size')===active){
      t.style.background='rgba(80,255,140,0.20)';
      t.style.color='rgba(160,255,200,1)';
      t.style.fontWeight='700';
    } else {
      t.style.background='transparent';
      t.style.color='rgba(140,255,180,0.65)';
      t.style.fontWeight='400';
    }
  }
  // [v3.37] Switch between size-view (3 columns) and analysis pane.
  var cols=pnl.querySelectorAll('._dbgTimesCol');
  var analysisPane=document.getElementById('_dbgAnalysisPane');
  if(active==='analysis'){
    for(var ci=0;ci<cols.length;ci++)cols[ci].style.display='none';
    if(analysisPane){analysisPane.style.display='flex';_dbgRenderAnalysis(analysisPane);}
    return;
  } else {
    for(var ci2=0;ci2<cols.length;ci2++)cols[ci2].style.display='flex';
    if(analysisPane)analysisPane.style.display='none';
  }
  // Render each diff column.
  var data=_dbgGetTimes();
  var sizeData=data[active]||{easy:[],medium:[],hard:[]};
  var lists=pnl.querySelectorAll('._dbgTimesList');
  for(var j=0;j<lists.length;j++){
    var list=lists[j];
    var diff=list.getAttribute('data-diff');
    var arr=sizeData[diff]||[];
    if(arr.length===0){
      list.innerHTML='<div style="opacity:0.45;padding-top:4px;">(none)</div>';
      continue;
    }
    // [v3.36] Best (min ms) and avg ms; also avg mistakes across
    // entries that have a recorded mistake count (legacy entries
    // without a mk are excluded from the avg-mistakes calc).
    var bestMs=_dbgEntryMs(arr[0]),sumMs=0;
    var sumMk=0,nMk=0;
    for(var k=0;k<arr.length;k++){
      var ems=_dbgEntryMs(arr[k]);
      if(ems<bestMs)bestMs=ems;
      sumMs+=ems;
      var emk=_dbgEntryMk(arr[k]);
      if(typeof emk==='number'){sumMk+=emk;nMk++;}
    }
    var avgMs=sumMs/arr.length;
    var avgMkStr=(nMk>0)?(sumMk/nMk).toFixed(1):'—';
    // Header: count, best, avg, avg mistakes.
    var html='<div style="margin-bottom:2px;font-weight:700;color:rgba(160,255,200,1);">'+_dbgPill(arr.length)+'</div>';
    html+='<div style="opacity:0.75;margin-bottom:1px;">best</div>';
    html+='<div style="margin-bottom:2px;">'+_dbgPill(_dbgFmtMs(bestMs))+'</div>';
    html+='<div style="opacity:0.75;margin-bottom:1px;">avg</div>';
    html+='<div style="margin-bottom:2px;">'+_dbgPill(_dbgFmtMs(avgMs))+'</div>';
    html+='<div style="opacity:0.75;margin-bottom:1px;">avg ✕</div>';
    html+='<div style="margin-bottom:4px;">'+_dbgPill(avgMkStr)+'</div>';
    html+='<div style="border-top:1px solid rgba(80,255,140,0.20);padding-top:3px;">';
    // [v3.37] List newest first. Each entry is two lines:
    //   line 1: "TS  1:23 ✕2 ★"  — template, time, mistakes, best
    //   line 2: "21 bk · 5/9/0 b · 8+8-4×4÷"  — quick metrics
    // The metrics line is muted so the template/time stays the focus.
    for(var n=arr.length-1;n>=0;n--){
      var ne=arr[n];
      var nms=_dbgEntryMs(ne);
      var nmk=_dbgEntryMk(ne);
      var isB=(nms===bestMs);
      var tpl=(ne&&typeof ne==='object'&&ne.tpl)?ne.tpl:'';
      var line1=(tpl?tpl+' ':'')+_dbgFmtMs(nms);
      if(typeof nmk==='number'){
        line1 += (nmk===0)?' ✓':' ✕'+nmk;
      }
      if(isB)line1+=' ★';
      html+='<div style="opacity:'+(isB?'1':'0.85')+';color:'+(isB?'rgba(180,255,200,1)':'rgba(140,255,180,1)')+';margin-top:'+(n===arr.length-1?'0':'2px')+';">'+line1+'</div>';
      // Compact metrics line if we have them.
      if(ne&&typeof ne==='object'&&typeof ne.eq==='number'){
        var bks=(ne.b1||0)+'/'+(ne.b2||0)+'/'+(ne.b3||0);
        var ops=(ne.opp||0)+'+ '+(ne.opm||0)+'- '+(ne.opx||0)+'× '+(ne.opd||0)+'÷';
        var trv=(typeof ne.tr==='number')?(' · '+ne.tr+'tr'):'';
        html+='<div style="opacity:0.55;font-size:90%;">'+ne.bk+'bk '+bks+'b '+ops+trv+'</div>';
      }
    }
    html+='</div>';
    list.innerHTML=html;
  }
}
window._dbgRenderTimes=_dbgRenderTimes;

// [v3.37] ANALYSIS pane.
// Aggregates all recorded solves with full metrics (entries from
// v3.37+ only — legacy entries with just ms/mk are excluded since
// they lack the per-puzzle features we need for regression).
//
// Three sections rendered in order:
//   1. (size, diff) summary table — counts, avg time, avg mistakes
//   2. Per-template stats — count and avg time per template
//   3. Coefficients — simple per-feature avg "ms per unit" so we
//      can read off rough timer-formula coefficients
//
// The regression is intentionally lo-fi: avg(time) per avg(feature)
// across all entries. With more samples we can upgrade to actual
// least-squares, but for a first-pass calibration the per-feature
// scaling is the most useful number ("each blank tile costs ~3.5s")
// and easy to read off.
function _dbgRenderAnalysis(el){
  if(!el)return;
  var data=_dbgGetTimes();
  // Flatten all entries with full metrics.
  var all=[];
  ['small','medium','large','xl2'].forEach(function(sz){
    if(!data[sz])return;
    ['easy','medium','hard'].forEach(function(df){
      var arr=data[sz][df]||[];
      for(var i=0;i<arr.length;i++){
        var e=arr[i];
        if(e&&typeof e==='object'&&typeof e.eq==='number'){
          all.push({size:sz,diff:df,e:e});
        }
      }
    });
  });
  if(all.length===0){
    el.innerHTML='<div style="opacity:0.55;padding:6px 0;text-align:center;">No detailed solves recorded yet.<br>Solve some puzzles in v3.37+ to populate.</div>';
    return;
  }

  function fmtMs(ms){
    var s=Math.round(ms/1000);
    if(s<60)return s+'s';
    var m=Math.floor(s/60),r=s%60;
    return m+':'+(r<10?'0':'')+r;
  }
  function avg(arr,fn){
    if(!arr.length)return 0;
    var s=0;for(var i=0;i<arr.length;i++)s+=fn(arr[i]);
    return s/arr.length;
  }

  var html='';

  // ── Section 1: (size, diff) summary ──────────────────────────
  html+='<div style="font-weight:700;font-size:6px;letter-spacing:0.7px;color:rgba(160,255,200,1);margin-bottom:3px;">BY (SIZE, DIFF)</div>';
  html+='<div style="display:grid;grid-template-columns:max-content max-content max-content max-content max-content;gap:1px 6px;align-items:center;margin-bottom:6px;">';
  html+='<div style="opacity:0.6;">size</div><div style="opacity:0.6;">diff</div><div style="opacity:0.6;">n</div><div style="opacity:0.6;">avg t</div><div style="opacity:0.6;">avg ✕</div>';
  ['small','medium','large','xl2'].forEach(function(sz){
    ['easy','medium','hard'].forEach(function(df){
      var bucket=all.filter(function(x){return x.size===sz&&x.diff===df;});
      if(!bucket.length)return;
      var aMs=avg(bucket,function(x){return x.e.ms;});
      var mks=bucket.filter(function(x){return typeof x.e.mk==='number';});
      var aMk=mks.length?avg(mks,function(x){return x.e.mk;}).toFixed(1):'—';
      html+='<div>'+(sz==='xl2'?'jumbo':sz)+'</div><div>'+df+'</div>'
         +'<div>'+_dbgPill(bucket.length)+'</div>'
         +'<div>'+_dbgPill(fmtMs(aMs))+'</div>'
         +'<div>'+_dbgPill(aMk)+'</div>';
    });
  });
  html+='</div>';

  // ── Section 2: per-template stats ───────────────────────────
  var tplGroups={};
  for(var i=0;i<all.length;i++){
    var x=all[i],tpl=x.e.tpl||'?';
    if(!tplGroups[tpl])tplGroups[tpl]=[];
    tplGroups[tpl].push(x);
  }
  var tplKeys=Object.keys(tplGroups).sort();
  if(tplKeys.length){
    html+='<div style="font-weight:700;font-size:6px;letter-spacing:0.7px;color:rgba(160,255,200,1);margin-bottom:3px;">BY TEMPLATE</div>';
    html+='<div style="display:grid;grid-template-columns:max-content max-content max-content max-content;gap:1px 6px;align-items:center;margin-bottom:6px;">';
    html+='<div style="opacity:0.6;">tpl</div><div style="opacity:0.6;">n</div><div style="opacity:0.6;">avg t</div><div style="opacity:0.6;">avg ✕</div>';
    tplKeys.forEach(function(tpl){
      var bucket=tplGroups[tpl];
      var aMs=avg(bucket,function(x){return x.e.ms;});
      var mks=bucket.filter(function(x){return typeof x.e.mk==='number';});
      var aMk=mks.length?avg(mks,function(x){return x.e.mk;}).toFixed(1):'—';
      html+='<div>'+tpl+'</div><div>'+_dbgPill(bucket.length)+'</div>'
         +'<div>'+_dbgPill(fmtMs(aMs))+'</div>'
         +'<div>'+_dbgPill(aMk)+'</div>';
    });
    html+='</div>';
  }

  // ── Section 3: per-feature coefficients ─────────────────────
  // For each feature, divide avg(time) by avg(feature) to get a
  // rough "ms per unit" scaling. This isn't a real regression but
  // it's a useful first pass — if avg solve takes 60s with 21
  // blanks, that's ~2.85s per blank.
  var aTime=avg(all,function(x){return x.e.ms;});
  var feats=[
    ['blank',function(x){return x.e.bk;}],
    ['given',function(x){return x.e.gv;}],
    ['eq',   function(x){return x.e.eq;}],
    ['1-blank eq',function(x){return x.e.b1;}],
    ['2-blank eq',function(x){return x.e.b2;}],
    ['3-blank eq',function(x){return x.e.b3;}],
    ['+ op', function(x){return x.e.opp;}],
    ['- op', function(x){return x.e.opm;}],
    ['× op', function(x){return x.e.opx;}],
    ['÷ op', function(x){return x.e.opd;}],
    ['trivial',function(x){return x.e.tr;}]
  ];
  html+='<div style="font-weight:700;font-size:6px;letter-spacing:0.7px;color:rgba(160,255,200,1);margin-bottom:3px;">SCALING (ms/unit, all sizes)</div>';
  html+='<div style="opacity:0.55;font-size:90%;margin-bottom:2px;">avg t = '+fmtMs(aTime)+' across '+all.length+' solves</div>';
  html+='<div style="display:grid;grid-template-columns:max-content max-content max-content;gap:1px 6px;align-items:center;margin-bottom:6px;">';
  html+='<div style="opacity:0.6;">feat</div><div style="opacity:0.6;">avg #</div><div style="opacity:0.6;">s/unit</div>';
  feats.forEach(function(f){
    var aF=avg(all,f[1]);
    var per=aF>0?(aTime/1000)/aF:0;
    html+='<div>'+f[0]+'</div>'
       +'<div>'+_dbgPill(aF.toFixed(1))+'</div>'
       +'<div>'+_dbgPill(per.toFixed(1)+'s')+'</div>';
  });
  html+='</div>';

  el.innerHTML=html;
}

function _dbgRenderTimesIfOpen(){
  var p=document.getElementById('_dbgTimesPanel');
  if(p&&p.style.display==='flex')_dbgRenderTimes();
}

window._dbgToggleTimesPanel=function(){
  var panel=document.getElementById('_dbgTimesPanel');
  if(!panel)return;
  if(panel.style.display==='flex'){
    // [v3.68] Smooth zoom-back on close, same as COUNTS panel.
    var didReset=false;
    try{if(panel._dbgZoomReset)didReset=panel._dbgZoomReset(true);}catch(e){}
    if(didReset){
      try{if(window._modalCloseChirp)window._modalCloseChirp();}catch(e){}
      setTimeout(function(){panel.style.display='none';},240);
    } else {
      panel.style.display='none';
      try{if(window._modalCloseChirp)window._modalCloseChirp();}catch(e){}
    }
  } else {
    _dbgRenderTimes();
    panel.style.display='flex';
    try{if(window._modalOpenChirp)window._modalOpenChirp();}catch(e){}
  }
};


// [v3.20] Track failure reasons inside buildPuzzle so we can see which
// step in the build pipeline is failing. Keys:
//   'null_val'     — genNums left some num cell without a value
//   'mismatch'     — values exist but don't satisfy the equation
//   'xl_null'      — same as null_val for XL templates
//   'xl_mismatch'  — same as mismatch for XL templates
//   'divFail'      — division-count below minDiv
//   'tileFail'     — tile-distribution exceeded TILE_VALUE_CAP
//   'cascadeOut'   — exhausted all retries, falling through cascade
function _dbgBumpFail(reason){
  if(!reason)return;
  try{
    var raw=localStorage.getItem('_dbgFailReasons')||'{}';
    var obj=JSON.parse(raw);
    obj[reason]=(obj[reason]||0)+1;
    localStorage.setItem('_dbgFailReasons',JSON.stringify(obj));
  }catch(e){}
  // [v3.29] Live refresh if panel is open.
  if(window._dbgRefreshIfOpen)window._dbgRefreshIfOpen();
}

// [v3.23] COUNTS button: simple toggle. Panel has its own RESET button
// and X button. Long-press logic removed. Section headers in the panel
// toggle their own collapse state.
// [v4.60] The toolbar TIMES + COUNTS buttons are gone; replaced by a
// single DEV button that opens the dev-tools panel (which has its own
// TIMES / COUNTS launcher row). The existing toggle functions
// (_dbgTogglePanel, _dbgToggleTimesPanel) still drive the actual
// debug overlay open/close — the dev panel just calls them. Inner-
// panel close buttons (_dbgPanelClose, _dbgTimesPanelClose) still
// need their handlers since they live inside the debug overlays
// themselves, not the toolbar.
(function(){
  function hook(){
    // [v4.60] New DEV button — opens the dev-tools panel built by
    // the OPTIONS IIFE (window._openDevPanel set up there).
    var devBtn=document.getElementById('_dbgDevBtn');
    if(devBtn)devBtn.addEventListener('click',function(){
      if(window._openDevPanel) window._openDevPanel();
    });

    // Legacy hooks — guard each since the toolbar buttons no longer
    // exist as of v4.60. The IDs still get queried in case someone
    // injects them (or for the inner-panel close buttons which DO
    // still exist inside the debug overlays).
    var btn=document.getElementById('_dbgCountsBtn');
    if(btn)btn.addEventListener('click',window._dbgTogglePanel);

    var closeBtn=document.getElementById('_dbgPanelClose');
    if(closeBtn)closeBtn.addEventListener('click',window._dbgTogglePanel);

    // [v3.35] TIMES button — opens/closes the second panel.
    var timesBtn=document.getElementById('_dbgTimesBtn');
    if(timesBtn)timesBtn.addEventListener('click',window._dbgToggleTimesPanel);
    var timesCloseBtn=document.getElementById('_dbgTimesPanelClose');
    if(timesCloseBtn)timesCloseBtn.addEventListener('click',window._dbgToggleTimesPanel);

    // [v3.35] TIMES panel: opacity cycle, tab switching, reset.
    var timesOpacityBtn=document.getElementById('_dbgTimesPanelOpacity');
    if(timesOpacityBtn){
      var tStates=[
        {alpha:0.10,glyph:'◐'},
        {alpha:0.55,glyph:'◑'},
        {alpha:0.95,glyph:'●'}
      ];
      // [v3.36] TIMES panel defaults to solid (idx=2) since it's a
      // reference-lookup panel, not a live debug overlay — being able
      // to read times clearly matters more than seeing the puzzle behind.
      var tIdx=2;
      try{
        var tSaved=parseInt(localStorage.getItem('_dbgTimesPanelOpacityIdx'),10);
        if(!isNaN(tSaved)&&tSaved>=0&&tSaved<tStates.length)tIdx=tSaved;
      }catch(e){}
      function applyTimesOpacity(){
        var p=document.getElementById('_dbgTimesPanel');
        if(!p)return;
        var s=tStates[tIdx];
        p.style.background='rgba(8,16,8,'+s.alpha+')';
        timesOpacityBtn.textContent=s.glyph;
      }
      applyTimesOpacity();
      timesOpacityBtn.addEventListener('click',function(ev){
        ev.stopPropagation();
        tIdx=(tIdx+1)%tStates.length;
        try{localStorage.setItem('_dbgTimesPanelOpacityIdx',String(tIdx));}catch(e){}
        applyTimesOpacity();
      });
    }

    // Tab clicks switch active size.
    var tabs=document.querySelectorAll('._dbgTimesTab');
    for(var ti=0;ti<tabs.length;ti++){
      (function(tab){
        tab.addEventListener('click',function(ev){
          ev.stopPropagation();
          var sz=tab.getAttribute('data-size');
          if(sz)_dbgSetActiveTimesSize(sz);
        });
      })(tabs[ti]);
    }

    // TIMES reset uses the same two-tap pattern as COUNTS.
    var timesResetBtn=document.getElementById('_dbgTimesResetBtn');
    if(timesResetBtn){
      var tArmed=false,tTimer=null,tOrigLabel=timesResetBtn.textContent;
      var tOrigBg=timesResetBtn.style.background;
      var tOrigColor=timesResetBtn.style.color;
      function disarmT(){
        tArmed=false;
        if(tTimer){clearTimeout(tTimer);tTimer=null;}
        timesResetBtn.textContent=tOrigLabel;
        timesResetBtn.style.background=tOrigBg;
        timesResetBtn.style.color=tOrigColor;
      }
      timesResetBtn.addEventListener('click',function(ev){
        ev.stopPropagation();
        if(!tArmed){
          tArmed=true;
          timesResetBtn.textContent='TAP AGAIN TO CONFIRM';
          timesResetBtn.style.background='rgba(255,80,80,0.40)';
          timesResetBtn.style.color='rgba(255,220,220,1)';
          tTimer=setTimeout(disarmT,3000);
        } else {
          _dbgClearTimes();
          disarmT();
          _dbgRenderTimes();
        }
      });
    }

    // [v3.39] EXPORT — download all _dbgTimes data as JSON. Filename
    // includes a timestamp so multiple exports don't clobber each
    // other. Uses a Blob + a synthesized <a> click for cross-browser
    // download support (works in Brave, Chrome, Claude in-app webview).
    var timesExportBtn=document.getElementById('_dbgTimesExportBtn');
    if(timesExportBtn){
      timesExportBtn.addEventListener('click',function(ev){
        ev.stopPropagation();
        try{
          var data=_dbgGetTimes();
          // Wrap with metadata so future imports can validate & migrate.
          var payload={
            version:1,
            kind:'equil-times',
            exportedAt:new Date().toISOString(),
            data:data
          };
          var json=JSON.stringify(payload,null,2);
          var blob=new Blob([json],{type:'application/json'});
          var url=URL.createObjectURL(blob);
          var ts=new Date().toISOString().replace(/[:.]/g,'-').slice(0,19);
          var a=document.createElement('a');
          a.href=url;
          a.download='equil-times-'+ts+'.json';
          document.body.appendChild(a);
          a.click();
          setTimeout(function(){
            document.body.removeChild(a);
            URL.revokeObjectURL(url);
          },100);
          // Brief visual confirmation on the button itself.
          var orig=timesExportBtn.textContent;
          timesExportBtn.textContent='SAVED ✓';
          setTimeout(function(){timesExportBtn.textContent=orig;},1200);
        }catch(e){
          timesExportBtn.textContent='ERROR';
          setTimeout(function(){timesExportBtn.textContent='EXPORT';},1500);
        }
      });
    }

    // [v3.39] IMPORT — read a previously-exported JSON file back into
    // localStorage. Merges with current data: new buckets append (so
    // re-importing duplicates entries). For a clean slate, RESET TIMES
    // first then IMPORT.
    var timesImportBtn=document.getElementById('_dbgTimesImportBtn');
    var timesImportFile=document.getElementById('_dbgTimesImportFile');
    if(timesImportBtn&&timesImportFile){
      timesImportBtn.addEventListener('click',function(ev){
        ev.stopPropagation();
        timesImportFile.click();
      });
      timesImportFile.addEventListener('change',function(ev){
        var f=ev.target.files&&ev.target.files[0];
        if(!f)return;
        var reader=new FileReader();
        reader.onload=function(e){
          try{
            var parsed=JSON.parse(e.target.result);
            // Accept either the wrapped format {version,kind,data} or
            // a raw _dbgTimes object (for resilience).
            var loaded=(parsed&&parsed.kind==='equil-times'&&parsed.data)?parsed.data:parsed;
            if(!loaded||typeof loaded!=='object')throw new Error('bad format');
            // Merge: for each (size,diff), append loaded entries to
            // existing. Skips invalid keys silently.
            var current=_dbgGetTimes();
            ['small','medium','large','xl2'].forEach(function(sz){
              if(!loaded[sz])return;
              if(!current[sz])current[sz]={easy:[],medium:[],hard:[]};
              ['easy','medium','hard'].forEach(function(df){
                var src=loaded[sz][df];
                if(!Array.isArray(src))return;
                if(!Array.isArray(current[sz][df]))current[sz][df]=[];
                for(var i=0;i<src.length;i++)current[sz][df].push(src[i]);
              });
            });
            localStorage.setItem('_dbgTimes',JSON.stringify(current));
            _dbgRenderTimes();
            var orig=timesImportBtn.textContent;
            timesImportBtn.textContent='LOADED ✓';
            setTimeout(function(){timesImportBtn.textContent=orig;},1200);
          }catch(err){
            timesImportBtn.textContent='BAD FILE';
            setTimeout(function(){timesImportBtn.textContent='IMPORT';},1500);
          }
          // Reset the input so picking the same file again still fires change.
          timesImportFile.value='';
        };
        reader.onerror=function(){
          timesImportBtn.textContent='READ ERR';
          setTimeout(function(){timesImportBtn.textContent='IMPORT';},1500);
        };
        reader.readAsText(f);
      });
    }

    // [v3.34] Opacity cycle button. Three states for the panel
    // background:
    //   0: see-through (default; 0.10 alpha — puzzle visible behind)
    //   1: medium       (0.55 alpha — values readable, puzzle hinted)
    //   2: solid        (0.95 alpha — values pop, puzzle nearly hidden)
    // Indicator glyph rotates: ◐ → ◑ → ● to give a quick visual cue.
    // Persists in localStorage so it survives reloads.
    var opacityBtn=document.getElementById('_dbgPanelOpacity');
    if(opacityBtn){
      var states=[
        {alpha:0.10,glyph:'◐'},
        {alpha:0.55,glyph:'◑'},
        {alpha:0.95,glyph:'●'}
      ];
      var idx=0;
      try{
        var saved=parseInt(localStorage.getItem('_dbgPanelOpacityIdx'),10);
        if(!isNaN(saved)&&saved>=0&&saved<states.length)idx=saved;
      }catch(e){}
      function applyOpacity(){
        var pnl=document.getElementById('_dbgPanel');
        if(!pnl)return;
        var s=states[idx];
        pnl.style.background='rgba(8,16,8,'+s.alpha+')';
        opacityBtn.textContent=s.glyph;
      }
      applyOpacity();
      opacityBtn.addEventListener('click',function(ev){
        ev.stopPropagation();
        idx=(idx+1)%states.length;
        try{localStorage.setItem('_dbgPanelOpacityIdx',String(idx));}catch(e){}
        applyOpacity();
      });
    }

    // [v3.26] In-page two-tap reset. confirm() is blocked by some
    // webviews (notably the Claude in-app browser), so the button
    // self-arms on first tap and executes on second tap within 3s.
    var resetBtn=document.getElementById('_dbgResetBtn');
    if(resetBtn){
      var resetArmed=false,resetTimer=null,origLabel=resetBtn.textContent;
      var origBg=resetBtn.style.background;
      var origColor=resetBtn.style.color;
      function disarmReset(){
        resetArmed=false;
        if(resetTimer){clearTimeout(resetTimer);resetTimer=null;}
        resetBtn.textContent=origLabel;
        resetBtn.style.background=origBg;
        resetBtn.style.color=origColor;
      }
      resetBtn.addEventListener('click',function(ev){
        ev.stopPropagation();
        if(!resetArmed){
          resetArmed=true;
          resetBtn.textContent='TAP AGAIN TO CONFIRM';
          resetBtn.style.background='rgba(255,80,80,0.45)';
          resetBtn.style.color='rgba(255,255,255,1)';
          resetTimer=setTimeout(disarmReset,3000);
        } else {
          disarmReset();
          _dbgResetCounts();
          window._dbgRenderAll();
          try{if(window._modalCloseChirp)window._modalCloseChirp();}catch(e){}
        }
      });
    }

    // Collapsible section headers
    function bindCollapse(headerId,bodyId,arrowId){
      var header=document.getElementById(headerId);
      var body=document.getElementById(bodyId);
      var arrow=document.getElementById(arrowId);
      if(!header||!body||!arrow)return;
      header.addEventListener('click',function(){
        var isOpen=body.style.display!=='none';
        body.style.display=isOpen?'none':'block';
        arrow.style.transform=isOpen?'rotate(-90deg)':'rotate(0deg)';
      });
    }
    bindCollapse('_dbgCurrentHeader','_dbgPuzzleStats','_dbgCurrentArrow');
    bindCollapse('_dbgAvgHeader','_dbgAvgBody','_dbgAvgArrow');
    bindCollapse('_dbgTplCountsHeader','_dbgTplCountsBody','_dbgTplCountsArrow');
    bindCollapse('_dbgFailHeader','_dbgFailBody','_dbgFailArrow');

    // [v3.27] Drag is bound to the header only. Body region uses
    // touch-action:pan-y for normal scrolling. This avoids the
    // touch-conflict where dragging and scrolling competed for the
    // same gesture. Mouse drag works only on header too — keeps the
    // model simple and predictable.
    // [v3.35] Refactored as a helper so the TIMES panel reuses it.
    function _dbgMakeDraggable(panelId, headerId, excludeIds){
      var panel=document.getElementById(panelId);
      var header=document.getElementById(headerId);
      if(!panel||!header)return;
      var excludeSet={};
      if(excludeIds)for(var ei=0;ei<excludeIds.length;ei++)excludeSet[excludeIds[ei]]=true;
      var dragging=false,startX=0,startY=0,startLeft=0,startTop=0,initialized=false;
      function px(v){return parseFloat(v)||0;}
      function getXY(ev){
        if(ev.touches&&ev.touches.length)return {x:ev.touches[0].clientX,y:ev.touches[0].clientY};
        return {x:ev.clientX,y:ev.clientY};
      }
      function onDown(ev){
        if(ev.target&&excludeSet[ev.target.id])return;
        if(!initialized){
          var rect=panel.getBoundingClientRect();
          var bodyRect=document.body.getBoundingClientRect();
          panel.style.left=(rect.left-bodyRect.left)+'px';
          panel.style.top=(rect.top-bodyRect.top)+'px';
          panel.style.transform='none';
          initialized=true;
        }
        dragging=true;
        var p=getXY(ev);
        startX=p.x;startY=p.y;
        startLeft=px(panel.style.left);
        startTop=px(panel.style.top);
        ev.preventDefault();
      }
      function onMove(ev){
        if(!dragging)return;
        var p=getXY(ev);
        var dx=p.x-startX,dy=p.y-startY;
        var newL=startLeft+dx,newT=startTop+dy;
        var vw=window.innerWidth,vh=window.innerHeight;
        if(newL<-100)newL=-100;
        if(newL>vw-50)newL=vw-50;
        if(newT<0)newT=0;
        if(newT>vh-30)newT=vh-30;
        panel.style.left=newL+'px';
        panel.style.top=newT+'px';
        ev.preventDefault();
      }
      function onUp(){dragging=false;}
      header.addEventListener('mousedown',onDown);
      document.addEventListener('mousemove',onMove);
      document.addEventListener('mouseup',onUp);
      header.addEventListener('touchstart',onDown,{passive:false});
      document.addEventListener('touchmove',onMove,{passive:false});
      document.addEventListener('touchend',onUp);
    }

    // [v3.68/v3.69] Pinch-to-zoom on debug panels.
    //
    // Listener lives on the panel's "body" element (the content area,
    // not the header) so we don't fight with _dbgMakeDraggable's
    // single-finger header drag. Two-finger pinch scales the whole
    // panel from the finger midpoint. When zoomed, single-finger drag
    // inside the body pans. On close while zoomed, the toggle function
    // calls _dbgZoomReset(true) to animate back to scale=1 before hiding.
    //
    // [v3.69] Two refinements:
    //   1) touchstart is registered as {passive: true}. The previous
    //      {passive: false} registration was suppressing synthesized
    //      clicks on child elements like the COUNTS panel's collapsible
    //      group headers. preventDefault is now only needed on touchmove
    //      (to block scroll while pinching/panning) — touch-action:pan-y
    //      on the body already disables the browser's native pinch.
    //   2) When the pan-translate (tx,ty) reaches scale=1 — either via
    //      a user pinch-out or via the close animation — the offsets are
    //      *baked* into the panel's left/top so the visual position is
    //      preserved. Previously tx/ty was zeroed at scale=1, snapping
    //      the panel back to its pre-zoom position.
    //
    // Transform composition: the drag system uses left/top for the
    // panel's position and sets transform='none' on first drag. We
    // set transform='translate(tx,ty) scale(s)' with origin 0 0. Both
    // systems share the same one-time "convert translateX(-50%) to
    // left/top" routine so they compose cleanly regardless of which
    // gesture happens first.
    function _dbgMakePinchZoom(panelId, headerId, bodyId){
      var panel=document.getElementById(panelId);
      var body=document.getElementById(bodyId);
      if(!panel||!body)return;

      var scale=1, tx=0, ty=0;
      var pinching=false, panning=false;
      var startDist=0, startScale=1;
      var startMidX=0, startMidY=0;
      var startTx=0, startTy=0;
      var panStartX=0, panStartY=0;
      var initializedPos=false;
      var transitionTimer=null;

      function applyTransform(animate){
        if(transitionTimer){clearTimeout(transitionTimer);transitionTimer=null;}
        if(animate){
          panel.style.transition='transform 0.24s cubic-bezier(.2,.7,.3,1)';
          transitionTimer=setTimeout(function(){
            panel.style.transition='';
            transitionTimer=null;
          },280);
        } else {
          panel.style.transition='';
        }
        panel.style.transformOrigin='0 0';
        panel.style.transform='translate('+tx+'px,'+ty+'px) scale('+scale+')';
      }

      function ensureInitialized(){
        // Same one-time conversion the drag system does: bake the
        // initial translateX(-50%) centering into left/top so we can
        // own the transform property cleanly.
        if(initializedPos)return;
        var rect=panel.getBoundingClientRect();
        var bRect=document.body.getBoundingClientRect();
        panel.style.left=(rect.left-bRect.left)+'px';
        panel.style.top =(rect.top -bRect.top )+'px';
        panel.style.transform='';
        initializedPos=true;
      }

      // [v3.69] At scale=1, fold any residual tx/ty into the panel's
      // left/top so the visual position is preserved and the transform
      // state is identity. This way:
      //   - After a user pinches out to 1, the panel stays where they
      //     dragged it instead of snapping back.
      //   - Future _dbgMakeDraggable header drags can read clean
      //     left/top without a hidden translate component.
      // Clamps to the same min-visible bounds the drag system uses
      // (-100 to vw-50 on x, 0 to vh-30 on y).
      function bakePanIntoLeftTop(){
        if(tx===0 && ty===0)return;
        var left=parseFloat(panel.style.left)||0;
        var top =parseFloat(panel.style.top )||0;
        var nl=left+tx, nt=top+ty;
        var vw=window.innerWidth, vh=window.innerHeight;
        if(nl<-100) nl=-100;
        if(nl>vw-50) nl=vw-50;
        if(nt<0) nt=0;
        if(nt>vh-30) nt=vh-30;
        panel.style.left=nl+'px';
        panel.style.top =nt+'px';
        tx=0; ty=0;
      }

      function dist(t1,t2){
        var dx=t2.clientX-t1.clientX, dy=t2.clientY-t1.clientY;
        return Math.hypot(dx,dy);
      }
      function midp(t1,t2){
        return {x:(t1.clientX+t2.clientX)/2, y:(t1.clientY+t2.clientY)/2};
      }
      function clampScale(s){return s<1?1:(s>5?5:s);}

      function clampPan(){
        // Keep at least ~40px of the panel's visual rect inside the
        // viewport so the user can never lose it entirely while
        // panning a zoomed view.
        var pw=panel.offsetWidth, ph=panel.offsetHeight;
        var left=parseFloat(panel.style.left)||0;
        var top =parseFloat(panel.style.top )||0;
        var sw=pw*scale, sh=ph*scale;
        var visLeft=left+tx, visTop=top+ty;
        var visRight=visLeft+sw, visBot=visTop+sh;
        var vw=window.innerWidth, vh=window.innerHeight;
        if(visRight<40)         tx+=40-visRight;
        if(visLeft>vw-40)       tx-=visLeft-(vw-40);
        if(visBot<40)           ty+=40-visBot;
        if(visTop>vh-40)        ty-=visTop-(vh-40);
      }

      function targetInHeader(t){
        while(t&&t!==panel){
          if(t.id===headerId)return true;
          t=t.parentNode;
        }
        return false;
      }

      // [v3.69] passive:true — we never call preventDefault on
      // touchstart, and registering as non-passive was suppressing
      // child click synthesis (broke COUNTS collapsible groups).
      body.addEventListener('touchstart', function(ev){
        if(ev.touches.length===2){
          ensureInitialized();
          pinching=true;
          panning=false;
          startDist=dist(ev.touches[0],ev.touches[1]);
          startScale=scale;
          var m=midp(ev.touches[0],ev.touches[1]);
          startMidX=m.x; startMidY=m.y;
          startTx=tx;    startTy=ty;
        } else if(ev.touches.length===1 && scale>1){
          // One-finger pan only when already zoomed in.
          if(targetInHeader(ev.target))return;
          pinching=false;
          panning=true;
          panStartX=ev.touches[0].clientX;
          panStartY=ev.touches[0].clientY;
          startTx=tx; startTy=ty;
        }
      }, {passive:true});

      body.addEventListener('touchmove', function(ev){
        if(pinching && ev.touches.length===2){
          var d=dist(ev.touches[0],ev.touches[1]);
          if(startDist<1)return;
          var newScale=clampScale(startScale*(d/startDist));
          var m=midp(ev.touches[0],ev.touches[1]);

          // Anchor zoom at the finger midpoint: find the panel-local
          // point under the starting midpoint, then place it under the
          // current midpoint at the new scale.
          var left=parseFloat(panel.style.left)||0;
          var top =parseFloat(panel.style.top )||0;
          var localX=(startMidX-left-startTx)/startScale;
          var localY=(startMidY-top -startTy)/startScale;
          tx=m.x-left-localX*newScale;
          ty=m.y-top -localY*newScale;
          scale=newScale;

          // [v3.69] No tx/ty snap-back at scale=1 — let the panel rest
          // wherever the user pinched it out to. The bake happens on
          // touchend instead, so mid-gesture math stays continuous.
          clampPan();
          applyTransform(false);
          ev.preventDefault();
        } else if(panning && ev.touches.length===1){
          var dx=ev.touches[0].clientX-panStartX;
          var dy=ev.touches[0].clientY-panStartY;
          tx=startTx+dx; ty=startTy+dy;
          clampPan();
          applyTransform(false);
          ev.preventDefault();
        }
      }, {passive:false});

      body.addEventListener('touchend', function(ev){
        if(ev.touches.length<2)pinching=false;
        if(ev.touches.length<1){
          panning=false;
          // [v3.69] If the user pinched out to scale=1, fold the
          // residual translate into left/top so the panel rests in
          // place and future header drags see a clean transform.
          if(scale===1 && (tx!==0 || ty!==0)){
            bakePanIntoLeftTop();
            applyTransform(false);
          }
        }
      });
      body.addEventListener('touchcancel', function(){
        pinching=false; panning=false;
        if(scale===1 && (tx!==0 || ty!==0)){
          bakePanIntoLeftTop();
          applyTransform(false);
        }
      });

      // Hooks for the toggle handlers' smooth close-while-zoomed.
      panel._dbgZoomReset=function(animate){
        if(scale===1 && tx===0 && ty===0)return false;
        // [v3.69] Bake current translate into left/top BEFORE
        // animating, so the panel stays where the user dragged it
        // during zoom rather than snapping back to its pre-zoom
        // origin as it reaches scale=1.
        if(tx!==0 || ty!==0){
          bakePanIntoLeftTop();
        }
        scale=1;
        applyTransform(!!animate);
        return true;
      };
      panel._dbgZoomIsZoomed=function(){return scale>1;};
    }

    _dbgMakeDraggable('_dbgPanel','_dbgPanelHeader',['_dbgPanelClose','_dbgPanelOpacity']);
    _dbgMakeDraggable('_dbgTimesPanel','_dbgTimesPanelHeader',['_dbgTimesPanelClose','_dbgTimesPanelOpacity']);
    _dbgMakePinchZoom('_dbgPanel','_dbgPanelHeader','_dbgPanelBody');
    _dbgMakePinchZoom('_dbgTimesPanel','_dbgTimesPanelHeader','_dbgTimesBody');
  }
  if(document.readyState==='loading'){
    document.addEventListener('DOMContentLoaded',hook);
  }else{
    hook();
  }
})();

// [v3.18] DEBUG: render the template label below the grid.
// Reads window._currentTplName (set by _pickTemplate) and
// window._fallbackFrom (set by buildPuzzle on retry-cascade fail).
// When the fallback flag is set, the label reads "TQ ⚠ from large/hard"
// so it's obvious when a non-requested template is rendering.
function _updateDbgTplLabel(){
  var el=document.getElementById('_dbgTplLabel');
  if(!el)return;
  var name=window._currentTplName||'?';
  var fb=window._fallbackFrom;
  el.textContent=fb?(name+' ⚠ from '+fb):name;
  // [v4.52] Theme-aware label color. Inline style is set every
  // update so the CSS body.light-mode override needs !important
  // OR we just pick the right value here.
  var _light = (window._lightModeOn === true);
  if(fb){
    el.style.color = _light ? 'rgba(180,80,30,0.95)' : 'rgba(255,140,80,0.85)';
  } else {
    el.style.color = _light ? 'rgba(14,116,144,0.85)' : 'rgba(0,217,255,0.55)';
  }
}

// ── XL TEMPLATES: 7-cell equations (A op1 B op2 C = D) ──
// Each equation spans 7 cells. Num cells at positions 0,2,4,6.
// H equation at (c,r): num cols c, c+2, c+4, c+6.  Width = 7 cols.
// V equation at (c,r): num rows r, r+2, r+4, r+6.  Height = 7 rows.
// Crossings: H and V share a num cell (both at pos 0,2,4, or 6).
//
// TX_A: Two 7-cell H equations + connecting V equations. ~15×15 grid.
// Layout:
//   H0: c=0,r=0   nums at c=0,2,4,6
//   H1: c=0,r=6   nums at c=0,2,4,6   (shares col 0,2,4,6 with V eqs)
//   H2: c=0,r=12  nums at c=0,2,4,6
//   V0: c=0,r=0   nums at r=0,2,4,6   (crosses H0@(0,0), H1@(0,6) )
//   V1: c=2,r=0   nums at r=0,2,4,6   (crosses H0@(2,0), H1@(2,6) )
//   V2: c=4,r=0   nums at r=0,2,4,6   (crosses H0@(4,0), H1@(4,6) )
//   V3: c=6,r=0   nums at r=0,2,4,6   (crosses H0@(6,0), H1@(6,6) )
//   V4: c=0,r=6   V1 ends r=6, V4 starts r=6 -> adjacent on c=0!
//                 Use c=0,r=8 (gap at r=7): nums r=8,10,12,14 -> but H2 at r=12!
//                 V at c=0,r=6: spans r=6 to r=12. V0 ends r=6. adjacent!
//                 Use different cols for lower Vs.
//   Lower Vs at c=1,3,5? Those are op cells for H eqs, not num cells.
//   All H eqs share the same num columns (0,2,4,6).
//   So Vs can only start at r=0 or after a gap from r=6.
//   V0-V3 at r=0 end at r=6 (nums r=0,2,4,6). 
//   New Vs starting at r=8 (gap at r=7): nums r=8,10,12,14.
//   H2 at r=12 has nums at c=0,2,4,6. So (0,12),(2,12),(4,12),(6,12) all crossings ✓
//   V4 c=0,r=8: nums r=8,10,12,14. Crosses H2@(0,12) ✓ 
//   (But r=14 is beyond H2. Uncrossed lower end — fine.)
//   Actually: r=8+0=8,r=8+2=10,r=8+4=12,r=8+6=14. H2 at r=12. (0,12)=V4.pos4 ✓ H2.pos0 ✓
//   V5 c=2,r=8: crosses H2@(2,12)[H2.pos2, V5.pos4] ✓
//   V6 c=4,r=8: crosses H2@(4,12)[H2.pos4, V6.pos4] ✓ -- wait H2.pos4=(4+4,12)=(8,12)?
//   H2 at c=0,r=12: pos0=(0,12),pos2=(2,12),pos4=(4,12),pos6=(6,12). YES ✓
//   V7 c=6,r=8: crosses H2@(6,12)[H2.pos6, V7.pos4] ✓
//   Grid: 15 cols (c=0..6, max=6) × 15 rows (r=0..14, max=14)
//   But we need c to reach at least 6. Max col = 6. 7 cols total. Very narrow!
//   To make it wider, add another column of H equations offset to the right.
//   H3 at c=8,r=0: nums c=8,10,12,14. Gap at c=7 between H0(ends c=6) and H3(starts c=8) ✓
//   Need Vs crossing H0 and H3 on the same col... no shared cols. Need bridge Vs.
//   V at c=6,r=0: V3 already there. V at c=8,r=0: nums r=0,2,4,6. Crosses H3@(8,0) ✓
//   But H0 ends at c=6. (8,0) is outside H0. No H0/V crossing at c=8. That's fine — H3 connects via H1 later.
//   Add H1_b at c=8,r=6: nums c=8,10,12,14. V at c=8,r=0 crosses H1_b@(8,6)? (8,6)=V.pos6 if V at r=0 spans to r=6 ✓
//   So V(c=8,r=0): nums r=0,2,4,6. (8,0)=H3.pos0 ✓ (8,6)=H1_b.pos0 ✓
//   This gives: left block (cols 0-6) + right block (cols 8-14), connected via H1(c=0)/H1_b(c=8) sharing row 6.
//   But they DON'T share cells — they're on the same row but different columns with a gap at c=7.
//   No connection between blocks! Need a bridge.
//
// SIMPLER APPROACH: Build XL as two interleaved TX blocks sharing num cells.
// TX_base: H eqs at rows 0,6,12. V eqs at cols 0,2,4,6, starting row 0 and row 8.
// TX_base2: same but shifted right by 8 cols. Shared column at c=6/c=8? No gap needed if we start TX_base2 at c=6.
// TX_base2 at c=6: H eqs at c=6,r=0 (nums c=6,8,10,12). V eqs at c=6,r=0 (nums r=0,2,4,6).
// (6,0) would be shared by TX_base's H0.pos6 AND TX_base2's V.pos0 ✓
// (6,6) shared by TX_base's H1.pos6 AND TX_base2's V.pos2 ✓ (V at c=6,r=0, pos2=r=4... no)
// V at c=6,r=0: pos0=(6,0),pos2=(6,2),pos4=(6,4),pos6=(6,6). 
// TX_base H0.pos6=(6,0) ✓, TX_base H1 at r=6: H1.pos0=(0,6). (6,6)=H1.pos6 ✓. V(c=6).pos6=(6,6) ✓
// So TX_base2 starts at c=6 with its own H eqs from c=6 to c=12, and shares V at c=6 with TX_base.
// Combined grid: c=0 to c=12, r=0 to r=14. 13 cols × 15 rows.

function makeXLBase(cOffset,rOffset,sfx){
  // 3 H equations at rows rOffset, rOffset+6, rOffset+12
  // 4 V equations at cols cOffset,cOffset+2,cOffset+4,cOffset+6, rows rOffset to rOffset+6
  // 4 V equations at same cols, rows rOffset+8 to rOffset+14
  var eqs=[];
  ['h0','h1','h2'].forEach(function(id,i){
    eqs.push({id:id+sfx,dir:'h',c:cOffset,r:rOffset+i*6,xl:true});
  });
  [0,2,4,6].forEach(function(dc,i){
    eqs.push({id:'v'+i+sfx,dir:'v',c:cOffset+dc,r:rOffset,xl:true});
    eqs.push({id:'vb'+i+sfx,dir:'v',c:cOffset+dc,r:rOffset+8,xl:true});
  });
  return eqs;
}

// TX_A: two XL bases sharing column c=6
// Base A at (0,0): H eqs cols 0-6, V eqs cols 0,2,4,6
// Base B at (6,0): H eqs cols 6-12, V eqs cols 6,8,10,12
// Shared: col 6 Vs are the same physical column — Base A's v3 and Base B's v0 are BOTH at c=6!
// They'd be duplicate equations. Instead: only include one set of Vs at c=6.
// Base A contributes: h0_a,h1_a,h2_a, v0_a(c=0),v1_a(c=2),v2_a(c=4), vb0_a,vb1_a,vb2_a
// Shared column: v3(c=6,r=0), vb3(c=6,r=8) — shared between both blocks
// Base B contributes: h0_b,h1_b,h2_b, v1_b(c=8),v2_b(c=10),v3_b(c=12), vb1_b,vb2_b,vb3_b
// Crossings at c=6:
//   (6,0): h0_a.pos6=(c=0+6,r=0)=(6,0) ✓  AND  h0_b.pos0=(c=6,r=0) ✓  AND  v3.pos0=(6,0) ✓
//   But (6,0) being in h0_a(as D=pos6), h0_b(as A=pos0), AND v3(as A=pos0) = 3 equations sharing 1 cell!
//   That's allowed — it's a crossing. Both H equations share the cell with the V.
//   BUT: two H equations on the same row sharing a cell means they're adjacent! h0_a ends at c=6 and h0_b starts at c=6. VIOLATION for same-dir equations.
// Fix: use a gap. h0_b starts at c=7. But 7 is odd — not a num position for XL.
// XL H equation at c=7: pos0=(7,r), pos2=(9,r), pos4=(11,r), pos6=(13,r). No crossing with h0_a(ends c=6).
// But then no shared cells between blocks → disconnected!
// Solution: connect via a V equation that spans both blocks' H equations.
// V at c=6,r=0: pos0=(6,0)=h0_a.D, pos2=(6,2), pos4=(6,4), pos6=(6,6)=h1_a.D
// V at c=6,r=6: (6,6)=h1_a.D and (6,8)=... h2_a is at r=12. Gap.
// New: h0_b at c=8,r=3: pos0=(8,3). V at c=6,r=0 doesn't reach c=8. Hmm.
//
// CLEANEST APPROACH: Don't share columns. Connect via a horizontal equation that bridges.
// Bridge H eq: at row r=6, spanning from c=4 to c=10 (7 cells). 
//   pos0=(4,6),pos2=(6,6),pos4=(8,6),pos6=(10,6)
//   Left block V(c=4): (4,6)=pos6 of V(c=4,r=0) ✓ → h_bridge.A connects to left block
//   Right block V(c=8,r=6): pos0=(8,6)=h_bridge.pos4 ✓ → right block V connects to bridge
//
// FINAL XL TEMPLATE DESIGN:
// Left block: H eqs at c=0, rows 0,8. V eqs at c=0,2,4,6, rows 0 and (later).
// Bridge: H eq at c=4, row 6 (nums c=4,6,8,10) connects left Vs to right Vs
// Right block: H eqs at c=8, rows 0,8. V eqs at c=8,10,12,14, rows 0.
// Everything stitched together.

// Let me just hardcode a verified XL template:
// Grid: 15 cols (c=0..14) × 15 rows (r=0..14)
//
// H equations (7-cell, xl:true):
//   hA c=0,r=0:  nums (0,0)(2,0)(4,0)(6,0)
//   hB c=0,r=6:  nums (0,6)(2,6)(4,6)(6,6)
//   hC c=0,r=12: nums (0,12)(2,12)(4,12)(6,12)
//   hD c=8,r=0:  nums (8,0)(10,0)(12,0)(14,0)
//   hE c=8,r=6:  nums (8,6)(10,6)(12,6)(14,6)
//   hF c=8,r=12: nums (8,12)(10,12)(12,12)(14,12)
//
// V equations (7-cell, xl:true):
//   vA c=0,r=0:  nums (0,0)(0,2)(0,4)(0,6)   crosses hA@(0,0),hB@(0,6)
//   vB c=2,r=0:  nums (2,0)(2,2)(2,4)(2,6)   crosses hA@(2,0),hB@(2,6)
//   vC c=4,r=0:  nums (4,0)(4,2)(4,4)(4,6)   crosses hA@(4,0),hB@(4,6)
//   vD c=6,r=0:  nums (6,0)(6,2)(6,4)(6,6)   crosses hA@(6,0),hB@(6,6)
//   vE c=8,r=0:  nums (8,0)(8,2)(8,4)(8,6)   crosses hD@(8,0),hE@(8,6)
//   vF c=10,r=0: nums (10,0)(10,2)(10,4)(10,6) crosses hD@(10,0),hE@(10,6)
//   vG c=12,r=0: nums (12,0)(12,2)(12,4)(12,6) crosses hD@(12,0),hE@(12,6)
//   vH c=14,r=0: nums (14,0)(14,2)(14,4)(14,6) crosses hD@(14,0),hE@(14,6)
//   vI c=0,r=8:  vA ends r=6, gap r=7 ✓. nums (0,8)(0,10)(0,12)(0,14) crosses hC@(0,12)
//   vJ c=2,r=8:  nums (2,8)(2,10)(2,12)(2,14) crosses hC@(2,12)
//   vK c=4,r=8:  nums (4,8)(4,10)(4,12)(4,14) crosses hC@(4,12)
//   vL c=6,r=8:  nums (6,8)(6,10)(6,12)(6,14) crosses hC@(6,12)
//   vM c=8,r=8:  vE ends r=6, gap r=7 ✓. nums (8,8)(8,10)(8,12)(8,14) crosses hF@(8,12)
//   vN c=10,r=8: nums (10,8)(10,10)(10,12)(10,14) crosses hF@(10,12)
//   vO c=12,r=8: nums (12,8)(12,10)(12,12)(12,14) crosses hF@(12,12)
//   vP c=14,r=8: nums (14,8)(14,10)(14,12)(14,14) crosses hF@(14,12)
//
// Connectivity: hA-vA,vB,vC,vD → hB-vA,vB,vC,vD → hC-vI,vJ,vK,vL
//               hD-vE,vF,vG,vH → hE-vE,vF,vG,vH → hF-vM,vN,vO,vP
// TWO DISCONNECTED BLOCKS! Left (A,B,C,vA-L) and Right (D,E,F,vE-P).
// Need a bridge. Add a horizontal equation connecting col 6 to col 8:
//   hBridge c=4,r=4: nums (4,4)(6,4)(8,4)(10,4)
//   vC at c=4,r=0: (4,4)=vC.pos4 ✓ → connects left block to bridge
//   vD at c=6,r=0: (6,4)=vD.pos4 ✓
//   vE at c=8,r=0: (8,4)=vE.pos4 ✓ → connects bridge to right block
//   vF at c=10,r=0: (10,4)=vF.pos4 ✓
//   CONNECTED! hBridge sits at r=4 bridging left and right.
//   But hBridge starts at c=4 which is inside hA's span (c=0 to c=6). 
//   hA is at r=0, hBridge at r=4 — different rows, fine ✓

// ═══════════════════════════════════════════════════════════
// XL TEMPLATES — Organic crossword-style layouts
// H equations scattered at different rows AND column offsets.
// V equations connect specific pairs of H equations 6 rows apart.
// Each H–V pair shares at least one common column for crossing.
// V interior cells (rows between H rows) are free for the solver.
// Empty space between unconnected areas is intentional and fine.
// ═══════════════════════════════════════════════════════════

// TX_A: Staircase — H equations march diagonally right-and-down
// h0(wide,top-left) → h1(narrow,mid) → h2(wide,bottom-right)
var TX_A=[
  {id:'h0',dir:'h',c:0,r:0,xl:true},   // 7H: nums c=0,2,4,6
  {id:'h1',dir:'h',c:4,r:6},            // 5H: nums c=4,6,8
  {id:'h2',dir:'h',c:2,r:12,xl:true},  // 7H: nums c=2,4,6,8
  // h0→h1 via c=4 and c=6 (7V spanning r=0..6)
  {id:'v0',dir:'v',c:4,r:0,xl:true},   // h0@(4,0) h1@(4,6). Free r=2,4
  {id:'v1',dir:'v',c:6,r:0,xl:true},   // h0@(6,0) h1@(6,6). Free r=2,4
  // h1→h2 via c=8 (7V spanning r=6..12)
  {id:'v2',dir:'v',c:8,r:6,xl:true},   // h1@(8,6) h2@(8,12). Free r=8,10
  // Dangling Vs off h0 and h2 for shape variety
  {id:'v3',dir:'v',c:0,r:0,xl:true},   // hangs off h0 left side. Free r=2,4,6
  {id:'v4',dir:'v',c:2,r:6,xl:true},   // hangs off h2 left: h2@(2,12). Free r=6,8,10
];

// TX_B: Z-shape — top-right, middle-center, bottom-left
var TX_B=[
  {id:'hTop',dir:'h',c:6,r:0,xl:true}, // 7H top-right: nums c=6,8,10,12
  {id:'hMid',dir:'h',c:2,r:6,xl:true}, // 7H middle: nums c=2,4,6,8
  {id:'hBot',dir:'h',c:0,r:12},         // 5H bottom-left: nums c=0,2,4
  // hTop→hMid via c=6 and c=8
  {id:'vTM0',dir:'v',c:6,r:0,xl:true}, // hTop@(6,0) hMid@(6,6). Free r=2,4
  {id:'vTM1',dir:'v',c:8,r:0,xl:true}, // hTop@(8,0) hMid@(8,6). Free r=2,4
  // hMid→hBot via c=2 and c=4
  {id:'vMB0',dir:'v',c:2,r:6,xl:true}, // hMid@(2,6) hBot@(2,12). Free r=8,10
  {id:'vMB1',dir:'v',c:4,r:6,xl:true}, // hMid@(4,6) hBot@(4,12). Free r=8,10
  // Dangling Vs for asymmetry
  {id:'vTop',dir:'v',c:10,r:0,xl:true},// hangs off hTop right. Free r=2,4,6
  {id:'vBot',dir:'v',c:0,r:8},          // 5V hangs off hBot: hBot@(0,12). Free r=8,10
];

// TX_C: T-shape — two top arms meet at wide center, two bottom legs extend
var TX_C=[
  {id:'hTL',dir:'h',c:0,r:0},           // 5H top-left: nums c=0,2,4
  {id:'hTR',dir:'h',c:6,r:0},           // 5H top-right: nums c=6,8,10
  {id:'hCtr',dir:'h',c:2,r:6,xl:true}, // 7H center: nums c=2,4,6,8
  {id:'hBL',dir:'h',c:0,r:12,xl:true}, // 7H bot-left: nums c=0,2,4,6
  {id:'hBR',dir:'h',c:6,r:12},          // 5H bot-right: nums c=6,8,10
  // hTL→hCtr via c=2 and c=4
  {id:'vTL',dir:'v',c:2,r:0,xl:true},  // hTL@(2,0) hCtr@(2,6). Free r=2,4
  {id:'vTM',dir:'v',c:4,r:0,xl:true},  // hTL@(4,0) hCtr@(4,6). Free r=2,4
  // hTR→hCtr via c=8
  {id:'vTR',dir:'v',c:8,r:0,xl:true},  // hTR@(8,0) hCtr@(8,6). Free r=2,4
  // hCtr→hBL via c=4, hCtr→hBR via c=6
  {id:'vBL',dir:'v',c:4,r:6,xl:true},  // hCtr@(4,6) hBL@(4,12). Free r=8,10
  {id:'vBR',dir:'v',c:6,r:6,xl:true},  // hCtr@(6,6) hBR@(6,12). Free r=8,10
];

// TX_D: Cross — wide H at top, two narrow Hs sharing a row in middle, wide H at bottom
var TX_D=[
  {id:'hTop',dir:'h',c:4,r:0,xl:true}, // 7H top: nums c=4,6,8,10
  {id:'hML',dir:'h',c:0,r:6},           // 5H mid-left: nums c=0,2,4
  {id:'hMR',dir:'h',c:6,r:6},           // 5H mid-right: nums c=6,8,10 (gap at c=5)
  {id:'hBot',dir:'h',c:2,r:12,xl:true},// 7H bottom: nums c=2,4,6,8
  // hTop→hML via c=4; hTop→hMR via c=8
  {id:'v0',dir:'v',c:4,r:0,xl:true},   // hTop@(4,0) hML@(4,6). Free r=2,4
  {id:'v1',dir:'v',c:8,r:0,xl:true},   // hTop@(8,0) hMR@(8,6). Free r=2,4
  // hML→hBot via c=2; hMR→hBot via c=6
  {id:'v2',dir:'v',c:2,r:6,xl:true},   // hML@(2,6) hBot@(2,12). Free r=8,10
  {id:'v3',dir:'v',c:6,r:6,xl:true},   // hMR@(6,6) hBot@(6,12). Free r=8,10
  // Extra dangling Vs for shape
  {id:'v4',dir:'v',c:10,r:0,xl:true},  // hangs off hTop. Free r=2,4,6
  {id:'v5',dir:'v',c:0,r:6},            // 5V hangs off hML. Free r=8,10
  {id:'v6',dir:'v',c:8,r:6,xl:true},   // hMR@(8,6) hBot@(8,12). Extra bottom connection. Free r=8,10
];

var TMPL_XL=[TX_A,TX_B,TX_C,TX_D];

// ═══════════════════════════════════════════════════════════
// XL2 TEMPLATES — BC-biased crossings
// H equations in pairs spaced 2 rows apart (e.g. r=4,r=6) with bridge H rows between.
// V equations are constrained to columns that are B (H.c+2) or C (H.c+4) of every H they cross.
// ~78% of crossings land at B or C positions (the 2nd and 3rd number cells of each equation).
// Remaining ~22% are structural bridge crossings between H-row groups.

var TX2_sq_A=[
  {id:'h4_0',dir:'h',c:0,r:4,xl:true},
  {id:'h4_8',dir:'h',c:8,r:4},
  {id:'h4_14',dir:'h',c:14,r:4,xl:true},
  {id:'h4_22',dir:'h',c:22,r:4},
  {id:'h6_0',dir:'h',c:0,r:6,xl:true},
  {id:'h6_8',dir:'h',c:8,r:6},
  {id:'h6_14',dir:'h',c:14,r:6,xl:true},
  {id:'h6_22',dir:'h',c:22,r:6},
  {id:'h10_2',dir:'h',c:2,r:10,xl:true},
  {id:'h10_10',dir:'h',c:10,r:10},
  {id:'h10_16',dir:'h',c:16,r:10,xl:true},
  {id:'h10_24',dir:'h',c:24,r:10},
  {id:'h12_0',dir:'h',c:0,r:12,xl:true},
  {id:'h12_8',dir:'h',c:8,r:12},
  {id:'h12_14',dir:'h',c:14,r:12,xl:true},
  {id:'h12_22',dir:'h',c:22,r:12},
  {id:'h14_0',dir:'h',c:0,r:14,xl:true},
  {id:'h14_8',dir:'h',c:8,r:14},
  {id:'h14_14',dir:'h',c:14,r:14,xl:true},
  {id:'h14_22',dir:'h',c:22,r:14},
  {id:'h18_2',dir:'h',c:2,r:18,xl:true},
  {id:'h18_10',dir:'h',c:10,r:18},
  {id:'h18_16',dir:'h',c:16,r:18,xl:true},
  {id:'h18_24',dir:'h',c:24,r:18},
  {id:'h20_0',dir:'h',c:0,r:20,xl:true},
  {id:'h20_8',dir:'h',c:8,r:20},
  {id:'h20_14',dir:'h',c:14,r:20,xl:true},
  {id:'h20_22',dir:'h',c:22,r:20},
  {id:'h22_0',dir:'h',c:0,r:22,xl:true},
  {id:'h22_8',dir:'h',c:8,r:22},
  {id:'h22_14',dir:'h',c:14,r:22,xl:true},
  {id:'h22_22',dir:'h',c:22,r:22},
  {id:'v12_4',dir:'v',c:12,r:4,xl:true},
  {id:'v10_0',dir:'v',c:10,r:0,xl:true},
  {id:'v14_8',dir:'v',c:14,r:8,xl:true},
  {id:'v18_6',dir:'v',c:18,r:6,xl:true},
  {id:'v18_14',dir:'v',c:18,r:14,xl:true},
  {id:'v16_20',dir:'v',c:16,r:20,xl:true},
  {id:'v16_0',dir:'v',c:16,r:0,xl:true},
  {id:'v22_10',dir:'v',c:22,r:10,xl:true},
  {id:'v26_14',dir:'v',c:26,r:14,xl:true},
  {id:'v26_6',dir:'v',c:26,r:6,xl:true},
  {id:'v24_2',dir:'v',c:24,r:2,xl:true},
  {id:'v24_20',dir:'v',c:24,r:20,xl:true},
  {id:'v10_8',dir:'v',c:10,r:8,xl:true},
  {id:'v12_14',dir:'v',c:12,r:14,xl:true},
  {id:'v10_20',dir:'v',c:10,r:20,xl:true},
  {id:'v8_18',dir:'v',c:8,r:18,xl:true},
  {id:'v4_12',dir:'v',c:4,r:12,xl:true},
  {id:'v6_18',dir:'v',c:6,r:18,xl:true},
  {id:'v2_20',dir:'v',c:2,r:20,xl:true},
  {id:'v4_20',dir:'v',c:4,r:20,xl:true},
  {id:'v6_6',dir:'v',c:6,r:6,xl:true},
  {id:'v4_4',dir:'v',c:4,r:4,xl:true}
];

var TX2_sq_B=[
  {id:'h4_2',dir:'h',c:2,r:4,xl:true},
  {id:'h4_10',dir:'h',c:10,r:4},
  {id:'h4_16',dir:'h',c:16,r:4,xl:true},
  {id:'h4_24',dir:'h',c:24,r:4},
  {id:'h6_2',dir:'h',c:2,r:6,xl:true},
  {id:'h6_10',dir:'h',c:10,r:6},
  {id:'h6_16',dir:'h',c:16,r:6,xl:true},
  {id:'h6_24',dir:'h',c:24,r:6},
  {id:'h10_0',dir:'h',c:0,r:10,xl:true},
  {id:'h10_8',dir:'h',c:8,r:10},
  {id:'h10_14',dir:'h',c:14,r:10,xl:true},
  {id:'h10_22',dir:'h',c:22,r:10},
  {id:'h12_2',dir:'h',c:2,r:12,xl:true},
  {id:'h12_10',dir:'h',c:10,r:12},
  {id:'h12_16',dir:'h',c:16,r:12,xl:true},
  {id:'h12_24',dir:'h',c:24,r:12},
  {id:'h14_2',dir:'h',c:2,r:14,xl:true},
  {id:'h14_10',dir:'h',c:10,r:14},
  {id:'h14_16',dir:'h',c:16,r:14,xl:true},
  {id:'h14_24',dir:'h',c:24,r:14},
  {id:'h18_0',dir:'h',c:0,r:18,xl:true},
  {id:'h18_8',dir:'h',c:8,r:18},
  {id:'h18_14',dir:'h',c:14,r:18,xl:true},
  {id:'h18_22',dir:'h',c:22,r:18},
  {id:'h20_2',dir:'h',c:2,r:20,xl:true},
  {id:'h20_10',dir:'h',c:10,r:20},
  {id:'h20_16',dir:'h',c:16,r:20,xl:true},
  {id:'h20_24',dir:'h',c:24,r:20},
  {id:'h22_2',dir:'h',c:2,r:22,xl:true},
  {id:'h22_10',dir:'h',c:10,r:22},
  {id:'h22_16',dir:'h',c:16,r:22,xl:true},
  {id:'h22_24',dir:'h',c:24,r:22},
  {id:'v12_4',dir:'v',c:12,r:4,xl:true},
  {id:'v14_0',dir:'v',c:14,r:0,xl:true},
  {id:'v8_4',dir:'v',c:8,r:4,xl:true},
  {id:'v4_6',dir:'v',c:4,r:6,xl:true},
  {id:'v6_2',dir:'v',c:6,r:2,xl:true},
  {id:'v10_8',dir:'v',c:10,r:8,xl:true},
  {id:'v12_14',dir:'v',c:12,r:14,xl:true},
  {id:'v14_20',dir:'v',c:14,r:20,xl:true},
  {id:'v8_18',dir:'v',c:8,r:18,xl:true},
  {id:'v4_14',dir:'v',c:4,r:14,xl:true},
  {id:'v6_20',dir:'v',c:6,r:20,xl:true},
  {id:'v14_8',dir:'v',c:14,r:8,xl:true},
  {id:'v18_4',dir:'v',c:18,r:4,xl:true},
  {id:'v20_2',dir:'v',c:20,r:2,xl:true},
  {id:'v16_8',dir:'v',c:16,r:8,xl:true},
  {id:'v18_14',dir:'v',c:18,r:14,xl:true},
  {id:'v20_20',dir:'v',c:20,r:20,xl:true},
  {id:'v22_10',dir:'v',c:22,r:10,xl:true},
  {id:'v26_8',dir:'v',c:26,r:8,xl:true},
  {id:'v28_6',dir:'v',c:28,r:6,xl:true},
  {id:'v28_14',dir:'v',c:28,r:14,xl:true},
  {id:'v26_16',dir:'v',c:26,r:16,xl:true},
  {id:'v26_0',dir:'v',c:26,r:0,xl:true}
];

var TX2_sq_C=[
  {id:'h4_0',dir:'h',c:0,r:4},
  {id:'h4_6',dir:'h',c:6,r:4,xl:true},
  {id:'h4_14',dir:'h',c:14,r:4},
  {id:'h4_20',dir:'h',c:20,r:4,xl:true},
  {id:'h6_0',dir:'h',c:0,r:6},
  {id:'h6_6',dir:'h',c:6,r:6,xl:true},
  {id:'h6_14',dir:'h',c:14,r:6},
  {id:'h6_20',dir:'h',c:20,r:6,xl:true},
  {id:'h10_2',dir:'h',c:2,r:10},
  {id:'h10_8',dir:'h',c:8,r:10,xl:true},
  {id:'h10_16',dir:'h',c:16,r:10},
  {id:'h10_22',dir:'h',c:22,r:10,xl:true},
  {id:'h12_0',dir:'h',c:0,r:12},
  {id:'h12_6',dir:'h',c:6,r:12,xl:true},
  {id:'h12_14',dir:'h',c:14,r:12},
  {id:'h12_20',dir:'h',c:20,r:12,xl:true},
  {id:'h14_0',dir:'h',c:0,r:14},
  {id:'h14_6',dir:'h',c:6,r:14,xl:true},
  {id:'h14_14',dir:'h',c:14,r:14},
  {id:'h14_20',dir:'h',c:20,r:14,xl:true},
  {id:'h18_2',dir:'h',c:2,r:18},
  {id:'h18_8',dir:'h',c:8,r:18,xl:true},
  {id:'h18_16',dir:'h',c:16,r:18},
  {id:'h18_22',dir:'h',c:22,r:18,xl:true},
  {id:'h20_0',dir:'h',c:0,r:20},
  {id:'h20_6',dir:'h',c:6,r:20,xl:true},
  {id:'h20_14',dir:'h',c:14,r:20},
  {id:'h20_20',dir:'h',c:20,r:20,xl:true},
  {id:'h22_0',dir:'h',c:0,r:22},
  {id:'h22_6',dir:'h',c:6,r:22,xl:true},
  {id:'h22_14',dir:'h',c:14,r:22},
  {id:'h22_20',dir:'h',c:20,r:22,xl:true},
  {id:'v4_6',dir:'v',c:4,r:6,xl:true},
  {id:'v2_2',dir:'v',c:2,r:2,xl:true},
  {id:'v6_4',dir:'v',c:6,r:4,xl:true},
  {id:'v10_6',dir:'v',c:10,r:6,xl:true},
  {id:'v8_0',dir:'v',c:8,r:0,xl:true},
  {id:'v14_8',dir:'v',c:14,r:8,xl:true},
  {id:'v18_6',dir:'v',c:18,r:6,xl:true},
  {id:'v18_14',dir:'v',c:18,r:14,xl:true},
  {id:'v16_20',dir:'v',c:16,r:20,xl:true},
  {id:'v16_0',dir:'v',c:16,r:0,xl:true},
  {id:'v20_8',dir:'v',c:20,r:8,xl:true},
  {id:'v24_14',dir:'v',c:24,r:14,xl:true},
  {id:'v24_6',dir:'v',c:24,r:6,xl:true},
  {id:'v22_2',dir:'v',c:22,r:2,xl:true},
  {id:'v22_20',dir:'v',c:22,r:20,xl:true},
  {id:'v12_12',dir:'v',c:12,r:12,xl:true},
  {id:'v10_18',dir:'v',c:10,r:18,xl:true},
  {id:'v8_20',dir:'v',c:8,r:20,xl:true},
  {id:'v2_12',dir:'v',c:2,r:12,xl:true},
  {id:'v4_18',dir:'v',c:4,r:18,xl:true}
];

var TX2_sq_D=[
  {id:'h4_0',dir:'h',c:0,r:4,xl:true},
  {id:'h4_8',dir:'h',c:8,r:4},
  {id:'h4_14',dir:'h',c:14,r:4,xl:true},
  {id:'h4_22',dir:'h',c:22,r:4},
  {id:'h6_2',dir:'h',c:2,r:6,xl:true},
  {id:'h6_10',dir:'h',c:10,r:6},
  {id:'h6_16',dir:'h',c:16,r:6,xl:true},
  {id:'h6_24',dir:'h',c:24,r:6},
  {id:'h10_0',dir:'h',c:0,r:10,xl:true},
  {id:'h10_8',dir:'h',c:8,r:10},
  {id:'h10_14',dir:'h',c:14,r:10,xl:true},
  {id:'h10_22',dir:'h',c:22,r:10},
  {id:'h12_0',dir:'h',c:0,r:12,xl:true},
  {id:'h12_8',dir:'h',c:8,r:12},
  {id:'h12_14',dir:'h',c:14,r:12,xl:true},
  {id:'h12_22',dir:'h',c:22,r:12},
  {id:'h14_2',dir:'h',c:2,r:14,xl:true},
  {id:'h14_10',dir:'h',c:10,r:14},
  {id:'h14_16',dir:'h',c:16,r:14,xl:true},
  {id:'h14_24',dir:'h',c:24,r:14},
  {id:'h18_0',dir:'h',c:0,r:18,xl:true},
  {id:'h18_8',dir:'h',c:8,r:18},
  {id:'h18_14',dir:'h',c:14,r:18,xl:true},
  {id:'h18_22',dir:'h',c:22,r:18},
  {id:'h20_0',dir:'h',c:0,r:20,xl:true},
  {id:'h20_8',dir:'h',c:8,r:20},
  {id:'h20_14',dir:'h',c:14,r:20,xl:true},
  {id:'h20_22',dir:'h',c:22,r:20},
  {id:'h22_2',dir:'h',c:2,r:22,xl:true},
  {id:'h22_10',dir:'h',c:10,r:22},
  {id:'h22_16',dir:'h',c:16,r:22,xl:true},
  {id:'h22_24',dir:'h',c:24,r:22},
  {id:'v12_4',dir:'v',c:12,r:4,xl:true},
  {id:'v10_8',dir:'v',c:10,r:8,xl:true},
  {id:'v12_14',dir:'v',c:12,r:14,xl:true},
  {id:'v14_8',dir:'v',c:14,r:8,xl:true},
  {id:'v18_4',dir:'v',c:18,r:4,xl:true},
  {id:'v18_12',dir:'v',c:18,r:12,xl:true},
  {id:'v22_10',dir:'v',c:22,r:10,xl:true},
  {id:'v26_4',dir:'v',c:26,r:4,xl:true},
  {id:'v26_12',dir:'v',c:26,r:12,xl:true},
  {id:'v24_16',dir:'v',c:24,r:16,xl:true},
  {id:'v26_20',dir:'v',c:26,r:20,xl:true},
  {id:'v14_16',dir:'v',c:14,r:16,xl:true},
  {id:'v18_20',dir:'v',c:18,r:20,xl:true},
  {id:'v8_18',dir:'v',c:8,r:18,xl:true},
  {id:'v4_18',dir:'v',c:4,r:18,xl:true},
  {id:'v2_12',dir:'v',c:2,r:12,xl:true},
  {id:'v4_6',dir:'v',c:4,r:6,xl:true},
  {id:'v2_4',dir:'v',c:2,r:4,xl:true}
];

// [v4.74] NEW COMPACT JUMBO TEMPLATES.
// The old TX2_sq_A..D (above) are a ~29×27 footprint with 54 seven-cell
// equations — far too big and tedious; nobody enjoyed a puzzle that
// massive. They stay DEFINED here (per "never remove underlying code")
// but are no longer pooled. The new templates keep the distinctive
// 7-cell "A op1 B op2 C = D" format that makes Jumbo feel different
// from Large, just at a far more reasonable size.
//
// TXN_A: 20 equations, 25 crossings (density 1.25 — in line with the
// original's 1.07 and well below the danger zone that caused values-gen
// failures), 13×19 footprint. Structure: 5 horizontal rows (0,4,8,12,16),
// each with a left equation (cols 0-6) and a right equation (cols 6-12)
// sharing col 6 — that shared endpoint is what ties the left and right
// halves into one connected component. Vertical equations thread down
// through the rows (each crosses 2 H rows) and the col-4/col-8 verticals
// bridge the top, middle, and bottom row-bands so the whole mesh is
// connected. Validated offline (validate_tpl.js): ok=true, no cell-type
// collisions, connectivity PASS. Still needs in-game generation
// confirmation (watch the template label for a "from xl2/..." fallback
// warning, which would mean genNumsXL couldn't satisfy the crossings).
var TXN_A=[
  {id:'L0',dir:'h',c:0,r:0,xl:true},
  {id:'R0',dir:'h',c:6,r:0,xl:true},
  {id:'L4',dir:'h',c:0,r:4,xl:true},
  {id:'R4',dir:'h',c:6,r:4,xl:true},
  {id:'L8',dir:'h',c:0,r:8,xl:true},
  {id:'R8',dir:'h',c:6,r:8,xl:true},
  {id:'L12',dir:'h',c:0,r:12,xl:true},
  {id:'R12',dir:'h',c:6,r:12,xl:true},
  {id:'L16',dir:'h',c:0,r:16,xl:true},
  {id:'R16',dir:'h',c:6,r:16,xl:true},
  {id:'v0_a',dir:'v',c:0,r:0,xl:true},
  {id:'v12_a',dir:'v',c:12,r:0,xl:true},
  {id:'v10_a',dir:'v',c:10,r:0,xl:true},
  {id:'v4_b',dir:'v',c:4,r:4,xl:true},
  {id:'v8_b',dir:'v',c:8,r:4,xl:true},
  {id:'v0_c',dir:'v',c:0,r:8,xl:true},
  {id:'v12_c',dir:'v',c:12,r:8,xl:true},
  {id:'v2_c',dir:'v',c:2,r:8,xl:true},
  {id:'v4_d',dir:'v',c:4,r:12,xl:true},
  {id:'v8_d',dir:'v',c:8,r:12,xl:true}
];

// [v3.00] TX2_sq pool unchanged. TH_final and TI_stair are 28-eq
// compounds that fit Jumbo by workload but their 17×11 / 17×17
// footprints render with awkwardly small cells under xl2-mode's
// max cell size of 26px — they'd float in a half-empty container.
// They stay defined in the code (above) but unpooled, awaiting
// either a UI mode that suits them or removal in a later version.
// [v4.74] Pool now points at the new compact template(s). Only TXN_A
// for this build so the new size can be eyeballed on-device before
// the B/C/D variety templates are added. The old TX2_sq_A..D remain
// defined above but unpooled.
var TMPL_XL2=[TXN_A];
var TMPL_XL2_OLD=[TX2_sq_A,TX2_sq_B,TX2_sq_C,TX2_sq_D];

// ═══════════════════════════════════════════════════════════
// NUMBER GENERATION
// ALLOWED_OPS is set per-difficulty before calling buildPuzzle
// ═══════════════════════════════════════════════════════════
var ALLOWED_OPS=['+','-'];  // will be overridden per-call — kept for safety

function genNums(tmpl,allowedOps,minDiv){
  var V={},OPS={};
  var useOps=allowedOps||['+','-'];
  var minDiv=minDiv||0;
  var wantMul=useOps.indexOf('x')>=0||useOps.indexOf('/')>=0;

  // [v3.20c] BACKTRACKING SOLVER. The original genNums propagation runs
  // equations in template-list order, which causes 3-of-3 lockup on
  // densely-crossed templates like TS-family: when an equation is
  // reached, all 3 cells may already be set by earlier equations, and
  // only ~3% of random integer triples satisfy any of +/-/×/÷ as an op.
  //
  // Solution: process equations in BFS order from a fully-crossed root.
  // For each equation in order, constructively assign values to satisfy
  // some op. If the equation can't be solved (e.g. setCount=2 with no
  // valid op), BACKTRACK to the predecessor and retry. Up to 5 fresh
  // BFS attempts. Node simulation: 99.8% success on TS template (vs
  // ~3% for the old propagation approach).
  function _runBT(){
    var bV={},bOPS={};
    var cellEqs={};
    for(var i=0;i<tmpl.length;i++){
      var pts=numPts(tmpl[i]);
      for(var j=0;j<pts.length;j++){
        var k=nk(pts[j]);
        if(!cellEqs[k])cellEqs[k]=[];
        cellEqs[k].push(i);
      }
    }
    var adj={};
    for(var i=0;i<tmpl.length;i++)adj[i]={};
    for(var k in cellEqs){
      var eqs=cellEqs[k];
      for(var i=0;i<eqs.length;i++)for(var j=i+1;j<eqs.length;j++){
        adj[eqs[i]][eqs[j]]=true;
        adj[eqs[j]][eqs[i]]=true;
      }
    }
    var isFC=[];
    for(var i=0;i<tmpl.length;i++){
      var pts=numPts(tmpl[i]),allCrossed=true;
      for(var j=0;j<pts.length;j++){
        var k=nk(pts[j]);
        if(!cellEqs[k]||cellEqs[k].length<2){allCrossed=false;break;}
      }
      isFC[i]=allCrossed;
    }
    var fcIdxs=[];
    for(var i=0;i<tmpl.length;i++)if(isFC[i])fcIdxs.push(i);
    var rootIdx=fcIdxs.length
      ? fcIdxs[Math.floor(Math.random()*fcIdxs.length)]
      : Math.floor(Math.random()*tmpl.length);
    var visited={},order=[],queue=[rootIdx];visited[rootIdx]=true;
    while(queue.length){
      var idx=queue.shift();
      order.push(idx);
      var nbrs=Object.keys(adj[idx]).map(Number);
      nbrs.sort(function(a,b){
        if(isFC[a]&&!isFC[b])return -1;
        if(!isFC[a]&&isFC[b])return 1;
        return Math.random()-0.5;
      });
      for(var i=0;i<nbrs.length;i++){
        if(!visited[nbrs[i]]){visited[nbrs[i]]=true;queue.push(nbrs[i]);}
      }
    }
    for(var i=0;i<tmpl.length;i++)if(!visited[i]){visited[i]=true;order.push(i);}

    var writes=[],p=0,attempts=[],consecBT=0;
    var totalSteps=0,MAX_STEPS=tmpl.length*500;

    while(p<order.length){
      totalSteps++;
      if(totalSteps>MAX_STEPS)return null;
      var e=tmpl[order[p]];
      if(!attempts[p])attempts[p]=0;
      attempts[p]++;
      if(attempts[p]>30){
        attempts[p]=0;
        if(p===0)return null;
        consecBT++;
        var jumpBack=Math.min(p,1+Math.floor(consecBT/3));
        for(var bb=0;bb<jumpBack;bb++){
          var w=writes[p-1];
          if(w){
            for(var ki=0;ki<w.keys.length;ki++)delete bV[w.keys[ki]];
            delete bOPS[w.opId];
            writes[p-1]=null;
          }
          attempts[p-1]=0;
          p--;
          if(p===0)break;
        }
        continue;
      }

      var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
      var a=bV[kA],b=bV[kB],c=bV[kC];
      var setCount=(a!=null?1:0)+(b!=null?1:0)+(c!=null?1:0);
      var keysWritten=[],solved=false,op,av,bv,cv;

      if(setCount===0){
        op=rp(useOps);
        // [v3.33] Bias away from generating 1s. Random ranges shifted
        // to start at 2 instead of 1 for free-choice values. With 1s
        // excluded, trivial equations (1×n=n, n÷1=n, 1+1=2, etc.) drop
        // dramatically. The constraints still allow 1s to appear via
        // setCount=2 cases where the math forces them, so the puzzles
        // aren't 1-free, just less 1-heavy.
        for(var t=0;t<80;t++){
          if(op==='+'){av=ri(2,18);bv=ri(2,18);cv=av+bv;if(cv<=72){solved=true;break;}}
          else if(op==='-'){av=ri(3,35);bv=ri(2,av-1);cv=av-bv;if(cv>=1&&cv<=72){solved=true;break;}}
          else if(op==='x'){av=ri(2,9);bv=ri(2,9);cv=av*bv;if(cv<=72){solved=true;break;}}
          else{cv=ri(2,9);bv=ri(2,9);av=cv*bv;if(av>=1&&av<=72){solved=true;break;}}
          op=rp(useOps);
        }
        if(solved){bV[kA]=av;bV[kB]=bv;bV[kC]=cv;bOPS[e.id]=op;keysWritten=[kA,kB,kC];}
      } else if(setCount===1){
        op=rp(useOps);
        for(var t=0;t<80;t++){
          if(a!=null){
            // [v3.33] When generating b given a, avoid b=1 for × and ÷
            // (n×1=n, n÷1=n trivials). For +/−, also avoid b=1 to
            // reduce trivial-feeling small differences (n−1, n+1 are
            // borderline-trivial too).
            if(op==='+'){bv=ri(2,18);cv=a+bv;if(cv<=72){solved=true;break;}}
            else if(op==='-'&&a>=3){bv=ri(2,a-1);cv=a-bv;if(cv>=1&&cv<=72){solved=true;break;}}
            else if(op==='x'&&a>=2&&a<=9){bv=ri(2,9);cv=a*bv;if(cv<=72){solved=true;break;}}
            else if(op==='/'&&a>=2){bv=ri(2,Math.min(9,a));cv=(a%bv===0)?a/bv:null;if(cv!=null&&cv>=2&&cv<=72){solved=true;break;}}
          } else if(b!=null){
            if(op==='+'){av=ri(2,18);cv=av+b;if(cv<=72){solved=true;break;}}
            else if(op==='-'){av=ri(b+1,Math.min(72,b+18));cv=av-b;if(cv>=2){solved=true;break;}}
            else if(op==='x'&&b>=2&&b<=9){av=ri(2,9);cv=av*b;if(cv<=72){solved=true;break;}}
            else if(op==='/'&&b>=2&&b<=9){cv=ri(2,9);av=cv*b;if(av<=72){solved=true;break;}}
          } else if(c!=null){
            if(op==='+'&&c>=4){av=ri(2,c-2);bv=c-av;if(bv>=2){solved=true;break;}}
            else if(op==='-'){bv=ri(2,18);av=c+bv;if(av<=72){solved=true;break;}}
            else if(op==='x'&&c>=4&&c<=72){
              var divs=[];for(var d=2;d<=9;d++)if(c%d===0&&c/d>=2&&c/d<=9)divs.push(d);
              if(divs.length){bv=rp(divs);av=c/bv;solved=true;break;}
            } else if(op==='/'&&c>=2&&c<=9){bv=ri(2,9);av=c*bv;if(av<=72){solved=true;break;}}
          }
          op=rp(useOps);
        }
        if(solved){
          if(a==null){bV[kA]=av;keysWritten.push(kA);}
          if(b==null){bV[kB]=bv;keysWritten.push(kB);}
          if(c==null){bV[kC]=cv;keysWritten.push(kC);}
          bOPS[e.id]=op;
        }
      } else if(setCount===2){
        // [v3.33] At setCount=2 we can't escape an existing 1 — if the
        // crossings already locked a=1 or b=1, we must use it. But we
        // CAN reorder the op preference so non-trivial ops come first.
        // Sort puts +/- before x/÷ when 1 is involved so we prefer
        // arithmetic over identity-multiplication.
        var ops_=useOps.slice();
        var hasOne=(a===1||b===1||c===1);
        if(hasOne){
          // Prefer +,- first when a 1 is present.
          ops_.sort(function(x,y){
            var rank={'+':0,'-':1,'x':2,'/':3};
            return (rank[x]||0)-(rank[y]||0);
          });
        } else {
          ops_.sort(function(){return Math.random()-0.5;});
        }
        for(var oi=0;oi<ops_.length&&!solved;oi++){
          op=ops_[oi];
          if(a!=null&&b!=null){
            if(op==='+'&&a+b>=1&&a+b<=72){bV[kC]=a+b;bOPS[e.id]='+';keysWritten=[kC];solved=true;}
            else if(op==='-'&&a-b>=1&&a-b<=72){bV[kC]=a-b;bOPS[e.id]='-';keysWritten=[kC];solved=true;}
            else if(op==='x'&&a>=1&&a<=9&&b>=1&&b<=9&&a*b<=72){bV[kC]=a*b;bOPS[e.id]='x';keysWritten=[kC];solved=true;}
            else if(op==='/'&&b>0&&b<=9&&a%b===0&&a/b>=1&&a/b<=72){bV[kC]=a/b;bOPS[e.id]='/';keysWritten=[kC];solved=true;}
          } else if(a!=null&&c!=null){
            if(op==='+'&&c-a>=1&&c-a<=72){bV[kB]=c-a;bOPS[e.id]='+';keysWritten=[kB];solved=true;}
            else if(op==='-'&&a-c>=1&&a-c<=72){bV[kB]=a-c;bOPS[e.id]='-';keysWritten=[kB];solved=true;}
            else if(op==='x'&&a>=1&&a<=9&&c%a===0&&c/a>=1&&c/a<=9){bV[kB]=c/a;bOPS[e.id]='x';keysWritten=[kB];solved=true;}
            else if(op==='/'&&c>=1&&c<=9&&a%c===0&&a/c>=1&&a/c<=9){bV[kB]=a/c;bOPS[e.id]='/';keysWritten=[kB];solved=true;}
          } else {
            if(op==='+'&&c-b>=1&&c-b<=72){bV[kA]=c-b;bOPS[e.id]='+';keysWritten=[kA];solved=true;}
            else if(op==='-'&&c+b>=1&&c+b<=72){bV[kA]=c+b;bOPS[e.id]='-';keysWritten=[kA];solved=true;}
            else if(op==='x'&&b>=1&&b<=9&&c%b===0&&c/b>=1&&c/b<=9){bV[kA]=c/b;bOPS[e.id]='x';keysWritten=[kA];solved=true;}
            else if(op==='/'&&c>=1&&c<=9&&b>=1&&b<=9&&c*b<=72){bV[kA]=c*b;bOPS[e.id]='/';keysWritten=[kA];solved=true;}
          }
        }
      } else {
        for(var oi=0;oi<useOps.length;oi++){
          op=useOps[oi];
          if(op==='+'&&a+b===c){bOPS[e.id]='+';solved=true;break;}
          if(op==='-'&&a-b===c&&c>0){bOPS[e.id]='-';solved=true;break;}
          if(op==='x'&&a*b===c&&a>=1&&a<=9&&b>=1&&b<=9){bOPS[e.id]='x';solved=true;break;}
          if(op==='/'&&b>0&&a%b===0&&a/b===c&&b>=1&&b<=9&&c>=1){bOPS[e.id]='/';solved=true;break;}
        }
      }

      if(solved){
        writes[p]={keys:keysWritten,opId:e.id};
        attempts[p]=0;
        consecBT=0;
        p++;
      } else {
        if(p===0)return null;
        consecBT++;
        var jumpBack=Math.min(p,1+Math.floor(consecBT/3));
        for(var bb=0;bb<jumpBack;bb++){
          var w=writes[p-1];
          if(w){
            for(var ki=0;ki<w.keys.length;ki++)delete bV[w.keys[ki]];
            delete bOPS[w.opId];
            writes[p-1]=null;
          }
          attempts[p-1]=0;
          p--;
          if(p===0)break;
        }
      }
    }
    return {V:bV,OPS:bOPS};
  }

  // Try backtracking with up to 5 fresh BFS-order restarts.
  var btResult=null;
  for(var btAttempt=0;btAttempt<5&&!btResult;btAttempt++){
    btResult=_runBT();
  }
  if(btResult){
    V=btResult.V;
    OPS=btResult.OPS;
  }
  // If backtracking succeeded, V and OPS are fully populated. The legacy
  // solveOne propagation pass below will still run but find nothing to do
  // (every equation has all 3 cells set + OPS assigned, so the hA&&hB&&hC
  // path in solveOne returns immediately at "if(OPS[e.id])return").
  // If backtracking failed, V and OPS are empty and legacy code takes over.


  // PRE-SEED: if mul/div allowed, force some equations to x or /
  // by setting their three values before propagation locks things.
  // Only pre-seed equations whose num cells are ALL unset (no crossing conflicts).
  // Use a modest target — too many seeds cause crossing conflicts on large templates.
  if(wantMul){
    var mulOps=useOps.filter(function(o){return o==='x'||o==='/'});
    var order=tmpl.slice().sort(function(){return Math.random()-0.5;});
    var seeded=0;
    var target=Math.max(2,Math.floor(tmpl.length*0.25)); // 25% max
    for(var i=0;i<order.length&&seeded<target;i++){
      var e=order[i];
      var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
      if(V[kA]!=null||V[kB]!=null||V[kC]!=null)continue;
      var op=rp(mulOps);
      var av,bv,cv;
      for(var t=0;t<50;t++){
        if(op==='x'){av=ri(1,9);bv=ri(1,9);cv=av*bv;}
        else{cv=ri(1,9);bv=ri(1,9);av=cv*bv;}
        if(cv>=1&&cv<=72){V[kA]=av;V[kB]=bv;V[kC]=cv;OPS[e.id]=op;seeded++;break;}
      }
    }
  }

  function solveOne(e){
    var pts=numPts(e),pA=pts[0],pB=pts[1],pC=pts[2];
    var kA=nk(pA),kB=nk(pB),kC=nk(pC);
    var a=V[kA],b=V[kB],c=V[kC];
    var hA=a!=null,hB=b!=null,hC=c!=null;

    if(hA&&hB&&hC){
      if(OPS[e.id])return; // already assigned, keep it
      if(a+b===c){OPS[e.id]='+';return;}
      if(a-b===c&&c>0){OPS[e.id]='-';return;}
      if(useOps.indexOf('x')>=0&&a*b===c&&a>=1&&a<=9&&b>=1&&b<=9){OPS[e.id]='x';return;}
      if(useOps.indexOf('/')>=0&&b>0&&a%b===0&&a/b===c&&b>=1&&b<=9&&c>=1){OPS[e.id]='/';return;}
      return;
    }

    if(hA&&hB&&!hC){
      for(var i=0;i<useOps.length;i++){
        var op2=useOps[i],cv2=ev(a,op2,b);
        if(op2==='x'&&(a<1||a>9||b<1||b>9))continue;
        if(op2==='/'&&(b<=0||a%b!==0||a/b<1||a/b>9))continue;
        if(cv2!=null&&cv2>=1&&cv2<=72){V[kC]=cv2;OPS[e.id]=op2;return;}
      }
      V[kC]=a+b;OPS[e.id]='+';

    } else if(hA&&!hB&&hC){
      if(useOps.indexOf('+')>=0&&c-a>=1&&c-a<=72){V[kB]=c-a;OPS[e.id]='+';return;}
      if(useOps.indexOf('-')>=0&&a-c>=1&&a-c<=72){V[kB]=a-c;OPS[e.id]='-';return;}
      if(useOps.indexOf('x')>=0&&a>=1&&a<=9&&c%a===0&&c/a>=1&&c/a<=9){V[kB]=c/a;OPS[e.id]='x';return;}
      if(useOps.indexOf('/')>=0&&c>=1&&c<=9&&a%c===0&&a/c>=1&&a/c<=9){V[kB]=a/c;OPS[e.id]='/';return;}
      for(var t=0;t<60;t++){
        var bv6=ri(1,18);
        if(useOps.indexOf('+')>=0&&a+bv6===c){V[kB]=bv6;OPS[e.id]='+';return;}
        if(useOps.indexOf('-')>=0&&a-bv6===c&&c>0){V[kB]=bv6;OPS[e.id]='-';return;}
        if(useOps.indexOf('x')>=0&&a>=1&&a<=9&&bv6>=1&&bv6<=9&&a*bv6===c){V[kB]=bv6;OPS[e.id]='x';return;}
        if(useOps.indexOf('/')>=0&&bv6>=1&&bv6<=9&&a%bv6===0&&a/bv6===c){V[kB]=bv6;OPS[e.id]='/';return;}
      }

    } else if(!hA&&hB&&hC){
      if(useOps.indexOf('+')>=0&&c-b>=1&&c-b<=72){V[kA]=c-b;OPS[e.id]='+';return;}
      if(useOps.indexOf('-')>=0&&c+b>=1&&c+b<=72){V[kA]=c+b;OPS[e.id]='-';return;}
      if(useOps.indexOf('x')>=0&&b>=1&&b<=9&&c%b===0&&c/b>=1&&c/b<=9){V[kA]=c/b;OPS[e.id]='x';return;}
      if(useOps.indexOf('/')>=0&&c>=1&&c<=9&&b>=1&&b<=9){V[kA]=c*b;OPS[e.id]='/';return;}
      for(var t=0;t<60;t++){
        var av6=ri(1,18);
        if(useOps.indexOf('+')>=0&&av6+b===c){V[kA]=av6;OPS[e.id]='+';return;}
        if(useOps.indexOf('-')>=0&&av6-b===c&&c>0){V[kA]=av6;OPS[e.id]='-';return;}
        if(useOps.indexOf('x')>=0&&av6>=1&&av6<=9&&b>=1&&b<=9&&av6*b===c){V[kA]=av6;OPS[e.id]='x';return;}
        if(useOps.indexOf('/')>=0&&av6>=1&&av6<=72&&b>=1&&b<=9&&av6%b===0&&av6/b===c){V[kA]=av6;OPS[e.id]='/';return;}
      }

    } else if(!hA&&!hB&&!hC){
      for(var t=0;t<100;t++){
        var op=rp(useOps),av,bv,cv;
        if(op==='+'){av=ri(1,18);bv=ri(1,18);cv=av+bv;}
        else if(op==='-'){av=ri(2,35);bv=ri(1,av-1);cv=av-bv;}
        else if(op==='x'){av=ri(1,9);bv=ri(1,9);cv=av*bv;}
        else{cv=ri(1,9);bv=ri(1,9);av=cv*bv;}
        if(cv>=1&&cv<=72){V[kA]=av;V[kB]=bv;V[kC]=cv;OPS[e.id]=op;return;}
      }
      V[kA]=4;V[kB]=3;V[kC]=7;OPS[e.id]='+';

    } else if(hA&&!hB&&!hC){
      for(var t=0;t<80;t++){
        var op5=rp(useOps),bv7,cv5;
        if(op5==='+'){bv7=ri(1,18);cv5=a+bv7;}
        else if(op5==='-'&&a>1){bv7=ri(1,a-1);cv5=a-bv7;}
        else if(op5==='x'&&a>=1&&a<=9){bv7=ri(1,9);cv5=a*bv7;}
        else if(op5==='/'&&a>=1){bv7=ri(1,Math.min(9,a));cv5=(a%bv7===0)?a/bv7:null;}
        else{bv7=ri(1,18);cv5=a+bv7;op5='+';}
        if(bv7>=1&&cv5!=null&&cv5>=1&&cv5<=72){V[kB]=bv7;V[kC]=cv5;OPS[e.id]=op5;return;}
      }
      V[kB]=2;V[kC]=a+2;OPS[e.id]='+';

    } else if(!hA&&hB&&!hC){
      for(var t=0;t<80;t++){
        var op6=rp(useOps),av7,cv6;
        if(op6==='+'){av7=ri(1,18);cv6=av7+b;}
        else if(op6==='-'){av7=ri(b+1,b+18);cv6=av7-b;}
        else if(op6==='x'&&b>=1&&b<=9){av7=ri(1,9);cv6=av7*b;}
        else if(op6==='/'&&b>=1&&b<=9){cv6=ri(1,9);av7=cv6*b;}
        else{av7=ri(1,18);cv6=av7+b;op6='+';}
        if(av7>=1&&av7<=72&&cv6!=null&&cv6>=1&&cv6<=72){V[kA]=av7;V[kC]=cv6;OPS[e.id]=op6;return;}
      }
      V[kA]=2;V[kC]=2+b;OPS[e.id]='+';

    } else if(!hA&&!hB&&hC){
      for(var t=0;t<100;t++){
        var op7=rp(useOps),av8,bv8;
        if(op7==='+'){av8=ri(1,c-1);bv8=c-av8;}
        else if(op7==='-'){bv8=ri(1,c-1);av8=c+bv8;}
        else if(op7==='x'){
          var divs=[];for(var d=1;d<=Math.min(9,c);d++)if(c%d===0&&c/d>=1&&c/d<=9)divs.push(d);
          if(!divs.length)continue;bv8=rp(divs);av8=c/bv8;
        }else{bv8=ri(1,9);av8=c*bv8;}
        if(av8>=1&&av8<=72&&bv8>=1&&bv8<=72){V[kA]=av8;V[kB]=bv8;OPS[e.id]=op7;return;}
      }
      V[kA]=1;V[kB]=c>1?c-1:1;OPS[e.id]='+';
    }
  }

  // Main solve passes — propagate values through crossings
  for(var pass=0;pass<20;pass++)for(var i=0;i<tmpl.length;i++)solveOne(tmpl[i]);

  // Safety fill for any remaining unset cells
  for(var i=0;i<tmpl.length;i++){
    var e=tmpl[i],pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
    if(V[kA]==null)V[kA]=ri(1,9);
    if(V[kB]==null)V[kB]=ri(1,9);
    if(!OPS[e.id])OPS[e.id]='+';
    var res=ev(V[kA],OPS[e.id],V[kB]);
    if(res==null||res<1||res>72){OPS[e.id]='+';V[kC]=V[kA]+V[kB];}
    else if(V[kC]==null)V[kC]=res;
  }

  // Division upgrade pass: reassign operators to '/' wherever values allow it.
  // This never changes any values — only the operator label.
  // A/B=C is valid when: A%B===0, C=A/B is integer 1-9, B>=1.
  // We shuffle and try to hit minDiv target.
  if(useOps.indexOf('/')>=0){
    var divNow=0;
    for(var i=0;i<tmpl.length;i++)if(OPS[tmpl[i].id]==='/')divNow++;
    if(divNow<minDiv){
      var shuffled=tmpl.slice().sort(function(){return Math.random()-0.5;});
      for(var i=0;i<shuffled.length&&divNow<minDiv;i++){
        var e=shuffled[i];
        if(OPS[e.id]==='/')continue; // already division
        var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
        var a=V[kA],b=V[kB],c=V[kC];
        if(a==null||b==null||c==null)continue;
        // Check A/B=C: b>=1, a%b===0, result is integer 1-9
        if(b>=1&&b<=9&&a%b===0){
          var quot=a/b;
          if(Number.isInteger(quot)&&quot>=1&&quot<=9&&quot===c){
            OPS[e.id]='/';divNow++;
          }
        }
        // Also try B/A=C if that works
        else if(a>=1&&a<=9&&b%a===0){
          var quot2=b/a;
          if(Number.isInteger(quot2)&&quot2>=1&&quot2<=9&&quot2===c){
            // Swap A and B values so A/B=C holds
            V[kA]=b;V[kB]=a;OPS[e.id]='/';divNow++;
          }
        }
      }
    }
  }

  return{V:V,OPS:OPS};
}

// ═══════════════════════════════════════════════════════════
// XL NUMBER GENERATION: A op1 B op2 C = D
// OPS[e.id] = {op1, op2}  (object, not string)
// Strategy: generate H equations freely first (all values 1-9, D computed).
// Then solve V equations: A and D are fixed by H crossings, B and C may be
// free (uncrossed). Find op1,op2 and free values that satisfy evalXL.
// ═══════════════════════════════════════════════════════════
// eqNumPts: returns num-cell positions for any equation (3 for 5-cell, 4 for 7-cell)
function eqNumPts(e){ return e.xl ? numPtsXL(e) : numPts(e); }

// evalEq: evaluate any equation given its num values and ops
// For 5-cell: ops is a string; for 7-cell: ops is {op1,op2}
function evalEq(e,vals,ops){
  if(e.xl) return evalXL(vals[0],ops.op1,vals[1],ops.op2,vals[2]);
  return ev(vals[0],ops,vals[1]);
}

// resultMatchesEq: check if the result equals the last num value
function resultMatchesEq(e,vals,ops){
  if(e.xl){ return evalXL(vals[0],ops.op1,vals[1],ops.op2,vals[2])===vals[3]; }
  return ev(vals[0],ops,vals[1])===vals[2];
}

function genNumsXL(tmpl,allowedOps){
  var useOps=allowedOps||['+','-'];

  function allOpCombos(){
    var c=[];
    for(var i=0;i<useOps.length;i++)for(var j=0;j<useOps.length;j++)c.push([useOps[i],useOps[j]]);
    return c.sort(function(){return Math.random()-0.5;});
  }

  var hEqs=tmpl.filter(function(e){return e.dir==='h';});
  var vEqs=tmpl.filter(function(e){return e.dir==='v';});

  for(var outerTry=0;outerTry<50;outerTry++){
    var V={},OPS={};
    var hFailed=false;

    // Step 1: Generate H equations. 7-cell uses evalXL, 5-cell uses ev.
    hEqs.forEach(function(e){
      if(hFailed)return;
      var pts=eqNumPts(e);
      var keys=pts.map(nk);
      var fixed=keys.map(function(k){return V[k]!=null;});

      if(e.xl){
        // 7-cell H: 4 num pts (A,B,C,D)
        var kA=keys[0],kB=keys[1],kC=keys[2],kD=keys[3];
        for(var t=0;t<400;t++){
          var cb=allOpCombos(),ci=Math.floor(Math.random()*cb.length);
          var av=fixed[0]?V[kA]:ri(1,9),bv=fixed[1]?V[kB]:ri(1,9),cv=fixed[2]?V[kC]:ri(1,9);
          var dv=evalXL(av,cb[ci][0],bv,cb[ci][1],cv);
          if(dv!=null&&dv>=1&&dv<=72){
            if(!fixed[0])V[kA]=av; if(!fixed[1])V[kB]=bv; if(!fixed[2])V[kC]=cv;
            if(!fixed[3])V[kD]=dv;
            OPS[e.id]={op1:cb[ci][0],op2:cb[ci][1]}; return;
          }
        }
        hFailed=true;
      } else {
        // 5-cell H: 3 num pts (A,B,C)
        var kA=keys[0],kB=keys[1],kC=keys[2];
        var ops=useOps.slice().sort(function(){return Math.random()-0.5;});
        for(var t=0;t<200;t++){
          var op=ops[t%ops.length];
          var av=fixed[0]?V[kA]:ri(1,9),bv=fixed[1]?V[kB]:ri(1,9);
          var cv=ev(av,op,bv);
          if(cv!=null&&cv>=1&&cv<=72&&Number.isInteger(cv)){
            if(op==='x'&&(av<1||av>9||bv<1||bv>9))continue;
            if(op==='/'&&(bv<=0||av%bv!==0))continue;
            if(!fixed[0])V[kA]=av; if(!fixed[1])V[kB]=bv;
            if(!fixed[2])V[kC]=cv;
            OPS[e.id]=op; return;
          }
        }
        // 5-cell fallback
        var av=fixed[0]?V[kA]:ri(1,9),bv=fixed[1]?V[kB]:ri(1,9);
        if(!fixed[0])V[kA]=av; if(!fixed[1])V[kB]=bv;
        if(!fixed[2])V[kC]=av+bv;
        OPS[e.id]='+';
      }
    });
    if(hFailed)continue;

    // Step 2: Solve V equations from H-set values
    var vFailed=false;
    vEqs.forEach(function(e){
      if(vFailed)return;
      var pts=eqNumPts(e),keys=pts.map(nk);
      var fixed=keys.map(function(k){return V[k]!=null;});
      var vals=keys.map(function(k){return V[k];});

      if(e.xl){
        var cb=allOpCombos();
        for(var t=0;t<800;t++){
          var tv=vals.map(function(v,i){return fixed[i]?v:ri(1,9);});
          for(var ci=0;ci<cb.length;ci++){
            var res=evalXL(tv[0],cb[ci][0],tv[1],cb[ci][1],tv[2]);
            if(res==null)continue;
            if(fixed[3]){if(res!==tv[3])continue;}
            else{if(res<1||res>72)continue;}
            keys.forEach(function(k,i){if(!fixed[i])V[k]=tv[i];});
            if(!fixed[3])V[keys[3]]=res;
            OPS[e.id]={op1:cb[ci][0],op2:cb[ci][1]}; return;
          }
        }
        vFailed=true;
      } else {
        // 5-cell V: 3 num pts (A,B,C)
        var ops=useOps.slice().sort(function(){return Math.random()-0.5;});
        for(var t=0;t<400;t++){
          var op=ops[t%ops.length];
          var av=fixed[0]?vals[0]:ri(1,9),bv=fixed[1]?vals[1]:ri(1,9);
          var cv=ev(av,op,bv);
          if(cv==null||cv<1||cv>72||!Number.isInteger(cv))continue;
          if(op==='x'&&(av<1||av>9||bv<1||bv>9))continue;
          if(op==='/'&&(bv<=0||av%bv!==0))continue;
          if(fixed[2]&&cv!==vals[2])continue;
          if(!fixed[0])V[keys[0]]=av; if(!fixed[1])V[keys[1]]=bv;
          if(!fixed[2])V[keys[2]]=cv;
          OPS[e.id]=op; return;
        }
        // 5-cell V fallback
        var av=fixed[0]?vals[0]:ri(1,9),bv=fixed[1]?vals[1]:ri(1,9);
        var cv=av+bv;
        if(fixed[2]&&cv!==vals[2]){
          // Can't satisfy with +, just force
          if(!fixed[0])V[keys[0]]=1; if(!fixed[1])V[keys[1]]=2; if(!fixed[2])V[keys[2]]=3;
        } else {
          if(!fixed[0])V[keys[0]]=av; if(!fixed[1])V[keys[1]]=bv;
          if(!fixed[2])V[keys[2]]=cv;
        }
        OPS[e.id]='+';
      }
    });
    if(vFailed)continue;

    // Verify all equations
    var allOk=tmpl.every(function(e){
      var pts=eqNumPts(e),ops=OPS[e.id];
      if(!ops)return false;
      var vals=pts.map(function(p){return V[nk(p)];});
      if(vals.some(function(v){return v==null;}))return false;
      return resultMatchesEq(e,vals,ops);
    });
    if(allOk)return{V:V,OPS:OPS};
  }

  // Absolute fallback — pure addition only, respecting all fixed crossing values
  var V={},OPS={};
  hEqs.forEach(function(e){
    var pts=eqNumPts(e),keys=pts.map(nk);
    if(e.xl){
      if(V[keys[0]]==null)V[keys[0]]=ri(1,9);
      if(V[keys[1]]==null)V[keys[1]]=ri(1,9);
      if(V[keys[2]]==null)V[keys[2]]=ri(1,9);
      if(V[keys[3]]==null)V[keys[3]]=V[keys[0]]+V[keys[1]]+V[keys[2]];
      OPS[e.id]={op1:'+',op2:'+'};
    } else {
      if(V[keys[0]]==null)V[keys[0]]=ri(1,9);
      if(V[keys[1]]==null)V[keys[1]]=ri(1,9);
      if(V[keys[2]]==null)V[keys[2]]=V[keys[0]]+V[keys[1]];
      OPS[e.id]='+';
    }
  });
  vEqs.forEach(function(e){
    var pts=eqNumPts(e),keys=pts.map(nk);
    var fixed=keys.map(function(k){return V[k]!=null;});
    var vals=keys.map(function(k){return V[k];});
    if(e.xl){
      // Try to find addition combo that satisfies all fixed values
      for(var t=0;t<400;t++){
        var tv=vals.map(function(v,i){return fixed[i]?v:ri(1,9);});
        var res=tv[0]+tv[1]+tv[2];
        if(fixed[3]){if(res!==tv[3])continue;}
        else if(res<1||res>72)continue;
        keys.forEach(function(k,i){if(!fixed[i])V[k]=tv[i];});
        if(!fixed[3])V[keys[3]]=res;
        OPS[e.id]={op1:'+',op2:'+'}; return;
      }
      // Still stuck — force free values to make equation work, overwriting only non-fixed cells
      if(fixed[3]){
        // D is fixed; set A=1,B=1,C=D-2 if possible, else just set all free cells to 1 and fix D
        var d=vals[keys.indexOf(keys[3])];if(d==null)d=vals[3];
        var freeIdx=fixed.map(function(f,i){return f?-1:i;}).filter(function(i){return i>=0;});
        if(freeIdx.length===1&&d>=2){
          // Only one free operand; solve for it
          var fi=freeIdx[0];
          // A+B+C=D with two fixed, one free
          var sumFixed=0;
          [0,1,2].forEach(function(i){if(i!==fi&&fixed[i])sumFixed+=vals[i];});
          var freeVal=d-sumFixed;
          if(freeVal>=1&&freeVal<=9){V[keys[fi]]=freeVal;OPS[e.id]={op1:'+',op2:'+'};return;}
        }
      }
      // Absolute last resort: set everything free to 1, recompute result if free
      keys.forEach(function(k,i){if(!fixed[i])V[k]=1;});
      var a=V[keys[0]],b=V[keys[1]],c=V[keys[2]];
      if(!fixed[3])V[keys[3]]=a+b+c;
      OPS[e.id]={op1:'+',op2:'+'};
    } else {
      var av=fixed[0]?vals[0]:ri(1,9),bv=fixed[1]?vals[1]:ri(1,9);
      if(!fixed[0])V[keys[0]]=av; if(!fixed[1])V[keys[1]]=bv;
      if(!fixed[2])V[keys[2]]=av+bv; OPS[e.id]='+';
    }
  });
  return{V:V,OPS:OPS};
}

// Validate an equation in an XL template (may be 5-cell or 7-cell)
function valEqXL(e,CM,OPS){
  var pts=eqNumPts(e);
  function g(p){var c=CM[nk(p)];return c?c.isBlank?c.value:(c.answer!=null?c.answer:null):null;}
  var ops=OPS[e.id];
  if(!ops)return 'bad';
  if(e.xl){
    var a=g(pts[0]),b=g(pts[1]),c=g(pts[2]),d=g(pts[3]);
    if(a==null||b==null||c==null||d==null)return 'inc';
    return evalXL(a,ops.op1,b,ops.op2,c)===d?'ok':'bad';
  } else {
    var a=g(pts[0]),b=g(pts[1]),c=g(pts[2]);
    if(a==null||b==null||c==null)return 'inc';
    return ev(a,ops,b)===c?'ok':'bad';
  }
}

// canSolveXL: can the player solve the XL equation given the blank pattern?
function canSolveXL(blanks,vals,ops){
  if(!ops)return false;
  var nblanks=blanks.filter(Boolean).length;
  if(nblanks===0)return true;
  if(nblanks===4)return false; // all blank — unsolvable
  var a=vals[0],b=vals[1],c=vals[2],d=vals[3];

  if(nblanks===1){
    if(blanks[3]){var r=evalXL(a,ops.op1,b,ops.op2,c);return r!=null;}
    if(blanks[0])for(var x=1;x<=9;x++){if(evalXL(x,ops.op1,b,ops.op2,c)===d)return true;}
    if(blanks[1])for(var x=1;x<=9;x++){if(evalXL(a,ops.op1,x,ops.op2,c)===d)return true;}
    if(blanks[2])for(var x=1;x<=9;x++){if(evalXL(a,ops.op1,b,ops.op2,x)===d)return true;}
    return false;
  }
  if(nblanks===2){
    if(blanks[3]){
      if(blanks[0])for(var x=1;x<=9;x++){if(evalXL(x,ops.op1,b,ops.op2,c)!=null)return true;}
      if(blanks[1])for(var x=1;x<=9;x++){if(evalXL(a,ops.op1,x,ops.op2,c)!=null)return true;}
      if(blanks[2])for(var x=1;x<=9;x++){if(evalXL(a,ops.op1,b,ops.op2,x)!=null)return true;}
      return false;
    }
    // Two of A/B/C blank, D known — check if any pair in 1-9 works
    if(blanks[0]&&blanks[1])for(var x=1;x<=9;x++)for(var y=1;y<=9;y++){if(evalXL(x,ops.op1,y,ops.op2,c)===d)return true;}
    if(blanks[0]&&blanks[2])for(var x=1;x<=9;x++)for(var y=1;y<=9;y++){if(evalXL(x,ops.op1,b,ops.op2,y)===d)return true;}
    if(blanks[1]&&blanks[2])for(var x=1;x<=9;x++)for(var y=1;y<=9;y++){if(evalXL(a,ops.op1,x,ops.op2,y)===d)return true;}
    return false;
  }
  if(nblanks===3){
    // Three blanks — D must be known (result given)
    if(blanks[3])return false; // D blank too — hopeless
    // A, B, C all blank, D known — check if any triple works
    for(var x=1;x<=9;x++)for(var y=1;y<=9;y++)for(var z=1;z<=9;z++){
      if(evalXL(x,ops.op1,y,ops.op2,z)===d)return true;
    }
    return false;
  }
  return false;
}

function requiredValXL(e,k,BS,CM,OPS){
  var pts=eqNumPts(e);
  var ops=OPS[e.id]; if(!ops)return null;
  function kv(key){return BS[key]?null:(CM[key]?CM[key].answer:null);}
  var keys=pts.map(nk);
  var nBlanks=keys.filter(function(key){return BS[key];}).length;
  if(nBlanks!==1)return null;
  if(e.xl){
    var kA=keys[0],kB=keys[1],kC=keys[2],kD=keys[3];
    var a=kv(kA),b=kv(kB),c=kv(kC),d=kv(kD);
    if(k===kD&&a!=null&&b!=null&&c!=null)return evalXL(a,ops.op1,b,ops.op2,c);
    if(k===kA&&b!=null&&c!=null&&d!=null){for(var x=1;x<=9;x++)if(evalXL(x,ops.op1,b,ops.op2,c)===d)return x;}
    if(k===kB&&a!=null&&c!=null&&d!=null){for(var x=1;x<=9;x++)if(evalXL(a,ops.op1,x,ops.op2,c)===d)return x;}
    if(k===kC&&a!=null&&b!=null&&d!=null){for(var x=1;x<=9;x++)if(evalXL(a,ops.op1,b,ops.op2,x)===d)return x;}
  } else {
    var kA=keys[0],kB=keys[1],kC=keys[2];
    var a=kv(kA),b=kv(kB),c=kv(kC);
    if(k===kC&&a!=null&&b!=null)return ev(a,ops,b);
    if(k===kA&&b!=null&&c!=null){for(var x=1;x<=72;x++)if(ev(x,ops,b)===c)return x;}
    if(k===kB&&a!=null&&c!=null){for(var x=1;x<=72;x++)if(ev(a,ops,x)===c)return x;}
  }
  return null;
}

// [v1.44] Fixpoint solvability oracle. Given a blank-set BS and the
// puzzle's cell map, repeatedly walks every equation looking for ones
// with exactly one remaining blank (so requiredValXL can pin it),
// "fills in" that cell in a working copy of BS, and loops. When an
// iteration adds nothing new, return whether ALL number cells in BS
// have been resolved.
//
// This is the missing piece in the old generator: requiredValXL only
// does single-step deductions, but real puzzle solving chains them.
// An equation can have 4 blanks today and still be solvable tomorrow
// once two crossing equations resolve. Without this propagator the
// generator over-restores givens; with it we can be much more
// aggressive about blanking.
//
// Returns true iff every key in BS is reachable through the chain.
// [v1.48] Solvability oracle using arc consistency. Single-step
// forward propagation (the v1.44 version) could only resolve an
// equation when exactly one of its cells was blank. That meant
// equations with 2 blanks blocked all progress, even when the
// remaining candidate space was actually narrow enough for a human
// solver to deduce the answer. New approach: maintain a CANDIDATE SET
// for each blank cell, and iteratively narrow each cell's candidates
// to only values consistent with at least one assignment of the other
// blanks in each equation it belongs to. When a candidate set reaches
// size 1, the cell is resolved. Iterates until fixpoint.
//
// This catches deductions like:
//   A + B = 10, A in {1..9}, B in {1..9}
//   A in {1,2,3,4,5,6,7,8,9} → all keep B in valid range, both stay {1..9}
//   But: A * B = 24, A in {1..9}, B in {1..9}
//   → A in {3,4,6,8}, B in {3,4,6,8} (only divisors of 24 within range)
//   If a crossing then pins A=8, B=3, equation resolves.
//
// Complexity: O(passes × equations × cellsPerEq × maxCandidates²) per
// call, bounded by total blanks. Fast in practice — no recursion,
// no search tree explosion.
function isSolvableViaPropagation(tmpl,BS,CM,OPS){
  // [v1.48] Hard work budget. If we can't decide in 200k ops, bail out
  // and return false (conservative — caller will restore one more cell
  // and try again). Prevents pathological puzzles from hanging the page.
  var budget=50000;
  // Build candidate set for each blank cell. Operands are {1..9}.
  // Result cells (idx 2 of standard, idx 3 of XL) can be larger;
  // bound by the cell's true answer for safety (we know it must
  // equal CM[k].answer ultimately).
  var cands={};
  for(var k in BS){
    if(!BS[k])continue;
    var c=CM[k];if(!c)continue;
    var trueA=c.answer;
    var maxV=9;
    if(trueA!=null && trueA>9)maxV=trueA;
    var s={};
    for(var v=1;v<=maxV;v++)s[v]=true;
    cands[k]=s;
  }
  // Helper: read effective value for a cell. If not in cands, it's
  // a given (return CM[k].answer). If in cands and the candidate set
  // has size 1, return that single value. Else null.
  function eff(k){
    if(!cands[k]){
      var c=CM[k];return c?c.answer:null;
    }
    var keys=Object.keys(cands[k]);
    if(keys.length===1)return parseInt(keys[0],10);
    return null;
  }
  // Process one equation: narrow candidates of its blank cells.
  // Returns true if any candidate was eliminated.
  function processEq(e){
    var pts=eqNumPts(e);
    var keys=pts.map(nk);
    var ops=OPS[e.id];
    var blanks=[];
    for(var j=0;j<keys.length;j++)if(cands[keys[j]])blanks.push(j);
    if(blanks.length===0)return false; // all resolved
    var changed=false;
    if(e.xl){
      // For each blank cell, find which of its candidates is consistent
      // with SOME assignment of the OTHER cells (givens or blank).
      for(var bi=0;bi<blanks.length;bi++){
        var idx=blanks[bi];
        var k=keys[idx];
        var supported={};
        var myCands=Object.keys(cands[k]).map(Number);
        // For each candidate value of this cell, check if there's
        // an assignment of the other 3 cells (each from its own
        // candidate set or fixed value) that satisfies the equation.
        var otherKeys=[keys[0],keys[1],keys[2],keys[3]];
        for(var mi=0;mi<myCands.length;mi++){
          var myV=myCands[mi];
          // Fixed values per slot
          var slot=[null,null,null,null];
          slot[idx]=myV;
          // Iterate other slots; for each, get candidates or fixed
          var support=function(s0,s1,s2,s3){
            return evalXL(s0,ops.op1,s1,ops.op2,s2)===s3;
          };
          // Try all combinations of other slots' candidate values.
          // Bounded: each slot has up to 9 candidates, so up to 9^3=729 per check.
          // For 4-cell XL we have 3 other slots, so worst case 9*9*9 = 729 attempts.
          var found=false;
          var slotCands=[];
          for(var s=0;s<4;s++){
            if(s===idx){slotCands.push([myV]);continue;}
            var sk=otherKeys[s];
            if(cands[sk])slotCands.push(Object.keys(cands[sk]).map(Number));
            else slotCands.push([CM[sk]?CM[sk].answer:null]);
          }
          // Brute force over slotCands
          outer:
          for(var s0i=0;s0i<slotCands[0].length;s0i++)
          for(var s1i=0;s1i<slotCands[1].length;s1i++)
          for(var s2i=0;s2i<slotCands[2].length;s2i++)
          for(var s3i=0;s3i<slotCands[3].length;s3i++){
            if(--budget<=0)return 'budget';
            var v0=slotCands[0][s0i],v1=slotCands[1][s1i],v2=slotCands[2][s2i],v3=slotCands[3][s3i];
            if(v0==null||v1==null||v2==null||v3==null)continue;
            if(support(v0,v1,v2,v3)){found=true;break outer;}
          }
          if(found)supported[myV]=true;
        }
        // Update cands[k] to only supported values.
        var keep={};var origCount=Object.keys(cands[k]).length;
        for(var v in supported)keep[v]=true;
        var newCount=Object.keys(keep).length;
        if(newCount===0)return null; // contradiction
        if(newCount<origCount){
          cands[k]=keep;
          changed=true;
          // If reduced to 1, resolve.
          if(newCount===1){
            // We'll let the outer loop notice; just stop tracking
          }
        }
      }
    } else {
      // 3-cell standard: A op B = C
      var idxA=0,idxB=1,idxC=2;
      var kA=keys[0],kB=keys[1],kC=keys[2];
      for(var bi=0;bi<blanks.length;bi++){
        var idx=blanks[bi];
        var k=keys[idx];
        var supported={};
        var slotCands=[];
        for(var s=0;s<3;s++){
          var sk=keys[s];
          if(cands[sk])slotCands.push(Object.keys(cands[sk]).map(Number));
          else slotCands.push([CM[sk]?CM[sk].answer:null]);
        }
        for(var ai=0;ai<slotCands[0].length;ai++)
        for(var bi2=0;bi2<slotCands[1].length;bi2++)
        for(var ci=0;ci<slotCands[2].length;ci++){
          if(--budget<=0)return 'budget';
          var va=slotCands[0][ai],vb=slotCands[1][bi2],vc=slotCands[2][ci];
          if(va==null||vb==null||vc==null)continue;
          if(ev(va,ops,vb)===vc){
            if(idx===0)supported[va]=true;
            else if(idx===1)supported[vb]=true;
            else supported[vc]=true;
          }
        }
        var keep={};
        for(var v in supported)keep[v]=true;
        var origCount=Object.keys(cands[k]).length;
        var newCount=Object.keys(keep).length;
        if(newCount===0)return null; // contradiction
        if(newCount<origCount){
          cands[k]=keep;
          changed=true;
        }
      }
    }
    return changed;
  }
  // Iterate until no candidates can be narrowed further.
  var maxPasses=Object.keys(cands).length*4+4;
  for(var pass=0;pass<maxPasses;pass++){
    var anyChange=false;
    for(var i=0;i<tmpl.length;i++){
      var r=processEq(tmpl[i]);
      if(r==='budget')return false; // budget exhausted: conservative reject
      if(r===null)return false; // contradiction
      if(r===true)anyChange=true;
    }
    // Resolve cells whose candidate set is now size 1
    for(var k in cands){
      var keys2=Object.keys(cands[k]);
      if(keys2.length===1){
        // Verify against true answer
        var trueA=CM[k]?CM[k].answer:null;
        var v=parseInt(keys2[0],10);
        if(trueA!=null && v!==trueA)return false;
        delete cands[k];
        anyChange=true;
      }
    }
    if(!anyChange)break;
  }
  // Solvable iff all cells resolved
  for(var k in cands)return false;
  return true;
}

function selectBlanksXL(tmpl,CM,OPS,diff){
  for(var attempt=0;attempt<120;attempt++){
    var BS={};
    for(var i=0;i<tmpl.length;i++){
      var e=tmpl[i];
      var pts=eqNumPts(e);
      var last=pts.length-1; // index of result (2 for 5-cell, 3 for 7-cell)
      var nOps=pts.length-1; // number of operands (2 or 3)
      if(diff==='easy'){
        BS[nk(pts[last])]=true;
      } else if(diff==='medium'){
        BS[nk(pts[last])]=true;
        BS[nk(pts[Math.floor(Math.random()*nOps)])]=true;
      } else {
        // Hard: blank as many cells as possible.
        // For 7-cell: blank result (D) + 2 random operands (3 total)
        // For 5-cell: blank result + 1 operand (2 total)
        // Then the crossing-consistency pass will further constrain things.
        // We deliberately also sometimes blank crossing cells to force multi-equation deduction.
        if(e.xl){
          // [v1.42] Hard: always blank all 4 numbers (D + all 3 operands).
          // Was: D + 2 operands always, with 50% chance for 3rd operand.
          // The restore-minimum-givens pass below will unblank ONE cell per
          // equation if crossings can't constrain it, so solvability is
          // preserved while pushing the average blank count higher.
          BS[nk(pts[3])]=true;
          BS[nk(pts[0])]=true;
          BS[nk(pts[1])]=true;
          BS[nk(pts[2])]=true;
        } else {
          // 5-cell: blank result + both operands (all blank) — crossing may constrain
          BS[nk(pts[0])]=true;BS[nk(pts[1])]=true;BS[nk(pts[2])]=true;
        }
      }
    }
    // Hard mode: after blanking all cells, restore minimum givens to make each equation solvable.
    // For 7-cell: need at least 1 given (can solve with 3 blanks if D known, or 2 blanks + D).
    // For 5-cell: need at least 1 given.
    // [Equil 1.29] Sort criterion: prefer cells with SMALL values
    // (1, 2, 3) for the restored-given role, keeping larger values
    // blank. This means the bank ends up with mostly 4-9 tiles instead
    // of being dominated by 1's and 2's. Tie-breaker: cells with more
    // crossing equations (better constraint propagation).
    if(diff==='hard'){
      // [v1.44] Use the global propagation oracle instead of the old
      // local-only approach. Strategy:
      //   1. Start with ALL num cells blanked (already done above for XL).
      //   2. If the puzzle is already solvable via chained one-step
      //      deductions (isSolvableViaPropagation), we're done — leave
      //      everything blank.
      //   3. If not, repeatedly find the equation where local solving
      //      fails worst, restore its smallest-value cell as a given,
      //      and re-test. Stop when the puzzle becomes
      //      propagation-solvable or when we run out of restoration
      //      candidates.
      // This produces dramatically more blanks than the old per-
      // equation greedy restore, since equations whose values are
      // pinned by chains of crossings need zero of their own givens.
      var safety=0;
      while(safety++ < 200 && !isSolvableViaPropagation(tmpl,BS,CM,OPS)){
        // Find an equation that, under current BS, can't yet be
        // resolved by chained deductions starting from itself.
        // Concretely: pick an equation whose blanks > 1 AND whose
        // cells aren't being filled in by the propagator. Restore
        // the smallest-value cell of any such equation.
        var picked=null;
        // Compute which keys are currently unresolvable via
        // propagation (i.e., remain blank after the propagator runs).
        var workTest={};
        for(var k in BS)if(BS[k])workTest[k]=true;
        var maxPP=Object.keys(workTest).length+2;
        for(var pp=0;pp<maxPP;pp++){
          var ch=false;
          for(var ii=0;ii<tmpl.length;ii++){
            var ee=tmpl[ii],pps=eqNumPts(ee);
            var bk=[];
            for(var jj=0;jj<pps.length;jj++){var kk=nk(pps[jj]);if(workTest[kk])bk.push(kk);}
            if(bk.length!==1)continue;
            var rrv=requiredValXL(ee,bk[0],workTest,CM,OPS);
            if(rrv!==null){delete workTest[bk[0]];ch=true;}
          }
          if(!ch)break;
        }
        // workTest now contains keys that propagation cannot resolve.
        // Pick the cell with smallest value among these to restore.
        var unresolved=Object.keys(workTest);
        if(unresolved.length===0)break;
        unresolved.sort(function(a,b){
          var va=CM[a]?(CM[a].answer||99):99, vb=CM[b]?(CM[b].answer||99):99;
          if(va!==vb)return va-vb;
          return (CM[b]?CM[b].eqs.length:0)-(CM[a]?CM[a].eqs.length:0);
        });
        picked=unresolved[0];
        if(!picked)break;
        delete BS[picked]; // restore as a given
      }
      // [v1.48] PRUNE PASS. The restore loop above uses the SINGLE-STEP
      // propagator to identify unresolvable cells (it's faster than
      // arc consistency and good enough to make incremental progress).
      // But that picker can over-restore: cells that would actually be
      // resolved by arc consistency get restored anyway. After the
      // loop terminates with arc-consistency-solvable, walk every
      // restored cell in random order, try re-blanking it, and accept
      // the change if arc consistency still says solvable. This
      // sharpens the final blank count to roughly what arc consistency
      // can support. Bounded by wall-clock to avoid pathological
      // slowness on large templates.
      var restored=[];
      for(var k in CM){
        if(CM[k].role==='num' && !BS[k])restored.push(k);
      }
      restored.sort(function(){return Math.random()-0.5;});
      var pruneStart=Date.now();
      var pruneBudgetMs=300; // hard ceiling for prune pass
      for(var pi=0;pi<restored.length;pi++){
        if(Date.now()-pruneStart>pruneBudgetMs)break;
        var rk=restored[pi];
        BS[rk]=true; // tentatively re-blank
        if(!isSolvableViaPropagation(tmpl,BS,CM,OPS)){
          delete BS[rk]; // doesn't work, restore it
        }
      }
    }
    // Ensure at least 1 blank per equation (safety net for easy/medium)
    for(var i=0;i<tmpl.length;i++){
      var pts=eqNumPts(tmpl[i]);
      if(!pts.some(function(p){return BS[nk(p)];}))BS[nk(pts[pts.length-1])]=true;
    }
    // [v1.44] Validate: puzzle must be solvable via chained one-step
    // deductions across all equations. Was: a single-step propagation
    // (each cell could only be resolved if its other equation was
    // already fully filled), which forced over-restoration of givens.
    // Now: keeps applying requiredValXL to any equation with exactly
    // one blank until fixpoint, accepting any blank distribution that
    // resolves completely.
    var ok=isSolvableViaPropagation(tmpl,BS,CM,OPS);
    if(!ok)continue;
    // Crossing consistency
    for(var k in BS){
      if(!CM[k]||CM[k].eqs.length<2)continue;
      var rvs=[];
      for(var ei=0;ei<CM[k].eqs.length;ei++){
        var e=null;for(var j=0;j<tmpl.length;j++)if(tmpl[j].id===CM[k].eqs[ei]){e=tmpl[j];break;}
        if(!e)continue;
        var rv=requiredValXL(e,k,BS,CM,OPS);
        if(rv!=null)rvs.push(rv);
      }
      if(rvs.length>=2){for(var ri2=1;ri2<rvs.length;ri2++){if(rvs[ri2]!==rvs[0]){ok=false;break;}}if(!ok)break;}
    }
    if(ok)return BS;
  }
  // Fallback: blank result of each equation
  var BS={};
  for(var i=0;i<tmpl.length;i++){var pts=eqNumPts(tmpl[i]);BS[nk(pts[pts.length-1])]=true;}
  return BS;
}
function buildCellMap(tmpl,V,OPS){
  var CM={};
  for(var i=0;i<tmpl.length;i++){
    var e=tmpl[i];
    var s=e.xl?seqXL(e.dir,e.c,e.r):seq(e.dir,e.c,e.r);
    var len=s.length; // 5 or 7
    for(var j=0;j<len;j++){
      var p=s[j],k=nk(p);
      if(!CM[k])CM[k]={c:p.c,r:p.r,role:null,display:null,answer:null,value:null,isBlank:false,isGiven:false,eqs:[]};
      var cell=CM[k];
      if(cell.eqs.indexOf(e.id)<0)cell.eqs.push(e.id);
      if(e.xl){
        // XL: num at 0,2,4,6; op at 1,3; eq at 5
        if(j===0||j===2||j===4||j===6){cell.role='num';cell.answer=V[k];cell.value=V[k];}
        else if((j===1||j===3)&&cell.role!=='num')cell.role='op';
        else if(j===5&&cell.role!=='num'&&cell.role!=='op'){cell.role='eq';cell.display='=';}
      } else {
        // Standard: num at 0,2,4; op at 1; eq at 3
        if(j===0||j===2||j===4){cell.role='num';cell.answer=V[k];cell.value=V[k];}
        else if(j===1&&cell.role!=='num')cell.role='op';
        else if(j===3&&cell.role!=='num'&&cell.role!=='op'){cell.role='eq';cell.display='=';}
      }
    }
  }
  // Set operator display labels
  for(var i=0;i<tmpl.length;i++){
    var e=tmpl[i];
    var s=e.xl?seqXL(e.dir,e.c,e.r):seq(e.dir,e.c,e.r);
    var ops=OPS[e.id];
    if(e.xl){
      // XL has two operators: ops={op1,op2}
      var op1cell=CM[nk(s[1])],op2cell=CM[nk(s[3])];
      if(op1cell&&op1cell.role==='op')op1cell.display=SYM[ops&&ops.op1]||'+';
      if(op2cell&&op2cell.role==='op')op2cell.display=SYM[ops&&ops.op2]||'+';
    } else {
      var oc=CM[nk(s[1])];
      if(oc&&oc.role==='op')oc.display=SYM[ops]||'+';
    }
  }
  return CM;
}

// ═══════════════════════════════════════════════════════════
// SOLVABILITY CHECK
// ═══════════════════════════════════════════════════════════
function canSolve(bA,bB,bC,vA,vB,vC,op){
  var n=(bA?1:0)+(bB?1:0)+(bC?1:0);
  if(n===0)return true;
  if(n===3)return false;
  if(!bA&&!bB&&bC){var c=ev(vA,op,vB);return c!=null&&c>=1&&c<=72;}
  if(!bA&&bB&&!bC){
    if(op==='+'){var b=vC-vA;return Number.isInteger(b)&&b>=1&&b<=72;}
    if(op==='-'){var b=vA-vC;return Number.isInteger(b)&&b>=1&&b<=72;}
    if(op==='x'){if(vA>0&&vC%vA===0){var b=vC/vA;return b>=1&&b<=9;}return false;}
    if(op==='/'){if(vC>0&&vA%vC===0){var b=vA/vC;return b>=1&&b<=9;}return false;} // A/B=C -> B=A/C
  }
  if(bA&&!bB&&!bC){
    if(op==='+'){var a=vC-vB;return Number.isInteger(a)&&a>=1&&a<=72;}
    if(op==='-'){var a=vC+vB;return Number.isInteger(a)&&a>=1&&a<=72;}
    if(op==='x'){if(vB>0&&vC%vB===0){var a=vC/vB;return a>=1&&a<=9;}return false;}
    if(op==='/'){var a=vC*vB;return Number.isInteger(a)&&a>=1&&a<=72;} // A/B=C -> A=C*B
  }
  if(!bA&&bB&&bC){for(var b=1;b<=18;b++){var c=ev(vA,op,b);if(c!=null&&c>=1&&c<=72)return true;}return false;}
  if(bA&&!bB&&bC){for(var a=1;a<=18;a++){var c=ev(a,op,vB);if(c!=null&&c>=1&&c<=72)return true;}return false;}
  if(bA&&bB&&!bC){
    if(op==='+'){for(var a=1;a<vC;a++){if(vC-a>=1&&vC-a<=72)return true;}return false;}
    if(op==='-'){for(var b=1;b<=20;b++){if(vC+b>=1&&vC+b<=72)return true;}return false;}
    if(op==='x'){for(var a=1;a<=9;a++){if(vC%a===0){var b=vC/a;if(Number.isInteger(b)&&b>=1&&b<=9)return true;}}return false;}
    if(op==='/'){for(var b=1;b<=9;b++){var a=vC*b;if(a>=1&&a<=72)return true;}return false;}
  }
  return false;
}

function requiredVal(e,k,BS,CM,OPS){
  var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
  var op=OPS[e.id];
  function kv(key){return BS[key]?null:(CM[key]?CM[key].answer:null);}
  var vA=kv(kA),vB=kv(kB),vC=kv(kC);
  if(k===kA){
    if(vB==null||vC==null)return null;
    if(op==='+')return vC-vB;
    if(op==='-')return vC+vB;
    if(op==='x'&&vB>0&&vC%vB===0)return vC/vB;
    if(op==='/'&&vB>=1)return vC*vB;  // A÷B=C → A=C×B
  }
  if(k===kB){
    if(vA==null||vC==null)return null;
    if(op==='+')return vC-vA;
    if(op==='-')return vA-vC;
    if(op==='x'&&vA>0&&vC%vA===0)return vC/vA;
    if(op==='/'&&vC>=1&&vA%vC===0)return vA/vC;  // A÷B=C → B=A/C
  }
  if(k===kC){if(vA==null||vB==null)return null;return ev(vA,op,vB);}
  return null;
}

// ═══════════════════════════════════════════════════════════
// BLANK SELECTION
// difficulty: 'easy'|'medium'|'hard'
// Rule: never leave all 3 num cells of any equation as given
// ═══════════════════════════════════════════════════════════
// [v3.04] Target blank counts per (size, diff).
// [v3.08] Restructured to a flat lookup table — three real difficulty
// levels via blank count, with operators as a secondary axis. Earlier
// versions had Easy and Medium share blank count (relying on +/- vs
// ×/÷ to carry the difference) which in practice felt nearly identical
// at the 1.5+ blanks/equation density needed. Now Easy is genuinely
// lighter (~1 blank/eq), Medium adds crossing-deduction (~1.2 b/eq),
// and Hard forces multi-step chains via 3-blank equations (~1.7 b/eq).
//
// [v3.18] Large Hard reverted from 30 to 26. Target=30 was too tight
// for the values generator — failed retries cascaded through fallback
// chain ending at Medium-size templates rendering as Large (~4% of
// rolls per user report). Until bigger Large templates arrive,
// target=26 is the highest reliable value.
//
// Average blanks-per-equation by (size, diff):
//   Small  Easy 0.75  Med 1.1   Hard 1.6   (8 eq templates)
//   Medium Easy 0.85  Med 1.15  Hard 1.6   (13 eq templates)
//   Large  Easy 1.07  Med 1.5   Hard 1.85  (14 eq templates)
//
// Jumbo (xl2) is intentionally NOT in this table — its blanks come
// from selectBlanksXL which has its own logic for the 7-cell
// equation format. Adding xl2 here would do nothing because xl2
// puzzles never reach this function.
function targetBlanks(size,diff){
  var table={
    small:  {easy:6,  medium:9,  hard:13},
    medium: {easy:11, medium:15, hard:21},
    large:  {easy:15, medium:21, hard:26}
  };
  var row=table[size];
  if(!row)return null;
  return row[diff]!=null?row[diff]:null;
}

// [v3.04] Wrap canSolve so that all-3-blank is allowed for Hard mode
// IF every cell in the equation is a crossing cell (eqs.length >= 2).
// All-3-blank with an uncrossed cell would leave that cell with no path
// to a value — rejected. Easy and Medium retain the strict canSolve
// behavior (n===3 always rejected).
function canSolveWithCrossings(bA,bB,bC,vA,vB,vC,op,allow3,cellA,cellB,cellC){
  var n=(bA?1:0)+(bB?1:0)+(bC?1:0);
  if(n===3){
    if(!allow3)return false;
    // All-3-blank only works if every cell is a crossing.
    var aOK=cellA&&cellA.eqs&&cellA.eqs.length>=2;
    var bOK=cellB&&cellB.eqs&&cellB.eqs.length>=2;
    var cOK=cellC&&cellC.eqs&&cellC.eqs.length>=2;
    return aOK&&bOK&&cOK;
  }
  return canSolve(bA,bB,bC,vA,vB,vC,op);
}

// ═══════════════════════════════════════════════════════════
// BLANK SELECTION
// [v3.04] Target-based: hit a fixed blank count per (size, diff)
// instead of "blanks per equation." Bank size is now consistent
// across templates within a size, so "best time" means something.
// difficulty: 'easy'|'medium'|'hard'
// Rule: every equation has at least 1 blank. All-3-blank allowed
// in Hard mode only, and only if all 3 cells are crossings.
// ═══════════════════════════════════════════════════════════
function selectBlanks(tmpl,CM,OPS,diff,size){
  var target=targetBlanks(size,diff);
  // Defensive fallback: if target lookup failed (unknown size), behave
  // like pre-v3.04 — 1 blank per eq for easy, 2 for medium, blank-all-
  // restore-1 for hard. Won't be hit in current code but keeps the
  // function safe under future size additions.
  if(target==null)return _selectBlanksLegacy(tmpl,CM,OPS,diff);

  var allowAll3=(diff==='hard');
  // List of unique num cells (blank candidates).
  var allKeys=[];
  for(var k in CM)if(CM[k].role==='num')allKeys.push(k);

  for(var attempt=0;attempt<80;attempt++){
    var BS={};

    // Step 1: Always blank one solo (uncrossed) cell per equation if
    // available — these have to be blank or the equation has no work
    // for the player. If no solo, blank a crossed cell. This guarantees
    // the "every eq has at least 1 blank" rule.
    for(var i=0;i<tmpl.length;i++){
      var nc=numPts(tmpl[i]).map(function(p){return CM[nk(p)];}).filter(Boolean);
      var hasBlank=nc.some(function(c){return BS[nk(c)];});
      if(hasBlank)continue; // already covered by another eq's seed
      var solo=nc.filter(function(c){return c.eqs.length===1&&!BS[nk(c)];});
      var pool=solo.length?solo:nc.filter(function(c){return !BS[nk(c)];});
      if(!pool.length)continue;
      var pick=pool[ri(0,pool.length-1)];
      BS[nk(pick)]=true;
    }

    // Step 2: shuffle remaining candidates and add until we hit target.
    // [v3.21] On Hard, bias the ordering so cells that could complete a
    // 3-blank equation come first. Without this bias, the random order
    // tends to produce mostly 1-blank and 2-blank equations with only
    // occasional 3-blanks (avg ~1 per puzzle on TS-family). With the
    // bias, fully-crossed equations whose other cells are already blank
    // get prioritized, raising 3-blank density without changing target.
    var remaining=allKeys.filter(function(k){return !BS[k];});
    if(allowAll3){
      // Score each remaining cell:
      //   +3 if its equation is fully-crossed AND has 2 cells already blank
      //   +2 if its equation is fully-crossed AND has 1 cell already blank
      //   +1 if its equation is fully-crossed AND has 0 cells already blank
      //   +1 if its equation has 1 cell already blank (regardless of crossings)
      // Sort by score desc, with random tiebreaker.
      var cellScores={};
      for(var ri2=0;ri2<remaining.length;ri2++){
        var k=remaining[ri2],score=0;
        var cell=CM[k];
        if(cell&&cell.eqs){
          for(var ei=0;ei<cell.eqs.length;ei++){
            var eqId=cell.eqs[ei];
            var e=null;
            for(var j=0;j<tmpl.length;j++)if(tmpl[j].id===eqId){e=tmpl[j];break;}
            if(!e)continue;
            var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
            var blanksHere=(BS[kA]?1:0)+(BS[kB]?1:0)+(BS[kC]?1:0);
            var fullyCrossed=CM[kA]&&CM[kA].eqs.length>=2
                          && CM[kB]&&CM[kB].eqs.length>=2
                          && CM[kC]&&CM[kC].eqs.length>=2;
            if(fullyCrossed&&blanksHere===2)score+=3;
            else if(fullyCrossed&&blanksHere===1)score+=2;
            else if(fullyCrossed)score+=1;
            else if(blanksHere===1)score+=1;
          }
        }
        cellScores[k]=score+Math.random();
      }
      remaining.sort(function(a,b){return cellScores[b]-cellScores[a];});
    } else {
      remaining.sort(function(){return Math.random()-0.5;});
    }
    for(var ri2=0;ri2<remaining.length && Object.keys(BS).length<target;ri2++){
      var k=remaining[ri2];
      // Tentatively add and check local solvability
      BS[k]=true;
      var ok=true;
      for(var ei=0;ei<tmpl.length && ok;ei++){
        var e=tmpl[ei],pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
        if(!canSolveWithCrossings(
          !!BS[kA],!!BS[kB],!!BS[kC],
          CM[kA]&&CM[kA].answer,CM[kB]&&CM[kB].answer,CM[kC]&&CM[kC].answer,
          OPS[e.id],allowAll3,CM[kA],CM[kB],CM[kC])){ok=false;}
      }
      if(!ok)delete BS[k]; // back out
    }

    // Step 3: existing validation gauntlet (each eq solvable, crossings
    // agree, mul both-blank has bank values).
    var ok=true;
    for(var i=0;i<tmpl.length;i++){
      var e=tmpl[i],pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
      if(!canSolveWithCrossings(
        !!BS[kA],!!BS[kB],!!BS[kC],
        CM[kA]&&CM[kA].answer,CM[kB]&&CM[kB].answer,CM[kC]&&CM[kC].answer,
        OPS[e.id],allowAll3,CM[kA],CM[kB],CM[kC])){ok=false;break;}
    }
    if(!ok)continue;

    // Crossing cells must agree
    for(var k in BS){
      if(!CM[k]||CM[k].eqs.length<2)continue;
      var eqIds=CM[k].eqs,rvs=[];
      for(var ei=0;ei<eqIds.length;ei++){
        var e=null;for(var j=0;j<tmpl.length;j++)if(tmpl[j].id===eqIds[ei]){e=tmpl[j];break;}
        if(!e)continue;
        var rv=requiredVal(e,k,BS,CM,OPS);
        if(rv!==null)rvs.push(rv);
      }
      if(rvs.length>=2){for(var rii=1;rii<rvs.length;rii++){if(rvs[rii]!==rvs[0]){ok=false;break;}}if(!ok)break;}
    }
    if(!ok)continue;

    // Multiplication both-blank needs valid factor pair in bank
    var bankVals=[];
    for(var k in BS)if(CM[k]&&CM[k].role==='num')bankVals.push(CM[k].answer);
    for(var i=0;i<tmpl.length;i++){
      var e=tmpl[i];if(OPS[e.id]!=='x')continue;
      var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
      if(!BS[kA]||!BS[kB])continue;
      var needA=CM[kA]&&CM[kA].answer,needB=CM[kB]&&CM[kB].answer;
      if(needA==null||needB==null)continue;
      var cA=0,cB=0;
      for(var vi=0;vi<bankVals.length;vi++){if(bankVals[vi]===needA)cA++;if(bankVals[vi]===needB)cB++;}
      if(needA===needB){if(cA<2){ok=false;break;}}else{if(cA<1||cB<1){ok=false;break;}}
    }

    if(ok)return BS;
  }

  // Fallback: minimum blanks (1 solo per eq).
  return _selectBlanksLegacy(tmpl,CM,OPS,diff);
}

// [v3.04] Pre-v3.04 selectBlanks logic, used as fallback when the
// target-based system can't hit its goal in 80 attempts. Preserves
// the historical behavior so falling through doesn't visibly change
// difficulty: easy=1 blank/eq, medium=2 blanks/eq, hard=blank-all-
// then-restore-1-per-eq. Verbatim from v3.03 except the outermost
// retry loop (the caller already retried 80 times) and the validation
// gauntlet (caller already validated; if target failed it's because
// validation rejected too many configs, so legacy still has to pass
// validation independently).
function _selectBlanksLegacy(tmpl,CM,OPS,diff){
  for(var attempt=0;attempt<80;attempt++){
    var BS={};
    if(diff==='easy'){
      for(var i=0;i<tmpl.length;i++){
        var nc=numPts(tmpl[i]).map(function(p){return CM[nk(p)];}).filter(Boolean);
        var solo=nc.filter(function(c){return c.eqs.length===1&&!BS[nk(c)];});
        var pool=solo.length?solo:nc.filter(function(c){return !BS[nk(c)];});
        var chosen=(pool.length?pool:nc)[ri(0,(pool.length?pool:nc).length-1)];
        BS[nk(chosen)]=true;
      }
    } else if(diff==='medium'){
      for(var i=0;i<tmpl.length;i++){
        var nc=[].concat(numPts(tmpl[i]).map(function(p){return CM[nk(p)];}).filter(Boolean)).sort(function(){return Math.random()-.5;});
        var unc=nc.filter(function(c){return c.eqs.length===1;}),crs=nc.filter(function(c){return c.eqs.length>1;});
        var tb=unc.length>=2?unc.slice(0,2):unc.length===1?[unc[0]].concat(crs.slice(0,1)):nc.slice(0,2);
        tb.forEach(function(c){BS[nk(c)]=true;});
      }
    } else {
      for(var k in CM)if(CM[k].role==='num')BS[k]=true;
      for(var i=0;i<tmpl.length;i++){
        var nc=numPts(tmpl[i]).map(function(p){return CM[nk(p)];}).filter(Boolean);
        var solo=nc.filter(function(c){return c.eqs.length===1;});
        var pool=solo.length?solo:nc;
        var poolSorted=pool.slice().sort(function(a,b){
          var va=a.answer||99,vb=b.answer||99;
          if(va!==vb)return va-vb;
          return Math.random()-0.5;
        });
        var keeper=poolSorted[0];
        delete BS[nk(keeper)];
      }
    }
    // Force at least 1 blank per equation
    for(var i=0;i<tmpl.length;i++){
      var nc=numPts(tmpl[i]).map(function(p){return CM[nk(p)];}).filter(Boolean);
      var hasBlank=nc.some(function(c){return BS[nk(c)];});
      if(!hasBlank){
        var solo=nc.filter(function(c){return c.eqs.length===1;});
        var pick=(solo.length?solo:nc)[ri(0,(solo.length?solo:nc).length-1)];
        BS[nk(pick)]=true;
      }
    }
    // Validation: each eq locally solvable
    var ok=true;
    for(var i=0;i<tmpl.length;i++){
      var e=tmpl[i],pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
      if(!canSolve(!!BS[kA],!!BS[kB],!!BS[kC],CM[kA]&&CM[kA].answer,CM[kB]&&CM[kB].answer,CM[kC]&&CM[kC].answer,OPS[e.id])){ok=false;break;}
    }
    if(!ok)continue;
    // Crossing cells must agree
    for(var k in BS){
      if(!CM[k]||CM[k].eqs.length<2)continue;
      var eqIds=CM[k].eqs,rvs=[];
      for(var ei=0;ei<eqIds.length;ei++){
        var e=null;for(var j=0;j<tmpl.length;j++)if(tmpl[j].id===eqIds[ei]){e=tmpl[j];break;}
        if(!e)continue;
        var rv=requiredVal(e,k,BS,CM,OPS);
        if(rv!==null)rvs.push(rv);
      }
      if(rvs.length>=2){for(var rii=1;rii<rvs.length;rii++){if(rvs[rii]!==rvs[0]){ok=false;break;}}if(!ok)break;}
    }
    if(!ok)continue;
    // Mul both-blank bank check
    var bankVals=[];
    for(var k in BS)if(CM[k]&&CM[k].role==='num')bankVals.push(CM[k].answer);
    for(var i=0;i<tmpl.length;i++){
      var e=tmpl[i];if(OPS[e.id]!=='x')continue;
      var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
      if(!BS[kA]||!BS[kB])continue;
      var needA=CM[kA]&&CM[kA].answer,needB=CM[kB]&&CM[kB].answer;
      if(needA==null||needB==null)continue;
      var cA=0,cB=0;
      for(var vi=0;vi<bankVals.length;vi++){if(bankVals[vi]===needA)cA++;if(bankVals[vi]===needB)cB++;}
      if(needA===needB){if(cA<2){ok=false;break;}}else{if(cA<1||cB<1){ok=false;break;}}
    }
    if(ok)return BS;
  }
  // Last-resort: minimal solo-per-eq layout (always passes validation)
  var BS={};
  for(var i=0;i<tmpl.length;i++){
    var nc=numPts(tmpl[i]).map(function(p){return CM[nk(p)];}).filter(Boolean);
    var solo=nc.filter(function(c){return c.eqs.length===1;});
    if(solo.length)BS[nk(solo[0])]=true;
    else if(nc.length)BS[nk(nc[0])]=true;
  }
  return BS;
}

// ═══════════════════════════════════════════════════════════
// [v2.69] Display name for size keys. Internal SIZE strings
// ('small'/'medium'/'large'/'xl2') are kept as-is for
// localStorage-stats compatibility and code throughout the
// codebase. This helper just maps them to the human-facing
// label shown in masthead, share text, and stats screen.
// 'xl' is here for the same reason it's still in the stats
// screen list — historical records may exist.
// ═══════════════════════════════════════════════════════════
function sizeLabel(s){
  switch(s){
    case 'small':  return 'SMALL';
    case 'medium': return 'MEDIUM';
    case 'large':  return 'LARGE';
    case 'xl':     return 'XL';
    case 'xl2':    return 'JUMBO';
    default:       return (s||'').toUpperCase();
  }
}
window.sizeLabel = sizeLabel;

// [v4.63] Difficulty label helper. The internal DIFF values stay
// 'easy' / 'medium' / 'hard' so every persisted stat key, template
// pool reference, and localStorage record continues to resolve to
// the same buckets. Only the display labels change to avoid the
// "MEDIUM" collision between size and difficulty in the masthead
// subtitle.
// [v4.64] Per Sam: BEGINNER/INTERMEDIATE/ADVANCED was too long —
// "Intermediate" felt crammed in the menu button. Switched to
// EASY / LESS EASY / HARD which keeps the visual symmetry (Easy
// and Hard are similar length on the ends, Less Easy fits in the
// middle with room to breathe). Avoids the original two-MEDIUMs
// problem since the masthead now reads e.g. "SMALL · LESS EASY".
function diffLabel(d){
  switch(d){
    case 'easy':   return 'EASY';
    case 'medium': return 'LESS EASY';
    case 'hard':   return 'HARD';
    default:       return (d||'').toUpperCase();
  }
}
window.diffLabel = diffLabel;

// ═══════════════════════════════════════════════════════════
// BUILD PUZZLE
// ═══════════════════════════════════════════════════════════
function buildPuzzle(size,diff,_retry,_divRetry,_opts){
  // [v3.18 v2] DEBUG: clear stale fallback flag only on the outermost
  // call (not on recursive fallback calls which also have _retry=0).
  // _opts._isFallback is set by the recursive cascade calls below; if
  // unset, this is a fresh top-level call from the user.
  if(!_retry&&!_divRetry&&!(_opts&&_opts._isFallback))window._fallbackFrom=null;
  var isXL=size==='xl'||size==='xl2';
  var pool=size==='small'?TMPL_SMALL:size==='medium'?TMPL_MEDIUM:size==='large'?TMPL_LARGE:size==='xl2'?TMPL_XL2:TMPL_XL;
  // [v3.00] _pickTemplate replaces rp(pool) — same single-call interface,
  // but enforces no-recent-repeats per-size when not in daily mode.
  // [v3.18b] Reverted sticky-template-on-retry (was v3.18 v3). Sticky
  // retries caused values-gen failures on one template to consume all
  // 60 retries on that template before falling back, which in turn
  // caused the cascade to fire constantly. Without sticky, retries
  // re-pick from the pool which usually finds a template that
  // genNums can satisfy on this attempt.
  // [v3.18b] Build pick-options. _isRetry suppresses the pick counter
  // bump on retry recursions so the counter tracks user-facing rolls
  // rather than internal pick attempts.
  var pickOpts=_opts||{};
  if(_retry||_divRetry||(_opts&&_opts._isFallback)){
    pickOpts=Object.assign({},pickOpts,{_isRetry:true});
  }
  var tmpl=_pickTemplate(pool,size,pickOpts);

  // [v1.50] Shift the chosen template up so its topmost cell anchors
  // to row 0. Templates were authored with low-row content varying by
  // template — some have verticals starting at r:0, others start at
  // r:2, r:3, etc. The grid sizes itself to (maxRow + 1), so any
  // empty rows at the top stay as visible dead space at the top of
  // the puzzle. By computing the minimum row used across all sequences
  // and subtracting it from every equation's r, we keep the rendered
  // grid the same shape but anchored to the top — eliminating the 2-4
  // row blank band the user was seeing.
  var minR=Infinity;
  for(var ti=0;ti<tmpl.length;ti++){
    var ts=tmpl[ti].xl?seqXL(tmpl[ti].dir,tmpl[ti].c,tmpl[ti].r):seq(tmpl[ti].dir,tmpl[ti].c,tmpl[ti].r);
    for(var tj=0;tj<ts.length;tj++)if(ts[tj].r<minR)minR=ts[tj].r;
  }
  if(minR>0 && minR!==Infinity){
    // Shallow-copy each equation with its r adjusted. Mutating the
    // template arrays directly would corrupt the pool for subsequent
    // puzzles.
    tmpl=tmpl.map(function(e){
      var copy={};for(var k in e)copy[k]=e[k];
      copy.r=e.r-minR;
      return copy;
    });
  }

  var allowedOps=(diff==='easy')?['+','-']:['+','-','x','/'];
  var minDiv=(diff==='easy')?0
            :(size==='large'||size==='xl'||size==='xl2')?4
            :(size==='medium'?3:2);

  var r,V,OPS;
  if(isXL){
    r=genNumsXL(tmpl,allowedOps);V=r.V;OPS=r.OPS;
  } else {
    r=genNums(tmpl,allowedOps,minDiv);V=r.V;OPS=r.OPS;
  }

  var CM=buildCellMap(tmpl,V,OPS);

  var BS;
  if(isXL){
    BS=selectBlanksXL(tmpl,CM,OPS,diff);
  } else {
    BS=selectBlanks(tmpl,CM,OPS,diff,size);
  }

  for(var k in BS)if(CM[k]&&CM[k].role==='num'){CM[k].isBlank=true;CM[k].value=null;}
  for(var k in CM)if(CM[k].role==='num'&&!CM[k].isBlank)CM[k].isGiven=true;

  // Propagate blank answers from verified sources
  var verified={};
  for(var k in CM)if(CM[k].isGiven)verified[k]=true;
  var changed=true;
  for(var pass=0;pass<30&&changed;pass++){
    changed=false;
    for(var i=0;i<tmpl.length;i++){
      var e=tmpl[i],op=OPS[e.id];
      if(e.xl){
        var pts=numPtsXL(e);
        var kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]),kD=nk(pts[3]);
        var vA=verified[kA]?CM[kA].answer:null,vB=verified[kB]?CM[kB].answer:null;
        var vC=verified[kC]?CM[kC].answer:null,vD=verified[kD]?CM[kD].answer:null;
        var ops=op;
        if(BS[kD]&&!verified[kD]&&vA!=null&&vB!=null&&vC!=null&&ops){
          var nD=evalXL(vA,ops.op1,vB,ops.op2,vC);
          if(nD!=null&&Number.isInteger(nD)&&nD>=1&&nD<=200){CM[kD].answer=nD;verified[kD]=true;changed=true;}
        }
        // For A,B,C: try 1-9 range
        if(BS[kA]&&!verified[kA]&&vB!=null&&vC!=null&&vD!=null&&ops){
          for(var x=1;x<=9;x++){if(evalXL(x,ops.op1,vB,ops.op2,vC)===vD){CM[kA].answer=x;verified[kA]=true;changed=true;break;}}
        }
        if(BS[kB]&&!verified[kB]&&vA!=null&&vC!=null&&vD!=null&&ops){
          for(var x=1;x<=9;x++){if(evalXL(vA,ops.op1,x,ops.op2,vC)===vD){CM[kB].answer=x;verified[kB]=true;changed=true;break;}}
        }
        if(BS[kC]&&!verified[kC]&&vA!=null&&vB!=null&&vD!=null&&ops){
          for(var x=1;x<=9;x++){if(evalXL(vA,ops.op1,vB,ops.op2,x)===vD){CM[kC].answer=x;verified[kC]=true;changed=true;break;}}
        }
      } else {
        var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
        var vA=verified[kA]?CM[kA].answer:null,vB=verified[kB]?CM[kB].answer:null,vC=verified[kC]?CM[kC].answer:null;
        if(BS[kA]&&!verified[kA]&&vB!=null&&vC!=null){
          var nA=null;
          if(op==='+')nA=vC-vB;else if(op==='-')nA=vC+vB;
          else if(op==='x'&&vB>0&&vC%vB===0)nA=vC/vB;
          else if(op==='/'&&vB>=1)nA=vC*vB;
          if(nA!=null&&nA>=1&&nA<=72&&Number.isInteger(nA)){CM[kA].answer=nA;verified[kA]=true;changed=true;}
        }
        if(BS[kB]&&!verified[kB]&&vA!=null&&vC!=null){
          var nB=null;
          if(op==='+')nB=vC-vA;else if(op==='-')nB=vA-vC;
          else if(op==='x'&&vA>0&&vC%vA===0)nB=vC/vA;
          else if(op==='/'&&vC>=1&&vA%vC===0)nB=vA/vC;
          if(nB!=null&&nB>=1&&nB<=72&&Number.isInteger(nB)){CM[kB].answer=nB;verified[kB]=true;changed=true;}
        }
        if(BS[kC]&&!verified[kC]&&vA!=null&&vB!=null){var nC=ev(vA,op,vB);if(nC!=null&&nC>=1&&nC<=72&&Number.isInteger(nC)){CM[kC].answer=nC;verified[kC]=true;changed=true;}}
      }
    }
  }

  // Integrity check
  // [v3.20] DEBUG: track WHY broken fires for failure-mode diagnosis.
  var broken=false;
  var brokenReason=null;  // 'null_val' | 'mismatch' | 'xl_null' | 'xl_mismatch'
  for(var i=0;i<tmpl.length;i++){
    var e=tmpl[i],ops=OPS[e.id];
    if(e.xl){
      var pts=numPtsXL(e);
      var vA=CM[nk(pts[0])]?CM[nk(pts[0])].answer:null;
      var vB=CM[nk(pts[1])]?CM[nk(pts[1])].answer:null;
      var vC=CM[nk(pts[2])]?CM[nk(pts[2])].answer:null;
      var vD=CM[nk(pts[3])]?CM[nk(pts[3])].answer:null;
      if(vA==null||vB==null||vC==null||vD==null||!ops){broken=true;brokenReason='xl_null';break;}
      var res=evalXL(vA,ops.op1,vB,ops.op2,vC);
      if(res!==vD){broken=true;brokenReason='xl_mismatch';break;}
    } else {
      var pts=numPts(e),kA=nk(pts[0]),kB=nk(pts[1]),kC=nk(pts[2]);
      var vA=CM[kA]?CM[kA].answer:null,vB=CM[kB]?CM[kB].answer:null,vC=CM[kC]?CM[kC].answer:null;
      if(vA==null||vB==null||vC==null){broken=true;brokenReason='null_val';break;}
      if(ev(vA,OPS[e.id],vB)!==vC){broken=true;brokenReason='mismatch';break;}
    }
  }

  // Division count check (non-XL only, non-easy)
  if(!broken&&!isXL&&diff!=='easy'){
    var divCount=0;
    for(var id in OPS)if(OPS[id]==='/')divCount++;
    if(divCount<minDiv){
      var maxDivR=size==='large'?40:20;
      if((_divRetry||0)<maxDivR){
        // [v3.20] DEBUG: track div failures by template for diagnosis.
        _dbgBumpFail((window._currentTplName||'?')+':divFail');
        // [v3.18b] Reverted sticky-template; re-pick on retry like pre-v3.18.
        return buildPuzzle(size,diff,0,(_divRetry||0)+1,_opts);
      }
    }
  }

  if(broken){
    var maxR=size==='xl'?80:size==='large'?120:size==='medium'?60:30;
    if((_retry||0)<maxR){
      // [v3.20] DEBUG: track which broken-reason and template combo triggered.
      _dbgBumpFail((window._currentTplName||'?')+':'+(brokenReason||'broken'));
      // [v3.18b] REVERTED v3.18 v3 sticky-retry. The sticky-retry caused
      // a values-gen failure on a single template to use up ALL 60 retries
      // on that same template, then cascade-fallback to a smaller pool.
      // The pre-v3.18 behavior (re-pick on retry) trades debug-clarity for
      // user-facing reliability; the bug was much worse than it looked.
      // The no-recent-repeats picker still gives even distribution over
      // time even with template-swap retries.
      return buildPuzzle(size,diff,(_retry||0)+1,_divRetry,_opts);
    }
    // [v3.20] DEBUG: track that we exhausted retries and are falling through.
    _dbgBumpFail((window._currentTplName||'?')+':cascadeOut');
    // [v3.18] DEBUG: stash fallback flag so the on-screen label can warn.
    if(!window._fallbackFrom)window._fallbackFrom=size+'/'+diff;
    var fbOpts=Object.assign({},_opts||{},{_isFallback:true});
    if(diff==='hard')return buildPuzzle(size,'medium',0,0,fbOpts);
    if(diff==='medium')return buildPuzzle(size,'easy',0,0,fbOpts);
    if(size==='xl2')return buildPuzzle('xl','easy',0,0,fbOpts);
    if(size==='xl')return buildPuzzle('large','easy',0,0,fbOpts);
    if(size==='large')return buildPuzzle('medium','easy',0,0,fbOpts);
    if(size==='medium')return buildPuzzle('small','easy',0,0,fbOpts);
    return buildPuzzle('small','easy',0,0,fbOpts);
  }

  var maxC=0,maxR2=0;
  for(var i=0;i<tmpl.length;i++){
    var s=tmpl[i].xl?seqXL(tmpl[i].dir,tmpl[i].c,tmpl[i].r):seq(tmpl[i].dir,tmpl[i].c,tmpl[i].r);
    for(var j=0;j<s.length;j++){maxC=Math.max(maxC,s[j].c);maxR2=Math.max(maxR2,s[j].r);}
  }
  var blanks=Object.keys(CM).filter(function(k){return CM[k].isBlank;}).map(function(k){return CM[k].answer;});

  // [v1.47] Tile-value distribution cap. The v1.29 caps (6/5/5/4) were
  // tuned for the old generator and turned out to be the actual reason
  // hard puzzles look dense post-rebrand. A sparse hard puzzle —
  // meaning more cells blank — naturally pools more answers into the
  // bank, and the math constraints push those answers toward small
  // values (1, 2, 3 appear most often in valid arithmetic). With a
  // cap of 6 on XL, layouts with 8-12 copies of "1" got rejected and
  // the retry loop converged on the only layouts the cap accepted:
  // dense ones where each equation gives away 2-of-3 cells. Caps
  // doubled here (12/10/10/8). The bank may look a little busier
  // with duplicates but hard mode produces visibly sparser puzzles
  // again, like the pre-rebrand version.
  var TILE_VALUE_CAP = (size==='xl'||size==='xl2') ? 12
                     : (size==='large')            ? 10
                     : (size==='medium')           ? 10
                     :                               8;
  var tileCounts = {};
  var maxTileCount = 0;
  for(var bi=0;bi<blanks.length;bi++){
    var bv=blanks[bi];
    tileCounts[bv]=(tileCounts[bv]||0)+1;
    if(tileCounts[bv]>maxTileCount) maxTileCount=tileCounts[bv];
  }
  if(maxTileCount>TILE_VALUE_CAP){
    // How many retries we're willing to spend on tile-distribution
    // alone. After this, accept the generated puzzle even if some
    // value is over-represented — better than failing entirely.
    var maxTileR = (size==='xl2'||size==='xl') ? 40
                 : (size==='large')           ? 30
                 :                              20;
    if((_retry||0)<maxTileR){
      // [v3.20] DEBUG: track tile-distribution failures.
      _dbgBumpFail((window._currentTplName||'?')+':tileFail');
      return buildPuzzle(size,diff,(_retry||0)+1,_divRetry,_opts);
    }
  }

  // [v3.33] Trivial-equation reject pass.
  // 820-puzzle data showed avg 4.56 trivial eqs per Large/Medium puzzle
  // (modal=2, but 30%+ of puzzles had 5+). Trivial eqs are ones where
  // a player can solve them in <1 second because of identity arithmetic
  // — n×1=n, n÷1=n, 1+1=2, n÷n=1. With the v3.33 solver bias these
  // should drop, but some still slip through (especially when crossings
  // force a 1 into setCount=2 cases). Reject + retry if the puzzle has
  // too many. Threshold scales with puzzle size: roughly 12% of eqs.
  var trivCount=0;
  for(var ti=0;ti<tmpl.length;ti++){
    var te=tmpl[ti];
    if(te.xl)continue;
    var tpts=numPts(te);
    var tka=nk(tpts[0]),tkb=nk(tpts[1]),tkc=nk(tpts[2]);
    var top=OPS&&OPS[te.id];
    var tva=CM[tka]&&CM[tka].answer,tvb=CM[tkb]&&CM[tkb].answer,tvc=CM[tkc]&&CM[tkc].answer;
    if(tva!=null&&tvb!=null&&tvc!=null){
      var triv=false;
      if(tva===1&&tvb===1)triv=true;
      else if((top==='x'||top==='/')&&(tva===1||tvb===1))triv=true;
      else if(top==='/'&&tva===tvb)triv=true;
      if(triv)trivCount++;
    }
  }
  // ~12% of equations max. Small (12 eqs) → 1, Medium (16) → 1,
  // Large (24) → 2, Jumbo (16) → 1. Strict gives most impact on
  // perceived difficulty without preventing puzzles from generating.
  var trivThresh = Math.max(1,Math.floor(tmpl.length*0.12));
  var maxTrivR = (size==='xl'||size==='xl2') ? 40
              : (size==='large')             ? 30
              :                                20;
  if(trivCount>trivThresh && (_retry||0)<maxTrivR){
    _dbgBumpFail((window._currentTplName||'?')+':trivialReject');
    return buildPuzzle(size,diff,(_retry||0)+1,_divRetry,_opts);
  }

  var bv=blanks.slice().sort(function(a,b){return a-b;});
  // [v3.18 v4] DEBUG: bump final counter — this is what the player gets.
  if(window._currentTplName)_dbgBumpFinal(window._currentTplName);
  return{cols:maxC+1,rows:maxR2+1,tmpl:tmpl,CM:CM,OPS:OPS,bank:bv.map(function(v){return{value:v,used:false};})};
}

// ═══════════════════════════════════════════════════════════
// VALIDATION — handles both standard and XL equations
// ═══════════════════════════════════════════════════════════
function valEq(e,CM,OPS){
  if(e.xl)return valEqXL(e,CM,OPS);
  var s=seq(e.dir,e.c,e.r);
  function g(p){var c=CM[nk(p)];return c?c.isBlank?c.value:(c.answer!=null?c.answer:null):null;}
  var a=g(s[0]),b=g(s[2]),c=g(s[4]);
  if(a==null||b==null||c==null)return 'inc';
  return ev(a,OPS[e.id],b)===c?'ok':'bad';
}
function cstat(k,pz){
  var cell=pz.CM[k];if(!cell||!cell.isBlank||cell.value==null)return null;
  var bad=false,inc=false;
  for(var i=0;i<cell.eqs.length;i++){
    var e=null;for(var j=0;j<pz.tmpl.length;j++)if(pz.tmpl[j].id===cell.eqs[i]){e=pz.tmpl[j];break;}
    if(!e)continue;
    var s=valEq(e,pz.CM,pz.OPS);
    if(s==='bad')bad=true;else if(s==='inc')inc=true;
  }
  return bad?'bad':inc?'inc':'ok';
}
function winCheck(pz){
  var blanks=Object.keys(pz.CM).filter(function(k){return pz.CM[k].isBlank;});
  if(blanks.some(function(k){return pz.CM[k].value==null;}))return false;
  return pz.tmpl.every(function(e){return valEq(e,pz.CM,pz.OPS)==='ok';});
}

// ═══════════════════════════════════════════════════════════
// SOUNDS
// ═══════════════════════════════════════════════════════════
var AC=(function(){try{return new(window.AudioContext||window.webkitAudioContext)({sampleRate:48000});}catch(e){try{return new(window.AudioContext||window.webkitAudioContext)();}catch(e2){return null;}}})();
var _greetingPlayed=false;

// [v4.45] Audio latency compensation for Bluetooth / wireless output.
// Bluetooth audio adds ~40-200ms of latency between when we schedule
// a sound and when it actually reaches the speaker. Web Audio reports
// this via AC.outputLatency (seconds). For SCHEDULED sounds tied to a
// known visual event, we can fire the audio call earlier (or delay
// the visual) so they land in sync.
//
// We cannot help with INPUT-triggered sounds (tap a tile, drag a tile)
// since the latency is baked in regardless of when we schedule —
// "earlier than now" doesn't exist in real time. Those keep firing
// immediately.
//
// Returns the compensation in MILLISECONDS to use as a setTimeout
// offset:  setTimeout(fireAudio, intendedTime - _audioCompensateMs())
// or:      setTimeout(visual,     intendedTime + _audioCompensateMs())
// depending on which side you're delaying.
//
// Returns 0 if:
//   - the user has disabled the feature
//   - AC.outputLatency is missing/zero (some browsers don't report it)
//   - the reported latency is below a small threshold (~20ms) where
//     compensation would be imperceptible anyway
function _audioCompensateMs(){
  // Honor the user's setting. Default ON (set in _applyTuning).
  if(window._audioCompensateOn === false) return 0;
  if(!AC) return 0;
  // outputLatency: seconds between the time we schedule a sample and
  // when it reaches the speaker. baseLatency would be the AudioContext
  // internal buffer only; outputLatency adds the OS/driver/device
  // path on top, which is what catches Bluetooth.
  var latencySec = (typeof AC.outputLatency === 'number')
    ? AC.outputLatency
    : (typeof AC.baseLatency === 'number' ? AC.baseLatency : 0);
  if(!latencySec || latencySec <= 0) return 0;
  var ms = latencySec * 1000;
  // Floor: don't bother below 20ms (wired output is typically 5-15ms;
  // compensation in that range is invisible and only adds risk if
  // outputLatency is reporting noisily).
  if(ms < 20) return 0;
  // Ceiling: cap at 250ms. Beyond this, something is unusual (broken
  // driver, virtual audio device); applying huge compensation would
  // be more jarring than the original sync issue.
  if(ms > 250) ms = 250;
  return ms;
}
window._audioCompensateMs = _audioCompensateMs;

// Escape the five special HTML chars so arbitrary user-assigned text (like
// sample display names) can be safely embedded via innerHTML. Used by the
// SVG-based pad labels.
function _escHtml(s){
  return String(s==null?'':s)
    .replace(/&/g,'&amp;')
    .replace(/</g,'&lt;')
    .replace(/>/g,'&gt;')
    .replace(/"/g,'&quot;')
    .replace(/'/g,'&#39;');
}

// [Equil 1.01] Removed: master audio chain (EQ/reverb/sat/widener/limiter/panner) — sequencer-only. Puzzle UI sounds connect directly to AC.destination.
// Stub kept so any lingering sequencer code paths (still reachable via btnPuz until Pass 2b) and playScaleNote's Style A branch don't throw.
function getMasterDest(){ return AC ? AC.destination : null; }
// [Equil 1.01.fix] More stubs: the FX panel UI (saturation, reverb, limiter, master EQ) runs at LOAD TIME and reads these globals directly.
// Stubbing them as empty objects/no-op functions keeps the puzzle splash from crashing. The FX panel UI itself is harmless dead code now —
// it'll be deleted with the rest of the sequencer UI in Pass 2b.
var masterEQ = {};
var masterEQInput = null;
var _masterReverb = { wet:null, dry:null, conv:null, level:0.04, mkIR:null, sizeSec:1.6, decayExp:2.8 };
var _masterSat = { node:null, amount:0.35, bypass:null, input:null };
var _masterWide = { enabled:true, splitter:null, merger:null, delayR:null, widthMs:12, input:null };
var _masterLim = { node:null, threshold:-2, ratio:20, release:0.08 };
var _masterPanner = null;
var _masterPanValue = 0;
var _panInsertPoint = null;
var _panSourcePoint = null;
var _spatialNodes = null;
function buildMasterParamEQ(){ /* sequencer-only, removed */ }
function setMasterEQMode(){ /* sequencer-only, removed */ }
window._setMasterSaturation = function(){};
window._setMasterReverb = function(){};
window._setMasterLimiter = function(){};
window._getMasterReverb = function(){ return _masterReverb; };
window._getMasterLimiter = function(){ return {threshold:_masterLim.threshold, ratio:_masterLim.ratio, release:_masterLim.release}; };
window._getPitchRatio = function(){ return 1.0; };
window._currentPitchRatio = 1.0;
window._livePanOffset = 0;
function resumeAC(){if(AC&&AC.state==='suspended')AC.resume();}

// ════════════════════════════════════════════════════════════════════
// [Equil 1.31] UI SOUND EFFECTS INFRASTRUCTURE
// Ported from Sequation (file Sequation-10_17.html, lines 15451-15640
// for settings/btnFx/sliderFx and 12977-13067 for the wind sound).
// Provides:
//   • window._sfxSettings  — preference object (master vol, on/off flags)
//   • window._sfxGain      — master gain node, dry-routed to AC.destination
//   • window._btnFx(type)  — UI button click sounds
//   • window._sliderFx()   — throttled tick-noise while dragging sliders
//   • window._dragWind     — looped wind/whoosh for the zoom-pill drag
// ════════════════════════════════════════════════════════════════════
window._sfxSettings = (function(){
  var defaults = {
    masterVol: 1.0,
    sliderDrag: true,    // size/gap slider drag tick noise
    buttonFx: true,      // tool button toggles, drag wind sound
  };
  try{
    var saved = JSON.parse(localStorage.getItem('sfxSettings')||'{}');
    for(var k in saved){ if(k in defaults) defaults[k] = saved[k]; }
  }catch(e){}
  return defaults;
})();
window._saveSfxSettings = function(){
  try{ localStorage.setItem('sfxSettings', JSON.stringify(window._sfxSettings)); }catch(e){}
};
// Master sfx gain — dry-routed direct to destination so it bypasses any
// pad-effect chain and stays consistent regardless of master FX tweaks.
window._sfxGain = null;
(function(){
  if(!AC) return;
  try{
    var g = AC.createGain();
    g.gain.value = window._sfxSettings.masterVol;
    g.connect(AC.destination);
    window._sfxGain = g;
  }catch(e){}
})();
function _sfxDest(){ return window._sfxGain || (AC ? AC.destination : null); }

// Button sound effects. Variants used in Equil today: 'tool_on',
// 'tool_off', 'tool', 'play', 'stop'. Others kept for forward use.
window._btnFx = function(type){
  if(window._sfxOn===false||!AC) return; resumeAC();
  if(!window._sfxSettings.buttonFx) return;
  // [v2.90] One-shot suppression flag set by the display-mode
  // _relay click path so our new modal-style chirps aren't
  // doubled up by the toggle functions' built-in woodblock SFX.
  // Consumed (auto-reset) on first call so it can't accidentally
  // swallow unrelated future calls.
  if(window._btnFxSuppressOnce){
    window._btnFxSuppressOnce = false;
    return;
  }
  var t = AC.currentTime;
  try{
    var dest = _sfxDest(); if(!dest) return;

    // [v1.32] Woodblock helper for tool/tool_on/tool_off variants.
    // Replaces the earlier triangle-chirp tool sounds with a percussive
    // wooden chunk per user request. Built from three layered pieces:
    //   1. A short noise transient for the "click" attack (the sound of
    //      the mallet hitting wood).
    //   2. A damped sine at the resonance pitch — the body of the
    //      block. Different pitches for different variants so on/off
    //      remain distinguishable. Higher pitch (≈760 Hz) for "on",
    //      lower (≈480 Hz) for "off", neutral (≈600 Hz) for plain.
    //   3. A second damped sine an octave-ish above the body for
    //      brightness — gives the chunk some "ring" without being a
    //      bell.
    function _woodblock(freqLo, freqHi, gainScale){
      var dur = 0.12;
      // Attack noise transient (~6ms)
      try{
        var sr = AC.sampleRate, nLen = Math.ceil(sr * 0.006);
        var nbuf = AC.createBuffer(1, nLen, sr);
        var nd = nbuf.getChannelData(0);
        for(var i = 0; i < nLen; i++) nd[i] = (Math.random()*2 - 1) * 0.55;
        var nsrc = AC.createBufferSource(); nsrc.buffer = nbuf;
        var nbp = AC.createBiquadFilter(); nbp.type = 'bandpass';
        nbp.frequency.value = freqLo * 1.6;
        nbp.Q.value = 1.5;
        var ng = AC.createGain();
        ng.gain.setValueAtTime(0.18 * gainScale, t);
        ng.gain.exponentialRampToValueAtTime(0.001, t + 0.012);
        nsrc.connect(nbp); nbp.connect(ng); ng.connect(dest);
        nsrc.start(t); nsrc.stop(t + 0.02);
      }catch(e){}
      // Body resonance — damped sine
      try{
        var bg = AC.createGain(); bg.connect(dest);
        bg.gain.setValueAtTime(0.0001, t);
        bg.gain.exponentialRampToValueAtTime(0.20 * gainScale, t + 0.003);
        bg.gain.exponentialRampToValueAtTime(0.001, t + dur);
        var bo = AC.createOscillator();
        bo.type = 'sine';
        bo.frequency.setValueAtTime(freqLo, t);
        // Tiny pitch droop ~3% over the decay — natural wood character
        bo.frequency.exponentialRampToValueAtTime(freqLo * 0.97, t + dur);
        bo.connect(bg); bo.start(t); bo.stop(t + dur + 0.02);
      }catch(e){}
      // Bright overtone — slightly faster decay, lower gain
      try{
        var hg = AC.createGain(); hg.connect(dest);
        hg.gain.setValueAtTime(0.0001, t);
        hg.gain.exponentialRampToValueAtTime(0.07 * gainScale, t + 0.002);
        hg.gain.exponentialRampToValueAtTime(0.001, t + dur * 0.6);
        var ho = AC.createOscillator();
        ho.type = 'sine';
        ho.frequency.setValueAtTime(freqHi, t);
        ho.frequency.exponentialRampToValueAtTime(freqHi * 0.97, t + dur * 0.6);
        ho.connect(hg); ho.start(t); ho.stop(t + dur);
      }catch(e){}
    }

    if(type==='rec'){
      var g = AC.createGain(); g.connect(dest);
      var o = AC.createOscillator();
      o.type='sine'; o.frequency.value=880;
      g.gain.setValueAtTime(0.20,t); g.gain.exponentialRampToValueAtTime(0.001,t+0.08);
      o.connect(g); o.start(t); o.stop(t+0.25);
    }
    else if(type==='play'){
      var g = AC.createGain(); g.connect(dest);
      var o = AC.createOscillator();
      o.type='triangle'; o.frequency.setValueAtTime(440,t); o.frequency.exponentialRampToValueAtTime(880,t+0.10);
      g.gain.setValueAtTime(0.18,t); g.gain.exponentialRampToValueAtTime(0.001,t+0.12);
      o.connect(g); o.start(t); o.stop(t+0.25);
    }
    else if(type==='stop'){
      var g = AC.createGain(); g.connect(dest);
      var o = AC.createOscillator();
      o.type='sawtooth'; o.frequency.setValueAtTime(300,t); o.frequency.exponentialRampToValueAtTime(100,t+0.10);
      g.gain.setValueAtTime(0.15,t); g.gain.exponentialRampToValueAtTime(0.001,t+0.10);
      o.connect(g); o.start(t); o.stop(t+0.25);
    }
    // Woodblock variants — neutral, on (higher pitch), off (lower pitch)
    else if(type==='tool')      _woodblock(600, 1500, 0.85);
    else if(type==='tool_on')   _woodblock(760, 1900, 1.0);
    else if(type==='tool_off')  _woodblock(480, 1200, 1.0);
  }catch(e){}
};

// Slider drag tick noise — short bandpassed noise burst, throttled to
// ~35Hz so a continuous drag produces a "scritch" texture rather than
// a wall of clicks.
(function(){
  var lastTickT = 0;
  window._sliderFx = function(){
    if(!AC) return; resumeAC();
    if(!window._sfxSettings.sliderDrag) return;
    var now = AC.currentTime;
    if(now - lastTickT < 0.028) return;
    lastTickT = now;
    try{
      var dest = _sfxDest(); if(!dest) return;
      var sr = AC.sampleRate, dur = 0.022, nLen = Math.ceil(sr * dur);
      var buf = AC.createBuffer(1, nLen, sr);
      var d = buf.getChannelData(0);
      for(var i = 0; i < nLen; i++) d[i] = (Math.random() * 2 - 1) * 0.5;
      var src = AC.createBufferSource(); src.buffer = buf;
      var bp = AC.createBiquadFilter(); bp.type = 'bandpass';
      bp.frequency.setValueAtTime(2000 + Math.random() * 1500, now);
      bp.Q.setValueAtTime(3, now);
      var g = AC.createGain();
      g.gain.setValueAtTime(0, now);
      g.gain.linearRampToValueAtTime(0.035, now + 0.003);
      g.gain.exponentialRampToValueAtTime(0.001, now + dur);
      src.connect(bp); bp.connect(g); g.connect(dest);
      src.start(now); src.stop(now + dur + 0.01);
    }catch(e){}
  };
})();

// Drag wind — looped pink-ish noise through a velocity-modulated
// bandpass. Sounds airier as drag speed increases. Used by the zoom
// pill's release-glide and active-drag (see _wireTabDrag in the zoom
// pill module: it calls window._dragWind.start/setVelocity/stop).
window._dragWind = (function(){
  var nodes = null;
  var targetGain = 0;
  var lastMoveTs = 0;
  var rafId = null;
  var MAX_GAIN = 0.0225;
  var VEL_SCALE = 1 / 3500;
  function _buildNoiseBuffer(){
    var sr = AC.sampleRate;
    var len = Math.floor(sr * 2);
    var buf = AC.createBuffer(1, len, sr);
    var d = buf.getChannelData(0);
    for(var i = 0; i < len; i++) d[i] = Math.random() * 2 - 1;
    return buf;
  }
  function _tick(){
    if(!nodes){ rafId = null; return; }
    var now = performance.now();
    if(now - lastMoveTs > 60){
      targetGain *= 0.85;
      if(targetGain < 0.001) targetGain = 0;
    }
    try{
      var t = AC.currentTime;
      nodes.gainNode.gain.setTargetAtTime(targetGain, t, 0.03);
      var cut = 600 + (targetGain / MAX_GAIN) * 2400;
      nodes.filter.frequency.setTargetAtTime(cut, t, 0.05);
    }catch(e){}
    rafId = requestAnimationFrame(_tick);
  }
  function start(){
    if(!AC) return;
    if(!window._sfxSettings || !window._sfxSettings.buttonFx) return;
    if(nodes) return;
    try{
      var dest = _sfxDest(); if(!dest) return;
      var t = AC.currentTime;
      var g = AC.createGain();
      g.gain.setValueAtTime(0, t);
      g.connect(dest);
      var src = AC.createBufferSource();
      src.buffer = _buildNoiseBuffer();
      src.loop = true;
      var filt = AC.createBiquadFilter();
      filt.type = 'bandpass';
      filt.frequency.value = 700;
      filt.Q.value = 0.9;
      src.connect(filt); filt.connect(g);
      src.start(t);
      nodes = {src: src, gainNode: g, filter: filt};
      targetGain = 0;
      lastMoveTs = performance.now();
      if(!rafId) rafId = requestAnimationFrame(_tick);
    }catch(e){ nodes = null; }
  }
  function setVelocity(pxPerSec){
    if(!nodes) return;
    var v = Math.max(0, pxPerSec);
    targetGain = Math.min(MAX_GAIN, v * VEL_SCALE * MAX_GAIN);
    lastMoveTs = performance.now();
  }
  function stop(){
    if(!nodes || !AC) return;
    var s = nodes; nodes = null;
    targetGain = 0;
    if(rafId){ cancelAnimationFrame(rafId); rafId = null; }
    try{
      var t = AC.currentTime;
      s.gainNode.gain.cancelScheduledValues(t);
      s.gainNode.gain.setValueAtTime(s.gainNode.gain.value, t);
      s.gainNode.gain.linearRampToValueAtTime(0, t + 0.05);
      s.src.stop(t + 0.07);
    }catch(e){}
  }
  return {start: start, stop: stop, setVelocity: setVelocity};
})();
window._getPitchRatio=function(){ return 1.0; };
window._currentPitchRatio=1.0;
// Live-tap pan offset — written by the pan slider, read by live
// pad taps. 0 = center, -1 = full left, +1 = full right. Separate
// from the master pan node (which stays centered now) so sequencer
// playback isn't retroactively panned by slider movements.
window._livePanOffset=0;
var SOUND_STYLE='A';
// [Equil 1.01] Removed: STOCK_NAMES + chromatic-label populator (sequencer-only).
// Stub: empty arrays per style so renderBank's `STOCK_NAMES[SOUND_STYLE][idx]` lookup
// returns undefined gracefully instead of throwing. Used by _updateSampleIcons (sequencer
// pad-label rendering) which gets called every render. Will be removed with all of
// renderBank's pad-label code in Pass 2b.
var STOCK_NAMES = {A:[],B:[],C:[],D:[],E:[],F:[],G:[],H:[],I:[],J:[],K:[]};
// [Equil 1.01] Simplified setSoundStyle — removed sequencer-side effects (kit colors, sample icons, prewarm, etc.).
function setSoundStyle(s){
  SOUND_STYLE=s;
  ['A','B','C','D','E','F','G','H','I','J','K'].forEach(function(id){
    var b=document.getElementById('snd'+id); if(b) b.classList.toggle('active',s===id);
  });
  resumeAC();
  playSelEmpty();
}
window._setSoundStyle=setSoundStyle;
// effects — including the style-specific color preset reapply.
window._setSoundStyle=setSoundStyle;

// ── STYLE A: Original smooth sine/triangle sounds ──────────────────

function playSA_SelEmpty(){
  try{
    // [v2.81] Replaced with the "High pip" candidate from the v2.80
    // sound-auditions-2 page. Single sine at E6 (1318.51 Hz — same
    // pitch as the upper octave of the v2.80 place sound), 25ms,
    // gain 0.07. Almost subliminal — a barely-there confirmation
    // that the tap registered, intentionally quiet because this
    // sound fires before EVERY placement (most frequent UI sound
    // in the game). Old version was a sine drop 440→380 Hz at
    // gain 0.45 — felt heavy and old-school next to the new
    // minimalist place sound.
    var t0=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.0001,t0);
    g.gain.exponentialRampToValueAtTime(0.07,t0+0.002);
    g.gain.exponentialRampToValueAtTime(0.0001,t0+0.025);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(1318.51,t0);
    o.connect(g);o.start(t0);o.stop(t0+0.045);
  }catch(e){}
}
function playSA_SelFilled(){
  try{
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.4,AC.currentTime);g.gain.exponentialRampToValueAtTime(0.001,AC.currentTime+0.08);
    var o=AC.createOscillator();o.type='triangle';
    o.frequency.setValueAtTime(320,AC.currentTime);o.frequency.exponentialRampToValueAtTime(240,AC.currentTime+0.07);
    o.connect(g);o.start(AC.currentTime);o.stop(AC.currentTime+0.07);
  }catch(e){}
}
function playSA_Place(){
  try{
    // [v2.80] Replaced the old triangle chirp (420→820 Hz at gain
    // 0.22) with the "double tick" candidate from the v2.79 place-
    // sound audition page. Two sines stacked an octave apart (E5
    // 659 Hz + E6 1319 Hz), played simultaneously, very short
    // (45ms / 35ms) — reads as a crisp "tick" with a sparkle of
    // brightness from the upper octave. Critical property: it's
    // short and uses pure sines, so it stays clean over hundreds
    // of repetitions in a row (the make-or-break test for a place
    // sound, which fires constantly during play). Lower gain on
    // the upper octave (0.05) keeps it as a sparkle, not a peer.
    var t0=AC.currentTime;
    function note(freq,start,dur,peakGain){
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.0001,start);
      g.gain.exponentialRampToValueAtTime(peakGain,start+0.002);
      g.gain.exponentialRampToValueAtTime(0.0001,start+dur);
      var o=AC.createOscillator();o.type='sine';
      o.frequency.setValueAtTime(freq,start);
      o.connect(g);o.start(start);o.stop(start+dur+0.02);
    }
    note(659.25,  t0, 0.045, 0.13);  // E5 (fundamental)
    note(1318.51, t0, 0.035, 0.05);  // E6 (sparkle octave above)
  }catch(e){}
}
function playSA_Return(){
  try{
    // [v2.81] "Muffled tap" — single sine at F3 (175 Hz) with a
    // gentle attack to read as a press rather than a click.
    // [v3.58] Found by Sam that v3.55→v3.57's volume bumps were
    // hitting the WRONG function (playTileReturn — fires on drag-
    // release-to-bank, not tap-to-return). This is the actual
    // sound that fires when a placed tile is tapped to send it
    // home. Peak gain was 0.14; bumped to 0.55. Duration extended
    // 60ms → 110ms so it sits longer in the mix. Frequency lifted
    // slightly from 175 → 220 Hz to help it cut through ambient
    // background noise (a low F3 sine gets masked easily by HVAC
    // hum, fans, etc).
    var t0=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.0001,t0);
    g.gain.exponentialRampToValueAtTime(0.55,t0+0.008);
    g.gain.exponentialRampToValueAtTime(0.0001,t0+0.110);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(220,t0);
    o.connect(g);o.start(t0);o.stop(t0+0.130);
  }catch(e){}
}
function playSA_Error(){
  try{
    // [v2.78] Replaced the v2.76 tritone with a minor 2nd cluster.
    // E5 + F5 played simultaneously (no offset) — the close interval
    // creates an immediate, tighter dissonance than the tritone.
    // Reads as "wrong" instantly without sounding harsh because both
    // notes are pure sines. Lower per-note gain (0.07) since two
    // tones playing at once sum louder than one. Single-event
    // duration (~180ms) keeps the cue brief.
    var t0=AC.currentTime;
    function note(freq,start,dur,peakGain){
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.0001,start);
      g.gain.exponentialRampToValueAtTime(peakGain,start+0.01);
      g.gain.exponentialRampToValueAtTime(0.0001,start+dur);
      var o=AC.createOscillator();o.type='sine';
      o.frequency.setValueAtTime(freq,start);
      o.connect(g);o.start(start);o.stop(start+dur+0.02);
    }
    note(659.25, t0, 0.18, 0.07);  // E5
    note(698.46, t0, 0.18, 0.07);  // F5
  }catch(e){}
}
function playSA_NewGame(){
  try{
    // [v2.92] Replaced the old 220ms sine sweep 260→520 Hz with the
    // "Air puff" candidate from the v2.91 audition page. A short
    // filtered noise burst (~90ms) with a quick lowpass sweep
    // 2400→900 Hz — reads as a tactile "phft" exhale, no melodic
    // content. Fits the minimalist sine/noise family alongside
    // the place sound's double-tick and the modal chirps.
    // Different in character on purpose: place is musical (notes),
    // chirps are tonal (sweeps), this is purely textural — keeps
    // each navigation event distinguishable on identity.
    var t0=AC.currentTime;
    var dur=0.090;
    var len=Math.max(1, Math.floor(AC.sampleRate*dur));
    var buf=AC.createBuffer(1, len, AC.sampleRate);
    var data=buf.getChannelData(0);
    for(var i=0;i<len;i++) data[i] = (Math.random()*2-1);
    var src=AC.createBufferSource(); src.buffer=buf;
    var lp=AC.createBiquadFilter(); lp.type='lowpass';
    lp.frequency.setValueAtTime(2400, t0);
    lp.frequency.exponentialRampToValueAtTime(900, t0+dur);
    lp.Q.value=0.9;
    var g=AC.createGain();
    g.gain.setValueAtTime(0.0001, t0);
    g.gain.exponentialRampToValueAtTime(0.10, t0+0.005);
    g.gain.exponentialRampToValueAtTime(0.0001, t0+dur);
    src.connect(lp); lp.connect(g); g.connect(AC.destination);
    src.start(t0); src.stop(t0+dur+0.02);
  }catch(e){}
}
function playSA_Fanfare(){
  try{
    // [v2.85] Accelerated rhythm. Was: 4 notes at exactly 120ms
    // each (perfectly even). User wanted the last 3 to ramp up in
    // tempo so the fanfare builds momentum into the sustained
    // chord. New offsets in seconds: 0.00, 0.18, 0.31, 0.40 — the
    // first interval is a touch longer than the original (anticipa-
    // tory pause), then each subsequent gap shrinks: 180ms → 130ms
    // → 90ms. Sustained chord lands on what used to be the 5th
    // beat. Total fanfare time is similar (~480ms vs prior 480ms
    // for the 4 attacks), it just has a more musical contour.
    var notes=[523,659,784,1047];
    var offsets=[0.00, 0.18, 0.31, 0.40];
    for(var i=0;i<notes.length;i++){
      var freq=notes[i],t=AC.currentTime+offsets[i];
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.28,t+0.04);g.gain.exponentialRampToValueAtTime(0.001,t+0.35);
      var o=AC.createOscillator();o.type='triangle';o.frequency.setValueAtTime(freq,t);
      o.connect(g);o.start(t);o.stop(t+0.35);
      var g2=AC.createGain();g2.connect(AC.destination);
      g2.gain.setValueAtTime(0,t);g2.gain.linearRampToValueAtTime(0.1,t+0.04);g2.gain.exponentialRampToValueAtTime(0.001,t+0.3);
      var o2=AC.createOscillator();o2.type='sine';o2.frequency.setValueAtTime(freq*2,t);
      o2.connect(g2);o2.start(t);o2.stop(t+0.3);
    }
    // Sustained chord follows the last attack with a small gap so
    // the climax reads as its own moment, not just a 5th note in
    // the run-up. 80ms gap matches the shrinking-interval contour.
    var ct=AC.currentTime+offsets[offsets.length-1]+0.08;
    var chord=[523,659,784];
    for(var i=0;i<chord.length;i++){
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.18,ct);g.gain.exponentialRampToValueAtTime(0.001,ct+0.8);
      var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(chord[i],ct);
      o.connect(g);o.start(ct);o.stop(ct+0.8);
    }
  }catch(e){}
}

// ── STYLE B: Retro 8-bit / game console sounds ─────────────────────
// Uses square waves, noise bursts, and classic game SFX patterns.

// Helper: create a buffer of white noise
function makeNoise(dur){
  var sr=AC.sampleRate,len=Math.ceil(sr*dur),buf=AC.createBuffer(1,len,sr),d=buf.getChannelData(0);
  for(var i=0;i<len;i++)d[i]=Math.random()*2-1;
  return buf;
}

// Select empty: short high-pitched square blip (NES-style cursor)
function playSB_SelEmpty(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.18,t);g.gain.setValueAtTime(0.18,t+0.03);g.gain.setValueAtTime(0,t+0.031);
    var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(880,t);
    o.connect(g);o.start(t);o.stop(t+0.04);
  }catch(e){}
}

// Select filled: low square blip (lower cursor)
function playSB_SelFilled(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.14,t);g.gain.setValueAtTime(0.14,t+0.025);g.gain.setValueAtTime(0,t+0.026);
    var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(440,t);
    o.connect(g);o.start(t);o.stop(t+0.03);
  }catch(e){}
}

// Place number: two-note ascending bleep (classic confirm)
function playSB_Place(){
  try{
    var t=AC.currentTime;
    [523,784].forEach(function(freq,i){
      var ti=t+i*0.055;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.2,ti);g.gain.setValueAtTime(0.2,ti+0.04);g.gain.setValueAtTime(0,ti+0.041);
      var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(freq,ti);
      o.connect(g);o.start(ti);o.stop(ti+0.05);
    });
  }catch(e){}
}

// Return number: two-note descending bleep (undo)
function playSB_Return(){
  try{
    var t=AC.currentTime;
    [523,330].forEach(function(freq,i){
      var ti=t+i*0.055;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.16,ti);g.gain.setValueAtTime(0.16,ti+0.04);g.gain.setValueAtTime(0,ti+0.041);
      var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(freq,ti);
      o.connect(g);o.start(ti);o.stop(ti+0.05);
    });
  }catch(e){}
}

// Error: descending noise burst + low buzz (classic wrong-answer)
function playSB_Error(){
  try{
    var t=AC.currentTime;
    // Noise component
    var buf=makeNoise(0.12);
    var src=AC.createBufferSource();src.buffer=buf;
    var gn=AC.createGain();gn.connect(AC.destination);
    gn.gain.setValueAtTime(0.15,t);gn.gain.exponentialRampToValueAtTime(0.001,t+0.12);
    src.connect(gn);src.start(t);src.stop(t+0.12);
    // Low square buzz
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0.2,t);g2.gain.exponentialRampToValueAtTime(0.001,t+0.18);
    var o=AC.createOscillator();o.type='square';
    o.frequency.setValueAtTime(110,t);o.frequency.setValueAtTime(82,t+0.06);
    o.connect(g2);o.start(t);o.stop(t+0.18);
  }catch(e){}
}

// New game: classic 4-note game-start jingle (Super Mario-ish feel)
function playSB_NewGame(){
  try{
    var t=AC.currentTime;
    var melody=[392,523,659,784]; // G4 C5 E5 G5
    melody.forEach(function(freq,i){
      var ti=t+i*0.09;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,ti);g.gain.linearRampToValueAtTime(0.22,ti+0.01);
      g.gain.setValueAtTime(0.22,ti+0.06);g.gain.setValueAtTime(0,ti+0.07);
      var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(freq,ti);
      o.connect(g);o.start(ti);o.stop(ti+0.08);
    });
  }catch(e){}
}

// Fanfare: retro victory jingle — arpeggiated chord then held notes
function playSB_Fanfare(){
  try{
    var t=AC.currentTime;
    // Rising arpeggio
    var arp=[262,330,392,523,659,784,1047];
    arp.forEach(function(freq,i){
      var ti=t+i*0.07;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,ti);g.gain.linearRampToValueAtTime(0.18,ti+0.01);
      g.gain.setValueAtTime(0.18,ti+0.05);g.gain.setValueAtTime(0,ti+0.06);
      var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(freq,ti);
      o.connect(g);o.start(ti);o.stop(ti+0.07);
    });
    // Final held chord
    var ct=t+arp.length*0.07+0.05;
    [523,659,784].forEach(function(freq,i){
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,ct);g.gain.linearRampToValueAtTime(0.2,ct+0.03);
      g.gain.exponentialRampToValueAtTime(0.001,ct+0.7);
      var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(freq,ct);
      o.connect(g);o.start(ct);o.stop(ct+0.72);
      // Octave harmonics for richness
      var g2=AC.createGain();g2.connect(AC.destination);
      g2.gain.setValueAtTime(0,ct);g2.gain.linearRampToValueAtTime(0.08,ct+0.03);
      g2.gain.exponentialRampToValueAtTime(0.001,ct+0.5);
      var o2=AC.createOscillator();o2.type='square';o2.frequency.setValueAtTime(freq*2,ct);
      o2.connect(g2);o2.start(ct);o2.stop(ct+0.52);
    });
  }catch(e){}
}

// ── STYLE C: Sci-Fi ────────────────────────────────────────────────
// Theremin wobbles, laser zaps, alien bleeps, warp drives, and a
// shimmering synth victory sequence.

// Select empty: short laser ping — high sine with fast vibrato
function playSC_SelEmpty(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.42,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.09);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(1200,t);o.frequency.exponentialRampToValueAtTime(600,t+0.09);
    // Vibrato via LFO
    var lfo=AC.createOscillator();lfo.type='sine';lfo.frequency.setValueAtTime(18,t);
    var lfog=AC.createGain();lfog.gain.setValueAtTime(40,t);
    lfo.connect(lfog);lfog.connect(o.frequency);
    lfo.start(t);lfo.stop(t+0.09);
    o.connect(g);o.start(t);o.stop(t+0.09);
  }catch(e){}
}

// Select filled: alien blip — sawtooth with quick pitch drop
function playSC_SelFilled(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.38,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.07);
    var o=AC.createOscillator();o.type='sawtooth';
    o.frequency.setValueAtTime(800,t);o.frequency.exponentialRampToValueAtTime(300,t+0.07);
    var filt=AC.createBiquadFilter();filt.type='lowpass';filt.frequency.setValueAtTime(900,t);
    o.connect(filt);filt.connect(g);o.start(t);o.stop(t+0.07);
  }catch(e){}
}

// Place number: phaser beam — ascending tone with ring modulation feel
function playSC_Place(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.2,t+0.02);
    g.gain.exponentialRampToValueAtTime(0.001,t+0.18);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(300,t);o.frequency.exponentialRampToValueAtTime(1400,t+0.15);
    // Ring mod carrier
    var carr=AC.createOscillator();carr.type='sine';carr.frequency.setValueAtTime(60,t);
    var carrg=AC.createGain();carrg.gain.setValueAtTime(0.5,t);
    carr.connect(carrg);carrg.connect(g.gain);
    carr.start(t);carr.stop(t+0.18);
    o.connect(g);o.start(t);o.stop(t+0.18);
  }catch(e){}
}

// Return: reverse phaser — descending warble
function playSC_Return(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.18,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.16);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(1400,t);o.frequency.exponentialRampToValueAtTime(280,t+0.14);
    var lfo=AC.createOscillator();lfo.type='sine';lfo.frequency.setValueAtTime(22,t);
    var lfog=AC.createGain();lfog.gain.setValueAtTime(60,t);
    lfo.connect(lfog);lfog.connect(o.frequency);
    lfo.start(t);lfo.stop(t+0.16);
    o.connect(g);o.start(t);o.stop(t+0.16);
  }catch(e){}
}

// Error: red-alert buzz — detuned sawtooth pair, low and menacing
function playSC_Error(){
  try{
    var t=AC.currentTime;
    [98,102].forEach(function(freq){
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.13,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.28);
      var o=AC.createOscillator();o.type='sawtooth';o.frequency.setValueAtTime(freq,t);
      var filt=AC.createBiquadFilter();filt.type='bandpass';filt.frequency.setValueAtTime(300,t);filt.Q.setValueAtTime(2,t);
      o.connect(filt);filt.connect(g);o.start(t);o.stop(t+0.28);
    });
    // Pulse alarm
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0.15,t+0.1);g2.gain.setValueAtTime(0,t+0.16);
    g2.gain.setValueAtTime(0.15,t+0.2);g2.gain.setValueAtTime(0,t+0.26);
    var o2=AC.createOscillator();o2.type='square';o2.frequency.setValueAtTime(440,t);
    o2.connect(g2);o2.start(t);o2.stop(t+0.28);
  }catch(e){}
}

// New game: warp-drive spin-up — rising filtered noise + tone
function playSC_NewGame(){
  try{
    var t=AC.currentTime;
    // Spinning tone
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.18,t+0.1);
    g.gain.exponentialRampToValueAtTime(0.001,t+0.5);
    var o=AC.createOscillator();o.type='sawtooth';
    o.frequency.setValueAtTime(80,t);o.frequency.exponentialRampToValueAtTime(640,t+0.45);
    var filt=AC.createBiquadFilter();filt.type='lowpass';
    filt.frequency.setValueAtTime(200,t);filt.frequency.exponentialRampToValueAtTime(3000,t+0.45);
    o.connect(filt);filt.connect(g);o.start(t);o.stop(t+0.5);
    // High shimmer
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0,t+0.25);g2.gain.linearRampToValueAtTime(0.12,t+0.35);
    g2.gain.exponentialRampToValueAtTime(0.001,t+0.55);
    var o2=AC.createOscillator();o2.type='sine';o2.frequency.setValueAtTime(2400,t+0.25);
    o2.connect(g2);o2.start(t+0.25);o2.stop(t+0.55);
  }catch(e){}
}

// Fanfare: alien victory — shimmering arpeggios + theremin-like chord
function playSC_Fanfare(){
  try{
    var t=AC.currentTime;
    var arp=[293,440,587,880,1174,1568];
    arp.forEach(function(freq,i){
      var ti=t+i*0.08;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,ti);g.gain.linearRampToValueAtTime(0.16,ti+0.02);
      g.gain.exponentialRampToValueAtTime(0.001,ti+0.18);
      var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(freq,ti);
      var lfo=AC.createOscillator();lfo.type='sine';lfo.frequency.setValueAtTime(8,ti);
      var lfog=AC.createGain();lfog.gain.setValueAtTime(freq*0.015,ti);
      lfo.connect(lfog);lfog.connect(o.frequency);
      lfo.start(ti);lfo.stop(ti+0.2);
      o.connect(g);o.start(ti);o.stop(ti+0.2);
    });
    var ct=t+arp.length*0.08+0.1;
    [293,440,587].forEach(function(freq){
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,ct);g.gain.linearRampToValueAtTime(0.14,ct+0.05);
      g.gain.exponentialRampToValueAtTime(0.001,ct+1.2);
      var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(freq,ct);
      var lfo=AC.createOscillator();lfo.type='sine';lfo.frequency.setValueAtTime(5,ct);
      var lfog=AC.createGain();lfog.gain.setValueAtTime(freq*0.02,ct);
      lfo.connect(lfog);lfog.connect(o.frequency);
      lfo.start(ct);lfo.stop(ct+1.2);
      o.connect(g);o.start(ct);o.stop(ct+1.2);
    });
  }catch(e){}
}

// ── STYLE D: Nature ─────────────────────────────────────────────────
// Wood knocks, water drops, bird chirps, rustling wind, and a gentle
// forest-dawn chorus for victory.

// Helper: filtered noise burst (wind / rustle)
function makeFilteredNoise(dur,ftype,freq,q){
  try{
    var sr=AC.sampleRate,len=Math.ceil(sr*dur),buf=AC.createBuffer(1,len,sr),d=buf.getChannelData(0);
    for(var i=0;i<len;i++)d[i]=Math.random()*2-1;
    var src=AC.createBufferSource();src.buffer=buf;
    var filt=AC.createBiquadFilter();filt.type=ftype;filt.frequency.setValueAtTime(freq,AC.currentTime);
    if(q)filt.Q.setValueAtTime(q,AC.currentTime);
    src.connect(filt);return{src:src,filt:filt};
  }catch(e){return null;}
}

// Select empty: wood knock — short bandpass noise thump
function playSD_SelEmpty(){
  try{
    var t=AC.currentTime;
    var n=makeFilteredNoise(0.06,'bandpass',800,12);if(!n)return;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.75,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.06);
    n.filt.connect(g);n.src.start(t);n.src.stop(t+0.06);
    // Low thud body
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0.65,t);g2.gain.exponentialRampToValueAtTime(0.001,t+0.04);
    var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(180,t);o.frequency.exponentialRampToValueAtTime(60,t+0.04);
    o.connect(g2);o.start(t);o.stop(t+0.04);
  }catch(e){}
}

// Select filled: water drop — sine plop with quick fall
function playSD_SelFilled(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.65,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.12);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(900,t);o.frequency.exponentialRampToValueAtTime(300,t+0.1);
    o.connect(g);o.start(t);o.stop(t+0.12);
  }catch(e){}
}

// Place number: bird chirp — quick rising sine trill
function playSD_Place(){
  try{
    var t=AC.currentTime;
    [0,0.06,0.11].forEach(function(dt,i){
      var ti=t+dt;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.15,ti);g.gain.exponentialRampToValueAtTime(0.001,ti+0.05);
      var o=AC.createOscillator();o.type='sine';
      var baseF=2400+i*200;
      o.frequency.setValueAtTime(baseF,ti);o.frequency.exponentialRampToValueAtTime(baseF*1.3,ti+0.04);
      o.connect(g);o.start(ti);o.stop(ti+0.05);
    });
  }catch(e){}
}

// Return: descending bird call — two falling notes
function playSD_Return(){
  try{
    var t=AC.currentTime;
    [0,0.07].forEach(function(dt,i){
      var ti=t+dt;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.14,ti);g.gain.exponentialRampToValueAtTime(0.001,ti+0.07);
      var o=AC.createOscillator();o.type='sine';
      var baseF=2200-i*300;
      o.frequency.setValueAtTime(baseF,ti);o.frequency.exponentialRampToValueAtTime(baseF*0.7,ti+0.06);
      o.connect(g);o.start(ti);o.stop(ti+0.07);
    });
  }catch(e){}
}

// Error: startled crow — harsh caw (bandpass noise burst + low rattle)
function playSD_Error(){
  try{
    var t=AC.currentTime;
    var n=makeFilteredNoise(0.2,'bandpass',1200,3);if(!n)return;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.22,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.2);
    n.filt.connect(g);n.src.start(t);n.src.stop(t+0.2);
    // Rattle
    var n2=makeFilteredNoise(0.12,'bandpass',400,8);if(!n2)return;
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0.15,t+0.05);g2.gain.exponentialRampToValueAtTime(0.001,t+0.18);
    n2.filt.connect(g2);n2.src.start(t+0.05);n2.src.stop(t+0.18);
  }catch(e){}
}

// New game: morning breeze — soft wind swell + single high bird note
function playSD_NewGame(){
  try{
    var t=AC.currentTime;
    // Wind swell
    var n=makeFilteredNoise(0.5,'bandpass',600,1.5);if(!n)return;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.12,t+0.2);
    g.gain.exponentialRampToValueAtTime(0.001,t+0.5);
    n.filt.connect(g);n.src.start(t);n.src.stop(t+0.5);
    // Bird note
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0,t+0.2);g2.gain.linearRampToValueAtTime(0.2,t+0.25);
    g2.gain.exponentialRampToValueAtTime(0.001,t+0.55);
    var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(3200,t+0.2);
    o.frequency.exponentialRampToValueAtTime(2400,t+0.5);
    o.connect(g2);o.start(t+0.2);o.stop(t+0.55);
  }catch(e){}
}

// Fanfare: dawn chorus — layered bird calls rising like a forest waking up
function playSD_Fanfare(){
  try{
    var t=AC.currentTime;
    // Wind bed
    var n=makeFilteredNoise(1.8,'bandpass',500,1);if(n){
      var gw=AC.createGain();gw.connect(AC.destination);
      gw.gain.setValueAtTime(0,t);gw.gain.linearRampToValueAtTime(0.08,t+0.3);
      gw.gain.exponentialRampToValueAtTime(0.001,t+1.8);
      n.filt.connect(gw);n.src.start(t);n.src.stop(t+1.8);
    }
    // Bird calls at irregular intervals
    var calls=[
      {dt:0,   f0:2800,f1:3400,dur:0.07},
      {dt:0.18,f0:3200,f1:2600,dur:0.09},
      {dt:0.32,f0:2000,f1:2800,dur:0.06},
      {dt:0.48,f0:3600,f1:3000,dur:0.08},
      {dt:0.62,f0:2400,f1:3200,dur:0.07},
      {dt:0.80,f0:3000,f1:3600,dur:0.09},
      {dt:0.98,f0:2600,f1:3400,dur:0.06},
      {dt:1.12,f0:3200,f1:2800,dur:0.08},
    ];
    calls.forEach(function(c){
      var ti=t+c.dt;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.16,ti);g.gain.exponentialRampToValueAtTime(0.001,ti+c.dur);
      var o=AC.createOscillator();o.type='sine';
      o.frequency.setValueAtTime(c.f0,ti);o.frequency.exponentialRampToValueAtTime(c.f1,ti+c.dur*0.8);
      o.connect(g);o.start(ti);o.stop(ti+c.dur+0.01);
    });
    // Final water drop
    var gd=AC.createGain();gd.connect(AC.destination);
    gd.gain.setValueAtTime(0.2,t+1.35);gd.gain.exponentialRampToValueAtTime(0.001,t+1.6);
    var od=AC.createOscillator();od.type='sine';
    od.frequency.setValueAtTime(1200,t+1.35);od.frequency.exponentialRampToValueAtTime(400,t+1.55);
    od.connect(gd);od.start(t+1.35);od.stop(t+1.6);
  }catch(e){}
}

// ── STYLE E: Industrial ─────────────────────────────────────────────
// Metal clanks, pneumatic hisses, hydraulic thuds, grinding gears,
// and a factory-floor steam-whistle fanfare.

// Select empty: metal tap — short high clank
function playSE_SelEmpty(){
  try{
    var t=AC.currentTime;
    // Metallic noise
    var n=makeFilteredNoise(0.04,'highpass',4000);if(!n)return;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.25,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.04);
    n.filt.connect(g);n.src.start(t);n.src.stop(t+0.04);
    // Ring tone
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0.14,t);g2.gain.exponentialRampToValueAtTime(0.001,t+0.08);
    var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(2800,t);
    o.frequency.exponentialRampToValueAtTime(1400,t+0.08);
    o.connect(g2);o.start(t);o.stop(t+0.08);
  }catch(e){}
}

// Select filled: pneumatic hiss — bandpass noise burst
function playSE_SelFilled(){
  try{
    var t=AC.currentTime;
    var n=makeFilteredNoise(0.09,'bandpass',3000,4);if(!n)return;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.18,t);g.gain.setValueAtTime(0.18,t+0.04);
    g.gain.exponentialRampToValueAtTime(0.001,t+0.09);
    n.filt.connect(g);n.src.start(t);n.src.stop(t+0.1);
  }catch(e){}
}

// Place number: hydraulic clunk — deep thud + metal ring
function playSE_Place(){
  try{
    var t=AC.currentTime;
    // Deep thud
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.28,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.12);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(120,t);o.frequency.exponentialRampToValueAtTime(40,t+0.1);
    o.connect(g);o.start(t);o.stop(t+0.12);
    // Metal ring overtone
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0.14,t);g2.gain.exponentialRampToValueAtTime(0.001,t+0.15);
    var o2=AC.createOscillator();o2.type='sine';o2.frequency.setValueAtTime(860,t);
    o2.frequency.exponentialRampToValueAtTime(420,t+0.12);
    o2.connect(g2);o2.start(t);o2.stop(t+0.15);
    // Clank noise
    var n=makeFilteredNoise(0.05,'highpass',3500);if(n){
      var gn=AC.createGain();gn.connect(AC.destination);
      gn.gain.setValueAtTime(0.18,t);gn.gain.exponentialRampToValueAtTime(0.001,t+0.05);
      n.filt.connect(gn);n.src.start(t);n.src.stop(t+0.05);
    }
  }catch(e){}
}

// Return: reverse clunk — lighter thud + hiss
function playSE_Return(){
  try{
    var t=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.2,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.1);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(80,t);o.frequency.exponentialRampToValueAtTime(35,t+0.09);
    o.connect(g);o.start(t);o.stop(t+0.1);
    var n=makeFilteredNoise(0.08,'bandpass',2000,3);if(n){
      var gn=AC.createGain();gn.connect(AC.destination);
      gn.gain.setValueAtTime(0.12,t+0.02);gn.gain.exponentialRampToValueAtTime(0.001,t+0.1);
      n.filt.connect(gn);n.src.start(t+0.02);n.src.stop(t+0.1);
    }
  }catch(e){}
}

// Error: grinding gears + alarm buzz
function playSE_Error(){
  try{
    var t=AC.currentTime;
    // Gear grind — rough sawtooth with tremolo
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.18,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.3);
    var lfo=AC.createOscillator();lfo.type='square';lfo.frequency.setValueAtTime(30,t);
    var lfog=AC.createGain();lfog.gain.setValueAtTime(0.1,t);
    lfo.connect(lfog);lfog.connect(g.gain);
    lfo.start(t);lfo.stop(t+0.3);
    var o=AC.createOscillator();o.type='sawtooth';o.frequency.setValueAtTime(55,t);
    var filt=AC.createBiquadFilter();filt.type='bandpass';filt.frequency.setValueAtTime(600,t);filt.Q.setValueAtTime(3,t);
    o.connect(filt);filt.connect(g);o.start(t);o.stop(t+0.3);
    // Metal screech noise
    var n=makeFilteredNoise(0.15,'bandpass',2500,8);if(n){
      var gn=AC.createGain();gn.connect(AC.destination);
      gn.gain.setValueAtTime(0.16,t);gn.gain.exponentialRampToValueAtTime(0.001,t+0.15);
      n.filt.connect(gn);n.src.start(t);n.src.stop(t+0.15);
    }
  }catch(e){}
}

// New game: factory startup — low rumble building to a steam hiss
function playSE_NewGame(){
  try{
    var t=AC.currentTime;
    // Rumble build
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.2,t+0.3);
    g.gain.exponentialRampToValueAtTime(0.001,t+0.55);
    var o=AC.createOscillator();o.type='sawtooth';
    o.frequency.setValueAtTime(40,t);o.frequency.linearRampToValueAtTime(80,t+0.3);
    var filt=AC.createBiquadFilter();filt.type='lowpass';filt.frequency.setValueAtTime(150,t);filt.frequency.linearRampToValueAtTime(600,t+0.3);
    o.connect(filt);filt.connect(g);o.start(t);o.stop(t+0.55);
    // Steam hiss
    var n=makeFilteredNoise(0.25,'bandpass',4000,2);if(n){
      var gn=AC.createGain();gn.connect(AC.destination);
      gn.gain.setValueAtTime(0,t+0.25);gn.gain.linearRampToValueAtTime(0.18,t+0.35);
      gn.gain.exponentialRampToValueAtTime(0.001,t+0.55);
      n.filt.connect(gn);n.src.start(t+0.25);n.src.stop(t+0.55);
    }
    // Clang
    var g2=AC.createGain();g2.connect(AC.destination);
    g2.gain.setValueAtTime(0.22,t+0.4);g2.gain.exponentialRampToValueAtTime(0.001,t+0.6);
    var o2=AC.createOscillator();o2.type='sine';o2.frequency.setValueAtTime(1800,t+0.4);
    o2.frequency.exponentialRampToValueAtTime(600,t+0.55);
    o2.connect(g2);o2.start(t+0.4);o2.stop(t+0.6);
  }catch(e){}
}

// Fanfare: factory victory — rhythmic clangs + steam whistle + siren sweep
function playSE_Fanfare(){
  try{
    var t=AC.currentTime;
    // Rhythmic clangs — like hitting pipes
    var clangs=[0, 0.18, 0.32, 0.44, 0.53];
    var freqs=[1200,900,1400,800,1600];
    clangs.forEach(function(dt,i){
      var ti=t+dt;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.22,ti);g.gain.exponentialRampToValueAtTime(0.001,ti+0.18);
      var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(freqs[i],ti);
      o.frequency.exponentialRampToValueAtTime(freqs[i]*0.4,ti+0.15);
      o.connect(g);o.start(ti);o.stop(ti+0.18);
      // Each clang has a noise burst
      var n=makeFilteredNoise(0.04,'highpass',3000);if(n){
        var gn=AC.createGain();gn.connect(AC.destination);
        gn.gain.setValueAtTime(0.15,ti);gn.gain.exponentialRampToValueAtTime(0.001,ti+0.04);
        n.filt.connect(gn);n.src.start(ti);n.src.stop(ti+0.04);
      }
    });
    // Steam whistle — rising tone after the clangs
    var wt=t+0.7;
    var gw=AC.createGain();gw.connect(AC.destination);
    gw.gain.setValueAtTime(0,wt);gw.gain.linearRampToValueAtTime(0.25,wt+0.08);
    gw.gain.setValueAtTime(0.25,wt+0.55);gw.gain.exponentialRampToValueAtTime(0.001,wt+0.7);
    var ow=AC.createOscillator();ow.type='sawtooth';ow.frequency.setValueAtTime(600,wt);
    var fw=AC.createBiquadFilter();fw.type='bandpass';fw.frequency.setValueAtTime(1200,wt);fw.Q.setValueAtTime(4,wt);
    ow.connect(fw);fw.connect(gw);ow.start(wt);ow.stop(wt+0.72);
    // Steam hiss under whistle
    var nh=makeFilteredNoise(0.6,'bandpass',3500,2);if(nh){
      var gh=AC.createGain();gh.connect(AC.destination);
      gh.gain.setValueAtTime(0,wt);gh.gain.linearRampToValueAtTime(0.1,wt+0.08);
      gh.gain.exponentialRampToValueAtTime(0.001,wt+0.65);
      nh.filt.connect(gh);nh.src.start(wt);nh.src.stop(wt+0.65);
    }
  }catch(e){}
}

// playScaleNote: plays one note of the completion scale, styled to match current sound style
function playScaleNote(freq){
  if(window._sfxOn===false||!AC)return;
  try{
    var t=AC.currentTime;
    if(SOUND_STYLE==='B'){
      // 8-bit: short square blip
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.14,t);g.gain.setValueAtTime(0.14,t+0.07);g.gain.setValueAtTime(0,t+0.075);
      var o=AC.createOscillator();o.type='square';o.frequency.setValueAtTime(freq,t);
      o.connect(g);o.start(t);o.stop(t+0.08);
    } else if(SOUND_STYLE==='C'){
      // Sci-Fi: sine with fast vibrato
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.13,t+0.02);
      g.gain.exponentialRampToValueAtTime(0.001,t+0.18);
      var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(freq,t);
      var lfo=AC.createOscillator();lfo.type='sine';lfo.frequency.setValueAtTime(14,t);
      var lg=AC.createGain();lg.gain.setValueAtTime(freq*0.012,t);
      lfo.connect(lg);lg.connect(o.frequency);lfo.start(t);lfo.stop(t+0.18);
      o.connect(g);o.start(t);o.stop(t+0.18);
    } else if(SOUND_STYLE==='D'){
      // Nature: bird chirp — quick sine rise
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.15,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.09);
      var o=AC.createOscillator();o.type='sine';
      o.frequency.setValueAtTime(freq,t);o.frequency.exponentialRampToValueAtTime(freq*1.25,t+0.07);
      o.connect(g);o.start(t);o.stop(t+0.09);
    } else if(SOUND_STYLE==='E'){
      // Industrial: metallic thud + ring
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0.22,t);g.gain.exponentialRampToValueAtTime(0.001,t+0.14);
      var o=AC.createOscillator();o.type='sine';o.frequency.setValueAtTime(freq,t);
      o.frequency.exponentialRampToValueAtTime(freq*0.4,t+0.12);
      o.connect(g);o.start(t);o.stop(t+0.14);
      // High ring overtone
      var g2=AC.createGain();g2.connect(AC.destination);
      g2.gain.setValueAtTime(0.08,t);g2.gain.exponentialRampToValueAtTime(0.001,t+0.1);
      var o2=AC.createOscillator();o2.type='sine';o2.frequency.setValueAtTime(freq*5.2,t);
      o2.connect(g2);o2.start(t);o2.stop(t+0.1);
    } else {
      // Style A (Classic): soft triangle tone with smooth decay
      var g=AC.createGain();g.connect(getMasterDest());
      g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.18,t+0.02);
      g.gain.exponentialRampToValueAtTime(0.001,t+0.22);
      var o=AC.createOscillator();o.type='triangle';o.frequency.setValueAtTime(freq,t);
      o.connect(g);o.start(t);o.stop(t+0.22);
    }
  }catch(e){}
}

// ── Dispatch functions (route to current style) ─────────────────────

function _dispatch(a,b,c,d,e){
  if(SOUND_STYLE==='B')return b();
  if(SOUND_STYLE==='C')return c();
  if(SOUND_STYLE==='D')return d();
  if(SOUND_STYLE==='E')return e();
  a();
}
// [v4.60] Master sfx-off gate. Each dispatch entry point bails when
// window._sfxOn === false. The hardcoded `!AC return` checks below
// piggyback on this — adding the `_sfxOn` check at the top of the
// same line preserves the original short-circuit pattern.
function playSelEmpty(){  if(window._sfxOn===false||!AC)return;resumeAC();_dispatch(playSA_SelEmpty,playSB_SelEmpty,playSC_SelEmpty,playSD_SelEmpty,playSE_SelEmpty);}
function playSelFilled(){ if(window._sfxOn===false||!AC)return;resumeAC();_dispatch(playSA_SelFilled,playSB_SelFilled,playSC_SelFilled,playSD_SelFilled,playSE_SelFilled);}
function playPlace(){     if(window._sfxOn===false||!AC)return;resumeAC();_dispatch(playSA_Place,playSB_Place,playSC_Place,playSD_Place,playSE_Place);}
function playReturn(){    if(window._sfxOn===false||!AC)return;resumeAC();_dispatch(playSA_Return,playSB_Return,playSC_Return,playSD_Return,playSE_Return);}
function playError(){     if(window._sfxOn===false||!AC)return;resumeAC();_dispatch(playSA_Error,playSB_Error,playSC_Error,playSD_Error,playSE_Error);}
function playNewGame(){   if(window._sfxOn===false||!AC)return;resumeAC();_dispatch(playSA_NewGame,playSB_NewGame,playSC_NewGame,playSD_NewGame,playSE_NewGame);}
function playFanfare(){   if(window._sfxOn===false||!AC)return;resumeAC();_dispatch(playSA_Fanfare,playSB_Fanfare,playSC_Fanfare,playSD_Fanfare,playSE_Fanfare);}
// [v2.16] Drag-related tile sounds.
//
// playTilePickup — quiet low pop when the user first picks up a tile
//   from the bank (drag enters dragging state). A brief sine burst,
//   short and quiet, just to confirm the lift.
//
// playTileSnapWhoosh — short filtered-noise whoosh when the magnet
//   snaps a tile to a cell. Replaces the v1.92 click (playSelEmpty)
//   per user feedback that the click was too loud and the wrong
//   character. Approximately half the perceived volume of the click.
function playTilePickup(){
  if(window._sfxOn===false||!AC) return; resumeAC();
  if(!window._sfxSettings || !window._sfxSettings.buttonFx) return;
  try{
    var t = AC.currentTime;
    var g = AC.createGain();
    g.gain.setValueAtTime(0.18, t);
    g.gain.exponentialRampToValueAtTime(0.001, t + 0.08);
    g.connect(AC.destination);
    var o = AC.createOscillator();
    o.type = 'sine';
    o.frequency.setValueAtTime(280, t);
    o.frequency.exponentialRampToValueAtTime(180, t + 0.07);
    o.connect(g);
    o.start(t);
    o.stop(t + 0.09);
  }catch(e){}
}
// [v2.17] Tile-snap pop — variant of playTilePickup, used when the
// magnet locks a tile to a cell. Same timbre (sine pop, sub-second)
// so the dock and undock sounds feel related, but pitched a bit
// HIGHER and the contour goes UP→DOWN→UP slightly (a "pip") so it
// reads as the inverse of the pickup. Quieter than pickup so high
// snap-rates during cell-to-cell hopping aren't fatiguing.
function playTileSnap(){
  if(window._sfxOn===false||!AC) return; resumeAC();
  if(!window._sfxSettings || !window._sfxSettings.buttonFx) return;
  try{
    var t = AC.currentTime;
    var g = AC.createGain();
    g.gain.setValueAtTime(0.10, t);
    g.gain.exponentialRampToValueAtTime(0.001, t + 0.06);
    g.connect(AC.destination);
    var o = AC.createOscillator();
    o.type = 'sine';
    // Up-pitch sweep, the inverse contour of pickup's down-sweep.
    o.frequency.setValueAtTime(360, t);
    o.frequency.exponentialRampToValueAtTime(520, t + 0.05);
    o.connect(g);
    o.start(t);
    o.stop(t + 0.07);
  }catch(e){}
}
// [v2.34] Tile-return pop — fired when a dragged tile bounces
// back to its bank slot (drag released without dropping on a
// cell). Mirror of playTilePickup: same waveform, duration, and
// gain, but the pitch sweep goes UP (180→280 Hz) instead of
// down. Reads as the inverse of pickup: lift = pitch falls,
// return = pitch rises back to where pickup started.
function playTileReturn(){
  if(window._sfxOn===false||!AC) return; resumeAC();
  if(!window._sfxSettings || !window._sfxSettings.buttonFx) return;
  try{
    var t = AC.currentTime;
    var g = AC.createGain();
    // [v3.58] Reverted — turns out the v3.55-3.57 bumps were on
    // the WRONG function. This one (playTileReturn) fires when a
    // dragged tile bounces back to the bank, NOT when a placed
    // tile is tapped to return. The tap-return sound is
    // playSA_Return (style A) which IS now appropriately loud.
    // Restored to original 0.18 since drag-bounce-return is a
    // secondary action and was fine at the original level.
    g.gain.setValueAtTime(0.18, t);
    g.gain.exponentialRampToValueAtTime(0.001, t + 0.08);
    g.connect(AC.destination);
    var o = AC.createOscillator();
    o.type = 'sine';
    o.frequency.setValueAtTime(180, t);
    o.frequency.exponentialRampToValueAtTime(280, t + 0.07);
    o.connect(g);
    o.start(t);
    o.stop(t + 0.09);
  }catch(e){}
}
function playTileSnapWhoosh(){
  if(window._sfxOn===false||!AC) return; resumeAC();
  if(!window._sfxSettings || !window._sfxSettings.buttonFx) return;
  try{
    var t = AC.currentTime;
    var dur = 0.09;
    // Short noise buffer
    var sr = AC.sampleRate;
    var len = Math.floor(sr * (dur + 0.02));
    var buf = AC.createBuffer(1, len, sr);
    var d = buf.getChannelData(0);
    for(var i = 0; i < len; i++) d[i] = Math.random() * 2 - 1;
    var src = AC.createBufferSource();
    src.buffer = buf;
    var filt = AC.createBiquadFilter();
    filt.type = 'bandpass';
    filt.frequency.setValueAtTime(900, t);
    filt.frequency.linearRampToValueAtTime(1700, t + dur);
    filt.Q.value = 0.9;
    var g = AC.createGain();
    // Half volume of the prior playSelEmpty click. The click was
    // ~0.45 peak; we target ~0.09 peak here (well below half) since
    // bandpass-filtered noise reads louder than a tone at the same
    // peak amplitude.
    g.gain.setValueAtTime(0, t);
    g.gain.linearRampToValueAtTime(0.09, t + 0.012);
    g.gain.exponentialRampToValueAtTime(0.001, t + dur);
    src.connect(filt); filt.connect(g); g.connect(AC.destination);
    src.start(t);
    src.stop(t + dur + 0.02);
  }catch(e){}
}
function playUIClick(){
  if(window._sfxOn===false||!AC)return;resumeAC();
  try{
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.15,AC.currentTime);
    g.gain.exponentialRampToValueAtTime(0.001,AC.currentTime+0.06);
    var o=AC.createOscillator();o.type='sine';
    o.frequency.setValueAtTime(600,AC.currentTime);
    o.frequency.exponentialRampToValueAtTime(480,AC.currentTime+0.05);
    o.connect(g);o.start(AC.currentTime);o.stop(AC.currentTime+0.06);
  }catch(e){}
}
function playGreeting(){
  if(window._sfxOn===false||!AC)return;resumeAC();
  try{
    var notes=[392,523,659,784];
    for(var i=0;i<notes.length;i++){
      var t=AC.currentTime+i*0.1;
      var g=AC.createGain();g.connect(AC.destination);
      g.gain.setValueAtTime(0,t);g.gain.linearRampToValueAtTime(0.18,t+0.03);
      g.gain.exponentialRampToValueAtTime(0.001,t+0.25);
      var o=AC.createOscillator();o.type='sine';
      o.frequency.setValueAtTime(notes[i],t);
      o.connect(g);o.start(t);o.stop(t+0.25);
    }
  }catch(e){}
}

// ═══════════════════════════════════════════════════════════
// BANK TILE SOUNDS — 70 per style, dispatched by SOUND_STYLE
// ═══════════════════════════════════════════════════════════
// User-recorded samples: index -> AudioBuffer
// [Equil 1.01] Removed: kit/sample machinery + bank synths (playBankA-K + helpers) — all sequencer-only.
// Stubs kept: empty userSamples/sampleMeta/recVolume objects so renderBank's defensive
// reads (e.g. `userSamples[idx]`, `sampleMeta[idx] || {}`) don't throw ReferenceError.
// playBankSound stub: silent no-op so any lingering call site does nothing.
var userSamples = {};
var sampleMeta = {};
var recVolume = 1.0;
function playBankSound(idx, eventVol, notePan, notePanV){ /* sequencer-only, removed */ }


// ═══════════════════════════════════════════════════════════
// [Equil 1.13] FEATURES MODULE
// Timer, move counter, daily-puzzle seeded RNG, stats tracking,
// shareable result, win flash. All state lives on window._mc113
// to avoid conflicts with the existing globals. Wired into render(),
// place(), undo(), newPuzzle(), winCheck()-callsite, and the start
// screen / win card UI.
// ═══════════════════════════════════════════════════════════
window._mc113 = (function(){
  var STATS_KEY='mc_stats_v1';
  var DAILY_KEY='mc_daily_v1';
  // [v3.84] Per-template best times for the ghost-runner bar. Keyed
  // by "size|diff|template" so each individual template gets its own
  // best. Schema is just { key: bestMs }. Separate from STATS_KEY so
  // the user-facing stats schema (mc_stats_v1) stays untouched.
  var TPL_BEST_KEY='equil_template_bests_v1';
  // [v3.90] Richer per-template stats so the grid-edge pace boxes
  // can show best / average / worst. Keyed by "size|diff|template".
  // Schema per entry: {best, worst, total, count} — average is
  // derived as total/count on demand. Kept parallel to TPL_BEST_KEY
  // (which stays for back-compat with the v3.84-3.89 ghost-runner
  // bar code) so neither schema is forced to migrate. Both are
  // chalant-only: nonchalant solves never write to either.
  var TPL_STATS_KEY='equil_template_stats_v1';

  // ── Timer / move counter state ──
  var startTs=null;        // ms since epoch when first move was made (null = not started)
  var elapsedMs=0;         // frozen when puzzle is won
  var won=false;
  var moves=0;
  var mistakes=0;          // [v2.68] forward-only count: each time an equation
                           //   transitions from non-bad → bad, +1. Equations
                           //   that go bad→ok→bad count again on the second
                           //   bad. Persists across undo (a mistake was still
                           //   made even if you take it back). Reset on
                           //   reset() / new puzzle.
  var badEqs={};           // [v2.68] set of equation IDs currently in 'bad'
                           //   state. Diffed against the post-placement state
                           //   to detect new transitions into bad. Cleared on
                           //   reset.
  var dailyMode=false;     // true if current puzzle is daily
  var dailyDateStr=null;   // 'YYYY-MM-DD' tag for the current daily, if any
  var rafId=null;
  // [v3.38] Pause state. paused=true freezes the timer at pauseStartElapsed
  // (the elapsed ms at the moment pause was called). On resume, startTs is
  // shifted forward by the duration spent paused so _curMs() math keeps
  // working with the existing (Date.now()-startTs) calculation.
  var paused=false;
  var pauseStartElapsed=0;

  function _pad2(n){n=Math.floor(n);return (n<10?'0':'')+n;}
  function fmtTime(ms){
    if(ms==null||isNaN(ms))ms=0;
    var s=Math.floor(ms/1000);
    var m=Math.floor(s/60); s=s%60;
    if(m>=60){var h=Math.floor(m/60); m=m%60; return h+':'+_pad2(m)+':'+_pad2(s);}
    return m+':'+_pad2(s);
  }

  function _curMs(){
    if(!startTs) return 0;
    if(won) return elapsedMs;
    // [v3.38] When paused, freeze the displayed time at the elapsed
    // value captured at pause-start. The actual startTs gets shifted
    // forward on resume() so post-resume math still works.
    if(paused) return pauseStartElapsed;
    return Date.now()-startTs;
  }

  // [v3.38] Pause: freeze timer display, stop rAF tick. Player can still
  // see the puzzle state but the overlay covers it. Resume restores by
  // shifting startTs forward by the time spent paused.
  function pause(){
    if(won||paused||!startTs) return;
    paused=true;
    pauseStartElapsed=Date.now()-startTs;
    if(rafId){cancelAnimationFrame(rafId);rafId=null;}
    _renderTimer();
    // [v3.49] Capture progress at pause so the saved elapsed matches
    // what the player sees.
    _saveProgress();
  }
  function resume(){
    if(!paused) return;
    paused=false;
    // Shift startTs so (now - startTs) again equals pauseStartElapsed
    // at the instant of resume — i.e., the timer continues from where
    // it left off, no jump.
    startTs=Date.now()-pauseStartElapsed;
    pauseStartElapsed=0;
    if(!won) _tick();
  }
  function isPaused(){return paused;}

  // [v3.49] In-progress puzzle save/restore.
  // Persists the full puzzle state (PZ object + mc113 state vars) to
  // localStorage so the player can exit and resume later. Saved on
  // every move + pause + visibility-change, cleared on new puzzle
  // and on win. On next launch, the menu screen offers to restore
  // if a save exists with elapsed > 30s and !won (sub-30s puzzles
  // aren't worth saving — easier to start fresh than to navigate
  // a Resume prompt).
  //
  // Schema:
  //   { ver: 1,
  //     pz: <window.PZ> (full serializable object),
  //     size, diff, tpl,
  //     ts: { elapsed, moves, mistakes, badEqs, daily, dailyDate },
  //     savedAt: ms-since-epoch }
  // [v3.50] Per-(size,diff) save slots. Storage key '_equilProgressMap'
  // is an object keyed by 'size|diff' so the player can have, e.g.,
  // a small-hard game and a large-medium game both paused at once
  // and resume the matching one when they pick that mode.
  //
  // Per-slot schema (unchanged from v3.49):
  //   { ver: 1, pz, size, diff, tpl,
  //     ts: { elapsed, moves, mistakes, badEqs, daily, dailyDate },
  //     savedAt }
  function _progressKey(size, diff){
    return (size||'')+'|'+(diff||'');
  }
  function _readMap(){
    try{
      var raw=localStorage.getItem('_equilProgressMap');
      if(raw){
        var m=JSON.parse(raw);
        if(m&&typeof m==='object')return m;
      }
    }catch(e){}
    // [v3.50] One-time migration from the old single-slot v3.49 key.
    // Slurps the old payload into the new map at its (size,diff) slot
    // and removes the legacy key. Harmless if absent.
    try{
      var legacy=localStorage.getItem('_equilProgress');
      if(legacy){
        var p=JSON.parse(legacy);
        if(p&&p.ver===1&&p.pz&&p.size&&p.diff){
          var map={};
          map[_progressKey(p.size,p.diff)]=p;
          localStorage.setItem('_equilProgressMap', JSON.stringify(map));
          localStorage.removeItem('_equilProgress');
          return map;
        }
        localStorage.removeItem('_equilProgress');
      }
    }catch(e){}
    return {};
  }
  function _writeMap(m){
    try{localStorage.setItem('_equilProgressMap', JSON.stringify(m||{}));}catch(e){}
  }

  function _saveProgress(){
    try{
      if(!window.PZ||won)return;
      // [v3.50] Don't save if the player hasn't made any moves yet.
      // A "save" with moves=0 is just a fresh puzzle the player
      // never touched — no value in offering to resume it, and it
      // would prompt for resume on every Play tap until something
      // overwrites it.
      if(moves===0||!startTs)return;
      var size=window.SIZE||null, diff=window.DIFF||null;
      if(!size||!diff)return;
      var elapsed=paused?pauseStartElapsed:Date.now()-startTs;
      var payload={
        ver:1,
        pz:window.PZ,
        size:size,
        diff:diff,
        tpl:(window._currentTplName||null),
        ts:{
          elapsed:elapsed,
          moves:moves,
          mistakes:mistakes,
          badEqs:badEqs,
          daily:dailyMode,
          dailyDate:dailyDateStr
        },
        savedAt:Date.now()
      };
      var map=_readMap();
      map[_progressKey(size,diff)]=payload;
      _writeMap(map);
    }catch(e){
      // Quota / circular ref / etc — fail silently.
    }
  }
  // [v3.50] _loadProgress now takes (size, diff) and returns the
  // saved slot for that mode, or null. The legacy no-arg call still
  // works for backwards compatibility — returns the current SIZE/DIFF
  // slot if any, or null.
  function _loadProgress(size, diff){
    if(arguments.length===0){
      size=window.SIZE; diff=window.DIFF;
    }
    try{
      if(!size||!diff)return null;
      var map=_readMap();
      var p=map[_progressKey(size,diff)];
      if(!p||p.ver!==1||!p.pz)return null;
      return p;
    }catch(e){return null;}
  }
  // [v3.50] _clearProgress now takes (size, diff). No-arg clears the
  // current SIZE/DIFF slot, matching the old behavior.
  function _clearProgress(size, diff){
    if(arguments.length===0){
      size=window.SIZE; diff=window.DIFF;
    }
    if(!size||!diff)return;
    try{
      var map=_readMap();
      if(map[_progressKey(size,diff)]){
        delete map[_progressKey(size,diff)];
        _writeMap(map);
      }
    }catch(e){}
  }
  // List all (size,diff) slots that have a saved game. Useful for
  // optional future UI ("you have 3 games in progress").
  function _listProgress(){
    var out=[];
    try{
      var map=_readMap();
      for(var k in map){
        if(Object.prototype.hasOwnProperty.call(map,k)){
          var p=map[k];
          if(p&&p.ver===1&&p.pz)out.push(p);
        }
      }
    }catch(e){}
    return out;
  }
  // Restore mc113 state from a previously-saved payload. The PZ
  // object itself is assigned by the caller (showGame flow handles
  // grid rendering); this just rehydrates the timer/move/mistake
  // bookkeeping so when the player resumes, the timer continues
  // from where it left off.
  function _restoreState(saved){
    if(!saved||!saved.ts)return;
    var s=saved.ts;
    // Set startTs to a back-dated time so (Date.now() - startTs) ==
    // saved elapsed. The timer will tick forward from this point.
    startTs=Date.now()-(s.elapsed||0);
    elapsedMs=0;
    won=false;
    moves=s.moves||0;
    mistakes=s.mistakes||0;
    badEqs=s.badEqs||{};
    dailyMode=!!s.daily;
    dailyDateStr=s.dailyDate||null;
    paused=false;
    pauseStartElapsed=0;
    _tick();
    _renderTimer();
  }

  function _renderTimer(){
    var t=document.getElementById('mastTimer');
    var mv=document.getElementById('mastMoves');
    var mk=document.getElementById('mastMistakes');
    if(t) t.textContent=fmtTime(_curMs());
    if(mv) mv.textContent=String(moves);
    // [v2.68] Mistakes pip — only visible after first mistake. Hidden at
    // 0 to keep the masthead uncluttered for clean runs.
    if(mk){
      mk.textContent=String(mistakes);
      var pip=document.getElementById('mastMistakesWrap');
      // Use inline-flex (not inline) so the inner gap:14px between the
      // separator dot and the count value works the same way it does
      // for the parent masthead row.
      if(pip) pip.style.display=(mistakes>0?'inline-flex':'none');
    }
    // [v3.84] Update the ghost-runner bar each tick. Lives in the
    // outer scope as window._updateGhostBar (defined at puzzle init).
    if(window._updateGhostBar) window._updateGhostBar(_curMs());
    // [v3.90] Same for the grid-edge pace boxes — they need elapsed
    // time to know when to intensify and when each one collapses.
    // [v4.20] Pace BOXES tick disabled — see v4.20 note above.
    // if(window._updatePaceBoxes) window._updatePaceBoxes(_curMs());
    if(window._updatePaceRings) window._updatePaceRings(_curMs());
    // [v4.47] Pace stats — gray out passed targets.
    if(window._updatePaceStats) window._updatePaceStats(_curMs());
  }

  function _tick(){
    rafId=null;
    _renderTimer();
    if(!won && startTs) rafId=requestAnimationFrame(_tick);
  }

  function reset(opts){
    // opts.daily = true means lock-in daily mode for this puzzle.
    // opts.dateStr = the day tag (YYYY-MM-DD) if daily.
    // opts.skipClearProgress = true means we're about to restore a
    //   saved puzzle and shouldn't wipe its localStorage entry first.
    if(rafId){cancelAnimationFrame(rafId);rafId=null;}
    startTs=null; elapsedMs=0; won=false; moves=0;
    // [v2.68] Reset mistake tracking on every new puzzle.
    mistakes=0; badEqs={};
    // [v3.38] Clear pause state on new puzzle.
    paused=false; pauseStartElapsed=0;
    dailyMode=!!(opts&&opts.daily);
    dailyDateStr=(opts&&opts.dateStr)||null;
    _renderTimer();
    // [v3.49] Reset means we're starting fresh — discard any saved
    // in-progress puzzle. Caller can pass skipClearProgress:true
    // when about to restore (so save survives long enough to read).
    if(!(opts&&opts.skipClearProgress))_clearProgress();
  }

  function noteMove(){
    // Called from place() and undo(). Starts the timer on first move.
    if(won) return;
    if(!startTs){ startTs=Date.now(); _tick(); }
    moves++;
    _renderTimer();
    // [v3.49] Auto-save progress so the puzzle can be resumed.
    _saveProgress();
  }

  // [v3.42] Explicitly start the timer without incrementing moves.
  // Called when the user taps GO on the ready overlay so the timing
  // baseline reflects "I've actually started thinking about this
  // puzzle" rather than "I made my first move after 90s of staring".
  // No-op if already started or already won.
  function startTimer(){
    if(won||startTs)return;
    startTs=Date.now();
    _tick();
    _renderTimer();
  }

  // [v2.68] Called from place() AFTER the placement has been applied
  // (so valEq() sees the new state). Walks every equation in the
  // puzzle, computes its current status, and compares to badEqs (the
  // set of equations that were 'bad' before this placement). Any
  // equation that just transitioned from non-bad → bad counts as one
  // mistake. Equations that go bad → ok aren't penalized (you fixed
  // it). An equation that goes bad → ok → bad on a later move counts
  // again — that's correct: you broke the same row twice.
  //
  // Note we do NOT decrement on undo — a mistake was made, undoing it
  // doesn't unmake the experience. (And tying the counter to undo
  // would let players game it by always undoing wrong placements.)
  function noteEval(pz){
    if(won) return;
    if(!pz||!pz.tmpl||!window.valEq) return;
    var newBad={};
    var newlyBad=0;
    for(var i=0;i<pz.tmpl.length;i++){
      var e=pz.tmpl[i];
      var s=window.valEq(e,pz.CM,pz.OPS);
      if(s==='bad'){
        newBad[e.id]=true;
        if(!badEqs[e.id]) newlyBad++;
      }
    }
    badEqs=newBad;
    if(newlyBad>0){
      mistakes+=newlyBad;
      _renderTimer();
    }
  }
  function getMistakes(){return mistakes;}

  function markWon(){
    if(won) return;
    won=true;
    elapsedMs=startTs?(Date.now()-startTs):0;
    if(rafId){cancelAnimationFrame(rafId);rafId=null;}
    _renderTimer();
    // [v3.49] Won — puzzle is done, drop the saved in-progress state.
    _clearProgress();
    // Subtle screen flash on the final lock — pure CSS animation.
    // Note: the inline style="display:none" on #winFlash beats any
    // external CSS rule by specificity, so we set display directly via
    // JS rather than relying on the .active class to flip it.
    try{
      var f=document.getElementById('winFlash');
      if(f){
        f.classList.remove('active');
        f.style.display='block';
        // Force reflow so re-adding the class re-triggers the animation
        // (otherwise repeat wins in the same session wouldn't flash again).
        void f.offsetWidth;
        f.classList.add('active');
        setTimeout(function(){f.classList.remove('active');f.style.display='none';},800);
      }
    }catch(e){}
  }

  // ── Stats persistence ──
  // Schema: { 'small|easy': {solved, bestMs, totalMs, bestMoves,
  //                          bestMistakes, cleanRuns}, ...,
  //           daily: {solved, lastDate} }
  // [v2.68] bestMistakes & cleanRuns added — old saved records that
  // predate v2.68 will lack these fields and the recordWin path
  // initialises them lazily on next solve. Old records are NOT
  // migrated retroactively (we don't know the mistake counts of past
  // runs).
  function _loadStats(){
    try{
      var raw=localStorage.getItem(STATS_KEY);
      if(!raw) return {};
      var o=JSON.parse(raw);
      return (o && typeof o==='object')?o:{};
    }catch(e){return {};}
  }
  function _saveStats(s){
    try{localStorage.setItem(STATS_KEY,JSON.stringify(s));}catch(e){}
  }

  // [v3.84] Per-template best-time storage. Separate map keyed by
  // "size|diff|template" so each template has its own best for the
  // ghost-runner bar.
  function _loadTplBests(){
    try{
      var raw=localStorage.getItem(TPL_BEST_KEY);
      if(!raw) return {};
      var o=JSON.parse(raw);
      return (o && typeof o==='object')?o:{};
    }catch(e){return {};}
  }
  function _saveTplBests(m){
    try{localStorage.setItem(TPL_BEST_KEY,JSON.stringify(m));}catch(e){}
  }
  function _recordTplBest(size, diff, tplName, ms){
    if(!size || !diff || !tplName || !(ms > 0)) return false;
    var m = _loadTplBests();
    var k = size+'|'+diff+'|'+tplName;
    var prev = m[k];
    if(prev != null && prev <= ms) return false;  // not a new best
    m[k] = ms;
    _saveTplBests(m);
    return true;
  }
  // [v3.85] Returns {ms} if we have a recorded best for this exact
  // template+size+diff, or null otherwise. Previously this fell back
  // to the broader size|diff aggregate when no template record
  // existed — but in practice that meant a brutal sub-30s small-hard
  // best would become the ghost time for a fresh medium-hard
  // template, which is impossible to race and bad UX. Better to
  // just show no bar than a wildly wrong one.
  function getGhostBest(size, diff, tplName){
    if(!tplName) return null;
    var m = _loadTplBests();
    var k = size+'|'+diff+'|'+tplName;
    if(m[k] > 0) return {ms: m[k]};
    return null;
  }

  // [v3.90] Richer per-template stats — best, worst, average. Used
  // by the grid-edge pace boxes.
  function _loadTplStats(){
    try{
      var raw=localStorage.getItem(TPL_STATS_KEY);
      if(!raw) return {};
      var o=JSON.parse(raw);
      return (o && typeof o==='object')?o:{};
    }catch(e){return {};}
  }
  function _saveTplStats(m){
    try{localStorage.setItem(TPL_STATS_KEY,JSON.stringify(m));}catch(e){}
  }
  // Record a chalant solve into the rich tpl stats. Returns the
  // updated entry (or null on failure).
  // [v4.10] Now tracks moves alongside time. Entries written by
  // pre-v4.10 versions lack {bestMoves, worstMoves, totalMoves};
  // those fields initialize lazily on the next solve. We do NOT
  // backfill old records (we don't have the historical move counts).
  function _recordTplStats(size, diff, tplName, ms, moves){
    if(!size || !diff || !tplName || !(ms > 0)) return null;
    var m = _loadTplStats();
    var k = size+'|'+diff+'|'+tplName;
    var e = m[k];
    var hasMoves = (typeof moves === 'number' && moves > 0);
    if(!e){
      e = {best: ms, worst: ms, total: ms, count: 1};
      if(hasMoves){
        e.bestMoves  = moves;
        e.worstMoves = moves;
        e.totalMoves = moves;
        e.movesCount = 1;
      }
    } else {
      if(ms < e.best)  e.best  = ms;
      if(ms > e.worst) e.worst = ms;
      e.total += ms;
      e.count += 1;
      if(hasMoves){
        // Lazy init: if this is the first run with moves info for
        // a pre-v4.10 record, seed all three fields from this solve.
        if(e.bestMoves == null){
          e.bestMoves  = moves;
          e.worstMoves = moves;
          e.totalMoves = moves;
          e.movesCount = 1;
        } else {
          if(moves < e.bestMoves)  e.bestMoves  = moves;
          if(moves > e.worstMoves) e.worstMoves = moves;
          e.totalMoves += moves;
          e.movesCount = (e.movesCount || 0) + 1;
        }
      }
    }
    m[k] = e;
    _saveTplStats(m);
    return e;
  }
  // Returns {best, worst, avg, count, bestMoves, worstMoves, avgMoves,
  // movesCount} or null. Move stats may be null if no recorded solves
  // have moves data yet (pre-v4.10 entries that haven't been refreshed
  // by a new solve).
  //   count === 1: only `best` is meaningful (best === worst === avg).
  //   count === 2: best and worst are real; avg is just their midpoint.
  //   count >= 3: full triple available.
  // The caller decides which boxes to show based on count.
  function getGhostStats(size, diff, tplName){
    if(!tplName) return null;
    var m = _loadTplStats();
    var k = size+'|'+diff+'|'+tplName;
    var e = m[k];
    if(!e || !(e.count > 0)) return null;
    var out = {
      best: e.best,
      worst: e.worst,
      avg: Math.round(e.total / e.count),
      count: e.count,
      bestMoves: null,
      worstMoves: null,
      avgMoves: null,
      movesCount: 0
    };
    if(e.bestMoves != null && e.movesCount > 0){
      out.bestMoves  = e.bestMoves;
      out.worstMoves = e.worstMoves;
      out.avgMoves   = Math.round(e.totalMoves / e.movesCount);
      out.movesCount = e.movesCount;
    }
    return out;
  }

  function recordWin(size,diff,ms,movesCount,isDaily,dateStr,mistakesCount){
    var s=_loadStats();
    var key=size+'|'+diff;
    var rec=s[key]||{solved:0,bestMs:null,totalMs:0,bestMoves:null,bestMistakes:null,cleanRuns:0};
    var isPB=(rec.bestMs==null||ms<rec.bestMs);
    rec.solved++;
    rec.totalMs+=ms;
    if(rec.bestMs==null||ms<rec.bestMs) rec.bestMs=ms;
    if(rec.bestMoves==null||movesCount<rec.bestMoves) rec.bestMoves=movesCount;
    // [v2.68] Track mistakes per record. bestMistakes = lowest mistake
    // count for any solved run at this size/diff. cleanRuns = count of
    // solves with zero mistakes.
    if(typeof mistakesCount==='number'){
      if(rec.bestMistakes==null||mistakesCount<rec.bestMistakes) rec.bestMistakes=mistakesCount;
      if(mistakesCount===0) rec.cleanRuns=(rec.cleanRuns||0)+1;
    }
    s[key]=rec;
    // [v3.35] Also record into the TIMES debug panel storage. Independent
    // from the user-facing stats so a RESET TIMES doesn't clobber the
    // user's best/etc.
    // [v3.36] Now also passes mistakes count for per-entry display.
    try{if(window._dbgRecordTime)window._dbgRecordTime(size,diff,ms,mistakesCount);}catch(e){}
    // Daily tracking — store just the latest completed daily date and a
    // running solve count. No streaks shown to the user (per spec: honest
    // numbers only, no streak rewards).
    if(isDaily && dateStr){
      s.daily=s.daily||{solved:0,lastDate:null};
      if(s.daily.lastDate!==dateStr){
        s.daily.solved++;
        s.daily.lastDate=dateStr;
      }
    }
    _saveStats(s);
    return {isPB:isPB, rec:rec, clean:(typeof mistakesCount==='number' && mistakesCount===0)};
  }

  function getStats(){return _loadStats();}
  function clearStats(){try{localStorage.removeItem(STATS_KEY);}catch(e){}}

  // ── Daily seed ──
  // Returns YYYY-MM-DD in local time so "today" matches the player's day.
  function todayStr(d){
    d=d||new Date();
    var y=d.getFullYear();
    var m=d.getMonth()+1;
    var day=d.getDate();
    return y+'-'+(m<10?'0':'')+m+'-'+(day<10?'0':'')+day;
  }
  // FNV-1a-ish 32-bit hash over a string → unsigned int seed.
  function hashStr(s){
    var h=2166136261>>>0;
    for(var i=0;i<s.length;i++){
      h^=s.charCodeAt(i);
      h=Math.imul(h,16777619)>>>0;
    }
    return h>>>0;
  }
  // Mulberry32 PRNG: returns [0,1) just like Math.random.
  function mulberry32(a){
    return function(){
      a|=0; a=(a+0x6D2B79F5)|0;
      var t=Math.imul(a^(a>>>15),1|a);
      t=(t+Math.imul(t^(t>>>7),61|t))^t;
      return ((t^(t>>>14))>>>0)/4294967296;
    };
  }
  // Run `fn` with Math.random replaced by a seeded PRNG. Always restores
  // the original Math.random afterward (even on throw).
  function withSeed(seed,fn){
    var orig=Math.random;
    Math.random=mulberry32(seed>>>0);
    try{return fn();}finally{Math.random=orig;}
  }

  // ── Share string ──
  // Builds a Wordle-style multi-line emoji grid showing the solved layout.
  // 🟦 = filled-by-player blank that's now correct (solved tile)
  // 🟪 = a "given" number cell (pre-filled clue)
  // ⬜ = empty/non-cell space inside the bounding box
  // The grid covers only the bounding box of cells that are part of the
  // puzzle (so an irregular xl2 layout doesn't get padded with huge
  // amounts of whitespace).
  function buildShareText(pz,size,diff,ms,movesCount,isDaily,dateStr,mistakesCount){
    var minC=Infinity,maxC=-Infinity,minR=Infinity,maxR=-Infinity;
    for(var k in pz.CM){
      var c=pz.CM[k];
      if(c.c<minC)minC=c.c; if(c.c>maxC)maxC=c.c;
      if(c.r<minR)minR=c.r; if(c.r>maxR)maxR=c.r;
    }
    // Render row-by-row, but only emit num cells (skip ops & = signs)
    // — those would clutter the share. We use a coarse grid where each
    // num cell is one square.
    var lines=[];
    // To keep the grid compact and readable, we sample only num/eq rows
    // (where actual placeable cells live). Build a dense numeric grid:
    var W=maxC-minC+1, H=maxR-minR+1;
    // Cap dimensions for shareability — 14 wide/tall max, scale by stride.
    var strideC=Math.max(1,Math.ceil(W/14));
    var strideR=Math.max(1,Math.ceil(H/14));
    for(var r=minR;r<=maxR;r+=strideR){
      var line='';
      for(var col=minC;col<=maxC;col+=strideC){
        var key=col+','+r;
        var cell=pz.CM[key];
        if(!cell){line+='⬜'; continue;}
        if(cell.role==='num'){
          if(cell.isGiven){line+='🟪';}
          else if(cell.isBlank){line+='🟦';}
          else line+='⬜';
        } else {
          // Op or = — render as a thin spacer
          line+='⬛';
        }
      }
      lines.push(line);
    }
    var head;
    if(isDaily){
      head='Equil Daily '+(dateStr||'')+' — '+fmtTime(ms);
    } else {
      // [v2.69] sizeLabel() so 'xl2' shows as 'JUMBO' in shared
      // results. Falls back to upper-cased raw key for unknown sizes.
      // [v4.63] diffLabel() so 'medium' shows as 'INTERMEDIATE' etc.
      var sLbl=(window.sizeLabel?window.sizeLabel(size):size.toUpperCase());
      var dLbl=(window.diffLabel?window.diffLabel(diff):diff.toUpperCase());
      head='Equil '+sLbl+' '+dLbl+' — '+fmtTime(ms);
    }
    var tail=movesCount+' moves';
    // [v2.68] Append mistake count to share line. A clean run gets a
    // little badge for bragging rights; otherwise just the raw count.
    if(typeof mistakesCount==='number'){
      tail+=mistakesCount===0?' · clean ✓':' · '+mistakesCount+' ✕';
    }
    tail+=' · equil.app';
    return head+'\n'+lines.join('\n')+'\n'+tail;
  }

  // Copy text to clipboard. Uses the modern API when available, falls
  // back to a textarea+execCommand for older browsers / non-secure
  // contexts (e.g. file:// preview).
  function copyText(s){
    return new Promise(function(resolve){
      var done=function(ok){resolve(!!ok);};
      try{
        if(navigator.clipboard && navigator.clipboard.writeText){
          navigator.clipboard.writeText(s).then(function(){done(true);},function(){_fallback();});
          return;
        }
      }catch(e){}
      _fallback();
      function _fallback(){
        try{
          var ta=document.createElement('textarea');
          ta.value=s; ta.style.position='fixed'; ta.style.opacity='0';
          document.body.appendChild(ta);
          ta.select();
          var ok=document.execCommand('copy');
          document.body.removeChild(ta);
          done(ok);
        }catch(e){done(false);}
      }
    });
  }

  function showToast(msg){
    var el=document.getElementById('toast');
    if(!el) return;
    el.textContent=msg;
    el.classList.remove('show');
    // Inline style="display:none" beats CSS specificity, so set it via JS.
    el.style.display='block';
    void el.offsetWidth;
    el.classList.add('show');
    setTimeout(function(){el.classList.remove('show');el.style.display='none';},1900);
  }

  // ── Stats screen rendering ──
  // [v2.68] Each row shows: solved count, best time, avg time, fewest
  // moves, fewest mistakes, and clean-run tally. Older records that
  // predate v2.68 may lack mistake fields — those just render an em
  // dash for the missing stats.
  function _statsRowHtml(label,rec){
    if(!rec||!rec.solved) return '<div style="opacity:0.5;">'+label+': —</div>';
    var avg=rec.solved?Math.round(rec.totalMs/rec.solved):0;
    var bestMv=(rec.bestMoves!=null)?rec.bestMoves:'—';
    var bestMk=(rec.bestMistakes!=null)?rec.bestMistakes:'—';
    var clean=rec.cleanRuns||0;
    return '<div style="margin-bottom:8px;">'+
      '<div style="color:var(--text-primary);">'+label+' · solved '+rec.solved+'</div>'+
      '<div style="opacity:0.75;font-size:10px;padding-left:8px;">'+
        'best '+fmtTime(rec.bestMs)+' · avg '+fmtTime(avg)+
      '</div>'+
      '<div style="opacity:0.75;font-size:10px;padding-left:8px;">'+
        'fewest moves '+bestMv+' · fewest ✕ '+bestMk+
        (clean>0?' · <span style="color:var(--cyan);">clean ×'+clean+'</span>':'')+
      '</div>'+
    '</div>';
  }
  function renderStatsScreen(){
    var s=_loadStats();
    // Note: 'xl' kept in this list so any historical XL stats still
    // render even though the XL button is gone from the menu (v2.67).
    var sizes=['small','medium','large','xl','xl2'];
    var diffs=['easy','medium','hard'];
    var html='';
    if(s.daily && s.daily.solved){
      html+='<div style="color:var(--magenta);font-weight:700;margin-bottom:10px;">★ Daily puzzles solved: '+s.daily.solved+'</div>';
    }
    var anyRow=false;
    for(var i=0;i<sizes.length;i++){
      for(var j=0;j<diffs.length;j++){
        var key=sizes[i]+'|'+diffs[j];
        if(s[key] && s[key].solved){
          // [v2.69] sizeLabel() routing — historical 'xl2' rows now
          // render as 'JUMBO / DIFF' to match the menu and masthead.
          var sLbl=(window.sizeLabel?window.sizeLabel(sizes[i]):sizes[i].toUpperCase());
          html+=_statsRowHtml(sLbl+' / '+diffs[j].toUpperCase(),s[key]);
          anyRow=true;
        }
      }
    }
    if(!anyRow && !(s.daily&&s.daily.solved)){
      html='<div style="opacity:0.6;text-align:center;padding:18px 0;">No puzzles solved yet.<br/>Play one to start tracking.</div>';
    }
    var body=document.getElementById('statsBody');
    if(body) body.innerHTML=html;
  }

  return {
    reset:reset,
    noteMove:noteMove,
    noteEval:noteEval,
    markWon:markWon,
    fmtTime:fmtTime,
    curMs:_curMs,
    getMoves:function(){return moves;},
    getMistakes:getMistakes,
    isWon:function(){return won;},
    isDaily:function(){return dailyMode;},
    dailyDateStr:function(){return dailyDateStr;},
    todayStr:todayStr,
    hashStr:hashStr,
    withSeed:withSeed,
    recordWin:recordWin,
    getStats:getStats,
    clearStats:clearStats,
    // [v3.84] Ghost-runner bar APIs.
    _recordTplBest:_recordTplBest,
    getGhostBest:getGhostBest,
    // [v3.90] Grid-edge pace box APIs.
    _recordTplStats:_recordTplStats,
    getGhostStats:getGhostStats,
    buildShareText:buildShareText,
    copyText:copyText,
    showToast:showToast,
    renderStatsScreen:renderStatsScreen,
    // [v3.38] Pause controls.
    pause:pause,
    resume:resume,
    isPaused:isPaused,
    // [v3.42] Explicit timer start (used by READY overlay).
    startTimer:startTimer,
    // [v3.49] In-progress save/restore.
    saveProgress:_saveProgress,
    loadProgress:_loadProgress,
    clearProgress:_clearProgress,
    listProgress:_listProgress,
    restoreState:_restoreState
  };
})();

// [v3.49] Save in-progress puzzle when the app backgrounds or page
// hides. This catches the cases that noteMove() doesn't: idle time
// after a placement, app-switching, screen lock. The pause path
// already saves on every pause action.
(function(){
  function saveIfActive(){
    try{
      if(window._mc113&&window._mc113.saveProgress&&!window._mc113.isWon()){
        window._mc113.saveProgress();
      }
    }catch(e){}
  }
  document.addEventListener('visibilitychange',function(){
    if(document.visibilityState==='hidden')saveIfActive();
  });
  window.addEventListener('pagehide',saveIfActive);
  // Also save when user navigates to menu — captures clean exit.
  window.addEventListener('beforeunload',saveIfActive);
})();


// ═══════════════════════════════════════════════════════════
// GAME STATE
// ═══════════════════════════════════════════════════════════
var PZ=null,SEL=null,HIST=[],SIZE='small',DIFF='medium';
var TILE_SCALE=1.0;
var TILE_GAP_MULT=1.0;
// Tile Spacing Menu padding state
var BANK_PAD_L=0, BANK_PAD_R=0, BANK_PAD_T=0, BANK_PAD_B=0;
var _tsMenuOpen=false;
var _tsSizeDockedInMenu=true;  // true = size slider is inside menu (not toolbar)
var _tsGapDockedInMenu=true;   // true = gap slider is inside menu (not toolbar)
var SPIN_ON=false;
var GLOW_ON=false;
var PARTICLES_ON=false;
// [Equil 1.08] Equation-pulse wave on bank tap with no cell selected.
// Off by default for clean puzzle feel; togglable via OPTIONS panel.
var PULSE_EQ_ON=false;
// [v2.22] Floating zoom-pan pill — disabled by default. User can
// enable it via OPTIONS panel. When enabled, the pill spawns when
// entering puzzle mode and persists across screen swaps.
var PILL_ON=false;
var PAD_PAN_ON=false; // per-tap panning based on hit position within pad
var PAD_EXPR_ON=false; // per-tap expression: X=volume, Y=pitch
// Hold mode is now per-pad. _holdTaggedPads is a Set of pad indices (using
// an object as set — key = idx, value = true) that behave as hold-mode pads.
// _holdLoopPads is a similar set — pads in BOTH sets loop while held; pads
// in only _holdTaggedPads are one-shot (play once on touch, stop on release).
// _holdSelectMode is true while the user is actively tagging/untagging pads
// after tapping HLD BTN; tapping pads in this mode toggles their membership
// in the tagged set rather than playing them.
var _holdTaggedPads = {};
var _holdLoopPads = {};
var _holdSelectMode = false;
// [Equil 1.11] Restored: empty {} stubs for these two vars. Bare-name read
// from renderBank's tap handlers (e.g. `if(_holdOnTapPads[idx]){...}`) — the
// branches never fire because nothing populates these sets in puzzle mode, but
// without the declarations the bare-name reads throw ReferenceError on every tap.
var _holdOnTapPads = {};
var _holdOnBeatPads = {};
// [Equil 1.11] Restored: EXPR mode state vars. Same story as the hold vars
// above — bare-name read from renderBank's tap handlers, branches never fire,
// but the reads themselves would throw ReferenceError without the declarations.
var EXPR_GRID_ON=false;
var EXPR_SNAP_X=false;
var EXPR_SNAP_Y=false;
var EXPR_CROSS_ON=false;
var EXPR_GRID_X=5;
var EXPR_GRID_Y=10;
var EXPR_PITCH_RANGE=5;
// [Equil 1.12] Re-restored: held-voice no-op stubs. These were stubbed in 1.01
// but accidentally cut as "duplicate" in 1.10. Bare-name called from renderBank's
// touchstart handler (3 sites) and touchend handler (3 sites). The branches that
// reach them never fire in puzzle mode (gated on _holdTaggedPads / _holdOnTapPads
// / _holdOnBeatPads which are all empty), but JS still evaluates the call
// expression and throws ReferenceError without the function declarations.
function _startHeldVoice(){ /* sequencer-only, no-op */ }
function _playHeldFromBuffer(){ /* sequencer-only, no-op */ }
function _releaseHeldVoice(){ /* sequencer-only, no-op */ }
// [Equil 1.10] Removed: Hold sub-modes state vars + duplicate held-voice stubs +
// EXPR mode state vars + HIDE_NUMS_ON + HOLD_MODE — all sequencer-only, never read
// from puzzle code. PRESSURE_BASE and PRESSURE_RANGE preserved below — they're
// bare-name read from the tap handlers.
var PRESSURE_BASE=0.65;
var PRESSURE_RANGE=1.0;
// Pressure jitter: ±_pressureJitter shift applied 50% of the time (25% each direction).
// 0 = jitter off, 0.1 = original behavior, 0.3 = triple intensity.
window._pressureJitter=0;
window._pressureSmoothing=0.2375; // 25% slider position (of 0..0.95 range)
window._sensRangePct=100; // range slider starts at max (100%)
// Pressure smoothing: 0 = no smoothing (each tap independent),
// up to ~0.95 = heavy smoothing (each tap drifts only slightly from the previous).
window._lastTapPressure=null; // remembered between taps for smoothing math

// Sensitivity volume limits (updated by Range slider; hard = higher volume)
window._sensVolMin=0.01; window._sensVolMax=0.57; // range=100% with base=0.375 → hard ~380% (clamped by 1/_pBase=4 limit)

// Sensitivity glow brightness limits — softest tap glows at glowMin (e.g. 0.5 = 50% as bright),
// hardest tap glows at glowMax (e.g. 1.5 = 150%). Wired through window._padGlowScale().
window._sensGlowMin=0.0; window._sensGlowMax=5.0;
// Returns a multiplier applied to flash glow alphas based on the most recent
// tap pressure (window._tapPressure, set by the press handler in 0..1 range).
// When sensitivity is OFF or no pressure has been recorded, returns 1.0.
window._padGlowScale=function(){
  var sensActive = window._getSensOn ? window._getSensOn() : true;
  if(!sensActive) return 1.0;
  var p = window._tapPressure;
  if(typeof p !== 'number' || isNaN(p)) return 1.0;
  // Clamp pressure 0..1
  if(p<0) p=0; if(p>1) p=1;
  var gMin = (typeof window._sensGlowMin==='number')?window._sensGlowMin:0.5;
  var gMax = (typeof window._sensGlowMax==='number')?window._sensGlowMax:1.5;
  return gMin + p*(gMax-gMin);
};

function newPuzzle(){
  resumeAC();playNewGame();
  PZ=buildPuzzle(SIZE,DIFF);SEL=null;HIST=[];
  // [v3.18] DEBUG: update the template label after build.
  _updateDbgTplLabel();
  // [v3.32] Record this puzzle's metrics for running averages.
  if(window._dbgRecordPuzzle)window._dbgRecordPuzzle();
  // [v3.23] If debug panel is open, refresh its puzzle stats.
  try{
    var pnl=document.getElementById('_dbgPanel');
    if(pnl&&pnl.style.display==='flex'&&window._dbgRenderAll)window._dbgRenderAll();
  }catch(e){}
  // [Equil 1.13] "Next Puzzle" / "New" both produce a random puzzle
  // and reset the timer/move counter. Daily mode is launched explicitly
  // from the start screen via the Daily button → showGame({daily:true}).
  if(window._mc113) window._mc113.reset({daily:false});
  // Refresh mastInfo so the ★ DAILY prefix gets cleared after exiting
  // a daily puzzle via the "Next Puzzle" button.
  // [v2.69] Use sizeLabel() so 'xl2' renders as 'JUMBO'.
  // [v3.86/v3.89] Size · Difficulty order matches menu selection.
  // [v4.63] diffLabel() so 'medium' renders as 'INTERMEDIATE'.
  var mi=document.getElementById('mastInfo');
  if(mi) mi.textContent=sizeLabel(SIZE)+' · '+diffLabel(DIFF);
  document.getElementById('win').classList.remove('show');
  if(window._resetGridZoom)_resetGridZoom();render();
  // [v3.89] Re-init the ghost-runner bar for the new puzzle. Without
  // this, the bar/label state from the just-solved puzzle persists
  // (collapsed to scaleX(0) with the static "Best time: X:XX" label
  // showing) — looking like the previous best is still active even
  // though the player has moved on to a fresh template.
  if(window._initGhostBar) window._initGhostBar();
  // [v3.90] Same for the grid-edge pace boxes — re-init so the new
  // puzzle's stats drive the boxes (or hide them if none exist).
  // [v4.20] Pace BOXES (inward-marching rectangles) disabled.
  // Function preserved (see _initPaceBoxes definition) but not called.
  // To revive: uncomment this line and hide #paceRings.
  // if(window._initPaceBoxes) window._initPaceBoxes();
  if(window._initPaceRings) window._initPaceRings();
  if(window._initPaceStats) window._initPaceStats();
  // [v4.03] READY overlay/GO button removed from the flow — start
  // the timer immediately on new puzzle. The overlay machinery
  // (_showReady/_hideReady) is intentionally left intact for
  // possible future revival.
  if(window._mc113&&window._mc113.startTimer)window._mc113.startTimer();
}

function selCell(k){
  resumeAC();
  var cell=PZ&&PZ.CM[k];
  if(!cell)return;
  // If cell already has a placed value — return it to bank
  if(cell.isBlank&&cell.value!=null){
    playReturn();
    // Find the bank tile for this value and free it
    for(var i=0;i<PZ.bank.length;i++){
      if(PZ.bank[i].value===cell.value&&PZ.bank[i].used){
        HIST.push({k:k,ov:cell.value,bi:i,pv:null});
        PZ.bank[i].used=false;
        cell.value=null;
        // [v2.31] Previously: SEL = k (auto-select the cell so the
        // user could immediately place a new number). User feedback:
        // when tapping to RETURN a number, they didn't want a fresh
        // selection because they were undoing, not starting a new
        // placement. Now the selection is cleared after a return.
        // [v2.74] Reversed again — user changed their mind. Tapping
        // a placed tile to send it back now leaves the cell SELECTED,
        // matching the older behavior. Rationale this time: most of
        // the time when you tap-return, you're about to place a
        // different number in that same cell. Pre-selecting saves
        // a tap. Bank tiles still close any prior selection via the
        // normal place() flow, so this only changes the post-return
        // state, not subsequent interactions.
        // [v4.67] Split by workflow. When drag-tiles is ON, clear SEL
        // after a return — the next gesture is almost always a tap-
        // and-drag from the bank, and if the cell stays selected, the
        // bank tap auto-places into that cell instead of beginning a
        // drag, which feels like a stuck cursor. When drag-tiles is
        // OFF, the v2.74 rationale still holds: pre-selecting saves a
        // tap for the tap-to-place workflow that doesn't have a drag
        // mode at all.
        if(window._dragTilesEnabled === true){
          SEL = null;
        } else {
          SEL = k;
        }
        render();
        return;
      }
    }
  }
  // Empty blank cell — select it
  if(cell.isBlank&&cell.value==null){playSelEmpty();}
  else if(cell.isBlank){playSelFilled();}
  SEL=(SEL===k)?null:k;
  render();
}

// v8.97 — count unused (placeable) tiles for a given value.
// Used by the place/undo paths to detect mini-mode count changes
// and trigger the queue animation. Skips deleted pads.
function _countUnusedForValue(val){
  if(!PZ || !PZ.bank) return 0;
  var n = 0;
  for(var i = 0; i < PZ.bank.length; i++){
    if(window._padDeleted && window._padDeleted[i]) continue;
    var b = PZ.bank[i];
    if(!b) continue;
    if(b.value === val && !b.used) n++;
  }
  return n;
}

function place(idx){
  resumeAC();
  if(!SEL)return;
  var cell=PZ.CM[SEL];if(!cell||!cell.isBlank)return;
  var t=PZ.bank[idx];if(t.used)return;
  // v8.97 — capture pre-mutation unused counts for mini-mode animation.
  var _animPlaceVal = t.value;
  var _animPlaceOldUnused = _countUnusedForValue(_animPlaceVal);
  var _animUnplaceVal = null;
  var _animUnplaceOldUnused = 0;
  HIST.push({k:SEL,ov:cell.value,bi:idx,pv:null});
  if(cell.value!=null){
    var pi=-1;
    for(var i=0;i<PZ.bank.length;i++)if(PZ.bank[i].value===cell.value&&PZ.bank[i].used&&i!==idx){pi=i;break;}
    if(pi>=0){
      PZ.bank[pi].used=false;
      HIST[HIST.length-1].pv=pi;
      // The previously-placed value is being returned to the bank.
      // If it differs from the new value, its mini count goes UP.
      if(cell.value !== _animPlaceVal){
        _animUnplaceVal = cell.value;
        // Recompute AFTER the mutation we just did. _countUnusedForValue
        // reflects the post-mutation state of pi.used=false.
        _animUnplaceOldUnused = _countUnusedForValue(_animUnplaceVal) - 1; // pre-state was one less
      }
    }
  }
  cell.value=t.value;t.used=true;
  var pk=HIST[HIST.length-1].k;SEL=null;
  var st=cstat(pk,PZ);
  if(st==='bad')playError();else playPlace();
  // [Equil 1.13] Count the move (also starts the timer on first move).
  if(window._mc113) window._mc113.noteMove();
  // [v2.68] After every placement, recompute equation states and count
  // any inc→bad / ok→bad transitions as mistakes. Must run AFTER the
  // mutation above so valEq() sees the new state.
  if(window._mc113 && window._mc113.noteEval) window._mc113.noteEval(PZ);
  // [v2.99] Run render() FIRST when winning so the bank gets
  // rebuilt to its final state before the wave captures tile
  // references. Previously: _winWaveSequence ran first, capturing
  // .bt elements as they were at place-time; then the render()
  // call that follows the if-block synchronously destroyed those
  // elements via renderBank's `be.innerHTML=''`. The setTimeouts
  // inside the wave then added .bursting to detached DOM nodes
  // and the user saw nothing. By rendering first the wave's
  // captured references survive, since no later render() fires
  // until the user starts a new puzzle.
  var _won = winCheck(PZ);
  render();
  if(_won){
    // [Equil 1.13] Mark won (freezes timer + triggers screen flash),
    // then record the result, then show the win card with the full stats.
    if(window._mc113) window._mc113.markWon();
    // [v2.83] Run the bank-tile burst wave BEFORE the fanfare and
    // win card. The wave's onComplete callback chains: fanfare →
    // (short pause) → win card. Old flow was: fanfare immediately,
    // win card 600ms later. New flow lets the wave build into the
    // climax of the fanfare. _winWaveSequence handles its own
    // pacing based on tile count (~1.6s total budget).
    // [v4.45] On Bluetooth output, the fanfare audio reaches the
    // speaker `comp` ms after we call playFanfare(). Push the win
    // card pop later by the same amount so it lands on the actual
    // audio finish, not the scheduling moment. comp ≈ 0 on wired
    // output, so no change there.
    _winWaveSequence(function(){
      playFanfare();
      var _postFanfareDelay = 450 + ((typeof window._audioCompensateMs === 'function')
        ? window._audioCompensateMs() : 0);
      setTimeout(function(){_showWinCard();}, _postFanfareDelay);
    });
  }
  // v8.97 — animate mini-mode count changes after the re-render.
  if(window._animateMiniDelta){
    var newPlaceUnused = _countUnusedForValue(_animPlaceVal);
    if(newPlaceUnused !== _animPlaceOldUnused){
      window._animateMiniDelta(_animPlaceVal, _animPlaceOldUnused, newPlaceUnused);
    }
    if(_animUnplaceVal !== null){
      var newUnplaceUnused = _countUnusedForValue(_animUnplaceVal);
      if(newUnplaceUnused !== _animUnplaceOldUnused){
        window._animateMiniDelta(_animUnplaceVal, _animUnplaceOldUnused, newUnplaceUnused);
      }
    }
  }
}

function undo(){
  if(!HIST.length)return;
  var h=HIST.pop();
  // v8.97 — capture pre-mutation counts for mini-mode animation.
  // h.bi was used (about to become unused) → that value's count goes UP.
  // h.pv (if not null) was unused (about to become used) → count goes DOWN.
  var _animBiVal = PZ.bank[h.bi] ? PZ.bank[h.bi].value : null;
  var _animBiOld = _animBiVal !== null ? _countUnusedForValue(_animBiVal) : 0;
  var _animPvVal = (h.pv != null && PZ.bank[h.pv]) ? PZ.bank[h.pv].value : null;
  var _animPvOld = _animPvVal !== null ? _countUnusedForValue(_animPvVal) : 0;
  PZ.bank[h.bi].used=false;if(h.pv!=null)PZ.bank[h.pv].used=true;
  PZ.CM[h.k].value=h.ov;SEL=null;render();
  // [v2.68] Re-sync badEqs after undo. We do NOT decrement the mistake
  // counter (a mistake was made — undoing doesn't unmake it). But we
  // DO need to refresh the badEqs map so that if the user later re-
  // creates a bad equation that's currently been reverted, it counts
  // as a new mistake instead of being suppressed by the stale set.
  if(window._mc113 && window._mc113.noteEval) window._mc113.noteEval(PZ);
  // v8.97 — animate mini-mode count changes after the re-render.
  if(window._animateMiniDelta){
    if(_animBiVal !== null){
      var newBiUnused = _countUnusedForValue(_animBiVal);
      if(newBiUnused !== _animBiOld){
        window._animateMiniDelta(_animBiVal, _animBiOld, newBiUnused);
      }
    }
    // If the same value appears in both bi and pv (shouldn't normally,
    // but defensive), only animate once — bi already covers it.
    if(_animPvVal !== null && _animPvVal !== _animBiVal){
      var newPvUnused = _countUnusedForValue(_animPvVal);
      if(newPvUnused !== _animPvOld){
        window._animateMiniDelta(_animPvVal, _animPvOld, newPvUnused);
      }
    }
  }
}

// ═══════════════════════════════════════════════════════════
// RENDER
// ═══════════════════════════════════════════════════════════
function getCellSize(cols){
  var bodyW=document.body.clientWidth||window.innerWidth||360;
  var cap=SIZE==='xl2'?bodyW:520;
  // [v3.60] Updated margin calc to match v3.59's edge-to-edge
  // .gscroll. Previous: 48px horizontal padding + 4px gscroll
  // border + 4px grid border + 4px safety = 60px. After v3.59:
  // padding is 0 horizontally and left/right gscroll borders are
  // gone. Only the grid border (4px) and a small safety margin
  // (6px) remain. Lets cells get noticeably bigger on smaller
  // screens.
  // [v4.42] Subtract an additional 16 px to leave room for v4.41's
  // grid-clip gutter (8 px on each side). Without this, grids that
  // were already near viewport-width before v4.41 push their gutter
  // (and pace rings) past the .gscroll overflow:hidden boundary on
  // left/right edges. Per Sam's report on the Small/Medium screenshot
  // showing rings cut off at screen edges.
  var avail=Math.min(bodyW,cap)-10-16;
  // [v3.05] Use tier-canonical cols instead of the actual template's cols,
  // so all templates within a tier render at the same cell size. The widest
  // template in the tier sets the canonical width — narrower templates
  // (TJ in Small, TK in Medium) render with empty space around the grid
  // rather than blowing up their cells. Without this, a 7-col TJ rendered
  // ~30% larger than a 9-col TA, which felt like a difficulty inconsistency.
  // [v3.07] Medium canonical bumped from 9 to 11 to accommodate the new TN
  // template (11 cols). TB/TE/TK render at slightly smaller cells now (~26
  // instead of ~32 on a typical phone), but stay consistent with each other
  // and with TN.
  // [v3.14] Large canonical set to 13 to accommodate TS (13 cols) and TL
  // (13 cols). TF and TG (9 cols) render with empty space around them. All
  // Large templates now render at consistent cell sizes — important for
  // "good time = real improvement" since TF rolls won't appear bigger than
  // TS rolls just because the template is narrower.
  // Jumbo (xl2) and the unpooled XL are unchanged.
  var canonicalCols={small:9,medium:11,large:13}[SIZE];
  var widthCols=canonicalCols||cols;
  var cs=Math.floor((avail-(widthCols-1))/widthCols);
  // [v3.16] Large maxCS bumped from 26 to 36. Was set to 26 when
  // Large templates had varying widths and needed to fit; now with
  // 13-col canonical and TS-family templates, 36px × 13 cols = 468px
  // fits comfortably in available width. Restores Large > Medium
  // visual size hierarchy that was inverted by the old cap.
  var maxCS=SIZE==='xl2'?26:SIZE==='xl'?32:SIZE==='large'?36:SIZE==='medium'?42:52;
  return Math.max(10,Math.min(maxCS,cs));
}

// Per-tile color tags: idx -> hex color string (or null)
var tileColors = {};

function hexToRgba(hex,alpha){
  if(!hex||hex.charAt(0)!=='#') return 'rgba(0,217,255,'+alpha+')';
  var h=hex.replace('#','');
  if(h.length===3) h=h[0]+h[0]+h[1]+h[1]+h[2]+h[2];
  var r=parseInt(h.substr(0,2),16)||0;
  var g=parseInt(h.substr(2,2),16)||0;
  var b=parseInt(h.substr(4,2),16)||0;
  return 'rgba('+r+','+g+','+b+','+alpha+')';
}

function complementColor(hex){
  // Convert hex to HSL, rotate hue by ~150-180 degrees for a vivid complement
  if(!hex||hex.charAt(0)!=='#') return '#c400ff';
  var h=hex.replace('#','');
  if(h.length===3) h=h[0]+h[0]+h[1]+h[1]+h[2]+h[2];
  var r=parseInt(h.substr(0,2),16)/255;
  var g=parseInt(h.substr(2,2),16)/255;
  var b=parseInt(h.substr(4,2),16)/255;
  var max=Math.max(r,g,b), min=Math.min(r,g,b), l=(max+min)/2, s=0, hue=0;
  if(max!==min){
    var d=max-min; s=l>0.5?d/(2-max-min):d/(max+min);
    if(max===r) hue=((g-b)/d+(g<b?6:0))/6;
    else if(max===g) hue=((b-r)/d+2)/6;
    else hue=((r-g)/d+4)/6;
  }
  // Rotate hue 160 degrees and boost saturation for vivid complement
  hue=(hue+0.444)%1;
  s=Math.min(1,s*1.2+0.3);
  l=Math.max(0.45,Math.min(0.65,l));
  // HSL back to hex
  function hue2rgb(p,q,t){ if(t<0)t+=1; if(t>1)t-=1; if(t<1/6)return p+(q-p)*6*t; if(t<1/2)return q; if(t<2/3)return p+(q-p)*(2/3-t)*6; return p; }
  var q2=l<0.5?l*(1+s):l+s-l*s, p2=2*l-q2;
  var ro=Math.round(hue2rgb(p2,q2,hue+1/3)*255);
  var go=Math.round(hue2rgb(p2,q2,hue)*255);
  var bo=Math.round(hue2rgb(p2,q2,hue-1/3)*255);
  return '#'+('0'+ro.toString(16)).slice(-2)+('0'+go.toString(16)).slice(-2)+('0'+bo.toString(16)).slice(-2);
}

function dimColor(hex){
  // Darkened version of a color for the resting tile border
  if(!hex||hex.charAt(0)!=='#') return 'rgba(0,217,255,0.4)';
  var h=hex.replace('#','');
  if(h.length===3) h=h[0]+h[0]+h[1]+h[1]+h[2]+h[2];
  var r=parseInt(h.substr(0,2),16)||0;
  var g=parseInt(h.substr(2,2),16)||0;
  var b=parseInt(h.substr(4,2),16)||0;
  r=Math.round(r*0.55); g=Math.round(g*0.55); b=Math.round(b*0.55);
  return 'rgb('+r+','+g+','+b+')';
}

// Returns an rgba() string for a hex color at the given alpha. Used to paint
// pad borders and sample-name text at the same opacity that the default cyan
// pad uses (0.35 for borders, 0.85 for text) so colored pads read with the
// same visual weight as the default cyan pad — just in their assigned hue.
function alphaColor(hex, alpha){
  if(!hex||hex.charAt(0)!=='#') return 'rgba(0,217,255,'+alpha+')';
  var h=hex.replace('#','');
  if(h.length===3) h=h[0]+h[0]+h[1]+h[1]+h[2]+h[2];
  var r=parseInt(h.substr(0,2),16)||0;
  var g=parseInt(h.substr(2,2),16)||0;
  var b=parseInt(h.substr(4,2),16)||0;
  return 'rgba('+r+','+g+','+b+','+alpha+')';
}

function applyTileColor(tile, idx){
  // If this tile is currently highlighted as a "fires on the
  // selected beat" pad during beat-edit mode, skip the normal
  // color treatment and restore the red _beat-on highlight.
  // Without this guard, any flash-cleanup (user tap or playback-
  // triggered flash) would overwrite the red with the pad's
  // assigned color — making the pad appear to "un-assign" the
  // moment the playhead passes over its beat.
  if(tile.classList.contains('_beat-on')){
    tile.style.background = '#ef4444';
    tile.style.color = '#fff';
    tile.style.borderColor = '#991b1b';
    tile.style.boxShadow = '0 0 8px #ef4444';
    return;
  }
  var col = tileColors[idx];
  if(col){
    tile.style.boxShadow = 'none';
    tile.style.border = '1.5px solid '+alphaColor(col, 0.35);
  } else {
    // [v1.34] Default border for uncolored tiles. Previously a muted
    // white-alpha (rgba(255,255,255,0.08)) which read as gray. Now
    // matches the CSS .bt rule's cyan so the tile looks like an
    // intentional cyan-bordered pad. Inline style is required because
    // applyTileColor sets `tile.style.border` either way and inline
    // beats CSS specificity. Box-shadow cleared so the CSS-rule's
    // inset glow applies (otherwise we'd have to duplicate it here).
    tile.style.boxShadow = '';
    tile.style.border = '1.5px solid rgba(0,217,255,0.5)';
  }
  var cv = tile.querySelector('.bt-wave');
  if(cv){
    var strokeCol = col ? alphaColor(col, 0.35) : "rgba(0,217,255,0.35)";
    var state = _padWavePlays && _padWavePlays[idx];
    if(state){
      state.baseCol = strokeCol;
      state.borderCol = col || '#00d9ff';
      state.litCol = _padWaveLitColor(col||null);
    }
    var buf = (state && state.buffer) || cv._waveBuffer;
    if(buf) _drawPadWaveform(cv, buf, strokeCol);
  }
  // Recolor sample-name label SVG fill so it updates without renderBank
  var lbl = tile.querySelector('.bt-name');
  if(lbl){
    var labelCol = col ? alphaColor(col, 0.85) : 'rgba(0,217,255,0.85)';
    var txt = lbl.querySelector('text');
    if(txt) txt.setAttribute('fill', labelCol);
  }
}

// v8.97 — mini-mode grid layout helper. Computes the same grid
// dimensions used by the renderer AND the place/undo animations,
// so the animation deltas and the final layout match exactly.
//
//   miniCount  — how many tiny cyan copies to fit
//   tileSize   — pixel side length of the tile
//   tileFontSize — the white main number's font size (used to cap
//                  the mini font and reserve a "white zone" up top)
//   whiteZone  — vertical pixels reserved at the top for the main
//                number plus its 2px gap to the cyan content
//   bottomPad  — pixels of padding at the bottom of the tile
//
// Returns: {cols, rows, cellSize, fontPx, areaW, areaH}
//
// Selection strategy: try each candidate column count and compute
// the max font size that fits BOTH (a) width of each grid cell
// considering the glyph aspect ratio (~0.6 width-per-em for IBM
// Plex Mono digits) AND (b) row height after subtracting gap
// space. Pick the cols that yields the largest legible font.
window._computeMiniGrid = function(miniCount, tileSize, tileFontSize, whiteZone, bottomPad, rowGap, colGap){
  var areaW = tileSize - 4;     // 2px inset each side
  var areaH = Math.max(4, tileSize - whiteZone - bottomPad);
  var hardMax = Math.max(7, Math.round(tileFontSize * 0.42));
  var GLYPH_W_PER_EM = 0.62;    // monospace digit width as fraction of em
  // [v2.57] Accept row/column gaps as params (previously hardcoded
  // GAP=1). Defaults match the old behavior so callers that don't
  // pass these get unchanged layout.
  var ROW_GAP = (typeof rowGap === 'number') ? rowGap : 1;
  var COL_GAP = (typeof colGap === 'number') ? colGap : 1;
  var bestCols = 1, bestFont = 0, bestRows = 1;
  var maxCols = Math.max(1, Math.min(miniCount, 12));
  for(var tc = 1; tc <= maxCols; tc++){
    var tr = Math.ceil(miniCount / tc);
    // Width per column (after gaps), then divide by glyph aspect to
    // get the max font size that fits horizontally.
    var colW = (areaW - (tc - 1) * COL_GAP) / tc;
    var fontW = colW / GLYPH_W_PER_EM;
    // Height per row (after gaps).
    var rowH = (areaH - (tr - 1) * ROW_GAP) / tr;
    // Allow a small line-height buffer of ~5% so glyphs don't kiss
    // the row above. Use 0.95 as the row-height-to-font ratio.
    var fontH = rowH * 0.95;
    var candidate = Math.min(fontW, fontH, hardMax);
    if(candidate > bestFont){
      bestFont = candidate;
      bestCols = tc;
      bestRows = tr;
    }
  }
  var cols = bestCols;
  var rows = bestRows;
  var fontPx = Math.max(3, Math.floor(bestFont));
  // For animation positioning, expose the computed cell size as
  // the smaller of the width/height per cell.
  var cellSize = Math.min((areaW - (cols - 1) * COL_GAP) / cols, (areaH - (rows - 1) * ROW_GAP) / rows);
  return {cols:cols, rows:rows, cellSize:cellSize, fontPx:fontPx, areaW:areaW, areaH:areaH, rowGap:ROW_GAP, colGap:COL_GAP};
};

function renderBank(){
  // [v4.75] Preserve page scroll across the bank rebuild. The bank
  // display-toggle buttons (condense, xN, cyan, mini, etc.) call
  // renderBank() directly — not through render() — and clearing
  // #bank with innerHTML='' then rebuilding can shift the page scroll
  // on tall puzzles where the page is scrolled. Capture here and
  // restore at the end. When called from within render(), this is
  // redundant with render's own guard but harmless (same value).
  var _bankScrollY = window.scrollY;
  // Bank tiles — already sorted ascending from buildPuzzle
  var be=document.getElementById('bank');be.innerHTML='';
  // v8.84 — keep the condense-tiles toggle visible only in puzzle mode.
  if(window._syncCondenseBtnVisibility) window._syncCondenseBtnVisibility();
  var bankCount=PZ.bank.length;
  // Base size from count, then scaled by TILE_SCALE (1.0 = full, 0.5 = half)
  var baseSize=bankCount>25?32:bankCount>15?38:44;
  var baseFontSize=bankCount>25?13:bankCount>15?15:18;
  var tileSize=Math.round(baseSize*TILE_SCALE);
  var tileFontSize=Math.round(baseFontSize*TILE_SCALE);
  var tilePad='0 '+Math.round(8*TILE_SCALE)+'px';
  var tileGap=Math.round(6*TILE_SCALE*TILE_GAP_MULT);
  document.getElementById('bank').style.gap=tileGap+'px';
  // Snap tile size to fill width edge-to-edge for exact N-per-row (both modes)
  (function(){
    var bankParent=document.getElementById('bank').parentElement;
    var bankW=bankParent?bankParent.getBoundingClientRect().width:0;
    if(bankW<=0) bankW=bankParent?bankParent.offsetWidth:300;
    var padLR=window._seqVisible ? (6+BANK_PAD_L)+(8+BANK_PAD_R) : 0;
    var availW=bankW-padLR;
    var tilesPerRow;
    if(window._seqVisible && window._seqTargetRows){
      tilesPerRow=window._seqTargetRows;
    } else {
      tilesPerRow=Math.max(2, Math.floor(availW / (tileSize + tileGap)));
    }
    tilesPerRow=Math.max(1, tilesPerRow);
    var snappedSize=Math.max(15, Math.floor((availW - (tilesPerRow - 1) * tileGap) / tilesPerRow));
    tileSize=snappedSize;
    tileFontSize=Math.round(baseFontSize*(tileSize/baseSize));
    // [v2.42] Cap tileFontSize at the default-size value. v2.41 doubled
    // the size slider's max range so users could compensate for cross-
    // browser cyan ×N positioning drift by going bigger — but the font
    // scaled up proportionally with the tile, so the cyan still hung
    // below the bottom border at any size. Capping the font means at
    // tile sizes bigger than default, all the extra room becomes empty
    // space inside the tile rather than bigger glyphs, and the cyan
    // ×N tucks comfortably into the tile's lower portion.
    // Default is TILE_SCALE 1.11, so the cap = baseFontSize * 1.11.
    // Smaller-than-default tile sizes: font still scales DOWN as before.
    var fontCap = Math.round(baseFontSize * 1.11);
    if(tileFontSize > fontCap) tileFontSize = fontCap;
    tilePad='0 '+Math.round(tileSize*0.18)+'px';
    if(window._seqVisible) window._seqActualRows=tilesPerRow;
  })();
  // Apply bank padding — sides only in SEQ mode
  if(window._seqVisible){
    document.getElementById('bank').style.paddingLeft=(6+BANK_PAD_L)+'px';
    document.getElementById('bank').style.paddingRight=(8+BANK_PAD_R)+'px';
    document.getElementById('bank').style.paddingTop=(6+BANK_PAD_T)+'px';
    document.getElementById('bank').style.paddingBottom=(6+BANK_PAD_B)+'px';
  } else {
    // [v2.05] Puzzle-mode bank padding: 40px on left/right gives a
    // scroll-grab band on each side so the user can swipe vertically
    // without accidentally landing on a tile and starting a drag-to-
    // place. The earlier .btiles CSS rule (padding:4px 40px) was
    // being overridden by these inline styles, which set 0px before.
    // [v2.44] Padding side/width now driven by user settings:
    //   - When dragTiles is OFF (default), tiles aren't drag-able so
    //     no scroll-grab strips are needed → 0 left/right padding,
    //     all tile area is touchable.
    //   - When dragTiles is ON, padding comes back per the user's
    //     side preference (both/left/right) and width slider, so
    //     people with bigger fingers or one-handed users can tune
    //     where their scroll strip lives.
    var _dragOn = !!window._dragTilesEnabled;
    var _padW = (typeof window._bankPadWidth === 'number') ? window._bankPadWidth : 40;
    var _padSide = window._bankPadSide || 'both';
    var _bankL = 0, _bankR = 0;
    if(_dragOn){
      if(_padSide === 'both'){ _bankL = _padW; _bankR = _padW; }
      else if(_padSide === 'left'){ _bankL = _padW; _bankR = 0; }
      else if(_padSide === 'right'){ _bankL = 0; _bankR = _padW; }
    }
    document.getElementById('bank').style.paddingLeft = _bankL + 'px';
    document.getElementById('bank').style.paddingRight = _bankR + 'px';
    document.getElementById('bank').style.paddingTop='4px';
    document.getElementById('bank').style.paddingBottom='4px';
  }
  // Determine how many tiles to actually render. In SEQ mode, honor the
  // user-chosen pad count from the NUM PADS slider (window._padLimit). Data
  // for pads beyond the limit (samples, colors, hold-tags) is keyed by index
  // and stays in place — raising the limit later brings them back into view.
  var totalBankLen = PZ.bank.length;
  var renderCount = totalBankLen;
  if(window._seqVisible && typeof window._padLimit === 'number' && window._padLimit > 0){
    renderCount = Math.min(totalBankLen, Math.max(1, Math.floor(window._padLimit)));
    // If _padLimit exceeds the current bank length, we need to render "virtual"
    // tiles beyond PZ.bank. Extend the iteration but synthesize placeholder
    // values for those indices.
    if(window._padLimit > totalBankLen){
      renderCount = Math.min(118, Math.floor(window._padLimit));
    }
  }
  // v8.84 — puzzle-mode tile collapse (opt-in, off by default).
  //
  // When window._condensePuzzleTiles is true AND we're in puzzle mode,
  // repeated values in PZ.bank (e.g. seven 1s) collapse into a single
  // tile that displays the number with a small cyan "×N" multiplier
  // showing how many unused copies remain.
  //
  // The underlying data model in PZ.bank is unchanged — each duplicate
  // still has its own slot, its own `used` flag, its own bankIdx, and
  // its own sample assignment. We just RENDER fewer DOM elements.
  // Tapping a collapsed tile resolves to the first unused index of
  // that value via dataset.bankIdx and dispatches into the existing
  // place()/preview path.
  //
  // SEQ mode is untouched — each pad must remain its own DOM element
  // because each is an independent beat lane, sample slot, color/hold
  // tag target, etc. Collapsing would break the entire sequencer.
  //
  // Min tile size in collapsed mode raised so the small "×N" badge
  // stays legible. (The slider can still go small in non-collapsed mode.)
  //
  // v8.96 — two mutually exclusive collapse-display modes:
  //   xN mode  : one tile per unique value with a small cyan "×N" badge
  //   mini mode: one tile per unique value with up to N-1 tiny cyan
  //              copies of the number underneath (queue layout)
  // The collapsing data scan is identical for both.
  var xnOn   = !window._seqVisible && !!window._condensePuzzleTiles;
  var miniOn = !window._seqVisible && !!window._miniPuzzleTiles;
  // [v1.30] Third condense mode: all-cyan grid, no white number on top.
  // Same N-cells-of-the-value layout as mini, but cyan and bigger so
  // they fill the tile. Mutually exclusive with the other two.
  var cyanOn = !window._seqVisible && !!window._allCyanPuzzleTiles;
  // If multiple somehow got set, prefer in order: cyan > mini > xN.
  if(cyanOn){ xnOn = false; miniOn = false; }
  else if(miniOn) xnOn = false;
  var condenseOn = xnOn || miniOn || cyanOn;
  var puzzleValueGroups = null;
  if(condenseOn){
    // Pre-pass: for each unique value, find the count of unused tiles
    // and the first unused index (where place() will write).
    puzzleValueGroups = {};
    for(var pgI=0; pgI<PZ.bank.length; pgI++){
      var pgItem = PZ.bank[pgI];
      if(!pgItem) continue;
      if(window._padDeleted && window._padDeleted[pgI]) continue;
      var pgVal = pgItem.value;
      if(!puzzleValueGroups[pgVal]){
        puzzleValueGroups[pgVal] = {first: pgI, firstUnused: -1, total: 0, unused: 0};
      }
      puzzleValueGroups[pgVal].total++;
      if(!pgItem.used){
        puzzleValueGroups[pgVal].unused++;
        if(puzzleValueGroups[pgVal].firstUnused < 0){
          puzzleValueGroups[pgVal].firstUnused = pgI;
        }
      }
    }
    // [v2.50] Removed the 28px minimum tile size that was preventing
    // fonts from scaling at small slider positions. The original 28px
    // floor was added for readability (to keep the white digit + cyan
    // ×N legible), but it caused a worse visual problem: as the user
    // dragged the size slider smaller, the tile would clamp to 28px
    // and the fonts would stop shrinking, but the cyan ×N would still
    // be pushed past the tile's bottom edge by the flex layout
    // (because padTop/padBot also have hard minimums and the proportions
    // become broken at the floor).
    // The snappedSize floor (Math.max(15, ...)) on line ~6796 already
    // prevents the tile from shrinking below 15px. That's enough.
    // Fonts now scale all the way down with the tile; at very small
    // sizes both white and cyan become illegible, but they stay
    // INSIDE the tile, which is what the user actually wants.
    // (Old code: if(tileSize < 28){ tileSize = 28; ... })
  }
  var puzzleSeen = {};
  for(var i=0;i<renderCount;i++){
    // Deleted pads (via DEL button) are skipped entirely — no tile is
    // rendered. The per-index data (samples/meta/color) is already
    // cleared and the _padDeleted flag blocks playback. Undo puts the
    // pad back in renderBank's loop since the flag gets cleared.
    if(window._padDeleted && window._padDeleted[i]) continue;
    var item = PZ.bank[i] || {value:(i+1).toString(), used:false, _virtual:true};
    // Collapsed mode: only the first occurrence of each value renders
    // a tile; subsequent duplicates skip. The dataset.bankIdx for the
    // collapsed tile points at the first UNUSED index (or `i` if all
    // are used) so place()/preview hit the right slot.
    var renderIdx = i;
    var collapsedGroup = null;
    if(condenseOn){
      if(puzzleSeen[item.value]) continue;
      puzzleSeen[item.value] = true;
      collapsedGroup = puzzleValueGroups[item.value];
      if(collapsedGroup && collapsedGroup.firstUnused >= 0){
        renderIdx = collapsedGroup.firstUnused;
        item = PZ.bank[renderIdx] || item;
      } else if(collapsedGroup){
        // All used — point at the first slot for visual purposes;
        // place() guards on .used so the tap won't actually consume.
        renderIdx = collapsedGroup.first;
        item = PZ.bank[renderIdx] || item;
      }
    }
    var tile=document.createElement('div');tile.className='bt';
    var tileRadius=Math.max(2,Math.min(10,Math.round(tileSize*0.22)));
    // [v2.10] Bump the main white-number font size in xN and default
    // modes so the outline-stroked digits read clearly. Mini and cyan
    // modes keep the smaller size because they pack additional cyan
    // numbers around/over the main digit and a bigger white digit
    // would crowd them out.
    // [v2.54] Apply user-configurable white font multiplier on top of
    // the existing 1.6× scaling for xN mode. Default 1.0 = no change.
    var _wMult = (typeof window._xnWhiteMult === 'number') ? window._xnWhiteMult : 1.0;
    var _whiteFont = (!miniOn && !cyanOn) ? Math.round(tileFontSize * 1.6 * _wMult) : Math.round(tileFontSize * _wMult);
    tile.style.cssText='min-width:'+tileSize+'px;height:'+tileSize+'px;padding:'+tilePad+';font-size:'+_whiteFont+'px;border-radius:'+tileRadius+'px;';
    // For collapsed tiles, "used" means ALL instances of this value
    // are placed (unused count is 0). Otherwise lit if SEL is active.
    var tileIsUsed = item.used;
    if(condenseOn && collapsedGroup){
      tileIsUsed = (collapsedGroup.unused === 0);
    }
    if(tileIsUsed) tile.classList.add('used');
    else if(SEL) tile.classList.add('lit');

    // v8.96 — render the white main number using the tile's existing
    // flex-center layout (no flex-column override) so it sits at the
    // SAME vertical position as a non-collapsed tile. The cyan content
    // (×N badge or mini-numbers grid) is added as an absolutely-positioned
    // overlay anchored to the tile's bottom, so it doesn't shift the
    // main number. The tile's CSS sets isolation:isolate which gives us
    // a positioning context without needing to set position:relative
    // explicitly — but we set it anyway to be defensive.
    //
    // v8.97 — when the tile has cyan content below it (xN badge or
    // mini grid), pin the white number to the TOP of the tile (per
    // user preference) and reserve at least a 2px gap between the
    // bottom of the white glyph and the top of the cyan content.
    // For non-collapsed tiles or collapsed tiles with total===1
    // (no cyan content), the number still centers as before.
    // [v1.30] Three-mode rendering.
    //
    // xN MODE: white number CENTERED in the tile (per user request),
    //   small cyan ×N badge anchored to the bottom. Tiles with total=1
    //   render as a plain centered number — no badge, no special layout.
    //
    // MINI MODE: white number pinned to the TOP of the tile (always —
    //   even when total=1, so all tiles share the same vertical anchor
    //   for visual consistency). Cyan grid of N-1 small copies fills
    //   the bottom area when there ARE duplicates.
    //
    // CYAN MODE: NO white number. The grid contains N cyan copies
    //   (not N-1) and uses the full tile height. Cell sizes scale up
    //   so the digits fill the tile and are easy to read.
    var hasMultiple = condenseOn && collapsedGroup && collapsedGroup.total > 1;
    if(cyanOn && condenseOn && collapsedGroup){
      // ── CYAN MODE ───────────────────────────────────────────────
      tile.style.position = 'relative';
      // No white number. The grid renders ALL copies as cyan.
      tile.dataset.collapsedValue = item.value;
      var cellsToShow = collapsedGroup.unused;
      // Use full tile interior — no whiteZone, just a small inset.
      var insetPad = Math.max(2, Math.round(tileSize*0.06));
      // Render an empty/used tile (no unused copies) as a faded
      // "exhausted" tile so the layout doesn't collapse weirdly.
      if(cellsToShow > 0){
        // Grid sizing: pretend whiteZone=insetPad and bottomPad=insetPad
        // so the grid fills the tile minus a small border.
        var grid = window._computeMiniGrid(cellsToShow, tileSize, tileFontSize, insetPad, insetPad);
        // [v1.30] In cyan mode the grid IS the content, so allow much
        // larger glyphs than the mini mode's 0.42 hardMax. Recompute
        // a bigger fontPx if the grid layout supports it.
        var maxBigFont = Math.round(tileFontSize * 1.05);
        if(grid.fontPx < maxBigFont){
          var areaW = tileSize - (2 * insetPad);
          var areaH = tileSize - (2 * insetPad);
          var GLYPH_W_PER_EM = 0.62;
          var GAP = 1;
          var cellW = (areaW - (grid.cols - 1) * GAP) / grid.cols;
          var cellH = (areaH - (grid.rows - 1) * GAP) / grid.rows;
          var biggerFont = Math.min(cellW / GLYPH_W_PER_EM, cellH * 0.95, maxBigFont);
          if(biggerFont > grid.fontPx) grid.fontPx = Math.floor(biggerFont);
        }
        var cyanWrap = document.createElement('div');
        cyanWrap.className = '_btCyanGrid';
        cyanWrap.style.cssText = 'position:absolute;'
          + 'top:' + insetPad + 'px;left:' + insetPad + 'px;'
          + 'right:' + insetPad + 'px;bottom:' + insetPad + 'px;'
          + 'display:grid;'
          + 'grid-template-columns:repeat(' + grid.cols + ',1fr);'
          + 'grid-template-rows:repeat(' + grid.rows + ',1fr);'
          + 'gap:1px;'
          + 'overflow:hidden;'
          + 'pointer-events:none;'
          + 'line-height:1;';
        for(var ci = 0; ci < cellsToShow; ci++){
          var cyanNum = document.createElement('span');
          cyanNum.className = '_btCyanNum';
          cyanNum.textContent = item.value;
          cyanNum.style.cssText = 'display:flex;'
            + 'align-items:center;justify-content:center;'
            + 'font-size:' + grid.fontPx + 'px;'
            + 'color:#0093aa;font-weight:600;'
            + 'line-height:1;'
            + 'overflow:hidden;'
            + 'white-space:nowrap;';
          cyanWrap.appendChild(cyanNum);
        }
        tile.appendChild(cyanWrap);
      } else {
        // [v3.74] Used / all-placed cyan-mode tile. Previously this
        // rendered the value at rgba(0,147,170,0.25) — a 25% alpha
        // cyan. Combined with .bt.used's opacity:0.25, the effective
        // alpha was ~0.0625, which on black is essentially invisible.
        // Other display modes don't have this problem because their
        // .used tiles show a WHITE outlined digit; white at 25%
        // opacity is still legible. Cyan at 25% × 25% is not.
        //
        // Fix: use full-alpha cyan (so .bt.used's 0.25 opacity is the
        // only dimming applied — matching every other mode's effective
        // dimming) and add a thin 0.3px text-stroke in a slightly
        // lifted cyan. The stroke thickens the glyph silhouette, which
        // is what makes it read at low effective alpha — single
        // hairlines on a black background disappear regardless of
        // color saturation. Scoped to cyan mode only via the enclosing
        // if(cyanOn && condenseOn && collapsedGroup) branch.
        tile.textContent = item.value;
        tile.style.color = '#0093aa';
        tile.style.webkitTextStroke = '0.3px #7dd3e0';
        tile.style.textStroke = '0.3px #7dd3e0';
      }
    } else if(xnOn && condenseOn && collapsedGroup){
      // ── xN MODE ─────────────────────────────────────────────────
      // [v2.40] Shrunk cyan font from 0.6× whiteFont to 0.45×.
      // Through v2.36/v2.37/v2.38/v2.39 we discovered the real
      // issue wasn't positioning at all — it was that the combined
      // intrinsic height of (white digit line-box + cyan line-box +
      // top padding + bottom padding) exceeded the tile content
      // area in Chrome/Brave/Firefox. DDGo happened to fit because
      // its line-box rendering is tighter. v2.39's overflow:hidden
      // confirmed this — the cyan was getting CLIPPED at the bottom
      // border, meaning it really was rendering past the tile edge.
      // Real fix: just shrink the cyan font so the math works in
      // every browser. 0.45× is still readable but leaves clearance.
      // Layout uses flex-column with margin-top:auto on the cyan
      // to push it to the bottom of available flex space.
      tile.style.position = 'relative';
      tile.dataset.collapsedValue = item.value;
      // [v2.51] padTop now driven by user setting (xnTopPct, default 4%
      // of tileSize). padBot kept tiny — leftover vertical space below
      // the cyan ×N reads as natural breathing room from the bottom
      // border, no need for symmetric padding here. Cyan's margin-top
      // (set below) is now a fixed gap instead of margin-top:auto, so
      // the white digit + gap + cyan stacks tightly at the top with
      // empty space underneath rather than spreading across the tile.
      var _xnTopPct = (typeof window._xnTopPct === 'number') ? window._xnTopPct : 4;
      var _xnGapPct = (typeof window._xnGapPct === 'number') ? window._xnGapPct : 0;
      // [v2.55] Split positive and negative top offsets:
      // - Positive: use tile's paddingTop (white digit gets pushed
      //   down by that many pixels from the tile's top border).
      // - Negative: paddingTop:0 + marginTop on the white SPAN itself
      //   (since CSS clamps negative padding to 0, and we need the
      //   white digit to actually move UP into / past the top border).
      // Negative margin on a flex item is valid and pulls the item
      // upward, exposing area above where it would normally sit.
      var _topOffsetPx = Math.round(tileSize * (_xnTopPct/100));
      var padTop = Math.max(0, _topOffsetPx);
      var _whiteMarginTop = (_topOffsetPx < 0) ? _topOffsetPx : 0;
      var padBot = 0;
      tile.style.flexDirection = 'column';
      tile.style.justifyContent = 'flex-start';
      tile.style.alignItems = 'center';
      tile.style.paddingTop = padTop + 'px';
      tile.style.paddingBottom = padBot + 'px';
      tile.style.paddingLeft = '0px';
      tile.style.paddingRight = '0px';

      var whiteSpan = document.createElement('span');
      whiteSpan.className = '_btMain';
      whiteSpan.textContent = item.value;
      var _digRightNudge = (String(item.value).length >= 2) ? 'padding-left:0.5px;' : '';
      whiteSpan.style.cssText = 'display:block;text-align:center;'
        + 'line-height:1;width:100%;'
        + 'box-sizing:border-box;'
        + _digRightNudge
        + 'font-size:inherit;'
        // [v2.55] When user dialed a negative top offset, padTop is
        // 0 (CSS clamps negative padding) and we apply the negative
        // value as marginTop here instead. Pulls the white digit up
        // into / above the tile's top border.
        + 'margin-top:' + _whiteMarginTop + 'px;'
        + 'flex-shrink:0;';
      tile.appendChild(whiteSpan);

      // [v3.75] xN badge gate also requires unused >= 2. Per Sam's
      // request, the cyan ×N badge only appears for counts of 2 or
      // more. At unused=1 the badge disappears so the tile reads as
      // just the white digit (since "×1" is redundant); at unused=0
      // the tile is .used (dimmed by .bt.used opacity:0.25) — the
      // gate previously still rendered "×0" inside the dimmed tile,
      // also gone now.
      if(hasMultiple && collapsedGroup.unused >= 2){
        var unused = collapsedGroup.unused;
        var mulSpan = document.createElement('span');
        mulSpan.className = '_btXN';
        mulSpan.textContent = '×' + unused;
        // [v2.41] Reverted cyan font from 0.45× back to 0.6× of
        // the white font. v2.40 shrunk it as a fix for cross-browser
        // overflow, but the bigger-slider-range approach (v2.41) is
        // the better fix — at larger tile sizes the small per-browser
        // line-box drift becomes invisible. Cyan at 0.6× reads more
        // clearly as a labeled multiplier.
        // [v2.49] Removed Math.max(8, ...) floor on cyan font.
        // The 8px minimum was causing the cyan ×N to overflow past
        // the tile's bottom border at small tile sizes: the white
        // font shrinks freely with the tile, but cyan would hit
        // 8px and stop. The cyan then took up proportionally more
        // and more of the tile's vertical space as the tile kept
        // shrinking, until the flex layout's margin-top:auto
        // couldn't fit it inside the tile and pushed it past the
        // bottom edge. Now cyan scales freely with _whiteFont, so
        // it stays inside the tile at any size — at very small
        // sizes it becomes too tiny to read, but that's fine
        // (the white digit at that size is also barely readable).
        // [v2.54] Apply user cyan font multiplier on top of the
        // 0.6× white-font scaling. Default 1.0 = no change.
        var _cMult = (typeof window._xnCyanMult === 'number') ? window._xnCyanMult : 1.0;
        var mulSize = Math.round(_whiteFont * 0.6 * _cMult);
        // [v2.51] Cyan margin-top now uses xnGapPct (% of tileSize)
        // instead of 'auto'. With 'auto', the cyan was pushed all the
        // way to the bottom edge of the available flex space, which
        // looked broken at small tile sizes (cyan poking through the
        // bottom border). With an explicit pixel gap, the cyan sits
        // a controlled distance below the white digit, leaving the
        // remaining vertical space as empty room above the bottom
        // border. Default gap of 0 = cyan sits immediately below.
        // [v2.53] Removed Math.max(0,...) so the gap can go negative,
        // letting cyan pull up and overlap with the white digit's
        // line-box descender. Negative margin-top is valid CSS and
        // is how the user gets cyan to sit immediately under the
        // white glyph (the line-box descender otherwise enforces a
        // few pixels of gap at gap=0%).
        var _gapPx = Math.round(tileSize * (_xnGapPct/100));
        mulSpan.style.cssText = 'display:block;text-align:center;'
          + 'line-height:1;width:100%;'
          + 'margin-top:' + _gapPx + 'px;'
          + 'font-size:' + mulSize + 'px;color:rgba(0,147,170,0.6);'
          + 'font-weight:600;letter-spacing:0.5px;'
          + 'flex-shrink:0;'
          + 'pointer-events:none;';
        tile.appendChild(mulSpan);
      }
    } else if(miniOn && condenseOn && collapsedGroup){
      // ── MINI MODE ───────────────────────────────────────────────
      // White number ALWAYS at top (even with total=1, for consistent
      // visual baseline across the bank). Cyan grid of N-1 copies fills
      // bottom only when there ARE duplicates.
      // [v2.57] Now uses user-tunable settings (parallel to xN mode):
      //   miniTopPct  — white digit's distance from top border
      //   miniGapPct  — gap from white's bottom to first cyan row
      //   miniRowGapPct, miniColGapPct — grid gaps inside the cyan area
      //   miniWhiteMult, miniCyanMult — font multipliers
      // Top offset uses the same positive=padding / negative=marginTop
      // split as v2.55's xN fix (CSS clamps negative padding to 0).
      var _miniTopPct = (typeof window._miniTopPct === 'number') ? window._miniTopPct : 6;
      var _miniGapPct = (typeof window._miniGapPct === 'number') ? window._miniGapPct : 0;
      var _miniRowGapPct = (typeof window._miniRowGapPct === 'number') ? window._miniRowGapPct : 0.5;
      var _miniColGapPct = (typeof window._miniColGapPct === 'number') ? window._miniColGapPct : 0.5;
      var _miniWhiteMult = (typeof window._miniWhiteMult === 'number') ? window._miniWhiteMult : 1.0;
      var _miniCyanMult  = (typeof window._miniCyanMult  === 'number') ? window._miniCyanMult  : 1.0;

      tile.style.position = 'relative';
      tile.style.alignItems = 'flex-start';
      tile.dataset.collapsedValue = item.value;

      var _miniTopOffsetPx = Math.round(tileSize * (_miniTopPct/100));
      var topPad = Math.max(0, _miniTopOffsetPx);
      var _miniWhiteMarginTop = (_miniTopOffsetPx < 0) ? _miniTopOffsetPx : 0;
      tile.style.paddingTop = topPad + 'px';

      // White digit. If we need to apply a font multiplier or a
      // negative top offset, replace tile.textContent with an
      // explicitly-styled span so we can attach the styles. When
      // both are at default, we can keep the legacy textContent
      // path for cheaper DOM.
      // [v2.61] Removed width:100% from the span. With width:100%,
      // when the white font got large enough that a 2-digit number
      // approached or exceeded the tile's width, the span overflowed
      // asymmetrically (digits visually drifted right). Letting the
      // span size to its content width and centering it via the
      // tile's existing justify-content:center keeps the digit
      // centered regardless of how wide the glyphs become — and
      // when the digits exceed the tile, they overflow EVENLY
      // rather than rightward.
      if(_miniWhiteMult !== 1.0 || _miniWhiteMarginTop !== 0){
        var _miniWhiteSpan = document.createElement('span');
        _miniWhiteSpan.textContent = item.value;
        _miniWhiteSpan.style.cssText =
          'display:inline-block;text-align:center;'+
          'font-size:' + Math.round(tileFontSize * _miniWhiteMult) + 'px;'+
          'line-height:1;'+
          'margin-top:' + _miniWhiteMarginTop + 'px;'+
          'white-space:nowrap;'+
          'flex-shrink:0;';
        tile.appendChild(_miniWhiteSpan);
      } else {
        tile.textContent = item.value;
      }

      if(hasMultiple){
        var unused = collapsedGroup.unused;
        // Apply user-tunable gap between white digit and the first
        // cyan row. miniGapPct positive = bigger gap, negative = pull
        // cyan up into white's line-box space.
        var _whiteAdvance = Math.round(tileFontSize * _miniWhiteMult); // height of white glyph
        var _gapPx = Math.round(tileSize * (_miniGapPct/100));
        var whiteZone = topPad + _whiteAdvance + _gapPx;
        var bottomPad = Math.max(1, Math.round(tileSize * 0.04));
        // [v2.58] Row/col gaps can now be negative. Strategy:
        // - Compute layout using max(0, gap) so cells size sensibly.
        // - For positive gap: use CSS row-gap/column-gap as before.
        // - For negative gap: use CSS gap of 0 AND apply negative
        //   margin-top / margin-left to grid items past row 0 / col 0
        //   to pull them visually closer (or overlap).
        var _rawRowGapPx = Math.round(tileSize * (_miniRowGapPct/100));
        var _rawColGapPx = Math.round(tileSize * (_miniColGapPct/100));
        var _rowGapForLayout = Math.max(0, _rawRowGapPx);
        var _colGapForLayout = Math.max(0, _rawColGapPx);
        var _rowGapNeg = (_rawRowGapPx < 0) ? _rawRowGapPx : 0;
        var _colGapNeg = (_rawColGapPx < 0) ? _rawColGapPx : 0;
        var miniCount = Math.max(0, unused - 1);
        if(miniCount > 0){
          var grid = window._computeMiniGrid(miniCount, tileSize, tileFontSize, whiteZone, bottomPad, _rowGapForLayout, _colGapForLayout);
          var miniWrap = document.createElement('div');
          miniWrap.className = '_btMiniGrid';
          miniWrap.style.cssText = 'position:absolute;'
            + 'left:2px;right:2px;bottom:' + bottomPad + 'px;'
            + 'height:' + grid.areaH + 'px;'
            + 'display:grid;'
            + 'grid-template-columns:repeat(' + grid.cols + ',1fr);'
            + 'grid-template-rows:repeat(' + grid.rows + ',1fr);'
            + 'row-gap:' + _rowGapForLayout + 'px;'
            + 'column-gap:' + _colGapForLayout + 'px;'
            + 'overflow:visible;'
            + 'pointer-events:none;'
            + 'line-height:1;';
          // [v2.57] Apply cyan font multiplier on top of the
          // grid-computed fontPx.
          var _miniCyanFontPx = Math.max(3, Math.round(grid.fontPx * _miniCyanMult));
          for(var mi = 0; mi < miniCount; mi++){
            var miniNum = document.createElement('span');
            miniNum.className = '_btMiniNum';
            miniNum.textContent = item.value;
            // [v2.58] Per-item negative margins for negative gap.
            // Items past row 0 get marginTop=_rowGapNeg.
            // Items past col 0 get marginLeft=_colGapNeg.
            var _row = Math.floor(mi / grid.cols);
            var _col = mi % grid.cols;
            var _marginTop  = (_row > 0 && _rowGapNeg < 0) ? _rowGapNeg : 0;
            var _marginLeft = (_col > 0 && _colGapNeg < 0) ? _colGapNeg : 0;
            miniNum.style.cssText = 'display:flex;'
              + 'align-items:center;justify-content:center;'
              + 'font-size:' + _miniCyanFontPx + 'px;'
              + 'color:#0093aa;font-weight:600;'
              + 'line-height:1;'
              + (_marginTop  ? 'margin-top:'  + _marginTop  + 'px;' : '')
              + (_marginLeft ? 'margin-left:' + _marginLeft + 'px;' : '')
              + 'overflow:hidden;'
              + 'white-space:nowrap;';
            miniWrap.appendChild(miniNum);
          }
          tile.appendChild(miniWrap);
        }
      }
    } else {
      tile.textContent = item.value;
    }
    tile.dataset.sndIdx=renderIdx; tile.dataset.bankIdx=renderIdx;
    (function(idx,sndIdx,el){
      // Sound+flash function — used by both touch and click paths
      function spawnParticles(el){
        var tileGap=Math.round(6*TILE_SCALE*TILE_GAP_MULT);
        if(tileGap < 2) return;
        if(!PARTICLES_ON) return;

        // Hide if overlay is open (editor, etc.)
        if(document.getElementById('_sampleOv')) return;

        var bankEl=document.getElementById('bank');
        if(!bankEl) return;

        var tileSize=el.getBoundingClientRect().width;
        var maxDist=tileSize*3;
        var fadeDist=tileSize;

        // ── Get or create canvas ──
        var cv=document.getElementById('_particleCanvas');
        if(!cv){
          cv=document.createElement('canvas');
          cv.id='_particleCanvas';
          cv.style.cssText='position:fixed;pointer-events:none;z-index:9998;';
          document.body.appendChild(cv);
        }

        // ── Update canvas size/position every spawn (handles scroll) ──
        function syncCanvas(){
          var br=bankEl.getBoundingClientRect();
          cv.width=Math.round(br.width);
          cv.height=Math.round(br.height);
          cv.style.left=br.left+'px';
          cv.style.top=br.top+'px';
          cv.style.width=br.width+'px';
          cv.style.height=br.height+'px';
          return br;
        }
        var bankRect=syncCanvas();
        var ctx=cv.getContext('2d');

        // ── Spawn particles from tapped tile edges ──
        var tileRect=el.getBoundingClientRect();
        var tx=tileRect.left-bankRect.left;
        var ty=tileRect.top-bankRect.top;
        var tw=tileRect.width, th=tileRect.height;

        if(!window._particlePool) window._particlePool=[];
        var particles=window._particlePool;

        // Cull dead particles before adding new ones
        for(var ci=particles.length-1;ci>=0;ci--){
          if(particles[ci].dead) particles.splice(ci,1);
        }
        // Hard cap: max 400 live particles at once
        if(particles.length>800) particles.splice(0,particles.length-800);

        var _press=(window._tapPressure!==undefined)?window._tapPressure:0.5;
        var count=Math.round(8+_press*72+Math.random()*8);
        var LIFETIME=window._partLifeMult||55;
        // Quads-mode particle isolation: when quads is on, particles
        // only spawn from the two outer edges of the tapped quadrant
        // (and only along the half of each edge closer to that
        // quadrant), so the burst visibly emanates from one corner
        // instead of the whole pad.
        var _quadIsolate = !!(window._multiHitOn && window._multiHitQuadsOn);
        var _qX = window._currentTapRelX;
        var _qY = window._currentTapRelY;
        var _qW = (_qX != null) ? (_qX < 0.5) : true;   // tap is in west half?
        var _qN = (_qY != null) ? (_qY < 0.5) : true;   // tap is in north half?
        for(var p=0;p<count;p++){
          var side;
          if(_quadIsolate){
            // Pick one of the two valid outer sides for the tapped
            // quadrant. NW: top(0)+left(3); NE: top(0)+right(1);
            // SW: bottom(2)+left(3); SE: bottom(2)+right(1).
            if(_qN && _qW)       side = (Math.random()<0.5) ? 0 : 3;
            else if(_qN && !_qW) side = (Math.random()<0.5) ? 0 : 1;
            else if(!_qN && _qW) side = (Math.random()<0.5) ? 2 : 3;
            else                 side = (Math.random()<0.5) ? 2 : 1;
          } else {
            side=Math.floor(Math.random()*4);
          }
          var px,py,angle;
          // Position along the chosen edge — restricted to the half
          // closer to the tapped quadrant when isolation is on.
          if(side===0){ // top edge
            var _topRange = _quadIsolate ? (_qW ? [0, tw/2] : [tw/2, tw]) : [0, tw];
            px = tx + _topRange[0] + Math.random() * (_topRange[1] - _topRange[0]);
            py = ty;
            angle = -Math.PI/2 + (Math.random()-0.5)*Math.PI*0.85;
          } else if(side===1){ // right edge
            var _rRange = _quadIsolate ? (_qN ? [0, th/2] : [th/2, th]) : [0, th];
            px = tx + tw;
            py = ty + _rRange[0] + Math.random() * (_rRange[1] - _rRange[0]);
            angle = (Math.random()-0.5)*Math.PI*0.85;
          } else if(side===2){ // bottom edge
            var _bRange = _quadIsolate ? (_qW ? [0, tw/2] : [tw/2, tw]) : [0, tw];
            px = tx + _bRange[0] + Math.random() * (_bRange[1] - _bRange[0]);
            py = ty + th;
            angle = Math.PI/2 + (Math.random()-0.5)*Math.PI*0.85;
          } else { // left edge
            var _lRange = _quadIsolate ? (_qN ? [0, th/2] : [th/2, th]) : [0, th];
            px = tx;
            py = ty + _lRange[0] + Math.random() * (_lRange[1] - _lRange[0]);
            angle = Math.PI + (Math.random()-0.5)*Math.PI*0.85;
          }
          // Scale speed with tile size: 1x at TILE_SCALE<=1.0, up to 2x at max (3.0)
          var speedMult=(TILE_SCALE<=1.0)?1.0:1.0+(TILE_SCALE-1.0)/2.0;
          var pressMult=0.2+_press*2.3;
          var _psm=window._partSpeedMult||1;
          var speed=(3+Math.random()*4)*speedMult*pressMult*_psm;
          // Parse tile color into RGB for particles
          var tileCol=tileColors[idx];
          var pr=0,pg=0,pb=0;
          if(tileCol&&tileCol.charAt(0)==='#'){
            var hx=tileCol.replace('#','');
            if(hx.length===3) hx=hx[0]+hx[0]+hx[1]+hx[1]+hx[2]+hx[2];
            pr=parseInt(hx.substr(0,2),16)||0;
            pg=parseInt(hx.substr(2,2),16)||0;
            pb=parseInt(hx.substr(4,2),16)||0;
          }
          // Mix: some particles get the tile color, some get light grey (visible on dark bg)
          var useColor=(tileCol&&tileCol!=='none')&&(Math.random()<0.65);
          var baseDark=Math.floor(160+Math.random()*80);
          var life=Math.floor(LIFETIME*(0.3+Math.random()*0.7))+Math.floor(Math.random()*15);
          var _szm=window._partSizeMult||1;
          var shapeR=Math.random();
          var shape=shapeR<0.3?0:shapeR<0.8?1:2;
          var sides=3+Math.floor(Math.random()*3);
          var radii=[]; for(var ri=0;ri<sides;ri++) radii.push(Math.random());
          // Keep color bright so particles are visible against the dark background
          var darkFactor=0.75+Math.random()*0.35; // 75-110% of original brightness
          particles.push({x:px,y:py,vx:Math.cos(angle)*speed,vy:Math.sin(angle)*speed,
            size:(1.5+Math.random()*2.5)*_szm,
            cr:useColor?Math.round(pr*darkFactor):baseDark,
            cg:useColor?Math.round(pg*darkFactor):baseDark,
            cb:useColor?Math.round(pb*darkFactor):baseDark,
            age:0,life:life,dead:false,
            shape:shape,sides:sides,radii:radii,rot:Math.random()*Math.PI*2});
        }

        // ── Animation loop ──
        if(window._particleRAF) return;

        function frame(){
          var br=bankEl.getBoundingClientRect();
          if(cv.width!==Math.round(br.width)||cv.height!==Math.round(br.height)){
            cv.width=Math.round(br.width); cv.height=Math.round(br.height);
          }
          cv.style.left=br.left+'px'; cv.style.top=br.top+'px';

          if(document.getElementById('_sampleOv')){
            cv.style.display='none';
            window._particleRAF=requestAnimationFrame(frame);
            return;
          }
          cv.style.display='';

          var tileRects=[];
          document.querySelectorAll('#bank .bt').forEach(function(t){
            var r=t.getBoundingClientRect();
            tileRects.push({x:r.left-br.left,y:r.top-br.top,w:r.width,h:r.height});
          });

          ctx.clearRect(0,0,cv.width,cv.height);
          var alive=false;
          var pts=window._particlePool;

          for(var i=0;i<pts.length;i++){
            var pt=pts[i];
            if(pt.dead) continue;

            pt.age++;
            if(pt.age>=pt.life){ pt.dead=true; continue; }

            var _dc=window._partDecay||0.88; pt.vx*=_dc; pt.vy*=_dc;
            pt.x+=pt.vx; pt.y+=pt.vy;

            var t=pt.age/pt.life;
            var tFade=Math.min(t/0.75,1.0);
            var op=Math.pow(1-tFade,1.2)*0.92;
            if(op<=0.015){ pt.dead=true; continue; }

            // Bounce off tile borders/shadows instead of clipping
            // Bounce zone: 1px inside top/left, 3px inside right/bottom (matches shadow)
            var bounced=false;
            for(var r=0;r<tileRects.length;r++){
              var tr=tileRects[r];
              var L=tr.x-1, R=tr.x+tr.w+3, T=tr.y-1, B=tr.y+tr.h+3;
              if(pt.x>L&&pt.x<R&&pt.y>T&&pt.y<B){
                // Find which wall is closest to reflect off
                var dL=pt.x-L, dR=R-pt.x, dT=pt.y-T, dB=B-pt.y;
                var minD=Math.min(dL,dR,dT,dB);
                if(minD===dL||minD===dR){
                  pt.vx=-pt.vx*0.45; // lose energy on bounce
                  pt.x+= (minD===dL) ? -(dL+0.5) : (dR+0.5);
                } else {
                  pt.vy=-pt.vy*0.45;
                  pt.y+= (minD===dT) ? -(dT+0.5) : (dB+0.5);
                }
                bounced=true; break;
              }
            }
            // After bounce, check if still inside — if so just hide this frame
            var stillInside=false;
            if(bounced){
              for(var r=0;r<tileRects.length;r++){
                var tr=tileRects[r];
                if(pt.x>tr.x-1&&pt.x<tr.x+tr.w+3&&pt.y>tr.y-1&&pt.y<tr.y+tr.h+3){stillInside=true;break;}
              }
            }
            if(stillInside){alive=true;continue;}

            var cr=pt.cr,cg=pt.cg,cb=pt.cb;
            ctx.globalAlpha=op;
            var r=pt.size/2;
            if(pt.shape===0){
              ctx.fillStyle='rgb('+cr+','+cg+','+cb+')';
              ctx.beginPath();
              ctx.arc(pt.x,pt.y,r,0,Math.PI*2);
              ctx.fill();
            } else if(pt.shape===1){
              ctx.fillStyle='rgb('+cr+','+cg+','+cb+')';
              ctx.beginPath();
              var sides=pt.sides;
              for(var s=0;s<sides;s++){
                var a=pt.rot+(s/sides)*Math.PI*2;
                var rr=r*(0.55+pt.radii[s]*0.7);
                var nx=pt.x+Math.cos(a)*rr;
                var ny=pt.y+Math.sin(a)*rr;
                s===0?ctx.moveTo(nx,ny):ctx.lineTo(nx,ny);
              }
              ctx.closePath();
              ctx.fill();
            } else {
              // Hot coal: bright center, color outer
              var grad=ctx.createRadialGradient(pt.x,pt.y,0,pt.x,pt.y,r*1.2);
              var br2=Math.min(255,cr+140),bg2=Math.min(255,cg+140),bb2=Math.min(255,cb+140);
              grad.addColorStop(0,'rgba('+br2+','+bg2+','+bb2+',1)');
              grad.addColorStop(0.45,'rgba('+cr+','+cg+','+cb+',0.9)');
              grad.addColorStop(1,'rgba('+cr+','+cg+','+cb+',0)');
              ctx.fillStyle=grad;
              ctx.beginPath();
              ctx.arc(pt.x,pt.y,r*1.2,0,Math.PI*2);
              ctx.fill();
            }
            alive=true;
          }

          ctx.globalAlpha=1;

          if(alive){
            window._particleRAF=requestAnimationFrame(frame);
          } else {
            window._particleRAF=null;
            window._particlePool=[];
            ctx.clearRect(0,0,cv.width,cv.height);
          }
        }
        window._particleRAF=requestAnimationFrame(frame);
      }

      function doSound(pressure){
        // `pressure` comes in pre-normalized: 0..1 from raw radius (0.2..1.4).
        // Can be slightly negative or above 1 for extreme touches.
        if(pressure===undefined) pressure=0.5;

        // Clamp the input to a sane 0..1 range first.
        var _pRaw=Math.max(0, Math.min(1, pressure));

        // Map PRESSURE_BASE (slider can go 0.1..3.1; natural taps saturate
        // around 1.2 on most devices). Use the same 0.1..1.2 scale as _pRaw.
        // PRESSURE_BASE values above 1.2 clamp to 1.0 in the reference calc.
        var _pBase=Math.max(0, Math.min(1, (PRESSURE_BASE-0.1)/1.1));

        // Apply PRESSURE_RANGE: scale both raw and base around 0.5 (neutral).
        //   RANGE=0 → no effect (always 0.5)
        //   RANGE=1 → normal
        //   RANGE=3 → extreme (soft taps pushed toward 0, hard toward 1)
        // Clamp after scaling so we stay in 0..1.
        function _scale(p){ return Math.max(0, Math.min(1, 0.5 + (p-0.5)*PRESSURE_RANGE)); }
        var _pScaled=_scale(_pRaw);
        var _pBaseScaled=_scale(_pBase);

        // Store scaled value for other consumers (e.g. particle/glow code).
        window._tapPressure=_pScaled;

        // Sensitivity toggle: when off, use flat 1.0/1.0 so pressure has no effect.
        var _sensActive=window._getSensOn?window._getSensOn():true;
        var _vMin=_sensActive?(window._sensVolMin!==undefined?window._sensVolMin:0.75):1.0;
        var _vMax=_sensActive?(window._sensVolMax!==undefined?window._sensVolMax:1.25):1.0;

        // Volume curve: linear between vMin and vMax based on scaled pressure.
        // Normalize so that tapping at PRESSURE_BASE gives factor=1.0 → recVolume unchanged.
        var _volAtBase =_vMin+_pBaseScaled*(_vMax-_vMin);
        var _volAtPress=_vMin+_pScaled    *(_vMax-_vMin);
        var _factor=_volAtBase>0?_volAtPress/_volAtBase:1.0;

        var vol=Math.max(0.01,recVolume*_factor);

        // EXPR mode: override volume with X-axis position
        if(PAD_EXPR_ON && window._exprVol!==null){
          vol=window._exprVol;
        }
        // EXPR pitch is applied inside playBankSound via window._exprPitch

        // Remember this volume so any drag-over pads after this tap inherit the same level
        window._lastTapVol=vol;
        if(window._beatEditToggleTile&&window._beatEditToggleTile(sndIdx)) return;
        if(_holdTaggedPads[idx]){
          // Hold mode: start a held voice that loops while the pad is held
          // and fades on touchend. Falls back to one-shot for non-sample pads.
          _startHeldVoice(sndIdx, vol, window._currentTapPan, window._currentTapPanV);
        } else if(_holdOnTapPads[idx]){
          // ── On-Tap hold mode ──
          // Pad was tagged in HLD-BTN's "On Tap" sub-mode. Playback
          // begins at the buffer offset corresponding to where the
          // finger landed horizontally on the waveform, sustains while
          // held, and stops on touchend (no loop). For pads without a
          // resolvable buffer (non-sample stock sounds with no cached
          // render yet) we still start a held voice — the helper falls
          // through to a one-shot + render-on-demand path that ignores
          // the offset on the attack but applies it to the sustain.
          var _otRealIdx = sndIdx;
          if(!userSamples[_otRealIdx]){
            var _otMetaA = sampleMeta[_otRealIdx] || {};
            if(_otMetaA._aliasIdx !== undefined) _otRealIdx = _otMetaA._aliasIdx;
          }
          var _otBuf = userSamples[_otRealIdx]
                    || (sampleMeta[_otRealIdx] && sampleMeta[_otRealIdx]._stockSourceBuffer)
                    || null;
          var _otRelX = (typeof window._currentTapRelX === 'number') ? window._currentTapRelX : 0.5;
          var _otOffsetSec = _otBuf ? (_otRelX * (_otBuf.duration || 0)) : 0;
          _startHeldVoice(sndIdx, vol, window._currentTapPan, window._currentTapPanV, _otOffsetSec);
        } else if(_holdOnBeatPads[idx]){
          // ── On-Beat hold mode ──
          // Same as On-Tap, but the requested offset is snapped to the
          // nearest detected onset (within ON_BEAT_SNAP_MS) before
          // playback starts. Onsets were detected at tag-time and
          // cached on meta._onsets; if the cache is empty (e.g. the
          // sample changed since tagging), we re-detect lazily here.
          // No detected onsets at all → falls through to raw position
          // (the same behavior as On-Tap), which is the right outcome
          // for smooth content like pads or vocals.
          var ON_BEAT_SNAP_MS = 100; // tap within 100ms of an onset snaps to it
          var _obRealIdx = sndIdx;
          if(!userSamples[_obRealIdx]){
            var _obMetaA = sampleMeta[_obRealIdx] || {};
            if(_obMetaA._aliasIdx !== undefined) _obRealIdx = _obMetaA._aliasIdx;
          }
          var _obBuf = userSamples[_obRealIdx]
                    || (sampleMeta[_obRealIdx] && sampleMeta[_obRealIdx]._stockSourceBuffer)
                    || null;
          var _obRelX = (typeof window._currentTapRelX === 'number') ? window._currentTapRelX : 0.5;
          var _obRawSec = _obBuf ? (_obRelX * (_obBuf.duration || 0)) : 0;
          // Lazy onset cache — if no cached onsets and we have a buffer,
          // detect now. Cache the result so subsequent taps are O(1).
          // Note we cache on the resolved (real) idx's meta so aliased
          // pads share their detection result.
          var _obMeta = sampleMeta[_obRealIdx];
          if(_obBuf && (!_obMeta || !_obMeta._onsets) && window._detectOnsets){
            if(!sampleMeta[_obRealIdx]) sampleMeta[_obRealIdx] = {};
            sampleMeta[_obRealIdx]._onsets = window._detectOnsets(_obBuf);
            _obMeta = sampleMeta[_obRealIdx];
          }
          var _obSnapped = _obRawSec;
          if(_obMeta && _obMeta._onsets && window._snapToOnset){
            _obSnapped = window._snapToOnset(_obRawSec, _obMeta._onsets, ON_BEAT_SNAP_MS / 1000);
          }
          _startHeldVoice(sndIdx, vol, window._currentTapPan, window._currentTapPanV, _obSnapped);
        } else {
          // ── Multi-hit: resolve total hit count + delay ──
          // In quads mode, the quadrant of the tap determines the
          // pattern (NW=1, NE=2 at selected, SW=3 at triplet,
          // SE=2 at next-faster). Outside quads mode, the menu's
          // selected division decides everything.
          var _mhPlan = window._multiHitResolvePlan
            ? window._multiHitResolvePlan(window._currentTapRelX, window._currentTapRelY)
            : null;
          var _firstVol = vol;
          if(window._multiHitOn && _mhPlan && _mhPlan.totalHits > 1){
            var _N = _mhPlan.totalHits;
            var _accent = (window._sfxSettings && typeof window._sfxSettings.multiHitAccent === 'number')
              ? window._sfxSettings.multiHitAccent : 0;
            if(_accent > 0){
              _firstVol = vol * (1 + _accent * (_N - 1) / _N);
              if(_firstVol > 4) _firstVol = 4;
            }
          }
          playBankSound(sndIdx,_firstVol,window._currentTapPan,window._currentTapPanV);
          // Quads-mode quadrant flash — faint red overlay on the
          // tapped quadrant, fades out shortly after.
          if(window._multiHitOn && window._multiHitQuadsOn && window._showQuadFlash && _mhPlan){
            try{ window._showQuadFlash(el, _mhPlan.quadrant); }catch(_){}
          }
        }
        window._lastActivePad=idx;
        window._lastTapPanVal=window._currentTapPan;
        // Record the first hit. Use _firstVol so accent shows up in
        // playback. Capture the quantized base time so multi-hit
        // extras can anchor their precise offsets to the same point.
        // For triplet-based multi-hit clusters, set a one-shot feel
        // override so the first hit gets tagged feel=12 (triplet view)
        // rather than the live FEEL — keeps the whole cluster visible
        // under one grid family.
        var _baseRecTime = null;
        if(window._seqNoteOn){
          var _firstRecVol = (window._multiHitOn && _mhPlan && _mhPlan.totalHits > 1) ? _firstVol : vol;
          if(window._multiHitOn && _mhPlan && _mhPlan.isTriplet){
            window._seqRecFeelOverride = 12;
          }
          _baseRecTime = _seqNoteOn(sndIdx, idx, _firstRecVol);
        }
        // Schedule extra pad fires per the resolved plan. Skipped for
        // held pads (hold owns the voice while finger's down), on-tap
        // and on-beat pads (same — finger position drives sustained
        // playback), and beat-edit toggles (those return above before
        // reaching here).
        if(window._multiHitOn && !_holdTaggedPads[idx] && !_holdOnTapPads[idx] && !_holdOnBeatPads[idx] && _mhPlan && _mhPlan.totalHits > 1){
          var _mhPan  = window._currentTapPan;
          var _mhPanV = window._currentTapPanV;
          var _mhSnd  = sndIdx;
          var _mhBank = idx;
          var _mhDelayMs = _mhPlan.delayMs;
          var _mhExtras  = _mhPlan.totalHits - 1;
          var _mhAccent  = (window._sfxSettings && typeof window._sfxSettings.multiHitAccent === 'number')
            ? window._sfxSettings.multiHitAccent : 0;
          var _mhN = _mhPlan.totalHits;
          var _mhExtraVol = vol;
          if(_mhAccent > 0){
            _mhExtraVol = vol * (1 - _mhAccent / _mhN);
            if(_mhExtraVol < 0.001) _mhExtraVol = 0.001;
          }
          // Record each extra into the recording track immediately
          // (with its precise time offset) so playback reproduces
          // the multi-hit pattern. We record at trigger time rather
          // than at fire time so all extras are present in the
          // recording even if the user releases REC before they fire.
          // Triplet-based patterns (SW quadrant in quads mode, or any
          // *triplet division in standard mode) get tagged with feel=12
          // so the events live under the triplet view of the beat-light
          // grid — that way the user can see and edit them.
          if(_baseRecTime !== null && window._seqRecExtraNote){
            var _mhFeelOverride = (_mhPlan.isTriplet) ? 12 : undefined;
            for(var _eRec = 1; _eRec <= _mhExtras; _eRec++){
              var _offMs = _mhDelayMs * _eRec;
              window._seqRecExtraNote(_mhSnd, _mhBank, _baseRecTime, _offMs, _mhExtraVol, _mhPan, _mhPanV, _mhFeelOverride);
            }
          }
          if(_mhDelayMs > 0 && _mhDelayMs < 4000){
            for(var _eh = 1; _eh <= _mhExtras; _eh++){
              (function(_step){
                setTimeout(function(){
                  try{ playBankSound(_mhSnd, _mhExtraVol, _mhPan, _mhPanV); }catch(_){}
                }, _mhDelayMs * _step);
              })(_eh);
            }
          }
        }
        // Pad tap haptic — scales with pressure when sens is on
        if(window._padHaptic) window._padHaptic(vol, false);

        // Use tile's color for tap glow and crosshair — compute before hit
        // marker block so it can reference _tapCol too.
        var _tc=tileColors[idx];
        var _tapCol=_tc&&_tc!=='none'?_tc:'#00d9ff';

        // ── Hit marker glow ──
        // Show a radial glow at the exact tap position inside the pad.
        // Size scales with volume when touch sensitivity is on.
        if((PAD_PAN_ON||PAD_EXPR_ON) && el.offsetWidth>=60){
          var _hmX=window._currentTapRelX||0.5;
          var _hmY=window._currentTapRelY||0.5;
          var _hmVolNorm=Math.max(0,Math.min(1, vol/Math.max(0.5,recVolume))); // 0=silent, 1=full vol
          var _hmSize=Math.max(16, Math.min(el.offsetWidth*0.7, el.offsetWidth*(0.2 + _hmVolNorm*0.5)));
          var _hm=document.createElement('div');
          _hm.className='_hitMarker';
          _hm.style.cssText='position:absolute;pointer-events:none;border-radius:50%;z-index:10;'+
            'left:'+(_hmX*100)+'%;top:'+(_hmY*100)+'%;'+
            'width:'+_hmSize+'px;height:'+_hmSize+'px;'+
            'transform:translate(-50%,-50%) scale(1);'+
            'background:radial-gradient(circle,rgba(255,255,255,0.7) 0%,rgba(0,217,255,0.5) 40%,transparent 70%);'+
            'animation:_hitGlow 250ms ease-out forwards;';
          el.style.position='relative';
          el.style.overflow='hidden';
          el.appendChild(_hm);
          setTimeout(function(){ if(_hm.parentNode) _hm.parentNode.removeChild(_hm); },300);

          // Central pinpoint dot — small cyan marker at the exact (possibly
          // snapped) tap position. Persists through finger-lift so you can see
          // which grid point you snapped to. EXPR mode only, since that's
          // where grid snapping matters.
          if(PAD_EXPR_ON){
            var _pd=document.createElement('div');
            _pd.className='_hitPinpoint';
            _pd.style.cssText='position:absolute;pointer-events:none;border-radius:50%;z-index:12;'+
              'left:'+(_hmX*100)+'%;top:'+(_hmY*100)+'%;'+
              'width:8px;height:8px;'+
              'transform:translate(-50%,-50%);'+
              'background:#00e5ff;'+
              'box-shadow:0 0 6px rgba(0,229,255,1),0 0 12px rgba(0,229,255,0.8),0 0 20px rgba(0,217,255,0.5);'+
              'animation:_hitPinpoint 400ms ease-out forwards;';
            el.appendChild(_pd);
            setTimeout(function(){ if(_pd.parentNode) _pd.parentNode.removeChild(_pd); },400);

            // Crosshair — vertical and horizontal neon lines through the
            // tap point, colored to match the pad's tile color. Same duration
            // and hold-then-fade curve as the pinpoint dot so everything
            // vanishes together after the grid point has been clearly shown.
            if(EXPR_CROSS_ON){
              var _vLine=document.createElement('div');
              _vLine.className='_hitCrosshairV';
              _vLine.style.cssText='position:absolute;pointer-events:none;z-index:11;'+
                'left:'+(_hmX*100)+'%;top:0;bottom:0;'+
                'width:2px;'+
                'transform:translateX(-50%);'+
                'background:'+_tapCol+';'+
                'box-shadow:0 0 4px '+hexToRgba(_tapCol,0.9)+',0 0 10px '+hexToRgba(_tapCol,0.6)+';'+
                'animation:_hitCrosshair 400ms ease-out forwards;';
              el.appendChild(_vLine);
              setTimeout(function(){ if(_vLine.parentNode) _vLine.parentNode.removeChild(_vLine); },400);
              var _hLine=document.createElement('div');
              _hLine.className='_hitCrosshairH';
              _hLine.style.cssText='position:absolute;pointer-events:none;z-index:11;'+
                'top:'+(_hmY*100)+'%;left:0;right:0;'+
                'height:2px;'+
                'transform:translateY(-50%);'+
                'background:'+_tapCol+';'+
                'box-shadow:0 0 4px '+hexToRgba(_tapCol,0.9)+',0 0 10px '+hexToRgba(_tapCol,0.6)+';'+
                'animation:_hitCrosshair 400ms ease-out forwards;';
              el.appendChild(_hLine);
              setTimeout(function(){ if(_hLine.parentNode) _hLine.parentNode.removeChild(_hLine); },400);
            }
          }
        }
        // Pulse a random equation if nothing is selected in puzzle
        if(!SEL && PULSE_EQ_ON && window._pulseRandomEq) window._pulseRandomEq();
        el.style.setProperty('--flash-bg', 'transparent');
        if(GLOW_ON){ var _gs2=window._padGlowScale?window._padGlowScale():1.0; var _aH=Math.max(0,Math.min(1,0.7*_gs2)); var _aL=Math.max(0,Math.min(1,0.25*_gs2)); el.style.setProperty('--tap-glow', hexToRgba(_tapCol,_aH)); el.style.setProperty('--tap-glow-soft', hexToRgba(_tapCol,_aL)); } else { el.style.removeProperty('--tap-glow'); el.style.removeProperty('--tap-glow-soft'); }
        // Hold-tagged pads get a persistent glow (no auto-cleanup) that stays
        // lit for the full hold duration. Cleared manually in touchend/cancel.
        // Spin is skipped for held pads because the transient rotation doesn't
        // pair well with a sustained held voice — a steady pressed glow reads
        // more cleanly as "this pad is active".
        if(_holdTaggedPads[idx]){
          el.classList.add('pressed','active-flash');
          // Border is no longer set instantly here — _startPadWavePlay creates
          // a progressive border overlay (.bt-border-anim) that draws in
          // left-to-right synced to the waveform fill playhead, giving the
          // hold-pad press a dynamic "filling up" feel instead of an
          // all-at-once flash.
          if(GLOW_ON){ var _gsH=window._padGlowScale?window._padGlowScale():1.0; var _aHh=Math.max(0,Math.min(1,0.7*_gsH)); var _aLh=Math.max(0,Math.min(1,0.25*_gsH)); if(window._setPadGlow){ window._setPadGlow(el, hexToRgba(_tapCol,_aHh), hexToRgba(_tapCol,_aLh)); } else { el.style.boxShadow='0 0 28px 8px '+hexToRgba(_tapCol,_aHh)+',0 0 50px 12px '+hexToRgba(_tapCol,_aLh); } } else { if(window._clearPadGlow) window._clearPadGlow(el); else el.style.boxShadow='none'; }
          spawnParticles(el);
          if(window._flashPadWaveform) window._flashPadWaveform(el, idx);
          // No cleanup timeout — touchend/touchcancel will clear the glow.
        } else if(SPIN_ON){
          // Clamp pressure for the duration math — raw `pressure` can go above
          // 1.0 (comment at top of doSound notes "slightly above 1 for extreme
          // touches"). Without clamping, pressure>1.23 gives a negative spin
          // duration, the cleanup timeout fires at 0ms, and the spinning class
          // gets removed before the CSS animation can even start → no spin.
          var _spP=Math.max(0,Math.min(1,pressure));
          // Duration formula: pressure=0 → 1100ms, pressure=1 → 600ms.
          // Absolute durations feel faster on larger pads (outer edge travels
          // more pixels in the same time), so the base is set long enough
          // that bigger pads still read as a deliberate rotation rather than
          // a blur.
          // [Equil 1.09] Multiplier hook so OPTIONS panel can dial speed.
          // window._spinDurMult: default 1.0; <1 = faster spin, >1 = slower spin.
          var _sdm=(typeof window._spinDurMult==='number'&&window._spinDurMult>0)?window._spinDurMult:1.0;
          var _spinDur=Math.max(80,Math.round((1100-_spP*500)*_sdm));
          el.style.setProperty('--spin-dur',_spinDur+'ms');
          el.classList.remove('spinning');
          void el.offsetWidth;
          el.classList.add('spinning','active-flash');
          var _gsS=window._padGlowScale?window._padGlowScale():1.0; var _aHs=Math.max(0,Math.min(1,0.7*_gsS)); var _aLs=Math.max(0,Math.min(1,0.25*_gsS)); var _aBs=Math.max(0.05,Math.min(1,1.0*_gsS)); el.style.border='1.5px solid '+hexToRgba(_tapCol,_aBs); if(GLOW_ON){ if(window._setPadGlow){ window._setPadGlow(el, hexToRgba(_tapCol,_aHs), hexToRgba(_tapCol,_aLs)); } else { el.style.boxShadow='0 0 28px 8px '+hexToRgba(_tapCol,_aHs)+',0 0 50px 12px '+hexToRgba(_tapCol,_aLs); } } else { if(window._clearPadGlow) window._clearPadGlow(el); else el.style.boxShadow='none'; }
          spawnParticles(el);
          if(window._flashPadWaveform) window._flashPadWaveform(el, idx);
          // Cancel any previous cleanup timer — otherwise the old one fires
          // mid-rotation on rapid retriggers and kills the animation early.
          if(el._flashCleanupTimer){ clearTimeout(el._flashCleanupTimer); }
          el._flashCleanupTimer = setTimeout(function(){ el._flashCleanupTimer=null; el.classList.remove('spinning','active-flash'); el.style.background=''; el.style.removeProperty('--tap-glow'); el.style.removeProperty('--tap-glow-soft'); if(window._clearPadGlow) window._clearPadGlow(el); applyTileColor(el,idx); },_spinDur);
        } else {
          el.classList.add('pressed','active-flash');
          var _gsP=window._padGlowScale?window._padGlowScale():1.0; var _aHp=Math.max(0,Math.min(1,0.7*_gsP)); var _aLp=Math.max(0,Math.min(1,0.25*_gsP)); var _aBp=Math.max(0.05,Math.min(1,1.0*_gsP)); el.style.border='1.5px solid '+hexToRgba(_tapCol,_aBp); if(GLOW_ON){ if(window._setPadGlow){ window._setPadGlow(el, hexToRgba(_tapCol,_aHp), hexToRgba(_tapCol,_aLp)); } else { el.style.boxShadow='0 0 28px 8px '+hexToRgba(_tapCol,_aHp)+',0 0 50px 12px '+hexToRgba(_tapCol,_aLp); } } else { if(window._clearPadGlow) window._clearPadGlow(el); else el.style.boxShadow='none'; }
          spawnParticles(el);
          if(window._flashPadWaveform) window._flashPadWaveform(el, idx);
          var _spPf=Math.max(0,Math.min(1,pressure));
          var _fbd=window._flashBaseDur||180;
          // Same stale-timeout guard as the spin branch above.
          if(el._flashCleanupTimer){ clearTimeout(el._flashCleanupTimer); }
          el._flashCleanupTimer = setTimeout(function(){ el._flashCleanupTimer=null; el.classList.remove('pressed','active-flash'); el.style.background=''; el.style.removeProperty('--tap-glow'); el.style.removeProperty('--tap-glow-soft'); if(window._clearPadGlow) window._clearPadGlow(el); applyTileColor(el,idx); },Math.round(_fbd*(0.5+_spPf)));
        }
      }
      // Long-press for sample recording — measured on touchend
      var _holdStartX=0, _holdStartY=0, _holdTimer=null, _holdFired=false, _holdTouchId=null;
      el._spawn = spawnParticles;
      el.addEventListener('touchstart',function(e){
        if(window._eraseIsActive && window._eraseIsActive()){
          window._eraseToggleBank(idx); return;
        }
        // DEL mode — destroy the pad (sample + metadata + color + hold flag)
        // with a shard-burst animation. Snapshot pushed onto the undo
        // stack so a long-press on the DEL button can restore it.
        if(window._padDelModeActive && window._padDelModeActive()){
          if(window._padDelTap) window._padDelTap(idx, el);
          return;
        }
        // Copy mode intercept
        if(window._copyModeActive && window._copyModeActive()){
          if(window._copyModeTap) window._copyModeTap(idx);
          return;
        }
        // Color tag mode — paint tile and begin drag-paint
        if(window._colorModeActive && window._colorModeActive()){
          // Use changedTouches[0] (the finger that just landed on this pad),
          // not e.touches[0] (which would be a different finger if one's
          // already on the scroll strip).
          var ct = e.changedTouches[0];
          if(window._colorModeStart) window._colorModeStart(idx, ct.identifier, ct.clientX, ct.clientY);
          return;
        }
        // Hold-select mode — tap to toggle whether this pad uses hold behavior.
        // Branches on window._holdMode:
        //   'standard' — toggle membership in _holdTaggedPads (yellow dot,
        //                pad sustains while held).
        //   'onTap'    — toggle membership in _holdOnTapPads (cyan dot,
        //                pad starts playback at the tapped X-position
        //                along its waveform while held). Tagging a pad
        //                in onTap mode also auto-enables the pad waveform
        //                display so the user can see where they're going
        //                to land — without that, picking a position would
        //                be guesswork. Tagging a pad in one mode removes
        //                it from the other so the two never coexist.
        // The yellow/cyan upper-right mark appears/disappears, nothing plays.
        if(_holdSelectMode){
          // Three-mode dispatch. Membership is mutually exclusive — a
          // pad can be in at most one of standard/onTap/onBeat at a
          // time. Toggling a pad in one mode removes it from the
          // other two if present. Tagging a pad in any position-
          // aware mode (onTap or onBeat) auto-enables the pad
          // waveform display, since picking an X-position blindly is
          // not a useful UX.
          var _hm = window._holdMode;
          if(_hm !== 'onTap' && _hm !== 'onBeat') _hm = 'standard';

          // Helper: if waveform display is off and we just tagged a
          // position-aware pad, switch it on so the user can see
          // where they'll land.
          function _ensureWaveformsOn(){
            if(window._padWavesOn) return;
            window._padWavesOn = true;
            try{ localStorage.setItem('padWavesOn', '1'); }catch(_){}
            if(window.prewarmStockWaveforms){
              try{ window.prewarmStockWaveforms(false); }catch(_){}
            }
            var _wavBtn = document.getElementById('btnWaveToggle');
            if(_wavBtn){
              _wavBtn.classList.toggle('active', true);
              _wavBtn.style.opacity = '1';
            }
            if(window._padDsplyMenuRefresh) window._padDsplyMenuRefresh();
          }

          var _wasTagged = false;
          if(_hm === 'onTap'){
            if(_holdOnTapPads[idx]){
              delete _holdOnTapPads[idx];
            } else {
              _holdOnTapPads[idx] = true;
              _wasTagged = true;
              if(_holdTaggedPads[idx])  delete _holdTaggedPads[idx];
              if(_holdLoopPads[idx])    delete _holdLoopPads[idx];
              if(_holdOnBeatPads[idx])  delete _holdOnBeatPads[idx];
              _ensureWaveformsOn();
            }
          } else if(_hm === 'onBeat'){
            if(_holdOnBeatPads[idx]){
              delete _holdOnBeatPads[idx];
              // Don't clear cached onsets here — keeping them around
              // means re-tagging is instant. They'll get refreshed
              // automatically if the underlying buffer changes (we
              // re-detect on first tap if cache is missing).
            } else {
              _holdOnBeatPads[idx] = true;
              _wasTagged = true;
              if(_holdTaggedPads[idx])  delete _holdTaggedPads[idx];
              if(_holdLoopPads[idx])    delete _holdLoopPads[idx];
              if(_holdOnTapPads[idx])   delete _holdOnTapPads[idx];
              _ensureWaveformsOn();
              // Run onset detection immediately so the first tap on
              // the pad has snap targets ready. Detection on a few-
              // second loop is well under 50ms — fine on the main
              // thread for tag-time. Result cached on meta._onsets.
              try{
                var _bufForDetect = userSamples[idx]
                                  || (sampleMeta[idx] && sampleMeta[idx]._stockSourceBuffer)
                                  || null;
                if(_bufForDetect && window._detectOnsets){
                  if(!sampleMeta[idx]) sampleMeta[idx] = {};
                  sampleMeta[idx]._onsets = window._detectOnsets(_bufForDetect);
                }
              }catch(_){}
            }
          } else {
            // standard mode
            if(_holdTaggedPads[idx]){
              delete _holdTaggedPads[idx];
            } else {
              _holdTaggedPads[idx] = true;
              _wasTagged = true;
              if(_holdOnTapPads[idx])  delete _holdOnTapPads[idx];
              if(_holdOnBeatPads[idx]) delete _holdOnBeatPads[idx];
            }
          }

          if(window._saveHoldTags)   window._saveHoldTags();
          if(window._saveHoldLoops)  window._saveHoldLoops();
          if(window._saveHoldOnTap)  window._saveHoldOnTap();
          if(window._saveHoldOnBeat) window._saveHoldOnBeat();
          if(window._updateHoldMarks) window._updateHoldMarks();
          if(window._tapHaptic) window._tapHaptic();
          if(window._btnFx) window._btnFx(_wasTagged ? 'tool_on' : 'tool_off');
          return;
        }
        // Pad edit mode — tapping any pad opens its sample editor, then exits
        // edit mode. The early return below skips sound/particles/press
        // visuals. (touchstart is registered as passive so preventDefault is
        // a no-op; the click handler below also intercepts to skip place().)
        if(window._padEditModeConsume && window._padEditModeConsume(idx)){
          return;
        }
        // BPM-detect mode — same pattern: consume the tap, analyze the pad's
        // audio buffer, exit detect mode. No pad sound plays.
        if(window._bpmDetectConsume && window._bpmDetectConsume(idx)){
          return;
        }
        // v10.05 — blank-kit mode: tapping an empty pad opens the
        // sample editor with the LOAD SAMPLE panel auto-expanded.
        // Pads that already have a sample play normally (fall through).
        // Same skip-visuals semantics as the edit-mode consume above.
        if(window._blankKitEmptyTapConsume && window._blankKitEmptyTapConsume(idx)){
          return;
        }
        // Use changedTouches[0] — the finger that JUST landed on THIS tile
        var _ct=e.changedTouches[0];
        _holdStartX=_ct.clientX;
        _holdStartY=_ct.clientY;
        _holdTouchId=_ct.identifier;
        _holdFired=false;
        // Long-press-to-open-editor removed — use the EDIT button on the
        // PADS bar instead. The _holdTimer / _holdFired variables are left in
        // place so the move/end handlers that reference them keep working
        // without change; they simply never trigger the editor anymore.
        if(!SEL){
          var _t=e.changedTouches[0];
          // Use nullish-coalescing logic here: treat 0 as a valid radius
          // reading. The old `||` chain would fall through to PRESSURE_BASE
          // (3.1) any time radiusX was 0, which some Android devices report
          // when headphones are connected — causing every tap to read as
          // maximum pressure regardless of actual touch size.
          // Order of preference:
          //   1. radiusX / webkitRadiusX — touch ellipse size in px, the
          //      best signal on devices that report it.
          //   2. force / webkitForce — normalized 0..1 pressure. Some
          //      browsers (including Brave on certain Android builds)
          //      report force without radius, so this is a necessary
          //      fallback before giving up on the neutral baseline.
          //   3. PRESSURE_BASE — the neutral reference value meaning
          //      "unknown pressure, treat as typical tap".
          var _r;
          if(_t.radiusX != null && _t.radiusX > 0){
            _r = _t.radiusX;
          } else if(_t.webkitRadiusX != null && _t.webkitRadiusX > 0){
            _r = _t.webkitRadiusX;
          } else if(typeof _t.force === 'number' && _t.force > 0){
            // Map 0..1 force into the same ~0.2..1.4 scale radiusX uses
            // so downstream normalization treats both signals identically.
            _r = 0.2 + _t.force * 1.2;
          } else if(typeof _t.webkitForce === 'number' && _t.webkitForce > 0){
            _r = 0.2 + Math.min(1, _t.webkitForce / 3) * 1.2;
          } else {
            _r = PRESSURE_BASE;
          }

          // ── Per-tap pan automation ──
          var _tapPanVal=null;
          var _tapRelX=0.5, _tapRelY=0.5;
          var _tapPanVVal=null;
          // Always compute relative tap coordinates within the tile —
          // these are used by both pan automation (gated on PAD_PAN_ON)
          // and quads-mode quadrant detection (gated on
          // window._multiHitQuadsOn).
          if(el.offsetWidth >= 30){
            var _tileRect=el.getBoundingClientRect();
            _tapRelX=Math.max(0,Math.min(1,(_t.clientX-_tileRect.left)/_tileRect.width));
            _tapRelY=Math.max(0,Math.min(1,(_t.clientY-_tileRect.top)/_tileRect.height));
          }
          if(PAD_PAN_ON && el.offsetWidth>=60){
            _tapPanVal=(_tapRelX*2)-1;
            _tapPanVVal=(_tapRelY*2)-1;
          }
          // Mix in the live pan slider's offset. When L·R mode is
          // on, the slider is additive to the tap position (clamped
          // to -1..+1 so extreme slider + extreme tap position stay
          // bounded). When L·R mode is off, the slider alone drives
          // per-note horizontal pan — only applied if non-zero so
          // centered slider keeps the old "no pan" default.
          var _livePan = (typeof window._livePanOffset === 'number') ? window._livePanOffset : 0;
          if(_tapPanVal !== null){
            _tapPanVal = Math.max(-1, Math.min(1, _tapPanVal + _livePan));
          } else if(Math.abs(_livePan) > 0.005){
            _tapPanVal = _livePan;
          }
          window._currentTapPan=_tapPanVal;
          window._currentTapPanV=_tapPanVVal;
          window._currentTapRelX=_tapRelX;
          window._currentTapRelY=_tapRelY;

          // ── EXPR mode: X=volume, Y=pitch ──
          // X: 0(left)=10% vol, 0.5(center)=55% vol, 1(right)=100% vol
          // Y: 0(top)=+5 semitones, 0.5(center)=0, 1(bottom)=-5 semitones
          window._exprVol=null;
          window._exprPitch=null;
          if(PAD_EXPR_ON && el.offsetWidth>=60){
            var _eRect=el.getBoundingClientRect();
            var _eRelX=Math.max(0,Math.min(1,(_t.clientX-_eRect.left)/_eRect.width));
            var _eRelY=Math.max(0,Math.min(1,(_t.clientY-_eRect.top)/_eRect.height));

            // Snap X to grid if enabled
            if(EXPR_SNAP_X && EXPR_GRID_X>1){
              _eRelX=Math.round(_eRelX*EXPR_GRID_X)/EXPR_GRID_X;
              _eRelX=Math.max(0,Math.min(1,_eRelX));
            }
            // Snap Y to grid if enabled
            if(EXPR_SNAP_Y && EXPR_GRID_Y>1){
              _eRelY=Math.round(_eRelY*EXPR_GRID_Y)/EXPR_GRID_Y;
              _eRelY=Math.max(0,Math.min(1,_eRelY));
            }

            // Volume: 1% at left edge, 150% at right edge
            window._exprVol=0.01 + _eRelX*1.49;
            // Pitch: +RANGE at top, -RANGE at bottom (semitones)
            var _pr=EXPR_PITCH_RANGE||5;
            window._exprPitch=_pr - _eRelY*(_pr*2);
            window._currentTapRelX=_eRelX;
            window._currentTapRelY=_eRelY;
          }
          // Weighted jitter: 50% actual, 25% each for ±jitter amount
          // Adds organic feel and smooths choppy jumps; amount is user-configurable.
          var _jAmt=window._pressureJitter||0;
          if(_jAmt>0){
            var _jRoll=Math.random();
            if(_jRoll<0.25)      _r=_r-_jAmt;
            else if(_jRoll<0.50) _r=_r+_jAmt;
            // else keep _r as-is (50% chance)
          }
          _r=Math.max(0.1,_r); // floor at 0.1
          // Normalize raw radius to 0..1 using the REALISTIC touchscreen
          // range 0.1..1.2. Most Android devices (including the S23)
          // cap radiusX around 1.2 even on very firm thumb-squishes —
          // the older 0.1..1.6 mapping made it physically impossible
          // to reach _pRaw=1.0, so the sensitivity multiplier always
          // topped out well below its theoretical max. With 1.2 as
          // the effective max, a hard tap now actually hits the top
          // of the curve.
          var _p=Math.max(0,Math.min(1,(_r-0.1)/1.1));
          // Smoothing: pull this tap's pressure toward the previous tap's pressure.
          // At 0 smoothing → no effect. At ~0.95 → big change is heavily damped.
          var _sm=window._pressureSmoothing||0;
          if(_sm>0 && window._lastTapPressure!==null){
            _p=_p*(1-_sm) + window._lastTapPressure*_sm;
          }
          window._lastTapPressure=_p;
          // v8.89: tap-sensitivity mode branch.
          //
          // In 'diameter' mode (legacy): use _p as computed from
          //   touch radius/force, fire doSound immediately.
          //
          // In 'accel' mode: kick off an ~80ms accel-peak capture
          //   from the moment of touchstart, then fire doSound with
          //   the resulting 0..1 vol. The 80ms wait pushes the audio
          //   start back by that amount — noticeable but acceptable
          //   for the velocity-sensitive feel it enables. PAIRED
          //   mode arrives in 2b.
          var _mode = (window._accelSettings && window._accelSettings.mode) || 'diameter';
          if(_mode === 'accel' && window._accelCaptureTapPeak){
            // Map _t.clientX/Y as the tap position for compensation.
            window._accelCaptureTapPeak(_t.clientX, _t.clientY).then(function(res){
              // Convert 0..1 vol into the same scale doSound expects:
              // doSound takes a "pressure" 0..1 where higher = louder.
              // res.vol IS that scale already. Pass through.
              doSound(res.vol);
            });
          } else {
            doSound(_p);
          }
        } else {
          // [v1.34] SEL branch — a board cell is selected and the user
          // is tapping a yellow-glowing bank tile to fill it. The
          // touchstart-based spin/particles for the no-SEL path is
          // skipped above; do an abridged version here so the user
          // gets immediate visual feedback. Click handler will then
          // call place() which re-renders the bank, killing the spin
          // mid-animation but leaving particles flying (they live in a
          // global pool that survives bank rebuilds).
          // [v2.46] When drag-tiles is OFF, skip this entire instant-
          // place branch and let the click handler (with v2.45's
          // tap-track gate) handle placement after a proper short tap.
          // v2.44 plus v2.45 wired up the click-handler tap detection,
          // but THIS branch was placing on touchstart directly,
          // bypassing it entirely — which is why tiles were still
          // placing instantly on touchdown despite the click gate.
          if(!window._dragTilesEnabled){
            // Do nothing here — touchend will eventually fire a click
            // event, and the click handler will check tap-track state
            // and call place() only if the tap qualifies.
          } else if(!PZ.bank[idx].used){
            try{
              if(typeof el._spawn === 'function') el._spawn(el);
              // [v1.36] See click handler below for the ghost-border +
              // yellow→cyan blend rationale. Same pattern.
              // [v3.70] Base duration dropped 850→500ms for snappier
              // tap-feedback. Ghost-border creation suppressed; the
              // dashed cyan anchor outline at the original position
              // wasn't carrying its weight visually. Block kept in
              // place as a comment so it can be revived cleanly.
              var _selSdm=(typeof window._spinDurMult==='number'&&window._spinDurMult>0)?window._spinDurMult:1.0;
              var _selSpinDur=Math.max(80,Math.round(500*_selSdm));
              var _selRect = el.getBoundingClientRect();
              /* [v3.70] Ghost suppressed — see header comment.
              var _selGhost = document.createElement('div');
              _selGhost.className = 'bt-ghost';
              _selGhost.style.left = _selRect.left + 'px';
              _selGhost.style.top = _selRect.top + 'px';
              _selGhost.style.width = _selRect.width + 'px';
              _selGhost.style.height = _selRect.height + 'px';
              _selGhost.style.setProperty('--spin-dur', _selSpinDur+'ms');
              document.body.appendChild(_selGhost);
              setTimeout(function(){
                if(_selGhost.parentNode) _selGhost.parentNode.removeChild(_selGhost);
              }, _selSpinDur + 40);
              */
              // [v3.72/v3.82] Hide just the source tile under the clone.
              // Using visibility:hidden preserves layout (so the bank
              // doesn't reflow) while killing the tile's border, inner
              // glow, and number — exactly what sits in z behind the
              // spinning clone, nothing more.
              //
              // [v3.82] The bug that killed v3.72–v3.81 for cyan/xN
              // multi-instance tiles: in condensed display modes the
              // rendered tile carries data-bank-idx=firstUnused (e.g.
              // 10 when value=4 has 5 instances at indices 10..14).
              // After place(10), bank[10].used=true, the new "first
              // unused" for value=4 is 11, and the rebuilt tile in
              // the bank gets data-bank-idx=11. The CLONE in <body>,
              // made via cloneNode(true), still has data-bank-idx=10.
              // A document-wide query `.bt[data-bank-idx="10"]` then
              // matched the CLONE — and we set visibility:hidden on
              // it, killing the spin entirely. Plain (non-condensed)
              // modes were unaffected because each bank slot has its
              // own permanent index that the new tile inherits.
              //
              // Fix: (a) strip data-bank-idx from the clone so no
              // such query can ever match it, and (b) scope the
              // post-place and cleanup queries to inside #bank.
              // [v3.83] Find-rebuilt-tile helper. In condensed modes
              // (### / xN / mini) the rebuilt tile carries a DIFFERENT
              // data-bank-idx than the source after place() — because
              // the rendered tile uses firstUnused as its bank index,
              // and firstUnused shifts when the previous first one
              // gets marked used. data-collapsed-value, by contrast,
              // is value-stable: same before and after place().
              //
              // So for condensed-mode tiles we look up the rebuilt
              // tile by its value (which is the same group). For
              // plain mode (no data-collapsed-value) we fall back to
              // data-bank-idx, which IS stable there because each
              // slot has its own permanent index.
              //
              // This fixes the v3.82 leftover: in v3.82 the post-place
              // hide query failed for condensed modes (returned null),
              // so the rebuilt tile sat fully visible underneath the
              // spinning clone.
              el.style.visibility='hidden';
              var _selBankIdx = idx;
              var _selBankEl = document.getElementById('bank');
              var _selSrcCollapsedVal = (el.dataset && el.dataset.collapsedValue)
                || null;
              function _selFindRebuilt(){
                if(!_selBankEl) return null;
                if(_selSrcCollapsedVal){
                  return _selBankEl.querySelector(
                    '.bt[data-collapsed-value="' + _selSrcCollapsedVal + '"]'
                  );
                }
                return _selBankEl.querySelector(
                  '.bt[data-bank-idx="' + _selBankIdx + '"]'
                );
              }
              var _selClone = el.cloneNode(true);
              // [v3.82] Defang the clone — strip dataset attrs that
              // could be matched by any later querySelector.
              _selClone.removeAttribute('data-bank-idx');
              _selClone.removeAttribute('data-snd-idx');
              _selClone.style.border = '';
              _selClone.style.boxShadow = '';
              _selClone.style.position = 'fixed';
              _selClone.style.left = _selRect.left + 'px';
              _selClone.style.top = _selRect.top + 'px';
              _selClone.style.width = _selRect.width + 'px';
              _selClone.style.height = _selRect.height + 'px';
              _selClone.style.margin = '0';
              _selClone.style.zIndex = '9999';
              _selClone.style.pointerEvents = 'none';
              _selClone.style.setProperty('--spin-dur', _selSpinDur+'ms');
              // Defensive reset of inline transform/transition that
              // may have come over with the cloned cssText.
              _selClone.style.transform = '';
              _selClone.style.transition = 'none';
              _selClone.style.willChange = 'transform,border-color,box-shadow';
              // Belt-and-suspenders visibility:visible since we just
              // hid the source the clone was copied from.
              _selClone.style.visibility='visible';
              document.body.appendChild(_selClone);
              void _selClone.offsetWidth;
              // Inline animation — same as the .placing-blend class
              // rule, but inline so nothing in the cascade can lose.
              _selClone.style.animation =
                'bt-spin ' + _selSpinDur + 'ms cubic-bezier(0.4,0.0,0.2,1.0) forwards, ' +
                'bt-place-blend ' + _selSpinDur + 'ms ease-in-out forwards';
              setTimeout(function(){
                if(_selClone.parentNode) _selClone.parentNode.removeChild(_selClone);
                var _slot = _selFindRebuilt();
                if(_slot){
                  // Soft un-hide: brief opacity fade-in so the dim
                  // .used state doesn't pop in abruptly.
                  _slot.style.visibility='';
                  _slot.style.transition='opacity 0.18s ease-out';
                  _slot.style.opacity='0';
                  void _slot.offsetWidth;
                  _slot.style.opacity='';
                  setTimeout(function(){
                    if(_slot && _slot.parentNode){
                      _slot.style.transition='';
                    }
                  }, 220);
                }
              }, _selSpinDur + 40);
              window._mxSelTouchHandledAt = performance.now();
              place(idx);
              // [v3.83] Hide the post-place rebuilt tile so the user
              // doesn't see it sitting underneath the spinning clone.
              // _selFindRebuilt() handles the condensed-mode case
              // where data-bank-idx has shifted.
              var _selNewSlot = _selFindRebuilt();
              if(_selNewSlot) _selNewSlot.style.visibility='hidden';
            }catch(_){}
          }
        }
      },{passive:true});
      el.addEventListener('touchend',function(e){
        // Only react if our tracked finger is among the ending touches
        if(_holdTouchId!==null && e.changedTouches){
          var _found=false;
          for(var _i=0;_i<e.changedTouches.length;_i++){
            if(e.changedTouches[_i].identifier===_holdTouchId){ _found=true; break; }
          }
          if(!_found) return;
        }
        if(_holdTimer){ clearTimeout(_holdTimer); _holdTimer=null; }
        // Hold mode: release the voice for this pad when the finger lifts.
        // 20ms fade prevents click/pop from instant cutoff. The on-tap
        // branch shares the same release path — both modes use a held
        // voice tracked in _heldVoices, so _releaseHeldVoice handles
        // either. We split the conditional for clarity in case future
        // visuals need to differ between the two.
        if(_holdTaggedPads[idx]){
          _releaseHeldVoice(sndIdx, false);
          // Manually clear the persistent pressed glow (no auto-cleanup timeout
          // was scheduled for hold-tagged pads).
          el.classList.remove('pressed','active-flash');
          el.style.background='';
          el.style.removeProperty('--tap-glow');
          el.style.removeProperty('--tap-glow-soft');
          if(window._clearPadGlow) window._clearPadGlow(el);
          else el.style.boxShadow='';
          applyTileColor(el, idx);
        } else if(_holdOnTapPads[idx]){
          // On-tap release — same audio fade-out as standard hold mode.
          // Visual cleanup is lighter because on-tap pads don't grow the
          // progressive border overlay (that's reserved for hold-tagged
          // pads). Still clear any pressed-glow class state so the tile
          // doesn't stay lit after release.
          _releaseHeldVoice(sndIdx, false);
          el.classList.remove('pressed','active-flash');
          el.style.background='';
          el.style.removeProperty('--tap-glow');
          el.style.removeProperty('--tap-glow-soft');
          if(window._clearPadGlow) window._clearPadGlow(el);
          else el.style.boxShadow='';
          applyTileColor(el, idx);
        } else if(_holdOnBeatPads[idx]){
          // On-beat release — same path as on-tap. The mode only
          // differs at start time (snap-to-onset offset resolution);
          // release-time cleanup is identical.
          _releaseHeldVoice(sndIdx, false);
          el.classList.remove('pressed','active-flash');
          el.style.background='';
          el.style.removeProperty('--tap-glow');
          el.style.removeProperty('--tap-glow-soft');
          if(window._clearPadGlow) window._clearPadGlow(el);
          else el.style.boxShadow='';
          applyTileColor(el, idx);
        }
        // Don't clear styles here — active-flash class handles visual state
        // Only clear if not currently flashing AND not in beat-edit mode.
        // In beat-edit mode, tapping a pad adds it to the selected beat
        // and applyBeatEditHighlights paints the red _beat-on state on
        // touchstart — without this guard, touchend would wipe that fill
        // (background, color) and the red only appears after the NEXT tap
        // because the tile still gets cleared this tap around.
        if(!_holdFired && !el.classList.contains('active-flash') && !el.classList.contains('_beat-on')){
          el.style.background=''; el.style.color=''; applyTileColor(el,idx);
        }
        _holdFired=false;
        _holdTouchId=null;
      },{passive:true});
      // Touchcancel — OS interrupted the touch (incoming call, etc). Also
      // release any held voice so samples don't keep looping forever.
      el.addEventListener('touchcancel',function(e){
        // Only react if our tracked finger is among the canceling touches
        if(_holdTouchId!==null && e.changedTouches){
          var _found2=false;
          for(var _i2=0;_i2<e.changedTouches.length;_i2++){
            if(e.changedTouches[_i2].identifier===_holdTouchId){ _found2=true; break; }
          }
          if(!_found2) return;
        }
        if(_holdTimer){ clearTimeout(_holdTimer); _holdTimer=null; }
        if(_holdTaggedPads[idx]){
          _releaseHeldVoice(sndIdx, false);
          // Clear the persistent pressed glow same as touchend
          el.classList.remove('pressed','active-flash');
          el.style.background='';
          el.style.removeProperty('--tap-glow');
          el.style.removeProperty('--tap-glow-soft');
          if(window._clearPadGlow) window._clearPadGlow(el);
          else el.style.boxShadow='';
          applyTileColor(el, idx);
        } else if(_holdOnTapPads[idx]){
          // On-tap release on cancel — mirror the touchend cleanup so
          // an OS-interrupted touch doesn't leave a sustained voice
          // playing forever.
          _releaseHeldVoice(sndIdx, false);
          el.classList.remove('pressed','active-flash');
          el.style.background='';
          el.style.removeProperty('--tap-glow');
          el.style.removeProperty('--tap-glow-soft');
          if(window._clearPadGlow) window._clearPadGlow(el);
          else el.style.boxShadow='';
          applyTileColor(el, idx);
        } else if(_holdOnBeatPads[idx]){
          // On-beat release on cancel — same path as on-tap.
          _releaseHeldVoice(sndIdx, false);
          el.classList.remove('pressed','active-flash');
          el.style.background='';
          el.style.removeProperty('--tap-glow');
          el.style.removeProperty('--tap-glow-soft');
          if(window._clearPadGlow) window._clearPadGlow(el);
          else el.style.boxShadow='';
          applyTileColor(el, idx);
        }
        _holdFired=false;
        _holdTouchId=null;
      },{passive:true});
      el.addEventListener('touchmove',function(e){
        // Only cancel hold for the finger that started on this tile — filter
        // changedTouches by the identifier we recorded at touchstart. Without
        // this, a second finger landing on a different pad would be compared
        // to THIS tile's start position, produce a large distance, and wipe
        // the tile's pressed/flash state (including hold-tagged glow).
        if(_holdTouchId===null) return;
        for(var _mi=0;_mi<e.changedTouches.length;_mi++){
          var _mt=e.changedTouches[_mi];
          if(_mt.identifier !== _holdTouchId) continue;
          var dx=_mt.clientX-_holdStartX;
          var dy=_mt.clientY-_holdStartY;
          if(Math.sqrt(dx*dx+dy*dy)>12){
            if(_holdTimer){ clearTimeout(_holdTimer); _holdTimer=null; }
            // Remove flash classes and restore tile's proper color
            el.classList.remove('pressed','active-flash','spinning');
            el.style.background=''; el.style.color='';
            el.style.removeProperty('--tap-glow');
            el.style.removeProperty('--tap-glow-soft');
            applyTileColor(el,idx);
            break;
          }
        }
      },{passive:true});
      // click — fallback for mouse and cases where touchstart didn't prevent default
      el.addEventListener('click',function(e){
        // Pad edit mode — on desktop the touchstart intercept doesn't fire,
        // so the click handler needs its own consume. No-op on touch since
        // _padEditMode was already cleared by the touchstart intercept.
        if(window._padEditModeConsume && window._padEditModeConsume(idx)){
          e.stopPropagation();
          return;
        }
        // BPM-detect mode — same desktop-click fallback
        if(window._bpmDetectConsume && window._bpmDetectConsume(idx)){
          e.stopPropagation();
          return;
        }
        // v10.05 — blank-kit empty-pad tap → open sample editor
        // with LOAD SAMPLE panel pre-expanded. Same desktop fallback.
        if(window._blankKitEmptyTapConsume && window._blankKitEmptyTapConsume(idx)){
          e.stopPropagation();
          return;
        }
        // Erase mode: toggle selection
        if(window._eraseIsActive && window._eraseIsActive()){
          window._eraseToggleBank(idx);
          return;
        }
        // DEL mode — desktop-click fallback for destroying a pad.
        if(window._padDelModeActive && window._padDelModeActive()){
          if(window._padDelTap){
            // HTML data-* attributes are kebab-case; dataset.bankIdx
            // maps to data-bank-idx on the element. Using the wrong
            // case (data-bankIdx) returns null and the fallback
            // captured the last `tile` from renderBank's loop, so
            // shards always spawned on the lower-right pad.
            var _tileEl = document.querySelector('.bt[data-bank-idx="'+idx+'"]') || tile;
            window._padDelTap(idx, _tileEl);
          }
          return;
        }
        // If no cell selected — play sound (works on used tiles too for sequencer)
        if(!SEL){
          // touchstart already handled this on touch devices
          return;
        }
        // [v2.45] When drag-tiles is disabled, the click event fires
        // for ANY touch (even brief touches) — including ones the
        // user intended as scroll. Check the tap-track state set up
        // by the bank's touchstart/touchmove/touchend chain. If the
        // touch was held too long or moved too far, suppress flag
        // is set and we bail out instead of placing.
        if(!window._dragTilesEnabled){
          var tt = window._equilTapTrack;
          if(tt && tt.suppress){
            window._equilTapTrack = null;
            return;
          }
          // Consume the tap-track regardless so the next touch
          // starts fresh.
          window._equilTapTrack = null;
        }
        // In beat edit mode, used tiles can still be toggled
        // [v2.47] Use document query instead of stale loop-captured tile.
        var _bEditTile = document.querySelector('.bt[data-bank-idx="'+idx+'"]') || tile;
        if(window._beatEditToggleTile&&window._beatEditToggleTile(parseInt(_bEditTile.dataset.sndIdx)||idx)) return;
        // Used tiles do nothing for puzzle placement
        if(PZ.bank[idx].used) return;
        // [v1.35] If the touchstart-SEL branch already handled this tap
        // (within the last 600ms), skip the click handler so we don't
        // double-place or double-spin. Click fires after touchend on
        // mobile; on desktop there's no touchstart so this gate is
        // never hit.
        if(window._mxSelTouchHandledAt
           && (performance.now() - window._mxSelTouchHandledAt) < 600){
          window._mxSelTouchHandledAt = 0;
          return;
        }
        // [v1.34] Trigger spin + particles on the tile being placed.
        // This is the SEL-active path (a board cell is selected and the
        // user is tapping a yellow-glowing tile to fill it). The
        // touchstart-based spin/sound code skips this path entirely so
        // we have to do it here ourselves. place() will call render()
        // which destroys this tile element a few ms later, cutting the
        // spin animation short — that's fine because the particles
        // spawn into the global particle pool which persists across
        // the re-render, so they fly out from the tap location even
        // after the bank has been rebuilt.
        // [v1.35] Spin + particles on placement, matching the no-SEL
        // tap behavior with SPIN_ON. Challenge: place() calls render()
        // which rebuilds the bank, destroying the tile element a few
        // ms later. Solution: clone the tile, position the clone
        // absolutely on top of the original, attach to body, then
        // animate the CLONE while the original gets destroyed by
        // render(). The clone removes itself after the spin completes.
        // Particles still spawn from the original location and live in
        // the global particle pool which survives the rebuild.
        // [v2.47] Resolve the actual tile element by idx instead of
        // using the IIFE-captured `tile` reference. Pre-v2.46, this
        // block almost never ran on mobile because the touchstart-
        // SEL path placed first and the gate at line ~8288 short-
        // circuited the click handler. v2.46 disables the touchstart
        // path when drag-tiles is OFF, which makes THIS block run for
        // every place — exposing a latent bug where `tile` was a
        // stale closure capture referring to the LAST tile from the
        // renderBank loop (lower-right). Result: every place spun
        // the lower-right tile no matter which one was tapped.
        // Fix: query the DOM by data-bank-idx (same pattern used by
        // the DEL-mode fallback above for the same reason).
        var _realTile = document.querySelector('.bt[data-bank-idx="'+idx+'"]') || tile;
        try{
          if(typeof _realTile._spawn === 'function') _realTile._spawn(_realTile);
          // [v3.70] Base duration dropped 850→500ms for snappier
          // tap-feedback. Ghost-border creation suppressed; block
          // kept in place as a comment so it can be revived cleanly.
          var _clkSdm=(typeof window._spinDurMult==='number'&&window._spinDurMult>0)?window._spinDurMult:1.0;
          var _clkSpinDur=Math.max(80,Math.round(500*_clkSdm));
          var _origRect = _realTile.getBoundingClientRect();
          /* [v3.70] Ghost suppressed — see header comment.
          // [v1.36] Ghost border — static dashed outline at original
          // position, fades out over the spin duration. Helps the eye
          // anchor on the tap location while the clone spins above.
          var _ghost = document.createElement('div');
          _ghost.className = 'bt-ghost';
          _ghost.style.left = _origRect.left + 'px';
          _ghost.style.top = _origRect.top + 'px';
          _ghost.style.width = _origRect.width + 'px';
          _ghost.style.height = _origRect.height + 'px';
          _ghost.style.setProperty('--spin-dur', _clkSpinDur+'ms');
          document.body.appendChild(_ghost);
          setTimeout(function(){
            if(_ghost.parentNode) _ghost.parentNode.removeChild(_ghost);
          }, _clkSpinDur + 40);
          */
          // [v3.72/v3.82/v3.83] Surgical hide — see v3.83 comment at
          // the SEL touchstart site for the full rationale, including
          // the data-bank-idx mismatch bug AND the v3.83 fix that uses
          // data-collapsed-value when the source was a condensed tile.
          _realTile.style.visibility='hidden';
          var _clkBankIdx = idx;
          var _clkBankEl = document.getElementById('bank');
          var _clkSrcCollapsedVal = (_realTile.dataset && _realTile.dataset.collapsedValue)
            || null;
          function _clkFindRebuilt(){
            if(!_clkBankEl) return null;
            if(_clkSrcCollapsedVal){
              return _clkBankEl.querySelector(
                '.bt[data-collapsed-value="' + _clkSrcCollapsedVal + '"]'
              );
            }
            return _clkBankEl.querySelector(
              '.bt[data-bank-idx="' + _clkBankIdx + '"]'
            );
          }
          // [v1.36] Spinning clone — keep .lit so the yellow glow is
          // the START of the blend animation.
          var _spinClone = _realTile.cloneNode(true);
          // [v3.82] Strip dataset attrs so document-wide queries can
          // never match the clone (which lives in <body>, not #bank).
          _spinClone.removeAttribute('data-bank-idx');
          _spinClone.removeAttribute('data-snd-idx');
          // Clear inline styles set by applyTileColor that would
          // override the keyframe animation's border-color values.
          _spinClone.style.border = '';
          _spinClone.style.boxShadow = '';
          _spinClone.style.position = 'fixed';
          _spinClone.style.left = _origRect.left + 'px';
          _spinClone.style.top = _origRect.top + 'px';
          _spinClone.style.width = _origRect.width + 'px';
          _spinClone.style.height = _origRect.height + 'px';
          _spinClone.style.margin = '0';
          _spinClone.style.zIndex = '9999';
          _spinClone.style.pointerEvents = 'none';
          _spinClone.style.setProperty('--spin-dur', _clkSpinDur+'ms');
          // Defensive reset of inline transform/transition.
          _spinClone.style.transform = '';
          _spinClone.style.transition = 'none';
          _spinClone.style.willChange = 'transform,border-color,box-shadow';
          _spinClone.style.visibility='visible';
          document.body.appendChild(_spinClone);
          void _spinClone.offsetWidth;
          // Inline animation declaration — same shorthand as the
          // .placing-blend class rule.
          _spinClone.style.animation =
            'bt-spin ' + _clkSpinDur + 'ms cubic-bezier(0.4,0.0,0.2,1.0) forwards, ' +
            'bt-place-blend ' + _clkSpinDur + 'ms ease-in-out forwards';
          setTimeout(function(){
            if(_spinClone.parentNode) _spinClone.parentNode.removeChild(_spinClone);
            var _slot = _clkFindRebuilt();
            if(_slot){
              // Soft un-hide with brief opacity fade-in.
              _slot.style.visibility='';
              _slot.style.transition='opacity 0.18s ease-out';
              _slot.style.opacity='0';
              void _slot.offsetWidth;
              _slot.style.opacity='';
              setTimeout(function(){
                if(_slot && _slot.parentNode){
                  _slot.style.transition='';
                }
              }, 220);
            }
          }, _clkSpinDur + 40);
        }catch(_){}
        place(idx);
        // [v3.83] Hide the post-place rebuilt tile (condensed-aware).
        var _clkNewSlot = (typeof _clkFindRebuilt === 'function')
          ? _clkFindRebuilt()
          : null;
        if(_clkNewSlot) _clkNewSlot.style.visibility='hidden';
      });
    })(renderIdx,renderIdx,tile);
    // Store spawnParticles reference on the tile so swipe handler can call it
    
    // Dot indicator: black=stock edited, red=recorded
    if(userSamples[renderIdx]||((sampleMeta[renderIdx])&&sampleMeta[renderIdx]._isStock)){
      tile.style.position='relative';
      var mic=document.createElement('span');
      mic.className='bt-mic';
      mic.style.background=(sampleMeta[renderIdx]&&sampleMeta[renderIdx]._isStock)?'rgba(0,217,255,0.4)':'#c400ff';
      tile.appendChild(mic);
    }
    applyTileColor(tile, renderIdx);
    be.appendChild(tile);
  }
  // [v2.33] Undo button removed from UI; guard the lookup so the
  // null doesn't throw.
  // [v4.07] Button is back. Disable when HIST is empty (nothing to
  // undo) OR when the puzzle is won (undo locks after victory per
  // design — the puzzle is sealed, no take-backs).
  var _undoBtn = document.getElementById('undo');
  if(_undoBtn){
    var _wonNow = !!(window._mc113 && window._mc113.isWon && window._mc113.isWon());
    _undoBtn.disabled = (HIST.length === 0) || _wonNow;
  }
  // Apply pad name labels (and refresh mic icons) now that tiles are fresh
  if(window._updateSampleIcons) window._updateSampleIcons();
  if(window._updateExprGrid) window._updateExprGrid();
  if(window._updateHideNums) window._updateHideNums();
  // Re-apply the multi-hit quads grid overlay if quads is on, since
  // tile rebuild wipes child elements.
  if(window._refreshQuadOverlays) window._refreshQuadOverlays();
  // [v4.75] Restore page scroll captured at the top of renderBank.
  if(window.scrollY !== _bankScrollY){
    window.scrollTo(0, _bankScrollY);
  }
}

// ═══════════════════════════════════════════════════════════
// MINI-MODE ANIMATIONS (v8.97)
// ═══════════════════════════════════════════════════════════
//
// When the user places a tile in MINI mode, we play a row-by-row
// "queue shift" animation: each row's leftmost mini fades out and
// slides left, all other minis in the row shift left by one slot,
// and (for non-last rows) a new mini fades in at the rightmost
// slot. The last row just loses one cell. The eye reads this as
// a continuous queue cascading toward the front, even though no
// single mini actually travels diagonally.
//
// On undo (count goes up), we use a simpler visual: the genuinely
// new mini at the END of the new grid fades in. The other minis
// stay put. This matches the natural "queue grows at the end"
// mental model.
//
// Both animations only run when the column / row count of the
// mini-grid stays constant between old and new states. If the
// packing algorithm picks a different cols×rows layout, we just
// snap (the renderer's instant DOM update is what the user sees).
//
// Animation duration is short (~250ms) — these will run frequently
// as the user places tiles and shouldn't impede flow.
window._animateMiniDelta = function(value, oldUnused, newUnused){
  if(!window._miniPuzzleTiles || window._seqVisible) return;
  if(oldUnused === newUnused) return;
  if(oldUnused < 1 || newUnused < 0) return;

  // Find the tile in the bank for this value.
  var bank = document.getElementById('bank');
  if(!bank) return;
  var tiles = bank.querySelectorAll('.bt[data-collapsed-value]');
  var tile = null;
  for(var i = 0; i < tiles.length; i++){
    if(tiles[i].dataset.collapsedValue === String(value)){
      tile = tiles[i];
      break;
    }
  }
  if(!tile) return;

  // Mini count = unused - 1 (the white number represents one of them).
  var oldMiniCount = Math.max(0, oldUnused - 1);
  var newMiniCount = Math.max(0, newUnused - 1);
  if(oldMiniCount === newMiniCount) return;

  // Recompute layout params using the same helper the renderer uses.
  var tileSize = tile.getBoundingClientRect().width;
  if(tileSize < 4) return;
  // Pull tileFontSize from the inline style we set at render time.
  var fsMatch = (tile.style.fontSize || '').match(/(\d+(\.\d+)?)/);
  var tileFontSize = fsMatch ? parseFloat(fsMatch[1]) : 16;
  var topPad = Math.max(2, Math.round(tileSize*0.06));
  var bottomPad = Math.max(1, Math.round(tileSize * 0.04));
  var whiteZone = topPad + tileFontSize + 2;

  var DUR = 500; // ms

  if(newMiniCount < oldMiniCount){
    // ── PLACE ANIMATION (count went down by 1) ──
    _animateMiniPlace(tile, value, oldMiniCount, newMiniCount,
      tileSize, tileFontSize, whiteZone, bottomPad, DUR);
  } else {
    // ── UNDO ANIMATION (count went up by 1) ──
    _animateMiniUndo(tile, value, oldMiniCount, newMiniCount,
      tileSize, tileFontSize, whiteZone, bottomPad, DUR);
  }
};

function _animateMiniPlace(tile, value, oldCount, newCount,
                           tileSize, tileFontSize, whiteZone, bottomPad, DUR){
  // Bail unless cols/rows match between old and new layouts.
  var oldGrid = window._computeMiniGrid(oldCount, tileSize, tileFontSize, whiteZone, bottomPad);
  var newGrid = window._computeMiniGrid(newCount, tileSize, tileFontSize, whiteZone, bottomPad);
  if(oldGrid.cols !== newGrid.cols) return;
  if(oldGrid.rows !== newGrid.rows) return;

  var miniWrap = tile.querySelector('._btMiniGrid');
  if(!miniWrap) return;
  // Wrap dimensions and layout constants
  var wrapRect = miniWrap.getBoundingClientRect();
  if(wrapRect.width < 2 || wrapRect.height < 2) return;
  var cols = newGrid.cols;
  var rows = newGrid.rows;
  // Each grid cell width includes the 1px gap. CSS grid uses 1fr columns
  // and 1fr rows now (v8.97 update), so cellW = (areaW - (cols-1)*1) / cols
  // and cellH = (areaH - (rows-1)*1) / rows.
  var areaW = wrapRect.width;
  var areaH = wrapRect.height;
  var cellW = (areaW - (cols-1)*1) / cols;
  var cellH = (areaH - (rows-1)*1) / rows;
  // The new minis already exist in DOM (rendered by renderBank).
  // Indices 0..newCount-1 in reading order.
  var newMinis = miniWrap.querySelectorAll('._btMiniNum');
  if(newMinis.length !== newCount) return;
  // The mini font + style we'll reuse for ghosts.
  var miniFontPx = newGrid.fontPx;
  var miniStyle = 'text-align:center;font-size:' + miniFontPx
    + 'px;color:#0093aa;font-weight:600;line-height:1;'
    + 'overflow:hidden;white-space:nowrap;';
  // Helper: build a ghost mini at an absolute position inside the wrap.
  function makeGhost(left, top){
    var g = document.createElement('span');
    g.className = '_btMiniGhost';
    g.textContent = value;
    g.style.cssText = miniStyle
      + 'position:absolute;'
      + 'left:' + left + 'px;'
      + 'top:' + top + 'px;'
      + 'width:' + cellW + 'px;'
      + 'height:' + cellH + 'px;'
      + 'pointer-events:none;'
      + 'will-change:transform,opacity;';
    return g;
  }
  // To overlay ghosts on top of the grid, switch the wrap to relative
  // positioning context (it's already absolute-positioned to the tile).
  // Children of the grid use grid layout — ghosts use position:absolute
  // INSIDE this same wrap, which works because grid children with
  // position:absolute are taken out of the grid flow.
  miniWrap.style.position = 'absolute';

  // ── Shift-left animation for new minis ──
  // Each new mini at (r, c) corresponds to old (r, c+1). Delta is one
  // cell width to the right. So the new mini starts translated +cellW
  // (back at its old position) and animates to 0.
  for(var idx = 0; idx < newMinis.length; idx++){
    var el = newMinis[idx];
    el.style.transition = 'none';
    el.style.transform = 'translateX(' + cellW + 'px)';
    el.style.willChange = 'transform';
  }
  // Force layout flush so the initial transform is committed before we
  // queue the transition. Reading offsetWidth is the cheapest way.
  void miniWrap.offsetWidth;
  // ── Ghost fade-outs at OLD leftmost positions (one per old row) ──
  // These fade opacity 1→0 and slide left by cellW.
  var ghostsOut = [];
  for(var r = 0; r < oldGrid.rows; r++){
    var top = r * cellH;
    var ghost = makeGhost(0, top);
    ghost.style.opacity = '1';
    ghost.style.transform = 'translateX(0)';
    miniWrap.appendChild(ghost);
    ghostsOut.push(ghost);
  }
  // ── Fade-in elements at NEW rightmost of non-last rows ──
  // The new minis at (r, cols-1) for r in [0, rows-1) start at opacity 0.
  // (They're already styled by the loop above to translate; we just add
  // an opacity start of 0.)
  // The last row of the new grid may have fewer than cols cells, so we
  // detect non-last-row fade-ins by index.
  var fadeInTargets = [];
  for(var r2 = 0; r2 < rows - 1; r2++){
    var newIdx = r2 * cols + (cols - 1);
    if(newIdx < newMinis.length){
      var el2 = newMinis[newIdx];
      el2.style.opacity = '0';
      fadeInTargets.push(el2);
    }
  }
  void miniWrap.offsetWidth;
  // ── Trigger the animations on the next frame ──
  requestAnimationFrame(function(){
    requestAnimationFrame(function(){
      var trans = 'transform ' + DUR + 'ms cubic-bezier(.2,.7,.3,1), opacity ' + DUR + 'ms ease-out';
      for(var j = 0; j < newMinis.length; j++){
        newMinis[j].style.transition = trans;
        newMinis[j].style.transform = '';
      }
      for(var j2 = 0; j2 < fadeInTargets.length; j2++){
        fadeInTargets[j2].style.opacity = '1';
      }
      for(var k = 0; k < ghostsOut.length; k++){
        ghostsOut[k].style.transition = trans;
        ghostsOut[k].style.opacity = '0';
        ghostsOut[k].style.transform = 'translateX(' + (-cellW) + 'px)';
      }
      // Cleanup after animation completes.
      setTimeout(function(){
        for(var c1 = 0; c1 < ghostsOut.length; c1++){
          if(ghostsOut[c1].parentNode) ghostsOut[c1].parentNode.removeChild(ghostsOut[c1]);
        }
        for(var c2 = 0; c2 < newMinis.length; c2++){
          newMinis[c2].style.transition = '';
          newMinis[c2].style.transform = '';
          newMinis[c2].style.willChange = '';
        }
      }, DUR + 60);
    });
  });
}

function _animateMiniUndo(tile, value, oldCount, newCount,
                          tileSize, tileFontSize, whiteZone, bottomPad, DUR){
  // Simple visual: the new mini at the END of the grid fades in.
  // Other minis stay put.
  var miniWrap = tile.querySelector('._btMiniGrid');
  if(!miniWrap) return;
  var newMinis = miniWrap.querySelectorAll('._btMiniNum');
  if(newMinis.length !== newCount) return;
  if(newCount === 0) return;
  var lastNew = newMinis[newCount - 1];
  lastNew.style.transition = 'none';
  lastNew.style.opacity = '0';
  void miniWrap.offsetWidth;
  requestAnimationFrame(function(){
    requestAnimationFrame(function(){
      lastNew.style.transition = 'opacity ' + DUR + 'ms ease-out';
      lastNew.style.opacity = '1';
      setTimeout(function(){
        lastNew.style.transition = '';
      }, DUR + 60);
    });
  });
}

// Re-render bank tile mic icons after sample load
window._padLabelsOn=false; // toggled by ABC button in toolbar
window._padWavesOn=false;  // toggled by WAV button in toolbar

// Draw a sample's waveform onto a canvas covering the pad tile. Uses the
// classic "filled" waveform look — for each pixel column, finds the min/max
// sample value in that range and draws a vertical line between them, giving
// the familiar DAW filled-in shape. When `progress` is provided (0..1), the
// columns to the left of progress*width are drawn in a brighter "lit" color
// AND a solid color fill slides in behind them, giving the played region a
// filled-panel look with the bright waveform riding on top.
function _drawPadWaveform(canvas, buffer, strokeCol, progress, litCol, lwMult){
  if(!canvas||!buffer) return;
  var dpr=window.devicePixelRatio||1;
  var cssW=canvas.clientWidth||canvas.offsetWidth||40;
  var cssH=canvas.clientHeight||canvas.offsetHeight||40;
  if(canvas.width!==Math.round(cssW*dpr)) canvas.width=Math.round(cssW*dpr);
  if(canvas.height!==Math.round(cssH*dpr)) canvas.height=Math.round(cssH*dpr);
  var w=canvas.width, h=canvas.height;
  var ctx=canvas.getContext('2d');
  ctx.clearRect(0,0,w,h);
  var data=buffer.getChannelData(0);
  var step=Math.max(1, Math.floor(data.length/w));
  var mid=h/2;
  var lw=Math.max(1, dpr) * (typeof lwMult === 'number' ? lwMult : 1);
  var hasProgress = (typeof progress === 'number') && progress >= 0 && litCol;
  var playheadX = hasProgress ? Math.max(0, Math.min(w, progress*w)) : 0;

  // Layer 1: sliding solid fill behind the played portion. Uses the lit
  // color at reduced alpha so the waveform stroke still reads as brighter
  // when it's drawn on top. Only rendered when a progress value is active.
  if(hasProgress && playheadX > 0){
    ctx.save();
    // Convert the lit color string to an rgba at lower alpha for the fill
    var fillCol = litCol;
    // litCol looks like 'rgba(160,240,255,1)' — we want to reduce the final alpha.
    var m = /^rgba?\(([^)]+)\)/.exec(litCol);
    if(m){
      var parts = m[1].split(',').map(function(s){return s.trim();});
      if(parts.length>=3){
        fillCol = 'rgba('+parts[0]+','+parts[1]+','+parts[2]+',0.55)';
      }
    }
    ctx.fillStyle = fillCol;
    ctx.fillRect(0, 0, Math.floor(playheadX), h);
    ctx.restore();
  }

  // Layer 2: dim stroke for the unplayed (or full) portion
  ctx.strokeStyle=strokeCol;
  ctx.lineWidth=lw;
  ctx.beginPath();
  var startX = hasProgress ? Math.floor(playheadX) : 0;
  for(var x=startX;x<w;x++){
    var mn=1, mx=-1;
    var s=x*step, e=Math.min(s+step, data.length);
    for(var i=s;i<e;i++){
      var v=data[i];
      if(v<mn) mn=v;
      if(v>mx) mx=v;
    }
    var yMin=mid - mx*mid;
    var yMax=mid - mn*mid;
    ctx.moveTo(x+0.5, yMin);
    ctx.lineTo(x+0.5, yMax);
  }
  ctx.stroke();

  // Layer 3: bright stroke for the played portion (if progress set). Drawn
  // ON TOP of the fill layer so it reads as the brightest element.
  if(hasProgress){
    ctx.strokeStyle=litCol;
    ctx.lineWidth=lw + 0.5; // slightly thicker so it pops against the fill
    ctx.beginPath();
    for(var x2=0;x2<playheadX;x2++){
      var mn2=1, mx2=-1;
      var s2=x2*step, e2=Math.min(s2+step, data.length);
      for(var i2=s2;i2<e2;i2++){
        var v2=data[i2];
        if(v2<mn2) mn2=v2;
        if(v2>mx2) mx2=v2;
      }
      var yMin2=mid - mx2*mid;
      var yMax2=mid - mn2*mid;
      ctx.moveTo(x2+0.5, yMin2);
      ctx.lineTo(x2+0.5, yMax2);
    }
    ctx.stroke();
  }
}

// [Equil 1.10] Removed: waveform playhead animation + border animation (sequencer-only).
// The puzzle's bank tiles never have .bt-wave canvases (those only get added in
// sequencer mode), so applyTileColor's `if(cv){...}` branch never runs in puzzle.
// Stubs kept just in case any defensive bare-name reference is hit:
var _padWavePlays = {};
window._padWavePlays = _padWavePlays;
function _padWaveLitColor(){ return 'rgba(200,250,255,1)'; }
function _drawPadWaveform(){ /* no-op */ }
function _flashPadWaveform(){ /* no-op */ }
window._flashPadWaveform = _flashPadWaveform;
function _ensureBorderAnim(){ /* no-op */ }
function _updateBorderAnimProgress(){ /* no-op */ }
function _removeBorderAnim(){ /* no-op */ }
function render(){
  if(!PZ)return;
  // [v4.75] Preserve page scroll across the whole render. render() does
  // grid.innerHTML='' then rebuilds the cells; on tall puzzles (Jumbo/
  // Large) where the PAGE scrolls, the grid momentarily collapses to
  // zero height, the browser clamps the page scroll to the smaller max
  // (snapping to the top), and the position isn't restored when the
  // height returns. EVERY action that re-renders hits this: tapping a
  // cell, placing a bank tile, undo, the bank-display toggle buttons.
  // Capturing scrollY here and restoring it at the end of render covers
  // all of them in one place. The rebuild is synchronous, so by the end
  // of render the grid height is back and the restore lands correctly.
  // _renderScrollY is read again at the bottom of this function.
  var _renderScrollY = window.scrollY;
  var cols=PZ.cols,rows=PZ.rows,CM=PZ.CM,tmpl=PZ.tmpl;
  var CS=getCellSize(cols);
  var FS=Math.max(10,Math.min(16,Math.round(CS*0.46)));
  var RR=Math.max(2,Math.round(CS*0.18))+'px';

  // [v4.48] Theme color palette. When light mode is on, swap the
  // hardcoded neon colors in inline styles for deeper light-mode
  // equivalents. Light-mode versions are darker/more saturated so
  // they read on the cream bg. Each entry takes a key like 'cyan22'
  // (22 alpha % of cyan) and returns the appropriate rgba string.
  //
  // Pure colors (#hex like '#6bcfff') map by lookup. The palette is
  // built once per render() call which is cheap.
  var _light = (window._lightModeOn === true);
  function _c(darkRgba, lightRgba){ return _light ? lightRgba : darkRgba; }
  // Common-use palette. Order: dark form first, light form second.
  var _P = {
    // CYAN family (RGB 0,217,255 dark → 14,116,144 light)
    cyan05: _c('rgba(0,217,255,0.05)',  'rgba(14,116,144,0.08)'),
    cyan06: _c('rgba(0,217,255,0.06)',  'rgba(14,116,144,0.10)'),
    cyan10: _c('rgba(0,217,255,0.10)',  'rgba(14,116,144,0.14)'),
    cyan12: _c('rgba(0,217,255,0.12)',  'rgba(14,116,144,0.18)'),
    cyan18: _c('rgba(0,217,255,0.18)',  'rgba(14,116,144,0.22)'),
    cyan20: _c('rgba(0,217,255,0.20)',  'rgba(14,116,144,0.25)'),
    cyan22: _c('rgba(0,217,255,0.22)',  'rgba(14,116,144,0.28)'),
    cyanBordLow:  _c('rgba(0,217,255,0.25)', 'rgba(14,116,144,0.55)'),
    cyanBordHi:   _c('rgba(0,217,255,0.6)',  'rgba(14,116,144,0.8)'),
    cyanText:     _c('#00d9ff',              '#0e7490'),
    cyanTextDim:  _c('rgba(0,217,255,0.3)',  'rgba(14,116,144,0.55)'),
    cyanTextSoft: _c('#6bcfff',              '#0e7490'),
    cyanTextOp:   _c('rgba(107,207,255,0.3)','rgba(14,116,144,0.5)'),
    cyanGivenDim: _c('rgba(0,217,255,0.35)', 'rgba(14,116,144,0.55)'),
    // PURPLE/MAGENTA family
    purple25:  _c('rgba(157,78,221,0.25)',   'rgba(109,40,217,0.30)'),
    purple10:  _c('rgba(168,85,247,0.10)',   'rgba(124,58,237,0.18)'),
    purple35:  _c('rgba(168,85,247,0.35)',   'rgba(124,58,237,0.45)'),
    purple50:  _c('rgba(168,85,247,0.5)',    'rgba(124,58,237,0.45)'),
    purple85:  _c('rgba(168,85,247,0.85)',   'rgba(124,58,237,0.9)'),
    purpleText: _c('#a855f7',                '#7c3aed'),
    purpleTextSoft: _c('#c084fc',            '#7c3aed'),
    // GREEN family (placed / solved). Light-mode deepens to hunter
    // green so the "your answer was right" feedback reads as
    // confident-darker rather than the neon green that on cream
    // bg reads as light/washed out.
    green06:  _c('rgba(74,222,128,0.06)',    'rgba(22,101,52,0.12)'),
    green20:  _c('rgba(74,222,128,0.20)',    'rgba(22,101,52,0.30)'),
    green25:  _c('rgba(74,222,128,0.25)',    'rgba(22,101,52,0.35)'),
    greenText: _c('#4ade80',                 '#166534'),
    greenTextDim: _c('rgba(74,222,128,0.35)','rgba(22,101,52,0.55)'),
    // RED family (mistakes / bad)
    red20:    _c('rgba(248,113,113,0.20)',   'rgba(185,28,28,0.28)'),
    redText:  _c('#ff6b6b',                  '#b91c1c'),
    // NEUTRAL / TEXT
    givenBg:     _c('rgba(255,255,255,0.10)','rgba(42,36,24,0.10)'),
    givenBgHi:   _c('rgba(255,255,255,0.18)','rgba(42,36,24,0.16)'),
    givenColor:  _c('#d8d8d8',               '#2a2418'),
    givenColorHi:_c('#ffffff',               '#2a2418'),
    blankText:   _c('#e8e8e8',               '#2a2418')
  };

  // Find all currently-complete equations
  var nowComplete={};
  for(var i=0;i<tmpl.length;i++){
    if(valEq(tmpl[i],CM,PZ.OPS)==='ok')nowComplete[tmpl[i].id]=true;
  }

  // Find which equations are NEWLY complete (not in PZ.doneEqs before)
  if(!PZ.doneEqs)PZ.doneEqs={};
  var newlyDone=[];
  for(var id in nowComplete){
    if(!PZ.doneEqs[id]){
      // Find the equation object
      for(var i=0;i<tmpl.length;i++){
        if(tmpl[i].id===id){newlyDone.push(tmpl[i]);break;}
      }
    }
  }
  // Update the done set — also remove any that became un-done (undo case)
  PZ.doneEqs=nowComplete;

  // Build animCells for the pop animation (all cells of all complete equations)
  var animCells={};
  for(var id in nowComplete){
    for(var i=0;i<tmpl.length;i++){
      if(tmpl[i].id===id){
        var s=tmpl[i].xl?seqXL(tmpl[i].dir,tmpl[i].c,tmpl[i].r):seq(tmpl[i].dir,tmpl[i].c,tmpl[i].r);
        for(var j=0;j<s.length;j++)animCells[nk(s[j])]=true;
        break;
      }
    }
  }

  // Build dimCells — cells that are in solved equations AND not part of any unsolved equation
  // These can be fully dimmed since they're no longer "active" puzzle cells
  var unsolveCells={};
  for(var i=0;i<tmpl.length;i++){
    if(!nowComplete[tmpl[i].id]){
      var s=tmpl[i].xl?seqXL(tmpl[i].dir,tmpl[i].c,tmpl[i].r):seq(tmpl[i].dir,tmpl[i].c,tmpl[i].r);
      for(var j=0;j<s.length;j++) unsolveCells[nk(s[j])]=true;
    }
  }
  var dimCells={};
  for(var k in animCells){
    if(!unsolveCells[k]) dimCells[k]=true;
  }
  // Build stagger lists for newly-done equations — include ALL cells in sequence order
  var staggerGroups=[];
  var newlyCells={}; // cells belonging to newly-completing equations — render pre-solved, stagger does the color
  for(var ei=0;ei<newlyDone.length;ei++){
    var e=newlyDone[ei];
    var s=e.xl?seqXL(e.dir,e.c,e.r):seq(e.dir,e.c,e.r);
    var group=[];
    for(var j=0;j<s.length;j++){
      var k=nk(s[j]);
      if(CM[k]){group.push(k);newlyCells[k]=true;}
    }
    if(group.length>0)staggerGroups.push(group);
  }

  var HI={};
  if(SEL){
    var scell=CM[SEL];
    if(scell)for(var i=0;i<scell.eqs.length;i++){
      var e=null;for(var j=0;j<tmpl.length;j++)if(tmpl[j].id===scell.eqs[i]){e=tmpl[j];break;}
      if(e){var s=e.xl?seqXL(e.dir,e.c,e.r):seq(e.dir,e.c,e.r);for(var j=0;j<s.length;j++)HI[nk(s[j])]=true;}
    }
  }

  var grid=document.getElementById('grid');
  // [v3.94] Grid background now transparent (was var(--bk)). The
  // 1px gaps between cells used to fill with --bk and visually
  // matched the cells, hiding any pace-box lines underneath. With
  // transparent, the gaps reveal whatever paints below — pace
  // boxes (when present) or .gscroll's --bg otherwise (which
  // looks essentially the same as --bk except where pace boxes
  // cross through). Cells stay opaque so they cover pace boxes
  // in cell pixels — only the inter-cell gaps and the area
  // outside the grid show the boxes.
  // [v4.31] FOUND IT. The perimeter line that persisted through
  // v4.24-v4.30 diagnostic was coming from this JS-set inline border.
  // The CSS rule .grid{border:none} added in v4.24 was being overridden
  // every grid render by this cssText assignment. Removed the border
  // segment from the cssText below; cells still have their own borders
  // (defining cell boundaries) but the outer grid frame is gone.
  grid.style.cssText='display:inline-grid;grid-template-columns:repeat('+cols+','+CS+'px);grid-template-rows:repeat('+rows+','+CS+'px);gap:1px;background:transparent;';
  // Size the clip container exactly to the grid's natural pixel size so overflow:hidden clips correctly
  var clipEl=document.getElementById('gridClip');
  if(clipEl){
    // [v4.33] gridW/gridH formula simplified. Was:
    //   gridW=cols*CS+(cols-1)+2+6
    //   where +2 = 1px border on each side of .grid
    //         +6 = subpixel rendering headroom
    // v4.31 removed .grid's border, so the +2 became excess width
    // — the grid-clip became 2px wider than the actual cells, leaving
    // empty space on right/bottom that the lattice and pace rings
    // happily filled. Cells sat flush at top-left of grid-clip, so the
    // overflow was visible on right/bottom only (asymmetric — matching
    // Sam's report of "pace lines off the cells a little to the right"
    // and "lattice extends past cells").
    //
    // New: gridW=cols*CS+(cols-1). No extra headroom either — modern
    // browsers handle subpixel rendering fine without it now that the
    // border isn't there to interact with cell box-shadows. If clipping
    // issues return, can re-add +2 px of headroom and re-center the grid.
    // [v4.41] Add a small GUTTER between the grid edge and grid-clip's
    // outer edge. Pace rings sit at the grid-clip outer edge, so this
    // gutter pushes the rings OUT from the cells — they "kiss" the
    // outer edge of the cells from outside instead of overlapping
    // them. .grid-clip is given flex display below so the grid centers
    // inside the larger clip box.
    var GUTTER = 8;  // px on each side
    var gridW=cols*CS+(cols-1);
    var gridH=rows*CS+(rows-1);
    clipEl.style.width =(gridW + 2*GUTTER)+'px';
    clipEl.style.height=(gridH + 2*GUTTER)+'px';
    // [v4.41] Flex-center the grid inside the now-larger clip.
    clipEl.style.display='flex';
    clipEl.style.alignItems='center';
    clipEl.style.justifyContent='center';
  }
  // [v4.02] Drive the grid-lattice CSS background-size at the cell
  // stride (CS px + 1px gap = one cell-to-cell period). Also nudge
  // the background-position by half a stride so the lines fall ON
  // the grid cell boundaries, not in the middle of cells. The +1px
  // grid border on .grid means cells start 1px in; lines aligned to
  // that. Lattice element fills .grid-clip which is the grid pixel
  // bounds + 6px headroom from above; that headroom can shift the
  // pattern by a fractional cell, so we position it from top-left
  // anchored to where the grid's top-left lives inside grid-clip.
  var latticeEl=document.getElementById('gridLattice');
  if(latticeEl){
    var stride=(CS+1)+'px';
    latticeEl.style.backgroundSize=stride+' '+stride;
    // [v4.32] backgroundPosition '0px 0px' since cells start at 0
    // within their container.
    latticeEl.style.backgroundPosition='0px 0px';
    // [v4.41] Lattice is now positioned to fill only the grid area
    // within grid-clip (not the gutter), via inline left/top/width/
    // height. Without this, the lattice pattern starts at grid-clip
    // origin, GUTTER pixels left of where cells begin — pattern would
    // be misaligned and lattice lines would extend into the gutter.
    var _gutter = 8;  // must match GUTTER above
    latticeEl.style.left   = _gutter + 'px';
    latticeEl.style.top    = _gutter + 'px';
    latticeEl.style.right  = _gutter + 'px';
    latticeEl.style.bottom = _gutter + 'px';
  }
  if(window._reapplyGridZoom)_reapplyGridZoom();
  grid.innerHTML='';

  for(var r=0;r<rows;r++){
    for(var c=0;c<cols;c++){
      var k=c+','+r,cell=CM[k];
      var gc=document.createElement('div');
      // [v1.41 / v3.95] Cell wrapper. Used to unconditionally carry
      // an opaque --bk background to block the .grid::before cyan
      // vignette from bleeding through inner translucent cell
      // backgrounds. v3.94 extracted the vignette out of .grid
      // entirely, eliminating that bleed-through risk.
      //
      // In v3.95 we drop the wrapper bg for EMPTY cells (no entry
      // in CM) so the pace boxes can show through empty grid
      // regions — those were forming a "feathered dark grid"
      // pattern that hid the boxes in the puzzle's negative space.
      //
      // For FILLED cells we still need the wrapper bg because
      // their inner content paints at translucent rgba colors
      // (operators at 0.22, equation cells at 0.25, given numbers
      // at 0.18, etc.) — those need to composite over a solid
      // dark backdrop, not over pace boxes underneath, or every
      // colored cell pill would show pace box lines bleeding
      // through it.
      //
      // Placed blanks (cell.isBlank with a value) keep their
      // transparent wrapper since their content (just a colored
      // number) is text-only — the number reads fine against
      // pace boxes behind it, no need to block them.
      // [v3.97] Empty cells get NO wrapper background. Combined with
      // the v3.96 removal of z-index:1 on .grid, empty grid regions
      // should now reveal pace boxes underneath cleanly. Filled cells
      // (op / eq / given) still need an opaque wrapper because their
      // inner content paints at translucent rgba so the pill would
      // otherwise pick up pace box lines bleeding through.
      // [v4.44] Wrapper background restored for op/eq/given cells.
      // v4.37 removed it (Sam misread the dark wrapper square as
      // "black border on cells"). Without it, the inner rounded pill
      // floats inside the cell slot with empty space at corners and
      // edges — which read as visual misalignment with the lattice
      // and felt "empty" during gameplay. Restoring the var(--bk)
      // wrapper gives each cell a visible square slot the size of
      // CS×CS that aligns with the lattice gridlines; the rounded
      // pill sits inside that slot as a colored chip.
      var wrapBg = '';
      if(cell && (cell.role==='op' || cell.role==='eq' || cell.isGiven)){
        wrapBg = 'background:var(--bk);';
      }
      gc.style.cssText='position:relative;width:'+CS+'px;height:'+CS+'px;'+wrapBg;
      if(!cell){grid.appendChild(gc);continue;}
      var d=document.createElement('div');
      d.style.cssText='position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:'+FS+'px;font-family:IBM Plex Mono,monospace;';
      var hi=!!HI[k];
      var doAnim=!!animCells[k];
      var isNewly=!!newlyCells[k]; // part of a newly-completing eq — stagger will color it, not us
      // Mark div with cell key for post-render stagger targeting
      d.dataset.cellKey=k;

      var isDim=!!dimCells[k]; // solved and not crossing any unsolved equation
      if(cell.role==='op'){
        // Bigger inset (smaller box), square corners
        var opInset=Math.max(1,Math.round(CS*0.08))+'px';
        var opSolved=doAnim&&!isNewly;
        // [v4.37] Tint layered over var(--bk) opaque base so the pace
        // rings (z-index:-1 in .gscroll) don't show through the pill.
        // Was: 'background:rgba(...)' which is translucent.
        // [v4.40] Base alpha lowered from 1.0 (var(--bk) = #151515) to
        // 0.7 (rgba(21,21,21,0.7)) so rings/fuse show through subtly.
        // Per Sam: "make the cells like .7 opacity maybe." Same change
        // applies to eq, given, and blank cell backgrounds below.
        if(opSolved||isDim) d.style.cssText='position:absolute;inset:'+opInset+';display:flex;align-items:center;justify-content:center;font-weight:700;font-size:'+Math.round(FS*0.88)+'px;font-family:IBM Plex Mono,monospace;border-radius:2px;background:linear-gradient('+_P.cyan05+','+_P.cyan05+'),var(--bk);color:'+_P.cyanTextOp+';';
        else d.style.cssText='position:absolute;inset:'+opInset+';display:flex;align-items:center;justify-content:center;font-weight:700;font-size:'+Math.round(FS*0.88)+'px;font-family:IBM Plex Mono,monospace;border-radius:2px;background:linear-gradient('+_P.cyan22+','+_P.cyan22+'),var(--bk);color:'+_P.cyanTextSoft+';';
        d.textContent=cell.display||'+';
      } else if(cell.role==='eq'){
        var eqInset=Math.max(1,Math.round(CS*0.08))+'px';
        var eqSolved=doAnim&&!isNewly;
        // [v4.37] Same layering pattern as op — see note above.
        if(eqSolved||isDim) d.style.cssText='position:absolute;inset:'+eqInset+';display:flex;align-items:center;justify-content:center;font-weight:700;font-size:'+Math.round(FS*0.88)+'px;font-family:IBM Plex Mono,monospace;border-radius:2px;background:linear-gradient('+_P.cyan05+','+_P.cyan05+'),var(--bk);color:'+_P.cyanTextDim+';';
        else d.style.cssText='position:absolute;inset:'+eqInset+';display:flex;align-items:center;justify-content:center;font-weight:700;font-size:'+Math.round(FS*0.88)+'px;font-family:IBM Plex Mono,monospace;border-radius:2px;background:linear-gradient('+_P.purple25+','+_P.purple25+'),var(--bk);color:'+_P.purpleTextSoft+';';
        d.textContent='=';
      } else if(cell.isGiven){
        var isSolved=doAnim&&!isNewly;
        var givenDim=isDim&&!hi&&SEL!==k;
        // [v4.46] High-contrast mode: brighter default bg and pure
        // white text so given numbers pop against the dark wrapper.
        // [v4.48] Theme-aware via _P map.
        var _hc = (window._highContrastOn === true);
        var _givenDefBg = _hc ? _P.givenBgHi : _P.givenBg;
        var _givenDefCol = _hc ? _P.givenColorHi : _P.givenColor;
        var givenBg=givenDim?_P.cyan06:isSolved?_P.cyan18:(hi?_P.cyan20:_givenDefBg);
        var givenCol=givenDim?_P.cyanGivenDim:isSolved?_P.cyanText:(hi?_P.cyanText:_givenDefCol);
        // [v4.37] Layered over var(--bk) so rings don't show through.
        d.style.cssText+='background:linear-gradient('+givenBg+','+givenBg+'),var(--bk);color:'+givenCol+';border-radius:'+RR+';';
        d.textContent=cell.answer;
      } else if(cell.isBlank){
        var st=cstat(k,PZ);
        var bg=hi?_P.cyan12:'transparent',col=hi?_P.blankText:_P.blankText;
        if(SEL===k){bg=_P.purple35;col=_P.purpleText;d.style.zIndex='3';d.style.boxShadow='0 0 6px '+_P.purple50+';';}
        var isSolvedBlank=doAnim&&!isNewly;
        var blankDim=isDim&&SEL!==k;
        // [v3.52] Pulse class for dimmed-green placed tiles — gentle
        // brightness breath as an affordance hint that they can be
        // tapped to return home. Cleared on every render so it only
        // applies when the dim-green condition is currently true.
        // [v3.53] Honors three OPTIONS-panel settings:
        //   _pulseEnabled: boolean — false skips the class entirely
        //     so the tile renders with the static dim-green state.
        //   _pulsePeak: number — peak alpha for the brightness; the
        //     keyframes themselves are rewritten by _writePulseKeyframes
        //     when this changes, so render() doesn't need to use it
        //     directly.
        //   _pulseSync: boolean — when true, all tiles share phase 0
        //     and pulse in unison. When false, each tile uses a stable
        //     hash-derived phase so they're staggered.
        d.classList.remove('ok-breath');
        d.style.animationDelay='';
        if(blankDim&&(isSolvedBlank||st==='ok')){
          bg=_P.green06;col=_P.greenTextDim;
          if(window._pulseEnabled!==false){
            d.classList.add('ok-breath');
            if(window._pulseSync){
              d.style.animationDelay='0s';
            } else {
              var keyHash=0;
              for(var _ki=0;_ki<k.length;_ki++)keyHash=(keyHash*31+k.charCodeAt(_ki))|0;
              // [v3.54] Phase is a fraction of the live animation
              // duration. Hash → 0..1, then × duration → 0..dur sec.
              // Without this scaling, fast-pulse settings would put
              // tiles way past one full cycle out of phase.
              var _dur=(typeof window._pulseSpeed==='number'&&window._pulseSpeed>0)?window._pulseSpeed:3.6;
              var phaseFrac=(Math.abs(keyHash)%1000)/1000;
              var phase=phaseFrac*_dur;
              d.style.animationDelay='-'+phase.toFixed(2)+'s';
            }
          }
        }
        else if(isSolvedBlank){bg=_P.green25;col=_P.greenText;}
        else if(st==='ok'){bg=_P.green20;col=_P.greenText;}
        else if(st==='bad'){bg=_P.red20;col=_P.redText;d.style.animation='shk .25s ease';}
        else if(cell.value!=null&&SEL!==k){bg=_P.purple10;col=_P.purpleText;}
        var _bord;
        if(isSolvedBlank||st==='ok'||blankDim) _bord='';
        else if(SEL===k) _bord='border:1px solid '+_P.purple85+';';
        else {
          // [v4.46] High-contrast mode bumps blank-cell border alpha
          // so the cell rectangle reads clearly above the lattice.
          // [v4.48] Theme-aware via _P map.
          _bord='border:1px solid '+(window._highContrastOn === true ? _P.cyanBordHi : _P.cyanBordLow)+';';
        }
        // [v4.37] Restored cyan border on default blank cells per Sam.
        // The "black borders" he wanted removed are on non-blank tiles
        // (numbers/operators) — see the non-blank branch below.
        // [v2.48] touch-action:manipulation tells the browser this
        // element handles taps (and pinch-zoom) but is NOT involved
        // in pan gestures. Without this, blank cells inherit
        // touch-action:pan-y from .gscroll, which makes Firefox
        // particularly aggressive about canceling the click event
        // when the finger reports any tiny movement on touchdown
        // (finger "squish" producing 1-2px jitter is enough).
        // Chromium-based browsers tolerate this; Firefox doesn't.
        // Result on Firefox before this fix: cells felt like they
        // had pinhead-sized hitboxes because most taps got
        // reclassified as pan attempts and the click never fired.
        // [v4.35] Layer background over an opaque var(--bg) base so
        // that rgba/transparent cell backgrounds don't let the pace
        // rings (z-index:-1 under .gscroll) show through cell pixels.
        // Per Sam: blank cells should mask the rings; rings should
        // only be visible through the gaps between cells.
        // [v4.36] FIX: previous version used `background:`+bg+', var(--bg)'
        // which is invalid CSS — background shorthand can only take
        // ONE color, and additional comma-separated values are
        // interpreted as additional background images (not colors).
        // Browser silently ignored the second value, so rings still
        // showed through. Wrapped the rgba tint in linear-gradient()
        // to make it a background IMAGE layer, which composites
        // correctly over var(--bg) as background-color.
        // [v4.40] Bg base alpha lowered from 1.0 to 0.7 (was var(--bg)
        // which is #0f0f0f opaque; now var(--bg)). Per Sam:
        // "make the cells like .7 opacity maybe". Goal is for the
        // rings + fuse glow underneath to be subtly visible through
        // cells so they're easier to track. Text/borders unaffected
        // because only the background alpha changes.
        var bgLayer = (bg === 'transparent')
          ? 'var(--bg)'
          : 'linear-gradient('+bg+','+bg+'), var(--bg)';
        d.style.cssText+='background:'+bgLayer+';color:'+col+';cursor:pointer;border-radius:'+RR+';touch-action:manipulation;'+_bord;
        if(cell.value!=null){
          d.textContent=cell.value;
          if(!isSolvedBlank&&st!=='ok'&&st!=='bad'){
            d.style.color='#a855f7';
            d.style.fontSize=Math.round(FS*0.92)+'px';
          }
        }
        (function(key){d.addEventListener('click',function(){selCell(key);});})(k);
      }
      gc.appendChild(d);grid.appendChild(gc);
    }
  }

  // Post-render: staggered sequence — every cell plays a tone and animates.
  // Green cells turn dark green; non-green cells vibrate instead.
  // Timing: 1.5s for 7 cells = ~215ms per cell.
  if(staggerGroups.length>0){
    // Scale notes for each style (7 pitches, low to high)
    var scaleNotes={
      A:[392,440,494,523,587,659,784],   // G4-G5 smooth sine scale
      B:[262,294,330,349,392,440,494],   // C4-B4 square wave
      C:[440,554,659,784,932,1047,1319], // A4+ alien fifths
      D:[1200,1400,1600,1800,2200,2600,3200], // bird chirp range
      E:[80,100,120,150,180,220,280],    // low industrial thuds
    };
    var notes=scaleNotes[SOUND_STYLE]||scaleNotes.A;

    // Collect all cells across all groups into one flat sequence
    var flatSeq=[];
    for(var gi=0;gi<staggerGroups.length;gi++){
      var group=staggerGroups[gi];
      for(var ci=0;ci<group.length;ci++){
        flatSeq.push({key:group[ci],noteIdx:Math.min(ci,notes.length-1)});
      }
    }

    // Spread 1.5s across all cells (min 120ms, max 215ms per step)
    var stagger=75;

    var delay=0;
    for(var si=0;si<flatSeq.length;si++){
      (function(cellKey,noteFreq,d){
        setTimeout(function(){
          var el=grid.querySelector('[data-cell-key="'+cellKey+'"]');
          if(!el)return;
          var c=CM[cellKey];
          var isGreen=!!animCells[cellKey]; // cell belongs to a complete equation

          // Play a tone for this cell
          playScaleNote(noteFreq);

          // [v4.50] Theme-aware colors for the stagger reveal. Previously
          // hardcoded neon green (74,222,128) — on cream that reads as
          // "really bright flash that calms down" once render() takes
          // over with the deeper palette. Match the steady-state colors
          // here so there's no jarring transition.
          var _light = (window._lightModeOn === true);
          var _gRGB = _light ? '22,101,52' : '74,222,128';
          var _gHex = _light ? '#166534' : '#4ade80';
          var _cRGB = _light ? '14,116,144' : '0,217,255';
          var _cDim = _light ? 'rgba(14,116,144,0.6)' : 'rgba(0,217,255,0.4)';

          if(isGreen){
            if(c&&(c.role==='op'||c.role==='eq')){
              // Operators stay cyan; equals signs go cyan when solved
              if(c.role==='eq'){ el.style.background='rgba('+_cRGB+',0.06)'; el.style.color=_cDim; el.style.borderColor='transparent'; }
              el.style.animation='none';
              void el.offsetWidth;
              el.style.animation='eqpop 0.35s cubic-bezier(.36,2,.6,1)';
            } else if(c&&c.isBlank){
              // Filled-in blank cells turn green. Theme-aware so light
              // mode doesn't flash neon before settling to hunter.
              el.style.background='rgba('+_gRGB+',0.28)';el.style.color=_gHex;
              el.style.fontStyle='normal';
              el.style.boxShadow='0 0 8px rgba('+_gRGB+',0.6)';
              el.style.animation='none';
              void el.offsetWidth;
              el.style.animation='eqpop 0.35s cubic-bezier(.36,2,.6,1)';
            } else {
              // Given numbers just pop — no color change.
              // [v4.51] Theme-aware: light mode uses givenpop-light
              // so the `forwards` fill ends on deep teal, not neon
              // cyan. Without this, given cells in just-solved
              // equations stayed bright cyan on cream until the
              // next render call.
              el.style.animation='none';
              void el.offsetWidth;
              var _gpName = _light ? 'givenpop-light' : 'givenpop';
              el.style.animation=_gpName+' 0.4s cubic-bezier(.36,2,.6,1) forwards';
            }
          } else {
            // Not green — vibrate to acknowledge the tone
            el.style.animation='none';
            void el.offsetWidth;
            el.style.animation='vib 0.35s ease';
          }
        },d);
      })(flatSeq[si].key, notes[flatSeq[si].noteIdx], delay);
      delay+=stagger;
    }
  }

  renderBank();
  // [v4.75] Restore page scroll captured at the top of render. Both
  // grid and bank have been rebuilt at full height by now, so the
  // restore lands at the user's original position. No-op if nothing
  // moved the scroll.
  if(window.scrollY !== _renderScrollY){
    window.scrollTo(0, _renderScrollY);
  }
}
window.render = render;


// ═══════════════════════════════════════════════════════════
// PINCH ZOOM + ONE-FINGER PAN — grid only, everything else stays fixed
// ═══════════════════════════════════════════════════════════
(function(){
  var gscroll=document.querySelector('.gscroll');
  var grid=document.getElementById('grid');
  var gridClip=document.getElementById('gridClip');
  var scale=1, lastScale=1;
  var minScale=1.0, maxScale=4;
  var translateX=0, translateY=0;

  // Pinch state
  var startDist=0, startMid={x:0,y:0};
  var startTransX=0, startTransY=0;
  var isPinching=false;
  // After a pinch ends, block pan until ALL fingers lift
  var pinchJustEnded=false;

  // Pan state (1-finger, only when zoomed)
  var isPanning=false;
  var panStartX=0, panStartY=0;
  var panStartTX=0, panStartTY=0;
  var panMoved=false;
  var PAN_THRESHOLD=8;

  function dist(t){
    var dx=t[0].clientX-t[1].clientX, dy=t[0].clientY-t[1].clientY;
    return Math.sqrt(dx*dx+dy*dy);
  }
  function midpoint(t){
    return {x:(t[0].clientX+t[1].clientX)/2, y:(t[0].clientY+t[1].clientY)/2};
  }
  function clamp(tx,ty,s){
    var W=grid.offsetWidth||1, H=grid.offsetHeight||1;
    var ox=Math.max(0,(W*s-W)/2), oy=Math.max(0,(H*s-H)/2);
    return {x:Math.max(-ox,Math.min(ox,tx)), y:Math.max(-oy,Math.min(oy,ty))};
  }
  function applyTransform(tx,ty,s){
    var c=clamp(tx,ty,s);
    translateX=c.x; translateY=c.y; scale=s;
    grid.style.transformOrigin='center center';
    grid.style.transform=scale===1&&translateX===0&&translateY===0?'':
      'translate('+translateX+'px,'+translateY+'px) scale('+scale+')';
  }

  window._reapplyGridZoom=function(){
    if(scale===1&&translateX===0&&translateY===0) return;
    grid.style.transformOrigin='center center';
    grid.style.transform='translate('+translateX+'px,'+translateY+'px) scale('+scale+')';
  };

  // v8.99 — expose for the floating zoom-pan pill (Pass 2). Lets the
  // pill drive zoom + pan through the same applyTransform() pipeline
  // that pinch-zoom uses, so bounds-clamping and state are shared.
  window._gridZoomApply = applyTransform;
  window._gridZoomGet = function(){
    return {tx:translateX, ty:translateY, s:scale};
  };
  window._gridZoomReset = function(){
    applyTransform(0, 0, 1);
  };

  // ── TOUCH EVENTS ──────────────────────────────────────────
  gscroll.addEventListener('touchstart',function(e){
    if(e.touches.length===2){
      // Two fingers: start pinch, cancel any pan
      isPanning=false; panMoved=false; pinchJustEnded=false;
      isPinching=true;
      startDist=dist(e.touches);
      startMid=midpoint(e.touches);
      lastScale=scale;
      startTransX=translateX;
      startTransY=translateY;
      e.preventDefault();
    } else if(e.touches.length===1&&!pinchJustEnded){
      // One finger: set up potential pan (only activates if zoomed + moves enough)
      isPanning=false; panMoved=false;
      panStartX=e.touches[0].clientX;
      panStartY=e.touches[0].clientY;
      panStartTX=translateX;
      panStartTY=translateY;
    }
  },{passive:false});

  gscroll.addEventListener('touchmove',function(e){
    if(e.touches.length===2&&isPinching){
      e.preventDefault();
      var s=Math.max(minScale,Math.min(maxScale,lastScale*(dist(e.touches)/startDist)));
      var mid=midpoint(e.touches);
      applyTransform(startTransX+(mid.x-startMid.x), startTransY+(mid.y-startMid.y), s);
    } else if(e.touches.length===1&&!isPinching&&!pinchJustEnded){
      var dx=e.touches[0].clientX-panStartX;
      var dy=e.touches[0].clientY-panStartY;
      // Flag any movement past threshold — prevents tap-to-deselect during drag-scroll
      if(!panMoved && Math.sqrt(dx*dx+dy*dy)>PAN_THRESHOLD){
        panMoved=true;
      }
      // Actual pan-transform only activates when zoomed in
      if(scale>1.05){
        if(!isPanning && Math.sqrt(dx*dx+dy*dy)>PAN_THRESHOLD){
          isPanning=true;
        }
        if(isPanning){
          e.preventDefault();
          applyTransform(panStartTX+dx, panStartTY+dy, scale);
        }
      }
    }
  },{passive:false});

  gscroll.addEventListener('touchend',function(e){
    if(e.touches.length===0){
      // All fingers lifted — fully reset interaction state
      isPinching=false; isPanning=false; pinchJustEnded=false;
      setTimeout(function(){panMoved=false;},50);
    } else if(e.touches.length===1&&isPinching){
      // One finger lifted during pinch — block pan until last finger also lifts
      isPinching=false;
      pinchJustEnded=true;
    } else if(e.touches.length<2){
      isPinching=false;
    }
  },{passive:true});

  // Double-tap to reset zoom (only on clean taps, not pans)
  var lastTap=0;
  gscroll.addEventListener('touchend',function(e){
    if(e.touches.length>0) return;
    var now=Date.now();
    if(now-lastTap<300&&!panMoved&&!pinchJustEnded){
      applyTransform(0,0,1);
    }
    lastTap=now;
  },{passive:true});

  // Tap empty puzzle area to deselect
  gscroll.addEventListener('touchend', function(e){
    if(e.touches.length>0||panMoved||pinchJustEnded) return;
    var t=e.changedTouches[0];
    var el=document.elementFromPoint(t.clientX,t.clientY);
    // If tap didn't land on a cell div with a click listener, deselect
    if(el&&!el.closest('[data-cell-key]')&&SEL!==null){
      SEL=null; render();
    }
  },{passive:true});

  // ── EQUATION PULSE ANIMATION ─────────────────────────────────
  // Fires a left-to-right wave across a random equation when tapping pads with nothing selected
  window._pulseRandomEq = function(){
    if(!PZ||!PZ.tmpl||!PZ.tmpl.length) return;
    var grid=document.getElementById('grid');
    if(!grid) return;

    var shuffled=PZ.tmpl.slice().sort(function(){return Math.random()-0.5;});
    var visibleCells=null;
    for(var ti=0;ti<shuffled.length;ti++){
      var eq=shuffled[ti];
      var s=eq.xl?seqXL(eq.dir,eq.c,eq.r):seq(eq.dir,eq.c,eq.r);
      if(!s||!s.length) continue;
      var candidates=[];
      for(var vi=0;vi<s.length;vi++){
        var vk=nk(s[vi]);
        var vd=grid.querySelector('[data-cell-key="'+vk+'"]');
        if(!vd) continue;
        var r=vd.getBoundingClientRect();
        var cx=(r.left+r.right)/2;
        var cy=(r.top+r.bottom)/2;
        if(cx>0 && cx<window.innerWidth && cy>0 && cy<window.innerHeight){
          candidates.push(vk);
        }
      }
      if(candidates.length>=2){ visibleCells=candidates; break; }
    }
    if(!visibleCells||!visibleCells.length) return;
    // Choose cyan or magenta randomly, with slight shade variation
    var isCyan=Math.random()>0.5;
    var hue=isCyan?(Math.random()*20+170):(Math.random()*30+280);
    var sat=Math.round(95+Math.random()*5);
    var lit=Math.round(38+Math.random()*14);
    var stepMs=Math.round(150/visibleCells.length);
    for(var i=0;i<visibleCells.length;i++){
      (function(cellKey,delay){
        setTimeout(function(){
          var d=grid.querySelector('[data-cell-key="'+cellKey+'"]');
          if(!d) return;
          if(!d._waveOrigColor){
            d._waveOrigColor   = d.style.color;
            d._waveOrigShadow  = d.style.textShadow;
            d._waveOrigBg      = d.style.background;
          }
          d._waveCount = (d._waveCount||0) + 1;

          // Per-cell variation: lightness ±16, saturation ±5, alpha 0.35–0.75, glow radius 6–14px
          var cellLit   = Math.max(28, Math.min(58, lit + (Math.random()*32-16)));
          var cellSat   = Math.max(85, Math.min(100, sat + (Math.random()*10-5)));
          var cellAlpha = 0.35 + Math.random()*0.40;
          var glowR1    = Math.round(8  + Math.random()*6);
          var glowR2    = Math.round(14 + Math.random()*8);
          var cellCol  = 'hsl('+hue+','+cellSat+'%,'+cellLit+'%)';
          var cellSoft = 'hsla('+hue+','+cellSat+'%,'+cellLit+'%,'+cellAlpha.toFixed(2)+')';
          d.style.color      = cellCol;
          d.style.textShadow = '0 0 '+glowR1+'px '+cellCol+', 0 0 '+glowR2+'px '+cellCol;
          d.style.background = cellSoft;
          d.style.transition = 'color 0.05s, text-shadow 0.05s, background 0.05s';
          setTimeout(function(){
            d._waveCount = (d._waveCount||1) - 1;
            d.style.transition='color 0.3s, text-shadow 0.3s, background 0.3s';
            // Only restore once the last active wave on this cell finishes
            if(d._waveCount<=0){
              d._waveCount=0;
              d.style.color      = d._waveOrigColor  || '';
              d.style.textShadow = d._waveOrigShadow || '';
              d.style.background = d._waveOrigBg     || '';
              // Clear cached originals so next wave re-snapshots cleanly
              d._waveOrigColor=null; d._waveOrigShadow=null; d._waveOrigBg=null;
              setTimeout(function(){ d.style.transition=''; },300);
            }
          }, stepMs+80);
        }, delay);
      })(visibleCells[i], i*stepMs);
    }
  };
  gscroll.addEventListener('wheel',function(e){
    if(!e.ctrlKey) return; // only handle pinch-zoom (ctrl+wheel), not scroll
    e.preventDefault();
    var factor=e.deltaY<0?1.08:0.93;
    var newScale=Math.max(minScale,Math.min(maxScale,scale*factor));
    // Zoom toward cursor position
    var rect=grid.getBoundingClientRect();
    var cx=e.clientX-rect.left-rect.width/2;
    var cy=e.clientY-rect.top-rect.height/2;
    var tx=translateX-cx*(newScale/scale-1);
    var ty=translateY-cy*(newScale/scale-1);
    applyTransform(tx,ty,newScale);
  },{passive:false});

  window._resetGridZoom=function(){
    scale=1; translateX=0; translateY=0;
    if(grid) grid.style.transform='';
  };
})();

// ═══════════════════════════════════════════════════════════
// SCREEN SWITCHING + EVENTS
// ═══════════════════════════════════════════════════════════
function showGame(opts){
  // [Equil 1.13] When opts.daily is true, the puzzle is generated with
  // a deterministic seed derived from today's date string so every player
  // gets the same daily puzzle.
  // [v3.49] When opts.resume is provided (a loadProgress() payload),
  // the puzzle is restored from the save: no buildPuzzle, no record,
  // no READY overlay. Timer continues from the saved elapsed.
  opts=opts||{};
  var dateStr=window._mc113?window._mc113.todayStr():'';
  var isResume=!!opts.resume;
  if(isResume){
    var saved=opts.resume;
    // Restore size/diff/template from the save so HUD reads correctly.
    if(saved.size)SIZE=saved.size;
    if(saved.diff)DIFF=saved.diff;
    if(saved.tpl)window._currentTplName=saved.tpl;
    PZ=saved.pz;
  } else if(opts.daily && window._mc113){
    // The seed mixes the date with size+diff so different size/difficulty
    // settings still give different daily puzzles, but each (date,size,diff)
    // tuple is consistent across all players that day.
    var seed=window._mc113.hashStr(dateStr+'|'+SIZE+'|'+DIFF);
    // [v3.00] Pass {daily:true} so _pickTemplate uses seeded rp() and
    // skips localStorage history — daily must be deterministic across
    // all players regardless of their personal recent-templates state.
    PZ=window._mc113.withSeed(seed,function(){return buildPuzzle(SIZE,DIFF,0,0,{daily:true});});
  } else {
    PZ=buildPuzzle(SIZE,DIFF);
  }
  SEL=null;HIST=[];
  // [v3.18] DEBUG: update the template label after build.
  _updateDbgTplLabel();
  // [v3.32] Record this puzzle's metrics for running averages.
  // [v3.49] Skip recording on resume — the puzzle was already
  // recorded when it was originally built.
  if(!isResume && window._dbgRecordPuzzle)window._dbgRecordPuzzle();
  // [v3.23] Refresh debug panel stats if open.
  try{
    var pnl=document.getElementById('_dbgPanel');
    if(pnl&&pnl.style.display==='flex'&&window._dbgRenderAll)window._dbgRenderAll();
  }catch(e){}
  if(window._mc113){
    if(isResume){
      // [v3.49] reset({skipClearProgress:true}) so the save isn't
      // wiped before restoreState reads from the in-memory payload.
      window._mc113.reset({skipClearProgress:true});
      window._mc113.restoreState(opts.resume);
    } else {
      // Reset stats AFTER puzzle is built (so timer 0:00 matches first move).
      window._mc113.reset({daily:!!opts.daily, dateStr:opts.daily?dateStr:null});
    }
  }
  document.getElementById('selScreen').style.display='none';
  document.getElementById('gameScreen').style.display='flex';
  // [v3.86] sizeLabel() routing — 'xl2' shows as 'JUMBO' here.
  // Size · Difficulty order matches the menu selection layout
  // (puzzle size row above difficulty row).
  // [v4.63] diffLabel() so 'medium' renders as 'INTERMEDIATE'.
  var infoText=sizeLabel(SIZE)+' · '+diffLabel(DIFF);
  if(opts.daily) infoText='★ DAILY · '+infoText;
  document.getElementById('mastInfo').textContent=infoText;
  document.getElementById('win').classList.remove('show');
  render();
  requestAnimationFrame(function(){
    if(PILL_ON && window._zoomPill) window._zoomPill.show();
  });
  document.body.classList.remove('menu-active');
  // [v3.84] Initialize the ghost-runner bar for this puzzle. Reads
  // the best time for this template (or falls back to size+diff), or
  // hides the bar entirely if no record exists. Skipped in nonchalant.
  if(window._initGhostBar) window._initGhostBar();
  // [v3.90] Pace boxes — concentric rectangles around the grid that
  // shrink toward center over best/avg/worst times. Independent
  // from the ghost-runner bar above; gated by per-box toggles in
  // settings, not by mode (a chalant player can disable all three
  // and a nonchalant player can enable them, though defaults differ).
  // [v4.20] Pace BOXES (inward-marching rectangles) disabled.
  // Function preserved (see _initPaceBoxes definition) but not called.
  // To revive: uncomment this line and hide #paceRings.
  // if(window._initPaceBoxes) window._initPaceBoxes();
  if(window._initPaceRings) window._initPaceRings();
  if(window._initPaceStats) window._initPaceStats();
  // [v4.03] READY overlay/GO button removed from the flow — start
  // the timer immediately on new puzzle. Still skip on resume since
  // the resume path was already a no-op. Overlay machinery
  // (_showReady/_hideReady) intentionally left intact.
  if(!isResume && window._mc113&&window._mc113.startTimer)window._mc113.startTimer();
}

// [v3.84] Ghost-runner bar (chalant-mode only). Sits under the
// masthead and shrinks symmetrically from both edges over the user's
// best time for the current template+size+diff combo, with fallback
// to the broader size+diff best when the template hasn't been solved
// yet. Once elapsed crosses the best time, the bar is replaced by a
// static "Best time: X:XX" label in the same slot.
//
// State lives on window so the _renderTimer hook inside _mc113 can
// reach _updateGhostBar without needing a closure into this scope.
(function(){
  // bestMs: the target time the user is racing. Only set when we
  // have a recorded best for this exact template+size+diff.
  var state = {bestMs: 0, active: false, intense: false, hitBest: false};

  function _fmtTime(ms){
    if(window._mc113 && window._mc113.fmtTime) return window._mc113.fmtTime(ms);
    var s = Math.floor(ms/1000);
    var m = Math.floor(s/60);
    s -= m*60;
    return m + ':' + (s<10?'0':'') + s;
  }

  window._initGhostBar = function(){
    var bar = document.getElementById('mastGhost');
    var fill = document.getElementById('mastGhostFill');
    var label = document.getElementById('mastGhostLabel');
    if(!bar || !fill || !label) return;

    state.active = false;
    state.intense = false;
    state.hitBest = false;
    fill.classList.remove('intense');
    // No transition during reset so we don't see the bar animate back
    // from wherever it ended on the previous puzzle.
    var prevTransition = fill.style.transition;
    fill.style.transition = 'none';
    fill.style.transform = 'scaleX(1)';
    // Force reflow so the next transition fires from this start state.
    void fill.offsetWidth;
    fill.style.transition = prevTransition;
    label.textContent = '\u00a0'; // [v4.35] reset to nbsp placeholder
    label.style.visibility = 'hidden'; // [v4.35] keep space reserved
    bar.style.display = 'none';
    // [v3.87] Default to no body class until we confirm the bar will
    // show. Clearing it here makes sure we don't carry over from a
    // previous puzzle where it was active.
    document.body.classList.remove('has-ghost-bar');

    // Nonchalant: no bar at all, no pressure.
    if(window._equilMode === 'nonchalant') return;

    // Look up the best time. Need _mc113 ready.
    if(!(window._mc113 && window._mc113.getGhostBest)) return;
    // SIZE and DIFF are globals set by the menu; _currentTplName is
    // set by buildPuzzle when it picks a template.
    var size = typeof SIZE !== 'undefined' ? SIZE : null;
    var diff = typeof DIFF !== 'undefined' ? DIFF : null;
    var tpl = window._currentTplName || null;
    if(!size || !diff) return;

    var best = window._mc113.getGhostBest(size, diff, tpl);
    if(!best || !(best.ms > 0)) return;

    state.bestMs = best.ms;
    state.active = true;
    bar.style.display = 'block';
    // [v3.87] Suppress the cyan lines that would otherwise sandwich
    // the bar (#mastStats border-bottom + .gscroll border-top).
    // Selector-driven via body.has-ghost-bar in the stylesheet.
    document.body.classList.add('has-ghost-bar');
  };

  window._updateGhostBar = function(elapsedMs){
    if(!state.active) return;
    var bar = document.getElementById('mastGhost');
    var fill = document.getElementById('mastGhostFill');
    var label = document.getElementById('mastGhostLabel');
    if(!bar || !fill || !label) return;

    if(elapsedMs >= state.bestMs){
      // We've passed the best — collapse the bar to zero and show
      // the static reference label in its place.
      if(!state.hitBest){
        state.hitBest = true;
        fill.style.transform = 'scaleX(0)';
        label.textContent = 'Best time: ' + _fmtTime(state.bestMs);
        // Brief overlap: bar fades to 0 over its transition, then we
        // hide the bar row and reveal the label.
        setTimeout(function(){
          // [v4.35] visibility:hidden instead of display:none so the
          // bar's 3 px row stays in layout. Without this, label below
          // would shift UP by 3 px when bar disappeared.
          bar.style.visibility = 'hidden';
          label.style.visibility = 'visible';
        }, 400);
      }
      return;
    }

    // Remaining ratio: 1.0 at start → 0.0 at best time.
    var rem = 1 - (elapsedMs / state.bestMs);
    if(rem < 0) rem = 0;
    if(rem > 1) rem = 1;
    fill.style.transform = 'scaleX(' + rem + ')';

    // Glow up in the final 25%.
    var shouldIntense = (rem <= 0.25);
    if(shouldIntense !== state.intense){
      state.intense = shouldIntense;
      fill.classList.toggle('intense', shouldIntense);
    }
  };
})();

// [v4.47] Pace stats — three time targets shown near the timer that
// gray out as elapsed time passes them. Replaces the pace rings (now
// off by default per Sam) and complements the ghost bar (hidden but
// machinery intact) as the primary pace-pressure feedback. Numeric
// labels are more accessible than the rings — testers with vision
// concerns can read them directly rather than tracking peripheral
// motion around the grid.
//
// Color coding matches the pace rings for continuity if someone
// revives both:
//   best  → magenta  (#c400ff)
//   avg   → bright cyan (#00ffff)
//   worst → dark cyan (#4a8fa0)
//
// State lives on window so _renderTimer can call _updatePaceStats
// without a scope crossing.
(function(){
  var state = {
    active: false,
    bestMs: 0, avgMs: 0, worstMs: 0,
    showBest: false, showAvg: false, showWorst: false,
    grayedBest: false, grayedAvg: false, grayedWorst: false
  };

  function _fmtTime(ms){
    if(window._mc113 && window._mc113.fmtTime) return window._mc113.fmtTime(ms);
    var s = Math.floor(ms/1000);
    var m = Math.floor(s/60);
    s -= m*60;
    return m + ':' + (s<10?'0':'') + s;
  }

  // Match the count-based gating from _showBoxesForCount in the pace
  // rings IIFE — best needs 1 solve, worst needs 2, avg needs 3.
  function _allowedForCount(count){
    if(count <= 1) return {best: true,  avg: false, worst: false};
    if(count === 2) return {best: true, avg: false, worst: true};
    return {best: true, avg: true, worst: true};
  }

  // Apply "grayed" styling to a stat span — when the user has passed
  // that target. Drops opacity sharply so passed targets recede into
  // the row without disappearing entirely (so the user still has a
  // reference point on what they beat).
  function _setGrayed(el, grayed){
    if(!el) return;
    el.style.opacity = grayed ? '0.25' : '1';
  }

  window._initPaceStats = function(){
    var row = document.getElementById('paceStats');
    if(!row) return;

    state.active = false;
    state.grayedBest = state.grayedAvg = state.grayedWorst = false;
    row.style.display = 'none';

    // Honor the master toggle (added in DEF as paceStats). Default
    // ON. When off, this section behaves like there's nothing to show.
    if(window._paceStatsOn === false) return;

    // [v4.49] Removed the `if(window._equilMode === 'nonchalant') return;`
    // gate that was here from v4.47. It caused pace stats to not show
    // up at all because _equilMode defaults to 'nonchalant' for new
    // installs / first-time loads. Pace rings don't have this gate
    // and Sam's pace rings worked fine. Pace stats now matches: it
    // shows whenever the master toggle is on and there's data to show
    // for the current template. Nonchalant players who want zero pace
    // pressure can toggle "Show pace stats" off in the settings panel.

    if(!(window._mc113 && window._mc113.getGhostStats)) return;
    var size = (typeof SIZE !== 'undefined') ? SIZE : null;
    var diff = (typeof DIFF !== 'undefined') ? DIFF : null;
    var tpl  = window._currentTplName || null;
    if(!size || !diff || !tpl) return;

    var stats = window._mc113.getGhostStats(size, diff, tpl);
    if(!stats) return;

    var allowed = _allowedForCount(stats.count);
    state.showBest  = !!(allowed.best  && stats.best  > 0);
    state.showAvg   = !!(allowed.avg   && stats.avg   > 0);
    state.showWorst = !!(allowed.worst && stats.worst > 0);
    state.bestMs  = stats.best  || 0;
    state.avgMs   = stats.avg   || 0;
    state.worstMs = stats.worst || 0;

    if(!state.showBest && !state.showAvg && !state.showWorst) return;

    // Populate the spans. Hidden stats render as empty so the
    // separators collapse — see separator handling below.
    var bEl = document.getElementById('paceStatBest');
    var aEl = document.getElementById('paceStatAvg');
    var wEl = document.getElementById('paceStatWorst');
    if(bEl) bEl.textContent = state.showBest  ? ('BEST '  + _fmtTime(state.bestMs))  : '';
    if(aEl) aEl.textContent = state.showAvg   ? ('AVG '   + _fmtTime(state.avgMs))   : '';
    if(wEl) wEl.textContent = state.showWorst ? ('WORST ' + _fmtTime(state.worstMs)) : '';
    // Reset opacities.
    _setGrayed(bEl, false);
    _setGrayed(aEl, false);
    _setGrayed(wEl, false);

    // Hide separators that flank empty stats so we don't get stray
    // "·" dots leading or trailing the row.
    var sepAB = document.getElementById('paceStatSepAB');
    var sepBC = document.getElementById('paceStatSepBC');
    if(sepAB) sepAB.style.display = (state.showBest && state.showAvg) ? '' : 'none';
    if(sepBC) sepBC.style.display = ((state.showBest || state.showAvg) && state.showWorst) ? '' : 'none';

    state.active = true;
    row.style.display = 'block';
  };

  window._updatePaceStats = function(elapsedMs){
    if(!state.active) return;
    // Gray out each label when elapsed passes its target. The labels
    // are sorted by speed: best is fastest, then avg, then worst.
    // Once you pass best, that's the first to gray; etc.
    if(state.showBest && !state.grayedBest && elapsedMs >= state.bestMs){
      state.grayedBest = true;
      _setGrayed(document.getElementById('paceStatBest'), true);
    }
    if(state.showAvg && !state.grayedAvg && elapsedMs >= state.avgMs){
      state.grayedAvg = true;
      _setGrayed(document.getElementById('paceStatAvg'), true);
    }
    if(state.showWorst && !state.grayedWorst && elapsedMs >= state.worstMs){
      state.grayedWorst = true;
      _setGrayed(document.getElementById('paceStatWorst'), true);
    }
  };
})();

// [v3.90] Grid-edge pace boxes — three concentric rectangles inside
// .gscroll that shrink toward center over the player's best, average,
// and worst times for the current template. Each box has independent
// horizontal and vertical transition durations because .gscroll's
// inner area isn't square: horizontal edges have W/2 to travel and
// vertical edges have H/2, but both must meet at center at the same
// moment (the box's target time). Cleaner than tweening insets in JS
// — CSS does the smooth motion, we just set the start/end values
// and the durations once per puzzle.
//
// Each box also has an .pace-intense class added in JS during its
// final ~20% of life (when it's close to collapsing), brightening
// the line + adding a soft glow. On completion the box gets
// .pace-done which runs a brief pulse keyframe and then we detach
// the element from the DOM.
//
// Settings live in window._paceBox.{showBest,showAvg,showWorst}.
// Data comes from _mc113.getGhostStats(size, diff, tplName), which
// returns {best, worst, avg, count} or null. Box selection rule:
//   count === 1: only the best box, even if avg/worst toggles are on
//   count === 2: best + worst (skip avg — it's just the midpoint)
//   count >= 3: any combination the user has enabled
(function(){
  var boxes = [];  // active per-puzzle bookkeeping

  function _showBoxesForCount(count){
    // Returns the set of box keys eligible to render given how many
    // solves we have on this template. Toggle state filters this
    // further in _initPaceBoxes.
    if(count <= 1) return {best: true,  avg: false, worst: false};
    if(count === 2) return {best: true, avg: false, worst: true};
    return {best: true, avg: true, worst: true};
  }

  // Set up one box's initial state and transition durations.
  // targetMs is when its edges should all meet at center.
  function _armBox(el, targetMs, inset){
    if(!el) return null;
    // Reset any leftover state from prior puzzle.
    el.classList.remove('pace-intense', 'pace-done');
    el.style.transition = 'none';
    el.style.top    = inset + 'px';
    el.style.right  = inset + 'px';
    el.style.bottom = inset + 'px';
    el.style.left   = inset + 'px';
    el.style.display = 'block';
    // Force a reflow so the next transition starts from the inset
    // values above, not from whatever the box had a moment ago.
    void el.offsetWidth;
    // Measure the parent (.gscroll inner area) to set per-axis
    // durations. We use the parent's inner box minus 2*inset so
    // the calc accounts for the stagger.
    var parent = el.parentNode && el.parentNode.parentNode;  // #paceBoxes → .gscroll
    var pw = parent ? parent.clientWidth  : 0;
    var ph = parent ? parent.clientHeight : 0;
    var travelX = Math.max(1, (pw / 2) - inset);
    var travelY = Math.max(1, (ph / 2) - inset);
    // Same total duration on both axes — that's the whole point —
    // and CSS will interpolate top/bottom and left/right at the
    // pixel rates needed to land together.
    var dur = (targetMs / 1000) + 's';
    el.style.transition =
      'top '    + dur + ' linear, ' +
      'right '  + dur + ' linear, ' +
      'bottom ' + dur + ' linear, ' +
      'left '   + dur + ' linear, ' +
      'opacity 0.45s linear, ' +
      'box-shadow 0.45s linear';
    // Kick: set the end-state insets (center). Browser kicks off
    // the transition on the next frame.
    requestAnimationFrame(function(){
      el.style.top    = (ph / 2) + 'px';
      el.style.bottom = (ph / 2) + 'px';
      el.style.left   = (pw / 2) + 'px';
      el.style.right  = (pw / 2) + 'px';
    });
    return {el: el, targetMs: targetMs, intense: false, done: false};
  }

  window._initPaceBoxes = function(){
    var wrap = document.getElementById('paceBoxes');
    if(!wrap) return;
    // Tear down any previous puzzle's boxes.
    boxes = [];
    // Restore all three to a hidden, neutral state.
    ['paceBoxBest','paceBoxAvg','paceBoxWorst'].forEach(function(id){
      var el = document.getElementById(id);
      if(!el) return;
      el.classList.remove('pace-intense', 'pace-done');
      el.style.transition = 'none';
      el.style.top = el.style.right = el.style.bottom = el.style.left = '0px';
      el.style.display = 'none';
    });
    wrap.style.display = 'none';

    if(!(window._paceBox)) return;
    if(!(window._mc113 && window._mc113.getGhostStats)) return;

    var size = (typeof SIZE !== 'undefined') ? SIZE : null;
    var diff = (typeof DIFF !== 'undefined') ? DIFF : null;
    var tpl  = window._currentTplName || null;
    if(!size || !diff || !tpl) return;

    var stats = window._mc113.getGhostStats(size, diff, tpl);
    if(!stats) return;

    var allowed = _showBoxesForCount(stats.count);
    var prefs   = window._paceBox;

    // Stagger insets so the three rings are visually distinct at t=0.
    // Best is outermost (the boundary), avg sits 3px in, worst 6px in.
    var specs = [];
    if(allowed.best && prefs.showBest && stats.best > 0){
      specs.push({id: 'paceBoxBest', ms: stats.best, inset: 0});
    }
    if(allowed.avg && prefs.showAvg && stats.avg > 0){
      specs.push({id: 'paceBoxAvg', ms: stats.avg, inset: 3});
    }
    if(allowed.worst && prefs.showWorst && stats.worst > 0){
      specs.push({id: 'paceBoxWorst', ms: stats.worst, inset: 6});
    }
    if(!specs.length) return;

    wrap.style.display = 'block';
    specs.forEach(function(spec){
      var el = document.getElementById(spec.id);
      var b = _armBox(el, spec.ms, spec.inset);
      if(b) boxes.push(b);
    });
  };

  window._updatePaceBoxes = function(elapsedMs){
    if(!boxes.length) return;
    for(var i = 0; i < boxes.length; i++){
      var b = boxes[i];
      if(b.done) continue;
      var rem = b.targetMs - elapsedMs;
      // Intensify in the last 20% of the run.
      var shouldIntense = (rem <= b.targetMs * 0.20);
      if(shouldIntense && !b.intense){
        b.intense = true;
        b.el.classList.add('pace-intense');
      }
      if(rem <= 0){
        // Mark done, run pulse, then leave the element hidden so it
        // doesn't reappear on the next layout pass.
        b.done = true;
        b.el.classList.add('pace-done');
        (function(el){
          setTimeout(function(){
            el.style.display = 'none';
            el.classList.remove('pace-done', 'pace-intense');
          }, 480);
        })(b.el);
      }
    }
  };
})();

// [v4.19] Pace RINGS: three concentric SVG rect strokes around the
// grid that erase clockwise from the top-left corner as time passes.
// Replaces the visible behavior of the old pace boxes (which used
// nested rectangles marching inward — too distracting per Sam). The
// pace boxes' machinery is untouched and still runs against hidden
// DOM, so reverting just means flipping #paceBoxes back to visible
// and hiding #paceRings.
//
// Design: each ring corresponds to one of best/avg/worst times.
//   - Best ring is OUTERMOST — touches the grid edge. Erases fastest
//     since it has the shortest time budget. Watch it disappear to
//     know you're racing your best time.
//   - Avg ring is in the middle, inset a few px from the outer.
//   - Worst ring is INNERMOST, further inset. Erases slowest; if it's
//     still visible when you finish, you beat your worst time.
//
// Implementation: SVG with no viewBox, sized to grid-clip's px box.
// Each rect uses pathLength=100 so stroke-dashoffset is in 0-100
// percentages. Erase direction: stroke-dashoffset goes from 0 (full
// ring drawn) to -100 (fully erased). NEGATIVE offset is the key —
// positive offset would erase from the END of the path inward toward
// the start, but we want the FRONT of the path (top-left corner
// going clockwise along the top edge) to disappear first.
(function(){
  var rings = [];  // {el, targetMs}
  // [v4.43] Master flag for fuse glow squares — now driven by user
  // setting window._paceFusesOn (set in _applyTuning from
  // window._optPaceFuses / DEF.paceFuses). Used to be a hardcoded
  // _FUSES_ON in v4.42. The function references below check the
  // window-level global at call time so toggles in the settings
  // panel take effect on the next init.
  var RING_STROKE_W = 2;
  // [v4.22] No outset — outermost ring (worst) sits right AT the
  // grid's outer edge instead of extending beyond it. This permanently
  // resolves the .gscroll-overflow-clipping issue on Large/Hard
  // puzzles where the grid extends close to gscroll's width.
  // Trade-off: rings now sit just inside the grid bounds, overlapping
  // the perimeter cells. At 0.2 opacity (v4.21) they read as soft
  // borders rather than visual noise on top of the cells.
  //
  // Ring stack: three 2-px strokes with their CENTERS at insets
  // 0/2/4 from the outer edge. With stroke-width 2, that means
  // each ring's stroke spans from (inset - 1) to (inset + 1) px
  // from the outer edge — so they touch edge-to-edge with no gap.
  var RING_OUTSET = 0;
  var INSET_WORST = 0;
  var INSET_AVG = 2;
  var INSET_BEST = 4;

  function _showRingsForCount(count){
    // Match the existing pace-box visibility gating exactly so the
    // two systems behave identically with respect to "do we have
    // enough data to draw this ring."
    if(count >= 3){
      return {best: true, avg: true, worst: true};
    } else if(count === 2){
      return {best: true, avg: false, worst: true};
    } else if(count === 1){
      return {best: true, avg: false, worst: false};
    }
    return {best: false, avg: false, worst: false};
  }

  function _sizeRect(el, insetPx, gridW, gridH){
    // Half the stroke width sits OUTSIDE the geometric rect, so to
    // keep all of the stroke inside the grid bounds we inset by
    // (insetPx + stroke/2). The rect's x/y/width/height shrink by
    // (insetPx + stroke/2) on each side.
    var off = insetPx + (RING_STROKE_W / 2);
    el.setAttribute('x', off);
    el.setAttribute('y', off);
    el.setAttribute('width',  Math.max(0, gridW - 2 * off));
    el.setAttribute('height', Math.max(0, gridH - 2 * off));
    el.setAttribute('stroke-dashoffset', 0);
  }

  window._initPaceRings = function(){
    var svg = document.getElementById('paceRings');
    if(!svg) return;
    rings = [];

    // Reset all three to hidden / fully drawn / no transition.
    ['paceRingBest','paceRingAvg','paceRingWorst'].forEach(function(id){
      var el = document.getElementById(id);
      if(!el) return;
      el.style.display = 'none';
      el.setAttribute('stroke-dashoffset', 0);
    });
    svg.style.display = 'none';
    // [v4.38] Also reset all fuses to hidden. Active ones get re-shown
    // and positioned once we know which rings are being drawn.
    // [v4.43] Master gate: when the global pace-rings setting is off,
    // hide all fuses and exit early so nothing pace-ring-related is
    // drawn or computed for this puzzle. Toggles in the settings panel
    // call _applyTuning which re-invokes _initPaceRings, so flipping
    // this off mid-puzzle clears the rings on next init.
    var _fuseSvg = document.getElementById('paceRingFuses');
    if(_fuseSvg){
      ['paceFuseBest','paceFuseAvg','paceFuseWorst'].forEach(function(id){
        var fEl = document.getElementById(id);
        if(fEl) fEl.style.display = 'none';
      });
      _fuseSvg.style.display = 'none';
    }
    if(window._paceRingsOn === false) return;

    // Need the same stats the pace boxes use.
    if(!(window._paceBox)) return;
    if(!(window._mc113 && window._mc113.getGhostStats)) return;
    var size = (typeof SIZE !== 'undefined') ? SIZE : null;
    var diff = (typeof DIFF !== 'undefined') ? DIFF : null;
    var tpl  = window._currentTplName || null;
    if(!size || !diff || !tpl) return;
    var stats = window._mc113.getGhostStats(size, diff, tpl);
    if(!stats) return;

    var allowed = _showRingsForCount(stats.count);
    var prefs   = window._paceBox;

    // [v4.20] Measure grid-clip's position WITHIN its offsetParent
    // (which is .gscroll, since .gscroll is position:relative). Then
    // position the SVG to wrap the grid-clip with RING_OUTSET padding
    // on all sides. This puts the rings just outside the actual
    // grid edge, in the .gscroll padding region.
    var clip = document.getElementById('gridClip');
    if(!clip) return;
    var gridW = clip.offsetWidth;
    var gridH = clip.offsetHeight;
    if(gridW <= 0 || gridH <= 0) return;
    var gridX = clip.offsetLeft;
    var gridY = clip.offsetTop;

    // SVG total size includes outset on all sides.
    var svgX = gridX - RING_OUTSET;
    var svgY = gridY - RING_OUTSET;
    var svgW = gridW + 2 * RING_OUTSET;
    var svgH = gridH + 2 * RING_OUTSET;
    svg.style.left   = svgX + 'px';
    svg.style.top    = svgY + 'px';
    svg.style.width  = svgW + 'px';
    svg.style.height = svgH + 'px';

    var specs = [];
    if(allowed.worst && prefs.showWorst && stats.worst > 0){
      specs.push({id:'paceRingWorst', fuseId:'paceFuseWorst', ms:stats.worst, inset:INSET_WORST});
    }
    if(allowed.avg   && prefs.showAvg   && stats.avg   > 0){
      specs.push({id:'paceRingAvg',   fuseId:'paceFuseAvg',   ms:stats.avg,   inset:INSET_AVG});
    }
    if(allowed.best  && prefs.showBest  && stats.best  > 0){
      specs.push({id:'paceRingBest',  fuseId:'paceFuseBest',  ms:stats.best,  inset:INSET_BEST});
    }
    if(!specs.length) return;

    // [v4.38] Position and size the fuse SVG to match the rings SVG.
    // [v4.42] Skipped entirely when _FUSES_ON is false. SVG stays
    // display:none from its inline style; child rects also stay hidden.
    var fuseSvg = document.getElementById('paceRingFuses');
    if(window._paceFusesOn && fuseSvg){
      fuseSvg.style.left   = svgX + 'px';
      fuseSvg.style.top    = svgY + 'px';
      fuseSvg.style.width  = svgW + 'px';
      fuseSvg.style.height = svgH + 'px';
      fuseSvg.style.display = 'block';
      // Hide all fuses first; the active ones get re-shown below.
      ['paceFuseBest','paceFuseAvg','paceFuseWorst'].forEach(function(id){
        var fEl = document.getElementById(id);
        if(fEl) fEl.style.display = 'none';
      });
    }

    svg.style.display = 'block';
    // [v4.43] Read user-configurable opacity (set in _applyTuning from
    // the settings slider). Applied as stroke-opacity attribute on
    // every active ring so the slider takes effect on next init.
    var _ringOpacity = (typeof window._paceRingOpacity === 'number')
      ? window._paceRingOpacity : 0.4;
    specs.forEach(function(spec){
      var el = document.getElementById(spec.id);
      if(!el) return;
      _sizeRect(el, spec.inset, svgW, svgH);
      el.setAttribute('stroke-opacity', _ringOpacity);
      el.style.display = 'block';
      // [v4.38] Capture the rect's geometry so _updatePaceRings can
      // compute the fuse position at any progress without re-reading
      // the DOM. Same geometry as set by _sizeRect.
      var off = spec.inset + (RING_STROKE_W / 2);
      var rx = off;
      var ry = off;
      var rw = Math.max(0, svgW - 2 * off);
      var rh = Math.max(0, svgH - 2 * off);
      var fuseEl = window._paceFusesOn ? document.getElementById(spec.fuseId) : null;
      if(fuseEl){
        // [v4.39] Place fuse at top-left start point of ring, offset
        // by -1 to center the 2×2 square on the perimeter point.
        fuseEl.setAttribute('x', rx - 1);
        fuseEl.setAttribute('y', ry - 1);
        fuseEl.style.display = 'block';
      }
      rings.push({
        el: el,
        fuseEl: fuseEl,
        targetMs: spec.ms,
        done: false,
        rx: rx, ry: ry, rw: rw, rh: rh
      });
    });
  };

  // [v4.38] Helper: given a rect's geometry and a progress 0..1, return
  // the {x,y} point at that fraction of the way around the rect's
  // perimeter, starting at top-left and going clockwise.
  function _pointOnRect(rx, ry, rw, rh, progress){
    if(progress <= 0) return {x: rx, y: ry};
    if(progress >= 1) return {x: rx, y: ry};  // back to start
    var perim = 2 * (rw + rh);
    var d = progress * perim;
    if(d < rw){
      // top edge
      return {x: rx + d, y: ry};
    } else if(d < rw + rh){
      // right edge
      return {x: rx + rw, y: ry + (d - rw)};
    } else if(d < 2 * rw + rh){
      // bottom edge
      return {x: rx + rw - (d - rw - rh), y: ry + rh};
    } else {
      // left edge
      return {x: rx, y: ry + rh - (d - 2 * rw - rh)};
    }
  }

  window._updatePaceRings = function(elapsedMs){
    if(!rings.length) return;
    for(var i = 0; i < rings.length; i++){
      var r = rings[i];
      if(r.done) continue;
      var progress = elapsedMs / r.targetMs;  // 0..1+
      if(progress >= 1){
        // Fully erased. Mark done; the dashoffset will be set to
        // -100 below to ensure the visual matches the state.
        r.done = true;
        progress = 1;
        // Hide once erased so subsequent layout reflows don't repaint
        // a fragment.
        r.el.style.display = 'none';
        // [v4.38] Also hide the fuse glow now that the ring is gone.
        if(r.fuseEl) r.fuseEl.style.display = 'none';
      }
      // NEGATIVE dashoffset shifts the dash pattern RIGHT relative
      // to path-start, so the start-of-path falls in the GAP portion
      // first — i.e. the part of the ring near the top-left corner
      // (going clockwise) disappears first. That's the visual Sam
      // asked for: "top line of each rectangle gets erased from the
      // start point going clockwise."
      r.el.setAttribute('stroke-dashoffset', -progress * 100);
      // [v4.38] Update fuse position to ride the erasing front.
      // [v4.39] Square fuses use x/y (top-left corner) instead of
      // cx/cy. Offset by -1 to center the 2×2 box on the perimeter.
      if(r.fuseEl && !r.done){
        var pt = _pointOnRect(r.rx, r.ry, r.rw, r.rh, progress);
        r.fuseEl.setAttribute('x', pt.x - 1);
        r.fuseEl.setAttribute('y', pt.y - 1);
      }
    }
  };
})();

function showMenu(){
  // [v3.50] Save in-progress puzzle BEFORE switching screens. The
  // Menu button doesn't trigger pagehide/visibilitychange, so without
  // this explicit save, the latest moves wouldn't persist until the
  // next noteMove (which can't happen since we're leaving the game).
  // Skips internally if moves=0 or already won.
  // [v3.56] Then pause the timer. Without this pause, startTs keeps
  // pointing at a wall-clock anchor, and any subsequent saveProgress
  // (e.g. from a visibilitychange when the user backgrounds the app
  // from the menu screen) would write a wall-clock-inflated elapsed,
  // making the resumed game's clock appear to have run during the
  // away time. With pause, _curMs and _saveProgress both return the
  // frozen pauseStartElapsed value until restoreState recomputes
  // startTs on resume.
  try{
    if(window._mc113){
      if(window._mc113.saveProgress)window._mc113.saveProgress();
      if(window._mc113.pause)window._mc113.pause();
    }
  }catch(e){}
  document.getElementById('gameScreen').style.display='none';
  document.getElementById('selScreen').style.display='flex';
  // [v3.42] Hide the READY overlay if the user backs out before
  // tapping GO. Otherwise it'd persist over the menu screen.
  if(window._hideReady)window._hideReady();
  // [v3.50] Resume banner removed in favor of per-mode Play prompt.
  // [v3.62] Refresh the play button so the RESUME sub-label
  // appears if the currently-selected (size, diff) has a saved
  // game. Particularly important when returning from a puzzle the
  // player just exited — they need to see RESUME on the button
  // for that mode.
  if(window._refreshPlayButton)window._refreshPlayButton();
  // [v3.38] Restore size-button highlight to whichever size was last
  // played. Without this, returning to menu via the Menu button leaves
  // the buttons un-highlighted (the .on class only gets toggled by
  // direct button clicks). SIZE is the global tracking the currently-
  // selected size; default to xl2 if for some reason it's unset.
  try{
    var curSize=window.SIZE||'xl2';
    document.querySelectorAll('.sel-btn[data-size]').forEach(function(b){
      if(b.dataset.size===curSize)b.classList.add('on');
      else b.classList.remove('on');
    });
    document.body.classList.toggle('xl2-mode',curSize==='xl2');
  }catch(e){}
  // [v2.65] Add menu-active body class so puzzle-mode-only UI
  // (the tile-controls-row, etc.) hides via CSS while the user
  // is on the menu screen. Removed when the user starts a puzzle.
  document.body.classList.add('menu-active');
  // [Equil 1.13] Dismiss the win overlay when going back to menu —
  // the win card is z-index:300 (above gameScreen) so without this it
  // would persist on top of the menu screen.
  document.getElementById('win').classList.remove('show');
  // v8.93: hide sequencer-mode panels that live as siblings of gameScreen
  // (not children), so they don't bleed onto the menu screen. SEQUENCE BANK,
  // PITCH·VOL·PAN, SEQUENCER CONTROLS, MASTER EQ, and the FX panels
  // (SATURATION, STEREO WIDTH, REVERB, LIMITER) all sit at the body level
  // alongside the screens, so toggling gameScreen.display doesn't affect
  // them. showSeq() restores them via the same id list when re-entering.
  var _bleedIds=['seqBankSlimPanel','pvpSlimPanel','seqCtrlSlimPanel','eqSlimPanel'];
  if(window._fxPanelIds&&window._fxPanelIds.length){
    _bleedIds=_bleedIds.concat(window._fxPanelIds);
  }
  _bleedIds.forEach(function(id){
    var el=document.getElementById(id);
    if(el) el.style.display='none';
  });
  // The floating scroll-lock pill is appended to document.documentElement
  // so it survives screen swaps too. Hide it on the menu; sequencer init
  // will restore it when the user re-enters SEQ mode.
  var _fl=document.getElementById('_floatScrollLock');
  if(_fl) _fl.style.display='none';
  // v8.99 — same treatment for the floating zoom-pan pill.
  if(window._zoomPill) window._zoomPill.hide();
}

// Size buttons
// [v3.38] Scope to .sel-btn only — the new TIMES panel tabs also use
// data-size attributes and were getting unintentionally swept by the
// previous broad selector.
document.querySelectorAll('.sel-btn[data-size]').forEach(function(b){
  b.addEventListener('click',function(){
    document.querySelectorAll('.sel-btn[data-size]').forEach(function(x){x.classList.remove('on');});
    b.classList.add('on');SIZE=b.dataset.size;document.body.classList.toggle('xl2-mode',SIZE==='xl2');
    playUIClick();
    // [v3.62] Refresh the play button to show RESUME sub-label if
    // the new (size, diff) combination has a saved game.
    if(window._refreshPlayButton)window._refreshPlayButton();
  });
});
// Click sound on all sel-screen interactions (diff buttons, sound buttons)
document.querySelectorAll('[data-diff]').forEach(function(b){
  b.addEventListener('click',function(){playUIClick();},true);
});
// [v4.57] Same click sound for chalant/nonchalant mode buttons. Was
// missed when the [data-mode] handler was wired up separately for
// mode state; click sound is parallel to size/diff/sound buttons.
document.querySelectorAll('[data-mode]').forEach(function(b){
  b.addEventListener('click',function(){playUIClick();},true);
});
document.querySelectorAll('.bsnd').forEach(function(b){
  b.addEventListener('click',function(){playUIClick();},true);
});
document.getElementById('playBtn').addEventListener('click',function(){playUIClick();},true);
// [Equil 1.04] Removed: BANK SWIPE-ACROSS SOUND IIFE — sequencer-only finger drag-across-pads.

// [Equil 1.06] Restored: applyPctH (SIZE slider) and applyGapPct (GAP slider).
// These were originally inside the seq IIFE (deleted in 1.04) but the puzzle uses them too.
// The VERTICAL CANVAS SIZE BAR IIFE just below calls window.applyPctH/applyGapPct;
// without these, the SIZE/GAP sliders are inert. Sequencer-side sync callbacks
// (_syncTbSize, _syncTbGap, _syncToolbarBeat) are still called defensively but
// no-op since they're undefined.
// [v2.41] Doubled the size slider's max range. Old: 0%→0.3x, 100%→1.2x.
// New: 0%→0.3x, 100%→2.4x. Default size preserved by changing the
// "default" slider percentage from 90 to 39 in all call sites below
// (90% used to give 1.11x; 39% on the new formula gives ~1.119x —
// essentially identical visually). The bumped max lets users push
// tiles much larger when they want, which dwarfs any cross-browser
// cyan ×N positioning drift below the visible threshold.
function _puzzlePctToScaleH(pct){ return 0.3+(pct/100)*2.1; } // 0%=0.3x, 100%=2.4x
function _puzzleScaleToPctH(s){ return (s-0.3)/2.1*100; }
function _puzzlePctToGapMult(pct){ return pct/33.33; }       // 0%=0 gap, 33%=default(1.0), 100%=3x

// ─────────────────────────────────────────────────────────────
// [v2.62] TUNING ANCHOR SYSTEM
// ─────────────────────────────────────────────────────────────
// Replaces the formula-based size slider with a 3-anchor model.
// At slider position 0%, 50%, and 100%, the system snaps to the
// dialed-in values for the currently-active display mode (xN /
// off / ####). Between anchors, all values interpolate linearly.
//
// The user dialed in their preferred values per mode; the size
// slider now drives EVERY tunable (tile size, font multipliers,
// spacing offsets) instead of just tile size. Switching display
// modes recomputes everything for that mode at the current
// slider position.
//
// Manual ADVANCED-panel sliders still work — the user can nudge
// them to override interpolated values — but moving the size
// slider snaps everything back to the calculated targets.
//
// Anchor data was collected by the user at slider positions
// 13-26%, 40-50%, and 64-80% (per mode), then re-mapped here so
// those targets land at exact 0/50/100 anchor points. The
// recorded slider %s were converted to TILE_SCALE values via
// the previous formula (TILE_SCALE = 0.3 + (pct/100) * 2.1) so
// the size component of each anchor matches what the user saw
// when they made the dial-in choices.
// ─────────────────────────────────────────────────────────────
window._TUNING_ANCHORS = {
  xn: {
    tileScale: { S: 0.678, D: 1.350, L: 1.980 },
    wTop:      { S: -8.0,  D: -5.5,  L:  2.5  },
    nGap:      { S: -10.0, D: -10.0, L:  0.5  },
    wFont:     { S:  1.00, D:  1.45, L:  2.00 },
    cFont:     { S:  1.00, D:  0.85, L:  1.00 }
  },
  off: {
    tileScale: { S: 0.573, D: 1.140, L: 1.770 },
    wFont:     { S:  1.05, D:  1.15, L:  1.70 }
  },
  mini: {
    tileScale: { S: 0.846, D: 1.140, L: 1.644 },
    wTop:      { S: -5.0,  D: -5.0,  L: -5.0  },
    nGap:      { S:  6.0,  D:  6.0,  L:  1.5  },
    wFont:     { S:  1.25, D:  1.50, L:  2.55 },
    cFont:     { S:  1.05, D:  1.50, L:  2.00 },
    rowGap:    { S:  0.25, D:  3.25, L:  5.00 },
    colGap:    { S: -0.75, D:  4.00, L:  5.00 }
  }
};

// Identify which display mode is active. xN, mini, and cyan are
// mutually-exclusive flags; "off" means none of them are set.
// (cyan/all-cyan mode uses 'off' anchors as a sensible fallback —
// the user said cyan is too varied to dial in for now.)
window._tuningCurrentMode = function(){
  if(window._miniPuzzleTiles && !window._allCyanPuzzleTiles) return 'mini';
  if(window._condensePuzzleTiles && !window._miniPuzzleTiles && !window._allCyanPuzzleTiles) return 'xn';
  return 'off';
};

// [v2.63] Per-mode slider position persistence. Each display mode
// (xN, mini, cyan, off) gets its own remembered slider pct so
// switching modes restores where the user last had the slider in
// THAT mode. Falls back to 50 (the "Default" anchor position) if
// no value has been saved yet for a given mode.
//
// Returns a distinct key per visible mode — cyan gets its own
// bucket here even though it shares anchor data with 'off' (so
// the user can have cyan at one position and off at another).
window._tuningPersistMode = function(){
  if(window._miniPuzzleTiles && !window._allCyanPuzzleTiles) return 'mini';
  if(window._condensePuzzleTiles && !window._miniPuzzleTiles && !window._allCyanPuzzleTiles) return 'xn';
  if(window._allCyanPuzzleTiles) return 'cyan';
  return 'off';
};

window._SLIDER_POS_KEY = 'equilSliderPosByMode_v1';
window._tuningLoadSliderPos = function(mode){
  try{
    var raw = localStorage.getItem(window._SLIDER_POS_KEY);
    if(!raw) return null;
    var obj = JSON.parse(raw);
    var v = obj && obj[mode];
    return (typeof v === 'number' && !isNaN(v)) ? v : null;
  }catch(_){ return null; }
};
window._tuningSaveSliderPos = function(mode, pct){
  try{
    var raw = localStorage.getItem(window._SLIDER_POS_KEY);
    var obj = raw ? JSON.parse(raw) : {};
    if(!obj || typeof obj !== 'object') obj = {};
    obj[mode] = pct;
    localStorage.setItem(window._SLIDER_POS_KEY, JSON.stringify(obj));
  }catch(_){}
};

// Linearly interpolate between two values at fraction t (0..1).
function _tuningLerp(a, b, t){ return a + (b - a) * t; }

// Compute the interpolated value for a single setting at slider
// position pct (0..100). Returns null if the mode doesn't define
// that setting (caller falls back to the existing static default).
function _tuningInterp(mode, key, pct){
  var anchorSet = window._TUNING_ANCHORS[mode];
  if(!anchorSet) return null;
  var trio = anchorSet[key];
  if(!trio) return null;
  if(pct <= 50){
    var t = pct / 50;
    return _tuningLerp(trio.S, trio.D, t);
  } else {
    var t2 = (pct - 50) / 50;
    return _tuningLerp(trio.D, trio.L, t2);
  }
}

// Apply ALL interpolated values for the current mode at slider
// position pct. Sets window._opt* values (which feed renderBank
// via the existing _applyTuning machinery), then triggers any
// open ADVANCED-panel sliders to refresh their displayed knob
// positions to match.
window._tuningApplyAll = function(pct){
  var mode = window._tuningCurrentMode();
  pct = Math.max(0, Math.min(100, pct));
  // Tile scale — drives the actual tile pixel size in renderBank.
  var ts = _tuningInterp(mode, 'tileScale', pct);
  if(ts !== null) TILE_SCALE = ts;
  // Per-mode settings. Only set the window._opt* if the anchor
  // table defines this key for this mode.
  if(mode === 'xn'){
    var v;
    if((v = _tuningInterp('xn','wTop', pct)) !== null) window._optXnTopPct    = v;
    if((v = _tuningInterp('xn','nGap', pct)) !== null) window._optXnGapPct    = v;
    if((v = _tuningInterp('xn','wFont',pct)) !== null) window._optXnWhiteMult = v;
    if((v = _tuningInterp('xn','cFont',pct)) !== null) window._optXnCyanMult  = v;
  } else if(mode === 'mini'){
    var w;
    if((w = _tuningInterp('mini','wTop',  pct)) !== null) window._optMiniTopPct    = w;
    if((w = _tuningInterp('mini','nGap',  pct)) !== null) window._optMiniGapPct    = w;
    if((w = _tuningInterp('mini','wFont', pct)) !== null) window._optMiniWhiteMult = w;
    if((w = _tuningInterp('mini','cFont', pct)) !== null) window._optMiniCyanMult  = w;
    if((w = _tuningInterp('mini','rowGap',pct)) !== null) window._optMiniRowGapPct = w;
    if((w = _tuningInterp('mini','colGap',pct)) !== null) window._optMiniColGapPct = w;
  } else {
    // off mode — only tile scale and white font are tunable in
    // the current data set. Map to xN settings since "off mode"
    // shares the white-digit-only render with low-density xN
    // tiles (single-instance values in the bank).
    var u;
    if((u = _tuningInterp('off','wFont',pct)) !== null) window._optXnWhiteMult = u;
  }
  // Push the new window._opt values into the live window._* values
  // that renderBank actually reads.
  if(typeof window._equilApplyTuning === 'function'){
    try{ window._equilApplyTuning(); }catch(_){}
  }
  // Refresh ADVANCED-panel slider knob positions to reflect the
  // new interpolated values (so the user sees them snap back to
  // calculated targets when the size slider moves).
  if(typeof window._equilRefreshAdvancedKnobs === 'function'){
    try{ window._equilRefreshAdvancedKnobs(); }catch(_){}
  }
};

// Helper for the size slider to use during scrubbing — wraps
// the new system with a renderBank call.
window._tuningSliderInput = function(pct){
  window._tuningApplyAll(pct);
  if(PZ) renderBank();
};

window.applyPctH = function(pct){
  pct=Math.max(0,Math.min(100,pct));
  // [v2.62] All tunables now driven from anchored interpolation
  // tables per display mode. _tuningApplyAll sets TILE_SCALE plus
  // every window._opt* setting from the active mode's anchors at
  // this slider position. Falls through to the existing render +
  // sync chain below.
  if(typeof window._tuningApplyAll === 'function'){
    window._tuningApplyAll(pct);
  } else {
    // Fallback to legacy formula if the tuning system isn't loaded.
    TILE_SCALE=_puzzlePctToScaleH(pct);
  }
  if(PZ) renderBank();
  if(window._syncVertSizeBar) window._syncVertSizeBar(pct);
  if(window._syncTbSize) window._syncTbSize(pct);
  if(window._syncToolbarBeat) window._syncToolbarBeat();
  // [v2.53] Update the floating size readout if it's visible.
  if(window._equilUpdateSizeReadout) window._equilUpdateSizeReadout();
  // [v2.63] NOTE: per-mode slider position persistence is NOT done
  // here. applyPctH gets called from many code paths (page init,
  // mode toggles, programmatic restores) and saving on every call
  // would clobber the saved value during mode-switch flows.
  // Instead, the user-driven slider event handlers explicitly call
  // window._tuningSaveSliderPos after invoking applyPctH.
  // [v1.75] Removed bank-position drift compensation. It used
  // window.scrollBy to keep .bank-outer visually pinned during
  // slider drags, but when called from button toggles (xN/mini/
  // cyan) it caused the page to snap to the top after each
  // button press. Cost of removal: when the user drags the SIZE
  // slider, the bank may shift a few pixels — acceptable.
};
window.scaleToPctH = _puzzleScaleToPctH;

window.applyGapPct = function(pct){
  pct=Math.max(0,Math.min(100,pct));
  TILE_GAP_MULT=_puzzlePctToGapMult(pct);
  if(PZ) renderBank();
  if(window._syncTbGap) window._syncTbGap(pct);
  if(window._syncVertGapBar) window._syncVertGapBar(pct);
  document.querySelectorAll('.bt[data-bank-idx]').forEach(function(t){
    var i=parseInt(t.dataset.bankIdx);
    if(!isNaN(i)) applyTileColor(t,i);
  });
  // [v1.75] See applyPctH for note about removed drift compensation.
};

// Init defaults — these match what the seq IIFE used to set on load:
//   SIZE at 50% (TILE_SCALE = 0.75), GAP at 33.33% (TILE_GAP_MULT = 1.0)
// Defer until DOMContentLoaded so the bank container exists when renderBank runs.
// [v1.72] Init defaults — bumped from 50/33.33 to 90/25 so tiles
// default to nearly full size (TILE_SCALE ≈ 1.11) with a small gap
// (TILE_GAP_MULT ≈ 0.75). Slider can still tune both.
// [v2.41] Default size pct changed from 90 to 39 to match the new
// formula's mapping for TILE_SCALE 1.11. The visual default size is
// preserved exactly; only the slider position / numeric percentage
// changed.
// [v2.62] Initial slider default changed from 39 to 50 — the new
// tuning anchor system uses 0/50/100 as the three control points,
// with 50 being the user's "Default" dialed-in values per mode.
// Old 39 default was tied to the legacy formula's visual baseline;
// the new 50 default lands directly on the DEFAULT anchor.
// [v2.63] On page load, restore the user's last-known slider
// position FOR THE CURRENT DISPLAY MODE if one was saved. This
// way the user's preferred slider position per mode survives
// page reloads. Falls back to 50 if no saved value exists.
function _equilInitSlider(){
  var pct = 50;
  if(typeof window._tuningLoadSliderPos === 'function'
     && typeof window._tuningPersistMode === 'function'){
    var saved = window._tuningLoadSliderPos(window._tuningPersistMode());
    if(typeof saved === 'number' && !isNaN(saved)) pct = saved;
  }
  window.applyPctH(pct);
  window.applyGapPct(25);
}
if(document.readyState==='loading'){
  document.addEventListener('DOMContentLoaded', _equilInitSlider);
} else {
  _equilInitSlider();
}

// ── VERTICAL CANVAS SIZE BAR (always visible, left of bank) ──────
(function(){
  // Build the canvas size bar element and inject it into the bank-row
  // We create it in JS so we can render it canvas-style (matching menu sliders)

  var COLOR='#a855f7'; // [v1.72] amethyst — was '#4b7bb5' (blue from tile spacing menu)

  function pctToScale(pct){ return 0.3+(pct/100)*0.9; }
  function scaleToPct(s){ return (s-0.3)/0.9*100; }

  // Draw the vertical size bar — same code as _drawMixerSliderV (vertical path)
  function _drawVert(cv, pct, label){
    if(!cv) return;
    var _hexWithAlpha=window._hexWithAlpha||function(h,a){var r=parseInt(h.slice(1,3),16),g=parseInt(h.slice(3,5),16),b=parseInt(h.slice(5,7),16);return 'rgba('+r+','+g+','+b+','+a+')';};
    var _darkenHex=window._darkenHex||function(h,a){var r=parseInt(h.slice(1,3),16),g=parseInt(h.slice(3,5),16),b=parseInt(h.slice(5,7),16);r=Math.round(r*(1-a));g=Math.round(g*(1-a));b=Math.round(b*(1-a));return 'rgb('+r+','+g+','+b+')';};
    var wrap=cv.parentElement; if(!wrap) return;
    var cW=Math.max(1,wrap.offsetWidth||28);
    var cH=Math.max(1,wrap.offsetHeight||100);
    cv.width=cW; cv.height=cH;
    var ctx=cv.getContext('2d');
    ctx.clearRect(0,0,cW,cH);
    // PAD is the track's inset from the canvas top/bottom. Keeping
    // it ≥ handleHeight/2 + 2 ensures the handle fits entirely inside
    // the canvas at the extreme positions. Handle is 18px tall (v8.71),
    // so PAD:12 leaves 3px of safety margin above/below the extremes.
    // Track corner radius back to 3 (v8.85) — v8.79 mistakenly bumped
    // this to 8 when the user had asked for the THUMB to be rounded.
    var PAD=12, R=3;
    var trackThick=Math.round(cW*0.65);
    var trackX=Math.round((cW-trackThick)/2);
    var trackY=PAD, trackLen=cH-PAD*2;
    // pct=1 = large tiles = handle at top; invert for draw position
    var _drawPct=1-pct;
    var handlePos=Math.round(PAD+trackLen*_drawPct);
    var fillStart=handlePos, fillEnd=cH-PAD, fillLen=fillEnd-fillStart;
    // Track
    ctx.beginPath();
    ctx.moveTo(trackX+R,trackY); ctx.lineTo(trackX+trackThick-R,trackY);
    ctx.arcTo(trackX+trackThick,trackY,trackX+trackThick,trackY+R,R);
    ctx.lineTo(trackX+trackThick,trackY+trackLen-R);
    ctx.arcTo(trackX+trackThick,trackY+trackLen,trackX+trackThick-R,trackY+trackLen,R);
    ctx.lineTo(trackX+R,trackY+trackLen);
    ctx.arcTo(trackX,trackY+trackLen,trackX,trackY+trackLen-R,R);
    ctx.lineTo(trackX,trackY+R);
    ctx.arcTo(trackX,trackY,trackX+R,trackY,R);
    ctx.closePath();
    ctx.fillStyle=_hexWithAlpha(COLOR,0.07); ctx.fill();
    ctx.strokeStyle=_darkenHex(COLOR,0.28); ctx.lineWidth=1.5; ctx.stroke();
    // Hatch fill
    if(fillLen>1){
      ctx.save(); ctx.beginPath();
      ctx.rect(trackX+1,fillStart,trackThick-2,fillLen); ctx.clip();
      ctx.globalAlpha=0.45; ctx.fillStyle=COLOR;
      ctx.fillRect(trackX+1,fillStart,trackThick-2,fillLen);
      ctx.globalAlpha=0.85; ctx.strokeStyle=_darkenHex(COLOR,0.15); ctx.lineWidth=1.2;
      for(var yi=fillStart-trackThick;yi<fillStart+fillLen+trackThick;yi+=6){
        ctx.beginPath(); ctx.moveTo(trackX+1,yi); ctx.lineTo(trackX+trackThick-1,yi+trackThick); ctx.stroke();
      }
      ctx.globalAlpha=1; ctx.restore();
    }
    // ── INLINE LABEL (horizontal, centered) ──
    // Drawn after the hatch fill so the text sits over the hatching.
    // Font sized to fit the slider width — "SIZE" and "GAP" are short
    // enough to read clearly at this scale. Bounds are stored on the
    // canvas dataset so the handle canvas (drawn separately via
    // _drawVertHandle) can punch translucency through itself where it
    // overlaps the text.
    var _lbl=label||cv.dataset.label||'';
    if(_lbl){
      ctx.save();
      // Font size: leave some horizontal breathing room inside the
      // track. Clamp so it stays readable on skinny sliders and
      // doesn't balloon on wide ones.
      var fsize=Math.max(8, Math.min(12, Math.round(trackThick*0.35)));
      ctx.font='700 '+fsize+'px "IBM Plex Mono",monospace';
      var tmpW=ctx.measureText(_lbl).width;
      var cx=cW/2, cy=cH/2;
      ctx.textAlign='center';
      ctx.textBaseline='middle';
      // Heavy dark outline — triple draw with shadow for strong
      // legibility against hatch fill (matches seq-mode slider style).
      ctx.shadowColor='rgba(0,0,0,1)';
      ctx.shadowBlur=4; ctx.shadowOffsetY=1;
      ctx.fillStyle=COLOR;
      ctx.fillText(_lbl, cx, cy);
      ctx.shadowColor='rgba(0,0,0,0.95)';
      ctx.shadowBlur=2;
      ctx.fillText(_lbl, cx, cy);
      ctx.shadowBlur=0; ctx.shadowOffsetY=0;
      ctx.fillText(_lbl, cx, cy);
      ctx.restore();
      // Axis-aligned label bounds. Horizontal text: width spans x,
      // cap-height spans y.
      var bandH=Math.round(fsize*1.2);
      var bandW=Math.ceil(tmpW+4);
      var bounds={
        left: Math.floor(cx - bandW/2),
        right: Math.ceil(cx + bandW/2),
        top: Math.floor(cy - bandH/2),
        bottom: Math.ceil(cy + bandH/2)
      };
      cv.dataset.labelBounds=JSON.stringify(bounds);
    }
  }

  // Draw the slider handle on a SEPARATE canvas layered above the
  // track canvas. Because the handle lives on its own canvas, the
  // destination-out punch-through erases only the handle's own
  // alpha within the label rect — the text on the track canvas
  // below stays fully opaque and visible through the translucent
  // region of the thumb. Mirrors _drawMenuSliderHandle but oriented
  // vertically (handle slides up/down, bar spans full width).
  function _drawVertHandle(hcv, pct, labelBounds){
    if(!hcv) return;
    var wrap=hcv.parentElement; if(!wrap) return;
    var cW=Math.max(1,wrap.offsetWidth||28);
    var cH=Math.max(1,wrap.offsetHeight||100);
    hcv.width=cW; hcv.height=cH;
    var ctx=hcv.getContext('2d');
    ctx.clearRect(0,0,cW,cH);
    // Must match _drawVert's PAD so the handle's travel aligns with
    // the track's fillable region. Handle is 18px tall (v8.71, 150%
    // of the original 12px) — PAD:12 keeps it inside the canvas at
    // the extremes.
    var PAD=12;
    var trackLen=cH-PAD*2;
    var _drawPct=1-pct;
    var handlePos=Math.round(PAD+trackLen*_drawPct);
    // Handle geometry. Corner radius bumped to 7 (was 4) in v8.85 —
    // the user wanted the thumb to have noticeably rounded corners
    // (the previous v8.79 change accidentally rounded the TRACK
    // instead of the THUMB). Width extends 2px past each side of the
    // canvas so the handle appears to "cap" the full track width.
    ctx.shadowColor='rgba(0,0,0,0.4)'; ctx.shadowBlur=3; ctx.shadowOffsetX=0; ctx.shadowOffsetY=1;
    ctx.fillStyle='#1a1a1a';
    var hH=18, hW=cW+4, hY=handlePos-hH/2, hX=-2, CR=7;
    ctx.beginPath();
    ctx.moveTo(hX+CR,hY); ctx.lineTo(hX+hW-CR,hY);
    ctx.arcTo(hX+hW,hY,hX+hW,hY+CR,CR); ctx.lineTo(hX+hW,hY+hH-CR);
    ctx.arcTo(hX+hW,hY+hH,hX+hW-CR,hY+hH,CR); ctx.lineTo(hX+CR,hY+hH);
    ctx.arcTo(hX,hY+hH,hX,hY+hH-CR,CR); ctx.lineTo(hX,hY+CR);
    ctx.arcTo(hX,hY,hX+CR,hY,CR); ctx.closePath(); ctx.fill();
    ctx.shadowBlur=0; ctx.shadowOffsetX=0; ctx.shadowOffsetY=0;
    ctx.strokeStyle='#000'; ctx.lineWidth=1; ctx.stroke();
    // Grip lines: three HORIZONTAL bands (v8.71 — was three vertical
    // lines). Horizontal lines read as ridges running across the
    // thumb, the way you'd expect to see them on a slider knob being
    // pushed up/down. Inset from the handle edges by CR so they
    // don't touch the rounded corners.
    ctx.strokeStyle='#666'; ctx.lineWidth=1;
    var gcy=hY+hH/2;
    [-4,0,4].forEach(function(dy){
      ctx.beginPath();
      ctx.moveTo(hX+CR, gcy+dy);
      ctx.lineTo(hX+hW-CR, gcy+dy);
      ctx.stroke();
    });
    // Punch translucency through the handle wherever it overlaps the
    // label text bounds. destination-out with alpha 0.75 erases 75%
    // of the handle's alpha in the overlap region — leaving the
    // handle at 25% opacity over the text so the letters show through.
    if(labelBounds){
      var boundsList=Array.isArray(labelBounds)?labelBounds:[labelBounds];
      boundsList.forEach(function(lb){
        if(!lb) return;
        var ox1=Math.max(hX, lb.left);
        var ox2=Math.min(hX+hW, lb.right);
        var oy1=Math.max(hY, lb.top);
        var oy2=Math.min(hY+hH, lb.bottom);
        if(ox2>ox1 && oy2>oy1){
          ctx.save();
          ctx.globalCompositeOperation='destination-out';
          ctx.globalAlpha=0.75;
          ctx.fillStyle='#000';
          ctx.fillRect(ox1, oy1, ox2-ox1, oy2-oy1);
          ctx.restore();
        }
      });
    }
  }

  // Helper that draws both layers of a vertical slider — track/label
  // first, then the handle on its separate canvas. All existing
  // slider-input listeners call this single fn so the two canvases
  // stay in sync. `cv` is the track canvas (with dataset.label);
  // `hcv` is the handle canvas. If hcv is missing the call still
  // succeeds (falls back to track-only, no handle).
  function _drawVertPair(cv, hcv, pct){
    _drawVert(cv, pct);
    if(!hcv) return;
    var lb=null;
    try{
      if(cv && cv.dataset.labelBounds) lb=JSON.parse(cv.dataset.labelBounds);
    }catch(e){}
    _drawVertHandle(hcv, pct, lb);
  }

  // Build and inject the bar into sizeSideWrap placeholder
  function _buildBar(){
    var bankRow=document.querySelector('.bank-row');
    if(!bankRow) return;

    var wrap=document.createElement('div');
    wrap.id='sizeCanvasWrap';
    wrap.style.cssText='display:flex;flex-direction:column;align-items:center;flex-shrink:0;gap:0;padding:4px 3px 4px;background:var(--bg-secondary);touch-action:none;';

    // ── SIZE vertical slider ──
    // Label is drawn INSIDE the track by _drawVert (via dataset.label)
    // rather than as a separate span above the slider. Width doubled
    // from 28px → 56px for better touch targets and inline label room.
    var canvasWrap=document.createElement('div');
    canvasWrap.id='sizeCanvasInner';
    canvasWrap.style.cssText='position:relative;width:56px;flex:1;min-height:80px;cursor:ns-resize;touch-action:none;overflow:visible;filter:drop-shadow(0px 4px 8px rgba(75,123,181,0.7)) drop-shadow(0px 2px 4px rgba(0,0,0,0.4));';

    // Track canvas (z=1): track, fill, inline label text
    var cv=document.createElement('canvas');
    cv.id='sizeVertCanvas';
    cv.dataset.label='SIZE';
    cv.style.cssText='position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;';
    canvasWrap.appendChild(cv);

    // Handle canvas (z=2): ONLY the thumb. Separate layer so the
    // destination-out punch-through erases only the handle's alpha,
    // leaving the label text on the track canvas fully visible.
    var hcv=document.createElement('canvas');
    hcv.id='sizeVertHandle';
    hcv.style.cssText='position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;';
    canvasWrap.appendChild(hcv);

    var sl=document.createElement('input');
    sl.type='range'; sl.min=0; sl.max=100; sl.step=1; sl.value=50;
    sl.orient='vertical';
    sl.style.cssText='position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:ns-resize;z-index:5;-webkit-appearance:slider-vertical;writing-mode:vertical-lr;direction:rtl;touch-action:none;';
    // [v2.56] Inline size readout — sits at the TOP of the slider
    // panel, always visible (not hidden until touch). Travels with
    // the slider whether it lives in its in-bank dock or in the
    // ADJUST modal (because it's a child of #sizeCanvasWrap which
    // gets moved between the two contexts). Replaces the v2.51-2.55
    // floating overlay that was anchored to the viewport — that
    // worked but required tap-to-show which made it fiddly to read
    // exact values during a tuning pass.
    var _sizeReadout = document.createElement('div');
    _sizeReadout.style.cssText =
      'min-width:56px;'+
      'background:rgba(20,20,20,0.85);'+
      'border:1px solid rgba(0,217,255,0.5);'+
      'border-radius:4px;'+
      'padding:3px 6px;'+
      'margin-bottom:4px;'+
      'color:var(--cyan,#00d9ff);'+
      'font-family:IBM Plex Mono,monospace;'+
      'font-size:11px;'+
      'font-weight:700;'+
      'letter-spacing:0.5px;'+
      'line-height:1.2;'+
      'text-align:center;'+
      'white-space:nowrap;'+
      'pointer-events:none;'+
      'box-sizing:border-box;'+
      'flex-shrink:0;';
    // Prepend so it sits above the slider columns inside the wrap.
    wrap.appendChild(_sizeReadout);
    function _updateSizeReadout(){
      var pct = parseFloat(sl.value);
      // Re-derive the same numbers renderBank computes, so the readout
      // matches what's actually drawn on the tiles. Best-effort —
      // bank may not exist yet, in which case skip the font size line.
      var tilePx = '—';
      var fontPx = '—';
      try{
        if(typeof TILE_SCALE === 'number' && typeof PZ !== 'undefined' && PZ){
          var bankCount = PZ.bank.length;
          var baseSize = bankCount>25 ? 32 : bankCount>15 ? 38 : 44;
          var baseFont = bankCount>25 ? 13 : bankCount>15 ? 15 : 18;
          tilePx = Math.round(baseSize * TILE_SCALE) + 'px';
          fontPx = Math.round(baseFont * TILE_SCALE) + 'px';
        }
      }catch(_){}
      _sizeReadout.innerHTML =
        Math.round(pct) + '%<br>'+
        '<span style="color:rgba(255,255,255,0.7);font-size:9px;font-weight:400;letter-spacing:0;">'+tilePx+' / '+fontPx+'</span>';
    }
    // Initial render — populate immediately so it's not blank on load.
    _updateSizeReadout();
    // [v2.53/v2.56] Globally exposed so applyPctH (and the canvasWrap
    // touch handlers) can refresh the readout. The earlier sl.input
    // listener never actually fires during a touch drag because the
    // canvasWrap touchmove handler sets sl.value directly (programmatic
    // value changes don't fire input events). Putting the refresh hook
    // on window means EVERY pathway that changes the size triggers it.
    window._equilUpdateSizeReadout = _updateSizeReadout;
    // Show/hide hooks kept for backward compat with older callers but
    // are now no-ops since the readout is always visible.
    window._equilShowSizeReadout = function(){};
    window._equilHideSizeReadout = function(){};
    sl.addEventListener('touchstart',function(){ _lockScroll(); },{passive:true});
    sl.addEventListener('touchend',function(){ _unlockScroll(); },{passive:true});
    sl.addEventListener('touchcancel',function(){ _unlockScroll(); },{passive:true});
    sl.addEventListener('input',function(){
      if(window._sliderFx) window._sliderFx();
      var pct=parseFloat(sl.value);
      if(window._seqVisible){
        // SEQ mode: map pct 100→2 rows (big tiles), pct 0→16 rows (small tiles)
        var rows=Math.round(1+(1-pct/100)*15);
        window._seqTargetRows=rows;
        if(PZ) renderBank();
        if(window._syncPadAdjSize) window._syncPadAdjSize(pct);
      } else {
        // Puzzle mode: drive TILE_SCALE directly
        if(window.applyPctH) window.applyPctH(pct);
        // [v2.63] Save user-driven slider position under the current
        // display mode, so switching modes restores it later.
        if(typeof window._tuningSaveSliderPos === 'function'
           && typeof window._tuningPersistMode === 'function'){
          try{ window._tuningSaveSliderPos(window._tuningPersistMode(), pct); }catch(_){}
        }
      }
      _drawVertPair(cv,hcv,pct/100);
      // [v2.51] Refresh the floating size readout if it's currently
      // visible (i.e. user is mid-slide).
      if(_sizeReadout.style.display !== 'none') _updateSizeReadout();
    });
    canvasWrap.appendChild(sl);
    wrap.appendChild(canvasWrap);

    // ── GAP vertical slider ──
    // Label drawn INSIDE the track via dataset.label. Same widened
    // size as the SIZE slider for consistency.
    var gapWrap=document.createElement('div');
    gapWrap.id='gapCanvasInner';
    gapWrap.style.cssText='position:relative;width:56px;flex:1;min-height:80px;cursor:ns-resize;touch-action:none;overflow:visible;filter:drop-shadow(0px 4px 8px rgba(75,123,181,0.7)) drop-shadow(0px 2px 4px rgba(0,0,0,0.4));';

    // GAP track canvas
    var cvGap=document.createElement('canvas');
    cvGap.id='gapVertCanvas';
    cvGap.dataset.label='GAP';
    cvGap.style.cssText='position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;';
    gapWrap.appendChild(cvGap);

    // GAP handle canvas
    var hcvGap=document.createElement('canvas');
    hcvGap.id='gapVertHandle';
    hcvGap.style.cssText='position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;';
    gapWrap.appendChild(hcvGap);

    // GAP: 0%=no gap, 33%=default (mult 1.0), 100%=3x gap
    var slGap=document.createElement('input');
    slGap.type='range'; slGap.min=0; slGap.max=100; slGap.step=1; slGap.value=33;
    slGap.orient='vertical';
    slGap.style.cssText='position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:ns-resize;z-index:5;-webkit-appearance:slider-vertical;writing-mode:vertical-lr;direction:rtl;touch-action:none;';
    slGap.addEventListener('touchstart',function(){ _lockScroll(); },{passive:true});
    slGap.addEventListener('touchend',function(){ _unlockScroll(); },{passive:true});
    slGap.addEventListener('touchcancel',function(){ _unlockScroll(); },{passive:true});
    slGap.addEventListener('input',function(){
      if(window._sliderFx) window._sliderFx();
      var pct=parseFloat(slGap.value);
      if(window.applyGapPct) window.applyGapPct(pct);
      _drawVertPair(cvGap,hcvGap,pct/100);
    });
    gapWrap.appendChild(slGap);
    wrap.appendChild(gapWrap);

    // ── Condense-puzzle-tiles toggle (v8.84) ──
    // A small button under the GAP slider that toggles between the
    // default "one tile per duplicate" rendering and a condensed view
    // where repeated values collapse into one tile with a cyan ×N
    // multiplier showing how many unused copies remain. Only visible
    // in puzzle mode — hidden whenever SEQ mode is active because
    // collapsing pads breaks the sequencer's per-pad addressing.
    //
    // State persists in localStorage across reloads. Default: off
    // (matches existing behavior).
    var condBtn = document.createElement('button');
    condBtn.id = 'condenseTilesBtn';
    condBtn.title = 'Condense repeated tiles (e.g. seven 1s → one "1×7" tile)';
    condBtn.style.cssText = 'margin-top:6px;width:48px;height:24px;font-family:monospace;font-size:9px;font-weight:700;letter-spacing:0.5px;border:1px solid rgba(0,147,170,0.45);border-radius:5px;background:transparent;color:rgba(0,147,170,0.85);cursor:pointer;touch-action:manipulation;padding:0;line-height:1;display:flex;align-items:center;justify-content:center;';
    condBtn.textContent = '×N';
    // Read persisted state. Default off.
    try{
      var savedCond = localStorage.getItem('seqCondenseTilesV1');
      window._condensePuzzleTiles = (savedCond === '1');
    }catch(e){
      window._condensePuzzleTiles = false;
    }
    function _paintCondBtn(){
      if(window._condensePuzzleTiles){
        condBtn.style.background = 'rgba(0,147,170,0.28)';
        condBtn.style.borderColor = '#0093aa';
        condBtn.style.color = '#7dd3e0';
        condBtn.style.boxShadow = '0 0 8px rgba(0,147,170,0.45)';
      } else {
        condBtn.style.background = 'transparent';
        condBtn.style.borderColor = 'rgba(0,147,170,0.45)';
        condBtn.style.color = 'rgba(0,147,170,0.85)';
        condBtn.style.boxShadow = '';
      }
    }
    _paintCondBtn();
    function _toggleCondense(){
      // [v4.76] Preserve page scroll across the WHOLE toggle operation.
      // This toggle changes TILE_SCALE/TILE_GAP via applyPctH/applyGapPct
      // (which resize the bank and call renderBank internally) and then
      // calls renderBank again. Each individual renderBank restores its
      // own scroll, but the slider/resize steps in between change the
      // bank's height, shifting the page's max scroll and snapping to
      // top OUTSIDE any single renderBank's guarded window. Capturing
      // once here and restoring after everything settles fixes it. A
      // double-rAF restore catches any async layout/resize that lands
      // after the synchronous work (the bank resize can reflow on the
      // next frame).
      var _condScrollY = window.scrollY;
      var turningOn = !window._condensePuzzleTiles;
      // v8.85: when entering condensed mode, save the user's current
      // slider values then snap to max size + zero gap (best layout for
      // the collapsed view since each value gets one big tile). On
      // toggling back off, restore the saved values so the user gets
      // back exactly the layout they had before.
      if(turningOn){
        try{
          window._condenseSliderSnapshot = {
            size: parseFloat(sl.value),
            gap: parseFloat(slGap.value)
          };
        }catch(e){
          window._condenseSliderSnapshot = null;
        }
        // v8.96 — xN and mini modes are mutually exclusive. Turn off
        // mini if it was on. We don't repaint mini's button here since
        // it gets a sync helper assigned below (window._paintMiniBtn).
        // [v1.30] Also turn off cyan mode (third option).
        if(window._miniPuzzleTiles){
          window._miniPuzzleTiles = false;
          try{ localStorage.setItem('seqMiniTilesV1','0'); }catch(e){}
          if(window._paintMiniBtn) window._paintMiniBtn();
        }
        if(window._allCyanPuzzleTiles){
          window._allCyanPuzzleTiles = false;
          try{ localStorage.setItem('seqCyanTilesV1','0'); }catch(e){}
          if(window._paintCyanBtn) window._paintCyanBtn();
        }
      }
      window._condensePuzzleTiles = turningOn;
      try{ localStorage.setItem('seqCondenseTilesV1', turningOn ? '1' : '0'); }catch(e){}
      _paintCondBtn();
      // Same SFX as other tool toggles for consistency.
      if(window._btnFx) window._btnFx(turningOn ? 'tool_on' : 'tool_off');
      // Apply slider changes. Updating the slider's .value plus calling
      // the apply helper keeps the visual handle, the live TILE_SCALE/
      // TILE_GAP_MULT, and the renderBank in sync. _drawVertPair updates
      // the canvas track + handle position to match.
      if(turningOn){
        // [v2.62] Default to slider 50% (was 39%) — 50 lands on the
        // "Default" anchor in the new tuning system, which is where
        // the user's dialed-in default values for the active mode
        // get applied.
        sl.value = 50;
        slGap.value = 25;
        if(window.applyPctH) window.applyPctH(50);
        if(window.applyGapPct) window.applyGapPct(25);
        _drawVertPair(cv, hcv, 0.50);
        _drawVertPair(cvGap, hcvGap, 0.25);
      } else {
        // Restore prior slider state. Fall back to defaults if no
        // snapshot was captured (e.g. user enabled condense via
        // localStorage on a fresh load).
        var snap = window._condenseSliderSnapshot;
        var sizePct = snap ? snap.size : 50;
        var gapPct  = snap ? snap.gap  : 25;
        sl.value = sizePct;
        slGap.value = gapPct;
        if(window.applyPctH) window.applyPctH(sizePct);
        if(window.applyGapPct) window.applyGapPct(gapPct);
        _drawVertPair(cv, hcv, sizePct/100);
        _drawVertPair(cvGap, hcvGap, gapPct/100);
      }
      // Re-render the bank to apply collapse/uncollapse — applyPctH
      // already does this but call again to be sure ordering is right.
      renderBank();
      // [v4.76] Restore scroll now and again on the next two frames to
      // catch any async bank reflow from the resize.
      var _restore = function(){ if(window.scrollY !== _condScrollY) window.scrollTo(0, _condScrollY); };
      _restore();
      requestAnimationFrame(function(){ _restore(); requestAnimationFrame(_restore); });
    }
    condBtn.addEventListener('click', function(e){ e.stopPropagation(); _toggleCondense(); });
    condBtn.addEventListener('touchend', function(e){ e.stopPropagation(); }, {passive:true});
    // [v1.78] Expose toggle so the new full-width tile-controls-row
    // relay buttons can call it directly instead of via a synthetic
    // click on the now-hidden #condenseTilesBtn (which seemed to be
    // causing scroll-to-top — possibly due to default <button> submit
    // semantics or focus-into-view on a display:none element).
    window._equilToggleCondense = _toggleCondense;
    // Hide in SEQ mode. renderBank is called on mode switches, so we
    // expose a sync function that renderBank invokes at the top of
    // each call to keep this in step with seqVisible.
    function _syncCondBtnVisibility(){
      condBtn.style.display = window._seqVisible ? 'none' : 'flex';
    }
    _syncCondBtnVisibility();
    window._syncCondenseBtnVisibility = _syncCondBtnVisibility;
    wrap.appendChild(condBtn);

    // ── Mini-numbers toggle (v8.96) ──
    // A second collapse-display mode below the xN button. Same data
    // collapsing, but instead of "×N" each tile shows up to N-1 small
    // cyan copies of its number arranged in a grid below the white
    // main number. Mutually exclusive with the xN button — turning one
    // on automatically turns the other off.
    var miniBtn = document.createElement('button');
    miniBtn.id = 'miniTilesBtn';
    miniBtn.title = 'Mini-numbers (e.g. five 7s → one big 7 + four small 7s)';
    miniBtn.style.cssText = 'margin-top:4px;width:48px;height:24px;font-family:monospace;font-size:9px;font-weight:700;letter-spacing:0.5px;border:1px solid rgba(0,147,170,0.45);border-radius:5px;background:transparent;color:rgba(0,147,170,0.85);cursor:pointer;touch-action:manipulation;padding:0;line-height:1;display:flex;align-items:center;justify-content:center;';
    miniBtn.textContent = '####';
    try{
      var savedMini = localStorage.getItem('seqMiniTilesV1');
      window._miniPuzzleTiles = (savedMini === '1');
    }catch(e){
      window._miniPuzzleTiles = false;
    }
    // Defensive: if both flags somehow persist as on (shouldn't be
    // possible via the toggle handlers, but handles legacy state),
    // prefer the newer mini mode and clear the xN flag.
    if(window._miniPuzzleTiles && window._condensePuzzleTiles){
      window._condensePuzzleTiles = false;
      try{ localStorage.setItem('seqCondenseTilesV1','0'); }catch(e){}
      _paintCondBtn();
    }
    function _paintMiniBtn(){
      if(window._miniPuzzleTiles){
        miniBtn.style.background = 'rgba(0,147,170,0.28)';
        miniBtn.style.borderColor = '#0093aa';
        miniBtn.style.color = '#7dd3e0';
        miniBtn.style.boxShadow = '0 0 8px rgba(0,147,170,0.45)';
      } else {
        miniBtn.style.background = 'transparent';
        miniBtn.style.borderColor = 'rgba(0,147,170,0.45)';
        miniBtn.style.color = 'rgba(0,147,170,0.85)';
        miniBtn.style.boxShadow = '';
      }
    }
    _paintMiniBtn();
    // Expose so the xN toggle can repaint this button when it forces
    // mini off, and vice versa.
    window._paintMiniBtn = _paintMiniBtn;
    function _toggleMini(){
      // [v4.76] Same whole-operation scroll guard as _toggleCondense.
      var _miniScrollY = window.scrollY;
      var turningOn = !window._miniPuzzleTiles;
      if(turningOn){
        // Snap sliders to max size + zero gap, same as xN mode.
        try{
          window._condenseSliderSnapshot = {
            size: parseFloat(sl.value),
            gap: parseFloat(slGap.value)
          };
        }catch(e){
          window._condenseSliderSnapshot = null;
        }
        // Mutual exclusivity — turn off xN if it was on.
        if(window._condensePuzzleTiles){
          window._condensePuzzleTiles = false;
          try{ localStorage.setItem('seqCondenseTilesV1','0'); }catch(e){}
          _paintCondBtn();
        }
        // [v1.30] Mutual exclusivity with cyan mode too.
        if(window._allCyanPuzzleTiles){
          window._allCyanPuzzleTiles = false;
          try{ localStorage.setItem('seqCyanTilesV1','0'); }catch(e){}
          if(window._paintCyanBtn) window._paintCyanBtn();
        }
      }
      window._miniPuzzleTiles = turningOn;
      try{ localStorage.setItem('seqMiniTilesV1', turningOn ? '1' : '0'); }catch(e){}
      _paintMiniBtn();
      if(window._btnFx) window._btnFx(turningOn ? 'tool_on' : 'tool_off');
      // Apply slider changes (same logic as xN toggle).
      if(turningOn){
        // [v2.62] Default to 50 — see xN toggle above for rationale.
        sl.value = 50;
        slGap.value = 25;
        if(window.applyPctH) window.applyPctH(50);
        if(window.applyGapPct) window.applyGapPct(25);
        _drawVertPair(cv, hcv, 0.50);
        _drawVertPair(cvGap, hcvGap, 0.25);
      } else {
        var snap2 = window._condenseSliderSnapshot;
        var sizePct2 = snap2 ? snap2.size : 50;
        var gapPct2  = snap2 ? snap2.gap  : 25;
        sl.value = sizePct2;
        slGap.value = gapPct2;
        if(window.applyPctH) window.applyPctH(sizePct2);
        if(window.applyGapPct) window.applyGapPct(gapPct2);
        _drawVertPair(cv, hcv, sizePct2/100);
        _drawVertPair(cvGap, hcvGap, gapPct2/100);
      }
      renderBank();
      // [v4.76] Restore scroll across the resize (now + next two frames).
      var _restoreM = function(){ if(window.scrollY !== _miniScrollY) window.scrollTo(0, _miniScrollY); };
      _restoreM();
      requestAnimationFrame(function(){ _restoreM(); requestAnimationFrame(_restoreM); });
    }
    miniBtn.addEventListener('click', function(e){ e.stopPropagation(); _toggleMini(); });
    miniBtn.addEventListener('touchend', function(e){ e.stopPropagation(); }, {passive:true});
    window._equilToggleMini = _toggleMini;
    function _syncMiniBtnVisibility(){
      miniBtn.style.display = window._seqVisible ? 'none' : 'flex';
    }
    _syncMiniBtnVisibility();
    // Hook into the same sync the xN button uses so both toggle together
    // on SEQ-mode entry/exit. We wrap the existing _syncCondenseBtnVisibility
    // so callers don't need to change.
    var _origSyncCond = window._syncCondenseBtnVisibility;
    window._syncCondenseBtnVisibility = function(){
      if(_origSyncCond) _origSyncCond();
      _syncMiniBtnVisibility();
    };
    wrap.appendChild(miniBtn);

    // [v1.30] All-cyan tile mode toggle. Like mini, but no white
    // number on top — the entire tile is filled with cyan copies of
    // the value, sized large so they're easy to read. Mutually
    // exclusive with the other two modes.
    var cyanBtn = document.createElement('button');
    cyanBtn.id = 'cyanTilesBtn';
    cyanBtn.title = 'All-cyan tiles (e.g. five 7s → tile filled with five big cyan 7s)';
    cyanBtn.style.cssText = 'margin-top:4px;width:48px;height:24px;font-family:monospace;font-size:9px;font-weight:700;letter-spacing:0.5px;border:1px solid rgba(0,147,170,0.45);border-radius:5px;background:transparent;color:rgba(0,147,170,0.85);cursor:pointer;touch-action:manipulation;padding:0;line-height:1;display:flex;align-items:center;justify-content:center;';
    cyanBtn.textContent = '###';
    try{
      var savedCyan = localStorage.getItem('seqCyanTilesV1');
      window._allCyanPuzzleTiles = (savedCyan === '1');
    }catch(e){
      window._allCyanPuzzleTiles = false;
    }
    // Defensive: if cyan mode persisted as on alongside another mode,
    // prefer cyan and clear the others (matches the precedence in
    // renderBank).
    if(window._allCyanPuzzleTiles){
      if(window._condensePuzzleTiles){
        window._condensePuzzleTiles = false;
        try{ localStorage.setItem('seqCondenseTilesV1','0'); }catch(e){}
        if(_paintCondBtn) _paintCondBtn();
      }
      if(window._miniPuzzleTiles){
        window._miniPuzzleTiles = false;
        try{ localStorage.setItem('seqMiniTilesV1','0'); }catch(e){}
        if(_paintMiniBtn) _paintMiniBtn();
      }
    }
    function _paintCyanBtn(){
      if(window._allCyanPuzzleTiles){
        cyanBtn.style.background = 'rgba(0,147,170,0.28)';
        cyanBtn.style.borderColor = '#0093aa';
        cyanBtn.style.color = '#7dd3e0';
        cyanBtn.style.boxShadow = '0 0 8px rgba(0,147,170,0.45)';
      } else {
        cyanBtn.style.background = 'transparent';
        cyanBtn.style.borderColor = 'rgba(0,147,170,0.45)';
        cyanBtn.style.color = 'rgba(0,147,170,0.85)';
        cyanBtn.style.boxShadow = '';
      }
    }
    _paintCyanBtn();
    window._paintCyanBtn = _paintCyanBtn;
    function _toggleCyan(){
      // [v4.76] Same whole-operation scroll guard as _toggleCondense.
      var _cyanScrollY = window.scrollY;
      var turningOn = !window._allCyanPuzzleTiles;
      if(turningOn){
        // Snap sliders to max size + zero gap, same as the other modes.
        try{
          window._condenseSliderSnapshot = {
            size: parseFloat(sl.value),
            gap: parseFloat(slGap.value)
          };
        }catch(e){
          window._condenseSliderSnapshot = null;
        }
        // Mutual exclusivity.
        if(window._condensePuzzleTiles){
          window._condensePuzzleTiles = false;
          try{ localStorage.setItem('seqCondenseTilesV1','0'); }catch(e){}
          if(_paintCondBtn) _paintCondBtn();
        }
        if(window._miniPuzzleTiles){
          window._miniPuzzleTiles = false;
          try{ localStorage.setItem('seqMiniTilesV1','0'); }catch(e){}
          if(_paintMiniBtn) _paintMiniBtn();
        }
      }
      window._allCyanPuzzleTiles = turningOn;
      try{ localStorage.setItem('seqCyanTilesV1', turningOn ? '1' : '0'); }catch(e){}
      _paintCyanBtn();
      if(window._btnFx) window._btnFx(turningOn ? 'tool_on' : 'tool_off');
      if(turningOn){
        // [v2.62] Default to 50 to match new tuning anchor system.
        sl.value = 50;
        slGap.value = 25;
        // Note: cyan mode doesn't have anchor data yet (per user),
        // so the legacy direct TILE_SCALE assignment is preserved
        // for cyan specifically. _tuningApplyAll will fall through
        // to the off-mode anchors which approximate the old visual.
        if(window.applyPctH) window.applyPctH(50);
        if(window.applyGapPct) window.applyGapPct(25);
        var sizePct1 = parseFloat(sl.value) || 0;
        var gapPct1 = parseFloat(slGap.value) || 0;
        _drawVertPair(cv, hcv, sizePct1/100);
        _drawVertPair(cvGap, hcvGap, gapPct1/100);
      } else if(window._condenseSliderSnapshot){
        sl.value = window._condenseSliderSnapshot.size;
        slGap.value = window._condenseSliderSnapshot.gap;
        TILE_SCALE = window._condenseSliderSnapshot.size/100;
        TILE_GAP_MULT = window._condenseSliderSnapshot.gap/100;
        var sizePct2 = parseFloat(sl.value) || 0;
        var gapPct2 = parseFloat(slGap.value) || 0;
        _drawVertPair(cv, hcv, sizePct2/100);
        _drawVertPair(cvGap, hcvGap, gapPct2/100);
      }
      renderBank();
      // [v4.76] Restore scroll across the resize (now + next two frames).
      var _restoreC = function(){ if(window.scrollY !== _cyanScrollY) window.scrollTo(0, _cyanScrollY); };
      _restoreC();
      requestAnimationFrame(function(){ _restoreC(); requestAnimationFrame(_restoreC); });
    }
    cyanBtn.addEventListener('click', function(e){ e.stopPropagation(); _toggleCyan(); });
    cyanBtn.addEventListener('touchend', function(e){ e.stopPropagation(); }, {passive:true});
    window._equilToggleCyan = _toggleCyan;
    function _syncCyanBtnVisibility(){
      cyanBtn.style.display = window._seqVisible ? 'none' : 'flex';
    }
    _syncCyanBtnVisibility();
    // Hook into the same sync chain.
    var _origSyncCond2 = window._syncCondenseBtnVisibility;
    window._syncCondenseBtnVisibility = function(){
      if(_origSyncCond2) _origSyncCond2();
      _syncCyanBtnVisibility();
    };
    wrap.appendChild(cyanBtn);

    // Insert wrap before .bank
    var bankDiv=bankRow.querySelector('.bank');
    if(bankDiv) bankRow.insertBefore(wrap,bankDiv);

    // Touch drag — SIZE
    var _drag=false, _sy=0, _sp=50, _scrollLocked=false, _lockedScrollY=0;
    function _lockScroll(){
      if(_scrollLocked) return;
      _scrollLocked=true;
      _lockedScrollY=window.scrollY;
      document.body.style.overflow='hidden';
      document.body.style.position='fixed';
      document.body.style.top=(-_lockedScrollY)+'px';
      document.body.style.width='100%';
    }
    function _unlockScroll(){
      if(!_scrollLocked) return;
      _scrollLocked=false;
      document.body.style.overflow='';
      document.body.style.position='';
      document.body.style.top='';
      document.body.style.width='';
      window.scrollTo(0,_lockedScrollY);
    }
    canvasWrap.addEventListener('touchstart',function(e){
      e.preventDefault();
      _drag=true; _sy=e.touches[0].clientY; _sp=parseFloat(sl.value);
      _lockScroll();
      // [v2.53] Show the size readout overlay during canvas drag.
      // The slider's own touchstart handler already does this, but
      // touches on the canvas don't propagate to the input element,
      // so we duplicate the call here.
      if(window._equilShowSizeReadout) window._equilShowSizeReadout();
    },{passive:false});
    canvasWrap.addEventListener('touchmove',function(e){
      if(!_drag) return;
      e.preventDefault();
      if(window._sliderFx) window._sliderFx();
      var dy=_sy-e.touches[0].clientY;
      var h=canvasWrap.offsetHeight||100;
      var newPct=Math.max(0,Math.min(100,_sp+(dy/h)*100));
      sl.value=newPct;
      var rows=Math.round(1+(1-newPct/100)*15);
      if(window._seqVisible){
        window._seqTargetRows=rows;
        if(PZ) renderBank();
        if(window._syncPadAdjSize) window._syncPadAdjSize(newPct);
      } else {
        if(window.applyPctH) window.applyPctH(newPct);
        // [v2.63] Save user-driven slider position under the current
        // display mode (puzzle mode only — SEQ mode has its own
        // independent state).
        if(typeof window._tuningSaveSliderPos === 'function'
           && typeof window._tuningPersistMode === 'function'){
          try{ window._tuningSaveSliderPos(window._tuningPersistMode(), newPct); }catch(_){}
        }
      }
      _drawVertPair(cv,hcv,newPct/100);
      // [v2.53] Refresh the readout. applyPctH already calls this
      // hook (so SEQ-mode also works since renderBank is called),
      // but we call it explicitly here in case the early-return
      // paths skip applyPctH.
      if(window._equilUpdateSizeReadout) window._equilUpdateSizeReadout();
    },{passive:false});
    canvasWrap.addEventListener('touchend',function(){
      _drag=false; _unlockScroll();
      if(window._equilHideSizeReadout) window._equilHideSizeReadout();
    },{passive:true});
    canvasWrap.addEventListener('touchcancel',function(){
      _drag=false; _unlockScroll();
      if(window._equilHideSizeReadout) window._equilHideSizeReadout();
    },{passive:true});

    // Touch drag — GAP
    var _gDrag=false, _gSy=0, _gSp=33;
    gapWrap.addEventListener('touchstart',function(e){
      e.preventDefault();
      _gDrag=true; _gSy=e.touches[0].clientY; _gSp=parseFloat(slGap.value);
      _lockScroll();
    },{passive:false});
    gapWrap.addEventListener('touchmove',function(e){
      if(!_gDrag) return;
      e.preventDefault();
      if(window._sliderFx) window._sliderFx();
      var dy=_gSy-e.touches[0].clientY;
      var h=gapWrap.offsetHeight||100;
      var newPct=Math.max(0,Math.min(100,_gSp+(dy/h)*100));
      slGap.value=newPct;
      if(window.applyGapPct) window.applyGapPct(newPct);
      _drawVertPair(cvGap,hcvGap,newPct/100);
    },{passive:false});
    gapWrap.addEventListener('touchend',function(){ _gDrag=false; _unlockScroll(); },{passive:true});
    gapWrap.addEventListener('touchcancel',function(){ _gDrag=false; _unlockScroll(); },{passive:true});

    // Initial draw — the canvases are a bit fragile on first render
    // because they depend on their parent's actual laid-out pixel
    // size (via offsetWidth/offsetHeight). If we draw before layout
    // has settled, the canvas rasterizes at the fallback size and
    // CSS then stretches that low-res bitmap to the real display
    // size — which reads as fuzzy text until the first user drag
    // triggers a proper redraw. Fix: keep retrying the initial draw
    // via requestAnimationFrame until the parent has a real size,
    // and also install a ResizeObserver so any future size change
    // (orientation flip, SEQ-mode layout change, panel resize) gets
    // a fresh crisp draw automatically.
    function _initialVertDraws(){
      var ready = (canvasWrap.offsetWidth > 10 && canvasWrap.offsetHeight > 10
                 && gapWrap.offsetWidth > 10 && gapWrap.offsetHeight > 10);
      if(ready){
        _drawVertPair(cv, hcv, 0.5);
        if(window.applyPctH) window.applyPctH(50);
        _drawVertPair(cvGap, hcvGap, 0.333);
        if(window.applyGapPct) window.applyGapPct(33.33);
      } else {
        requestAnimationFrame(_initialVertDraws);
      }
    }
    requestAnimationFrame(_initialVertDraws);

    // ResizeObserver: keep the canvas rasters matched to actual
    // pixel dimensions whenever layout changes. Re-reads the slider's
    // current value so redraw uses the right handle position.
    if(window.ResizeObserver){
      var _vertResizeObs = new ResizeObserver(function(entries){
        for(var i=0; i<entries.length; i++){
          var el = entries[i].target;
          if(el === canvasWrap){
            _drawVertPair(cv, hcv, (parseFloat(sl.value)||50)/100);
          } else if(el === gapWrap){
            _drawVertPair(cvGap, hcvGap, (parseFloat(slGap.value)||33.33)/100);
          }
        }
      });
      _vertResizeObs.observe(canvasWrap);
      _vertResizeObs.observe(gapWrap);
    }

    // Expose sync for applyPctH / applyGapPct
    window._syncVertSizeBar=function(pct){
      sl.value=pct;
      _drawVertPair(cv,hcv,pct/100);
    };
    window._syncVertGapBar=function(pct){
      slGap.value=pct;
      _drawVertPair(cvGap,hcvGap,pct/100);
    };
  }

  // Run after everything is registered (drawMixerSliderV is set up later in the file)
  window.addEventListener('load', _buildBar);
})();

// ─────────────────────────────────────────────────────────────
// [v1.74] TILE-CONTROLS ROW + ADJUST MODAL
// ─────────────────────────────────────────────────────────────
// New full-width controls row beneath the bank: ADJUST + the
// three tile-display modes (×N / mini / cyan). The mode buttons
// don't reimplement toggle logic — they forward clicks to the
// original buttons inside the in-bank slider strip (#condenseTilesBtn,
// #miniTilesBtn, #cyanTilesBtn). The strip itself is hidden via
// CSS in puzzle mode but the buttons are still in the DOM and
// fully functional, so this is just a UI relay.
//
// ADJUST opens a modal containing the SIZE+GAP slider widgets.
// The widgets live inside #sizeCanvasWrap which sits in .bank-row
// at startup. On modal open, the wrap is moved into the modal's
// slider area; on close, it's moved back to its original parent.
// All existing slider event handlers are captured in closures by
// the slider IIFE, so DOM relocation doesn't break them.
(function(){
  var _wired = false;
  function _wireWhenReady(){
    // Idempotent — running twice (DOMContentLoaded + load) was
    // attaching the relay click listener TWICE per button. Each
    // click fired both listeners, each dispatched a synthetic
    // click on the original, original toggled twice → flag ended
    // up back at its starting state. Visible symptom: tile size
    // changed (slider snap fires once) but mode flag never
    // stuck. This guard ensures the wiring runs at most once.
    if(_wired) return;
    var adjustBtn = document.getElementById('tileAdjustBtn');
    var modeXn    = document.getElementById('tileModeXn');
    var modeMini  = document.getElementById('tileModeMini');
    var modeCyan  = document.getElementById('tileModeCyan');
    var modal     = document.getElementById('tileAdjustModal');
    var modalSliders = document.getElementById('tileAdjustModalSliders');
    var modalClose = document.getElementById('tileAdjustModalClose');
    if(!adjustBtn || !modal || !modalSliders) return;
    _wired = true;

    // ── Mode buttons (call toggle functions directly) ──
    // We call window._equilToggleCondense/Mini/Cyan directly rather
    // than dispatching a synthetic click on the original (now-hidden)
    // toggle button. The synthetic-click approach worked for the
    // toggle logic but seemed to cause scroll-to-top — likely because
    // a click on a display:none button has weird browser defaults
    // (focus-into-view, form-submit semantics on type-default <button>,
    // etc). A direct function call has none of those side effects.
    function _relay(srcBtn, fnName){
      if(!srcBtn) return;
      srcBtn.addEventListener('click', function(e){
        e.preventDefault();
        e.stopPropagation();
        // [v2.88] Display-mode buttons (xN / #### / cyan) get the
        // same open/close chirps as the TILE ADJUST modal. Read
        // the button's active state BEFORE calling the toggle: if
        // it was inactive, the user is turning this mode ON →
        // open chirp; if it was active, they're turning it off →
        // close chirp. The toggle may incidentally turn OTHER
        // mode flags off as a side effect (modes are mutually
        // exclusive), but we don't chirp for those — only the
        // button the user actually tapped, since that's the one
        // they'll associate the sound with.
        // [v2.89] Calling the chirp functions directly via closure
        // rather than window.* — they're defined later in the same
        // IIFE so closure resolution sees them by the time a click
        // happens. Function declarations are hoisted, so this is
        // safe even though the `function _modalOpenChirp(){}`
        // appears textually below this point. Also doubled up with
        // a console log so we can verify the click path is
        // reached if a future regression breaks the wiring.
        var wasActive = srcBtn.classList.contains('active');
        try{
          if(wasActive) _modalCloseChirp(); else _modalOpenChirp();
        }catch(_chirpErr){
          // Fall back to the window-exposed copies in case the
          // closure binding failed for some reason.
          try{
            if(wasActive){
              if(window._modalCloseChirp) window._modalCloseChirp();
            } else {
              if(window._modalOpenChirp) window._modalOpenChirp();
            }
          }catch(__){}
        }
        // [v2.90] The toggle functions (_toggleCondense / Mini /
        // Cyan) internally call window._btnFx('tool_on'|'tool_off')
        // which plays a woodblock SFX. That woodblock used to BE
        // the only sound on these buttons — pre-v2.88 — and was
        // overshadowing our new chirps. We don't want to remove
        // the woodblock from the toggle functions outright because
        // OTHER call sites still use those toggles (the original
        // dynamically-created condBtn/miniBtn/cyanBtn elsewhere).
        // Instead we set a transient flag that _btnFx checks and
        // honors — suppress the very next call, then auto-reset.
        window._btnFxSuppressOnce = true;
        var fn = window[fnName];
        if(typeof fn === 'function'){
          try{ fn(); } catch(err){}
        }
        // Defensive cleanup — if the toggle path didn't actually
        // consume the suppression flag (e.g., guarded out by an
        // SFX setting), clear it so it doesn't silently swallow a
        // future _btnFx call from somewhere unrelated.
        window._btnFxSuppressOnce = false;
        _refreshModeBtnStates();
        setTimeout(_refreshModeBtnStates, 50);
        // [v2.59] If the modal is open, rebuild the spacing-slider
        // set so it reflects the newly-active display mode (xN, mini,
        // or cyan/none).
        if(typeof window._equilRebuildXnSpacingSliders === 'function'){
          try{ window._equilRebuildXnSpacingSliders(); }catch(_){}
        }
        // [v2.62/v2.63] Re-apply the tuning system at the new mode's
        // remembered slider position. The toggle handler set the
        // slider to 50% (the default anchor), but if the user has
        // previously set the slider to a different position in this
        // mode, we want to restore THAT position instead.
        // Falls back to whatever the slider currently is if no
        // remembered position exists for this mode.
        try{
          var sl = document.querySelector('#sizeCanvasInner input[type=range]');
          if(sl && typeof window.applyPctH === 'function'){
            var newPct;
            if(typeof window._tuningLoadSliderPos === 'function'
               && typeof window._tuningPersistMode === 'function'){
              var saved = window._tuningLoadSliderPos(window._tuningPersistMode());
              newPct = (typeof saved === 'number') ? saved : parseFloat(sl.value);
            } else {
              newPct = parseFloat(sl.value);
            }
            if(!isNaN(newPct)) window.applyPctH(newPct);
          }
        }catch(_){}
      });
    }
    _relay(modeXn,   '_equilToggleCondense');
    _relay(modeMini, '_equilToggleMini');
    _relay(modeCyan, '_equilToggleCyan');

    // Reflect mode state on the new buttons (active class when on).
    function _refreshModeBtnStates(){
      try{
        if(modeXn)   modeXn.classList.toggle('active',   !!window._condensePuzzleTiles);
        if(modeMini) modeMini.classList.toggle('active', !!window._miniPuzzleTiles);
        if(modeCyan) modeCyan.classList.toggle('active', !!window._allCyanPuzzleTiles);
      }catch(e){}
    }
    _refreshModeBtnStates();
    // Re-sync periodically so external state changes (localStorage
    // load, toggling via the original buttons if ever visible, etc.)
    // get reflected. Cheap polling is the simplest reliable hookup
    // since the original IIFE doesn't expose change events.
    setInterval(_refreshModeBtnStates, 500);

    // ── ADJUST modal ──
    // [v2.52] Build the xN tile spacing sliders into the modal once,
    // here during wiring. Two horizontal sliders: White top offset
    // and Number gap. Both percentages of tile size, applied via the
    // same _applyTuning + _saveOpts code path as the OPTIONS panel.
    // The xN spacing settings only visibly affect xN-mode tiles, but
    // we always show the sliders so the user can find them — they
    // just have no visual effect when xN mode isn't active.
    var xnSpacingBox = document.getElementById('tileAdjustModalXnSpacing');
    if(xnSpacingBox){
      // Defaults — must match the DEF block in the OPTIONS-panel IIFE.
      var XN_TOP_DEFAULT = 4;
      var XN_GAP_DEFAULT = 0;
      var XN_WMULT_DEFAULT = 1.0;
      var XN_CMULT_DEFAULT = 1.0;
      // [v2.57] Mini-mode defaults — parallel to xN.
      var MINI_TOP_DEFAULT     = 6;
      var MINI_GAP_DEFAULT     = 0;
      var MINI_ROWGAP_DEFAULT  = 0.5;
      var MINI_COLGAP_DEFAULT  = 0.5;
      var MINI_WMULT_DEFAULT   = 1.0;
      var MINI_CMULT_DEFAULT   = 1.0;

      // [v2.62] Slider registry — every _buildXnSlider call pushes
      // (input, val, getter, suffix) so the size slider's tuning
      // system can refresh knob positions when it interpolates new
      // values. Cleared at the start of each _rebuildXnSpacingSliders.
      var _advancedSliderRegistry = [];

      function _buildXnSlider(label, getter, setter, min, max, step, suffix){
        suffix = suffix || ' %';
        var row = document.createElement('div');
        row.style.cssText =
          'display:flex;flex-direction:column;gap:2px;'+
          'padding:4px 6px;background:rgba(0,0,0,0.25);'+
          'border-radius:4px;';
        var hdr = document.createElement('div');
        hdr.style.cssText =
          'display:flex;justify-content:space-between;align-items:baseline;'+
          'font-family:IBM Plex Mono,monospace;font-size:9.5px;'+
          'color:rgba(255,255,255,0.7);letter-spacing:0.5px;';
        var lbl = document.createElement('span');
        lbl.textContent = label;
        var val = document.createElement('span');
        val.style.cssText = 'color:#a855f7;font-weight:700;';
        val.textContent = getter().toFixed(2) + suffix;
        hdr.appendChild(lbl);
        hdr.appendChild(val);
        var input = document.createElement('input');
        input.type = 'range';
        input.min = min; input.max = max; input.step = step;
        input.value = getter();
        input.style.cssText =
          'width:100%;accent-color:#a855f7;';
        input.addEventListener('input', function(){
          var v = parseFloat(input.value);
          setter(v);
          val.textContent = v.toFixed(2) + suffix;
          // Apply (re-render bank) + persist to localStorage.
          if(typeof window._equilApplyTuning === 'function') window._equilApplyTuning();
          if(typeof window._equilSaveOpts === 'function') window._equilSaveOpts();
        });
        row.appendChild(hdr);
        row.appendChild(input);
        // Register for size-slider-driven refresh.
        _advancedSliderRegistry.push({input: input, val: val, getter: getter, suffix: suffix});
        return row;
      }

      // [v2.62] Expose the registry-refresh function on window so the
      // tuning system can pull slider knobs to interpolated values
      // when the size slider moves.
      window._equilRefreshAdvancedKnobs = function(){
        for(var i = 0; i < _advancedSliderRegistry.length; i++){
          var s = _advancedSliderRegistry[i];
          try{
            var v = s.getter();
            if(typeof v === 'number' && !isNaN(v)){
              s.input.value = v;
              s.val.textContent = v.toFixed(2) + s.suffix;
            }
          }catch(_){}
        }
      };

      // [v2.57] Build the appropriate slider set based on which display
      // mode is currently active. xN and mini have parallel concepts
      // but separately persisted values (so they can be tuned
      // independently). Called from _openModal so the user always
      // sees the relevant set when they open ADJUST.
      function _rebuildXnSpacingSliders(){
        xnSpacingBox.innerHTML = '';
        // [v2.62] Clear the slider registry; new slider set's
        // refresh hooks will be re-registered as _buildXnSlider runs.
        _advancedSliderRegistry.length = 0;
        var isMini = !!window._miniPuzzleTiles && !window._allCyanPuzzleTiles;
        var isXn   = !!window._condensePuzzleTiles && !window._miniPuzzleTiles && !window._allCyanPuzzleTiles;
        // [v2.59] Hide the ADVANCED toggle entirely in cyan or
        // no-mode states — those modes don't have any tunable
        // spacing/font sliders. The toggle reappears when the user
        // switches to xN or mini.
        var advBtn = document.getElementById('tileAdjustModalAdvancedToggle');
        if(advBtn){
          if(isMini || isXn){
            advBtn.style.display = '';
          } else {
            advBtn.style.display = 'none';
            // Also collapse any open-state if the user switches to
            // a no-advanced mode while it was expanded.
            xnSpacingBox.classList.remove('expanded');
          }
        }
        if(!isMini && !isXn){
          // Cyan / none — nothing to show in the advanced area.
          return;
        }
        // Header label so the user knows which mode they're tuning.
        var modeLabel = document.createElement('div');
        modeLabel.style.cssText =
          'font-family:IBM Plex Mono,monospace;font-size:9px;font-weight:700;'+
          'color:rgba(168,85,247,0.7);letter-spacing:1.5px;text-align:center;'+
          'padding:2px 0;';
        if(isMini){
          modeLabel.textContent = '#### MODE TUNING';
        } else {
          modeLabel.textContent = 'xN MODE TUNING';
        }
        xnSpacingBox.appendChild(modeLabel);

        if(isMini){
          // ── Mini-mode sliders ──
          xnSpacingBox.appendChild(_buildXnSlider(
            'WHITE TOP OFFSET',
            function(){ return (typeof window._optMiniTopPct==='number') ? window._optMiniTopPct : MINI_TOP_DEFAULT; },
            function(v){ window._optMiniTopPct = v; },
            -20, 20, 0.5
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'NUMBER GAP',
            function(){ return (typeof window._optMiniGapPct==='number') ? window._optMiniGapPct : MINI_GAP_DEFAULT; },
            function(v){ window._optMiniGapPct = v; },
            -30, 30, 0.5
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'ROW SPACING',
            function(){ return (typeof window._optMiniRowGapPct==='number') ? window._optMiniRowGapPct : MINI_ROWGAP_DEFAULT; },
            function(v){ window._optMiniRowGapPct = v; },
            // [v2.58] Range -10 to +5. Negative pulls cyan rows
            // closer / overlapping (via per-item negative margin
            // since CSS gap clamps negatives to 0). User typically
            // tunes around 0 to small positive values; negative is
            // for tightening dense grids.
            -10, 5, 0.25
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'COLUMN SPACING',
            function(){ return (typeof window._optMiniColGapPct==='number') ? window._optMiniColGapPct : MINI_COLGAP_DEFAULT; },
            function(v){ window._optMiniColGapPct = v; },
            -10, 5, 0.25
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'WHITE FONT SIZE',
            function(){ return (typeof window._optMiniWhiteMult==='number') ? window._optMiniWhiteMult : MINI_WMULT_DEFAULT; },
            function(v){ window._optMiniWhiteMult = v; },
            // [v2.61] Max bumped from 2.0 to 3.0 for mini mode —
            // the white digit is the only visible text in
            // single-instance tiles and benefits from being more
            // prominent. Cyan max stays at 2.0 since the cyan grid
            // doesn't need to go that big.
            0.3, 3.0, 0.05, ' ×'
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'CYAN FONT SIZE',
            function(){ return (typeof window._optMiniCyanMult==='number') ? window._optMiniCyanMult : MINI_CMULT_DEFAULT; },
            function(v){ window._optMiniCyanMult = v; },
            0.3, 2.0, 0.05, ' ×'
          ));
        } else {
          // ── xN-mode sliders ──
          xnSpacingBox.appendChild(_buildXnSlider(
            'WHITE TOP OFFSET',
            function(){ return (typeof window._optXnTopPct==='number') ? window._optXnTopPct : XN_TOP_DEFAULT; },
            function(v){ window._optXnTopPct = v; },
            -20, 20, 0.5
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'NUMBER GAP',
            function(){ return (typeof window._optXnGapPct==='number') ? window._optXnGapPct : XN_GAP_DEFAULT; },
            function(v){ window._optXnGapPct = v; },
            -30, 30, 0.5
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'WHITE FONT SIZE',
            function(){ return (typeof window._optXnWhiteMult==='number') ? window._optXnWhiteMult : XN_WMULT_DEFAULT; },
            function(v){ window._optXnWhiteMult = v; },
            0.3, 2.0, 0.05, ' ×'
          ));
          xnSpacingBox.appendChild(_buildXnSlider(
            'CYAN FONT SIZE',
            function(){ return (typeof window._optXnCyanMult==='number') ? window._optXnCyanMult : XN_CMULT_DEFAULT; },
            function(v){ window._optXnCyanMult = v; },
            0.3, 2.0, 0.05, ' ×'
          ));
        }
        // [v2.65] Append a drag-handle area at the bottom of the
        // panel — same horizontal-line pattern as the bottom drag
        // strips flanking DONE. Both modes get the same compact
        // area now (panel no longer stretches to match main box
        // height, so xN's previously-large empty space is gone).
        var advDragArea = document.createElement('div');
        advDragArea.className = 'tileAdjustAdvancedDragArea';
        xnSpacingBox.appendChild(advDragArea);
        // Wire drag if the helper has been exposed yet. If not
        // (this is the initial build called before modal wiring
        // runs), the modal wiring will pick it up via the same
        // hook on its first execution.
        if(typeof window._equilWireAdvancedDragArea === 'function'){
          window._equilWireAdvancedDragArea(advDragArea);
        }
      }
      // Initial build (for first-open before mode toggles).
      _rebuildXnSpacingSliders();
      // Expose so _openModal can rebuild based on current mode.
      window._equilRebuildXnSpacingSliders = _rebuildXnSpacingSliders;
    }

    var _origParent = null; // remember where #sizeCanvasWrap was
    var _origNextSibling = null;
    // [v2.87] Modal open/close sound effects. Brief sine chirps —
    // upward for open, downward for close. Short and gestural so
    // they feel like UI feedback rather than music. Lives outside
    // the SOUND_STYLE dispatch because this is a navigation cue,
    // not gameplay (similar to how the wind sound is style-
    // independent). Falls back silent if AC isn't ready.
    // [v2.88] Hoisted onto window so the display-mode buttons (xN /
    // #### / cyan) can reuse them — same chirp family for any
    // modal-or-mode toggle, since they're the same kind of "open /
    // close a thing" gesture from the user's perspective.
    function _modalOpenChirp(){
      try{
        if(window._sfxOn===false||!AC) return; resumeAC();
        var t0=AC.currentTime;
        var g=AC.createGain();g.connect(AC.destination);
        g.gain.setValueAtTime(0.0001,t0);
        // [v2.89] Peak gain bumped 0.10 → 0.16. Modal-open chirps
        // were arguably audible before but easy to miss when the
        // user was already focused on the visual change. The
        // display-mode buttons fire much more rapidly than the
        // modal so even a clearly-audible chirp will feel light.
        g.gain.exponentialRampToValueAtTime(0.16,t0+0.005);
        g.gain.exponentialRampToValueAtTime(0.0001,t0+0.080);
        var o=AC.createOscillator();o.type='sine';
        o.frequency.setValueAtTime(523,t0);                       // C5
        o.frequency.exponentialRampToValueAtTime(880,t0+0.07);    // up to A5
        o.connect(g);o.start(t0);o.stop(t0+0.10);
      }catch(_){}
    }
    function _modalCloseChirp(){
      try{
        if(window._sfxOn===false||!AC) return; resumeAC();
        var t0=AC.currentTime;
        var g=AC.createGain();g.connect(AC.destination);
        g.gain.setValueAtTime(0.0001,t0);
        // [v2.89] Same gain bump as _modalOpenChirp.
        g.gain.exponentialRampToValueAtTime(0.16,t0+0.005);
        g.gain.exponentialRampToValueAtTime(0.0001,t0+0.080);
        var o=AC.createOscillator();o.type='sine';
        o.frequency.setValueAtTime(880,t0);                       // A5
        o.frequency.exponentialRampToValueAtTime(523,t0+0.07);    // down to C5
        o.connect(g);o.start(t0);o.stop(t0+0.10);
      }catch(_){}
    }
    window._modalOpenChirp  = _modalOpenChirp;
    window._modalCloseChirp = _modalCloseChirp;
    function _openModal(){
      var wrap = document.getElementById('sizeCanvasWrap');
      if(wrap){
        _origParent = wrap.parentNode;
        _origNextSibling = wrap.nextSibling;
        modalSliders.appendChild(wrap);
      }
      // [v2.57] Rebuild the spacing sliders to match the active
      // display mode. xN and mini have parallel concepts but
      // separately persisted values; the rebuild swaps which
      // slider set is shown.
      if(typeof window._equilRebuildXnSpacingSliders === 'function'){
        try{ window._equilRebuildXnSpacingSliders(); }catch(_){}
      }
      modal.classList.add('open');
      // [v2.16] Mark the button active so it picks up the purple
      // styling defined by .tile-controls-row > button.active —
      // matches the display-mode buttons' open/active state.
      adjustBtn.classList.add('active');
      // [v2.87] Open chirp.
      _modalOpenChirp();
    }
    function _closeModal(){
      var wrap = document.getElementById('sizeCanvasWrap');
      if(wrap && _origParent){
        if(_origNextSibling && _origNextSibling.parentNode === _origParent){
          _origParent.insertBefore(wrap, _origNextSibling);
        } else {
          _origParent.appendChild(wrap);
        }
      }
      _origParent = null;
      _origNextSibling = null;
      modal.classList.remove('open');
      adjustBtn.classList.remove('active');
      // [v2.87] Close chirp (mirror of open chirp).
      _modalCloseChirp();
    }
    adjustBtn.addEventListener('click', _openModal);
    modalClose.addEventListener('click', _closeModal);
    // [v1.81] Backdrop-click close is inert now since the overlay
    // has pointer-events:none (so taps outside the modal box pass
    // through to the page rather than dismissing). Listener kept
    // in case the overlay style is reverted; close via DONE button
    // is the only path while pointer-events:none is in effect.
    modal.addEventListener('click', function(e){
      if(e.target === modal) _closeModal();
    });

    // ── [v2.59/v2.60] DRAG SUPPORT FOR MODAL ──
    // The modal can be dragged anywhere on screen via the two
    // drag handles flanking the DONE button. Position persists in
    // localStorage across sessions. Wind sound (same one the
    // floating pill uses) plays during drag past the threshold.
    // [v2.60] Position is set on the OUTER wrapper (which contains
    // both the main box AND the side-extending advanced panel as
    // flex siblings), so dragging moves both pieces together.
    // Clamping uses the main box's dimensions, not the wrapper's,
    // so the user-visible "modal" stays on screen even if the
    // advanced panel extends off the right edge.
    var outer = document.getElementById('tileAdjustModalOuter');
    var box   = document.getElementById('tileAdjustModalBox');
    var dragHandles = document.querySelectorAll('.tileAdjustDragHandle');
    var POS_KEY = 'equilTileAdjustModalPos';
    var DRAG_THRESH = 6;
    var _modalLastLeft = null;
    var _modalLastTop  = null;
    function _loadModalPos(){
      try{
        var raw = localStorage.getItem(POS_KEY);
        if(!raw) return;
        var p = JSON.parse(raw);
        if(typeof p.left === 'number' && typeof p.top === 'number'){
          _modalLastLeft = p.left;
          _modalLastTop  = p.top;
        }
      }catch(_){}
    }
    function _saveModalPos(){
      try{
        if(_modalLastLeft === null || _modalLastTop === null) return;
        localStorage.setItem(POS_KEY, JSON.stringify({
          left: _modalLastLeft, top: _modalLastTop
        }));
      }catch(_){}
    }
    function _clampPos(x, y){
      // [v2.60] Clamp using MAIN BOX dimensions, not the outer
      // wrapper. The advanced panel can extend off the right edge
      // (that's the whole point of the side-extending design — it
      // covers the puzzle area which the user said they don't care
      // about). Keep at least 60px of the main box visible from
      // each side of the screen, top stays at 0+, and 40px stays
      // visible from the bottom.
      var bw = box.offsetWidth  || 240;
      var bh = box.offsetHeight || 200;
      var minX = -(bw - 60);
      var maxX = window.innerWidth - 60;
      var minY = 0;
      var maxY = window.innerHeight - 40;
      return {
        x: Math.max(minX, Math.min(maxX, x)),
        y: Math.max(minY, Math.min(maxY, y))
      };
    }
    function _applyModalPos(){
      if(_modalLastLeft === null || _modalLastTop === null) return;
      var p = _clampPos(_modalLastLeft, _modalLastTop);
      outer.style.left = p.x + 'px';
      outer.style.top  = p.y + 'px';
    }
    function _setDefaultModalPos(){
      // Default placement: horizontally centered, near top of screen.
      // Wait for the box to have layout dimensions before computing
      // — defer to next frame if not yet measurable.
      var bw = box.offsetWidth;
      var bh = box.offsetHeight;
      if(bw < 10 || bh < 10){
        requestAnimationFrame(_setDefaultModalPos);
        return;
      }
      _modalLastLeft = Math.round((window.innerWidth - bw) / 2);
      _modalLastTop  = 16;
      _applyModalPos();
    }
    _loadModalPos();

    // Patch _openModal to apply remembered position (or default).
    var _origOpenModal = _openModal;
    _openModal = function(){
      _origOpenModal();
      // Position must be set after the modal is shown so offsetWidth
      // is non-zero.
      requestAnimationFrame(function(){
        if(_modalLastLeft === null || _modalLastTop === null){
          _setDefaultModalPos();
        } else {
          _applyModalPos();
        }
      });
    };
    // Re-bind the open handler so the new patched function is the
    // one called by the ADJUST button (the addEventListener call
    // above captured the old reference).
    // [v2.64] The button now TOGGLES the modal — open if closed,
    // close if open. Lets the user dismiss with the same button
    // they opened it with, for fewer round trips when iterating
    // on tile look settings. The DONE button still works for
    // close as well.
    adjustBtn.removeEventListener('click', _origOpenModal);
    function _toggleModal(){
      if(modal.classList.contains('open')){
        _closeModal();
      } else {
        _openModal();
      }
    }
    adjustBtn.addEventListener('click', _toggleModal);

    // ── Drag handler wiring on each drag handle ──
    // [v2.87] _attachDrag now takes an optional `interactiveSel`
    // selector. If a touch starts on an element that matches this
    // selector (or is a descendant of one), the drag is skipped so
    // the element's own click/touch handler still fires normally.
    // Used to attach drag to the whole modal box without breaking
    // the sliders, the ADVANCED toggle button, or the DONE button.
    // The original side-handles + title don't need a filter (they
    // contain no interactive children) so that callsite still
    // passes nothing.
    function _attachDrag(handle, interactiveSel){
      var dragging = false;
      var moved = false;
      var grabDx = 0, grabDy = 0;
      var startX = 0, startY = 0;
      handle.addEventListener('touchstart', function(e){
        // [v2.87] If the touch began on an interactive descendant
        // (slider thumb, toggle button, DONE button), abort —
        // let the normal handler take over. Otherwise the modal
        // would drag instead of the slider responding, etc.
        if(interactiveSel){
          var tgt = e.target;
          if(tgt && tgt.closest && tgt.closest(interactiveSel)){
            return;
          }
        }
        e.preventDefault();
        e.stopPropagation();
        var t = e.touches[0];
        // [v2.60] Read position from the OUTER wrapper since that's
        // the element that's positioned. The main box's getBoundingClientRect
        // would give the same left/top (since it's the first flex child)
        // but the wrapper's is more semantically correct.
        var r = outer.getBoundingClientRect();
        grabDx = t.clientX - r.left;
        grabDy = t.clientY - r.top;
        startX = r.left; startY = r.top;
        dragging = true; moved = false;
      }, {passive:false});
      handle.addEventListener('touchmove', function(e){
        if(!dragging) return;
        e.preventDefault();
        var t = e.touches[0];
        if(!moved){
          if(Math.abs(t.clientX - grabDx - startX) > DRAG_THRESH
             || Math.abs(t.clientY - grabDy - startY) > DRAG_THRESH){
            moved = true;
            // Wind sound — same as the floating pill drag.
            var w = (window._dragWind || null); if(w) w.start();
          }
        }
        var nx = t.clientX - grabDx;
        var ny = t.clientY - grabDy;
        var p = _clampPos(nx, ny);
        outer.style.left = p.x + 'px';
        outer.style.top  = p.y + 'px';
        _modalLastLeft = p.x;
        _modalLastTop  = p.y;
      }, {passive:false});
      function _endDrag(){
        if(dragging && moved){
          var w = (window._dragWind || null); if(w) w.stop();
          _saveModalPos();
        }
        dragging = false;
        moved = false;
      }
      handle.addEventListener('touchend',    _endDrag, {passive:true});
      handle.addEventListener('touchcancel', _endDrag, {passive:true});
    }
    dragHandles.forEach(function(h){ _attachDrag(h); });
    // [v2.64] Also attach drag to the title bar — it's a much larger
    // grab target than the slim handles flanking the DONE button,
    // and now that the ADVANCED panel slides out to the SIDE (not
    // down), the modal stays short enough that the title is always
    // a comfortable thumb reach near the top edge of the modal.
    var titleEl = document.getElementById('tileAdjustModalTitle');
    if(titleEl) _attachDrag(titleEl);
    // [v2.87] Make the entire modal BOX draggable, not just the
    // narrow strips. Filter excludes the interactive children so
    // sliders, toggles, and DONE still work normally — only the
    // empty "padding" areas around them initiate a drag. This is
    // the user's "side areas" feedback: the box has empty real
    // estate around the controls that's now grab-targets too.
    if(box){
      _attachDrag(box,
        'input, button, label, .arrow, ' +
        '#tileAdjustModalSliders, #tileAdjustModalSliders *, ' +
        '#tileAdjustModalXnSpacing, #tileAdjustModalXnSpacing *, ' +
        '.tileAdjustAdvancedDragArea, .tileAdjustDragHandle');
    }
    // [v2.65] Expose the drag attach so the advanced-panel rebuild
    // can wire its own bottom drag area each time the panel rebuilds.
    window._equilWireAdvancedDragArea = _attachDrag;
    // Wire any drag area created during the initial build (which
    // happened before _attachDrag was exposed).
    var existingAdvDrag = document.querySelector('.tileAdjustAdvancedDragArea');
    if(existingAdvDrag) _attachDrag(existingAdvDrag);

    // ── ADVANCED toggle wiring ──
    // Toggles a CSS class on #tileAdjustModalXnSpacing that triggers
    // the slide-down animation. Arrow rotates ▶ → ▼ on expand. State
    // persisted so the user's preference sticks across sessions.
    var advBtn  = document.getElementById('tileAdjustModalAdvancedToggle');
    var advBox  = xnSpacingBox; // the spacing-sliders container
    var advArrowSpan = advBtn ? advBtn.querySelector('.arrow') : null;
    var ADV_KEY = 'equilTileAdjustAdvancedExpanded';
    // [v2.94] Fwoosh sound for the ADVANCED panel toggle. Designed
    // to feel like a panel sliding open / closing — filtered noise
    // burst with a swept lowpass and a quick gain envelope. Two
    // variants: open sweeps the cutoff UPWARD (closed→open feels
    // like air rushing in), close sweeps DOWNWARD (open→closed
    // feels like air rushing out). Reuses the same noise-buffer
    // approach as the air-puff "New" sound but longer (~280ms)
    // so it reads as a transition rather than a tap.
    function _advFwoosh(opening){
      try{
        if(!AC) return; resumeAC();
        var t0=AC.currentTime;
        var dur=0.28;
        var len=Math.max(1, Math.floor(AC.sampleRate*dur));
        var buf=AC.createBuffer(1, len, AC.sampleRate);
        var data=buf.getChannelData(0);
        for(var i=0;i<len;i++) data[i] = (Math.random()*2-1);
        var src=AC.createBufferSource(); src.buffer=buf;
        var lp=AC.createBiquadFilter(); lp.type='lowpass';
        lp.Q.value=0.7;
        if(opening){
          // Air rushing IN — cutoff sweeps low → high.
          lp.frequency.setValueAtTime(500, t0);
          lp.frequency.exponentialRampToValueAtTime(2800, t0+dur);
        } else {
          // Air rushing OUT — cutoff sweeps high → low.
          lp.frequency.setValueAtTime(2800, t0);
          lp.frequency.exponentialRampToValueAtTime(500, t0+dur);
        }
        var g=AC.createGain();
        // Gentle fade-in, longer fade-out so the sound has natural
        // breath. Peak gain 0.08 — quieter than the chirps because
        // noise has more spectral mass than a sine tone.
        g.gain.setValueAtTime(0.0001, t0);
        g.gain.exponentialRampToValueAtTime(0.08, t0+0.04);
        g.gain.exponentialRampToValueAtTime(0.0001, t0+dur);
        src.connect(lp); lp.connect(g); g.connect(AC.destination);
        src.start(t0); src.stop(t0+dur+0.02);
      }catch(_){}
    }
    function _setAdvancedState(expanded){
      if(!advBox) return;
      if(expanded){
        advBox.classList.add('expanded');
        if(advArrowSpan) advArrowSpan.textContent = '▼';
      } else {
        advBox.classList.remove('expanded');
        if(advArrowSpan) advArrowSpan.textContent = '▶';
      }
      try{ localStorage.setItem(ADV_KEY, expanded ? '1' : '0'); }catch(_){}
    }
    // Restore previous state.
    try{
      var savedAdv = localStorage.getItem(ADV_KEY);
      if(savedAdv === '1') _setAdvancedState(true);
    }catch(_){}
    if(advBtn){
      advBtn.addEventListener('click', function(e){
        e.preventDefault();
        e.stopPropagation();
        // [v2.94] Fwoosh on toggle — direction of the noise sweep
        // matches the visual gesture (panel sliding out vs in).
        var willOpen = !advBox.classList.contains('expanded');
        _advFwoosh(willOpen);
        _setAdvancedState(willOpen);
      });
    }
  }
  if(document.readyState === 'loading'){
    document.addEventListener('DOMContentLoaded', _wireWhenReady);
  } else {
    _wireWhenReady();
  }
  // Also retry on load in case the slider IIFE hadn't built #sizeCanvasWrap yet.
  window.addEventListener('load', _wireWhenReady);
})();

// ─────────────────────────────────────────────────────────────
// [v1.82] DRAG-TO-PLACE — drag a bank tile onto a cell
// ─────────────────────────────────────────────────────────────
// Adds touch drag-and-drop on bank tiles. Workflow:
//   1. touchstart on a .bt[data-bank-idx]: record start position
//      and bank index, but don't enter drag mode yet (so a
//      regular tap still works for the existing tap-tile flow).
//   2. touchmove: if the touch has moved more than DRAG_THRESHOLD
//      pixels from the start, enter drag mode — create a ghost
//      element that follows the finger.
//   3. touchend in drag mode: hit-test the cell under the finger
//      via elementFromPoint, find its data-cell-key, and place
//      the tile there by calling the existing place(idx) function
//      (which handles "drop replaces existing value" automatically
//      — when SEL points at a filled cell, place() returns that
//      cell's old value to the bank before placing the new one).
//   4. touchend in non-drag mode: do nothing here — the existing
//      tap handler on the tile fires normally.
//
// Active regardless of whether a cell is selected. If a cell IS
// already selected, the drag still works on top of that — drag
// overrides the tap-tile-into-selected-cell flow because we set
// SEL to the drag target before calling place().
(function(){
  // ── Drag-to-place tunables ──
  var DRAG_THRESHOLD = 8;     // px — finger must move this far to start drag
  var GHOST_OPACITY = 0.85;
  var FINGER_OFFSET_Y = 72;   // ghost sits this many px above fingertip
  // [v4.70] Bumped 48 → 72 (+24px ≈ half a tile width) per Sam: the
  // ghost still sometimes ended up partly under the fingertip. The
  // larger lift keeps the tile clearly visible above the finger.
  // NOTE: this offset is used in three places that must stay in
  // sync — ghost initial position (_createGhost), the live magnet
  // origin (my = fy - FINGER_OFFSET_Y), and the release-time grace +
  // elementFromPoint checks (_onTouchEnd). All reference this single
  // constant so bumping it here shifts every position-aware path
  // together.
  // [v2.32] Simplified magnet: pure proximity, no push-off, no
  // directional bias, no ignored set. Ghost locks to a cell only
  // when the magnet origin is within LOCK_RANGE_CELLS of that
  // cell's center; unlocks immediately when origin leaves that
  // radius. The previous push-off + direction-bias system added
  // too many failure modes — this is dead-simple and predictable.
  // LOCK_RANGE_CELLS is in cell-widths. 0.7 means "finger has to
  // be on the cell." Live-tunable via window._equilLockRange.
  window._equilLockRange = window._equilLockRange || {
    cells: 0.7   // lock radius in multiples of cell width
  };
  // [v4.68] Drop-grace range. Separate from the live lock range above.
  // The live magnet has to be strict — if it engaged too easily during
  // fast drags, the ghost would dance between cells. So the live lock
  // is gated by both proximity AND velocity (see _equilDragMagnet
  // below). The release-time grace check has no velocity gate: when
  // the user lifts their finger, we look at where it landed and find
  // the nearest blank cell within this radius (in cell-widths). If
  // it's close enough, place the tile there even if the live magnet
  // never engaged. Generous default (1.1) so a release that's
  // slightly short of the target still snaps — common when the user
  // moves quickly and lifts before the velocity smoother settles.
  // The existing 110ms ghost-slide animation in _onTouchEnd plays
  // from the release position to the cell center, so the snap looks
  // like the ghost being "sucked in" rather than teleported.
  window._equilDropGrace = window._equilDropGrace || {
    cells: 1.1   // grace radius in multiples of cell width
  };
  var SNAPPED_FILL = 1.5;     // snapped ghost = 1.5 × cell width
  var MAGNET_BASE_SCALE = 1.05; // ghost's natural size at finger
  // [v2.25] Velocity-gated snap (kept). Magnet doesn't engage at
  // all when the smoothed finger velocity exceeds the threshold.
  window._equilDragMagnet = window._equilDragMagnet || {
    snapMid: 60,
    snapOn:  48,
    snapOff: 72
  };

  var _state = null; // null when idle; object during touch session

  function _findBankTile(target){
    var el = target;
    while(el && el !== document.body){
      if(el.classList && el.classList.contains('bt') && el.dataset && el.dataset.bankIdx != null){
        return el;
      }
      el = el.parentNode;
    }
    return null;
  }

  function _findCellAt(x, y){
    var el = document.elementFromPoint(x, y);
    while(el && el !== document.body){
      if(el.dataset && el.dataset.cellKey != null){
        return el;
      }
      el = el.parentNode;
    }
    return null;
  }

  // [v1.83] Cache blank-cell positions at drag start. Cells don't
  // move during a drag (the grid layout is stable), so we can scan
  // once instead of every touchmove. We also cache the cell width
  // so MAGNET_RANGE_CELLS can be converted to pixels.
  function _buildCellCache(){
    var cells = [];
    var cellWidth = 0;
    var pz = (typeof PZ !== 'undefined') ? PZ : window.PZ;
    if(!pz || !pz.CM) return {cells:cells, cellWidth:0};
    var nodes = document.querySelectorAll('[data-cell-key]');
    for(var i=0;i<nodes.length;i++){
      var n = nodes[i];
      var k = n.dataset.cellKey;
      var cell = pz.CM[k];
      if(!cell || !cell.isBlank) continue;
      // [v4.69] Skip blank cells that already have a placed value.
      // Per Sam: magnet shouldn't snap onto cells that are filled
      // (even though the cell type is "blank" in the data model —
      // means "user-fillable slot"). Sliding the ghost slowly past
      // a placed-and-pulsing cell shouldn't pull it in. Users who
      // want to swap a value tap the cell to return it to the bank
      // first, then drag the new tile in. The cache is rebuilt on
      // each drag start so a returned-then-dragged sequence sees
      // the cell as empty again on the next drag.
      if(cell.value != null) continue;
      var r = n.getBoundingClientRect();
      if(r.width === 0 || r.height === 0) continue; // hidden
      cells.push({
        el: n,
        key: k,
        cx: r.left + r.width/2,
        cy: r.top + r.height/2,
        w: r.width,
        h: r.height
      });
      if(r.width > cellWidth) cellWidth = r.width;
    }
    return {cells:cells, cellWidth:cellWidth};
  }

  function _createGhost(srcTile, x, y){
    var rect = srcTile.getBoundingClientRect();
    var ghostW = (rect.width  > 0) ? rect.width  : 50;
    var ghostH = (rect.height > 0) ? rect.height : 50;
    var initW = ghostW * MAGNET_BASE_SCALE;
    var initH = ghostH * MAGNET_BASE_SCALE;
    var initLeft = x - initW/2;
    var initTop  = y - FINGER_OFFSET_Y - initH/2;

    // [v2.23] Build ghost fresh instead of cloning the bank tile.
    // Reasons:
    //  1. Cloned bank tiles include the xN/mini/cyan child structure
    //     (×N badges, mini grids of cyan numbers), which don't scale
    //     with the ghost when we resize via width/height — making the
    //     ghost shrink while its contents stayed full size.
    //  2. The user wants the ghost to show ONE clean number while
    //     dragging, not the docked-tile structure.
    // Display rules:
    //  - In all modes EXCEPT all-cyan (###): white number, centered.
    //  - In all-cyan mode (###): same number, but in dark cyan
    //    (#0093aa, the same color used for mini/cyan-mode small
    //    numbers when docked).
    // Font size scales with ghost dimensions in _setGhostTransform.
    var cyanMode = !!window._allCyanPuzzleTiles;
    var numberColor = cyanMode ? '#0093aa' : 'var(--text-primary,#fff)';
    var ghost = document.createElement('div');
    ghost.id = '_dragGhost';
    // Pull the value from the source tile. Bank tiles store their
    // displayed value as their textContent in default mode, or in
    // dataset.collapsedValue when condensed (xN/mini/cyan).
    var val = '';
    try{
      val = srcTile.dataset.collapsedValue || '';
      if(!val){
        // Walk the source tile's text — its textContent contains
        // the main number (and possibly the ×N badge text), so
        // strip anything that isn't a digit.
        var tc = srcTile.textContent || '';
        var m = tc.match(/\d+/);
        val = m ? m[0] : tc.trim();
      }
    }catch(_){ val = ''; }

    // [v2.23] Border + background match the tile's CSS rule (.bt)
    // so the ghost reads as "a tile" without inheriting all the
    // tile's child structure.
    var borderRadius = Math.max(2, Math.min(8, Math.round(initW * 0.15)));
    // [v4.73] Theme-aware drag glow. Bright cyan (0,217,255) reads
    // well on the dark board but is too light/washed on cream. Light
    // mode uses a deeper teal-cyan (14,116,144) — the same family as
    // the rest of the light-mode cyan palette — so the glow is
    // visible against the parchment background.
    var _ghostLight = (window._lightModeOn === true);
    var _ghostGlow = _ghostLight
      ? 'box-shadow:0 0 10px rgba(14,116,144,0.50),0 4px 10px rgba(42,36,24,0.25);'
      : 'box-shadow:0 0 10px rgba(0,217,255,0.45),0 4px 10px rgba(0,0,0,0.35);';
    ghost.style.cssText =
      'position:fixed;'+
      'left:'+initLeft+'px;'+
      'top:'+initTop+'px;'+
      'width:'+initW+'px;'+
      'height:'+initH+'px;'+
      'border:1.5px solid rgba(0,217,255,0.5);'+
      'background:var(--bg-secondary,#0a0a0a);'+
      'border-radius:'+borderRadius+'px;'+
      'box-sizing:border-box;'+
      'display:flex;'+
      'align-items:center;'+
      'justify-content:center;'+
      'pointer-events:none;'+
      'z-index:9999;'+
      'opacity:0;'+
      'transition:none;'+
      // [v4.72/v4.73] Drag ghost glow — theme-aware (see _ghostGlow
      // above). Light cyan on dark; deeper teal-cyan on cream.
      _ghostGlow;

    var span = document.createElement('span');
    span.textContent = val;
    // [v4.69] Solid text instead of hollow outline. Per Sam: "keep
    // it the same black text the whole time." The previous look
    // (color:transparent with -webkit-text-stroke for an outline-
    // only number) was a leftover from an earlier visual experiment.
    // Match the bank tile's solid number color via the same
    // var(--text-primary) the bank tile resolves to in each theme.
    span.style.cssText =
      'font-family:"IBM Plex Mono",monospace;'+
      'font-weight:700;'+
      'color:'+numberColor+';'+
      'line-height:1;'+
      'pointer-events:none;'+
      // Initial font size — overwritten by _setGhostTransform on
      // every update.
      'font-size:'+ Math.round(initW * 0.55) +'px;';
    ghost.appendChild(span);
    ghost._numberSpan = span;

    document.body.appendChild(ghost);
    ghost._w = initW;
    ghost._h = initH;
    ghost._baseW = ghostW;
    ghost._baseH = ghostH;
    // Force a layout read.
    void ghost.offsetHeight;
    requestAnimationFrame(function(){
      try{
        ghost.style.opacity = GHOST_OPACITY;
        // [v2.23] Transition includes font-size so the number
        // smoothly scales with the tile during snap-shrink.
        ghost.style.transition = 'left 180ms cubic-bezier(0.2,0.8,0.2,1), top 180ms cubic-bezier(0.2,0.8,0.2,1), width 180ms cubic-bezier(0.2,0.8,0.2,1), height 180ms cubic-bezier(0.2,0.8,0.2,1), border-radius 180ms cubic-bezier(0.2,0.8,0.2,1), opacity 120ms ease-out';
        if(ghost._numberSpan){
          ghost._numberSpan.style.transition = 'font-size 180ms cubic-bezier(0.2,0.8,0.2,1)';
        }
      }catch(_){}
    });
    return ghost;
  }

  // [v1.83] Position-and-scale ghost. cx, cy are the visual center
  // coordinates (where the ghost should appear), and scale is the
  // size multiplier relative to the source tile's natural size.
  // [v2.22] Sizes via width/height directly (no transform). Scale
  // value is treated as a multiplier on _baseW / _baseH (the
  // source tile's unscaled dimensions).
  function _setGhostTransform(ghost, cx, cy, scale){
    if(!ghost) return;
    if(!isFinite(cx) || !isFinite(cy) || !isFinite(scale)) return;
    var bw = (ghost._baseW && ghost._baseW > 0) ? ghost._baseW : 50;
    var bh = (ghost._baseH && ghost._baseH > 0) ? ghost._baseH : 50;
    var w = bw * scale;
    var h = bh * scale;
    ghost._w = w;
    ghost._h = h;
    ghost.style.left = (cx - w/2) + 'px';
    ghost.style.top  = (cy - h/2) + 'px';
    ghost.style.width  = w + 'px';
    ghost.style.height = h + 'px';
    // [v2.23] Scale the number's font-size with the ghost so it
    // shrinks/grows proportionally during snap and unsnap.
    if(ghost._numberSpan){
      ghost._numberSpan.style.fontSize = Math.round(w * 0.55) + 'px';
    }
    // [v2.24] Tighter radius — was 0.22 ratio with cap 10, which
    // made the ghost look near-circular when shrunk to snap size.
    // 0.15 ratio with cap 8 keeps the box recognizably square at
    // all sizes.
    var br = Math.max(2, Math.min(8, Math.round(w * 0.15)));
    ghost.style.borderRadius = br + 'px';
  }

  function _highlightCell(cellEl, locked){
    if(_state._lastHi && _state._lastHi !== cellEl){
      _state._lastHi.style.outline = '';
      _state._lastHi.style.outlineOffset = '';
      _state._lastHi.style.boxShadow = '';
    }
    if(cellEl){
      // [v1.85] Stronger visual difference between hover and locked.
      // Hover (in outer zone): thin magenta outline.
      // Locked (snapped): thick outline + bright outer + inner glow,
      //   so the cell visibly "lights up" the moment magnet locks.
      if(locked){
        cellEl.style.outline = '3px solid #a855f7';
        cellEl.style.outlineOffset = '-2px';
        cellEl.style.boxShadow =
          '0 0 12px rgba(168,85,247,0.9) inset,'+
          '0 0 16px rgba(168,85,247,0.8)';
      } else {
        cellEl.style.outline = '1px solid rgba(168,85,247,0.5)';
        cellEl.style.outlineOffset = '-1px';
        cellEl.style.boxShadow = '';
      }
    }
    _state._lastHi = cellEl;
  }

  function _clearHighlight(){
    if(_state && _state._lastHi){
      _state._lastHi.style.outline = '';
      _state._lastHi.style.outlineOffset = '';
      _state._lastHi.style.boxShadow = '';
      _state._lastHi = null;
    }
  }

  function _onTouchStart(e){
    // [v2.44/v2.45] Drag-tiles toggle handling.
    //
    // When disabled (default): we don't initialize _state (so drag
    // mode never engages and the page scrolls naturally), but we DO
    // set up a tap-track record so the per-tile click handler can
    // decide whether to honor the click. The browser's native click
    // event fires after ANY quick touch — even a 1ms tap commits
    // immediately, which is too eager for our use case (the user
    // can't scroll past the tiles when a cell is selected without
    // accidentally placing).
    //
    // v2.45 fix: track touch start time + position. Touchmove flags
    // a "scrolled" state if movement exceeds 12px. Touchend evaluates
    // duration vs the 200ms threshold. The per-tile click handler
    // checks window._equilTapTrack.suppress and bails out if it's
    // set, so a held-or-scrolled touch never triggers place().
    if(!window._dragTilesEnabled){
      _state = null;
      // Set up tap tracking for the click handler to consult.
      if(e.touches.length === 1){
        var _tt = e.touches[0];
        var _tile = _findBankTile(_tt.target);
        var _idx = _tile ? parseInt(_tile.dataset.bankIdx) : NaN;
        window._equilTapTrack = {
          startT:    performance.now(),
          startX:    _tt.clientX,
          startY:    _tt.clientY,
          idx:       isNaN(_idx) ? -1 : _idx,
          scrolled:  false,
          suppress:  false   // set true on long-hold or movement
        };
      } else {
        window._equilTapTrack = null;
      }
      return;
    }
    if(e.touches.length !== 1) return;
    var t = e.touches[0];
    var tile = _findBankTile(t.target);
    if(!tile) return;
    var idx = parseInt(tile.dataset.bankIdx);
    if(isNaN(idx)) return;
    try{
      var pz = (typeof PZ !== 'undefined') ? PZ : window.PZ;
      var bt = (pz && pz.bank) ? pz.bank[idx] : null;
      if(bt && bt.used) return;
    }catch(err){}
    _state = {
      tile: tile,
      idx: idx,
      startX: t.clientX,
      startY: t.clientY,
      ghost: null,
      dragging: false,
      _lastHi: null,
      cellCache: null,    // populated on drag start
      lockedCell: null,   // currently magnet-locked cell entry from cache
      // [v2.25] Velocity tracking for snap-gating.
      _lastMoveX: t.clientX,
      _lastMoveY: t.clientY,
      _lastMoveT: performance.now(),
      _smoothVel: 0,
      _snapEnabled: true
    };
  }

  function _onTouchMove(e){
    // [v2.45] When _state is null (drag disabled), we still need to
    // watch movement to suppress the upcoming click if the user is
    // scrolling. Don't preventDefault — let scroll happen naturally.
    if(!_state){
      var tt = window._equilTapTrack;
      if(tt && e.touches.length === 1){
        var _mt = e.touches[0];
        var _mdx = _mt.clientX - tt.startX;
        var _mdy = _mt.clientY - tt.startY;
        if(Math.sqrt(_mdx*_mdx + _mdy*_mdy) > 12){
          tt.scrolled = true;
          tt.suppress = true;
        }
      }
      return;
    }
    if(e.touches.length !== 1){ _cancel(); return; }
    var t = e.touches[0];
    var dx = t.clientX - _state.startX;
    var dy = t.clientY - _state.startY;
    if(!_state.dragging){
      if(Math.sqrt(dx*dx + dy*dy) < DRAG_THRESHOLD) return;
      // Threshold crossed — enter drag mode.
      _state.dragging = true;
      _state.ghost = _createGhost(_state.tile, t.clientX, t.clientY);
      _state.tile.style.opacity = '0.3';
      // [v1.83] Build the cell-position cache once at drag start.
      _state.cellCache = _buildCellCache();
      // [v2.16] Quiet low pop on pickup so the user has audible
      // confirmation that the drag has actually started (otherwise
      // the only feedback is the visual ghost appearing, which
      // they might miss if their finger covers it).
      try{
        if(typeof playTilePickup === 'function') playTilePickup();
        else if(window.playTilePickup) window.playTilePickup();
      }catch(_){}
    }
    e.preventDefault();

    // ── [v2.25] Velocity tracking + snap gating ──
    // Compute instantaneous finger velocity, smooth it, and update
    // _snapEnabled with hysteresis. When disabled, the magnet block
    // below is skipped entirely — ghost just follows the finger.
    var nowT = performance.now();
    var prevX = _state._lastMoveX;
    var prevY = _state._lastMoveY;
    var prevT = _state._lastMoveT;
    var dtMs = nowT - prevT;
    if(dtMs > 0){
      var vdx = t.clientX - prevX;
      var vdy = t.clientY - prevY;
      var instVel = Math.sqrt(vdx*vdx + vdy*vdy) / (dtMs / 1000); // px/sec
      _state._smoothVel = _state._smoothVel * 0.7 + instVel * 0.3;
    }
    _state._lastMoveX = t.clientX;
    _state._lastMoveY = t.clientY;
    _state._lastMoveT = nowT;

    // [v2.26] Live velocity overlay (when enabled in OPTIONS panel).
    // Throttled to ~10/sec to avoid hammering the DOM. Creates the
    // overlay element on first use; reuses it on subsequent drags.
    try{
      if(window._equilShowVelOverlay){
        if(!_state._lastVelReadoutT || (nowT - _state._lastVelReadoutT) > 100){
          var ov = document.getElementById('_equilVelOverlay');
          if(!ov){
            ov = document.createElement('div');
            ov.id = '_equilVelOverlay';
            ov.style.cssText =
              'position:fixed;top:8px;left:50%;transform:translateX(-50%);'+
              'z-index:10000;pointer-events:none;'+
              'background:rgba(0,0,0,0.85);border:1px solid rgba(0,217,255,0.4);'+
              'border-radius:4px;padding:6px 12px;'+
              'font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:700;'+
              'color:var(--cyan,#00d9ff);letter-spacing:1px;'+
              'box-shadow:0 2px 8px rgba(0,0,0,0.6);';
            document.body.appendChild(ov);
          }
          var enabled = _state._snapEnabled;
          var v = Math.round(_state._smoothVel);
          ov.textContent = v + ' px/s · MAGNET ' + (enabled ? 'ON' : 'OFF');
          ov.style.color = enabled ? 'var(--cyan,#00d9ff)' : 'rgba(255,165,80,0.9)';
          ov.style.borderColor = enabled ? 'rgba(0,217,255,0.4)' : 'rgba(255,165,80,0.5)';
          _state._lastVelReadoutT = nowT;
        }
      }
    }catch(_){}

    var snapOn  = (window._equilDragMagnet && window._equilDragMagnet.snapOn)  || 48;
    var snapOff = (window._equilDragMagnet && window._equilDragMagnet.snapOff) || 72;
    if(_state._snapEnabled){
      // Currently enabled — disable if velocity exceeds the OFF threshold.
      if(_state._smoothVel > snapOff) _state._snapEnabled = false;
    } else {
      // Currently disabled — re-enable when velocity drops below ON threshold.
      if(_state._smoothVel < snapOn) _state._snapEnabled = true;
    }

    if(!_state._snapEnabled){
      // Magnet off: ghost just follows finger at base scale.
      _state.lockedCell = null;
      _clearHighlight();
      var fxA = t.clientX, fyA = t.clientY;
      var mxA = fxA, myA = fyA - FINGER_OFFSET_Y;
      _setGhostTransform(_state.ghost, mxA, myA, MAGNET_BASE_SCALE);
      return;
    }

    // ── Magnet logic — simple proximity lock (v2.32) ──
    // Origin is the ghost's effective position (FINGER_OFFSET_Y
    // above the actual finger). We find the closest blank cell
    // and lock to it ONLY if the origin is within
    // (cell.w * window._equilLockRange.cells) of the cell's
    // center. No push-off, no ignored set, no directional bias.
    // Ghost unsnaps the moment the origin leaves that radius.
    var fx = t.clientX, fy = t.clientY;
    var mx = fx, my = fy - FINGER_OFFSET_Y;
    var cache = _state.cellCache;

    var nearest = null;
    var nearestDist = Infinity;
    if(cache){
      for(var i=0;i<cache.cells.length;i++){
        var c = cache.cells[i];
        var ddx = mx - c.cx, ddy = my - c.cy;
        var d = Math.sqrt(ddx*ddx + ddy*ddy);
        if(d < nearestDist){
          nearestDist = d;
          nearest = c;
        }
      }
    }

    var ghostCx = mx, ghostCy = my;
    var ghostScale = MAGNET_BASE_SCALE;
    var hiCell = null;
    var locked = false;

    if(nearest && _state.tile){
      var lockCells = (window._equilLockRange && window._equilLockRange.cells) || 0.7;
      var lockPx = nearest.w * lockCells;

      if(nearestDist <= lockPx){
        // Within lock range → snap to this cell.
        var tileRect = _state.tile.getBoundingClientRect();
        ghostCx = nearest.cx;
        ghostCy = nearest.cy;
        ghostScale = (nearest.w * SNAPPED_FILL) / tileRect.width;
        hiCell = nearest.el;
        locked = true;
        // Sound on fresh lock only (not while held).
        var freshLock = !_state.lockedCell || _state.lockedCell.key !== nearest.key;
        if(freshLock){
          try{
            if(typeof playTileSnap === 'function') playTileSnap();
            else if(window.playTileSnap) window.playTileSnap();
          }catch(_){}
        }
        _state.lockedCell = nearest;
      } else {
        _state.lockedCell = null;
        // Light hint highlight if cell is somewhat near (within
        // 3 cell-widths) — gives the user a soft cue that they're
        // closing in on a target without snapping yet.
        if(nearestDist <= nearest.w * 3){
          hiCell = nearest.el;
        }
      }
    } else {
      _state.lockedCell = null;
    }

    _setGhostTransform(_state.ghost, ghostCx, ghostCy, ghostScale);
    if(hiCell) _highlightCell(hiCell, locked);
    else _clearHighlight();
  }

  function _onTouchEnd(e){
    // [v2.45] When _state is null (drag disabled path), evaluate
    // tap-track. If the touch was held >200ms, mark suppress so the
    // upcoming click event is ignored. (Movement was already checked
    // in _onTouchMove and would have set suppress there.) The actual
    // check happens in the per-tile click handler — it inspects
    // window._equilTapTrack.suppress before calling place().
    if(!_state){
      var tt = window._equilTapTrack;
      if(tt){
        var elapsed = performance.now() - tt.startT;
        if(elapsed > 200) tt.suppress = true;
      }
      return;
    }
    if(!_state.dragging){
      _state = null;
      return;
    }
    var dropped = false;
    var dropCell = _state.lockedCell; // the magnet-locked cell, if any

    // Fall back to elementFromPoint at the GHOST/TILE position if
    // the magnet wasn't locked (covers releases right outside the
    // magnet range but still on a cell, or a stale/empty cache).
    // [v4.70] Hit-test at the tile position (finger Y minus
    // FINGER_OFFSET_Y), not the raw finger position — same reason
    // as the grace check: the user aims with the visible tile, which
    // floats above the finger.
    if(!dropCell){
      var t = (e.changedTouches && e.changedTouches[0]) || null;
      if(t){
        var hitEl = _findCellAt(t.clientX, t.clientY - FINGER_OFFSET_Y);
        if(hitEl){
          var k = hitEl.dataset.cellKey;
          var pz = (typeof PZ !== 'undefined') ? PZ : window.PZ;
          var c = (pz && pz.CM) ? pz.CM[k] : null;
          // [v4.69] Also skip filled cells here — mirrors the cache
          // filter so the elementFromPoint path can't accidentally
          // place onto a filled cell when the cache path wouldn't.
          if(c && c.isBlank && c.value == null){
            dropCell = {el: hitEl, key: k,
              cx: hitEl.getBoundingClientRect().left + hitEl.getBoundingClientRect().width/2,
              cy: hitEl.getBoundingClientRect().top + hitEl.getBoundingClientRect().height/2};
          }
        }
      }
    }

    // [v4.68] Release-time grace check. If the magnet never locked AND
    // the finger wasn't literally on a blank cell at release, search
    // the cell cache for the NEAREST blank cell within the grace
    // radius (window._equilDropGrace.cells × cellWidth). The live
    // magnet has a velocity gate so a fast drag never locks until
    // the finger slows; users releasing before that gate clears get
    // their tile sent back to the bank, which feels wrong when they
    // visibly aimed at a cell. This grace path catches "you released
    // close enough — I know where you meant" without weakening the
    // live magnet's strictness.
    // [v4.70] Measure from the GHOST/TILE position, not the raw
    // finger position. The ghost floats FINGER_OFFSET_Y pixels above
    // the fingertip (so the user can see it past their finger), and
    // the user aims with the tile they can see — not the finger
    // they can't. The live magnet already does this (my = fy -
    // FINGER_OFFSET_Y); the grace check was incorrectly using the
    // raw finger Y, so it measured ~one offset too low and would
    // miss the cell the user was clearly aiming at.
    // Distance: straight-line from ghost center to cell center. Cell
    // width comes from the cache (widest blank cell at drag start).
    if(!dropCell && _state.cellCache && _state.cellCache.cells.length){
      var t2 = (e.changedTouches && e.changedTouches[0]) || null;
      if(t2){
        var fx = t2.clientX;
        var fy = t2.clientY - FINGER_OFFSET_Y; // ghost center, not finger
        var cw = _state.cellCache.cellWidth || 50;
        var graceMult = (window._equilDropGrace && typeof window._equilDropGrace.cells === 'number')
          ? window._equilDropGrace.cells : 1.1;
        var graceR = cw * graceMult;
        var graceR2 = graceR * graceR; // squared distance comparison avoids sqrt
        var bestD2 = Infinity;
        var bestCell = null;
        var cells = _state.cellCache.cells;
        for(var ci=0; ci<cells.length; ci++){
          var cc = cells[ci];
          var ddx = fx - cc.cx;
          var ddy = fy - cc.cy;
          var d2 = ddx*ddx + ddy*ddy;
          if(d2 < bestD2 && d2 <= graceR2){
            bestD2 = d2;
            bestCell = cc;
          }
        }
        if(bestCell){
          dropCell = bestCell;
        }
      }
    }

    if(dropCell){
      // [v1.83] Brief snap-into-cell animation: ghost slides to the
      // cell center and shrinks to 0 alpha. Then place() runs and
      // render() repaints the cell with the placed value.
      try{
        if(_state.ghost){
          // [v2.22] Drop-snap transition uses width/height (not
          // transform) for the size shrink, matching the new
          // sizing model.
          _state.ghost.style.transition = 'left 110ms ease-out, top 110ms ease-out, width 110ms ease-out, height 110ms ease-out, border-radius 110ms ease-out, opacity 110ms ease-out';
          _setGhostTransform(_state.ghost, dropCell.cx, dropCell.cy, MAGNET_MIN_SCALE * 0.7);
          _state.ghost.style.opacity = '0';
        }
      }catch(_){}

      // Defer the place() + cleanup slightly so the snap animation
      // is visible before the cell repaints with the new value.
      var idx = _state.idx;
      var key = dropCell.key;
      var savedState = _state;
      setTimeout(function(){
        try{
          window.SEL = key;
          if(typeof place === 'function'){
            place(idx);
          } else if(typeof window.place === 'function'){
            window.place(idx);
          }
        }catch(err){}
        // Manual cleanup since _state may have already been cleared
        // by another touch event in the meantime.
        if(savedState.ghost && savedState.ghost.parentNode){
          savedState.ghost.parentNode.removeChild(savedState.ghost);
        }
        if(savedState.tile) savedState.tile.style.opacity = '';
        if(savedState._lastHi){
          savedState._lastHi.style.outline = '';
          savedState._lastHi.style.outlineOffset = '';
          savedState._lastHi.style.boxShadow = '';
        }
        // [v2.26] Velocity overlay cleanup (drop path).
        try{
          var ovd = document.getElementById('_equilVelOverlay');
          if(ovd && ovd.parentNode) ovd.parentNode.removeChild(ovd);
        }catch(_){}
      }, 110);
      _state = null; // clear immediately so further touches start fresh
      dropped = true;
    } else {
      // [v2.34] No drop target — animate the ghost back to the
      // source bank tile's position before cleanup. Plays a
      // home-arrival pop (mirror of pickup pop). Eases out so the
      // motion settles gently instead of feeling yanked.
      var savedReturn = _state;
      var srcTile = savedReturn.tile;
      var srcRect = srcTile ? srcTile.getBoundingClientRect() : null;
      if(savedReturn.ghost && srcRect && srcRect.width > 0){
        try{
          var srcCx = srcRect.left + srcRect.width/2;
          var srcCy = srcRect.top  + srcRect.height/2;
          // Ease-out gives fast departure and gentle settle.
          savedReturn.ghost.style.transition =
            'left 180ms cubic-bezier(0.2,0.8,0.2,1), '+
            'top 180ms cubic-bezier(0.2,0.8,0.2,1), '+
            'width 180ms cubic-bezier(0.2,0.8,0.2,1), '+
            'height 180ms cubic-bezier(0.2,0.8,0.2,1), '+
            'border-radius 180ms cubic-bezier(0.2,0.8,0.2,1), '+
            'opacity 180ms ease-out';
          // Scale 1.0 = source tile's natural size (the ghost was
          // sized at MAGNET_BASE_SCALE × source for the "lifted"
          // feel; we shrink back to 1.0 to match the bank tile).
          _setGhostTransform(savedReturn.ghost, srcCx, srcCy, 1.0);
          savedReturn.ghost.style.opacity = '0';
          // Update the inner number's font-size transition so it
          // shrinks alongside the box.
          if(savedReturn.ghost._numberSpan){
            savedReturn.ghost._numberSpan.style.transition =
              'font-size 180ms cubic-bezier(0.2,0.8,0.2,1)';
          }
          try{
            if(typeof playTileReturn === 'function') playTileReturn();
            else if(window.playTileReturn) window.playTileReturn();
          }catch(_){}
        }catch(_){}
        _clearHighlight();
        _state = null; // clear so further touches start fresh
        setTimeout(function(){
          if(savedReturn.ghost && savedReturn.ghost.parentNode){
            savedReturn.ghost.parentNode.removeChild(savedReturn.ghost);
          }
          if(savedReturn.tile) savedReturn.tile.style.opacity = '';
          // Velocity overlay cleanup (matches drop-path cleanup).
          try{
            var ovr = document.getElementById('_equilVelOverlay');
            if(ovr && ovr.parentNode) ovr.parentNode.removeChild(ovr);
          }catch(_){}
        }, 190);
      } else {
        _cleanup();
      }
    }

    if(dropped) e.preventDefault();
  }

  function _cancel(){
    if(_state) _cleanup();
    // [v2.45] Clear tap-track on cancel so a stale touch (e.g. OS-
    // interrupted by an incoming notification) doesn't leak suppress
    // state into the next interaction.
    window._equilTapTrack = null;
  }

  function _cleanup(){
    if(_state){
      if(_state.ghost && _state.ghost.parentNode){
        _state.ghost.parentNode.removeChild(_state.ghost);
      }
      if(_state.tile){
        _state.tile.style.opacity = '';
      }
      _clearHighlight();
    }
    _state = null;
    // [v2.26] Remove the velocity-debug overlay if it exists.
    try{
      var ov = document.getElementById('_equilVelOverlay');
      if(ov && ov.parentNode) ov.parentNode.removeChild(ov);
    }catch(_){}
  }

  function _wire(){
    var bank = document.getElementById('bank');
    if(!bank) return false;
    if(bank._dragWired) return true;
    bank._dragWired = true;
    bank.addEventListener('touchstart', _onTouchStart, {passive:true});
    bank.addEventListener('touchmove',  _onTouchMove,  {passive:false});
    bank.addEventListener('touchend',   _onTouchEnd,   {passive:false});
    bank.addEventListener('touchcancel', _cancel,      {passive:true});
    if(typeof place === 'function' && !window.place) window.place = place;
    return true;
  }

  if(document.readyState === 'loading'){
    document.addEventListener('DOMContentLoaded', _wire);
  } else {
    _wire();
  }
  window.addEventListener('load', _wire);
})();

// [Equil 1.04] Removed: SEQUENCER + PRO MODE IIFE — ~8,775 lines.
// Contained: showSeq/hideSeq, beat editor, recording, playback scheduling, kit strip,
// slot machinery, BPM/CLICK/ACCENT/FEEL/QUANTIZE controls, master EQ panel UI,
// btnPuz toggle wiring, window._seq (saveState/loadState/getBpm/etc), all sub-functions.


// ─────────────────────────────────────────────────────────────
// ZOOM-PAN PILL (v8.99 — Pass 1: chassis only)
// ─────────────────────────────────────────────────────────────
//
// A floating circular control that lives in puzzle mode. Designed
// to support a future zoom-and-pan gesture: thumb pressed on the
// circle drives zoom (via radiusX/force), sliding the thumb pans
// the zoomed view. Pass 1 here builds only the chassis — the DOM,
// the drag-the-tab-to-relocate behavior with the same wind sound
// and momentum glide as the scroll-lock pill, the show/hide hooks
// tied to puzzle/seq mode. Pass 2 will wire the actual zoom/pan
// logic onto the circle's touch handlers (currently no-op stubs).
//
// Anatomy:
//   ┌───────┐        circle: thumb-sized (56×56),
//   │   ●   │        the future zoom/pan target.
//   │       │        Stays under the user's thumb during gesture.
//   │       │
//   └───┬───┘        tab: 24×16 handle below the circle. Only
//       │            the tab is draggable so dragging-to-relocate
//       └─           never wanders the circle out from under the
//                    user's fingertip when zooming.
//
// Pill is position:fixed on the viewport (matches scroll-lock pill
// pattern). Initial spawn position is the lower-right corner of
// .gscroll (the puzzle board's visible bounding box).
(function(){
  var _pill = null;          // outer container
  var _circle = null;        // the round zoom/pan target
  var _tab = null;           // the drag handle below the circle
  // Reuse the global drag-wind / button SFX exposed by the
  // scroll-lock pill IIFE.
  function _wind(){ return window._dragWind || null; }
  function _sfx(name){ if(window._btnFx) window._btnFx(name); }

  // Sizing constants — circle is thumb-pad-sized, tab is a small
  // grippy nub. PILL_W is just the circle diameter; tab is narrower
  // and centered horizontally.
  var CIRCLE_D = 56;
  var TAB_W    = 44;
  // [v2.07] Tab lengthened from 24 to 36 — gives more visual
  // presence to the grip area now that the top portion of it is
  // covered by the circle.
  var TAB_H    = 36;
  // [v2.06] TAB_GAP from 2 to -11 so the tab overlaps the circle.
  // The tab's top corners now sit ON the circle's bottom arc at
  // x = ±22 from circle center (where chord meets circle: y =
  // 28 + sqrt(28² - 22²) ≈ 45.32, so tab.top = 45.32 → GAP =
  // 45.32 - 56 ≈ -11). Combined with z-index on circle (added
  // below) so the circle covers the part of the tab that's
  // inside its silhouette, the visible result is the tab's
  // vertical borders connecting cleanly to the circle's bottom.
  var TAB_GAP  = -11;
  var PILL_W   = CIRCLE_D;
  var PILL_H   = CIRCLE_D + TAB_GAP + TAB_H;

  // Drag/glide tunables — match the scroll-lock pill so the feel is
  // consistent across the two floating tools.
  var DRAG_THRESH_PX = 6;
  var GLIDE_MIN_V    = 180;  // px/s below this → no coast
  var GLIDE_FRICTION = 0.12; // velocity retained per second
  var GLIDE_STOP_V   = 20;   // px/s — glide done

  // [v1.43] Right-edge no-go zone. The pill cannot be spawned, dragged,
  // or glided into the rightmost RIGHT_NOGO_PX of the viewport. Keeps
  // the pill out of the area where Android's gesture-back swipe and
  // some browsers' edge-pull gestures live, and gives the user a
  // predictable safe band on the right side of the screen for normal
  // touch interaction outside the pill.
  // [v1.79] Tightened from 32px to 20px — pill can now sit a hair
  // closer to the right edge. LEFT_NOGO_PX added to mirror the same
  // padding on the left edge for symmetry.
  var RIGHT_NOGO_PX = 20;
  var LEFT_NOGO_PX  = 20;

  // Persistent position across show/hide cycles in this session
  // (e.g. user moves the pill, enters seq mode, comes back — pill
  // reappears where they left it). Reset each fresh page load.
  var _lastLeft = null, _lastTop = null;

  function _spawnAtBoardCorner(){
    // [v1.43] Spawn at the bottom-right of the VIEWPORT (not the
    // gscroll element) with the right-edge no-go zone enforced. The
    // pill ends up flush to the right side of the safe area and just
    // above the bottom edge.
    var INSET_BOTTOM = 8;
    return {
      left: Math.round(window.innerWidth - PILL_W - RIGHT_NOGO_PX),
      top:  Math.round(window.innerHeight - PILL_H - INSET_BOTTOM)
    };
  }

  function _build(){
    if(_pill) return;
    _pill = document.createElement('div');
    _pill.id = '_zoomPill';
    _pill.style.cssText = [
      'position:fixed',
      'z-index:10001',
      'width:'+PILL_W+'px',
      'height:'+PILL_H+'px',
      'pointer-events:none',     // children re-enable
      'opacity:0',
      'transition:opacity 180ms ease-out',
      'touch-action:none',
      'user-select:none',
      '-webkit-user-select:none',
      'box-sizing:border-box'
    ].join(';');

    // ── Circle (top) ──
    _circle = document.createElement('div');
    _circle.className = '_zpCircle';
    _circle.style.cssText = [
      'position:absolute',
      'left:0',
      'top:0',
      'width:'+CIRCLE_D+'px',
      'height:'+CIRCLE_D+'px',
      'border-radius:50%',
      'border:1.5px solid rgba(0,217,255,0.55)',
      'background:rgba(18,18,18,0.78)',
      'box-shadow:0 2px 12px rgba(0,0,0,0.55), inset 0 0 8px rgba(0,217,255,0.15)',
      'pointer-events:auto',
      'touch-action:none',
      'box-sizing:border-box',
      'display:flex',
      'align-items:center',
      'justify-content:center',
      // [v2.06] z-index so circle covers the part of the tab that
      // overlaps it (TAB_GAP is now negative so tab raises into
      // circle silhouette — without z-index ordering, the tab
      // would render on top and obscure the circle's bottom).
      'z-index:2'
    ].join(';');
    // A small inner indicator dot so the circle reads as "interactive
    // pad" rather than empty hole. Subtle, no glow yet.
    var _dot = document.createElement('div');
    _dot.style.cssText = [
      'width:6px',
      'height:6px',
      'border-radius:50%',
      'background:rgba(0,217,255,0.55)',
      'box-shadow:0 0 4px rgba(0,217,255,0.5)',
      'pointer-events:none'
    ].join(';');
    _circle.appendChild(_dot);
    _pill.appendChild(_circle);

    // ── Tab (bottom drag handle) ──
    _tab = document.createElement('div');
    _tab.className = '_zpTab';
    _tab.style.cssText = [
      'position:absolute',
      'left:'+Math.round((PILL_W - TAB_W)/2)+'px',
      'top:'+(CIRCLE_D + TAB_GAP)+'px',
      'width:'+TAB_W+'px',
      'height:'+TAB_H+'px',
      'border-radius:0 0 '+(TAB_H/2)+'px '+(TAB_H/2)+'px',
      'border:1px solid rgba(0,217,255,0.45)',
      'border-top:none',
      'background:rgba(18,18,18,0.78)',
      'box-shadow:0 2px 8px rgba(0,0,0,0.5)',
      'pointer-events:auto',
      'touch-action:none',
      'box-sizing:border-box',
      'display:flex',
      // [v2.06] Push dots to bottom of tab + bottom padding so they
      // sit in the visible portion below where the circle covers
      // the upper part of the tab.
      'align-items:flex-end',
      'justify-content:center',
      'padding-bottom:5px',
      'gap:2px',
      // Lower z-index than circle so circle covers the overlap area.
      'z-index:1'
    ].join(';');
    // Three little grip dots so the tab looks pinch-able.
    for(var gi=0; gi<3; gi++){
      var grip = document.createElement('div');
      grip.style.cssText = [
        'width:3px',
        'height:3px',
        'border-radius:50%',
        'background:rgba(0,217,255,0.6)',
        'pointer-events:none'
      ].join(';');
      _tab.appendChild(grip);
    }
    _pill.appendChild(_tab);

    document.documentElement.appendChild(_pill);

    _wireTabDrag();
    _wireCircleZoomPan();
  }

  // ── Tab drag — mirrors scroll-lock pill physics ──
  // Track finger offset from pill origin, follow on move, threshold
  // before "really dragging," wind sound while moving, momentum glide
  // on release. Position is stored in pill.style.left/top (px).
  function _wireTabDrag(){
    var dragging = false;
    var moved = false;
    var grabDx = 0, grabDy = 0;
    var startX = 0, startY = 0;
    var lastMX = 0, lastMY = 0, lastT = 0;
    var vx = 0, vy = 0;
    var glideRAF = null;

    function _killGlide(){
      if(glideRAF){ cancelAnimationFrame(glideRAF); glideRAF = null; }
    }

    function _startGlide(){
      var speed = Math.sqrt(vx*vx + vy*vy);
      if(speed < GLIDE_MIN_V) return;
      var lT = performance.now();
      function step(now){
        if(!_pill){ glideRAF = null; return; }
        var dt = (now - lT)/1000;
        lT = now;
        if(dt > 0.05) dt = 0.05;
        var decay = Math.pow(GLIDE_FRICTION, dt);
        vx *= decay; vy *= decay;
        var r = _pill.getBoundingClientRect();
        var nx = r.left + vx*dt;
        var ny = r.top  + vy*dt;
        var maxX = window.innerWidth  - PILL_W - RIGHT_NOGO_PX;
        var maxY = window.innerHeight - PILL_H;
        if(nx < LEFT_NOGO_PX){ nx = LEFT_NOGO_PX; vx = 0; }
        else if(nx > maxX){ nx = maxX; vx = 0; }
        if(ny < 0){ ny = 0; vy = 0; }
        else if(ny > maxY){ ny = maxY; vy = 0; }
        _pill.style.left = nx+'px';
        _pill.style.top  = ny+'px';
        _lastLeft = nx; _lastTop = ny;
        var sp = Math.sqrt(vx*vx + vy*vy);
        if(sp < GLIDE_STOP_V){ glideRAF = null; return; }
        glideRAF = requestAnimationFrame(step);
      }
      glideRAF = requestAnimationFrame(step);
    }

    _tab.addEventListener('touchstart', function(e){
      if(!_pill) return;
      e.preventDefault();
      e.stopPropagation();
      var t = e.touches[0];
      var r = _pill.getBoundingClientRect();
      grabDx = t.clientX - r.left;
      grabDy = t.clientY - r.top;
      startX = r.left; startY = r.top;
      dragging = true; moved = false;
      lastMX = t.clientX; lastMY = t.clientY; lastT = performance.now();
      vx = 0; vy = 0;
      _killGlide();
    }, {passive:false});

    _tab.addEventListener('touchmove', function(e){
      if(!dragging || !_pill) return;
      e.preventDefault();
      var t = e.touches[0];
      // Only flip "moved" once finger crosses the threshold — same
      // logic as the scroll-lock pill so a tiny jitter doesn't trigger
      // the wind sound.
      if(!moved){
        if(Math.abs(t.clientX - grabDx - startX) > DRAG_THRESH_PX
           || Math.abs(t.clientY - grabDy - startY) > DRAG_THRESH_PX){
          moved = true;
          var w = _wind(); if(w) w.start();
        }
      }
      var nx = t.clientX - grabDx;
      var ny = t.clientY - grabDy;
      // Clamp to viewport. [v1.43] Right edge respects RIGHT_NOGO_PX.
      // [v1.79] Left edge respects LEFT_NOGO_PX (mirrors right padding).
      nx = Math.max(LEFT_NOGO_PX, Math.min(window.innerWidth  - PILL_W - RIGHT_NOGO_PX, nx));
      ny = Math.max(0, Math.min(window.innerHeight - PILL_H, ny));
      _pill.style.left = nx+'px';
      _pill.style.top  = ny+'px';
      _lastLeft = nx; _lastTop = ny;
      // Velocity tracking for the release glide. Low-pass with
      // previous frame so end-of-drag jitter doesn't dominate.
      if(moved){
        var now = performance.now();
        var mdt = now - lastT;
        if(mdt > 0){
          var w2 = _wind();
          var dvx = t.clientX - lastMX;
          var dvy = t.clientY - lastMY;
          if(w2) w2.setVelocity(Math.sqrt(dvx*dvx + dvy*dvy)/(mdt/1000));
          var ivx = dvx/(mdt/1000);
          var ivy = dvy/(mdt/1000);
          vx = vx*0.25 + ivx*0.75;
          vy = vy*0.25 + ivy*0.75;
        }
        lastMX = t.clientX; lastMY = t.clientY; lastT = now;
      }
    }, {passive:false});

    function _endDrag(){
      if(!dragging) return;
      dragging = false;
      var w = _wind(); if(w) w.stop();
      if(moved) _startGlide();
      moved = false;
    }
    _tab.addEventListener('touchend', _endDrag, {passive:true});
    _tab.addEventListener('touchcancel', _endDrag, {passive:true});
  }

  // ── Circle handlers (v1.26: discrete 3-state zoom — OFF/HALF/FULL) ──
  //
  // First tap from OFF → smoothly ramps to HALF (any pressure).
  // While at HALF or FULL, additional taps pan freely without changing
  // zoom. To get from HALF to FULL, the user must squish hard
  // (PROMOTE_PNORM) and hold for PROMOTE_HOLD_MS ms while the finger
  // stays within PROMOTE_MAX_PAN_PX of the touchdown spot.
  //
  // Double-tap behavior:
  //   FULL → tap                 → ramp to HALF
  //   FULL → tap-and-hold past HALF → continues to OFF unattended
  //   HALF → tap                 → ramp to OFF
  //   OFF  → tap                 → no-op
  function _wireCircleZoomPan(){
    var ZOOM_MIN = 1.10;     // legacy reference; not used in 3-state model
    var ZOOM_MAX = 4.00;     // legacy reference; ZOOM_FULL is the actual max
    // Pressure normalization. With PRESSURE_RANGE = 2.4, radiusY=2.6 → norm 1.0.
    var PRESSURE_FLOOR = 0.2;
    var PRESSURE_RANGE = 2.4;
    var PRESSURE_BASE  = 0.5;

    function _readRadius(touch){
      var _r;
      // Prefer radiusY (iOS Safari reports contact-ellipse ratio with
      // wide dynamic range ~0.2-3.5). Fall back through the chain only
      // for radius-style readings — NEVER for `force`, see below.
      if(touch.radiusY != null && touch.radiusY > 0){
        _r = touch.radiusY;
      } else if(touch.webkitRadiusY != null && touch.webkitRadiusY > 0){
        _r = touch.webkitRadiusY;
      } else if(touch.radiusX != null && touch.radiusX > 0){
        _r = touch.radiusX;
      } else if(touch.webkitRadiusX != null && touch.webkitRadiusX > 0){
        _r = touch.webkitRadiusX;
      } else {
        // [v1.31] Don't trust the force/webkitForce fallback path on
        // Chrome. Chrome returns force=1.0 as a default when no real
        // pressure data is available, which previously computed _r=1.4
        // (norm 0.5, just above PROMOTE_PNORM=0.45) and triggered HALF
        // →FULL promotion on every light tap. Falling straight to
        // PRESSURE_BASE gives norm=0.125, well below promotion, so
        // Chrome users get clean tap-to-HALF without phantom full zoom.
        _r = PRESSURE_BASE;
      }
      // [v1.37] Tighten the upper cutoff for "this radius reading is
      // unrealistic for iOS contact ellipse." Previous cutoff was 5
      // which caught Chrome's CSS-pixel defaults of ~11. But Chrome
      // can also report mid-range values (3-5) that are ABOVE typical
      // iOS pressure peaks (~2.6) but BELOW the previous cutoff, so
      // they were leaking through and producing high pressure norms.
      // Cutoff at 3.0 covers the realistic iOS range while rejecting
      // Chrome's default-ish mid-range readings.
      if(_r > 3.0) _r = PRESSURE_BASE;
      return Math.max(PRESSURE_FLOOR, _r);
    }
    function _norm(r){
      return Math.max(0, Math.min(1, (r - PRESSURE_FLOOR) / PRESSURE_RANGE));
    }


    // ── Zoom levels (the three discrete states) ──
    // [v1.27] Reduced FULL from 4.0 to 3.4 (~85%) and HALF from 2.0 to
    // 1.7 (~85%) per user feedback — full zoom was too aggressive.
    var ZOOM_OFF  = 1.00;
    var ZOOM_HALF = 1.70;
    var ZOOM_FULL = 3.40;
    var LEVEL_VALUES = [ZOOM_OFF, ZOOM_HALF, ZOOM_FULL];

    // ── Animator settings ──
    // [v1.27] Asymmetric rates: zoom-OUT runs at 2× the zoom-in rate so
    // double-taps feel snappier without dragging the in-ramp. Zoom-in
    // rate stays at 1.7 (OFF→HALF in ~0.4s, HALF→FULL in ~1.0s); zoom-
    // out rate is 3.4 (FULL→HALF in ~1.0s, HALF→OFF in ~0.2s).
    var ZOOM_RATE_IN  = 1.7;   // units/sec when target > curZoom
    var ZOOM_RATE_OUT = 3.4;   // units/sec when target < curZoom
    // Visual smoothing factor applied to displayedZoom (cosmetic only,
    // hides per-frame quantization).
    var ZOOM_SMOOTHING = 0.30;

    // ── Promotion threshold (HALF → FULL during a session) ──
    // Pressure must be sustained at-or-above this norm value for at
    // least PROMOTE_HOLD_MS milliseconds, with the finger having moved
    // less than PROMOTE_MAX_PAN_PX from touchdown, to promote zoom
    // from HALF to FULL during a touch session. This is the "really
    // hard squish without panning much" gate.
    //
    // PROMOTE_PNORM = 0.45 corresponds to radiusY ~1.28 with the
    // current PRESSURE_RANGE = 2.4 — a clearly committed squish, not
    // a casual press.
    var PROMOTE_PNORM       = 0.45;
    var PROMOTE_HOLD_MS     = 200; // sustained for this long
    // [v1.43] PROMOTE_MAX_PAN_PX reduced from 30 to 15 — the user's
    // finger only has to wander half as far from the touchdown point
    // before the gesture is committed to "panning, not zooming," and
    // the FULL-zoom promotion path locks out. Net effect: the radius
    // around the original touch where pressure-zoom still engages is
    // tighter; small pan motions disable further zoom changes faster.
    var PROMOTE_MAX_PAN_PX  = 15;  // finger must stay this close to touchdown
    // [v1.32] Pressure-independent fallback path. On Chrome and other
    // browsers without a usable pressure signal, sustainedHi never
    // trips. To keep FULL zoom reachable, also promote if the finger
    // is held still for LONG_HOLD_MS without panning past
    // PROMOTE_MAX_PAN_PX. iOS Safari users still get the faster
    // pressure-based promotion; Chrome users have to hold a beat
    // longer. Set well above PROMOTE_HOLD_MS so on devices with real
    // pressure, the squish path always wins (no surprise long-hold
    // promotions).
    var LONG_HOLD_MS        = 1400;

    // ── Pan ──
    var PAN_MAX_OFFSET = 30;
    var PAN_MAX_VEL    = 300;
    // [v1.35] Quadratic boost added on top of the linear baseline so
    // max-pan speed climbs without ruining low-offset precision.
    // 200px/sec extra at full deflection nearly doubles top speed.
    var PAN_BOOST_VEL  = 200;

    // ── Double-tap detection ──
    var DTAP_MS   = 280;
    var DTAP_DIST = 24;
    var TAP_MAX_MS = 250;
    var TAP_MAX_PX = 10;

    // ── Persistent state ──
    var zoomLevel = 0;          // 0 = OFF, 1 = HALF, 2 = FULL
    var curZoom = ZOOM_OFF;     // animated current zoom (target tracked in _tick)
    var targetZoom = ZOOM_OFF;  // where curZoom is animating toward
    var displayedZoom = ZOOM_OFF;
    var lockedTx = 0, lockedTy = 0;

    // ── Per-session state ──
    var active = false;
    var sessionStartT = 0;
    var sessionStartX = 0, sessionStartY = 0;
    var curOffsetX = 0, curOffsetY = 0;
    var curTx = 0, curTy = 0;
    var sessionPanStarted = false;
    var lastPNorm = 0;
    // Sustained-high tracking — for HALF→FULL promotion.
    var highHoldMs = 0;     // ms current pressure has been ≥ PROMOTE_PNORM
    var sustainedHi = false; // true once highHoldMs ≥ PROMOTE_HOLD_MS
    var lastTouchmoveT = 0;
    var sessionPanFar = false; // has finger moved > PROMOTE_MAX_PAN_PX?
    // [v1.32] True if the touch session started with zoomLevel already
    // ≥ HALF (i.e., it is a re-tap, not the first OFF→HALF tap). The
    // long-hold-to-promote fallback path only fires when this is true,
    // so the first tap from OFF doesn't accidentally auto-promote to
    // FULL just because the user held the tap for a moment.
    var sessionStartedAtHalfOrAbove = false;

    // ── Double-tap state ──
    var lastEndT = 0, lastEndX = 0, lastEndY = 0;
    var lastEndWasCleanTap = false;

    // ── Held zoom-out (only meaningful from FULL) ──
    var zoomingOut = false;
    var zoomOutStartZoom = ZOOM_OFF;
    var zoomOutStartTx = 0, zoomOutStartTy = 0;
    var zoomOutStartT = 0;
    var zoomOutCommitOff = false; // true once held ramp has crossed HALF

    var panRAF = null;
    var lastTickT = 0;

    // ── Helpers ──
    function _applyNow(){
      if(!window._gridZoomApply) return;
      window._gridZoomApply(curTx, curTy, displayedZoom);
      if(window._gridZoomGet){
        var st = window._gridZoomGet();
        curTx = st.tx;
        curTy = st.ty;
      }
    }

    // ── Main animation/integration loop ──
    function _tick(now){
      if(!active && !_isAnimating()){ panRAF = null; return; }
      var dt = (now - lastTickT) / 1000;
      lastTickT = now;
      if(dt > 0.05) dt = 0.05;

      if(zoomingOut){
        // Held zoom-out from FULL (or auto-committed HALF→OFF). Start
        // ramp toward ZOOM_OFF; if held and released before crossing
        // HALF, _commitZoomOutOnRelease snaps target back to HALF.
        // Otherwise the ramp runs to completion here.
        var elapsed = (now - zoomOutStartT) / 1000;
        var progressDelta = ZOOM_RATE_OUT * elapsed; // zoom units consumed
        var totalRange = zoomOutStartZoom - ZOOM_OFF;
        var p = (totalRange > 0) ? Math.min(1, progressDelta / totalRange) : 1;
        curZoom = zoomOutStartZoom + p * (ZOOM_OFF - zoomOutStartZoom);
        curTx   = zoomOutStartTx   * (1 - p);
        curTy   = zoomOutStartTy   * (1 - p);
        // Mark commit point — if curZoom has crossed HALF, releasing
        // commits to OFF.
        if(!zoomOutCommitOff && curZoom <= ZOOM_HALF){
          zoomOutCommitOff = true;
        }
        // [v1.27] Finalize when the ramp completes AND we're either
        // auto-committed (no finger required) or the finger has been
        // released. While the finger is still down on a held FULL→OFF
        // gesture, don't finalize — the user might release before
        // committing past HALF. Detection: !active means finger is up
        // (or never required).
        if(p >= 1 && !active){
          targetZoom = ZOOM_OFF;
          zoomLevel = 0;
          lockedTx = 0;
          lockedTy = 0;
          zoomingOut = false;
        }
      } else {
        // Animate curZoom toward targetZoom. Asymmetric rate: zoom-out
        // (target < curZoom) runs at ZOOM_RATE_OUT (faster), zoom-in
        // (target > curZoom) at ZOOM_RATE_IN (slower).
        var dz = targetZoom - curZoom;
        if(Math.abs(dz) > 0.0005){
          var rate = (dz > 0) ? ZOOM_RATE_IN : ZOOM_RATE_OUT;
          var step = rate * dt;
          if(Math.abs(dz) <= step) curZoom = targetZoom;
          else curZoom += (dz > 0 ? step : -step);
        } else {
          curZoom = targetZoom;
        }
      }

      // Visual smoothing on top of the (already smooth) curZoom ramp,
      // just to soften any single-frame quantization.
      var dvz = curZoom - displayedZoom;
      if(Math.abs(dvz) > 0.0005){
        displayedZoom += dvz * ZOOM_SMOOTHING;
        if(Math.abs(curZoom - displayedZoom) < 0.0005) displayedZoom = curZoom;
      } else {
        displayedZoom = curZoom;
      }

      // Pan integration (only while a finger is down).
      if(active && !zoomingOut){
        var ox = curOffsetX, oy = curOffsetY;
        var pmag = Math.sqrt(ox*ox + oy*oy);
        if(pmag > 6){
          var pt = Math.min(1, (pmag - 6) / (PAN_MAX_OFFSET - 6));
          // [v1.35] Pan velocity = linear baseline + quadratic boost.
          // Slow-end speeds stay close to the old linear feel
          // (pt^2 contributes very little at small pt), but max-pan
          // speed climbs substantially. At pt=0.3 the boost adds ~20%;
          // at pt=1.0 it nearly doubles the velocity. Lets the user
          // cover ground quickly during big traversals while precision
          // moves still feel responsive, not floaty.
          var vel = PAN_MAX_VEL * pt + PAN_BOOST_VEL * pt * pt;
          // [v1.43] Zoom-aware pan multiplier. At HALF the multiplier
          // is 1.0 (feel unchanged from prior versions); at FULL it's
          // 2.0 (panning is twice as fast). Linearly interpolated for
          // any in-between zoom value the smoother is currently
          // showing. Below HALF (during the OFF→HALF ramp on first
          // tap) we also use 1.0 — pan barely matters there since the
          // viewport hasn't really zoomed yet.
          var panMul = 1.0;
          if(curZoom > ZOOM_HALF){
            panMul = 1.0 + (curZoom - ZOOM_HALF) / (ZOOM_FULL - ZOOM_HALF);
            if(panMul > 2.0) panMul = 2.0; // safety cap
          }
          vel *= panMul;
          curTx -= (ox / pmag) * vel * dt;
          curTy -= (oy / pmag) * vel * dt;
          sessionPanStarted = true;
          if(pmag > PROMOTE_MAX_PAN_PX) sessionPanFar = true;
        }
      }

      _applyNow();
      panRAF = requestAnimationFrame(_tick);
    }

    function _isAnimating(){
      return Math.abs(curZoom - targetZoom) > 0.001
          || Math.abs(displayedZoom - curZoom) > 0.001
          || zoomingOut;
    }

    // ── touchstart ──
    _circle.addEventListener('touchstart', function(e){
      if(!_pill) return;
      if(e.touches.length !== 1){
        // Multi-touch bail. End any in-progress gesture cleanly.
        if(active || zoomingOut){
          _commitZoomOutOnRelease();
          active = false;
          zoomingOut = false;
        }
        return;
      }
      e.preventDefault();
      e.stopPropagation();
      var t = e.touches[0];
      var now = performance.now();

      // ── Double-tap detection ──
      var dt = now - lastEndT;
      var ddx = t.clientX - lastEndX;
      var ddy = t.clientY - lastEndY;
      var ddist = Math.sqrt(ddx*ddx + ddy*ddy);
      var isDtap = lastEndWasCleanTap && dt < DTAP_MS && ddist < DTAP_DIST;

      if(isDtap){
        lastEndT = 0;
        lastEndWasCleanTap = false;
        if(zoomLevel === 0){
          // OFF + double-tap = no-op.
          return;
        } else if(zoomLevel === 1){
          // HALF + double-tap → OFF.
          // [v1.27] Use the same zoom-out ramp machinery as FULL→HALF
          // so pan slides smoothly to 0,0 alongside zoom rather than
          // jumping. zoomOutCommitOff = true so the ramp runs to OFF
          // unattended even if the user lifts immediately.
          zoomLevel = 0;
          targetZoom = ZOOM_OFF;
          zoomingOut = true;
          zoomOutStartZoom = curZoom;
          zoomOutStartTx = curTx;
          zoomOutStartTy = curTy;
          zoomOutStartT = now;
          zoomOutCommitOff = true; // auto-commit; no held-finger required
          active = false; // no need to wait for touchend
          if(panRAF) cancelAnimationFrame(panRAF);
          lastTickT = now;
          panRAF = requestAnimationFrame(_tick);
          return;
        } else {
          // FULL + double-tap → enter held-zoom-out session. Ramp
          // continues past HALF only if finger stays down; otherwise
          // releasing snaps to HALF.
          active = true;
          zoomingOut = true;
          zoomOutStartZoom = curZoom;
          zoomOutStartTx = curTx;
          zoomOutStartTy = curTy;
          zoomOutStartT = now;
          zoomOutCommitOff = false;
          sessionStartT = now;
          sessionStartX = t.clientX;
          sessionStartY = t.clientY;
          sessionPanStarted = false;
          lastTickT = now;
          if(panRAF) cancelAnimationFrame(panRAF);
          panRAF = requestAnimationFrame(_tick);
          return;
        }
      }

      // ── Begin a normal touch session ──
      sessionStartT = now;
      sessionStartX = t.clientX;
      sessionStartY = t.clientY;
      curOffsetX = 0; curOffsetY = 0;
      sessionPanStarted = false;
      sessionPanFar = false;
      highHoldMs = 0;
      sustainedHi = false;
      lastTouchmoveT = now;
      lastPNorm = _norm(_readRadius(t));
      curTx = lockedTx;
      curTy = lockedTy;

      // OFF + first tap → ramp to HALF.
      // [v1.32] Capture the pre-transition level so the long-hold
      // fallback knows whether this is the first OFF→HALF tap (in
      // which case auto-promotion to FULL is suppressed) or a re-tap
      // at an already-zoomed level (where holding makes sense as a
      // deliberate "go further" gesture).
      sessionStartedAtHalfOrAbove = (zoomLevel >= 1);
      if(zoomLevel === 0){
        targetZoom = ZOOM_HALF;
        zoomLevel = 1;
      }
      // HALF + tap → no zoom change yet; promotion to FULL happens in
      // touchmove if user squishes hard without panning.
      // FULL + tap → no zoom change; user can just pan at FULL zoom.

      active = true;
      lastTickT = now;
      _applyNow();
      if(panRAF) cancelAnimationFrame(panRAF);
      panRAF = requestAnimationFrame(_tick);
    }, {passive:false});

    // ── touchmove ──
    _circle.addEventListener('touchmove', function(e){
      if(!active || !_pill) return;
      e.preventDefault();
      e.stopPropagation();
      if(e.touches.length !== 1) return;
      var t = e.touches[0];
      var now = performance.now();

      if(zoomingOut){
        // During held zoom-out, ignore pressure / motion completely.
        // _tick is running its own time-based ramp.
        return;
      }

      curOffsetX = t.clientX - sessionStartX;
      curOffsetY = t.clientY - sessionStartY;
      var pCur = _norm(_readRadius(t));
      lastPNorm = pCur;

      // Track high-pressure hold time. Increments when pressure is
      // at or above PROMOTE_PNORM AND the finger hasn't moved past
      // PROMOTE_MAX_PAN_PX. Resets when either condition fails.
      var dtMs = now - lastTouchmoveT;
      lastTouchmoveT = now;
      var mag = Math.sqrt(curOffsetX*curOffsetX + curOffsetY*curOffsetY);
      if(mag > PROMOTE_MAX_PAN_PX) sessionPanFar = true;
      if(pCur >= PROMOTE_PNORM && !sessionPanFar){
        highHoldMs += dtMs;
        if(highHoldMs >= PROMOTE_HOLD_MS) sustainedHi = true;
      } else {
        highHoldMs = 0;
      }

      // [v1.32] Fallback long-hold promotion. Pressure-independent —
      // any finger held still longer than LONG_HOLD_MS promotes. Lets
      // Chrome users (no pressure signal) reach FULL zoom by holding
      // a moment instead of squishing. iOS users will already have
      // promoted via the faster pressure path before this triggers.
      // Suppressed on the first OFF→HALF tap so the initial tap-to-
      // zoom-in doesn't accidentally cascade to FULL just from the
      // user holding the tap a beat too long.
      var sessionElapsed = now - sessionStartT;
      var longHeld = (sessionStartedAtHalfOrAbove
                      && !sessionPanFar
                      && sessionElapsed >= LONG_HOLD_MS);

      // HALF → FULL promotion: either pressure-sustained OR long-held.
      // [v1.80] DISABLED — FULL zoom is too aggressive at current XL2
      // grid sizes; pill is restricted to OFF and HALF only. Tap to
      // toggle between the two. Re-enable by removing the early return.
      if(false && zoomLevel === 1 && (sustainedHi || longHeld)){
        targetZoom = ZOOM_FULL;
        zoomLevel = 2;
      }
    }, {passive:false});

    // ── End-of-session helpers ──
    function _commitZoomOutOnRelease(){
      if(!zoomingOut) return;
      // If the ramp crossed HALF (zoomOutCommitOff), let the time-based
      // ramp continue unattended toward OFF — _tick auto-finalizes when
      // it hits p=1 (sets lockedTx/Ty=0, zoomingOut=false). Pan slides
      // to 0,0 along the same ramp, so the visual stays smooth.
      // If we DIDN'T cross HALF, snap target back to HALF and stop the
      // zoom-out ramp here — pan stays at its current offset.
      if(zoomOutCommitOff){
        // Don't touch zoomingOut, curZoom, curTx, or curTy — _tick will
        // finish them. We just need to make sure active=false so _tick
        // is allowed to auto-finalize.
        // (Caller sets active=false in _endSession.)
      } else {
        targetZoom = ZOOM_HALF;
        zoomLevel = 1;
        // Clamp curZoom to no-less-than-HALF since HALF is the rest
        // state for this gesture.
        if(curZoom < ZOOM_HALF) curZoom = ZOOM_HALF;
        // Pan stays where it was at commit time.
        lockedTx = curTx;
        lockedTy = curTy;
        zoomingOut = false;
      }
    }

    // ── touchend / touchcancel ──
    function _endSession(e){
      if(!active && !zoomingOut) return;
      if(e){ e.preventDefault && e.preventDefault(); e.stopPropagation && e.stopPropagation(); }

      var t = (e && e.changedTouches && e.changedTouches[0]) || null;
      var nowEnd = performance.now();
      var wasZoomingOut = zoomingOut;

      if(zoomingOut){
        _commitZoomOutOnRelease();
        // After commit, _tick keeps animating curZoom toward target if
        // there's still distance to cover. Don't kill the RAF here.
      } else {
        lockedTx = curTx;
        lockedTy = curTy;
      }
      active = false;

      // Classify clean tap. Zoom-out releases never count as clean
      // taps (they should not trigger a chained double-tap).
      if(t && !wasZoomingOut){
        var dur = nowEnd - sessionStartT;
        var dx = t.clientX - sessionStartX;
        var dy = t.clientY - sessionStartY;
        var dispMag = Math.sqrt(dx*dx + dy*dy);
        var isClean = (dur < TAP_MAX_MS)
                   && !sessionPanStarted
                   && (dispMag < TAP_MAX_PX);
        lastEndWasCleanTap = isClean;
        lastEndT = nowEnd;
        lastEndX = t.clientX;
        lastEndY = t.clientY;
      } else {
        lastEndWasCleanTap = false;
      }

      // Keep the RAF running if the animator still has distance to
      // cover (e.g., user released double-tap-and-hold mid-ramp; the
      // committed target needs to finish unattended).
      if(_isAnimating()){
        if(!panRAF){
          lastTickT = performance.now();
          panRAF = requestAnimationFrame(_tick);
        }
      } else {
        if(panRAF){ cancelAnimationFrame(panRAF); panRAF = null; }
      }
    }
    _circle.addEventListener('touchend',    _endSession, {passive:false});
    _circle.addEventListener('touchcancel', _endSession, {passive:true});
  }


  // ── show / hide ──
  // Position resolution order on show:
  //   1. _lastLeft/Top if user previously moved the pill this session
  //   2. lower-right corner of .gscroll
  //   3. viewport fallback
  function _show(){
    _build();
    var pos;
    if(_lastLeft !== null && _lastTop !== null){
      pos = {left:_lastLeft, top:_lastTop};
      // Re-clamp to current viewport in case orientation changed.
      // [v1.43] Right edge respects RIGHT_NOGO_PX.
      // [v1.79] Left edge respects LEFT_NOGO_PX (mirrors right).
      pos.left = Math.max(LEFT_NOGO_PX, Math.min(window.innerWidth  - PILL_W - RIGHT_NOGO_PX, pos.left));
      pos.top  = Math.max(0, Math.min(window.innerHeight - PILL_H, pos.top));
    } else {
      pos = _spawnAtBoardCorner();
    }
    _pill.style.left = pos.left+'px';
    _pill.style.top  = pos.top+'px';
    _pill.style.display = 'block';
    // Fade in on next frame so the transition runs from opacity 0.
    requestAnimationFrame(function(){
      if(_pill) _pill.style.opacity = '1';
    });
  }

  function _hide(){
    if(!_pill) return;
    _pill.style.opacity = '0';
    // Don't remove from DOM — just hide. Cheaper to re-show, and
    // preserves the lastLeft/Top reference. Use display:none after
    // the fade so it can't catch stray taps.
    setTimeout(function(){
      if(_pill && _pill.style.opacity === '0'){
        _pill.style.display = 'none';
      }
    }, 200);
  }

  function _isVisible(){
    return !!_pill && _pill.style.display !== 'none' && _pill.style.opacity !== '0';
  }

  window._zoomPill = {
    show: _show,
    hide: _hide,
    isVisible: _isVisible
  };
})();


// [Equil 1.05] Removed: SEQUENCE SAVE/LOAD IIFE — .seq file save/load (window._seq is gone).
// [Equil 1.05] Removed: ERASE BEATS MODE IIFE — sequencer beat-range erase tool.
// [Equil 1.05] Removed: SAMPLE LIBRARY IIFE (~4,000 lines) — sample browser, folders, multi-select, import/delete.
// [Equil 1.05] Removed: SAMPLE RECORDER IIFE (~2,000 lines) — mic recording, envelope editor, EQ, FX, sample editor.

// [Equil 1.05] Removed: PRESSURE BASE SLIDER IIFE — sequencer-only.

// [Equil 1.05] Removed: PRESSURE RANGE SLIDER IIFE — sequencer-only.

// [Equil 1.05] Removed: SENSITIVITY TOGGLE + LONG-PRESS PANEL IIFE — sequencer tap-sensitivity menu.

// [Equil 1.05] Removed: HAPTIC TOGGLE BUTTON IIFE — sequencer haptic settings.

// [Equil 1.05] Removed: SPIN/PARTICLE/GLOW TOGGLES IIFE (and nested PAD DEL MODE) — sequencer-only effect toggles. SPIN_ON/PARTICLES_ON/GLOW_ON state vars stay at default values.

// [Equil 1.05] Removed: MASTER EQ WIRING IIFE — BASIC + PARAMETRIC tab logic.

// [Equil 1.05] Removed: DRAGGABLE FLOATING PANELS IIFE — BEAT LIGHTS / REC VOL panels.
// [Equil 1.05] Removed: REUSABLE SCROLLBAR STRIP IIFE — used only by sequencer panels.

// [Equil 1.05] Removed: REUSABLE LONG-PRESS HELPER IIFE — used only by sequencer.

// [Equil 1.05] Removed: EXPR MENU IIFE — sequencer pad expression menu.

// [Equil 1.05] Removed: PAD FX MENU IIFE — sequencer pad spin/particle/glow toggles.

// [Equil 1.05] Removed: PAD DSPLY MENU IIFE — sequencer pad display options.

// [Equil 1.05] Removed: REUSABLE STYLED SLIDER IIFE — used only by sequencer panels.

// [Equil 1.05] Removed: REUSABLE DRAGGABLE HEADER IIFE — used only by sequencer panels.
// [Equil 1.05] Removed: REUSABLE HINT SYSTEM IIFE — used only by sequencer panels.

// [Equil 1.05] Removed: COLOR TAG MODE IIFE — sequencer pad color tagging.

// [v2.73] Greeting sound removed. The original intent was a friendly
// 4-note "hello" jingle on page load, deferred to first interaction
// because browser audio policies block sound before user gesture. In
// practice it fired the moment a player tapped PLAY (or anywhere
// else first), making it feel like a startup jingle that no one
// asked for. Killed for public release — placement/error/win sounds
// already give the game plenty of audio personality. Function
// playGreeting() and the _greetingPlayed flag are kept harmless
// upstream (see ~line 6617 / 5447) but no longer wired to anything.
// v8.93: removed "tap anywhere to start" overlay — UI is self-explanatory.
// The greeting still plays on first interaction via the touchstart/click
// handlers above; no on-screen prompt is needed.
// Difficulty buttons
document.querySelectorAll('[data-diff]').forEach(function(b){
  b.addEventListener('click',function(){
    document.querySelectorAll('[data-diff]').forEach(function(x){x.classList.remove('on');});
    b.classList.add('on');DIFF=b.dataset.diff;
    // [v3.62] Refresh play button — new diff might have a saved game.
    if(window._refreshPlayButton)window._refreshPlayButton();
  });
});

// [v3.84] Chalant / nonchalant mode buttons. Persisted across
// sessions; gates whether the ghost-runner bar shows and whether
// solves are recorded to stats / per-template bests.
// [v3.88] Default flipped from 'chalant' to 'nonchalant'. A no-pressure
// first impression reads as more inviting for someone trying the puzzle
// for the first time; players who want stats can opt into chalant
// explicitly (and see the first-time popup when they do).
window._equilMode = 'nonchalant';
try{
  var _savedMode = localStorage.getItem('equil_mode');
  if(_savedMode === 'chalant' || _savedMode === 'nonchalant'){
    window._equilMode = _savedMode;
  }
}catch(_){}
// [v3.88] Sync initial UI to the saved mode. Default markup now has
// nonchalant .on (v3.88 swap), but if a saved mode was loaded we
// re-derive .on from it so the menu matches the actual state.
(function _syncModeBtns(){
  var btns = document.querySelectorAll('[data-mode]');
  btns.forEach(function(x){
    x.classList.toggle('on', x.dataset.mode === window._equilMode);
  });
})();

// [v3.88] First-time mode info modal. The chalant/nonchalant pair
// is meant to be self-explanatory once you've used Equil for a
// minute, but on the very first tap of each mode we surface a
// short caption so new players don't wonder what changed. After
// that the modal stays out of the way forever — gated by per-mode
// localStorage flags (equil_seen_chalant_v1, equil_seen_nonchalant_v1).
//
// Tap OK or anywhere on the backdrop to dismiss. Modal uses the
// same cyan-border / dark-bg / IBM Plex Mono language as the rest
// of the app's overlays so it doesn't feel like a foreign element.
function _showFirstTimeModeInfo(mode){
  // Don't fire if already seen.
  var seenKey = 'equil_seen_' + mode + '_v1';
  try{ if(localStorage.getItem(seenKey) === 'yes') return; }catch(_){}

  var title, body;
  if(mode === 'chalant'){
    title = 'Chalant';
    body = 'Stats will be recorded.';
  } else if(mode === 'nonchalant'){
    title = 'Nonchalant';
    body = "Take your time. Stats not recorded.";
  } else {
    return;
  }

  // Build modal.
  var backdrop = document.createElement('div');
  backdrop.className = 'mtInfoBackdrop';
  var card = document.createElement('div');
  card.className = 'mtInfoCard';
  var titleEl = document.createElement('div');
  titleEl.className = 'mtInfoTitle';
  titleEl.textContent = title;
  var bodyEl = document.createElement('div');
  bodyEl.className = 'mtInfoBody';
  bodyEl.textContent = body;
  var okBtn = document.createElement('button');
  okBtn.className = 'mtInfoOk';
  okBtn.textContent = 'OK';
  card.appendChild(titleEl);
  card.appendChild(bodyEl);
  card.appendChild(okBtn);
  backdrop.appendChild(card);
  document.body.appendChild(backdrop);

  function dismiss(){
    try{ localStorage.setItem(seenKey, 'yes'); }catch(_){}
    if(backdrop.parentNode) backdrop.parentNode.removeChild(backdrop);
  }
  okBtn.addEventListener('click', function(e){
    e.stopPropagation();
    dismiss();
  });
  // Tap-anywhere-on-backdrop dismiss, but not on the card itself
  // (so accidentally tapping the body text doesn't close it).
  backdrop.addEventListener('click', function(e){
    if(e.target === backdrop) dismiss();
  });
}

document.querySelectorAll('[data-mode]').forEach(function(b){
  b.addEventListener('click',function(){
    var newMode = b.dataset.mode;
    var changed = (newMode !== window._equilMode);
    document.querySelectorAll('[data-mode]').forEach(function(x){x.classList.remove('on');});
    b.classList.add('on');
    window._equilMode = newMode;
    try{localStorage.setItem('equil_mode', window._equilMode);}catch(_){}
    // [v3.92] Swap the active pace-box preferences to whatever the
    // user had set for this mode last. Without this swap, the two
    // modes would share a single prefs object — turning the boxes
    // off in nonchalant would carry over when the user returned to
    // chalant, even though their chalant prefs had been "all on."
    if(changed && window._swapPaceBoxModePrefs) window._swapPaceBoxModePrefs();
    // [v3.88] Show the first-time info modal for this mode if the
    // user has never seen it before. We fire this on EVERY click
    // (not just changes) so even re-tapping the currently-active
    // mode surfaces the explanation on first encounter. _showFirstTimeModeInfo
    // is a no-op if the seen flag is already set.
    _showFirstTimeModeInfo(newMode);
  });
});

// [v3.86] One-time bootstrap of per-template best times from the
// debug TIMES history (_dbgTimes). The TIMES debug panel has been
// recording entry.tpl since v3.37 (way before the ghost-runner bar
// existed), so a player with any solve history at all should see
// the bar populated on first run of v3.86 rather than having to
// re-solve every template once.
//
// Gated by equil_tpl_bests_seeded_v1 in localStorage so the
// migration only runs once. After this, normal recording (in
// _showWinCard) keeps the map current.
//
// Storage layouts:
//   _dbgTimes:                 {size: {diff: [{ms, tpl, ...}, ...]}}
//   equil_template_bests_v1:   {"size|diff|tpl": bestMs}
//
// We take the minimum ms per (size, diff, tpl) tuple. Entries
// without a tpl field (very old solves from pre-v3.37) are skipped
// since we can't attribute them.
(function _seedTplBestsFromDbgTimes(){
  try{
    if(localStorage.getItem('equil_tpl_bests_seeded_v1') === 'yes') return;
    var raw = localStorage.getItem('_dbgTimes');
    if(!raw) {
      localStorage.setItem('equil_tpl_bests_seeded_v1', 'yes');
      return;
    }
    var times = JSON.parse(raw);
    if(!times || typeof times !== 'object'){
      localStorage.setItem('equil_tpl_bests_seeded_v1', 'yes');
      return;
    }
    var existingRaw = localStorage.getItem('equil_template_bests_v1');
    var existing = {};
    if(existingRaw){
      try{ var p = JSON.parse(existingRaw); if(p && typeof p==='object') existing = p; }catch(_){}
    }
    var seeded = 0;
    Object.keys(times).forEach(function(size){
      var bySize = times[size];
      if(!bySize) return;
      Object.keys(bySize).forEach(function(diff){
        var arr = bySize[diff];
        if(!Array.isArray(arr)) return;
        for(var i = 0; i < arr.length; i++){
          var e = arr[i];
          if(!e || typeof e !== 'object') continue;
          var ms = e.ms, tpl = e.tpl;
          if(!(ms > 0) || !tpl) continue;
          var k = size + '|' + diff + '|' + tpl;
          if(existing[k] == null || ms < existing[k]){
            existing[k] = ms;
            seeded++;
          }
        }
      });
    });
    localStorage.setItem('equil_template_bests_v1', JSON.stringify(existing));
    localStorage.setItem('equil_tpl_bests_seeded_v1', 'yes');
    // Soft trace for sanity; harmless if the console isn't open.
    try{ console.log('[Equil] Seeded per-template bests from history: ' + seeded + ' entries.'); }catch(_){}
  }catch(e){
    // Never block app startup on a migration glitch.
    try{ console.warn('[Equil] template-bests seed skipped:', e); }catch(_){}
  }
})();

// [v3.90] Parallel one-time bootstrap of equil_template_stats_v1
// (best/worst/total/count) from _dbgTimes history. Same source as
// the v3.86 best-only migration, just collects more fields per
// (size,diff,tpl) tuple. Gated by its own seeded flag so it runs
// independently. Skips entries lacking a tpl field.
(function _seedTplStatsFromDbgTimes(){
  try{
    if(localStorage.getItem('equil_tpl_stats_seeded_v1') === 'yes') return;
    var raw = localStorage.getItem('_dbgTimes');
    if(!raw){
      localStorage.setItem('equil_tpl_stats_seeded_v1', 'yes');
      return;
    }
    var times = JSON.parse(raw);
    if(!times || typeof times !== 'object'){
      localStorage.setItem('equil_tpl_stats_seeded_v1', 'yes');
      return;
    }
    var existingRaw = localStorage.getItem('equil_template_stats_v1');
    var stats = {};
    if(existingRaw){
      try{
        var p = JSON.parse(existingRaw);
        if(p && typeof p==='object') stats = p;
      }catch(_){}
    }
    var seeded = 0;
    Object.keys(times).forEach(function(size){
      var bySize = times[size]; if(!bySize) return;
      Object.keys(bySize).forEach(function(diff){
        var arr = bySize[diff];
        if(!Array.isArray(arr)) return;
        for(var i = 0; i < arr.length; i++){
          var entry = arr[i];
          if(!entry || typeof entry !== 'object') continue;
          var ms = entry.ms, tpl = entry.tpl;
          if(!(ms > 0) || !tpl) continue;
          var k = size + '|' + diff + '|' + tpl;
          var rec = stats[k];
          if(!rec){
            rec = {best: ms, worst: ms, total: ms, count: 1};
          } else {
            if(ms < rec.best)  rec.best  = ms;
            if(ms > rec.worst) rec.worst = ms;
            rec.total += ms;
            rec.count += 1;
          }
          stats[k] = rec;
          seeded++;
        }
      });
    });
    localStorage.setItem('equil_template_stats_v1', JSON.stringify(stats));
    localStorage.setItem('equil_tpl_stats_seeded_v1', 'yes');
    try{ console.log('[Equil] Seeded per-template stats from history: ' + seeded + ' solves.'); }catch(_){}
  }catch(e){
    try{ console.warn('[Equil] template-stats seed skipped:', e); }catch(_){}
  }
})();

// [v3.90] Hide the top ghost-runner bar in favor of the grid-edge
// boxes. Body class triggers a CSS !important on #mastGhost so the
// JS state machine can keep updating a hidden element harmlessly.
document.body.classList.add('ghost-bar-disabled');

// [v3.90/v3.92] Pace-box visibility preferences, scoped per mode.
//
// v3.90 stored a single flat prefs object. Sam noticed that
// switching chalant→nonchalant correctly turned the boxes off,
// but switching back to chalant didn't restore the previous
// chalant prefs — both modes were sharing the same state and
// whoever toggled last won for both.
//
// v3.92 schema: equil_pace_boxes_v2 keyed by mode:
//   {chalant: {showBest, showAvg, showWorst},
//    nonchalant: {showBest, showAvg, showWorst}}
// window._paceBox is a *view* of the active mode's prefs that the
// settings panel reads/writes. _swapPaceBoxModePrefs() rebinds it
// when the mode changes.
//
// Migration: any v1 (flat) prefs are folded into BOTH modes on
// upgrade so the user doesn't lose their setup. Then v2 takes over
// and the two modes evolve independently.
window._paceBoxAll = (function(){
  var V2_KEY = 'equil_pace_boxes_v2';
  var V1_KEY = 'equil_pace_boxes_v1';
  // Cold-start defaults: all on for chalant, all off for nonchalant.
  var fresh = {
    chalant:    {showBest: true,  showAvg: true,  showWorst: true},
    nonchalant: {showBest: false, showAvg: false, showWorst: false}
  };
  // v2 wins if present.
  try{
    var raw2 = localStorage.getItem(V2_KEY);
    if(raw2){
      var p2 = JSON.parse(raw2);
      if(p2 && typeof p2 === 'object'){
        ['chalant','nonchalant'].forEach(function(m){
          if(p2[m] && typeof p2[m] === 'object'){
            ['showBest','showAvg','showWorst'].forEach(function(k){
              if(typeof p2[m][k] === 'boolean') fresh[m][k] = p2[m][k];
            });
          }
        });
        return fresh;
      }
    }
  }catch(_){}
  // No v2 yet — try migrating v1 (flat) into both buckets.
  try{
    var raw1 = localStorage.getItem(V1_KEY);
    if(raw1){
      var p1 = JSON.parse(raw1);
      if(p1 && typeof p1 === 'object'){
        // Apply v1 prefs to whichever mode the user was using when
        // they made those toggles — but since v1 didn't track mode,
        // we apply to BOTH so they don't get an unexpected switch.
        ['showBest','showAvg','showWorst'].forEach(function(k){
          if(typeof p1[k] === 'boolean'){
            fresh.chalant[k]    = p1[k];
            fresh.nonchalant[k] = p1[k];
          }
        });
      }
    }
  }catch(_){}
  return fresh;
})();
// Active-mode view that the settings panel reads/writes.
window._paceBox = window._paceBoxAll[window._equilMode] ||
                  window._paceBoxAll.chalant;
window._savePaceBoxPrefs = function(){
  // The active mode's bucket points to the same object as window._paceBox
  // (set via reference in _paceBox = _paceBoxAll[mode]), so writes
  // through window._paceBox automatically reach _paceBoxAll.
  // Belt-and-suspenders: re-sync to be safe.
  if(window._paceBoxAll && window._equilMode){
    window._paceBoxAll[window._equilMode] = window._paceBox;
  }
  try{
    localStorage.setItem('equil_pace_boxes_v2', JSON.stringify(window._paceBoxAll));
  }catch(_){}
  // If a puzzle is in flight, re-init the boxes so toggles take
  // effect immediately rather than waiting for the next puzzle.
  // [v4.20] Pace BOXES (inward-marching rectangles) disabled.
  // Function preserved (see _initPaceBoxes definition) but not called.
  // To revive: uncomment this line and hide #paceRings.
  // if(window._initPaceBoxes) window._initPaceBoxes();
  if(window._initPaceRings) window._initPaceRings();
  if(window._initPaceStats) window._initPaceStats();
};
// Called from the mode click handler. Swaps window._paceBox to point
// at the new mode's bucket. The settings panel's getter/setter
// functions read from window._paceBox so they pick up the swap
// automatically on next render.
window._swapPaceBoxModePrefs = function(){
  if(!window._paceBoxAll) return;
  var bucket = window._paceBoxAll[window._equilMode];
  if(!bucket) return;
  window._paceBox = bucket;
  // Re-init in case a puzzle's in progress so the visible boxes
  // update to the new mode's preferences right away.
  // [v4.20] Pace BOXES (inward-marching rectangles) disabled.
  // Function preserved (see _initPaceBoxes definition) but not called.
  // To revive: uncomment this line and hide #paceRings.
  // if(window._initPaceBoxes) window._initPaceBoxes();
  if(window._initPaceRings) window._initPaceRings();
  if(window._initPaceStats) window._initPaceStats();
};

// [v3.50] Play button — checks if a saved game exists for the
// currently-selected (size, diff). If so, shows the resume prompt
// modal; if not, starts a fresh puzzle as before.
// [v4.07] Also fires the opening ascending-pop fanfare on EVERY
// tap (whether we end up showing the resume prompt or starting a
// fresh puzzle). The tap unlocks the AudioContext via resumeAC()
// so the pops actually play on mobile (autoplay-blocked on cold
// boot would silently fail — but a user gesture clears that).
document.getElementById('playBtn').addEventListener('click',function(){
  resumeAC();
  if(window._playOpeningFanfare) window._playOpeningFanfare();
  var saved=window._mc113&&window._mc113.loadProgress&&window._mc113.loadProgress(SIZE,DIFF);
  if(saved&&saved.ts&&saved.ts.elapsed>0&&saved.ts.moves>0){
    // Saved game exists — show the resume/new prompt.
    if(window._showResumePrompt){window._showResumePrompt(saved);return;}
  }
  showGame();
});

// [v4.07] Wire up the undo button. The undo() function and the
// disable-management hook (renderBank: _undoBtn.disabled = HIST
// .length === 0) already existed; we just re-added the visible
// entry point. Click handler:
//   - Bails if already won (locks undo after victory per design).
//   - Bails if HIST is empty (no-op even if button is somehow
//     clicked while disabled).
//   - Calls undo() and plays the existing tile-return sound for
//     audio consistency with other return paths (drag-back, etc).
(function(){
  var u=document.getElementById('undo');
  if(!u) return;
  u.addEventListener('click', function(){
    resumeAC();
    if(window._mc113 && window._mc113.isWon && window._mc113.isWon()) return;
    if(!HIST.length) return;
    if(window.playReturn) playReturn();
    undo();
  });
})();

// [v3.62] Visual cue: when the currently-selected (size, diff)
// has a saved in-progress game, the PLAY button shows a small
// "RESUME" sub-label under "▶ PLAY". Toggled via the .has-save
// class on the button. Called whenever size or diff changes, and
// whenever the menu screen appears (since the player might be
// returning from a puzzle they just exited).
(function(){
  var playBtn=document.getElementById('playBtn');
  if(!playBtn)return;
  function refresh(){
    try{
      var saved=window._mc113&&window._mc113.loadProgress&&window._mc113.loadProgress(SIZE,DIFF);
      var hasSave=!!(saved&&saved.ts&&saved.ts.elapsed>0&&saved.ts.moves>0);
      playBtn.classList.toggle('has-save', hasSave);
    }catch(_){
      playBtn.classList.remove('has-save');
    }
  }
  window._refreshPlayButton=refresh;
  // Initial paint after DOM is ready.
  if(document.readyState==='loading'){
    document.addEventListener('DOMContentLoaded',refresh);
  } else {
    refresh();
  }
})();
// [v2.91] Wrap showMenu with a close chirp so the masthead Menu
// button (leaving the puzzle screen, going "back/down") matches
// the modal/display-button audio language.
document.getElementById('backBtn').addEventListener('click',function(){
  if(window._modalCloseChirp) window._modalCloseChirp();
  showMenu();
});
// [v2.33] Undo button removed from toolbar; guard the wire.
// [v4.08] Old wire-up retired. When the undo button was re-added
// in v4.07 this line started firing a SECOND undo per click on
// top of the proper handler we wired with sound + win-check + AC
// resume, so the user saw two undos per tap. The undo() function
// itself stays available; only this duplicate event registration
// is gone. New handler lives next to the playBtn handler.
// (function(){ var u=document.getElementById('undo'); if(u) u.addEventListener('click',undo); })();
document.getElementById('newp').addEventListener('click',newPuzzle);
document.getElementById('nxt').addEventListener('click',newPuzzle);

// [v3.38] Pause button — opens the overlay and pauses the timer.
// Tap on the overlay (outside the resume button works too) or the
// RESUME button to dismiss. Only allow pausing if a puzzle is active
// and not already won; pre-first-move taps are no-ops.
(function(){
  var pauseBtn=document.getElementById('pauseBtn');
  var overlay=document.getElementById('pauseOverlay');
  var resumeBtn=document.getElementById('pauseResumeBtn');
  if(!pauseBtn||!overlay)return;
  function showPause(){
    if(!window._mc113||window._mc113.isWon())return;
    // Only meaningful once the timer has started (i.e. after first move).
    // Before that, _mc113.curMs() returns 0 and pause() is a no-op anyway,
    // but we still gate the overlay so an idle pre-move pause doesn't
    // pop up a confusing screen.
    if(window._mc113.curMs()<=0)return;
    window._mc113.pause();
    overlay.style.display='flex';
    if(window._modalOpenChirp)window._modalOpenChirp();
  }
  function hidePause(){
    overlay.style.display='none';
    if(window._mc113)window._mc113.resume();
    if(window._modalCloseChirp)window._modalCloseChirp();
  }
  pauseBtn.addEventListener('click',function(ev){
    ev.stopPropagation();
    showPause();
  });
  // Tap anywhere on the overlay resumes — including the resume button.
  overlay.addEventListener('click',hidePause);
  // The resume button click bubbles to the overlay handler above, so
  // we don't need a second listener — but stopPropagation isn't needed
  // either since both end up calling hidePause.
  if(resumeBtn){
    resumeBtn.addEventListener('click',function(ev){
      ev.stopPropagation();
      hidePause();
    });
  }
})();

// [v3.42] READY overlay — full-screen blurred backdrop with a GO
// button. Shown after every puzzle build (newPuzzle and showGame
// flows). Tapping GO dismisses it and explicitly starts the timer
// via mc113.startTimer(), so timing data reflects active solving
// rather than including pre-first-move thinking time.
//
// Tap on the overlay background also dismisses (matches pause-
// overlay UX), but only if the tap was directly on the overlay
// not on the GO button (button gets its own handler that stops
// propagation isn't needed since hideReady is idempotent). Both
// paths converge on the same hide+start logic.
(function(){
  var overlay=document.getElementById('readyOverlay');
  var goBtn=document.getElementById('readyGoBtn');
  var blurPane=document.getElementById('readyBlurPane');
  if(!overlay)return;

  // [v3.47] Cache the GO button's original inline style string so we
  // can restore it cleanly between puzzles. Previous bug: hideReady
  // ended with `goBtn.removeAttribute('style')`, which stripped EVERY
  // inline style — including the cyan border, background, and glow
  // that defined the button's appearance. On the second puzzle, the
  // button rendered with no styles at all (browser default = gray
  // rectangle), then animated up to the timer in that broken state.
  // Caching once and reapplying on showReady restores the full look.
  var goBtnOriginalStyle=goBtn.getAttribute('style')||'';

  // [v3.48] Single blur pane that spans from the top of .gscroll down
  // through the bottom of the bank wrapper. This eliminates the seam
  // between the previous two-pane setup where you could see through
  // the gap between grid and bank. We also use a single 4px blur
  // (between the previous 2/5 split) since one continuous pane reads
  // as one zone, not two.
  function positionBlurPane(){
    if(!blurPane)return;
    var grid=document.querySelector('.gscroll');
    // Find the bank's outer container — falls back to bank-outer or
    // the bank element itself, whichever exists.
    var bank=document.querySelector('.bank-outer')
            ||document.querySelector('.bank')
            ||document.getElementById('bank');
    if(!grid){blurPane.style.display='none';return;}
    var gr=grid.getBoundingClientRect();
    var top=gr.top, bottom=gr.bottom;
    if(bank){
      var br=bank.getBoundingClientRect();
      // Only extend if bank is below the grid (defensive — could be
      // hidden in some modes).
      if(br.height>0&&br.bottom>bottom)bottom=br.bottom;
    }
    blurPane.style.display='block';
    blurPane.style.left='0px';
    blurPane.style.right='0px';
    blurPane.style.top=top+'px';
    blurPane.style.height=(bottom-top)+'px';
    blurPane.style.width='100%';
  }

  // [v3.48] Position GO button over the GRID center (not screen
  // center) so it reads as "starting in the puzzle area" and doesn't
  // sit awkwardly low when the bank pushes the screen layout down.
  function positionGoBtn(){
    var grid=document.querySelector('.gscroll');
    if(!grid)return;
    var gr=grid.getBoundingClientRect();
    // Read the button's natural size after styles applied so we can
    // center it precisely.
    goBtn.style.left='-9999px';
    goBtn.style.top='-9999px';
    goBtn.style.visibility='hidden';
    var bw=goBtn.offsetWidth, bh=goBtn.offsetHeight;
    goBtn.style.visibility='';
    var cx=gr.left+gr.width/2-bw/2;
    var cy=gr.top+gr.height/2-bh/2;
    goBtn.style.left=cx+'px';
    goBtn.style.top=cy+'px';
  }

  // [v3.48] Lock body scroll while overlay is up so the player can't
  // scroll the bank into view to peek. Stored prev value so we can
  // restore it on hide.
  var savedBodyOverflow=null;
  function lockScroll(){
    if(savedBodyOverflow===null)savedBodyOverflow=document.body.style.overflow;
    document.body.style.overflow='hidden';
  }
  function unlockScroll(){
    if(savedBodyOverflow!==null){
      document.body.style.overflow=savedBodyOverflow;
      savedBodyOverflow=null;
    }
  }

  function showReady(){
    // [v3.47] Restore button's original style for a clean canvas.
    goBtn.setAttribute('style', goBtnOriginalStyle);
    goBtn.textContent='▶ GO';
    overlay.style.transition='';
    overlay.style.opacity='';
    overlay.style.display='block';
    // [v3.48] Reset blur pane to its default values.
    if(blurPane){
      blurPane.style.backdropFilter='blur(4px)';
      blurPane.style.webkitBackdropFilter='blur(4px)';
      blurPane.style.background='rgba(0,0,0,0.05)';
    }
    // Hide the real timer wrapper while overlay is up.
    var timerWrap=document.getElementById('mastTimerWrap');
    if(timerWrap){
      timerWrap.style.opacity='0';
      timerWrap.style.textShadow='0 0 6px rgba(0,217,255,0.55)';
    }
    // Lay out blur pane and GO button position based on current rects.
    requestAnimationFrame(function(){
      positionBlurPane();
      positionGoBtn();
    });
    lockScroll();
    if(window._modalOpenChirp)window._modalOpenChirp();
  }

  // [v3.48] Simplified dismiss animation. Drop the morph/dock idea —
  // it was making the timer pill feel like another button. Now:
  //   1. Blur pane fades out (rAF stepped, since backdrop-filter
  //      doesn't transition reliably).
  //   2. GO button fades out in parallel (CSS transition).
  //   3. Real timer fades in WITH a bright glow burst that simmers
  //      down to a normal soft glow over ~500ms. This still calls
  //      attention to the start of the timer, just without the
  //      morph distraction.
  //   4. Scroll unlocks; overlay hides; cleanup.
  function hideReady(){
    if(overlay.style.display==='none'||overlay.dataset.animating==='1')return;
    overlay.dataset.animating='1';

    // Start the actual game timer immediately so when it appears
    // it's already counting and feels alive.
    if(window._mc113&&window._mc113.startTimer)window._mc113.startTimer();
    if(window._modalCloseChirp)window._modalCloseChirp();

    // Fade GO out via CSS.
    goBtn.style.transition='opacity 0.4s ease, transform 0.4s ease';
    goBtn.style.opacity='0';
    goBtn.style.pointerEvents='none';

    // Fade blur via rAF.
    var startBlur=4;
    var t0=performance.now(), dur=500;
    function step(now){
      var k=Math.min(1,(now-t0)/dur);
      var ease=1-Math.pow(1-k,3);
      var b=startBlur*(1-ease);
      if(blurPane){
        blurPane.style.backdropFilter='blur('+b+'px)';
        blurPane.style.webkitBackdropFilter='blur('+b+'px)';
        blurPane.style.background='rgba(0,0,0,'+(0.05*(1-ease))+')';
      }
      if(k<1)requestAnimationFrame(step);
    }
    requestAnimationFrame(step);

    // Fade timer in with a bright glow burst that simmers down.
    var timerWrap=document.getElementById('mastTimerWrap');
    if(timerWrap){
      timerWrap.style.opacity='1';
      // Bright burst — wider blur radius, brighter cyan, and a layered
      // glow for the "TIMER STARTED" feel.
      timerWrap.style.textShadow='0 0 14px rgba(0,217,255,1), 0 0 28px rgba(0,217,255,0.75)';
      // After 500ms, simmer the glow back down to its calm steady-state.
      setTimeout(function(){
        if(timerWrap){
          timerWrap.style.textShadow='0 0 6px rgba(0,217,255,0.55)';
        }
      },500);
    }

    // Final cleanup — unlock scroll and hide overlay.
    setTimeout(function(){
      overlay.style.display='none';
      overlay.dataset.animating='0';
      unlockScroll();
    },550);
  }

  window._showReady=showReady;
  window._hideReady=hideReady;
  // [v3.61] Only the GO button dismisses ready. Previously any tap
  // on the overlay would dismiss, which meant tapping NEW (or any
  // other masthead button) would trigger GO before the new puzzle
  // could finish building. Now: overlay is pointer-events:none,
  // blur pane swallows taps on the puzzle/bank area, and the GO
  // button is the only thing that calls hideReady. Masthead buttons
  // fall through to their normal handlers — tapping NEW gives you
  // a new puzzle with its own fresh GO overlay.
  if(goBtn){
    goBtn.addEventListener('click',function(ev){
      ev.stopPropagation();
      hideReady();
    });
  }
  // Reposition on resize so rotation/keyboard doesn't leave artifacts.
  window.addEventListener('resize',function(){
    if(overlay.style.display==='block'){
      positionBlurPane();
      positionGoBtn();
    }
  });
})();

// [v3.50] Resume prompt modal. Triggered from the Play button when
// a saved game exists for the chosen (size, diff). Two buttons:
// RESUME continues the saved puzzle; START NEW discards the save
// and builds a fresh puzzle for that mode.
(function(){
  var overlay=document.getElementById('resumeOverlay');
  var infoEl=document.getElementById('resumePromptInfo');
  var resumeBtn=document.getElementById('resumeResumeBtn');
  var newBtn=document.getElementById('resumeNewBtn');
  if(!overlay||!infoEl||!resumeBtn||!newBtn)return;

  function fmtElapsed(ms){
    if(!window._mc113||!window._mc113.fmtTime)return Math.floor(ms/1000)+'s';
    return window._mc113.fmtTime(ms);
  }
  function sizeLabel(sz){
    if(sz==='xl2')return 'JUMBO';
    return (sz||'?').toUpperCase();
  }

  // _pendingSaved holds the payload between show and click. We don't
  // re-read localStorage on click because between show and click the
  // user might have backgrounded the app and triggered a stale save
  // (unlikely but defensive).
  var _pendingSaved=null;

  function show(saved){
    if(!saved)return;
    _pendingSaved=saved;
    var t=fmtElapsed(saved.ts.elapsed);
    var m=saved.ts.moves||0;
    var sz=sizeLabel(saved.size);
    var df=(saved.diff||'').toUpperCase();
    infoEl.textContent=sz+' · '+df+' · '+t+' · '+m+' move'+(m===1?'':'s');
    overlay.style.display='flex';
    if(window._modalOpenChirp)window._modalOpenChirp();
  }
  function hide(){
    overlay.style.display='none';
    if(window._modalCloseChirp)window._modalCloseChirp();
  }
  window._showResumePrompt=show;
  window._hideResumePrompt=hide;

  resumeBtn.addEventListener('click',function(ev){
    ev.stopPropagation();
    var s=_pendingSaved;
    hide();
    if(s)showGame({resume:s});
  });
  newBtn.addEventListener('click',function(ev){
    ev.stopPropagation();
    // Clear THIS mode's saved slot, then start fresh.
    if(_pendingSaved&&window._mc113&&window._mc113.clearProgress){
      window._mc113.clearProgress(_pendingSaved.size, _pendingSaved.diff);
    }
    _pendingSaved=null;
    hide();
    showGame();
  });
})();

// [v2.97] WIN! debug button + handler removed (was v2.84). The
// win sequence is dialed in, no need for the on-screen tester
// occupying masthead space. The {skipRecord:true} flag on
// _showWinCard is kept since it costs nothing and saves the
// reimplementation work if we ever revive the test rig.

// ═══════════════════════════════════════════════════════════
// [Equil 1.13] DAILY · STATS · SHARE wiring
// ═══════════════════════════════════════════════════════════
// ═══════════════════════════════════════════════════════════
// [v2.83] WIN WAVE
// ═══════════════════════════════════════════════════════════
// When the puzzle is solved, before the fanfare and win card show,
// each bank tile bursts in sequence (top-left → bottom-right, like
// reading a book — DOM order is already row-major in renderBank).
// Each tile gets:
//   1. A small pop sound (frequency rises across the wave so the
//      sequence feels like building tension into the fanfare)
//   2. A particle burst (reuses the existing spawnParticles plumbing)
//   3. A CSS .bursting class that scales/spins/fades the tile out
//
// Timing is auto-paced: total wave budget ~1.6s, per-tile delay
// scales with tile count between 35ms (fast — for big banks) and
// 180ms (slow — for tiny banks). User asked for "around 2 seconds,
// but maybe too long" so we err slightly under that to keep the
// climax tight; easy to adjust the budget constant if it feels off.
// ═══════════════════════════════════════════════════════════

// Quick "pop" sound — sine with very short envelope and a small
// pitch microdrop. Frequency parameter lets the wave sweep up.
function _winPop(baseFreq){
  if(!AC) return;
  try{
    var t0=AC.currentTime;
    var g=AC.createGain();g.connect(AC.destination);
    g.gain.setValueAtTime(0.0001,t0);
    g.gain.exponentialRampToValueAtTime(0.13,t0+0.003);
    g.gain.exponentialRampToValueAtTime(0.0001,t0+0.080);
    var o=AC.createOscillator();o.type='sine';
    // Slight downward chirp gives each pop a tiny "bloop"
    // character that reads as "pop" rather than "beep".
    o.frequency.setValueAtTime(baseFreq*1.15, t0);
    o.frequency.exponentialRampToValueAtTime(baseFreq, t0+0.060);
    o.connect(g);
    o.start(t0);
    o.stop(t0+0.10);
  }catch(e){}
}

// Per-tile burst trigger. Spawns particles + plays pop + adds the
// CSS class. Pulled out as a helper so the wave loop reads cleanly.
function _winBurstTile(tileEl, freq){
  // Particle burst — we can't call the closure-scoped renderBank
  // spawnParticles() from out here, so we use a self-contained
  // mini version that pushes into the SAME global particle pool
  // (window._particlePool) and rides the SAME animation loop
  // (window._particleRAF). That way we get free-for-free physics
  // and rendering, without touching the existing tap-burst code.
  //
  // [v2.84] We deliberately DO NOT honor the PARTICLES_ON toggle
  // here. That toggle controls the per-tap burst (which can fire
  // hundreds of times per puzzle) — disabling it makes sense for
  // people who find tap particles distracting. The win wave is a
  // once-per-puzzle celebration moment. Hiding it because the
  // user disabled tap particles would make the win underwhelming
  // for no real ergonomic gain.
  try{ _winSpawnParticlesFromTile(tileEl); }catch(e){}
  _winPop(freq);
  // CSS class triggers the scale/spin/fade. forwards keeps the
  // tile invisible after the animation ends.
  tileEl.classList.add('bursting');
}

// Self-contained particle spawn for the win wave. Mirrors enough of
// renderBank's spawnParticles to push particles into the shared
// pool, but skips all the tap-pressure / color-sampling
// complexity. Particles inherit the bank canvas if it already
// exists; if not, we create one (same id and styling as the tap
// version so we don't conflict with it).
function _winSpawnParticlesFromTile(tileEl){
  var bankEl=document.getElementById('bank');
  if(!bankEl) return;
  var cv=document.getElementById('_particleCanvas');
  if(!cv){
    cv=document.createElement('canvas');
    cv.id='_particleCanvas';
    cv.style.cssText='position:fixed;pointer-events:none;z-index:9998;';
    document.body.appendChild(cv);
  }
  var br=bankEl.getBoundingClientRect();
  cv.width=Math.round(br.width);
  cv.height=Math.round(br.height);
  cv.style.left=br.left+'px';
  cv.style.top=br.top+'px';
  cv.style.width=br.width+'px';
  cv.style.height=br.height+'px';

  if(!window._particlePool) window._particlePool=[];
  var particles=window._particlePool;

  // Cull dead particles before adding (same hygiene as the tap path).
  for(var ci=particles.length-1;ci>=0;ci--){
    if(particles[ci].dead) particles.splice(ci,1);
  }
  if(particles.length>800) particles.splice(0,particles.length-800);

  var tr=tileEl.getBoundingClientRect();
  var tx=tr.left-br.left, ty=tr.top-br.top;
  var tw=tr.width, th=tr.height;
  var cx=tx+tw/2, cy=ty+th/2;

  // Sample tile color so debris matches the tile's hue. Falls back
  // to cyan if reading the computed style fails.
  var tileColor='#00d9ff';
  try{
    var cs=getComputedStyle(tileEl);
    if(cs && cs.color) tileColor=cs.color;
  }catch(e){}
  function parseRGB(c){
    var m=/rgba?\((\d+)[,\s]+(\d+)[,\s]+(\d+)/.exec(c);
    if(m) return [+m[1],+m[2],+m[3]];
    return [0,217,255];
  }
  var rgb=parseRGB(tileColor);

  // Number of particles per tile: enough to read as a burst, not
  // so many that a 30-tile bank brings the device to its knees.
  // 22 lets a Jumbo burst stay under 700 live particles total
  // (well within the 800 hard cap upstream).
  var COUNT=22;
  for(var i=0;i<COUNT;i++){
    // Random angle radiating outward from tile center.
    var angle=Math.random()*Math.PI*2;
    var speed=180+Math.random()*220;        // px/sec
    // Mix tile color with occasional white sparkle for visibility.
    var useWhite=(Math.random()<0.18);
    var r=useWhite?255:rgb[0];
    var g=useWhite?255:rgb[1];
    var b=useWhite?255:rgb[2];
    particles.push({
      x:cx, y:cy,
      vx:Math.cos(angle)*speed, vy:Math.sin(angle)*speed,
      life:0.85+Math.random()*0.35,        // sec — overall fade time
      age:0,
      size:1.5+Math.random()*2.0,
      r:r, g:g, b:b,
      dead:false
    });
  }

  // Kick the animation loop if it's not already running. The existing
  // tap-path RAF loop reads the same window._particlePool so we just
  // need to make sure SOMETHING is animating it.
  if(!window._particleRAF){
    var ctx=cv.getContext('2d');
    var lastT=performance.now();
    function frame(now){
      var dt=Math.min(0.05,(now-lastT)/1000);
      lastT=now;
      ctx.clearRect(0,0,cv.width,cv.height);
      var pool=window._particlePool||[];
      var anyAlive=false;
      for(var i=0;i<pool.length;i++){
        var p=pool[i];
        if(p.dead) continue;
        p.age+=dt;
        if(p.age>=p.life){ p.dead=true; continue; }
        anyAlive=true;
        p.vy+=420*dt;                        // gravity, px/sec²
        p.vx*=0.985; p.vy*=0.985;            // drag
        p.x+=p.vx*dt; p.y+=p.vy*dt;
        var alpha=1-(p.age/p.life);
        ctx.globalAlpha=Math.max(0,alpha);
        ctx.fillStyle='rgb('+p.r+','+p.g+','+p.b+')';
        ctx.beginPath();
        ctx.arc(p.x,p.y,p.size,0,Math.PI*2);
        ctx.fill();
      }
      ctx.globalAlpha=1;
      if(anyAlive){
        window._particleRAF=requestAnimationFrame(frame);
      } else {
        window._particleRAF=null;
        ctx.clearRect(0,0,cv.width,cv.height);
      }
    }
    window._particleRAF=requestAnimationFrame(frame);
  }
}

// The wave itself. Iterates bank tiles in DOM order (which renderBank
// builds row-major top-to-bottom-left-to-right), schedules each
// burst on a setTimeout, and calls onComplete after the LAST tile's
// animation finishes (not just after the LAST setTimeout fires).
function _winWaveSequence(onComplete){
  var bank=document.getElementById('bank');
  if(!bank){ if(onComplete) onComplete(); return; }
  var tiles=bank.querySelectorAll('.bt');
  if(!tiles.length){ if(onComplete) onComplete(); return; }

  // Auto-pace. Target total ~1600ms; clamp per-tile to a sane band.
  var TARGET_BUDGET_MS=1600;
  var rawDelay=TARGET_BUDGET_MS/tiles.length;
  var perTileMs=Math.max(35, Math.min(180, rawDelay));

  // Frequency sweep: start at C5 (~523 Hz), end at C6 (~1047 Hz).
  // Linear interpolation across the wave so the pitch climb feels
  // even regardless of tile count.
  var FREQ_LO=523.25;
  var FREQ_HI=1046.50;

  // Animation duration must match the .bursting CSS keyframe duration.
  var BURST_ANIM_MS=350;

  // [v4.45] Audio latency compensation. For Bluetooth/wireless output,
  // each pop's audio fires `comp` ms BEFORE its visual burst so the
  // sound reaches the speaker at the moment the visual plays. On
  // wired/built-in output, comp is ~0 and behavior is unchanged.
  var comp = (typeof window._audioCompensateMs === 'function')
    ? window._audioCompensateMs() : 0;

  for(var i=0;i<tiles.length;i++){
    (function(tileEl, idx){
      var t = (tiles.length===1) ? 0.5 : idx/(tiles.length-1);
      var freq = FREQ_LO + (FREQ_HI-FREQ_LO)*t;
      var visualAt = idx*perTileMs;
      // [v4.45] Audio fires `comp` ms earlier than visual. Math.max(0,…)
      // guards the first tile where visualAt - comp could go negative.
      setTimeout(function(){
        _winPop(freq);
      }, Math.max(0, visualAt - comp));
      setTimeout(function(){
        // Particles + bursting class. Audio is already on its way.
        try{ _winSpawnParticlesFromTile(tileEl); }catch(e){}
        tileEl.classList.add('bursting');
      }, visualAt);
    })(tiles[i], i);
  }

  // Wait for the LAST tile's animation to finish before continuing.
  // [v4.45] Add `comp` ms to the total so the fanfare audio (which
  // also gets compensated below) still lines up with the post-wave
  // pause. Net wave duration is effectively unchanged on wired output.
  var totalMs = (tiles.length-1)*perTileMs + BURST_ANIM_MS;
  if(onComplete) setTimeout(onComplete, totalMs);
}

// [v4.07] Sound-only ascending pop sequence — used as the "opening
// signature" on the Play button. Same C5→C6 sweep as the win wave,
// but no DOM, no particles, no .bursting class. Pure audio so it
// can play before any puzzle is on screen.
//
// Mobile note: this is gated by the play button TAP, which counts
// as user interaction and unlocks the AudioContext. Tapping Play
// also fires resumeAC() (see the playBtn handler), so by the time
// these pops queue up the AC is awake. We don't try to play this
// on cold boot — the splash IIFE has no audio code at all per
// Sam's note.
function _playOpeningFanfare(){
  if(!AC) return;
  resumeAC();
  var COUNT = 7;                  // pops in the run
  var PER_MS = 95;                // delay between pops
  var FREQ_LO = 523.25;           // C5
  var FREQ_HI = 1046.50;          // C6
  for(var i=0;i<COUNT;i++){
    (function(idx){
      var t = idx/(COUNT-1);
      var freq = FREQ_LO + (FREQ_HI-FREQ_LO)*t;
      setTimeout(function(){ _winPop(freq); }, idx*PER_MS);
    })(i);
  }
}
window._playOpeningFanfare = _playOpeningFanfare;

// ═══════════════════════════════════════════════════════════

// _showWinCard fills in the win card with timer / move count / PB
// label, then displays it. Called from place() when winCheck() passes
// (replacing the simpler "All equations correct" overlay used in 1.12).
// [v4.10] Rewritten for the new layout (header / two bursts / table).
function _showWinCard(opts){
  var ms=window._mc113?window._mc113.curMs():0;
  var mvs=window._mc113?window._mc113.getMoves():0;
  var mks=window._mc113&&window._mc113.getMistakes?window._mc113.getMistakes():0;
  var isDaily=window._mc113?window._mc113.isDaily():false;
  var dateStr=window._mc113?window._mc113.dailyDateStr():null;

  // [v4.10] We need to know the PRIOR stats (before this solve was
  // recorded) to detect if THIS run set a new template-time-PB or
  // template-moves-PB. recordWin's isPB flag is for the size|diff
  // aggregate, not per-template — and we want the bursts gated on
  // the per-template comparison since that's what the table shows.
  // Snapshot now, then record, then compare.
  var _tplNmEarly = window._currentTplName;
  var _priorTplStats = null;
  try{
    if(_tplNmEarly && window._mc113 && window._mc113.getGhostStats){
      _priorTplStats = window._mc113.getGhostStats(SIZE, DIFF, _tplNmEarly);
    }
  }catch(_){}

  // Record the result and learn whether this was a personal best.
  // [v2.84] opts.skipRecord skips the localStorage write — used by
  // the WIN! debug button so test fires don't pollute real stats
  // with bogus solves. The stats screen would otherwise inflate
  // your solved-count and falsely PB on every test press.
  // [v3.84] Also skip recording in nonchalant mode. Nonchalant is
  // a no-pressure mode — the timer runs for personal reference but
  // nothing is committed to stats or per-template bests. This
  // protects the integrity of chalant stats so they reflect actual
  // focused attempts, not idle play.
  var result={isPB:false,rec:null,clean:false};
  var _nonchalant = (window._equilMode === 'nonchalant');
  var _recorded = !(opts && opts.skipRecord) && !_nonchalant;
  if(window._mc113 && _recorded){
    result=window._mc113.recordWin(SIZE,DIFF,ms,mvs,isDaily,dateStr,mks);
    // [v3.84] Also update per-template best for the ghost-runner bar.
    // [v3.90] Plus the richer per-template stats (best/worst/avg) for
    // the grid-edge pace boxes.
    try{
      var _tplName = window._currentTplName;
      if(_tplName && window._mc113._recordTplBest){
        window._mc113._recordTplBest(SIZE, DIFF, _tplName, ms);
      }
      if(_tplName && window._mc113._recordTplStats){
        window._mc113._recordTplStats(SIZE, DIFF, _tplName, ms, mvs);
      }
    }catch(_){}
  }

  // [v4.10] Determine per-template PB flags. We compare this run's
  // metrics to the PRIOR template stats snapshot (taken before
  // recording) so we know if this run beat what was on record.
  //   - First-ever solve of the template (_priorTplStats null):
  //     don't fire bursts. No prior history means the comparison
  //     is meaningless — every first-time solve would "PB".
  //   - Skipped runs (skipRecord / nonchalant): no PB bursts.
  //   - Moves PB: only meaningful if prior stats had movesCount > 0,
  //     i.e. we have at least one prior solve with moves data
  //     recorded (post-v4.10 entries).
  var _newTimeBest  = false;
  var _newMovesBest = false;
  if(_recorded && _priorTplStats){
    if(_priorTplStats.count >= 1 && ms < _priorTplStats.best){
      _newTimeBest = true;
    }
    if(_priorTplStats.movesCount >= 1 && _priorTplStats.bestMoves != null
       && mvs < _priorTplStats.bestMoves){
      _newMovesBest = true;
    }
  }

  // Header (size · diff and template name).
  var sizeEl = document.getElementById('winSizeDiff');
  var tplNmEl = document.getElementById('winTplName');
  if(sizeEl){
    var _sz = (window.sizeLabel ? window.sizeLabel(SIZE) : (SIZE||'').toUpperCase());
    var _df = (DIFF||'').toUpperCase();
    sizeEl.textContent = _sz + ' · ' + _df;
  }
  if(tplNmEl) tplNmEl.textContent = window._currentTplName || '--';

  // Current-run line (timer · moves · mistakes).
  var tEl=document.getElementById('winTimer');
  var mEl=document.getElementById('winMoves');
  var kEl=document.getElementById('winMistakes');
  var kWrap=document.getElementById('winMistakesWrap');
  if(tEl) tEl.textContent=window._mc113?window._mc113.fmtTime(ms):'';
  if(mEl) mEl.textContent=String(mvs);
  if(kEl) kEl.textContent=String(mks);
  if(kWrap) kWrap.style.display=(mks>0?'inline':'none');

  // [v4.11] New mistake indicator lives in the unified stats grid's
  // current-run row, in the LABEL column (where Best/Avg/Least Best
  // labels sit for the historical rows). Uses visibility:hidden when
  // zero so the row's height stays consistent — keeps the grid from
  // jumping when clean vs. messy runs render.
  var curMksEl = document.getElementById('winCurMistakes');
  if(curMksEl){
    curMksEl.textContent = String(mks) + ' \u2715';
    curMksEl.style.visibility = (mks > 0) ? 'visible' : 'hidden';
  }

  // Clean-solve magenta label (independent of PB; both can show).
  var cleanEl = document.getElementById('winCleanLabel');
  if(cleanEl) cleanEl.style.display = (mks === 0) ? 'block' : 'none';

  // Old winLabel kept hidden; left in DOM for downstream code that
  // might reference it. Blank it so no stale text shows if revived.
  var lEl=document.getElementById('winLabel');
  if(lEl){ lEl.textContent=''; lEl.style.display='none'; }

  // Per-template best/avg/worst table. Reads stats AGAIN after the
  // record so the table reflects the just-recorded state.
  var tplRow = document.getElementById('winTplStats');
  if(tplRow){
    try{
      var _tplStats = null;
      var _tplNm = window._currentTplName;
      if(_tplNm && window._mc113 && window._mc113.getGhostStats){
        _tplStats = window._mc113.getGhostStats(SIZE, DIFF, _tplNm);
      }
      // Show the table only when we have meaningful data. count >= 2
      // for the time column (need at least one prior solve to compare
      // to). The moves columns get filled separately and degrade to
      // "--" if the entry predates v4.10 moves tracking.
      if(_tplStats && _tplStats.count >= 2){
        var fmt = window._mc113.fmtTime;
        var bEl = document.getElementById('winTplBest');
        var aEl = document.getElementById('winTplAvg');
        var wEl = document.getElementById('winTplWorst');
        if(bEl) bEl.textContent = fmt(_tplStats.best);
        if(aEl) aEl.textContent = fmt(_tplStats.avg);
        if(wEl) wEl.textContent = fmt(_tplStats.worst);
        // Tint the time-best magenta when current run set it.
        if(bEl){
          bEl.style.color = (_recorded && _tplStats.best === ms)
            ? 'var(--magenta)' : 'var(--text-primary)';
        }

        // Moves columns. Show only if we have move data on file
        // (movesCount > 0). Pre-v4.10 entries will leave these as
        // "--" until enough new solves come in to populate them.
        var bmEl = document.getElementById('winTplBestMoves');
        var amEl = document.getElementById('winTplAvgMoves');
        var wmEl = document.getElementById('winTplWorstMoves');
        if(_tplStats.movesCount >= 2 && _tplStats.bestMoves != null){
          if(bmEl){
            bmEl.textContent = String(_tplStats.bestMoves);
            bmEl.style.color = (_recorded && _tplStats.bestMoves === mvs)
              ? 'var(--magenta)' : 'var(--text-primary)';
          }
          if(amEl) amEl.textContent = String(_tplStats.avgMoves);
          if(wmEl) wmEl.textContent = String(_tplStats.worstMoves);
        } else {
          // Not enough moves history yet. Show dashes; they'll start
          // populating once a few solves accumulate post-v4.10.
          if(bmEl){ bmEl.textContent = '--'; bmEl.style.color = 'var(--text-muted)'; }
          if(amEl){ amEl.textContent = '--'; amEl.style.color = 'var(--text-muted)'; }
          if(wmEl){ wmEl.textContent = '--'; wmEl.style.color = 'var(--text-muted)'; }
        }
        tplRow.style.display = 'block';

        // [v4.11] Also tint the CURRENT-RUN values magenta when they
        // set a PB. Otherwise they stay green (which signals "this
        // is the run you just did" without being a record).
        // Note: tEl/mEl are the winTimer/winMoves elements which now
        // live in the unified grid's current-run row. We update their
        // color here so the row visually celebrates a PB alongside
        // the matching Best row value below.
        if(tEl){
          tEl.style.color = _newTimeBest  ? 'var(--magenta)' : 'var(--cyan)';
        }
        if(mEl){
          mEl.style.color = _newMovesBest ? 'var(--magenta)' : 'var(--cyan)';
        }
      } else {
        tplRow.style.display = 'none';
        // Even with no historical stats to show, the current-run row
        // is part of that grid — so when the grid is hidden, there's
        // nothing to color. (First-ever solve hides the whole panel.)
      }
    }catch(_){
      tplRow.style.display = 'none';
    }
  }

  // [v4.10] Bursts. Independent show/hide for time and moves PBs.
  // They reveal with a slight stagger so both don't snap in
  // simultaneously when both fire — feels more alive.
  //
  // [v4.11] Dev overrides for demo/screenshot purposes. Set either
  // flag to true in the console (or here) to force the corresponding
  // burst to display regardless of whether it was a real PB. Useful
  // for taking promo screenshots before the player has built up
  // enough history to organically PB.
  //   window._forceTimeBurst  = true;
  //   window._forceMovesBurst = true;
  // Both default to false; leave the actual gating logic untouched.
  var _showTimeBurst  = _newTimeBest  || !!window._forceTimeBurst;
  var _showMovesBurst = _newMovesBest || !!window._forceMovesBurst;
  var burstTime = document.getElementById('winBurstTime');
  var burstMoves = document.getElementById('winBurstMoves');
  // Reset both to hidden first (in case last solve had them).
  if(burstTime){
    burstTime.style.display = 'none';
    burstTime.style.opacity = '0';
  }
  if(burstMoves){
    burstMoves.style.display = 'none';
    burstMoves.style.opacity = '0';
  }
  if(_showTimeBurst && burstTime){
    burstTime.style.display = 'block';
    // Reveal on next frame so the transition fires.
    setTimeout(function(){ burstTime.style.opacity = '1'; }, 350);
  }
  if(_showMovesBurst && burstMoves){
    burstMoves.style.display = 'block';
    // Staggered slightly behind the time burst if both fire.
    setTimeout(function(){ burstMoves.style.opacity = '1'; },
               _showTimeBurst ? 550 : 350);
  }

  // [v2.85] Position the win card so its center sits on the grid's
  // visual center. Without this, the card flex-centered in the
  // viewport overlay, which read as "low" because the user's eye
  // is anchored on the grid (which is biased upward in the
  // layout). Width is also clamped to roughly the grid's width
  // so the card visually feels like it's claiming the puzzle's
  // footprint when it pops in.
  _positionWinCardOverGrid();
  document.getElementById('win').classList.add('show');
}

// ═══════════════════════════════════════════════════════════
// [v2.85] Win card positioning helper. Reads the current grid's
// bounding rect and writes left/top + max-width onto the .wcard so
// the card animates from (and lands at) the grid's center. Called
// from _showWinCard right before the .show class is added so the
// keyframe scale-up runs from the correct anchor.
//
// Width clamp logic: the card has variable content (timer, moves,
// mistake count, label, two buttons) and a CSS min that reads well
// on phones. We want the FINAL on-screen width to be close to the
// grid's width without going below the natural minimum or above
// some practical ceiling. So we set max-width to grid width clamped
// to [280px, 460px]. The card's inherent flex layout decides actual
// width within that range.
//
// Falls back gracefully if #gridClip isn't found (e.g., card is
// shown before grid renders) — defaults to viewport center, which
// is the v2.84 behavior.
// ═══════════════════════════════════════════════════════════
function _positionWinCardOverGrid(){
  var card=document.querySelector('#win .wcard');
  if(!card) return;
  var grid=document.getElementById('gridClip');
  if(!grid){
    // Fallback: clear any prior inline positioning so the card
    // lands on the .wov default center.
    card.style.left=''; card.style.top=''; card.style.maxWidth='';
    return;
  }
  var r=grid.getBoundingClientRect();
  if(r.width<=0||r.height<=0){
    card.style.left=''; card.style.top=''; card.style.maxWidth='';
    return;
  }
  var cx=r.left+r.width/2;
  var cy=r.top+r.height/2;
  // Pixel positions (.wov is position:fixed inset:0, so the card's
  // absolute coordinates are viewport coordinates).
  card.style.left=cx+'px';
  card.style.top=cy+'px';
  // Width clamp — see header comment.
  var clampW=Math.max(280, Math.min(460, r.width));
  card.style.maxWidth=clampW+'px';
}

// Daily button — derives a deterministic seed from today's date so all
// players get the same puzzle. Plays a UI click, then launches showGame
// with daily mode on. The seed mixes in current SIZE/DIFF selections so
// e.g. "small/easy daily" ≠ "xl2/hard daily" but each is consistent
// across the day.
var dailyBtn=document.getElementById('dailyBtn');
if(dailyBtn){
  dailyBtn.addEventListener('click',function(){
    if(window.playUIClick) try{playUIClick();}catch(e){}
    resumeAC();
    showGame({daily:true});
  });
}

// Stats screen open/close + reset
var statsBtn=document.getElementById('statsBtn');
if(statsBtn){
  statsBtn.addEventListener('click',function(){
    // [v2.93] Open chirp — same family as the TILE ADJUST modal,
    // settings panel, and display-mode buttons. Replaces the
    // previous playUIClick (a generic UI click that didn't have
    // open/close directionality).
    if(window._modalOpenChirp) window._modalOpenChirp();
    if(window._mc113) window._mc113.renderStatsScreen();
    var ov=document.getElementById('statsOverlay');
    if(ov){ov.style.display='flex';}
  });
}
var statsCloseBtn=document.getElementById('statsCloseBtn');
if(statsCloseBtn){
  statsCloseBtn.addEventListener('click',function(){
    // [v2.93] Close chirp — pairs with the open chirp above so
    // the stats overlay's open/close gesture sounds like a
    // matched set.
    if(window._modalCloseChirp) window._modalCloseChirp();
    var ov=document.getElementById('statsOverlay');
    if(ov) ov.style.display='none';
  });
}
var statsClearBtn=document.getElementById('statsClearBtn');
if(statsClearBtn){
  // [v2.94] Long-press confirm replaces the old two-tap pattern.
  // [v2.96] Visual rewritten: instead of a left-to-right fill
  // bar (mostly hidden under the user's finger during a press),
  // the button now grows a RED GLOW that emanates outward from
  // its border. Visible AROUND the finger so users can see the
  // charge progressing without lifting up. Implemented as a
  // CSS box-shadow transition driven inline from JS — no extra
  // DOM, no overflow/clipping issues, plays nicely with the
  // pill border-radius. The glow grows in radius and intensity
  // simultaneously: at 0% it's invisible, at 100% (pop) it's
  // a strong wide bloom. On cancel it fades back smoothly.
  //
  // Implementation note: box-shadow accepts comma-separated
  // values; we layer two — a bright inner halo and a wider soft
  // outer one — so the glow has body without being a flat blur.
  // Border-color also brightens during charge for added punch.

  // Stash the resting border / shadow so cancel can restore them
  // exactly. Read once at wire time; the inline style holds.
  var REST_BORDER = statsClearBtn.style.borderColor || 'rgba(255,107,107,0.5)';
  var REST_SHADOW = '';
  // Make the box-shadow transition nicely.
  statsClearBtn.style.transition =
    'box-shadow ' + 650 + 'ms ease-out, ' +
    'border-color ' + 650 + 'ms ease-out';

  var HOLD_MS = 650;
  var _holdTimer = null;
  var _pressing = false;

  // Audio: a rising "charging" tone during the press, plus a
  // sharp "pop" at completion. Cancel doesn't make a sound — the
  // visual rewind is enough.
  var _chargeNodes = null;
  function _startCharge(){
    try{
      if(!AC) return; resumeAC();
      var t0 = AC.currentTime;
      var g = AC.createGain();
      g.gain.setValueAtTime(0.0001, t0);
      g.gain.exponentialRampToValueAtTime(0.06, t0 + 0.05);
      g.connect(AC.destination);
      var o = AC.createOscillator();
      o.type = 'sawtooth';
      // Sweep upward across the hold duration so the user hears
      // the tension building. C3 → A4 over 650ms.
      o.frequency.setValueAtTime(130, t0);
      o.frequency.exponentialRampToValueAtTime(440, t0 + (HOLD_MS/1000));
      // Tame the sawtooth's high harmonics with a bandpass.
      var bp = AC.createBiquadFilter();
      bp.type = 'bandpass';
      bp.frequency.value = 600;
      bp.Q.value = 0.8;
      o.connect(bp); bp.connect(g);
      o.start(t0);
      _chargeNodes = {o:o, g:g};
    }catch(_){}
  }
  function _stopCharge(){
    if(!_chargeNodes) return;
    try{
      var t = AC.currentTime;
      var n = _chargeNodes; _chargeNodes = null;
      n.g.gain.cancelScheduledValues(t);
      n.g.gain.setValueAtTime(n.g.gain.value, t);
      n.g.gain.exponentialRampToValueAtTime(0.0001, t + 0.04);
      n.o.stop(t + 0.06);
    }catch(_){}
  }
  function _resetPop(){
    try{
      if(!AC) return;
      var t0 = AC.currentTime;
      var g = AC.createGain();
      g.gain.setValueAtTime(0.0001, t0);
      g.gain.exponentialRampToValueAtTime(0.20, t0 + 0.005);
      g.gain.exponentialRampToValueAtTime(0.0001, t0 + 0.12);
      g.connect(AC.destination);
      var o = AC.createOscillator();
      o.type = 'square';
      // Quick downward "thunk" — high → low over the pop's duration.
      o.frequency.setValueAtTime(440, t0);
      o.frequency.exponentialRampToValueAtTime(110, t0 + 0.10);
      o.connect(g);
      o.start(t0);
      o.stop(t0 + 0.13);
    }catch(_){}
  }

  // [v2.96] Glow targets. Layered shadow at peak: bright inner +
  // wider outer. RGB stays the same red (255,107,107) used for
  // the button's resting border; only spread/blur/alpha change.
  var SHADOW_PEAK =
    '0 0 18px 4px rgba(255,107,107,0.95), ' +
    '0 0 42px 12px rgba(255,107,107,0.55)';
  var BORDER_PEAK = 'rgba(255,107,107,1)';

  function _beginPress(){
    if(_pressing) return;
    _pressing = true;
    // Charge the glow over the full hold duration. The CSS
    // transition (set on .style at wire time) drives the
    // animation — we just set the target values.
    statsClearBtn.style.transition =
      'box-shadow ' + HOLD_MS + 'ms ease-out, ' +
      'border-color ' + HOLD_MS + 'ms ease-out';
    statsClearBtn.style.boxShadow = SHADOW_PEAK;
    statsClearBtn.style.borderColor = BORDER_PEAK;
    _startCharge();
    _holdTimer = setTimeout(function(){
      // Commit.
      _holdTimer = null;
      _pressing = false;
      _stopCharge();
      _resetPop();
      if(window._mc113){
        window._mc113.clearStats();
        window._mc113.renderStatsScreen();
        window._mc113.showToast('Stats cleared');
      }
      // Snap glow back to rest after a brief peak hold so the
      // moment of completion is visually punctuated. Use a
      // shorter fade than the cancel rewind because commit
      // should feel decisive.
      setTimeout(function(){
        statsClearBtn.style.transition =
          'box-shadow 240ms ease-out, ' +
          'border-color 240ms ease-out';
        statsClearBtn.style.boxShadow = REST_SHADOW;
        statsClearBtn.style.borderColor = REST_BORDER;
      }, 80);
    }, HOLD_MS);
  }
  function _cancelPress(){
    if(!_pressing && !_holdTimer) return;
    _pressing = false;
    if(_holdTimer){ clearTimeout(_holdTimer); _holdTimer = null; }
    _stopCharge();
    // Glow rewinds — fast smooth fade so the user gets clear
    // "release detected" feedback. Quicker than the charge so
    // cancel feels light vs the deliberate buildup.
    statsClearBtn.style.transition =
      'box-shadow 180ms ease-out, ' +
      'border-color 180ms ease-out';
    statsClearBtn.style.boxShadow = REST_SHADOW;
    statsClearBtn.style.borderColor = REST_BORDER;
  }

  // Wire pointer events. preventDefault on touchstart blocks the
  // synthetic mouse events the OS would otherwise dispatch — we
  // don't want a single tap to fire BOTH touchstart and mousedown
  // and double-arm the press.
  statsClearBtn.addEventListener('touchstart', function(e){
    e.preventDefault();
    _beginPress();
  }, {passive:false});
  statsClearBtn.addEventListener('touchend',    function(){ _cancelPress(); }, {passive:true});
  statsClearBtn.addEventListener('touchcancel', function(){ _cancelPress(); }, {passive:true});
  statsClearBtn.addEventListener('mousedown',   function(){ _beginPress(); });
  statsClearBtn.addEventListener('mouseup',     function(){ _cancelPress(); });
  statsClearBtn.addEventListener('mouseleave',  function(){ _cancelPress(); });
}

// Share button — generates a Wordle-style emoji grid and copies it to
// the clipboard. Shows a toast confirmation on success.
// [v2.82] Share button replaced with a Menu button that returns to
// the puzzle-size selector. Old share handler is removed; the
// underlying buildShareText() and copyText() functions are kept on
// _mc113 (lines 7165, 7221) since they're cheap to keep and would
// be the bulk of the work to write again if we revive sharing for
// a daily puzzle / leaderboard feature later.
var winMenuBtn=document.getElementById('winMenuBtn');
if(winMenuBtn){
  winMenuBtn.addEventListener('click',function(){
    // [v2.91] Close chirp — leaving the win screen for the menu
    // is the same gestural family as closing the TILE ADJUST
    // modal or settings panel.
    if(window._modalCloseChirp) window._modalCloseChirp();
    // Hide the win overlay BEFORE showing the menu so the fade
    // doesn't briefly stack the overlay over the selection screen.
    var winEl=document.getElementById('win');
    if(winEl) winEl.classList.remove('show');
    showMenu();
  });
}

// ═══════════════════════════════════════════════════════════
// ═══════════════════════════════════════════════════════════
// [Equil 1.08+1.09] OPTIONS PANEL
// ═══════════════════════════════════════════════════════════
// Toggles + tuning sliders for visual effects. Persists choices to
// localStorage under 'equil_opts_v2' (bumped from v1 in 1.09 to
// avoid loading the smaller 1.08-era schema).
//
// Toggles (1.08): GLOW_ON, PARTICLES_ON, SPIN_ON, PULSE_EQ_ON
// Sliders (1.09):
//   spinDurMult     — spin duration mult (0.3 fast … 2.5 slow), default 1.0
//   partLifeMult    — particle lifetime  (10 short … 150 long),  default 55
//   partSpeedMult   — particle speed     (0.3 slow … 3.0 fast),  default 1.0
//   partSizeMult    — particle size      (0.3 small … 3.0 big),  default 1.0
//   glowBrightMult  — glow brightness    (0.2 dim … 3.0 bright), default 1.0
// Each slider only renders under its parent toggle when the toggle is on.
(function(){
  var OPT_KEY = 'equil_opts_v2';

  // Defaults — also serve as "Reset" targets
  var DEF = {
    glow:           false,
    particles:      false,
    spin:           false,
    pulseEq:        false,
    pill:           false,
    spinDurMult:    1.0,
    partLifeMult:   55,
    partSpeedMult:  1.0,
    partSizeMult:   1.0,
    glowBrightMult: 1.0,
    // [v2.44] Drag-tiles toggle + bank-padding settings.
    // dragTiles OFF (default): tiles are not draggable; tap-to-place
    //   only when a cell is selected; touching tiles otherwise scrolls
    //   the page. Bank has zero side padding.
    // dragTiles ON: original drag-and-magnet behavior; bank has side
    //   padding (per the bankPadWidth/bankPadSide settings) so users
    //   have scroll-grab strips on either side that can't accidentally
    //   start a drag.
    dragTiles:      false,
    bankPadWidth:   40,         // px, when dragTiles is ON
    bankPadSide:    'both',     // 'both' | 'left' | 'right'
    // [v2.51] xN-mode spacing tunables. Both expressed as percentages
    // of tileSize so they scale proportionally as the tile grows or
    // shrinks via the size slider.
    //   xnTopPct: distance from tile's top border to the white digit.
    //     Default 4% matches the legacy padTop calculation.
    //   xnGapPct: distance between the white digit's bottom and the
    //     cyan ×N's top. Default 0% lets the cyan sit immediately
    //     under the white. Whatever space remains below the cyan is
    //     visual breathing room before the bottom border.
    xnTopPct:       4,
    xnGapPct:       0,
    // [v2.54] Font size multipliers, applied on top of the existing
    // automatic per-tile-size font calculations. xnWhiteMult of 1.0
    // means "use the current formula unchanged" (whiteFont =
    // tileFontSize * 1.6). xnCyanMult of 1.0 means cyan stays at
    // 0.6× of the white font. Adjust to dial in proportions per
    // display mode without touching tile size.
    xnWhiteMult:    1.0,
    xnCyanMult:     1.0,
    // [v2.57] Mini-mode (####) tuning settings — parallel to the xN
    // settings but separately persisted so each display mode can be
    // dialed in independently. Mini mode has a grid of cyan numbers
    // below the white digit, so it ALSO has row/column spacing
    // controls that xN doesn't need.
    //   miniTopPct: white digit's distance from top border (% of tileSize)
    //   miniGapPct: gap from white digit's bottom to first cyan row
    //   miniRowGapPct: vertical gap between cyan rows (% of tileSize)
    //   miniColGapPct: horizontal gap between cyan columns
    //   miniWhiteMult: multiplier on the white font (default = tileFontSize)
    //   miniCyanMult:  multiplier on the cyan grid font
    miniTopPct:     6,
    miniGapPct:     0,
    miniRowGapPct:  0.5,
    miniColGapPct:  0.5,
    miniWhiteMult:  1.0,
    miniCyanMult:   1.0,
    // [v3.53] Placed-tile pulse settings (the dim-green breath
    // introduced in v3.52). Defaults: enabled, peak at 0.9 (matches
    // v3.52's hardcoded peak), unsynchronized (each tile uses its
    // cell-key-derived phase).
    pulseEnabled:   true,
    pulsePeak:      0.9,
    pulseSync:      false,
    // [v3.54] Pulse speed in seconds per full cycle. 3.6s matches
    // v3.52/v3.53. Slider range 1.2 → 7.0 lets the player dial from
    // a quick attention-getting pulse down to a slow, almost
    // imperceptible breath.
    pulseSpeed:     3.6,
    // [v4.43] Pace rings + fuses + ring opacity.
    //   paceRings: master on/off for the whole ring system (rings AND
    //     fuses). When off, nothing pace-related renders.
    //   paceFuses: bright 2×2 square that rides each ring's erasing
    //     front. Only matters when paceRings is true.
    //   paceRingOpacity: stroke-opacity of all three rings, slider 0.1 → 1.0.
    // [v4.47] paceRings default flipped from true to false — pace
    // stats below replace the rings as the primary feedback.
    paceRings:        false,
    paceFuses:        true,
    paceRingOpacity:  0.4,
    // [v4.47] Pace stats — three time targets (best/avg/worst) shown
    // near the timer, each grays out as elapsed passes its target.
    // Replaces pace rings as the default pace-pressure feedback.
    paceStats:        true,
    // [v4.45] Bluetooth/wireless audio latency compensation.
    // When true, scheduled sounds tied to a visual event (the win
    // wave per-tile pops, the post-wave fanfare→win-card timing)
    // get shifted to land in sync with the visual. Has no effect
    // on input-triggered sounds (taps, drags). On wired/built-in
    // output the compensation is below the threshold and behaves
    // identically to OFF — but we keep the toggle so a user with
    // a noisy outputLatency reading can opt out.
    audioCompensate:  true,
    // [v4.46] Legibility options (Path B — quick contrast fixes
    // before the full light mode in a later version).
    //   highContrast: when true, blank-cell cyan borders go from
    //     0.25 alpha to 0.6, and lattice goes from 0.32 to 0.12.
    //     Net effect: cells read clearly above the gridlines so
    //     users can tell empty cells apart from grid pattern.
    //   showLattice: master toggle for the lattice gridlines.
    // [v4.47] Defaults flipped per testers: highContrast true,
    // showLattice false — really is just easier to play that way.
    highContrast:     true,
    showLattice:      false,
    // [v4.58] Force PB bursts on every solve. Default OFF — bursts
    // only fire on legit personal bests for the current template.
    // Useful for troubleshooting / screenshots / verifying the
    // visual treatment without organically beating your best.
    // Was hardcoded `_forceMovesBurst = true` from v4.11 (a dev
    // shortcut that never got reverted) which is what Sam was
    // seeing as "best moves always shows up on the win card."
    forceWinBursts:   false,
    // [v4.60] Master sound effects toggle. When OFF, all UI / game
    // sound is silenced (taps, places, returns, errors, win fanfare,
    // modal chirps, etc.). Latency compensation toggle stays separate
    // since it's only relevant when sound is ON. Sound is on by
    // default — Equil ships with sound as part of the experience.
    sfxOn:            true
  };

  // ── Load saved options (apply to globals) ──
  function _applyTuning(){
    // Particle hooks (already plumbed in spawnParticles)
    window._partLifeMult  = (typeof window._optPartLifeMult ==='number') ? window._optPartLifeMult  : DEF.partLifeMult;
    window._partSpeedMult = (typeof window._optPartSpeedMult==='number') ? window._optPartSpeedMult : DEF.partSpeedMult;
    window._partSizeMult  = (typeof window._optPartSizeMult ==='number') ? window._optPartSizeMult  : DEF.partSizeMult;
    // Spin hook (added in 1.09 to the inline duration formula)
    window._spinDurMult   = (typeof window._optSpinDurMult  ==='number') ? window._optSpinDurMult   : DEF.spinDurMult;
    // Glow brightness — multiplies the existing _padGlowScale formula.
    // We override _padGlowScale to compose with our user mult.
    var g = (typeof window._optGlowBrightMult==='number') ? window._optGlowBrightMult : DEF.glowBrightMult;
    window._padGlowScale = function(){ return g; };
    // [v2.44] Drag-tiles + bank padding hooks. The bank-level
    // touchstart handler reads window._dragTilesEnabled at touch
    // time. The bank padding is read inside renderBank() — call
    // it after this so the UI reflects the new padding immediately
    // when the user toggles or adjusts these settings.
    window._dragTilesEnabled = (typeof window._optDragTiles==='boolean') ? window._optDragTiles : DEF.dragTiles;
    // [v4.66] Reflect drag-tiles state on the body element so CSS
    // can flip `.bt` touch-action between `pan-y` (drag off — touches
    // on tiles can scroll the page like the rest of the bank) and
    // `none` (drag on — touches on tiles are owned by the drag
    // handler and never trigger page panning). Without this, the
    // browser would start scrolling the moment the user moved their
    // finger past its built-in scroll threshold (~2-3px), which
    // happens before our DRAG_THRESHOLD (8px) trips. Result was
    // "the page scrolls under me while I'm trying to pick up a tile."
    try{ document.body.classList.toggle('drag-tiles-on', window._dragTilesEnabled === true); }catch(_){}
    window._bankPadWidth     = (typeof window._optBankPadWidth==='number') ? window._optBankPadWidth : DEF.bankPadWidth;
    window._bankPadSide      = (typeof window._optBankPadSide==='string') ? window._optBankPadSide : DEF.bankPadSide;
    // [v2.51] xN spacing tunables — used inside renderBank's xN block
    // to position the white digit and cyan ×N badge.
    window._xnTopPct = (typeof window._optXnTopPct==='number') ? window._optXnTopPct : DEF.xnTopPct;
    window._xnGapPct = (typeof window._optXnGapPct==='number') ? window._optXnGapPct : DEF.xnGapPct;
    // [v2.54] Font multipliers — read by renderBank when computing
    // _whiteFont and the cyan mulSize.
    window._xnWhiteMult = (typeof window._optXnWhiteMult==='number') ? window._optXnWhiteMult : DEF.xnWhiteMult;
    window._xnCyanMult  = (typeof window._optXnCyanMult ==='number') ? window._optXnCyanMult  : DEF.xnCyanMult;
    // [v2.57] Mini-mode settings.
    window._miniTopPct    = (typeof window._optMiniTopPct   ==='number') ? window._optMiniTopPct    : DEF.miniTopPct;
    window._miniGapPct    = (typeof window._optMiniGapPct   ==='number') ? window._optMiniGapPct    : DEF.miniGapPct;
    window._miniRowGapPct = (typeof window._optMiniRowGapPct==='number') ? window._optMiniRowGapPct : DEF.miniRowGapPct;
    window._miniColGapPct = (typeof window._optMiniColGapPct==='number') ? window._optMiniColGapPct : DEF.miniColGapPct;
    window._miniWhiteMult = (typeof window._optMiniWhiteMult==='number') ? window._optMiniWhiteMult : DEF.miniWhiteMult;
    window._miniCyanMult  = (typeof window._optMiniCyanMult ==='number') ? window._optMiniCyanMult  : DEF.miniCyanMult;
    // [v3.53] Placed-tile pulse — toggle, peak brightness, sync.
    // render() reads these directly to decide whether to apply the
    // .ok-breath class and whether to use a hash-derived per-tile
    // phase delay or a single shared phase.
    window._pulseEnabled = (typeof window._optPulseEnabled==='boolean') ? window._optPulseEnabled : DEF.pulseEnabled;
    window._pulsePeak    = (typeof window._optPulsePeak   ==='number')  ? window._optPulsePeak    : DEF.pulsePeak;
    window._pulseSync    = (typeof window._optPulseSync   ==='boolean') ? window._optPulseSync    : DEF.pulseSync;
    window._pulseSpeed   = (typeof window._optPulseSpeed  ==='number')  ? window._optPulseSpeed   : DEF.pulseSpeed;
    // [v4.43] Pace ring system globals. These are read by the pace
    // ring init/update code in the IIFE further down.
    //   _paceRingsOn: master gate. When false, _initPaceRings hides
    //     the rings SVG and exits early.
    //   _paceFusesOn: gate for the fuse squares. When false, the fuse
    //     SVG stays hidden even when rings are on.
    //   _paceRingOpacity: ring stroke-opacity. Applied as an SVG
    //     attribute on each ring at init time.
    window._paceRingsOn     = (typeof window._optPaceRings      ==='boolean') ? window._optPaceRings       : DEF.paceRings;
    window._paceFusesOn     = (typeof window._optPaceFuses      ==='boolean') ? window._optPaceFuses       : DEF.paceFuses;
    window._paceRingOpacity = (typeof window._optPaceRingOpacity==='number')  ? window._optPaceRingOpacity : DEF.paceRingOpacity;
    // [v4.47] Pace stats gate.
    window._paceStatsOn     = (typeof window._optPaceStats      ==='boolean') ? window._optPaceStats       : DEF.paceStats;
    // [v4.45] Audio compensation gate. _audioCompensateMs() reads this
    // at call time and returns 0 if false.
    window._audioCompensateOn = (typeof window._optAudioCompensate==='boolean') ? window._optAudioCompensate : DEF.audioCompensate;
    // [v4.46] Legibility globals.
    //   _highContrastOn: read by the cell render code at draw time
    //     to pick brighter border alpha.
    //   _showLatticeOn: applied to the lattice element's display.
    //     Also reduces lattice alpha when high contrast is on.
    window._highContrastOn = (typeof window._optHighContrast==='boolean') ? window._optHighContrast : DEF.highContrast;
    window._showLatticeOn  = (typeof window._optShowLattice ==='boolean') ? window._optShowLattice  : DEF.showLattice;
    // [v4.58] Force win-card PB bursts every solve (debug/troubleshooting).
    // When ON, both _forceTimeBurst and _forceMovesBurst are true and
    // _showWinCard OR's them into the burst-visibility decision. When
    // OFF (default), the bursts only show on legit personal bests.
    var _forceWB = (typeof window._optForceWinBursts==='boolean') ? window._optForceWinBursts : DEF.forceWinBursts;
    window._forceTimeBurst  = _forceWB;
    window._forceMovesBurst = _forceWB;
    // [v4.60] Master sfx on/off. Sound functions check window._sfxOn
    // at entry and return early when false.
    window._sfxOn = (typeof window._optSfxOn==='boolean') ? window._optSfxOn : DEF.sfxOn;
    // Apply lattice show/hide immediately. The render code in
    // _renderGrid also sets opacity based on high contrast.
    var _latEl = document.getElementById('gridLattice');
    if(_latEl){
      _latEl.style.display = window._showLatticeOn ? '' : 'none';
      // Lattice opacity: 1.0 normally, 0.4 when high contrast is on
      // (still visible as a faint guide but no longer competing with
      // cell borders).
      _latEl.style.opacity = window._highContrastOn ? '0.4' : '1';
    }
    // Trigger a re-render so high-contrast cell borders take effect.
    try{ if(typeof window.render==='function') window.render(); }catch(_){}
    // If a puzzle is in flight, re-init rings so changes take effect.
    try{ if(window._initPaceRings) window._initPaceRings(); }catch(_){}
    // [v4.47] Re-init pace stats too so toggles propagate immediately.
    try{ if(window._initPaceStats) window._initPaceStats(); }catch(_){}
    // Update the dynamic keyframes + .ok-breath rule whenever peak
    // or speed changes.
    _writePulseKeyframes(window._pulsePeak, window._pulseSpeed);
    // Re-render the bank if the puzzle is loaded so the padding
    // change takes effect right away.
    try{ if(typeof renderBank === 'function' && typeof PZ !== 'undefined' && PZ) renderBank(); }catch(_){}
    // [v3.53] Re-render the grid so pulse class changes (enabled
    // off → strip from existing tiles) take effect immediately
    // without waiting for the next move.
    try{ if(typeof render === 'function' && typeof PZ !== 'undefined' && PZ) render(); }catch(_){}
  }

  function _loadOpts(){
    try{
      var raw = localStorage.getItem(OPT_KEY);
      if(!raw){ _applyTuning(); return; }
      var o = JSON.parse(raw);
      if(typeof o.glow      ==='boolean') GLOW_ON      = o.glow;
      if(typeof o.particles ==='boolean') PARTICLES_ON = o.particles;
      if(typeof o.spin      ==='boolean') SPIN_ON      = o.spin;
      if(typeof o.pulseEq   ==='boolean') PULSE_EQ_ON  = o.pulseEq;
      if(typeof o.pill      ==='boolean') PILL_ON      = o.pill;
      if(typeof o.spinDurMult   ==='number') window._optSpinDurMult    = o.spinDurMult;
      if(typeof o.partLifeMult  ==='number') window._optPartLifeMult   = o.partLifeMult;
      if(typeof o.partSpeedMult ==='number') window._optPartSpeedMult  = o.partSpeedMult;
      if(typeof o.partSizeMult  ==='number') window._optPartSizeMult   = o.partSizeMult;
      if(typeof o.glowBrightMult==='number') window._optGlowBrightMult = o.glowBrightMult;
      // [v2.44] drag-tiles + bank padding
      if(typeof o.dragTiles    ==='boolean') window._optDragTiles      = o.dragTiles;
      if(typeof o.bankPadWidth ==='number')  window._optBankPadWidth   = o.bankPadWidth;
      if(typeof o.bankPadSide  ==='string')  window._optBankPadSide    = o.bankPadSide;
      // [v2.51] xN spacing
      if(typeof o.xnTopPct     ==='number')  window._optXnTopPct       = o.xnTopPct;
      if(typeof o.xnGapPct     ==='number')  window._optXnGapPct       = o.xnGapPct;
      // [v2.54] xN font multipliers
      if(typeof o.xnWhiteMult  ==='number')  window._optXnWhiteMult    = o.xnWhiteMult;
      if(typeof o.xnCyanMult   ==='number')  window._optXnCyanMult     = o.xnCyanMult;
      // [v2.57] mini-mode settings
      if(typeof o.miniTopPct    ==='number') window._optMiniTopPct     = o.miniTopPct;
      if(typeof o.miniGapPct    ==='number') window._optMiniGapPct     = o.miniGapPct;
      if(typeof o.miniRowGapPct ==='number') window._optMiniRowGapPct  = o.miniRowGapPct;
      if(typeof o.miniColGapPct ==='number') window._optMiniColGapPct  = o.miniColGapPct;
      if(typeof o.miniWhiteMult ==='number') window._optMiniWhiteMult  = o.miniWhiteMult;
      if(typeof o.miniCyanMult  ==='number') window._optMiniCyanMult   = o.miniCyanMult;
      // [v3.53] Placed-tile pulse
      if(typeof o.pulseEnabled  ==='boolean') window._optPulseEnabled  = o.pulseEnabled;
      if(typeof o.pulsePeak     ==='number')  window._optPulsePeak     = o.pulsePeak;
      if(typeof o.pulseSync     ==='boolean') window._optPulseSync     = o.pulseSync;
      if(typeof o.pulseSpeed    ==='number')  window._optPulseSpeed    = o.pulseSpeed;
      // [v4.43] Pace ring system options.
      if(typeof o.paceRings       ==='boolean') window._optPaceRings       = o.paceRings;
      if(typeof o.paceFuses       ==='boolean') window._optPaceFuses       = o.paceFuses;
      if(typeof o.paceRingOpacity ==='number')  window._optPaceRingOpacity = o.paceRingOpacity;
      // [v4.47] Pace stats.
      if(typeof o.paceStats       ==='boolean') window._optPaceStats       = o.paceStats;
      // [v4.45] Audio latency compensation.
      if(typeof o.audioCompensate ==='boolean') window._optAudioCompensate = o.audioCompensate;
      // [v4.46] Legibility options.
      if(typeof o.highContrast    ==='boolean') window._optHighContrast    = o.highContrast;
      if(typeof o.showLattice     ==='boolean') window._optShowLattice     = o.showLattice;
      // [v4.58] Force win-card PB bursts (debug).
      if(typeof o.forceWinBursts  ==='boolean') window._optForceWinBursts  = o.forceWinBursts;
      // [v4.60] Master sfx.
      if(typeof o.sfxOn           ==='boolean') window._optSfxOn           = o.sfxOn;
    }catch(e){}
    _applyTuning();
  }
  function _saveOpts(){
    try{
      localStorage.setItem(OPT_KEY, JSON.stringify({
        glow:           GLOW_ON,
        particles:      PARTICLES_ON,
        spin:           SPIN_ON,
        pulseEq:        PULSE_EQ_ON,
        pill:           PILL_ON,
        spinDurMult:    (typeof window._optSpinDurMult   ==='number') ? window._optSpinDurMult    : DEF.spinDurMult,
        partLifeMult:   (typeof window._optPartLifeMult  ==='number') ? window._optPartLifeMult   : DEF.partLifeMult,
        partSpeedMult:  (typeof window._optPartSpeedMult ==='number') ? window._optPartSpeedMult  : DEF.partSpeedMult,
        partSizeMult:   (typeof window._optPartSizeMult  ==='number') ? window._optPartSizeMult   : DEF.partSizeMult,
        glowBrightMult: (typeof window._optGlowBrightMult==='number') ? window._optGlowBrightMult : DEF.glowBrightMult,
        // [v2.44] drag-tiles + bank padding
        dragTiles:      (typeof window._optDragTiles    ==='boolean') ? window._optDragTiles    : DEF.dragTiles,
        bankPadWidth:   (typeof window._optBankPadWidth ==='number')  ? window._optBankPadWidth : DEF.bankPadWidth,
        bankPadSide:    (typeof window._optBankPadSide  ==='string')  ? window._optBankPadSide  : DEF.bankPadSide,
        // [v2.51] xN spacing
        xnTopPct:       (typeof window._optXnTopPct     ==='number')  ? window._optXnTopPct     : DEF.xnTopPct,
        xnGapPct:       (typeof window._optXnGapPct     ==='number')  ? window._optXnGapPct     : DEF.xnGapPct,
        // [v2.54] xN font multipliers
        xnWhiteMult:    (typeof window._optXnWhiteMult  ==='number')  ? window._optXnWhiteMult  : DEF.xnWhiteMult,
        xnCyanMult:     (typeof window._optXnCyanMult   ==='number')  ? window._optXnCyanMult   : DEF.xnCyanMult,
        // [v2.57] mini-mode settings
        miniTopPct:     (typeof window._optMiniTopPct   ==='number')  ? window._optMiniTopPct    : DEF.miniTopPct,
        miniGapPct:     (typeof window._optMiniGapPct   ==='number')  ? window._optMiniGapPct    : DEF.miniGapPct,
        miniRowGapPct:  (typeof window._optMiniRowGapPct==='number')  ? window._optMiniRowGapPct : DEF.miniRowGapPct,
        miniColGapPct:  (typeof window._optMiniColGapPct==='number')  ? window._optMiniColGapPct : DEF.miniColGapPct,
        miniWhiteMult:  (typeof window._optMiniWhiteMult==='number')  ? window._optMiniWhiteMult : DEF.miniWhiteMult,
        miniCyanMult:   (typeof window._optMiniCyanMult ==='number')  ? window._optMiniCyanMult  : DEF.miniCyanMult,
        // [v3.53] Placed-tile pulse
        pulseEnabled:   (typeof window._optPulseEnabled ==='boolean') ? window._optPulseEnabled : DEF.pulseEnabled,
        pulsePeak:      (typeof window._optPulsePeak    ==='number')  ? window._optPulsePeak    : DEF.pulsePeak,
        pulseSync:      (typeof window._optPulseSync    ==='boolean') ? window._optPulseSync    : DEF.pulseSync,
        pulseSpeed:     (typeof window._optPulseSpeed   ==='number')  ? window._optPulseSpeed   : DEF.pulseSpeed,
        // [v4.43] Pace ring system options.
        paceRings:        (typeof window._optPaceRings      ==='boolean') ? window._optPaceRings       : DEF.paceRings,
        paceFuses:        (typeof window._optPaceFuses      ==='boolean') ? window._optPaceFuses       : DEF.paceFuses,
        paceRingOpacity:  (typeof window._optPaceRingOpacity==='number')  ? window._optPaceRingOpacity : DEF.paceRingOpacity,
        // [v4.47] Pace stats.
        paceStats:        (typeof window._optPaceStats     ==='boolean') ? window._optPaceStats      : DEF.paceStats,
        // [v4.45] Audio latency compensation.
        audioCompensate:  (typeof window._optAudioCompensate==='boolean') ? window._optAudioCompensate : DEF.audioCompensate,
        // [v4.46] Legibility options.
        highContrast:     (typeof window._optHighContrast   ==='boolean') ? window._optHighContrast    : DEF.highContrast,
        showLattice:      (typeof window._optShowLattice    ==='boolean') ? window._optShowLattice     : DEF.showLattice,
        // [v4.58] Force win-card PB bursts (debug).
        forceWinBursts:   (typeof window._optForceWinBursts ==='boolean') ? window._optForceWinBursts  : DEF.forceWinBursts,
        // [v4.60] Master sfx.
        sfxOn:            (typeof window._optSfxOn          ==='boolean') ? window._optSfxOn           : DEF.sfxOn
      }));
    }catch(e){}
    _applyTuning();
  }
  _loadOpts();

  // Helper: format slider value for display
  function _fmt(val, decimals){
    if(decimals===0) return Math.round(val).toString();
    return val.toFixed(decimals);
  }

  // ── Build a slider row ──
  function _mkSliderRow(label, getter, setter, min, max, step, decimals, suffix){
    var row = document.createElement('div');
    row.style.cssText =
      'padding:7px 0 9px 12px;border-bottom:1px solid rgba(0,217,255,0.06);';

    var hdr = document.createElement('div');
    hdr.style.cssText =
      'display:flex;justify-content:space-between;align-items:baseline;'+
      'font-size:9.5px;color:rgba(255,255,255,0.65);margin-bottom:4px;';
    var nm = document.createElement('span');
    nm.textContent = label;
    var val = document.createElement('span');
    val.textContent = _fmt(getter(), decimals) + (suffix||'');
    val.style.cssText = 'color:var(--cyan,#00d9ff);font-weight:700;';
    hdr.appendChild(nm);
    hdr.appendChild(val);
    row.appendChild(hdr);

    var input = document.createElement('input');
    input.type = 'range';
    input.min = min; input.max = max; input.step = step;
    input.value = getter();
    input.style.cssText = 'width:100%;accent-color:var(--cyan,#00d9ff);';
    input.addEventListener('input', function(){
      var v = parseFloat(input.value);
      setter(v);
      val.textContent = _fmt(v, decimals) + (suffix||'');
      _saveOpts();
    });
    row.appendChild(input);
    return row;
  }

  // ── Build a toggle row (with optional sliders that show when on) ──
  function _mkToggleRow(label, hint, getter, setter, sliderBuilders, opts){
    opts = opts || {};
    var wrap = document.createElement('div');
    wrap.style.cssText =
      'border-bottom:1px solid rgba(0,217,255,0.1);';

    var head = document.createElement('label');
    head.style.cssText =
      'display:flex;align-items:flex-start;justify-content:space-between;'+
      'gap:12px;padding:8px 0;cursor:pointer;user-select:none;';
    var txt = document.createElement('div');
    txt.style.cssText = 'flex:1;';
    var name = document.createElement('div');
    name.textContent = label;
    name.style.cssText = 'font-size:11px;color:#fff;font-weight:700;';
    var desc = document.createElement('div');
    desc.textContent = hint;
    desc.style.cssText = 'font-size:8.5px;color:rgba(255,255,255,0.45);margin-top:2px;line-height:1.35;';
    txt.appendChild(name);
    txt.appendChild(desc);

    var pill = document.createElement('div');
    pill.style.cssText =
      'flex-shrink:0;width:38px;height:20px;border-radius:10px;'+
      'border:1.5px solid var(--cyan,#00d9ff);position:relative;'+
      'transition:background 0.15s;cursor:pointer;margin-top:2px;';
    var dot = document.createElement('div');
    dot.style.cssText =
      'position:absolute;top:1px;width:14px;height:14px;border-radius:50%;'+
      'background:var(--cyan,#00d9ff);transition:left 0.15s;';
    pill.appendChild(dot);

    var sliderBox = document.createElement('div');
    sliderBox.style.cssText = 'overflow:hidden;transition:max-height 0.2s ease;';

    function _paintPill(){
      var on = getter();
      if(on){
        pill.style.background = 'rgba(0,217,255,0.25)';
        dot.style.left = '21px';
      } else {
        pill.style.background = 'transparent';
        dot.style.left = '1px';
      }
      // Reveal/hide sliders
      if(sliderBuilders && sliderBuilders.length){
        if(on){
          sliderBox.style.maxHeight = (sliderBuilders.length*70) + 'px';
          sliderBox.style.opacity = '1';
        } else {
          sliderBox.style.maxHeight = '0';
          sliderBox.style.opacity = '0';
        }
      }
    }

    head.addEventListener('click', function(e){
      e.preventDefault();
      setter(!getter());
      _paintPill();
      _saveOpts();
    });

    head.appendChild(txt);
    head.appendChild(pill);
    wrap.appendChild(head);

    if(sliderBuilders && sliderBuilders.length){
      sliderBuilders.forEach(function(b){ sliderBox.appendChild(b()); });
      wrap.appendChild(sliderBox);
    }
    _paintPill();
    return wrap;
  }

  // [v2.44] Segmented row — small 3-button picker for a string-valued
  // setting. Used for "padding side" (both / left / right) so the user
  // can pick which side gets the bank scroll-grab strip. Visually
  // similar to a row of toggle buttons; the selected one shows a
  // filled cyan background, the others have transparent backgrounds.
  function _mkSegmentedRow(label, getter, setter, options){
    var wrap = document.createElement('div');
    wrap.style.cssText = 'padding:6px 4px 10px 4px;';

    var lbl = document.createElement('div');
    lbl.textContent = label;
    lbl.style.cssText = 'font-size:10px;color:rgba(255,255,255,0.7);margin-bottom:6px;letter-spacing:1px;';
    wrap.appendChild(lbl);

    var row = document.createElement('div');
    row.style.cssText = 'display:flex;gap:6px;';

    var btns = [];
    function _paintBtns(){
      var cur = getter();
      btns.forEach(function(b){
        if(b._value === cur){
          b.style.background = 'rgba(0,217,255,0.25)';
          b.style.color = 'var(--cyan,#00d9ff)';
          b.style.borderColor = 'var(--cyan,#00d9ff)';
        } else {
          b.style.background = 'transparent';
          b.style.color = 'rgba(255,255,255,0.55)';
          b.style.borderColor = 'rgba(255,255,255,0.2)';
        }
      });
    }

    options.forEach(function(opt){
      var b = document.createElement('button');
      b._value = opt.value;
      b.textContent = opt.label;
      b.style.cssText =
        'flex:1;padding:7px 0;font-family:inherit;'+
        'font-size:9.5px;font-weight:700;letter-spacing:1.5px;'+
        'border:1px solid rgba(255,255,255,0.2);border-radius:4px;cursor:pointer;'+
        'transition:background 0.12s,color 0.12s,border-color 0.12s;';
      b.addEventListener('click', function(e){
        e.preventDefault();
        setter(opt.value);
        _paintBtns();
        _saveOpts();
      });
      btns.push(b);
      row.appendChild(b);
    });

    wrap.appendChild(row);
    _paintBtns();
    return wrap;
  }

  // [v3.53] Collapsible section helper. Each section is a labeled
  // drawer with a chevron that expands/collapses on tap. Used to
  // group the options panel into Visual effects, Placed-tile pulse,
  // Tile interaction, and Debug — snap tuning.
  //
  // [v3.55] Open/closed state IS now persisted to localStorage under
  // 'equil_opt_sections' (a map of title → bool). On panel build,
  // saved state overrides opts.defaultOpen if a value exists for
  // that section title. This way the player can leave their
  // preferred section open and have it ready next time they open
  // OPTIONS. Falls back to opts.defaultOpen on first run / cleared
  // storage.
  //
  // builders is an array of functions; each returns a DOM element
  // to append to the section body. Lazy so toggling state doesn't
  // re-render unnecessarily.
  var SECTIONS_KEY = 'equil_opt_sections';
  function _readSectionState(){
    try{
      var raw = localStorage.getItem(SECTIONS_KEY);
      if(!raw) return {};
      var m = JSON.parse(raw);
      return (m && typeof m === 'object') ? m : {};
    }catch(e){ return {}; }
  }
  function _writeSectionState(title, open){
    try{
      var m = _readSectionState();
      m[title] = !!open;
      localStorage.setItem(SECTIONS_KEY, JSON.stringify(m));
    }catch(e){}
  }
  function _mkSection(title, builders, opts){
    opts = opts || {};
    // [v4.62] Saved state wins over opts.defaultOpen, EXCEPT when
    // opts.forceClosed is set — in which case the section starts
    // closed every time the panel opens regardless of saved state.
    // Used by the user-facing OPTIONS panel where Sam wants no
    // memory ("always default to both being minimized"). The dev
    // panel omits forceClosed so its saved state persists across
    // opens ("in and out of there a lot").
    var saved = _readSectionState();
    var open;
    if(opts.forceClosed){
      open = false;
    } else {
      open = (typeof saved[title] === 'boolean') ? saved[title] : !!opts.defaultOpen;
    }
    var wrap = document.createElement('div');
    wrap.style.cssText = 'margin-bottom:10px;border:1px solid rgba(0,217,255,0.18);border-radius:6px;overflow:hidden;';

    var hdr = document.createElement('button');
    hdr.type = 'button';
    hdr.style.cssText =
      'width:100%;padding:9px 12px;font-family:inherit;font-size:10.5px;'+
      'font-weight:700;letter-spacing:2px;text-transform:uppercase;'+
      'background:rgba(0,217,255,0.06);color:var(--cyan,#00d9ff);'+
      'border:0;cursor:pointer;display:flex;align-items:center;'+
      'justify-content:space-between;text-align:left;';
    var label = document.createElement('span');
    label.textContent = title;
    var chev = document.createElement('span');
    chev.textContent = '▾';
    chev.style.cssText = 'transition:transform 0.18s ease;font-size:10px;opacity:0.7;';
    hdr.appendChild(label);
    hdr.appendChild(chev);

    var body = document.createElement('div');
    body.style.cssText =
      'padding:0 4px;overflow:hidden;'+
      'transition:max-height 0.22s ease, padding 0.22s ease;';

    var built = false;
    function build(){
      if(built)return;
      built = true;
      (builders || []).forEach(function(fn){
        try{
          var el = fn();
          if(el)body.appendChild(el);
        }catch(_){}
      });
    }
    function paint(){
      if(open){
        build();
        body.style.padding = '8px 4px 4px';
        // Tall ceiling; transition still animates from 0.
        body.style.maxHeight = '4000px';
        chev.style.transform = 'rotate(0deg)';
      } else {
        body.style.padding = '0 4px';
        body.style.maxHeight = '0';
        chev.style.transform = 'rotate(-90deg)';
      }
    }
    hdr.addEventListener('click', function(){
      open = !open;
      paint();
      // [v3.55] Persist new state so panel reopens with this section
      // in the same configuration.
      // [v4.62] Don't persist when forceClosed — the user panel
      // wants no memory of expanded state.
      if(!opts.forceClosed) _writeSectionState(title, open);
    });

    wrap.appendChild(hdr);
    wrap.appendChild(body);
    // Initial paint after a tick so the transition fires from 0 on open.
    if(open){
      build();
      // Render expanded immediately on first paint (no animation needed
      // since panel itself just appeared).
      body.style.padding = '8px 4px 4px';
      body.style.maxHeight = '4000px';
      chev.style.transform = 'rotate(0deg)';
    } else {
      body.style.padding = '0 4px';
      body.style.maxHeight = '0';
      chev.style.transform = 'rotate(-90deg)';
    }
    return wrap;
  }

  // [v3.53] Runtime style element for the okBreath keyframe. The
  // peak brightness is user-tunable via the OPTIONS panel slider,
  // so the animation rule is rebuilt dynamically whenever the
  // slider changes (CSS keyframes themselves can't read JS
  // variables). The static rule in the main <style> block is
  // overridden by this one (later in the cascade).
  var _pulseStyleEl = null;
  function _writePulseKeyframes(peakAlpha, durationSec){
    if(!_pulseStyleEl){
      _pulseStyleEl = document.createElement('style');
      _pulseStyleEl.id = '_pulseDynStyle';
      document.head.appendChild(_pulseStyleEl);
    }
    // peakAlpha clamped 0.35..1.0 so the brightness slider never
    // produces a peak DIMMER than the base (which would invert
    // the pulse). 0.35 = base = effectively no pulse.
    var p = Math.max(0.35, Math.min(1.0, peakAlpha));
    // Glow intensity scales with peak alpha so dimmer pulses also
    // have proportionally weaker glow.
    var glowAlpha = 0.45 * ((p - 0.35) / 0.55);
    // [v3.54] Animation duration is now also written here so the
    // pulse speed slider can dial it from a slow ~6s breath down
    // to a quicker ~1.2s pulse. Default 3.6s matches v3.52.
    var dur = (typeof durationSec === 'number' && durationSec > 0) ? durationSec : 3.6;
    // [v4.49] Theme-aware green for the breath animation. In light
    // mode the bright neon green (74,222,128) reads as light cyan
    // against cream; deep forest green (21,128,61) holds up better.
    // Both base and peak colors get themed. Animation is rewritten
    // whenever theme toggles (_equilApplyTheme calls render() which
    // doesn't actually rewrite keyframes — so we also need to call
    // _writePulseKeyframes from the theme toggle. See _applyTheme).
    var _light = (window._lightModeOn === true);
    var _greenRGB = _light ? '22,101,52' : '74,222,128';
    _pulseStyleEl.textContent =
      '@keyframes okBreath{'+
        '0%,100%{color:rgba('+_greenRGB+',0.35);text-shadow:none;}'+
        '50%{color:rgba('+_greenRGB+','+p.toFixed(3)+');'+
            'text-shadow:0 0 6px rgba('+_greenRGB+','+glowAlpha.toFixed(3)+');}'+
      '}'+
      '.ok-breath{animation:okBreath '+dur.toFixed(2)+'s ease-in-out infinite;}';
  }

  // ── Build the modal ──
  // [v4.60] _buildPanel now takes a `mode` argument: 'user' (default,
  // the simple settings panel that's been here all along, slimmed
  // down to just Tile interaction + Audio) or 'dev' (the new dev
  // tools panel reached from the in-toolbar DEV button — gets Visual
  // effects, Placed-tile pulse, Legibility, Debug sections, Pace
  // family, and shortcut rows for the TIMES/COUNTS debug panels).
  function _buildPanel(mode){
    if(!mode) mode = 'user';
    var ov = document.createElement('div');
    ov.id = '_optOv';
    // [v4.61] Anchor at top instead of center. Centered alignment
    // grows the panel from the middle when a section expands, which
    // makes the whole window jump. Top-anchored means expansions
    // only push the bottom down — the title and top sections stay
    // put. Pushed down 8vh from the top so the panel isn't glued
    // to the screen edge.
    ov.style.cssText =
      'position:fixed;inset:0;z-index:800;display:flex;align-items:flex-start;'+
      'justify-content:center;padding-top:8vh;background:rgba(0,0,0,0.7);'+
      'font-family:"IBM Plex Mono",monospace;';

    var box = document.createElement('div');
    // [v4.62] Box is now a flex column with a non-scrolling header
    // and a scrollable body. Header holds the title, action buttons
    // (Done + Reset), and any dev-mode launcher rows. Body holds the
    // collapsible sections and is the only thing that scrolls.
    // Previously the entire panel was one scrollable region, so the
    // Done / Reset buttons sat at the bottom and required scrolling
    // past every section to reach them. Per Sam: pin them to the top.
    box.style.cssText =
      'background:#0f0f0f;border:2px solid var(--cyan,#00d9ff);border-radius:6px;'+
      'width:min(340px,90vw);max-height:88vh;'+
      'box-shadow:0 0 24px rgba(0,217,255,0.25);'+
      'display:flex;flex-direction:column;overflow:hidden;';

    // Non-scrolling header — sticky relative to the panel.
    var hdr = document.createElement('div');
    hdr.style.cssText =
      'padding:14px 20px 10px 20px;border-bottom:1px solid rgba(0,217,255,0.18);'+
      'flex:0 0 auto;background:#0f0f0f;';

    // Scrolling body — sections live here.
    var body = document.createElement('div');
    body.style.cssText =
      'padding:14px 20px 18px 20px;overflow-y:auto;flex:1 1 auto;'+
      '-webkit-overflow-scrolling:touch;';

    var ttl = document.createElement('div');
    ttl.textContent = (mode === 'dev') ? 'DEV TOOLS' : 'OPTIONS';
    ttl.style.cssText =
      'font-size:14px;font-weight:700;color:var(--cyan,#00d9ff);'+
      'letter-spacing:3px;text-align:center;margin-bottom:10px;';
    hdr.appendChild(ttl);

    // [v4.62] Action row pinned in the header — Reset (small/quiet)
    // on the left, Done (cyan-bordered) on the right. Reset rebuilds
    // the whole panel with defaults; Done closes the modal. Both
    // always visible without scrolling. The bottom Reset/Close pair
    // that used to live below all sections is gone.
    var actionRow = document.createElement('div');
    actionRow.style.cssText = 'display:flex;gap:8px;';

    var reset = document.createElement('button');
    reset.textContent = 'Restore defaults';
    reset.style.cssText =
      'flex:1;padding:8px 0;font-family:inherit;'+
      'font-size:9.5px;font-weight:700;letter-spacing:2px;'+
      'background:transparent;color:rgba(255,255,255,0.55);'+
      'border:1px solid rgba(255,255,255,0.2);border-radius:4px;cursor:pointer;';

    var done = document.createElement('button');
    done.textContent = 'Done';
    done.style.cssText =
      'flex:1;padding:8px 0;font-family:inherit;'+
      'font-size:11px;font-weight:700;letter-spacing:2px;'+
      'background:transparent;color:var(--cyan,#00d9ff);'+
      'border:1.5px solid var(--cyan,#00d9ff);border-radius:4px;cursor:pointer;';
    done.addEventListener('click', function(){
      if(window._modalCloseChirp) window._modalCloseChirp();
      if(ov.parentNode) ov.parentNode.removeChild(ov);
    });

    actionRow.appendChild(reset);
    actionRow.appendChild(done);
    hdr.appendChild(actionRow);

    // [v4.60] DEV-MODE TOP ROW: Times / Counts panel launchers.
    // Replaces the standalone TIMES and COUNTS buttons that used to
    // live in the toolbar next to the theme toggle. Tapping either
    // closes this dev panel and toggles the corresponding debug
    // panel (window._dbgToggleTimesPanel / window._dbgTogglePanel).
    // Both panels are independent floating overlays managed by the
    // debug-panel IIFE up around line 12390.
    // [v4.62] Lives in the pinned header so it's always reachable.
    if(mode === 'dev'){
      var launchRow = document.createElement('div');
      launchRow.style.cssText =
        'display:flex;gap:8px;margin-top:8px;';
      var _mkLaunch = function(label, hint, onClick){
        var btn = document.createElement('button');
        btn.textContent = label;
        btn.title = hint;
        btn.style.cssText =
          'flex:1;padding:8px 0;font:10px/1 "IBM Plex Mono",monospace;'+
          'letter-spacing:2px;font-weight:700;'+
          'background:rgba(0,217,255,0.10);color:var(--cyan,#00d9ff);'+
          'border:1.5px solid var(--cyan,#00d9ff);border-radius:6px;'+
          'cursor:pointer;';
        btn.addEventListener('click', function(){
          // Close the dev panel first so the user can see the
          // launched debug overlay clearly.
          if(window._modalCloseChirp) window._modalCloseChirp();
          if(ov.parentNode) ov.parentNode.removeChild(ov);
          // Defer the toggle by one frame so the close animation /
          // sound has a beat to start before the new panel opens.
          setTimeout(onClick, 30);
        });
        return btn;
      };
      launchRow.appendChild(_mkLaunch('TIMES',
        'Per-template solve-time stats overlay.',
        function(){ if(window._dbgToggleTimesPanel) window._dbgToggleTimesPanel(); }
      ));
      launchRow.appendChild(_mkLaunch('COUNTS',
        'Template pick-count distribution overlay.',
        function(){ if(window._dbgTogglePanel) window._dbgTogglePanel(); }
      ));
      hdr.appendChild(launchRow);
    }

    // [v3.53] Visual effects — collapsible section (default OPEN
    // since it's the most-used). Was a flat list of toggles with a
    // gray subheader; the section wrapper gives a chevron header
    // that can be tapped to collapse the whole group when the
    // player just wants to scroll past it to other settings.
    // [v4.60] Dev-only now — most users don't need to fiddle with
    // particle counts and spin durations.
    if(mode === 'dev') body.appendChild(_mkSection('Visual effects', [
      // Tap glow (with brightness slider)
      function(){ return _mkToggleRow(
        'Tap glow',
        'Glowing halo when you tap a number tile.',
        function(){ return GLOW_ON; },
        function(v){ GLOW_ON = v; },
        [
          function(){ return _mkSliderRow(
            'Brightness',
            function(){ return (typeof window._optGlowBrightMult==='number')?window._optGlowBrightMult:DEF.glowBrightMult; },
            function(v){ window._optGlowBrightMult=v; _applyTuning(); },
            0.2, 3.0, 0.05, 2, 'x'
          ); }
        ]
      ); },
      // Particles (with lifetime, speed, size sliders)
      function(){ return _mkToggleRow(
        'Particles',
        'Particle burst from tile edges on tap.',
        function(){ return PARTICLES_ON; },
        function(v){ PARTICLES_ON = v; },
        [
          function(){ return _mkSliderRow(
            'Lifetime',
            function(){ return (typeof window._optPartLifeMult==='number')?window._optPartLifeMult:DEF.partLifeMult; },
            function(v){ window._optPartLifeMult=v; _applyTuning(); },
            10, 150, 1, 0, ''
          ); },
          function(){ return _mkSliderRow(
            'Speed',
            function(){ return (typeof window._optPartSpeedMult==='number')?window._optPartSpeedMult:DEF.partSpeedMult; },
            function(v){ window._optPartSpeedMult=v; _applyTuning(); },
            0.3, 3.0, 0.05, 2, 'x'
          ); },
          function(){ return _mkSliderRow(
            'Size',
            function(){ return (typeof window._optPartSizeMult==='number')?window._optPartSizeMult:DEF.partSizeMult; },
            function(v){ window._optPartSizeMult=v; _applyTuning(); },
            0.3, 3.0, 0.05, 2, 'x'
          ); }
        ]
      ); },
      // Spin (with duration slider — lower = faster)
      function(){ return _mkToggleRow(
        'Tile spin',
        'Brief spin animation on tile tap.',
        function(){ return SPIN_ON; },
        function(v){ SPIN_ON = v; },
        [
          function(){ return _mkSliderRow(
            'Duration',
            function(){ return (typeof window._optSpinDurMult==='number')?window._optSpinDurMult:DEF.spinDurMult; },
            function(v){ window._optSpinDurMult=v; _applyTuning(); },
            0.3, 2.5, 0.05, 2, 'x'
          ); }
        ]
      ); },
      // Equation pulse (no slider)
      function(){ return _mkToggleRow(
        'Equation pulse',
        'Random color wave across an equation when tapping a number tile with no cell selected.',
        function(){ return PULSE_EQ_ON; },
        function(v){ PULSE_EQ_ON = v; },
        null
      ); },
      // Floating zoom-pill toggle.
      function(){ return _mkToggleRow(
        'Zoom pill',
        'Floating zoom-and-pan handle. Drag the grip to relocate, tap the circle to zoom into the grid.',
        function(){ return PILL_ON; },
        function(v){
          PILL_ON = v;
          try{
            if(v && window._zoomPill){
              window._zoomPill.show();
              if(typeof playTilePickup === 'function'){
                try{ playTilePickup(); }catch(_){}
              }
            } else if(window._zoomPill){
              window._zoomPill.hide();
            }
          }catch(_){}
        },
        null
      ); }
    ]));

    // [v3.53] Placed-tile pulse — collapsible section.
    // When a tile sits inside a completed equation it dims to a muted
    // green. The pulse brightens it gently to remind the player they
    // can tap it to return it home (useful when a placement is later
    // found to clash with a different equation). Three controls:
    //   - Enabled: toggle the pulse on or off entirely. When off,
    //     dim-green tiles render static like pre-v3.52.
    //   - Max brightness: dim the pulse peak from 0.9 (full bright)
    //     down toward 0.35 (=base, effectively no pulse). Lets the
    //     player tune visibility to taste.
    //   - Synchronize: when on, every dim-green tile pulses in
    //     unison. When off, each tile has its own phase derived from
    //     its (col,row) coordinates so the board breathes randomly.
    // [v4.60] Dev-only.
    if(mode === 'dev') body.appendChild(_mkSection('Placed-tile pulse', [
      function(){ return _mkToggleRow(
        'Enabled',
        'Pulse dimmed-green placed tiles to hint they can be tapped to return home. When off, those tiles render statically.',
        function(){ return (typeof window._optPulseEnabled==='boolean')?window._optPulseEnabled:DEF.pulseEnabled; },
        function(v){ window._optPulseEnabled=v; _applyTuning(); },
        [
          function(){ return _mkSliderRow(
            'Max brightness',
            function(){ return (typeof window._optPulsePeak==='number')?window._optPulsePeak:DEF.pulsePeak; },
            function(v){ window._optPulsePeak=v; _applyTuning(); },
            0.35, 1.0, 0.01, 2, ''
          ); },
          // [v3.54] Speed slider — seconds per full breath cycle.
          // Range 1.2s (quick reminder pulse) to 7.0s (very slow,
          // background-y breath). Default 3.6s matches v3.52/v3.53.
          function(){ return _mkSliderRow(
            'Speed',
            function(){ return (typeof window._optPulseSpeed==='number')?window._optPulseSpeed:DEF.pulseSpeed; },
            function(v){ window._optPulseSpeed=v; _applyTuning(); },
            1.2, 7.0, 0.1, 1, 's'
          ); },
          function(){ return _mkToggleRow(
            'Synchronize pulses',
            'When on, all dim-green tiles pulse together. When off, each tile has its own phase so the board breathes irregularly.',
            function(){ return (typeof window._optPulseSync==='boolean')?window._optPulseSync:DEF.pulseSync; },
            function(v){ window._optPulseSync=v; _applyTuning(); },
            null
          ); }
        ]
      ); }
    ]));

    // [v2.44] Tile interaction section — drag-tiles toggle, bank
    // padding controls. [v3.53] Wrapped in a collapsible section
    // (default closed since most players will leave the default
    // tap-to-place behavior alone).
    // [v4.60] User-panel only — this is a playstyle preference, not
    // a dev concern.
    if(mode === 'user') body.appendChild(_mkSection('Tile interaction', [
      function(){ return _mkToggleRow(
        'Drag tiles',
        'When ON, tiles can be dragged onto cells with a magnet snap. When OFF (default), tiles can only be tap-placed (after selecting a cell), and touching tiles otherwise scrolls the page.',
        function(){
          return (typeof window._optDragTiles==='boolean') ? window._optDragTiles : DEF.dragTiles;
        },
        function(v){ window._optDragTiles = v; _applyTuning(); },
        [
          function(){ return _mkSliderRow(
            'Side padding width',
            function(){
              return (typeof window._optBankPadWidth==='number') ? window._optBankPadWidth : DEF.bankPadWidth;
            },
            function(v){ window._optBankPadWidth = v; _applyTuning(); },
            0, 80, 1, 0, ' px'
          ); },
          function(){ return _mkSegmentedRow(
            'Padding side',
            function(){
              return (typeof window._optBankPadSide==='string') ? window._optBankPadSide : DEF.bankPadSide;
            },
            function(v){ window._optBankPadSide = v; _applyTuning(); },
            [
              { value: 'both',  label: 'BOTH' },
              { value: 'left',  label: 'LEFT' },
              { value: 'right', label: 'RIGHT' }
            ]
          ); }
        ]
      ); }
    ], {forceClosed: true}));

    // [v2.52] xN tile spacing sliders moved to the TILE ADJUST modal
    // — they belong with the size/gap sliders since they're all about
    // tile appearance tuning, and the user is more likely to find
    // them there when they're already adjusting how tiles look.

    // [v4.46] Legibility section — quick contrast fixes ahead of the
    // full light mode in a later version. Two independent toggles:
    // high contrast (brighter cell borders + brighter text + dimmer
    // lattice), and a show-lattice master toggle. Defaults preserve
    // the current look; testers turn these on for legibility.
    // [v4.60] Dev-only.
    if(mode === 'dev') body.appendChild(_mkSection('Legibility', [
      function(){ return _mkToggleRow(
        'High contrast',
        'Brightens cell borders and given numbers so they stand out clearly against the grid pattern. Also dims the lattice slightly. Helpful in bright rooms or for high-contrast vision needs.',
        function(){
          return (typeof window._optHighContrast==='boolean') ? window._optHighContrast : DEF.highContrast;
        },
        function(v){
          window._optHighContrast = v;
          _applyTuning();
          _saveOpts();
        }
      ); },
      function(){ return _mkToggleRow(
        'Show grid lattice',
        'The faint cyan gridlines behind the cells. Turn off if they make it hard to see which squares are empty cells.',
        function(){
          return (typeof window._optShowLattice==='boolean') ? window._optShowLattice : DEF.showLattice;
        },
        function(v){
          window._optShowLattice = v;
          _applyTuning();
          _saveOpts();
        }
      ); }
    ], {defaultOpen: true}));

    // [v4.45] Audio section — currently just the Bluetooth latency
    // compensation toggle. Sits next to Tile interaction since both
    // are about input/output feedback tuning. Default collapsed since
    // most players won't need to touch it (it auto-detects high
    // latency and only applies in that case).
    // [v4.60] User-panel only. Added Sound effects master toggle
    // at the top — when OFF, all UI/game audio is silenced (taps,
    // places, returns, errors, win fanfare, modal chirps). Latency
    // compensation stays as a separate sub-concern below.
    if(mode === 'user') body.appendChild(_mkSection('Audio', [
      function(){ return _mkToggleRow(
        'Sound effects',
        'Master switch for all in-game and UI sounds. When off, the game plays silently.',
        function(){
          return (typeof window._optSfxOn==='boolean') ? window._optSfxOn : DEF.sfxOn;
        },
        function(v){
          window._optSfxOn = v;
          _applyTuning();
          _saveOpts();
        }
      ); },
      function(){ return _mkToggleRow(
        'Latency compensation',
        'For Bluetooth or wireless headphones. Plays scheduled sounds (the win sequence) early so they reach the speaker in sync with the visuals. No effect on tap or drag sounds. Has no effect on wired/built-in output.',
        function(){
          return (typeof window._optAudioCompensate==='boolean') ? window._optAudioCompensate : DEF.audioCompensate;
        },
        function(v){
          window._optAudioCompensate = v;
          _applyTuning();
          _saveOpts();
        }
      ); }
    ], {forceClosed: true}));

    // [v4.58] Win-card debug toggle. The PB bursts (NEW BEST TIME /
    // NEW BEST MOVES) only fire on legit personal bests by default.
    // When the toggle below is ON, both bursts force-show on EVERY
    // solve — useful for screenshots or verifying that the visual
    // treatment looks right without organically beating your best.
    // Was a hardcoded dev flag from v4.11 (`_forceMovesBurst = true`
    // that never got reverted); v4.58 wires it to the settings panel
    // and defaults OFF so normal play doesn't show the burst every
    // win. Section default closed since most players won't touch it.
    // [v4.60] Dev-only.
    if(mode === 'dev') body.appendChild(_mkSection('Debug — win card', [
      function(){ return _mkToggleRow(
        'Always show PB bursts',
        'For troubleshooting. When on, the NEW BEST TIME and NEW BEST MOVES bursts appear on every solve regardless of whether you beat your personal best. Default off.',
        function(){
          return (typeof window._optForceWinBursts==='boolean') ? window._optForceWinBursts : DEF.forceWinBursts;
        },
        function(v){
          window._optForceWinBursts = v;
          _applyTuning();
          _saveOpts();
        }
      ); }
    ]));

    // [v2.26] Debug section — snap velocity tuning sliders. The
    // velocity-gated magnet (v2.25) needs in-the-field tuning,
    // and the user is on mobile without console access. Sliders
    // here let the thresholds be adjusted while testing. A live
    // velocity readout above the sliders shows the smoothed
    // px/sec value during a drag, so the user can SEE how fast
    // they're dragging and pick threshold values that match.
    // [v3.53] Wrapped in a collapsible section (default closed
    // since these are advanced tuning controls most players will
    // never touch).
    // [v4.60] Dev-only.
    if(mode === 'dev') body.appendChild(_mkSection('Debug — snap tuning', [
      // Toggle: floating readout overlay during drags
      function(){ return _mkToggleRow(
        'Drag velocity overlay',
        'When dragging a tile, show a small live readout at the top of the screen with the current velocity (px/sec) and whether the magnet is ON or OFF. Use it to find good threshold values for the sliders below.',
        function(){ return !!window._equilShowVelOverlay; },
        function(v){ window._equilShowVelOverlay = v; },
        null
      ); },
      // Hint
      function(){
        var dbgHint = document.createElement('div');
        dbgHint.textContent = 'Turn the overlay on, close this panel, drag a tile, watch the velocity readout. Note the peak values for fast drags vs slow placement drags. Then reopen this panel and set the threshold roughly halfway between them.';
        dbgHint.style.cssText =
          'font-size:8.5px;color:rgba(255,255,255,0.35);line-height:1.4;'+
          'padding:0 4px;margin-bottom:8px;';
        return dbgHint;
      },
      // [v2.27] Single threshold slider; midpoint with ±gap hysteresis.
      function(){ return _mkSliderRow(
        'Snap velocity threshold',
        function(){
          var m = window._equilDragMagnet && window._equilDragMagnet.snapMid;
          if(typeof m === 'number') return m;
          return 60;
        },
        function(v){
          if(!window._equilDragMagnet) window._equilDragMagnet = {};
          window._equilDragMagnet.snapMid = v;
          var gap = Math.max(10, Math.round(v * 0.2));
          window._equilDragMagnet.snapOn  = Math.max(0, v - gap);
          window._equilDragMagnet.snapOff = v + gap;
        },
        30, 100, 1, 0, ' px/s'
      ); },
      // [v2.32] Magnet lock-range slider.
      function(){ return _mkSliderRow(
        'Magnet lock range',
        function(){
          var v = window._equilLockRange && window._equilLockRange.cells;
          return (typeof v === 'number') ? v : 0.7;
        },
        function(v){
          if(!window._equilLockRange) window._equilLockRange = {};
          window._equilLockRange.cells = v;
        },
        0.3, 2.5, 0.05, 2, ' cell-widths'
      ); }
    ]));

    // [v4.43] Pace ring system — master toggle containing an opacity
    // slider, plus a fuse toggle. The three per-ring toggles (best/
    // avg/worst) below still control which rings draw; this new
    // section gates the whole system on/off and tunes opacity.
    // [v4.47] Pace stats section — three time targets (best/avg/worst)
    // displayed near the timer, each grays out as elapsed passes its
    // target. Sits above pace rings since stats are the new default
    // pace-pressure feedback and rings are secondary.
    // [v4.60] Dev-only.
    if(mode === 'dev') body.appendChild(_mkSection('Pace stats', [
      function(){ return _mkToggleRow(
        'Show pace stats',
        'BEST \u00b7 AVG \u00b7 WORST times shown near the timer. Each grays out when you pass it. Replaces the pace rings as the default way to track pace.',
        function(){
          var v = window._paceStatsOn;
          return (typeof v === 'boolean') ? v : DEF.paceStats;
        },
        function(v){
          window._optPaceStats = v;
          _applyTuning();
          _saveOpts();
        }
      ); }
    ], {defaultOpen: true}));

    // [v4.60] Dev-only.
    if(mode === 'dev') body.appendChild(_mkSection('Pace rings', [
      function(){ return _mkToggleRow(
        'Show pace rings',
        'Concentric rings around the grid that erase clockwise from the top-left over your best, average, and worst times for this template.',
        function(){
          var v = window._paceRingsOn;
          return (typeof v === 'boolean') ? v : DEF.paceRings;
        },
        function(v){
          window._optPaceRings = v;
          _applyTuning();
          _saveOpts();
        },
        [
          // Opacity slider — only visible when rings are on.
          function(){ return _mkSliderRow(
            'Ring opacity',
            function(){
              var v = window._paceRingOpacity;
              return (typeof v === 'number') ? v : DEF.paceRingOpacity;
            },
            function(v){
              window._optPaceRingOpacity = v;
              _applyTuning();
            },
            0.1, 1.0, 0.05, 2, ''
          ); }
        ]
      ); },
      function(){ return _mkToggleRow(
        'Fuse glow',
        'A bright square that rides each ring\u2019s erasing front like a lit fuse, making the motion easier to track.',
        function(){
          var v = window._paceFusesOn;
          return (typeof v === 'boolean') ? v : DEF.paceFuses;
        },
        function(v){
          window._optPaceFuses = v;
          _applyTuning();
          _saveOpts();
        }
      ); }
    ], {defaultOpen: true}));

    // [v3.90] Pace boxes — three concentric rectangles around the
    // grid that shrink toward center over your best / average /
    // worst times for the current template. Each toggle is an
    // absolute on/off; we always use chalant times for the data
    // (a player who solved nonchalantly never affects what these
    // boxes are racing). Defaults are all ON for chalant players
    // and all OFF for nonchalant players, but once the user
    // explicitly toggles one of them their saved choice persists
    // regardless of mode.
    // [v4.60] Dev-only.
    if(mode === 'dev') body.appendChild(_mkSection('Pace boxes', [
      function(){ return _mkToggleRow(
        'Best time box',
        'Shrinks toward grid center at your fastest solve time on this template.',
        function(){ return !!(window._paceBox && window._paceBox.showBest); },
        function(v){
          if(!window._paceBox) window._paceBox = {};
          window._paceBox.showBest = v;
          if(window._savePaceBoxPrefs) window._savePaceBoxPrefs();
        }
      ); },
      function(){ return _mkToggleRow(
        'Average time box',
        'Shrinks toward grid center at your average solve time on this template.',
        function(){ return !!(window._paceBox && window._paceBox.showAvg); },
        function(v){
          if(!window._paceBox) window._paceBox = {};
          window._paceBox.showAvg = v;
          if(window._savePaceBoxPrefs) window._savePaceBoxPrefs();
        }
      ); },
      function(){ return _mkToggleRow(
        'Worst time box',
        'Shrinks toward grid center at your slowest solve time on this template.',
        function(){ return !!(window._paceBox && window._paceBox.showWorst); },
        function(v){
          if(!window._paceBox) window._paceBox = {};
          window._paceBox.showWorst = v;
          if(window._savePaceBoxPrefs) window._savePaceBoxPrefs();
        }
      ); }
    ], {defaultOpen: true}));

    // [v4.62] Reset/Close buttons used to live here below all the
    // sections, requiring scroll-to-bottom to reach. They've been
    // moved up to the pinned header (created earlier with names
    // `reset` and `done`). The block below just attaches the reset
    // click handler to the existing header button. No appendChild —
    // that already happened in the header section.
    reset.addEventListener('click', function(){
      GLOW_ON      = DEF.glow;
      PARTICLES_ON = DEF.particles;
      SPIN_ON      = DEF.spin;
      PULSE_EQ_ON  = DEF.pulseEq;
      PILL_ON      = DEF.pill;
      try{ if(!PILL_ON && window._zoomPill) window._zoomPill.hide(); }catch(_){}
      window._optSpinDurMult    = DEF.spinDurMult;
      window._optPartLifeMult   = DEF.partLifeMult;
      window._optPartSpeedMult  = DEF.partSpeedMult;
      window._optPartSizeMult   = DEF.partSizeMult;
      window._optGlowBrightMult = DEF.glowBrightMult;
      // [v2.44] Reset drag-tile + bank padding settings.
      window._optDragTiles    = DEF.dragTiles;
      window._optBankPadWidth = DEF.bankPadWidth;
      window._optBankPadSide  = DEF.bankPadSide;
      // [v2.51] xN spacing reset
      window._optXnTopPct     = DEF.xnTopPct;
      window._optXnGapPct     = DEF.xnGapPct;
      // [v2.54] xN font multipliers reset
      window._optXnWhiteMult  = DEF.xnWhiteMult;
      window._optXnCyanMult   = DEF.xnCyanMult;
      // [v2.57] mini-mode reset
      window._optMiniTopPct    = DEF.miniTopPct;
      window._optMiniGapPct    = DEF.miniGapPct;
      window._optMiniRowGapPct = DEF.miniRowGapPct;
      window._optMiniColGapPct = DEF.miniColGapPct;
      window._optMiniWhiteMult = DEF.miniWhiteMult;
      window._optMiniCyanMult  = DEF.miniCyanMult;
      // [v3.53] Placed-tile pulse reset
      window._optPulseEnabled = DEF.pulseEnabled;
      window._optPulsePeak    = DEF.pulsePeak;
      window._optPulseSync    = DEF.pulseSync;
      window._optPulseSpeed   = DEF.pulseSpeed;
      // [v4.43] Pace ring system reset.
      window._optPaceRings       = DEF.paceRings;
      window._optPaceFuses       = DEF.paceFuses;
      window._optPaceRingOpacity = DEF.paceRingOpacity;
      // [v4.47] Pace stats reset.
      window._optPaceStats       = DEF.paceStats;
      // [v4.45] Audio compensation reset.
      window._optAudioCompensate = DEF.audioCompensate;
      // [v4.46] Legibility reset.
      window._optHighContrast    = DEF.highContrast;
      window._optShowLattice     = DEF.showLattice;
      // [v4.58] Force win-card PB bursts (debug) reset.
      window._optForceWinBursts  = DEF.forceWinBursts;
      // [v4.60] Master sfx reset.
      window._optSfxOn           = DEF.sfxOn;
      _applyTuning();
      _saveOpts();
      // [v3.55] Also wipe section-state so all sections collapse
      // back to their default closed state after a reset.
      try{ localStorage.removeItem(SECTIONS_KEY); }catch(_){}
      // Rebuild panel to reflect reset state
      // [v4.60] Pass the current mode so a reset from the dev panel
      // re-opens dev, not user.
      if(ov.parentNode) ov.parentNode.removeChild(ov);
      _openPanel(mode);
    });

    // [v4.62] Final assembly. Header (already populated with title +
    // action row + dev launchers) and body (populated with sections)
    // get appended to box in order.
    box.appendChild(hdr);
    box.appendChild(body);

    ov.addEventListener('click', function(e){
      if(e.target === ov){
        // [v2.91] Close chirp on backdrop tap-to-dismiss too,
        // so every close path sounds the same.
        if(window._modalCloseChirp) window._modalCloseChirp();
        if(ov.parentNode) ov.parentNode.removeChild(ov);
      }
    });

    ov.appendChild(box);
    return ov;
  }

  function _openPanel(mode){
    if(document.getElementById('_optOv')) return;
    // [v2.91] Open chirp — same family as the TILE ADJUST modal
    // and display-mode buttons. Replaces the older playUIClick
    // (a generic UI click that didn't have the open/close
    // directionality of the chirp pair).
    if(window._modalOpenChirp) window._modalOpenChirp();
    document.body.appendChild(_buildPanel(mode || 'user'));
  }
  // [v4.60] Dev panel opener exposed for the in-toolbar DEV button
  // (replaces the old TIMES + COUNTS pair). Same modal scaffolding
  // as the user panel; just builds with mode='dev'.
  function _openDevPanel(){ _openPanel('dev'); }

  var optBtn = document.getElementById('optBtn');
  if(optBtn) optBtn.addEventListener('click', function(){ _openPanel('user'); });

  // [v4.60] Expose openers so the DEV button (wired up in the same
  // IIFE that handles TIMES/COUNTS) can launch the dev panel.
  window._openOptionsPanel = function(){ _openPanel('user'); };
  window._openDevPanel     = _openDevPanel;

  // [v2.52] Expose tuning + save helpers so other parts of the app
  // (e.g. the TILE ADJUST modal's xN spacing sliders) can update
  // settings and have them applied + persisted via the same code
  // path the OPTIONS panel uses.
  window._equilApplyTuning = _applyTuning;
  window._equilSaveOpts = _saveOpts;
})();

// [Equil 1.05] Removed: SEQUENCE BANK PANEL WIRING IIFE — A/B/C bank switching, slot grid, etc.

// [Equil 1.05] Removed: SLIM PANEL TOGGLES IIFE (~2,500 lines) — sequencer panel mgmt: PADS bar buttons (EDIT/COPY/HLD/COLOR/SAVE/DEL/MULTI-HIT), pad sliders, FX panels (REVERB/SAT/STEREO/LIMITER), MASTER EQ bypass.
// [Equil 1.05] Removed: seq-panel-header collapse handler IIFE — sequencer panels.
// [Equil 1.05] Removed: KITS SYSTEM — kit save/load, swipe strip, kit menu, kit swap animations.

// ═══════════════════════════════════════════════════════════
// PAD MULTI-TOUCH PINCH-ZOOM BLOCKER (v8.62)
// ═══════════════════════════════════════════════════════════
// When two or more fingers are on the pad bank, block any browser
// pinch-zoom or gesture handling. `touch-action: pan-y` on `.bt` and
// `.bank` should in theory block this already, but on some mobile
// browsers the two-finger gesture still escapes to the OS/browser
// layer (especially when the second finger drifts slightly off a
// tile during a pinch). We defend against it explicitly here by:
//   1. Capturing touchstart/touchmove at the bank level and calling
//      preventDefault() when e.touches.length >= 2, which stops the
//      browser from treating the gesture as a zoom.
//   2. Swallowing iOS-specific gesturestart/gesturechange/gestureend
//      events on the bank, which some versions of Safari fire
//      independently of touch events.
// Single-finger touches pass through untouched so normal pad taps,
// holds, drags, color-paint, etc. keep working exactly as before.
(function(){
  function _installPadPinchBlock(){
    var bank=document.getElementById('bank');
    if(!bank) return;
    // Multi-touch preventDefault. `passive:false` is required — a
    // passive listener can't call preventDefault.
    bank.addEventListener('touchstart', function(e){
      if(e.touches && e.touches.length >= 2){
        e.preventDefault();
      }
    }, {passive:false});
    bank.addEventListener('touchmove', function(e){
      if(e.touches && e.touches.length >= 2){
        e.preventDefault();
      }
    }, {passive:false});
    // iOS gesture* events — always block when they fire on the bank.
    // These only fire for 2+ finger pinch/rotate gestures, so a
    // blanket preventDefault here is safe.
    ['gesturestart','gesturechange','gestureend'].forEach(function(ev){
      bank.addEventListener(ev, function(e){ e.preventDefault(); }, {passive:false});
    });
  }
  if(document.readyState === 'loading'){
    document.addEventListener('DOMContentLoaded', _installPadPinchBlock);
  } else {
    _installPadPinchBlock();
  }
})();

// [Equil 1.05] Removed: HANDOFF comment block + Accelerometer reading + on-screen HUD IIFE — sequencer tap-velocity capture.

// [Equil 1.05] Removed: DEBUG READOUT IIFE — sequencer-only diagnostic for sample/kit state.

// ═══════════════════════════════════════════════════════════
// THEME TOGGLE (light/dark)  [v4.48]
// ═══════════════════════════════════════════════════════════
// Testers in their 60s/70s reported the dark theme is too dark and
// hard to see. Sam's mom showed a much lighter puzzle she preferred.
// This adds a light theme (warm parchment/cream feel — yellowish
// off-white per Sam's description of his mom's preference) toggleable
// via a sun/moon button in the toolbar above the bank.
//
// Design choices:
//   - Stored in its own localStorage key ('equil_theme') separate from
//     equil_opts_v2. The theme is more global than other options and
//     this keeps theme switching from triggering full opts re-save.
//   - Default is dark (force testers to try the polished dark version
//     first per Sam: "I want them to be forced to try this new dark
//     version first").
//   - Icon convention: button shows the OPPOSITE of current state —
//     sun in dark mode means "tap for light", moon in light mode
//     means "tap for dark". This matches what most apps do.
//   - Click plays UI click sound for tactile feedback per Sam.
//
// Light-mode COLOR overrides live in the :root + body.light-mode CSS
// rules at the top of the stylesheet — most surfaces theme via
// CSS variables. Inline-styled colors (rgba(0,217,255,...) in cell
// render code etc.) need per-site adjustments which will be added
// incrementally.
(function(){
  var THEME_KEY = 'equil_theme';
  var SUN_ICON  = '\u2600';   // ☀
  var MOON_ICON = '\u263D';   // ☽

  function _getStoredTheme(){
    try{
      var v = localStorage.getItem(THEME_KEY);
      return (v === 'light') ? 'light' : 'dark';
    }catch(e){ return 'dark'; }
  }
  function _setStoredTheme(theme){
    try{ localStorage.setItem(THEME_KEY, theme); }catch(e){}
  }

  function _applyTheme(theme){
    var isLight = (theme === 'light');
    document.body.classList.toggle('light-mode', isLight);
    window._lightModeOn = isLight;
    // Update icon: show what tapping it WILL DO next.
    var iconEl = document.getElementById('themeToggleIcon');
    if(iconEl) iconEl.textContent = isLight ? MOON_ICON : SUN_ICON;
    // [v4.48] Re-render the grid so any inline-styled colors that
    // need to respect light mode get updated. Cheap on Equil's grid
    // sizes; safer than trying to enumerate every inline-style site.
    try{ if(typeof window.render==='function') window.render(); }catch(_){}
    // [v4.49] Pulse keyframes are theme-aware — rewrite them so the
    // .ok-breath green animation uses the right palette on this theme.
    // _equilApplyTuning is exposed by the options IIFE and triggers
    // a _writePulseKeyframes call internally.
    try{ if(typeof window._equilApplyTuning==='function') window._equilApplyTuning(); }catch(_){}
    // [v4.52] Re-color the debug template label since its color is
    // set via inline style (theme-conditional) on every update.
    try{ if(typeof _updateDbgTplLabel==='function') _updateDbgTplLabel(); }catch(_){}
  }

  function _toggleTheme(){
    var next = (window._lightModeOn === true) ? 'dark' : 'light';
    _setStoredTheme(next);
    _applyTheme(next);
    // Tactile feedback per Sam.
    try{ if(typeof playUIClick==='function') playUIClick(); }catch(_){}
  }

  function _initTheme(){
    var btn = document.getElementById('themeToggle');
    if(btn && !btn._wired){
      btn.addEventListener('click', _toggleTheme);
      btn._wired = true;
    }
    _applyTheme(_getStoredTheme());
  }

  // Expose so other code can query/programmatically toggle.
  window._equilToggleTheme = _toggleTheme;
  window._equilApplyTheme  = _applyTheme;

  if(document.readyState === 'loading'){
    document.addEventListener('DOMContentLoaded', _initTheme);
  } else {
    _initTheme();
  }
})();

</script>

</html>