/* YAOKU: compact utility header, one mode row, board, card bank, actions.
   Puzzle geometry remains the original 6×6; no game or service rules live here. */
body.game-page{--bg:#fff;--cell:#fff;--ink:#252921;--muted:#62675d;--line:#d6d9d2;--clue:#eceee8;--accent:#526743;--selected:#e1ead9;--related:#f1f5ed;font:14px/1.45 Arial,Helvetica,sans-serif;transition:none}
body.game-page.dark{--bg:#22251f;--cell:#2c3028;--ink:#e6e5d9;--muted:#b0b5a7;--line:#505648;--clue:#383d32;--accent:#b0bf99;--selected:#4e5b3e;--related:#343c2c}
.game-page *,.game-page *::before,.game-page *::after{box-shadow:none;transition:none}
.game-page [hidden]{display:none!important}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body.game-page .site-header{display:block;width:100%;max-width:512px;margin:0 auto;padding:0 16px;border:0}
.game-header-row{display:grid;grid-template-columns:88px minmax(0,1fr) 88px;align-items:center;height:56px;border-bottom:1px solid var(--line)}
.game-page .wordmark{display:flex;justify-content:center;margin:0;font:700 26px/1 Arial,Helvetica,sans-serif;letter-spacing:2px;text-indent:2px}
.header-help,.header-tools{display:flex;align-items:center;gap:0}
.header-tools{justify-content:flex-end}
.game-header-row .icon-button,.game-header-row #stats,.game-header-row #settings{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:10px;border:0;border-radius:3px;background:transparent;color:var(--ink)}
.game-header-row .icon-button:hover{background:var(--selected)}
.icon-button svg{display:block;width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.game-page main{max-width:512px;margin:0 auto}
.game-page .puzzle-section{max-width:none;width:100%;padding:0 16px}
.game-page .game-modes{display:flex;justify-content:center;gap:8px;margin:0 16px 4px;border-bottom:1px solid var(--line)}
.game-page .game-modes a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:72px;padding:8px 14px;border-bottom:2px solid transparent;font-size:13px;color:var(--muted)}
.game-page .game-modes a[aria-current=page]{border-bottom-color:var(--accent);font-weight:700;color:var(--ink)}
.game-page #difficulty-controls{width:max-content;max-width:100%;margin:8px auto 0;gap:0;padding:0;border-radius:3px}
.game-page .difficulty button{min-height:44px;padding:7px 18px;border-radius:2px;font-size:12px}
.game-page .mode-heading{display:flex;align-items:center;justify-content:space-between;min-height:18px;margin:8px 0 0;gap:8px}
.game-page .eyebrow{font:10px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.6px}
.game-page .mode-heading a{font-size:11px;min-height:32px;display:flex;align-items:center}
.game-page .play-layout,.game-page .board-panel{display:block}
.game-page .board-meta{display:flex;align-items:center;justify-content:space-between;min-height:40px;margin:0 0 6px;font:11px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.3px;gap:8px}
.game-page .timer-group{display:flex;align-items:center;gap:6px;flex-shrink:0;font-variant-numeric:tabular-nums}
.game-page .timer-group button{min-width:44px;min-height:44px;padding:0;font-size:16px}
.game-page .board{gap:8px}
.game-page .cell{font-family:Arial,Helvetica,sans-serif;font-size:29px;border:2px solid var(--line);border-radius:0;line-height:1;padding:0}
.game-page .cell.clue{border:0;font-family:Arial,Helvetica,sans-serif}
.game-page .cell.selected{border:2px solid var(--accent)}
.game-page .cell.given{font-weight:700}
.game-page .cell.given::after{bottom:5px}
.game-page .clue-label{font-size:13px;gap:2px}
.game-page .clue-label.down{top:7px;left:6px}
.game-page .clue-label.across{bottom:7px;right:6px}
.game-page .clue-label.only{position:static}
.game-page .badge{font-family:Arial,Helvetica,sans-serif;width:24px;height:24px;font-size:10px;box-shadow:0 0 0 2px var(--bg)}
.game-page .notes-grid{font-family:Arial,Helvetica,sans-serif;font-size:10px}
.game-page .cards-heading{display:flex;align-items:center;justify-content:space-between;margin:12px 0 7px;min-height:22px}
.game-page .cards-heading h2{font:600 12px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.8px;text-transform:uppercase;margin:0}
.game-page .pill{border:0;padding:0;font:11px Arial,Helvetica,sans-serif}
.game-page .cards{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;min-height:0}
.game-page .card{font:600 23px/1 Arial,Helvetica,sans-serif;aspect-ratio:auto;height:46px;min-height:46px;border:1px solid var(--line);border-radius:3px;background:var(--clue);padding:0}
.game-page .card:not(:disabled):hover{transform:none;background:var(--selected);border-color:var(--accent)}
.game-page .card.used{opacity:.35;background:transparent;text-decoration:line-through;text-decoration-thickness:1px}
.game-page .card:not(:disabled):active{background:var(--selected);outline:2px solid var(--accent);outline-offset:-2px}
.game-page .tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:12px 0 0;padding:0;border:0}
.game-page .tools button{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:5px;min-height:44px;min-width:0;padding:4px 2px;border:1px solid var(--line);border-radius:3px;font-size:12px;background:transparent;color:var(--ink)}
.game-page .tools button span{font-size:17px;line-height:1}
.game-page .tools button:hover,.game-page .tools button[aria-pressed=true]{background:var(--selected)}
.game-page .tools button[aria-pressed=true]{border-color:var(--accent);outline:1px solid var(--accent)}
.game-page .secondary-tools{display:flex;justify-content:center;gap:8px;margin-top:7px}
.game-page .secondary-tools button{display:inline-flex;flex:0 1 136px;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:7px 14px;border:1px solid var(--line);border-radius:3px;font-size:12px;background:transparent;color:var(--ink)}
.game-page .secondary-tools button:hover{background:var(--selected)}
.game-page .board-bottom{display:flex;align-items:center;gap:12px;margin-top:9px;font-size:10px}
.game-page .status{font-size:12px;line-height:1.4;min-height:28px;margin:6px 0;text-align:center}
.game-page .puzzle-options,.game-page .daily-details{border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.puzzle-options>summary,.game-page .daily-details summary{cursor:pointer;min-height:44px;padding:12px 0;list-style-position:inside;text-align:center}
.daily-details:not(:has(#daily-note:not([hidden]))){display:none}
.game-page .daily-note{font-size:11px;line-height:1.6;margin:0 0 10px}
.game-page .game-foot{border:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:0;padding:4px 0 12px;font-size:11px}
.game-page .game-foot>span{width:100%;justify-content:center}
.game-page .game-foot button{min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:3px;font-size:12px}
.game-page .game-foot .text-button{margin:0}
.game-page .game-about{margin:0 16px;padding:0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.game-page .game-about summary{cursor:pointer;min-height:44px;padding:12px 0;text-align:center;list-style-position:inside}
.game-about p{margin:7px 0;line-height:1.6}
.game-about a{text-decoration:underline;text-underline-offset:2px}
.game-page .legal-footer{display:flex;flex-direction:column;gap:2px;max-width:480px;margin:0 auto;padding:8px 0 16px;text-align:center;justify-content:center;border-top:1px solid var(--line)}
.game-page .legal-footer nav{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}
.game-page .legal-footer nav a{display:inline-flex;align-items:center;min-height:44px;font-size:11px}
.game-page .legal-footer p,.free-label{margin:0;font:10px Arial,Helvetica,sans-serif;color:var(--muted)}
.game-page dialog{width:calc(100% - 24px);max-width:440px;max-height:calc(100dvh - 24px);padding:20px;border-radius:4px;box-shadow:none;overscroll-behavior:contain}
.game-page dialog::backdrop{backdrop-filter:none;background:#1d241d88}
.game-page dialog h2{font:600 22px/1.2 Arial,Helvetica,sans-serif;letter-spacing:0;margin:0}
.game-page dialog h3{font-size:14px;margin:14px 0 7px}
.game-page dialog p{font-size:13px;line-height:1.5}
.game-page .dialog-heading{gap:12px;align-items:center;margin-bottom:10px}
.game-page .dialog-heading>.close-dialog{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:28px;line-height:1;padding:0}
.game-page .dialog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.game-page .dialog-actions button,.game-page .primary{min-height:44px;padding:9px 16px;border:1px solid var(--line);border-radius:3px;font-size:12px}
.game-page .text-button{display:inline-flex;align-items:center;min-height:44px;font-size:12px;margin:8px 0 0;text-decoration:underline;text-underline-offset:3px}
.quick-rules{padding-left:18px;font-size:13px;color:var(--muted);line-height:1.5}
.quick-rules li{margin:8px 0}
.quick-rules strong{color:var(--ink)}
.rule-examples{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0;text-align:center;color:var(--muted)}
.rule-examples small{display:block;margin-top:6px;font-size:12px}
.sum-demo,.product-demo{display:flex;justify-content:center;align-items:center;gap:4px;height:44px}
.sum-demo>span,.product-demo>span:not(.demo-badge){display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:38px;border:1px solid var(--line);background:var(--cell);font-size:19px;color:var(--ink)}
.sum-demo>.demo-clue{font-size:13px;background:var(--clue)}
.demo-badge{display:inline-block;flex:none;position:relative;width:24px;height:24px;border:1px solid var(--accent);font-size:10px;color:var(--ink);background:linear-gradient(135deg,transparent 48%,var(--accent) 49%,var(--accent) 51%,transparent 52%)}
.demo-badge b{position:absolute;top:0;left:3px;font-weight:400}.demo-badge i{position:absolute;bottom:0;right:3px;font-style:normal}
.rules-details{margin:12px 0 0;border-top:1px solid var(--line);font-size:12px}
.rules-details summary{min-height:44px;cursor:pointer;padding:12px 0}
.menu-mode-links{display:flex;flex-direction:column;align-items:stretch;gap:0;margin:8px 0}
.menu-mode-links a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid var(--line);font-size:14px}
.menu-links{display:flex;flex-wrap:wrap;gap:0 20px}
.menu-links a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;text-decoration:underline}
.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.settings-row button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;border:1px solid var(--line);border-radius:3px;padding:8px 12px;color:var(--ink)}
.settings-row .theme{font-size:20px}.settings-row .theme span{font-size:12px}.settings-row #leaderboard{font-size:12px;color:var(--muted)}
.local-settings{border:0;padding:0;margin:12px 0}.local-settings legend{font-size:13px;font-weight:600}.local-settings label{display:flex;align-items:center;gap:10px;min-height:44px;font-size:13px}.local-settings input{width:20px;height:20px;flex:none;accent-color:var(--accent)}
#clear-local-data,#confirm-clear-local,#cancel-clear-local{min-height:44px;padding:8px 12px;border:1px solid var(--line);margin:4px 0}
.game-page .stat-row{padding:11px 0;gap:12px;font-size:13px}.game-page .stat-row span{font-size:12px;text-align:right}.game-page #local-stats-content p{margin:8px 0}
#leaderboard-content input{font:14px Arial,Helvetica,sans-serif;width:100%;min-height:44px;padding:8px;border:1px solid var(--line);background:var(--cell);color:var(--ink)}
#leaderboard-content button{min-height:44px;padding:8px 12px;border:1px solid var(--line)}
#leaderboard-content table{width:100%;border-collapse:collapse;font-size:12px}#leaderboard-content th,#leaderboard-content td{text-align:left;padding:8px 4px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.game-page .collection-section{max-width:none;padding:0 16px 20px}.game-page .collection-heading{padding:14px 0;border:0;text-align:left}.game-page .collection-heading h2{font:600 23px/1.3 Arial,Helvetica,sans-serif;letter-spacing:0;margin:5px 0}.game-page .collection-subtitle{font:13px/1.4 Arial,Helvetica,sans-serif}.game-page .release-note{font-size:12px;margin:8px 0 0}.game-page .collection-toolbar{padding-top:12px;flex-wrap:wrap}.game-page .collection-toolbar label{width:100%;min-height:44px}.game-page .puzzle-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}.game-page .puzzle-tile{padding:12px;min-height:96px}.game-page .puzzle-tile strong{font:600 20px/1.2 Arial,Helvetica,sans-serif}
.game-page .cover p{font:500 20px/1.3 Arial,Helvetica,sans-serif}.game-page .loader{animation:none;border-color:var(--accent);width:20px;height:20px}
.game-page.no-selected-highlight .cell.selected{border-color:var(--line);background:var(--cell)}.game-page.no-related-highlight .cell.related{background:var(--cell)}
body.game-page.high-contrast{--bg:#fff;--cell:#fff;--ink:#111;--muted:#333;--line:#555;--accent:#18562b;--selected:#d9efdf}body.game-page.high-contrast.dark{--bg:#101510;--cell:#151b15;--ink:#fff;--muted:#e0e5e0;--line:#b7c8b7;--accent:#94edaa;--selected:#294b30}
.game-page.high-contrast .cell.clue{background:#c9c9c9;color:#111}.game-page.high-contrast.dark .cell.clue{background:#484e48;color:#fff}
.game-page :focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.game-page.reduced-motion *,.game-page.reduced-motion *::before,.game-page.reduced-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(max-width:430px){.game-page .cards{grid-template-columns:repeat(6,minmax(0,1fr))}.game-page .card{height:46px}.game-page .cell{font-size:26px}}
@media(max-width:370px){body.game-page .site-header{padding:0 12px}.game-page .puzzle-section{padding:0 12px}.game-page .game-modes{margin-left:12px;margin-right:12px}.game-page .wordmark{font-size:23px;letter-spacing:1px;text-indent:1px}.game-page .board{gap:7px}.game-page .cell{font-size:23px}.game-page .clue-label{font-size:11px}.game-page .badge{width:22px;height:22px;font-size:10px}.game-page .cards{gap:5px}.game-page .card{font-size:22px}.game-page .tools button{font-size:11px;gap:3px}.game-page .tools button span{font-size:15px}.game-page .board-bottom{font-size:9px;gap:8px}.game-page .game-about{margin:0 12px}.game-page .legal-footer{margin:0 12px}.game-page dialog{padding:16px}}
@media(prefers-reduced-motion:reduce){.game-page *{animation:none!important;transition:none!important}}
.stats-details{border-top:1px solid var(--line);margin-top:12px;font-size:12px}.stats-details>summary{cursor:pointer;min-height:44px;padding:12px 0;list-style-position:inside}
