/* Default Theme - CSS Custom Properties */
:root {
  /* Backgrounds */
  --primary-bg: #f8f9fa;
  --secondary-bg: #ffffff;
  --navbar-bg: #ffffff;
  --story-bg: #f8f9fa;
  --input-bg: #ffffff;
  --hover-bg: #f8f9fa;
  --overlay-bg: rgba(0, 0, 0, 0.5);

  /* Text */
  --text-primary: #212529;
  --text-secondary: #59636e;
  --text-muted: #626d78;
  --text-on-accent: #ffffff;

  /* Accent */
  --accent-color: #0d6efd;
  --accent-color-alpha: rgba(13, 110, 253, 0.25);
  --accent-hover-bg: rgba(0, 123, 255, 0.1);
  --accent-hover-border: rgba(0, 123, 255, 0.2);

  /* Borders */
  --border-color: #dee2e6;

  /* Panel / character info (stats, equipment, spells) */
  --panel-bg: #f4f5f6;
  --panel-border: #d0d4da;
  --panel-text: #1f2328;
  --badge-bg: #e8eaed;
  --badge-text: #202428;
  --spell-badge-bg: #e6ebf7;
  --spell-badge-border: #c7d2ec;
  --spell-badge-text: #2f3b68;
  --features-bg: #edf0f5;
  --stats-section-bg: #f1f2f4;
  --stats-section-border: #d4d7dc;

  /* Buttons */
  --btn-primary-bg: #0d6efd;
  --btn-secondary-bg: #6c757d;
  --btn-success-bg: #198754;
  --btn-danger-bg: #dc3545;

  /* Shared play controls: every theme defines the full token contract. */
  --play-session-label: #084298;
  --play-session-bg: var(--panel-bg);
  --play-session-text: var(--text-primary);
  --play-hud-bg: var(--secondary-bg);
  --play-hud-border: var(--border-color);
  --play-menu-bg: var(--secondary-bg);
  --play-menu-hover: var(--hover-bg);
  --play-menu-divider: var(--border-color);
  --play-surface-bg: var(--secondary-bg);
  --play-choices-bg: var(--secondary-bg);
  --play-surface-border: var(--border-color);
  --play-surface-shadow: 0 2px 12px rgba(33, 37, 41, .08);
  --play-focus-border: var(--accent-color);
  --play-focus-ring: 0 0 0 .2rem var(--accent-color-alpha);
  --play-focus-outline: var(--accent-color);
  --play-divider: var(--border-color);
  --play-subtle-border: var(--border-color);
  --play-subtle-hover: var(--hover-bg);
  --play-selection-bg: var(--accent-hover-bg);
  --play-badge-text: #084298;
  --play-choice-hover: var(--hover-bg);
  --play-choice-hover-text: var(--text-primary);
  --play-mode-hint-bg: var(--accent-hover-bg);
  --play-mode-bg: var(--secondary-bg);
  --play-mode-focus: var(--accent-color);
  --play-positive-text: #146c43;
  --play-negative-text: #b02a37;
  --play-history-border: var(--border-color);
  --play-accent-divider: var(--accent-hover-border);
  --play-input-placeholder: var(--text-secondary);
  --play-choices-placeholder: var(--text-secondary);
  --play-input-marker: var(--accent-hover-bg);
  --play-input-seam: var(--border-color);
  --play-cancel-bg: var(--secondary-bg);
  --play-cancel-hover: var(--hover-bg);
  --play-cancel-text: #084298;
  --play-cancel-border: var(--accent-color);
  --play-cancel-shadow: 0 2px 12px rgba(33, 37, 41, .12);
  --play-reader-fade: linear-gradient(180deg, rgba(248, 249, 250, 0) 0%, rgba(248, 249, 250, .92) 100%);
  --play-reader-bg: var(--secondary-bg);
  --play-reader-text: #084298;
  --play-reader-border: var(--accent-color);
  --play-reader-shadow: 0 2px 12px rgba(33, 37, 41, .12);
  --play-loading-bg: var(--secondary-bg);
  --play-loading-border: var(--border-color);
  --play-loading-text: var(--text-secondary);
  --play-loading-shadow: 0 2px 12px rgba(33, 37, 41, .08);
  --play-switch-bg: var(--hover-bg);
  --play-switch-glow: var(--accent-color-alpha);
  --play-switch-ring: var(--accent-color-alpha);
  --play-choice-plain-bg: var(--hover-bg);
  --play-choice-plain-hover: #e9ecef;
  --play-choice-plain-hover-border: #adb5bd;
  --play-choice-active-bg: #dee2e6;
  --play-choice-disabled-bg: #e9ecef;
  --play-choice-custom-bg: linear-gradient(135deg, #f0f4ff 0%, #e0e8ff 100%);
  --play-choice-custom-hover: linear-gradient(135deg, #e0e8ff 0%, #d0d8ff 100%);
}