*{margin:0;padding:0;box-sizing:border-box}body{font-family:Nunito,sans-serif;background:linear-gradient(135deg,#0f0c29,#302b63,#24243e);min-height:100vh;overflow:hidden;color:#fff}#root{width:100vw;height:100vh}.lobby{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:30px;background:linear-gradient(135deg,#0f0c29,#302b63,#24243e);position:relative;overflow:hidden}.lobby:before{content:"";position:absolute;inset:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 50%,rgba(255,107,107,.1) 0%,transparent 50%),radial-gradient(circle at 70% 50%,rgba(78,205,196,.1) 0%,transparent 50%);animation:bgPulse 8s ease-in-out infinite}@keyframes bgPulse{0%,to{transform:scale(1) rotate(0)}50%{transform:scale(1.1) rotate(5deg)}}.lobby h1{font-family:Bangers,cursive;font-size:5rem;background:linear-gradient(45deg,#ff6b6b,#feca57,#48dbfb,#ff9ff3);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradientShift 3s ease infinite;filter:drop-shadow(0 0 20px rgba(255,107,107,.3));z-index:1;letter-spacing:4px}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.lobby .subtitle{font-size:1.3rem;color:#ffffffb3;z-index:1;font-weight:600}.lobby .players-setup{display:flex;gap:20px;z-index:1;flex-wrap:wrap;justify-content:center}.player-input{display:flex;align-items:center;gap:10px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:12px 20px;border-radius:16px;border:2px solid rgba(255,255,255,.15);transition:all .3s}.player-input:hover{border-color:#ffffff4d;transform:translateY(-2px)}.player-input .avatar{font-size:2rem}.player-input input{background:transparent;border:none;color:#fff;font-size:1.1rem;font-family:Nunito,sans-serif;font-weight:600;outline:none;width:140px}.player-input input::placeholder{color:#fff6}.btn-start{z-index:1;padding:18px 60px;font-size:1.5rem;font-family:Bangers,cursive;letter-spacing:3px;background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;border:none;border-radius:50px;cursor:pointer;transition:all .3s;box-shadow:0 8px 30px #ee5a2466}.btn-start:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 40px #ee5a2499}.game-fullscreen{width:100vw;height:100vh;position:relative;overflow:hidden;background:#000}.camera-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1);z-index:0}.split-overlay{position:absolute;inset:0;display:flex;z-index:2;pointer-events:none}.split-half{flex:1;position:relative;transition:all .5s ease}.split-half.dim-side{background:#0009}.side-border{position:absolute;inset:0;border:3px solid;z-index:3;pointer-events:none}.active-side .side-border{animation:borderGlow 2s ease infinite}@keyframes borderGlow{0%,to{box-shadow:inset 0 0 30px #ffffff0d}50%{box-shadow:inset 0 0 60px #ffffff1f}}.split-divider{position:absolute;left:50%;top:0;bottom:0;width:3px;background:#ffffff4d;z-index:5;transform:translate(-50%)}.vs-badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:Bangers,cursive;font-size:1.6rem;color:#feca57;background:#000c;padding:8px 14px;border-radius:12px;border:2px solid #feca57;letter-spacing:2px;text-shadow:0 0 10px rgba(254,202,87,.5)}.side-hud{position:absolute;top:60px;left:15px;display:flex;align-items:center;gap:8px;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:8px 16px;border-radius:30px;border:2px solid var(--pc);z-index:6;pointer-events:auto}.side-hud.right-pos{left:auto;right:15px}.hud-emoji{font-size:1.4rem}.hud-name{font-family:Bangers,cursive;font-size:1.1rem;letter-spacing:2px}.hud-turn-badge{font-family:Bangers,cursive;font-size:.75rem;color:#feca57;background:#feca5733;padding:2px 10px;border-radius:10px;animation:turnPulse 1s ease infinite}@keyframes turnPulse{0%,to{opacity:1}50%{opacity:.4}}.face-feedback{position:absolute;top:35%;left:50%;transform:translate(-50%);z-index:6}.feedback-emoji{font-size:5rem;opacity:0;transition:opacity .2s,transform .2s;filter:drop-shadow(0 0 25px rgba(0,0,0,.6))}.feedback-emoji.show{opacity:1;animation:emoPop .3s ease}@keyframes emoPop{0%{transform:scale(.5)}60%{transform:scale(1.3)}to{transform:scale(1)}}.dim-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;z-index:4}.dim-emoji{font-size:4rem;animation:waitBob 2s ease infinite}@keyframes waitBob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.dim-label{font-family:Bangers,cursive;font-size:1.4rem;color:#ffffff80;letter-spacing:2px}.turn-timer-bar{position:absolute;top:0;left:0;right:0;height:6px;background:#00000080;z-index:20}.timer-fill{height:100%;transition:width 1s linear;border-radius:0 3px 3px 0}.timer-text{position:absolute;top:12px;left:50%;transform:translate(-50%);font-family:Bangers,cursive;font-size:1.3rem;color:#fff;background:#000000b3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:5px 20px;border-radius:20px;letter-spacing:2px;text-shadow:0 2px 4px rgba(0,0,0,.5);white-space:nowrap}.energy-meter{position:absolute;top:50%;transform:translateY(-50%);z-index:15;display:flex;flex-direction:column;align-items:center;gap:6px}.em-left{left:15px}.em-right{right:15px}.em-bar{width:14px;height:140px;background:#00000080;border-radius:10px;overflow:hidden;border:2px solid rgba(255,255,255,.2);display:flex;align-items:flex-end}.em-fill{width:100%;border-radius:8px;transition:height .15s ease,background .3s}.em-label{font-family:Bangers,cursive;font-size:.6rem;color:#ffffff80;letter-spacing:2px}.race-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 30%,rgba(0,0,0,.6) 100%);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:18px 25px 8px;z-index:12}.race-tracks{display:flex;flex-direction:column;gap:10px}.race-lane{display:flex;align-items:center;gap:10px}.lane-tag{font-family:Bangers,cursive;font-size:.95rem;letter-spacing:1px;width:110px;text-align:right;white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.6)}.lane-bar{flex:1;height:34px;position:relative;border-radius:17px}.lane-bg{position:absolute;inset:0;background:#ffffff14;border-radius:17px;border:1px solid rgba(255,255,255,.12)}.lane-fill{position:absolute;top:0;left:0;bottom:0;border-radius:17px;transition:width .2s ease-out}.lane-runner{position:absolute;top:50%;transform:translateY(-50%);font-size:1.6rem;transition:left .2s ease-out;z-index:5;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}.lane-runner.bouncing{animation:miniBounce .2s ease-in-out infinite}@keyframes miniBounce{0%,to{transform:translateY(-50%)}50%{transform:translateY(calc(-50% - 5px))}}.trail{position:absolute;left:-12px;top:50%;transform:translateY(-50%)}.trail-line{width:8px;height:2px;background:#fff6;margin:2px 0;animation:trailAnim .3s ease infinite}.trail-line:nth-child(2){animation-delay:.1s;width:6px}.trail-line:nth-child(3){animation-delay:.2s;width:4px}@keyframes trailAnim{0%{transform:translate(0);opacity:1}to{transform:translate(-8px);opacity:0}}.lane-flag{position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:1.1rem}.lane-pct{font-family:Bangers,cursive;font-size:1rem;letter-spacing:1px;width:45px;text-shadow:0 1px 3px rgba(0,0,0,.5)}.crowd{display:flex;justify-content:space-around;padding:6px 0 2px;font-size:1.1rem;opacity:.6}.fan{animation:cheer .5s ease infinite alternate}.fan:nth-child(2n){animation-delay:.25s}@keyframes cheer{0%{transform:translateY(0)}to{transform:translateY(-4px)}}.countdown-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100}.countdown-number{font-family:Bangers,cursive;font-size:12rem;color:#fff;animation:countPop 1s ease;text-shadow:0 0 60px rgba(255,107,107,.8)}@keyframes countPop{0%{transform:scale(3);opacity:0}50%{transform:scale(.8);opacity:1}70%{transform:scale(1.1)}to{transform:scale(1)}}.winner-overlay{position:fixed;inset:0;background:#000000b3;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;animation:fadeIn .5s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.winner-overlay h2{font-family:Bangers,cursive;font-size:5rem;background:linear-gradient(45deg,#feca57,#ff6b6b,#48dbfb);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradientShift 2s ease infinite}.winner-overlay .winner-name{font-family:Bangers,cursive;font-size:3rem;color:#feca57;letter-spacing:4px}.winner-overlay .trophy{font-size:8rem;animation:trophyBounce 1s ease infinite;margin:20px 0}@keyframes trophyBounce{0%,to{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-20px) rotate(5deg)}}.confetti-container{position:fixed;inset:0;pointer-events:none;z-index:99;overflow:hidden}.confetti{position:absolute;top:-10px;animation:confettiFall linear forwards}@keyframes confettiFall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.btn-restart{margin-top:30px;padding:15px 50px;font-size:1.3rem;font-family:Bangers,cursive;letter-spacing:3px;background:linear-gradient(135deg,#48dbfb,#0abde3);color:#fff;border:none;border-radius:50px;cursor:pointer;transition:all .3s;box-shadow:0 8px 30px #0abde366}.btn-restart:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 12px 40px #0abde399}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:20px}.loading-screen h2{font-family:Bangers,cursive;font-size:2rem;letter-spacing:3px}.loading-spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.2);border-top-color:#48dbfb;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}