*{box-sizing:border-box}
:root{
  --green:#7dff16;
  --green2:#3ed300;
  --ink:#020603;
  --panel:rgba(2,13,6,.91);
  --line:rgba(125,255,22,.42);
  --white:#f5f7f2;
}
html,body{margin:0;min-height:100%;background:#000;color:var(--white);font-family:Arial,Helvetica,sans-serif}
body{overflow-x:hidden}
button{font:inherit}
.uer-app{
  min-height:100vh;padding:22px 14px 34px;
  background:
    radial-gradient(circle at 50% 4%,rgba(93,255,23,.10),transparent 22%),
    linear-gradient(#010302,#000);
}
.uer-header{text-align:center;max-width:760px;margin:0 auto 15px}
.uer-kicker{
  display:inline-block;padding:6px 14px;border:1px solid rgba(125,255,22,.56);
  border-radius:999px;color:var(--green);font-size:10px;font-weight:900;letter-spacing:1.5px
}
.uer-header h1{
  margin:8px 0 0;font-size:clamp(38px,7vw,64px);line-height:.95;font-weight:900;letter-spacing:-2px;
  text-shadow:0 0 16px rgba(125,255,22,.18)
}
.uer-subtitle{margin-top:3px;color:var(--green);font-size:clamp(20px,3.6vw,31px);font-weight:900;letter-spacing:2px}
.uer-header p{margin:8px 0 0;color:#bec8bb;font-size:13px}

.uer-game-shell{
  width:min(540px,100%);margin:0 auto;padding:10px;border:1px solid var(--line);border-radius:20px;
  background:linear-gradient(180deg,rgba(6,20,10,.86),rgba(0,5,2,.95));
  box-shadow:0 0 28px rgba(85,255,0,.12)
}
.uer-hud{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 8px;padding:8px 9px;border-radius:11px;
  background:#010603;border:1px solid rgba(125,255,22,.20)
}
.uer-hud>div{text-align:center}
.uer-hud-label{display:block;color:#8b9a87;font-size:8px;font-weight:900;letter-spacing:1.2px}
.uer-hud strong{display:block;margin-top:2px;color:var(--green);font-size:14px}

.uer-game-area{
  position:relative;width:100%;aspect-ratio:9/14;min-height:520px;max-height:680px;overflow:hidden;
  border:2px solid rgba(255,255,255,.86);border-radius:14px;outline:none;
  background:url("assets/space-background.jpg") center/cover no-repeat;
  box-shadow:inset 0 0 60px rgba(0,0,0,.35)
}
.uer-scanlines{
  position:absolute;inset:0;z-index:20;pointer-events:none;opacity:.06;
  background:repeating-linear-gradient(180deg,transparent 0 3px,#7dff16 4px,transparent 5px)
}
.uer-uap{
  position:absolute;z-index:14;left:50%;bottom:18px;width:72px;height:72px;transform:translateX(-50%);
  background:url("assets/uap.png") center/contain no-repeat;filter:drop-shadow(0 0 8px rgba(0,255,230,.45))
}
.uer-raptor{
  position:absolute;z-index:12;top:-100px;width:78px;height:78px;
  background:url("assets/raptor.png") center/contain no-repeat;
  filter:drop-shadow(0 3px 4px rgba(0,0,0,.5))
}
.uer-warning{
  position:absolute;z-index:25;top:12px;left:50%;transform:translateX(-50%) translateY(-20px);
  opacity:0;padding:7px 11px;border:1px solid rgba(125,255,22,.40);border-radius:999px;
  color:var(--green);background:rgba(0,0,0,.72);font-size:9px;font-weight:900;letter-spacing:1.2px;
  transition:.25s ease;white-space:nowrap
}
.uer-warning.is-visible{opacity:1;transform:translateX(-50%) translateY(0)}

.uer-overlay{
  position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;
  padding:18px;background:rgba(0,4,2,.72);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .2s ease
}
.uer-overlay.is-visible{opacity:1;pointer-events:auto}
.uer-overlay-card{
  width:min(390px,94%);padding:22px;border:1px solid rgba(125,255,22,.58);border-radius:16px;
  background:rgba(0,8,3,.94);box-shadow:0 0 34px rgba(87,255,0,.16);text-align:center
}
.uer-overlay-kicker{color:var(--green);font-size:9px;font-weight:900;letter-spacing:1.8px}
.uer-overlay-card h2{margin:8px 0 9px;font-size:29px}
.uer-overlay-card p{margin:0 auto 14px;color:#c9d1c6;line-height:1.5;font-size:13px}
.uer-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:13px 0}
.uer-info-grid div{padding:10px;border:1px solid rgba(125,255,22,.24);border-radius:10px;background:#010603}
.uer-info-grid strong,.uer-info-grid span{display:block}
.uer-info-grid strong{color:var(--green);font-size:9px;letter-spacing:1px}
.uer-info-grid span{margin-top:5px;color:#d5ddd2;font-size:11px}
.uer-ranks{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:14px 0}
.uer-ranks div{padding:7px 4px;border-radius:9px;background:#010603;border:1px solid rgba(125,255,22,.18)}
.uer-ranks img{width:38px;height:38px;object-fit:contain}
.uer-ranks span{display:block;color:#dce5d8;font-size:8px;font-weight:800;line-height:1.3}
.uer-ranks b{color:var(--green)}
.uer-gameover-card h2{color:#fff}

.uer-badge-popup{
  position:absolute;z-index:35;top:58px;left:50%;display:flex;align-items:center;gap:10px;
  width:min(320px,86%);padding:10px 12px;border:1px solid rgba(125,255,22,.62);border-radius:12px;
  background:rgba(0,7,3,.94);box-shadow:0 0 25px rgba(125,255,22,.18);
  transform:translate(-50%,-18px);opacity:0;pointer-events:none;transition:.25s ease
}
.uer-badge-popup.is-visible{opacity:1;transform:translate(-50%,0)}
.uer-badge-popup img{width:52px;height:52px;object-fit:contain}
.uer-badge-popup small,.uer-badge-popup strong,.uer-badge-popup span{display:block}
.uer-badge-popup small{color:#9ab194;font-size:7px;letter-spacing:1.1px}
.uer-badge-popup strong{color:var(--green);font-size:17px;margin:2px 0}
.uer-badge-popup span{color:#dce4d9;font-size:9px}

.uer-controls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:9px}
.uer-primary,.uer-secondary,.uer-mobile-controls button{
  min-height:46px;border-radius:9px;cursor:pointer;font-weight:900;letter-spacing:.5px
}
.uer-primary{border:1px solid #b5ff72;background:linear-gradient(135deg,#9eff28,#48d300);color:#061000}
.uer-secondary,.uer-mobile-controls button{border:1px solid rgba(125,255,22,.36);background:#031008;color:#eaf2e7}
.uer-mobile-controls{display:none;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.uer-mobile-controls button{font-size:22px;color:var(--green)}
.uer-status-panel{
  width:min(540px,100%);margin:10px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:7px
}
.uer-status-panel div{padding:8px;border:1px solid rgba(125,255,22,.14);border-radius:9px;background:#010603;text-align:center}
.uer-status-panel span,.uer-status-panel strong{display:block}
.uer-status-panel span{color:#71806d;font-size:7px;font-weight:900;letter-spacing:1px}
.uer-status-panel strong{margin-top:3px;color:#cfd8cc;font-size:9px}

@media(max-width:600px){
  .uer-app{padding:12px 8px 22px}
  .uer-header{margin-bottom:9px}
  .uer-game-shell{padding:7px;border-radius:14px}
  .uer-game-area{min-height:0;max-height:none;aspect-ratio:9/14.3}
  .uer-controls{grid-template-columns:1fr 1fr 1fr}
  .uer-mobile-controls{display:grid}
  .uer-status-panel{grid-template-columns:1fr 1fr 1fr}
}
@media(max-width:390px){
  .uer-ranks{grid-template-columns:repeat(2,1fr)}
  .uer-info-grid{grid-template-columns:1fr}
  .uer-header h1{font-size:38px}
}