:root{--bg: #08080f;--panel: #0f0f1c;--panel-2: #17172a;--border: rgba(139,92,246,.18);--border-solid: #2a2a44;--text: #f0f0f8;--muted: #6b6b88;--accent: #a78bfa;--accent-2: #7c3aed;--green: #34d399;--red: #f87171;--blue: #60a5fa;--gold: #fbbf24}*{box-sizing:border-box}:root{--ease: cubic-bezier(.22, .68, .26, 1);--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}html,body,#root{margin:0;padding:0;height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;background:var(--panel-2);color:var(--text);border:1px solid var(--border-solid);padding:10px 16px;border-radius:12px;transition:filter .25s var(--ease),transform .15s var(--ease),background .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease),opacity .25s var(--ease)}button:hover:not(:disabled){filter:brightness(1.2);transform:translateY(-1px);border-color:#a78bfa66;box-shadow:0 4px 20px #8b5cf626}button:active:not(:disabled){transform:translateY(1px) scale(.98);transition-duration:.08s}button:disabled{opacity:.45;cursor:not-allowed}input{transition:border-color .25s var(--ease),background .25s var(--ease),box-shadow .25s var(--ease)}input:focus{box-shadow:0 0 0 3px #a78bfa33}button.primary{background:linear-gradient(135deg,#a78bfa,#7c3aed);border-color:transparent;color:#fff;font-weight:700;box-shadow:0 4px 20px #7c3aed66}button.primary:hover:not(:disabled){box-shadow:0 6px 28px #7c3aed99;filter:brightness(1.1)}button.danger{background:var(--red);border-color:transparent}input{font:inherit;background:var(--panel);color:var(--text);border:1px solid var(--border-solid);padding:10px 14px;border-radius:12px;outline:none}input:focus{border-color:var(--accent)}.app{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:16px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));position:relative;z-index:1}.home{width:100%;max-width:460px;display:flex;flex-direction:column;gap:20px;margin-top:8vh;position:relative;z-index:2;animation:pageIn .5s var(--ease-out)}.home>*{animation:pageItemIn .5s var(--ease-out) both}.home>*:nth-child(1){animation-delay:.05s}.home>*:nth-child(2){animation-delay:.12s}.home>*:nth-child(3){animation-delay:.19s}.home>*:nth-child(4){animation-delay:.26s}.home>*:nth-child(5){animation-delay:.33s}.home>*:nth-child(6){animation-delay:.4s}@keyframes pageIn{0%{opacity:0}to{opacity:1}}@keyframes pageItemIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.home h1{margin:0 0 8px;font-size:32px;text-align:center}.home .subtitle{text-align:center;color:var(--muted);margin-top:-8px}.card{background:#0f0f1cd9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(139,92,246,.15);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:12px;position:relative;z-index:2;transition:border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease);box-shadow:0 4px 24px #0006,inset 0 1px #ffffff0a}.card:hover{border-color:#a78bfa59;box-shadow:0 8px 40px #7c3aed26,inset 0 1px #ffffff0f;transform:translateY(-1px)}.card h2{margin:0;font-size:18px}.row{display:flex;gap:10px;align-items:center}.col{display:flex;flex-direction:column;gap:10px}.grow{flex:1}.game{width:100%;max-width:720px;display:flex;flex-direction:column;gap:14px;position:relative;z-index:2;animation:pageIn .4s var(--ease-out)}.game-layout,.game-main{display:flex;flex-direction:column;gap:14px;width:100%}.game-side{display:flex;flex-direction:column;gap:10px;width:100%}.game .game-header,.game .player-card,.game .actions,.game .history-list,.game .chat,.game .status-bar,.game .notice{background:#1e293bd9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.game .player-card.turn{background:#1e293be6}.game-header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.code-pill{font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:22px;font-weight:700;letter-spacing:3px;background:var(--panel);padding:8px 14px;border-radius:10px;border:1px solid var(--border)}.player-card{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--panel);border:1px solid var(--border);border-radius:12px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);margin-right:6px}.dot.online{background:var(--green)}.board-wrap{width:100%;max-width:560px;margin:0 auto;aspect-ratio:1 / 1}.board-wrap.shake{animation:boardShake .45s cubic-bezier(.36,.07,.19,.97)}@keyframes boardShake{0%,to{transform:translate(0)}10%,50%,90%{transform:translate(-10px)}20%,60%{transform:translate(10px)}30%,70%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes checkPulse{0%,to{background:radial-gradient(circle,rgba(239,68,68,.55) 0%,rgba(239,68,68,.25) 65%,transparent 90%);box-shadow:inset 0 0 #ef444400}50%{background:radial-gradient(circle,#ef4444f2,#ef44448c 65%,#ef444426 90%);box-shadow:inset 0 0 18px 2px #ef4444b3}}@keyframes attackerPulse{0%,to{box-shadow:inset 0 0 0 3px #ef444499}50%{box-shadow:inset 0 0 0 4px #ef4444,0 0 14px #ef444499}}.status-bar{text-align:center;padding:10px;background:var(--panel);border-radius:10px;border:1px solid var(--border);font-weight:500;transition:border-color .4s var(--ease),background .4s var(--ease);animation:statusBarIn .35s var(--ease-out)}.status-bar.win{border-color:var(--green)}.status-bar.lose{border-color:var(--red)}.status-bar.draw{border-color:var(--accent)}@keyframes statusBarIn{0%{opacity:.6;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.chat{background:var(--panel);border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;max-height:280px;overflow:hidden}.chat-log{flex:1;overflow-y:auto;padding:10px 12px;display:flex;flex-direction:column;gap:6px;font-size:14px}.chat-msg .author{color:var(--accent);margin-right:6px;font-weight:600}.chat-form{display:flex;border-top:1px solid var(--border)}.chat-form input{border:none;border-radius:0;flex:1}.chat-form button{border:none;border-radius:0;background:var(--accent);color:#1a1a1a;font-weight:600}.history-list{display:grid;grid-template-columns:30px 1fr 1fr;gap:4px 8px;font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:13px;max-height:180px;overflow-y:auto;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:10px}.history-list .ply-num{color:var(--muted)}.error{color:var(--red);font-size:14px;text-align:center;padding:6px}.notice{background:#f59e0b1f;border:1px solid var(--accent);border-radius:10px;padding:10px 14px;font-size:14px}@media (max-width: 480px){.home{margin-top:4vh}.home h1{font-size:26px}.code-pill{font-size:18px;letter-spacing:2px}.color-tile{padding:16px 8px!important}.color-piece{font-size:80px!important}}.emoji-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.emoji-cell{font-size:24px;padding:8px 0;background:var(--panel-2);border:2px solid transparent;border-radius:10px;line-height:1;transition:transform .35s var(--ease-bounce),border-color .25s var(--ease),background .25s var(--ease)}.emoji-cell:hover:not(.selected){transform:scale(1.08)}.emoji-cell.selected{border-color:var(--accent);background:#f59e0b26;transform:scale(1.12)}.waiting-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;display:flex;align-items:center;justify-content:center;pointer-events:none;overflow:hidden}.waiting-bg>div{width:90vmin!important;height:90vmin!important;filter:blur(10px) saturate(.7);opacity:.28;transform:scale(1.1);animation:bgFloat 22s ease-in-out infinite}@keyframes bgFloat{0%,to{transform:scale(1.1) rotate(-1deg)}50%{transform:scale(1.18) rotate(1deg)}}.lobby{width:100%;max-width:520px;display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:4vh;position:relative;z-index:1;animation:pageIn .45s var(--ease-out)}.waiting-lobby{gap:22px;text-align:center}.waiting-spinner{position:relative;width:120px;height:120px;display:flex;align-items:center;justify-content:center}.waiting-spinner .ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:3px solid transparent;border-top-color:var(--accent);border-right-color:var(--accent);animation:spin 1.6s linear infinite}.waiting-spinner .ring.delay{top:12px;right:12px;bottom:12px;left:12px;border-top-color:var(--accent-2);border-right-color:transparent;border-left-color:var(--accent-2);animation:spin 2.2s linear infinite reverse}.waiting-spinner .emoji-center{font-size:56px;font-family:serif;color:var(--text);filter:drop-shadow(0 4px 12px rgba(0,0,0,.5))}@keyframes spin{to{transform:rotate(360deg)}}.waiting-title{margin:0;font-size:28px;font-weight:700}.waiting-title .dots span{opacity:0;animation:dotBlink 1.4s infinite}.waiting-title .dots span:nth-child(2){animation-delay:.2s}.waiting-title .dots span:nth-child(3){animation-delay:.4s}@keyframes dotBlink{0%,60%,to{opacity:0}30%{opacity:1}}.waiting-sub{margin:0;color:var(--muted);font-size:15px;max-width:360px}.invite-card{background:#1e293bd9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:18px;padding:20px;display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}.invite-label{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.code-pill.big.pulse{position:relative;animation:codePulse 2s ease-in-out infinite}@keyframes codePulse{0%,to{box-shadow:0 0 #f59e0b80}50%{box-shadow:0 0 0 12px #f59e0b00}}.invite-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.tc-info{background:#1e293bb3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:10px 18px;border-radius:999px;border:1px solid var(--border);font-size:14px;color:var(--text)}.lobby h1{margin:0;text-align:center;font-size:28px}.lobby .back-btn{position:absolute;left:0;top:0}.code-pill.big{font-size:36px;padding:16px 24px;letter-spacing:6px}.vs-row{display:flex;align-items:center;gap:20px;margin:20px 0}.vs-text{font-size:24px;color:var(--muted);font-weight:700}.avatar{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:100px}.avatar.empty{width:80px;height:80px;border-radius:50%;background:var(--panel-2);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:32px}.avatar.highlight .avatar-emoji{box-shadow:0 0 0 3px var(--green)}.avatar-emoji{font-size:48px;background:var(--panel);border-radius:50%;width:80px;height:80px;display:flex;align-items:center;justify-content:center;border:2px solid var(--border);transition:box-shadow .2s}.avatar-name{font-weight:600;font-size:14px}.countdown{font-size:72px;font-weight:800;color:var(--accent);line-height:1;animation:countdownIn .5s var(--ease-bounce)}@keyframes countdownIn{0%{transform:scale(.4);opacity:0;filter:blur(8px)}60%{transform:scale(1.15);opacity:1;filter:blur(0)}to{transform:scale(1);opacity:1}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.92}}.color-pick{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;margin:12px 0}.color-tile{display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 12px;border-radius:16px;border:3px solid var(--border);cursor:pointer;transition:transform .45s var(--ease-bounce),border-color .3s var(--ease),box-shadow .35s var(--ease),filter .3s var(--ease);min-height:240px;position:relative;will-change:transform}.color-tile.white{background:linear-gradient(180deg,#f1f5f9,#cbd5e1);color:#0f172a}.color-tile.black{background:linear-gradient(180deg,#334155,#0f172a);color:#f1f5f9}.color-tile.mine{border-color:var(--green);box-shadow:0 0 0 4px #22c55e40,0 16px 40px #22c55e33;transform:translateY(-6px) scale(1.02)}.color-tile:hover:not(.mine){transform:translateY(-3px) scale(1.01)}.color-piece{font-size:96px;line-height:1}.color-label{font-size:16px;font-weight:600}.color-avatars{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;min-height:56px}.mini-ava{display:flex;flex-direction:column;align-items:center;background:#00000040;border-radius:10px;padding:4px 8px;animation:slideIn .25s ease-out}.color-tile.white .mini-ava{background:#ffffff80}.mini-ava.mine{outline:2px solid var(--green)}.mini-ava span{font-size:22px}.mini-ava small{font-size:11px;font-weight:600}@keyframes slideIn{0%{transform:translateY(-16px) scale(.85);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.mini-ava{transition:transform .35s var(--ease-bounce)}.lobby-progress{width:100%;height:6px;background:var(--panel-2);border-radius:3px;overflow:hidden;margin-top:12px}.lobby-progress-bar{height:100%;background:linear-gradient(90deg,var(--accent),var(--red));transition:width .3s linear}.launch-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:250;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:20px;animation:overlayIn .2s ease-out}.launch-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(circle at 30% 30%,rgba(245,158,11,.25),transparent 50%),radial-gradient(circle at 70% 70%,rgba(34,197,94,.18),transparent 50%),#020617eb;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.launch-vs{display:flex;align-items:center;gap:24px;flex-wrap:nowrap;animation:slideUp .35s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.launch-vs-text{font-size:28px;font-weight:800;color:var(--muted);background:linear-gradient(135deg,var(--accent),var(--red));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.launch-ava{display:flex;flex-direction:column;align-items:center;gap:8px;background:#0f172ab3;border:2px solid var(--border);border-radius:20px;padding:16px 14px;min-width:120px;position:relative}.launch-ava.white{border-color:#f1f5f966;box-shadow:0 0 0 3px #f1f5f91f,0 8px 32px #0006}.launch-ava.black{border-color:#0f172acc;box-shadow:0 0 0 3px #0f172a80,0 8px 32px #0006}.launch-ava-piece{font-size:48px;font-family:serif;line-height:1}.launch-ava-emoji{font-size:36px;width:64px;height:64px;background:var(--panel-2);border-radius:50%;display:flex;align-items:center;justify-content:center}.launch-ava-name{font-weight:700;font-size:14px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.launch-ava-label{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}.launch-num{font-size:180px;font-weight:900;line-height:1;background:linear-gradient(180deg,var(--accent) 0%,var(--accent-2) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 8px 32px rgba(245,158,11,.5));animation:launchNum .9s ease-out}@keyframes launchNum{0%{transform:scale(2.2);opacity:0;filter:blur(20px)}40%{transform:scale(1);opacity:1;filter:blur(0)}to{transform:scale(.9);opacity:.85}}.launch-hint{font-size:22px;font-weight:700;color:var(--text)}.launch-sub{font-size:14px;color:var(--accent);background:#f59e0b1a;padding:8px 16px;border-radius:999px;border:1px solid rgba(245,158,11,.3)}@media (max-width: 480px){.launch-num{font-size:130px}.launch-vs{gap:14px}.launch-ava{min-width:100px;padding:12px 10px}.launch-ava-piece{font-size:40px}.launch-ava-emoji{font-size:30px;width:54px;height:54px}}.card.center{align-items:center;text-align:center}.player-card{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--panel);border:1px solid var(--border);border-radius:12px;gap:12px;transition:border-color .45s var(--ease),box-shadow .45s var(--ease),background .35s var(--ease)}.player-card.turn{border-color:var(--accent);box-shadow:0 0 0 2px #f59e0b40}.player-emoji{transition:transform .4s var(--ease-bounce),background .35s var(--ease)}.player-card.turn .player-emoji{transform:scale(1.08);background:#f59e0b2e}.player-left{display:flex;gap:10px;align-items:center;min-width:0}.player-emoji{font-size:32px;background:var(--panel-2);width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center}.player-meta{display:flex;flex-direction:column;min-width:0}.player-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.clock-wrap{display:flex;align-items:center;gap:6px}.clock-bonus{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#1a1a1a;font-size:11px;font-weight:800;padding:3px 7px;border-radius:6px;font-family:ui-monospace,SF Mono,Consolas,monospace;animation:bonusPulse 1.2s ease-in-out infinite;white-space:nowrap}@keyframes bonusPulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.clock{font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:22px;font-weight:700;background:var(--panel-2);padding:4px 10px;border-radius:8px;letter-spacing:1px;transition:background .4s var(--ease),color .4s var(--ease),transform .35s var(--ease)}.clock.active{background:var(--accent);color:#1a1a1a;transform:scale(1.04)}.clock.low{background:var(--red);color:#fff;animation:blinkSoft 1.4s ease-in-out infinite}.clock.active.low{background:var(--red)}@keyframes blinkSoft{0%,to{opacity:1;transform:scale(1.04)}50%{opacity:.7;transform:scale(1.08)}}.connection{font-size:11px;color:var(--muted)}.chess-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none;isolation:isolate}.chess-bg-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 20% 15%,rgba(124,58,237,.12),transparent 45%),radial-gradient(circle at 80% 85%,rgba(99,102,241,.1),transparent 45%),radial-gradient(circle at 60% 40%,rgba(167,139,250,.05),transparent 35%),linear-gradient(180deg,#07070f,#0d0d1e)}.chess-bg-particles{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:.9}.chess-bg-piece{position:absolute;color:#f1f5f9;opacity:.06;font-family:serif;filter:drop-shadow(0 4px 14px rgba(0,0,0,.4));animation:floatPiece linear infinite;will-change:transform,opacity;-webkit-user-select:none;user-select:none;transform:translateZ(0)}@keyframes floatPiece{0%{transform:translateY(20vh) rotate(var(--rot, 0deg));opacity:0}10%{opacity:.06}90%{opacity:.06}to{transform:translateY(-120vh) rotate(calc(var(--rot, 0deg) + 30deg));opacity:0}}.brand{font-size:40px;font-weight:900;background:linear-gradient(135deg,#c4b5fd,#a78bfa,#7c3aed,#6366f1,#a78bfa,#e879f9);background-size:300% 300%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:brandShine 5s ease-in-out infinite;letter-spacing:.5px;margin:0 0 4px;text-shadow:none;filter:drop-shadow(0 0 24px rgba(167,139,250,.4))}@keyframes brandShine{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.settings-fab{position:fixed;top:max(12px,env(safe-area-inset-top));right:12px;width:44px;height:44px;border-radius:50%;background:#1e293bd9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border);padding:0;font-size:20px;z-index:50;display:flex;align-items:center;justify-content:center}.settings-modal{max-width:440px;max-height:85vh;overflow-y:auto}.settings-modal .emoji-grid{grid-template-columns:repeat(6,1fr)}.settings-section{width:100%;display:flex;flex-direction:column;gap:8px;margin-bottom:10px}.settings-section label{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.settings-section input[type=range]{width:100%;-webkit-appearance:none;background:var(--panel-2);height:6px;border-radius:3px;outline:none;padding:0}.settings-section input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));cursor:pointer;border:2px solid var(--bg)}.settings-section input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));border:2px solid var(--bg);cursor:pointer}.toggle-row{display:flex;justify-content:space-between;align-items:center;width:100%;background:var(--panel-2);border:1px solid var(--border);padding:12px 14px;border-radius:12px;margin:0;text-align:left}.toggle-track{width:44px;height:26px;background:#475569;border-radius:999px;position:relative;transition:background .35s var(--ease)}.toggle-thumb{position:absolute;top:3px;left:3px;width:20px;height:20px;background:#f1f5f9;border-radius:50%;transition:left .35s var(--ease-bounce),transform .25s var(--ease);box-shadow:0 2px 4px #0000004d}.toggle-row:active .toggle-thumb{transform:scale(.9)}.toggle-row.on .toggle-track{background:linear-gradient(135deg,var(--accent),var(--accent-2))}.toggle-row.on .toggle-thumb{left:21px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#020617a6;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;animation:overlayIn .35s var(--ease-out)}@keyframes overlayIn{0%{opacity:0;backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}to{opacity:1}}.modal{background:linear-gradient(180deg,#1e293b,#172033);border:1px solid var(--border);border-radius:20px;padding:28px 24px 20px;width:100%;max-width:380px;display:flex;flex-direction:column;align-items:center;gap:12px;box-shadow:0 24px 64px #00000080,0 0 0 1px #ffffff0a;animation:modalIn .22s cubic-bezier(.16,1.02,.38,1.18);position:relative}.modal.danger{border-color:#ef444466;box-shadow:0 24px 64px #00000080,0 0 0 1px #ef444426}@keyframes modalIn{0%{opacity:0;transform:scale(.88) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal{animation:modalIn .42s var(--ease-out)!important}.modal-icon{font-size:48px;line-height:1;margin-top:-8px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.4))}.modal.danger .modal-icon{animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-3px)}40%,80%{transform:translate(3px)}}.modal-title{margin:4px 0 0;font-size:22px;font-weight:700;text-align:center}.modal-message{margin:0;color:var(--muted);font-size:14px;line-height:1.5;text-align:center}.modal-actions{display:flex;gap:10px;width:100%;margin-top:12px}.modal-actions button{flex:1;padding:12px 16px;font-size:15px;font-weight:600}.draw-offer-modal{border-color:#f59e0b66;box-shadow:0 24px 64px #00000080,0 0 0 1px #f59e0b33,0 0 60px #f59e0b33}.modal-icon.handshake{animation:handshakePulse 1.4s ease-in-out infinite}@keyframes handshakePulse{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.1) rotate(-5deg)}75%{transform:scale(1.1) rotate(5deg)}}.draw-offerer-card{display:flex;align-items:center;gap:14px;background:#0f172a99;border:1px solid var(--border);border-radius:14px;padding:12px 16px;width:100%}.draw-offerer-emoji{font-size:36px;width:56px;height:56px;background:var(--panel-2);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.draw-offerer-text{min-width:0}.draw-offerer-name{font-size:18px;font-weight:700;color:var(--text)}.draw-offerer-sub{font-size:13px;color:var(--muted);margin-top:2px}.endgame-overlay{z-index:200}.endgame-modal{max-width:440px;padding:32px 24px 24px;gap:14px;background:linear-gradient(160deg,#1e293b,#0f172a)}.endgame-modal.win{box-shadow:0 24px 64px #00000080,0 0 0 2px #22c55e8c,0 0 80px #22c55e40}.endgame-modal.lose{box-shadow:0 24px 64px #00000080,0 0 0 2px #ef44448c,0 0 80px #ef444433}.endgame-modal.draw{box-shadow:0 24px 64px #00000080,0 0 0 2px #f59e0b8c,0 0 80px #f59e0b33}.endgame-header{display:flex;flex-direction:column;align-items:center;gap:6px}.endgame-icon{font-size:64px;line-height:1;animation:bounceIn .7s var(--ease-bounce)}@keyframes bounceIn{0%{transform:scale(.2);opacity:0}60%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}.endgame-title{margin:0;font-size:32px;font-weight:800;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.endgame-modal.win .endgame-title{background-image:linear-gradient(135deg,#22c55e,#4ade80,#facc15)}.endgame-modal.lose .endgame-title{background-image:linear-gradient(135deg,#ef4444,#f97316)}.endgame-modal.draw .endgame-title{background-image:linear-gradient(135deg,#f59e0b,#fbbf24)}.endgame-subtitle{font-size:16px;color:var(--text);font-weight:600}.endgame-reason{margin:0;text-align:center;color:var(--muted);font-size:14px;line-height:1.5}.endgame-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;margin:8px 0 4px}.endgame-stat{background:#0f172a99;border:1px solid var(--border);border-radius:12px;padding:10px 12px}.endgame-stat-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.endgame-stat-value{font-size:15px;font-weight:600;margin-top:2px;display:flex;align-items:center;gap:4px}.endgame-actions{display:flex;gap:10px;width:100%;align-items:stretch;flex-wrap:wrap}.endgame-actions .grow{flex:1;min-width:0}.endgame-actions button{padding:14px 16px;font-size:15px;font-weight:700}.endgame-actions button.voted{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}.rematch-countdown{flex:1;background:linear-gradient(135deg,#f59e0b33,#ea580c33);border:1px solid var(--accent);border-radius:12px;padding:10px 14px;display:flex;align-items:center;gap:10px;font-size:13px}.rematch-countdown .num{font-size:28px;font-weight:800;color:var(--accent);min-width:28px;text-align:center;animation:pulse 1s ease-in-out infinite}.rematch-status{display:flex;gap:8px;width:100%;margin-top:4px}.rematch-pill{flex:1;display:flex;align-items:center;gap:6px;background:#0f172a99;border:1px solid var(--border);padding:8px 12px;border-radius:999px;font-size:12px;color:var(--muted)}.rematch-pill span{font-size:18px}.rematch-pill.on{border-color:var(--green);background:#22c55e1f;color:var(--text)}.info-card{background:#8b5cf612;border:1px solid rgba(139,92,246,.25);border-radius:16px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start;position:relative;z-index:2}.info-card .info-icon{font-size:26px;flex-shrink:0}.info-card ol{margin:6px 0 0;padding-left:18px;font-size:14px;line-height:1.5;color:var(--text)}.info-card li{margin-bottom:2px}.info-card strong{color:var(--accent)}.card-hint{margin:-4px 0 4px;color:var(--muted);font-size:13px;line-height:1.4}.card.primary-card{border-color:#a78bfa4d;box-shadow:0 4px 24px #0006,0 0 30px #7c3aed14,inset 0 1px #ffffff0d}.card.primary-card h2{background:linear-gradient(135deg,#a78bfa,#7c3aed);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.card.secondary-card h2{color:var(--text)}button.big{padding:14px 18px;font-size:16px;font-weight:700}.code-input{font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:28px;letter-spacing:8px;text-align:center;font-weight:700}.theme-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.theme-cell{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--panel-2);border:2px solid transparent;border-radius:12px;padding:10px;transition:transform .35s var(--ease-bounce),border-color .25s var(--ease),background .25s var(--ease)}.theme-cell:hover:not(.selected){transform:translateY(-2px)}.theme-cell.selected{border-color:var(--accent);background:#f59e0b1f;transform:translateY(-3px) scale(1.02)}.theme-preview{width:56px;height:56px;display:grid;grid-template-columns:1fr 1fr;border-radius:6px;overflow:hidden;box-shadow:0 2px 6px #0000004d}.theme-preview>div{width:100%;height:100%}.theme-name{font-size:12px;font-weight:600}.auth-page{width:100%;max-width:420px;display:flex;flex-direction:column;gap:16px;margin-top:6vh;position:relative;z-index:2;animation:pageIn .5s var(--ease-out)}.auth-page>*{animation:pageItemIn .5s var(--ease-out) both}.auth-page>*:nth-child(1){animation-delay:.05s}.auth-page>*:nth-child(2){animation-delay:.12s}.auth-page>*:nth-child(3){animation-delay:.19s}.auth-page>*:nth-child(4){animation-delay:.26s}.auth-tabs{display:flex;background:#1e293b99;border:1px solid var(--border);border-radius:12px;padding:4px;gap:4px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.auth-tab{flex:1;background:transparent;border:none;padding:10px;font-size:14px;font-weight:600;color:var(--muted);border-radius:8px}.auth-tab.active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#1a1a1a;box-shadow:0 2px 8px #f59e0b4d}.auth-label{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600;margin-top:6px}.auth-footer{text-align:center;color:var(--muted);font-size:14px;margin:4px 0 0}.auth-switch-link{background:transparent;border:none;padding:0;color:var(--accent);font-weight:700;font-size:14px;text-decoration:underline}.account-row{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--panel-2);border:1px solid var(--border);border-radius:12px;font-size:16px}.ios-banner{position:fixed;top:max(8px,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,#0f172af2,#1e293bf2);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--accent);border-radius:999px;padding:8px 8px 8px 14px;z-index:80;font-size:13px;text-align:left;max-width:calc(100vw - 24px);box-shadow:0 8px 24px #0006,0 0 0 1px #f59e0b33;animation:bannerSlide .4s ease-out}@keyframes bannerSlide{0%{transform:translate(-50%,-100%);opacity:0}to{transform:translate(-50%);opacity:1}}.ios-banner-icon{font-size:22px}.ios-banner-text{display:flex;flex-direction:column;line-height:1.25;flex:1;min-width:0}.ios-banner-text strong{color:var(--accent)}.ios-banner-text span{font-size:11px;color:var(--muted)}.ios-banner-close{width:26px;height:26px;border-radius:50%;background:var(--panel-2);display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}.ios-guide-modal{max-width:460px;max-height:88vh;overflow-y:auto}.ios-guide-steps{list-style:none;padding:0;margin:8px 0;display:flex;flex-direction:column;gap:12px;width:100%}.ios-guide-steps li{display:flex;gap:12px;align-items:flex-start;background:#0f172a99;border:1px solid var(--border);border-radius:12px;padding:12px 14px;font-size:14px;line-height:1.5}.step-num{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#1a1a1a;display:flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0}.ios-share-icon{display:inline-block;background:var(--panel-2);padding:1px 6px;border-radius:4px;font-size:14px}.auto-hub{flex:1;display:flex;align-items:center;gap:10px;background:#ef44441f;border:1px solid rgba(239,68,68,.4);border-radius:12px;padding:10px 14px;font-size:13px;color:var(--text);min-width:0}.auto-hub-num{font-size:28px;font-weight:800;color:var(--red);min-width:28px;text-align:center;animation:pulse 1s ease-in-out infinite}.board-wrap.fs{position:fixed;z-index:500;width:100vmin;height:100vmin;max-width:100vmin;top:50%;left:50%;transform:translate(-50%,-50%);margin:0}.board-wrap.fs.shake{animation:boardShake .45s cubic-bezier(.36,.07,.19,.97)}.board-fs-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:499;background:#020617eb;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.board-fs-close{position:fixed;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:501;width:44px;height:44px;border-radius:50%;background:#1e293be6;border:1px solid var(--border);font-size:18px;display:flex;align-items:center;justify-content:center;padding:0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.elo-change-row{display:flex;align-items:center;gap:10px;background:#0f172a99;border:1px solid var(--border);border-radius:12px;padding:10px 16px;width:100%;font-size:15px}.elo-label{color:var(--muted);font-size:13px;flex:1}.elo-delta{font-size:20px;font-weight:800;font-family:ui-monospace,SF Mono,Consolas,monospace}.elo-delta.pos{color:var(--green)}.elo-delta.neg{color:var(--red)}.elo-value{font-size:16px;font-weight:700;color:var(--text);font-family:ui-monospace,SF Mono,Consolas,monospace}.mm-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:24px;background:#04040cbf;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);animation:overlayIn .3s var(--ease-out)}.mm-card{background:#0f0f1cf7;border:1px solid rgba(167,139,250,.3);border-radius:28px;padding:44px 36px 36px;text-align:center;max-width:380px;width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;box-shadow:0 32px 80px #0009,0 0 60px #7c3aed33;animation:modalIn .35s var(--ease-out)}.mm-spinner{font-size:64px;line-height:1;filter:drop-shadow(0 0 20px rgba(167,139,250,.7));animation:mmSpin 3s ease-in-out infinite}@keyframes mmSpin{0%{transform:rotate(-8deg) scale(1)}25%{transform:rotate(8deg) scale(1.08)}75%{transform:rotate(-8deg) scale(1.08)}to{transform:rotate(-8deg) scale(1)}}.mm-title{margin:0;font-size:26px;font-weight:800;background:linear-gradient(135deg,#c4b5fd,#7c3aed);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.mm-sub{margin:0;color:var(--muted);font-size:14px}.mm-elo{color:var(--gold);font-weight:700}.mm-timer{font-size:72px;font-weight:900;line-height:1;font-family:ui-monospace,monospace;background:linear-gradient(180deg,#a78bfa,#6366f1);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 16px rgba(99,102,241,.5))}.mm-hint{margin:0;font-size:12px;color:var(--muted)}.mm-cancel{padding:12px 32px;font-size:15px;font-weight:700;border-radius:999px}.home-hero{text-align:center}.elo-badge{display:inline-block;margin-left:8px;background:linear-gradient(135deg,#fbbf2426,#fbbf240f);border:1px solid rgba(251,191,36,.3);border-radius:999px;padding:2px 10px;font-size:14px;font-weight:700;color:var(--gold);font-family:ui-monospace,monospace}.tc-label{color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:-4px}.home-grid{display:flex;flex-direction:column;gap:16px}.qm-card{border-color:#fbbf2440;background:#100e0ae0}.qm-card:hover{border-color:#fbbf2473;box-shadow:0 8px 40px #fbbf241a!important}.qm-heading{margin:0;font-size:20px;font-weight:800;background:linear-gradient(135deg,#fde68a,#fbbf24,#f59e0b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.qm-btn{background:linear-gradient(135deg,#fbbf24,#f59e0b)!important;border-color:transparent!important;color:#18120a!important;font-weight:800!important;box-shadow:0 4px 20px #fbbf2459!important}.qm-btn:hover:not(:disabled){box-shadow:0 6px 30px #fbbf248c!important;filter:brightness(1.08)!important}.bot-card{border-color:#6366f140}.bot-card:hover{border-color:#6366f173;box-shadow:0 8px 40px #6366f11f!important}.bot-heading{margin:0;font-size:20px;font-weight:800;background:linear-gradient(135deg,#a5b4fc,#6366f1);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.bot-btn{background:linear-gradient(135deg,#6366f1,#4f46e5)!important;border-color:transparent!important;color:#fff!important;font-weight:800!important;box-shadow:0 4px 20px #6366f166!important}.bot-btn:hover:not(:disabled){box-shadow:0 6px 30px #6366f199!important;filter:brightness(1.1)!important}@media (min-width: 768px){.board-wrap{max-width:580px}.game{max-width:100%}.game-layout{display:flex;flex-direction:row;gap:16px;align-items:flex-start;width:100%}.game-main{flex:0 0 auto;width:min(520px,58vw);display:flex;flex-direction:column;gap:10px}.game-side{flex:1;min-width:200px;display:flex;flex-direction:column;gap:10px;position:sticky;top:16px;max-height:calc(100vh - 120px);overflow-y:auto}.game-side .history-list{max-height:260px}.game-side .chat{max-height:300px}.home{max-width:680px}.home-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}}@media (min-width: 720px){.actions{gap:12px;padding:4px 0}.actions button{flex:1;max-width:220px;padding:16px 20px;font-size:15px;font-weight:700;border-radius:14px;letter-spacing:.2px}.board-wrap{max-width:640px}.home{max-width:800px}.home-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.qm-card{border-color:#fbbf244d;box-shadow:0 4px 24px #0006,0 0 30px #fbbf240f,inset 0 1px #ffffff0d}.bot-card{border-color:#6366f14d;box-shadow:0 4px 24px #0006,0 0 30px #6366f114,inset 0 1px #ffffff0d}.card h2{font-size:20px}button.big{padding:16px 22px;font-size:17px}}
