.crossword-page{max-width:1120px;margin:0 auto;padding:1.2rem .3rem 4rem;color:#243c39;font-size:1.12rem;line-height:1.6}.crossword-page h1{font-size:clamp(2rem,5vw,3.5rem);line-height:1.12;letter-spacing:-.035em;margin:.5rem 0 1rem}.crossword-page h2{font-size:1.65rem;line-height:1.35}.crossword-page h3{font-size:1.3rem}.puzzle-header{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.5rem 0 2.5rem;border-bottom:1px solid #d7dfd7;margin-bottom:2rem}.puzzle-kicker{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;font-weight:750;color:#537268}.puzzle-mark{font-family:Georgia,serif;font-size:5rem;color:#286556;line-height:1}.puzzle-mark span{font-family:system-ui;font-size:2rem;color:#b26838}.crossword-page button,.crossword-page .puzzle-choice{touch-action:manipulation}.crossword-page button{min-height:48px;padding:.65rem 1rem;border:1px solid #b9cac1;border-radius:10px;background:#fff;color:#24463e;font-size:1rem;font-weight:650}.crossword-page button:hover{background:#edf3ed;border-color:#54796b}.crossword-page button:disabled{opacity:.55;cursor:not-allowed}.crossword-page .puzzle-primary{background:#285f4f;border-color:#285f4f;color:white}.crossword-page .puzzle-primary:hover{background:#1d493d}.crossword-page :where(a,button,input,select,textarea,summary,[role="button"],[role="gridcell"],[tabindex]:not(h1)):focus-visible{outline:3px solid #b85d18;outline-offset:3px}.puzzle-link{display:inline-block;padding:.8rem 0;color:#285f4f;font-weight:700;text-underline-offset:4px}.puzzle-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.25rem;margin:1.8rem 0}.puzzle-card{padding:2rem;background:#fff;border:1px solid #d4ded4;border-radius:18px;box-shadow:0 6px 20px #25463a08}.puzzle-choice{display:flex;flex-direction:column;gap:1.2rem;text-decoration:none;color:inherit;transition:transform .15s,border-color .15s}.puzzle-choice:hover{transform:translateY(-3px);border-color:#447a65;color:inherit}.play-summary{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;margin:1rem 0 1.8rem;font-size:.95rem}.play-summary progress{height:10px;accent-color:#285f4f;max-width:180px}.focused-clue{background:#fffdf7;border:1px solid #dcded0;border-radius:20px;padding:clamp(1rem,4vw,2rem);box-shadow:0 12px 35px #24483c0a}.clue-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;font-size:.85rem}.focused-clue h2{font-size:clamp(1.55rem,4vw,2.2rem);margin:1.5rem 0 1rem}.input-help{color:#5a6e67;font-size:1rem}.answer-strip{display:flex;flex-wrap:wrap;gap:.55rem;margin:1.6rem 0}.answer-cell input{width:clamp(50px,10vw,64px);height:68px;text-align:center;font-size:1.6rem;font-weight:700;background:white;border:2px solid #a9bdb1;border-radius:10px;color:#24463e;text-transform:uppercase}.answer-cell input:focus{background:#f0f7eb;border-color:#285f4f}.answer-cell input.incorrect{border:3px solid #ba5e28;background:#fff2e5}.alphabet-keys,.clue-actions,.play-tools,.studio-actions,.studio-toolbar{display:flex;gap:.65rem;flex-wrap:wrap;align-items:center}.alphabet-keys{margin:1rem 0}.alphabet-keys button{min-width:48px}.clue-actions{border-top:1px solid #e1e5d8;padding-top:1.4rem;margin-top:1.4rem}.play-tools{margin:1.5rem 0}.play-tools [role=status]{flex:1;min-width:240px;font-weight:600}.account-progress{border:1px solid #d9e3dc;background:#f1f6f0;border-radius:15px;padding:1.5rem;margin:1.8rem 0}.account-progress button{margin:0 .6rem .6rem 0}.puzzle-overview{margin-top:2rem}.puzzle-overview summary,.studio-preview summary{padding:1rem 0;font-weight:700;cursor:pointer}.grid-tools{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;font-size:.95rem}.grid-scroll{overflow:auto;max-width:100%;padding:.8rem 0 1.2rem}.crossword-grid{display:grid;gap:3px;width:max-content;padding:5px;background:#354941;border-radius:8px}.crossword-page .grid-cell{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0;border-radius:2px;font-size:1.15rem;font-weight:700;background:#fffdf7;color:#1a3930}.grid-cell small{position:absolute;left:3px;top:0;font-size:.65rem;font-weight:500}.crossword-page .grid-cell.active{background:#d6ead4}.grid-block{background:#354941;min-height:44px}.clue-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.6rem;margin:1rem 0}.clue-list button{text-align:left;font-weight:400}.clue-list strong{display:block}.clue-list button[aria-current=true]{border:2px solid #285f4f;background:#eaf4e8}.puzzle-alert,.studio-message{background:#fff4df;border:1px solid #d8b979;border-radius:12px;padding:1rem;margin:1rem 0}.puzzle-alert button{margin-left:1rem}.studio-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:2rem}.studio-library{border-right:1px solid #d9e2d9;padding-right:1rem}.studio-item{display:flex;flex-direction:column;width:100%;text-align:left;margin:.75rem 0}.studio-item span{font-size:.85rem;font-weight:400}.studio-item[aria-current=true]{background:#eaf4e8;border:2px solid #285f4f}.studio-toolbar{justify-content:space-between;margin-bottom:1.5rem}.studio-field{display:flex;flex-direction:column;gap:.5rem;margin:1.25rem 0;font-weight:650}.studio-fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.studio-fields label{display:flex;flex-direction:column;font-weight:650;gap:.5rem}.studio input,.studio select,.studio textarea{border:1px solid #a8bdb0;border-radius:8px;min-height:48px;padding:.65rem;font-size:1.05rem;width:100%;background:white;color:#233f34}.studio textarea{font-family:ui-monospace,monospace;line-height:1.8;font-size:1.15rem}.studio-clue-heading{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:2rem}.studio-clue{display:grid;grid-template-columns:130px 1fr;gap:1rem;align-items:center;margin:.8rem 0}.studio-clue small{display:block;font-size:.8rem}.studio-actions{padding:1.5rem 0;border-top:1px solid #d9e2d9;margin-top:2rem}.studio-review{background:#edf4e8;padding:1rem;border-radius:10px}.studio-preview{margin:1rem 0}.home-crossword{background:#f4f6ee;border-radius:22px;padding:clamp(1rem,4vw,3rem);margin:1rem 0 2rem}.home-crossword .home-actions{display:flex;gap:1rem;flex-wrap:wrap}.home-crossword .home-actions a{display:inline-flex;align-items:center;min-height:52px;padding:.8rem 1.3rem;border-radius:10px;font-weight:700;text-decoration:none;background:#285f4f;color:white}.home-crossword .home-actions a:last-child{background:#fff;color:#285f4f;border:1px solid #bdcdbf}@media(max-width:700px){.studio-layout{grid-template-columns:1fr}.studio-library{border-right:0;border-bottom:1px solid #d9e2d9;padding:0 0 1rem}.studio-library .studio-item{display:inline-flex;max-width:240px;margin:.4rem}.studio-fields{grid-template-columns:1fr}.studio-clue{grid-template-columns:1fr;gap:.4rem}.puzzle-header{padding-top:.5rem;gap:1rem}.puzzle-mark{font-size:3rem}.clue-actions button{flex:1}.play-tools{align-items:stretch}.play-tools>button{width:100%}.crossword-page{font-size:1.05rem}.account-progress button{width:100%}}@media(prefers-reduced-motion:reduce){.puzzle-choice{transition:none}.puzzle-choice:hover{transform:none}}

/* Grid-first player. The active clue stays readable below the board. */
.grid-player { margin-top: 1rem; }
.grid-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.direction-switch { display: flex; gap: .5rem; }
.direction-switch button[aria-pressed="true"] { background: #285f4f; color: white; border-color: #285f4f; }
.grid-size-control { display: flex; align-items: center; gap: .6rem; font-size: .95rem; }
.grid-size-control select { min-height: 44px; border: 1px solid #a8bdb0; border-radius: 8px; padding: .5rem; background: white; color: #243c39; }
.grid-help { font-size: .95rem; color: #526c60; margin: .8rem 0; max-width: 70ch; }
.grid-board-area { position: relative; }
.grid-frame { container-type: inline-size; overflow: auto; max-width: 100%; padding: .35rem 0 .6rem; overscroll-behavior: auto; touch-action: pan-x pan-y pinch-zoom; }
.interactive-grid { --fit-cell-size: calc((100cqw - var(--columns) * 1px - 6px) / var(--columns)); --cell-size: min(var(--requested-cell-size, 52px), var(--fit-cell-size)); display: flex; flex-direction: column; width: max-content; gap: 1px; background: #17241d; padding: 2px; border: 1px solid #17241d; }
.interactive-grid-row { display: grid; grid-template-columns: repeat(var(--columns), var(--cell-size)); gap: 1px; }
.grid-square, .interactive-block { width: var(--cell-size); height: var(--cell-size); position: relative; }
.interactive-block { background: #17241d; }
.grid-square { background: white; }
.crossword-page .grid-input { position: absolute; inset: 0; width: 100%; height: 100%; min-width: 0; padding: .25em .08em 0; border: 0; border-radius: 0; background: transparent; color: #172b23; font-size: min(clamp(1.1rem, calc(var(--cell-size) * .47), 2rem), calc(var(--cell-size) * .65)); font-weight: 700; text-align: center; text-transform: uppercase; caret-color: #133c29; touch-action: pan-x pan-y pinch-zoom; }
.crossword-page .grid-input:focus { outline: 3px solid #24543c; outline-offset: -3px; }
.grid-number { position: absolute; left: 3px; top: 0; z-index: 1; font-size: clamp(.55rem, calc(var(--cell-size) * .19), .85rem); line-height: 1.35; font-weight: 650; color: #243b2c; pointer-events: none; }
.grid-square.is-word { background: #e4f0d5; }
.grid-square.is-selected { background: #c3e492; box-shadow: inset 0 0 0 2px #24543c; }
.grid-square.is-incorrect { box-shadow: inset 0 -4px #ad4f23; }
.grid-square.is-incorrect .grid-input { color: #8a3818; }
.grid-clue-peek { position: absolute; left: .4rem; right: .4rem; bottom: .7rem; z-index: 8; padding: .8rem 1rem; color: white; background: #203f32; border-radius: 10px; box-shadow: 0 4px 14px #0003; pointer-events: none; font-size: 1.1rem; }
.current-grid-clue { margin: 0; padding: 1rem 1.2rem; background: #f2f7e9; color: #243c39; border: 1px solid #aac39c; border-radius: 12px; box-shadow: 0 4px 16px #243a2910; }
.current-grid-clue h2 { font-size: clamp(1.2rem, 3.5vw, 1.65rem); margin: .6rem 0 .2rem; line-height: 1.4; }
.grid-clue-list { margin-top: 1.2rem; }
.grid-clue-list summary { cursor: pointer; padding: .7rem 0; font-weight: 700; }
@media (max-width: 700px) {
    .grid-toolbar { gap: .7rem; }
    .direction-switch { flex: 1; }
    .direction-switch button { flex: 1; min-width: 100px; }
    .current-grid-clue { padding: .8rem; }
    .grid-player .clue-actions { padding-top: .8rem; margin-top: .8rem; }
}


.ui-language-switcher { display:flex; align-items:center; gap:.4rem; margin-right:auto; font-size:.9rem; }
.ui-language-switcher button { min-height:40px; padding:.4rem .65rem; border:1px solid #aac2b3; border-radius:8px; background:white; color:#254b3b; }
.ui-language-switcher button[aria-pressed=true] { background:#285f4f; color:white; }
.ui-language-switcher [role=status]:empty { display:none; }
@media(max-width:700px){.top-row.auth { flex-wrap:wrap; height:auto; min-height:3.5rem; padding-top:.5rem; padding-bottom:.5rem; }.ui-language-switcher { width:100%; margin:0; }}
.skandi-clue-cell,.skandi-reserved-cell { width:var(--cell-size); height:var(--cell-size); position:relative; background:#eff3e8; }
.skandi-clue-cell { display:flex; flex-direction:column; overflow:hidden; }
.crossword-page .skandi-clue-cell button { flex:1; min-height:0; width:100%; border:0; border-bottom:1px solid #87917e; border-radius:0; padding:2px; display:flex; align-items:center; justify-content:space-between; gap:1px; background:#eff3e8; color:#172b23; text-align:left; font-size:clamp(6px,calc(var(--cell-size)*.17),10px); line-height:1.05; overflow:hidden; }
.skandi-clue-cell button span { overflow:hidden; overflow-wrap:anywhere; }
.skandi-clue-cell button b { flex-shrink:0; font-size:1.3em; }
.skandi-clue-cell button:last-child { border-bottom:0; }
.skandi-clue-cell button:focus-visible { outline:2px solid #24543c; outline-offset:-2px; }
.skandi-portrait { position:absolute; left:0; top:0; z-index:2; width:calc(var(--image-columns)*var(--cell-size) + (var(--image-columns) - 1)*1px); height:calc(var(--image-rows)*var(--cell-size) + (var(--image-rows) - 1)*1px); object-fit:contain; background:#eff3e8; pointer-events:none; }
.skandi-studio-grid { display:grid; gap:2px; margin:1rem 0; width:max-content; }
.crossword-page .skandi-studio-cell { display:flex; flex-direction:column; height:64px; padding:4px; }
.skandi-studio-cell small { font-size:.7rem; }
.skandi-studio-cell[aria-pressed=true] { outline:3px solid #24543c; }
.skandi-studio-cell.kind-Clue { background:#d9e5cc; }
.skandi-studio-cell.kind-Block { background:#344638; color:white; }
.skandi-studio-portrait { max-width:180px; max-height:240px; object-fit:contain; display:block; margin:1rem 0; }
.skandi-editor fieldset { margin:1rem 0; padding:1rem; border:1px solid #bccab1; }
.skandi-editor label { display:flex; flex-direction:column; gap:.3rem; margin:.5rem 0; }

.clue-groups { display:grid; grid-template-columns:2fr 1fr; gap:1.25rem; }.clue-groups .vertical-clues{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.clue-groups .horizontal-clues{display:grid;grid-template-columns:1fr}
.library-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1rem;margin:1rem 0}.library-card{display:flex;flex-direction:column;gap:.6rem;padding:1.2rem;border:1px solid #c4d4c1;border-radius:1rem;background:#fff;color:#194331;text-decoration:none;min-height:180px}.library-card:hover{background:#edf5e9}.library-card strong{font-size:1.25rem}.library-type{color:#52674f}.puzzle-library select{min-height:44px}.final-result{background:#edf5e9;padding:1.5rem;border-radius:1rem;margin:1rem 0}.final-score{font-size:1.5rem;font-weight:700}.final-square{width:var(--cell-size);height:var(--cell-size);display:flex;position:relative;align-items:center;justify-content:center;background:#fff;border:1px solid #93ac8b;font-size:calc(var(--cell-size)*.44)}.final-wrong{background:#fde5e2;border:2px solid #b26058}.final-blank{background:#f4ecd8;border:2px dashed #897640}.final-square small{position:absolute;bottom:0;font-size:.5em}.final-symbol{position:absolute;top:0;right:2px;font-size:.45em}.final-frame{container-type:inline-size;overflow:auto;max-width:100%;margin:1rem 0}.final-frame .interactive-grid{--cell-size:min(52px,var(--fit-cell-size))}.final-result.celebrate,.final-result.encourage{animation:result-arrival 1.2s ease-out 1}@keyframes result-arrival{from{transform:translateY(8px);opacity:.5}to{transform:none;opacity:1}}@media(prefers-reduced-motion:reduce){.final-result.celebrate,.final-result.encourage{animation:none}}@media(max-width:760px){.clue-groups{grid-template-columns:1fr}.clue-groups .vertical-clues{grid-template-columns:1fr}.grid-board-area,.grid-frame{max-width:100%}}

.skandi-clue-cell>span { flex:1; min-height:0; padding:2px; font-size:clamp(6px,calc(var(--cell-size)*.17),10px); line-height:1.05; overflow:hidden; border-bottom:1px solid #87917e; overflow-wrap:anywhere; }

.final-result.celebrate::before { content:"\2726 \2727 \2726"; display:block; color:#4d7741; letter-spacing:.6em; font-size:1.5rem; }
.final-result.encourage .motivation { border-left:3px solid #6e9460; padding-left:1rem; font-size:1.12rem; }

.crossword-page.studio-wide{max-width:none;width:100%;margin-left:0;margin-right:0;padding-left:0;padding-right:0}
.studio-editor-layout{display:block;min-width:0}.studio-section{padding:clamp(1rem,2vw,1.7rem);margin:1.5rem 0;border:1px solid #d1dfce;border-radius:1rem;background:#fff}.studio-section>h2{font-size:1.3rem;margin-bottom:1rem}.studio-section .studio-fields{gap:1.5rem}.studio-classification label{margin:.5rem 0}.studio-section .studio-actions{margin-top:.5rem;padding-top:1rem}
.studio-list-filters{display:grid;grid-template-columns:minmax(180px,2fr) minmax(140px,1fr) 130px auto;gap:1rem;align-items:end}.studio-list-filters label{display:flex;flex-direction:column;gap:.5rem}.studio-table th{white-space:nowrap}.studio-table small{display:block;color:#536951}.studio-pagination{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem}
@media(max-width:800px){.studio-list-filters{grid-template-columns:1fr 1fr}.studio-section .studio-fields{grid-template-columns:1fr}}@media(max-width:480px){.studio-list-filters{grid-template-columns:1fr}.studio-pagination{flex-wrap:wrap}.studio-section{padding:1rem}}

.crossword-page.daily-catalog-page,.crossword-page.is-playing{max-width:none;width:100%;margin-left:0;margin-right:0}

.library-filter{display:flex;align-items:center;gap:.8rem;max-width:480px;margin:1rem 0;font-weight:650}.library-filter .form-select{flex:1;min-width:140px;min-height:46px;border-color:#a8bdb0;color:#233f34;background-color:#fff}
.studio .form-select:focus,.library-filter .form-select:focus{border-color:#42775b;box-shadow:0 0 0 .2rem #42775b26}.studio .form-select:focus-visible,.library-filter .form-select:focus-visible{outline:3px solid #36674c;outline-offset:2px}@media(max-width:600px){.library-filter{align-items:stretch;flex-direction:column;max-width:none}}

.puzzle-format-badge{display:inline-flex;align-items:center;gap:.75rem;color:#235743;font-weight:700;margin:.5rem 0 .75rem}
.puzzle-format-mini{width:58px;height:58px;flex:none;filter:drop-shadow(0 3px 5px #183f2514)}
.puzzle-format-mini .format-grid-lines{stroke:#77988a;stroke-width:1;fill:none}
.puzzle-format-mini .format-block{fill:#245c43}
.puzzle-format-mini .format-clue{fill:#dceee3}
.puzzle-format-mini .format-clue-lines{stroke:#638a76;stroke-width:1.3;stroke-linecap:round}
.puzzle-format-mini .format-arrows{stroke:#235743;stroke-width:1.4;stroke-linejoin:round;fill:none}
.puzzle-format-mini .format-numbers{font:8px sans-serif;fill:#235743}
@media(max-width:600px){.puzzle-format-mini{width:48px;height:48px}}

.player-music{display:flex;flex-direction:column;gap:.4rem;font-size:.85rem;min-width:0;width:100%;max-width:320px}.music-controls{display:flex;align-items:center;flex-wrap:wrap;gap:.4rem .65rem}.music-title{font-weight:700;color:#285f4f}.crossword-page .player-music [data-music-toggle]{flex:0 0 auto;width:auto;min-height:36px;padding:.35rem .7rem;font-size:.85rem;line-height:1.4;border-radius:.5rem}.player-music label{display:flex;align-items:center;gap:.5rem;margin:0}.player-music .form-range{flex:1;min-width:60px;width:0;margin:0}.player-music small{line-height:1.4;color:#52674f;font-size:.8rem}

/* One responsive player layout, sized by its available content width. */
.crossword-page.is-playing {
    container: player / inline-size;
    padding: .5rem 0 2rem;
    font-size: 1rem;
}
.is-playing > .puzzle-header { padding: .5rem 0; margin-bottom: .5rem; border: 0; }
.is-playing > .puzzle-header h1 { font-size: clamp(1.5rem, 3vw, 2.1rem); margin: .3rem 0; }
.is-playing > .puzzle-header p { display: none; }
.player-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "back back" "title title" "summary summary";
    align-items: start;
    gap: .35rem 1rem;
    margin-bottom: .75rem;
}
.player-heading > .puzzle-header {
    grid-area: title;
    display: block;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.player-heading .puzzle-kicker { font-size: .7rem; }
.player-heading .puzzle-header h1 {
    font-size: clamp(1.35rem, 3cqw, 1.9rem);
    line-height: 1.2;
    overflow-wrap: anywhere;
    margin: .2rem 0;
}
.player-heading > .player-back-link {
    grid-area: back;
    justify-self: start;
    padding: .15rem 0;
    font-size: .85rem;
}
.crossword-page.is-playing .play-summary {
    grid-area: summary;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    min-width: 0;
    gap: .3rem .65rem;
    margin: 0;
    font-size: .85rem;
}
.player-progress-meter {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .25rem .5rem;
    min-width: 0;
}
.player-progress-meter progress { width: 90px; max-width: 100%; height: 8px; }
.player-progress-count { display: none; }
.play-summary .puzzle-convention {
    grid-column:1/-1;
    margin: 0;
    color: #52674f;
    font-size: .78rem;
    line-height: 1.4;
}
.play-summary .player-focus-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
    margin: 0;
}
.player-focus-bar small { display: none; }
.play-summary .player-focus-bar button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    min-height: 44px;
    padding: .4rem .65rem;
    font-size: .88rem;
}
.focus-icon { width:20px;height:20px;flex:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.focus-exit-icon { display: none; }
[data-focus-toggle][aria-pressed=true] .focus-enter-icon { display: none; }
[data-focus-toggle][aria-pressed=true] .focus-exit-icon { display: block; }

/* On narrow screens, the clue precedes the board and actions follow it. */
.play-workspace.grid-player {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "toolbar" "help" "clue" "board" "alphabet" "navigation" "tools" "clues";
    align-items: start;
    gap: .6rem 1rem;
    min-width: 0;
    max-width: 1280px;
    margin: 0 auto;
}
.play-workspace > .grid-toolbar { grid-area: toolbar; gap: .4rem .75rem; min-width: 0; margin: 0; }
.play-workspace > details.grid-help { grid-area: help; margin: 0; font-size: .8rem; }
.play-workspace > .grid-board-area { grid-area: board; min-width: 0; }
.play-workspace > .alphabet-keys { grid-area: alphabet; gap: .4rem; margin: 0; }
.play-workspace > .clue-actions { grid-area: navigation; gap: .4rem; margin: 0; padding-top: .6rem; }
.play-workspace > .grid-clue-list { grid-area: clues; margin: 0; }
.player-side-panel { display: contents; }
.player-side-panel > .current-grid-clue {
    grid-area: clue;
    min-width: 0;
    padding: .75rem 1rem;
    overflow-wrap: anywhere;
}
.player-side-panel .clue-top { gap: .3rem; font-size: .75rem; }
.player-side-panel .puzzle-kicker { font-size: .7rem; }
.player-side-panel .current-grid-clue h2 {
    font-size: clamp(1.15rem, 2.4cqw, 1.5rem);
    line-height: 1.4;
    margin: .4rem 0 0;
}
.player-side-panel > .play-tools {
    grid-area: tools;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    min-width: 0;
    margin: 0;
    padding: 1rem;
    border: 1px solid #d1dfce;
    border-radius: .8rem;
    background: #fff;
}
.player-action-group { display: grid; gap: 1rem; width: 100%; min-width: 0; }
.player-action-group > div { min-width: 0; }
.crossword-page .play-tools .action-prominent {
    width: 100%;
    min-height: 44px;
    padding: .6rem .75rem;
    font-size: .95rem;
}
.action-explanation { margin: .5rem 0 .2rem; color: #42594d; font-size: .8rem; line-height: 1.45; }
.reveal-action > span { font-size: .8rem; font-weight: 650; }
.play-tools > [role=status] { min-width: 0; font-size: .85rem; line-height: 1.4; overflow-wrap: anywhere; }
.play-tools > [role=status]:empty { display: none; }
.play-tools > .player-music { max-width: 100%; border-top: 1px solid #d1dfce; padding-top: .75rem; }
.grid-size-control { flex-wrap: wrap; gap: .4rem; max-width: 100%; font-size: .85rem; }
.grid-size-control select { min-width: 0; max-width: 100%; }
.grid-size-note { font-size: .8rem; color: #52674f; flex-basis: 100%; line-height: 1.4; }
.direction-switch { gap: .35rem; }
.crossword-page .direction-switch button,
.crossword-page .alphabet-keys button,
.crossword-page .clue-actions button { min-height: 44px; padding: .4rem .6rem; font-size: .88rem; }
.crossword-page .direction-switch button { min-width: 0; }
.crossword-page .alphabet-keys button { min-width: 44px; }
.play-workspace .clue-actions button { flex: 1 1 auto; }
.grid-frame { display:flex;justify-content:center; width: 100%; min-width: 0; box-sizing: border-box; }

/* The sidebar and browser width do not determine the space available to the puzzle. */
@container player (max-width: 439px) {
    .player-progress-label,
    .grid-size-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }
    .player-progress-count { display: inline; }
    .player-progress-meter progress { width: 55px; }
    .grid-toolbar .grid-size-control { width: 100%; }
    .grid-size-control select { width: 100%; }
}
@container player (min-width: 440px) {
    .player-action-group { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container player (min-width: 700px) {
    .player-heading {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas: "title back" "title summary";
    }
    .player-heading > .player-back-link { justify-self: end; }
    .player-heading > .play-summary { max-width: 420px; }
    .play-workspace.grid-player {
        grid-template-columns: minmax(0, var(--player-board-width, 650px)) clamp(200px, 27%, 300px);
        grid-template-areas: "toolbar toolbar" "help help" "board panel" "alphabet panel" "navigation panel" "clues clues";
        justify-content: center;
    }
    .player-side-panel {
        grid-area: panel;
        display: flex;
        flex-direction: column;
        align-self: start;
        gap: .75rem;
        min-width: 0;
        position: sticky;
        top: .75rem;
    }
    .player-side-panel .player-action-group { grid-template-columns: minmax(0, 1fr); }
}

/* Fullscreen reuses the same workspace, with one bounded scroll owner. */
.player-focus-shell,.player-focus-dialog,.player-focus-body { display: contents; }
body.crossword-focus { overflow: hidden; }
body.crossword-focus .sidebar,body.crossword-focus main > .top-row { display: none; }
body.crossword-focus .page { overflow: visible; }
.player-focus-shell.is-focus-open {
    display: block;
    position: fixed;
    z-index: 1040;
    top: var(--focus-top, 0px);
    left: 0;
    right: 0;
    height: 100vh;
    height: var(--focus-height, 100dvh);
    max-height: calc(100dvh - var(--focus-top, 0px));
    overflow: hidden;
    background: #f7f9f5;
}
.is-focus-open .player-focus-dialog {
    display: flex;
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    margin: 0;
    pointer-events: auto;
}
.crossword-page.focus-active {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: #f7f9f5;
}
.focus-active > .player-heading {
    display: block;
    flex: 0 0 auto;
    margin: 0;
    padding: max(.6rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) .5rem max(1rem, env(safe-area-inset-left));
    border-bottom: 1px solid #d1dfce;
}
.focus-active .player-heading > .play-summary { max-width: none; }
.focus-active .player-heading > .puzzle-header,
.focus-active .player-heading > .player-back-link,
.focus-active > .account-progress,
.focus-active .grid-clue-list,
.focus-active .play-workspace > details.grid-help { display: none; }
.focus-active .player-focus-body {
    display: block;
    flex: 1 1 0%;
    min-height: 0;
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-x pan-y pinch-zoom;
    scroll-padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    padding: .5rem max(1rem, env(safe-area-inset-right)) calc(1.5rem + env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
}
.focus-active .grid-frame { overflow: visible; }
