.arcade-container{display:grid;grid-template-columns:1fr 340px;gap:24px;width:100%}@media (max-width:1024px){.arcade-container{grid-template-columns:1fr}}.arcade-wrapper{background:rgba(20,20,30,.6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(99,102,241,.2);border-radius:var(--border-radius-lg);padding:24px;box-shadow:0 8px 32px rgba(0,0,0,.4),inset 0 0 12px rgba(99,102,241,.1);display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden}.arcade-wrapper:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--primary),#ec4899,transparent);background-size:200% 100%;animation:arcade-glow-line 4s linear infinite}@keyframes arcade-glow-line{0%{background-position:-200% 0}to{background-position:200% 0}}.arcade-canvas{background:#080810;border:3px solid #1a1a2e;border-radius:var(--border-radius);box-shadow:0 0 15px rgba(0,0,0,.8),0 0 5px rgba(99,102,241,.2);outline:none;cursor:crosshair;transition:border-color .3s,box-shadow .3s}.arcade-canvas.active-game{border-color:var(--primary);box-shadow:0 0 25px rgba(99,102,241,.4),inset 0 0 10px rgba(99,102,241,.2)}.game-lobby-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;width:100%}.game-card{background:rgba(24,24,37,.7);border:1px solid var(--border);border-radius:var(--border-radius);padding:24px;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.game-card:after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,transparent,transparent);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;transition:background .3s}.game-card:hover{transform:translateY(-5px);background:rgba(30,30,47,.9);box-shadow:0 10px 25px rgba(0,0,0,.4)}.game-card.snake-theme:hover{border-color:#10b981;box-shadow:0 10px 30px rgba(16,185,129,.15)}.game-card.snake-theme:hover:after{background:linear-gradient(135deg,#10b981,transparent)}.game-card.brick-theme:hover{border-color:#ec4899;box-shadow:0 10px 30px rgba(236,72,153,.15)}.game-card.brick-theme:hover:after{background:linear-gradient(135deg,#ec4899,transparent)}.game-card.tetris-theme:hover{border-color:#f59e0b;box-shadow:0 10px 30px rgba(245,158,11,.15)}.game-card.tetris-theme:hover:after{background:linear-gradient(135deg,#f59e0b,transparent)}.game-card.roadfighter-theme:hover{border-color:#ef4444;box-shadow:0 10px 30px rgba(239,68,68,.15)}.game-card.roadfighter-theme:hover:after{background:linear-gradient(135deg,#ef4444,transparent)}.game-card-icon{font-size:3rem;margin-bottom:16px;filter:drop-shadow(0 0 8px rgba(255,255,255,.2));transition:transform .3s}.game-card:hover .game-card-icon{transform:scale(1.1) rotate(5deg)}.game-card-title{font-size:1.25rem;font-weight:700;margin-bottom:8px;color:var(--text-primary)}.game-card-desc{font-size:.875rem;color:var(--text-secondary);margin-bottom:20px;line-height:1.4}.arcade-score-badge{background:rgba(99,102,241,.15);border:1px solid rgba(99,102,241,.3);color:var(--primary-light);padding:4px 10px;border-radius:20px;font-weight:700;font-size:.85rem;display:inline-flex;align-items:center;gap:6px;box-shadow:0 0 10px rgba(99,102,241,.1)}.arcade-score-badge.snake-badge{background:rgba(16,185,129,.15);border-color:rgba(16,185,129,.3);color:#10b981}.arcade-score-badge.brick-badge{background:rgba(236,72,153,.15);border-color:rgba(236,72,153,.3);color:#ec4899}.arcade-score-badge.tetris-badge{background:rgba(245,158,11,.15);border-color:rgba(245,158,11,.3);color:#f59e0b}.arcade-score-badge.roadfighter-badge{background:rgba(239,68,68,.15);border-color:rgba(239,68,68,.3);color:#ef4444}.btn-arcade-neon{background:transparent;color:#fff;border:1px solid var(--primary);box-shadow:0 0 10px rgba(99,102,241,.2);text-shadow:0 0 5px rgba(255,255,255,.5);font-weight:700;letter-spacing:.05em;transition:all .3s}.btn-arcade-neon:hover{background:var(--primary);box-shadow:0 0 20px rgba(99,102,241,.5);transform:scale(1.05)}.btn-arcade-neon-secondary{background:transparent;color:var(--text-secondary);border:1px solid var(--border);font-weight:600;transition:all .3s}.btn-arcade-neon-secondary:hover{background:var(--bg-hover);border-color:var(--border-hover);color:var(--text-primary)}.arcade-mobile-controller{display:none!important}@media (max-width:768px){.arcade-mobile-controller{display:flex!important;justify-content:space-between;align-items:center;width:100%;max-width:600px;margin:20px auto 10px;padding:16px;background:rgba(15,15,25,.7);border:1px solid rgba(255,255,255,.08);border-radius:24px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 8px 32px rgba(0,0,0,.4);touch-action:none;user-select:none;-webkit-user-select:none}.light-theme .arcade-mobile-controller{background:rgba(255,255,255,.85);border-color:rgba(0,0,0,.06);box-shadow:0 8px 32px rgba(0,0,0,.08)}.dpad{position:relative;width:140px;height:140px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);justify-items:center}.dpad,.dpad-btn{align-items:center}.dpad-btn{width:46px;height:46px;background:linear-gradient(135deg,#222230,#151522);border:1px solid rgba(255,255,255,.08);color:var(--text-secondary);font-size:1.2rem;font-weight:700;display:flex;justify-content:center;cursor:pointer;box-shadow:0 4px 8px rgba(0,0,0,.3);transition:transform .1s,background .1s;outline:none;touch-action:none;-webkit-tap-highlight-color:transparent}.light-theme .dpad-btn{background:linear-gradient(135deg,#e2e8f0,#cbd5e1);border-color:rgba(0,0,0,.1);color:#475569;box-shadow:0 4px 8px rgba(0,0,0,.05)}.dpad-btn:active{transform:scale(.92);background:var(--primary)!important;color:#fff!important;border-color:var(--primary-light)!important;box-shadow:0 0 15px var(--primary-glow)!important}.dpad-btn.up{grid-column:2;grid-row:1;border-radius:8px 8px 0 0;border-bottom:none}.dpad-btn.left{grid-column:1;grid-row:2;border-radius:8px 0 0 8px;border-right:none}.dpad-center{grid-column:2;grid-row:2;width:46px;height:46px;background:#1c1c27;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 0 8px rgba(0,0,0,.5)}.light-theme .dpad-center{background:#cbd5e1;border-color:rgba(0,0,0,.1);box-shadow:inset 0 0 8px rgba(0,0,0,.05)}.dpad-btn.right{grid-column:3;grid-row:2;border-radius:0 8px 8px 0;border-left:none}.dpad-btn.down{grid-column:2;grid-row:3;border-radius:0 0 8px 8px;border-top:none}.action-buttons{display:flex;gap:16px;align-items:center;padding-right:10px}.action-btn-wrapper{display:flex;flex-direction:column;align-items:center;gap:6px}.action-btn{width:52px;height:52px;border-radius:50%;border:none;color:#fff;font-size:1.2rem;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px rgba(0,0,0,.4);transition:transform .1s,filter .1s;outline:none;touch-action:none;-webkit-tap-highlight-color:transparent}.action-btn:active{transform:scale(.9);filter:brightness(1.2)}.action-btn.btn-b{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 4px 12px rgba(245,158,11,.3)}.action-btn.btn-a{background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 4px 12px rgba(16,185,129,.3)}.btn-label{font-size:.65rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}}.light-theme .arcade-wrapper{background:rgba(255,255,255,.7);border:1px solid rgba(99,102,241,.15);box-shadow:0 8px 32px rgba(0,0,0,.05),inset 0 0 12px rgba(99,102,241,.03)}.light-theme .game-card{background:rgba(255,255,255,.75)!important;border:1px solid var(--border)!important;box-shadow:0 4px 15px rgba(0,0,0,.03)!important}.light-theme .game-card:hover{background:rgba(255,255,255,1)!important;box-shadow:0 12px 30px rgba(99,102,241,.12)!important}