/* DOKAIDU Hybrid Light Premium design system v1
   Shared visual layer only. Product and data logic remain page-owned. */

:root {
  color-scheme: light;
  --brand-red: #ff2a4e;
  --brand-red-hover: #e61e45;
  --brand-red-soft: #fff0f3;
  --brand-red-border: #ffd3dc;
  --page-bg: #f7f8fb;
  --surface-primary: #ffffff;
  --surface-secondary: #f2f4f8;
  --surface-muted: #eceff4;
  --text-primary: #121826;
  --text-secondary: #364152;
  --text-muted: #6c7385;
  --sidebar-bg: #0f1724;
  --sidebar-surface: #17202e;
  --dark-text: #f8fafc;
  --border-default: #e1e5ec;
  --border-strong: #cdd3dd;
  --success: #168b67;
  --success-soft: #eaf8f2;
  --warning: #b96d09;
  --warning-soft: #fff7e8;
  --danger: #d43c45;
  --danger-soft: #fff0f1;
  --info: #2563d8;
  --info-soft: #eef5ff;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 2rem;
  --space-8: 2.5rem;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --shadow-sm: 0 1px 2px rgba(18, 24, 38, .05), 0 5px 18px rgba(18, 24, 38, .04);
  --shadow-md: 0 18px 45px rgba(18, 24, 38, .09);
  --transition-fast: 160ms ease;
  --transition-base: 220ms ease;
  --focus-ring: 0 0 0 3px rgba(255, 42, 78, .22);
  --dokaidu-shell-sidebar-width: 248px;
  --dokaidu-shell-red: var(--brand-red);
  --dokaidu-shell-line: rgba(255, 255, 255, .1);

  /* Compatibility aliases for existing pages. */
  --red: var(--brand-red);
  --red2: var(--brand-red);
  --red-soft: var(--brand-red-soft);
  --d-red: var(--brand-red);
  --d-red-soft: var(--brand-red-soft);
  --dokaidu: var(--brand-red);
  --bg: var(--page-bg);
  --panel: var(--surface-primary);
  --panel-2: var(--surface-secondary);
  --panel2: var(--surface-secondary);
  --panel3: var(--surface-muted);
  --card: var(--surface-primary);
  --line: var(--border-default);
  --line2: var(--border-strong);
  --text: var(--text-primary);
  --muted: var(--text-muted);
  --muted2: var(--text-muted);
  --green: var(--success);
  --amber: var(--warning);
  --orange: var(--warning);
  --blue: var(--info);
  --purple: var(--info);
  --radius: var(--radius-lg);
  --shadow: var(--shadow-md);
}

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; background: var(--page-bg); scroll-behavior: smooth; }

body[data-dokaidu-page] {
  min-width: 320px;
  min-height: 100vh;
  overflow-x: hidden;
  background: radial-gradient(circle at 88% -12%, rgba(255, 42, 78, .08), transparent 30rem), var(--page-bg);
  color: var(--text-primary);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
body[data-dokaidu-page] a { color: inherit; }
body[data-dokaidu-page] button,
body[data-dokaidu-page] input,
body[data-dokaidu-page] select,
body[data-dokaidu-page] textarea { font: inherit; }
body[data-dokaidu-page] :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid rgba(255, 42, 78, .34);
  outline-offset: 2px;
  box-shadow: var(--focus-ring);
}
body[data-dokaidu-page] :where(button, a, input, select, textarea) {
  transition: color var(--transition-fast), background-color var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

/* App shell */
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 200;
  display: flex;
  flex-direction: column;
  width: var(--dokaidu-shell-sidebar-width);
  padding: 20px 13px 16px;
  overflow-y: auto;
  background: radial-gradient(circle at 0 0, rgba(255, 42, 78, .12), transparent 18rem), var(--sidebar-bg);
  border-right: 1px solid var(--dokaidu-shell-line);
  color: var(--dark-text);
  box-shadow: 12px 0 32px rgba(15, 23, 36, .08);
  transition: transform var(--transition-base);
}
.sidebar.open { transform: translateX(0); }
.sidebar .brand-wrap { padding: 5px 10px 27px; }
.sidebar :where(.brand, .sidebar-brand) {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 35px;
  color: var(--dark-text);
  font-size: 19px;
  font-weight: 900;
  line-height: 1;
}
.sidebar .brand-logo,
.sidebar .sidebar-brand img {
  flex: 0 0 35px;
  width: 35px;
  height: 35px;
  object-fit: contain;
  filter: drop-shadow(0 8px 16px rgba(255, 42, 78, .22));
}
.sidebar .brand-name span,
.sidebar .sidebar-brand strong span { color: var(--brand-red); }
.sidebar [data-dokaidu-navigation] { display: flex; flex-direction: column; gap: 5px; }
.sidebar [data-dokaidu-navigation] a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  color: #aab4c2;
  font-size: 12px;
  font-weight: 760;
  text-decoration: none;
}
.sidebar [data-dokaidu-navigation] a:hover { color: #fff; background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .08); }
.sidebar [data-dokaidu-navigation] a.active {
  color: #fff;
  background: linear-gradient(90deg, rgba(255, 42, 78, .22), rgba(255, 42, 78, .08));
  border-color: rgba(255, 42, 78, .3);
  box-shadow: inset 3px 0 0 var(--brand-red);
}
.sidebar [data-dokaidu-navigation] .nav-icon {
  display: grid;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  place-items: center;
  color: #8490a0;
  font-size: 15px;
}
.sidebar [data-dokaidu-navigation] a.active .nav-icon { color: #ff8ba0; }
.sidebar :where(.sidebar-bottom) {
  margin-top: auto;
  padding: 14px 8px 4px;
  border-top: 1px solid rgba(255, 255, 255, .08);
  color: #7f8b9a;
  font-size: 10px;
  line-height: 1.6;
}
.sidebar :where(.user-avatar) { background: var(--sidebar-surface); border-color: rgba(255, 255, 255, .12); color: #fff; }
.sidebar :where(.user-name) { color: #f8fafc; }
.sidebar :where(.user-id, .sidebar-note) { color: #7f8b9a; }
.sidebar :where(.signout-btn) { min-height: 40px; background: var(--sidebar-surface); border-color: rgba(255, 255, 255, .09); color: #b8c1cd; }
.sidebar :where(.signout-btn):hover { color: #fff; border-color: rgba(255, 42, 78, .38); background: rgba(255, 42, 78, .13); }
.sidebar .close-sidebar-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0 0 12px auto;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: var(--radius-sm);
  background: var(--sidebar-surface);
  color: #fff;
  font-size: 20px;
}
.sidebar-overlay {
  position: fixed;
  inset: 0;
  z-index: 190;
  display: block;
  background: rgba(15, 23, 36, .64);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition-base);
}
.sidebar-overlay.open,
.sidebar-overlay.show { opacity: 1; pointer-events: auto; }
body.dokaidu-drawer-open { overflow: hidden; }
.main { min-height: 100vh; margin-left: var(--dokaidu-shell-sidebar-width); background: transparent; }
.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  min-height: 72px;
  background: rgba(255, 255, 255, .92);
  border-bottom: 1px solid var(--border-default);
  color: var(--text-primary);
  box-shadow: 0 1px 0 rgba(18, 24, 38, .02);
  backdrop-filter: blur(18px);
}
.topbar :where(.brand-title, .page-title, .topbar-title) { color: var(--text-primary); }
.topbar :where(.brand-subtitle, .page-kicker) { color: var(--text-muted); }
.topbar :where(.topbar-kicker, .eyebrow) { color: var(--brand-red); }
.mobile-menu-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-primary);
  color: var(--text-primary);
  box-shadow: var(--shadow-sm);
  font-size: 20px;
}

/* Shared component language */
body[data-dokaidu-page] :where(.eyebrow, .page-kicker, .topbar-kicker, .section-kicker) {
  color: var(--brand-red);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body[data-dokaidu-page] :where(h1, h2, h3, strong) { color: var(--text-primary); }
body[data-dokaidu-page] :where(.page-intro p, .page-heading p, .section-sub) { color: var(--text-muted); }
body[data-dokaidu-page] :where(.button, .profile-action, .reward-button) { min-height: 44px; border-radius: var(--radius-md); font-weight: 800; }
body[data-dokaidu-page] :where(.button, .profile-action):not(.primary) {
  border-color: var(--border-default);
  background: var(--surface-primary);
  color: var(--text-secondary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page] :where(.button, .profile-action):not(.primary):hover { border-color: var(--brand-red-border); background: var(--brand-red-soft); color: var(--brand-red-hover); }
body[data-dokaidu-page] :where(.button.primary, .profile-action.primary) {
  border-color: var(--brand-red);
  background: var(--brand-red);
  color: #fff;
  box-shadow: 0 8px 18px rgba(255, 42, 78, .18);
}
body[data-dokaidu-page] :where(.button.primary, .profile-action.primary):hover { border-color: var(--brand-red-hover); background: var(--brand-red-hover); }
body[data-dokaidu-page] :where(input, select, textarea) { border-color: var(--border-default); background: var(--surface-primary); color: var(--text-primary); }
body[data-dokaidu-page] :where(input, select, textarea):focus { border-color: var(--brand-red); box-shadow: var(--focus-ring); }
body[data-dokaidu-page] :where(input, select, textarea)::placeholder { color: #9098a8; }

/* Daily */
body[data-dokaidu-page="daily"] { background: radial-gradient(circle at 82% -8%, rgba(255, 42, 78, .09), transparent 32rem), var(--page-bg); }
body[data-dokaidu-page="daily"] .content { max-width: 1480px; }
body[data-dokaidu-page="daily"] .hero-panel {
  background: radial-gradient(circle at 94% 16%, rgba(255, 42, 78, .12), transparent 18rem), linear-gradient(145deg, #fff, #fff8f9);
  border-color: var(--border-default);
  box-shadow: var(--shadow-md);
}
body[data-dokaidu-page="daily"] .hero-panel::after { border-color: var(--brand-red-border); }
body[data-dokaidu-page="daily"] .hero h1 { color: var(--text-primary); }
body[data-dokaidu-page="daily"] .hero p { color: var(--text-secondary); font-size: 13px; }
body[data-dokaidu-page="daily"] .hero-chip { border-color: var(--brand-red-border); background: var(--brand-red-soft); color: #9d263c; }
body[data-dokaidu-page="daily"] .id-card-label { color: var(--text-muted); }
body[data-dokaidu-page="daily"] :where(.section-sub, .eco-head p) { color: var(--text-muted); font-size: 11px; }
body[data-dokaidu-page="daily"] :where(.period, .icon-btn, .refresh-btn, .status-pill) {
  border-color: var(--border-default);
  background: var(--surface-primary);
  color: var(--text-secondary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="daily"] .strava-action-btn { min-height: 38px; border-color: var(--brand-red-border); background: var(--brand-red-soft); color: var(--brand-red-hover); }
body[data-dokaidu-page="daily"] .strava-action-btn.connected { border-color: #bce8d8; background: var(--success-soft); color: var(--success); }
body[data-dokaidu-page="daily"] :where(.kpi, .card, .member-stat, .mission-card, .member-card, .reward-card, .quick-card) {
  border-color: var(--border-default);
  background: var(--surface-primary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="daily"] :where(.card-head, .member-card-head) { border-bottom-color: var(--border-default); }
body[data-dokaidu-page="daily"] :where(.kpi-label, .member-stat .label, .reward-kicker) { color: var(--text-muted); }
body[data-dokaidu-page="daily"] :where(.kpi-sub, .member-stat .sub, .mission-card p, .reward-card p, .feedback p, .feedback li) { color: var(--text-muted); }
body[data-dokaidu-page="daily"] .mission-card.active { border-color: var(--brand-red-border); box-shadow: inset 3px 0 0 var(--brand-red), var(--shadow-sm); }
body[data-dokaidu-page="daily"] .mission-card.locked { background: var(--surface-secondary); opacity: .72; }
body[data-dokaidu-page="daily"] .mission-status,
body[data-dokaidu-page="daily"] .type-pill { background: var(--surface-secondary); color: var(--text-muted); }
body[data-dokaidu-page="daily"] .mission-card.active .mission-status,
body[data-dokaidu-page="daily"] .feedback-badge { background: var(--brand-red-soft); color: var(--brand-red-hover); }
body[data-dokaidu-page="daily"] .mission-btn { min-height: 40px; border-color: var(--brand-red-border); background: var(--brand-red-soft); color: var(--brand-red-hover); }
body[data-dokaidu-page="daily"] :where(.performance-item, .insight, .quick-action, .access-row) { border-color: var(--border-default); background: var(--surface-secondary); }
body[data-dokaidu-page="daily"] :where(.score-ring::after, .donut::after, .reward-ring::after) { background: var(--surface-primary); }
body[data-dokaidu-page="daily"] :where(.scale-track, .xp-track, .progress-bar) { background: var(--surface-muted); }
body[data-dokaidu-page="daily"] .badge-medal { border-color: var(--border-default); background: var(--surface-secondary); box-shadow: none; }
body[data-dokaidu-page="daily"] .badge-item.unlocked .badge-medal { border-color: var(--brand-red-border); background: var(--brand-red-soft); }
body[data-dokaidu-page="daily"] :where(.badge-name, .activity-name, .eco-activity strong, .mix-row strong) { color: var(--text-secondary); }
body[data-dokaidu-page="daily"] :where(.badge-sub, .activity-date, .eco-activity span, .mix-name, .connection-state, .service span) { color: var(--text-muted); }
body[data-dokaidu-page="daily"] .cal-day { background: var(--surface-secondary); color: var(--text-secondary); }
body[data-dokaidu-page="daily"] .cal-day.muted { background: transparent; color: #a8afbc; }
body[data-dokaidu-page="daily"] .cal-day.today { color: var(--brand-red-hover); }
body[data-dokaidu-page="daily"] .activity-table th { background: var(--surface-secondary); border-bottom-color: var(--border-default); color: var(--text-muted); }
body[data-dokaidu-page="daily"] .activity-table td { border-bottom-color: var(--border-default); color: var(--text-secondary); }
body[data-dokaidu-page="daily"] .activity-controls :where(select, input) { background: var(--surface-primary); color: var(--text-secondary); }
body[data-dokaidu-page="daily"] .disconnect { background: var(--surface-primary); color: var(--text-secondary); }
body[data-dokaidu-page="daily"] .data-status {
  border-color: var(--border-strong);
  background: var(--surface-secondary);
  color: var(--text-muted);
  font-size: 9px;
}
body[data-dokaidu-page="daily"] .data-status strong { color: var(--text-secondary); }
body[data-dokaidu-page="daily"] .demo-banner {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin: 24px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--brand-red-border);
  border-radius: var(--radius-md);
  background: var(--brand-red-soft);
  color: #7f3342;
  font-size: 11px;
  line-height: 1.55;
}
body[data-dokaidu-page="daily"] .demo-banner strong { color: var(--brand-red-hover); }

/* Schedule */
body[data-dokaidu-page="schedule"] .page { max-width: 1240px; }
body[data-dokaidu-page="schedule"] .page-intro p { color: var(--text-secondary); font-size: 13px; }
body[data-dokaidu-page="schedule"] .view-switch { border-color: var(--border-default); background: var(--surface-muted); }
body[data-dokaidu-page="schedule"] .view-switch button { min-height: 36px; color: var(--text-muted); }
body[data-dokaidu-page="schedule"] .view-switch button.active { background: var(--surface-primary); color: var(--brand-red-hover); box-shadow: var(--shadow-sm); }
body[data-dokaidu-page="schedule"] .schedule-status { padding: 12px 14px; border-color: var(--border-default); background: var(--surface-primary); color: var(--text-secondary); box-shadow: var(--shadow-sm); }
body[data-dokaidu-page="schedule"] .schedule-status.loading { border-color: #f3d39d; background: var(--warning-soft); color: #885208; }
body[data-dokaidu-page="schedule"] .schedule-status.success { border-color: #bce8d8; background: var(--success-soft); color: var(--success); }
body[data-dokaidu-page="schedule"] .schedule-status.error { border-color: #f3c4c8; background: var(--danger-soft); color: var(--danger); }
body[data-dokaidu-page="schedule"] .summary-grid { gap: 12px; overflow: visible; border: 0; background: transparent; }
body[data-dokaidu-page="schedule"] .summary-stat {
  padding: 17px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-primary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="schedule"] .summary-stat strong { color: var(--text-primary); }
body[data-dokaidu-page="schedule"] :where(.summary-stat > span, .summary-stat small, .section-count, .section-kicker) { color: var(--text-muted); }
body[data-dokaidu-page="schedule"] .schedule-section {
  padding: 20px;
  border-color: var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-primary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="schedule"] .week-label { color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .week-day { border-color: var(--border-default); background: var(--surface-secondary); color: var(--text-primary); }
body[data-dokaidu-page="schedule"] .week-day:hover,
body[data-dokaidu-page="schedule"] .week-day.selected { border-color: var(--brand-red); background: var(--brand-red-soft); }
body[data-dokaidu-page="schedule"] :where(.week-day-name, .week-day-count, .timetable-note) { color: var(--text-muted); }
body[data-dokaidu-page="schedule"] .week-selection { border-top-color: var(--border-default); }
body[data-dokaidu-page="schedule"] .timetable-scroll { border-color: var(--border-default); background: var(--surface-primary); }
body[data-dokaidu-page="schedule"] :where(.timetable-corner, .timetable-day-head) { border-bottom-color: var(--border-default); background: var(--surface-secondary); color: var(--text-primary); }
body[data-dokaidu-page="schedule"] .timetable-day-head { border-left-color: var(--border-default); }
body[data-dokaidu-page="schedule"] .timetable-time-axis { background: var(--surface-secondary); }
body[data-dokaidu-page="schedule"] .timetable-time-label { color: var(--text-muted); }
body[data-dokaidu-page="schedule"] .timetable-day-column {
  border-left-color: var(--border-default);
  background-color: #fff;
  background-image: linear-gradient(to bottom, rgba(18, 24, 38, .09) 1px, transparent 1px), linear-gradient(to bottom, rgba(18, 24, 38, .035) 1px, transparent 1px);
}
body[data-dokaidu-page="schedule"] .timetable-block { border-color: var(--border-default); background: var(--surface-primary); color: var(--text-primary); box-shadow: var(--shadow-sm); }
body[data-dokaidu-page="schedule"] .timetable-block span { color: var(--text-muted); }
body[data-dokaidu-page="schedule"] :where(.schedule-item-row, .task-row) { border-top-color: var(--border-default); }
body[data-dokaidu-page="schedule"] :where(.item-time, .item-title, .task-title, .free-total) { color: var(--text-primary); }
body[data-dokaidu-page="schedule"] :where(.item-meta, .task-meta, .free-total span, .empty-state) { color: var(--text-muted); }
body[data-dokaidu-page="schedule"] .icon-action { min-height: 36px; color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .icon-action:hover { color: var(--brand-red-hover); }
body[data-dokaidu-page="schedule"] .icon-action.danger { color: var(--danger); }
body[data-dokaidu-page="schedule"] .window-list li { background: var(--success-soft); color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .academic-section {
  background: radial-gradient(circle at 100% 0, rgba(255, 42, 78, .1), transparent 19rem), var(--surface-primary);
  border-color: var(--brand-red-border);
}
body[data-dokaidu-page="schedule"] .preview-badge { border-color: var(--brand-red-border); background: var(--brand-red-soft); color: var(--brand-red-hover); }
body[data-dokaidu-page="schedule"] .break-control select,
body[data-dokaidu-page="schedule"] .task-status-select,
body[data-dokaidu-page="schedule"] .timezone-lock { border-color: var(--border-default); background: var(--surface-primary); color: var(--text-primary); }
body[data-dokaidu-page="schedule"] .academic-overview { border-color: var(--border-default); background: var(--surface-secondary); }
body[data-dokaidu-page="schedule"] .capacity-status-card { border-color: #bce8d8; background: var(--success-soft); }
body[data-dokaidu-page="schedule"] .capacity-status-card.tight { border-color: #f3d39d; background: var(--warning-soft); }
body[data-dokaidu-page="schedule"] .capacity-status-card.risk,
body[data-dokaidu-page="schedule"] .capacity-status-card.overdue { border-color: #f3c4c8; background: var(--danger-soft); }
body[data-dokaidu-page="schedule"] .capacity-status-card.planning { border-color: #bfd3fa; background: var(--info-soft); }
body[data-dokaidu-page="schedule"] .capacity-status-head strong { color: var(--success); }
body[data-dokaidu-page="schedule"] .capacity-status-card.tight .capacity-status-head strong { color: var(--warning); }
body[data-dokaidu-page="schedule"] .capacity-status-card.risk .capacity-status-head strong,
body[data-dokaidu-page="schedule"] .capacity-status-card.overdue .capacity-status-head strong { color: var(--danger); }
body[data-dokaidu-page="schedule"] .capacity-status-card.planning .capacity-status-head strong { color: var(--info); }
body[data-dokaidu-page="schedule"] :where(.capacity-comparison strong, .academic-metric strong, .recommendation-title, .session-fact strong) { color: var(--text-primary); }
body[data-dokaidu-page="schedule"] :where(.capacity-note, .academic-metric small, .capacity-comparison span) { color: var(--text-muted); }
body[data-dokaidu-page="schedule"] :where(.capacity-load, .factor-track) { background: var(--surface-muted); }
body[data-dokaidu-page="schedule"] .academic-metric { border-color: var(--border-default); background: var(--surface-primary); }
body[data-dokaidu-page="schedule"] .academic-metric.warning strong { color: var(--danger); }
body[data-dokaidu-page="schedule"] .recommendation-card {
  border-color: var(--brand-red-border);
  background: linear-gradient(145deg, var(--brand-red-soft), #fff 62%);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="schedule"] .academic-badge { border-color: var(--border-default); background: var(--surface-primary); color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .academic-badge.priority-urgent,
body[data-dokaidu-page="schedule"] .academic-badge.overdue { border-color: #f3c4c8; background: var(--danger-soft); color: var(--danger); }
body[data-dokaidu-page="schedule"] .academic-badge.priority-high,
body[data-dokaidu-page="schedule"] .academic-badge.catch-up { border-color: #f3d39d; background: var(--warning-soft); color: var(--warning); }
body[data-dokaidu-page="schedule"] .academic-badge.priority-normal { border-color: #bfd3fa; background: var(--info-soft); color: var(--info); }
body[data-dokaidu-page="schedule"] .session-facts,
body[data-dokaidu-page="schedule"] .academic-review-summary { border-color: var(--border-default); background: var(--border-default); }
body[data-dokaidu-page="schedule"] :where(.session-fact, .academic-review-row) { background: var(--surface-primary); }
body[data-dokaidu-page="schedule"] .alternative-time { min-height: 36px; border-color: var(--border-default); background: var(--surface-primary); color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .alternative-time:hover,
body[data-dokaidu-page="schedule"] .alternative-time.active { border-color: var(--brand-red); background: var(--brand-red-soft); color: var(--brand-red-hover); }
body[data-dokaidu-page="schedule"] .timeline-title,
body[data-dokaidu-page="schedule"] .factor-head strong,
body[data-dokaidu-page="schedule"] .why-panel summary { color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .timeline-item::after { background: var(--border-strong); }
body[data-dokaidu-page="schedule"] .timeline-dot { background: var(--surface-primary); }
body[data-dokaidu-page="schedule"] .timeline-content { background: var(--brand-red-soft); color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .timeline-item.break .timeline-content { background: var(--surface-secondary); color: var(--text-muted); }
body[data-dokaidu-page="schedule"] .why-panel,
body[data-dokaidu-page="schedule"] .academic-decision-actions { border-top-color: var(--border-default); }
body[data-dokaidu-page="schedule"] .preview-safety { color: var(--text-muted); }
body[data-dokaidu-page="schedule"] .dialog {
  border-color: var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-primary);
  color: var(--text-primary);
  box-shadow: 0 28px 90px rgba(15, 23, 36, .25);
}
body[data-dokaidu-page="schedule"] .dialog::backdrop { background: rgba(15, 23, 36, .58); }
body[data-dokaidu-page="schedule"] .dialog-close { border-color: var(--border-default); background: var(--surface-secondary); color: var(--text-primary); }
body[data-dokaidu-page="schedule"] :where(.field label, .check-field, .academic-review-row strong) { color: var(--text-secondary); }
body[data-dokaidu-page="schedule"] .toast { background: var(--sidebar-bg); color: #fff; }

/* Student Space */
body[data-dokaidu-page="student"] .content-shell { max-width: 1180px; }
body[data-dokaidu-page="student"] :where(.hero-copy, .identity-card, .feature-card, .profile-card) {
  border-color: var(--border-default);
  background: var(--surface-primary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="student"] .hero-copy { background: radial-gradient(circle at 92% 10%, rgba(255, 42, 78, .12), transparent 20rem), var(--surface-primary); }
body[data-dokaidu-page="student"] .hero-copy::after { color: rgba(255, 42, 78, .05); }
body[data-dokaidu-page="student"] .hero-copy h1 { max-width: 620px; color: var(--text-primary); font-size: clamp(38px, 6vw, 58px); }
body[data-dokaidu-page="student"] .hero-copy p { color: var(--text-secondary); font-size: 13px; }
body[data-dokaidu-page="student"] .identity-row { border-bottom-color: var(--border-default); }
body[data-dokaidu-page="student"] .identity-row span { color: var(--text-muted); }
body[data-dokaidu-page="student"] .identity-row strong { color: var(--text-primary); }
body[data-dokaidu-page="student"] .access { border-color: #bce8d8; background: var(--success-soft); color: var(--success); }
body[data-dokaidu-page="student"] .feature-card { min-height: 150px; }
body[data-dokaidu-page="student"] .feature-card p { color: var(--text-muted); }
body[data-dokaidu-page="student"] .feature-icon { background: var(--brand-red-soft); color: var(--brand-red-hover); }
body[data-dokaidu-page="student"] .status {
  display: inline-flex;
  width: fit-content;
  margin-top: 12px;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--surface-secondary);
  color: var(--text-muted);
}
body[data-dokaidu-page="student"] .field label { color: var(--text-secondary); }
body[data-dokaidu-page="student"] .field :where(input, select, textarea) { border-color: var(--border-default); background: var(--surface-primary); color: var(--text-primary); }
body[data-dokaidu-page="student"] .field-hint { color: var(--text-muted); }
body[data-dokaidu-page="student"] .error { border-color: #f3c4c8; background: var(--danger-soft); color: var(--danger); }

/* Lab and honest unavailable-state pages */
body[data-dokaidu-page="lab"] .lab-grid,
body[data-dokaidu-page="missions"] .mission-grid,
body[data-dokaidu-page="progress"] .progress-grid { gap: 16px; }
body[data-dokaidu-page="lab"] .lab-item,
body[data-dokaidu-page="missions"] .mission-item,
body[data-dokaidu-page="progress"] .progress-item {
  border-color: var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-primary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="lab"] .lab-item.available { border-color: var(--brand-red-border); box-shadow: inset 0 3px 0 var(--brand-red), var(--shadow-sm); }
body[data-dokaidu-page="lab"] .lab-icon {
  display: grid;
  width: 42px;
  height: 42px;
  margin-bottom: 24px;
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--brand-red-soft);
  color: var(--brand-red-hover);
}
body[data-dokaidu-page="lab"] :where(.lab-item p, .lab-status),
body[data-dokaidu-page="missions"] :where(.mission-item p, .mission-state),
body[data-dokaidu-page="progress"] :where(.progress-item p, .progress-state) { color: var(--text-muted); }
body[data-dokaidu-page="lab"] .available .lab-status {
  display: inline-flex;
  width: fit-content;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--brand-red-soft);
  color: var(--brand-red-hover);
}
body[data-dokaidu-page="missions"] .notice {
  border: 1px solid var(--brand-red-border);
  border-left: 4px solid var(--brand-red);
  border-radius: var(--radius-md);
  background: var(--brand-red-soft);
  color: var(--text-secondary);
}
body[data-dokaidu-page="missions"] .mission-state,
body[data-dokaidu-page="progress"] .progress-state {
  display: inline-flex;
  width: fit-content;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--surface-secondary);
}

/* Settings */
body[data-dokaidu-page="settings"] .page { max-width: 1040px; }
body[data-dokaidu-page="settings"] .settings-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  border: 0;
}
body[data-dokaidu-page="settings"] .settings-row {
  display: flex;
  min-height: 150px;
  flex-direction: column;
  gap: 8px;
  padding: 20px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-primary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="settings"] .settings-row h2 { font-size: 16px; }
body[data-dokaidu-page="settings"] .settings-row p { color: var(--text-muted); font-size: 12px; }
body[data-dokaidu-page="settings"] .settings-state {
  display: inline-flex;
  width: fit-content;
  margin-top: auto;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--surface-secondary);
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

/* Body Analysis adopts the shell without changing formulas. */
body[data-dokaidu-page="body-analysis"] .sidebar { padding: 20px 13px 16px; }
body[data-dokaidu-page="body-analysis"] .sidebar-brand { padding: 5px 10px 27px; }
body[data-dokaidu-page="body-analysis"] .sidebar-brand strong { color: #fff; font-size: 19px; }
body[data-dokaidu-page="body-analysis"] .topbar { margin-left: var(--dokaidu-shell-sidebar-width); }
body[data-dokaidu-page="body-analysis"] .page { margin-left: calc(var(--dokaidu-shell-sidebar-width) + 40px); }
body[data-dokaidu-page="body-analysis"] :where(.intro-card, .card, .results, .visual-profile, .metric) {
  border-color: var(--border-default);
  background: var(--surface-primary);
  box-shadow: var(--shadow-sm);
}
body[data-dokaidu-page="body-analysis"] :where(.intro-card, .card) { border-radius: var(--radius-lg); }
body[data-dokaidu-page="body-analysis"] .intro-card { color: var(--text-primary); }
body[data-dokaidu-page="body-analysis"] .intro-card p { color: var(--text-secondary); }
body[data-dokaidu-page="body-analysis"] .intro-card::after { background: var(--brand-soft); }
body[data-dokaidu-page="body-analysis"] :where(.field input, .field select) { border-color: var(--border-default); background: var(--surface-primary); color: var(--text-primary); }
body[data-dokaidu-page="body-analysis"] .calculate-button {
  min-height: 48px;
  border-radius: var(--radius-md);
  background: var(--brand-red);
  box-shadow: 0 10px 24px rgba(255, 42, 78, .2);
}

@media (max-width: 900px) {
  .sidebar { width: min(84vw, 320px); transform: translateX(-105%); box-shadow: 20px 0 50px rgba(15, 23, 36, .32); }
  .sidebar .close-sidebar-btn { display: inline-flex; }
  .mobile-menu-btn { display: inline-flex; }
  .main { margin-left: 0; }
  body[data-dokaidu-page="body-analysis"] .topbar { margin-left: 0; }
  body[data-dokaidu-page="body-analysis"] .page { width: min(100% - 36px, 760px); margin: 28px auto 64px; }
}

@media (max-width: 680px) {
  body[data-dokaidu-page] :where(.page, .content-shell) { width: calc(100% - 24px); }
  body[data-dokaidu-page="daily"] .content { padding-inline: 12px; }
  body[data-dokaidu-page="daily"] .top-actions :where(.icon-btn) { display: none; }
  body[data-dokaidu-page="daily"] .demo-banner { flex-direction: column; }
  body[data-dokaidu-page="schedule"] .schedule-section { padding: 15px; }
  body[data-dokaidu-page="schedule"] .summary-grid { gap: 8px; }
  body[data-dokaidu-page="schedule"] .summary-stat { padding: 13px; }
  body[data-dokaidu-page="schedule"] .icon-action { min-width: 44px; min-height: 44px; }
  body[data-dokaidu-page="settings"] .settings-list { grid-template-columns: 1fr; }
  body[data-dokaidu-page="settings"] .settings-row { min-height: 130px; }
}

@media (max-width: 390px) {
  .topbar { padding-inline: 12px; }
  body[data-dokaidu-page="daily"] .page-title { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body[data-dokaidu-page="daily"] .strava-action-btn { padding-inline: 9px; }
  body[data-dokaidu-page="schedule"] .summary-grid { grid-template-columns: 1fr; }
  body[data-dokaidu-page="student"] .hero-copy { padding: 24px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media print {
  body[data-dokaidu-page="schedule"] { background: #fff; color: #111; }
  body[data-dokaidu-page="schedule"] .main { margin: 0; }
  body[data-dokaidu-page="schedule"] .page { width: 100%; margin: 0; }
  body[data-dokaidu-page="schedule"] .timetable-section { padding: 0; border: 0; box-shadow: none; }
  body[data-dokaidu-page="schedule"] .timetable-scroll { border-color: #aaa; box-shadow: none; }
  body[data-dokaidu-page="schedule"] :where(.timetable-corner, .timetable-day-head) { background: #f3f4f6; color: #111; }
  body[data-dokaidu-page="schedule"] .timetable-time-axis { background: #f7f7f8; }
  body[data-dokaidu-page="schedule"] .timetable-block { box-shadow: none; }
}