:root{--cream: #fff6e3;--cream-dim: #fbecd2;--ink: #2b2420;--pastel-yellow: #ffd977;--pastel-orange: #ffb15e;--pastel-pink: #ff9eb0;--pastel-purple: #c9a6ff;--pastel-blue: #8fd0ff;--pastel-mint: #8be8b8;--pastel-green: #6fe07d;--pastel-red: #ff8a7a;--bright-green: #27e05a;--muted: #5c4a35;--outline: 3px;--outline-thick: 4px;--radius-sm: 14px;--radius-md: 20px;--radius-lg: 28px;--radius-pill: 999px;--shadow-off: 5px;--shadow-off-lg: 7px;--font-display: "Baloo 2", "Nunito", system-ui, sans-serif;--font-body: "Nunito", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--cream);background-image:radial-gradient(circle at 10% 10%,var(--cream-dim) 0%,transparent 40%),radial-gradient(circle at 90% 85%,var(--cream-dim) 0%,transparent 40%);color:var(--ink);font-family:var(--font-body);-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}h1,h2,h3,.display{font-family:var(--font-display);font-weight:700;margin:0}.app-shell{min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:24px 18px calc(24px + env(safe-area-inset-bottom));max-width:480px;margin:0 auto}.app-shell.wide{max-width:960px}.panel{width:100%;background:#fff;border:var(--outline-thick) solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-off-lg) var(--shadow-off-lg) 0 0 var(--ink);padding:24px}.chip{display:inline-flex;align-items:center;gap:6px;border:var(--outline) solid var(--ink);border-radius:var(--radius-pill);padding:6px 14px;font-weight:700;font-family:var(--font-display);box-shadow:3px 3px 0 0 var(--ink);background:var(--pastel-yellow)}.btn{font-family:var(--font-display);font-weight:700;font-size:1.05rem;color:var(--ink);background:var(--pastel-yellow);border:var(--outline-thick) solid var(--ink);border-radius:var(--radius-md);padding:16px 22px;box-shadow:var(--shadow-off) var(--shadow-off) 0 0 var(--ink);cursor:pointer;width:100%;display:flex;align-items:center;justify-content:center;gap:10px;transition:transform 80ms ease,box-shadow 80ms ease;-webkit-user-select:none;user-select:none;touch-action:manipulation;position:relative;z-index:1}.btn:active{transform:translate(var(--shadow-off),var(--shadow-off));box-shadow:0 0 0 0 var(--ink)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:var(--shadow-off) var(--shadow-off) 0 0 var(--ink)}.btn.secondary{background:#fff}.btn.pink{background:var(--pastel-pink)}.btn.blue{background:var(--pastel-blue)}.btn.purple{background:var(--pastel-purple)}.btn.mint{background:var(--pastel-mint)}.btn.green{background:var(--pastel-green)}.btn.orange{background:var(--pastel-orange)}.btn.red{background:var(--pastel-red)}.btn.small{padding:10px 16px;font-size:.9rem;width:auto}.btn-row{display:flex;gap:12px;width:100%}.field{width:100%;font-family:var(--font-body);font-weight:700;font-size:1.1rem;color:var(--ink);background:#fff;border:var(--outline-thick) solid var(--ink);border-radius:var(--radius-md);padding:14px 16px;box-shadow:3px 3px 0 0 var(--ink);outline:none}.field::placeholder{color:#bdb2a0;font-weight:700}.field.code{text-align:center;letter-spacing:.4em;font-family:var(--font-display);font-size:1.8rem;text-transform:uppercase}label.label{font-weight:800;font-family:var(--font-display);font-size:.85rem;letter-spacing:.02em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;display:block}.stack{display:flex;flex-direction:column;gap:16px;width:100%}.stack.sm{gap:10px}.stack.lg{gap:24px}.center-col{flex:1;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.subtitle{color:var(--muted);font-weight:700;text-align:center}.game-code{font-family:var(--font-display);font-size:3rem;letter-spacing:.3em;font-weight:800;background:var(--pastel-purple);border:var(--outline-thick) solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-off-lg) var(--shadow-off-lg) 0 0 var(--ink);padding:18px 10px;text-align:center;width:100%}.player-pill{display:flex;align-items:center;gap:10px;background:#fff;border:var(--outline) solid var(--ink);border-radius:var(--radius-pill);padding:10px 16px;font-weight:800;box-shadow:3px 3px 0 0 var(--ink)}.player-pill .dot{width:10px;height:10px;border-radius:50%;background:var(--pastel-green);border:1.5px solid var(--ink)}.player-pill.offline .dot{background:#d8cdbb}.player-pill.host{background:var(--pastel-yellow)}.player-pill.voted{background:var(--pastel-mint)}.player-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;width:100%}.card-wrap{width:100%;aspect-ratio:3 / 4;max-height:44dvh;flex-shrink:0;position:relative;z-index:0}.secret-card{width:100%;height:100%;border:var(--outline-thick) solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-off-lg) var(--shadow-off-lg) 0 0 var(--ink);background:var(--pastel-blue);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;padding:20px;text-align:center;-webkit-user-select:none;user-select:none}.secret-card.hidden-state{background:repeating-linear-gradient(135deg,var(--pastel-purple),var(--pastel-purple) 14px,#b98ff5 14px,#b98ff5 28px);background-repeat:repeat;animation:stripeScroll 5s linear infinite}.secret-card.chameleon-state{background:var(--pastel-green)}.secret-card .word{font-family:var(--font-display);font-size:2.1rem;font-weight:800;line-height:1.1}.secret-card .hint{font-weight:700;color:#2b2420d1}.hold-hint{text-align:center;font-weight:700;color:var(--muted)}.category-chip{display:inline-flex;align-items:center;gap:6px;border:var(--outline) solid var(--ink);border-radius:var(--radius-pill);padding:5px 12px;font-weight:700;font-size:.9rem;font-family:var(--font-body);background:var(--pastel-purple);box-shadow:3px 3px 0 0 var(--ink)}.turn-timer circle:nth-of-type(2){transition:stroke-dashoffset .1s linear,stroke .2s ease}.turn-timer.urgent{animation:wiggle .4s ease-in-out infinite}.mute-btn{width:40px;height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#fff;border:var(--outline) solid var(--ink);border-radius:50%;box-shadow:3px 3px 0 0 var(--ink);cursor:pointer;transition:transform 80ms ease,box-shadow 80ms ease}.mute-btn:active{transform:translate(3px,3px);box-shadow:0 0 0 0 var(--ink)}@keyframes stripeScroll{0%{background-position:0 0}to{background-position:79.2px 79.2px}}@media (prefers-reduced-motion: reduce){.secret-card.hidden-state{animation:none}}.flash-green{background:var(--bright-green)!important;animation:flashPulse .9s ease-in-out infinite alternate}@keyframes flashPulse{0%{filter:brightness(1)}to{filter:brightness(1.15)}}.host-stage{width:100%;text-align:center}.host-stage h1{font-size:clamp(1.8rem,4vw,3rem)}.turn-banner{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,2.2rem);font-weight:800;background:var(--pastel-orange);border:var(--outline-thick) solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-off-lg) var(--shadow-off-lg) 0 0 var(--ink);padding:20px}.icon-row{display:flex;align-items:center;justify-content:center;gap:8px}.badge-result{font-family:var(--font-display);font-size:1.6rem;font-weight:800;text-align:center;padding:16px;border-radius:var(--radius-lg);border:var(--outline-thick) solid var(--ink);box-shadow:var(--shadow-off-lg) var(--shadow-off-lg) 0 0 var(--ink)}.badge-result.win{background:var(--pastel-mint)}.badge-result.lose{background:var(--pastel-red)}.badge-result.stacked{display:flex;flex-direction:column;align-items:center;gap:8px}.error-text{color:#9c2f24;font-weight:800;text-align:center}.link-btn{background:none;border:none;font-family:var(--font-body);font-weight:800;text-decoration:underline;color:var(--muted);cursor:pointer;padding:8px}@keyframes popIn{0%{transform:scale(.82);opacity:0}70%{transform:scale(1.04);opacity:1}to{transform:scale(1);opacity:1}}.pop-in{animation:popIn .38s cubic-bezier(.26,1.4,.4,1) both}@keyframes floatY{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}.float{animation:floatY 3.2s ease-in-out infinite;display:inline-block}@keyframes wiggle{0%,to{transform:rotate(0) scale(1)}25%{transform:rotate(-8deg) scale(1.05)}75%{transform:rotate(8deg) scale(1.05)}}.wiggle{animation:wiggle .65s ease-in-out;display:inline-block}@keyframes bannerPulse{0%,to{box-shadow:var(--shadow-off-lg) var(--shadow-off-lg) 0 0 var(--ink)}50%{box-shadow:var(--shadow-off-lg) var(--shadow-off-lg) 0 2px var(--ink)}}.turn-banner{animation:bannerPulse 1.8s ease-in-out infinite}@keyframes chipPop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.player-pill{animation:chipPop .28s cubic-bezier(.26,1.4,.4,1) both}@media (hover: hover){.btn:not(:disabled):hover{transform:translate(-2px,-2px);box-shadow:calc(var(--shadow-off) + 2px) calc(var(--shadow-off) + 2px) 0 0 var(--ink)}}@media (prefers-reduced-motion: reduce){.pop-in,.float,.wiggle,.turn-banner,.player-pill,.turn-timer.urgent{animation:none!important}}textarea.field{resize:vertical;min-height:90px;font-size:.95rem;letter-spacing:normal;text-transform:none;text-align:left;font-family:var(--font-body)}