:root,[data-theme=light]{color-scheme:light;--text: #102033;--text-muted: #4b5d73;--text-accent: #27466e;--text-warning: #7a5b00;--text-error: #8a1f1f;--bg-body: linear-gradient(160deg, #f3f6f4 0%, #e8eef6 100%);--surface: #ffffff;--surface-muted: rgba(243, 246, 248, .85);--border: #c7d5ea;--border-soft: #d7e2f2;--primary: #2a4f7a;--primary-contrast: #ffffff;--win: #c45c26;--cell-marked-bg: #b8ecd4;--cell-marked-border: #1f8a5a;--cell-free-bg: #fff1c2;--cell-free-border: #d4a017;--error-bg: #ffe9e9;--warning-bg: #fff6d9;--loading-bg: #eef3ff;--overlay: rgba(16, 32, 51, .45);--shadow: rgba(16, 32, 51, .25);--toast-bg: #102033;--toast-text: #ffffff}[data-theme=dark]{color-scheme:dark;--text: #e8eef7;--text-muted: #a8b8d0;--text-accent: #c7d8f2;--text-warning: #ffd978;--text-error: #ffb3b3;--bg-body: linear-gradient(160deg, #0b1220 0%, #101b2d 100%);--surface: #162235;--surface-muted: rgba(14, 22, 36, .55);--border: #2a3d5c;--border-soft: #22314a;--primary: #7eb0ff;--primary-contrast: #08111f;--win: #ffb454;--cell-marked-bg: #145c3d;--cell-marked-border: #4ee0a0;--cell-free-bg: #4a3b14;--cell-free-border: #e0b43a;--error-bg: #3a1717;--warning-bg: #3a2f0d;--loading-bg: #162235;--overlay: rgba(0, 0, 0, .62);--shadow: rgba(0, 0, 0, .45);--toast-bg: #e8eef7;--toast-text: #08111f}:root{color:var(--text);background:var(--bg-body);font-family:Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.4}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg-body);color:var(--text)}#app{min-height:100vh}.app{max-width:720px;margin:0 auto;padding:1rem 1rem 2rem}.header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;margin-bottom:.75rem}.header-main{flex:1;text-align:center}.header h1{margin:0;font-size:clamp(1.75rem,4vw,2.5rem);letter-spacing:-.02em}.subtitle{margin:.35rem 0 0;color:var(--text-muted)}.btn-icon{min-width:2.75rem;padding-inline:.85rem;font-size:1.1rem;line-height:1}.play-bar{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;align-items:center;margin:.5rem 0 .85rem}.setup-panel{margin:1.25rem 0 0;padding:.85rem 1rem;border:1px solid var(--border-soft);border-radius:.75rem;background:var(--surface-muted);display:grid;gap:1.15rem}.setup-panel-compact{gap:.65rem;padding:.75rem .9rem}.setup-block{display:grid;gap:.55rem}.setup-heading{margin:0;font-size:1.05rem}.setup-hint,.setup-note,.setup-action-note{margin:0;color:var(--text-muted);font-size:.9rem}.setup-note{color:var(--text-warning)}.setup-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:end}.setup-panel-compact .setup-row{align-items:center}.setup-split{display:grid;gap:.85rem}.setup-action{display:grid;gap:.4rem;align-content:start}.setup-action-join{padding-top:.35rem;border-top:1px solid var(--border-soft)}.field{display:flex;flex-direction:column;gap:.35rem;font-size:.85rem;font-weight:600;color:var(--text-muted);flex:1 1 12rem;min-width:min(100%,12rem)}.field-control{border:2px solid var(--border);border-radius:.75rem;padding:.7rem .85rem;font:inherit;font-weight:600;color:inherit;background:var(--surface);width:100%}select.field-control{border-color:var(--border);color:var(--text);font-weight:500}.room-form{display:grid;gap:.75rem}.room-code-input{letter-spacing:.18em;text-transform:uppercase;font-weight:700;max-width:8rem}.room-meta{display:flex;flex-wrap:wrap;gap:.75rem;align-items:baseline;flex:1}.room-meta span{color:var(--text-muted);font-size:.9rem}.room-players{margin:0;padding-left:1.2rem;color:var(--text-accent);overflow-wrap:anywhere;word-break:break-word}.room-players[hidden]{display:none}.upload-btn{flex:0 0 auto}@media(min-width:640px){.setup-split{grid-template-columns:1fr 1fr;gap:1rem;align-items:start}.setup-action-join{padding-top:0;padding-left:1rem;border-top:none;border-left:1px solid var(--border-soft)}}.toast-stack{position:fixed;right:1rem;bottom:1rem;display:grid;gap:.5rem;z-index:30;max-width:min(22rem,calc(100vw - 2rem))}.toast{background:var(--toast-bg);color:var(--toast-text);border-radius:.75rem;padding:.75rem 1rem;box-shadow:0 12px 30px var(--shadow);animation:toast-in .22s ease}@keyframes toast-in{0%{transform:translateY(.4rem);opacity:0}to{transform:translateY(0);opacity:1}}.grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem}.cell{aspect-ratio:1;border:2px solid var(--border);border-radius:.75rem;background:var(--surface);color:inherit;font:inherit;font-size:clamp(.62rem,2.4vw,.85rem);font-weight:600;padding:.35rem;cursor:pointer;transition:transform .12s ease,background .12s ease,border-color .12s ease,box-shadow .12s ease}.cell span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}.cell:active:not(.cell-free){transform:scale(.97)}.cell-marked:not(.cell-free){background:var(--cell-marked-bg);border-color:var(--cell-marked-border);box-shadow:0 0 0 2px var(--cell-marked-border)}.cell-free{background:var(--cell-free-bg);border-color:var(--cell-free-border);cursor:default}.btn{border:none;border-radius:.75rem;background:var(--primary);color:var(--primary-contrast);font:inherit;font-weight:600;padding:.75rem 1.1rem;cursor:pointer}.btn-secondary{background:var(--surface);color:var(--primary);border:2px solid var(--primary)}.btn-compact{justify-self:start;padding:.45rem .85rem;font-size:.9rem}.btn-quiet{background:transparent;color:var(--text-muted);border:1px solid var(--border-soft);font-weight:600}.btn-quiet:hover:not(:disabled){color:var(--text);border-color:var(--border)}.btn:disabled,.btn-secondary:disabled,.btn-quiet:disabled{opacity:.55;cursor:not-allowed}.error,.loading{margin:.5rem 0;padding:.75rem 1rem;border-radius:.75rem;background:var(--error-bg);color:var(--text-error);text-align:center}.warning{margin:.5rem 0;padding:.75rem 1rem;border-radius:.75rem;background:var(--warning-bg);color:var(--text-warning);text-align:center}.grid-blocked .cell:not(.cell-free){pointer-events:none}.play-bar-blocked .btn,.play-bar-blocked .btn-secondary,.btn-disabled{opacity:.55;pointer-events:none}.loading{background:var(--loading-bg);color:var(--text-accent)}.celebration{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:var(--overlay);padding:1rem;z-index:40}.celebration-card{background:var(--surface);color:var(--text);border-radius:1rem;padding:2rem;text-align:center;box-shadow:0 20px 60px var(--shadow);animation:pop .4s ease}.celebration-card h2{margin:0;font-size:2.5rem;color:var(--win)}.celebration-card p{margin:.75rem 0 0}.celebration-actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:1.25rem}@keyframes pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}@media(min-width:640px){.grid{gap:.75rem}.cell{font-size:.85rem}}