/* Secrets layer: optional play that never carries required content. */

/* The Signal Core accepts a click once it is live. Each click starts a breadth-first search. */
.hero-enhanced #signal-core { pointer-events: auto; cursor: crosshair; }

/* The header mark redraws itself, the way the core resolves into it. */
.brand-mark path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.identity:hover .brand-mark path, .identity:focus-visible .brand-mark path { animation: draw-mark 1.1s var(--ease); }
@keyframes draw-mark { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* Supporting work reacts to attention: a pixel hop and a turning sample. */
.orbit-symbol { transition: transform .9s var(--ease); }
.orbit-row:hover .pixel-symbol, .orbit-row:focus-visible .pixel-symbol { animation: pixel-hop .6s steps(3) 1; }
.orbit-row:hover .orbit-symbol:not(.pixel-symbol), .orbit-row:focus-visible .orbit-symbol:not(.pixel-symbol) { transform: rotate(180deg); }
@keyframes pixel-hop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* Diagnostic mode annotates the whole lab, not only the hero. */
.diagnostic .project { position: relative; outline: 1px dashed oklch(.83 .08 217 / .28); outline-offset: 10px; }
.diagnostic .project::after { content: '#' attr(id) ' / ' attr(data-capabilities); position: absolute; top: -27px; right: 0; font: 9px/1.5 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--cyan); pointer-events: none; }
.lab-hud { position: fixed; left: 16px; bottom: 16px; z-index: 60; max-width: calc(100% - 32px); padding: 8px 12px; border: 1px solid var(--line); border-radius: 4px; background: oklch(.12 .012 280 / .92); color: var(--cyan); font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.lab-hud[hidden] { display: none; }

/* Console output keeps line breaks and alignment for multi-line replies. */
.console-output p { white-space: pre-wrap; }
.console-secret { color: var(--cyan); }
.arcade-dialog > .arcade-secret { min-height: 0; padding-top: 8px; font-size: 13px; color: var(--cyan); }
.arcade-secret:empty { display: none; }

/* Every secret found: the lab's status lights change colour. */
.lab-complete .status-dot { background: var(--pink); }

@media (max-width: 800px) {
  .diagnostic .project::after { font-size: 7px; top: -22px; }
  .lab-hud { font-size: 7px; }
}
@media print { .lab-hud { display: none !important; } }