@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;800&family=Cairo:wght@400;600;800&display=swap";:root{--color-pink:#ff3cac;--color-orange:#ff6b00;--color-yellow:gold;--color-green:#39ff14;--color-purple:#bf5fff;--color-cyan:#00f5ff;--color-light-blue:#00f5ff;--color-light-green:#39ff14;--color-light-yellow:gold;--color-bg:#07020f;--color-surface:#110820;--color-text:#fff;--glow-pink:#ff3cac80;--glow-orange:#ff6b0080;--glow-green:#39ff1466;--glow-cyan:#00f5ff66;--glow-purple:#bf5fff66;--glass-bg:#07020fcc;--glass-border:#00f5ff26;--glass-shadow:0 15px 35px #0009, 0 0 20px #00f5ff0d, inset 0 1px 0 #ffffff1a;--glass-top-line:linear-gradient(90deg, transparent, #ff3cac80, #00f5ff80, transparent);--hud-bg:#000000b3;--hud-border:#ffffff1a;--text-muted:#ffffff80}[data-theme=light]{--color-pink:#d63384;--color-orange:#e05500;--color-yellow:#c90;--color-green:#00b336;--color-purple:#8b3fcf;--color-cyan:#0097a7;--color-light-blue:#0097a7;--color-light-green:#00b336;--color-light-yellow:#c90;--color-bg:#f0f2f5;--color-surface:#fff;--color-text:#1a1a2e;--glow-pink:#d6338440;--glow-orange:#e0550040;--glow-green:#00b33633;--glow-cyan:#0097a733;--glow-purple:#8b3fcf33;--glass-bg:#ffffffd9;--glass-border:#0097a733;--glass-shadow:0 8px 32px #00000014, 0 0 10px #0097a70d, inset 0 1px 0 #ffffffe6;--glass-top-line:linear-gradient(90deg, transparent, #d633844d, #0097a74d, transparent);--hud-bg:#ffffffd9;--hud-border:#0000001a;--text-muted:#1a1a2e80}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--color-bg);color:var(--color-text);width:100vw;min-height:100vh;font-family:Outfit,Cairo,sans-serif;transition:background-color .4s,color .4s;overflow-x:hidden}[data-theme=dark] body,:root body{background-image:radial-gradient(at 20% 20%,#ff3cac14 0%,#0000 50%),radial-gradient(at 80% 80%,#00f5ff14 0%,#0000 50%),radial-gradient(#bf5fff0d 0%,#0000 70%)}[data-theme=light] body{background-image:radial-gradient(at 20% 20%,#d633840a 0%,#0000 50%),radial-gradient(at 80% 80%,#0097a70a 0%,#0000 50%),radial-gradient(#8b3fcf08 0%,#0000 70%)}[lang=ar] *{font-family:Cairo,Outfit,sans-serif;letter-spacing:normal!important}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}button{cursor:pointer;background:linear-gradient(135deg, var(--color-pink), #ff6b00);color:#fff;letter-spacing:.5px;border:none;border-radius:50px;width:100%;max-width:360px;margin:0 auto;padding:.9rem 1.5rem;font-family:inherit;font-size:1.1rem;font-weight:700;transition:all .25s cubic-bezier(.175,.885,.32,1.275);position:relative;overflow:hidden;box-shadow:0 4px 20px #ff3cac66}button:before{content:"";opacity:0;background:linear-gradient(135deg,#ffffff26,#0000);transition:opacity .2s;position:absolute;inset:0}button:hover:before{opacity:1}button:hover,button:active{transform:translateY(-3px)scale(1.02);box-shadow:0 8px 30px #ff3cac99}button:active{transform:translateY(-1px)scale(.99)}button.primary{background:linear-gradient(135deg, var(--color-pink), #bf5fff);box-shadow:0 0 15px #ff3cac66,inset 0 0 8px #fff3}button.primary:hover{box-shadow:0 0 25px #ff3caccc,inset 0 0 12px #ffffff4d}button.secondary{background:linear-gradient(135deg, var(--color-cyan), #00c9ff);color:#07020f;font-weight:800;box-shadow:0 0 15px #00f5ff66,inset 0 0 8px #fff3}button.secondary:hover{box-shadow:0 0 25px #00f5ffcc,inset 0 0 12px #ffffff4d}button.success{background:linear-gradient(135deg, var(--color-green), #00ff87);color:#07020f;font-weight:800;box-shadow:0 0 15px #39ff1466,inset 0 0 8px #fff3}button.success:hover{box-shadow:0 0 25px #39ff14cc,inset 0 0 12px #ffffff4d}button.orange{color:#000;box-shadow:0 4px 20px var(--glow-orange);background:linear-gradient(135deg,#ff6b00,gold)}button.purple{background:linear-gradient(135deg, var(--color-purple), #ff3cac);box-shadow:0 4px 20px var(--glow-purple)}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(24px);border:1px solid var(--glass-border);width:100%;box-shadow:var(--glass-shadow);border-radius:28px;padding:2.2rem 1.8rem;transition:background .4s,border-color .4s,box-shadow .4s;position:relative;overflow:hidden}.glass-panel:before{content:"";background:var(--glass-top-line);height:1px;position:absolute;top:0;left:0;right:0}.text-gradient{background:linear-gradient(135deg, var(--color-pink), var(--color-orange), var(--color-yellow));color:#0000;-webkit-background-clip:text;background-clip:text;padding-bottom:.12em;line-height:1.3;display:inline-block}.text-gradient-cool{background:linear-gradient(135deg, var(--color-cyan), var(--color-purple));color:#0000;-webkit-background-clip:text;background-clip:text;padding-bottom:.12em;line-height:1.3;display:inline-block}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseGlow{0%,to{box-shadow:0 0 20px var(--glow-pink)}50%{box-shadow:0 0 40px var(--glow-pink), 0 0 60px #ff6b004d}}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes progressBar{0%{width:0%}to{width:100%}}@keyframes scanLine{0%{opacity:0;top:-2px}10%{opacity:1}90%{opacity:1}to{opacity:0;top:calc(100% + 2px)}}@keyframes particleFly{0%{opacity:1;transform:translate(0)scale(1)}to{transform:translate(var(--tx,30px), var(--ty,-50px)) scale(0);opacity:0}}@keyframes countUp{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes borderRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fade-in{animation:.4s ease-out forwards fadeIn}.animate-float{animation:3s ease-in-out infinite float}.animate-pulse-glow{animation:2s ease-in-out infinite pulseGlow}.app-container{flex-direction:column;justify-content:flex-start;align-items:center;width:100%;max-width:1200px;min-height:100vh;margin:0 auto;padding:1rem;display:flex}.model-loading-overlay{z-index:10;background:linear-gradient(135deg,#07020ff7,#110820f7);border-radius:15px;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;display:flex;position:absolute;inset:0;overflow:hidden}.model-loading-overlay:before{content:"";pointer-events:none;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#00f5ff05 2px 4px);position:absolute;inset:0}.scan-line{background:linear-gradient(90deg, transparent, var(--color-cyan), transparent);pointer-events:none;height:2px;animation:2.5s ease-in-out infinite scanLine;position:absolute;left:0;right:0}.loading-icon-ring{border:3px solid #ff3cac33;border-top-color:var(--color-pink);border-right-color:var(--color-cyan);border-radius:50%;width:80px;height:80px;animation:1s linear infinite spin;position:relative}.loading-icon-ring:after{content:"🔍";justify-content:center;align-items:center;font-size:1.8rem;animation:1s linear infinite reverse spin;display:flex;position:absolute;inset:0}.progress-bar-container{background:#ffffff1a;border:1px solid #ffffff0d;border-radius:10px;width:220px;height:6px;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg, var(--color-pink), var(--color-cyan), var(--color-green));background-size:200%;border-radius:10px;height:100%;animation:1.5s linear infinite shimmer,4s ease-out forwards progressBar}.hud-badge{background:var(--hud-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--hud-border);border-radius:20px;padding:8px 18px;transition:background .3s,border-color .3s;box-shadow:0 4px 15px #0003}.leaderboard-entry{border:1px solid #ffffff0d;border-radius:12px;justify-content:space-between;align-items:center;margin-bottom:.4rem;padding:.8rem 1rem;transition:all .2s;display:flex}.leaderboard-entry:hover{background:#ffffff0d;transform:translate(4px)}[dir=rtl] .leaderboard-entry:hover{transform:translate(-4px)}.leaderboard-entry.gold{background:#ffd7001f;border-color:#ffd7004d}.leaderboard-entry.silver{background:#c0c0c01a;border-color:#c0c0c033}.leaderboard-entry.bronze{background:#cd7f321a;border-color:#cd7f3233}.room-player-row{background:var(--color-surface);border:1px solid var(--hud-border);border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:.4rem;padding:.6rem 1rem;transition:all .3s;display:flex}.lang-toggle{z-index:1000;background:var(--hud-bg);border:1px solid var(--hud-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:auto;max-width:none;color:var(--color-text);border-radius:20px;margin:0;padding:.5rem 1rem;font-size:.9rem;transition:background .3s,border-color .3s,color .3s;position:fixed;bottom:20px;right:20px;box-shadow:0 4px 15px #0003}.theme-toggle{z-index:1000;background:var(--hud-bg);border:1px solid var(--hud-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:48px;max-width:none;height:48px;color:var(--color-text);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;margin:0;padding:0;font-size:1.4rem;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;position:fixed;bottom:20px;left:20px;overflow:hidden;box-shadow:0 4px 15px #0003}.theme-toggle:hover{transform:scale(1.15)rotate(15deg);box-shadow:0 6px 20px #0000004d}.theme-toggle:active{transform:scale(.95)rotate(-5deg)}.theme-toggle .theme-icon{transition:transform .5s cubic-bezier(.175,.885,.32,1.275);display:inline-block}[data-theme=light] .theme-toggle .theme-icon{transform:rotate(360deg)}[data-theme=light] .leaderboard-entry{border-color:#00000014}[data-theme=light] .leaderboard-entry:hover{background:#0000000a}[data-theme=light] .progress-bar-container{background:#00000014;border-color:#0000000d}[data-theme=light] .player-waiting-card{background:#00000008;border-color:#00000014;box-shadow:0 4px 15px #0000000f}[data-theme=light] .player-waiting-card.is-me{background:#0097a714;border-color:#0097a74d;box-shadow:0 0 20px #0097a71a}[data-theme=light] .radar-scanner{background:radial-gradient(circle,#0097a708 0%,#0000 70%);border-color:#0097a726}[data-theme=light] .target-chip{background:linear-gradient(135deg,#00b3361a,#0097a71a);border-color:#00b3364d;box-shadow:0 0 12px #00b33626}.camera-container-fullscreen{z-index:1;width:100vw;height:100vh;position:absolute;top:0;left:0}.camera-container-fullscreen video,.camera-container-fullscreen canvas{object-fit:cover!important;width:100vw!important;height:100vh!important}.neon-text{text-shadow:0 0 10px,0 0 20px,0 0 40px}.target-chip{color:var(--color-green);letter-spacing:2px;text-transform:uppercase;background:linear-gradient(135deg,#39ff1426,#00f5ff26);border:1px solid #39ff1466;border-radius:30px;padding:.3rem 1.2rem;font-size:1.4rem;font-weight:800;animation:1.5s ease-in-out infinite pulseGlow;display:inline-block;box-shadow:0 0 20px #39ff144d}@keyframes successFlash{0%{opacity:1}to{opacity:0}}@keyframes floatPoints{0%{opacity:0;transform:translate(-50%,-30%)scale(.6)}30%{opacity:1;transform:translate(-50%,-50%)scale(1.3)}to{opacity:0;transform:translate(-50%,-90%)scale(1)}}@keyframes pulseGlowRed{0%{opacity:.8}to{opacity:1;box-shadow:0 0 15px #ff4d4dcc}}@keyframes radarScan{0%{opacity:.8;transform:translate(-50%,-50%)scale(.6)}to{opacity:0;transform:translate(-50%,-50%)scale(1.6)}}@keyframes bouncePop{0%{transform:scale(1)}50%{transform:scale(1.25)}to{transform:scale(1)}}.animate-bounce-pop{animation:.3s cubic-bezier(.175,.885,.32,1.275) forwards bouncePop;display:inline-block}.radar-scanner{pointer-events:none;z-index:1;background:radial-gradient(circle,#00f5ff08 0%,#0000 70%);border:2px solid #00f5ff26;border-radius:50%;width:300px;height:300px;animation:4s linear infinite radarScan;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player-waiting-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1.2rem;width:100%;margin:1.5rem 0;display:grid}.player-waiting-card{text-align:center;background:#ffffff08;border:1px solid #ffffff14;border-radius:20px;padding:1.2rem .8rem;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 4px 15px #0000004d}.player-waiting-card.is-me{background:#00f5ff14;border:1px solid #00f5ff59;box-shadow:0 0 20px #00f5ff26}.player-avatar-circle{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:55px;height:55px;margin:0 auto .8rem;font-size:1.4rem;font-weight:800;transition:transform .3s;display:flex;box-shadow:0 4px 10px #0006}.player-waiting-card:hover .player-avatar-circle{transform:scale(1.1)}
