/* The Deep Dive — styles for the wonders13.js exhibit. Prefix .dd- (free;
   .tg- .kr- .f4- .nt- .nz- .nc- .nb2- are taken). Reuses .wx-* and .tg-say;
   never restyles them. */

.dd-stage {
  flex: 1; min-height: 0; min-width: 0;
  position: relative; overflow: hidden;
  border-radius: 12px; border: 1px solid var(--line); background: #000;
  touch-action: none;
}
.dd-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

.dd-hud {
  position: absolute; left: 10px; top: 10px; pointer-events: none;
  padding: 8px 12px; border-radius: 8px;
  background: rgba(13, 16, 25, 0.72); border: 1px solid var(--line);
  font-size: 12.5px; line-height: 1.6; color: var(--tx1); max-width: 340px;
}
.dd-hud b { color: var(--tx2); font-weight: 600; text-transform: uppercase; font-size: 10.5px; letter-spacing: 0.06em; }
.dd-num { color: var(--gold); font: 600 13px/1 Consolas, monospace; }
.dd-line { color: var(--tx0); }
.dd-sharp { color: var(--gold); animation: dd-pulse 1s infinite; }
@keyframes dd-pulse { 50% { opacity: 0.35; } }

.dd-pal.on, #dd-dive.on, #dd-rise.on { border-color: var(--gold); color: var(--gold); }
.dd-go { font: 600 12px/1 Consolas, monospace; }

.dd-nogl {
  padding: 40px; font-size: 15px; color: var(--tx1); line-height: 1.7;
}