:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#333333;background:#FAFAFA;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #F3AB00;outline-offset:3px}h1,h2,h3,p{margin-top:0}
.app{max-width:1120px;margin:auto;padding:20px 24px 14px}.topbar{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:16px}.eyebrow,.section-label{font-size:.72rem;letter-spacing:.12em;font-weight:800;color:#0028A5}.eyebrow{margin:0 0 5px}h1{font-size:clamp(2rem,4vw,3rem);letter-spacing:-.045em;margin-bottom:2px;line-height:1.07}h2{font-size:1.1rem;letter-spacing:-.025em}h3{font-size:.92rem}.subtitle{color:#4D4D4D;margin:0}
.scoreboard{display:flex;gap:8px}.scoreboard>div{min-width:92px;background:#FFFFFF;border:1px solid #D7D7D7;border-radius:14px;padding:9px 14px}.scoreboard span{display:block;font-size:.72rem;color:#4D4D4D;text-transform:uppercase;letter-spacing:.08em;font-weight:700}.scoreboard strong{font-size:1.4rem;line-height:1.3}
.game-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,.72fr);gap:24px;align-items:start}.board-side{min-width:0}
.board{width:min(100%,590px,calc(100dvh - 242px));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;background:#BDC9E8;padding:8px;border-radius:17px;box-shadow:0 9px 26px #0028A512}.cell{aspect-ratio:1;min-width:0;border:0;border-radius:9px;background:#F4F6FC;color:#4D4D4D;display:grid;place-items:center;text-align:center;padding:3px;font-weight:800;letter-spacing:.015em;position:relative;line-height:1.12}.cell.empty{font-size:.68rem}.cell.bonus{background:#DBF4F9;color:#147082}.cell.word{background:#FFFFFF;color:#333333;box-shadow:0 3px 0 #C2C2C2;font-size:clamp(.58rem,1.15vw,.9rem);overflow-wrap:anywhere}.cell.selected{background:#FFDE8F;color:#333333;box-shadow:inset 0 0 0 3px #A27200}.cell.hinted{box-shadow:inset 0 0 0 3px #3062FF,0 0 0 3px #7596FF88,0 0 18px #3062FF88}.cell.hinted.selected{box-shadow:inset 0 0 0 3px #A27200,0 0 0 3px #7596FF88,0 0 18px #3062FF88}.cell .bonus-label{font-size:.58rem;letter-spacing:.06em}.cell .bonus-value{font-size:.9rem}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;color:#4D4D4D;font-size:.73rem}.legend span{display:flex;align-items:center;gap:6px}.legend-swatch{display:inline-block;width:13px;height:13px;border-radius:4px}.word-swatch{background:#FFFFFF;border:1px solid #C2C2C2}.bonus-swatch{background:#DBF4F9}
.hint-box{max-width:590px;margin-top:12px;padding:12px 14px;background:#FFFFFF;border:1px solid #D7D7D7;border-radius:12px;box-shadow:0 6px 18px #0028A50A}.hint-box[hidden]{display:none}.hint-box p{color:#4D4D4D;line-height:1.4;font-size:.84rem;margin:5px 0 0}
.how{max-width:650px}.how h3{margin-bottom:4px}.how p{color:#4D4D4D;line-height:1.4;font-size:.82rem;margin:0}
.sidebar{display:flex;flex-direction:column;gap:14px;min-width:0}.challenge{border-top:1px solid #D7D7D7;padding-top:12px}.challenge h2{font-size:1.28rem;line-height:1.18;margin:6px 0}.challenge p{color:#4D4D4D;line-height:1.4;font-size:.84rem;margin:5px 0 0}.preview{background:#FFFFFF;border:1px solid #D7D7D7;border-radius:15px;padding:15px;min-height:156px;box-shadow:0 6px 18px #0028A50A}.preview strong{display:block;font-size:1.13rem;margin-top:6px;min-height:25px}.preview strong:empty{display:none}.meter{height:8px;background:#E7E7E7;border-radius:9px;overflow:hidden;margin:10px 0 6px}.meter>div{height:100%;width:0;background:#0028A5;transition:width .2s}.preview p{color:#4D4D4D;font-size:.8rem;line-height:1.3;min-height:31px;margin:0}.preview-points{font-size:1.25rem;font-weight:800;color:#0028A5;margin-top:5px}
.rack-section{border-top:1px solid #D7D7D7;padding-top:12px}.rack-head p{color:#4D4D4D;font-size:.8rem;margin:3px 0 0}.rack{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:9px}.tile,.secondary-button{min-height:43px;background:#FFFFFF;border:1px solid #C2C2C2;color:#333333;border-radius:10px;padding:8px 9px;box-shadow:0 3px 0 #D7D7D7;font-weight:800}.tile{min-width:0;letter-spacing:.02em;font-size:.85rem;overflow-wrap:anywhere}.tile:hover,.secondary-button:hover:not(:disabled){transform:translateY(-1px)}.tile.selected{background:#FFDE8F;border-color:#A27200;box-shadow:0 3px 0 #F3AB00}
.controls{margin-top:15px;border-top:1px solid #D7D7D7;padding-top:14px;display:grid;gap:8px}.controls p{color:#4D4D4D;line-height:1.4;font-size:.84rem;margin:5px 0 0}.main-actions,.support-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.primary-button{border:0;background:#0028A5;color:white;padding:10px 12px;min-height:44px;border-radius:10px;font-weight:800;white-space:nowrap}.primary-button:hover:not(:disabled){background:#001E7C}.primary-button:disabled,.secondary-button:disabled{opacity:.45;cursor:not-allowed}.secondary-button{font-size:.84rem}#swap,#hint{background:#BDC9E8}#status{color:#4D4D4D;font-size:.78rem;min-height:16px}footer{margin-top:12px;color:#666666;font-size:.72rem}
.end-dialog{width:min(420px,calc(100vw - 40px));max-width:420px;border:1px solid #D7D7D7;background:#FFFFFF;color:#333333;border-radius:18px;padding:24px;font-family:inherit;font-size:1rem;text-align:center;box-shadow:0 20px 70px #00145245}.end-dialog::backdrop{background:#001452BD}.end-dialog h2{font-size:1.25rem;letter-spacing:-.025em;font-weight:800;color:#0028A5;line-height:1.2;margin:0}.end-dialog p{color:#4D4D4D;line-height:1.4;font-size:.84rem;margin:14px 0 23px}.end-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
@media(max-width:760px){.app{padding:18px 15px}.game-layout{grid-template-columns:1fr;gap:12px}.board{width:min(100%,650px)}.sidebar{gap:15px}.challenge{border-top:1px solid #D7D7D7;padding-top:12px}.challenge h2{font-size:1.2rem}.topbar{gap:10px}.scoreboard>div{min-width:70px;padding:8px}.scoreboard strong{font-size:1.05rem}.scoreboard span{font-size:.62rem}.cell.word{font-size:clamp(.57rem,2.1vw,.82rem)}.rack{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:520px){.rack{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:420px){.topbar{flex-direction:column}.scoreboard{width:100%}.scoreboard>div{flex:1}.board{gap:4px;padding:6px}.cell{border-radius:6px}.cell.word{font-size:.55rem}.cell .bonus-label{font-size:.48rem}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
