@import"https://fonts.googleapis.com/css2?family=Rye&family=Roboto+Slab:wght@400;700&display=swap";body{overflow:hidden;background:radial-gradient(circle at center,#4a3728,#1a120b);color:#f4e4bc;font-family:Roboto Slab,Georgia,serif}canvas{display:block}#ui{position:fixed;top:0;left:0;width:100%;pointer-events:none;z-index:10}#topbar{display:flex;justify-content:space-between;align-items:center;padding:16px 28px;background:linear-gradient(180deg,rgba(74,55,40,.85),transparent)}#title{font-family:Rye,serif;font-size:28px;font-weight:400;letter-spacing:3px;color:#f4e4bc;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}.stat-box{display:flex;gap:24px;align-items:center}.stat{text-align:center;pointer-events:auto}.stat-label{font-size:11px;color:#fde68a80;text-transform:uppercase;letter-spacing:2px}.stat-value{font-size:24px;font-weight:700;color:#f4e4bc;text-shadow:0 1px 3px rgba(0,0,0,.5)}#overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#1a120beb;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#overlay h1{font-family:Rye,serif;font-size:56px;font-weight:400;letter-spacing:4px;margin-bottom:8px;color:#f4e4bc;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6);text-align:center}#overlay h2{font-size:20px;color:#fde68a80;margin-bottom:36px;font-weight:400;letter-spacing:2px}#overlay .instructions{color:#f4e4bccc;font-size:15px;line-height:2;text-align:center;margin-bottom:36px;max-width:480px}#overlay .instructions b{color:#fbbf24}#start-btn{padding:16px 56px;font-size:22px;font-weight:700;letter-spacing:3px;font-family:Rye,Roboto Slab,serif;background:linear-gradient(180deg,#d4af37,#8b6914);border:2px solid #3d2808;border-radius:6px;color:#2a1a0a;text-shadow:0 1px 0 rgba(255,255,255,.3);box-shadow:inset 0 1px #fff6,inset 0 -2px #0000004d,0 3px 6px #0006;cursor:pointer;pointer-events:auto;transition:all .15s ease;text-transform:uppercase}#start-btn:hover{background:linear-gradient(180deg,#e5c158,#a67c00);box-shadow:inset 0 1px #ffffff80,inset 0 -2px #0000004d,0 4px 8px #00000080,0 0 12px #d4af3766;transform:translateY(-1px)}#start-btn:active{background:linear-gradient(180deg,#8b6914,#d4af37);box-shadow:inset 0 2px 4px #0006,0 1px 2px #0006;transform:translateY(1px)}#hint{position:fixed;bottom:20px;left:50%;transform:translate(-50%);color:#fde68a60;font-size:13px;z-index:10;pointer-events:none}*{margin:0;padding:0;box-sizing:border-box}body{overflow-x:hidden;background:radial-gradient(circle at center,#4a3728,#1a120b);color:#f4e4bc;font-family:Roboto Slab,Georgia,serif;min-height:100vh}#app{min-height:100vh}a{color:#fbbf24;text-decoration:none;cursor:pointer}a:hover{text-decoration:underline}.steampunk-panel{background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b;border-radius:8px;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080,0 4px 12px #00000080}.glass{background:linear-gradient(145deg,#4a3728eb,#1a120bf2);border:3px solid #b8860b;border-radius:12px;box-shadow:inset 0 0 20px #0009,0 8px 32px #0009,0 0 0 2px #3d2808,0 0 0 4px #b8860b}.steampunk-title{font-family:Rye,serif;color:#f4e4bc;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}@keyframes pulse-glow{0%,to{box-shadow:0 0 12px #d4af3799}50%{box-shadow:0 0 24px #d4af37e6}}.pulse-glow{animation:pulse-glow 2s ease-in-out infinite}.btn-primary{padding:14px 40px;font-size:18px;font-weight:700;letter-spacing:2px;font-family:Rye,Roboto Slab,serif;background:linear-gradient(180deg,#d4af37,#8b6914);border:2px solid #3d2808;border-radius:6px;color:#2a1a0a;text-shadow:0 1px 0 rgba(255,255,255,.3);box-shadow:inset 0 1px #fff6,inset 0 -2px #0000004d,0 3px 6px #0006;cursor:pointer;transition:all .15s ease;text-transform:uppercase}.btn-primary:hover{background:linear-gradient(180deg,#e5c158,#a67c00);box-shadow:inset 0 1px #ffffff80,inset 0 -2px #0000004d,0 4px 8px #00000080,0 0 12px #d4af3766;transform:translateY(-1px)}.btn-primary:active{background:linear-gradient(180deg,#8b6914,#d4af37);box-shadow:inset 0 2px 4px #0006,0 1px 2px #0006;transform:translateY(1px)}.btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none}.btn-secondary{padding:14px 40px;font-size:18px;font-weight:700;letter-spacing:2px;font-family:Rye,Roboto Slab,serif;background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b;border-radius:6px;color:#f4e4bc;text-shadow:0 1px 3px rgba(0,0,0,.5);box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080,0 3px 6px #0006;cursor:pointer;transition:all .15s ease;text-transform:uppercase}.btn-secondary:hover{border-color:#d4af37;box-shadow:0 0 12px #d4af374d,0 4px 8px #00000080;transform:translateY(-1px)}.btn-small{padding:6px 14px;font-size:12px;font-weight:600;border-radius:4px;border:1px solid;cursor:pointer;transition:all .2s;margin:2px;font-family:Roboto Slab,serif}.btn-small:disabled{opacity:.3;cursor:not-allowed}.btn-ok{border-color:#10b981;color:#34d399;background:#10b9811a}.btn-ok:hover{background:#10b9814d;color:#6ee7b7}.btn-warn{border-color:#f59e0b;color:#fbbf24;background:#f59e0b1a}.btn-warn:hover{background:#f59e0b4d;color:#fcd34d}.btn-danger{border-color:#be123c;color:#fb7185;background:#be123c1a}.btn-danger:hover{background:#be123c4d;color:#fda4af}.navbar{display:flex;justify-content:space-between;align-items:center;padding:16px 32px;background:linear-gradient(180deg,#5d4037,#3e2723);position:sticky;top:0;z-index:100;border-bottom:2px solid #b8860b;box-shadow:0 4px 12px #00000080}.navbar-game{position:relative}.nav-brand{font-family:Rye,serif;font-size:24px;font-weight:400;letter-spacing:3px;cursor:pointer;color:#f4e4bc;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}.nav-links{display:flex;gap:20px;align-items:center}.nav-link{color:#fde68acc;font-size:14px;font-weight:400;cursor:pointer;text-decoration:none;transition:color .2s;letter-spacing:1px}.nav-link:hover{color:#f4e4bc;text-decoration:none}.nav-link.nav-primary{border:2px solid #b8860b;padding:8px 20px;border-radius:6px;color:#fbbf24;background:#b4530933}.nav-link.nav-primary:hover{background:#b4530966;border-color:#d4af37;color:#f4e4bc}.page-landing{min-height:100vh}.hero{display:flex;align-items:center;justify-content:space-between;min-height:80vh;padding:40px 60px;gap:40px}.hero-content{flex:1;max-width:600px}.hero-title{font-family:Rye,serif;font-size:72px;font-weight:400;letter-spacing:6px;line-height:1;color:#f4e4bc;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}.hero-subtitle{font-size:28px;color:#fde68a80;letter-spacing:8px;margin-top:8px;font-family:Rye,serif}.hero-desc{color:#f4e4bccc;font-size:17px;line-height:1.7;margin:24px 0}.hero-cta{display:flex;gap:16px;margin-top:32px}.hero-cube{width:300px;height:300px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;padding:60px 40px;max-width:1200px;margin:0 auto}.feature-card{background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b80;border-radius:8px;padding:32px 24px;text-align:center;transition:all .3s;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080,0 4px 12px #00000080}.feature-card:hover{border-color:#d4af37;transform:translateY(-4px);box-shadow:0 8px 30px #d4af3733,0 4px 12px #00000080}.feature-icon{font-size:48px;margin-bottom:16px}.feature-card h3{font-family:Rye,serif;font-size:20px;margin-bottom:12px;color:#f4e4bc;font-weight:400}.feature-card p{color:#fde68a99;font-size:14px;line-height:1.6}.how-to{padding:60px 40px;max-width:900px;margin:0 auto;text-align:center}.how-to h2{font-family:Rye,serif;font-size:36px;margin-bottom:40px;letter-spacing:3px;color:#f4e4bc;font-weight:400;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}.steps{display:flex;flex-direction:column;gap:20px;max-width:600px;margin:0 auto}.step{display:flex;align-items:center;gap:20px;background:linear-gradient(180deg,#5d4037,#3e2723);padding:16px 24px;border-radius:8px;border:1px solid #b8860b50;text-align:left;box-shadow:inset 0 1px #ffffff1a,0 2px 8px #0000004d}.step-num{width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#f4e4bc,#8b6914,#3d2808);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;color:#2a1a0a;flex-shrink:0;box-shadow:inset 0 1px 1px #00000080}.step p{color:#f4e4bccc;font-size:15px}.step b{color:#fbbf24}.footer{text-align:center;padding:40px;color:#fde68a60;border-top:1px solid #b8860b30}.footer a{color:#fde68a99}.page-auth{min-height:100vh}.auth-container{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 60px);padding:40px}.auth-card{background:linear-gradient(145deg,#4a3728eb,#1a120bf2);border:3px solid #b8860b;border-radius:12px;padding:40px;width:100%;max-width:420px;box-shadow:inset 0 0 20px #0009,0 8px 32px #0009,0 0 0 2px #3d2808,0 0 0 4px #b8860b}.auth-tabs{display:flex;gap:0;margin-bottom:32px;border-bottom:2px solid #b8860b50}.auth-tab{flex:1;padding:12px;background:transparent;border:none;color:#fde68a80;font-size:16px;font-weight:400;cursor:pointer;transition:all .2s;border-bottom:2px solid transparent;margin-bottom:-2px;letter-spacing:1px;font-family:Rye,serif}.auth-tab.active{color:#fbbf24;border-bottom-color:#d4af37}.auth-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:13px;color:#fde68a99;letter-spacing:1px}.form-group input,.form-group textarea{background:#1a120b99;border:2px solid #b8860b50;border-radius:6px;padding:12px 16px;color:#f4e4bc;font-size:15px;transition:border-color .2s;font-family:Roboto Slab,Georgia,serif}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#d4af37;box-shadow:0 0 8px #d4af374d}.form-group input::placeholder,.form-group textarea::placeholder{color:#fde68a40}.auth-error{color:#fb7185;font-size:14px;min-height:20px}.auth-submit{width:100%;margin-top:8px}.auth-switch{text-align:center;margin-top:24px;color:#fde68a80;font-size:14px}.auth-switch a{color:#fbbf24}.page-game{min-height:100vh;position:relative}#game-ui{position:fixed;top:60px;left:0;right:0;z-index:10;pointer-events:none}.game-stats{display:flex;justify-content:center;gap:40px;padding:12px}.game-stats .stat{text-align:center}.game-stats .stat-label{font-size:11px;color:#fde68a80;text-transform:uppercase;letter-spacing:2px}.game-stats .stat-value{font-size:22px;font-weight:700;color:#f4e4bc;text-shadow:0 1px 3px rgba(0,0,0,.5)}.stat-player{color:#fbbf24!important;font-size:16px!important}#timer-bar{position:fixed;top:0;left:0;height:4px;background:linear-gradient(90deg,#d4af37,#b8860b,#8b6914);transition:width .3s linear;z-index:11;box-shadow:0 0 10px #d4af3799}#message{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);font-family:Rye,serif;font-size:48px;font-weight:400;color:#f4e4bc;text-align:center;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6);z-index:20;pointer-events:none;opacity:0;transition:opacity .4s}#message.show{opacity:1}#combo{position:fixed;top:55%;left:50%;transform:translate(-50%);font-size:22px;font-weight:700;color:#fbbf24;z-index:20;pointer-events:none;opacity:0;transition:opacity .3s;text-shadow:0 0 20px rgba(251,191,36,.8)}#combo.show{opacity:1}#game-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#1a120beb;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#game-overlay h1{font-family:Rye,serif;font-size:56px;font-weight:400;letter-spacing:4px;margin-bottom:8px;color:#f4e4bc;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}#game-overlay h2{font-size:20px;color:#fde68a80;margin-bottom:36px;letter-spacing:2px;font-family:Rye,serif}.game-instructions{color:#f4e4bccc;font-size:15px;line-height:2;text-align:center;margin-bottom:36px;max-width:480px}.game-instructions b{color:#fbbf24}#game-hint{position:fixed;bottom:20px;left:50%;transform:translate(-50%);color:#fde68a60;font-size:13px;z-index:10;pointer-events:none}#mute-btn{position:fixed;bottom:20px;right:20px;z-index:12;background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b;color:#f4e4bc;width:40px;height:40px;border-radius:8px;cursor:pointer;pointer-events:auto;font-size:18px;display:flex;align-items:center;justify-content:center;transition:all .3s;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080,0 4px 12px #00000080}#mute-btn:hover{border-color:#d4af37;box-shadow:0 0 12px #d4af3766}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#1a120be6;display:flex;justify-content:center;align-items:center;z-index:60;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:linear-gradient(145deg,#4a3728eb,#1a120bf2);border:3px solid #b8860b;border-radius:12px;padding:48px;text-align:center;max-width:500px;box-shadow:inset 0 0 20px #0009,0 8px 32px #0009,0 0 0 2px #3d2808,0 0 0 4px #b8860b}.modal-content h2{font-family:Rye,serif;font-size:36px;margin-bottom:24px;letter-spacing:3px;color:#f4e4bc;font-weight:400;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}.game-over-score{font-size:28px;margin:12px 0;color:#f4e4bc}.game-over-score b{color:#fbbf24}.game-over-level,.game-over-time{color:#fde68a99;font-size:16px;margin:8px 0}.personal-best{color:#fbbf24;font-size:22px;font-weight:700;margin:16px 0;text-shadow:0 0 20px rgba(251,191,36,.6);animation:pulse-glow 2s ease-in-out infinite;padding:8px 16px;border-radius:8px}.score-submitted{color:#34d399;font-size:14px;margin-top:12px}.score-error{color:#fb7185;font-size:14px;margin-top:12px}#game-over-actions{display:flex;gap:16px;justify-content:center;margin-top:32px}.page-leaderboard{min-height:100vh}.leaderboard-container{max-width:1000px;margin:0 auto;padding:40px}.page-title{font-family:Rye,serif;font-size:40px;letter-spacing:4px;text-align:center;margin-bottom:32px;color:#f4e4bc;font-weight:400;text-shadow:0 1px 0 #5c3a10,0 2px 0 #3d2808,0 3px 4px rgba(0,0,0,.6)}.leaderboard-tabs{display:flex;gap:0;margin-bottom:24px;border-bottom:2px solid #b8860b50}.lb-tab{padding:12px 24px;background:transparent;border:none;color:#fde68a80;font-size:15px;font-weight:400;cursor:pointer;transition:all .2s;border-bottom:2px solid transparent;margin-bottom:-2px;font-family:Roboto Slab,serif}.lb-tab.active{color:#fbbf24;border-bottom-color:#d4af37}.lb-tab:hover{color:#f4e4bc}.leaderboard-table,.admin-table,.profile-scores-table{width:100%;border-collapse:collapse;margin-top:16px}.leaderboard-table th,.admin-table th,.profile-scores-table th{text-align:left;padding:12px 16px;color:#fde68a80;font-size:12px;text-transform:uppercase;letter-spacing:1px;border-bottom:2px solid #b8860b50}.leaderboard-table td,.admin-table td,.profile-scores-table td{padding:12px 16px;border-bottom:1px solid #b8860b20;font-size:14px;color:#f4e4bc}.leaderboard-table tr:hover,.admin-table tr:hover{background:#b4530926}.player-name{color:#fbbf24;font-weight:600}.score-value{color:#fbbf24;font-weight:700}.date-cell,.email-cell{color:#fde68a80;font-size:13px}.rank-1{background:#d4af371a}.rank-1 td:first-child{color:#d4af37;font-weight:700}.rank-2{background:#b8860b14}.rank-2 td:first-child{color:#b8860b;font-weight:700}.rank-3{background:#8b69140f}.rank-3 td:first-child{color:#8b6914;font-weight:700}.loading{text-align:center;padding:60px;color:#fde68a80;font-size:16px}.empty-state{text-align:center;padding:60px;color:#fde68a80}.error-msg{text-align:center;padding:40px;color:#fb7185}.page-profile{min-height:100vh}.profile-container{max-width:900px;margin:0 auto;padding:40px}.profile-header{display:flex;gap:32px;align-items:center;margin-bottom:40px;background:linear-gradient(145deg,#4a3728eb,#1a120bf2);border:3px solid #b8860b;border-radius:12px;padding:32px;box-shadow:inset 0 0 20px #0009,0 8px 32px #0009,0 0 0 2px #3d2808,0 0 0 4px #b8860b}.profile-avatar{width:80px;height:80px;border-radius:16px;background:linear-gradient(180deg,#5d4037,#3e2723);display:flex;align-items:center;justify-content:center;font-size:40px;flex-shrink:0;border:2px solid #b8860b;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080}.profile-info h1{font-family:Rye,serif;font-size:28px;margin-bottom:4px;color:#f4e4bc;font-weight:400}.profile-username{color:#fde68a80;font-size:15px;margin-bottom:8px}.profile-bio{color:#f4e4bccc;font-size:14px;margin-bottom:8px;line-height:1.5}.admin-badge{display:inline-block;padding:4px 12px;background:#be123c33;color:#fb7185;border:1px solid #be123c;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:1px}.profile-joined{color:#fde68a60;font-size:13px;margin-top:8px}.profile-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:40px}.profile-stat-card{background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b80;border-radius:8px;padding:24px;text-align:center;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080,0 4px 12px #00000080}.stat-number{font-size:32px;font-weight:700;color:#fbbf24}.stat-name{font-size:12px;color:#fde68a80;text-transform:uppercase;letter-spacing:1px;margin-top:8px}.profile-sections{display:grid;grid-template-columns:1fr 1fr;gap:32px}@media (max-width: 768px){.profile-sections{grid-template-columns:1fr}}.profile-section{background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b80;border-radius:8px;padding:24px;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080,0 4px 12px #00000080}.profile-section h2{font-family:Rye,serif;font-size:20px;margin-bottom:20px;color:#f4e4bc;font-weight:400}.profile-form{display:flex;flex-direction:column;gap:16px}.avatar-picker{display:flex;gap:8px;flex-wrap:wrap}.avatar-option{width:44px;height:44px;border-radius:8px;background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b50;font-size:24px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.avatar-option.selected{border-color:#d4af37;box-shadow:0 0 15px #d4af3766}.save-msg{font-size:14px;min-height:20px}.save-msg.success{color:#34d399}.save-msg.error{color:#fb7185}.page-admin{min-height:100vh}.admin-container{max-width:1200px;margin:0 auto;padding:40px}.admin-tabs{display:flex;gap:0;margin-bottom:24px;border-bottom:2px solid #b8860b50}.admin-tab{padding:12px 24px;background:transparent;border:none;color:#fde68a80;font-size:15px;font-weight:400;cursor:pointer;transition:all .2s;border-bottom:2px solid transparent;margin-bottom:-2px;font-family:Roboto Slab,serif}.admin-tab.active{color:#fb7185;border-bottom-color:#be123c}.admin-tab:hover{color:#f4e4bc}.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:40px}.admin-stat-card{background:linear-gradient(180deg,#5d4037,#3e2723);border:2px solid #b8860b80;border-radius:8px;padding:24px;text-align:center;box-shadow:inset 0 1px #ffffff26,inset 0 -1px #00000080,0 4px 12px #00000080}.admin-stat-card .stat-number{font-size:28px;font-weight:700;color:#fbbf24}.admin-stat-card .stat-name{font-size:11px;color:#fde68a80;text-transform:uppercase;letter-spacing:1px;margin-top:6px}.admin-section{margin-bottom:40px}.admin-section h3{font-family:Rye,serif;font-size:20px;margin-bottom:16px;color:#f4e4bc;font-weight:400}.admin-users-table{font-size:13px}.admin-users-table th,.admin-users-table td{padding:8px 12px}.actions-cell{white-space:nowrap}.user-banned{opacity:.5}.page-404{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}.page-404 h1{font-family:Rye,serif;font-size:96px;font-weight:400;color:#b8860b}.page-404 p{color:#fde68a80;font-size:20px}@media (max-width: 768px){.hero{flex-direction:column;text-align:center;padding:40px 20px}.hero-cube{width:200px;height:200px}.hero-title{font-size:48px}.hero-cta{justify-content:center}.nav-links{gap:12px}.nav-link{font-size:12px}.game-stats{gap:20px}.leaderboard-container,.profile-container,.admin-container{padding:20px}.profile-header{flex-direction:column;text-align:center}}