nav a.active{color:#f5c547}.game-main{min-height:100vh}.game-hero{padding:94px 4vw 34px;text-align:center;background:radial-gradient(circle at 50% 8%,#f5c5471f,transparent 38%)}.game-hero h1{margin:15px 0 10px;font-size:clamp(42px,7vw,80px)}.game-hero p{max-width:760px;margin:auto;color:#aeb8c5;font-size:17px}.game-layout{max-width:1320px;margin:auto;padding:18px 22px 70px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px}.game-panel,.ranking-panel{border:1px solid #ffffff18;border-radius:18px;background:#0b1018;box-shadow:0 24px 60px #0007}.game-panel{padding:14px}.game-toolbar{height:58px;display:flex;align-items:center;gap:25px;padding:0 6px 12px}.game-toolbar>div span{display:block;color:#7f8b99;font-size:10px;font-weight:900;letter-spacing:1.3px}.game-toolbar strong{font-size:20px;color:#fff}.game-toolbar button{margin-left:auto;width:40px;height:40px;border:1px solid #ffffff18;border-radius:10px;background:#111923;color:#fff}.game-shell{position:relative;overflow:hidden;aspect-ratio:3 / 2;border:1px solid #f5c54733;border-radius:14px;background:#05080d;touch-action:none}#gameCanvas{display:block;width:100%;height:100%}.game-overlay{position:absolute;inset:0;display:grid;place-items:center;padding:20px;background:#020407b8;backdrop-filter:blur(4px)}.game-overlay[hidden]{display:none}.overlay-card{width:min(430px,100%);padding:28px;border:1px solid #ffffff20;border-radius:18px;background:#0b111beF;text-align:center}.tank-mark{width:88px;height:66px;margin:0 auto 18px;position:relative;border:3px solid #f5c547;border-radius:15px 15px 11px 11px;color:#f5c547;box-shadow:0 0 28px #f5c54733}.tank-mark:before{content:"";position:absolute;left:34px;top:-17px;width:18px;height:18px;border:3px solid #f5c547;border-bottom:0;border-radius:7px 7px 0 0}.tank-mark:after{content:"";position:absolute;left:41px;top:-33px;width:5px;height:22px;background:#f5c547}.tank-mark span{display:grid;place-items:center;height:100%;font-weight:1000;font-size:17px}.overlay-card h2{margin:0 0 8px;font-size:29px}.overlay-card p{margin:0 0 18px;color:#aab4c2;line-height:1.6}.overlay-card label{display:block;margin:0 0 8px;text-align:left;color:#dce2ea;font-size:12px;font-weight:900}.overlay-card input{width:100%;height:50px;padding:0 14px;border:1px solid #ffffff20;border-radius:10px;background:#111923;color:#fff;font:inherit;text-align:center;font-weight:900}.overlay-card>button,.result-actions button{height:50px;border:0;border-radius:10px;background:#f5c547;color:#111;font-weight:1000;font:inherit;cursor:pointer}.overlay-card>button{width:100%;margin-top:11px}.overlay-card small{display:block;margin-top:13px;color:#7f8a98;line-height:1.5}.result-label{display:block;color:#8e99a8;font-size:12px;font-weight:900;letter-spacing:1.4px}.result-card>strong{display:block;margin:8px 0;color:#f5c547;font-size:56px}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.result-actions .secondary{background:#1b2430;color:#fff;border:1px solid #ffffff1b}.mobile-pad{display:none;margin-top:12px;text-align:center}.mobile-pad button{width:62px;height:48px;margin:3px;border:1px solid #ffffff20;border-radius:12px;background:#141d28;color:#fff;font-size:17px;touch-action:none}.ranking-panel{padding:20px;align-self:start;position:sticky;top:84px}.ranking-head{display:flex;justify-content:space-between;align-items:center}.ranking-head span{color:#f5c547;font-size:11px;font-weight:1000;letter-spacing:1.4px}.ranking-head h2{margin:4px 0 0;font-size:25px}.ranking-head button{width:40px;height:40px;border:1px solid #ffffff18;border-radius:10px;background:#111923;color:#fff;font-size:20px}.month-chip{display:inline-flex;margin:16px 0 12px;padding:7px 10px;border:1px solid #f5c5473c;border-radius:999px;background:#f5c54710;color:#f5c547;font-size:11px;font-weight:900}.ranking-status{padding:16px;color:#8793a2;text-align:center}.ranking-list{list-style:none;margin:0;padding:0;display:grid;gap:7px}.ranking-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;border:1px solid #ffffff10;border-radius:11px;background:#101721}.ranking-row.top-1{border-color:#f5c54788;background:#f5c54712}.ranking-row.top-2{border-color:#c8d0dc66}.ranking-row.top-3{border-color:#d48a5266}.rank-place{font-weight:1000;text-align:center}.rank-medal{font-size:23px}.rank-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:900}.rank-score{color:#f5c547;font-weight:1000}.ranking-note{margin:14px 2px 0;color:#788493;font-size:11px;line-height:1.5}.rtl .overlay-card label{text-align:right}.rtl .ranking-row{direction:rtl}@media(max-width:980px){.game-layout{grid-template-columns:1fr}.ranking-panel{position:static}.mobile-pad{display:block}}@media(max-width:620px){.game-hero{padding:72px 14px 26px}.game-hero h1{font-size:38px}.game-layout{padding:10px 8px 52px}.game-panel{padding:8px}.game-toolbar{height:52px;gap:16px}.game-shell{border-radius:10px}.overlay-card{padding:20px 17px}.overlay-card h2{font-size:24px}.tank-mark{transform:scale(.88);margin-bottom:10px}.result-card>strong{font-size:45px}.ranking-panel{padding:15px}.mobile-pad button{width:58px;height:46px}}

/* v42 mini-game library */
.game-library{width:min(1180px,calc(100% - 32px));margin:0 auto 24px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.game-choice{min-height:150px;padding:18px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:linear-gradient(145deg,rgba(16,22,33,.96),rgba(6,9,14,.94));display:flex;gap:14px;position:relative;overflow:hidden}
.game-choice-icon{font-size:26px;line-height:1}
.game-choice span{display:block;color:#8c98aa;font-size:10px;font-weight:800;letter-spacing:.14em;margin-bottom:7px}
.game-choice h2{margin:0 0 7px;font-size:17px;color:#fff}
.game-choice p{margin:0;color:#8490a1;font-size:12px;line-height:1.5}
.game-choice a{position:absolute;right:14px;bottom:14px;padding:7px 12px;border-radius:8px;background:#d8a928;color:#090b0f;font-size:11px;font-weight:900;text-decoration:none}
.active-game{border-color:rgba(216,169,40,.62);box-shadow:0 0 24px rgba(216,169,40,.08)}
.locked-game{opacity:.48;filter:saturate(.65)}
@media(max-width:900px){.game-library{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.game-library{width:min(100% - 20px,1180px);grid-template-columns:1fr 1fr;gap:8px}.game-choice{min-height:128px;padding:13px;gap:9px}.game-choice-icon{font-size:20px}.game-choice h2{font-size:13px}.game-choice p{display:none}.game-choice a{right:10px;bottom:10px}}

.ranking-panel.ranking-focus{animation:rankingPanelFocus 1.35s ease}.ranking-row.current-player{position:relative;border-color:#f5c547!important;background:#f5c54720!important;box-shadow:0 0 0 2px #f5c54755,0 0 24px #f5c54720;animation:currentPlayerFocus 1.1s ease 2}.ranking-row.current-player:after{content:'★';position:absolute;right:8px;top:4px;color:#f5c547;font-size:10px}@keyframes rankingPanelFocus{0%,100%{box-shadow:0 24px 60px #0007}35%{border-color:#f5c547;box-shadow:0 0 0 3px #f5c54740,0 24px 60px #0007}}@keyframes currentPlayerFocus{0%,100%{transform:translateX(0)}50%{transform:translateX(-3px)}}.rtl .ranking-row.current-player:after{right:auto;left:8px}@media(prefers-reduced-motion:reduce){.ranking-panel.ranking-focus,.ranking-row.current-player{animation:none}}

/* v47 ranking-to-replay flow */
.post-ranking-overlay{background:#020407a8}
.post-ranking-card{width:min(340px,100%);padding:24px}
.ranking-check-icon{display:grid;place-items:center;width:42px;height:42px;margin:0 auto 12px;border:1px solid #f5c54788;border-radius:50%;background:#f5c54714;color:#f5c547;font-size:23px;font-weight:1000}
.post-ranking-card p{margin:0 0 15px;color:#dce2ea;font-weight:900}
.post-ranking-card>button{margin-top:0}
.game-choice.drone-game{border-color:rgba(126,217,255,.38)}
.game-choice.drone-game .game-choice-icon{filter:drop-shadow(0 0 12px rgba(126,217,255,.35))}

/* v55 — mobile-only start/result overlay usability fix */
@media(max-width:620px){
  .game-shell{
    aspect-ratio:auto;
    min-height:650px;
    overflow:hidden;
    touch-action:pan-y;
  }
  #gameCanvas{
    touch-action:none;
  }
  .game-overlay{
    place-items:start center;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:18px 12px calc(22px + env(safe-area-inset-bottom));
    touch-action:pan-y;
  }
  .overlay-card{
    width:100%;
    max-width:430px;
    margin:auto 0;
    padding:22px 18px 20px;
    max-height:none;
    pointer-events:auto;
    touch-action:pan-y;
  }
  .overlay-card h2{font-size:26px;line-height:1.28;margin-bottom:8px}
  .overlay-card p{font-size:15px;line-height:1.55;margin-bottom:16px}
  .overlay-card label{font-size:13px;margin-bottom:7px}
  .overlay-card input{
    height:52px;
    min-height:52px;
    font-size:16px;
    pointer-events:auto;
    touch-action:manipulation;
  }
  .overlay-card>button,.result-actions button{
    min-height:52px;
    font-size:16px;
    pointer-events:auto;
    touch-action:manipulation;
  }
  .overlay-card small{font-size:12px;line-height:1.45;margin-top:11px}
  .tank-mark{transform:scale(.78);margin-bottom:4px}
}


/* v56 — mobile square playfield and page-scroll recovery */
@media(max-width:620px){
  .game-layout{padding:8px 8px 44px}
  .game-panel{padding:8px}
  .game-toolbar{height:auto;min-height:64px;padding:7px 5px 10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) auto;gap:8px 12px}
  .game-toolbar>div{min-width:0}
  .game-toolbar button{grid-column:3;grid-row:1 / span 2;margin:0;align-self:center}
  .game-shell{
    width:100%;
    height:auto;
    min-height:0;
    max-height:none;
    aspect-ratio:1 / 1;
    overflow:hidden;
    border-radius:10px;
    touch-action:pan-y pinch-zoom;
    overscroll-behavior:auto;
  }
  #gameCanvas{
    width:100%;
    height:100%;
    touch-action:pan-y pinch-zoom;
  }
  .mobile-pad{margin:10px 0 2px;touch-action:pan-y}
  .mobile-pad button{width:58px;height:46px;touch-action:manipulation}
  .game-overlay{overflow-y:auto;touch-action:pan-y;overscroll-behavior:auto}
  .overlay-card{margin:auto 0;touch-action:pan-y}
}


/* v57 — mobile instructions moved outside the playfield */
.mobile-game-info{display:none}
@media(max-width:620px){
  .game-library{margin-bottom:0}
  .mobile-game-info{
    display:block;
    margin:18px 0 16px;
    padding:18px 16px;
    border:1px solid rgba(126,217,255,.22);
    border-radius:16px;
    background:rgba(13,19,29,.82);
    text-align:center;
  }
  .mobile-game-info h2{margin:0 0 8px;font-size:20px;line-height:1.3;color:#fff}
  .mobile-game-info p{margin:0;color:#aab4c2;font-size:14px;line-height:1.55}
  .mobile-game-info small{display:block;margin-top:10px;color:#7f8a98;font-size:12px;line-height:1.45}
  #startOverlay .overlay-card{
    width:calc(100% - 24px);
    max-width:390px;
    margin:auto;
    padding:20px 16px 18px;
  }
  #startOverlay .tank-mark,
  #startOverlay .target-mark,
  #startOverlay h2,
  #startOverlay p,
  #startOverlay small{display:none!important}
  #startOverlay .overlay-card label{margin:0 0 8px;font-size:13px}
  #startOverlay .overlay-card input{height:50px;min-height:50px}
  #startOverlay .overlay-card>button{height:50px;min-height:50px;margin-top:10px}
}


/* v72 — mobile page scroll outside active gameplay */
@media(max-width:620px){
  .game-shell,#gameCanvas{touch-action:pan-y pinch-zoom;overscroll-behavior:auto}
  .game-shell.is-playing,#gameShell.is-playing #gameCanvas{touch-action:none;overscroll-behavior:contain}
}
