/* ==========================================================================
   HSMApp · Design 2: Aurora (Standard)
   Graphit mit Polarlicht: Mint, Türkis und Magenta, weiche Flächen,
   große Radien, ein langsam wanderndes Polarlicht unter dem Kopf.
   Farben/Formen hier, der eigentliche Umbau steht in design-basis.css.
   ========================================================================== */
html:root {
  --d-scheme: dark;
  --d-font: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --d-mono: "Cascadia Code", "Cascadia Mono", ui-monospace, "SF Mono", Consolas, "Roboto Mono", "DejaVu Sans Mono", monospace;
  --d-bg: #0b0f14;
  --d-surface: #121821;
  --d-surface-solid: #121821;
  --d-surface-2: #19212c;
  --d-input-bg: #0e131a;
  --d-panel-solid: #0e131a;
  --d-head-bg: rgba(11, 15, 20, .82);
  --d-line: rgba(255, 255, 255, .09);
  --d-line-soft: rgba(255, 255, 255, .05);
  --d-line-strong: rgba(255, 255, 255, .16);
  --d-text: #eef3f1; --d-text-2: #c9d4cf; --d-muted: #8f9c95;
  --d-hover: rgba(255, 255, 255, .05);
  --d-accent: #34f5c5; --d-accent-2: #19b5fe; --d-ai: #ff5fd2;
  --d-ok: #34f5c5; --d-ok-text: #4ff7cd;
  --d-warn: #ffc857; --d-warn-text: #ffd57f;
  --d-danger: #ff6b6b; --d-danger-text: #ff8a8a;
  --d-on-accent: #022019; --d-on-warn: #241800;
  --d-grad: linear-gradient(135deg, #34f5c5, #19b5fe);
  --d-grad-ai: linear-gradient(135deg, #ff5fd2, #8f6bff);
  --d-glow: 0 8px 24px rgba(52, 245, 197, .20);
  --d-shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.25);
  --d-shadow-lg: 0 24px 60px rgba(0,0,0,.55);
  --d-nav-text: #9aa8a0; --d-nav-active-text: #eef3f1; --d-nav-active-bg: rgba(52,245,197,.10); --d-nav-active-line: rgba(52,245,197,.35);
  --d-r-sm: 12px; --d-r-md: 18px; --d-r-lg: 22px; --d-r-btn: 99px;
  --d-scrollbar: rgba(255,255,255,.18);
  --d-page-bg:
    radial-gradient(1100px 420px at 50% -180px, rgba(52, 245, 197, .16), transparent 70%),
    radial-gradient(700px 380px at 100% 0, rgba(255, 95, 210, .10), transparent 70%),
    radial-gradient(600px 400px at 0 30%, rgba(25, 181, 254, .08), transparent 70%),
    #0b0f14;
}

@media screen {
:root .header-bar { border-bottom-color: transparent !important; }
:root .header-bar::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, #34f5c5, #19b5fe, #8f6bff, #ff5fd2, #34f5c5); background-size: 200% 100%;
  animation: hsm-aurora 12s linear infinite; opacity: .85;
}
@keyframes hsm-aurora { to { background-position: 200% 0; } }
:root .header-bar h1::before, :root .login-box::before { border-radius: 50%; }
:root .header-bar h1 { font-weight: 650; letter-spacing: -.02em; }
:root .hsmapp-btn.active { position: relative; }
:root .hsmapp-btn.active::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: -2px; height: 3px; border-radius: 3px 3px 0 0;
  background: var(--d-grad); box-shadow: 0 0 14px rgba(52,245,197,.6);
}
:root .hsmapp-sub-btn { border-radius: 99px; }
:root th { background: transparent !important; }
:root .badge-green, :root .badge-red, :root .badge-rhythmus { border-radius: 99px; }
}