:root{--burnt-orange: #C75B2A;--terracotta: #A0522D;--espresso: #2C1A0E;--cream: #F5EFE6;--amber: #BA7517;--bg: #F6F1E8;--surface: #FFFFFF;--hero-bg: #1b0c05;--text: #2C1A0E;--text-dim: #8a7765;--line: rgba(44, 26, 14, .12);--plate: #F6ECE1;--accent: var(--burnt-orange);--radius: 18px;--radius-lg: 26px;--shadow: 0 12px 34px rgba(44, 26, 14, .14);--shadow-card: 0 20px 50px rgba(44, 26, 14, .2);--font: "Poppins", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overscroll-behavior:none}#root{display:flex;flex-direction:column;min-height:100%}.screen{flex:1;width:100%;max-width:460px;margin:0 auto;padding:max(24px,env(safe-area-inset-top)) 22px max(24px,env(safe-area-inset-bottom));display:flex;flex-direction:column}.center{justify-content:center;align-items:center;text-align:center;gap:16px}.hero{background:var(--hero-bg);border-radius:var(--radius-lg);padding:30px 24px 26px;display:flex;flex-direction:column;align-items:center;gap:10px;box-shadow:var(--shadow);width:100%}.brand-logo{width:200px;max-width:64%;height:auto;display:block}.hero .tagline{color:var(--amber)}.landing-enter{opacity:0;animation:riseIn .6s ease forwards;animation-delay:1.2s}.landing-enter.delay-1{animation-delay:1.34s}.landing-enter.delay-2{animation-delay:1.48s}@keyframes riseIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}h1{font-size:1.8rem;font-weight:700;line-height:1.12;letter-spacing:-.01em}h2{font-size:1.3rem;font-weight:600}.tagline{color:var(--burnt-orange);font-style:italic;font-size:1.02rem}.dim{color:var(--text-dim)}.muted{color:var(--text-dim);font-size:.88rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:var(--radius);padding:16px 22px;font:inherit;font-weight:600;font-size:1.02rem;cursor:pointer;width:100%;transition:transform .08s ease,filter .15s ease,opacity .15s ease}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--burnt-orange);color:var(--cream);box-shadow:var(--shadow)}.btn-primary:hover:not(:disabled){filter:brightness(1.06)}.btn-secondary{background:transparent;color:var(--espresso);border:1.5px solid var(--terracotta)}.btn-ghost{background:transparent;color:var(--text-dim)}.field{width:100%;display:flex;flex-direction:column;gap:6px;text-align:left}.field label{font-size:.82rem;color:var(--text-dim);padding-left:4px}.input{width:100%;border-radius:var(--radius);border:1.5px solid var(--line);background:var(--surface);color:var(--text);padding:15px 18px;font:inherit;font-size:1.02rem;outline:none;transition:border-color .15s ease}.input:focus{border-color:var(--burnt-orange)}.input::placeholder{color:#8a776599}.code-input{text-align:center;letter-spacing:.5em;font-size:2.1rem;font-weight:700;padding-left:.5em}.stack{display:flex;flex-direction:column;gap:13px;width:100%}.spacer{flex:1}.row{display:flex;gap:12px;align-items:center}.top-bar{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:10px}.vibe-name{font-weight:700;font-size:1.1rem}.vibe-desc{font-size:.76rem;color:var(--text-dim);padding:0 10px}.vibe-swipe{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;width:100%}.vibe-swipe-card{position:relative;z-index:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:min(76vw,318px);aspect-ratio:2 / 3;border-radius:22px;background:var(--surface);border:1.5px solid var(--line);box-shadow:var(--shadow-card);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:grab;font:inherit;color:var(--text);touch-action:none;padding:20px;user-select:none;-webkit-user-select:none;overflow:hidden}.vibe-swipe-card:active{cursor:grabbing}.vibe-card-inner{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.vibe-swipe-icon{width:96px;height:96px;border-radius:22px;object-fit:cover;background:var(--plate);box-shadow:0 5px 16px #2c1a0e29}.vibe-swipe-icon.big{width:188px;height:188px;border-radius:30px}.vibe-swipe-card .vibe-name{font-size:1.8rem;font-weight:700}.vibe-swipe-card .vibe-desc{font-size:.92rem;color:var(--text-dim)}.vibe-choose{position:absolute;bottom:18px;left:0;right:0;text-align:center;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--burnt-orange);opacity:.85}.vibe-dots{display:flex;gap:8px;align-items:center}.vibe-dots i{width:8px;height:8px;border-radius:50%;background:var(--line);transition:all .2s ease}.vibe-dots i.on{background:var(--burnt-orange);width:22px;border-radius:999px}.player-list{display:flex;flex-direction:column;gap:10px;width:100%}.player-chip{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px}.player-chip .avatar{width:34px;height:34px;border-radius:50%;background:var(--terracotta);color:var(--cream);display:flex;align-items:center;justify-content:center;font-weight:700}.player-chip .tag{margin-left:auto;font-size:.7rem;letter-spacing:.08em;color:var(--amber);font-weight:700}.player-chip.ready{border-color:var(--amber)}.badge-code{font-size:2.5rem;font-weight:700;letter-spacing:.28em;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 22px 16px 30px;display:inline-block;color:var(--espresso)}.game-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(20px,env(safe-area-inset-top)) 20px max(28px,env(safe-area-inset-bottom));background:var(--bg);overflow:hidden;perspective:1300px}.peek-wrap{position:absolute;left:50%;transform:translate(-50%);top:calc(min(72vw,300px) * 1.5 * -.62);width:min(72vw,300px);height:calc(min(72vw,300px)*1.5)}.peek-card{position:absolute;left:0;top:0;width:100%;aspect-ratio:2 / 3;border-radius:20px;box-shadow:var(--shadow-card);background-image:url(/card-back.png);background-size:cover;background-position:center}.peek-b1{transform:translate(6px,-6px) rotate(2deg);opacity:.85}.peek-b2{transform:translate(-6px,-11px) rotate(-2deg);opacity:.7}.peek-top{cursor:grab;touch-action:none}.peek-top:active{cursor:grabbing}.stage-hint{position:absolute;bottom:max(44px,env(safe-area-inset-bottom));left:0;right:0;text-align:center;color:var(--text-dim);font-size:.92rem}.pull-arrow{display:block;font-size:1.4rem;animation:bobArrow 1.6s ease-in-out infinite}@keyframes bobArrow{0%,to{transform:translateY(0);opacity:.6}50%{transform:translateY(7px);opacity:1}}.card-glow{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:min(96vw,460px);height:min(96vw,460px);border-radius:50%;background:radial-gradient(circle,rgba(199,91,42,.2),rgba(186,117,23,.08) 45%,transparent 68%);filter:blur(10px);z-index:0;pointer-events:none;animation:glowPulse 4.5s ease-in-out infinite}@keyframes glowPulse{0%,to{transform:scale(1);opacity:.85}50%{transform:scale(1.06);opacity:1}}.deal-card{width:min(84vw,360px);aspect-ratio:2 / 3;position:relative;z-index:1;transform-style:preserve-3d;cursor:pointer}.deal-card .face{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:22px;backface-visibility:hidden;box-shadow:var(--shadow-card);overflow:hidden}.deal-card .face-back{background-image:url(/card-back.png);background-size:cover;background-position:center}.deal-card .face-front{background:var(--surface);color:var(--espresso);transform:rotateY(180deg);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 24px}.deal-card .face-front.wildcard{background:linear-gradient(165deg,var(--burnt-orange),var(--terracotta));color:var(--cream)}.deal-card .face-front .pc-top{position:absolute;top:18px;left:0;right:0;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--burnt-orange);opacity:.85}.deal-card .face-front.wildcard .pc-top{color:var(--cream);opacity:.9}.deal-card .face-front .pc-text{font-size:1.5rem;font-weight:600;line-height:1.3}.deal-card .face-front .pc-mark{position:absolute;bottom:16px;left:0;right:0;font-size:.95rem;font-weight:700;color:var(--burnt-orange);opacity:.5;letter-spacing:.1em}.deal-card .face-front.wildcard .pc-mark{color:var(--cream);opacity:.7}.game-menu-btn{position:absolute;top:max(16px,env(safe-area-inset-top));right:16px;z-index:22;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--text-dim);font-size:1.4rem;line-height:1;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;padding-bottom:6px;box-shadow:var(--shadow)}.game-menu-btn:active{transform:scale(.94)}.turn-indicator{position:absolute;top:max(18px,env(safe-area-inset-top));left:0;right:0;display:flex;align-items:center;justify-content:center;gap:9px;color:var(--text);font-size:1.02rem;font-weight:600}.turn-indicator .who-dot{width:9px;height:9px;border-radius:50%;background:var(--burnt-orange);box-shadow:0 0 0 4px #c75b2a29}.turn-indicator .sub{color:var(--text-dim);font-weight:500}.shuffle{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;perspective:900px;z-index:6;transition:opacity .45s ease,transform .45s cubic-bezier(.4,0,.2,1)}.shuffle.lift{opacity:0;transform:translateY(-24%) scale(.9)}.shuffle.lift .s-hint{opacity:0}.soft-in{animation:softIn .55s ease both}@keyframes softIn{0%{opacity:0}to{opacity:1}}.shuffle .s-card{position:absolute;width:min(70vw,300px);aspect-ratio:2 / 3;border-radius:20px;box-shadow:var(--shadow-card);background-image:url(/card-back.png);background-size:cover;background-position:center}.shuffle .s-card{animation-duration:2.5s;animation-timing-function:cubic-bezier(.45,0,.25,1);animation-iteration-count:1;animation-fill-mode:both}.shuffle .s-card:nth-child(1){animation-name:shuffle1}.shuffle .s-card:nth-child(2){animation-name:shuffle2}.shuffle .s-card:nth-child(3){animation-name:shuffle3}.shuffle .s-card:nth-child(4){animation-name:shuffle4}@keyframes shuffle1{0%{transform:none}15%{transform:translate(-112px,-30px) rotate(-11deg)}34%{transform:translate(-134px,12px) rotate(-17deg)}54%{transform:translate(-22px,-8px) rotate(-4deg)}72%{transform:translate(9px,4px) rotate(4deg)}88%{transform:translate(-3px,1px) rotate(-1deg)}to{transform:none}}@keyframes shuffle2{0%{transform:none}15%{transform:translate(116px,-26px) rotate(12deg)}34%{transform:translate(136px,14px) rotate(18deg)}54%{transform:translate(18px,-6px) rotate(5deg)}72%{transform:translate(-8px,3px) rotate(-3deg)}88%{transform:translate(4px,1px) rotate(1deg)}to{transform:none}}@keyframes shuffle3{0%{transform:none}12%{transform:translate(-92px,28px) rotate(-8deg)}33%{transform:translate(-122px,-14px) rotate(-14deg)}52%{transform:translate(-30px,13px) rotate(-6deg)}70%{transform:translate(11px,-5px) rotate(5deg)}86%{transform:translate(-4px,2px) rotate(-1deg)}to{transform:none}}@keyframes shuffle4{0%{transform:none}12%{transform:translate(96px,24px) rotate(9deg)}33%{transform:translate(126px,-18px) rotate(15deg)}52%{transform:translate(28px,11px) rotate(6deg)}70%{transform:translate(-9px,-3px) rotate(-4deg)}86%{transform:translate(5px,-1px) rotate(1deg)}to{transform:none}}.shuffle .s-hint{position:absolute;bottom:20%;color:var(--text-dim);font-size:.9rem;letter-spacing:.12em;text-transform:uppercase;animation:fadeIn .6s ease}.listen-view{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%}.listen-back{width:min(52vw,210px);aspect-ratio:2 / 3;border-radius:18px;background-image:url(/card-back.png);background-size:cover;background-position:center;box-shadow:var(--shadow-card)}.listen-label{font-size:1.2rem;font-weight:600;text-align:center}.listen-label .sub{color:var(--text-dim);font-weight:500}.reaction-layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:20}.bubble{position:absolute;bottom:20%;background:var(--surface);border:1px solid var(--line);color:var(--espresso);padding:9px 16px;border-radius:999px;font-weight:700;font-size:.92rem;box-shadow:var(--shadow);white-space:nowrap;animation:bubbleUp 2.6s ease-out forwards}@keyframes bubbleUp{0%{transform:translateY(24px) scale(.7);opacity:0}15%{transform:translateY(0) scale(1);opacity:1}80%{opacity:1}to{transform:translateY(-240px) scale(1);opacity:0}}.followups{display:flex;flex-direction:column;gap:8px;width:100%;margin-bottom:4px}.followup{background:#ba75171a;border:1px solid rgba(186,117,23,.32);border-radius:14px;padding:10px 14px;text-align:center}.followup.mine{background:#c75b2a24;border-color:var(--burnt-orange)}.followup .fu-who{display:block;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--amber);font-weight:700;margin-bottom:2px}.followup .fu-badge{display:inline-block;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--cream);background:var(--burnt-orange);padding:4px 11px;border-radius:999px;margin-bottom:8px}.followup .fu-lead{display:block;font-size:.9rem;color:var(--text-dim);margin-bottom:7px}.followup .fu-invite{display:block;font-size:1.02rem;font-weight:600;color:var(--espresso);line-height:1.35}.followup.mine .fu-who{color:var(--burnt-orange)}.followup .fu-text{font-size:.98rem;color:var(--espresso);font-style:italic}.ready-zone{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 20px}.ready-pill{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1.5px solid var(--terracotta);background:var(--surface);color:var(--espresso);border-radius:999px;padding:13px 30px;font:inherit;font-weight:600;cursor:pointer;transition:transform .08s ease,background .15s ease,color .15s ease}.ready-pill:active{transform:scale(.96)}.ready-pill.on{background:var(--burnt-orange);color:var(--cream);border-color:var(--burnt-orange)}.ready-dots{display:flex;gap:6px}.ready-dots i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:background .2s ease}.ready-dots i.lit{background:var(--amber)}.sheet-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:8;background:#1b0c0547;animation:fadeIn .2s ease}.sheet{z-index:9;position:absolute;left:0;right:0;bottom:0;background:var(--surface);border-top-left-radius:22px;border-top-right-radius:22px;box-shadow:0 -10px 30px #2c1a0e29;padding:22px 24px max(26px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px;animation:sheetUp .25s ease}@keyframes sheetUp{0%{transform:translateY(100%)}to{transform:none}}.sheet .sheet-row{display:flex;justify-content:space-between;color:var(--text-dim);font-size:.85rem}.sheet .sheet-title{font-size:1.25rem;font-weight:700;color:var(--espresso)}.sheet .sheet-sub{color:var(--text-dim);font-size:.95rem;margin-top:-4px}.sheet .end-link{text-align:center;margin-top:2px}.splash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:var(--hero-bg);display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .52s ease}.splash.leaving{opacity:0}.splash img{width:100%;height:100%;object-fit:contain;max-width:460px;transition:transform .6s ease}.splash.leaving img{transform:scale(1.05)}.nudge-flash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;pointer-events:none;background:radial-gradient(circle at 50% 42%,rgba(199,91,42,.3),transparent 62%);animation:nudgePulse .55s ease-out 3}@keyframes nudgePulse{0%,to{opacity:0}35%{opacity:1}}.nudge-toast{position:fixed;top:max(20px,env(safe-area-inset-top));left:50%;transform:translate(-50%);z-index:41;background:var(--espresso);color:var(--cream);padding:12px 20px;border-radius:999px;font-weight:600;box-shadow:var(--shadow);white-space:nowrap;animation:toastIn .3s ease}@keyframes toastIn{0%{opacity:0;transform:translate(-50%) translateY(-10px)}to{opacity:1;transform:translate(-50%)}}.banner{width:100%;background:#fbeede;border:1px solid var(--amber);border-radius:12px;padding:12px 14px;font-size:.85rem;color:var(--espresso)}.link{color:var(--terracotta);text-decoration:underline;cursor:pointer;background:none;border:none;font:inherit}a{color:var(--terracotta)}.empty-img{width:66%;max-width:220px}.lobby-empty{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:8px 0}.lobby-empty .empty-img{width:52%;max-width:180px}.endgame-logo{width:56%;max-width:178px;border-radius:22px;box-shadow:var(--shadow)}.room-loader{display:flex;flex-direction:column;align-items:center;gap:14px}.room-spinner{width:38px;height:38px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--burnt-orange);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.endgame .parting{width:100%;margin-top:18px;padding:18px;background:#ba75171a;border:1px solid rgba(186,117,23,.3);border-radius:var(--radius);display:flex;flex-direction:column;gap:8px}.endgame .parting-label{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--amber)}.endgame .parting-q{font-size:1.18rem;font-weight:600;line-height:1.35;color:var(--espresso)}.endgame .credit{margin-top:16px;font-size:.82rem;color:var(--text-dim);opacity:.8}.fade-in{animation:fadeIn .35s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.shuffle .s-card,.card-glow,.pull-arrow,.nudge-flash,.bubble,.room-spinner,.splash.leaving img{animation:none!important}.shuffle{transition:opacity .3s ease}.shuffle.lift,.splash.leaving img{transform:none}.bubble{transform:none;opacity:1}.landing-enter{animation-duration:.01ms}}