:root {
  --lab-bg: #090b12;
  --lab-panel: #111523;
  --lab-line: #252c44;
  --lab-text: #d7defa;
  --lab-muted: #98a3cf;
  --lab-accent: #7aa2ff;
}

body.lab {
  margin: 0;
  background: radial-gradient(1200px 600px at 10% -10%, #18203d 0, transparent 55%), var(--lab-bg);
  color: var(--lab-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.lab-wrap { max-width: 1040px; margin: 0 auto; padding: 1.2rem 1rem 2rem; }
.lab-top { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem; }
.lab-top a { color: var(--lab-muted); text-decoration:none; }
.lab-top a:hover { color: var(--lab-text); }

.lab-title { margin: .2rem 0; font-size: clamp(1.4rem, 3.2vw, 2rem); }
.lab-sub { margin: 0; color: var(--lab-muted); }

.exp-grid { margin-top: 1.2rem; display:grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: .9rem; }
.exp-card { background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)); border:1px solid var(--lab-line); border-radius:14px; padding: .9rem; }
.exp-card h2 { margin:.2rem 0 .4rem; font-size:1.02rem; }
.exp-card p { margin:0; color: var(--lab-muted); font-size:.94rem; }
.exp-card .tag { display:inline-block; margin-bottom:.6rem; font-size:.72rem; color:#b8c7ff; opacity:.8; }
.exp-card .open { margin-top:.8rem; display:inline-block; color:var(--lab-accent); text-decoration:none; }

.dungeon-layout { display:grid; gap:1rem; grid-template-columns: 1fr; }
@media (min-width: 980px){ .dungeon-layout{ grid-template-columns: 1fr 300px; } }
.panel { background:var(--lab-panel); border:1px solid var(--lab-line); border-radius:14px; padding:.85rem; }

canvas#game { width:100%; max-width:900px; aspect-ratio: 16 / 10; display:block; border:1px solid #2f3b62; border-radius:12px; background:#080b12; image-rendering: pixelated; }

.controls { display:flex; gap:.55rem; flex-wrap:wrap; margin:.5rem 0 .7rem; }
.btn-lab { appearance:none; border:1px solid #3852a3; color:#e6ecff; background:#162242; padding:.5rem .78rem; border-radius:10px; cursor:pointer; }
.btn-lab:hover { background:#1d2d59; }

.meta { color:var(--lab-muted); font-size:.9rem; margin:.35rem 0; }

#upgradeOverlay {
  position: absolute; inset: 0; display:none; align-items:center; justify-content:center;
  background: rgba(7,10,18,.74); border-radius:12px;
}
#upgradeOverlay.show { display:flex; }
.upgrade-box { width:min(760px,92%); background:#10162a; border:1px solid #2a3558; border-radius:12px; padding: .8rem; }
.upgrade-grid { display:grid; gap:.6rem; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); margin-top:.5rem; }
.upgrade-btn { text-align:left; border:1px solid #37467a; background:#151f3e; color:#dbe5ff; border-radius:10px; padding:.55rem; cursor:pointer; }
.upgrade-btn:hover { background:#1a2850; }

.game-wrap { position:relative; }
.small { font-size:.82rem; color:var(--lab-muted); }