/* Keep the game close to the top without shrinking its touch controls. */
body[data-difficulty] header{height:68px}
body[data-difficulty] .sudoku-main{margin-top:8px}
body[data-difficulty] .breadcrumb{margin-bottom:8px}
body[data-difficulty] .page-heading{margin-bottom:12px}
body[data-difficulty] .page-heading .eyebrow{display:none}
body[data-difficulty] .page-heading h1{font-size:28px;line-height:1.2;margin:0;letter-spacing:-.8px}
body[data-difficulty] .page-heading p{display:none}
body[data-difficulty] .puzzle-toolbar #archive-date-label{font-size:20px;letter-spacing:-.4px}
body[data-difficulty] .date-navigation>button:not(.date-trigger){width:44px;height:44px;font-size:23px}
body[data-difficulty] .difficulty-label{display:none}
body[data-difficulty] .board-panel{padding:14px 20px 18px}
body[data-difficulty] .board-top{margin-bottom:10px}
body[data-difficulty] .board,body[data-difficulty] .queens-board-wrap{width:min(100%,470px,max(300px,calc(100svh - 340px)));max-width:470px}
body[data-difficulty] .queens-board{width:100%;max-width:none}
body[data-difficulty] .under-board{margin-top:10px}
body[data-difficulty] .game-tools{margin-top:10px}
body[data-difficulty] .board-caption{margin:10px 0 0;line-height:1.5}
body[data-difficulty] .region-guide{margin:10px 0 0}
body[data-difficulty] .auto-clean-setting{margin-top:6px}
body[data-difficulty] .notes-mode-indicator{margin-top:6px}
@media(max-width:850px){
 body[data-difficulty] .workspace{grid-template-columns:1fr}
 body[data-difficulty] .side{grid-row:2}
}
@media(max-width:600px){
 body[data-difficulty] header{height:auto;min-height:64px;padding:10px 16px;gap:8px;flex-wrap:wrap}
 body[data-difficulty] header .nav-note{display:none}
 body[data-difficulty] header nav{gap:16px}
 body[data-difficulty] header nav a{font-size:12px;padding:6px 0}
 body[data-difficulty] .sudoku-main{margin:8px 14px 32px}
 body[data-difficulty] .breadcrumb{display:none}
 body[data-difficulty] .page-heading{margin-bottom:8px}
 body[data-difficulty] .page-heading h1{font-size:24px}
 body[data-difficulty] .puzzle-toolbar #archive-date-label{font-size:17px;line-height:1.25}
 body[data-difficulty] .date-trigger{min-width:0}
 body[data-difficulty] .board-panel{padding:10px 12px 16px;border-radius:16px}
 body[data-difficulty] .board,body[data-difficulty] .queens-board-wrap{width:min(100%,470px,max(280px,calc(100svh - 380px)))}
 body[data-difficulty] .queens-board{width:100%}
 body[data-difficulty] .board-top{margin-bottom:8px}
 body[data-difficulty] .game-tools{gap:6px}
 body[data-difficulty] .game-tools button{padding:10px;min-height:44px}
}


/* Date browsing above the card; difficulty belongs to the game. */
body[data-difficulty] .puzzle-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px}
body[data-difficulty] .puzzle-day{min-width:0}
body[data-difficulty] .date-navigation{margin:0;display:flex;align-items:center;flex-wrap:nowrap;gap:10px}
body[data-difficulty] .date-trigger{min-width:0}
body[data-difficulty] .archive-controls:has(#back-today[hidden]){display:none}
body[data-difficulty] .date-context{font-size:11px;color:#4d6659;letter-spacing:0;text-transform:none;order:-1}
body[data-difficulty] .puzzle-toolbar .archive-hint{margin:0;font-size:13px;font-weight:600;white-space:nowrap}
body[data-difficulty] .puzzle-toolbar .archive-hint a{display:inline-flex;align-items:center;min-height:44px}
body[data-difficulty] .board-panel>.difficulty-row{display:flex;justify-content:center;align-items:center;margin:0 0 12px;padding:0;border:0}
body[data-difficulty] .board-panel>.difficulty-row .level-nav{width:min(100%,470px);box-sizing:border-box;justify-content:center}
body[data-difficulty] .board-panel>.difficulty-row .level-nav a,body[data-difficulty] .board-panel>.difficulty-row .level-nav span{flex:1;text-align:center;min-height:44px;padding:12px 16px;box-sizing:border-box}
@media(max-width:600px){
 body[data-difficulty] .date-context{font-size:10px}
 body[data-difficulty] .puzzle-day{flex:1 1 100%}
 body[data-difficulty] .date-navigation{gap:6px}
 body[data-difficulty] .date-trigger{flex:1}
 body[data-difficulty] .date-context{display:none}
 body[data-difficulty] .puzzle-toolbar .archive-hint{font-size:12px}
 body[data-difficulty] .board-panel>.difficulty-row{margin-bottom:10px}
 body[data-difficulty] .board-panel>.difficulty-row .level-nav a,body[data-difficulty] .board-panel>.difficulty-row .level-nav span{padding:10px 8px}
}

body[data-difficulty] .game-date{display:none}

.game-recovery{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}
.game-recovery button{margin-top:10px;min-height:44px;padding:10px 16px;border:1px solid #62846b;border-radius:10px;background:#eef3e8;color:#183e35;font:inherit;cursor:pointer}
.game-recovery button[hidden]{display:none}

/* One layout contract for every playable puzzle. Game CSS owns board contents. */
body[data-difficulty]{--puzzle-board-width:min(100%,470px,max(300px,calc(100svh - 340px)))}
body[data-difficulty] .board,
body[data-difficulty] .queens-board-wrap,
body[data-difficulty] .collection-board{width:var(--puzzle-board-width);max-width:470px;margin-inline:auto}
body[data-difficulty] .board-top:not(:has(.notes-mode-indicator)){display:none}
body[data-difficulty] .game-tools{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;margin-top:14px}
body[data-difficulty] .game-tools button,
body[data-difficulty] .number-entry button{min-height:44px;padding:10px 15px;border:1px solid #b9c9bc;border-radius:8px;background:#f6f8f0;color:#34523c;font:600 13px 'DM Sans',Arial,sans-serif;cursor:pointer}
body[data-difficulty] .game-tools button[aria-pressed=true]{background:#183e35;border-color:#183e35;color:#fff}
body[data-difficulty] .game-tools button:disabled{opacity:.45;cursor:default}
body[data-difficulty] .game-tools button[hidden]{display:none}
body[data-difficulty] .number-entry,.word-list{max-width:470px;margin:14px auto 0}
body[data-difficulty] #collection-status{min-height:24px;font-size:14px;line-height:1.6;color:#4d6659;margin:14px 0 0;text-align:center}
body[data-difficulty] .intro-panel,body[data-difficulty] .rules-panel{border-radius:22px}
body[data-difficulty] .rules-panel{padding:25px 28px}
body[data-difficulty] .rule p{font-size:14px;line-height:1.7}
body[data-difficulty] .collection-board.loop{gap:0;background:transparent}
body[data-difficulty] .collection-board.bridges{background:linear-gradient(#f7f8f2,#eef3e8)}
@media(hover:hover){
 body[data-difficulty] .game-tools button:not(:disabled):not([aria-pressed=true]):hover,
 body[data-difficulty] .number-entry button:not(:disabled):hover{background:#e9eee2;border-color:#62846b}
}
@media(max-width:600px){
 body[data-difficulty]{--puzzle-board-width:min(100%,470px,max(280px,calc(100svh - 380px)))}
 body[data-difficulty] .game-tools{gap:6px}
 body[data-difficulty] .game-tools button{padding:10px 12px}
 body[data-difficulty] .rules-panel{padding:22px}
}

/* Keep puzzle actions together above the board, in a stable wrapping row. */
body[data-difficulty] .board-panel>.puzzle-actions,
body[data-puzzle=word-trails] .board-panel>.puzzle-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;width:100%;max-width:470px;gap:8px;margin:0 auto 12px;min-height:44px}
body[data-difficulty] .puzzle-actions .notes-mode-indicator{margin:0;width:112px;flex-shrink:0}
body[data-puzzle=word-trails] .puzzle-actions #selection-clear{display:block;min-height:44px;padding:10px 15px}
body[data-puzzle=word-trails] .puzzle-actions #selection-clear[hidden]{display:none}
body[data-difficulty] .board-panel>.number-entry{margin:0 auto 12px}
@media(max-width:600px){body[data-difficulty] .board-panel>.puzzle-actions{gap:6px}body[data-difficulty] .puzzle-actions button{padding:10px 12px}}

/* Tighten the breathing room above the game without changing reserved ad dimensions. */
body[data-difficulty] main>.ad-reserve{margin-top:8px;margin-bottom:12px}


/* Give the Nonograms board breathing room inside its card. */
body[data-puzzle=nonograms] .board-panel{padding-bottom:56px}
@media(max-width:600px){body[data-puzzle=nonograms] .board-panel{padding-bottom:48px}}

.game-tools #completion-result{border-color:#62846b;color:#34523c}

/* Launch pass: consistent cards, controls and small-screen breathing room. */
body[data-difficulty] .workspace{align-items:start}
body[data-difficulty] .board-panel{padding-bottom:48px}
body[data-difficulty] .game-tools button:focus-visible,body[data-difficulty] .number-entry button:focus-visible{outline:2px solid #ee805c;outline-offset:3px}
body[data-difficulty] #completion-result[hidden]{display:none}
body[data-puzzle=number-trail] .number-entry label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
body[data-puzzle=number-trail] .number-entry input{width:72px;box-sizing:border-box}
@media(max-width:600px){
 body[data-difficulty] .board-panel{padding-bottom:40px}
 body[data-puzzle=nonograms] .collection-board{--clue-unit:12px}
 body[data-puzzle=nonograms] .collection-clue{font-size:11px}
 body[data-puzzle=sudoku] .board-panel>.puzzle-actions{display:grid;grid-template-columns:1.3fr repeat(3,minmax(0,1fr));gap:6px}
 body[data-puzzle=sudoku] .puzzle-actions button{width:100%;min-width:0;padding-inline:5px;font-size:12px}
 body[data-puzzle=sudoku] .puzzle-actions #completion-result{grid-column:1/-1}
 body[data-puzzle=number-trail] .number-entry{gap:6px}
 body[data-puzzle=number-trail] .number-entry button{padding-inline:10px;font-size:12px}
 body[data-difficulty] .date-navigation>button:not(.date-trigger){flex-shrink:0}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
