:root{--bg:#101216;--baseplate:#16191f;--panel:#1b1f26;--card:#232833;--card-hi:#2b3140;--line:#333a48;--ink:#e6eaf2;--ink-dim:#98a2b6;--ink-faint:#667089;--yellow:#f2c31c;--red:#d9453a;--blue:#8ecae6;--green:#8bd17c;--header-height:64px;--ad-min-width:160px;--ad-max-width:280px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--baseplate);color:var(--ink);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 8px 7px,#ffffff0b 3.1px,#0000 3.4px),radial-gradient(circle at 8px 9px,#0006 3.4px,#0000 3.7px);background-size:22px 22px;min-height:100vh;font:14px/1.6 ui-sans-serif,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}.skip-link{background:var(--yellow);color:#1a1405;z-index:1000;border-radius:0 0 8px;padding:8px 16px;font-weight:700;text-decoration:none;position:absolute;top:-40px;left:0}.skip-link:focus{top:0}.header{z-index:100;height:var(--header-height);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:#101216f2;justify-content:space-between;align-items:center;padding:0 24px;display:flex;position:sticky;top:0}.logo{align-items:center;gap:12px;text-decoration:none;display:flex}.logo-tank-svg{flex-shrink:0;width:48px;height:48px}.logo-text{flex-direction:column;margin:0;line-height:1;display:flex}.logo-title{letter-spacing:2px;color:var(--yellow);text-shadow:0 2px #8d7009,0 0 10px #f2c31c4d;font-size:20px;font-weight:900}.logo-subtitle{letter-spacing:4px;color:var(--ink);margin-top:2px;font-size:14px;font-weight:700}.auth-buttons{gap:12px;display:flex}.btn{font:inherit;cursor:pointer;border:none;border-radius:8px;padding:10px 20px;font-size:13px;font-weight:700;transition:transform .1s,box-shadow .1s;position:relative}.btn:active{transform:translateY(2px)}.btn-primary{color:#1a1405;background:linear-gradient(180deg, #ffd84a 0%, var(--yellow) 45%, #cfa30f 100%);box-shadow:inset 0 1px #ffffff8c,0 3px #8d7009,0 5px 10px #0006}.btn-primary:active{box-shadow:inset 0 1px #fff6,0 1px #8d7009,0 2px 5px #0006}.btn-secondary{color:var(--ink);background:linear-gradient(#4a5468 0%,#3a4254 45%,#2a3140 100%);box-shadow:inset 0 1px #fff3,0 3px #1a1d24,0 5px 10px #0006}.btn-secondary:active{box-shadow:inset 0 1px #ffffff26,0 1px #1a1d24,0 2px 5px #0006}.btn:before,.btn:after{content:"";pointer-events:none;background:linear-gradient(#ffffff80,#ffffff1a);border-radius:50% 50% 40% 40%;width:8px;height:4px;position:absolute;top:4px}.btn:before{left:20%}.btn:after{right:20%}.menu-toggle{color:var(--ink);cursor:pointer;background:0 0;border:none;padding:8px;font-size:24px;display:none}.main-content{height:calc(100vh - var(--header-height));justify-content:center;align-items:flex-start;gap:20px;min-height:500px;padding:16px 24px;display:flex}.ad-column{flex:0 0 var(--ad-max-width);width:var(--ad-max-width);flex-direction:column;gap:12px;padding-top:0;display:flex}.ad-column-left,.ad-column-right{align-self:flex-start}.ad-placeholder{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:2px dashed var(--line);text-align:center;color:var(--ink-faint);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:20px;font-size:12px;display:flex}.ad-placeholder-300x250{min-height:250px}.ad-placeholder-160x600{flex:1;min-height:600px}.ad-placeholder-icon{opacity:.5;font-size:32px}.ad-placeholder-size{font-size:10px}.highscore-btn{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:1px solid var(--line);cursor:pointer;text-align:left;border-radius:12px;width:100%;padding:12px 16px;transition:border-color .2s,transform .2s}.highscore-btn:hover{border-color:var(--yellow);transform:translateY(-2px)}.highscore-btn-inner{align-items:center;gap:10px;display:flex}.highscore-icon{font-size:24px}.highscore-text{text-align:left}.highscore-title{color:var(--yellow);font-size:13px;font-weight:700}.highscore-subtitle{color:var(--ink-dim);font-size:10px}.game-section{flex-direction:column;flex:auto;justify-content:center;align-items:center;min-width:0;height:100%;display:flex}.game-container{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:1px solid var(--line);border-radius:16px;justify-content:center;align-items:center;padding:12px;display:flex;position:relative;box-shadow:0 10px 40px #00000080}.game-container canvas{image-rendering:pixelated;cursor:pointer;border-radius:4px;display:block}.guidance-section{max-width:1200px;margin:0 auto;padding:48px 24px}.section-title{text-align:center;color:var(--yellow);text-shadow:0 2px #8d7009;margin-bottom:8px;font-size:28px;font-weight:800}.section-subtitle{text-align:center;color:var(--ink-dim);margin-bottom:32px}.guidance-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;display:grid}.card{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:1px solid var(--line);border-radius:12px;padding:20px;transition:border-color .2s,transform .2s}.card:hover{border-color:#4a5468;transform:translateY(-2px)}.card-header{align-items:center;gap:12px;margin-bottom:16px;display:flex}.card-icon{font-size:28px}.card-title{color:var(--ink);margin:0;font-size:16px;font-weight:700}.card-content{color:var(--ink-dim);font-size:13px;line-height:1.8}.card-content kbd{background:var(--bg);border:1px solid var(--line);color:var(--blue);border-radius:4px;padding:2px 8px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;display:inline-block}.card-content .item{align-items:center;gap:8px;margin-bottom:8px;display:flex}.card-content .item-icon{text-align:center;width:24px;font-size:16px}.card-content .points{color:var(--yellow);margin-left:auto;font-size:11px;font-weight:600}.card-content .tip{color:var(--ink-faint);margin-top:12px;font-size:11px}.qa-section{max-width:800px;margin:0 auto;padding:48px 24px}.qa-list{flex-direction:column;gap:12px;display:flex}.qa-item{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:1px solid var(--line);border-radius:12px;transition:border-color .2s;overflow:hidden}.qa-question{width:100%;color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;padding:16px 20px;font-size:14px;font-weight:600;display:flex}.qa-question:hover{color:var(--yellow)}.qa-arrow{color:var(--ink-faint);font-size:12px;transition:transform .3s}.qa-item.open .qa-arrow{transform:rotate(180deg)}.qa-answer{max-height:0;transition:max-height .3s ease-out;overflow:hidden}.qa-item.open .qa-answer{max-height:200px}.qa-answer-content{color:var(--ink-dim);padding:0 20px 16px;font-size:13px;line-height:1.7}.footer{border-top:1px solid var(--line);text-align:center;color:var(--ink-faint);padding:24px;font-size:12px}.footer a{color:var(--ink-dim);margin:0 8px;text-decoration:none}.footer a:hover{color:var(--yellow)}.footer-heart{color:var(--red)}.footer-links{margin-top:8px}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;background:#000000b3;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-overlay.open{display:flex}.modal{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:1px solid var(--line);text-align:center;border-radius:16px;max-width:400px;padding:32px}.modal-icon{margin-bottom:16px;font-size:48px}.modal-title{color:var(--yellow);margin-bottom:8px;font-size:20px;font-weight:700}.modal-text{color:var(--ink-dim);margin-bottom:24px;font-size:14px}@media (max-width:1399px){.ad-column{display:none}.main-content{padding:12px}}@media (max-width:1100px){.guidance-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:767px){.header{padding:0 16px}.auth-buttons{display:none}.menu-toggle{display:block}.logo-text{font-size:18px}.main-content{padding:16px}.game-container{border-radius:12px;padding:12px}.guidance-section,.qa-section{padding:32px 16px}.section-title{font-size:22px}.guidance-grid{grid-template-columns:1fr}.card{padding:16px}}@media (max-width:400px){.logo-icon{width:32px;height:32px}.logo-icon:before{width:10px;height:10px}.logo-text{font-size:16px}}.touch-controls{z-index:50;pointer-events:none;background:linear-gradient(#0000 0%,#101216f2 30%);padding:16px;display:none;position:fixed;bottom:0;left:0;right:0}.touch-controls-inner{pointer-events:auto;justify-content:space-between;align-items:flex-end;max-width:600px;margin:0 auto;display:flex}.dpad{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:4px;width:140px;height:140px;display:grid}.dpad-btn{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:2px solid var(--line);color:var(--ink);touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:8px;justify-content:center;align-items:center;font-size:20px;transition:background .1s,transform .1s;display:flex}.dpad-btn:active,.dpad-btn.active{background:linear-gradient(180deg, var(--yellow) 0%, #cfa30f 100%);border-color:var(--yellow);color:#1a1405;transform:scale(.95)}.dpad-btn.dpad-up{grid-area:1/2}.dpad-btn.dpad-left{grid-area:2/1}.dpad-btn.dpad-center{background:0 0;border:none;grid-area:2/2}.dpad-btn.dpad-right{grid-area:2/3}.dpad-btn.dpad-down{grid-area:3/2}.action-buttons{flex-direction:column;align-items:flex-end;gap:12px;display:flex}.action-btn{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:2px solid var(--line);width:80px;height:80px;color:var(--ink);touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;font-weight:700;transition:background .1s,transform .1s;display:flex}.action-btn:active,.action-btn.active{transform:scale(.95)}.action-btn.fire-btn{background:linear-gradient(180deg, #ff6b5b 0%, var(--red) 45%, #8b1f18 100%);border-color:var(--red);color:#fff;width:100px;height:100px;font-size:16px;box-shadow:0 4px #7a221b,0 6px 12px #0006}.action-btn.fire-btn:active,.action-btn.fire-btn.active{background:linear-gradient(#ff8577 0%,#f0685c 45%,#d9453a 100%);transform:translateY(2px)scale(.98);box-shadow:0 2px #7a221b,0 3px 6px #0006}.action-btn.pause-btn{width:56px;height:56px;font-size:12px}.action-btn.start-btn{background:linear-gradient(180deg, #5bff6b 0%, var(--green) 45%, #1b8b1f 100%);border-color:var(--green);color:#fff;border-radius:12px;width:70px;height:56px;font-size:12px;font-weight:700;box-shadow:0 4px #1a7a1b,0 6px 12px #0006}.action-btn.start-btn:active,.action-btn.start-btn.active{background:linear-gradient(#77ff85 0%,#5cf068 45%,#3ad945 100%);transform:translateY(2px)scale(.98);box-shadow:0 2px #1a7a1b,0 3px 6px #0006}@media (hover:none) and (pointer:coarse){.touch-controls{display:block}.main-content{height:calc(100vh - var(--header-height) - 180px);min-height:300px}}@media (max-width:768px){.touch-controls{display:block}.main-content{height:calc(100vh - var(--header-height) - 180px);min-height:300px}.dpad{width:120px;height:120px}.dpad-btn{font-size:16px}.action-btn.fire-btn{width:80px;height:80px;font-size:14px}.action-btn.pause-btn{width:48px;height:48px;font-size:10px}.action-btn.start-btn{width:60px;height:48px;font-size:10px}}@media (max-height:500px) and (orientation:landscape){.touch-controls{padding:8px}.dpad{width:100px;height:100px}.action-btn.fire-btn{width:70px;height:70px}.action-btn.pause-btn{width:40px;height:40px}.action-btn.start-btn{width:50px;height:40px;font-size:9px}.main-content{height:calc(100vh - var(--header-height) - 130px)}}.game-loading{background:var(--bg);z-index:10;flex-direction:column;justify-content:center;align-items:center;transition:opacity .3s ease-out;display:flex;position:absolute;inset:0}.game-loading.hidden{opacity:0;pointer-events:none}.loading-spinner{width:48px;height:48px;position:relative}.loading-spinner:before,.loading-spinner:after{content:"";border-radius:4px;position:absolute}.loading-spinner:before{background:linear-gradient(180deg, var(--red) 0%, #b22d1f 100%);border:2px solid #8b1f18;width:48px;height:32px;animation:.6s ease-in-out infinite brick-bounce}.loading-spinner:after{background:linear-gradient(180deg, #ff6b5b 0%, var(--red) 100%);width:12px;height:8px;box-shadow:20px 0 0 0 var(--red);border:1px solid #8b1f18;border-radius:2px;animation:.6s ease-in-out infinite brick-bounce;top:-8px;left:8px}@keyframes brick-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.loading-text{color:var(--muted);margin-top:24px;font-size:14px;font-weight:500}.loading-progress{background:var(--card);border-radius:3px;width:120px;height:6px;margin-top:12px;overflow:hidden}.loading-progress-bar{background:linear-gradient(90deg, var(--yellow), var(--green));border-radius:3px;width:0%;height:100%;transition:width .3s ease-out}.game-error{background:var(--bg);text-align:center;z-index:20;flex-direction:column;justify-content:center;align-items:center;padding:24px;display:none;position:absolute;inset:0}.game-error.visible{display:flex}.error-icon{margin-bottom:16px;font-size:48px}.error-title{color:var(--red);margin-bottom:8px;font-size:18px;font-weight:700}.error-message{color:var(--muted);max-width:300px;margin-bottom:20px;font-size:14px}.error-actions{gap:12px;display:flex}.skeleton{background:linear-gradient(90deg, var(--card) 25%, var(--card-hi) 50%, var(--card) 75%);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton-shimmer}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-text{border-radius:4px;height:16px;margin-bottom:8px}.skeleton-text.short{width:60%}.skeleton-title{border-radius:4px;width:80%;height:24px;margin-bottom:12px}.guidance-section,.qa-section,.footer{content-visibility:auto;contain-intrinsic-size:0 500px}.game-container{will-change:transform;contain:layout style paint}#game-canvas{will-change:contents}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.loading-spinner:before,.loading-spinner:after{animation:none}}@font-face{font-family:system-ui;font-display:swap}.header,.game-section,.game-container{contain:layout style}html{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}.lazy-image{background:var(--card);transition:opacity .3s}.lazy-image.loaded{background:0 0}.btn,.card,.modal,.qa-item,.dpad-btn,.action-btn{backface-visibility:hidden;transform:translateZ(0)}.btn,.dpad-btn,.action-btn,.qa-question,.nav-link,.header-btn{min-width:44px;min-height:44px}:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}:focus:not(:focus-visible){outline:none}@media print{.header,.touch-controls,.game-section,.modal-overlay{display:none!important}body{color:#000;background:#fff}.guidance-section,.qa-section{content-visibility:visible}}.user-menu{align-items:center;display:flex;position:relative}.user-menu-toggle{background:var(--card);border:1px solid var(--line);color:var(--ink);cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:8px 12px;font-size:14px;transition:background .2s,border-color .2s;display:flex}.user-menu-toggle:hover{background:var(--card-hi);border-color:var(--yellow)}.user-avatar{font-size:18px}.user-display-name{text-overflow:ellipsis;white-space:nowrap;max-width:120px;overflow:hidden}.user-menu-arrow{opacity:.6;font-size:10px;transition:transform .2s}.user-dropdown.open+.user-menu-toggle .user-menu-arrow,.user-menu-toggle:focus .user-menu-arrow{transform:rotate(180deg)}.user-dropdown{background:var(--card);border:1px solid var(--line);opacity:0;visibility:hidden;z-index:100;border-radius:12px;min-width:200px;margin-top:8px;transition:opacity .2s,visibility .2s,transform .2s;position:absolute;top:100%;right:0;transform:translateY(-10px);box-shadow:0 8px 24px #0006}.user-dropdown.open{opacity:1;visibility:visible;transform:translateY(0)}.user-dropdown-header{padding:12px 16px}.user-dropdown-name{color:var(--ink);font-weight:600;display:block}.user-dropdown-email{color:var(--ink-dim);margin-top:2px;font-size:12px;display:block}.user-dropdown-divider{background:var(--line);height:1px;margin:4px 0}.user-dropdown-item{width:100%;color:var(--ink);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:10px;padding:10px 16px;font-size:14px;transition:background .2s;display:flex}.user-dropdown-item:hover{background:var(--card-hi)}.user-dropdown-signout{color:var(--red)}.user-dropdown-signout:hover{background:#d9453a1a}.auth-modal-overlay{z-index:200;opacity:0;visibility:hidden;background:#000000b3;justify-content:center;align-items:center;padding:20px;transition:opacity .3s,visibility .3s;display:flex;position:fixed;inset:0}.auth-modal-overlay.open{opacity:1;visibility:visible}.auth-modal{background:var(--panel);border:1px solid var(--line);border-radius:16px;width:100%;max-width:400px;max-height:90vh;padding:32px;transition:transform .3s;position:relative;overflow-y:auto;transform:translateY(20px);box-shadow:0 16px 48px #00000080}.auth-modal-overlay.open .auth-modal{transform:translateY(0)}.auth-modal-close{background:var(--card);border:1px solid var(--line);width:32px;height:32px;color:var(--ink-dim);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:background .2s,color .2s;display:flex;position:absolute;top:16px;right:16px}.auth-modal-close:hover{background:var(--card-hi);color:var(--ink)}.auth-modal-icon{text-align:center;margin-bottom:16px;font-size:48px}.auth-modal-title{text-align:center;color:var(--ink);margin:0 0 8px;font-size:24px;font-weight:700}.auth-modal-desc{text-align:center;color:var(--ink-dim);margin:0 0 24px;font-size:14px}.auth-form{flex-direction:column;gap:16px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--ink);font-size:14px;font-weight:500}.form-group input{background:var(--card);border:2px solid var(--line);color:var(--ink);border-radius:8px;padding:12px 14px;font-size:16px;transition:border-color .2s,box-shadow .2s}.form-group input:focus{border-color:var(--yellow);outline:none;box-shadow:0 0 0 3px #f2c31c33}.form-group input::placeholder{color:var(--ink-faint)}.form-group input:disabled{opacity:.6;cursor:not-allowed}.form-hint{color:var(--ink-faint);font-size:12px}.form-error{color:var(--red);min-height:20px;font-size:14px}.form-success{color:var(--green);min-height:20px;font-size:14px}.btn-full{width:100%}.btn-google{border:2px solid var(--line);color:#333;cursor:pointer;background:#fff;border-radius:8px;justify-content:center;align-items:center;gap:10px;width:100%;padding:12px 16px;font-size:14px;font-weight:600;transition:background .2s,border-color .2s;display:flex}.btn-google:hover{background:#f5f5f5;border-color:#ddd}.btn-google:disabled{opacity:.6;cursor:not-allowed}.google-icon{flex-shrink:0}.auth-divider{align-items:center;margin:20px 0;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:var(--line);flex:1;height:1px}.auth-divider span{color:var(--ink-faint);text-transform:uppercase;padding:0 16px;font-size:12px}.auth-links{text-align:center;margin-top:16px}.auth-links a{color:var(--blue);font-size:14px;text-decoration:none}.auth-links a:hover{text-decoration:underline}.auth-switch{text-align:center;border-top:1px solid var(--line);color:var(--ink-dim);margin-top:20px;padding-top:20px;font-size:14px}.auth-switch a{color:var(--yellow);font-weight:600;text-decoration:none}.auth-switch a:hover{text-decoration:underline}.toast{background:var(--card);border:1px solid var(--line);color:var(--ink);opacity:0;z-index:300;border-radius:8px;padding:12px 24px;font-size:14px;font-weight:500;transition:transform .3s,opacity .3s;position:fixed;bottom:20px;left:50%;transform:translate(-50%)translateY(100px);box-shadow:0 8px 24px #0006}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.toast-success{border-color:var(--green);background:#8bd17c1a}.toast-error{border-color:var(--red);background:#d9453a1a}@media (max-width:768px){.auth-buttons,.user-menu{display:none}.menu-toggle{display:flex}.auth-modal{border-radius:12px;padding:24px}.auth-modal-title{font-size:20px}}@media (min-width:769px){.menu-toggle{display:none}.auth-buttons{gap:8px;display:flex}}.leaderboard-modal{flex-direction:column;width:95%;max-width:600px;max-height:85vh;display:flex}.leaderboard-filters{flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:16px;display:flex}.filter-btn{color:#e2e8f0;cursor:pointer;background:#2d3748;border:2px solid #4a5568;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:600;transition:all .2s}.filter-btn:hover{background:#3d4a5c;border-color:#718096}.filter-btn.active{color:#1a202c;background:linear-gradient(135deg,#f6ad55,#ed8936);border-color:#ed8936}.leaderboard-user-rank{text-align:center;color:#f6ad55;background:linear-gradient(135deg,#f6ad5533,#ed893633);border-radius:8px;margin-bottom:16px;padding:12px;font-size:16px}.leaderboard-user-rank strong{color:#ed8936;font-size:20px}.leaderboard-content{flex:1;min-height:200px;overflow-y:auto}.leaderboard-loading{color:#a0aec0;flex-direction:column;justify-content:center;align-items:center;padding:40px;display:flex}@keyframes spin{to{transform:rotate(360deg)}}.leaderboard-empty{text-align:center;color:#a0aec0;padding:40px;font-size:16px}.leaderboard-table{border-collapse:collapse;width:100%;font-size:14px}.leaderboard-table thead{z-index:1;background:#1a202c;position:sticky;top:0}.leaderboard-table th{text-align:left;color:#a0aec0;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid #4a5568;padding:12px 8px;font-size:12px;font-weight:600}.leaderboard-table td{border-bottom:1px solid #2d3748;padding:12px 8px}.leaderboard-table tbody tr.current-user{background:#f6ad5533}.leaderboard-table tbody tr.current-user:hover{background:#f6ad554d}.rank-cell{width:60px;font-size:16px;font-weight:700}.leaderboard-table tr.rank-1 .rank-cell,.leaderboard-table tr.rank-2 .rank-cell,.leaderboard-table tr.rank-3 .rank-cell{font-size:20px}.player-cell{text-overflow:ellipsis;white-space:nowrap;max-width:150px;overflow:hidden}.score-cell{color:#f6ad55;font-family:"Press Start 2P",monospace;font-size:12px;font-weight:700}.stage-cell{color:#68d391;font-weight:600}.leaderboard-pagination{border-top:1px solid #2d3748;justify-content:center;align-items:center;gap:16px;margin-top:16px;padding-top:16px;display:flex}.pagination-btn{color:#e2e8f0;cursor:pointer;background:#2d3748;border:2px solid #4a5568;border-radius:6px;padding:8px 16px;font-size:14px;transition:all .2s}.pagination-btn:hover:not(:disabled){background:#3d4a5c;border-color:#718096}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.pagination-info{color:#a0aec0;font-size:14px}@media (max-width:480px){.leaderboard-modal{padding:16px}.filter-btn{padding:6px 12px;font-size:12px}.leaderboard-table th,.leaderboard-table td{padding:8px 4px;font-size:12px}.score-cell{font-size:10px}.rank-cell{width:40px;font-size:14px}.leaderboard-table tr.rank-1 .rank-cell,.leaderboard-table tr.rank-2 .rank-cell,.leaderboard-table tr.rank-3 .rank-cell{font-size:16px}}.cookie-consent-banner{z-index:1000;background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border-top:1px solid var(--line);transition:transform .3s ease-out;position:fixed;bottom:0;left:0;right:0;transform:translateY(100%);box-shadow:0 -4px 20px #0006}.cookie-consent-banner.cookie-consent-visible{transform:translateY(0)}.cookie-consent-banner.cookie-consent-hidden{transform:translateY(100%)}.cookie-consent-content{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;max-width:1200px;margin:0 auto;padding:16px 24px;display:flex}.cookie-consent-text{flex:1;min-width:280px}.cookie-consent-text strong{color:var(--ink);font-size:16px}.cookie-consent-text p{color:var(--ink-dim);margin:6px 0 0;font-size:14px;line-height:1.5}.cookie-consent-link{color:var(--blue);text-decoration:none}.cookie-consent-link:hover{text-decoration:underline}.cookie-consent-actions{flex-shrink:0;gap:12px;display:flex}@media (max-width:600px){.cookie-consent-content{text-align:center;flex-direction:column}.cookie-consent-actions{justify-content:center;width:100%}.cookie-consent-actions .btn{flex:1;max-width:140px}}.intro-section{text-align:center;max-width:900px;margin:0 auto;padding:48px 24px}.intro-content{background:linear-gradient(180deg, var(--card-hi) 0%, var(--card) 100%);border:1px solid var(--line);border-radius:16px;padding:32px}.intro-content p{color:var(--ink-dim);text-align:left;margin-bottom:16px;font-size:16px;line-height:1.8}.intro-content p:last-of-type:not(.intro-links){margin-bottom:0}.intro-content strong{color:var(--yellow)}.intro-content em{color:var(--ink);font-style:italic}.intro-links{border-top:1px solid var(--line);padding-top:20px;text-align:center!important;margin-top:24px!important}.intro-links a{color:var(--blue);font-weight:600;text-decoration:none;transition:color .2s}.intro-links a:hover{color:var(--yellow);text-decoration:underline}@media (max-width:768px){.intro-section{padding:32px 16px}.intro-content{padding:24px}.intro-content p{font-size:14px}}.btn{transition:transform .1s,box-shadow .15s,background .2s}.btn:hover{transform:translateY(-1px)}.btn:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.btn-primary:hover{background:linear-gradient(#ffe066 0%,#f5cf3d 45%,#d9a50f 100%);box-shadow:inset 0 1px #fff9,0 4px #8d7009,0 8px 16px #00000073}.btn-secondary:hover{background:linear-gradient(#5a6478 0%,#4a5468 45%,#3a4354 100%);box-shadow:inset 0 1px #ffffff40,0 4px #1a1d24,0 8px 16px #00000073}.card{transition:border-color .25s,transform .25s,box-shadow .25s}.card:hover{border-color:var(--yellow);transform:translateY(-4px);box-shadow:0 8px 24px #0000004d}.card:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px #8ecae633}.game-container:focus-within{border-color:var(--yellow);box-shadow:0 10px 40px #f2c31c33,0 0 0 2px #f2c31c4d}.game-container canvas:focus{outline:none}a{transition:color .2s}.qa-item{transition:border-color .2s,transform .2s}.qa-item:hover{border-color:var(--yellow)}.qa-item:focus-within{border-color:var(--blue)}.qa-question{transition:color .2s,background .2s}.qa-question:hover{background:#ffffff05}.qa-arrow{transition:transform .3s cubic-bezier(.4,0,.2,1),color .2s}.qa-item:hover .qa-arrow{color:var(--yellow)}.highscore-btn{transition:border-color .2s,transform .25s,box-shadow .25s}.highscore-btn:hover{border-color:var(--yellow);transform:translateY(-3px);box-shadow:0 6px 20px #f2c31c33}.highscore-btn:active{transform:translateY(0)}.highscore-btn:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}.modal-overlay{transition:opacity .3s,visibility .3s}.modal{opacity:0;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .3s;transform:scale(.95)translateY(10px)}.modal-overlay.open .modal{opacity:1;transform:scale(1)translateY(0)}.auth-modal{transition:transform .3s cubic-bezier(.4,0,.2,1)}.auth-modal-close{transition:background .2s,color .2s,transform .2s}.auth-modal-close:hover{transform:scale(1.1)}.auth-modal-close:active{transform:scale(.95)}.form-group input{transition:border-color .2s,box-shadow .2s,background .2s}.form-group input:hover:not(:focus):not(:disabled){background:#ffffff05;border-color:#4a5468}.toast{transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .4s}.leaderboard-table tbody tr{transition:background .2s,transform .2s}.leaderboard-table tbody tr:hover{transform:translate(4px)}.card-content,.qa-answer-content{color:#a8b5c8}.filter-btn:focus-visible,.pagination-btn:focus-visible,.user-menu-toggle:focus-visible,.user-dropdown-item:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}.leaderboard-content{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.leaderboard-content::-webkit-scrollbar{width:6px}.leaderboard-content::-webkit-scrollbar-track{background:0 0}.leaderboard-content::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}.leaderboard-content::-webkit-scrollbar-thumb:hover{background:var(--ink-faint)}.game-loading{transition:opacity .4s}.loading-progress-bar{transition:width .3s cubic-bezier(.4,0,.2,1)}.header{transition:box-shadow .3s,background .3s}.header.scrolled{background:#101216fa;box-shadow:0 2px 12px #0006}.skip-link{transition:top .2s}.section-title{padding-bottom:12px;display:inline-block;position:relative}.guidance-section .section-title:after,.qa-section .section-title:after{content:"";background:linear-gradient(90deg, transparent, var(--yellow), transparent);border-radius:2px;width:60px;height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.ad-placeholder{transition:border-color .2s,opacity .2s}.ad-placeholder:hover{border-color:var(--ink-faint)}.intro-section .section-title{margin-bottom:24px}.intro-content{position:relative;overflow:hidden}.intro-content:before{content:"";background:linear-gradient(90deg, transparent, var(--yellow), transparent);opacity:.5;height:2px;position:absolute;top:0;left:0;right:0}.footer{transition:background .2s}.footer a{position:relative}.footer a:after{content:"";background:var(--yellow);width:0;height:1px;transition:width .2s;position:absolute;bottom:-2px;left:0}.footer a:hover:after{width:100%}.logo{transition:transform .2s}.logo:hover{transform:scale(1.02)}.logo:active{transform:scale(.98)}.logo-title{transition:text-shadow .2s}.logo:hover .logo-title{text-shadow:0 2px #8d7009,0 0 20px #f2c31c80}.user-menu-toggle{transition:background .2s,border-color .2s,transform .2s}.user-menu-toggle:active{transform:scale(.98)}.user-dropdown{transition:opacity .25s,visibility .25s,transform .25s cubic-bezier(.4,0,.2,1)}.user-dropdown-item{transition:background .15s,color .15s,padding-left .15s}.user-dropdown-item:hover{padding-left:20px}.dpad{position:relative}.dpad:after{content:"";background:linear-gradient(135deg, var(--card) 0%, #1a1f26 100%);border:2px solid var(--line);pointer-events:none;z-index:1;border-radius:50%;width:24px;height:24px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.dpad-btn{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;min-width:44px;min-height:44px;position:relative;overflow:hidden}.dpad-btn:after{content:"";opacity:0;pointer-events:none;background:radial-gradient(circle,#f2c31c66 0%,#0000 70%);width:100%;height:100%;transition:transform .3s ease-out,opacity .3s ease-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.dpad-btn:active:after,.dpad-btn.active:after{opacity:1;transition:transform .1s ease-out,opacity .1s ease-out;transform:translate(-50%,-50%)scale(1.5)}.dpad-btn:active,.dpad-btn.active{background:linear-gradient(180deg, #ffd84a 0%, var(--yellow) 100%);color:#1a1405;border-color:#d4a818;transform:scale(.92);box-shadow:inset 0 2px 4px #0003}.dpad-btn.dpad-up,.dpad-btn.dpad-down,.dpad-btn.dpad-left,.dpad-btn.dpad-right{text-shadow:0 1px 2px #0000004d;font-size:18px;font-weight:700}.action-buttons{position:relative}.action-btn{-webkit-tap-highlight-color:transparent;letter-spacing:1px;text-transform:uppercase;font-weight:800;position:relative;overflow:hidden}.action-btn.fire-btn{background:linear-gradient(#ff7b6b 0%,#e84637 45%,#c43226 100%);border:3px solid #ff9085;width:110px;height:110px;font-size:18px;animation:2s ease-in-out infinite fire-pulse;box-shadow:0 6px #8b1f18,0 8px 16px #00000080,inset 0 2px #fff3}@keyframes fire-pulse{0%,to{box-shadow:0 6px #8b1f18,0 8px 16px #00000080,inset 0 2px #fff3}50%{box-shadow:0 6px #8b1f18,0 8px 20px #d9453a99,inset 0 2px #fff3,0 0 15px #d9453a66}}.action-btn.fire-btn:active,.action-btn.fire-btn.active{background:linear-gradient(#ff9989 0%,#ff6657 45%,#e84637 100%);animation:none;transform:translateY(4px)scale(.95);box-shadow:0 2px #8b1f18,0 4px 8px #0006,inset 0 2px 4px #0003}.action-btn.start-btn{letter-spacing:.5px;background:linear-gradient(#7aff8a 0%,#4ade5b 45%,#2db83d 100%);border:2px solid #8bff9a;font-size:11px;box-shadow:0 4px #1a7a1b,0 6px 12px #0006,inset 0 1px #ffffff4d}.action-btn.start-btn:active,.action-btn.start-btn.active{transform:translateY(3px)scale(.96);box-shadow:0 1px #1a7a1b,0 2px 4px #0000004d,inset 0 2px 4px #00000026}.action-btn.pause-btn{background:linear-gradient(#5a6a7a 0%,#4a5a6a 45%,#3a4a5a 100%);border:2px solid #6a7a8a;font-size:16px;box-shadow:0 3px #2a3a4a,0 5px 10px #0006}.action-btn.pause-btn:active,.action-btn.pause-btn.active{background:linear-gradient(#6a7a8a 0%,#5a6a7a 45%,#4a5a6a 100%);transform:translateY(2px)scale(.96);box-shadow:0 1px #2a3a4a,0 2px 4px #0000004d}.touch-controls{padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));background:linear-gradient(#0000 0%,#101216b3 20%,#101216f2 50%,#101216fa 100%)}.touch-controls-inner{padding:0 16px}.dpad-btn.haptic-flash,.action-btn.haptic-flash{animation:.15s ease-out haptic-flash}@keyframes haptic-flash{0%{filter:brightness()}50%{filter:brightness(1.3)}to{filter:brightness()}}@media (max-height:500px) and (orientation:landscape){.touch-controls{padding:8px 16px calc(8px + env(safe-area-inset-bottom,0px))}.touch-controls-inner{gap:24px}.dpad{width:110px;height:110px}.dpad-btn{font-size:14px}.dpad:after{width:20px;height:20px}.action-btn.fire-btn{width:80px;height:80px;font-size:14px}.action-btn.pause-btn{width:44px;height:44px;font-size:12px}.action-btn.start-btn{width:56px;height:44px;font-size:9px}}@media (max-width:360px){.dpad{width:100px;height:100px}.dpad-btn{font-size:14px}.action-btn.fire-btn{width:70px;height:70px;font-size:12px}.action-btn.start-btn{width:52px;height:40px;font-size:8px}.action-btn.pause-btn{width:40px;height:40px;font-size:10px}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.dpad-btn,.action-btn{border-width:1.5px}}.game-playing .action-btn.fire-btn{animation:none}.touch-controls{transition:opacity .3s,transform .3s}.touch-controls.hidden{opacity:0;pointer-events:none;transform:translateY(20px)}.action-btn{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@supports (padding-bottom:env(safe-area-inset-bottom)){.touch-controls{padding-bottom:calc(16px + env(safe-area-inset-bottom))}@media (max-height:500px) and (orientation:landscape){.touch-controls{padding-left:calc(16px + env(safe-area-inset-left));padding-right:calc(16px + env(safe-area-inset-right))}}}.leaderboard-modal{animation:.35s cubic-bezier(.4,0,.2,1) modal-slide-in}@keyframes modal-slide-in{0%{opacity:0;transform:scale(.92)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.leaderboard-filters{background:#0003;border-radius:12px;margin-bottom:20px;padding:4px;position:relative}.filter-btn{z-index:1;color:var(--ink-dim);background:0 0;border:none;font-weight:600;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative}.filter-btn:hover:not(.active){color:var(--ink);background:#ffffff0d}.filter-btn.active{background:linear-gradient(135deg, var(--yellow), #d9a50f);color:#1a1405;border-radius:8px;transform:scale(1.02);box-shadow:0 2px 8px #f2c31c4d}.filter-btn:active{transform:scale(.98)}.leaderboard-user-rank{animation:2s ease-in-out infinite alternate rank-glow;position:relative;overflow:hidden}@keyframes rank-glow{0%{box-shadow:inset 0 0 20px #f6ad551a}to{box-shadow:inset 0 0 30px #f6ad5533}}.leaderboard-user-rank strong{animation:.5s ease-out rank-bounce;display:inline-block}@keyframes rank-bounce{0%{opacity:0;transform:scale(.5)}60%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.leaderboard-loading{min-height:200px}.leaderboard-loading .loading-spinner{border:4px solid var(--line);border-top-color:var(--yellow);border-radius:50%;width:48px;height:48px;animation:.8s linear infinite spin}.leaderboard-loading p{margin-top:16px;animation:1.5s ease-in-out infinite loading-pulse}@keyframes loading-pulse{0%,to{opacity:.5}50%{opacity:1}}.leaderboard-table tbody tr{animation:.3s ease-out backwards row-slide-in}.leaderboard-table tbody tr:first-child{animation-delay:50ms}.leaderboard-table tbody tr:nth-child(2){animation-delay:.1s}.leaderboard-table tbody tr:nth-child(3){animation-delay:.15s}.leaderboard-table tbody tr:nth-child(4){animation-delay:.2s}.leaderboard-table tbody tr:nth-child(5){animation-delay:.25s}.leaderboard-table tbody tr:nth-child(6){animation-delay:.3s}.leaderboard-table tbody tr:nth-child(7){animation-delay:.35s}.leaderboard-table tbody tr:nth-child(8){animation-delay:.4s}.leaderboard-table tbody tr:nth-child(9){animation-delay:.45s}.leaderboard-table tbody tr:nth-child(10){animation-delay:.5s}@keyframes row-slide-in{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.leaderboard-table tbody tr{transition:background .2s,transform .2s;position:relative}.leaderboard-table tbody tr:before{content:"";background:var(--yellow);width:3px;transition:transform .2s;position:absolute;top:0;bottom:0;left:0;transform:scaleY(0)}.leaderboard-table tbody tr:hover:before{transform:scaleY(1)}.leaderboard-table tbody tr:hover{background:#f2c31c14}.leaderboard-table tbody tr.current-user{background:linear-gradient(90deg,#f6ad5526 0%,#f6ad5514 50%,#f6ad5526 100%) 0 0/200% 100%;animation:3s ease-in-out infinite current-user-shimmer}@keyframes current-user-shimmer{0%,to{background-position:0%}50%{background-position:100%}}.leaderboard-table tbody tr.current-user:before{background:linear-gradient(180deg, var(--yellow), #d9a50f);transform:scaleY(1)}.rank-cell{position:relative}.leaderboard-table tr.rank-1 .rank-cell,.leaderboard-table tr.rank-2 .rank-cell,.leaderboard-table tr.rank-3 .rank-cell{animation:2s ease-in-out infinite medal-shine}@keyframes medal-shine{0%,to{filter:brightness()}50%{filter:brightness(1.2)}}.leaderboard-table tr.rank-1{background:linear-gradient(90deg,#ffd7001a 0%,#0000 50%,#ffd7001a 100%)}.score-cell{font-variant-numeric:tabular-nums;transition:transform .2s,color .2s}.leaderboard-table tbody tr:hover .score-cell{color:#ffc078;transform:scale(1.05)}.stage-cell{position:relative}.stage-cell:before{content:"Stage ";color:var(--ink-faint);font-size:10px;font-weight:400}.leaderboard-pagination{margin-top:20px}.pagination-btn{transition:all .2s;position:relative;overflow:hidden}.pagination-btn:after{content:"";background:#ffffff1a;border-radius:50%;width:0;height:0;transition:width .3s,height .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pagination-btn:hover:not(:disabled):after{width:100%;height:100%}.pagination-btn:active:not(:disabled){transform:scale(.95)}.pagination-info{font-variant-numeric:tabular-nums;text-align:center;min-width:100px}.leaderboard-empty{flex-direction:column;align-items:center;gap:12px;display:flex}.leaderboard-empty:before{content:"🏆";opacity:.5;font-size:48px;animation:2s ease-in-out infinite trophy-float}@keyframes trophy-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.leaderboard-modal .modal-close,.modal-close{justify-content:center;align-items:center;width:36px;height:36px;font-size:24px;transition:all .2s;display:flex}.leaderboard-modal .modal-close:hover,.modal-close:hover{background:var(--red);border-color:var(--red);color:#fff;transform:rotate(90deg)}.leaderboard-modal .modal-title{background:linear-gradient(135deg, var(--yellow), #ffd84a);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;font-size:22px}@media (max-width:480px){.leaderboard-modal{max-height:calc(100vh - 16px);margin:8px;padding:16px}.leaderboard-filters{gap:4px}.filter-btn{padding:6px 10px;font-size:11px}.stage-cell:before{content:"S"}.leaderboard-table tbody tr:hover{transform:none}}@media (prefers-reduced-motion:reduce){.leaderboard-modal,.leaderboard-table tbody tr,.leaderboard-user-rank strong,.rank-cell,.leaderboard-empty:before,.modal-close:hover{animation:none}.leaderboard-table tbody tr.current-user{background:#f6ad5526;animation:none}}