: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-color:#263244}.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}#tutorial-close{background:#305963;border-color:var(--cyan);min-width:130px}@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>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}#difficulty-details{padding:5px 10px;font-size:.8rem}

.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)}

/* One explicit difficulty label per responsive map row. */
.journey-route{margin-left:80px}.journey-row-label{display:none;position:absolute;right:calc(100% + 12px);top:53px;width:68px;font-size:.7rem;line-height:1.35;color:var(--muted);white-space:nowrap}.journey-stop:nth-child(10n + 1) .journey-row-label{display:block}
@media(max-width:650px){.journey-row-label{top:49px;font-size:.68rem}.journey-stop:nth-child(10n + 1) .journey-row-label{display:none}.journey-stop:nth-child(5n + 1) .journey-row-label{display:block}}
@media(max-width:460px){.journey-route{grid-template-columns:repeat(3,minmax(0,1fr))}.journey-stop:nth-child(5n + 1) .journey-row-label{display:none}.journey-stop:nth-child(3n + 1) .journey-row-label{display:block}.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,#tutorial-close,#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;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}
.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){.achievements-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.achievements-list{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:#edf3fb;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}
#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:22px;padding-top:8px}
.release-notes h3{font-size:1rem;color:var(--gold);margin:12px 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{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{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:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}
.tutorial-next-modes>div{padding:12px;border:1px solid var(--line);border-radius:12px}
.tutorial-next-modes button{width:100%;min-height:44px}.tutorial-next-modes p{margin:10px 0 0;line-height:1.4;font-size:.95rem}
@media(max-width:560px){.tutorial-next-modes{grid-template-columns:1fr}.tutorial-next-modes>div{display:grid;grid-template-columns:minmax(110px,1fr) 2fr;align-items:center;gap:12px}.tutorial-next-modes p{margin:0}}

/* 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-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}
