@layer swsg-system {
  :root {
    color-scheme: dark;
    --command-ink: #effaff;
    --command-muted: #94aeba;
    --command-faint: #617c88;
    --command-void: #02070c;
    --command-panel: #08131b;
    --command-panel-solid: #0b1822;
    --command-line: #1b3c49;
    --command-line-strong: #2e7184;
    --command-cyan: #6de7f2;
    --command-cyan-bright: #b7f7fb;
    --command-amber: #f4c86a;
    --command-red: #ff7970;
    --command-green: #79d9a1;
    --command-radius: 8px;
    --command-fast: 120ms;
    --command-standard: 180ms;
    --command-spatial: 260ms;
    --command-ease-enter: cubic-bezier(.22, 1, .36, 1);
    --command-ease-move: cubic-bezier(.25, 1, .5, 1);
    --command-viewport-height: 100vh;
  }

  *, *::before, *::after { box-sizing: border-box; }

  html {
    min-width: 320px;
    background: var(--command-void);
    text-size-adjust: 100%;
  }

  body[data-command-surface] {
    min-height: var(--command-viewport-height);
    accent-color: var(--command-cyan);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  body[data-command-surface]::before {
    position: fixed;
    z-index: 999;
    inset: 0 0 auto;
    height: 2px;
    pointer-events: none;
    content: '';
    background: linear-gradient(90deg, transparent 0 3%, var(--command-cyan) 3% 13%, transparent 13% 86%, var(--command-amber) 86% 97%, transparent 97%);
    opacity: .7;
  }

  ::selection {
    color: #001015;
    background: var(--command-cyan);
  }

  :where(button, input, select, textarea) { font: inherit; }
  :where(button, a, input, select, textarea) { -webkit-tap-highlight-color: transparent; }
  :where(button, [role='button'], a[href]) { touch-action: manipulation; }
  :where(button:disabled, input:disabled, select:disabled, textarea:disabled) { cursor: not-allowed; opacity: .56; }

  :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid var(--command-cyan-bright);
    outline-offset: 3px;
  }

  .skip-link {
    position: fixed;
    z-index: 10000;
    top: max(10px, env(safe-area-inset-top));
    left: max(10px, env(safe-area-inset-left));
    padding: 10px 14px;
    border: 1px solid var(--command-cyan);
    border-radius: 4px;
    color: #001015;
    background: var(--command-cyan-bright);
    font-weight: 700;
    text-decoration: none;
    transform: translateY(calc(-100% - 24px));
    transition: transform var(--command-standard) var(--command-ease-enter);
  }

  .skip-link:focus { transform: translateY(0); }

  .command-signal {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--command-muted);
    font-size: .75rem;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .command-signal::before {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    content: '';
    background: var(--command-green);
    box-shadow: 0 0 12px color-mix(in srgb, var(--command-green) 62%, transparent);
  }

  * { scrollbar-color: var(--command-line-strong) transparent; scrollbar-width: thin; }

  @media (hover: hover) and (pointer: fine) {
    :where(a[href], button:not(:disabled)) { transition: color var(--command-fast) ease, border-color var(--command-fast) ease, background-color var(--command-fast) ease, opacity var(--command-fast) ease; }
  }

  @media (prefers-reduced-transparency: reduce) {
    :where(.panel, .topbar, .console-header, .console-footer, dialog, .modal-shell, .palette-shell) {
      backdrop-filter: none !important;
      background-color: var(--command-panel-solid) !important;
    }
  }

  @media (prefers-contrast: more) {
    :root {
      --command-muted: #bed1da;
      --command-faint: #9bb2bd;
      --command-line: #477380;
      --command-line-strong: #8eddea;
    }
  }

  @media (forced-colors: active) {
    body[data-command-surface]::before { display: none; }
    :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid Highlight; }
  }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      scroll-behavior: auto !important;
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: .01ms !important;
    }
  }
}