:root{color-scheme:dark;--bg:#101724;--panel:#192335;--line:#33455d;--ink:#edf3fb;--muted:#a6b7ce;--gold:#ffce73;--cyan:#68e5eb}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#243548,var(--bg) 65%);color:var(--ink);font-family:system-ui,sans-serif}header,main{width:min(1140px,calc(100% - 28px));margin:auto}header{display:flex;justify-content:space-between;gap:20px;padding:32px 0 20px}h1{font:700 clamp(2.8rem,6vw,4.8rem) Georgia,serif;margin:0}h2{font:700 1.4rem Georgia,serif;margin:0}p,li{color:var(--muted);line-height:1.6}.eyebrow{letter-spacing:.12em;font-size:.7rem;color:var(--cyan)}nav{display:flex;gap:18px;align-items:start}a{color:var(--gold)}label{display:grid;gap:6px;font-size:.82rem;color:var(--muted)}button,select,input,textarea{font:inherit;color:var(--ink);background:#111c2b;border:1px solid var(--line);border-radius:7px;padding:10px}button{cursor:pointer}button:hover{border-color:var(--cyan)}button:disabled{opacity:.4;cursor:default}button:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:16px}.toolbar,.heading{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.toolbar label{flex:1}.toolbar p{font-size:.85rem}.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px}.heading{justify-content:space-between;margin-bottom:16px}#lit{color:var(--gold)}#board{position:relative;display:grid;width:100%;aspect-ratio:1;gap:0;border:1px solid var(--line);background:#0c1421;border-radius:8px;overflow:hidden}.cell{border:1px solid #24344b;border-radius:0;padding:0;min-width:0;min-height:0;position:relative;background:transparent;display:grid;place-items:center}.cell.socket{background:#203548}.cell.socket:after{content:'';position:absolute;width:48%;height:48%;border:1px dashed #6d8aa3;border-radius:6px;pointer-events:none}.cell.wall{background:#263244;border:0}.cell.source{color:var(--cyan);background:#224052;font-size:clamp(1rem,3vw,2rem)}.cell.target:before{content:'';width:38%;height:38%;border:3px solid #a6b7ce;border-radius:50%;background:#192335}.cell.target.lit:before{border-color:var(--gold);background:#ffce7366;box-shadow:0 0 15px #ffd17799}.cell svg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:75%;height:75%;z-index:2}.beams{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}.tools{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.tools button[aria-pressed=true]{border-color:var(--gold);background:#394052;color:var(--gold)}summary{cursor:pointer;color:var(--cyan);font-weight:700}ul{padding-left:20px;font-size:.85rem}.editor-controls{display:flex;flex-wrap:wrap;gap:10px;margin:15px 0;align-items:end}input{width:90px}textarea{width:100%;margin-top:7px;font-family:monospace;font-size:.8rem}.credit{text-align:center;font-size:.8rem}#status{min-height:28px;margin-bottom:0}#status.solved{color:var(--gold);font-weight:700}@media(max-width:800px){.layout{grid-template-columns:1fr}.tools{margin:10px 0}header{display:block}nav{margin-top:18px}.toolbar p{flex-basis:100%}.panel{padding:14px}}

.tools button{display:flex;gap:8px;align-items:center;text-align:left}.tools button svg{width:38px;height:38px;flex:none}.tools button span{max-width:160px}dialog{color:var(--ink);background:var(--panel);border:1px solid var(--cyan);border-radius:16px;padding:28px;width:min(440px,calc(100% - 32px));box-shadow:0 15px 60px #0008}dialog::backdrop{background:#050b16bb}#modal-next{background:#305963;border-color:var(--cyan)}

.cell.target:before{display:none}.bulb-icon,.bomb-icon{font-size:clamp(1rem,3.4vw,2.1rem);position:relative;z-index:2}.cell.target .bulb-icon{opacity:.45;filter:grayscale(1)}.cell.target.lit .bulb-icon{opacity:1;filter:drop-shadow(0 0 8px #ffce73)}.cell.bomb{background:#35212d}.cell.bomb.hit{background:#862c35;box-shadow:inset 0 0 0 3px #ff7474}.danger{color:#ff9595;font-weight:700}

.profile-row{display:flex;align-items:end;flex-wrap:wrap;gap:12px}.profile-row label{flex:1;min-width:180px}.profile-row input{width:100%}.profile-name{flex:1;min-width:180px}.profile-name>span{display:block}.profile-name>strong{display:block;margin-top:6px;overflow-wrap:anywhere}#furthest{color:var(--gold);margin-bottom:0}

.cell.portal{background:#272647}.cell.gate{background:#1f3430}.portal-label{position:absolute;left:8%;bottom:3%;font-size:clamp(.6rem,1.7vw,1rem);font-weight:700;color:var(--ink);z-index:3;pointer-events:none}

[hidden]{display:none!important}.mode-controls,.endless-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.mode-controls button[aria-pressed=true]{color:var(--gold);border-color:var(--gold);background:#394052}.endless-actions label{margin-left:8px}.endless-actions input{width:min(240px,100%)}#puzzle-link{width:100%;margin-top:8px}#generation-status:empty{display:none}#endless-progress{color:var(--gold)}#recent-puzzles button{overflow-wrap:anywhere;max-width:100%}

.campaign-controls{display:flex;align-items:center;flex:1;gap:12px;flex-wrap:wrap}.campaign-controls label{min-width:180px}#current-seed{overflow-wrap:anywhere}

.chapter-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.chapter-card{display:flex;gap:9px;align-items:center;text-align:left;padding:12px 9px;min-width:0}.chapter-card[aria-pressed=true]{border-color:var(--gold);background:#303b4c}.chapter-icon{flex:none;width:32px;height:32px;display:grid;place-items:center;color:var(--gold);font-size:2rem}.chapter-icon svg{width:100%;height:100%}.chapter-card strong{display:block;font-size:.9rem;line-height:1.3}.chapter-number{display:block;font-size:.7rem;color:var(--muted);margin-bottom:3px}.chapter-stages{display:flex;gap:5px;margin-top:8px}.chapter-stages span{display:grid;place-items:center;width:20px;height:20px;border:1px solid var(--line);border-radius:50%;font-size:.7rem;color:var(--muted)}.chapter-stages .done{background:#275854;border-color:#83eeac;color:#bcf8d7}.chapter-caption{margin:0 0 5px;color:var(--cyan);font-size:.8rem}.tutorial-links{display:flex;flex-direction:column;gap:6px;margin:10px 0 18px}.tutorial-links button{text-align:left;font-size:.8rem;padding:8px 10px}aside h3{font-size:.9rem;margin:16px 0 0}aside details>p{font-size:.8rem;margin:6px 0}#tutorial{width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto}#tutorial-caption{margin:0 0 8px}#tutorial-demo{width:min(220px,100%);margin:18px auto 0;aspect-ratio:1;background:#101a2a;border:1px solid var(--line);border-radius:8px;overflow:hidden}#tutorial-demo>svg{width:100%;height:100%}.demo-grid rect{fill:transparent;stroke:#304359;stroke-width:2}.demo-beams line{stroke:var(--gold);stroke-width:5;stroke-linecap:round}#tutorial-demo text{text-anchor:middle;dominant-baseline:middle;font-size:49px}#tutorial-demo .demo-source{fill:var(--cyan);font-size:62px}#tutorial .demo-caption{text-align:center;font-size:.75rem;margin:7px 0 14px}#tutorial-copy p{font-size:.9rem;margin:12px 0}@media(max-width:900px){.chapter-list{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:480px){.chapter-list{grid-template-columns:repeat(2,minmax(0,1fr))}.chapter-card{padding:10px 8px}#tutorial{padding:20px}#tutorial-demo{width:170px}}

.cell.has-piece,#tools [data-drag-piece]{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}.drag-origin{opacity:.35}.drag-ghost{position:fixed;z-index:1000;pointer-events:none;width:64px;height:64px;transform:translate(-50%,-50%);border:2px solid var(--cyan);border-radius:10px;background:#192335ed;box-shadow:0 8px 25px #0008;padding:5px}.drag-ghost svg{width:100%;height:100%}.drag-ghost.will-remove{border-color:#ff9595;background:#422837ed}.drag-ghost.will-remove:after{content:'×';position:absolute;top:-10px;right:-10px;background:#a83b50;color:white;border-radius:50%;width:24px;height:24px;text-align:center;font-size:20px;line-height:22px}.cell.drop-target{box-shadow:inset 0 0 0 3px var(--cyan);background:#315665}.cell.drop-blocked{box-shadow:inset 0 0 0 3px #ff9595}.cell.hint-error{box-shadow:inset 0 0 0 3px #ff9595;background:#513343}.cell.hint-place{box-shadow:inset 0 0 0 3px #83eeac;background:#2c4b44}.cell.hint-error:before,.cell.hint-place:before{content:'?';position:absolute;right:3px;top:2px;z-index:4;color:var(--ink);background:#101724;border-radius:50%;width:18px;height:18px;font-size:13px;line-height:18px;text-align:center}#hint{border-color:#83eeac}#hint-status{color:#83eeac;margin-top:8px;margin-bottom:0;font-size:.9rem}#hint-status.hint-warning{color:#ffb6bc}

#inventory-panel{align-self:start}.inventory-tools{gap:8px}.inventory-tools button{position:relative;justify-content:center;padding:8px;width:58px;height:58px}.inventory-tools button svg{width:42px;height:42px}.inventory-tools .piece-quantity{position:absolute;right:3px;bottom:3px;min-width:20px;padding:1px 4px;text-align:center;background:var(--bg);border:1px solid var(--line);border-radius:6px;color:var(--ink);font-size:.8rem;font-weight:700;font-variant-numeric:tabular-nums}.help-actions{display:flex;flex-direction:column;gap:14px;margin-top:20px}.help-actions>button{text-align:left}.tutorial-links{flex-direction:row;gap:7px;margin:12px 0 0}.tutorial-links button{width:44px;height:44px;padding:7px;display:grid;place-items:center}.tutorial-links button svg{width:100%;height:100%}.tutorial-links button span{font-size:1.8rem;color:var(--gold)}.puzzle-metrics{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.puzzle-clock{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.8rem}.puzzle-clock time{font-variant-numeric:tabular-nums;color:var(--ink);font-size:1rem;min-width:5ch}.completion-time{color:var(--gold);font-size:1.15rem;font-weight:700;font-variant-numeric:tabular-nums}.layout.editor-layout{grid-template-columns:minmax(0,800px);justify-content:center}#how-to-play-modal{width:min(600px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto}#how-to-play-modal p{font-size:.9rem}.play-goal{color:var(--gold);font-weight:600}.play-guide{margin:18px 0}.play-guide>div{display:grid;grid-template-columns:135px minmax(0,1fr);gap:12px;margin:12px 0;align-items:center}.play-guide dt{display:flex;align-items:center;gap:10px;font-size:.85rem;font-weight:600}.play-guide dd{margin:0;color:var(--muted);font-size:.85rem;line-height:1.5}.help-symbol{width:32px;min-width:32px;height:32px;display:grid;place-items:center;font-size:1.5rem;color:var(--cyan)}.help-wall{overflow:hidden;border:1px solid var(--line)}.help-socket{border:1px dashed #82a4c2;border-radius:5px;background:#203548}.guide-note{color:var(--muted)}#how-to-play-close{min-width:130px;background:#305963;border-color:var(--cyan)}@media(max-width:800px){#inventory-panel{grid-row:1}.inventory-tools{margin:12px 0}.help-actions{flex-direction:row;flex-wrap:wrap;align-items:center;margin-top:10px;gap:16px}.help-actions details{min-width:150px}.play-guide>div{grid-template-columns:115px minmax(0,1fr)}}@media(max-width:420px){#how-to-play-modal{padding:20px}.play-guide>div{grid-template-columns:1fr;gap:4px}.play-guide dd{padding-left:42px}}

.help-symbol svg{width:100%;height:100%}

/* Beam display and board artwork. */
#board{--beam-color:var(--gold);width:calc(100% * var(--board-scale,1));margin-inline:auto}.cell svg.wall-art{inset:0;width:100%;height:100%;transform:none;pointer-events:none}.beams .beam-line{stroke:var(--beam-color);stroke-width:3;stroke-linecap:butt;filter:drop-shadow(0 0 2px #ffce7340)}.beams .photons line{stroke-dasharray:.1 43.9;stroke-linecap:round;stroke-dashoffset:var(--photon-phase);animation:photon-flow var(--photon-period,1.25s) linear infinite}.beams .photon-rim{stroke:#4c330d;stroke-width:8}.beams .photon-core{stroke:#ffcf70;stroke-width:5;filter:drop-shadow(0 0 2px #ffcf7070)}@keyframes photon-flow{from{stroke-dashoffset:var(--photon-phase)}to{stroke-dashoffset:var(--photon-next)}}#board-view label{display:flex;align-items:center;gap:9px;margin-top:12px;font-size:.82rem;cursor:pointer}#board-view input{width:16px;height:16px;margin:0;accent-color:var(--cyan)}.view-experiment{display:block;color:var(--muted);font-size:.7rem;margin-top:10px}.help-wall .wall-art{width:100%;height:100%}@media(prefers-reduced-motion:reduce){.beams .photons line{animation:none;stroke-dasharray:none;stroke-linecap:butt}.beams .photon-rim{stroke-width:4}.beams .photon-core{stroke:var(--beam-color);stroke-width:3;filter:none}}

#fire-laser{background:#305963;border-color:var(--cyan)}.cell.source.laser-off .emitter-art{opacity:.85}.beams .shot-photons line{animation-duration:var(--photon-period);animation-delay:var(--photon-delay)}.beams.shot-paused .shot-photons line{animation-play-state:paused}.planning-clear{color:#83eeac;font-weight:600}

.score-heading{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.score-heading h2{margin:0}.score-heading>strong{font-size:1.6rem;color:var(--gold);font-variant-numeric:tabular-nums}.score-heading>span,.score-detail{color:var(--muted);font-size:.8rem}.puzzle-reward,.completion-score{color:#83eeac;font-weight:600}.score-actions{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-top:16px}#endless-score-panel details p,#score-history{font-size:.85rem;color:var(--muted);line-height:1.5}#score-history{padding-left:20px}#score-history li{margin:7px 0;overflow-wrap:anywhere}#reset-score-modal{width:min(520px,calc(100% - 32px))}#reset-score-player{color:var(--gold)}

.cell svg.emitter-art{width:94%;height:94%;pointer-events:none}.cell.source.can-fire:hover{background:#2b5266;border-color:var(--cyan)}.cell.source.can-fire:hover .emitter-art,.cell.source.can-fire:focus-visible .emitter-art{opacity:1}.cell.source:not(.laser-off) .emitter-lens{filter:drop-shadow(0 0 3px #ff4f68)}.help-emitter svg{width:100%;height:100%}#fire-all-confirm{background:#305963;border-color:var(--cyan)}

.daily-card{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:18px;padding:16px;border:1px solid #546758;border-radius:10px;background:#203333}.daily-card strong{color:var(--gold)}.daily-card p{margin:4px 0;font-size:.8rem}#daily-card-status{color:#83eeac}#play-daily{border-color:#83eeac}#daily-controls p{font-size:.85rem}@media(max-width:480px){.daily-card{align-items:flex-start;flex-direction:column}.daily-card button{width:100%}}

.generator-options,.replay-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.generator-options label,.replay-tools label{display:flex;gap:8px;align-items:center}.generator-options{margin:14px 0}.replay-seek{display:flex;gap:12px;align-items:center;margin-top:12px}.replay-seek input{flex:1;min-width:80px;padding:0;margin:0;border:0;background:transparent}.replay-seek output{font-variant-numeric:tabular-nums;white-space:nowrap}#difficulty-feedback{border-top:1px solid #344156;margin-top:16px;padding-top:8px}#profile-transfer-status:empty{display:none}

.laser-pulse circle{fill:#ffcf70;stroke:#4c330d;stroke-width:1.4;filter:drop-shadow(0 0 2px #ffcf7070)}#board-view>p{font-size:.75rem;margin:5px 0 12px}

#difficulty-rating{display:block;width:100%;padding:0;margin:15px 0 8px;accent-color:var(--cyan);cursor:pointer}.feedback-ticks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;color:var(--muted);font-size:.7rem;text-align:center}.feedback-ticks span:first-child{text-align:left}.feedback-ticks span:last-child{text-align:right}#feedback-choice{display:block;margin-top:12px;color:var(--cyan);font-size:.85rem}#feedback-status{font-size:.78rem;margin:6px 0 0}#feedback-status:empty{display:none}.estimated-difficulty{color:var(--gold);font-weight:600;font-size:.88rem}#success{max-height:calc(100dvh - 32px);overflow:auto}

#tutorial-demo .demo-portal-label{fill:var(--cyan);font-size:28px;font-weight:700}

#failure-modal{width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto}#failure-title{color:#ff9f88}#failure-adjust{background:#305963;border-color:var(--cyan)}

#planning-tools{margin:10px 0}.planning-tools-row{display:flex;flex-wrap:wrap;align-items:end;gap:7px;margin-top:12px}.planning-tools-row button,.setup-row button{font-size:.78rem;padding:7px}.planning-tools-row label{min-width:70px}#annotate[aria-pressed=true]{border-color:var(--gold);background:#394052;color:var(--gold)}#planning-tools p{font-size:.73rem;margin:10px 0}.setup-row{display:flex;align-items:center;gap:8px;margin:8px 0}.setup-row strong{width:22px;color:var(--muted)}.setup-row.has-setup strong{color:var(--gold)}#planning-status{color:var(--cyan)}#planning-status:empty{display:none}#board.annotating .cell{cursor:crosshair}.planning-mark{position:absolute;right:3%;top:3%;z-index:5;display:grid;place-items:center;width:33%;height:33%;min-width:16px;min-height:16px;font-size:clamp(.65rem,2.3vw,1.5rem);font-weight:700;color:#ffc987;background:#162034e8;border:1px solid #ffc987;border-radius:5px;pointer-events:none;line-height:1}#difficulty-report{margin:12px 0}#difficulty-report p{font-size:.78rem;margin:5px 0}#difficulty-report-rows>div{padding:10px 0;border-top:1px solid var(--line)}#difficulty-report-rows strong{color:var(--gold)}#difficulty-report-rows p:last-child{font-style:italic}

/* Keep persistent play controls near the board; secondary tools live in dialogs. */
header nav{flex-wrap:wrap;align-items:center;justify-content:flex-end}
.profile-stats{display:flex;align-items:center;flex-wrap:wrap;gap:10px 22px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.profile-points{color:var(--gold)}.profile-points strong{font-size:1.35rem;font-variant-numeric:tabular-nums}#furthest{margin:0;font-size:.85rem;color:var(--muted)}
.puzzle-title-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.puzzle-title-row h2{min-width:0}.puzzle-reward{display:inline-flex;align-items:center;margin:0;padding:5px 9px;border:1px solid #426551;border-radius:7px;background:#203833;font-size:.8rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.inventory-actions{display:flex;gap:8px;margin:16px 0}.inventory-actions button{flex:1}.board-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.board-actions button{font-size:.85rem}#next-level{background:#305963;border-color:var(--cyan)}
#campaign-controls{margin-top:18px}#campaign-controls label{display:flex;align-items:center;gap:10px}#campaign-controls select{max-width:100%}#status:empty,#storage-note:empty{display:none}
#rules-modal,#history-modal{width:min(640px,calc(100% - 32px))}#rules-modal,#settings-modal,#history-modal{max-height:calc(100dvh - 32px);overflow:auto}
.rules-section{margin:22px 0}#rules-modal h3,#settings-modal h3{font-size:1rem;margin:18px 0 12px}#rules-modal p{font-size:.85rem}#rules-modal .tutorial-links{margin-bottom:22px}#rules-modal details p{font-size:.83rem}
#settings-modal .settings-tab-panel>label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0}#settings-modal #board-view{margin:22px 0}
.history-actions{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.history-actions button{font-size:.8rem}#history-modal>details{margin:20px 0}#history-modal #score-count{font-size:.85rem}#history-modal #reset-score{margin-left:auto}
.dialog-close{display:block;margin-top:24px;min-width:100px;background:#305963;border-color:var(--cyan)}
@media(max-width:800px){header nav{justify-content:flex-start}.profile-stats{gap:10px 16px}.inventory-actions{max-width:300px}#campaign-controls label{flex-wrap:wrap}.rules-section .play-guide>div{grid-template-columns:115px minmax(0,1fr)}}
@media(max-width:420px){.rules-section .play-guide>div{grid-template-columns:1fr}#history-modal #reset-score{margin-left:0}}

/* Editor object tools use the same visual vocabulary as the board. */
#editor-tools button{width:58px;height:58px;padding:9px;justify-content:center;color:var(--cyan)}#editor-tools button svg{width:38px;height:38px}#editor-tools .editor-emoji{font-size:1.9rem;line-height:1}#editor-tools [data-edit="remove"]{color:#ff9f88}
.editor-count{align-items:center;gap:7px}.editor-count-icon{display:grid;place-items:center;width:42px;height:42px;color:var(--muted)}.editor-count-icon svg{width:100%;height:100%}.editor-count input{width:72px;text-align:center}.editor-icon-action{display:grid;place-items:center;width:46px;height:46px;padding:10px;color:var(--cyan)}.editor-icon-action svg{width:100%;height:100%}#play-custom{color:#83eeac}

/* Make the Endless start action easy to find. */
.endless-seed-row{display:flex;align-items:end;gap:10px;margin:20px 0}.endless-seed-row label{flex:1;min-width:0}.endless-seed-row input{width:100%}.puzzle-share,.puzzle-reroll{display:grid;place-items:center;width:44px;height:44px;flex:none;padding:10px;color:var(--cyan)}.puzzle-share svg,.puzzle-reroll svg{width:100%;height:100%}
.endless-play-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}#play-seed.primary-play{margin-left:auto;min-width:150px;min-height:52px;padding:13px 28px;font-size:1.1rem;font-weight:700;background:#27734f;border:1px solid #83eeac;color:#f0fff6;box-shadow:0 3px 12px #0003}#play-seed.primary-play:hover{background:#30875e}#play-seed.primary-play:disabled{background:#27734f}
#current-seed:empty,#puzzle-structure:empty{display:none}@media(max-width:420px){#play-seed.primary-play{min-width:120px}.endless-play-actions{gap:8px}}

.dialog-checkbox{display:flex;align-items:center;gap:9px;margin:20px 0;font-size:.85rem;cursor:pointer}.dialog-checkbox input{width:17px;height:17px;padding:0;margin:0;accent-color:var(--cyan)}

.replay-display-option{cursor:pointer;font-size:.85rem}.replay-display-option input{width:17px;height:17px;padding:0;margin:0;accent-color:var(--cyan)}
.endless-play-actions{justify-content:flex-end}#mode-editor{display:inline-flex;align-items:center;gap:7px;margin-right:auto}#play-seed.primary-play{margin-left:0}#cancel-generation{margin-right:auto}

/* Pausing hides the puzzle and inventory, including behind other dialogs. */
.timer-pause{padding:5px 9px;font-size:.8rem;min-height:30px}body.puzzle-paused #puzzle-layout,body.puzzle-paused #replay-controls{visibility:hidden}body.puzzle-paused .beams *{animation-play-state:paused!important}#puzzle-pause-modal{text-align:center}#puzzle-pause-modal::backdrop{background:var(--bg)}#puzzle-pause-modal #resume-puzzle{min-width:150px;background:#27734f;border-color:#83eeac}#puzzle-pause-modal #paused-time{margin:18px 0 10px}

body.puzzle-paused:has(#puzzle-pause-modal[open]){overflow:hidden}

.difficulty-estimate-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.difficulty-estimate-row .estimated-difficulty{margin:12px 0}

.version-badge{display:inline-block;margin-left:8px;padding:3px 7px;border:1px solid #426551;border-radius:5px;color:#83eeac;letter-spacing:0}
.campaign-description{font-size:.83rem;margin:0 0 16px}.journey-map{display:grid;gap:18px;margin:18px 0 4px}.journey-act h3{font-size:.85rem;font-weight:600;color:var(--muted);margin:0 0 12px}.journey-route{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:12px;position:relative}.journey-node{position:relative;justify-self:center;display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:50%;background:#111c2b;font-weight:600;font-variant-numeric:tabular-nums}.journey-node.easy{border-color:#83eeac}.journey-node.medium{border-color:var(--cyan)}.journey-node.hard{border-color:#ffce73}.journey-node.expert{border-color:#cb9aff}.journey-node.completed{background:#25483b;color:#b5f8ce;border-color:#83eeac}.journey-node.current{outline:3px solid var(--gold);outline-offset:3px}.journey-node:disabled{opacity:.3;cursor:default}.journey-check{position:absolute;right:-5px;bottom:-3px;font-size:.7rem;width:17px;height:17px;border-radius:50%;background:#83eeac;color:#101724;border:2px solid var(--panel)}#journey-progress,.campaign-complete{color:#83eeac;font-weight:600}#journey-profile-progress{color:var(--cyan)}
@media(max-width:650px){.journey-route{grid-template-columns:repeat(5,minmax(0,1fr));row-gap:16px}.journey-node{width:40px;height:40px}.journey-act h3{font-size:.8rem}}

/* Focused generated puzzle play; setup returns through the inventory. */
body.puzzle-focused main{padding-top:24px}.inventory-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.inventory-actions button{min-width:0}#go-back{color:var(--muted)}

/* Keep Campaign estimates readable even while their stages are locked. */
.journey-stop{position:relative;display:grid;justify-items:center;align-content:start;gap:9px;min-width:0}.journey-difficulty{color:var(--muted);font-size:.7rem;line-height:1.35;text-align:center;overflow-wrap:anywhere}.journey-stop.easy .journey-difficulty{color:#83eeac}.journey-stop.medium .journey-difficulty{color:var(--cyan)}.journey-stop.hard .journey-difficulty{color:var(--gold)}.journey-stop.expert .journey-difficulty{color:#cb9aff}
@media(max-width:650px){.journey-difficulty{font-size:.68rem}}

.icon-style-preview{display:flex;justify-content:center;gap:14px;padding:14px;background:#101a2a;border:1px solid var(--line);border-radius:10px}.icon-style-preview>span{width:54px;height:54px;display:grid;place-items:center}.icon-style-preview svg{width:100%;height:100%}

#portal-view>label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}#portal-view .portal-checkbox{justify-content:start;font-size:.82rem}#portal-compass{width:16px;height:16px;margin:0;accent-color:var(--cyan)}#portal-compass-help,.portal-preview figcaption{font-size:.75rem;line-height:1.5;color:var(--muted)}.portal-preview{margin:16px 0;padding:12px;background:#101a2a;border:1px solid var(--line);border-radius:10px}#portal-style-preview>svg{display:block;width:100%;height:auto}.portal-preview figcaption{margin-top:5px}#tutorial-demo .portal-compass-mark{font-size:18px;dominant-baseline:central}

#tutorial-demo .portal-pair-mark{font-size:22px;dominant-baseline:central}

#tutorial-portal-options{margin:20px 0;padding-top:16px;border-top:1px solid var(--line)}#tutorial-portal-options h3{margin:0 0 12px;font-size:1rem}#tutorial-portal-options li{margin:9px 0;line-height:1.5}#tutorial-portal-options p{font-size:.85rem}#tutorial-portal-settings{border-color:var(--cyan)}
#tutorial-demo.animated-examples{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;width:100%;aspect-ratio:auto;background:none;border:0;overflow:visible}.tutorial-example{flex:1 1 180px;max-width:240px;min-width:0;margin:0}.tutorial-example>svg{display:block;width:100%;height:auto;background:#101a2a;border:1px solid var(--line);border-radius:8px}.tutorial-example figcaption{text-align:center;color:var(--muted);font-size:.75rem;line-height:1.4;margin-top:7px}#tutorial-demo .demo-bulb{opacity:.3}#tutorial-demo .demo-bulb.demo-lit{opacity:1;filter:drop-shadow(0 0 7px #ffe17e)}#tutorial-demo .demo-beams{pointer-events:none}@media(max-width:480px){#tutorial-demo.animated-examples{gap:10px}.tutorial-example{flex-basis:130px}}
#tutorial-demo.return-examples{gap:12px}#tutorial-demo.return-examples .tutorial-example{flex-basis:140px;max-width:180px}
#tutorial-demo.portal-examples .tutorial-example{max-width:200px}#tutorial-portal-options details{font-size:.85rem}#tutorial-portal-options summary{cursor:pointer}

/* Links live in the space between opaque stage orbs, on every row. */
.journey-stop:not(:nth-child(10n)):not(:last-child)::after{content:'';position:absolute;top:21px;left:calc(50% + 29px);width:max(0px,calc(100% + 12px - 58px));height:2px;background:var(--line);pointer-events:none}
.journey-node:disabled{opacity:1;color:#78869a;border-color:#354050;background:#111c2b;cursor:default}
@media(max-width:650px){.journey-stop:not(:nth-child(10n)):not(:last-child)::after{display:none}.journey-stop:not(:nth-child(5n)):not(:last-child)::after{content:'';display:block;position:absolute;top:19px;left:calc(50% + 27px);width:max(0px,calc(100% + 12px - 54px));height:2px;background:var(--line);pointer-events:none}}

.mode-controls button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.mode-icon{font-size:.95em;line-height:1}
.coming-soon-button{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;cursor:default}.coming-soon-button small{font-size:.65rem;color:var(--muted)}

@media(max-width:460px){.journey-route{grid-template-columns:repeat(3,minmax(0,1fr))}.journey-stop::after,.journey-stop:not(:nth-child(5n)):not(:last-child)::after{display:none}.journey-stop:not(:nth-child(3n)):not(:last-child)::after{content:'';display:block;position:absolute;top:19px;left:calc(50% + 27px);width:max(0px,calc(100% + 12px - 54px));height:2px;background:var(--line);pointer-events:none}}

/* Setup has one clear primary action; puzzle utilities sit outside the inventory. */
.primary-play{min-width:150px;min-height:52px;padding:13px 28px;font-size:1.1rem;font-weight:700;background:#27734f;border:1px solid #83eeac;color:#f0fff6}.primary-play:hover{background:#30875e}
#seeded-controls>label{display:block;margin-top:20px}#puzzle-seed{width:100%;margin-top:8px}
.puzzle-sidebar{align-self:start;min-width:0}.puzzle-sidebar #inventory-panel{margin-bottom:10px}.puzzle-screen-actions{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:6px}.puzzle-screen-actions>button{display:inline-flex;justify-content:center;align-items:center;gap:4px;padding:9px 6px;font-size:.8rem;white-space:nowrap;flex:1;min-width:0}.puzzle-screen-actions #share-puzzle{flex:0 0 38px;height:38px;font-size:1rem}.puzzle-share-result{flex-basis:100%;text-align:right}.puzzle-share-result input{width:min(100%,600px);margin:8px 0}.puzzle-share-result label{display:block}.puzzle-share-result p,#puzzle-action-status{font-size:.8rem;color:var(--muted);overflow-wrap:anywhere}#puzzle-action-status{flex-basis:100%;text-align:right}#puzzle-action-status:empty{display:none}.inventory-actions{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}.inventory-actions button{padding-inline:8px}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}@media(max-width:800px){.puzzle-sidebar{grid-row:1}.puzzle-screen-actions{justify-content:flex-start}.puzzle-screen-actions>button{flex:none;padding-inline:12px}}


/* Light mode uses cool, tinted surfaces; optical artwork uses medium slate tiles. */
:root.light-theme {
 color-scheme:light;
 --bg:#dce6ef; --panel:#edf3f8; --line:#a7bbce;
 --ink:#203247; --muted:#52677e; --gold:#8f5709; --cyan:#08727c;
 --light-control:#e2ecf4; --light-selected:#cbe4ec;
 --optic-tile:#52677c; --optic-tile-hover:#60788e;
 --light-success:#246444; --light-danger:#a02e42; --light-violet:#7050a4;
}
.light-theme body{background:radial-gradient(ellipse at top,#eef4f9,var(--bg) 65%)}
.light-theme :is(button,select,input,textarea){background:var(--light-control)}
.light-theme button:hover{background:#d2e4ef}
.light-theme :is(.tools button,.mode-controls button,.chapter-card,#annotate)[aria-pressed=true]{background:var(--light-selected);color:var(--ink);border-color:var(--cyan)}
.light-theme dialog{box-shadow:0 15px 60px #243d5b33}
.light-theme dialog::backdrop{background:#344b6680}
.light-theme :is(.dialog-close,#modal-next,#how-to-play-close,#next-level,#fire-laser,#fire-all-confirm,#failure-adjust){background:#cee6ea;color:#204452}
.light-theme :is(.primary-play,#play-seed.primary-play,#puzzle-pause-modal #resume-puzzle){background:#27734f;color:#f0fff6;border-color:#246444}
.light-theme :is(.primary-play,#play-seed.primary-play,#puzzle-pause-modal #resume-puzzle):hover{background:#205f41}
.light-theme .daily-card{background:#dbece5;border-color:#9bbcae}
.light-theme :is(#daily-card-status,.completion-score,.planning-clear,#hint-status,#journey-progress,.campaign-complete,#play-custom){color:var(--light-success)}
.light-theme :is(#hint,#play-daily){border-color:var(--light-success)}
.light-theme .puzzle-reward{background:#dbece5;border-color:#9bbcae;color:var(--light-success)}
.light-theme .version-badge{background:#dbece5;border-color:#9bbcae;color:var(--light-success)}
.light-theme :is(.danger,#hint-status.hint-warning,#failure-title,#editor-tools [data-edit="remove"]){color:var(--light-danger)}
.light-theme #difficulty-feedback{border-color:var(--line)}
.light-theme .journey-node{background:var(--light-control)}
.light-theme .journey-node:disabled{background:#d9e3ed;color:#667b91;border-color:#b2c2d2}
.light-theme .journey-node.easy{border-color:var(--light-success)}
.light-theme .journey-node.hard{border-color:var(--gold)}
.light-theme .journey-node.expert{border-color:var(--light-violet)}
.light-theme .journey-node.completed{background:#cbe4d7;color:#20563a;border-color:var(--light-success)}
.light-theme .chapter-stages .done{background:#cbe4d7;color:#20563a;border-color:var(--light-success)}
.light-theme .journey-stop.easy .journey-difficulty{color:var(--light-success)}
.light-theme .journey-stop.expert .journey-difficulty{color:var(--light-violet)}
.light-theme #board{background:#cddce8;--beam-color:#b36307}
.light-theme .cell{border-color:#afc3d4}
.light-theme .cell.empty{background:#cddce8}
.light-theme .cell.target{background:#c1d2df}
.light-theme .cell.socket{background:var(--optic-tile)}
.light-theme .cell.socket:after{border-color:#a2b7c9}
.light-theme .cell.wall{background:#263244;border-color:#526074}
.light-theme :is(.cell.has-piece,.cell.source,.cell.portal,.cell.gate){background:var(--optic-tile)}
.light-theme .portal-label{color:#edf3fb}
.light-theme .cell.source.can-fire:hover{background:var(--optic-tile-hover)}
.light-theme .cell.bomb{background:#ead1d9}
.light-theme .cell.bomb.hit{background:#c64b5e;box-shadow:inset 0 0 0 3px #8f2337}
.light-theme .cell.target .bulb-icon{opacity:.8;filter:grayscale(1) brightness(.65)}
.light-theme .cell.target.lit .bulb-icon{opacity:1;filter:drop-shadow(0 0 4px #b36307)}
.light-theme .beams .beam-line{filter:drop-shadow(0 0 1px #f9e0b0)}
.light-theme .cell.drop-target{background:#94c5d3;box-shadow:inset 0 0 0 3px var(--cyan)}
.light-theme .cell.drop-blocked{box-shadow:inset 0 0 0 3px var(--light-danger)}
.light-theme .cell.hint-error{background:#5d3447;box-shadow:inset 0 0 0 3px var(--light-danger)}
.light-theme .cell.hint-place{background:#294f44;box-shadow:inset 0 0 0 3px var(--light-success)}
.light-theme :is(.cell.hint-error,.cell.hint-place):before{background:#edf3f8;color:var(--ink)}
.light-theme .planning-mark{background:#f2dfb9ed;color:#744809;border-color:#a46d22}
/* Slate artwork cards preserve the established colors and transparent glass effects. */
.light-theme :is(.inventory-tools button,.tutorial-links button,#editor-tools button){background:var(--optic-tile);border-color:#657f98;color:#edf3fb;--gold:#ffce73;--cyan:#68e5eb}
.light-theme :is(.inventory-tools button,.tutorial-links button,#editor-tools button):hover{background:var(--optic-tile-hover)}
.light-theme :is(.inventory-tools button,#editor-tools button)[aria-pressed=true]{background:var(--optic-tile-hover);border-color:#b36307;box-shadow:0 0 0 2px #b36307}
.light-theme .icon-style-preview{background:var(--optic-tile);border-color:#657f98}
.light-theme .portal-preview{background:#e2ecf4}
.light-theme #portal-style-preview{background:var(--optic-tile);border-radius:7px}
.light-theme :is(.chapter-icon,.editor-count-icon,.help-emitter){background:var(--optic-tile);border-radius:6px}
.light-theme .help-socket{background:var(--optic-tile);border-color:#a2b7c9}
.light-theme :is(#tutorial-demo,.tutorial-example>svg){--gold:#ffce73;--cyan:#68e5eb}
.light-theme #tutorial-demo:not(.animated-examples),.light-theme .tutorial-example>svg{background:var(--optic-tile)}
.light-theme .drag-ghost{background:var(--optic-tile);border-color:#08727c}
.light-theme .drag-ghost.will-remove{background:#422837ed;border-color:#a02e42}
#settings-modal .theme-setting input{width:18px;height:18px;margin:0;accent-color:var(--cyan);cursor:pointer}

/* Sprint setup and browser-wide scoreboard. */
.sprint-setup-actions{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:22px 0}
.sprint-setup-actions .primary-play{margin-left:auto}
#sprint-controls h3{margin-top:28px}
#sprint-controls>label{display:flex;align-items:center;gap:10px}
.sprint-score-scroll{overflow-x:auto;margin-top:16px}
.sprint-scores{width:100%;border-collapse:collapse;font-size:.85rem;font-variant-numeric:tabular-nums}
.sprint-scores th,.sprint-scores td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line)}
.sprint-scores th{color:var(--muted);font-weight:600;white-space:nowrap}
.sprint-scores td:nth-child(2){overflow-wrap:anywhere;max-width:200px}
.sprint-scores td:nth-child(n+3){white-space:nowrap}
.sprint-run-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 16px;font-size:.85rem;color:var(--muted)}
.sprint-run-bar strong{color:var(--ink);font-variant-numeric:tabular-nums}
#sprint-run-notice{flex-basis:100%;font-size:.8rem}
#sprint-result-modal{width:min(700px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow-y:auto}
#sprint-result-best{color:var(--cyan)}
@media(max-width:480px){.sprint-setup-actions{align-items:stretch}.sprint-setup-actions label{flex-basis:100%}.sprint-setup-actions .primary-play{margin-left:0;flex:1}.sprint-scores th,.sprint-scores td{padding:10px 6px}}

body.sprint-focused .inventory-actions{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Achievement badges share the active theme and never interrupt a solve. */
#achievements-modal{width:min(1100px,calc(100% - 32px));max-height:85vh;overflow-y:auto}
#achievements-player{margin-top:0;font-size:.85rem}
.achievements-list{display:grid;gap:24px;margin:18px 0}.achievement-section{min-width:0}.achievement-section>h3{margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line);font-size:1rem;color:var(--ink)}.achievement-section-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.achievement-card{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:12px;padding:14px 24px 14px 14px;min-height:74px;text-align:left;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.achievement-icon{font-size:1.8rem;text-align:center;filter:grayscale(1);opacity:.55}
.achievement-card.earned{border-color:var(--cyan)}
.achievement-card.earned .achievement-icon{filter:none;opacity:1}
.achievement-name{font-size:.95rem;color:var(--ink);line-height:1.35}
.achievement-check{position:absolute;top:6px;right:8px;font-size:.8rem;color:var(--cyan)}
#achievement-detail-modal{width:min(480px,calc(100% - 32px));max-height:85vh;overflow-y:auto}
#achievement-detail-modal .heading{align-items:start}
#achievement-detail-title{flex:1;min-width:0}
#achievement-detail-icon{display:block;font-size:3rem;text-align:center;margin:18px 0;filter:grayscale(1);opacity:.55}
#achievement-detail-modal.earned #achievement-detail-icon{filter:none;opacity:1}
#achievement-detail-modal .achievement-state{font-size:.85rem;color:var(--muted)}
#achievement-detail-modal.earned .achievement-state{color:var(--cyan)}
#achievement-detail-progress progress{width:100%;height:8px;accent-color:var(--cyan);display:block}
.achievement-toast{position:fixed;inset:18px 18px auto auto;margin:0;z-index:2000;display:grid;gap:10px;width:min(340px,calc(100% - 32px));padding:0;background:transparent;border:0;overflow:visible;pointer-events:none;color:var(--ink)}
.achievement-toast::backdrop{background:transparent;pointer-events:none}
.achievement-toast[hidden]{display:none}
.achievement-toast-card{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--panel);border:1px solid var(--cyan);border-radius:12px;box-shadow:0 8px 28px #0005}
.achievement-toast-icon{font-size:1.6rem;flex:none}
.achievement-toast-card p{font-size:.72rem;color:var(--muted);margin:0 0 3px}
.achievement-toast-card strong{display:block;font-size:.85rem;color:var(--ink)}
@media(max-width:1000px){.achievement-section-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.achievement-section-grid{grid-template-columns:1fr}.achievement-toast{top:12px;right:16px}}


#achievements-modal>.heading{position:sticky;top:-28px;z-index:1;background:var(--panel);padding:12px 0;margin-bottom:8px}
#achievements-modal>.heading h2{flex:1}

#rename-profile-form input{width:100%}
#delete-profile-confirm{border-color:#e98591;color:#e98591}
.light-theme #delete-profile-confirm{border-color:var(--light-danger);color:var(--light-danger)}
#rename-profile-error:empty,#delete-profile-error:empty{display:none}

/* Title and navigation over the optical banner; hidden during focused play. */
#game-header{flex-wrap:wrap;gap:12px;justify-content:flex-end}
.game-hero{position:relative;flex:0 0 100%;width:100%;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:linear-gradient(115deg,#1b2d41,#172336 65%,#21364a)}
.game-banner{width:100%;margin:0}
.game-banner img{display:block;width:100%;height:auto;min-height:164px;object-fit:cover}
.game-hero-title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:radial-gradient(ellipse at center,#172336e0,transparent 65%)}
.game-hero-title h1{font-family:"Avenir Next",Avenir,"Segoe UI",system-ui,sans-serif;font-weight:400;letter-spacing:.025em;line-height:1.1;color:#f2d58a;font-size:clamp(2.5rem,6vw,4.5rem);text-shadow:0 2px 8px #101724,0 0 22px #101724}
.game-version-row .version-badge{color:#bceff2;border-color:#68e5eb80;background:#172336d9;align-self:center}
#game-header nav{position:absolute;top:14px;right:16px;margin-top:0;gap:10px;align-items:center;z-index:1}
#game-header nav button{background:#172336e8;color:#edf3fb;border-color:#7992ac80;box-shadow:0 2px 8px #10172440}
#game-header nav button:hover{border-color:#68e5eb}
#game-header nav a{color:#ffce73}
.light-theme .game-hero{background:linear-gradient(115deg,#4a637a,#52677c 65%,#445e76);border-color:#8ea6bc}
@media(max-width:800px){#game-header{display:flex}.game-hero-title{gap:8px;bottom:48px}.game-hero-title h1{font-size:clamp(2.1rem,7vw,3.4rem)}#game-header nav{top:auto;bottom:12px;right:12px;left:12px;justify-content:flex-end;gap:8px}#game-header nav button{padding:8px;font-size:.85rem}}

/* Controls lesson: a separate animated example, never the player's actual board. */
#tutorial-demo.controls-example{width:100%;aspect-ratio:auto;background:#101a2a}
#tutorial-demo.controls-example>svg{display:block;width:100%;height:auto}
#tutorial-demo .controls-label{fill:#a6b7ce;font:15px system-ui,sans-serif;text-anchor:middle}
.controls-inventory{fill:#192335;stroke:#49647f;stroke-width:2}
.controls-grid{fill:#203548;stroke:#49647f;stroke-width:2}
.controls-sockets{fill:none;stroke:#a6b7ce;stroke-width:2;stroke-dasharray:5 4}
.controls-guide-steps{padding-left:24px;margin:18px 0}
.controls-guide-steps li{font-size:.9rem;padding:5px 0}
.controls-guide-steps li.current{color:var(--cyan);font-weight:600}

.game-version-row{position:absolute;top:20px;left:16px;z-index:1;display:flex;align-items:center;gap:8px;max-width:calc(100% - 32px)}
.game-version-row .version-badge{margin-left:0;display:inline-flex;align-items:center;height:30px;padding:0 7px;line-height:1}
.game-version-row #open-changelog{white-space:nowrap}
.game-version-row #open-changelog{position:relative;display:inline-flex;align-items:center;gap:4px;height:30px;min-height:30px;font-size:.75rem;line-height:1;padding:0 9px;color:#edf3fb;background:#172336e8;border-color:#68e5eb80}
/* Keep the compact banner button easy to tap without enlarging its visible border. */
.game-version-row #open-changelog::after{content:"";position:absolute;inset:-7px 0}
.game-version-row #open-changelog:hover{border-color:#68e5eb}
@media(max-width:800px){.game-version-row{top:12px;left:12px;max-width:calc(100% - 24px)}.game-hero-title{padding-top:30px}}
#changelog-modal{width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow-y:auto}
/* Inset the scrollbar from the rounded dialog corners and border. */
dialog::-webkit-scrollbar{width:10px}
dialog::-webkit-scrollbar-track{background:transparent;margin-block:14px}
dialog::-webkit-scrollbar-thumb{background:#697589;border:3px solid transparent;background-clip:padding-box;border-radius:999px}
#changelog-modal>.heading{position:sticky;top:-28px;z-index:1;padding:10px 0;background:var(--panel)}
#changelog-modal>.heading h2{flex:1}
.release-notes+ .release-notes{border-top:1px solid var(--line);margin-top:8px;padding-top:4px}
.release-notes summary{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;list-style:none;border-radius:6px}
.release-notes summary::-webkit-details-marker{display:none}
.release-notes summary::before{content:"";width:7px;height:7px;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(-45deg);flex-shrink:0;margin-left:4px}
.release-notes[open]>summary::before{transform:rotate(45deg)}
.release-notes summary:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.release-notes h3{font-size:1rem;color:var(--gold);margin:0}
.release-notes ul{margin:0;padding-left:22px;font-size:.9rem}
.release-notes li{margin:9px 0}

/* Sound controls remain compact alongside the other settings. */
#settings-modal #sound-volume,#settings-modal #music-volume{width:150px;max-width:48%;padding:0;accent-color:var(--cyan);cursor:pointer}#sound-volume:disabled{opacity:.4;cursor:default}

.sound-preview{margin:0 0 16px}#sprint-review{margin:20px 0}#sprint-review h3{margin-bottom:8px}

/* A traversal brightens both existing rims, without adding a new color code. */
[data-portal-cell] .portal-rim{filter:brightness(calc(1 + var(--portal-pulse,0)*.35))}
[data-portal-cell] .portal-rim-glow{stroke-opacity:calc(.15 + var(--portal-pulse,0)*.45);stroke-width:calc(10px + var(--portal-pulse,0)*4px)}
@media(prefers-reduced-motion:reduce){[data-portal-cell] .portal-rim{filter:none}[data-portal-cell] .portal-rim-glow{stroke-opacity:.15;stroke-width:10px}}

/* A short, dim afterglow follows each pulse along its own optical segment. */
.pulse-trail{fill:none;stroke-width:3;stroke-linecap:butt;filter:none}
[data-trail-gradient] stop{stop-color:var(--beam-color,var(--gold))}
#tutorial-demo .demo-beams .pulse-trail{stroke-width:4;stroke-linecap:butt}
@media(prefers-reduced-motion:reduce){.pulse-trail{display:none}}


/* Touch play: a reachable inventory dock, with native page/pinch zoom retained. */
.touch-piece-tools{display:flex;align-items:center;flex-wrap:wrap;gap:5px;padding:8px 0;border-top:1px solid var(--line)}
#touch-piece-preview{display:inline-flex;width:32px;height:32px;flex:none}
#touch-piece-preview svg{width:100%;height:100%}
.touch-piece-tools button{min-height:44px;padding:8px;font-size:.8rem;touch-action:manipulation}
#touch-cancel{margin-left:auto;min-width:44px;color:var(--muted)}
#touch-move[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}
#touch-piece-status{flex-basis:100%;font-size:.78rem;line-height:1.3;margin:0;color:var(--cyan)}
#touch-piece-status:empty{display:none}
.cell.touch-selected{box-shadow:inset 0 0 0 3px var(--gold);z-index:3}
.cell.touch-destination{box-shadow:inset 0 0 0 2px var(--cyan)}
body.touch-play main{padding-top:8px;padding-bottom:calc(var(--touch-dock-height,230px) + 24px)}
body.touch-play #puzzle-layout{grid-template-columns:minmax(0,1fr);gap:8px}
body.touch-play .arena{padding:8px;margin-bottom:0;min-width:0}
body.touch-play .arena>.heading{gap:6px;margin-bottom:8px}
body.touch-play .arena h2{font-size:1.1rem}
body.touch-play .puzzle-metrics{gap:8px}
body.touch-play .puzzle-clock>span{display:none}
body.touch-play #puzzle-sidebar{position:fixed;z-index:20;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:0;max-height:46dvh;overflow-y:auto;overscroll-behavior:contain;padding:8px 8px max(8px,env(safe-area-inset-bottom));border:1px solid var(--line);border-radius:14px 14px 0 0;background:var(--panel);box-shadow:0 -5px 22px #0005}
body.touch-play #inventory-panel{padding:0;margin:0;border:0;background:transparent;box-shadow:none}
body.touch-play #inventory-panel>h2{display:none}
body.touch-play #tools{margin:0;gap:8px}
body.touch-play .inventory-tools button{width:48px;height:48px;padding:5px}
body.touch-play .inventory-tools button svg{width:36px;height:36px}
body.touch-play .inventory-actions{display:flex;max-width:none;gap:8px;margin:8px 0}
body.touch-play .inventory-actions button{min-height:44px;padding:8px;flex:1;font-size:.85rem}
body.touch-play #planning-tools{margin:6px 0}
body.touch-play #planning-tools>summary{padding:8px 0;min-height:36px;font-size:.8rem}
body.touch-play #puzzle-screen-actions{border:0;padding:0;margin:8px 0 0;gap:6px}
body.touch-play #puzzle-screen-actions button{min-height:44px;padding:8px;font-size:.8rem}
body.touch-play #share-puzzle{flex:0 0 44px;width:44px;height:44px}
body.touch-play #status:empty{min-height:0;margin:0}
body.touch-play .timer-pause{min-height:44px}
body.touch-play #board .cell{touch-action:manipulation}
body.touch-play #board .cell.has-piece{touch-action:none}
body.touch-play :is(.arena,#replay-controls){scroll-margin-bottom:calc(var(--touch-dock-height,230px) + 16px)}
.light-theme .cell.touch-selected{box-shadow:inset 0 0 0 3px #ffe085}
.light-theme .cell.touch-destination{box-shadow:inset 0 0 0 2px #68e5eb}
@media(max-width:800px),(pointer:coarse){
 main,header{width:calc(100% - 16px)}
 button:not(.cell),select,input:not([type=range]):not([type=checkbox]){min-height:44px}
 input,select,textarea{font-size:16px}
 dialog{max-width:calc(100% - 16px);max-height:calc(100dvh - 16px);overflow:auto;padding:18px}
 .replay-tools{gap:8px}.replay-tools label{min-height:44px}
 .replay-seek{flex-wrap:wrap;gap:8px}.replay-seek input{min-width:0;flex-basis:60%;height:32px}
 .profile-row label,.profile-name{min-width:0;flex-basis:100%}
 .generator-options{gap:10px}.generator-options label{flex-wrap:wrap;min-width:0}
 .generator-options select{max-width:100%}
 .mode-controls{gap:8px}.mode-controls button{flex:1 1 auto}
 #puzzle-share-result input{min-width:0;max-width:100%}
 #campaign-map{max-width:100%}
}
/* Landscape tablets need the side dock too, even above phone-height breakpoints. */
@media(orientation:landscape) and (min-width:640px){
 body.touch-play main{padding-left:env(safe-area-inset-left);padding-right:calc(270px + env(safe-area-inset-right));padding-bottom:16px;width:calc(100% - 16px)}
 body.touch-play #puzzle-sidebar{left:auto;right:max(8px,env(safe-area-inset-right));top:8px;bottom:8px;width:256px;max-height:none;border-radius:14px}
 body.touch-play #board{width:min(calc(100% * var(--board-scale,1)),calc((100dvh - 90px) * var(--board-scale,1)));margin-inline:auto}
 body.touch-play .arena>.heading{margin-bottom:6px}
 body.touch-play .arena h2{font-size:.95rem}
 body.touch-play .puzzle-reward{font-size:.7rem;padding:3px 5px}
 body.touch-play .puzzle-clock time{font-size:.9rem}
}


/* Recent boards: compact local history with sticky headings and unrated review. */
.recent-puzzle-scroll{max-height:320px;overflow:auto;margin-top:12px;border:1px solid var(--line);border-radius:8px;overscroll-behavior:contain}
.recent-puzzle-scroll:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.recent-puzzle-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.85rem;font-variant-numeric:tabular-nums;text-align:left}
.recent-puzzle-table th{position:sticky;top:0;z-index:1;background:var(--panel);color:var(--muted);font-weight:600}
.recent-puzzle-table th,.recent-puzzle-table td{padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.recent-puzzle-table tr:last-child td{border-bottom:0}
.recent-puzzle-table td:last-child{text-align:right}
.recent-puzzle-table button{min-height:40px;white-space:nowrap}
.recent-puzzle-table .recent-cleared td:nth-child(4){color:#83eeac}
.light-theme .recent-puzzle-table .recent-cleared td:nth-child(4){color:var(--light-good,#1b6a48)}
@media(max-width:800px),(pointer:coarse){.recent-puzzle-scroll{max-height:42dvh}.recent-puzzle-table th,.recent-puzzle-table td{padding:8px}.recent-puzzle-table button{min-height:44px}}

.recent-row-actions{display:flex;gap:6px;justify-content:flex-end}
.recent-copy-feedback{display:block;color:var(--cyan);font-size:.75rem;max-width:250px;white-space:normal;margin-top:4px}
.recent-copy-feedback:empty{display:none}
.recent-puzzle-table td:last-child input{width:240px;max-width:100%;margin-top:6px;font-size:16px}

/* Native language names make the welcome prompt readable before choosing a locale. */
.welcome-language{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.welcome-language button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:9px 12px}
.welcome-language button>span{font-size:1.4rem;line-height:1}
.welcome-language button[aria-pressed=true]{border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan)}

/* Compact help beside the control preference and an in-puzzle settings shortcut. */
.settings-control-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:22px 0}
.settings-control-heading{display:inline-flex;align-items:center;gap:8px}
.settings-control-row select{max-width:100%}
/* Match the mobile button selector specificity without stretching the visible circle. */
button.mini-help{position:relative;display:inline-grid;place-items:center;flex:none;width:24px;height:24px;min-width:24px;min-height:24px;max-width:24px;max-height:24px;padding:0;border-radius:50%;font-size:.85rem;font-weight:700;line-height:1}
.mini-help::after{content:"";position:absolute;inset:-10px}
.controls-help-list{margin:24px 0}
.controls-help-list dt{font-weight:700;font-size:.9rem;margin-top:18px}
.controls-help-list dd{margin:6px 0 0;color:var(--muted);font-size:.85rem;line-height:1.6}
.controls-help-note{font-size:.8rem}
.board-view-warning{padding:8px 10px;border-left:3px solid var(--gold);line-height:1.6;margin:8px 0 0;font-size:.8rem}
#puzzle-settings{display:inline-grid;place-items:center;flex:none;width:36px;height:36px;min-height:36px;padding:0;font-size:1.1rem}
@media(max-width:800px),(pointer:coarse){#puzzle-settings{width:44px;height:44px;min-height:44px}}

/* Confirmed hint facts remain visible; symbols supplement color. */
.cell.hint-position{box-shadow:inset 0 0 0 3px #ff9595}
.cell.hint-orientation{box-shadow:inset 0 0 0 3px #ffd17c;cursor:pointer}
.cell.hint-correct{box-shadow:inset 0 0 0 3px #83eeac;cursor:default}
.hint-badge{position:absolute;right:2px;top:2px;z-index:4;display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#142035;color:#fff;font-size:16px;font-weight:800;line-height:1;pointer-events:none}
.hint-position .hint-badge{color:#ff9595}.hint-orientation .hint-badge{color:#ffd17c}.hint-correct .hint-badge{color:#83eeac}
.piece-guide-points{padding-left:1.25em;margin:.8em 0}.piece-guide-points li{margin:.55em 0;line-height:1.45}
 .tutorial-next-modes{display:grid;grid-template-columns:1fr;gap:10px;margin:16px 0}
.tutorial-next-modes>button{display:flex;flex-direction:column;align-items:flex-start;gap:5px;width:100%;min-width:0;min-height:64px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;text-align:left;white-space:normal}
.tutorial-mode-title{font-weight:600;line-height:1.4}
.tutorial-mode-description{font-size:.9rem;font-weight:400;color:var(--muted);line-height:1.4}


/* Local v1.5 account dialog; follows the selected game theme. */
#account-modal{width:min(540px,calc(100% - 32px))}#account-modal form{display:grid;gap:10px}#account-modal label{display:block}#account-modal input:not([type=checkbox]){width:100%;min-width:0}.account-password{display:flex;gap:6px;align-items:center}.account-password input{flex:1}.account-password button{flex:none;min-width:44px;min-height:44px}.account-identity{color:var(--cyan);font-weight:600}#account-tabs button[aria-pressed=true]{border-color:var(--cyan);color:var(--cyan)}#account-code{font-family:monospace;font-size:.95rem;margin-bottom:12px}#account-form-help:empty,#account-error:empty,#account-code-status:empty{display:none}#account-guest{margin-top:14px}

body.account-entry>header,body.account-entry>main{visibility:hidden;pointer-events:none}body.account-entry{min-height:100dvh}body.account-entry #account-modal{border:0;box-shadow:none;width:min(540px,calc(100% - 32px));max-height:calc(100dvh - 32px)}body.account-entry #account-modal::backdrop{background:var(--bg,#0e1420)}.account-entry-language,.online-sync-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:12px}.online-sync-row:has(span[hidden]){display:none}.online-sync-row span{color:var(--muted);font-size:.8rem}

/* Online-only app installation, using the same theme as Settings. */
.install-settings{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.feedback-contact{margin:20px 0;padding-top:16px;border-top:1px solid var(--line)}
.feedback-contact p{color:var(--muted);font-size:.85rem;line-height:1.5}
.feedback-contact a{color:var(--cyan);overflow-wrap:anywhere;text-decoration:underline;user-select:text}
#install-modal{width:min(540px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto}
.install-brand{display:flex;align-items:center;gap:16px}.install-brand img{flex:none;border-radius:16px}.install-brand h2{margin:0}
#install-status:empty{display:none}
/* Local generation feedback and post-result solution exploration. */
#generating-overlay{max-width:min(90vw,26rem);text-align:center;padding:2rem;pointer-events:auto}
#generating-overlay::backdrop{background:rgba(8,14,25,.82);backdrop-filter:blur(3px)}
.generation-spinner{display:block;width:2rem;height:2rem;margin:0 auto 1rem;border:3px solid #47617b;border-top-color:#86dde8;border-radius:50%;animation:proof-of-light-spin 1s linear infinite}
@keyframes proof-of-light-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.generation-spinner{animation:none;border-style:dotted}}
.solutions-dialog{width:min(92vw,760px);max-height:90dvh;overflow:auto}
.solution-count-row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.solution-counts{font-weight:600}.solution-note{font-size:.9rem}.solution-progress{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap;margin-bottom:1rem}.solution-choices,.solution-buttons{display:flex;gap:.75rem;flex-wrap:wrap;margin:1rem 0}.solution-choices label{display:flex;gap:.5rem;align-items:center}
.solution-preview{display:grid;grid-template-columns:repeat(var(--solution-size),minmax(0,1fr));grid-template-rows:repeat(var(--solution-size),minmax(0,1fr));position:relative;max-width:560px;aspect-ratio:1;margin:auto;gap:0;border:1px solid #607085;background:#1c293d}
.solution-cell{display:flex;justify-content:center;align-items:center;min-width:0;min-height:0;border:1px solid #42516a;font-size:clamp(.8rem,4vw,2rem);overflow:hidden;background:#28374d}
.solution-cell svg{width:90%;height:90%}.solution-light{position:absolute;width:100%;height:100%;inset:0;pointer-events:none}.solution-light line{stroke:#ffdc72;stroke-width:.045;stroke-linecap:round;filter:drop-shadow(0 0 .04px #ffdb75)}
.solution-preview[hidden],.solution-choices[hidden]{display:none}

.solution-cell[data-bulb]{filter:saturate(.2);opacity:.55}.solution-cell.solution-lit{filter:none;opacity:1;background:#575334}

/* Settings categories keep phone layouts compact without hiding help or previews. */
.settings-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;position:sticky;top:0;z-index:3;background:var(--panel);padding:12px 0;border-bottom:1px solid var(--line);margin:8px 0 4px}
.settings-tabs button{min-width:0;min-height:44px;padding:9px 4px;font-size:.82rem;overflow-wrap:anywhere}
.settings-tabs button[aria-selected="true"]{color:var(--cyan);border-color:var(--cyan);background:var(--bg);font-weight:700}
.settings-tab-panel{padding-top:2px}
.settings-tab-panel:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
#settings-privacy-links:empty{display:none}
#settings-privacy-links{margin:18px 0}

/* Local fantasy costume: optical clocks, path geometry and hit states are unchanged. */
.theme-legend{font-size:.8rem;line-height:1.6;color:var(--muted)}
.theme-preview{display:flex;flex-wrap:wrap;gap:8px}.theme-preview>span{width:42px;height:42px;background:#222538;border-radius:8px;padding:3px}
.fantasy-fireball,.fantasy-defeated-mark{display:none}
.fantasy-theme #board,.fantasy-theme #tutorial-demo{--beam-color:#ff923d}
.fantasy-theme .beams .beam-line,.fantasy-theme .demo-beams .beam-line{stroke:#ff9d42;stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 0 3px #ff683a)}
.fantasy-theme .laser-pulse circle{fill:#fff0a8;stroke:#ff883d;stroke-width:3;filter:drop-shadow(0 0 3px #ff6f32)}
.fantasy-theme .laser-pulse .fantasy-fireball{display:inline}
.fantasy-theme .laser-pulse circle[data-pulse-dot]:not(.fantasy-fireball){r:6px}
.fantasy-theme .photons .photon-rim{stroke:#c34f28;stroke-width:12}.fantasy-theme .photons .photon-core{stroke:#ffe09a;stroke-width:8}
.fantasy-theme .pulse-trail{stroke-width:5}
.fantasy-theme .cell.source,.fantasy-theme .cell.has-piece{background:#343049}
.fantasy-theme .cell.target:not(.lit) .fantasy-art{filter:none;opacity:1}
.fantasy-theme .cell.target.lit .fantasy-art{opacity:.5;filter:grayscale(.7)}
.fantasy-theme .cell.target.lit .fantasy-defeated-mark{display:inline}
.fantasy-theme .cell.bomb.hit{background:#723d42;box-shadow:inset 0 0 0 2px #ff9f7e}
.fantasy-theme .cell.socket:not(.has-piece){background:#30334a;border-color:#887299}
.fantasy-theme .cell.socket:not(.has-piece)::after{border-color:#b19acc}
.fantasy-theme .portal-rim{filter:drop-shadow(0 0 2px #c296ed)}
.fantasy-theme.light-theme .cell.source,.fantasy-theme.light-theme .cell.has-piece,.fantasy-theme.light-theme .cell.socket:not(.has-piece){background:#485368}
@media(prefers-reduced-motion:reduce){.fantasy-theme .laser-pulse circle,.fantasy-theme .beams .beam-line,.fantasy-theme .demo-beams .beam-line{filter:none}}

.fantasy-theme #tutorial-demo .fantasy-demo-monster{opacity:1}.fantasy-theme #tutorial-demo .fantasy-demo-monster.demo-lit{opacity:.5;filter:grayscale(.7)}.fantasy-theme .fantasy-demo-monster.demo-lit .fantasy-defeated-mark{display:inline}

/* Fire appears at fixed points in sequence; stamps never translate along the path. */
.flame-stamp{pointer-events:none}.flame-stamp,.steady-flame{filter:drop-shadow(0 0 2px #ff793a80)}
.steady-flame{animation:fantasy-flame-breathe 1.1s ease-in-out infinite;transform-origin:0 0}
.shot-paused .steady-flame{animation-play-state:paused}
@keyframes fantasy-flame-breathe{0%,100%{opacity:.25;transform:scale(.5)}50%{opacity:1;transform:scale(1.0625)}}
@media(prefers-reduced-motion:reduce){.steady-flame{animation:none}.flame-stamp,.steady-flame{filter:none}}

/* Solution previews share the board's themed fixed objects and hit states. */
.fantasy-theme .solution-cell[data-bulb]{filter:none;opacity:1}
.fantasy-theme .solution-cell.solution-lit[data-bulb] svg{opacity:.5;filter:grayscale(.7)}
.fantasy-theme .solution-cell.solution-lit .fantasy-defeated-mark{display:inline}
.fantasy-theme .solution-light line{stroke:#ffad61;filter:drop-shadow(0 0 .04px #ff793a)}

.daily-new-badge{font-size:.6rem;line-height:1;font-weight:800;color:#a5f1bb;border:1px solid #83eeac70;border-radius:4px;padding:3px 4px;white-space:nowrap}
.light-theme .daily-new-badge{color:#23613f;border-color:#43855c;background:#e1f4e7}

.theme-preview .bulb-icon,.theme-preview .bomb-icon{font-size:26px}

.scoring-table-wrap{overflow-x:auto;margin-block:12px}.scoring-table{width:100%;border-collapse:collapse;font-size:.82rem;color:var(--ink)}.scoring-table th,.scoring-table td{padding:8px;text-align:left;border-bottom:1px solid var(--line)}.scoring-table thead{color:var(--muted)}

.time-budget{margin:0 0 12px}.time-budget-track{height:6px;background:var(--line);border-radius:999px;overflow:hidden}.time-budget-fill{height:100%;background:#83eeac;border-radius:inherit}.time-budget-low .time-budget-fill{background:#eab55d}.light-theme .time-budget-fill{background:#387952}.light-theme .time-budget-low .time-budget-fill{background:#986322}.time-budget p{margin:0;font-size:.76rem}#favorite-puzzle[aria-pressed=true]{color:var(--gold)}#favorites-status:empty{display:none}

.arena{position:relative}.arena .heading{padding-right:40px}.puzzle-close{position:absolute;top:8px;right:8px;width:36px;height:36px;padding:0;display:grid;place-items:center;font-size:1.6rem;line-height:1;z-index:4}.puzzle-favorite{flex:0 0 36px;width:36px;height:36px;padding:0;font-size:1.4rem;line-height:1}.puzzle-screen-actions>#show-solution{flex:0 1 auto;min-width:0;white-space:normal;text-align:center}
@media(max-width:800px),(pointer:coarse){.puzzle-close,.puzzle-favorite{width:44px;height:44px}.puzzle-favorite{flex-basis:44px}.arena .heading{padding-right:44px}}

/* Visual object guides and device-local Fantasy introduction. */
.object-guide-button{font-size:.8rem;padding:6px 9px}
#tutorial-demo .demo-hazard-ring{opacity:0}#tutorial-demo .demo-hazard.demo-hit .demo-hazard-ring{opacity:1}
.fantasy-theme .cell.target,.fantasy-theme .cell.bomb:not(.hit){background:transparent}
.fantasy-intro-pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-items:center;gap:8px;margin:20px 0}
.fantasy-intro-pair strong{grid-column:1/-1;text-align:center;font-size:.95rem}
.fantasy-original{font-size:3rem}.fantasy-new{width:86px;height:86px}.fantasy-new svg{width:100%;height:100%}
dialog h2{cursor:grab;touch-action:none}dialog.dialog-dragging h2{cursor:grabbing;user-select:none}

.fantasy-original{display:flex;flex-direction:column;align-items:center}.fantasy-original small{font-size:.8rem;color:var(--muted)}

.objects-guide-icons{display:flex;align-items:center;gap:4px}.objects-guide-icons>span{display:grid;place-items:center;width:32px;height:32px;font-size:1.5rem}.objects-guide-icons svg{width:32px;height:32px}
.tutorial-links button.objects-guide-link{width:104px;flex:0 0 104px}
.tutorial-links .objects-guide-icons>span,.tutorial-links .objects-guide-icons svg{width:24px;height:24px}
.objects-guide-icons .bulb-icon,.objects-guide-icons .bomb-icon{font-size:24px}

/* Planning arrows are translucent dashed notes, visually separate from simulated beams. */
.planning-arrows{position:absolute;inset:0;width:100%;height:100%;z-index:12;pointer-events:none;overflow:visible;color:#ffc35b}
.planning-arrows line{stroke:currentColor;stroke-width:11;stroke-opacity:.55;stroke-dasharray:16 9;stroke-linecap:round}
.planning-arrows polygon{fill:currentColor;fill-opacity:.75}.planning-arrow-start{stroke:currentColor;stroke-width:5;fill:none}
.planning-arrow-preview{opacity:.7}.drawing-arrows .cell{cursor:crosshair}
#draw-arrow[aria-pressed=true]{background:#654b25;border-color:#ffc35b}.light-theme #draw-arrow[aria-pressed=true]{background:#f2d8a6;color:#573e17}

.editor-seed-row{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:14px 0}.editor-seed-row label{flex:1;min-width:180px}.editor-seed-row input{width:100%}.editor-advanced{margin:18px 0}.editor-advanced textarea{width:100%}

.editor-code{width:100%;font-family:monospace;margin:8px 0}
#editor-tools button{touch-action:none}

.editor-name{display:block;margin:12px 0}.editor-name input{display:block;width:100%;margin-top:6px}

/* Puzzle utilities stay together above the piece inventory in either dock position. */
.arena .heading{padding-right:0}
#puzzle-sidebar #puzzle-screen-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:12px;margin:0 0 12px}
#puzzle-screen-actions>button,#puzzle-screen-actions #puzzle-settings,#puzzle-screen-actions #share-puzzle,#puzzle-screen-actions #show-solution{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;height:auto;min-height:40px;min-width:0;padding:8px 6px;font-size:.8rem;line-height:1.3;white-space:normal;text-align:center}
#puzzle-screen-actions>.puzzle-share-result,#puzzle-screen-actions>#puzzle-action-status{grid-column:1/-1;text-align:left;min-width:0;margin:0}
body.touch-play #puzzle-sidebar #puzzle-screen-actions{padding:0 0 8px;margin:0 0 8px;border:0;border-bottom:1px solid var(--line);background:transparent;box-shadow:none}
body.touch-play #puzzle-screen-actions>button{min-height:44px}
@media(max-width:420px){#puzzle-screen-actions>button{font-size:.75rem}}

.beam-appearance{border:1px solid var(--line);border-radius:10px;margin:16px 0;padding:12px}.beam-appearance legend{font-size:.9rem;font-weight:600;padding:0 5px}.beam-appearance label{display:flex;align-items:center;gap:8px;margin:8px 0}

.support-options{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0}.support-options a{display:inline-flex;align-items:center;gap:5px;padding:9px 12px;border:1px solid var(--line);border-radius:8px}.support-options button{font-size:.85rem}

#pix-support-modal{width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto}#pix-support-modal>p{font-size:.9rem;line-height:1.5}.pix-support-qr{display:block;width:min(256px,100%);height:auto;margin:18px auto;background:white;border-radius:0}#pix-code{width:100%;font-family:monospace;font-size:.75rem;overflow-wrap:anywhere;resize:vertical}

/* Named guide cards make all piece guides discoverable in Rules. */
#tutorial-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}
#tutorial-links>button,#tutorial-links>button.objects-guide-link{display:flex;align-items:center;justify-content:flex-start;gap:10px;width:auto;height:auto;min-width:0;min-height:68px;padding:10px;text-align:left;flex:auto}
#tutorial-links .guide-button-icon{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;font-size:1.6rem}
#tutorial-links .guide-button-icon svg{width:40px;height:40px}
#tutorial-links .guide-button-name{font-size:.85rem;line-height:1.35;color:var(--ink);overflow-wrap:anywhere}
#tutorial-links .objects-guide-link .guide-button-icon{flex-basis:80px;width:80px}
#tutorial-links .objects-guide-icons{gap:2px}#tutorial-links .objects-guide-icons>span,#tutorial-links .objects-guide-icons svg{width:24px;height:24px}
@media(max-width:420px){#tutorial-links{grid-template-columns:1fr}}

/* Campaign chapter disclosures and compact difficulty values. */
.journey-route{margin-left:0}
.journey-act>summary{display:list-item;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted);line-height:1.5}
.journey-act[open]>summary{margin-bottom:14px}
.journey-act>summary:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;border-radius:4px}
.journey-cleared-tag{display:inline-block;margin-left:10px;padding:1px 7px;border:1px solid currentColor;border-radius:12px;color:#83eeac;font-size:.7rem;vertical-align:middle}
.light-theme .journey-cleared-tag{color:var(--light-success)}

/* Modal dismissal lives beside the title, outside bottom action rows. */
dialog .modal-titlebar{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px;position:sticky;top:-28px;z-index:5;background:var(--panel);padding:8px 0}
dialog .modal-titlebar h2{flex:1;min-width:0;margin:0}
dialog .modal-close-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;min-width:36px;min-height:36px;max-width:36px;max-height:36px;box-sizing:border-box;margin:0;padding:0;border-radius:8px;background:transparent;color:var(--ink);font-size:1.6rem;line-height:1}
dialog .modal-close-icon[hidden]{display:none}
@media(max-width:650px){dialog .modal-titlebar{top:-18px}}

/* Secondary solved-board actions do not crowd the navigation row. */
#success #modal-favorite{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;min-width:36px;padding:0;background:transparent;color:var(--gold);font-size:1.5rem;line-height:1}
#success #modal-favorite[hidden]{display:none}
#success-solution-actions:has(>button:not([hidden])){margin:8px 0 16px}
#success-solution-actions .solution-count-button{background:transparent;border:0;padding:4px 0;min-height:36px;color:var(--cyan);text-align:left;text-decoration:none;font-size:.85rem}
#success .editor-controls>#modal-next:not([hidden]),#success .editor-controls>#modal-endless:not([hidden]){margin-left:auto}

/* External community/support links share the Settings button appearance. */
.feedback-contact :is(#settings-kofi,#settings-discord){display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:10px;border:1px solid var(--line);border-radius:7px;background:#111c2b;color:var(--ink);font:inherit;font-size:.85rem;line-height:1.4;text-decoration:none;user-select:auto}
.feedback-contact :is(#settings-kofi,#settings-discord):hover{border-color:var(--cyan)}
.feedback-contact :is(#settings-kofi,#settings-discord):focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.light-theme .feedback-contact :is(#settings-kofi,#settings-discord){background:var(--panel)}

/* Match the solved-modal star and close button at every breakpoint. */
#success #modal-favorite,#success .modal-close-icon{flex:0 0 36px;width:36px;height:36px;min-width:36px;min-height:36px;max-width:36px;max-height:36px;padding:0;margin:0;box-sizing:border-box}


/* Compact puzzle utilities remain one row on narrow/touch screens. */
@media(max-width:800px),(pointer:coarse){
 #puzzle-sidebar #puzzle-screen-actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 #puzzle-screen-actions>button{min-height:44px;font-size:1.15rem}
 #puzzle-screen-actions>button>[data-text]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
 #puzzle-screen-actions>button>[aria-hidden]{font-size:1.15rem;line-height:1}
}

.offline-notice{position:fixed;top:10px;right:10px;z-index:90;max-width:min(360px,calc(100vw - 20px));padding:12px 14px;border:1px solid var(--gold);border-radius:10px;background:var(--panel);color:var(--gold);box-shadow:0 3px 14px #0004;font-size:.8rem}
.offline-notice[hidden]{display:none}.offline-notice p{font-size:.78rem;margin:6px 0;line-height:1.4}.offline-notice>div{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.offline-notice button{padding:6px 8px;font-size:.75rem}

.settings-legal-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:20px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font-size:.8rem}
.settings-legal-links>a,.settings-legal-links>button{color:var(--muted);background:transparent;border:0;border-radius:4px;padding:4px 0;font:inherit;text-decoration:none;line-height:1.4}
.settings-legal-links>a:hover,.settings-legal-links>button:hover{color:var(--cyan);text-decoration:underline}
.settings-legal-links>a:focus-visible,.settings-legal-links>button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* Radio circles stay compact; their labels provide the touch target. */
#settings-modal .beam-appearance input[type=radio]{flex:0 0 18px;width:18px;height:18px;min-width:18px;max-width:18px;min-height:18px;max-height:18px;padding:0;margin:0;accent-color:var(--cyan)}
#settings-modal .beam-appearance label{min-height:44px;cursor:pointer}

#settings-modal .beam-appearance label>[data-text]{flex:1;min-width:0}
#settings-modal .beam-option-preview{position:static;inset:auto;flex:0 1 140px;width:140px;min-width:70px;height:36px;max-width:40%;overflow:hidden;pointer-events:none;--beam-color:var(--gold)}
.beam-option-preview .preview-guide{stroke:var(--line);stroke-width:2}
@media(max-width:360px){#settings-modal .beam-option-preview{flex-basis:100px}}

.account-action-group{margin:12px 0;border:1px solid var(--line);border-radius:9px;padding:10px 12px}
.account-action-group>summary{cursor:pointer;color:var(--ink);font-size:.9rem;line-height:1.5}
.account-action-group>summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.account-action-list{display:grid;gap:8px;margin-top:12px}.account-action-list>button{text-align:left;width:100%}
.account-session-actions{display:flex;justify-content:flex-end;margin-top:16px}

/* Connection notices occupy layout space rather than covering game controls. */
.offline-notice{position:static;max-width:none;width:min(1140px,calc(100% - 28px));margin:12px auto;z-index:auto}
#puzzle-sidebar>.offline-notice{width:100%;margin:0 0 10px}

/* Modern wave prototype: displacement is at most 6% of a cell, tapering to
   the exact optical centerline at each segment endpoint. */
.wave-beam{fill:none;stroke:#57ed98;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 1px #3dde7d70)}
.modern-theme #board,.modern-theme .demo-beams,.modern-theme .beam-option-preview{--beam-color:#57ed98}
.modern-theme .pulse-trail{fill:none}
.light-theme .wave-beam{stroke:#168449;filter:none}
@media(prefers-reduced-motion:reduce){.wave-beam{filter:none}}
.modern-theme [data-trail-gradient] stop{stop-color:#57ed98}
.light-theme.modern-theme [data-trail-gradient] stop{stop-color:#168449}

/* Modern targets retain the same optics; charge state is purely visual. */
.energy-cell-art{pointer-events:none}
.cell .energy-cell-art{width:82%;height:82%;z-index:2}
.editor-palette .energy-cell-art{width:32px;height:32px}
 .energy-cell-bar{fill:#ff6579;opacity:0}.energy-cell-bar.charge-1{opacity:1}
.lit .energy-cell-bar,.solution-lit .energy-cell-bar,.demo-lit .energy-cell-bar{fill:#42e990;opacity:1}
.cell.lit .energy-cell-bar,.demo-lit .energy-cell-bar{animation:cell-charge-color .48s linear both}
.cell.lit .charge-2,.demo-lit .charge-2{animation:cell-charge-color .48s linear both,cell-charge-two .48s steps(1,end) both}
.cell.lit .charge-3,.demo-lit .charge-3{animation:cell-charge-color .48s linear both,cell-charge-three .48s steps(1,end) both}
.cell.lit .charge-4,.demo-lit .charge-4{animation:cell-charge-color .48s linear both,cell-charge-four .48s steps(1,end) both}
@keyframes cell-charge-color{0%,24%{fill:#ff6579}25%,74%{fill:#ffd164}75%,100%{fill:#42e990}}
@keyframes cell-charge-two{0%{opacity:0}25%,100%{opacity:1}}
@keyframes cell-charge-three{0%{opacity:0}50%,100%{opacity:1}}
@keyframes cell-charge-four{0%{opacity:0}75%,100%{opacity:1}}
@media(prefers-reduced-motion:reduce){.cell.lit .energy-cell-bar,.demo-lit .energy-cell-bar{animation:none}}
.modern-theme .solution-cell.solution-lit{background:#193c32}
.modern-theme #tutorial-demo .demo-bulb.demo-lit{filter:drop-shadow(0 0 5px #42e99060)}
.modern-theme .photons .photon-rim{stroke:#17603e;stroke-width:9}
.modern-theme .photons .photon-core{stroke:#9affc3;stroke-width:5;filter:drop-shadow(0 0 3px #42e99090)}
.modern-theme .laser-pulse circle[data-pulse-dot]{fill:#9affc3;stroke:#289d63;stroke-width:1.2;filter:drop-shadow(0 0 3px #42e99090)}
@media(prefers-reduced-motion:reduce){.modern-theme .photons .photon-core,.modern-theme .laser-pulse circle[data-pulse-dot]{filter:none}}

.modern-reactor{pointer-events:none}.cell .modern-reactor{width:82%;height:82%;z-index:2}
.reactor-rupture{display:none}.hit .reactor-intact,.demo-hit .reactor-intact{display:none}.hit .reactor-rupture,.demo-hit .reactor-rupture{display:inline}

#modern-intro-modal{max-width:560px}.fantasy-original svg{width:48px;height:48px}

/* Comparison-only sizing; puzzle and Rules emitter sizing stays unchanged. */
.fantasy-intro-pair .fantasy-original.intro-source svg{width:76px;height:76px}
.fantasy-intro-pair .fantasy-new.intro-source svg{transform:scale(1.16)}

.modern-theme .beams .beam-line,.modern-theme .demo-beams .beam-line{stroke:#57ed98;filter:drop-shadow(0 0 2px #42e99060)}
.modern-theme .laser-pulse .fantasy-fireball{display:none}

.custom-appearance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.custom-appearance-grid label{display:flex;flex-direction:column;gap:4px;font-size:.82rem;min-width:0}
.custom-appearance-grid select{width:100%;min-width:0}
#custom-appearance{margin-block:14px}
/* Mixed icon sets carry their own state styling. */
.cell.target.lit .fantasy-art,.solution-lit .fantasy-art{opacity:.5;filter:grayscale(.7)}
.cell.target.lit .fantasy-defeated-mark,.solution-lit .fantasy-defeated-mark,.demo-lit .fantasy-defeated-mark{display:inline}
.cell.target:not(.lit) .fantasy-art{opacity:1}
.custom-flame .laser-pulse circle{fill:#fff0a8;stroke:#ff883d;stroke-width:3}
.custom-flame .laser-pulse .fantasy-fireball{display:inline}
/* A single full-height background; artwork stays behind opaque game panels. */
html{min-height:100%}
body{min-height:100dvh;position:relative;isolation:isolate;background-repeat:no-repeat;background-size:100% 100%}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url('proof-of-light-background.svg?v=1') center top/1400px 1000px repeat;opacity:.16}
.light-theme body::before{opacity:.25}
.minimum-challenge{margin-block:12px;padding:12px;border:1px solid var(--line);border-radius:9px;background:#23352e}.minimum-challenge p{margin:0 0 8px}

/* Shared date/reset line and equally sized Daily cards. */
.daily-schedule{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 16px;margin-top:18px;font-size:.8rem}
.daily-schedule[hidden]{display:none}
.daily-schedule+.daily-card{margin-top:8px}
#daily-bonus{margin-top:10px}
#daily-bonus[hidden]{display:none}
#daily-bonus-status{color:#83eeac}


.custom-beam-choice{display:flex;align-items:center;justify-content:space-between;gap:12px}
#customize-theme{margin:8px 0 16px}
#settings-tab-custom[hidden]{display:none}
/* Double Exposure uses one interactive board and lightweight navigable previews. */
#double-modal{width:min(1000px,calc(100% - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:20px;overflow:auto;box-sizing:border-box}
.dx-header{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:-20px;background:var(--panel);z-index:2;padding:12px 0}
.dx-header h2{margin:0;font-size:clamp(1.1rem,4vw,1.6rem)}
.dx-header button{flex:none}.dx-pair-picker{display:flex;align-items:center;gap:12px;margin:12px 0}.dx-pair-picker select{flex:1;min-width:0}
.dx-boards{display:flex;justify-content:center;align-items:flex-start;gap:18px;margin:20px auto}
.dx-preview{display:flex;flex-direction:column;gap:8px;align-items:center;min-width:0;padding:10px;box-sizing:border-box}
.dx-overview .dx-preview{width:clamp(110px,28vw,240px)}
.dx-focused .dx-preview{width:100px;flex:none;font-size:.8rem;position:sticky;top:70px}
.dx-main{width:min(100%,560px);min-width:0}.dx-main h3{margin:0 0 8px;display:flex;gap:12px;align-items:center}
.dx-board{--beam-color:var(--gold);position:relative;width:100%;aspect-ratio:1;background:#101c2a;border:1px solid #53657b;border-radius:6px;overflow:hidden;color:var(--ink)}
.dx-grid{display:grid;grid-template-columns:repeat(var(--dx-size),1fr);height:100%}
.dx-cell{position:relative;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 .5px #53657b55;aspect-ratio:1}
.dx-cell>svg,.dx-cell>span{width:80%;height:80%;display:flex;align-items:center;justify-content:center;font-size:clamp(16px,6vw,38px)}
.dx-cell>svg.wall-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.dx-preview .dx-cell>span{font-size:clamp(10px,3vw,22px)}
.dx-focused .dx-preview .dx-cell>span{font-size:11px}
.dx-socket:before{content:'';position:absolute;width:52%;height:52%;border:1px dashed #8198aa88;border-radius:50%;pointer-events:none}
.dx-piece:before{display:none}.dx-cell.lit{background:#d5aa2838}.dx-cell.hit{background:#df465a55}.dx-picked{outline:2px solid var(--cyan);outline-offset:-3px}
.dx-board>.beams{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.dx-inventory{border-top:1px solid #53657b88;padding-top:12px}.dx-inventory h3{margin:0 0 8px}
.dx-tools,.dx-actions{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.dx-tools button{display:flex;gap:8px;align-items:center}.dx-tools svg{width:40px;height:40px}.dx-tools button[aria-pressed=true]{border-color:var(--cyan);background:#305963}
.dx-actions button{font-size:.9rem}.dx-actions #dx-fire{margin-left:auto;background:#305963;border-color:var(--cyan)}
#dx-status{min-height:1.5em;color:var(--gold)}
#double-focused-board .dx-socket,#dx-tools button{touch-action:none;cursor:pointer}
.light-theme .dx-board{background:#c6d8e0}
@media(max-width:560px){#double-modal{padding:12px;width:calc(100% - 12px);max-height:calc(100dvh - 12px)}.dx-header{top:-12px}.dx-boards{gap:8px}.dx-focused{flex-wrap:wrap}.dx-focused .dx-main{width:100%}.dx-focused .dx-preview{position:static;width:80px;margin-left:auto}.dx-header button{padding:8px}.dx-pair-picker>span{display:none}.dx-actions button{padding:8px;font-size:.8rem}}

.dx-actions[hidden],.dx-tools[hidden]{display:none}
.dx-generation{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin:12px 0}.dx-generation label{min-width:140px}

.dx-stereo{display:flex;align-items:center;gap:8px;margin:12px 0}.dx-stereo input{width:16px;height:16px;margin:0;flex:none;accent-color:var(--cyan)}

#dx-history{margin:12px 0}#dx-history-list{max-height:280px;overflow:auto}.dx-history-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:.8rem}.dx-history-row button{flex:none}

/* Double Exposure actors react at their own beam-arrival times, in both board views. */
.dx-cell.target .bulb-icon{opacity:.45;filter:grayscale(1)}
.dx-cell.target.lit .bulb-icon{opacity:1;filter:drop-shadow(0 0 8px #ffce73)}
.light-theme .dx-cell.target .bulb-icon{opacity:.8;filter:grayscale(1) brightness(.65)}
.light-theme .dx-cell.target.lit .bulb-icon{opacity:1;filter:drop-shadow(0 0 4px #b36307)}
.dx-cell.target.lit .fantasy-art{opacity:.5;filter:grayscale(.7)}
.dx-cell.target.lit .fantasy-defeated-mark{display:inline}
.dx-cell.dx-arrived .energy-cell-bar{animation:cell-charge-color .48s linear both}
.dx-cell.dx-arrived .charge-2{animation:cell-charge-color .48s linear both,cell-charge-two .48s steps(1,end) both}
.dx-cell.dx-arrived .charge-3{animation:cell-charge-color .48s linear both,cell-charge-three .48s steps(1,end) both}
.dx-cell.dx-arrived .charge-4{animation:cell-charge-color .48s linear both,cell-charge-four .48s steps(1,end) both}
@media(prefers-reduced-motion:reduce){.dx-cell.dx-arrived .energy-cell-bar{animation:none}}

/* Compact range controls keep a generous invisible hit area. */
#settings-modal :is(#gameplay-speed,#board-size){appearance:none;-webkit-appearance:none;width:150px;max-width:48%;min-width:70px;height:28px;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;cursor:pointer;accent-color:var(--cyan)}
:is(#gameplay-speed,#board-size)::-webkit-slider-runnable-track{height:6px;border:0;border-radius:3px;background:linear-gradient(to right,var(--cyan) 0 var(--beam-progress,43%),var(--line) var(--beam-progress,43%) 100%)}
:is(#gameplay-speed,#board-size)::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;margin-top:-3px;border:0;border-radius:50%;background:var(--cyan);box-shadow:none}
:is(#gameplay-speed,#board-size)::-moz-range-track{height:6px;border:0;border-radius:3px;background:var(--line)}
:is(#gameplay-speed,#board-size)::-moz-range-progress{height:6px;border-radius:3px;background:var(--cyan)}
:is(#gameplay-speed,#board-size)::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--cyan);box-shadow:none}
:is(#gameplay-speed,#board-size):focus-visible{outline:2px solid var(--cyan);outline-offset:3px}:is(#gameplay-speed,#board-size):disabled{opacity:.4;cursor:default}
:is(#gameplay-speed-value,#board-size-value,#sound-volume-value,#music-volume-value){min-width:4ch;text-align:right;font-variant-numeric:tabular-nums}

#tutorial-demo.animated-examples.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#tutorial-demo.guide-grid .tutorial-example{width:100%;max-width:none}
#tutorial-links .objects-guide-icons{display:grid;grid-template-columns:repeat(2,24px);gap:2px}
#tutorial-links .objects-guide-link .guide-button-icon{flex-basis:50px;width:50px}

/* Filled sockets keep their cell shading, without a second outline behind the piece. */
.cell.socket.has-piece::after,.dx-socket.dx-piece::before{display:none}
.settings-tabs{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
#settings-modal .sound-effects-row{display:flex;align-items:center;gap:12px;margin:22px 0}
#settings-modal .sound-effects-row>label{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1;min-width:0}
#settings-modal .sound-effects-row .sound-preview{margin:0;padding:7px 10px;font-size:.8rem;white-space:nowrap}
#settings-modal #support-info{vertical-align:middle}

/* Themes stay compact; customization is a separate dialog above Settings. */
#icon-style-preview.theme-preview{flex-wrap:nowrap;gap:clamp(2px,1vw,8px);padding:10px;overflow:hidden}
#icon-style-preview.theme-preview>span{flex:1 1 0;width:auto;min-width:0;max-width:42px;height:auto;aspect-ratio:1;padding:2px}
#icon-style-preview.theme-preview .bulb-icon,#icon-style-preview.theme-preview .bomb-icon{font-size:clamp(16px,4vw,26px)}
#custom-theme-modal{width:min(540px,calc(100% - 24px))}
.custom-piece-row{display:grid;grid-template-columns:minmax(100px,1fr) auto;align-items:center;gap:12px;border:0;border-bottom:1px solid var(--line);padding:9px 0;margin:0}
.custom-piece-row legend{float:left;width:auto;padding:0;font-size:.85rem;color:var(--muted)}
.custom-piece-choices{display:flex;gap:8px}
.custom-piece-choices label{position:relative;display:grid;place-items:center;width:52px;height:52px;padding:5px;border:1px solid var(--line);border-radius:8px;cursor:pointer;background:var(--bg)}
.custom-piece-choices input{position:absolute;opacity:0;width:1px;height:1px;padding:0;margin:0}
.custom-piece-choices label:has(input:checked){border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan)}
.custom-piece-choices label:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:3px}
.custom-piece-choices span,.custom-piece-choices svg{display:grid;place-items:center;width:40px;height:40px;font-size:26px}
.custom-beam-picker{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px}
#custom-beam{width:min(65%,240px)}#beam-preview-custom-editor{display:block;width:100%;height:70px;margin-top:12px}
@media(max-width:390px){.custom-piece-choices{gap:4px}.custom-piece-choices label{width:44px;height:44px}.custom-piece-choices span,.custom-piece-choices svg{width:34px;height:34px}.custom-piece-row{grid-template-columns:minmax(80px,1fr) auto;gap:6px}}
#custom-theme-modal #beam-preview-custom-editor{position:static;inset:auto;max-width:none;overflow:hidden;pointer-events:none;--beam-color:var(--gold)}
.modern-theme #custom-theme-modal #beam-preview-custom-editor{--beam-color:#57ed98}

.custom-flame #board,.custom-flame .demo-beams,.custom-flame .beam-option-preview{--beam-color:#ff9d42}
.custom-flame .beams .beam-line,.custom-flame .demo-beams .beam-line{stroke:#ff9d42;stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 0 3px #ff683a)}
.custom-flame .pulse-trail{stroke-width:5}

.routed-fork [data-fork-arc]{opacity:.22}

.fork-curve{fill:none;stroke:var(--beam-color,var(--gold));stroke-width:3;stroke-linecap:butt}.fork-curve-dot{fill:var(--beam-color,var(--gold));stroke:none}

.cell svg.routed-fork,.dx-cell>svg.routed-fork{width:100%;height:100%}
/* The tabs already separate the first About section. */
#settings-panel-about>.feedback-contact:first-child{margin-top:0;padding-top:8px;border-top:0}
#settings-panel-about>.feedback-contact:first-child>h3{margin-top:8px}
/* Settings grows downward as tabs change, keeping its header in one place. */
#settings-modal{--settings-top:clamp(16px,7dvh,64px);position:fixed;top:var(--settings-top);bottom:auto;left:0;right:0;margin:0 auto;max-height:calc(100dvh - var(--settings-top) - 16px);overflow:auto}

.release-archive{margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
.release-archive>summary{font-size:.9rem}.release-archive>.release-notes{margin-left:8px}

/* Weekly Double Exposure: compact schedule and spoiler-conscious community invitation. */
.dx-weekly-heading{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:16px 0}
.dx-weekly-heading h3{flex:1 1 260px;margin:0}
#dx-archive{margin:12px 0;padding:12px;border:1px solid var(--border,#334155);border-radius:10px}
#dx-archive summary{cursor:pointer;color:var(--accent,#78dfe2)}
#dx-archive-list{margin-top:12px}
#dx-discuss{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:.9em;color:var(--muted,#aebace)}
#dx-discord{display:inline-block;border:1px solid #475569;border-radius:8px;padding:8px 12px;text-decoration:none;white-space:nowrap}
#dx-spoilers{flex:1 1 360px}

/* Double Exposure uses normal setup/gameplay screens, not a dialog overlay. */
body.double-selected #mode-panel>:not(#mode-controls):not(#double-controls),
body.double-selected :is(#puzzle-layout,#chapter-panel,#journey-panel,#editor,#favorites-panel){display:none!important}
body.double-playing :is(#game-header,#profile-panel,#mode-panel){display:none!important}
#double-controls{margin-top:20px}
#double-screen{position:static;width:100%;max-width:1100px;max-height:none;margin:0 auto;padding:20px;overflow:visible;box-sizing:border-box}
#double-screen[hidden],#double-controls[hidden]{display:none!important}
#double-screen .dx-header{position:static;padding:0 0 12px;background:transparent}
#double-screen .dx-stereo{font-size:.85rem}
#double-success{width:min(460px,calc(100% - 32px))}
#double-success .modal-titlebar{display:flex;align-items:center;justify-content:space-between;gap:16px}
#double-success .modal-titlebar h2{order:-1;margin:0}
#double-success .editor-controls{margin-bottom:0}
@media(max-width:560px){#double-screen{padding:12px}.dx-overview .dx-preview{width:calc(50% - 4px)}#double-screen .dx-header{gap:8px}}
@media(max-width:560px){
 .dx-focused .dx-preview{order:-1;display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto auto;gap:4px 12px;width:100%;margin:0;text-align:left;justify-items:start}
 .dx-focused .dx-preview .dx-board{grid-column:1;grid-row:1 / 3;width:64px}
 .dx-focused .dx-preview>strong{grid-column:2;grid-row:1;align-self:end}
 .dx-focused .dx-preview>span{grid-column:2;grid-row:2;align-self:start}
}

.dx-preview-notice{display:block;color:var(--gold);margin:4px 0 8px}
.dx-cell[data-dx-emitter]{cursor:pointer}
.dx-actions button[hidden]{display:none}

.mode-cleared{display:inline-flex;align-items:center;justify-content:center;flex:none;color:#83eeac;font-weight:800;font-size:.9em;line-height:1}
.light-theme .mode-cleared{color:#237347}

#dx-difficulty{margin:4px 0 16px}#dx-difficulty strong{color:var(--cyan)}.dx-archive-index{display:block;margin-top:4px;opacity:.85}

/* Classic emoji actors follow their cell, including compact boards and DE previews. */
.cell.target,.cell.bomb,.dx-cell.target,.dx-cell.bomb{container-type:inline-size}
.cell .bulb-icon,.cell .bomb-icon{font-size:min(60cqw,2.1rem);line-height:1}
.dx-cell>span.bulb-icon,.dx-cell>span.bomb-icon{font-size:min(60cqw,38px);line-height:1}

/* Guest profile management stays available without filling the mobile menu. */
#guest-profile-controls{flex:1;min-width:150px}
#guest-profile-controls>summary{font-size:.85rem;padding:10px 0;min-height:44px}
.guest-profile-management{display:flex;flex-wrap:wrap;align-items:end;gap:8px;padding:8px 0}
.guest-profile-management label{flex-basis:100%}
#profile-panel.guest-profile-compact{padding:12px 16px}
.guest-profile-compact .profile-row{gap:8px;align-items:center}
.guest-profile-compact .profile-row>button{font-size:.8rem;padding:8px}
.guest-profile-compact .profile-stats{margin-top:8px;padding-top:8px;gap:6px 16px}
.guest-profile-compact .profile-points strong{font-size:1.1rem}

/* Settings labels retain their natural width on narrow phone screens. */
.settings-tabs{display:flex;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;gap:6px;padding-bottom:10px}
.settings-tabs button{flex:1 0 auto;white-space:nowrap;overflow-wrap:normal;padding-inline:12px}

/* General keeps its section boundaries when installation controls are absent. */
.dismissed-tips-setting{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
#reset-tips-status:empty{display:none}
.install-settings:has(>#install-open[hidden]){display:none}

.back-arrow-icon{display:inline-block;flex:none;width:1.25em;height:1.25em;vertical-align:middle;color:var(--cyan);stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@media(orientation:landscape) and (max-height:600px) and (min-width:560px){
 body.landscape-game{overflow:hidden;--landscape-top:max(6px,var(--activity-safe-top,env(safe-area-inset-top,0px)));--landscape-bottom:max(6px,var(--activity-safe-bottom,env(safe-area-inset-bottom,0px)));--landscape-height:calc(100dvh - var(--landscape-top) - var(--landscape-bottom))}
 body.landscape-game main{position:fixed;top:var(--landscape-top);bottom:var(--landscape-bottom);left:max(6px,var(--activity-safe-left,env(safe-area-inset-left,0px)));right:max(6px,var(--activity-safe-right,env(safe-area-inset-right,0px)));width:auto;max-width:none;margin:0;padding:0}
 body.landscape-puzzle #puzzle-layout,body.landscape-game #double-screen{display:grid;grid-template-columns:minmax(0,1fr) clamp(220px,34vw,300px);gap:10px;height:100%;margin:0;padding:0;border:0;background:transparent;max-width:none}
 body.landscape-puzzle .arena{display:grid;place-items:center;height:100%;padding:0;margin:0;border:0;min-width:0;background:transparent;overflow:hidden}
 body.landscape-puzzle #board{width:min(calc(100% * var(--board-scale,1)),calc(var(--landscape-height) * var(--board-scale,1)));margin:0;max-height:100%}
 body.landscape-puzzle #puzzle-sidebar,body.landscape-game #landscape-double-sidebar{position:static;align-self:stretch;min-height:0;max-height:none;width:auto;overflow-y:auto;overscroll-behavior:contain;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--panel);box-shadow:none}
 #landscape-puzzle-info>.heading{gap:8px;margin-bottom:8px}
 #landscape-puzzle-info h2{font-size:1rem}
 #landscape-puzzle-info .puzzle-metrics{gap:8px}
 #landscape-puzzle-info #status{font-size:.8rem;min-height:0;margin:8px 0}
 #landscape-puzzle-info #status:empty{display:none}
 body.landscape-puzzle #inventory-panel{padding:0;border:0;margin:0;background:transparent}
 body.landscape-puzzle #inventory-panel>h2{display:none}
 body.landscape-puzzle #puzzle-screen-actions{padding:0;border:0;margin:8px 0;background:transparent}
 body.landscape-game #double-screen .dx-boards{grid-column:1;grid-row:1;height:100%;width:100%;margin:0;align-items:center;gap:8px;min-width:0}
 body.landscape-game .dx-focused .dx-main{width:min(100%,var(--landscape-height));max-width:none}
 #landscape-double-sidebar{grid-column:2;grid-row:1}
 #landscape-double-sidebar .dx-header{width:100%;gap:6px;padding-bottom:8px;flex-wrap:wrap}
 #landscape-double-sidebar .dx-header h2{font-size:.95rem;flex:1;order:0}
 #landscape-double-sidebar .dx-header button{padding:8px;min-height:44px}
 #landscape-double-sidebar>h3{font-size:.9rem;margin:8px 0}
 #landscape-double-sidebar>.dx-preview{display:grid;grid-template-columns:56px minmax(0,1fr);gap:4px 8px;width:100%;margin:8px 0;text-align:left;font-size:.8rem}
 #landscape-double-sidebar>.dx-preview .dx-board{grid-column:1;grid-row:1 / 3;width:56px}
 #landscape-double-sidebar>.dx-preview>strong,#landscape-double-sidebar>.dx-preview>span{grid-column:2}
 #landscape-double-sidebar .dx-inventory{border-top:1px solid var(--line);padding-top:8px;margin-top:8px}
 #landscape-double-sidebar #dx-shared{font-size:.9rem;margin:4px 0 8px}
 body.landscape-game .dx-overview .dx-preview{width:calc(50% - 4px);padding:6px;font-size:.8rem;gap:4px}
}

/* Equal columns preserve button size even when the final mode row is incomplete. */
.mode-controls{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,140px),1fr));align-items:stretch;gap:8px}
.mode-controls>button{min-width:0;min-height:48px;padding:10px 8px;white-space:normal;overflow-wrap:break-word}
.mode-controls>button>[data-text]{min-width:0}

.sound-stereo-setting{margin-top:20px;padding-top:12px;border-top:1px solid var(--line)}
.sound-stereo-setting .dx-stereo{justify-content:space-between;flex-direction:row-reverse;font-size:.85rem}
.sound-stereo-setting .score-detail{margin-bottom:0}

/* Custom-only paired waves; explicit colors also apply to Settings previews. */
.wave-beam.helix-blue{stroke:#4db8ff;stroke-width:2.5;filter:none}
.wave-beam.helix-red{stroke:#ff647b;stroke-width:2.5;filter:none}
.double-helix #board,.double-helix .dx-board{--beam-color:#aaa5ff}
.light-theme .wave-beam.helix-blue{stroke:#0878ce}
.light-theme .wave-beam.helix-red{stroke:#cf254c}

/* Reserve only the board's fitted width; controls receive every remaining pixel. */
@media(orientation:landscape) and (max-height:600px) and (min-width:560px){
 body.landscape-puzzle #puzzle-layout,body.landscape-game #double-screen{grid-template-columns:min(calc(var(--landscape-height) * var(--landscape-board-scale,1)),calc(100% - 230px)) minmax(0,1fr)}
 body.landscape-puzzle #board{width:100%;max-height:none}
 #landscape-puzzle-info>.heading{flex-wrap:wrap;align-items:center;gap:4px 10px;margin-bottom:4px;padding:0}
 #landscape-puzzle-info>.heading>div:first-child{flex:1 1 150px;min-width:0}
 #landscape-puzzle-info .puzzle-title-row{flex-wrap:nowrap;gap:6px;min-width:0}
 #landscape-puzzle-info h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.95rem}
 #landscape-puzzle-info .chapter-caption{font-size:.7rem;margin:0}
 #landscape-puzzle-info .puzzle-metrics{flex:0 1 auto;gap:6px;flex-wrap:wrap}
 #landscape-puzzle-info .puzzle-clock{gap:6px}
 #landscape-puzzle-info .puzzle-favorite{width:36px;height:36px;flex-basis:36px;min-height:36px}
 body.landscape-puzzle #puzzle-screen-actions{justify-content:flex-start;gap:6px;margin:6px 0}
 body.landscape-puzzle #puzzle-screen-actions>button{flex:0 1 auto;padding-inline:8px}
 body.landscape-puzzle .inventory-actions{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
 body.landscape-puzzle .inventory-actions>button{flex:0 1 auto;min-height:44px;padding:8px 12px}
 body.landscape-puzzle #tools{gap:6px;margin:6px 0}
 #landscape-puzzle-info .board-actions{margin:6px 0;gap:6px}
 #landscape-double-sidebar{display:grid;grid-template-columns:minmax(0,1fr) minmax(110px,38%);align-content:start;align-items:center;gap:4px 8px}
 #landscape-double-sidebar .dx-header{grid-column:1 / -1;padding-bottom:4px}
 #landscape-double-sidebar>h3{grid-column:1;grid-row:2;margin:4px 0}
 #landscape-double-sidebar>.dx-preview{grid-column:2;grid-row:2;margin:4px 0;padding:6px;gap:2px 6px;grid-template-columns:44px minmax(0,1fr)}
 #landscape-double-sidebar>.dx-preview .dx-board{width:44px}
 #landscape-double-sidebar .dx-inventory{grid-column:1 / -1;margin-top:4px;padding-top:6px;min-width:0}
 #landscape-double-sidebar :is(.dx-tools,.dx-actions){gap:6px;margin:6px 0}
 #landscape-double-sidebar .dx-actions button{padding:8px;min-height:44px;font-size:.8rem}
}

#orientation-status:empty{display:none}
.orientation-feedback:has(#orientation-status:empty){display:none}
.orientation-feedback{margin:-10px 0 18px}
.orientation-feedback p{margin:0 0 8px}

.cosmetic-reward{color:var(--cyan);border-top:1px solid var(--line);padding-top:12px}

#double-counts{width:min(520px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto}
.dx-counts-table{width:100%;border-collapse:collapse;margin-top:16px;font-size:.85rem}
.dx-counts-table th,.dx-counts-table td{padding:10px 6px;border-bottom:1px solid var(--line);text-align:right;font-variant-numeric:tabular-nums}
.dx-counts-table th:first-child{text-align:left}
#dx-setup-counts{margin:8px 0 8px 8px}

/* Practice exposes random generation and shared inputs together. */
#practice-random-options .practice-random-row{align-items:end;margin-top:20px}
#practice-random-options .practice-random-row>label{display:grid;gap:6px;flex:1 1 140px;min-width:0}
#practice-random-options select{width:100%}
#play-practice-random{min-height:44px}
#practice-seed-options{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
#practice-seed-options>label{margin-bottom:8px}
.practice-seed-row{display:flex;align-items:center;gap:8px}
.practice-seed-row #puzzle-seed{flex:1;min-width:0;width:auto;margin:0}
.practice-seed-row #play-unrated{flex:none;min-height:44px}

/* Weekly contains independent challenge cards; play screens keep the shared native UI. */
#double-controls{display:grid;gap:16px}#double-controls[hidden]{display:none}#weekly-title{margin:0}.weekly-challenge{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.weekly-challenge h3{margin-top:0}.weekly-challenge>p{line-height:1.5}.weekly-challenge .primary-play{margin-top:8px}#dx-boards.dx-focused>.dx-main:only-child{grid-column:1/-1}#dx-boards.dx-focused>.dx-main:only-child .dx-board{margin-inline:auto}

@media(min-width:850px){#double-controls{grid-template-columns:repeat(2,minmax(0,1fr))}#weekly-title{grid-column:1/-1}.weekly-challenge{min-width:0;align-self:start}}

/* Muted mode colors distinguish Weekly cards in both display palettes. */
#weekly-double-card{background:#193139;border-color:#416c76}
#weekly-timelines-card{background:#2b263e;border-color:#6c5c89}
.light-theme #weekly-double-card{background:#e0eff1;border-color:#8ab4bc}
.light-theme #weekly-timelines-card{background:#eee7f5;border-color:#b5a1cb}

/* Weekly cards share content rows on wide screens and stack naturally on phones. */
.weekly-challenge{display:grid;gap:12px;align-content:start}.weekly-challenge>h3,.weekly-challenge>p,.weekly-challenge h4{margin:0}.weekly-challenge h3{font-size:1.2rem}.weekly-challenge h4{font-size:1rem}.weekly-challenge .score-detail{line-height:1.5}.weekly-secondary,.weekly-primary{display:flex;gap:10px;flex-wrap:wrap;align-items:start}.weekly-secondary details{flex-basis:100%;min-width:0}.weekly-primary .primary-play{margin:0}.weekly-challenge .dx-history-row{flex-wrap:wrap}#weekly-shared{display:grid;gap:8px}#weekly-shared p{margin:0}#dx-preview-notice:empty{display:none}#weekly-double-meta,#weekly-timelines-meta{display:grid;align-content:start;gap:8px}#weekly-timelines-meta p{margin:0}
@media(min-width:850px){#weekly-title,#weekly-shared,#dx-preview-notice{grid-column:1/-1}.weekly-challenge{grid-row:span 5;grid-template-rows:subgrid;align-self:stretch}}
.weekly-challenge #dx-week-title{margin:0;font-size:1rem}.weekly-challenge #dx-difficulty{margin:0}.weekly-challenge #dx-week-status{font-size:1rem}.weekly-secondary #dx-archive,.weekly-secondary #weekly-timelines-archive{margin:0;padding:12px;border:1px solid var(--border,#334155);border-radius:10px}.weekly-secondary summary{cursor:pointer;color:var(--accent,#78dfe2)}#weekly-timelines-archive-list{margin-top:12px}

/* Timeline reward: parallel cyan/violet routes with brief shared meeting points. */
.timeline-beam :is(line,path){fill:none;stroke-linecap:round;stroke-linejoin:round}.timeline-beam .timeline-afterimage{stroke:currentColor;stroke-width:9;opacity:.15}.timeline-beam .timeline-core{stroke:#9dcee4;stroke-width:1;opacity:.18}.timeline-beam .timeline-rail{stroke:currentColor;stroke-width:2.7;opacity:.75}.timeline-beam .timeline-pulse{stroke:currentColor;stroke-width:4.2;stroke-dasharray:20 140;stroke-dashoffset:var(--phase);animation:timeline-flow 1.6s linear infinite;filter:drop-shadow(0 0 2px currentColor)}.timeline-beam .timeline-cyan{stroke:#72e5ff;color:#72e5ff}.timeline-beam .timeline-violet{stroke:#d5a0ff;color:#d5a0ff}@keyframes timeline-flow{to{stroke-dashoffset:calc(var(--phase) - 160)}}@media(prefers-reduced-motion:reduce){.timeline-beam .timeline-pulse{animation:none;stroke-dasharray:none;stroke-width:3;opacity:.7}}
.fork-curve.timeline-fork-cyan{stroke:#72e5ff;stroke-width:3.5}.fork-curve.timeline-fork-violet{stroke:#d5a0ff;stroke-width:3.5}.light-theme .fork-curve.timeline-fork-cyan{stroke:#076f94}.light-theme .fork-curve.timeline-fork-violet{stroke:#743da5}

#weekly-intro{display:grid;gap:8px}#weekly-intro #dx-week-title{margin:0;font-size:1.05rem}#weekly-rules{margin:0;line-height:1.5;color:var(--muted)}@media(min-width:850px){#weekly-intro{grid-column:1/-1}}

/* Light-only contrast corrections; retain slate backplates for luminous optical art. */
.light-theme{--accent:var(--cyan);--border:var(--line)}
.light-theme :is(#daily-bonus-status,.journey-check){color:var(--light-success)}
.light-theme .journey-check{background:#cbe4d7}
.light-theme .minimum-challenge{background:#dbece5}
.light-theme :is(#dx-archive,.weekly-secondary) summary{color:var(--cyan)}
.light-theme .dx-tools button{background:var(--optic-tile);color:#fff;border-color:#657f98;--cyan:#68e5eb;--gold:#ffce73}
.light-theme .dx-tools button:hover{background:var(--optic-tile-hover)}
.light-theme .dx-tools button[aria-pressed=true]{background:var(--optic-tile-hover);border-color:#8f5709;box-shadow:0 0 0 2px #8f5709}
.light-theme .dx-actions #dx-fire{background:#cee6ea;color:#204452}
.light-theme .dx-cell:is(.dx-piece,.source,.gate){background:var(--optic-tile)}
.light-theme .dx-socket:before{border-color:#c0d0df}
.light-theme .dx-picked{outline-color:#ffe085}
.light-theme :is(.dx-cell,.cell).touch-destination{box-shadow:inset 0 0 0 2px #08727c}
.light-theme .dx-cell.lit{background:#e3d5a0}
.light-theme .dx-cell.hit{background:#df9aa6}
.light-theme .dx-board .portal-label{color:#edf3fb}
.light-theme.modern-theme :is(.beams,.demo-beams) .beam-line{stroke:#126d3c;filter:none}
.light-theme .timeline-beam .timeline-core{stroke:#605187;opacity:.8}
.light-theme .timeline-beam .timeline-cyan{stroke:#076f94;color:#076f94}
.light-theme .timeline-beam .timeline-violet{stroke:#743da5;color:#743da5}
.light-theme.custom-flame .beams .beam-line{stroke:#aa4b0b}
.light-theme #tutorial-links .guide-button-name{color:#f4f8fc}
.light-theme #editor-tools [data-edit="remove"]{color:#ffc1ca}
.light-theme .achievement-card:not(.earned) .achievement-icon,.light-theme #achievement-detail-modal:not(.earned) #achievement-detail-icon{filter:grayscale(1) brightness(.65);opacity:.9}
.light-theme .custom-piece-choices label{background:var(--optic-tile);color:#edf3fb;--cyan:#68e5eb;--gold:#ffce73}
.light-theme .custom-piece-choices label:has(input:checked){border-color:#8f5709;box-shadow:0 0 0 2px #8f5709}
.light-theme .editor-count-icon{color:#edf3fb}

/* The same cell roles have the same cues in ordinary and Weekly boards. */
:root{--cell-bulb:#302c22;--cell-bulb-lit:#514326;--cell-bomb:#35212d;--cell-bomb-hit:#862c35;--cell-portal:#272647;--cell-socket:#203548}
:root.light-theme{--cell-bulb:#eee0b9;--cell-bulb-lit:#f5d67d;--cell-bomb:#ead1d9;--cell-bomb-hit:#c64b5e;--cell-portal:#655875;--cell-socket:var(--optic-tile)}
:root :is(.cell,.dx-cell).socket{background:var(--cell-socket)}
:root :is(.cell,.dx-cell).portal{background:var(--cell-portal)}
:root :is(.cell,.dx-cell).target{background:var(--cell-bulb)}
:root :is(.cell,.dx-cell).target.lit{background:var(--cell-bulb-lit)}
:root :is(.cell,.dx-cell).bomb{background:var(--cell-bomb)}
:root :is(.cell,.dx-cell).bomb.hit{background:var(--cell-bomb-hit)}

/* Brief cell-local hazard feedback; no screen shake or changes to optical rules. */
.bomb-impact{overflow:hidden}
.bomb-impact::after{content:'';position:absolute;inset:8%;z-index:5;pointer-events:none;background:#ffb459;clip-path:polygon(50% 0,60% 30%,85% 8%,75% 38%,100% 50%,72% 59%,91% 89%,60% 74%,50% 100%,39% 74%,10% 91%,27% 60%,0 50%,29% 39%,9% 10%,39% 28%);animation:hazard-impact .42s ease-out both}
.bomb-impact:has(.modern-reactor)::after{clip-path:none;border:3px solid #ff708b;border-radius:50%;background:#ff486252;box-shadow:inset 0 0 10px #ff8aa3}
.bomb-impact:has(.fantasy-art)::after{clip-path:none;inset:12%;border:3px solid #ff778b;border-radius:50%;background:transparent}
.bomb-impact>.fantasy-art{animation:hazard-startle .42s ease-out both}
@keyframes hazard-impact{0%{opacity:.95;transform:scale(.35)}65%{opacity:.7}100%{opacity:0;transform:scale(1.1)}}
@keyframes hazard-startle{0%,100%{translate:0 0}35%{translate:0 -12%}65%{translate:0 -3%}}
@media(prefers-reduced-motion:reduce){.bomb-impact::after{clip-path:none;inset:10%;border:3px solid #ff9d70;border-radius:8px;background:#ff9d7033;animation:hazard-impact-still .18s linear both}.bomb-impact>.fantasy-art{animation:none}@keyframes hazard-impact-still{from{opacity:.9}to{opacity:0}}}

/* Earned cosmetics mix with every other Custom piece and beam choice. */
.custom-piece-choices{flex-wrap:wrap;max-width:min(232px,52vw)}
.custom-piece-choices .cosmetic-locked::after{content:'🔒';position:absolute;right:0;bottom:0;font-size:12px;line-height:1;background:var(--panel);border-radius:3px;padding:2px;pointer-events:none}
.cosmetic-preview-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.cosmetic-preview-actions button{font-size:.8rem}
#cosmetic-preview-modal{width:min(500px,calc(100% - 24px))}#cosmetic-preview-pieces{display:flex;justify-content:space-around;gap:12px;padding:18px;background:var(--optic-tile,#203548);border-radius:9px}#cosmetic-preview-pieces svg{width:70px;max-width:22%;height:auto}#beam-preview-reward{position:static;display:block;width:100%;height:100px;--beam-color:#ffb363}#cosmetic-preview-pieces[hidden],#beam-preview-reward[hidden]{display:none}
.sunrise-beam line{fill:none;stroke-linecap:round;stroke-linejoin:round}.sunrise-amber{stop-color:#ffd36a}.sunrise-coral{stop-color:#ff7189}.sunrise-core{stroke-width:4}.sunrise-shimmer{stroke:#fff4d6;stroke-width:1.2;stroke-dasharray:7 43;opacity:.65;animation:sunrise-glimmer 2.8s linear infinite}.sunrise-beam-enabled #board,.sunrise-beam-enabled .dx-board{--beam-color:#ffb363}
.light-theme .sunrise-amber{stop-color:#a85c04}.light-theme .sunrise-coral{stop-color:#ba3454}.light-theme .sunrise-shimmer{stroke:#fff4d6;opacity:.45}
@keyframes sunrise-glimmer{to{stroke-dashoffset:-100}}
@media(prefers-reduced-motion:reduce){.sunrise-shimmer{animation:none;opacity:.3}}

/* Sunrise leaves a longer warm afterglow; hit villagers keep a sad expression. */
.sunrise-trail stop{stop-color:#ffae75}.light-theme .sunrise-trail stop{stop-color:#ad5b29}
.villager-sad{display:none}.hit .villager-smile{display:none}.hit .villager-sad{display:inline}

.misfire-counter{font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.misfire-counter.near-limit{color:var(--gold)}.misfire-counter.danger{color:var(--light-danger,#ff9595);font-weight:700}

.settings-sync-footer{border-top:1px solid var(--line);margin-top:14px;padding-top:10px;color:var(--muted);font-size:.8rem}.settings-sync-footer p{margin:0 0 6px}.settings-sync-footer>div{display:flex;flex-wrap:wrap;gap:7px}.settings-sync-footer button{font-size:.8rem}

.offline-start-notice{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;padding:8px 14px;background:var(--panel);border-bottom:1px solid var(--line);color:var(--ink);font-size:.8rem}.offline-start-notice[hidden]{display:none}.offline-start-notice button{padding:5px 10px}#offline-download-status{font-size:.8rem}

#weekly-hints{width:min(620px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto}#weekly-hints-content section{padding:18px 0;border-top:1px solid var(--line)}#weekly-hints-content h3{font-size:1rem;margin:0 0 10px}#weekly-hints-content p{margin:0;line-height:1.7}#weekly-hints-content h3:focus{outline:2px solid var(--gold);outline-offset:4px}

.overdrive-option{margin:12px 0}.overdrive-option label{display:flex;gap:8px;align-items:center;font-weight:700}.overdrive-option p{margin:6px 0}#overdrive-rules{line-height:1.7;white-space:normal}.overdrive-clock{color:var(--gold);font-weight:800}.prismatic-portal{filter:drop-shadow(0 0 3px #d19aff);animation:prismatic-shimmer 5s linear infinite}@keyframes prismatic-shimmer{50%{filter:drop-shadow(0 0 5px #67dfdc)}}@media(prefers-reduced-motion:reduce){.prismatic-portal{animation:none}}

.achievement-reward{grid-column:2;font-size:.75rem;line-height:1.4;color:var(--ink);opacity:.85}
.achievement-reward-detail{font-size:.9rem;color:var(--ink)}

#cosmetic-preview-modal{width:min(620px,calc(100% - 24px));max-height:85dvh;overflow-y:auto}
#cosmetic-preview-pieces{display:grid;gap:16px;padding:12px;background:var(--bg)}
.appearance-preview-row h3{font-size:.95rem;margin:0 0 8px;color:var(--ink)}
.appearance-preview-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.appearance-preview-choices figure{margin:0;text-align:center;min-width:0}
.appearance-preview-art{display:flex;align-items:center;justify-content:center;height:58px;background:var(--optic-tile,#203548);border-radius:8px;font-size:1.8rem}
#cosmetic-preview-pieces .appearance-preview-art svg{width:48px;height:48px;max-width:100%}
.appearance-preview-choices figcaption{font-size:.72rem;color:var(--ink);line-height:1.3;margin-top:6px;overflow-wrap:anywhere}

.appearance-preview-art .bulb-icon,.appearance-preview-art .bomb-icon{font-size:30px}
#cosmetic-preview-beam{max-width:65%;min-width:0}

/* Every portal style owns its geometry; the Classic oval is a separate Custom choice. */
.custom-piece-row:has(input[value="oval"]){grid-template-columns:minmax(80px,1fr) auto}
.custom-piece-row:has(input[value="oval"]) .custom-piece-choices{flex-wrap:wrap;justify-content:flex-end;width:292px}
/* SVG paths must never acquire the SVG default black fill in preview contexts. */
.beam-option-preview .pulse-trail{fill:none}
.beam-option-preview .beam-line{fill:none;stroke:var(--beam-color,var(--gold));stroke-width:4;stroke-linecap:round;filter:none}
.beam-option-preview .laser-pulse circle:not(.fantasy-fireball){fill:var(--beam-color,var(--gold));stroke:none}
.beam-option-preview .fantasy-fireball{display:none}
#beam-preview-reward{background:var(--bg);border:1px solid var(--line);border-radius:10px}

/* Each Custom preview owns its color, independently of the equipped theme. */
:is(#beam-preview-custom,#beam-preview-custom-editor,#beam-preview-reward) .beam-line{stroke:var(--beam-color,var(--gold));stroke-width:4;filter:none}
:is(#beam-preview-custom,#beam-preview-custom-editor,#beam-preview-reward) .fantasy-fireball{display:none}
:is(#beam-preview-custom,#beam-preview-custom-editor,#beam-preview-reward)[data-beam="fireBeam"] .beam-line{stroke-width:6;filter:drop-shadow(0 0 3px #ff683a)}
:is(#beam-preview-custom,#beam-preview-custom-editor,#beam-preview-reward)[data-beam="fireBeam"] .fantasy-fireball{display:inline;fill:#fff0a8;stroke:#ff883d;stroke-width:3;filter:drop-shadow(0 0 3px #ff6f32)}

@media(max-width:520px){.custom-piece-row:has(input[value="oval"]) .custom-piece-choices{width:172px}}
@media(max-width:390px){.custom-piece-row:has(input[value="oval"]) .custom-piece-choices{width:140px}}

#overdrive-rules{padding-left:1.4rem}#overdrive-rules li,#overdrive-scoring-rules li{margin-bottom:.65em}

.puzzle-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0;padding-bottom:12px;border-bottom:1px solid var(--line)}
.puzzle-tabs[hidden]{display:none}.puzzle-tabs button{flex:1;white-space:nowrap;padding:9px 12px}
.puzzle-tabs button[aria-pressed="true"]{color:var(--ink);border-color:var(--gold);background:var(--panel)}
#settings-modal .settings-tab-panel>label.shortcut-setting{justify-content:flex-start}#settings-modal .shortcut-setting>span{min-width:0;text-align:left}#settings-modal .shortcut-setting input{flex:0 0 18px;width:18px;height:18px;margin:0}

/* Four main modes use balanced rows on narrow screens. */
.mode-controls{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:620px){.mode-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Puzzle variants are tabs inside one named panel, subordinate to the main menu. */
.puzzle-hub{margin-top:18px;border:1px solid var(--line);border-radius:12px;background:var(--bg);padding:18px}
.puzzle-hub[hidden]{display:none}.puzzle-hub>h2{font-size:1.05rem;margin:0 0 12px;color:var(--ink)}
.puzzle-hub .puzzle-tabs{display:flex;flex-wrap:nowrap;gap:0;margin:0 0 18px;padding:0;border:0;border-bottom:2px solid var(--line);overflow-x:auto}
.puzzle-hub .puzzle-tabs button{flex:1 0 auto;padding:10px 12px;border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;box-shadow:none;color:var(--muted);font-size:.9rem}
.puzzle-hub .puzzle-tabs button[aria-selected="true"]{color:var(--cyan);border-bottom-color:var(--cyan);background:var(--panel);font-weight:700}
.puzzle-hub .puzzle-tabs button:focus-visible{outline:2px solid var(--gold);outline-offset:-3px}
#puzzle-intro-modal{width:min(520px,calc(100% - 24px));max-height:85dvh;overflow-y:auto}
#puzzle-intro-modal ul{padding-left:1.3em}#puzzle-intro-modal li{line-height:1.5;margin:12px 0}
@media(max-width:420px){.puzzle-hub{padding:12px}.puzzle-hub .puzzle-tabs button{padding:10px 7px;font-size:.8rem}}

#status.confirming-clear{color:var(--cyan);font-weight:600}
