:root{--color-primary: #00ff00;--color-secondary: #00ccff;--color-accent: #ff00ff;--color-warning: #ffff00;--color-danger: #ff0044;--bg-dark: #000814;--bg-darker: #000509;--bg-card: #001829;--bg-card-hover: #002235;--border-primary: #0a5580;--border-accent: #64c8ff;--border-glow: rgba(100, 200, 255, .3);--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px;--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .4s ease;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 16px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px var(--border-glow);--font-size-xs: .6rem;--font-size-sm: .75rem;--font-size-base: .875rem;--font-size-lg: 1rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 2rem;--font-size-4xl: 2.5rem;--z-base: 1;--z-dropdown: 10;--z-sticky: 100;--z-overlay: 1000;--z-modal: 2000;--z-toast: 3000}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{font-family:"Press Start 2P",monospace;background:var(--bg-dark);color:var(--color-secondary);font-size:var(--font-size-base);line-height:1.6;font-weight:400}.dgi-container{width:100%;max-width:1400px;margin:0 auto;padding:var(--space-lg)}.dgi-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-md)}.dgi-card{background:var(--bg-card);border:3px solid var(--border-primary);border-radius:var(--radius-xl);padding:var(--space-2xl);box-shadow:var(--shadow-lg),var(--shadow-glow);transition:all var(--transition-normal)}.dgi-card:hover{border-color:var(--border-accent);transform:translateY(-2px);box-shadow:var(--shadow-lg),0 0 30px #64c8ff80}.dgi-title-1{font-size:var(--font-size-4xl);color:var(--color-primary);font-weight:700;letter-spacing:.1em;margin-bottom:var(--space-lg);text-align:center;line-height:1.2;text-shadow:0 0 10px var(--color-primary)}@media (min-width: 769px){.dgi-title-1{font-size:var(--font-size-7xl);text-shadow:0 0 20px var(--color-primary),0 0 40px var(--color-primary),0 0 60px rgba(0,255,0,.3)}}.dgi-title-2{font-size:var(--font-size-3xl);color:var(--color-secondary);font-weight:700;letter-spacing:.08em;margin-bottom:var(--space-md);line-height:1.3}.dgi-title-3{font-size:var(--font-size-2xl);color:var(--color-warning);font-weight:700;letter-spacing:.05em;margin-bottom:var(--space-md)}.dgi-subtitle{font-size:var(--font-size-lg);color:var(--border-accent);letter-spacing:.15em;text-align:center;margin-bottom:var(--space-xl);opacity:.9}.dgi-text{font-size:var(--font-size-sm);line-height:1.8;color:var(--color-secondary);opacity:.9}.dgi-text-xs{font-size:var(--font-size-xs);opacity:.7}.dgi-btn{font-family:"Press Start 2P",monospace;font-size:var(--font-size-sm);font-weight:400;padding:var(--space-md) var(--space-xl);border:3px solid;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);text-align:center;display:inline-flex;flex-direction:column;align-items:center;gap:var(--space-xs);min-height:56px;width:100%;max-width:400px;position:relative;overflow:hidden;text-decoration:none}.dgi-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left var(--transition-slow)}.dgi-btn:hover:before{left:100%}.dgi-btn-primary{background:linear-gradient(180deg,#0f0,#0c0);border-color:var(--color-primary);color:#001f00;box-shadow:0 6px #060,0 0 20px #0f06}.dgi-btn-primary:hover{transform:translateY(-3px);box-shadow:0 9px #060,0 0 30px #0f09}.dgi-btn-primary:active{transform:translateY(-1px);box-shadow:0 4px #060,0 0 20px #0f06}.dgi-btn-secondary{background:linear-gradient(180deg,#0a5580,#003d5c);border-color:var(--border-accent);color:var(--color-secondary);box-shadow:0 6px #002b45,0 0 15px #64c8ff4d}.dgi-btn-secondary:hover{transform:translateY(-3px);border-color:var(--color-primary);box-shadow:0 9px #002b45,0 0 25px #64c8ff80}.dgi-btn-secondary:active{transform:translateY(-1px);box-shadow:0 4px #002b45,0 0 15px #64c8ff4d}.dgi-btn-accent{background:linear-gradient(180deg,#f0f,#c0c);border-color:var(--color-accent);color:#fff;box-shadow:0 6px #606,0 0 20px #f0f6}.dgi-btn-accent:hover{transform:translateY(-3px);box-shadow:0 9px #606,0 0 30px #f0f9}.dgi-btn-text{font-size:var(--font-size-base);font-weight:400}.dgi-btn-shortcut{font-size:var(--font-size-xs);opacity:.6;font-weight:300;letter-spacing:.1em}.dgi-btn:hover .dgi-btn-shortcut{opacity:.9}.dgi-btn-sm{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-xs);min-height:44px}.dgi-btn-lg{padding:var(--space-lg) var(--space-2xl);font-size:var(--font-size-lg);min-height:64px}.dgi-form-group,.dgi-input-group{width:100%;max-width:400px;margin:var(--space-xl) auto}.dgi-label{display:block;font-size:var(--font-size-sm);color:var(--color-warning);margin-bottom:var(--space-sm);text-align:center;letter-spacing:.1em}.dgi-input{width:100%;font-family:"Press Start 2P",monospace;font-size:var(--font-size-sm);font-weight:400;padding:var(--space-md);background:var(--bg-darker);border:3px solid var(--border-primary);border-radius:var(--radius-md);color:var(--color-primary);text-align:center;transition:all var(--transition-normal);min-height:52px}.dgi-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #00ff001a,0 0 20px #00ff004d}.dgi-input::placeholder{color:var(--border-accent);opacity:.5}.dgi-game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-xl);margin:var(--space-2xl) 0}.dgi-game-card{background:linear-gradient(180deg,var(--bg-card) 0%,var(--bg-darker) 100%);border:4px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-xl);cursor:pointer;transition:all var(--transition-normal);position:relative;overflow:hidden;text-align:center}.dgi-game-card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(100,200,255,.1),transparent);animation:cardShine 3s infinite}@keyframes cardShine{0%{left:-100%}to{left:200%}}.dgi-game-card:hover,.dgi-game-card.keyboard-focus{transform:translateY(-8px);border-color:var(--color-primary);box-shadow:var(--shadow-lg),0 0 30px #00ff004d}.dgi-game-card:focus{outline:none}.dgi-game-icon{font-size:4rem;margin-bottom:var(--space-lg);filter:drop-shadow(0 0 20px rgba(255,255,255,.3))}.dgi-game-title{font-size:var(--font-size-lg);color:var(--color-primary);margin-bottom:var(--space-md);font-weight:700}.dgi-game-desc{font-size:var(--font-size-xs);color:var(--border-accent);line-height:1.8;margin-bottom:var(--space-lg);opacity:.9}.dgi-game-badge{display:inline-block;background:linear-gradient(135deg,var(--color-accent) 0%,#990099 100%);color:#fff;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:400;box-shadow:0 4px 12px #f0f6}.dgi-scores{margin-top:var(--space-2xl);padding-top:var(--space-2xl);border-top:2px solid var(--border-primary)}.dgi-scores-title{font-size:var(--font-size-xl);color:var(--color-warning);text-align:center;margin-bottom:var(--space-lg);letter-spacing:.2em}.dgi-scores-list{background:#0000004d;border:2px solid var(--border-primary);border-radius:var(--radius-md);padding:var(--space-md);max-height:300px;overflow-y:auto}.dgi-score-item{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-md);margin-bottom:var(--space-xs);background:#0a558033;border-radius:var(--radius-sm);transition:background var(--transition-fast)}.dgi-score-item:hover{background:#0a558066}.dgi-score-rank{font-size:var(--font-size-sm);color:var(--color-warning);min-width:40px;font-weight:700}.dgi-score-name{flex:1;font-size:var(--font-size-sm);color:var(--color-primary)}.dgi-score-value{font-size:var(--font-size-sm);color:var(--color-accent);font-weight:700}@keyframes dgi-fade-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes dgi-scale-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes dgi-blink{0%,50%{opacity:1}51%,to{opacity:.3}}@keyframes dgi-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.dgi-animate-fade-in{animation:dgi-fade-in var(--transition-normal) ease-out}.dgi-animate-scale-in{animation:dgi-scale-in var(--transition-normal) cubic-bezier(.34,1.56,.64,1)}.dgi-animate-blink{animation:dgi-blink 1.5s infinite}.dgi-animate-pulse{animation:dgi-pulse 2s infinite}@media (max-width: 768px){:root{--font-size-xs: .55rem;--font-size-sm: .65rem;--font-size-base: .75rem;--font-size-lg: .875rem;--font-size-xl: 1rem;--font-size-2xl: 1.25rem;--font-size-3xl: 1.5rem;--font-size-4xl: 1.75rem;--space-xs: 3px;--space-sm: 6px;--space-md: 12px;--space-lg: 18px;--space-xl: 24px;--space-2xl: 32px}.dgi-container{padding:var(--space-md)}.dgi-screen{padding:var(--space-sm)}.dgi-card{padding:var(--space-xl)}.dgi-game-grid{grid-template-columns:1fr;gap:var(--space-lg)}.dgi-btn{font-size:var(--font-size-xs);padding:var(--space-md) var(--space-lg);min-height:52px}.dgi-input{font-size:16px;min-height:48px}.dgi-btn,.dgi-game-card,.dgi-input{-webkit-tap-highlight-color:rgba(0,255,0,.1)}}@media (max-width: 400px){:root{--font-size-3xl: 1.25rem;--font-size-4xl: 1.5rem}.dgi-card{padding:var(--space-lg)}.dgi-game-icon{font-size:3rem}}@media (hover: none) and (pointer: coarse){.dgi-btn,.dgi-game-card,.dgi-score-item{min-height:48px}.dgi-btn:hover,.dgi-game-card:hover{transform:none}.dgi-btn:active{transform:scale(.98);opacity:.9}}.dgi-button-group{display:flex;flex-direction:column;gap:var(--space-md);align-items:center;width:100%;margin:var(--space-xl) auto}.dgi-section{margin:var(--space-2xl) 0;padding:var(--space-xl) 0;border-top:2px solid var(--border-primary)}.dgi-badge{display:inline-block;padding:var(--space-sm) var(--space-lg);background:var(--bg-card);border:2px solid var(--color-warning);border-radius:var(--radius-md);color:var(--color-warning);font-size:var(--font-size-sm);letter-spacing:.2em;text-align:center}.dgi-info-box{background:#00182980;border:2px solid var(--border-primary);border-left:4px solid var(--color-secondary);border-radius:var(--radius-sm);padding:var(--space-lg);margin:var(--space-xl) 0}.dgi-info-box p{font-size:var(--font-size-xs);line-height:1.8;margin:var(--space-xs) 0;opacity:.9}.dgi-game-header{width:100%;margin-bottom:var(--space-lg)}.dgi-hud{display:flex;justify-content:space-between;align-items:center;padding:var(--space-md);background:var(--bg-card);border:2px solid var(--border-primary);border-radius:var(--radius-md);flex-wrap:wrap;gap:var(--space-md)}.dgi-hud-item{display:flex;flex-direction:column;gap:var(--space-xs);align-items:center}.dgi-hud-label{font-size:var(--font-size-xs);color:var(--color-secondary);opacity:.7}.dgi-hud-value{font-size:var(--font-size-lg);color:var(--color-primary);font-weight:700}.dgi-game-title{font-size:var(--font-size-xl);color:var(--color-primary);text-align:center;margin:0}.dgi-game-layout{display:grid;grid-template-columns:1fr;gap:var(--space-lg);width:100%}@media (min-width: 1024px){.dgi-game-layout{grid-template-columns:2fr 1fr}}.dgi-game-canvas-area{display:flex;flex-direction:column;gap:var(--space-md);align-items:center}.dgi-game-canvas{width:100%;max-width:600px;height:auto;border:3px solid var(--border-primary);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);display:block}.dgi-game-info{width:100%;display:flex;flex-direction:column;gap:var(--space-sm)}.dgi-stat-badge{padding:var(--space-sm) var(--space-md);background:var(--bg-darker);border:2px solid var(--border-primary);border-radius:var(--radius-sm);color:var(--color-primary);font-size:var(--font-size-sm);display:inline-flex;align-items:center;gap:var(--space-xs)}.dgi-status-alert{padding:var(--space-md);background:#ff00441a;border:2px solid var(--color-danger);border-radius:var(--radius-md);color:var(--color-danger);font-size:var(--font-size-sm);text-align:center;animation:dgi-pulse 1s infinite}.dgi-game-sidebar{padding:var(--space-lg);background:var(--bg-card);border:2px solid var(--border-primary);border-radius:var(--radius-md);max-height:700px;overflow-y:auto}.dgi-summary-list{display:flex;flex-direction:column;gap:var(--space-md)}.dgi-score-list{display:flex;flex-direction:column;gap:var(--space-xs)}.dgi-score-item{display:flex;justify-content:space-between;padding:var(--space-sm) var(--space-md);background:var(--bg-darker);border:2px solid var(--border-primary);border-radius:var(--radius-sm);font-size:var(--font-size-xs);transition:all var(--transition-fast)}.dgi-score-item:hover{border-color:var(--border-accent);transform:translate(4px)}.dgi-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000814f2;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--space-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.dgi-modal{background:var(--bg-card);border:3px solid var(--border-accent);border-radius:var(--radius-xl);padding:var(--space-2xl);max-width:600px;width:100%;box-shadow:0 0 50px #64c8ff80;animation:dgi-scale-in .3s ease-out}.dgi-modal-content{text-align:center;margin-bottom:var(--space-xl)}.dgi-text-center{text-align:center}.dgi-text-left{text-align:left}.dgi-text-right{text-align:right}.dgi-mt-xs{margin-top:var(--space-xs)}.dgi-mt-sm{margin-top:var(--space-sm)}.dgi-mt-md{margin-top:var(--space-md)}.dgi-mt-lg{margin-top:var(--space-lg)}.dgi-mt-xl{margin-top:var(--space-xl)}.dgi-mb-xs{margin-bottom:var(--space-xs)}.dgi-mb-sm{margin-bottom:var(--space-sm)}.dgi-mb-md{margin-bottom:var(--space-md)}.dgi-mb-lg{margin-bottom:var(--space-lg)}.dgi-mb-xl{margin-bottom:var(--space-xl)}.dgi-p-xs{padding:var(--space-xs)}.dgi-p-sm{padding:var(--space-sm)}.dgi-p-md{padding:var(--space-md)}.dgi-p-lg{padding:var(--space-lg)}.dgi-p-xl{padding:var(--space-xl)}.dgi-flex{display:flex}.dgi-flex-col{flex-direction:column}.dgi-items-center{align-items:center}.dgi-justify-center{justify-content:center}.dgi-gap-sm{gap:var(--space-sm)}.dgi-gap-md{gap:var(--space-md)}.dgi-gap-lg{gap:var(--space-lg)}.dgi-w-full{width:100%}.dgi-max-w-sm{max-width:400px}.dgi-max-w-md{max-width:600px}.dgi-max-w-lg{max-width:800px}@media (max-width: 768px){.dgi-hidden-mobile{display:none!important}}.dgi-visible-mobile{display:none!important}@media (max-width: 768px){.dgi-visible-mobile{display:block!important}}:root{--color-primary: #00ff00;--color-primary-dark: #00cc00;--color-primary-darker: #006600;--color-primary-darkest: #001f00;--color-secondary: #00ccff;--color-secondary-light: #64c8ff;--color-secondary-lighter: #a8e0ff;--color-secondary-dark: #0099cc;--color-accent: #ff00ff;--color-accent-dark: #cc00cc;--color-accent-darker: #8b008b;--color-accent-darkest: #4b004b;--color-accent-darker: #660066;--color-warning: #ffff00;--color-warning-dark: #cccc00;--color-danger: #ff0044;--color-danger-alt: #ff0000;--color-danger-dark: #cc0000;--color-danger-darkest: #1f0000;--color-orange: #ff9800;--color-orange-dark: #f57c00;--color-orange-darker: #c56000;--color-orange-darkest: #b35600;--color-purple: #7c4dff;--color-purple-mid: #651fff;--color-purple-dark: #6200ea;--color-purple-light: #b388ff;--color-purple-alt: #533483;--color-purple-alt2: #667eea;--color-purple-alt3: #764ba2;--color-red-alt: #e94560;--color-gold: #ffd700;--color-gold-dark: #ffed4e;--color-gold-darker: #ff6600;--bg-dark: #000814;--bg-darker: #000509;--bg-darkest: #000d1a;--bg-card: #001829;--bg-card-hover: #002235;--bg-card-alt: #001f33;--bg-overlay: rgba(0, 20, 40, .95);--bg-overlay-light: rgba(0, 0, 0, .3);--border-primary: #0a5580;--border-primary-light: #003d5c;--border-primary-dark: #002b45;--border-accent: #64c8ff;--border-glow: rgba(100, 200, 255, .3);--glow-primary: 0 0 10px var(--color-primary);--glow-primary-md: 0 0 10px var(--color-primary), 0 0 20px var(--color-primary);--glow-primary-lg: 0 0 10px var(--color-primary), 0 0 20px var(--color-primary), 0 0 30px var(--color-primary);--glow-primary-xl: 0 0 10px var(--color-primary), 0 0 20px var(--color-primary), 0 0 30px var(--color-primary), 0 0 40px var(--color-primary);--glow-accent: 0 0 10px var(--color-accent);--glow-accent-md: 0 0 10px var(--color-accent), 0 0 20px var(--color-accent);--glow-accent-lg: 0 0 20px var(--color-accent), 0 0 40px var(--color-accent);--glow-accent-xl: 0 0 20px var(--color-accent), 0 0 40px var(--color-accent), 0 0 60px var(--color-accent);--glow-warning: 0 0 10px var(--color-warning);--glow-warning-md: 0 0 10px var(--color-warning), 0 0 20px var(--color-warning);--glow-warning-lg: 0 0 20px var(--color-warning), 0 0 30px var(--color-warning);--glow-secondary: 0 0 5px var(--color-secondary-light);--glow-secondary-md: 0 0 10px var(--color-secondary-light), 0 0 20px var(--color-secondary-light);--glow-gold: 0 0 20px rgba(255, 215, 0, .8), 0 0 40px rgba(255, 215, 0, .4);--glow-gold-intense: 0 0 30px rgba(255, 215, 0, 1), 0 0 60px rgba(255, 215, 0, .6);--glow-neon-soft: 0 0 2px currentColor, 0 0 4px currentColor, 0 0 6px rgba(255, 255, 255, .15);--glow-neon-subtle: 0 0 1px currentColor, 0 0 3px currentColor, 0 0 4px rgba(255, 255, 255, .08);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 16px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--shadow-xl: 0 10px 40px rgba(0, 0, 0, .5);--shadow-2xl: 0 20px 60px rgba(0, 0, 0, .6);--shadow-glow: 0 0 20px var(--border-glow);--shadow-glow-green: 0 0 20px rgba(0, 255, 0, .4);--shadow-glow-green-md: 0 0 30px rgba(0, 255, 0, .6);--shadow-glow-cyan: 0 0 15px rgba(100, 200, 255, .3);--shadow-glow-cyan-md: 0 0 25px rgba(100, 200, 255, .5);--shadow-glow-magenta: 0 0 20px rgba(255, 0, 255, .4);--shadow-glow-magenta-md: 0 0 30px rgba(255, 0, 255, .6);--shadow-glow-purple: 0 0 40px rgba(124, 77, 255, .4);--shadow-glow-purple-lg: 0 0 60px rgba(124, 77, 255, .6);--shadow-glow-orange: 0 0 20px rgba(255, 167, 38, .4);--shadow-glow-orange-md: 0 0 25px rgba(255, 167, 38, .6);--shadow-inset-sm: inset 0 0 20px rgba(0, 0, 0, .3);--shadow-inset-md: inset 0 0 40px rgba(0, 0, 0, .3);--shadow-inset-cyan: inset 0 0 20px rgba(100, 200, 255, .2);--shadow-inset-white: inset 0 0 60px rgba(255, 255, 255, .1);--button-shadow-primary: 0 6px 0 var(--color-primary-darker);--button-shadow-primary-hover: 0 9px 0 var(--color-primary-darker);--button-shadow-primary-active: 0 4px 0 var(--color-primary-darker);--button-shadow-primary-glow: 0 10px 20px rgba(0, 230, 118, .4);--button-shadow-primary-glow-hover: 0 12px 25px rgba(0, 230, 118, .6);--button-shadow-secondary: 0 6px 0 var(--border-primary-dark);--button-shadow-secondary-hover: 0 9px 0 var(--border-primary-dark);--button-shadow-secondary-active: 0 4px 0 var(--border-primary-dark);--button-shadow-secondary-sm: 0 3px 0 var(--border-primary-dark);--button-shadow-secondary-sm-hover: 0 5px 0 var(--border-primary-dark);--button-shadow-accent: 0 6px 0 var(--color-accent-darker);--button-shadow-accent-hover: 0 9px 0 var(--color-accent-darker);--button-shadow-accent-active: 0 3px 0 var(--color-accent-darker);--button-shadow-accent-sm: 0 5px 0 var(--color-accent-darkest);--button-shadow-orange: 0 6px 0 var(--color-orange-darker);--button-shadow-orange-hover: 0 8px 0 var(--color-orange-darker);--button-shadow-orange-active: 0 3px 0 var(--color-orange-darker);--button-shadow-danger: 0 5px 0 #990000;--button-shadow-danger-hover: 0 7px 0 #990000;--button-shadow-danger-active: 0 2px 0 #990000;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--radius-sm: 5px;--radius-md: 8px;--radius-lg: 10px;--radius-xl: 15px;--radius-2xl: 20px;--radius-full: 9999px;--border-width-sm: 2px;--border-width-md: 3px;--border-width-lg: 4px;--border-width-xl: 5px;--border-width-2xl: 8px;--transition-fast: .15s;--transition-normal: .25s;--transition-slow: .4s;--transition-slower: .6s;--ease-in-out: ease-in-out;--ease-out: ease-out;--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.68, -.55, .265, 1.55);--transition-fast-ease: .15s ease;--transition-normal-ease: .25s ease;--transition-slow-ease: .4s ease;--transition-transform: transform .1s ease;--transition-shadow: box-shadow .2s ease;--transition-all: all .2s ease;--anim-duration-fast: .3s;--anim-duration-normal: .6s;--anim-duration-slow: 1s;--anim-duration-slower: 1.5s;--anim-duration-slowest: 2s;--anim-duration-blink: 1s;--anim-duration-pulse: 2s;--anim-duration-shine: 3s;--font-size-xs: .55rem;--font-size-sm: .65rem;--font-size-base: .75rem;--font-size-md: .875rem;--font-size-lg: 1rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 2rem;--font-size-4xl: 2.5rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--font-size-7xl: 4.5rem;--font-weight-normal: 400;--font-weight-bold: 700;--letter-spacing-tight: .05em;--letter-spacing-normal: .1em;--letter-spacing-wide: .15em;--letter-spacing-wider: .2em;--line-height-tight: 1.2;--line-height-normal: 1.6;--line-height-loose: 1.8;--z-base: 1;--z-canvas: 1;--z-hud: 10;--z-dropdown: 10;--z-sticky: 100;--z-mobile-controls: 100;--z-overlay: 1000;--z-modal: 2000;--z-toast: 3000;--gradient-bg-dark: radial-gradient(ellipse at center, #001829 0%, #000d1a 100%);--gradient-bg-blue: linear-gradient(180deg, #001829 0%, #000d1a 100%);--gradient-bg-blue-alt: linear-gradient(180deg, #001528 0%, #002438 100%);--gradient-bg-blue-darker: linear-gradient(180deg, #003d5c 0%, #002b45 100%);--gradient-bg-blue-card: linear-gradient(135deg, #003d5c 0%, #0a5580 100%);--gradient-bg-blue-card-alt: linear-gradient(135deg, #0a3550 0%, #063047 100%);--gradient-btn-primary: linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);--gradient-btn-secondary: linear-gradient(180deg, var(--border-primary) 0%, var(--border-primary-light) 100%);--gradient-btn-accent: linear-gradient(180deg, var(--color-accent) 0%, var(--color-accent-dark) 100%);--gradient-btn-orange: linear-gradient(180deg, var(--color-orange) 0%, var(--color-orange-dark) 100%);--gradient-btn-danger: linear-gradient(135deg, #ff0080 0%, #ff0000 100%);--gradient-overlay-purple: linear-gradient(180deg, #7c4dff 0%, #651fff 50%, #6200ea 100%);--gradient-overlay-red: linear-gradient(180deg, #e94560 0%, #533483 100%);--gradient-overlay-game: linear-gradient(135deg, #e94560 0%, #533483 100%);--gradient-progress: linear-gradient(90deg, #4ECDC4, #44A08D);--gradient-badge: linear-gradient(135deg, var(--color-accent) 0%, #990099 100%);--gradient-highscore: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);--gradient-shine: linear-gradient(90deg, transparent, rgba(255,255,255,.1), transparent);--gradient-shine-cyan: linear-gradient(90deg, transparent, rgba(100, 200, 255, .1), transparent);--opacity-disabled: .3;--opacity-hint: .5;--opacity-subtle: .6;--opacity-medium: .7;--opacity-text: .9;--opacity-full: 1;--canvas-bg: #1a1a2e;--canvas-border: var(--border-primary);--touch-highlight: rgba(0, 255, 0, .1);--screen-glow: 0 0 20px rgba(100, 200, 255, .3)}:root{--breakpoint-sm: 400px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1200px;--breakpoint-2xl: 1400px}@media (max-width: 768px){:root{--font-size-xs: .5rem;--font-size-sm: .6rem;--font-size-base: .65rem;--font-size-md: .75rem;--font-size-lg: .875rem;--font-size-xl: 1rem;--font-size-2xl: 1.25rem;--font-size-3xl: 1.5rem;--font-size-4xl: 1.75rem;--font-size-5xl: 2rem;--font-size-6xl: 2.25rem;--font-size-7xl: 2.5rem;--space-xs: 3px;--space-sm: 6px;--space-md: 12px;--space-lg: 18px;--space-xl: 24px;--space-2xl: 32px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:var(--opacity-full);transform:translateY(0)}}.arcade-title-component{text-align:center;margin-bottom:var(--space-lg);animation:fadeInUp var(--anim-duration-normal) ease-out}.title-wrapper{margin:var(--space-md) 0}.arcade-game-title{font-size:var(--font-size-4xl);color:var(--color-primary);text-shadow:var(--glow-primary);margin:0;padding:0;line-height:var(--line-height-tight);word-break:break-word;font-weight:700}.arcade-subtitle{font-size:var(--font-size-xs);color:var(--color-primary);margin-top:var(--space-xs);letter-spacing:var(--letter-spacing-wider);opacity:var(--opacity-text)}.glitch{position:relative}.glitch:before,.glitch:after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%}.glitch:before{left:2px;text-shadow:-2px 0 var(--color-accent);animation:glitch-1 var(--anim-duration-pulse) infinite;clip:rect(0,900px,0,0)}.glitch:after{left:-2px;text-shadow:-2px 0 var(--color-secondary);animation:glitch-2 3s infinite;clip:rect(0,900px,0,0)}@keyframes glitch-1{0%{clip:rect(42px,9999px,44px,0)}5%{clip:rect(12px,9999px,59px,0)}10%{clip:rect(48px,9999px,29px,0)}15%{clip:rect(42px,9999px,73px,0)}20%{clip:rect(63px,9999px,27px,0)}25%{clip:rect(34px,9999px,55px,0)}30%{clip:rect(86px,9999px,73px,0)}35%{clip:rect(20px,9999px,20px,0)}40%{clip:rect(26px,9999px,60px,0)}45%{clip:rect(25px,9999px,66px,0)}50%{clip:rect(57px,9999px,98px,0)}55%{clip:rect(5px,9999px,46px,0)}60%{clip:rect(82px,9999px,31px,0)}65%{clip:rect(54px,9999px,27px,0)}70%{clip:rect(28px,9999px,99px,0)}75%{clip:rect(45px,9999px,69px,0)}80%{clip:rect(23px,9999px,85px,0)}85%{clip:rect(64px,9999px,11px,0)}90%{clip:rect(37px,9999px,51px,0)}95%{clip:rect(15px,9999px,77px,0)}to{clip:rect(67px,9999px,37px,0)}}@keyframes glitch-2{0%{clip:rect(65px,9999px,100px,0)}5%{clip:rect(52px,9999px,74px,0)}10%{clip:rect(79px,9999px,85px,0)}15%{clip:rect(75px,9999px,5px,0)}20%{clip:rect(67px,9999px,61px,0)}25%{clip:rect(14px,9999px,79px,0)}30%{clip:rect(1px,9999px,66px,0)}35%{clip:rect(86px,9999px,30px,0)}40%{clip:rect(23px,9999px,98px,0)}45%{clip:rect(85px,9999px,72px,0)}50%{clip:rect(71px,9999px,75px,0)}55%{clip:rect(2px,9999px,48px,0)}60%{clip:rect(30px,9999px,16px,0)}65%{clip:rect(59px,9999px,50px,0)}70%{clip:rect(41px,9999px,62px,0)}75%{clip:rect(2px,9999px,82px,0)}80%{clip:rect(47px,9999px,73px,0)}85%{clip:rect(3px,9999px,27px,0)}90%{clip:rect(26px,9999px,55px,0)}95%{clip:rect(42px,9999px,97px,0)}to{clip:rect(38px,9999px,49px,0)}}.name-input-component{margin:var(--space-md) auto;width:100%;max-width:400px;animation:fadeInUp var(--anim-duration-normal) ease-out .1s;animation-fill-mode:both}.name-label{display:block;font-size:var(--font-size-md);color:var(--color-primary);margin-bottom:var(--space-xs);text-align:center;letter-spacing:var(--letter-spacing-tight)}.name-input-wrapper{display:flex;gap:var(--space-sm);align-items:center}.name-input{flex:1;background:#00ff001a;border:var(--border-width-sm) solid var(--color-primary);color:var(--color-primary);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-lg);font-family:"Press Start 2P",monospace;text-align:center;text-transform:uppercase;border-radius:var(--radius-sm);outline:none;transition:var(--transition-all)}@keyframes pulse-glow{0%,to{box-shadow:0 0 20px #00ff0080}50%{box-shadow:0 0 30px #0f0c}}.name-input:focus{background:#0f03;animation:pulse-glow var(--anim-duration-slower) infinite}.random-name-btn{width:48px;height:48px;background:#00ff001a;border:var(--border-width-sm) solid var(--color-primary);color:var(--color-primary);font-size:var(--font-size-2xl);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-all);display:flex;align-items:center;justify-content:center}.random-name-btn:hover{background:#00ff004d;transform:rotate(15deg) scale(1.1);box-shadow:0 0 15px #0f06}.random-name-btn:active{transform:rotate(180deg) scale(.9);background:#0f06}.arcade-btn{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);width:100%;max-width:280px;margin:var(--space-sm) auto;padding:var(--space-sm) var(--space-lg);background:var(--gradient-btn-primary);border:none;border-radius:var(--radius-md);color:var(--color-primary-darkest);font-family:"Press Start 2P",monospace;font-size:var(--font-size-md);font-weight:var(--font-weight-bold);cursor:pointer;box-shadow:0 4px 0 var(--color-primary-darker),var(--shadow-lg);transition:var(--transition-transform);text-transform:uppercase;animation:fadeInUp var(--anim-duration-normal) ease-out .2s;animation-fill-mode:both}.arcade-btn:hover{background:linear-gradient(180deg,#0f4,#0d0);box-shadow:0 4px 0 var(--color-primary-darker),0 8px 16px #00ff004d}.arcade-btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--color-primary-darker),0 4px 8px #00000080;transition:all .05s ease}.btn-text{font-size:1em;line-height:var(--line-height-normal)}.btn-shortcut{font-size:var(--font-size-xs);opacity:var(--opacity-text);letter-spacing:var(--letter-spacing-tight)}.arcade-btn-secondary{background:var(--gradient-btn-secondary);box-shadow:0 4px #048,var(--shadow-lg);opacity:.9}.arcade-btn-secondary:hover{background:linear-gradient(180deg,#09d,#07b);opacity:var(--opacity-full)}.arcade-btn-secondary:active{box-shadow:0 0 #048,var(--shadow-md)}.highscore-component{width:100%;max-width:100%;margin:var(--space-xl) auto var(--space-lg);padding:var(--space-md);background:#00ff0005;border:var(--border-width-sm) solid rgba(0,255,0,.3);border-radius:var(--radius-md);animation:fadeInUp var(--anim-duration-normal) ease-out .3s;animation-fill-mode:both}.highscore-title{font-size:var(--font-size-lg);color:var(--color-primary);text-align:center;margin:0 0 var(--space-md) 0;letter-spacing:var(--letter-spacing-normal);text-shadow:var(--glow-primary-soft)}.highscore-empty{text-align:center;color:var(--color-primary);opacity:var(--opacity-medium);font-size:var(--font-size-sm);padding:var(--space-lg)}.highscore-list{display:flex;flex-direction:column;gap:var(--space-xs);max-height:400px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--color-primary) rgba(0,0,0,.3)}.highscore-list::-webkit-scrollbar{width:8px}.highscore-list::-webkit-scrollbar-track{background:#0000004d;border-radius:var(--radius-sm)}.highscore-list::-webkit-scrollbar-thumb{background:var(--color-primary);border-radius:var(--radius-sm)}.score-item{display:grid;grid-template-columns:2.5rem 1fr auto;gap:var(--space-sm);padding:var(--space-md);background:#00ff000d;border-radius:var(--radius-sm);border-left:var(--border-width-md) solid transparent;align-items:center;font-size:var(--font-size-md);line-height:var(--line-height-tight);transition:var(--transition-all);min-height:52px}.score-rank{font-size:var(--font-size-xl);text-align:center;font-weight:var(--font-weight-bold)}.score-name{font-weight:var(--font-weight-bold);color:var(--color-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.score-value{text-align:right;font-weight:var(--font-weight-bold);color:var(--color-primary);white-space:nowrap}.score-item.podium{background:linear-gradient(90deg,#ffd7001a,#00ff000d);border-left-width:var(--border-width-lg)}.score-item.rank-1{border-left-color:var(--color-gold)}.score-item.rank-2{border-left-color:var(--color-silver)}.score-item.rank-3{border-left-color:var(--color-bronze)}.arcade-info-component{margin:var(--space-lg) auto var(--space-md);padding:var(--space-md);background:#00ff0005;border:var(--border-width-sm) solid rgba(0,255,0,.3);border-radius:var(--radius-md);max-width:400px}.info-item{color:var(--color-primary);font-size:var(--font-size-sm);line-height:var(--line-height-loose);margin:var(--space-xs) 0;text-align:center;opacity:var(--opacity-bright)}.info-item:first-child{margin-top:0}.info-item:last-child{margin-bottom:0}@media (min-width: 769px){.arcade-game-title{font-size:var(--font-size-7xl)}.arcade-subtitle{font-size:var(--font-size-md)}.name-input{font-size:var(--font-size-xl);padding:var(--space-md) var(--space-lg)}.random-name-btn{width:56px;height:56px;font-size:var(--font-size-3xl)}.arcade-btn{max-width:350px;font-size:var(--font-size-lg);padding:var(--space-md) var(--space-2xl)}.highscore-component{max-width:600px;padding:var(--space-lg)}.highscore-title{font-size:var(--font-size-2xl)}.highscore-list{gap:var(--space-sm)}.score-item{padding:var(--space-lg);font-size:var(--font-size-lg)}.score-item:hover{transform:translate(4px);background:#00ff001a;box-shadow:var(--shadow-glow-cyan)}.score-rank{font-size:var(--font-size-2xl)}.arcade-info-component{max-width:500px}.info-item{font-size:var(--font-size-md);margin:var(--space-sm) 0}}@media (pointer: coarse){.arcade-btn{min-height:56px}.random-name-btn{min-width:48px;min-height:48px}.score-item{min-height:48px}}@media (max-width: 400px){.arcade-game-title{font-size:var(--font-size-2xl)!important;line-height:1.1}.arcade-subtitle{font-size:var(--font-size-2xs)!important}.name-input{font-size:var(--font-size-md)!important;padding:var(--space-xs) var(--space-sm)!important}.random-name-btn{width:40px!important;height:40px!important;font-size:var(--font-size-2xl)!important}.arcade-btn{max-width:250px!important;font-size:var(--font-size-xs)!important;padding:var(--space-xs) var(--space-md)!important;margin:var(--space-xs) auto!important}.btn-shortcut{font-size:var(--font-size-2xs)!important}.highscore-component{padding:var(--space-sm)!important}.highscore-title{font-size:var(--font-size-lg)!important;margin-bottom:var(--space-xs)!important}.score-item{padding:var(--space-xs)!important;font-size:var(--font-size-xs)!important}.medal-icon{font-size:var(--font-size-lg)!important;width:24px!important}}@media (max-width: 360px){.arcade-cabinet,.game-cabinet{padding:var(--space-xs)!important}.arcade-game-title{font-size:var(--font-size-xl)!important}.arcade-subtitle{font-size:var(--font-size-2xs)!important}.arcade-btn{max-width:220px!important;font-size:var(--font-size-2xs)!important;padding:var(--space-xs) var(--space-sm)!important;margin:var(--space-xs) auto!important}.name-input{font-size:var(--font-size-sm)!important;padding:var(--space-xs)!important}.random-name-btn{width:36px!important;height:36px!important;font-size:var(--font-size-xl)!important}.score-item{padding:var(--space-xs)!important;font-size:var(--font-size-2xs)!important}.medal-icon{display:none!important}}