/* Reserve the game space before the module loads so the links below do not jump. */
.crossword { min-height:680px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px; }
.crossword-top { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:20px; }
.crossword-top h2 { margin:0; font:500 1.65rem/1.2 "Fraunces",Georgia,serif; letter-spacing:-.03em; color:var(--ink); }
.crossword-top select { min-height:44px; border:1px solid var(--line); border-radius:8px; padding:8px; background:white; color:var(--ink); font:600 .85rem "Manrope",Arial,sans-serif; }
.crossword-layout { display:grid; grid-template-columns:minmax(0,380px) minmax(0,1fr); gap:32px; align-items:start; }
.crossword-board { min-width:0; }
.cw-active-clue { min-height:76px; margin-bottom:12px; padding:10px 12px; background:var(--soft); border-radius:8px; display:flex; gap:12px; align-items:center; }
.cw-active-clue p { margin:0; font-size:.92rem; line-height:1.5; color:var(--ink); }
.cw-direction { flex:none; background:transparent; border:0; padding:4px 0; min-height:44px; color:var(--slate); font:700 .8rem/1.5 "Manrope",Arial,sans-serif; cursor:pointer; }
.cw-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); width:100%; aspect-ratio:1; border:2px solid var(--ink); gap:1px; background:var(--ink); }
.cw-square { position:relative; min-width:0; background:#fff; display:flex; }
.cw-row { display:contents; }
.cw-square.cw-black { background:var(--ink); }
.cw-square > span { position:absolute; left:5px; top:2px; font:600 .73rem/1.4 "Manrope",Arial,sans-serif; color:var(--ink); pointer-events:none; z-index:1; }
.cw-square input { width:100%; min-width:0; height:100%; border:0; border-radius:0; padding:12px 0 0; background:transparent; color:var(--ink); text-align:center; font:600 clamp(1.3rem,5vw,2rem)/1 "Manrope",Arial,sans-serif; caret-color:var(--slate); box-shadow:none; }
.cw-in-word { background:#e8eef1; }
.cw-selected { background:#c8dce6; box-shadow:inset 0 0 0 2px var(--slate); }
.cw-wrong::after { content:"!"; position:absolute; right:4px; top:0; font-size:.75rem; font-weight:800; color:#8a3029; pointer-events:none; }
.cw-square input:focus-visible { outline:2px solid var(--slate); outline-offset:-3px; }
.cw-actions { display:flex; align-items:center; gap:8px; margin-top:14px; }
.cw-actions .app-button { font-size:.85rem; padding:10px 14px; }
.cw-reset { margin-left:auto; background:transparent; border:0; color:var(--muted); font:600 .8rem "Manrope",Arial,sans-serif; min-height:44px; padding:8px 0 8px 8px; cursor:pointer; }
.cw-status { margin:8px 0; min-height:1.5em; color:var(--slate); font-size:.8rem; line-height:1.5; }
.cw-extra { border-top:1px solid var(--line); margin-top:12px; padding:14px 0 0; color:var(--ink); font-size:.9rem; line-height:1.65; }
.cw-extra strong { font-size:1rem; }
.cw-extra p { margin:6px 0; }
.cw-extra .cw-example { color:var(--muted); font-style:italic; }
.cw-next { margin-top:12px; }
.cw-clues { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.cw-clues h3 { font:500 1.3rem "Fraunces",Georgia,serif; margin:0 0 10px; padding-bottom:10px; border-bottom:1px solid var(--line); color:var(--ink); }
.cw-clues ol { list-style:none; padding:0; margin:0; }
.cw-clues button { display:flex; align-items:flex-start; width:100%; gap:7px; border:0; border-radius:6px; background:transparent; color:var(--ink); text-align:left; padding:10px 5px; min-height:44px; font:500 .85rem/1.5 "Manrope",Arial,sans-serif; cursor:pointer; }
.cw-clues button[aria-pressed=true] { background:var(--soft); box-shadow:inset 2px 0 var(--slate); }
.cw-number { flex:none; font-weight:800; min-width:10px; }
.cw-tick { margin-left:auto; color:var(--slate); flex:none; }
.cw-help { margin-top:20px; padding-top:0; font-size:.85rem; }
.cw-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.crossword-page .crossword-top h2 { display:none; }
.crossword-page .crossword-top { justify-content:flex-end; }
@media(max-width:760px) {
 .crossword { padding:16px; border-radius:12px; }
 .crossword-top { margin-bottom:12px; }
 .crossword-top h2 { font-size:1.3rem; }
 .crossword-layout { grid-template-columns:1fr; gap:24px; }
 .crossword-board { width:min(100%,400px); margin:auto; }
 .cw-active-clue { min-height:66px; gap:10px; padding:8px 10px; }
 .cw-active-clue p { font-size:.85rem; }
 .cw-clues { gap:12px; }
 .cw-clues button { font-size:.8rem; padding:9px 4px; }
 .cw-actions .app-button { padding:10px 12px; }
}
@media(max-width:360px) { .crossword { padding:12px; } .crossword-top h2 { font-size:1.15rem; } .cw-actions { gap:6px; } .cw-actions .app-button { padding:10px; font-size:.8rem; } }