/* No Escape — UI theme + side panels + toolbar (PAGE-SIDE; loaded by view/client.ejs) */
:root { --ne-gold:#ffd700; --ne-bg:#0c0c0c; --ne-panel:#141414; --ne-border:#3a2f00; }

/* canvas + right-side panel rail */
#ne-wrap { display:flex; align-items:flex-start; justify-content:center; gap:6px; }
#ne-rail { display:flex; flex-direction:column; gap:6px; }

/* generic panel */
.ne-panel {
  background:var(--ne-panel); color:var(--ne-gold); border:1px solid var(--ne-border);
  font:11px/1.4 Arial, Helvetica, sans-serif; width:232px; max-height:532px; overflow:auto;
  box-shadow:0 0 8px rgba(0,0,0,.6);
}
.ne-panel h3 {
  margin:0; padding:5px 8px; font-size:12px; letter-spacing:.5px; text-transform:uppercase;
  color:var(--ne-gold); background:linear-gradient(#1d1d1d,#0c0c0c); border-bottom:1px solid var(--ne-border);
  display:flex; justify-content:space-between; align-items:center;
}
.ne-panel .ne-body { padding:4px 6px; }

/* xp tracker rows */
.ne-xp-row { display:flex; align-items:center; gap:6px; padding:2px 0 0; }
.ne-xp-row .nm { flex:1; }
.ne-xp-row .lv { color:var(--ne-gold); min-width:30px; text-align:right; }
.ne-xp-row .ov { color:#8fd3ff; min-width:22px; text-align:right; font-size:10px; }
.ne-xp-row .gn { color:#7CFC00; min-width:60px; text-align:right; }
.ne-bar { height:4px; background:#000; border:1px solid #333; margin:1px 0 3px; }
.ne-bar > i { display:block; height:100%; background:var(--ne-gold); width:0; transition:width .3s; }

/* buttons */
.ne-btn { cursor:pointer; color:var(--ne-gold); background:#1a1a1a; border:1px solid var(--ne-border);
  padding:2px 7px; font:11px Arial; border-radius:2px; }
.ne-btn:hover { background:#262626; }

/* floating xp drops — stacked at the top-right of the game view (non-overlapping) */
#ne-drops { position:fixed; z-index:9998; display:flex; flex-direction:column; align-items:flex-end; gap:1px; pointer-events:none; }
.ne-drop { font:bold 13px Arial; text-shadow:1px 1px 2px #000, 0 0 2px #000; white-space:nowrap;
  animation:ne-fade 1.8s ease-out forwards; }
@keyframes ne-fade { 0% { opacity:0; transform:translateY(-3px); } 12% { opacity:1; transform:translateY(0); } 70% { opacity:1; } 100% { opacity:0; transform:translateY(-2px); } }

/* scrollbars */
.ne-panel::-webkit-scrollbar { width:8px; }
.ne-panel::-webkit-scrollbar-thumb { background:#2a2a2a; }
.ne-panel::-webkit-scrollbar-track { background:#000; }