:root{
  --bg:#0d1410;
  --olive:#8a9a5b;
  --green:#6cd35f;
  --green-glow:#7dff6f;
  --amber:#e0c040;
  --red:#e04040;
  --gold:#f1c40f;
  --ink:#eef3e8;
  --sand:#c2a875;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;overflow:hidden;background:var(--bg);font-family:'Oswald',sans-serif;color:var(--ink);}
#scene-container{position:fixed;inset:0;}
canvas{display:block;}
.hidden{display:none !important;}
.dim{opacity:.5;}

/* ---------- Screens ---------- */
.screen{
  position:fixed;inset:0;z-index:20;
  display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(circle at 50% 25%, rgba(108,211,95,.10), transparent 55%),
    radial-gradient(circle at 80% 90%, rgba(224,192,64,.06), transparent 50%),
    linear-gradient(160deg,#0a0f0b 0%,#161d10 55%,#0a0f0b 100%);
  overflow-y:auto;
}
.menu-inner{text-align:center;padding:24px;max-width:520px;width:100%;
  animation:rise .5s ease both;}
.menu-inner.wide{max-width:760px;}
@keyframes rise{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:none;}}

.title{
  font-size:clamp(46px,10vw,88px);font-weight:700;letter-spacing:.14em;line-height:.95;
  color:var(--ink);text-shadow:0 0 24px rgba(108,211,95,.35);
}
.title.small{font-size:clamp(34px,7vw,54px);}
.title.win{color:var(--green);text-shadow:0 0 30px rgba(108,211,95,.6);}
.title.lose{color:var(--red);text-shadow:0 0 30px rgba(224,64,64,.5);}

.target-badge{
  display:inline-block;margin:14px 0 6px;font-family:'Share Tech Mono',monospace;
  font-size:clamp(18px,4.5vw,28px);letter-spacing:.2em;color:var(--green);
  border:2px solid var(--olive);padding:4px 18px;border-radius:4px;
  background:rgba(108,211,95,.06);
}
.subtitle{font-size:13px;letter-spacing:.26em;font-weight:300;opacity:.6;margin-bottom:22px;}

/* mode buttons */
.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:8px auto 20px;max-width:460px;}
.mode-btn{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  background:linear-gradient(160deg,rgba(138,154,91,.12),rgba(20,26,16,.4));
  border:1px solid #33402a;border-radius:12px;padding:20px 12px;cursor:pointer;
  color:var(--ink);transition:.18s;
}
.mode-btn:hover{border-color:var(--green);transform:translateY(-3px);box-shadow:0 8px 24px rgba(108,211,95,.18);}
.mode-ico{font-size:34px;filter:drop-shadow(0 0 8px rgba(108,211,95,.4));}
.mode-title{font-weight:700;letter-spacing:.14em;font-size:16px;color:var(--green);}
.mode-sub{font-size:11px;opacity:.55;letter-spacing:.05em;}

.option-row{display:flex;align-items:center;justify-content:space-between;
  margin:10px auto;max-width:420px;gap:14px;}
.label{font-size:13px;letter-spacing:.24em;font-weight:500;opacity:.75;}
.seg{display:flex;border:1px solid #33402a;border-radius:6px;overflow:hidden;flex-wrap:wrap;}
.seg button{
  background:transparent;color:var(--ink);border:none;cursor:pointer;
  font-family:'Share Tech Mono',monospace;font-size:12px;letter-spacing:.1em;
  padding:9px 14px;transition:.15s;opacity:.55;
}
.seg button:hover{opacity:.9;}
.seg button.active{background:var(--olive);color:#141a10;opacity:1;font-weight:bold;}

.play-btn{
  margin:20px auto 8px;display:block;width:100%;max-width:420px;
  background:var(--green);color:#0a1408;border:none;cursor:pointer;
  font-family:'Oswald',sans-serif;font-weight:700;font-size:22px;letter-spacing:.18em;
  padding:16px;border-radius:8px;transition:.18s;
}
.play-btn:hover{background:var(--green-glow);box-shadow:0 0 30px rgba(124,255,111,.5);transform:translateY(-2px);}
.ghost-btn{
  margin:10px auto;display:block;width:100%;max-width:420px;
  background:transparent;color:var(--ink);border:1px solid #33402a;cursor:pointer;
  font-family:'Oswald',sans-serif;font-size:15px;letter-spacing:.2em;padding:11px;border-radius:8px;transition:.15s;
}
.ghost-btn:hover{border-color:var(--olive);background:rgba(138,154,91,.1);}
.mini-btn{background:var(--green);color:#0a1408;border:none;cursor:pointer;font-weight:700;
  letter-spacing:.1em;padding:9px 16px;border-radius:6px;font-family:'Oswald',sans-serif;}

.best{font-family:'Share Tech Mono',monospace;font-size:14px;letter-spacing:.15em;color:var(--amber);margin:6px 0;}

.controls-legend{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px 16px;margin:20px auto 0;max-width:420px;
  font-family:'Share Tech Mono',monospace;font-size:11px;opacity:.6;letter-spacing:.05em;
}
.controls-legend b{color:var(--green);}
.mobile-note{display:none;margin-top:16px;font-size:12px;letter-spacing:.1em;color:var(--amber);opacity:.85;}

/* ---------- Map grid ---------- */
.map-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin:20px 0;}
.map-card{
  border:1px solid #33402a;border-radius:12px;overflow:hidden;cursor:pointer;transition:.18s;
  background:#12180f;text-align:left;position:relative;
}
.map-card:hover{border-color:var(--green);transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.5);}
.map-card .thumb{height:120px;background-size:cover;background-position:center;position:relative;}
.map-card .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(10,15,11,.9));}
.map-card .info{padding:10px 14px;}
.map-card .mname{font-weight:700;letter-spacing:.12em;font-size:16px;color:var(--sand);}
.map-card .mdesc{font-size:11px;opacity:.5;font-family:'Share Tech Mono',monospace;margin-top:2px;}
.map-card .featured{position:absolute;top:8px;right:8px;background:var(--gold);color:#1a1400;
  font-size:10px;font-weight:bold;letter-spacing:.1em;padding:3px 8px;border-radius:4px;z-index:2;}

/* ---------- Forms ---------- */
.form{text-align:left;max-width:420px;margin:14px auto;display:flex;flex-direction:column;gap:14px;}
.form label{font-size:12px;letter-spacing:.16em;opacity:.8;display:flex;flex-direction:column;gap:6px;}
.form label span{color:var(--green);}
.form input[type=text]{background:#0c110a;border:1px solid #33402a;color:var(--ink);
  padding:10px;border-radius:6px;font-family:'Share Tech Mono',monospace;font-size:14px;}
.form input[type=text]:focus{outline:none;border-color:var(--green);}
.form input[type=range]{width:100%;accent-color:var(--green);}
.check-label{flex-direction:row !important;align-items:center;gap:10px;cursor:pointer;}
.check-label input{accent-color:var(--green);width:18px;height:18px;}
.row-label .map-seg{margin-top:2px;}

/* ---------- Server browser ---------- */
.server-list{display:flex;flex-direction:column;gap:8px;margin:16px 0;max-height:46vh;overflow-y:auto;}
.server-row{
  display:grid;grid-template-columns:1fr auto auto auto;gap:12px;align-items:center;
  background:#12180f;border:1px solid #2a3520;border-radius:8px;padding:12px 16px;transition:.15s;
}
.server-row:hover{border-color:var(--green);}
.server-row .sname{font-weight:700;letter-spacing:.06em;text-align:left;}
.server-row .smap{font-family:'Share Tech Mono',monospace;font-size:12px;opacity:.6;}
.server-row .splayers{font-family:'Share Tech Mono',monospace;font-size:13px;color:var(--amber);}
.server-row button{background:var(--green);color:#0a1408;border:none;cursor:pointer;
  font-weight:700;padding:8px 16px;border-radius:6px;letter-spacing:.1em;font-family:'Oswald',sans-serif;}
.empty-note{opacity:.5;font-family:'Share Tech Mono',monospace;font-size:13px;padding:20px;}
.join-name-row{display:flex;gap:8px;margin:12px 0;flex-wrap:wrap;}
.join-name-row input{flex:1;min-width:120px;background:#0c110a;border:1px solid #33402a;color:var(--ink);
  padding:9px;border-radius:6px;font-family:'Share Tech Mono',monospace;font-size:13px;}

.stats{margin:18px auto;max-width:340px;font-family:'Share Tech Mono',monospace;}
.stats div{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:15px;}
.stats span{opacity:.6;letter-spacing:.1em;}
.stats b{color:var(--green);}
.big-win{border:none;justify-content:center !important;color:var(--amber) !important;font-size:18px;font-family:'Oswald',sans-serif;letter-spacing:.1em;margin-bottom:8px;}

.foot{margin-top:22px;font-size:11px;letter-spacing:.2em;opacity:.45;font-family:'Share Tech Mono',monospace;text-align:center;}
.foot a{color:var(--olive);text-decoration:none;}
.foot a:hover{color:var(--green);}

/* ---------- HUD ---------- */
#hud{position:fixed;inset:0;z-index:15;pointer-events:none;user-select:none;}

#progressWrap{position:absolute;top:16px;left:50%;transform:translateX(-50%);text-align:center;width:min(60%,420px);}
#progressBar{height:14px;background:rgba(0,0,0,.5);border:2px solid var(--olive);border-radius:8px;overflow:hidden;}
#progressFill{height:100%;width:0;background:linear-gradient(90deg,var(--olive),var(--green));transition:width .25s;box-shadow:0 0 12px rgba(108,211,95,.6);}
#progressText{margin-top:5px;font-family:'Share Tech Mono',monospace;font-size:15px;letter-spacing:.15em;text-shadow:0 1px 3px #000;}

#topRight{position:absolute;top:16px;right:18px;text-align:right;font-family:'Share Tech Mono',monospace;text-shadow:0 1px 3px #000;}
#killsBox{font-size:14px;letter-spacing:.1em;opacity:.85;}
#killsBox b{color:var(--green);font-size:20px;}
#timerBox{font-size:22px;letter-spacing:.1em;color:var(--amber);margin-top:2px;}
#mapName{font-size:11px;opacity:.5;letter-spacing:.15em;margin-top:2px;}

#moneyBox{position:absolute;top:16px;left:18px;font-family:'Share Tech Mono',monospace;
  font-size:16px;letter-spacing:.08em;color:var(--gold);text-shadow:0 1px 3px #000;}
#moneyBox b{font-size:22px;}

#crosshair{position:absolute;top:50%;left:50%;width:22px;height:22px;transform:translate(-50%,-50%);}
#crosshair span{position:absolute;background:var(--green);box-shadow:0 0 4px rgba(0,0,0,.8);}
#crosshair span:nth-child(1){top:0;left:50%;width:2px;height:7px;transform:translateX(-50%);}
#crosshair span:nth-child(2){bottom:0;left:50%;width:2px;height:7px;transform:translateX(-50%);}
#crosshair span:nth-child(3){left:0;top:50%;height:2px;width:7px;transform:translateY(-50%);}
#crosshair span:nth-child(4){right:0;top:50%;height:2px;width:7px;transform:translateY(-50%);}

#hitmarker{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:26px;font-weight:bold;opacity:0;transition:opacity .1s;text-shadow:0 0 6px #000;}

#damageVignette{position:absolute;inset:0;opacity:0;transition:opacity .18s;
  box-shadow:inset 0 0 120px 40px rgba(224,32,32,.7);pointer-events:none;}

#bottomLeft{position:absolute;bottom:22px;left:22px;display:flex;align-items:center;gap:10px;text-shadow:0 1px 3px #000;}
.hud-icon{color:var(--red);font-size:24px;}
#healthBar{width:150px;height:16px;background:rgba(0,0,0,.5);border:2px solid #33402a;border-radius:6px;overflow:hidden;}
#healthFill{height:100%;width:100%;background:var(--green);transition:width .2s,background .2s;}
#healthNum{font-family:'Share Tech Mono',monospace;font-size:20px;font-weight:bold;}
#armorWrap{font-family:'Share Tech Mono',monospace;font-size:16px;color:#5aa0e0;margin-left:6px;}
.armor-ico{font-size:16px;}

#bottomRight{position:absolute;bottom:22px;right:22px;text-align:right;font-family:'Share Tech Mono',monospace;text-shadow:0 1px 3px #000;}
#weapName{font-size:13px;letter-spacing:.12em;color:var(--olive);opacity:.9;}
#ammoNum{font-size:30px;font-weight:bold;letter-spacing:.05em;}
#reloadHint{font-size:12px;letter-spacing:.15em;color:var(--amber);opacity:0;transition:.2s;margin-top:2px;}
#reloadHint.show{opacity:1;animation:blink .8s infinite;}
#buyHint{font-size:11px;letter-spacing:.15em;color:var(--gold);opacity:.6;margin-top:2px;}
@keyframes blink{50%{opacity:.3;}}

#msgCenter{position:absolute;top:34%;left:50%;transform:translate(-50%,-50%);
  font-size:clamp(22px,5.5vw,40px);font-weight:700;letter-spacing:.1em;color:var(--green);
  text-shadow:0 0 20px rgba(0,0,0,.8);opacity:0;transition:opacity .4s;text-align:center;}

#clickHint{position:fixed;inset:0;z-index:16;display:flex;align-items:center;justify-content:center;
  background:rgba(6,10,7,.55);color:var(--ink);font-size:22px;letter-spacing:.2em;cursor:pointer;
  font-family:'Share Tech Mono',monospace;}

/* ---------- Buy Menu ---------- */
.buy-overlay{z-index:22;background:rgba(6,10,7,.92);}
.buy-inner{max-width:640px;width:94%;background:linear-gradient(160deg,#12180f,#0a0f0b);
  border:1px solid #33402a;border-radius:14px;padding:22px;animation:rise .3s ease both;}
.buy-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.buy-money{font-family:'Share Tech Mono',monospace;font-size:20px;color:var(--gold);}
.buy-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px;}
.buy-tabs button{flex:1;min-width:90px;background:transparent;border:1px solid #33402a;color:var(--ink);
  cursor:pointer;padding:10px;border-radius:7px;letter-spacing:.1em;font-family:'Oswald',sans-serif;
  font-size:13px;transition:.15s;opacity:.6;}
.buy-tabs button.active{background:var(--olive);color:#141a10;opacity:1;font-weight:bold;}
.buy-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin-bottom:16px;max-height:52vh;overflow-y:auto;}
.buy-card{border:1px solid #2a3520;border-radius:9px;padding:12px 14px;background:#0c110a;text-align:left;
  cursor:pointer;transition:.15s;display:flex;flex-direction:column;gap:4px;}
.buy-card:hover:not(.disabled){border-color:var(--green);transform:translateY(-2px);}
.buy-card.disabled{opacity:.4;cursor:not-allowed;}
.buy-card.owned{border-color:var(--green);}
.buy-card .bw-name{font-weight:700;letter-spacing:.06em;font-size:15px;}
.buy-card .bw-price{font-family:'Share Tech Mono',monospace;color:var(--gold);font-size:13px;}
.buy-card .bw-stat{font-family:'Share Tech Mono',monospace;font-size:10px;opacity:.5;}
.buy-card .bw-tag{font-size:10px;color:var(--green);letter-spacing:.1em;}

/* ---------- Mobile ---------- */
#joystick{position:absolute;bottom:30px;left:30px;width:120px;height:120px;border-radius:50%;
  background:rgba(255,255,255,.06);border:2px solid rgba(138,154,91,.4);pointer-events:auto;touch-action:none;}
#stick{position:absolute;top:50%;left:50%;width:52px;height:52px;margin:-26px;border-radius:50%;
  background:rgba(108,211,95,.4);border:2px solid var(--green);}
.mobile-btn{position:absolute;pointer-events:auto;border:2px solid var(--olive);
  background:rgba(108,211,95,.15);color:var(--ink);font-family:'Share Tech Mono',monospace;
  letter-spacing:.1em;border-radius:50%;touch-action:none;font-weight:bold;}
#fireBtn{bottom:38px;right:34px;width:96px;height:96px;font-size:16px;background:rgba(224,64,64,.25);border-color:var(--red);}
#fireBtn:active{background:rgba(224,64,64,.5);}
#reloadBtn{bottom:150px;right:44px;width:70px;height:70px;font-size:11px;}
#jumpBtn{bottom:150px;right:130px;width:64px;height:64px;font-size:13px;}
#buyBtn{bottom:240px;right:44px;width:64px;height:64px;font-size:13px;background:rgba(241,196,15,.2);border-color:var(--gold);}

@media (max-width:600px){
  .option-row{flex-direction:column;align-items:stretch;gap:6px;}
  .controls-legend{display:none;}
  .mode-grid{grid-template-columns:1fr;}
}
@media (max-height:520px) and (orientation:landscape){
  .controls-legend{display:none;}
  .subtitle{margin-bottom:12px;}
  .title{font-size:clamp(30px,7vw,54px);}
}
</parameter>