:root{--bg: #0f172a;--panel: #1e293b;--line: #475569;--line-strong: #94a3b8;--text: #e2e8f0;--muted: #94a3b8;--given: #38bdf8;--entry: #e2e8f0;--player-me: #38bdf8;--player-partner: #fb923c;--conflict: #ef4444;--accent: #22c55e}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text);display:flex;justify-content:center;padding:24px}@media (max-width: 480px){body{padding:12px}}#root{width:100%;max-width:560px}h1{margin:0 0 8px}.tagline{color:var(--muted);line-height:1.5}.hashtag{color:var(--given);font-size:.8em;opacity:.7}.lobby-title{display:flex;align-items:center;gap:12px}.lobby-logo{flex:none}.invite{background:#22c55e1f;border:1px solid var(--accent);border-radius:8px;padding:12px 14px;margin:16px 0 0;line-height:1.5}.invite strong{letter-spacing:2px}.lobby .panel{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px;margin-top:16px}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;color:var(--muted);font-size:14px}input,select{background:#0b1220;border:1px solid var(--line);color:var(--text);border-radius:6px;padding:8px 10px;font-size:16px}button{background:var(--accent);color:#052e16;border:none;border-radius:6px;padding:10px 16px;font-size:15px;font-weight:600;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.hint{color:var(--muted)}.error{color:var(--conflict)}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.game-header-left{display:flex;align-items:center;gap:14px}.leave{background:none;border:1px solid var(--line);color:var(--muted);border-radius:8px;padding:4px 10px;font-size:13px;cursor:pointer}.leave:hover{border-color:var(--line-strong);color:var(--entry)}.room{background:none;border:none;color:inherit;padding:0;font-size:inherit;font-weight:inherit;cursor:pointer}.room:hover{text-decoration:underline;text-decoration-color:var(--muted);text-underline-offset:3px}.room strong{letter-spacing:2px}.presence{display:flex;gap:16px}.player{display:flex;align-items:center;gap:6px;font-size:14px}.player .dot{width:10px;height:10px;border-radius:50%}.player-you .dot{background:var(--player-me)}.player-partner .dot{background:var(--player-partner)}.player .status{color:var(--muted);font-size:12px}.banner.win{background:var(--accent);color:#052e16;text-align:center;font-weight:700;padding:10px;border-radius:8px;margin-bottom:12px}.banner.waiting{background:var(--panel);color:var(--muted);text-align:center;font-size:14px;padding:8px 12px;border-radius:8px;margin-bottom:12px;border:1px solid var(--line)}.board{display:grid;grid-template-columns:repeat(9,1fr);aspect-ratio:1;border:3px solid var(--line-strong);border-radius:6px;overflow:hidden;-webkit-user-select:none;user-select:none}.cell{display:flex;align-items:center;justify-content:center;font-size:clamp(18px,6vw,30px);border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#0b1220;color:var(--entry);cursor:pointer;aspect-ratio:1}.cell.box-right{border-right:2px solid var(--line-strong)}.cell.box-bottom{border-bottom:2px solid var(--line-strong)}.cell.given{color:var(--given);font-weight:700;background:#0e1a2b;cursor:default}.cell.selected{background:#1d4ed833;outline:2px solid var(--player-me);outline-offset:-2px}.cell.partner{box-shadow:inset 0 0 0 2px var(--player-partner)}.cell.conflict{color:var(--conflict);background:#450a0a}@keyframes partner-pulse{0%{background:#7c3aed55;box-shadow:inset 0 0 0 2px var(--player-partner)}60%{background:#7c3aed22;box-shadow:inset 0 0 0 2px var(--player-partner)}to{background:#0b1220;box-shadow:none}}.cell.partner-changed{animation:partner-pulse 1s ease-out forwards}.numpad{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:14px}.numpad-key{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:0;height:56px;font-size:24px;font-weight:600;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.numpad-key:active:not(:disabled){background:var(--line)}.numpad-key:disabled{opacity:.4;cursor:not-allowed}.numpad-erase{color:var(--conflict)}.emotebar{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:8px}.emote-key{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:0;height:48px;font-size:24px;line-height:1;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.emote-key:active{background:var(--line);transform:scale(.94)}.board-wrap{position:relative}.emote-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.emote-fly{position:absolute;transform:translate(-50%,-50%);font-size:clamp(28px,9vw,44px);filter:drop-shadow(0 2px 6px rgba(0,0,0,.6));animation:emote-pop 2.2s ease-out forwards;will-change:transform,opacity}@keyframes emote-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}15%{opacity:1;transform:translate(-50%,-60%) scale(1.25)}35%{opacity:1;transform:translate(-50%,-75%) scale(1)}to{opacity:0;transform:translate(-50%,-150%) scale(.9)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172abf;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px;z-index:100}.modal{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:28px;max-width:380px;width:100%;text-align:center}.modal-close{position:absolute;top:10px;right:12px;background:none;border:none;color:var(--muted);font-size:22px;line-height:1;padding:2px 6px;cursor:pointer}.modal-close:hover{color:var(--text)}.modal h2{margin:0 0 8px}.modal .room-code{display:block;width:100%;margin:16px 0 8px;background:#0b1220;color:var(--given);border:1px dashed var(--line-strong);border-radius:8px;padding:16px;font-size:38px;font-weight:700;letter-spacing:8px}.modal .room-link{display:block;width:100%;margin:16px 0 8px;background:#0b1220;color:var(--given);border:1px dashed var(--line-strong);border-radius:8px;padding:14px;font-size:15px;font-weight:600;word-break:break-all;letter-spacing:0}.modal .hint{font-size:13px;margin:0}.modal .hint strong{color:var(--given);letter-spacing:2px}.game-footer{display:flex;align-items:center;gap:16px;margin-top:14px;flex-wrap:wrap}.legend{color:var(--muted);font-size:13px;display:flex;align-items:center;gap:4px}.swatch{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:middle}.swatch.given{background:var(--given)}.swatch.partner{border:2px solid var(--player-partner)}.swatch.conflict{background:var(--conflict)}