/* The Last Dance — shared interface foundation. */
:root {
  color-scheme: dark;
  --bg: #080d12;
  --surface: #101820;
  --surface-raised: #15202a;
  --line: #26323d;
  --line-soft: #1a2630;
  --text: #e6edf2;
  --muted: #91a2b0;
  --subtle: #758795;
  --accent: #77dce4;
  --accent-rgb: 119, 220, 228;
  --amber: #dcb67b;
  --success: #87c7ae;
  --danger: #ea928a;
  --radius: 10px;
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-family: var(--font-sans);
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
button, input, textarea, select { font: inherit; }
button, a, input, textarea, select, summary { -webkit-tap-highlight-color: transparent; }
a { color: var(--accent); text-underline-offset: 4px; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }
button, a { touch-action: manipulation; }
button, input, textarea, select { border-radius: 6px; }
::selection { background: #77dce43d; color: #fff; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
[hidden] { display: none !important; }
.skip-link { position: fixed; top: 12px; left: 16px; z-index: 100; padding: 10px 18px; background: var(--surface-raised); border: 1px solid var(--accent); transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; position: relative; border: 1px solid #77dce450; border-radius: 50%; box-shadow: 0 0 22px #77dce40b, inset 0 0 14px #77dce40b; }
.brand-mark::before { content: ''; position: absolute; inset: 5px; border: 1px solid #77dce47a; border-radius: 50%; }
.brand-mark::after { content: ''; width: 9px; height: 9px; border: 1px solid var(--accent); transform: rotate(45deg); box-shadow: 0 0 12px #77dce43a; }
.eyebrow, .label { font: 10px/1.5 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 9px currentColor; flex: 0 0 6px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
