/* The dungeon page. Its own sheet because the site's CSP (default-src 'self') allows no inline style;
   every rule here is scoped to a .dg- class or to body.dgl, so nothing touches the rest of the site. */
body.dgl { background: #0b120e; }
#net-bg { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: -1; pointer-events: none; }
.dgwrap { max-width: min(1180px, 96vw); margin: 0 auto; padding: 26px 18px 40px; }
.dghead h1 { margin: 4px 0 18px; font-size: 30px; letter-spacing: .01em; color: #ace4b2; }
.dgkicker { margin: 0; color: #7fbf94; font-size: 13.5px; letter-spacing: .09em; text-transform: uppercase; }
.dgframe { display: grid; grid-template-columns: minmax(0, 1fr) 268px; gap: 14px; align-items: start; }
#board { width: 100%; aspect-ratio: 3 / 2; background: #071009; border: 1px solid rgba(127, 191, 148, .34);
  border-radius: 6px; image-rendering: pixelated; display: block; }
.dgrail { display: grid; gap: 12px; }
.dgplate { border: 1px solid rgba(127, 191, 148, .28); border-radius: 6px; background: rgba(18, 32, 23, .72);
  padding: 12px 13px; color: #bfe6c9; }
.dgplate h2 { margin: 0 0 8px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: #7fbf94; }
.dgstats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; text-align: center; }
.dgstats b { display: block; font-size: 22px; color: #ace4b2; }
.dgstats span { font-size: 10.5px; letter-spacing: .09em; text-transform: uppercase; color: #6f9c7e; }
.dgbar { height: 7px; border-radius: 4px; background: rgba(127, 191, 148, .18); overflow: hidden; margin-top: 6px; }
.dgbar i { display: block; height: 100%; width: 100%; background: #7fbf94; }
.dglog { font-size: 12.5px; line-height: 1.5; color: #bfe6c9; max-height: 216px; overflow: hidden; }
.dglog p { margin: 0 0 3px; }
.dglog .deep { color: #7fbf94; }
.dgkeys { font-size: 12.5px; color: #86ad95; }
.dgkeys p { margin: 0 0 8px; }
.dgkeys b { color: #ace4b2; }
kbd { border: 1px solid rgba(127, 191, 148, .4); border-radius: 3px; padding: 1px 5px; color: #bfe6c9; }
.dgnote { font-size: 12.5px; color: #86ad95; margin: 10px 0 0; }
.dgcontrols { margin-top: 12px; }
#autoplay { font: inherit; width: 100%; padding: 11px 0; background: rgba(127, 191, 148, .12); color: #bfe6c9;
  border: 1px solid rgba(127, 191, 148, .35); border-radius: 5px; cursor: pointer; letter-spacing: .06em; }
#autoplay[aria-pressed="true"] { background: #7fbf94; color: #08150e; border-color: #ace4b2; font-weight: 700; }
@media (max-width: 900px) { .dgframe { grid-template-columns: 1fr; } }
