@import"https://fonts.googleapis.com/css2?family=Fredoka+One&family=Outfit:wght@400;700;900&display=swap";:root{--panel-width: 140px;--scale: .8;--joy-glow: rgba(180, 255, 0, .4);--joy-glow-active: rgba(180, 255, 0, .8);--plastic-base: #ffffff;--plastic-highlight: #ffffff;--plastic-shadow: #e0f0c0;--metal-base: #bdf242;--metal-highlight: #d9f99d;--metal-shadow: #84cc16;--rubber-base: #a3e635;--led-blue: #3b82f6;--led-green: #a3e635;--led-amber: #eab308}.controller-panel *{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.controller-panel{position:fixed;top:0;bottom:0;width:var(--panel-width);background:#fff;box-shadow:0 0 30px #a3e6351a;z-index:1000;display:flex;flex-direction:column;align-items:center;padding:20px 0;justify-content:center;box-sizing:border-box;transition:box-shadow .3s;pointer-events:auto}@media(max-width:1024px){.controller-panel{box-shadow:0 0 10px #a3e63533;background-image:none!important;background-color:#fff!important}.carbon-fiber-inlay{background-image:none!important;box-shadow:none!important}}.left-panel{left:0!important;border-radius:0 15px 15px 0;background-color:#fff;background-image:radial-gradient(circle,#e0e0e0 1px,transparent 1px);background-size:8px 8px}.right-panel{right:0!important;border-radius:15px 0 0 15px;background-color:#fff;background-image:radial-gradient(circle,#e0e0e0 1px,transparent 1px);background-size:8px 8px;justify-content:center}.settings-btn{position:absolute;top:15px;right:15px;width:32px;height:32px;background:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;z-index:500;border:1px solid #e0e0e0;box-shadow:0 2px 5px #a3e6354d;transition:all .1s;pointer-events:auto;font-size:16px;color:#a3e635}.settings-btn:before{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:50%;background:transparent;border:1px solid rgba(163,230,53,.3);z-index:-1}.settings-btn:hover{transform:scale(1.05);box-shadow:0 4px 10px #a3e63566}.settings-btn:active{transform:translateY(2px) scale(.95);box-shadow:0 1px 2px #000c,inset 0 1px 1px #ffffff1a}.hud-editing .settings-btn{background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.4) 0%,transparent 50%),#0f8;color:#000;box-shadow:0 0 20px #0f89,inset 0 1px 2px #fff6;border-color:#0f8}.hud-editing .carbon-fiber-inlay,.hud-editing .pill-container,.hud-editing .emote-tray,.hud-editing .voice-panel{cursor:move;outline:2px dashed rgba(0,255,136,.6);outline-offset:4px;border-radius:8px}.hud-editing .xyab-btn{cursor:move;outline:2px dashed rgba(0,255,136,.6);outline-offset:4px;border-radius:50%}.carbon-fiber-inlay.dragging,.xyab-btn.dragging,.pill-container.dragging,.emote-tray.dragging{opacity:.8;z-index:1100;filter:brightness(1.2)}.carbon-fiber-inlay{width:90%;aspect-ratio:1 / 1;flex:none;border-radius:50%;background-color:transparent;position:relative;display:flex;align-items:center;justify-content:center;margin-top:10px}.joystick-led-ring{position:absolute;width:140px;height:140px;border-radius:50%;border:2px dotted rgba(163,230,53,.6);pointer-events:none;z-index:6}.joy-arrow{position:absolute;width:0;height:0;border-style:solid}.joy-up{top:4px;left:calc(50% - 6px);border-width:0 6px 10px 6px;border-color:transparent transparent #a3e635 transparent}.joy-down{bottom:4px;left:calc(50% - 6px);border-width:10px 6px 0 6px;border-color:#a3e635 transparent transparent transparent}.joy-left{left:4px;top:calc(50% - 6px);border-width:6px 10px 6px 0;border-color:transparent #a3e635 transparent transparent}.joy-right{right:4px;top:calc(50% - 6px);border-width:6px 0 6px 10px;border-color:transparent transparent transparent #a3e635}.joystick-bezel{width:104px;height:104px;background:#a3e635;border-radius:50%;position:absolute;box-shadow:0 6px 12px #84cc164d,inset -2px -4px 6px #65a30d66,inset 2px 4px 6px #fff9;display:flex;align-items:center;justify-content:center;z-index:8}.joystick-socket{width:82px;height:82px;border-radius:50%;background:#fff;box-shadow:inset 0 4px 8px #00000014;display:flex;align-items:center;justify-content:center;position:relative}.dust-boot{display:none}.joystick-knob{width:66px;height:66px;border-radius:50%;background:#a3e635;box-shadow:0 8px 15px #84cc1680,inset -2px -4px 6px #65a30d66,inset 2px 4px 6px #fff9;position:absolute;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10;transition:transform .08s cubic-bezier(.25,.8,.25,1)}.joystick-cap{width:52px;height:52px;border-radius:50%;background:#a3e635;box-shadow:inset 1px 3px 6px #65a30d99,inset -1px -2px 4px #fffc;display:flex;align-items:center;justify-content:center}.joystick-center{display:none}.dpad-container{width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 50% 50%,#1a1c20,#0a0b0d);box-shadow:inset 0 4px 10px #000,0 1px 1px #ffffff1a,inset 0 -2px 4px #ffffff08;display:flex;align-items:center;justify-content:center;position:relative;margin-top:8px;z-index:90;border:1px solid #1a1c1f}.dpad-container:before{content:"";position:absolute;top:3px;left:50%;transform:translate(-50%);width:3px;height:3px;border-radius:50%;background:linear-gradient(135deg,#555,#222);box-shadow:inset 0 1px 1px #ffffff4d}.dpad-cross{position:relative;width:36px;height:36px;display:flex;align-items:center;justify-content:center}.dpad-arm{position:absolute;background:linear-gradient(180deg,#4a4d54,#2a2c31);box-shadow:0 3px 6px #000000b3,inset 0 1px 2px #fff3,inset 0 -1px 2px #0000004d;cursor:pointer;transition:all .05s;border-radius:3px}.dpad-arm:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(255,255,255,.1) 0%,transparent 50%,rgba(0,0,0,.2) 100%);border-radius:3px;pointer-events:none}.xyab-btn{position:absolute;width:56px;height:56px;border-radius:50%;font-size:22px;font-weight:900;font-family:Outfit,Roboto,Arial Black,sans-serif;color:#a3e635;background:#fff;border:1px solid #f0fdf4;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:all .05s cubic-bezier(.25,.8,.25,1);box-shadow:inset 0 2px 4px #fff,0 4px 8px #a3e63526,0 0 15px #a3e63526;z-index:100}.xyab-btn:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;background:transparent;border:1px solid rgba(163,230,53,.4);box-shadow:inset 0 0 10px #a3e6351a;z-index:-1}.xyab-btn:active,.xyab-btn.pressed{transform:translateY(2px);box-shadow:inset 0 3px 6px #a3e63533,0 1px 2px #a3e6351a}.xyab-y{color:#facc15}.xyab-x{color:#3b82f6}.xyab-b{color:#ef4444}.xyab-a{color:#a3e635}.btn-grey{background:#fff;box-shadow:inset 0 2px 4px #fff,0 4px 8px #a3e63526,0 0 15px #a3e63526;border:1px solid #f0fdf4;position:relative;top:-2px}.btn-grey:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;background:transparent;border:1px solid rgba(163,230,53,.4);box-shadow:inset 0 0 10px #a3e6351a;z-index:-1}.btn-grey:active,.btn-grey.pressed{top:2px;box-shadow:inset 0 3px 6px #a3e63533,0 1px 2px #a3e6351a}.grip-zone{width:70%;height:35px;border-radius:16px;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(255,255,255,.02) 2px,rgba(255,255,255,.02) 3px),linear-gradient(180deg,#1a1c20,#0e0f11);box-shadow:inset 0 4px 8px #000c,0 1px 1px #ffffff0f,inset 0 -2px 4px #ffffff05;margin:4px 0;position:relative;z-index:85}.grip-zone:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:16px;background:repeating-linear-gradient(90deg,transparent,transparent 3px,rgba(0,0,0,.3) 3px,rgba(0,0,0,.3) 4px);pointer-events:none}.grip-zone:before{content:"";position:absolute;top:30%;left:20%;width:60%;height:40%;border-radius:8px;background:radial-gradient(ellipse,rgba(255,255,255,.03) 0%,transparent 70%);pointer-events:none}.center-buttons{position:fixed;bottom:18px;left:50%;transform:translate(-50%);display:flex;gap:14px;z-index:1100;pointer-events:auto}.center-btn{width:28px;height:12px;border-radius:6px;background:linear-gradient(180deg,#3a3d43,#1a1b1e);border:1px solid #111;box-shadow:0 3px 5px #000000b3,inset 0 1px 2px #fff3,inset 0 -1px 2px #0000004d;cursor:pointer;transition:all .06s;position:relative}.center-btn:after{content:"";position:absolute;top:2px;left:50%;transform:translate(-50%);width:2px;height:2px;border-radius:50%;background:#333;box-shadow:inset 0 1px 1px #00000080}.center-btn:active,.center-btn.pressed{transform:translateY(2px);box-shadow:0 1px 2px #000000b3,inset 0 1px 1px #ffffff1a,inset 0 2px 4px #0006}.center-btn-label{position:absolute;bottom:-11px;left:50%;transform:translate(-50%);font-size:7px;font-weight:700;color:#555;letter-spacing:.5px;pointer-events:none;white-space:nowrap}.battery-led{position:absolute;bottom:22px;width:5px;height:5px;border-radius:50%;background:#3df06a;box-shadow:0 0 6px #3df06a,0 0 12px #3cf06480,inset 0 1px 2px #fff6;z-index:200;animation:battery-pulse 4s ease-in-out infinite}.left-panel .battery-led{right:20px}.right-panel .battery-led{left:20px;background:#f0a03d;box-shadow:0 0 6px #f0a03d,0 0 12px #f0a03c80,inset 0 1px 2px #fff6;animation:battery-pulse 4s ease-in-out 1.5s infinite}@keyframes battery-pulse{0%,to{opacity:.6}50%{opacity:1}}.btn-depth-indicator{position:absolute;bottom:-2px;left:50%;transform:translate(-50%);width:80%;height:4px;border-radius:2px;background:#0009;box-shadow:inset 0 1px 2px #000c;pointer-events:none;opacity:.5}.contact-shadow{position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:inherit;box-shadow:0 4px 8px #0009;pointer-events:none;z-index:-2}.finger-oil{position:absolute;top:25%;left:30%;width:40%;height:30%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,255,255,.04) 0%,transparent 70%);pointer-events:none;filter:blur(1px)}.ao-shadow{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;box-shadow:inset 0 3px 6px #0006;pointer-events:none}@media(max-width:900px){:root{--panel-width: 90px;--scale: .65}.joystick-bezel{width:80px;height:80px}.joystick-socket{width:64px;height:64px}.joystick-knob{width:48px;height:48px}.joystick-led-ring{width:82px;height:82px}.xyab-y{top:calc(50% - 150px)!important}.xyab-x{top:calc(50% - 60px)!important}.xyab-b{top:calc(50% + 30px)!important}.xyab-a{top:calc(50% + 120px)!important}.xyab-btn{left:7px!important;width:76px;height:76px;font-size:26px;border-width:2px}.customize-btn{right:40px;height:22px;font-size:7px;padding:0 8px}.settings-btn{width:28px;height:28px;font-size:11px}}@media(max-width:600px){:root{--panel-width: 70px;--scale: .5}.joystick-bezel{width:65px;height:65px}.joystick-socket{width:52px;height:52px}.joystick-knob{width:40px;height:40px}.joystick-led-ring{width:68px;height:68px}.xyab-y{top:calc(50% - 120px)!important}.xyab-x{top:calc(50% - 50px)!important}.xyab-b{top:calc(50% + 20px)!important}.xyab-a{top:calc(50% + 90px)!important}.xyab-btn{left:5px!important;width:60px;height:60px;font-size:20px;border-width:2px}.customize-btn{right:32px;height:18px;font-size:6px;padding:0 6px;top:6px}.settings-btn{width:24px;height:24px;font-size:10px;top:4px}}.emote-tray{width:52px;padding:8px 4px;background:#fff;border-radius:20px;border:1px solid #f0fdf4;box-shadow:0 4px 10px #a3e63526,inset 0 2px 4px #fff;margin-bottom:20px;z-index:100;position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;max-height:100px;overflow:hidden}.emote-tray-header{font-size:9px;color:#a3e635;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;text-shadow:none;display:flex;align-items:center;gap:4px;flex-shrink:0}.header-line{width:8px;height:2px;background:#a3e635;border-radius:1px;box-shadow:none}.emote-scroll-container{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;overflow-y:auto;padding:2px 0 10px;scrollbar-width:thin;scrollbar-color:#a3e635 transparent}.emote-scroll-container::-webkit-scrollbar{width:4px}.emote-scroll-container::-webkit-scrollbar-track{background:transparent}.emote-scroll-container::-webkit-scrollbar-thumb{background:#a3e635;border-radius:10px}.emote-scroll-container::-webkit-scrollbar-thumb:hover{background:#84cc16}.emote-btn{width:40px;height:40px;flex-shrink:0;border-radius:50%;background:#fff;border:1px solid #f0fdf4;box-shadow:inset 0 2px 4px #fff,0 4px 8px #a3e63526,0 0 10px #a3e6351a;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;transition:all .08s cubic-bezier(.25,.8,.25,1)}.emote-btn:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;background:transparent;border:1px solid rgba(163,230,53,.4);box-shadow:inset 0 0 10px #a3e6351a;z-index:-1}.emote-btn:active,.emote-btn.pressed{transform:scale(.92) translateY(2px);box-shadow:inset 0 3px 6px #a3e63533,0 1px 2px #a3e6351a;background:#fff}.emote-btn img{width:22px;height:22px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(163,230,53,.3));pointer-events:none;transition:transform .1s,filter .1s}.emote-btn:active img,.emote-btn.pressed img{transform:scale(.9);filter:drop-shadow(0 1px 2px rgba(163,230,53,.2))}.emote-tray.dragging,.voice-panel.dragging{opacity:.8;box-shadow:0 0 20px var(--joy-glow-active)}.voice-panel{position:relative;display:flex;flex-direction:row;gap:12px;justify-content:center;z-index:500;margin-top:5px}.voice-btn{width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid #f0fdf4;color:#a3e635;display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;box-shadow:inset 0 2px 4px #fff,0 4px 8px #a3e63526,0 0 10px #a3e6351a;transition:all .15s;position:relative}.voice-btn:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;background:transparent;border:1px solid rgba(163,230,53,.4);box-shadow:inset 0 0 10px #a3e6351a;z-index:-1}.voice-btn:active{transform:translateY(2px) scale(.95);box-shadow:inset 0 3px 6px #a3e63533,0 1px 2px #a3e6351a}.voice-btn.active{color:#fff;background:#a3e635;box-shadow:0 0 15px #a3e63580,inset 0 2px 4px #fff6;border-color:#bef264}.voice-btn.muted{color:#fff;background:#ef4444;box-shadow:0 0 15px #ef44444d,inset 0 2px 4px #fff6;border-color:#f87171}.voice-btn.muted:before{border-color:#ef444466;box-shadow:inset 0 0 10px #ef44441a}:root{--arcade-bg: #f8fafc;--arcade-bg-gradient: radial-gradient(circle at top, #ffffff 0%, #f1f5f9 100%);--arcade-surface: #ffffff;--arcade-surface-border: #f0fdf4;--arcade-glass: rgba(255, 255, 255, .95);--arcade-glass-border: #f0fdf4;--arcade-text: #0f172a;--arcade-text-light: #475569;--arcade-text-muted: #94a3b8;--arcade-peach: #fca5a5;--arcade-mint: #a3e635;--arcade-mint-glow: rgba(163, 230, 53, .4);--arcade-sky: #60a5fa;--arcade-sky-glow: rgba(96, 165, 250, .4);--arcade-sun: #bef264;--arcade-sun-glow: rgba(190, 242, 100, .4);--arcade-lavender: #a3e635;--arcade-lavender-glow: rgba(163, 230, 53, .15);--arcade-cyan: #bef264;--arcade-cyan-glow: rgba(190, 242, 100, .15);--arcade-border-thick: none;--arcade-shadow-playful: none}*{font-family:Outfit,sans-serif;box-sizing:border-box}.title-text{font-family:Fredoka One,cursive!important}.score-panel{position:absolute;top:20px;left:50%;transform:translate(-50%);background:#141928cc;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--arcade-glass-border);border-bottom:2px solid rgba(255,255,255,.2);border-radius:24px;padding:8px 32px;display:flex;align-items:center;gap:24px;color:#fff;box-shadow:0 10px 40px #00000080;z-index:10;pointer-events:none}@media(max-width:1024px){.score-panel{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#0f1423f2!important}}.player-col{display:flex;flex-direction:column;align-items:center}.player-name{font-size:.7rem;letter-spacing:2px;text-transform:uppercase;font-weight:800}.score-num{font-size:2.4rem;font-weight:900;line-height:1;transition:transform .15s}.score-num.pop{transform:scale(1.4);color:var(--arcade-sun)}.arcade-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;background:var(--arcade-bg);background-image:var(--arcade-bg-gradient);z-index:1000;overflow:hidden;animation:lobby-fadeIn .5s ease-out}@keyframes lobby-fadeIn{0%{opacity:0}to{opacity:1}}.arcade-screen.lobby-exiting{animation:lobby-fadeOut .4s ease-in forwards}@keyframes lobby-fadeOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.05)}}.arcade-screen.hidden{display:none!important}.arcade-screen:before{content:"";position:absolute;top:-30%;left:-20%;width:500px;height:500px;background:radial-gradient(circle,var(--arcade-lavender-glow) 0%,transparent 70%);border-radius:50%;animation:orb-float 8s ease-in-out infinite alternate;pointer-events:none;z-index:0}.arcade-screen:after{content:"";position:absolute;bottom:-25%;right:-15%;width:450px;height:450px;background:radial-gradient(circle,var(--arcade-cyan-glow) 0%,transparent 70%);border-radius:50%;animation:orb-float 10s ease-in-out 2s infinite alternate-reverse;pointer-events:none;z-index:0}@keyframes orb-float{0%{transform:translate(0) scale(1)}to{transform:translate(40px,-30px) scale(1.15)}}.lobby-content{background:#fff;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid #f0fdf4;padding:36px 28px;border-radius:28px;text-align:center;width:92%;max-width:400px;display:flex;flex-direction:column;align-items:center;position:relative;z-index:1;box-shadow:0 15px 40px #a3e63526,0 0 20px #a3e6350d,inset 0 2px 4px #fff;animation:card-enter .6s cubic-bezier(.16,1,.3,1) both;animation-delay:.1s}@keyframes card-enter{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.lobby-header{margin-bottom:24px;position:relative}.lobby-header h1{font-size:2.8rem;margin:0;color:#a3e635;text-shadow:0 4px 10px rgba(163,230,53,.2);letter-spacing:2px;line-height:1}.lobby-header .lobby-subtitle{display:inline-block;background:#f0fdf4;color:#84cc16;font-size:.7rem;font-weight:900;padding:4px 14px;border-radius:9999px;margin-top:10px;letter-spacing:2px;text-transform:uppercase;box-shadow:0 2px 5px #a3e6351a;border:1px solid #d9f99d}.main-actions{display:flex;flex-direction:column;gap:12px;margin-bottom:20px;width:100%}.arcade-btn{border:1px solid #f0fdf4;padding:16px 32px;font-size:1rem;font-weight:900;border-radius:16px;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:1.5px;width:100%;position:relative;overflow:hidden;background:#fff;color:#a3e635;box-shadow:inset 0 2px 4px #fff,0 4px 8px #a3e63526,0 0 10px #a3e6351a}.arcade-btn:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:18px;background:transparent;border:1px solid rgba(163,230,53,.4);box-shadow:inset 0 0 10px #a3e6351a;z-index:-1}.arcade-btn:active{transform:scale(.97) translateY(2px);box-shadow:inset 0 3px 6px #a3e63533,0 1px 2px #a3e6351a}.arcade-btn.red{background:#a3e635;color:#fff;border-color:#bef264;box-shadow:inset 0 2px 4px #fff6,0 4px 15px #a3e63566}.arcade-btn.red:before{display:none}.arcade-btn.red:active{box-shadow:inset 0 3px 6px #65a30d66}.arcade-btn.green{background:#bef264;color:#fff;border-color:#d9f99d;box-shadow:inset 0 2px 4px #fff6,0 4px 15px #a3e6354d}.arcade-btn.green:before{display:none}.arcade-btn.primary{background:#a3e635;color:#fff;border-color:#bef264;box-shadow:inset 0 2px 4px #fff6,0 4px 20px #a3e63566;animation:btn-glow-pulse 2s ease-in-out infinite}.arcade-btn.primary:before{display:none}@keyframes btn-glow-pulse{0%,to{box-shadow:0 4px 20px #a3e63566,inset 0 2px 4px #fff6}50%{box-shadow:0 4px 35px #a3e63599,0 0 30px #a3e6354d,inset 0 2px 4px #fff6}}.arcade-btn.primary:active{box-shadow:inset 0 3px 6px #65a30d66;animation:none}.multiplayer-pod{background:#fff;border:1px solid #f0fdf4;padding:20px;border-radius:20px;width:100%;margin-top:16px;display:flex;flex-direction:column;gap:14px;box-shadow:inset 0 4px 8px #a3e6350d}.join-row{display:flex;gap:10px;width:100%}#shell-join-input{flex:1;min-width:0;background:#fff;border:1px solid #d9f99d;border-radius:14px;padding:14px;color:#84cc16;font-family:Outfit,monospace;font-size:1.1rem;font-weight:700;text-align:center;outline:none;letter-spacing:6px;transition:all .2s;box-shadow:inset 0 2px 4px #a3e6351a}#shell-join-input::placeholder{color:#bef264;letter-spacing:1px;font-size:.8rem}#shell-join-input:focus{border-color:#a3e635;box-shadow:0 0 0 3px #a3e63533,inset 0 2px 4px #a3e6351a;background:#fff}.host-pin-display{text-align:center;padding:16px 0}.host-pin-label{font-size:.65rem;color:#a3e635;font-weight:900;letter-spacing:2px;margin-bottom:8px;text-transform:uppercase}.host-pin-value{font-family:Fredoka One,cursive;font-size:3rem;font-weight:900;color:#84cc16;letter-spacing:10px;text-shadow:0 4px 8px rgba(163,230,53,.2);line-height:1}.pod-footer{font-size:.7rem;color:#a3e635;font-weight:900;text-transform:uppercase;letter-spacing:2px;display:flex;align-items:center;justify-content:center;gap:8px}.pod-footer:before{content:"";width:6px;height:6px;border-radius:50%;background:#a3e635;animation:status-pulse 1.5s ease-in-out infinite}@keyframes status-pulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}.pod-footer.connected:before{background:#84cc16;box-shadow:0 0 8px #a3e63566}.arcade-screen#arcade-gameover .lobby-header h1{text-shadow:0 0 30px var(--arcade-sun-glow),0 0 60px rgba(251,191,36,.15)}@media(max-width:480px){.lobby-content{padding:28px 20px;border-radius:24px}.lobby-header h1{font-size:2.2rem}.arcade-btn{padding:14px 24px;font-size:.9rem}.host-pin-value{font-size:2.4rem;letter-spacing:8px}.multiplayer-pod{padding:14px}#shell-connect-btn{min-width:70px!important;padding:14px 12px!important;font-size:.85rem!important}}@media(min-width:768px){.lobby-content{padding:48px 40px;max-width:450px}}#arcade-network-panel{position:fixed;top:20px;right:20px;z-index:1500;pointer-events:none;text-align:right}#shell-status{color:#ffffff80;font-size:.65rem;font-weight:900;letter-spacing:2px}#shell-pin-box{margin-top:6px;background:#0009;color:#fff;font-size:1.1rem;font-weight:900;padding:6px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.1)}body.lobby-active #hud-overlay,body.gameover-active #hud-overlay,body.lobby-active .center-buttons,body.gameover-active .center-buttons{display:none!important}.arcade-screen{background:linear-gradient(180deg,#bfe8ff,#e8f8ff 40%,#f7ffef)!important}.arcade-screen:before,.arcade-screen:after{display:none!important}.lobby-content{background:#fff!important;border:none!important;border-radius:40px!important;max-width:560px!important;padding:48px!important;box-shadow:0 20px 40px #0000000f,0 8px 16px #0000000a!important}.lobby-header h1{color:#27364a!important;font-size:4rem!important;text-shadow:none!important;letter-spacing:-2px!important}.lobby-header .lobby-subtitle{background:#eef8d2!important;color:#88b400!important;border:none!important;padding:10px 24px!important;border-radius:999px!important;box-shadow:none!important}.multiplayer-pod{background:#fafafa!important;border:none!important;border-radius:28px!important;box-shadow:inset 0 0 0 2px #f0f0f0!important}.arcade-btn{border:none!important;border-radius:24px!important;color:#27364a!important;box-shadow:0 8px 18px #00000014!important}.arcade-btn:before{display:none!important}.arcade-btn.red,.arcade-btn.primary{background:#c8f03a!important;color:#1f2937!important;animation:none!important;box-shadow:0 8px 18px #b8f23d40!important}.arcade-btn.green{background:#84e6c3!important;color:#17323b!important}#shell-join-input{background:#fff!important;border:none!important;border-radius:20px!important;box-shadow:inset 0 0 0 2px #f0f0f0!important}.host-pin-value{color:#88b400!important;text-shadow:none!important}.lobby-mode-tabs{display:flex;background:#f0f0f0;padding:6px;border-radius:999px;width:100%;margin-bottom:20px;gap:6px}.mode-tab{flex:1;border:none;background:transparent;padding:12px 16px;border-radius:999px;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:900;color:#64748b;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1)}.mode-tab.active{background:#fff;color:#1e293b;box-shadow:0 4px 12px #00000014}.mode-panel{display:none;width:100%;flex-direction:column;align-items:center}.mode-panel.active{display:flex}.panel-desc{font-size:.85rem;color:#64748b;margin-bottom:20px;line-height:1.4;text-align:center}.online-subview{display:none;width:100%;flex-direction:column;align-items:center}.online-subview.active{display:flex}.online-grid{display:flex;flex-direction:column;gap:12px;width:100%}.host-pin-card,.join-card{background:#fafafa;border-radius:24px;padding:20px;width:100%;display:flex;flex-direction:column;align-items:center;box-shadow:inset 0 0 0 2px #f0f0f0;margin-bottom:16px}.card-label{font-size:.75rem;font-weight:900;color:#88b400;letter-spacing:2px;margin-bottom:10px;text-transform:uppercase}.pin-display{font-family:Fredoka One,Outfit,cursive;font-size:3.2rem;font-weight:900;color:#27364a;letter-spacing:12px;line-height:1;margin-bottom:16px}.host-actions{display:flex;gap:10px;width:100%}.action-btn{flex:1;background:#fff;border:none;border-radius:16px;padding:10px 14px;font-family:Outfit,sans-serif;font-size:.8rem;font-weight:900;color:#334155;cursor:pointer;box-shadow:0 4px 10px #0000000d;transition:all .15s ease}.action-btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px #00000014}.pin-digit-group{display:flex;gap:10px;justify-content:center;width:100%;margin-top:8px}.pin-digit{width:54px;height:64px;background:#fff;border:2px solid #e2e8f0;border-radius:16px;font-family:Fredoka One,monospace;font-size:2.2rem;font-weight:900;color:#1e293b;text-align:center;outline:none;box-shadow:0 4px 10px #0000000a;transition:all .2s cubic-bezier(.4,0,.2,1)}.pin-digit:focus{border-color:#c8f03a;box-shadow:0 0 0 4px #c8f03a4d;transform:scale(1.05)}.roster-container{width:100%;margin-bottom:16px}.roster-header{font-size:.7rem;font-weight:900;color:#94a3b8;letter-spacing:1.5px;margin-bottom:8px;text-align:left}.roster-list{display:flex;flex-direction:column;gap:8px;width:100%}.roster-slot{display:flex;align-items:center;gap:12px;background:#fff;padding:12px 16px;border-radius:18px;box-shadow:0 4px 10px #00000008;border:1px solid #f1f5f9}.roster-slot.empty{opacity:.6;background:#f8fafc;border-style:dashed}.slot-avatar{font-size:1.4rem}.slot-name{flex:1;font-weight:800;font-size:.9rem;color:#1e293b;text-align:left}.slot-badge{font-size:.65rem;font-weight:900;padding:4px 10px;border-radius:999px;letter-spacing:1px}.slot-badge.connected{background:#dcfce7;color:#15803d}.slot-badge.waiting{background:#fef3c7;color:#b45309}.host-control-bar{width:100%}.arcade-btn.secondary{background:#f1f5f9!important;color:#64748b!important;box-shadow:none!important}.network-status-bar{font-size:.75rem;font-weight:800;color:#64748b;letter-spacing:1px;margin-top:12px}.network-status-bar.connected{color:#16a34a}.arcade-toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%) translateY(100px);background:#1e293b;color:#fff;padding:12px 24px;border-radius:999px;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:800;box-shadow:0 10px 25px #0003;z-index:9999;opacity:0;transition:all .3s cubic-bezier(.16,1,.3,1)}.arcade-toast.show{transform:translate(-50%) translateY(0);opacity:1}.hidden,.game-info-section{display:none!important}.arcade-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172abf;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:10000;display:flex;justify-content:center;align-items:center}.modal-card{background:#fff;border-radius:32px;padding:28px;width:90%;max-width:340px;text-align:center;box-shadow:0 25px 50px #0003;display:flex;flex-direction:column;align-items:center}.modal-header{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:20px;font-weight:900;color:#1e293b;font-size:.9rem}.modal-close{background:none;border:none;font-size:1.6rem;cursor:pointer;color:#64748b;line-height:1}.qr-container{padding:16px;background:#f8fafc;border-radius:20px;margin-bottom:14px}.qr-hint{font-size:.75rem;color:#64748b}#arcade-countdown-overlay{z-index:10000;display:flex;justify-content:center;align-items:center}.countdown-container{text-align:center}.countdown-title{font-family:Outfit,sans-serif;font-size:1.8rem;font-weight:900;color:#94a3b8;letter-spacing:4px;margin-bottom:16px}.countdown-num{font-family:Fredoka One,Outfit,sans-serif;font-size:8rem;font-weight:900;color:#c8f03a;text-shadow:0 0 40px rgba(200,240,58,.6);line-height:1}.countdown-num.pulse{animation:count-pulse .75s cubic-bezier(.16,1,.3,1) both}@keyframes count-pulse{0%{transform:scale(.4);opacity:0}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:1}}
