:root{--bg: #0b0c0f;--panel: #14161b;--text: #eaeef7;--muted: #9aa3b2;--accent: #5b9cff;--cell: #1b1e25;--cell-border: #2a2f39;--cell-selected: #2b67ff55}@media (prefers-color-scheme: light){:root{--bg: #f5f7fb;--panel: #ffffff;--text: #0b0c0f;--muted: #647084;--accent: #245cff;--cell: #ffffff;--cell-border: #e5e9f0;--cell-selected: #245cff22}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.4 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}.app{min-height:100%;display:grid;grid-template-rows:auto 1fr}.topbar{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--panel);border-bottom:1px solid var(--cell-border)}.branding{display:flex;align-items:center;gap:8px}.logo{font-size:20px}.title,.author{display:none}.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.controls input[type=number]{width:56px}.controls button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:8px 10px;cursor:pointer}.controls .checkbox{display:flex;gap:6px;align-items:center;font-size:12px;color:var(--muted)}.layout{display:grid;grid-template-columns:1fr;gap:12px;padding:12px}.grid-section{background:var(--panel);border:1px solid var(--cell-border);border-radius:12px;padding:12px;display:grid;place-items:center}.clues-section{background:var(--panel);border:1px solid var(--cell-border);border-radius:12px;padding:10px;overflow:auto}.grid{width:100%;max-width:800px;aspect-ratio:1/1;display:grid;gap:2px;padding:4px;background:var(--cell-border);border-radius:8px;grid-auto-rows:1fr}.cell{position:relative;background:var(--cell);border:1px solid var(--cell-border);display:grid;place-items:center}.cell.block{background:#0b0c0f}.cell.selected{outline:2px solid var(--cell-selected)}.cell .number{position:absolute;top:2px;left:2px;font-size:10px;color:var(--muted)}.cell .letter{width:100%;height:100%;background:transparent;border:none;text-align:center;font-size:calc(15px + 1.6vmin);color:var(--text);text-transform:uppercase}.cell .letter:focus{outline:none}.clues{display:grid;gap:12px}.clue-list h3{margin:6px 0 8px}.clue-list ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}.clue-item{display:grid;grid-template-columns:40px 1fr;align-items:center;gap:8px}.clue-item .goto{width:40px;height:28px;border-radius:6px;border:1px solid var(--cell-border);background:transparent;color:var(--text)}.clue-item .clue-input{background:transparent;border:1px solid var(--cell-border);border-radius:6px;padding:6px 8px;color:var(--text)}.muted{color:var(--muted)}.spinner{width:16px;height:16px;border:2px solid color-mix(in lab,var(--muted) 40%,transparent);border-top-color:var(--accent);border-radius:50%;display:inline-block;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.generator-panel{border:1px solid var(--cell-border);border-radius:10px;padding:10px;background:transparent}.generator-panel h3{margin:6px 0 8px;color:inherit}.generator-panel .actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;align-items:center}.generator-panel button{background:var(--panel);color:var(--text);border:1px solid var(--cell-border);border-radius:8px;padding:8px 10px;cursor:pointer}.generator-panel textarea{width:100%;background:transparent;color:inherit;border:1px solid var(--cell-border);border-radius:6px;padding:8px}.generator-panel .backtrack-options{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}.clue-item .goto{display:inline-flex;align-items:center;justify-content:center;font-weight:600}.options-panel{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.options-panel textarea{width:100%;max-width:420px;background:transparent;color:inherit;border:1px solid var(--cell-border);border-radius:6px;padding:6px}.options-panel button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:8px 10px;cursor:pointer}.options-panel label{display:inline-flex;align-items:center;gap:6px;color:var(--muted)}@media (min-width: 880px){.layout{grid-template-columns:1fr 360px;gap:16px;padding:16px}.controls input[type=number]{width:64px}.topbar{padding:12px 16px}}@media (min-width: 1200px){.grid{max-width:900px}}@media print{.topbar,.controls,.clue-item .goto{display:none}.layout{grid-template-columns:1fr 1fr}body{background:#fff;color:#000}.grid-section,.clues-section{border:none}}