*,*:before,*:after{box-sizing:border-box}:root{--bg: #14121e;--bg-card: #211d30;--bg-card-hover: #2c263d;--surface: #2c263d;--surface-input: #191623;--border: #827394;--accent-hover: #cbb9ff;--border-subtle: #3e364f;--text: #f8f5ff;--text-muted: #c0b7d1;--accent: #ff8ac2;--accent-2: #b9a0ff;--accent-3: #ffe08a;--success: #81e2bb;--danger: #ff8d9c;--text-on-accent: #14121e;--focus-ring: #ffe08a;--selection-ring: #b9a0ff;--radius: 24px;--radius-control: 14px;--radius-badge: 999px;--space: 8px;--shadow: 0 16px 48px rgb(0 0 0 / 24%);--glow-purple: rgb(185 160 255 / 12%);--glow-pink: rgb(255 138 194 / 9%);--glow-yellow: rgb(255 224 138 / 5%);font-family:Nunito,system-ui,sans-serif;font-size:16px;line-height:1.5;font-weight:600;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 0%,var(--glow-purple),transparent 65%),radial-gradient(ellipse at 100% 80%,rgb(255 138 194 / 4%),transparent 55%),var(--bg);background-attachment:fixed}#root{min-height:100vh}button,input{font:inherit;min-height:44px}button{touch-action:manipulation}button:focus-visible,input:focus-visible{outline:3px solid var(--focus-ring);outline-offset:4px}h1,h2,h3{font-weight:900;line-height:1.2;overflow-wrap:anywhere}.page{position:relative;min-height:100vh;padding:2rem 1.25rem 3rem;max-width:960px;margin:0 auto;overflow:clip}.bg-shapes{display:none}.hero,.home-grid,.lobby-header,.lobby-main,.status-bar{position:relative;z-index:1}.hero{text-align:center;margin-bottom:2.5rem;padding-top:24px}.logo-badge{display:inline-block;padding:.35rem .85rem;border-radius:999px;background:var(--surface);border:1px solid var(--border);font-size:.75rem;letter-spacing:.12em;color:var(--accent);font-weight:900;transform:rotate(-3deg);margin-bottom:1rem}.title-main{background:none;color:var(--text);letter-spacing:-.06em;text-shadow:4px 4px 0 var(--surface)}.title{margin:0 0 1rem;display:flex;flex-direction:column;gap:.25rem}.brand-logo{display:block;width:min(100%,340px);height:auto;align-self:center;margin-bottom:.75rem}.title-sub{font-size:clamp(1rem,3vw,1.35rem);color:var(--text-muted);font-weight:700}.tagline{margin:0 auto;max-width:36rem;color:var(--text-muted);font-size:1.05rem}.home-grid{display:grid;gap:1.25rem}@media(min-width:720px){.home-grid{grid-template-columns:1fr 1fr}}.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow)}.card-create{border-top:3px solid var(--accent-2)}.card-join{border-top:3px solid var(--accent)}.card h2{margin:0 0 .35rem;font-size:1.35rem}.card-desc{margin:0 0 1.25rem;color:var(--text-muted);font-size:.95rem}.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}.field span{font-size:.85rem;color:var(--text-muted)}.field input{width:100%;padding:.75rem 1rem;border-radius:var(--radius-control);border:1px solid var(--border);background:var(--surface-input);color:var(--text);outline:none;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:var(--accent-2);box-shadow:0 0 0 3px var(--glow-purple)}.field input::placeholder{color:var(--text-muted);opacity:1}.field input:disabled{opacity:.5;cursor:not-allowed}.code-input{letter-spacing:.35em;text-transform:uppercase;font-weight:800;font-size:1.1rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.8rem 1.25rem;border-radius:var(--radius-control);border:none;cursor:pointer;font-weight:800;transition:transform .12s,opacity .12s,background .12s}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn:not(:disabled):hover{transform:translateY(-1px)}.btn-primary{width:100%;background:var(--accent-2);color:var(--text-on-accent)}.btn-secondary{width:100%;background:var(--surface);color:var(--text);border:1px solid var(--border)}.btn-outline{background:transparent;color:var(--text-muted);border:1px solid var(--border)}.btn-ghost{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:.5rem .85rem;font-size:.85rem}.status-bar{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:2rem;color:var(--text-muted);font-size:.9rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--text-muted)}.status-dot.online{background:var(--success);box-shadow:0 0 8px var(--success)}.status-dot.offline{background:var(--danger)}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);padding:.85rem 1.25rem;border-radius:var(--radius-control);z-index:100;max-width:calc(100% - 2rem);text-align:center;box-shadow:var(--shadow)}.toast-error{background:var(--bg-card);border:1px solid var(--danger);color:var(--danger)}.lobby-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.lobby-header-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:1rem;margin-left:auto}.lobby-header-actions>*{flex-shrink:0}.lobby-label{margin:0 0 .25rem;color:var(--text-muted);font-size:.85rem}.lobby-code-row{display:flex;align-items:center;flex-wrap:nowrap;gap:.5rem}.lobby-code{position:relative;display:inline-block;font-size:2rem;font-weight:900;letter-spacing:.2em;color:var(--accent-3);padding:8px 16px;border:1px dashed var(--accent-3);border-radius:var(--radius-control);background:var(--bg-card)}.lobby-code__sizer{display:block;font-variant-numeric:tabular-nums}.lobby-code--hidden .lobby-code__sizer{visibility:hidden}.lobby-code__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;letter-spacing:.2em}.btn-icon{flex-shrink:0;min-width:44px;padding-inline:.65rem}.lobby-main{display:grid;gap:1.25rem}@media(min-width:720px){.lobby-main{grid-template-columns:1fr 1.2fr;align-items:start}}.player-count{color:var(--text-muted);font-size:1rem;font-weight:700}.player-list{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-direction:column;gap:.65rem}.player-item{display:flex;align-items:center;gap:.75rem;padding:.65rem .75rem;border-radius:var(--radius-control);background:var(--surface-input);border:1px solid transparent}.player-item.you{border-color:var(--selection-ring);background:var(--surface)}.player-avatar{width:40px;height:40px;flex-shrink:0;border-radius:14px;display:grid;place-items:center;color:var(--text-on-accent);background:var(--avatar-color, var(--accent-2));font-weight:900;font-size:.9rem}.player-name{flex:1;min-width:0;overflow-wrap:anywhere}.host-badge{flex-shrink:0;font-size:.75rem;padding:.2rem .5rem;border-radius:999px;background:var(--surface);color:var(--accent-3);border:1px solid var(--accent-3)}.lobby-waiting-card{text-align:center}.lobby-stage-badge{display:inline-block;margin:0 0 .75rem;border:none;font:inherit;padding:.25rem .75rem;font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-3);background:color-mix(in srgb,var(--accent-3) 12%,transparent);border-radius:999px}.lobby-matchmaking-activity{display:flex;flex-direction:column;align-items:center;gap:.75rem;margin-bottom:1rem}.lobby-matchmaking-hint{margin:0;max-width:28rem}.lobby-dots{display:inline-flex;align-items:center;gap:.5rem;min-height:2.5rem}.lobby-dots span{width:.65rem;height:.65rem;border-radius:50%;background:var(--accent-3);animation:lobby-dot-pulse 1.2s ease-in-out infinite}.lobby-dots span:nth-child(2){animation-delay:.15s}.lobby-dots span:nth-child(3){animation-delay:.3s}@keyframes lobby-dot-pulse{0%,80%,to{opacity:.35;transform:scale(.85)}40%{opacity:1;transform:scale(1)}}.waiting-icon{display:inline-grid;place-items:center;width:80px;height:80px;border-radius:24px;background:var(--surface);font-size:3rem;margin:8px 0 16px;transform:rotate(-5deg)}.waiting-icon--active{animation:lobby-icon-wobble 2.5s ease-in-out infinite}@keyframes lobby-icon-wobble{0%,to{transform:rotate(-5deg) scale(1)}50%{transform:rotate(5deg) scale(1.05)}}.lobby-waiting-card p{color:var(--text-muted);margin:0 0 1.25rem}.waiting-hint{font-size:.95rem;color:var(--text-muted);margin:0}.game-page{display:grid;gap:1rem;max-width:1040px}.game-main,.game-sidebar,.home-grid>*,.lobby-main>*{min-width:0}@media(min-width:900px){.game-page{grid-template-columns:1fr 280px;align-items:start}.game-sidebar{grid-row:1 / span 2;grid-column:2}.game-header,.game-main{grid-column:1}}.game-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;position:relative;z-index:1}.game-header__stage{margin:0 0 .15rem;font-size:.8rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--accent-3)}.game-header__round{margin:0;font-weight:800}.game-main,.game-sidebar{position:relative;z-index:1}.game-phase h1{margin-top:0}.game-phase--center{text-align:center}.game-phase__actions{display:flex;flex-direction:column;align-items:center;gap:.75rem;margin-top:1.5rem}.game-hint{color:var(--text-muted)}.game-hint--warn{color:var(--accent-3)}.game-error{color:var(--danger)}.game-phase__meta{color:var(--text-muted);margin:0 0 .5rem}.game-phase__label{text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;color:var(--accent-3)}.game-timer{min-width:120px;padding:8px 12px;border-radius:var(--radius-control);background:var(--bg-card)}.game-timer__label{display:block;font-size:.75rem;color:var(--text-muted)}.game-timer__numeric{font-size:1.35rem;font-weight:900;font-variant-numeric:tabular-nums}.game-timer__bar{height:6px;background:var(--surface);border-radius:999px;overflow:hidden;margin-top:.35rem}.game-timer__fill{height:100%;background:var(--accent-2);transition:width .1s linear}.game-timer--urgent .game-timer__numeric{color:var(--danger)}.game-timer--urgent .game-timer__fill{background:var(--danger)}.game-timer--idle{min-width:120px;font-size:.95rem;font-weight:700;color:var(--text-muted)}.prompt-display{padding:20px;background:var(--surface);border-radius:16px;font-weight:800;overflow-wrap:anywhere;font-size:clamp(1.1rem,4vw,1.45rem);text-align:center;line-height:1.45}.prompt-display--sm{font-size:1.05rem}.prompt-display__blank{color:var(--accent);text-decoration:underline wavy}.gif-picker{margin-top:1rem}.gif-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.65rem;margin:1rem 0;max-height:42vh;overflow:auto}.gif-thumb{position:relative;min-width:0;padding:0;border:2px solid transparent;border-radius:var(--radius-control);overflow:hidden;background:var(--surface-input);cursor:pointer}.gif-thumb:not(:disabled):hover{border-color:var(--accent)}.gif-thumb:disabled{cursor:not-allowed}.gif-thumb__badge{position:absolute;bottom:4px;left:4px;right:4px;padding:4px;border-radius:8px;background:var(--accent-2);color:var(--text-on-accent);font-size:12px;font-weight:900}.gif-thumb img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.gif-thumb--selected{border-color:var(--accent-2);box-shadow:0 0 0 3px var(--glow-purple)}.gif-picker__confirm{display:flex;align-items:center;gap:1rem;position:sticky;bottom:0;padding-top:.75rem;padding-bottom:8px;background:var(--bg-card)}.gif-picker__preview{width:64px;height:64px;object-fit:cover;border-radius:10px}.battle-card{text-align:center}.battle-gif{max-height:50vh;max-width:100%;border-radius:16px;margin:1rem auto;display:block}.vote-panel{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}.vote-option{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;border-radius:16px;border:2px solid var(--border);background:var(--surface-input);cursor:pointer;color:inherit}.vote-option:not(:disabled):hover{border-color:var(--accent);background:var(--surface)}.vote-option:not(:disabled):active{transform:translateY(1px)}.vote-option:disabled{cursor:default;opacity:1}.vote-option--selected{border-color:var(--accent-2);background:var(--surface);box-shadow:0 0 0 2px var(--selection-ring)}.vote-option--selected .vote-option__btn{background:var(--accent-2);color:var(--text-on-accent);border-color:var(--accent-2)}.vote-option--readonly{cursor:default;pointer-events:none}.vote-option--readonly:hover{border-color:var(--border)}.vote-option__gif{width:100%;border-radius:var(--radius-control);aspect-ratio:1;object-fit:cover}.vote-option__btn{pointer-events:none}.role-badge{display:inline-block;margin-top:.75rem;padding:.35rem .75rem;border-radius:999px;background:var(--surface);border:1px solid var(--accent)}.scoreboard-wrap h3{margin-top:0}.scoreboard{list-style:none;margin:0;padding:0}.scoreboard li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:12px 8px;border-bottom:1px solid var(--border-subtle)}.scoreboard li>span{min-width:0;overflow-wrap:anywhere}.scoreboard li>strong{flex-shrink:0;font-variant-numeric:tabular-nums}.scoreboard__you{color:var(--accent-3);background:var(--surface);border-radius:8px}.battle-results__headline{text-align:center;font-size:1.2rem;color:var(--accent-3);font-weight:900}.battle-results__entries{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}.battle-results__entry{padding:12px;background:var(--surface);border-radius:16px;min-width:0;overflow-wrap:anywhere}.battle-results__entry-label{display:block;margin-bottom:8px;color:var(--text-muted)}.battle-results__entry img{width:100%;border-radius:var(--radius-control)}.battle-results__votes{list-style:none;padding:0;margin:0}.battle-results__votes li{padding:.25rem 0;color:var(--text-muted);overflow-wrap:anywhere}.lang-toggle{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border)}.home-lang-toggle{position:absolute;top:16px;right:16px;z-index:2}.lang-toggle__btn{border:none;background:transparent;color:var(--text-muted);font-weight:700;font-size:13px;padding:6px 12px;border-radius:999px;cursor:pointer}.lang-toggle__btn--active{background:var(--accent);color:var(--text-on-accent)}.btn-primary:not(:disabled):hover{background:var(--accent-hover)}.btn-secondary:not(:disabled):hover,.btn-ghost:not(:disabled):hover,.btn-outline:not(:disabled):hover{background:var(--surface);border-color:var(--accent-2)}.btn:not(:disabled):active{transform:translateY(1px)}.btn:disabled,input:disabled{opacity:1;color:var(--text-muted);background:var(--surface);border:1px dashed var(--border);cursor:not-allowed}@media(max-width:520px){.page{padding:24px 16px}.card{padding:20px}.hero{padding-top:8px}.lobby-header{flex-wrap:wrap}.vote-panel,.battle-results__entries{grid-template-columns:1fr}.gif-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.game-phase__actions{align-items:stretch}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}