/* Archers Duel 3D - styles | Developer: MD Shunam Al Anam */
:root{--ink:#1b1230;--panel:#2f1f55;--gold:#ffc83d;--ember:#ff5a4e;--mint:#5ef2c0;--text:#fff4e0;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:border-box}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--ink);color:var(--text);font-family:Nunito,system-ui,sans-serif;overflow:hidden;color-scheme:dark;touch-action:none}
#root{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
#stage{position:relative;width:min(100vw,177.78vh);aspect-ratio:16/9;container-type:size;background:#000}
canvas{width:100%;height:100%;display:block}#gl,#c{position:absolute;inset:0}#gl{pointer-events:none}
.scr{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:1.4cqw;background:rgba(20,10,40,.62);text-align:center;font-size:2cqw}
.scr.on{display:flex}
h1,h2{font-family:Bungee,Impact,sans-serif;margin:0;font-weight:400;letter-spacing:.2cqw;background:linear-gradient(#fff0a8 0%,#ffc83d 45%,#ff8a2a 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;-webkit-text-stroke:.3cqw #2a1448;paint-order:stroke fill;filter:drop-shadow(.25cqw .3cqw 0 #5a2a78) drop-shadow(.25cqw .3cqw 0 #3a1c5c) drop-shadow(.25cqw .3cqw 0 #1b1230) drop-shadow(0 .8cqw 1.2cqw rgba(0,0,0,.6)) drop-shadow(0 0 1.4cqw rgba(255,200,61,.35))}
h1{font-size:7cqw;line-height:1.05}h2{font-size:4.6cqw}
p{margin:0}
.row{display:flex;gap:1.2cqw;flex-wrap:wrap;justify-content:center;max-width:94%}
.btn{font:inherit;font-weight:800;font-size:2.1cqw;padding:.8cqw 2.4cqw;border:0;border-radius:1cqw;background:var(--gold);color:var(--ink);cursor:pointer;box-shadow:0 .45cqw 0 #b98400}
.btn:active{transform:translateY(.3cqw)}
.btn.alt{background:var(--panel);color:var(--text);box-shadow:0 .45cqw 0 #120a24}
.btn:disabled{opacity:.4;cursor:default}
.btn:focus-visible{outline:.3cqw solid var(--mint);outline-offset:.3cqw}
.btn.sel{outline:.3cqw solid var(--gold)}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1cqw;width:84%}
.card{background:var(--panel);border-radius:1cqw;padding:.8cqw 1.2cqw;display:flex;justify-content:space-between;align-items:center;font-size:1.8cqw;text-align:left}
.card .btn{font-size:1.6cqw;padding:.5cqw 1.4cqw}
#wpn{position:absolute;bottom:1.2cqw;left:50%;transform:translateX(-50%);display:none;gap:1cqw}
#wpn .btn{font-size:2.1cqw;padding:.6cqw 1.5cqw;background:rgba(18,10,36,.92);color:#fff;border:.2cqw solid rgba(255,244,224,.55);text-shadow:0 .1cqw .3cqw #000;box-shadow:0 .4cqw 0 #000}#wpn .btn.sel{background:var(--gold);color:var(--ink);text-shadow:none;border-color:#fff}#wpn .btn:disabled{opacity:.7;color:#b9aed6}
#quit{position:absolute;bottom:1.4cqw;left:1.4cqw;display:none;font-size:1.9cqw;padding:.7cqw 1.7cqw;border-radius:5cqw;background:rgba(255,255,255,.14);color:#fff;border:.15cqw solid rgba(255,255,255,.4);backdrop-filter:blur(6px);box-shadow:none}
.credit{position:absolute;bottom:1cqw;font-size:1.5cqw;opacity:.8}#maps{background:rgba(20,10,40,.3)}#rot{display:none;position:fixed;left:0;right:0;bottom:0;padding:10px;background:#ffc83d;color:#1b1230;text-align:center;font-weight:800;z-index:9}@media (orientation:portrait) and (max-width:700px){#rot{display:block}}.mapc{min-height:9cqw;font-size:2cqw}
.coin{color:var(--gold);font-weight:800}
#menu .btn{font-size:1.9cqw;padding:.7cqw 1.9cqw}
#arenas .btn:disabled{opacity:1;background:#3b2d63;color:#d9cff2;box-shadow:0 .45cqw 0 #120a24}
.btn.alt{border:.15cqw solid rgba(255,255,255,.2)}