html[data-theme="expedition"] {
  --bg: #2f3835;
  --text: #f5f1e8;
  --hint: #b8c8bc;
  --vine: #6aad78;
  --vine-deep: #4d8a5c;
  --vine-glow: rgba(106, 173, 120, 0.2);
  --accent: var(--vine);
  --accent-text: #fafff5;
  --secondary: rgba(74, 84, 80, 0.22);
  --border: rgba(138, 170, 145, 0.45);
  --field-bg: rgba(58, 67, 64, 0.35);
  --card-glass-bg: rgba(245, 241, 232, 0.06);
  --panel-glass-bg: rgba(245, 241, 232, 0.05);
  --btn-glass-bg: rgba(245, 241, 232, 0.08);
  --btn-glass-bg-accent: rgba(106, 173, 120, 0.12);
  --btn-glass-border: rgba(138, 170, 145, 0.42);
  --btn-glass-border-accent: rgba(184, 220, 196, 0.55);
  --theme-panel-border: #7ec08d;
  --theme-surface-blur: blur(3px);
  --error-bg: #4a3538;
  --error-text: #ffc8c8;
  --danger-bg: #523438;
  --danger-text: #ffd0d0;
  --accent-soft: rgba(106, 173, 120, 0.16);
  --chart-training-yes: #72b583;
  --chart-training-no: #7a8680;
  --chart-routes-value: #6aad78;
  --chart-routes-zero: #8a9390;
  --heading-font: Georgia, "Times New Roman", serif;
  --surface-shadow: 0 4px 16px rgba(0, 0, 0, 0.26);
  --btn-accent-bg: linear-gradient(
    180deg,
    rgba(126, 192, 141, 0.55),
    rgba(77, 138, 92, 0.45)
  );
  --btn-accent-text: #fafff5;
  --btn-accent-shadow: none;
  --fab-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
  --accent-border-left: #7ec08d;

  --theme-heading: #faf6ee;
  --theme-subheading: #b8dcc4;
  --theme-strong: #faf6ee;
  --theme-countdown-color: var(--vine);
  --theme-done-task: #95a89a;
  --theme-checkbox-accent: var(--vine);
  --theme-bar-from: var(--vine-deep);
  --theme-bar-to: var(--vine);
  --theme-modal-backdrop: rgba(20, 28, 24, 0.62);
  --theme-date-btn-text: #c8efd4;
  --theme-accent-glow: var(--vine-glow);
  --theme-cal-today-outline: var(--vine);
}

html[data-theme="expedition"],
html[data-theme="expedition"] body {
  min-height: 100vh;
  min-height: 100dvh;
  background-color: var(--bg);
  background-image:
    linear-gradient(rgba(38, 45, 42, 0.42), rgba(38, 45, 42, 0.52)),
    url("/background.jpg?v=20260602-2");
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  background-attachment: scroll;
}

/* Glass surfaces — more opaque than K-pop, still shows background */
html[data-theme="expedition"] #app .section-card {
  background: var(--card-glass-bg);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  border: 1px solid var(--btn-glass-border-accent);
  border-left: 3px solid var(--accent-border-left);
  box-shadow: none;
}

html[data-theme="expedition"] #app .area-block,
html[data-theme="expedition"] #app .stat-card,
html[data-theme="expedition"] #app .day-stat,
html[data-theme="expedition"] #app .chart-block,
html[data-theme="expedition"] #app .timer-card,
html[data-theme="expedition"] #app .timer-field,
html[data-theme="expedition"] #app .modal-panel,
html[data-theme="expedition"] #app .settings-block {
  background: var(--panel-glass-bg);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  border: 1px solid var(--btn-glass-border);
  border-left: 3px solid var(--accent-border-left);
  box-shadow: none;
}

html[data-theme="expedition"] #app .stats-btn,
html[data-theme="expedition"] #app .timer-add-btn {
  background: var(--btn-accent-bg);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid var(--btn-glass-border-accent);
  box-shadow: var(--fab-shadow);
}

html[data-theme="expedition"] #app .icon-btn,
html[data-theme="expedition"] #app .secondary-btn,
html[data-theme="expedition"] #app .timer-phase-btn,
html[data-theme="expedition"] #app .settings-toggle,
html[data-theme="expedition"] #app .theme-option,
html[data-theme="expedition"] #app .calendar-header button,
html[data-theme="expedition"] #app .timer-action,
html[data-theme="expedition"] #app .date-btn {
  background: var(--btn-glass-bg);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  border: 1px solid var(--btn-glass-border);
  box-shadow: none;
}

html[data-theme="expedition"] #app .date-btn {
  background: var(--btn-glass-bg-accent);
  color: var(--theme-date-btn-text);
  border-color: var(--btn-glass-border-accent);
  box-shadow: inset 3px 0 0 var(--accent-border-left);
}

html[data-theme="expedition"] #app .timer-phase-btn-active,
html[data-theme="expedition"] #app .timer-field-active,
html[data-theme="expedition"] #app .theme-option.selected,
html[data-theme="expedition"] #app .settings-toggle.is-on {
  background: var(--accent-soft);
  border-color: var(--btn-glass-border-accent);
}

html[data-theme="expedition"] #app .theme-option.selected,
html[data-theme="expedition"] #app .settings-toggle.is-on {
  border-left-color: var(--accent-border-left);
}

html[data-theme="expedition"] #app .cal-day.selected {
  background: var(--btn-accent-bg);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid var(--btn-glass-border-accent);
}

html[data-theme="expedition"] #app .timer-form input,
html[data-theme="expedition"] #app .task-number-input {
  background: var(--field-bg);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  border: 1px solid var(--btn-glass-border);
}
