/* KLARKONFLIKT — Dark Bridge
   IMMER NACH style.css (und optional premium.css) laden.
   Erzwingt eine visuelle Welt mit kk-tokens für alle Legacy-Klassen. */

body.kk-command,
body.kk-command.kk-command-page {
  font-family: "Manrope", system-ui, sans-serif;
  background-color: var(--kk-sys-bg) !important;
  background-image: var(--kk-sys-bg-veil) !important;
  background-attachment: fixed !important;
  color: var(--kk-sys-text) !important;
  letter-spacing: -0.013em;
  font-feature-settings: "kern" 1, "liga" 1;
  -webkit-font-smoothing: antialiased;
}

body.kk-command ::selection {
  background: rgba(30, 64, 175, 0.2);
}

/* Werkzeug-parity: Panel-Utility auch für Legacy-Markup */
body.kk-command .kk-panel {
  border-radius: var(--kk-sys-radius) !important;
  border: 1px solid var(--kk-sys-line) !important;
  background: rgba(13, 18, 31, 0.95) !important;
  box-shadow: var(--kk-sys-shadow-1) !important;
}

/* System-Link: Ink; Unterstreichung nur bei Hover (Navigation/Chrome ausgenommen) */
body.kk-command a {
  color: var(--kk-sys-ink);
  text-decoration: none;
  text-underline-offset: 0.2em;
}

body.kk-command a:hover {
  filter: none;
  text-decoration: underline;
  text-decoration-thickness: 1px;
}

body.kk-command .kk-brand:hover,
body.kk-command .kk-brand:focus-visible,
body.kk-command .nav a:hover,
body.kk-command .nav a:focus-visible,
body.kk-command .legal-nav a:hover,
body.kk-command .legal-nav a:focus-visible,
body.kk-command .footer-links a:hover,
body.kk-command .legal-footer-links a:hover,
body.kk-command .kk-footer-grid .footer-links a:hover,
body.kk-command .kk-header-auth__link:hover,
body.kk-command a.button:hover,
body.kk-command a.button:focus-visible,
body.kk-command a.kk-btn:hover,
body.kk-command a.kk-btn:focus-visible,
body.kk-command a.backtop:hover {
  text-decoration: none !important;
}

body.kk-command a.kk-problem-row:hover {
  text-decoration: none !important;
}

body.kk-command .muted,
body.kk-command p.muted {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .topbar,
body.kk-command .legal-topbar {
  border-bottom: 1px solid var(--kk-sys-line) !important;
  background: rgba(5, 7, 15, 0.9) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.08);
  backdrop-filter: blur(16px) saturate(1.08);
}

body.kk-command .topbar.is-scrolled,
body.kk-command .legal-topbar.is-scrolled {
  box-shadow: var(--kk-sys-shadow-topbar) !important;
}

body.kk-command .legal-topbar-inner,
body.kk-command .topbar-inner {
  max-width: var(--kk-sys-max) !important;
}

body.kk-command .brand-full {
  border-color: var(--kk-sys-line) !important;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.05) 0%, rgba(26, 31, 42, 0.98) 45%, rgba(14, 18, 25, 0.99) 100%) !important;
  box-shadow: var(--kk-sys-shadow-1) !important;
}

body.kk-command .brand-name {
  color: var(--kk-sys-text) !important;
}

body.kk-command .brand-tag {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .nav a,
body.kk-command .legal-nav a {
  color: var(--kk-sys-ink) !important;
}

body.kk-command .nav a:hover,
body.kk-command .legal-nav a:hover {
  color: var(--kk-sys-accent) !important;
}

body.kk-command .nav-toggle {
  border-color: var(--kk-sys-line) !important;
  background: var(--kk-sys-surface-mid) !important;
  box-shadow: var(--kk-sys-inset) !important;
  border-radius: var(--kk-sys-radius-control) !important;
}

body.kk-command .nav-toggle span,
body.kk-command .nav-toggle span::before,
body.kk-command .nav-toggle span::after {
  background: var(--kk-sys-text) !important;
}

body.kk-command main,
body.kk-command .section {
  background: transparent !important;
  border-bottom-color: var(--kk-sys-line) !important;
}

body.kk-command .wrap {
  max-width: var(--kk-sys-max) !important;
}

body.kk-command .section-head h1,
body.kk-command h1 {
  color: var(--kk-sys-text) !important;
}

body.kk-command .surface,
body.kk-command .proof-card,
body.kk-command .request-unified,
body.kk-command .os-composition,
body.kk-command .os-output {
  background: var(--kk-sys-surface-mid) !important;
  border: 1px solid var(--kk-sys-line) !important;
  box-shadow: var(--kk-sys-shadow-1) !important;
  color: var(--kk-sys-text) !important;
}

/* Legal: gleiche Typo-Welt, weniger visuelle Last als Mid-Slab */
body.kk-command .legal-card {
  background: var(--kk-sys-surface) !important;
  border: 1px solid var(--kk-sys-line) !important;
  box-shadow: var(--kk-sys-shadow) !important;
  color: var(--kk-sys-text) !important;
}

body.kk-command .legal-shell {
  background: var(--kk-sys-bg) !important;
  color: var(--kk-sys-text) !important;
}

body.kk-command .legal-hero {
  border-color: var(--kk-sys-line) !important;
}

body.kk-command .legal-hero h1,
body.kk-command .legal-card h2,
body.kk-command .legal-card h3 {
  color: var(--kk-sys-text) !important;
}

body.kk-command .legal-meta-item {
  border-color: var(--kk-sys-line) !important;
  color: var(--kk-sys-sub) !important;
}

body.kk-command .legal-note {
  background: color-mix(in srgb, var(--kk-sys-surface) 94%, var(--kk-sys-bg)) !important;
  border: 1px solid var(--kk-sys-line) !important;
  color: var(--kk-sys-sub) !important;
  box-shadow: none !important;
}

body.kk-command .eyebrow {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .footer {
  border-top: 1px solid var(--kk-sys-line) !important;
  background: var(--kk-sys-bg) !important;
}

body.kk-command .legal-footer {
  border-top: 1px solid var(--kk-sys-line) !important;
  background: transparent !important;
}

body.kk-command .footer-links a,
body.kk-command .legal-footer-links a {
  color: var(--kk-sys-ink) !important;
  opacity: 0.82;
}

body.kk-command .footer-links a:hover,
body.kk-command .legal-footer-links a:hover {
  opacity: 1 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
}

body.kk-command .footer-mark {
  color: var(--kk-sys-ink) !important;
  opacity: 0.38 !important;
}

body.kk-command .button.primary,
body.kk-command .button.primary.premium-depth {
  border-radius: var(--kk-sys-radius-button) !important;
  background: var(--kk-sys-ink) !important;
  color: var(--kk-sys-surface) !important;
  border-color: var(--kk-sys-ink) !important;
  box-shadow: var(--kk-sys-shadow) !important;
}

body.kk-command .button.primary:hover {
  filter: brightness(1.06) !important;
  box-shadow: var(--kk-sys-shadow) !important;
}

body.kk-command .button.secondary {
  border-radius: var(--kk-sys-radius-button) !important;
  background: rgba(255, 255, 255, 0.02) !important;
  color: var(--kk-sys-text) !important;
  border-color: var(--kk-sys-line) !important;
  box-shadow: var(--kk-sys-inset) !important;
}

body.kk-command .button.secondary:hover {
  border-color: var(--kk-sys-line-strong, rgba(255, 255, 255, 0.1)) !important;
  background: rgba(255, 255, 255, 0.045) !important;
}

body.kk-command .secondary-link {
  color: var(--kk-sys-ink) !important;
  font-weight: 600 !important;
}

body.kk-command .cta-strip {
  border-color: var(--kk-sys-line) !important;
  background: rgba(11, 15, 26, 0.72) !important;
  box-shadow: var(--kk-sys-shadow-1) !important;
}

body.kk-command .kk-tool-module-canvas {
  border-color: var(--kk-sys-line) !important;
  background: rgba(11, 15, 26, 0.55) !important;
  box-shadow: var(--kk-sys-inset) !important;
}

body.kk-command .kk-hub-faq details {
  border-color: var(--kk-sys-line) !important;
  background: var(--kk-sys-surface-mid) !important;
  box-shadow: var(--kk-sys-shadow-1) !important;
}

body.kk-command .kk-hub-faq summary {
  color: var(--kk-sys-text) !important;
}

body.kk-command .kk-hub-faq details p {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .step-rail {
  border-color: var(--kk-sys-line) !important;
}

body.kk-command .step-rail-step {
  background: var(--kk-sys-surface-mid) !important;
  color: var(--kk-sys-primary) !important;
  border-color: var(--kk-sys-line) !important;
  box-shadow: var(--kk-sys-inset) !important;
}

body.kk-command .os-card {
  background: rgba(5, 7, 15, 0.55) !important;
  border-color: var(--kk-sys-line) !important;
  box-shadow: var(--kk-sys-inset) !important;
}

body.kk-command .os-option {
  border-color: var(--kk-sys-line) !important;
  color: var(--kk-sys-text) !important;
}

body.kk-command .field input,
body.kk-command .field textarea,
body.kk-command input,
body.kk-command textarea,
body.kk-command select {
  background: var(--kk-sys-bg) !important;
  border-color: var(--kk-sys-line) !important;
  color: var(--kk-sys-text) !important;
  box-shadow: var(--kk-sys-inset) !important;
}

body.kk-command .field label {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .backtop {
  border-radius: var(--kk-sys-radius-control) !important;
  border-color: var(--kk-sys-line) !important;
  background: var(--kk-sys-surface-mid) !important;
  color: var(--kk-sys-text) !important;
  box-shadow: var(--kk-sys-shadow-1) !important;
}

body.kk-command .system-lane-card,
body.kk-command .os-output-fact {
  border-color: var(--kk-sys-line) !important;
  background: rgba(5, 7, 15, 0.5) !important;
  box-shadow: var(--kk-sys-inset) !important;
}

body.kk-command .service-boundary {
  border-color: var(--kk-sys-line) !important;
  color: var(--kk-sys-sub) !important;
}

body.kk-command .kk-os-result {
  border-color: var(--kk-sys-line) !important;
  box-shadow: var(--kk-sys-shadow-1) !important;
}

/* Kontrast & Lesbarkeit: Legacy-`style.css` nutzt helle Textvariablen — auf Kommandofarben mappen */
body.kk-command .section {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .section h1,
body.kk-command .section h2,
body.kk-command .section h3,
body.kk-command .section-head h1,
body.kk-command .section-head h2 {
  color: var(--kk-sys-text) !important;
}

body.kk-command .section strong {
  color: var(--kk-sys-text) !important;
}

body.kk-command .proof-card p,
body.kk-command .legal-card p,
body.kk-command .surface p {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .section a:not(.button):not(.kk-brand):not(.brand-full):not(.brand-mark) {
  color: var(--kk-sys-primary) !important;
}

body.kk-command .legal-topbar {
  z-index: 140 !important;
}

body.kk-command .legal-topbar-inner {
  position: relative !important;
}

@media (max-width: 900px) {
  body.kk-command .nav {
    background: var(--kk-sys-surface-mid) !important;
    border-bottom-color: var(--kk-sys-line) !important;
    box-shadow: var(--kk-sys-shadow-2) !important;
  }

  body.kk-command .legal-topbar .nav-toggle {
    display: inline-flex !important;
  }

  body.kk-command .legal-topbar .legal-nav {
    display: none !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 100% !important;
    z-index: 130 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: 16px 20px calc(20px + env(safe-area-inset-bottom, 0px)) !important;
    background: var(--kk-sys-surface-mid) !important;
    border-bottom: 1px solid var(--kk-sys-line) !important;
    box-shadow: var(--kk-sys-shadow-2) !important;
  }

  body.kk-command .legal-topbar .legal-nav.is-open {
    display: flex !important;
  }

  body.kk-command .legal-topbar .legal-nav a {
    padding: 14px 0 !important;
    border-bottom: 1px solid var(--kk-sys-line) !important;
    min-height: unset !important;
  }

  body.kk-command .legal-topbar .legal-nav a:last-child {
    border-bottom: none !important;
  }
}

/* ===== Light Dossier World Override ===== */
body.kk-command,
body.kk-command.kk-command-page {
  background-color: var(--kk-sys-bg) !important;
  background-image: none !important;
  color: var(--kk-sys-text) !important;
}

body.kk-command .topbar,
body.kk-command .legal-topbar {
  border-bottom: 1px solid var(--kk-sys-line) !important;
  background: rgba(255, 255, 255, 0.92) !important;
}

body.kk-command .surface,
body.kk-command .legal-card,
body.kk-command .proof-card,
body.kk-command .request-unified,
body.kk-command .os-composition,
body.kk-command .os-output,
body.kk-command .kk-panel,
body.kk-command .cta-strip,
body.kk-command .kk-tool-module-canvas,
body.kk-command .kk-hub-faq details,
body.kk-command .os-card,
body.kk-command .system-lane-card,
body.kk-command .os-output-fact {
  background: var(--kk-sys-surface) !important;
  border: 1px solid var(--kk-sys-line) !important;
  color: var(--kk-sys-text) !important;
  box-shadow: var(--kk-sys-shadow) !important;
}

body.kk-command .muted,
body.kk-command p.muted,
body.kk-command .proof-card p,
body.kk-command .legal-card p,
body.kk-command .surface p,
body.kk-command .brand-tag {
  color: var(--kk-sys-sub) !important;
}

body.kk-command .footer-links a,
body.kk-command .legal-footer-links a {
  color: var(--kk-sys-ink) !important;
  opacity: 0.82 !important;
}

body.kk-command .footer-mark {
  color: var(--kk-sys-ink) !important;
  opacity: 0.38 !important;
}

body.kk-command .section h1,
body.kk-command .section h2,
body.kk-command .section h3,
body.kk-command .section-head h1,
body.kk-command .section-head h2,
body.kk-command .brand-name {
  color: var(--kk-sys-ink) !important;
}

body.kk-command .button.primary,
body.kk-command .button.primary.premium-depth {
  background: var(--kk-sys-ink) !important;
  border-color: var(--kk-sys-ink) !important;
  color: #ffffff !important;
}

body.kk-command .button.primary:hover {
  background: color-mix(in srgb, var(--kk-sys-ink) 88%, var(--kk-sys-bg)) !important;
  border-color: var(--kk-sys-ink) !important;
}

body.kk-command .button.secondary,
body.kk-command .step-rail-step,
body.kk-command .backtop {
  background: var(--kk-sys-surface) !important;
  border-color: var(--kk-sys-line) !important;
  color: var(--kk-sys-ink) !important;
}

body.kk-command .field input,
body.kk-command .field textarea,
body.kk-command input,
body.kk-command textarea,
body.kk-command select {
  background: var(--kk-sys-surface) !important;
  border-color: var(--kk-sys-line) !important;
  color: var(--kk-sys-ink) !important;
}