/* Токены мастерской: тёмная (по умолчанию) и светлая тема через html[data-theme]. */

:root {
  color-scheme: dark;

  --sw-safe-top: env(safe-area-inset-top, 0px);
  --sw-safe-right: env(safe-area-inset-right, 0px);
  --sw-safe-bottom: env(safe-area-inset-bottom, 0px);
  --sw-safe-left: env(safe-area-inset-left, 0px);

  --sw-primary: #0ea5a4;
  --sw-primary-hover: #0b8d8d;

  --sw-architect: #38bdf8;
  --sw-critic: #f97316;
  --sw-judge: #f59e0b;
  --sw-chaos: #14b8a6;

  --sw-success: #10b981;
  --sw-warning: #f59e0b;
  --sw-error: #ef4444;

  --sw-bg-primary: #07131f;
  --sw-bg-secondary: #132436;
  --sw-bg-tertiary: #22384f;
  --sw-text-primary: #f5fbff;
  --sw-text-secondary: #9cb3c5;

  --sw-border: rgba(148, 163, 184, 0.28);
  --sw-header-bg: rgba(30, 41, 59, 0.88);
  --sw-header-border: rgba(148, 163, 184, 0.14);
  --sw-modal-surface: rgba(30, 41, 59, 0.94);
  --sw-modal-border: rgba(148, 163, 184, 0.18);
  --sw-modal-shadow: 0 12px 48px rgba(0, 0, 0, 0.45);
  --sw-overlay-scrim: rgba(0, 0, 0, 0.55);
  --sw-program-code-bg: rgba(20, 184, 166, 0.14);
  --sw-scenario-selected-bg: rgba(14, 165, 164, 0.12);
  --sw-mesh-1: rgba(20, 184, 166, 0.22);
  --sw-mesh-2: rgba(249, 115, 22, 0.12);
  --sw-mesh-3: rgba(56, 189, 248, 0.14);
  --sw-disclaimer-bg: rgba(255, 193, 7, 0.1);
  --sw-disclaimer-accent: #ffc107;
  --sw-theme-meta: #07131f;
  --sw-secrets-border: rgba(245, 158, 11, 0.45);
  --sw-secrets-bg: rgba(245, 158, 11, 0.08);

  /* Движение: плавность «как в системе», без лишних пружин */
  --sw-ease-out: cubic-bezier(0.25, 0.1, 0.25, 1);
  --sw-ease-emphasized: cubic-bezier(0.2, 0.8, 0.2, 1);
  --sw-duration-fast: 0.2s;
  --sw-duration-normal: 0.32s;
  --sw-card-hover-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
}

html[data-theme="light"] {
  color-scheme: light;

  --sw-primary: #0f766e;
  --sw-primary-hover: #0d5f59;

  --sw-architect: #0284c7;
  --sw-critic: #c2410c;
  --sw-judge: #d97706;
  --sw-chaos: #0f766e;

  --sw-success: #059669;
  --sw-warning: #d97706;
  --sw-error: #dc2626;

  --sw-bg-primary: #f3f8fb;
  --sw-bg-secondary: #ffffff;
  --sw-bg-tertiary: #dce8ef;
  --sw-text-primary: #0f1b2a;
  --sw-text-secondary: #526576;

  --sw-border: rgba(15, 23, 42, 0.12);
  --sw-header-bg: rgba(255, 255, 255, 0.92);
  --sw-header-border: rgba(15, 23, 42, 0.08);
  --sw-modal-surface: rgba(255, 255, 255, 0.98);
  --sw-modal-border: rgba(15, 23, 42, 0.1);
  --sw-modal-shadow: 0 12px 40px rgba(15, 23, 42, 0.1);
  --sw-overlay-scrim: rgba(15, 23, 42, 0.35);
  --sw-program-code-bg: rgba(15, 118, 110, 0.12);
  --sw-scenario-selected-bg: rgba(15, 118, 110, 0.15);
  --sw-mesh-1: rgba(15, 118, 110, 0.12);
  --sw-mesh-2: rgba(249, 115, 22, 0.06);
  --sw-mesh-3: rgba(14, 165, 233, 0.09);
  --sw-disclaimer-bg: rgba(245, 158, 11, 0.12);
  --sw-disclaimer-accent: #d97706;
  --sw-theme-meta: #f3f8fb;
  --sw-secrets-border: rgba(217, 119, 6, 0.42);
  --sw-secrets-bg: rgba(245, 158, 11, 0.12);
  --sw-card-hover-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
}

/* Как в системе: при светлой ОС — те же токены, что и у явной светлой темы */
@media (prefers-color-scheme: light) {
  html[data-theme="system"] {
    color-scheme: light;

    --sw-primary: #0f766e;
    --sw-primary-hover: #0d5f59;

    --sw-architect: #0284c7;
    --sw-critic: #c2410c;
    --sw-judge: #d97706;
    --sw-chaos: #0f766e;

    --sw-success: #059669;
    --sw-warning: #d97706;
    --sw-error: #dc2626;

    --sw-bg-primary: #f3f8fb;
    --sw-bg-secondary: #ffffff;
    --sw-bg-tertiary: #dce8ef;
    --sw-text-primary: #0f1b2a;
    --sw-text-secondary: #526576;

    --sw-border: rgba(15, 23, 42, 0.12);
    --sw-header-bg: rgba(255, 255, 255, 0.92);
    --sw-header-border: rgba(15, 23, 42, 0.08);
    --sw-modal-surface: rgba(255, 255, 255, 0.98);
    --sw-modal-border: rgba(15, 23, 42, 0.1);
    --sw-modal-shadow: 0 12px 40px rgba(15, 23, 42, 0.1);
    --sw-overlay-scrim: rgba(15, 23, 42, 0.35);
    --sw-program-code-bg: rgba(15, 118, 110, 0.12);
    --sw-scenario-selected-bg: rgba(15, 118, 110, 0.15);
    --sw-mesh-1: rgba(15, 118, 110, 0.12);
    --sw-mesh-2: rgba(249, 115, 22, 0.06);
    --sw-mesh-3: rgba(14, 165, 233, 0.09);
    --sw-disclaimer-bg: rgba(245, 158, 11, 0.12);
    --sw-disclaimer-accent: #d97706;
    --sw-theme-meta: #f3f8fb;
    --sw-secrets-border: rgba(217, 119, 6, 0.42);
    --sw-secrets-bg: rgba(245, 158, 11, 0.12);
    --sw-card-hover-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
  }
}

/* Disclaimer */
.disclaimer-container {
  margin: 24px 0;
  padding: 16px;
  background: var(--sw-disclaimer-bg);
  border-left: 4px solid var(--sw-disclaimer-accent);
  border-radius: 8px;
}

.disclaimer-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.disclaimer-icon {
  font-size: 24px;
  margin-bottom: 8px;
}

.disclaimer-text {
  font-size: 14px;
  line-height: 1.5;
  color: var(--sw-text-primary);
  margin: 0;
}

.disclaimer-checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  cursor: pointer;
}

.disclaimer-checkbox input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

#disclaimer-accept-btn:disabled,
#stage5-disclaimer-accept-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}