#app{flex:1;display:flex;justify-content:center;padding:12px 10px 20px;max-width:900px;margin:0 auto;width:100%}
.board-wrap{width:100%;max-width:560px}
.clue-bar{background:var(--bg);padding:4px 0 6px}
.clue-current{font-size:1rem;font-weight:bold;background:var(--panel);border:1px solid var(--cell-border);border-radius:8px;padding:9px 12px;min-height:1.3em}
.board-actions{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.ayuda{font-size:.85rem;color:var(--muted);margin:.7em 0}
.status{font-weight:700;min-height:1.4em}
.ad-rejilla{display:grid;grid-template-columns:repeat(var(--cols),1fr);border:2px solid var(--block);background:var(--block);gap:1px;width:100%;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.ad-c{position:relative;aspect-ratio:1;background:#fff;display:flex;align-items:center;justify-content:center;font:700 clamp(1rem,5.4vw,1.6rem) system-ui,sans-serif;color:#1d1d1f;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ad-c.pal{background:var(--focus-word)}
.ad-c.foco{background:var(--focus-cell)}
.ad-c.mal{color:#c0392b}
.ad-c.mal::after{content:"";position:absolute;left:8%;right:8%;top:50%;border-top:2px solid #c0392b;transform:rotate(-35deg)}
.ad-c.rev{color:#1b5e9e}
.ad-c.ok{background:var(--correct)}
.ad-d{position:relative;aspect-ratio:1;background:#e7e1d1;display:flex;flex-direction:column;cursor:pointer;overflow:hidden;-webkit-tap-highlight-color:transparent}
.ad-d.vacia{background:#3b4250;cursor:default}
.ad-d .df{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;font:600 clamp(6.4px,1.85vw,10.5px)/1.12 system-ui,-apple-system,sans-serif;color:#2a2f38;padding:1px 6px 1px 2px;position:relative;overflow:hidden;hyphens:manual}
.ad-d .df+.df{border-top:1px solid #b9b19c}
.ad-d .df.abajo{padding:1px 2px 5px}
.ad-d .df.sel{background:var(--focus-cell)}
.ad-d .df .fl{position:absolute;color:#b3261e;font-size:9px;line-height:1}
.ad-d .df.dcha .fl{right:0;top:50%;transform:translateY(-50%)}
.ad-d .df.abajo .fl{bottom:-1px;left:50%;transform:translateX(-50%)}
.ad-d .df.hecha{color:#8a8f99}
@media (min-width:600px){.ad-d .df{font-size:10.5px}}
.keyboard{display:none}
@media (pointer:coarse){
  body{padding-bottom:calc(166px + env(safe-area-inset-bottom,0px))}
  .keyboard{display:block;position:fixed;left:0;right:0;bottom:0;z-index:40;background:#d3d6dc;padding:6px 3px calc(6px + env(safe-area-inset-bottom,0px));box-shadow:0 -2px 10px rgba(0,0,0,.12);user-select:none;-webkit-user-select:none;touch-action:manipulation}
  .kb-row{display:flex;justify-content:center;gap:5px;margin:0 auto 6px;max-width:520px}.kb-row:last-child{margin-bottom:0}
  .kb-row button{flex:1 1 0;min-width:0;height:44px;border:none;border-radius:6px;background:#fff;color:#111;font:500 1.15rem -apple-system,"Helvetica Neue",Arial,sans-serif;box-shadow:0 1px 0 rgba(0,0,0,.3);-webkit-tap-highlight-color:transparent}
  .kb-row button:active{background:#b9bec7}.kb-row button.kb-wide{flex:1.5 1 0;background:#aeb3bc;font-size:1.25rem}
  .clue-bar{position:sticky;top:0;z-index:20}
}
@media print{.topbar,.board-actions,.clue-bar,.status,.footer,.keyboard,.ayuda{display:none!important}body{background:#fff;padding:0!important}.ad-c{color:transparent!important;background:#fff!important}}
