@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,700;1,400;1,700&family=Source+Serif+4:ital,opsz,wght@0,8..60,300;0,8..60,400;0,8..60,600;1,8..60,300;1,8..60,400&display=swap");

/* Regulate design system:
   Use the core palette only: Sage, Soft Sage, Warm Sand, Charcoal, Cream.
   Muted text may use Stone. Avoid red, brown, rose, or harsh warning hues. */
:root {
  --color-sage: #8C9B8A;
  --color-light-sage: #C7CDBE;
  --color-sand: #D5B38A;
  --color-cream: #F6F2EC;
  --color-mist: color-mix(in srgb, var(--color-light-sage) 42%, var(--color-cream));
  --color-slate: #424844;
  --color-stone: #828485;
  --color-charcoal: #424844;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --text-xs: 0.72rem;
  --text-sm: 0.84rem;
  --text-base: 1rem;
  --text-md: 1.12rem;
  --text-lg: 1.35rem;
  --text-xl: 1.7rem;
  --text-2xl: 2.35rem;
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-button: 12px;
  --radius-card: 16px;
  --radius-modal: 20px;
  --radius-pill: 999px;
  --shadow-none: none;
  --shadow-soft: 0 8px 24px rgba(66, 72, 68, 0.06);
  --shadow-lifted: 0 18px 48px rgba(66, 72, 68, 0.12);
  --border-soft: color-mix(in srgb, var(--color-light-sage) 46%, var(--color-cream));
  --breakpoint-mobile-max: 767px;
  --breakpoint-tablet-min: 768px;
  --breakpoint-tablet-max: 1199px;
  --breakpoint-desktop-min: 1200px;
  --content-max: 1360px;
  --tap-target: 44px;
  --color-recovery-green: var(--color-sage);
  --color-capacity-amber: var(--color-sand);

  --color-overload-rose: color-mix(in srgb, var(--color-sand) 70%, var(--color-slate));
  --bg: var(--color-cream);
  --card: color-mix(in srgb, var(--color-cream) 72%, white);
  --text: var(--color-slate);
  --muted-text: var(--color-stone);
  --border: var(--border-soft);
  --primary: var(--color-sage);
  --secondary: var(--color-slate);
  --surface: color-mix(in srgb, var(--color-cream) 78%, white);
  --surface-raised: color-mix(in srgb, var(--color-cream) 62%, white);
  --recovery: color-mix(in srgb, var(--color-recovery-green) 24%, var(--color-cream));
  --work: color-mix(in srgb, var(--color-capacity-amber) 30%, var(--color-cream));
  --business: color-mix(in srgb, var(--color-slate) 12%, var(--color-cream));
  --sleep: color-mix(in srgb, var(--color-sand) 24%, var(--color-cream));
  --meal: color-mix(in srgb, var(--color-sand) 34%, var(--color-cream));
  --exercise: color-mix(in srgb, var(--color-recovery-green) 18%, var(--color-cream));
  --stim: color-mix(in srgb, var(--color-sage) 18%, var(--color-cream));
  --risk-low: color-mix(in srgb, var(--color-recovery-green) 28%, var(--color-cream));
  --risk-medium: color-mix(in srgb, var(--color-capacity-amber) 36%, var(--color-cream));
  --risk-high: var(--risk-medium);
  --risk-very-high: var(--risk-medium);
  --shadow: var(--shadow-soft);
  --radius: var(--radius-card);
  --input-bg: color-mix(in srgb, white 72%, var(--color-cream));
  --button-text: white;
  --status-text: var(--color-slate);
  --focus-ring: color-mix(in srgb, var(--color-sage) 45%, transparent);
  --editorial-ease: cubic-bezier(0.2, 0.72, 0.2, 1);
  --editorial-ease-soft: cubic-bezier(0.22, 0.61, 0.36, 1);
  --editorial-motion-short: 160ms;
  --editorial-motion-medium: 320ms;
  --editorial-motion-slow: 520ms;
  --editorial-page-turn-duration: 420ms;
  --editorial-page-turn-ease: cubic-bezier(0.42, 0, 0.2, 1);
  --layer-app-navigation: 80;
  --layer-mobile-nav-scrim: 81;
  --layer-mobile-nav-panel: 82;
  --layer-mobile-nav-trigger: 83;
  --layer-modal: 120;
  --layer-guided-tour: 130;
  --layer-guided-tour-highlight: 131;
  --layer-guided-tour-bubble: 132;
  --layer-urgent-notice: 1200;
  --editorial-page-radius: var(--radius-sm);
  --editorial-surface-radius-mobile: 22px;
  --editorial-screen-bg: #4B5D4A;
  --editorial-paper-bg: #EDEADE;
  --editorial-ink: #2C2A25;
  --editorial-body: #4C4840;
  --editorial-muted: #7E776B;
  --editorial-soft-muted: #9A9488;
  --editorial-rule: #D6CCBA;
  --editorial-focus: #C4A96A;
  --editorial-selected-bg: rgba(196, 169, 106, 0.18);
  --editorial-hover-bg: rgba(196, 169, 106, 0.08);
  --editorial-selected-ink: #1A1A14;
  --editorial-hover-ink: #315D46;
  --editorial-adjusted-accent: var(--editorial-focus);
  --editorial-shell-max-mobile: 100%;
  --editorial-shell-max-tablet: 860px;
  --editorial-shell-max-desktop: 1040px;
  --editorial-reading-max: 720px;
  --editorial-action-max: 820px;
  --editorial-index-max: 920px;
  --editorial-utility-max: 720px;
  --editorial-page-max-width: var(--editorial-index-max);
  --editorial-reading-max-width: var(--editorial-reading-max);
  --editorial-utility-max-width: var(--editorial-utility-max);
  --editorial-page-padding-inline: clamp(18px, 4vw, 36px);
  --editorial-page-padding-top: clamp(28px, 5vw, 52px);
  --editorial-page-padding-bottom: clamp(34px, 6vw, 72px);
  --editorial-surface-padding-inline: clamp(36px, 6vw, 72px);
  --editorial-surface-padding-block: clamp(48px, 5vw, 72px);
  --editorial-mobile-frame: 14px;
  --editorial-mobile-frame-inline: var(--editorial-mobile-frame);
  --editorial-mobile-frame-top: calc(var(--editorial-mobile-frame) + var(--editorial-safe-area-top));
  --editorial-mobile-frame-bottom: calc(var(--editorial-mobile-frame) + var(--editorial-safe-area-bottom));
  --editorial-mobile-page-padding-inline: 28px;
  --editorial-mobile-page-padding-top: 28px;
  --editorial-footer-gap-mobile: 26px;
  --editorial-footer-padding-bottom-mobile: 54px;
  --editorial-nav-exclusion-mobile: 72px;
  --editorial-mobile-nav-exclusion-block: var(--editorial-nav-exclusion-mobile);
  --editorial-mobile-page-padding-bottom: max(var(--editorial-footer-padding-bottom-mobile), var(--editorial-mobile-nav-exclusion-block));
  --editorial-section-gap: 34px;
  --editorial-content-gap: 14px;
  --editorial-footer-gap: 34px;
  --editorial-header-context-gap: 0px;
  --editorial-title-size: 2.28rem;
  --editorial-title-line-height: 1.22;
  --editorial-body-size: 1rem;
  --editorial-body-line-height: 1.55;
  --editorial-page-background: var(--editorial-screen-bg);
  --editorial-surface-background: var(--editorial-paper-bg);
  --editorial-surface-border: color-mix(in srgb, var(--color-sage) 34%, var(--editorial-paper-bg));
  --editorial-text-primary: var(--editorial-ink);
  --editorial-text-muted: var(--editorial-muted);
  --editorial-divider: var(--editorial-rule);
  --editorial-safe-area-top: env(safe-area-inset-top);
  --editorial-safe-area-bottom: env(safe-area-inset-bottom);
  --soft-primary: color-mix(in srgb, var(--color-sage) 16%, transparent);
  --soft-secondary: color-mix(in srgb, var(--color-slate) 10%, transparent);
  --sage-surface: color-mix(in srgb, var(--color-sage) 14%, var(--card));
  --capacity-surface: color-mix(in srgb, var(--color-capacity-amber) 28%, var(--card));
  --overload-surface: color-mix(in srgb, var(--color-overload-rose) 24%, var(--card));
  --recovery-surface: color-mix(in srgb, var(--color-recovery-green) 24%, var(--card));
  --capacity-text: color-mix(in srgb, var(--color-capacity-amber) 62%, var(--color-slate));
  --danger-text: color-mix(in srgb, var(--color-overload-rose) 68%, var(--color-slate));
  --tag-demand-text: color-mix(in srgb, var(--color-capacity-amber) 58%, var(--color-slate));
  --tag-recovery-text: color-mix(in srgb, var(--color-recovery-green) 42%, var(--color-slate));
  --tag-meal-text: color-mix(in srgb, var(--color-sand) 42%, var(--color-slate));
  --tag-stim-text: color-mix(in srgb, var(--color-sage) 42%, var(--color-slate));
  --ink: var(--text);
  --muted: var(--muted-text);
  --paper: var(--bg);
  --panel: var(--card);
  --line: var(--border);
  --green: var(--color-recovery-green);
  --teal: var(--primary);
  --rose: var(--color-overload-rose);
  --amber: var(--color-capacity-amber);
  --blue: var(--secondary);
  --surface-app: var(--bg);
  --surface-page: var(--bg);
  --surface-panel: var(--card);
  --surface-inset: var(--surface);
  --surface-selected: var(--editorial-selected-bg);
  --text-primary: var(--text);
  --text-secondary: var(--muted-text);
  --text-muted: var(--editorial-soft-muted);
  --border-subtle: var(--border);
  --accent-primary: var(--primary);
  color-scheme: light;
}

:root[data-appearance="standard"] {
  color-scheme: light;
}

:root[data-text-size="small"] {
  --text-xs: 0.68rem;
  --text-sm: 0.8rem;
  --text-base: 0.94rem;
  --text-md: 1.05rem;
  --text-lg: 1.26rem;
  --text-xl: 1.58rem;
  --text-2xl: 2.18rem;
}

:root[data-text-size="large"] {
  --text-xs: 0.76rem;
  --text-sm: 0.9rem;
  --text-base: 1.08rem;
  --text-md: 1.2rem;
  --text-lg: 1.46rem;
  --text-xl: 1.84rem;
  --text-2xl: 2.52rem;
}

:root[data-text-size="extra-large"] {
  --text-xs: 0.82rem;
  --text-sm: 0.96rem;
  --text-base: 1.16rem;
  --text-md: 1.3rem;
  --text-lg: 1.58rem;
  --text-xl: 1.98rem;
  --text-2xl: 2.72rem;
}

:root[data-theme="reduced"] {
  --bg: color-mix(in srgb, var(--color-cream) 86%, var(--color-mist));
  --card: color-mix(in srgb, var(--color-cream) 88%, white);
  --text: var(--color-slate);
  --muted-text: var(--color-stone);
  --border: color-mix(in srgb, var(--color-mist) 82%, var(--color-sand));
  --primary: var(--color-sage);
  --secondary: var(--color-slate);
  --surface: color-mix(in srgb, var(--color-cream) 82%, white);
  --surface-raised: color-mix(in srgb, var(--color-cream) 74%, white);
  --recovery: color-mix(in srgb, var(--color-recovery-green) 18%, var(--color-cream));
  --work: color-mix(in srgb, var(--color-capacity-amber) 22%, var(--color-cream));
  --business: color-mix(in srgb, var(--color-slate) 8%, var(--color-cream));
  --sleep: color-mix(in srgb, var(--color-sand) 18%, var(--color-cream));
  --meal: color-mix(in srgb, var(--color-sand) 24%, var(--color-cream));
  --exercise: color-mix(in srgb, var(--color-recovery-green) 14%, var(--color-cream));
  --stim: color-mix(in srgb, var(--color-sage) 12%, var(--color-cream));
  --risk-low: color-mix(in srgb, var(--color-recovery-green) 20%, var(--color-cream));
  --risk-medium: color-mix(in srgb, var(--color-capacity-amber) 26%, var(--color-cream));
  --risk-high: var(--risk-medium);
  --risk-very-high: var(--risk-medium);
  --shadow: none;
  --soft-primary: color-mix(in srgb, var(--color-sage) 12%, transparent);
  --soft-secondary: color-mix(in srgb, var(--color-slate) 8%, transparent);
  --editorial-screen-bg: color-mix(in srgb, var(--color-sage) 62%, var(--color-slate));
  --editorial-paper-bg: color-mix(in srgb, var(--color-cream) 90%, var(--color-mist));
  --editorial-ink: #34342F;
  --editorial-body: #55524A;
  --editorial-muted: #817B70;
  --editorial-soft-muted: #999387;
  --editorial-rule: color-mix(in srgb, #D6CCBA 72%, var(--editorial-paper-bg));
  --editorial-focus: color-mix(in srgb, var(--color-sage) 70%, var(--color-slate));
  --editorial-selected-bg: color-mix(in srgb, var(--color-sage) 11%, transparent);
  --editorial-hover-bg: color-mix(in srgb, var(--color-sage) 7%, transparent);
  --editorial-selected-ink: #2F332E;
  --editorial-hover-ink: color-mix(in srgb, var(--color-sage) 70%, var(--color-slate));
  --editorial-adjusted-accent: var(--editorial-focus);
  --editorial-surface-border: color-mix(in srgb, var(--color-sage) 24%, var(--editorial-paper-bg));
  --surface-app: var(--bg);
  --surface-page: var(--bg);
  --surface-panel: var(--card);
  --surface-inset: var(--surface);
  --surface-selected: var(--editorial-selected-bg);
  --text-primary: var(--text);
  --text-secondary: var(--muted-text);
  --text-muted: var(--editorial-soft-muted);
  --border-subtle: var(--border);
  --accent-primary: var(--primary);
  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg: #111712;
  --card: #1A211B;
  --text: #F0EADF;
  --muted-text: #B8B7A8;
  --border: #465047;
  --primary: #B9C8A8;
  --secondary: color-mix(in srgb, var(--color-mist) 36%, var(--color-slate));
  --surface: #232B24;
  --surface-raised: #2C352D;
  --recovery: color-mix(in srgb, var(--color-recovery-green) 34%, var(--card));
  --work: color-mix(in srgb, var(--color-capacity-amber) 28%, var(--card));
  --business: color-mix(in srgb, var(--color-mist) 12%, var(--card));
  --sleep: color-mix(in srgb, var(--color-sand) 22%, var(--card));
  --meal: color-mix(in srgb, var(--color-sand) 28%, var(--card));
  --exercise: color-mix(in srgb, var(--color-recovery-green) 28%, var(--card));
  --stim: color-mix(in srgb, var(--color-sage) 24%, var(--card));
  --risk-low: color-mix(in srgb, var(--color-recovery-green) 34%, var(--card));
  --risk-medium: color-mix(in srgb, var(--color-capacity-amber) 34%, var(--card));
  --risk-high: var(--risk-medium);
  --risk-very-high: var(--risk-medium);
  --shadow: none;
  --input-bg: #202821;
  --button-text: #111712;
  --status-text: var(--color-cream);
  --focus-ring: color-mix(in srgb, var(--color-sage) 48%, transparent);
  --soft-primary: color-mix(in srgb, var(--color-sage) 18%, transparent);
  --soft-secondary: color-mix(in srgb, var(--color-mist) 12%, transparent);
  --sage-surface: color-mix(in srgb, var(--color-sage) 20%, var(--card));
  --capacity-surface: color-mix(in srgb, var(--color-capacity-amber) 28%, var(--card));
  --overload-surface: color-mix(in srgb, var(--color-overload-rose) 30%, var(--card));
  --recovery-surface: color-mix(in srgb, var(--color-recovery-green) 28%, var(--card));
  --capacity-text: color-mix(in srgb, var(--color-capacity-amber) 72%, var(--color-cream));
  --danger-text: color-mix(in srgb, var(--color-overload-rose) 72%, var(--color-cream));
  --tag-demand-text: color-mix(in srgb, var(--color-capacity-amber) 82%, var(--color-cream));
  --tag-recovery-text: color-mix(in srgb, var(--color-light-sage) 86%, var(--color-cream));
  --tag-meal-text: color-mix(in srgb, var(--color-sand) 84%, var(--color-cream));
  --tag-stim-text: color-mix(in srgb, var(--color-light-sage) 84%, var(--color-cream));
  --editorial-screen-bg: #111712;
  --editorial-paper-bg: #1A211B;
  --editorial-ink: #F0EADF;
  --editorial-body: #DED8C9;
  --editorial-muted: #B8B7A8;
  --editorial-soft-muted: #929989;
  --editorial-rule: #465047;
  --editorial-focus: #B9C8A8;
  --editorial-selected-bg: rgba(185, 200, 168, 0.18);
  --editorial-hover-bg: rgba(185, 200, 168, 0.1);
  --editorial-selected-ink: #F4EFE5;
  --editorial-hover-ink: #D6E1C9;
  --editorial-adjusted-accent: var(--editorial-focus);
  --editorial-surface-border: color-mix(in srgb, var(--editorial-focus) 28%, var(--editorial-paper-bg));
  --surface-app: #111712;
  --surface-page: var(--bg);
  --surface-panel: var(--card);
  --surface-inset: var(--surface);
  --surface-selected: #3A463B;
  --text-primary: var(--text);
  --text-secondary: var(--muted-text);
  --text-muted: var(--editorial-soft-muted);
  --border-subtle: var(--border);
  --accent-primary: var(--primary);
  color-scheme: dark;
}

@keyframes editorial-page-arrive {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes editorial-page-give-way {
  0% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  42% {
    opacity: 0.74;
    transform: translate3d(-7px, 1px, 0);
  }

  100% {
    opacity: 0;
    transform: translate3d(-18px, 2px, 0);
  }
}

@keyframes editorial-page-underlay-continue {
  0% {
    opacity: 0.52;
    transform: translate3d(22px, 0, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes editorial-soft-reveal {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes editorial-fade-reveal {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes editorial-detail-reveal {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes editorial-sheet-rise {
  from {
    opacity: 0;
    transform: translate(-50%, 24px);
  }

  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

* {
  box-sizing: border-box;
}

html,
body,
#root {
  min-height: 100%;
  background: var(--surface-app);
}

body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  font-family: var(--font-sans);
  background: var(--surface-app);
}

body,
.app-shell,
.app-main,
main {
  background: var(--surface-app);
}

.app-shell,
.app-main {
  min-height: 100dvh;
}

body[data-text-size="small"] {
  font-size: 0.94rem;
}

body[data-text-size="default"] {
  font-size: 1rem;
}

body[data-text-size="large"] {
  font-size: 1.08rem;
}

body[data-text-size="extra-large"] {
  font-size: 1.16rem;
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.ds-card {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.ds-button {
  min-height: var(--tap-target);
  margin-top: 0;
  border-radius: var(--radius-button);
  font-weight: 800;
}

.ds-button-sm {
  min-height: 40px;
  height: 40px;
  padding: 0 var(--space-3);
}

.ds-button-primary {
  border-color: var(--primary);
  color: var(--button-text);
  background: var(--primary);
}

.ds-button-secondary {
  border-color: var(--border);
  color: var(--text);
  background: var(--card);
}

.ds-button-ghost {
  border-color: transparent;
  color: var(--text);
  background: transparent;
}

.ds-button-primary:hover {
  color: var(--button-text);
  background: color-mix(in srgb, var(--primary) 84%, var(--color-slate));
}

.ds-icon-button {
  min-width: var(--tap-target);
  min-height: var(--tap-target);
  border-radius: var(--radius-button);
}

.ds-pill,
.status-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 28px;
  padding: 0 var(--space-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  color: var(--text);
  background: var(--surface);
  font-size: var(--text-sm);
  font-weight: 800;
}

.ds-pill-sage,
.status-within-capacity,
.status-tone-within,
.status-tone-sage {
  border-color: color-mix(in srgb, var(--color-light-sage) 72%, var(--color-cream));
  color: var(--color-slate);
  background: color-mix(in srgb, var(--color-light-sage) 34%, var(--color-cream));
}

.ds-pill-amber,
.status-medium-risk,
.status-slightly-above-capacity,
.status-tone-slightly-above,
.status-tone-amber {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 58%, var(--color-cream));
  color: var(--color-slate);
  background: color-mix(in srgb, var(--color-capacity-amber) 22%, var(--color-cream));
}

.status-above-capacity,
.status-high-risk,
.status-likely-over-capacity,
.status-tone-above,
.status-tone-high {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 82%, var(--color-slate));
  color: var(--color-slate);
  background: color-mix(in srgb, var(--color-capacity-amber) 36%, var(--color-cream));
}

.empty-state-card {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-4);
  border: 1px dashed var(--border);
  border-radius: var(--radius-card);
  color: var(--muted);
  background: var(--surface);
  line-height: 1.45;
}

.empty-state-card strong {
  color: var(--text);
}

.app-shell {
  display: grid;
  grid-template-columns: 204px minmax(0, 1fr);
  min-height: 100vh;
}

.app-shell.sidebar-collapsed {
  grid-template-columns: 64px minmax(0, 1fr);
}

.app-shell-tracker,
.app-shell-tracker.sidebar-collapsed,
.app-shell-toolkit,
.app-shell-toolkit.sidebar-collapsed,
.app-shell-settings,
.app-shell-settings.sidebar-collapsed,
.app-shell-settingsProfile,
.app-shell-settingsProfile.sidebar-collapsed,
.app-shell-settingsRhythms,
.app-shell-settingsRhythms.sidebar-collapsed,
.app-shell-settingsConnections,
.app-shell-settingsConnections.sidebar-collapsed,
.app-shell-settingsNotifications,
.app-shell-settingsNotifications.sidebar-collapsed,
.app-shell-settingsPrivacyData,
.app-shell-settingsPrivacyData.sidebar-collapsed,
.app-shell-settingsPrivacySummary,
.app-shell-settingsPrivacySummary.sidebar-collapsed,
.app-shell-settingsTermsSummary,
.app-shell-settingsTermsSummary.sidebar-collapsed,
.app-shell-settingsFeedback,
.app-shell-settingsFeedback.sidebar-collapsed,
.app-shell-settingsHelpSupport,
.app-shell-settingsHelpSupport.sidebar-collapsed,
.app-shell-settingsContactSupport,
.app-shell-settingsContactSupport.sidebar-collapsed {
  grid-template-columns: minmax(0, 1fr);
}

.app-shell[class*="app-shell-settings"] {
  display: block;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: none;
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--editorial-screen-bg);
}

.app-shell[class*="app-shell-developer"] {
  display: block;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: none;
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--editorial-screen-bg);
}

.app-shell-tracker .sidebar,
.app-shell-tracker .mobile-app-brand,
.app-shell-tracker .mobile-toolkit-button,
.app-shell-toolkit .sidebar,
.app-shell-toolkit .mobile-app-brand,
.app-shell-toolkit .mobile-toolkit-button,
.app-shell-settings .sidebar,
.app-shell-settings .mobile-app-brand,
.app-shell-settings .mobile-toolkit-button,
.app-shell-settingsProfile .sidebar,
.app-shell-settingsProfile .mobile-app-brand,
.app-shell-settingsProfile .mobile-toolkit-button,
.app-shell-settingsRhythms .sidebar,
.app-shell-settingsRhythms .mobile-app-brand,
.app-shell-settingsRhythms .mobile-toolkit-button,
.app-shell-settingsConnections .sidebar,
.app-shell-settingsConnections .mobile-app-brand,
.app-shell-settingsConnections .mobile-toolkit-button,
.app-shell-settingsNotifications .sidebar,
.app-shell-settingsNotifications .mobile-app-brand,
.app-shell-settingsNotifications .mobile-toolkit-button,
.app-shell-settingsPrivacyData .sidebar,
.app-shell-settingsPrivacyData .mobile-app-brand,
.app-shell-settingsPrivacyData .mobile-toolkit-button,
.app-shell-settingsPrivacySummary .sidebar,
.app-shell-settingsPrivacySummary .mobile-app-brand,
.app-shell-settingsPrivacySummary .mobile-toolkit-button,
.app-shell-settingsTermsSummary .sidebar,
.app-shell-settingsTermsSummary .mobile-app-brand,
.app-shell-settingsTermsSummary .mobile-toolkit-button,
.app-shell-settingsFeedback .sidebar,
.app-shell-settingsFeedback .mobile-app-brand,
.app-shell-settingsFeedback .mobile-toolkit-button,
.app-shell-settingsHelpSupport .sidebar,
.app-shell-settingsHelpSupport .mobile-app-brand,
.app-shell-settingsHelpSupport .mobile-toolkit-button,
.app-shell-settingsContactSupport .sidebar,
.app-shell-settingsContactSupport .mobile-app-brand,
.app-shell-settingsContactSupport .mobile-toolkit-button,
.app-shell[class*="app-shell-developer"] .sidebar,
.app-shell[class*="app-shell-developer"] .mobile-app-brand,
.app-shell[class*="app-shell-developer"] .mobile-toolkit-button {
  display: none;
}

.app-shell[class*="app-shell-settings"] .sidebar,
.app-shell[class*="app-shell-settings"] .mobile-app-brand,
.app-shell[class*="app-shell-settings"] .mobile-toolkit-button {
  display: none;
}

.sidebar {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 38px;
  width: 204px;
  min-width: 0;
  max-width: 204px;
  padding: 24px 12px;
  border-right: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  background: var(--surface);
  color: var(--text);
  border-right: 1px solid var(--border);
}

.brand {
  display: grid;
  align-items: center;
  justify-content: stretch;
  gap: 2px;
  position: relative;
  width: 100%;
  min-height: 72px;
}

.brand::after {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -18px;
  height: 1px;
  border-radius: 0;
  background: color-mix(in srgb, var(--color-sage) 35%, var(--border));
  content: "";
}

.sidebar-home-link {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-self: stretch;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 50px;
  box-sizing: border-box;
  padding: 2px 8px 6px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  cursor: pointer;
}

.sidebar-home-link:hover {
  background: color-mix(in srgb, var(--color-sage) 10%, transparent);
}

.sidebar-collapse-button {
  position: absolute;
  right: -25px;
  top: calc(100% + 5px);
  z-index: 2;
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 999px;
  color: color-mix(in srgb, var(--color-stone) 78%, var(--color-slate));
  background: color-mix(in srgb, var(--color-cream) 76%, white);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  transform: translateY(-50%);
}

.sidebar-collapse-button:hover {
  color: var(--color-sage);
  background: color-mix(in srgb, var(--color-sage) 12%, var(--color-cream));
}

.sidebar-collapse-button span {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  font-size: 1.15rem;
  line-height: 0;
  transform: translateY(-1px);
}

.brand-mark {
  width: 36px;
  height: 36px;
  display: block;
  flex: 0 0 36px;
  object-fit: contain;
}

.sidebar-logo {
  display: block;
  width: auto;
  max-width: 138px;
  height: 38px;
  max-height: 38px;
  object-fit: contain;
  object-position: left center;
}

.sidebar-brand-icon {
  display: block;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  object-fit: contain;
}

.sidebar-logo-fallback {
  color: var(--text);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.15;
}

.sidebar-wordmark {
  overflow: visible;
  color: var(--text);
  font-size: 1.34rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-tagline {
  display: block;
  padding-left: 42px;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.35;
}

h2,
h3,
p {
  margin: 0;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.eyebrow,
.date-card label,
.score-card span,
.field span,
.metric-panel span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.tabs {
  display: grid;
  gap: 34px;
}

.menu-shell {
  display: grid;
  gap: 16px;
  flex: 1;
}

.menu-toggle {
  display: none;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
  cursor: pointer;
}

.menu-toggle::marker,
.menu-toggle::-webkit-details-marker {
  display: none;
  content: "";
}

.hamburger-icon {
  display: grid;
  gap: 4px;
  width: 20px;
}

.hamburger-icon span {
  display: block;
  height: 2px;
  border-radius: 999px;
  background: var(--text);
}

.tab,
.text-button,
.icon-button {
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--ink);
  color: var(--text);
  background: transparent;
}

.tab {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  gap: 16px;
  min-height: 54px;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 14px 16px 14px 18px;
  text-align: left;
  color: var(--muted);
  font-size: 16px;
  font-weight: 500;
  line-height: 26px;
}

.tab svg {
  width: 22px;
  height: 22px;
  color: currentColor;
  flex: 0 0 22px;
}

.tab span {
  font-weight: 500;
}

.tab.is-active {
  border-color: transparent;
  color: var(--text);
  background: var(--sage-surface);
  font-weight: 600;
  border-radius: 12px;
}

.tab.is-active::before {
  position: absolute;
  left: 0;
  width: 3px;
  height: 100%;
  border-radius: 999px;
  background: var(--color-sage);
  content: "";
}

.tab.is-active svg {
  color: var(--color-sage);
}

.tab.is-active span {
  font-weight: 600;
}

.nav-group {
  display: grid;
  gap: 14px;
}

.nav-group-label {
  padding: 0 20px;
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.35;
  text-transform: none;
}

.nav-group-items {
  display: grid;
  gap: 6px;
}

.nav-subheading {
  padding: 4px 20px 0;
  color: var(--editorial-soft-muted);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.sidebar.is-collapsed {
  width: 64px;
  max-width: 64px;
  gap: 18px;
  overflow: visible;
  padding: 16px 0;
}

.sidebar.is-collapsed .brand {
  justify-content: center;
  min-height: 42px;
}

.sidebar.is-collapsed .brand::after {
  left: 10px;
  right: 10px;
  bottom: -12px;
  height: 1px;
  transform: none;
}

.sidebar.is-collapsed .sidebar-home-link {
  justify-content: center;
  width: 44px;
  max-width: 44px;
  min-height: 40px;
  padding: 0;
}

.sidebar.is-collapsed .sidebar-brand-icon {
  width: 32px;
  height: 32px;
  flex-basis: 32px;
}

.sidebar.is-collapsed .sidebar-wordmark {
  display: none;
}

.sidebar.is-collapsed .sidebar-tagline {
  display: none;
}

.sidebar.is-collapsed .sidebar-collapse-button {
  right: -13px;
  top: calc(100% + 5px);
  width: 24px;
  height: 24px;
}

.sidebar.is-collapsed .tabs {
  gap: 6px;
}

.sidebar.is-collapsed .nav-group {
  gap: 0;
}

.sidebar.is-collapsed .nav-group-items {
  gap: 6px;
}

.sidebar.is-collapsed .nav-group+.nav-group .nav-group-items {
  margin-top: 6px;
}

.sidebar.is-collapsed .nav-group-label {
  display: none;
}

.sidebar.is-collapsed .nav-subheading {
  display: none;
}

.sidebar.is-collapsed .tab span {
  display: none;
}

.sidebar.is-collapsed .tab {
  justify-content: center;
  width: 44px;
  min-height: 44px;
  margin: 0 auto;
  padding: 0;
  border-radius: 12px;
}

.sidebar.is-collapsed .tab.is-active::before {
  height: 26px;
}

@media (max-width: 1180px) and (min-width: 981px) {
  .app-shell {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .sidebar {
    width: 64px;
    max-width: 64px;
    gap: 18px;
    overflow: visible;
    padding: 16px 0;
  }

  .brand {
    justify-content: center;
    min-height: 42px;
  }

  .brand::after {
    left: 10px;
    right: 10px;
    bottom: -12px;
    height: 1px;
    transform: none;
  }

  .sidebar-home-link {
    justify-content: center;
    width: 44px;
    max-width: 44px;
    min-height: 40px;
    padding: 0;
  }

  .sidebar-brand-icon {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
  }

  .sidebar-wordmark {
    display: none;
  }

  .sidebar-tagline {
    display: none;
  }

  .sidebar-collapse-button {
    right: -13px;
    top: calc(100% + 5px);
    width: 24px;
    height: 24px;
  }

  .tabs {
    gap: 6px;
  }

  .nav-group {
    gap: 0;
  }

  .nav-group-items {
    gap: 6px;
  }

  .nav-group+.nav-group .nav-group-items {
    margin-top: 6px;
  }

  .nav-group-label {
    display: none;
  }

  .tab span {
    display: none;
  }

  .tab {
    justify-content: center;
    width: 44px;
    min-height: 44px;
    margin: 0 auto;
    padding: 0;
    border-radius: 12px;
  }

  .tab.is-active::before {
    height: 26px;
  }
}

.date-card,
.score-card,
.recovery-score-card,
.panel {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.date-card,
.score-card,
.recovery-score-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  box-shadow: none;
}

.date-card input,
.date-input-inline input,
select,
textarea,
.field input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--ink);
  color: var(--text);
  background: var(--input-bg);
}

.date-card input,
.date-input-inline input,
select,
.field input {
  height: 40px;
  padding: 0 10px;
}

.score-card strong {
  font-size: 3rem;
  line-height: 0.95;
}

.score-card p {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.45;
}

.recovery-score-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.recovery-score-head>div {
  display: grid;
  gap: 4px;
}

.recovery-score-head strong {
  color: var(--text);
  font-size: 1.55rem;
  line-height: 0.95;
}

.recovery-score-card.is-compact .recovery-score-head {
  display: grid;
  gap: 8px;
}

.recovery-score-card.is-compact .recovery-score-head strong {
  font-size: 3rem;
}

.trend-line {
  margin: 0;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 800;
  text-align: right;
}

.metric-meta {
  margin-top: 4px;
  margin-bottom: 18px;

  color: var(--muted);

  font-size: .88rem;
  font-weight: 500;
  opacity: .8;
}

.trend-up {
  color: var(--color-recovery-green);
}

.trend-down {
  color: var(--danger-text);
}

.score-explanation-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding-top: 0;
}

.score-explanation-grid h4 {
  margin: 0 0 4px;
  font-size: 0.86rem;
}

.score-explanation-grid ul {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.4;
}

.daily-tracker-grid .panel {
  height: auto;
  min-height: unset;
}

.tracker-editorial-flow {
  display: grid;
  gap: 0;
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 34px 0 0;
}

.tracker-editorial-shell:not(.editorial-page-shell) {
  display: grid;
  min-height: 100vh;
  padding: 18px 24px;
  place-items: start center;
}

.tracker-editorial-page {
  box-sizing: border-box;
  width: min(100%, 420px);
  max-width: 420px;
  min-width: 0;
  min-height: calc(100vh - 84px);
  padding: 48px 48px 42px;
}

.tracker-page-header {
  margin-bottom: 74px;
  padding-bottom: 26px;
  border-bottom: 1px solid var(--editorial-rule);
}

.tracker-date-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: -28px 0 34px;
  color: #8C8578;
}

.tracker-date-controls .date-input-inline {
  min-height: 0;
  color: #8C8578;
  font-family: inherit;
}

.tracker-date-controls input {
  min-height: 34px;
  border-color: var(--editorial-rule);
  border-radius: 7px;
  background: color-mix(in srgb, #F3EDE1 82%, white);
  font: inherit;
}

.tracker-date-controls .date-step-button {
  width: 32px;
  height: 32px;
  border-color: transparent;
  background: transparent;
  color: #8C8578;
}

.tracker-editorial-intro {
  display: grid;
  gap: 22px;
  max-width: 100%;
  padding: 0;
  color: var(--editorial-ink);
}

.tracker-editorial-intro h1,
.tracker-editorial-intro p {
  margin: 0;
  font-family: inherit;
}

.tracker-editorial-intro h1 {
  max-width: none;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.22;
}

.tracker-editorial-intro p {
  max-width: 100%;
  color: var(--editorial-body);
  font-size: 1rem;
  line-height: 1.55;
}

.tracker-editorial-section {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  border-top: 1px solid var(--editorial-rule);
  color: var(--editorial-ink);
}

.tracker-editorial-section:last-of-type {
  border-bottom: 1px solid var(--editorial-rule);
}

.tracker-editorial-section summary,
.tracker-editorial-section-trigger {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  width: 100%;
  min-height: 48px;
  padding: 0;
  border: 0;
  color: var(--editorial-muted);
  background: transparent;
  cursor: pointer;
  font: inherit;
  list-style: none;
  text-align: left;
  text-transform: uppercase;
}

.tracker-editorial-section summary::-webkit-details-marker {
  display: none;
}

.tracker-editorial-section summary strong,
.tracker-editorial-section-trigger strong {
  flex: 1 1 auto;
  min-width: 0;
  font-family: inherit;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.2em;
}

.tracker-editorial-section summary em {
  justify-self: start;
  padding: 4px 9px;
  border-radius: 5px;
  color: var(--editorial-hover-ink);
  background: color-mix(in srgb, #DDECE2 78%, white);
  font-style: normal;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.tracker-editorial-section[open] summary .todays-plan-chevron,
.tracker-editorial-section.is-open .tracker-editorial-section-trigger .todays-plan-chevron {
  transform: rotate(180deg);
}

.tracker-editorial-section summary .todays-plan-chevron,
.tracker-editorial-section-trigger .todays-plan-chevron {
  flex: 0 0 auto;
  align-self: center;
  grid-row: auto;
  margin-top: 0;
}

.tracker-editorial-section-body {
  display: grid;
  gap: 12px;
  min-width: 0;
  max-width: 100%;
  padding: 0 0 34px;
  animation: editorial-soft-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.tracker-section-intro {
  margin: 0 0 18px;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.tracker-editorial-card {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.tracker-editorial-card .panel-head {
  align-items: flex-start;
  padding-bottom: 14px;
  border-bottom: 0;
}

.tracker-editorial-card .eyebrow,
.tracker-editorial-section-head>span {
  color: color-mix(in srgb, var(--muted) 82%, var(--text));
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.tracker-editorial-card .panel-title-line,
.tracker-editorial-section-head h3 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.35rem, 1.8vw, 1.75rem);
  line-height: 1.14;
}

.tracker-editorial-section-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 14px;
}

.tracker-editorial-section-head p {
  margin-top: 6px;
  color: var(--muted);
  line-height: 1.5;
}

.tracker-large-options {
  justify-content: flex-start;
}

.tracker-ratings-section {
  display: grid;
  gap: 0;
}

.tracker-ratings-section>summary {
  grid-template-columns: minmax(0, 1fr) auto;
}

.tracker-ratings-section>summary .todays-plan-chevron {
  justify-self: end;
}

.tracker-ratings-section .rating-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 3px;
  padding: 9px 0 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.tracker-ratings-section .rating-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
}

.tracker-ratings-section .rating-title {
  color: var(--editorial-ink);
}

.tracker-ratings-section .rating-line strong {
  font-size: 1rem;
  line-height: 1.25;
}

.tracker-ratings-section .rating-line output {
  color: var(--editorial-muted);
  font-weight: 400;
}

.tracker-ratings-section .scale-labels {
  display: flex;
  justify-content: space-between;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  line-height: 1;
}

.tracker-ratings-section .rating-compact-guidance {
  display: none;
}

.tracker-ratings-section input[type="range"] {
  appearance: none;
  width: 100%;
  height: 16px;
  margin: 0;
  background: transparent;
  cursor: pointer;
}

.tracker-ratings-section input[type="range"]::-webkit-slider-runnable-track {
  height: 1px;
  border-radius: 0;
  background: #AFA99E;
}

.tracker-ratings-section input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  width: 12px;
  height: 12px;
  margin-top: -5.5px;
  border: 0;
  border-radius: 50%;
  background: var(--editorial-selected-ink);
  box-shadow: none;
}

.tracker-ratings-section input[type="range"]::-moz-range-track {
  height: 1px;
  border-radius: 0;
  background: #AFA99E;
}

.tracker-ratings-section input[type="range"]::-moz-range-progress {
  height: 1px;
  border-radius: 0;
  background: #AFA99E;
}

.tracker-ratings-section input[type="range"]::-moz-range-thumb {
  width: 12px;
  height: 12px;
  border: 0;
  border-radius: 50%;
  background: var(--editorial-selected-ink);
  box-shadow: none;
}

.tracker-ratings-section input[type="range"]:focus-visible {
  outline-offset: 5px;
}

.tracker-adaptive-followup {
  display: grid;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid var(--editorial-rule);
}

.tracker-adaptive-followup>span {
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.74rem;
  font-style: italic;
  font-weight: 400;
}

.tracker-choice-line {
  display: grid;
  gap: 3px;
}

.tracker-mark-option {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 7px 12px 7px 28px;
  border: 0;
  border-left: 2px solid transparent;
  color: var(--editorial-body);
  background: transparent;
  cursor: pointer;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.78rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  transition:
    background var(--editorial-motion-short) var(--editorial-ease),
    border-color var(--editorial-motion-short) var(--editorial-ease),
    color var(--editorial-motion-short) var(--editorial-ease);
}

.tracker-mark-option:hover,
.tracker-mark-option:focus-visible {
  color: var(--editorial-hover-ink);
  background: var(--editorial-hover-bg);
}

.tracker-mark-option.is-selected {
  border-left-color: var(--editorial-focus);
  color: var(--editorial-selected-ink);
  background: var(--editorial-selected-bg);
  font-weight: 500;
}

.tracker-choice-line .tracker-mark-option {
  margin-left: 0;
}

.tracker-choice-separator {
  display: none;
}

.tracker-followup-options {
  gap: 3px;
}

.tracker-note-disclosure {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
}

.tracker-note-disclosure summary {
  cursor: pointer;
  color: var(--muted);
  font-weight: 800;
}

.tracker-note-disclosure .field {
  margin-top: 12px;
}

.tracker-note-intro {
  margin: 0 0 12px;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.76rem;
  font-style: italic;
  line-height: 1.6;
}

.tracker-note-field {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 1px minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  overflow: hidden;
}

.tracker-note-field::before {
  content: "";
  width: 1px;
  min-height: 90px;
  background: rgba(26, 26, 20, 0.18);
}

.tracker-note-field>span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.tracker-note-field textarea {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 120px;
  max-width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  background: transparent;
  color: var(--editorial-ink);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  line-height: 1.85;
  resize: none;
  overflow-wrap: anywhere;
}

.tracker-note-field textarea::placeholder {
  color: #8C897E;
  font-style: italic;
}

.tracker-complete-action {
  display: flex;
  justify-content: stretch;
  padding: 34px 0 0;
}

.tracker-browse-supports {
  justify-self: start;
  min-height: 30px;
  padding: 0 0 2px;
  border: 0;
  border-bottom: 1px solid rgba(140, 137, 126, 0.28);
  color: var(--editorial-muted);
  background: transparent;
  cursor: pointer;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1;
}

.tracker-browse-supports:hover,
.tracker-browse-supports:focus-visible {
  border-bottom-color: var(--editorial-focus);
  color: var(--editorial-hover-ink);
  background: transparent;
}

.tracker-selected-supports {
  margin-bottom: 4px;
}

.tracker-support-sheet {
  max-height: none;
  min-height: 100vh;
  background: var(--editorial-paper-bg);
}

.tracker-support-sheet .eyebrow {
  display: none;
}

.tracker-support-sheet h3 {
  margin: 0;
  color: var(--editorial-muted);
  font-family: inherit;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1.4;
  text-transform: uppercase;
}

.tracker-support-sheet-intro {
  margin: 8px 0 0;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.72rem;
  font-style: italic;
  line-height: 1.45;
}

.tracker-support-search {
  margin: 0;
}

.tracker-support-sheet-list {
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

.tracker-return-supports {
  min-height: 24px;
}

.tracker-support-sheet-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--editorial-rule);
}

.tracker-support-sheet-actions span {
  color: rgba(140, 137, 126, 0.7);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.68rem;
}

.tracker-finish-button {
  width: 100%;
  min-height: 80px;
  border: 0;
  border-top: 1px solid var(--editorial-rule);
  border-bottom: 1px solid var(--editorial-rule);
  border-radius: 0;
  color: var(--editorial-ink);
  background: transparent;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.35rem;
  font-style: italic;
  text-align: left;
}

.tracker-completion-block {
  display: block;
  margin-top: 86px;
}

.tracker-completion-state {
  display: block;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  background: transparent;
}

.tracker-editorial-page.is-complete .tracker-editorial-intro,
.tracker-editorial-page.is-complete .tracker-editorial-flow {
  display: none;
}

.tracker-editorial-page.is-complete .tracker-completion-block {
  margin-top: 0;
}

.tracker-completion-state h1 {
  margin: 0;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.35rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.4;
}

.tracker-completion-state p {
  max-width: 300px;
  margin: 14px 0 0;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.84rem;
  line-height: 1.55;
}

.tracker-editorial-footer {
  display: block;
  max-width: 100%;
  margin-top: 48px;
  color: rgba(140, 137, 126, 0.45);
  text-align: left;
  text-transform: uppercase;
}

.tracker-editorial-footer p {
  margin: 0;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.55;
}

.tracker-learning-summary {
  opacity: 0.82;
}

.compact-demands {
  display: grid;
  gap: 12px;
}

.compact-demands-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.compact-demands-head.tracker-editorial-section-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.compact-demands-head h4 {
  margin: 0 0 3px;
  font-size: 1rem;
}

.compact-demands-head p {
  color: var(--muted);
  line-height: 1.35;
}

.compact-demand-groups {
  display: grid;
  gap: 10px;
}

.compact-demand-group {
  display: grid;
  gap: 7px;
}

.compact-demand-group>span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.demand-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.demand-chip {
  min-height: 34px;
  padding: 0 10px;
  color: var(--muted);
  background: transparent;
}

.demand-chip.is-selected {
  color: var(--text);
}

.rating-guidance,
.inline-disclosure {
  display: grid;
  gap: 6px;
}

.rating-guidance summary,
.inline-disclosure summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.rating-guidance small,
.inline-disclosure p {
  color: var(--muted);
  line-height: 1.45;
}

.primary-action-card {
  display: grid;
  gap: 8px;
  max-width: 540px;
}

.primary-action-card>span {
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.primary-action-card>strong {
  color: var(--text);
  font-size: 1.2rem;
  line-height: 1.2;
}

.primary-action-card p {
  max-width: 44ch;
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.note-save-status {
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 800;
  text-align: right;
}

.reflection-recommendation-checkin {
  display: grid;
  gap: 10px;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.reflection-recommendation-checkin h4 {
  margin: 0;
  font-size: 1rem;
}

.capacity-checkin {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.capacity-checkin h4 {
  margin: 0;
  font-size: 1rem;
}

.capacity-checkin-group {
  display: grid;
  gap: 7px;
}

.capacity-checkin-group>span {
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 800;
}

.capacity-learning-summary {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--color-sage) 34%, var(--border));
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--color-light-sage) 22%, var(--card));
}

.capacity-learning-summary strong {
  color: var(--text);
  font-size: 0.94rem;
}

.capacity-learning-summary p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.visual-settings {
  display: grid;
  gap: 26px;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.visual-settings h2 {
  margin: 0;
  color: var(--settings-muted);
  font-family: inherit;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-transform: uppercase;
}

.visual-comfort-segmented,
.visual-comfort-section {
  display: grid;
  gap: 0;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.visual-comfort-segmented {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--settings-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--settings-paper) 74%, var(--settings-line));
}

.visual-comfort-section {
  gap: 12px;
}

.visual-comfort-segment {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 48px;
  padding: 12px 10px;
  border-right: 1px solid var(--settings-line);
  color: var(--settings-muted);
  background: transparent;
  cursor: pointer;
  text-align: center;
}

.visual-comfort-segment:last-child {
  border-right: 0;
}

.visual-comfort-segment span {
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.2;
}

.visual-comfort-segment.is-selected {
  color: var(--editorial-selected-ink);
  background: var(--editorial-selected-bg);
}

.visual-comfort-segment:focus-within {
  outline: 2px solid var(--focus-ring);
  outline-offset: -4px;
}

.visual-comfort-segment:active {
  color: var(--editorial-hover-ink);
}

.visual-comfort-mode-description {
  display: flex;
  align-items: flex-start;
  min-height: calc(1.55em * 2);
  margin: -12px 0 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.96rem;
  font-style: italic;
  line-height: 1.55;
}

.visual-comfort-motion-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  width: 100%;
  min-height: 76px;
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid var(--settings-line);
  border-radius: 0;
  color: var(--settings-ink);
  background: transparent;
  cursor: default;
}

.visual-comfort-option-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.visual-comfort-option-copy strong {
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.25;
}

.visual-comfort-option-copy span {
  max-width: 46ch;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.visual-comfort-switch {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  width: 56px;
  min-width: 56px;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  cursor: pointer;
}

.visual-comfort-switch-track {
  position: relative;
  display: inline-flex;
  width: 48px;
  height: 28px;
  border: 1px solid color-mix(in srgb, var(--settings-line) 92%, var(--settings-ink));
  border-radius: 999px;
  background: color-mix(in srgb, var(--settings-line) 56%, var(--settings-paper));
  pointer-events: none;
}

.visual-comfort-switch-track span {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--settings-paper) 86%, white);
  box-shadow: 0 1px 3px color-mix(in srgb, var(--settings-ink) 18%, transparent);
  transition:
    left var(--editorial-motion-short) var(--editorial-ease),
    background var(--editorial-motion-short) var(--editorial-ease);
}

.visual-comfort-switch.is-on {
  color: var(--editorial-focus);
}

.visual-comfort-switch.is-on .visual-comfort-switch-track {
  border-color: color-mix(in srgb, var(--editorial-focus) 72%, var(--settings-line));
  background: color-mix(in srgb, var(--editorial-focus) 42%, var(--settings-paper));
}

.visual-comfort-switch.is-on .visual-comfort-switch-track span {
  left: 23px;
  background: var(--settings-paper);
}

.visual-comfort-switch:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
}

.visual-comfort-switch:active .visual-comfort-switch-track {
  border-color: var(--editorial-focus);
}

.visual-comfort-switch:disabled {
  cursor: not-allowed;
  opacity: 0.68;
}

.visual-comfort-note {
  max-width: 44ch;
  margin: 0;
  color: var(--settings-soft-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.92rem;
  font-style: italic;
  line-height: 1.55;
}

@media (hover: hover) and (pointer: fine) {
  .visual-comfort-segment:hover {
    color: var(--editorial-hover-ink);
    background: var(--editorial-hover-bg);
  }

  .visual-comfort-segment.is-selected:hover {
    color: var(--editorial-selected-ink);
    background: var(--editorial-selected-bg);
  }

  .visual-comfort-switch:hover {
    color: var(--editorial-hover-ink);
  }

  .visual-comfort-switch:hover .visual-comfort-switch-track {
    border-color: color-mix(in srgb, var(--editorial-focus) 68%, var(--settings-line));
  }
}

@media (max-width: 640px) {
  .visual-comfort-segmented {
    grid-template-columns: minmax(0, 1fr);
  }

  .visual-comfort-segment {
    border-right: 0;
    border-bottom: 1px solid var(--settings-line);
  }

  .visual-comfort-segment:last-child {
    border-bottom: 0;
  }

  .visual-comfort-motion-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    min-height: 84px;
  }

  .visual-comfort-switch {
    justify-content: flex-start;
  }
}

.meter {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--border);
}

.meter span {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--color-overload-rose), var(--color-capacity-amber), var(--color-recovery-green));
  transition: width 200ms ease;
}

main {
  width: 100%;
  max-width: var(--content-max);
  min-width: 0;
  margin: 0 auto;
  padding: 28px;
}

.app-main-tracker {
  max-width: none;
  padding: 0;
  background: var(--editorial-screen-bg);
}

.app-main-settings,
.app-main-settingsProfile,
.app-main-settingsRhythms,
.app-main-settingsConnections,
.app-main-settingsNotifications,
.app-main-settingsPrivacyData,
.app-main-settingsPrivacySummary,
.app-main-settingsTermsSummary,
.app-main-settingsFeedback,
.app-main-settingsHelpSupport,
.app-main-settingsContactSupport {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  background: var(--editorial-screen-bg);
}

.app-main[class*="app-main-settings"] {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  background: var(--editorial-screen-bg);
}

.editorial-shell,
.editorial-page-shell {
  box-sizing: border-box;
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  place-items: start center;
  padding:
    calc(var(--editorial-page-padding-top) + var(--editorial-safe-area-top)) var(--editorial-page-padding-inline) calc(var(--editorial-page-padding-bottom) + var(--editorial-safe-area-bottom));
  background: var(--editorial-page-background);
  color: var(--editorial-text-primary);
  font-family: var(--font-sans);
}

.editorial-shell-surface,
.editorial-page-surface {
  --editorial-content-max-width: var(--editorial-reading-max);
  position: relative;
  box-sizing: border-box;
  display: grid;
  gap: 0;
  width: min(100%, var(--editorial-shell-max-desktop));
  max-width: var(--editorial-shell-max-desktop);
  min-width: 0;
  overflow: hidden;
  padding:
    var(--editorial-surface-padding-block) var(--editorial-surface-padding-inline) var(--editorial-page-padding-bottom);
  border: 1px solid var(--editorial-surface-border);
  border-radius: var(--editorial-page-radius);
  color: var(--editorial-text-primary);
  background: var(--editorial-surface-background);
  box-shadow: 0 4px 44px rgba(0, 0, 0, 0.14);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
}

.supports-editorial-container:not(.editorial-page-surface),
.planning-editorial-panel,
.settings-editorial-shell:not(.editorial-page-shell),
.developer-editorial-page:not(.editorial-page-surface) {
  position: relative;
}

.todays-plan-page,
.planning-editorial-panel:not(.editorial-page-surface),
.settings-editorial-shell:not(.editorial-page-shell),
.developer-editorial-page:not(.editorial-page-surface) {
  border: 1px solid var(--editorial-surface-border);
}

.editorial-shell-content {
  display: grid;
  width: min(100%, var(--editorial-content-max-width));
  max-width: var(--editorial-content-max-width);
  min-width: 0;
  justify-self: start;
}

.editorial-shell-content>* {
  position: relative;
  z-index: 1;
}

.editorial-shell-surface>*,
.editorial-page-surface>*,
.morning-briefing-content>*,
.todays-plan-page>*,
.planning-editorial-panel>*,
.settings-editorial-shell:not(.editorial-page-shell)>*,
.developer-editorial-page:not(.editorial-page-surface)>* {
  position: relative;
  z-index: 1;
}

.editorial-page-surface-index,
.editorial-page-surface-utility {
  --editorial-content-max-width: var(--editorial-index-max);
  width: min(100%, var(--editorial-shell-max-desktop));
  max-width: var(--editorial-shell-max-desktop);
  min-height: calc(100vh - clamp(36px, 6vw, 72px));
  min-height: calc(100dvh - clamp(36px, 6vw, 72px));
  border-radius: 14px;
  box-shadow: none;
}

.editorial-page-surface-utility {
  --editorial-content-max-width: var(--editorial-utility-max);
}

.editorial-shell-surface-action,
.editorial-page-surface-action,
.editorial-page-surface.tracker-editorial-page,
.editorial-page-surface.toolkit-editorial-page,
.editorial-page-surface.weekly-planner-page,
.editorial-page-surface.planning-editorial-panel {
  --editorial-content-max-width: var(--editorial-action-max);
}

.editorial-page-shell.settings-editorial-shell {
  display: grid;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  min-height: 100dvh;
  padding:
    calc(var(--editorial-page-padding-top) + var(--editorial-safe-area-top)) var(--editorial-page-padding-inline) calc(var(--editorial-page-padding-bottom) + var(--editorial-safe-area-bottom));
  border: 0;
  border-radius: 0;
  background: var(--editorial-page-background);
}

.editorial-page-surface.settings-editorial-page {
  display: flex;
  flex-direction: column;
  color: var(--settings-ink, var(--editorial-body));
}

.settings-foundation-header.editorial-page-header {
  margin-bottom: 0;
}

.editorial-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  min-width: 0;
  margin-bottom: clamp(40px, 6vw, 56px);
}

.editorial-page-header-copy {
  display: grid;
  gap: var(--editorial-header-context-gap);
  min-width: 0;
}

.editorial-page-header h2,
.editorial-page-header time,
.editorial-page-header .editorial-date-in-document,
.editorial-page-eyebrow {
  display: block;
  margin: 0;
  color: var(--editorial-soft-muted);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}

.editorial-page-eyebrow {
  font-family: var(--font-sans);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.editorial-page-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.editorial-intro {
  display: grid;
  gap: var(--editorial-content-gap);
  margin-bottom: var(--editorial-section-gap);
}

.editorial-intro h1,
.editorial-intro h2 {
  max-width: 10.5em;
  margin: 0;
  color: var(--editorial-text-primary);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: var(--editorial-title-size);
  font-weight: 700;
  line-height: var(--editorial-title-line-height);
  letter-spacing: 0;
}

.editorial-intro p {
  max-width: 34ch;
  margin: 0;
  color: var(--editorial-text-muted);
  font-size: var(--editorial-body-size);
  line-height: var(--editorial-body-line-height);
}

.editorial-section {
  display: grid;
  gap: var(--editorial-content-gap);
  margin-bottom: var(--editorial-section-gap);
}

.editorial-section:last-of-type {
  margin-bottom: 0;
}

.editorial-section-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--editorial-content-gap);
}

.editorial-section-heading h3,
.editorial-disclosure-toggle span:first-child {
  margin: 0;
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.editorial-footer {
  margin-top: 58px;
  padding-top: 28px;
  border-top: 1px solid var(--editorial-divider);
}

.editorial-footer-sticky {
  position: sticky;
  bottom: 0;
  z-index: 8;
  padding-bottom: calc(18px + var(--editorial-safe-area-bottom));
  background:
    linear-gradient(180deg, rgba(237, 234, 222, 0), var(--editorial-surface-background) 18px),
    var(--editorial-surface-background);
}

.editorial-footer-actions {
  display: grid;
  gap: var(--editorial-footer-gap);
}

.editorial-continue-action,
.editorial-back-action {
  position: relative;
  display: grid;
  gap: 7px;
  width: 100%;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.editorial-back-action {
  display: inline-flex;
  align-items: center;
  width: auto;
  margin: 0 0 18px;
  color: var(--editorial-soft-muted);
  font-family: var(--font-sans);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.editorial-continue-action::after {
  position: absolute;
  left: 0;
  bottom: -16px;
  width: 40px;
  height: 2px;
  background: color-mix(in srgb, var(--editorial-divider) 82%, var(--editorial-text-muted));
  opacity: 0.6;
  transform: scaleX(1);
  transform-origin: left center;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-medium) var(--editorial-ease);
  content: "";
}

.editorial-continue-action span {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.editorial-continue-action strong {
  color: var(--editorial-text-muted);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.editorial-continue-action:hover,
.editorial-continue-action:focus-visible,
.editorial-back-action:hover,
.editorial-back-action:focus-visible {
  transform: translateY(-1px);
}

.editorial-continue-action:hover strong,
.editorial-continue-action:focus-visible strong {
  color: var(--editorial-text-primary);
}

.editorial-continue-action:hover::after,
.editorial-continue-action:focus-visible::after {
  opacity: 0.9;
  transform: scaleX(1.12);
}

.editorial-continue-action:active,
.editorial-back-action:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.editorial-continue-action:focus-visible,
.editorial-back-action:focus-visible,
.editorial-disclosure-toggle:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--editorial-focus) 42%, transparent);
  outline-offset: 8px;
}

.editorial-continue-action:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
}

.editorial-disclosure {
  display: grid;
  gap: 12px;
}

.editorial-disclosure-toggle {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--editorial-content-gap);
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.editorial-disclosure-toggle:hover {
  transform: translateY(-1px);
}

.editorial-disclosure-toggle:active {
  opacity: 0.78;
  transform: translateY(1px);
}

.editorial-disclosure-chevron {
  flex: none;
  color: var(--editorial-soft-muted);
  line-height: 1;
  transition: transform var(--editorial-motion-short) var(--editorial-ease);
}

.editorial-disclosure-toggle[aria-expanded="true"] .editorial-disclosure-chevron {
  transform: rotate(180deg);
}

.editorial-disclosure-content {
  animation: editorial-detail-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.editorial-status-message {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border: 1px solid color-mix(in srgb, var(--editorial-divider) 86%, var(--editorial-surface-background));
  border-radius: 8px;
  color: var(--editorial-text-muted);
  background: color-mix(in srgb, var(--editorial-surface-background) 82%, var(--editorial-page-background));
}

.editorial-status-message strong,
.editorial-status-message p {
  margin: 0;
}

.editorial-status-message strong {
  color: var(--editorial-text-primary);
}

.editorial-status-success {
  border-color: color-mix(in srgb, var(--color-sage) 34%, var(--editorial-divider));
  background: color-mix(in srgb, var(--color-sage) 12%, var(--editorial-surface-background));
}

.editorial-status-error,
.editorial-status-denied {
  border-color: color-mix(in srgb, var(--color-sand) 52%, var(--editorial-divider));
  background: color-mix(in srgb, var(--color-sand) 14%, var(--editorial-surface-background));
}

@media (max-width: 640px) {
  :root {
    --editorial-title-size: 2rem;
    --editorial-section-gap: 30px;
    --editorial-footer-gap: var(--editorial-footer-gap-mobile);
  }

  .editorial-page-shell {
    padding:
      var(--editorial-mobile-frame-top) var(--editorial-mobile-frame-inline) var(--editorial-mobile-frame-bottom);
    background: var(--editorial-page-background);
  }

  .editorial-page-surface {
    width: 100%;
    min-height: auto;
    padding:
      var(--editorial-mobile-page-padding-top) var(--editorial-mobile-page-padding-inline) var(--editorial-mobile-page-padding-bottom);
    border: 1px solid var(--editorial-surface-border);
    border-radius: var(--editorial-surface-radius-mobile);
    box-shadow: none;
  }

  .editorial-page-header {
    margin-bottom: 34px;
  }

  .editorial-footer {
    margin-top: 42px;
  }
}

.guided-editorial-screen {
  box-sizing: border-box;
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 100vh;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 32px 16px 72px;
  background: var(--editorial-screen-bg);
  color: color-mix(in srgb, var(--color-slate) 84%, black);
  font-family: var(--font-sans);
}

.morning-briefing-preview-bar {
  display: flex;
  flex: none;
  justify-content: flex-start;
  width: 100%;
  max-width: 440px;
  margin-bottom: 14px;
}

.morning-briefing-preview-bar .text-button {
  min-height: 36px;
  border-color: color-mix(in srgb, var(--color-cream) 52%, transparent);
  color: var(--color-cream);
  background: color-mix(in srgb, var(--color-slate) 22%, transparent);
}

.guided-preview-shell {
  display: grid;
  gap: 10px;
  min-height: 100vh;
  padding: 14px 18px 0;
  background: var(--editorial-screen-bg);
}

.editorial-page-surface:has(.editorial-calendar-layer),
.morning-briefing-content:has(.editorial-calendar-layer),
.todays-plan-page:has(.editorial-calendar-layer) {
  overflow: visible;
}

.morning-briefing-content-turn-stage {
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  justify-items: center;
  align-items: start;
  isolation: isolate;
}

.morning-briefing-content-turn-stage>* {
  grid-area: 1 / 1;
}

.morning-briefing-content-turn-stage.is-active .morning-briefing-content.is-turning-out {
  z-index: 2;
  pointer-events: none;
  animation: editorial-page-give-way var(--editorial-page-turn-duration) var(--editorial-page-turn-ease) both;
}

.morning-briefing-content-turn-stage.is-active .morning-plan-page.is-turning-in {
  z-index: 1;
  animation: editorial-page-underlay-continue var(--editorial-page-turn-duration) var(--editorial-page-turn-ease) both;
}

.morning-briefing-content>* {
  position: relative;
  z-index: 1;
}

.morning-briefing-header {
  position: relative;
  z-index: 2;
  display: block;
  margin-bottom: 40px;
  border-bottom: 0;
}

.editorial-page-header:has(.editorial-calendar-layer),
.morning-briefing-header:has(.editorial-calendar-layer),
.todays-plan-page-header:has(.editorial-calendar-layer) {
  z-index: 60;
}

.morning-briefing-title,
.morning-briefing-header time,
.morning-briefing-content p,
.morning-briefing-content h1 {
  margin: 0;
}

.morning-briefing-header-rule {
  box-sizing: border-box;
  display: block;
  min-height: 0;
  padding: 0;
  border-bottom: 0;
}

.morning-briefing-title {
  color: var(--editorial-soft-muted);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
}

.morning-briefing-header time,
.morning-briefing-header .editorial-date-in-document {
  color: var(--editorial-soft-muted);
  display: block;
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
}

.morning-briefing-date-row {
  margin-top: 0;
}

.morning-briefing-header-gap {
  display: none;
}

.morning-briefing-body {
  padding: 0;
}

.morning-briefing-hero {
  padding: 0;
}

.morning-briefing-hero h1 {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  line-height: 1.22;
  font-weight: 700;
  letter-spacing: 0;
}

.morning-briefing-hero p {
  margin-top: 20px;
  margin-bottom: 0;
  color: var(--editorial-body);
  font-size: 0.9rem;
  line-height: 1.82;
  font-weight: 400;
}

.morning-briefing-rule {
  height: 1px;
  margin: 44px 0;
  background: var(--editorial-rule);
}

.morning-briefing-section {
  margin-bottom: 40px;
}

.morning-briefing-section:last-child {
  margin-bottom: 0;
}

.morning-briefing-section-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  color: #9A9488;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.morning-briefing-section-label span[aria-hidden="true"] {
  width: 14px;
  height: 1px;
  background: currentColor;
  flex-shrink: 0;
}

.morning-briefing-section-label strong {
  font: inherit;
  color: currentColor;
}

.morning-briefing-section p:not(.morning-briefing-section-label) {
  color: var(--editorial-body);
  font-size: 0.9rem;
  line-height: 1.82;
  font-weight: 400;
}

.morning-briefing-section .morning-briefing-focus-copy {
  color: var(--editorial-body);
  font-size: 0.9rem;
  line-height: 1.82;
  font-weight: 400;
}

.morning-briefing-section[aria-labelledby="morning-briefing-intention"] p {
  color: #6A6458;
  font-style: italic;
}

.morning-briefing-why {
  margin-bottom: 40px;
  padding-top: 0;
  border-top: 0;
}

.morning-briefing-why-toggle {
  display: flex;
  align-items: baseline;
  gap: 6px;
  min-height: 0;
  padding: 0;
  border: 0;
  cursor: pointer;
  color: #6A6458;
  background: transparent;
  font-family: inherit;
}

.morning-briefing-why-toggle sup {
  color: currentColor;
  font-size: 0.75rem;
  font-weight: 500;
}

.morning-briefing-why-toggle span {
  color: currentColor;
  font-size: 0.82rem;
  font-style: italic;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(106, 100, 88, 0.32);
}

.morning-briefing-why-toggle svg {
  width: 7px;
  height: 4px;
  flex-shrink: 0;
  opacity: 0.62;
  transition: transform 240ms ease;
  transform: translateY(-1px);
}

.morning-briefing-why-toggle.is-open svg {
  transform: translateY(-1px) rotate(180deg);
}

.morning-briefing-why p {
  margin-top: 14px;
  color: #6A6458;
  font-size: 0.82rem;
  font-style: italic;
  line-height: 1.65;
  font-weight: 400;
}

.morning-briefing-why sup {
  font-size: 0.75rem;
  line-height: 0;
}

.morning-briefing-continue {
  margin: 44px 0 0;
  padding-top: 28px;
  border-top: 1px solid var(--editorial-rule);
}

.morning-briefing-continue button {
  position: relative;
  display: grid;
  gap: 12px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.morning-briefing-continue button::after {
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 44px;
  height: 1px;
  background: currentColor;
  content: "";
  opacity: 0.16;
  transform: scaleX(0.48);
  transform-origin: left center;
  transition:
    opacity var(--editorial-motion-medium) var(--editorial-ease),
    transform var(--editorial-motion-medium) var(--editorial-ease);
}

.morning-briefing-continue span {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.morning-briefing-continue strong {
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.morning-briefing-continue button:hover strong,
.morning-briefing-continue button:focus-visible strong {
  color: var(--editorial-ink);
}

.morning-briefing-continue button:hover {
  transform: translateY(-1px);
}

.morning-briefing-continue button:hover::after,
.morning-briefing-continue button:focus-visible::after {
  opacity: 0.34;
  transform: scaleX(1);
}

.morning-briefing-continue button:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.morning-briefing-continue button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

@media (max-width: 430px) {
  .guided-editorial-screen {
    padding: 18px 14px 36px;
  }

  .morning-briefing-body {
    padding: 0;
  }

  .morning-briefing-hero h1 {
    font-size: 1.72rem;
  }

}

.morning-plan-page {
  max-width: 440px;
}

.morning-plan-footer {
  align-items: start;
}

.morning-plan-footer-title {
  width: fit-content;
  margin: 0;
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.morning-plan-done-button {
  margin-top: 0;
}

.mobile-app-brand,
.floating-mobile-nav-trigger,
.floating-mobile-nav-scrim,
.floating-mobile-nav-panel {
  display: none;
}

.mobile-app-brand {
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-6);
}

.mobile-app-brand span {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--text);
  font-size: 1.2rem;
}

.mobile-app-brand img {
  width: 36px;
  height: 36px;
}

.mobile-toolkit-button {
  min-height: 40px;
}

.app-navigation-chrome {
  --mobile-nav-drawer-gutter: 12px;
  --mobile-nav-drawer-left: calc(var(--mobile-nav-drawer-gutter) + env(safe-area-inset-left));
  --mobile-nav-drawer-width: min(312px, calc(100vw - (var(--mobile-nav-drawer-gutter) * 2) - env(safe-area-inset-left) - env(safe-area-inset-right)));
  position: fixed;
  inset: 0;
  z-index: var(--layer-app-navigation);
  pointer-events: none;
}

.app-navigation-chrome .editorial-flow-menu,
.app-navigation-chrome .floating-mobile-nav-trigger {
  pointer-events: auto;
}

.editorial-flow-menu {
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 90;
  color: var(--text);
}

.editorial-flow-menu-toggle {
  display: inline-grid;
  gap: 4px;
  align-content: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 1px solid color-mix(in srgb, var(--border) 76%, transparent);
  border-radius: 999px;
  background: var(--editorial-paper-bg);
  box-shadow: 0 10px 28px rgba(46, 43, 35, 0.08);
  cursor: pointer;
}

.editorial-flow-menu-toggle span {
  display: block;
  width: 16px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.editorial-flow-menu-panel {
  display: grid;
  gap: 16px;
  width: min(312px, calc(100vw - 28px));
  margin-top: 8px;
  margin-left: auto;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  border-radius: 20px;
  background: var(--editorial-paper-bg);
  box-shadow: 0 18px 48px rgba(46, 43, 35, 0.14);
}

.editorial-flow-menu-group {
  display: grid;
  gap: 8px;
}

.editorial-flow-menu-label {
  margin: 0;
  padding: 0 8px;
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.35;
  text-transform: none;
}

.editorial-flow-menu-items {
  display: grid;
  gap: 4px;
}

.editorial-flow-menu-subheading {
  margin: 0;
  padding: 6px 12px 0;
  color: var(--editorial-soft-muted);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.editorial-flow-menu-panel button {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.editorial-flow-menu-panel button:hover,
.editorial-flow-menu-panel button:focus-visible,
.editorial-flow-menu-panel button.is-active {
  border-color: transparent;
  background: color-mix(in srgb, var(--soft-primary) 68%, transparent);
}

.editorial-flow-menu-panel button span {
  font-size: 0.92rem;
  font-weight: 800;
}

.editorial-flow-menu-panel button small {
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.3;
}

.floating-mobile-nav-trigger {
  --floating-mobile-nav-edge-offset: 6px;
  position: fixed;
  top: 50%;
  left: calc(var(--floating-mobile-nav-edge-offset) + env(safe-area-inset-left));
  z-index: var(--layer-mobile-nav-trigger);
  display: grid;
  width: 44px;
  min-width: 44px;
  height: 58px;
  min-height: 44px;
  place-items: center;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--border) 76%, transparent);
  border-left-width: 0;
  border-radius: 0 18px 18px 0;
  color: var(--text);
  background: var(--editorial-paper-bg);
  box-shadow: 0 10px 28px rgba(46, 43, 35, 0.08);
  cursor: pointer;
  transform: translateY(-50%);
  transition:
    left 180ms var(--editorial-ease-soft),
    transform 180ms var(--editorial-ease-soft),
    background 160ms var(--editorial-ease-soft),
    border-color 160ms var(--editorial-ease-soft);
}

.floating-mobile-nav-trigger.is-open {
  left: calc(var(--mobile-nav-drawer-left) + var(--mobile-nav-drawer-width) - 1px);
}

.floating-mobile-nav-chevron {
  display: grid;
  place-items: center;
  width: 30px;
  height: 42px;
  color: currentColor;
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
}

.floating-mobile-nav-trigger:hover,
.floating-mobile-nav-trigger:focus-visible {
  background: color-mix(in srgb, var(--soft-primary) 68%, var(--editorial-paper-bg));
}

.floating-mobile-nav-trigger:active {
  transform: translateY(-50%) translateX(1px);
}

.floating-mobile-nav-scrim {
  position: fixed;
  inset: 0;
  z-index: var(--layer-mobile-nav-scrim);
  border: 0;
  background: rgba(31, 29, 24, 0.2);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms var(--editorial-ease-soft);
}

.floating-mobile-nav-scrim.is-open {
  opacity: 1;
  pointer-events: auto;
}

.floating-mobile-nav-panel {
  position: fixed;
  top: calc(12px + env(safe-area-inset-top));
  bottom: calc(12px + env(safe-area-inset-bottom));
  left: var(--mobile-nav-drawer-left);
  z-index: var(--layer-mobile-nav-panel);
  box-sizing: border-box;
  width: var(--mobile-nav-drawer-width);
  max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  border-radius: 20px;
  background: var(--editorial-paper-bg);
  box-shadow: 0 18px 48px rgba(46, 43, 35, 0.14);
  pointer-events: none;
  transform: translateX(-110%);
  transition: transform 180ms var(--editorial-ease-soft);
}

.floating-mobile-nav-panel.is-open {
  pointer-events: auto;
  transform: translateX(0);
}

.floating-mobile-nav-list {
  display: grid;
  gap: 16px;
}

.floating-mobile-nav-group {
  display: grid;
  gap: 8px;
}

.floating-mobile-nav-label {
  padding: 0 8px;
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.35;
  text-transform: none;
}

.floating-mobile-nav-items {
  display: grid;
  gap: 4px;
}

.floating-mobile-nav-subheading {
  padding: 6px 12px 0;
  color: var(--editorial-soft-muted);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.floating-mobile-nav-item {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--text);
  background: transparent;
  font: inherit;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.floating-mobile-nav-item svg {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
}

.floating-mobile-nav-item:hover,
.floating-mobile-nav-item:focus-visible,
.floating-mobile-nav-item.is-active {
  border-color: transparent;
  color: var(--text);
  background: color-mix(in srgb, var(--soft-primary) 68%, transparent);
}

.insights-opening h1 {
  max-width: min(100%, 10.5em);
  font-size: clamp(2.4rem, 8vw, 3.3rem);
}

.insights-opening p {
  max-width: min(100%, 34rem);
}

.insights-opening p+p {
  color: color-mix(in srgb, var(--editorial-text-muted) 82%, var(--editorial-soft-muted));
}

.insights-eyebrow,
.insights-date {
  display: block;
  color: var(--editorial-soft-muted);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}

.insights-eyebrow {
  margin: 0;
}

.insights-date {
  margin: 0;
}

.insights-learning-stage span {
  display: block;
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.insights-opening {
  display: grid;
  gap: 12px;
  margin-bottom: 28px;
}

.insights-editorial-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.insights-editorial-list li {
  display: grid;
  gap: 6px;
  padding: 12px 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
}

.insights-editorial-list strong {
  color: var(--text);
  font-weight: 700;
}

.insights-editorial-list span {
  color: var(--muted);
  font-size: 0.94rem;
  line-height: 1.5;
}

.insights-editorial-list li:last-child {
  border-bottom: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
}

.insights-learning-stage {
  display: grid;
  gap: 8px;
}

.insights-learning-stage strong {
  color: var(--text);
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  line-height: 1.12;
}

.insights-learning-stage p {
  max-width: 620px;
}

@media (max-width: 640px) {
  .insights-opening {
    gap: 10px;
    margin-bottom: 24px;
  }

  .insights-opening h1 {
    font-size: clamp(2.4rem, 11vw, 3rem);
    line-height: 1.04;
  }

  .insights-opening p {
    max-width: min(100%, 34rem);
    font-size: 0.94rem;
    line-height: 1.58;
  }

  .insights-opening p+p {
    font-size: 0.9rem;
    line-height: 1.56;
  }
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}

.topbar h2 {
  font-size: 2.35rem;
  letter-spacing: 0;
}

.page-connection {
  max-width: 720px;
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.45;
}

.page-title-block {
  display: grid;
  gap: 8px;
}

.date-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.editorial-date-navigation {
  position: relative;
  display: flex;
  justify-content: center;
  color: var(--muted);
}

.editorial-date-in-document {
  display: inline-flex;
  justify-content: flex-start;
  width: max-content;
  max-width: 100%;
}

.editorial-date-trigger {
  min-height: var(--tap-target);
  padding: 2px 4px;
  border: 0;
  border-radius: var(--radius-sm);
  color: var(--muted);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.editorial-date-trigger span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 7px;
}

.editorial-date-trigger:hover,
.editorial-date-trigger:focus-visible {
  color: var(--text);
  background: var(--soft-primary);
  outline: none;
}

.editorial-date-trigger strong {
  color: var(--text);
  font-family: var(--font-serif);
  font-size: clamp(0.98rem, 1.2vw, 1.1rem);
  font-weight: 700;
  letter-spacing: 0;
}

.editorial-date-in-document .editorial-date-trigger {
  color: inherit;
  min-height: auto;
  margin: -2px -4px;
  width: auto;
}

.editorial-date-in-document .editorial-date-trigger:hover,
.editorial-date-in-document .editorial-date-trigger:focus-visible {
  color: inherit;
}

.editorial-date-in-document .editorial-date-trigger span {
  justify-content: flex-start;
}

.editorial-date-in-document .editorial-date-trigger strong {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.editorial-date-in-document .editorial-date-trigger strong::after {
  color: currentColor;
  font-size: 0.72em;
}

.editorial-date-trigger strong::after {
  content: "↓";
  margin-left: 8px;
  color: #CFC4AE;
  font-family: var(--font-sans);
  font-size: 0.78em;
  font-weight: 400;
  line-height: 1;
}

.editorial-date-trigger em {
  color: var(--primary);
  font-style: normal;
  font-size: 0.74rem;
  font-weight: 900;
}

.editorial-calendar-layer {
  position: absolute;
  z-index: 3000;
  top: calc(100% + 6px);
  left: 50%;
  width: min(92vw, 390px);
  max-width: calc(100vw - 24px);
  transform: translateX(-50%);
  color: var(--text);
  pointer-events: auto;
}

.editorial-calendar-dialog {
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--color-sage) 46%, var(--color-slate));
  border-radius: var(--radius);
  background: var(--editorial-paper-bg);
  box-shadow: var(--shadow);
  max-height: inherit;
  overflow: auto;
  overscroll-behavior: contain;
}

.editorial-calendar-layer[data-layout="sheet"] {
  display: grid;
  align-items: start;
  justify-items: center;
  box-sizing: border-box;
  padding: calc(26px + env(safe-area-inset-top)) clamp(14px, 5vw, 28px) calc(18px + env(safe-area-inset-bottom));
  background: color-mix(in srgb, var(--editorial-screen-bg) 68%, rgba(0, 0, 0, 0.28));
  overflow: auto;
  overscroll-behavior: contain;
}

.editorial-calendar-layer[data-layout="sheet"] .editorial-calendar-dialog {
  width: min(100%, 560px);
  max-height: calc(100dvh - 44px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  border-radius: 22px;
  background: var(--editorial-paper-bg);
  box-shadow: 0 22px 70px color-mix(in srgb, #000 34%, transparent);
}

.editorial-calendar-header {
  display: grid;
  grid-template-columns: var(--tap-target) 1fr var(--tap-target) auto;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
}

.editorial-calendar-header h2 {
  margin: 0;
  color: var(--text);
  font-family: var(--font-serif);
  font-size: 1.05rem;
  letter-spacing: 0;
  text-align: center;
}

.editorial-calendar-month-button,
.editorial-calendar-close,
.editorial-calendar-today {
  min-height: 36px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.editorial-calendar-month-button {
  display: inline-grid;
  place-items: center;
  color: #CFC4AE;
}

.editorial-arrow-icon {
  display: inline-block;
  color: inherit;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
}

.editorial-calendar-month-button.previous-month .editorial-arrow-icon {
  transform: rotate(90deg);
}

.editorial-calendar-month-button.next-month .editorial-arrow-icon {
  transform: rotate(-90deg);
}

.editorial-calendar-close,
.editorial-calendar-today {
  padding: 6px 8px;
  font-size: 0.82rem;
}

.editorial-calendar-month-button:hover,
.editorial-calendar-month-button:focus-visible,
.editorial-calendar-close:hover,
.editorial-calendar-close:focus-visible,
.editorial-calendar-today:hover,
.editorial-calendar-today:focus-visible,
.editorial-calendar-day:hover,
.editorial-calendar-day:focus-visible {
  color: var(--text);
  background: var(--soft-primary);
  outline: none;
}

.editorial-calendar-weekdays,
.editorial-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 3px;
}

.editorial-calendar-weekdays {
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}

.editorial-calendar-day {
  display: grid;
  place-items: center;
  align-content: center;
  min-height: 42px;
  padding: 4px 2px;
  border: 0;
  border-radius: var(--radius-sm);
  color: var(--text);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.editorial-calendar-day[data-outside-month="true"] {
  color: color-mix(in srgb, var(--muted) 68%, transparent);
}

.editorial-calendar-day[data-today="true"] .editorial-calendar-day-number {
  color: var(--primary);
  font-weight: 900;
}

.editorial-calendar-day[data-selected="true"] {
  background: var(--soft-primary);
  color: var(--text);
}

.editorial-calendar-day-number {
  line-height: 1.1;
}

.editorial-calendar-markers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: 12px;
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1;
}

.editorial-calendar-marker.marker-primary {
  color: var(--primary);
}

.editorial-calendar-marker.marker-secondary {
  color: var(--muted);
}

.editorial-calendar-today {
  display: block;
  margin: 8px auto 0;
}

.editorial-calendar-key {
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.78rem;
}

.editorial-calendar-key summary {
  cursor: pointer;
  font-weight: 800;
}

.editorial-calendar-key div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 10px;
  padding-top: 6px;
}

.editorial-calendar-key span {
  display: inline-flex;
  gap: 4px;
  align-items: center;
}

.editorial-calendar-key b {
  color: var(--primary);
}

.future-observation-message {
  margin: 0 auto 24px;
  max-width: 760px;
  padding: 8px 0 0;
  border-top: 1px solid var(--border);
  background: transparent;
}

.future-observation-message h2 {
  margin: 0 0 6px;
  color: var(--text);
  font-family: var(--font-serif);
  font-size: 1.05rem;
  letter-spacing: 0;
}

.future-observation-message p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}

.tracker-future-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.tracker-future-fieldset:disabled {
  opacity: 0.68;
}

.date-step-button {
  width: 40px;
  height: 40px;
  border-color: var(--border);
  background: var(--card);
  font-size: 1.35rem;
  font-weight: 800;
}

.date-step-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.date-input-inline {
  display: inline-grid;
  gap: 3px;
  min-width: 172px;
}

.date-input-inline span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.date-input-inline input {
  min-width: 172px;
}

.past-entry-banner,
.date-notice {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid var(--color-capacity-amber);
  border-radius: var(--radius);
  color: var(--text);
  background: var(--capacity-surface);
  font-size: 0.88rem;
}

.past-entry-banner strong {
  font-weight: 900;
}

.past-entry-banner span {
  color: var(--muted);
  font-weight: 700;
}

.date-notice {
  border-color: var(--primary);
  background: var(--sage-surface);
  font-weight: 800;
}

.selected-date-status {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: fit-content;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  background: var(--card);
  font-size: 0.88rem;
}

.selected-date-status.has-data {
  border-color: var(--primary);
  background: var(--soft-primary);
}

.selected-date-status span {
  color: var(--text);
  font-weight: 900;
}

.selected-date-status strong {
  font-weight: 800;
}

.top-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.save-status.is-error {
  color: var(--text);
  background: var(--overload-surface);
}

.icon-button {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-color: var(--border);
  background: var(--card);
}

.icon-button:hover,
.text-button:hover {
  border-color: var(--primary);
  background: var(--soft-primary);
}

.file-button input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.view {
  display: none;
}

.view.is-visible {
  display: block;
}

.planner-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
  gap: 18px;
}

.daily-tracker-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(320px, 1fr);
  gap: 18px;
  align-items: start;
}

.daily-tracker-grid.tracker-editorial-flow {
  grid-template-columns: 1fr;
  gap: 0;
}

.daily-tracker-grid>* {
  align-self: start;
}

.daily-tracker-left,
.daily-tracker-right {
  display: grid;
  gap: 18px;
  align-items: start;
}

.tracker-editorial-main,
.tracker-editorial-side {
  gap: 0;
  width: 100%;
}

.tracker-editorial-side .tracker-editorial-section:first-of-type {
  border-top: 0;
}

.tracker-editorial-main>.tracker-editorial-card,
.tracker-editorial-side>.tracker-editorial-card,
.tracker-learning-summary {
  padding-top: 28px;
  margin-top: 28px;
  border-top: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
}

.tracker-editorial-main>.tracker-editorial-card:first-of-type {
  padding-top: 18px;
  margin-top: 0;
  border-top: 0;
}

.entry-status-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 0 14px;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  color: var(--muted);
}

.entry-status-strip span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.entry-status-strip strong {
  color: var(--text);
}

.entry-status-strip em {
  margin-left: auto;
  color: var(--muted);
  font-style: normal;
  font-size: 0.86rem;
  font-weight: 800;
}

.entry-history-editorial {
  display: grid;
  gap: 0;
  color: var(--editorial-ink);
}

.entry-history-section-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  padding: 0 0 16px;
  border-bottom: 1px solid var(--editorial-rule);
}

.entry-history-section-heading h2 {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
}

.entry-history-section-heading span {
  color: var(--editorial-muted);
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.45;
  white-space: nowrap;
}

.entry-history-carousel {
  padding-top: 22px;
}

.entry-history-panel {
  display: grid;
  gap: 20px;
  padding: clamp(24px, 4vw, 34px);
  border: 1px solid color-mix(in srgb, var(--editorial-rule) 86%, var(--editorial-paper-bg));
  border-radius: 14px;
  color: var(--editorial-ink);
  background: color-mix(in srgb, var(--editorial-paper-bg) 88%, var(--editorial-screen-bg));
  box-shadow: none;
}

.entry-history-panel-nav {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--editorial-rule);
}

.entry-history-nav-button {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--editorial-muted);
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.22rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.entry-history-nav-button:hover {
  color: var(--editorial-ink);
}

.entry-history-nav-button:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
}

.entry-history-nav-button:disabled {
  color: color-mix(in srgb, var(--editorial-muted) 48%, transparent);
  cursor: not-allowed;
}

.entry-history-date {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: clamp(1.25rem, 2.6vw, 1.7rem);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  overflow-wrap: anywhere;
}

.entry-history-completion {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 1rem;
  font-weight: 750;
  line-height: 1.4;
}

.entry-history-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 28px;
}

.entry-history-meta>div {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.entry-history-meta h4 {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.35;
  text-transform: uppercase;
}

.entry-history-meta p {
  margin: 0;
  color: var(--editorial-ink);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.entry-history-empty {
  display: grid;
  gap: 8px;
  max-width: 46ch;
  padding: 24px 0 2px;
}

.entry-history-empty p {
  margin: 0;
  color: var(--editorial-body);
  line-height: 1.55;
}

.daily-tracker-right .recovery-score-card {
  height: auto;
  min-height: unset;
}

.panel {
  min-width: 0;
  overflow: visible;
  padding: 18px;
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.section-header-actions {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--space-2);
}

.panel-head h3 {
  margin-top: 2px;
  font-size: 1.18rem;
}

.collapsible-panel {
  padding: 0;
}

.collapsible-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
}

.collapsible-panel-toggle {
  display: grid;
  gap: 2px;
  min-width: 0;
  width: 100%;
  border: 0;
  color: var(--text);
  background: transparent;
  text-align: left;
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1.25;
}

.collapsible-panel-toggle .eyebrow {
  font-size: 0.72rem;
}

.collapsible-panel>.stim-decision-list {
  padding: 0 16px 16px;
}

.panel-title-line {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.rating-stack,
.check-grid {
  display: grid;
  gap: 10px;
}

.edit-plan-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.edit-plan-header h4 {
  margin: 0 0 8px;
  font-size: 1.06rem;
}

.edit-plan-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.template-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text);
  background: var(--recovery);
  font-size: 0.86rem;
  font-weight: 800;
}

.readonly-block {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.more-options-menu {
  position: relative;
}

.more-options-menu summary {
  list-style: none;
  cursor: pointer;
}

.more-options-menu summary::-webkit-details-marker {
  display: none;
}

.more-options-list {
  position: absolute;
  right: 0;
  z-index: 20;
  display: grid;
  gap: 8px;
  min-width: 220px;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
}

.more-options-list .text-button {
  justify-content: flex-start;
  width: 100%;
}

.edit-more-options {
  width: fit-content;
}

.today-plan-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-top: 16px;
  padding: 0 2px;
}

.today-plan-header h4 {
  margin: 2px 0 0;
  font-size: 1rem;
}

.today-plan-header p {
  max-width: 320px;
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.4;
  text-align: right;
}

.readonly-blocks {
  display: grid;
  gap: 10px;
}

.readonly-block {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
  padding: 12px;
  border-left: 5px solid var(--color-capacity-amber);
}

.readonly-block[data-type="business"] {
  border-left-color: var(--color-capacity-amber);
}

.readonly-block[data-type="recovery"] {
  border-left-color: var(--color-recovery-green);
}

.readonly-block[data-type="sleep"] {
  border-left-color: var(--sleep);
}

.readonly-block[data-type="meal"] {
  border-left-color: var(--meal);
}

.readonly-block[data-type="exercise"] {
  border-left-color: var(--exercise);
}

.readonly-block[data-type="commute"] {
  border-left-color: var(--color-capacity-amber);
}

.readonly-block[data-type="stim"] {
  border-left-color: var(--color-sage);
}

.readonly-block>span {
  color: var(--muted);
  font-weight: 800;
}

.schedule-block-time {
  overflow-wrap: normal;
}

.schedule-block-duration {
  color: color-mix(in srgb, var(--muted) 78%, var(--bg));
  font-weight: 700;
}

.readonly-block p {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.4;
}

.planning-editorial-screen {
  display: grid;
  gap: 34px;
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding: 0;
}

.planning-week-selector,
.planning-day-list {
  grid-template-rows: auto auto auto 1fr;
  min-height: min(920px, calc(100svh - clamp(168px, 18vw, 232px)));
}

.planning-editorial-panel:not(.editorial-page-surface) {
  position: relative;
  width: min(100%, 840px);
  max-width: 840px;
  margin: 0 auto;
  padding: clamp(28px, 5vw, 56px);
  border: 1px solid color-mix(in srgb, var(--color-sage) 18%, transparent);
  border-radius: 0;
  background: var(--editorial-paper-bg);
  box-shadow: none;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
}

.planning-editorial-panel .panel-head {
  margin-bottom: 22px;
}

.planning-editorial-panel .eyebrow,
.planning-editorial-panel .panel-title-line {
  color: var(--editorial-soft-muted);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}

.planning-editorial-panel .panel-title-line {
  margin-top: 0;
}

.planning-editorial-opening {
  display: grid;
  gap: 12px;
  max-width: 640px;
}

.planning-editorial-opening h4 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: clamp(2.25rem, 5.2vw, 3.45rem);
  font-weight: 700;
  line-height: 1.08;
}

.planning-editorial-opening p {
  max-width: 620px;
  margin: 0;
  color: #5C564C;
  font-size: 1.05rem;
  line-height: 1.72;
}

.planning-selected-week {
  display: grid;
  gap: 7px;
  padding: 16px 0;
  border-top: 1px solid var(--editorial-rule);
  border-bottom: 1px solid var(--editorial-rule);
}

.planning-selected-week span {
  color: var(--editorial-soft-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.planning-selected-week strong {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.28rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.25;
}

.planning-calendar {
  display: grid;
  gap: 18px;
  padding: 8px 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.planning-calendar header {
  display: grid;
  gap: 2px;
}

.planning-calendar header h4 {
  margin: 3px 0 0;
  color: #4B463E;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.26rem;
  font-weight: 500;
  line-height: 1.2;
}

.planning-calendar-weekdays,
.planning-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0;
}

.planning-calendar-weekdays span {
  color: var(--editorial-soft-muted);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-align: center;
  text-transform: uppercase;
}

.planning-calendar-grid {
  position: relative;
  padding: 6px 0;
  border-top: 1px solid color-mix(in srgb, var(--editorial-rule) 62%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--editorial-rule) 62%, transparent);
}

.planning-calendar-day {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: clamp(40px, 8vw, 56px);
  aspect-ratio: auto;
  border: 1px solid transparent;
  border-radius: 0;
  color: #625B50;
  background: transparent;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 0.92rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    background var(--editorial-motion-short) var(--editorial-ease);
}

.planning-calendar-day:hover,
.planning-calendar-day:focus-visible {
  border-color: transparent;
  background: color-mix(in srgb, var(--color-cream) 54%, transparent);
}

.planning-calendar-day:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 42%, transparent);
  outline-offset: 2px;
}

.planning-calendar-day.is-outside-month {
  color: color-mix(in srgb, var(--editorial-soft-muted) 38%, transparent);
}

.planning-calendar-day.is-selected-week {
  border-color: transparent;
  color: #21492E;
  background:
    linear-gradient(to bottom,
      transparent 0,
      transparent 7px,
      color-mix(in srgb, #DCE8D6 58%, transparent) 7px,
      color-mix(in srgb, #DCE8D6 58%, transparent) calc(100% - 7px),
      transparent calc(100% - 7px),
      transparent 100%);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #8FA882 34%, transparent),
    inset 0 -1px 0 color-mix(in srgb, #8FA882 34%, transparent);
}

.planning-calendar-day.is-selected-week span {
  color: #21492E;
  font-weight: 800;
}

.planning-calendar-day.is-selected-week-start::before,
.planning-calendar-day.is-selected-week-end::after {
  position: absolute;
  top: 7px;
  bottom: 7px;
  width: 1px;
  background: color-mix(in srgb, #8FA882 44%, transparent);
  content: "";
}

.planning-calendar-day.is-selected-week-start::before {
  left: 0;
}

.planning-calendar-day.is-selected-week-end::after {
  right: 0;
}

.planning-editorial-actions {
  display: grid;
  align-self: end;
  justify-items: start;
  gap: 16px;
  margin-top: 8px;
  padding-top: 24px;
  border-top: 1px solid var(--editorial-rule);
}

.planning-editorial-action-button {
  position: relative;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.planning-editorial-action-button::after {
  display: none;
  content: none;
}

.planning-editorial-action-button span {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.planning-editorial-action-button strong {
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.planning-editorial-action-button:hover:not(:disabled),
.planning-editorial-action-button:focus-visible {
  transform: translateY(-1px);
}

.planning-editorial-action-button:hover:not(:disabled) strong,
.planning-editorial-action-button:focus-visible strong {
  color: var(--editorial-ink);
}

.planning-editorial-action-button:hover:not(:disabled)::after,
.planning-editorial-action-button:focus-visible::after {
  opacity: 0.34;
  transform: scaleX(1);
}

.planning-editorial-action-button:active:not(:disabled) {
  opacity: 0.76;
  transform: translateY(1px);
}

.planning-editorial-action-button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

.planning-editorial-action-button:disabled {
  cursor: not-allowed;
  opacity: 0.44;
}

.planning-editorial-actions p {
  color: #8F887A;
  font-size: 0.86rem;
  font-style: italic;
  line-height: 1.45;
}

.planning-day-week-card {
  margin-top: -4px;
  padding: 16px 0;
  border: 0;
  border-top: 1px solid var(--editorial-rule);
  border-bottom: 1px solid var(--editorial-rule);
  border-radius: 0;
  background: transparent;
}

.planning-day-week-card+.weekly-overview-rhythm[data-mode="planning"] {
  margin-top: -20px;
}

.planning-day-cards {
  display: grid;
  gap: 0;
}

.planning-day-card {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 14px;
  width: 100%;
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid #D8CFBE;
  border-radius: 0;
  color: var(--editorial-ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition:
    border-color var(--editorial-motion-short) var(--editorial-ease),
    background var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.planning-day-card:hover,
.planning-day-card:focus-visible {
  border-color: #B9C7B4;
  color: #21492E;
  background: color-mix(in srgb, var(--color-cream) 46%, transparent);
  transform: translateY(-1px);
}

.planning-day-card:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 38%, transparent);
  outline-offset: 5px;
}

.planning-day-card[data-recently-completed="true"],
.planning-day-card[data-planned="true"] {
  padding-left: 14px;
  border-left: 1px solid #B9C7B4;
  border-bottom-color: #B9C7B4;
  background: color-mix(in srgb, #E1EADB 34%, transparent);
}

.planning-day-card-marker {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: #4A6848;
  background: #E1EADB;
  font-family: var(--font-sans);
  font-size: 0.85rem;
  font-style: normal;
  font-weight: 800;
}

.planning-day-card-name {
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.34rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.18;
}

.planning-day-card strong {
  justify-self: end;
  color: var(--editorial-soft-muted);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.planning-day-card em {
  grid-column: 2 / 4;
  color: #6F685B;
  font-size: 0.9rem;
  font-style: normal;
  font-weight: 800;
  text-align: left;
}

.planning-day-card[data-state="calendar"] em {
  color: var(--primary);
}

.planning-day-card[data-state="recovery"] em {
  color: var(--color-sage);
}

.todays-plan-layout {
  grid-template-columns: minmax(360px, 0.95fr) minmax(300px, 0.85fr);
  gap: 24px;
}

.todays-plan-shell:not(.editorial-page-shell) {
  display: grid;
  min-width: 0;
  place-items: start center;
  padding: 28px 18px 34px;
  border-radius: 8px;
  background: var(--editorial-screen-bg);
}

.todays-plan-page:not(.editorial-page-surface) {
  position: relative;
  width: 100%;
  max-width: 440px;
  min-width: 0;
  overflow: hidden;
  padding: 52px 44px 72px;
  border-left: 1px solid var(--editorial-surface-border);
  border-radius: var(--editorial-page-radius);
  color: var(--editorial-ink);
  background: var(--editorial-paper-bg);
  box-shadow: 0 4px 44px rgba(0, 0, 0, 0.14);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  transition:
    box-shadow var(--editorial-motion-medium) var(--editorial-ease),
    transform var(--editorial-motion-medium) var(--editorial-ease);
}

.todays-plan-page.is-adjusting {
  border-left-color: var(--editorial-adjusted-accent);
  border-left-width: 3px;
  box-shadow: 0 6px 46px rgba(62, 56, 44, 0.16);
}

.getting-started-page {
  max-width: 560px;
}

.getting-started-opening {
  display: grid;
  gap: 12px;
}

.getting-started-options {
  display: grid;
  gap: 24px;
  margin-top: 34px;
}

.getting-started-option {
  display: grid;
  gap: 8px;
  width: 100%;
  padding: 24px 0 28px;
  border: 0;
  border-top: 1px solid #D8CFBD;
  border-radius: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.getting-started-option:last-child {
  border-bottom: 1px solid #D8CFBD;
}

.getting-started-option span {
  color: #796F60;
  font-family: Inter, sans-serif;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.getting-started-option strong {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.18rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.35;
}

.getting-started-option em {
  max-width: 38rem;
  color: #5F584F;
  font-size: 1rem;
  font-style: normal;
  line-height: 1.6;
}

.getting-started-option:hover,
.getting-started-option:focus-visible {
  color: #154B33;
  transform: translateY(-1px);
}

.getting-started-option:focus-visible {
  outline: 2px solid #154B33;
  outline-offset: 5px;
}

.morning-plan-page {
  animation: editorial-fade-reveal var(--editorial-motion-slow) var(--editorial-ease) both;
}

.morning-plan-page:has(.editorial-calendar-layer) {
  animation: none;
  transform: none;
}

.morning-plan-page>.todays-plan-page-header,
.morning-plan-page>.todays-plan-consideration,
.morning-plan-page>.todays-plan-opening,
.morning-plan-page>.todays-plan-rule,
.morning-plan-page>.todays-plan-blocks,
.morning-plan-page>.todays-plan-essentials,
.morning-plan-page>.todays-plan-footer {
  animation: editorial-fade-reveal 440ms var(--editorial-ease-soft) both;
}

.morning-plan-page>.todays-plan-consideration {
  animation-delay: 40ms;
}

.morning-plan-page>.todays-plan-opening {
  animation-delay: 80ms;
}

.morning-plan-page>.todays-plan-rule,
.morning-plan-page>.todays-plan-blocks {
  animation-delay: 120ms;
}

.morning-plan-page>.todays-plan-essentials,
.morning-plan-page>.todays-plan-footer {
  animation-delay: 160ms;
}

.morning-plan-page.is-turning-in,
.morning-plan-page.is-after-page-turn,
.morning-plan-page.is-turning-in>.todays-plan-page-header,
.morning-plan-page.is-turning-in>.todays-plan-consideration,
.morning-plan-page.is-turning-in>.todays-plan-opening,
.morning-plan-page.is-turning-in>.todays-plan-rule,
.morning-plan-page.is-turning-in>.todays-plan-blocks,
.morning-plan-page.is-turning-in>.todays-plan-essentials,
.morning-plan-page.is-turning-in>.todays-plan-footer,
.morning-plan-page.is-after-page-turn>.todays-plan-page-header,
.morning-plan-page.is-after-page-turn>.todays-plan-consideration,
.morning-plan-page.is-after-page-turn>.todays-plan-opening,
.morning-plan-page.is-after-page-turn>.todays-plan-rule,
.morning-plan-page.is-after-page-turn>.todays-plan-blocks,
.morning-plan-page.is-after-page-turn>.todays-plan-essentials,
.morning-plan-page.is-after-page-turn>.todays-plan-footer {
  animation-delay: 0ms;
}

.morning-plan-page.is-after-page-turn,
.morning-plan-page.is-after-page-turn>.todays-plan-page-header,
.morning-plan-page.is-after-page-turn>.todays-plan-consideration,
.morning-plan-page.is-after-page-turn>.todays-plan-opening,
.morning-plan-page.is-after-page-turn>.todays-plan-rule,
.morning-plan-page.is-after-page-turn>.todays-plan-blocks,
.morning-plan-page.is-after-page-turn>.todays-plan-essentials,
.morning-plan-page.is-after-page-turn>.todays-plan-footer {
  animation: none;
}

.morning-plan-page.is-turning-in>.todays-plan-page-header,
.morning-plan-page.is-turning-in>.todays-plan-consideration,
.morning-plan-page.is-turning-in>.todays-plan-opening,
.morning-plan-page.is-turning-in>.todays-plan-rule,
.morning-plan-page.is-turning-in>.todays-plan-blocks,
.morning-plan-page.is-turning-in>.todays-plan-essentials,
.morning-plan-page.is-turning-in>.todays-plan-footer {
  animation: none;
}

.todays-plan-page h1,
.todays-plan-page h2,
.todays-plan-page p,
.todays-plan-content h1,
.todays-plan-content h2,
.todays-plan-content p {
  margin: 0;
}

.todays-plan-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 40px;
}

.editorial-day-header-actions-only {
  position: absolute;
  top: clamp(24px, 5vw, 56px);
  right: clamp(18px, 5vw, 56px);
  z-index: 1;
  justify-content: flex-end;
  margin: 0;
}

.todays-plan-page-header h2,
.todays-plan-page-header time,
.todays-plan-page-header .editorial-date-in-document {
  display: block;
  color: var(--editorial-soft-muted);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
}

.todays-plan-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.todays-plan-actions .text-button {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--editorial-soft-muted);
  background: transparent;
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-actions .text-button:hover {
  color: #6F685B;
  transform: translateY(-1px);
}

.todays-plan-actions .text-button:active {
  opacity: 0.72;
  transform: translateY(1px);
}

.todays-plan-actions .text-button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 6px;
}

.todays-plan-actions .save-entry-button {
  background: transparent;
}

.todays-plan-actions .info-hint {
  color: color-mix(in srgb, var(--color-slate) 82%, black);
  background: color-mix(in srgb, white 34%, transparent);
}

.todays-plan-more-options .more-options-list {
  border-radius: 8px;
}

.todays-plan-opening {
  margin-bottom: 0;
}

.todays-plan-template {
  margin-bottom: 12px;
  color: color-mix(in srgb, var(--color-stone) 82%, var(--color-slate));
  font-size: 0.78rem;
  line-height: 1.5;
}

.todays-plan-template strong {
  color: color-mix(in srgb, var(--color-slate) 88%, black);
  font-weight: 600;
}

.todays-plan-opening h1 {
  max-width: none;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.22;
}

.todays-plan-opening>p:last-child {
  margin-top: 20px;
  color: var(--editorial-body);
  font-size: 0.9rem;
  line-height: 1.82;
}

.todays-plan-rule {
  height: 1px;
  margin: 44px 0;
  background: var(--editorial-rule);
}

.todays-plan-blocks {
  display: grid;
  gap: 0;
}

.todays-plan-phase {
  margin-bottom: 28px;
}

.todays-plan-phase:last-child {
  margin-bottom: 0;
}

.todays-plan-phase-header {
  display: grid;
  gap: 10px;
  width: 100%;
  margin-bottom: 22px;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-phase-header:hover {
  transform: translateY(-1px);
}

.todays-plan-phase-header:active {
  opacity: 0.78;
  transform: translateY(1px);
}

.todays-plan-phase-header:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.38);
  outline-offset: 8px;
}

.todays-plan-phase-header:hover .todays-plan-phase-row>span:first-child,
.todays-plan-phase-header:focus-visible .todays-plan-phase-row>span:first-child {
  color: #7E786D;
}

.todays-plan-phase-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
}

.todays-plan-phase-row>span:first-child,
.todays-plan-consideration>p,
.todays-plan-essentials>p {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
  transition: color var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-phase-row>span:last-child {
  flex: none;
  color: #C8BEA8;
  font-size: 0.68rem;
  letter-spacing: 0;
  text-transform: none;
}

.todays-plan-phase-interpretation {
  color: #7A7468;
  font-size: 0.82rem;
  font-style: italic;
  line-height: 1.6;
  transition: color var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-phase-header[aria-expanded="false"] .todays-plan-phase-interpretation {
  color: #B0A898;
}

.editorial-day-phase-static {
  cursor: default;
}

.editorial-day-phase-static:hover,
.editorial-day-phase-static:active {
  opacity: 1;
  transform: none;
}

.todays-plan-phase-blocks {
  display: grid;
  gap: 24px;
  animation: editorial-soft-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.todays-plan-block.readonly-block {
  display: block;
  margin-bottom: 26px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  transition:
    padding-left var(--editorial-motion-medium) var(--editorial-ease),
    border-color var(--editorial-motion-medium) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-block.readonly-block.has-adjust-option {
  padding-left: 10px;
  border-left: 2px solid #8EAA8C;
}

.todays-plan-block.readonly-block.is-suggested-block {
  padding-left: 12px;
  border-left: 2px solid #C4A468;
}

.todays-plan-block.readonly-block[data-adjust-option="shorter"],
.todays-plan-block.readonly-block[data-adjust-option="remove"] {
  border-left-color: #C8A870;
}

.editorial-day-activity-editor {
  display: block;
  padding: 18px 0 0;
  border-top: 1px solid var(--editorial-rule);
}

.editorial-day-activity-fields {
  display: grid;
  grid-template-columns: 118px 1px minmax(0, 1fr) 30px;
  column-gap: 14px;
  row-gap: 8px;
  align-items: start;
  transition: grid-template-columns var(--editorial-motion-short) var(--editorial-ease);
}

.editorial-day-activity-fields:has(.editorial-day-time-field input:focus) {
  grid-template-columns: 136px 1px minmax(0, 1fr) 30px;
}

.editorial-day-activity-fields .field {
  gap: 0;
  min-width: 0;
  color: #6A6458;
}

.editorial-day-activity-fields .field span {
  color: var(--editorial-soft-muted);
  font-size: 0.62rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.editorial-day-activity-fields input,
.editorial-day-activity-fields select {
  box-sizing: border-box;
  min-height: 32px;
  max-width: 100%;
  border-color: #CFC6B7;
  border-radius: 4px;
  background: rgba(255, 252, 247, 0.42);
  color: var(--editorial-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  line-height: 1.35;
}

.editorial-day-time-field input {
  width: 100%;
  border-color: transparent;
  background: transparent;
  padding-left: 0;
  font-size: 1rem;
}

.editorial-day-time-field input:focus {
  padding: 0 6px;
  border-color: #9BAA99;
  background: rgba(255, 252, 247, 0.68);
}

.editorial-day-time-range-fields {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.editorial-day-time-message,
.editorial-day-sheet-message {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.82rem;
  font-style: italic;
  line-height: 1.45;
}

.todays-plan-block-time .schedule-block-duration {
  color: color-mix(in srgb, #B8B0A4 76%, var(--editorial-paper-bg));
  font-weight: 400;
}

.editorial-day-activity-rule {
  width: 1px;
  min-height: 82px;
  background: #C9A06D;
}

.editorial-day-activity-main {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.editorial-day-activity-line {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.editorial-day-activity-main .activity-field {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
}

.editorial-day-activity-main input {
  width: 100%;
  min-width: 0;
}

.editorial-day-activity-main input {
  min-height: 30px;
  padding: 0;
  border-color: transparent;
  background: transparent;
  font-size: 1rem;
  font-weight: 700;
}

.editorial-day-activity-main input:focus {
  padding: 0 7px;
  border-color: #9BAA99;
  background: rgba(255, 252, 247, 0.68);
}

.editorial-day-activity-main p {
  max-width: 100%;
  color: #4B4740;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.editorial-day-category-cell {
  flex: 0 0 auto;
  min-width: max-content;
}

.editorial-day-kind-field {
  width: max-content;
}

.editorial-day-kind-field select {
  appearance: none;
  -webkit-appearance: none;
  width: auto;
  min-width: max-content;
  min-height: 22px;
  padding: 2px 38px 2px 12px;
  border: 0;
  border-radius: 999px;
  color: #124A2F;
  background-color: #DCEBDD;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.25 1.5 6 6.25 10.75 1.5' fill='none' stroke='%23124A2F' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 12px 8px;
  font-family: var(--font-sans);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1.1;
  text-transform: uppercase;
}

.editorial-day-kind-field select:focus {
  outline: 2px solid rgba(139, 160, 137, 0.44);
  outline-offset: 2px;
}

.editorial-day-activity-editor[data-type="work"] .editorial-day-kind-field select,
.editorial-day-activity-editor[data-type="business"] .editorial-day-kind-field select,
.editorial-day-activity-editor[data-type="social"] .editorial-day-kind-field select,
.editorial-day-activity-editor[data-type="errand"] .editorial-day-kind-field select,
.editorial-day-activity-editor[data-type="travel"] .editorial-day-kind-field select,
.editorial-day-activity-editor[data-type="medical"] .editorial-day-kind-field select,
.editorial-day-activity-editor[data-type="commute"] .editorial-day-kind-field select {
  color: #78582E;
  background-color: #EDE4D2;
}

.editorial-day-activity-editor[data-type="meal"] .editorial-day-kind-field select {
  color: #3B6666;
  background-color: #DBE8E8;
}

.editorial-day-activity-editor[data-type="stim"] .editorial-day-kind-field select {
  color: #5C4C70;
  background-color: #E6E1ED;
}

.editorial-day-overflow-menu {
  position: relative;
  justify-self: end;
  margin-top: 5px;
}

.editorial-day-overflow-button {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.1rem;
  line-height: 1;
}

.editorial-day-overflow-button:hover {
  color: var(--editorial-ink);
  background: rgba(214, 204, 186, 0.34);
}

.editorial-day-overflow-list {
  position: absolute;
  right: 0;
  z-index: 4;
  display: grid;
  min-width: 126px;
  margin-top: 6px;
  padding: 6px;
  border: 1px solid var(--editorial-rule);
  border-radius: 6px;
  background: #FFFDF8;
  box-shadow: 0 14px 28px rgba(72, 61, 45, 0.14);
}

.editorial-day-overflow-list .text-button {
  justify-content: flex-start;
  width: 100%;
  min-height: 34px;
  margin: 0;
  border: 0;
  background: transparent;
  color: #7B423D;
  font-size: 0.82rem;
}

.editorial-day-add-row {
  display: block;
  margin: 8px 0 28px;
}

.editorial-day-add-row .editorial-day-new-activity {
  justify-content: flex-start;
  width: auto;
  min-height: 0;
  margin-top: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #0F4A2D;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  font-weight: 700;
}

.editorial-day-add-row .editorial-day-new-activity span[aria-hidden="true"] {
  font-size: 1.32rem;
  line-height: 1;
}

.planning-flow:not(.editorial-page-shell) {
  width: 100%;
  min-height: 100vh;
  margin: 0;
  padding: clamp(72px, 8vw, 104px) clamp(18px, 5vw, 64px) clamp(56px, 8vw, 96px);
  background: var(--editorial-screen-bg);
  justify-items: center;
}

.planning-editorial-panel .todays-plan-page {
  position: static;
  display: grid;
  grid-template-rows: auto auto auto 1fr auto auto;
  max-width: none;
  min-height: min(1180px, calc(100vh - clamp(144px, 16vw, 208px)));
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.planning-flow-header.todays-plan-page-header {
  margin-bottom: var(--editorial-intro-gap);
}

.planning-editorial-panel .editorial-day-page .todays-plan-blocks {
  align-self: start;
}

.planning-editorial-panel .editorial-day-page .todays-plan-footer {
  align-self: end;
}

.planning-editorial-panel .todays-plan-opening h1 {
  max-width: 660px;
  font-size: clamp(2.15rem, 4.8vw, 3.25rem);
  line-height: 1.1;
}

.planning-editorial-panel .todays-plan-opening>p:last-child,
.planning-editorial-panel .todays-plan-phase-interpretation,
.planning-editorial-panel .empty-state {
  max-width: 620px;
  font-size: 1.02rem;
  line-height: 1.72;
}

.planning-editorial-panel .editorial-day-footer .editorial-day-finish-button,
.planning-editorial-panel .todays-plan-actions .text-button {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.editorial-day-footer .editorial-day-finish-button {
  font-size: 0.9rem;
  line-height: 1.45;
}

.editorial-day-sheet-layer {
  position: fixed;
  inset: 0;
  z-index: 30;
  pointer-events: none;
}

.editorial-day-sheet-scrim {
  position: fixed;
  inset: 0;
  border: 0;
  background: rgba(44, 42, 37, 0.18);
  pointer-events: auto;
}

.editorial-day-bottom-sheet {
  position: fixed;
  right: auto;
  bottom: max(14px, env(safe-area-inset-bottom));
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  display: grid;
  gap: 28px;
  width: min(640px, calc(100% - 28px));
  margin: 0;
  padding: 32px clamp(24px, 6vw, 52px) max(30px, env(safe-area-inset-bottom));
  border: 1px solid color-mix(in srgb, var(--color-sage) 18%, transparent);
  border-radius: 0;
  background: color-mix(in srgb, var(--color-cream) 86%, white);
  box-shadow: 0 18px 48px rgba(72, 61, 45, 0.16);
  pointer-events: auto;
}

.editorial-day-bottom-sheet::before {
  display: none;
  content: none;
}

.editorial-day-sheet-heading {
  display: grid;
  gap: 10px;
}

.editorial-day-bottom-sheet h3 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: clamp(1.42rem, 4vw, 1.82rem);
  font-weight: 700;
  line-height: 1.14;
}

.editorial-day-bottom-sheet .eyebrow {
  margin: 0;
  color: var(--editorial-soft-muted);
}

.editorial-day-sheet-grid {
  display: grid;
  gap: 26px;
}

.editorial-day-sheet-field {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0 0 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--editorial-rule) 82%, transparent);
}

.editorial-day-sheet-field span:not(.sr-only) {
  color: var(--editorial-soft-muted);
  font-family: var(--font-sans);
  font-size: 0.66rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.13em;
  line-height: 1.45;
  text-transform: uppercase;
}

.editorial-day-bottom-sheet input,
.editorial-day-bottom-sheet select {
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--editorial-ink);
  background: transparent;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.16rem;
  font-weight: 600;
  line-height: 1.45;
  box-shadow: none;
}

.editorial-day-bottom-sheet input:focus,
.editorial-day-bottom-sheet select:focus {
  outline: 0;
}

.editorial-day-sheet-field:focus-within {
  border-bottom-color: color-mix(in srgb, var(--primary) 56%, var(--editorial-rule));
}

.editorial-day-sheet-field:focus-within input,
.editorial-day-sheet-field:focus-within select {
  background: color-mix(in srgb, white 22%, transparent);
  box-shadow: 0 7px 0 -6px color-mix(in srgb, var(--primary) 36%, transparent);
}

.editorial-day-bottom-sheet select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.25 1.5 6 6.25 10.75 1.5' fill='none' stroke='%236A6458' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 2px center;
  background-size: 12px 8px;
  padding-right: 28px;
}

.editorial-day-sheet-actions {
  display: flex;
  align-items: end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px 44px;
  padding-top: 2px;
}

.editorial-day-sheet-primary-action {
  display: grid;
  gap: 6px;
}

.editorial-day-sheet-primary-action>span {
  color: var(--editorial-soft-muted);
  font-family: var(--font-sans);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
}

.editorial-day-sheet-actions .text-button {
  width: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--editorial-soft-muted);
  background: transparent;
  box-shadow: none;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  font-weight: 700;
  text-align: left;
}

.editorial-day-sheet-actions .text-button:hover,
.editorial-day-sheet-actions .text-button:focus-visible {
  border: 0;
  color: var(--editorial-soft-muted);
  background: transparent;
}

.editorial-day-sheet-actions .compact-button {
  margin-left: auto;
}

.todays-plan-block-toggle {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  gap: 14px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-block-toggle:hover {
  transform: translateY(-1px);
}

.todays-plan-block-toggle:active {
  opacity: 0.78;
  transform: translateY(1px);
}

.todays-plan-block-toggle:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

.todays-plan-block-toggle:hover .todays-plan-block-meaning,
.todays-plan-block-toggle:focus-visible .todays-plan-block-meaning {
  color: #4F493F;
}

.todays-plan-chevron {
  align-self: start;
  display: inline-block;
  margin-top: 3px;
  color: #C8BEA8;
  font-family: inherit;
  font-size: 0.68rem;
  line-height: 1;
  transform: rotate(0deg);
  transform-origin: center;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-medium) var(--editorial-ease);
}

.todays-plan-block-toggle[aria-expanded="true"] .todays-plan-chevron {
  color: #C8BEA8;
  transform: rotate(180deg);
}

.todays-plan-block-time,
.todays-plan-block.readonly-block>span {
  padding-top: 2px;
  color: #B8B0A4;
  font-size: 0.68rem;
  font-weight: 400;
  line-height: 1.5;
}

.todays-plan-block .schedule-card-title-line {
  gap: 8px;
  margin-bottom: 5px;
}

.todays-plan-block .schedule-card-title-line strong {
  color: var(--editorial-ink);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.3;
}

.todays-plan-block .block-type-badge {
  min-height: 0;
  padding: 2px 8px;
  border: 0;
  border-radius: 2px;
  font-family: inherit;
  font-size: 0.56rem;
  font-weight: 600;
  letter-spacing: 0.09em;
}

.todays-plan-block .block-type-badge[data-kind="Recovery"] {
  color: #4A6848;
  background: #E3EDE1;
}

.todays-plan-block .block-type-badge[data-kind="Demand"] {
  color: #78582E;
  background: #EDE4D2;
}

.todays-plan-block .block-type-badge[data-kind="Meal"] {
  color: #3B6666;
  background: #DBE8E8;
}

.todays-plan-block .block-type-badge[data-kind="Stim"] {
  color: #5C4C70;
  background: #E6E1ED;
}

.todays-plan-block-adjust-label {
  color: #6A8A68;
  font-size: 0.82rem;
  font-style: normal;
  line-height: 1.3;
}

.todays-plan-block-adjust-label[data-option="remove"] {
  color: #8A6840;
}

.todays-plan-block-suggestion-label {
  color: #8A6840;
  font-size: 0.82rem;
  font-style: italic;
  line-height: 1.3;
}

.todays-plan-block .todays-plan-block-meaning {
  display: block;
  margin-top: 0;
  color: #6A6458;
  font-size: 0.82rem;
  font-style: italic;
  line-height: 1.65;
  transition: color var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-block-meta {
  display: block;
  margin-top: 7px;
  color: color-mix(in srgb, var(--color-stone) 84%, var(--color-slate));
  font-family: var(--font-sans);
  font-size: 0.78rem;
  line-height: 1.5;
}

.todays-plan-block-expanded {
  display: grid;
  gap: 14px;
  margin-top: 14px;
  margin-left: 72px;
  padding-left: 14px;
  border-left: 1px solid var(--editorial-rule);
  animation: editorial-detail-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.todays-plan-block-expanded p {
  color: #6A6458;
  font-size: 0.82rem;
  font-style: italic;
  line-height: 1.65;
}

.todays-plan-block-expanded .todays-plan-block-detail {
  color: #5A5448;
  font-style: normal;
  line-height: 1.85;
}

.todays-plan-context-group {
  display: grid;
  gap: 7px;
}

.todays-plan-context-group>p:first-child,
.todays-plan-adjust-options>p {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1.5;
  text-transform: uppercase;
}

.todays-plan-context-group>span {
  width: fit-content;
  padding: 4px 11px;
  border-radius: 3px;
  color: #4A6848;
  background: #E3EDE1;
  font-size: 0.78rem;
}

.todays-plan-consideration {
  padding: 26px 30px 30px;
  margin-bottom: 46px;
  border-radius: 4px;
  background: #EDE8DA;
  transition:
    margin var(--editorial-motion-medium) var(--editorial-ease),
    padding var(--editorial-motion-medium) var(--editorial-ease),
    background-color var(--editorial-motion-medium) var(--editorial-ease);
}

.todays-plan-consideration.is-compact {
  padding: 14px 16px;
  margin-top: -16px;
  margin-bottom: 32px;
  animation: editorial-soft-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.todays-plan-consideration>p,
.todays-plan-essentials>p {
  margin-bottom: 20px;
}

.todays-plan-consideration>p:first-child {
  font-size: 0.72rem;
  letter-spacing: 0.16em;
}

.todays-plan-consideration>p:last-child {
  margin-bottom: 0;
  color: #4C4438;
  font-size: 1.08rem;
  font-style: italic;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.8;
  text-transform: none;
}

.todays-plan-consideration.is-compact>p {
  margin-bottom: 14px;
}

.todays-plan-consideration.is-compact>p:first-child {
  font-size: 0.625rem;
  letter-spacing: 0.14em;
}

.todays-plan-consideration.is-compact>p:last-child {
  font-size: 0.84rem;
  font-weight: 500;
  line-height: 1.8;
}

.todays-plan-adjust-panel {
  display: grid;
  gap: 14px;
  margin-top: 2px;
  padding-top: 16px;
  border-top: 1px solid var(--editorial-rule);
  animation: editorial-detail-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.todays-plan-adjust-panel>p {
  color: #7A7060;
  font-size: 0.78rem;
  font-style: italic;
  line-height: 1.72;
}

.todays-plan-adjust-options {
  display: grid;
  gap: 10px;
}

.todays-plan-adjust-option {
  display: grid;
  gap: 6px;
}

.todays-plan-adjust-option button {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 0.82rem;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-adjust-option button:hover {
  color: #4F493F;
  transform: translateX(2px);
}

.todays-plan-adjust-option button:active {
  opacity: 0.76;
  transform: translateX(1px);
}

.todays-plan-adjust-option button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 5px;
}

.todays-plan-adjust-option[data-selected="true"] button {
  color: #4A6848;
}

.todays-plan-adjust-option[data-selected="true"][data-option="remove"] button {
  color: #8A6840;
}

.todays-plan-adjust-option p {
  margin-left: 18px;
  color: #6A8A68;
  font-size: 0.75rem;
  font-style: italic;
  line-height: 1.65;
  animation: editorial-detail-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.todays-plan-adjust-option[data-option="remove"] p {
  color: #8A6840;
}

.todays-plan-fixed-note {
  color: var(--editorial-soft-muted);
  font-size: 0.75rem;
  font-style: italic;
}

.todays-plan-reminders {
  display: grid;
  gap: 14px;
  margin-top: 8px;
  margin-bottom: 8px;
}

.todays-plan-reminders-heading {
  margin-bottom: 0;
}

.todays-plan-reminder-list {
  display: grid;
  gap: 18px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.todays-plan-reminder-item {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 14px;
  align-items: baseline;
}

.todays-plan-reminder-item>span {
  justify-self: start;
  width: 8px;
  height: 8px;
  margin-top: 8px;
  border: 1px solid color-mix(in srgb, var(--editorial-focus) 54%, var(--editorial-rule));
  border-radius: 999px;
  background: color-mix(in srgb, var(--editorial-focus) 18%, transparent);
}

.todays-plan-reminder-item.is-overdue>span {
  border-color: color-mix(in srgb, var(--editorial-focus) 76%, var(--editorial-muted));
  background: var(--editorial-focus);
}

.todays-plan-reminder-item div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.todays-plan-reminder-item strong {
  color: var(--editorial-ink);
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
}

.todays-plan-reminder-item em {
  color: var(--editorial-muted);
  font-size: 0.78rem;
  font-style: italic;
  line-height: 1.45;
}

.todays-plan-reminder-diagnostic {
  color: var(--editorial-muted);
  font-size: 0.72rem;
  letter-spacing: 0;
  line-height: 1.4;
  margin: 0;
}

.todays-plan-essentials {
  margin-bottom: 52px;
}

.todays-plan-essentials div {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.todays-plan-essentials span {
  display: inline-flex;
  align-items: center;
  min-height: 29px;
  padding: 5px 12px;
  border-radius: 3px;
  color: #4A6848;
  background: #E3EDE1;
  font-size: 0.78rem;
}

.todays-plan-essentials span.is-custom {
  color: #5A5060;
  background: #EAE5EF;
}

.todays-plan-essentials-note {
  margin-top: 10px;
  color: #C8BEA8;
  font-size: 0.68rem;
  font-style: italic;
  line-height: 1.5;
}

.todays-plan-empty-note {
  color: color-mix(in srgb, var(--color-stone) 82%, var(--color-slate));
  font-size: 0.84rem;
  font-style: italic;
  line-height: 1.55;
}

.todays-plan-footer {
  display: grid;
  gap: 6px;
}

.todays-plan-finish-button {
  width: fit-content;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.todays-plan-finish-button:hover {
  color: var(--editorial-ink);
  transform: translateY(-1px);
}

.todays-plan-finish-button:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.todays-plan-finish-button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 7px;
}

.todays-plan-footer span {
  color: #C0B8A8;
  font-size: 0.75rem;
}

.day-review-page {
  animation: editorial-page-arrive var(--editorial-motion-slow) var(--editorial-ease) both;
}

.day-review-opening h1 {
  font-size: 1.82rem;
}

.day-review-recommendation {
  display: grid;
  gap: 16px;
  margin-top: 42px;
  padding: 30px;
  border-radius: 4px;
  background: #EDE8DA;
}

.day-review-recommendation>p:first-child,
.day-review-recommendation div>p:first-child,
.day-review-section-heading span {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.day-review-recommendation h2 {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.42rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25;
}

.day-review-recommendation>p:nth-of-type(2),
.day-review-recommendation-reason,
.day-review-recommendation div>p:last-child {
  color: #5A5448;
  font-size: 0.9rem;
  line-height: 1.75;
}

.day-review-recommendation div {
  display: grid;
  gap: 8px;
  padding-top: 18px;
  border-top: 1px solid var(--editorial-rule);
}

.day-review-schedule {
  display: grid;
  gap: 24px;
}

.day-review-navigation {
  display: grid;
  gap: 18px;
}

.day-review-navigation button {
  width: fit-content;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.day-review-navigation button:hover,
.day-review-navigation button:focus-visible {
  color: var(--editorial-ink);
  transform: translateY(-1px);
}

.day-review-navigation button:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.day-review-navigation button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 7px;
}

.day-review-navigation button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
}

.day-review-decision-panel {
  margin-top: 20px;
}

.weekly-overview-screen:not(.editorial-page-shell) {
  display: grid;
  min-height: 100vh;
  place-items: start center;
  padding: 28px 18px 34px;
  background: var(--editorial-screen-bg);
}

.weekly-overview-page {
  animation: editorial-page-arrive var(--editorial-motion-slow) var(--editorial-ease) both;
}

.weekly-overview-page h3 {
  margin: 0;
  font: inherit;
}

.weekly-overview-header {
  margin-bottom: 56px;
}

.weekly-overview-opening {
  margin-bottom: 0;
}

.weekly-overview-opening h1 {
  max-width: 350px;
}

.weekly-overview-section {
  display: grid;
  gap: 14px;
  margin-bottom: 34px;
}

.weekly-overview-section:last-of-type {
  margin-bottom: 0;
}

.weekly-overview-section-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
}

.weekly-overview-section-heading h3 {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.weekly-overview-rhythm {
  display: grid;
  gap: 11px;
  margin-top: 4px;
}

.weekly-overview-rhythm[data-mode="planning"] {
  gap: 0;
}

.weekly-overview-rhythm-row {
  --weekly-rhythm-dot: #6A6458;
  --weekly-rhythm-label: #6A6458;
  --weekly-rhythm-label-weight: 500;
  display: grid;
  grid-template-columns: minmax(86px, 1fr) auto minmax(72px, auto);
  gap: 12px;
  align-items: center;
  color: #6A6458;
  font-size: 0.88rem;
  line-height: 1.45;
}

.weekly-overview-rhythm-button {
  grid-template-columns: minmax(86px, 1fr) auto minmax(116px, auto) auto;
  width: 100%;
  min-height: 48px;
  padding: 14px 0;
  border: 0;
  border-bottom: 1px solid #D8CFBE;
  border-radius: 0;
  background: transparent;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    background var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.weekly-overview-rhythm-button:hover,
.weekly-overview-rhythm-button:focus-visible {
  background: color-mix(in srgb, var(--color-cream) 46%, transparent);
  transform: translateY(-1px);
}

.weekly-overview-rhythm-button:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 38%, transparent);
  outline-offset: 5px;
}

.weekly-overview-rhythm-affordance {
  color: color-mix(in srgb, var(--weekly-rhythm-label) 44%, transparent);
  font-size: 0.9rem;
  line-height: 1;
  opacity: 0.58;
  transform: translateX(0);
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.weekly-overview-rhythm-button:hover .weekly-overview-rhythm-affordance,
.weekly-overview-rhythm-button:focus-visible .weekly-overview-rhythm-affordance {
  opacity: 0.82;
  transform: translateX(2px);
}

.weekly-overview-rhythm-row[data-tone="heavy"] {
  --weekly-rhythm-dot: #3F503D;
  --weekly-rhythm-label: #3F503D;
  --weekly-rhythm-label-weight: 700;
}

.weekly-overview-rhythm-row[data-tone="recovery"] {
  --weekly-rhythm-dot: #7D906D;
  --weekly-rhythm-label: #6E835E;
  --weekly-rhythm-label-weight: 500;
}

.weekly-overview-rhythm-row[data-tone="balanced"] {
  --weekly-rhythm-dot: #71825F;
  --weekly-rhythm-label: #6A6458;
  --weekly-rhythm-label-weight: 500;
}

.weekly-overview-rhythm-row[data-tone="light"] {
  --weekly-rhythm-dot: #98A493;
  --weekly-rhythm-label: #8C877B;
  --weekly-rhythm-label-weight: 400;
}

.weekly-overview-rhythm-row[data-tone="rest"] {
  --weekly-rhythm-dot: #D8D0C0;
  --weekly-rhythm-label: #B0A797;
  --weekly-rhythm-label-weight: 400;
}

.weekly-overview-rhythm-row[data-tone="unplanned"] {
  --weekly-rhythm-dot: #D8D0C0;
  --weekly-rhythm-label: #A59C8C;
  --weekly-rhythm-label-weight: 400;
}

.weekly-overview-rhythm-row[data-tone="planned"] {
  --weekly-rhythm-dot: #98A493;
  --weekly-rhythm-label: #6E835E;
  --weekly-rhythm-label-weight: 500;
}

.weekly-overview-rhythm-row>span:first-child {
  color: #8E887C;
}

.weekly-overview-rhythm-row strong {
  color: var(--weekly-rhythm-label);
  font-size: 0.78rem;
  font-weight: var(--weekly-rhythm-label-weight);
  text-align: right;
}

.weekly-overview-dots {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.weekly-overview-dots span {
  width: 6px;
  height: 6px;
  border: 1px solid #D8D0C0;
  border-radius: 50%;
  background: transparent;
}

.weekly-overview-dots span.is-filled {
  border-color: var(--weekly-rhythm-dot);
  background: var(--weekly-rhythm-dot);
}

.weekly-overview-noticed p,
.weekly-overview-disclosure p,
.weekly-overview-plan p {
  color: var(--editorial-text-muted);
  font-size: 0.92rem;
  font-style: italic;
  line-height: 1.65;
}

.weekly-overview-footer {
  margin-top: 58px;
  padding-top: 28px;
  border-top: 1px solid var(--editorial-divider);
}

.weekly-overview-footer-actions,
.weekly-overview-footer .editorial-footer-actions {
  display: grid;
  gap: 34px;
}

.weekly-overview-footer button,
.weekly-overview-footer .editorial-continue-action {
  position: relative;
  display: grid;
  gap: 7px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.weekly-overview-footer button::after,
.weekly-overview-footer .editorial-continue-action::after {
  position: absolute;
  left: 0;
  bottom: -16px;
  width: 40px;
  height: 2px;
  background: #CFC5B1;
  opacity: 0.6;
  transform: scaleX(1);
  transform-origin: left center;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-medium) var(--editorial-ease);
  content: "";
}

.weekly-overview-footer span {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.weekly-overview-footer strong {
  color: var(--editorial-text-muted);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.weekly-overview-footer button:hover,
.weekly-overview-footer button:focus-visible,
.weekly-overview-footer .editorial-continue-action:hover,
.weekly-overview-footer .editorial-continue-action:focus-visible {
  transform: translateY(-1px);
}

.weekly-overview-footer button:hover strong,
.weekly-overview-footer button:focus-visible strong,
.weekly-overview-footer .editorial-continue-action:hover strong,
.weekly-overview-footer .editorial-continue-action:focus-visible strong {
  color: var(--editorial-ink);
}

.weekly-overview-footer button:hover::after,
.weekly-overview-footer button:focus-visible::after,
.weekly-overview-footer .editorial-continue-action:hover::after,
.weekly-overview-footer .editorial-continue-action:focus-visible::after {
  opacity: 0.9;
  transform: scaleX(1.12);
}

.weekly-overview-footer button:active,
.weekly-overview-footer .editorial-continue-action:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.weekly-overview-footer button:focus-visible,
.weekly-overview-footer .editorial-continue-action:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--editorial-focus) 42%, transparent);
  outline-offset: 8px;
}

.calendar-connection-opening p+p {
  margin-top: 14px;
}

.calendar-connection-section p {
  color: #6A6458;
  font-size: 0.9rem;
  line-height: 1.75;
}

.calendar-connection-section p+p {
  margin-top: 10px;
}

.calendar-connection-week-range {
  margin-bottom: 18px;
  color: #7A7468;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.5;
}

.calendar-connection-bullets {
  display: grid;
  gap: 13px;
  margin: 0;
  padding-left: 1.1rem;
  color: #6A6458;
  font-size: 0.92rem;
  line-height: 1.65;
}

.calendar-connection-bullets li::marker {
  color: var(--editorial-soft-muted);
}

.calendar-connection-trust {
  margin-top: 34px;
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.6;
}

.calendar-connection-option,
.calendar-connection-week-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  font: inherit;
  text-align: left;
}

button.calendar-connection-option {
  cursor: pointer;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

button.calendar-connection-option:hover,
button.calendar-connection-option:focus-visible {
  transform: translateY(-1px);
}

button.calendar-connection-option:active {
  opacity: 0.76;
  transform: translateY(1px);
}

button.calendar-connection-option:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

.calendar-connection-options,
.calendar-connection-week-list {
  display: grid;
  gap: 14px;
}

.calendar-connection-preview-day {
  min-width: 0;
  padding-block: 2px 6px;
}

.calendar-connection-preview-day+.calendar-connection-preview-day {
  margin-top: 8px;
}

.calendar-connection-preview-day-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: baseline;
  min-height: 36px;
  margin-bottom: 8px;
  cursor: pointer;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

button.calendar-connection-preview-day-header {
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
  text-align: left;
}

button.calendar-connection-preview-day-header:hover,
button.calendar-connection-preview-day-header:focus-visible {
  transform: translateY(-1px);
}

button.calendar-connection-preview-day-header:active {
  opacity: 0.76;
  transform: translateY(1px);
}

button.calendar-connection-preview-day-header:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

.calendar-connection-preview-day-name {
  min-width: 0;
}

.calendar-connection-preview-day-count {
  white-space: nowrap;
}

.calendar-connection-preview-day-chevron {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: 3px;
  border-right: 1.5px solid var(--editorial-soft-muted);
  border-bottom: 1.5px solid var(--editorial-soft-muted);
  transform: rotate(45deg) translateY(-1px);
  transform-origin: center;
  transition: transform var(--editorial-motion-short) var(--editorial-ease);
}

.calendar-connection-preview-day-header[aria-expanded="false"] .calendar-connection-preview-day-chevron {
  transform: rotate(-45deg) translateY(0);
}

.calendar-connection-preview-events {
  display: grid;
  gap: 0;
  min-width: 0;
}

.calendar-connection-preview-events[hidden] {
  display: none;
}

.calendar-connection-preview-event {
  display: grid;
  grid-template-columns: minmax(58px, 74px) minmax(0, 1fr);
  gap: 16px;
  min-width: 0;
  padding: 14px 0;
  border-top: 1px solid rgba(216, 207, 189, 0.72);
}

.calendar-connection-preview-event-time {
  min-width: 0;
  color: #8A8376;
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.calendar-connection-preview-event-title {
  min-width: 0;
  color: var(--editorial-ink);
  font-size: 0.96rem;
  font-weight: 500;
  line-height: 1.55;
  overflow-wrap: anywhere;
  word-break: normal;
}

.calendar-connection-option strong,
.calendar-connection-week-row span {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.45;
}

.calendar-connection-option span,
.calendar-connection-week-row strong {
  color: #7A7468;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.5;
}

.calendar-connection-option.is-disabled {
  opacity: 0.72;
}

.calendar-connection-footer--sticky-preview {
  position: sticky;
  bottom: 0;
  z-index: 8;
  margin-inline: -2px;
  margin-top: 46px;
  padding: 22px 2px calc(18px + env(safe-area-inset-bottom));
  border-top-color: rgba(216, 207, 189, 0.9);
  background:
    linear-gradient(180deg, rgba(237, 234, 222, 0), var(--editorial-paper-bg) 18px),
    var(--editorial-paper-bg);
}

.weekly-planner-opening h1 {
  max-width: 360px;
}

.weekly-planner-start-card {
  display: grid;
  gap: 22px;
  margin-top: 44px;
  padding: 30px 0 0;
  border-top: 1px solid #D8CFBD;
  animation: editorial-soft-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.weekly-planner-start-card>p:first-child,
.weekly-planner-day-selector>div:first-child p {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.weekly-planner-start-row {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  padding-bottom: 6px;
}

.weekly-planner-start-row strong {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.15;
  text-align: left;
}

.weekly-planner-start-row .weekly-overview-dots span {
  width: 8px;
  height: 8px;
}

.weekly-planner-start-card ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 1.05rem;
  color: #5A5448;
  font-size: 0.92rem;
  line-height: 1.65;
}

.weekly-planner-start-card li::marker {
  color: var(--editorial-soft-muted);
}

.weekly-planner-reviewed-note {
  margin: 2px 0 0;
  color: #7A7468;
  font-size: 0.78rem;
  font-style: italic;
  line-height: 1.6;
}

.weekly-planner-opening-actions {
  gap: 30px;
}

.weekly-planner-day-selector {
  display: grid;
  gap: 18px;
  margin-top: 34px;
  padding: 24px;
  border: 1px solid #D8CFBD;
  border-radius: 4px;
  background: #EDE8DA;
  animation: editorial-detail-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.weekly-planner-day-selector>div:first-child {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.weekly-planner-day-selector>div:first-child button,
.weekly-planner-day-selector-review {
  width: fit-content;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.weekly-planner-day-selector>p,
.weekly-planner-day-selector-note {
  color: #6A6458;
  font-size: 0.82rem;
  font-style: italic;
  line-height: 1.6;
}

.weekly-planner-day-selector [role="list"] {
  display: grid;
  gap: 10px;
}

.weekly-planner-day-option {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.weekly-planner-day-option>span:first-child {
  color: #6A6458;
  font-size: 0.9rem;
  line-height: 1.45;
}

.weekly-planner-day-option[data-selected="true"]>span:first-child {
  color: var(--editorial-ink);
  font-weight: 600;
}

.weekly-planner-day-option>strong {
  color: #6A6458;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.weekly-planner-day-option[data-reviewed="true"]>strong {
  color: #475C48;
}

.weekly-planner-day-option:hover,
.weekly-planner-day-option:focus-visible,
.weekly-planner-day-selector>div:first-child button:hover,
.weekly-planner-day-selector>div:first-child button:focus-visible,
.weekly-planner-day-selector-review:hover,
.weekly-planner-day-selector-review:focus-visible {
  color: var(--editorial-ink);
  transform: translateY(-1px);
}

.weekly-planner-day-option:active,
.weekly-planner-day-selector>div:first-child button:active,
.weekly-planner-day-selector-review:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.weekly-planner-day-option:focus-visible,
.weekly-planner-day-selector>div:first-child button:focus-visible,
.weekly-planner-day-selector-review:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 6px;
}

.weekly-planner-day-selector-review {
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
}

.weekly-planner-review-prompt,
.weekly-planner-recommendation-card {
  display: grid;
  gap: 16px;
  margin-top: 42px;
  padding-top: 28px;
  border-top: 1px solid #D8CFBD;
  animation: editorial-soft-reveal var(--editorial-motion-medium) var(--editorial-ease-soft) both;
}

.weekly-planner-review-prompt>p:first-child,
.weekly-planner-recommendation-card>p:first-child,
.weekly-planner-editor-stub>p {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.weekly-planner-review-context {
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.55;
  text-transform: none;
}

.weekly-planner-review-prompt button {
  display: grid;
  gap: 6px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.weekly-planner-review-prompt button:hover,
.weekly-planner-review-prompt button:focus-visible {
  transform: translateY(-1px);
}

.weekly-planner-review-prompt button:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.weekly-planner-review-prompt button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

.weekly-planner-review-prompt strong,
.weekly-planner-recommendation-actions strong {
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.weekly-planner-review-prompt span,
.weekly-planner-recommendation-actions span {
  color: var(--editorial-soft-muted);
  font-size: 0.78rem;
  line-height: 1.6;
}

.weekly-planner-transition {
  display: grid;
  align-content: center;
  min-height: 430px;
  animation: editorial-page-arrive var(--editorial-motion-slow) var(--editorial-ease) both;
}

.weekly-planner-transition p {
  color: var(--editorial-soft-muted);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  line-height: 1.5;
  text-transform: uppercase;
}

.weekly-planner-transition h1 {
  margin-top: 14px;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: clamp(3rem, 9vw, 5rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 0.95;
}

.weekly-planner-recommendation-opening {
  margin-bottom: 0;
}

.weekly-planner-recommendation-card {
  padding: 30px;
  border: 0;
  border-radius: 4px;
  background: #EDE8DA;
}

.weekly-planner-recommendation-card h2 {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.42rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.25;
}

.weekly-planner-recommendation-card>p:last-child {
  color: #5A5448;
  font-size: 0.9rem;
  line-height: 1.75;
}

.weekly-planner-confirmation-opening>p:first-child {
  color: var(--editorial-soft-muted);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  line-height: 1.5;
  text-transform: uppercase;
}

.weekly-planner-confirmation-card,
.weekly-planner-updated-card {
  display: grid;
  gap: 16px;
}

.weekly-planner-confirmation-card div {
  display: grid;
  gap: 6px;
  padding-top: 14px;
  border-top: 1px solid #D8CFBD;
}

.weekly-planner-confirmation-card div>p:first-child,
.weekly-planner-updated-card>p:first-child {
  color: var(--editorial-soft-muted);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.weekly-planner-recommendation-reassurance {
  margin-top: 34px;
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.6;
}

.weekly-planner-recommendation-actions {
  display: grid;
  gap: 18px;
  margin-top: 18px;
  padding-top: 28px;
  border-top: 1px solid #D8CFBD;
}

.weekly-planner-recommendation-actions button {
  display: grid;
  gap: 5px;
  width: fit-content;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6A6458;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.weekly-planner-recommendation-actions button:hover,
.weekly-planner-recommendation-actions button:focus-visible {
  color: var(--editorial-ink);
  transform: translateY(-1px);
}

.weekly-planner-recommendation-actions button:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.weekly-planner-recommendation-actions button:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

.weekly-planner-editor-stub {
  animation: editorial-page-arrive var(--editorial-motion-slow) var(--editorial-ease) both;
}

.weekly-planner-editor-stub span {
  width: fit-content;
  margin-top: 20px;
  padding: 5px 12px;
  border-radius: 3px;
  color: #4A6848;
  background: #E3EDE1;
  font-size: 0.78rem;
}

.section-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.section-title h4 {
  margin: 2px 0 0;
  font-size: 1rem;
}

.segmented-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.segmented-option {
  min-height: 34px;
  padding: 0 8px;
  border: 0;
  border-left: 1px solid var(--border);
  color: var(--text);
  background: transparent;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
}

.segmented-option:first-child {
  border-left: 0;
}

.segmented-option.is-selected {
  color: var(--text);
  background: var(--soft-primary);
  box-shadow: inset 0 0 0 2px var(--primary);
}

.segmented-option:focus-visible {
  position: relative;
  z-index: 1;
  outline: 3px solid var(--focus-ring);
  outline-offset: -3px;
}

.custom-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.schedule-card-title-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.block-type-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  background: var(--input-bg);
  font-size: 0.7rem;
  font-weight: 900;
  text-transform: uppercase;
}

.block-type-badge[data-kind="Demand"] {
  border-color: var(--color-capacity-amber);
  color: var(--tag-demand-text);
  background: var(--capacity-surface);
}

.block-type-badge[data-kind="Recovery"] {
  border-color: var(--color-recovery-green);
  color: var(--tag-recovery-text);
  background: var(--recovery-surface);
}

.block-type-badge[data-kind="Meal"] {
  border-color: var(--color-sand);
  color: var(--tag-meal-text);
  background: var(--meal);
}

.block-type-badge[data-kind="Stim"] {
  border-color: var(--color-sage);
  color: var(--tag-stim-text);
  background: var(--sage-surface);
}

.compact-field {
  gap: 5px;
  margin-bottom: 0;
}

.compact-field span {
  font-size: 0.7rem;
}

.compact-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
}

.inline-action {
  width: fit-content;
  padding: 0;
  border: 0;
  color: var(--primary);
  background: transparent;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.inline-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
  border-radius: 4px;
}

.text-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  margin-top: 12px;
  padding: 0 14px;
  border-color: var(--border);
  background: var(--card);
  font-weight: 700;
}

.text-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.save-entry-button,
.compact-button {
  margin-top: 0;
}

.save-entry-button {
  color: var(--button-text);
  border-color: var(--primary);
  background: var(--primary);
}

.calm-button {
  margin-top: 0;
  border-color: var(--secondary);
  background: var(--soft-secondary);
}

.save-entry-button:hover {
  color: var(--button-text);
  background: color-mix(in srgb, var(--primary) 82%, var(--color-slate));
}

.compact-button {
  height: 36px;
  padding: 0 12px;
}

.add-block-button {
  justify-self: start;
}

.delete-button {
  border-color: var(--color-overload-rose);
  color: var(--danger-text);
  background: var(--overload-surface);
}

.rating-row {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.rating-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.rating-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.rating-line strong {
  font-size: 0.98rem;
}

.rating-line output {
  min-width: 2ch;
  color: var(--color-recovery-green);
  font-weight: 800;
  text-align: right;
}

input[type="range"] {
  width: 100%;
  accent-color: var(--color-sage);
}

button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

.scale-labels {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 0.78rem;
}

.field-help {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.info-hint {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text);
  background: var(--soft-secondary);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
  text-transform: none;
}

.info-hint:hover {
  border-color: var(--primary);
  background: var(--soft-primary);
}

.metric-heading,
.budget-row span,
.field span,
.chip-field legend {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.check-grid,
.symptom-groups {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.demand-groups {
  display: grid;
  gap: 14px;
}

.demand-group {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.demand-group legend {
  padding: 0 4px;
  color: var(--text);
  font-weight: 800;
}

.check-card {
  position: relative;
}

.check-card input {
  position: absolute;
  opacity: 0;
}

.check-card span {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
  font-weight: 700;
}

.check-card input:checked+span {
  border-color: var(--primary);
  background: var(--sage-surface);
}

.symptom-groups {
  display: grid;
  gap: 12px;
}

.symptom-group {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.symptom-group h4 {
  margin: 0 0 10px;
  font-size: 0.95rem;
}

.symptom-group .check-grid {
  grid-template-columns: 1fr;
}

.field {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
}

textarea {
  min-height: 92px;
  padding: 12px;
  resize: vertical;
  line-height: 1.45;
}

.metric-panel {
  --metric-ring-color: var(--color-sage);
  --metric-risk-color: var(--text);
  --metric-score-color: var(--color-sage);

  min-width: 0;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.metric-heading-row,
.metric-content-row {
  display: flex;
  gap: var(--space-4);
}

.metric-heading-row {
  align-items: center;
  justify-content: space-between;
}

.metric-content-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: var(--space-3);
}

.metric-copy-block p {
  max-width: 34ch;

  line-height: 1.45;

  color: var(--muted);
}

.metric-guidance {
  max-width: 34ch;
  line-height: 1.5;
  color: var(--muted);
}

.metric-guidance span {
  display: block;
}

.metric-panel strong {
  display: block;
  margin: 8px 0 4px;
  font-size: 2.3rem;
  line-height: 1;
}

.metric-score {
  display: flex;
  align-items: baseline;
  gap: 8px;

  margin-top: 18px;
  margin-bottom: 14px;
}

.metric-panel .metric-score-value {
  color: var(--metric-score-color);

  font-size: 3.25rem;
  font-weight: 700;
  line-height: .9;
  letter-spacing: 0;
}

.metric-panel .metric-score-max {
  color: var(--muted);

  font-size: 1.75rem;
  font-weight: 600;
}

.metric-score-state-sage {
  --metric-score-color: var(--color-sage);
  --metric-ring-color: var(--color-sage);
}

.metric-score-state-amber {
  --metric-score-color: var(--color-capacity-amber);
  --metric-ring-color: var(--color-capacity-amber);
}

.metric-risk-status {
  display: block;
  margin-top: 18px;
  margin-bottom: 14px;
  color: var(--metric-risk-color);
  font-size: 3.25rem;
  font-weight: 700;
  line-height: .9;
  letter-spacing: 0;
}

.metric-overload-risk {
  --metric-ring-color: var(--metric-risk-color);
}

.metric-overload-risk.metric-risk-state-low {
  --metric-risk-color: var(--color-sage);
}

.metric-overload-risk.metric-risk-state-moderate,
.metric-overload-risk.metric-risk-state-medium {
  --metric-risk-color: var(--color-capacity-amber);
}

.metric-overload-risk.metric-risk-state-high,
.metric-overload-risk.metric-risk-state-very-high {
  --metric-risk-color: var(--color-capacity-amber);
}

.metric-meta-placeholder {
  visibility: hidden;
}

.metric-gauge {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  margin-right: 24px;
  background:
    conic-gradient(from -45deg, var(--metric-ring-color) var(--gauge-value), color-mix(in srgb, var(--border) 76%, transparent) 0),
    var(--surface);
}

.metric-gauge span {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: var(--panel);
}

.status-label {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--status-text);
  font-size: 1.3rem;
}

.status-low {
  background: var(--risk-low);
  border-color: var(--color-recovery-green);
}

.status-moderate {
  background: var(--risk-medium);
  border-color: var(--color-capacity-amber);
}

.status-high {
  background: var(--risk-high);
  border-color: var(--color-capacity-amber);
}

.status-very-high {
  background: var(--risk-very-high);
  border-color: var(--color-capacity-amber);
}

.metric-panel p,
.guide-list p {
  color: var(--muted);
  line-height: 1.45;
}

.guide-list {
  display: grid;
  gap: 10px;
}

.budget-card {
  display: grid;
  gap: 10px;
}

.capacity-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}

.text-button.is-selected,
.chip.is-selected {
  border-color: var(--primary);
  background: var(--soft-primary);
}

.demand-chip.is-selected {
  border-color: var(--color-capacity-amber);
  background: var(--capacity-surface);
}

.budget-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.budget-row span {
  color: var(--muted);
  font-weight: 700;
}

.budget-card p {
  color: var(--muted);
  line-height: 1.45;
}

.capacity-breakdown {
  display: grid;
  gap: 8px;
}

.capacity-planning-panel {
  border-color: color-mix(in srgb, var(--color-light-sage) 64%, var(--color-cream));
}

.capacity-planning-panel-slightly-above {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 58%, var(--color-cream));
}

.capacity-planning-panel-above {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 82%, var(--color-slate));
}

.capacity-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.capacity-row span {
  color: var(--muted);
  font-weight: 700;
}

.capacity-row.is-status {
  border-color: color-mix(in srgb, var(--color-light-sage) 72%, var(--color-cream));
  background: color-mix(in srgb, var(--color-light-sage) 34%, var(--color-cream));
}

.capacity-row.is-status span,
.capacity-row.is-status strong {
  color: var(--color-slate);
}

.capacity-row.is-status[data-status-tone="slightly-above"] {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 58%, var(--color-cream));
  background: color-mix(in srgb, var(--color-capacity-amber) 22%, var(--color-cream));
}

.capacity-row.is-status[data-status-tone="above"] {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 82%, var(--color-slate));
  background: color-mix(in srgb, var(--color-capacity-amber) 36%, var(--color-cream));
}

.capacity-planning-sections {
  display: grid;
  gap: 18px;
}

.capacity-section {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.capacity-section-head {
  display: flex;
  align-items: center;
  gap: 10px;
}

.capacity-section-head>span {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  color: var(--card);
  background: var(--color-sage);
  font-weight: 900;
}

.capacity-section-head h4 {
  margin: 0;
  color: var(--text);
  font-size: 1rem;
}

.tracker-estimate-card {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--soft-primary);
}

.tracker-estimate-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.tracker-estimate-line span {
  color: var(--muted);
  font-weight: 800;
}

.tracker-estimate-line strong {
  color: var(--text);
}

.tracker-estimate-card span,
.tracker-estimate-card p,
.capacity-explanation p,
.capacity-explanation li {
  color: var(--muted);
  line-height: 1.45;
}

.tracker-estimate-card>strong {
  color: var(--text);
  font-size: 2rem;
  line-height: 1;
}

.capacity-explanation,
.insights-disclosure {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.capacity-explanation summary,
.insights-disclosure summary {
  cursor: pointer;
  color: var(--text);
  font-weight: 800;
}

.capacity-story {
  display: grid;
  gap: 14px;
  margin-top: 12px;
}

.capacity-story section {
  display: grid;
  gap: 4px;
}

.capacity-story section>span {
  color: var(--text);
  font-weight: 900;
}

.capacity-story-context {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 700;
}

.capacity-estimate-snapshot {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--color-sage) 36%, var(--border));
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--color-light-sage) 24%, var(--card));
}

.capacity-estimate-snapshot span {
  color: var(--muted);
  font-weight: 700;
}

.capacity-estimate-snapshot strong {
  color: var(--color-sage);
  font-size: 1.6rem;
  line-height: 1;
}

.capacity-factor-groups {
  display: grid;
  gap: 10px;
}

.capacity-factor-groups div {
  display: grid;
  gap: 4px;
}

.capacity-factor-groups span {
  color: var(--text);
  font-weight: 800;
}

.capacity-factor-groups ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.capacity-guidance {
  color: var(--muted);
  line-height: 1.45;
}

.capacity-guidance.is-suggestion {
  color: var(--capacity-text);
  font-weight: 800;
}

.support-action-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  border-color: color-mix(in srgb, var(--color-sage) 36%, var(--border));
  background: var(--sage-surface);
  box-shadow: none;
}

.support-action-card h3 {
  margin-top: 2px;
  font-size: var(--text-md);
}

.support-action-card p {
  color: var(--text);
  line-height: 1.45;
}

.support-action-card .text-button {
  justify-content: center;
  width: fit-content;
}

.support-action-amber {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 72%, var(--border));
  background: color-mix(in srgb, var(--color-capacity-amber) 34%, var(--card));
}

.status-high,
.status-very-high {
  border-color: color-mix(in srgb, var(--color-capacity-amber) 72%, var(--border));
  background: var(--capacity-surface);
}

.week-bars {
  display: grid;
  gap: 12px;
}

.day-bar {
  display: grid;
  grid-template-columns: 88px 1fr 44px;
  gap: 12px;
  align-items: center;
}

.bar-track {
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--border);
}

.bar-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--color-recovery-green);
}

.insights-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin: 0;
  padding-left: 18px;
  list-style: disc;
}

.featured-insight {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--sage-surface);
}

.featured-insight span {
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.featured-insight p {
  margin: 0;
  color: var(--text);
  line-height: 1.45;
}

.insights-disclosure {
  margin-top: 12px;
}

.insights-disclosure .insights-list {
  margin-top: 12px;
}

.insight-item {
  padding: 0;
  color: var(--muted);
  line-height: 1.35;
}

.principle-strip {
  display: grid;
  grid-template-columns: minmax(240px, 1.4fr) repeat(4, minmax(130px, 1fr));
  gap: 0;
  grid-column: 1 / -1;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  background: var(--sage-surface);
}

.principle-intro,
.principle-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  padding: var(--space-4);
}

.principle-item {
  border-left: 1px solid var(--border);
}

.principle-strip svg {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  color: color-mix(in srgb, var(--color-sage) 72%, var(--color-slate));
}

.principle-strip p,
.principle-strip span {
  color: var(--text);
  font-size: 0.9rem;
  line-height: 1.35;
}

.principle-item span {
  display: grid;
  gap: 2px;
}

.saved-panel {
  margin-top: 18px;
}

.save-status {
  color: var(--muted);
  font-size: 0.9rem;
  text-align: right;
}

.save-failure-notice {
  position: fixed;
  z-index: var(--layer-urgent-notice);
  right: max(14px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  left: max(14px, env(safe-area-inset-left));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  max-width: 760px;
  margin: 0 auto;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  background: var(--overload-surface);
  box-shadow: var(--shadow);
}

.save-failure-notice strong {
  display: block;
  color: var(--text);
  font-size: 0.98rem;
  line-height: 1.3;
}

.save-failure-notice p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.save-failure-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.save-failure-actions button {
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text);
  background: var(--card);
  font: inherit;
  font-size: 0.9rem;
  font-weight: 800;
}

.save-failure-actions button:hover,
.save-failure-actions button:focus-visible {
  border-color: var(--primary);
  background: var(--soft-primary);
}

.save-failure-actions .save-failure-dismiss {
  color: var(--muted);
  background: transparent;
}

@media (max-width: 640px) {
  .save-failure-notice {
    grid-template-columns: 1fr;
  }

  .save-failure-actions {
    justify-content: flex-start;
  }
}

.saved-entries {
  display: grid;
  gap: 10px;
}

.saved-entry {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.saved-entry p,
.saved-entry span,
.empty-state {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.4;
}

.saved-entry span {
  display: inline-block;
}

.saved-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.empty-state {
  margin: 0;
}

.toolkit-support {
  display: grid;
  gap: 10px;
  padding: 0;
  color: inherit;
}

.toolkit-support h2 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.38rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.28;
}

.toolkit-support p {
  margin: 0;
  color: var(--editorial-body);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  line-height: 1.65;
}

.toolkit-editorial-section-body.tracker-editorial-section-body {
  padding: 24px 0 34px;
}

.toolkit-action-section .tracker-editorial-section-body {
  padding-bottom: 0;
}

.toolkit-reach-out-message {
  display: block;
  max-width: 34rem;
}

.toolkit-prepared-message {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}

.toolkit-reach-out-message textarea {
  width: 100%;
  min-height: 118px;
  padding: 0;
  border: 0;
  border-left: 1px solid rgba(26, 26, 20, 0.18);
  border-radius: 0;
  padding-left: 18px;
  color: var(--editorial-ink);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.95rem;
  line-height: 1.72;
  resize: vertical;
}

.toolkit-reach-out-message textarea:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 7px;
}

.toolkit-copy-status {
  min-height: 1.4em;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.78rem;
  font-style: italic;
  line-height: 1.4;
}

.toolkit-quiet-action {
  margin-top: 10px;
}

.toolkit-category-list {
  gap: 6px;
}

.toolkit-category-option {
  display: grid;
  gap: 3px;
}

.toolkit-category-option strong,
.toolkit-category-option span {
  display: block;
}

.toolkit-category-option strong {
  color: var(--editorial-selected-ink);
  font-weight: 500;
}

.toolkit-category-option span {
  color: #6F685E;
  font-size: 0.76rem;
  line-height: 1.45;
}

.toolkit-copy-message-action {
  margin-top: 0;
}

.toolkit-editorial-page>.editorial-shell-content {
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: visible;
}

.toolkit-page-header.editorial-page-header {
  margin-bottom: 0;
}

.toolkit-support-region {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 0;
  padding-top: clamp(28px, 5vh, 56px);
}

.toolkit-content-group {
  width: 100%;
  transform: translateY(clamp(-56px, -6vh, -28px));
}

.toolkit-support-region:has(.toolkit-category-section) {
  justify-content: flex-start;
}

.toolkit-support-region:has(.toolkit-category-section) .toolkit-content-group {
  transform: none;
}

.toolkit-navigation-footer.weekly-overview-footer {
  align-self: end;
  margin-top: clamp(28px, 5vh, 58px);
  padding-top: 24px;
}

.toolkit-navigation-footer .weekly-overview-footer-actions,
.toolkit-navigation-footer .editorial-footer-actions {
  max-width: 20rem;
}

@media (max-width: 640px) {
  .toolkit-editorial-page>.editorial-shell-content {
    grid-template-rows: auto auto auto;
  }

  .toolkit-support-region {
    justify-content: flex-start;
    padding-top: 30px;
  }

  .toolkit-content-group {
    transform: none;
  }

  .toolkit-navigation-footer.weekly-overview-footer {
    align-self: start;
    margin-top: 34px;
    padding-top: 22px;
  }
}

@media (max-height: 620px) {
  .toolkit-support-region {
    justify-content: flex-start;
  }

  .toolkit-content-group {
    transform: none;
  }
}

.tutorial-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--layer-modal);
  display: grid;
  place-items: center;
  padding: 18px;
  background: color-mix(in srgb, var(--bg) 78%, rgba(0, 0, 0, 0.28));
}

.modal-backdrop,
.help-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--layer-modal);
  display: grid;
  place-items: center;
  padding: 18px;
  background: color-mix(in srgb, var(--bg) 76%, rgba(0, 0, 0, 0.3));
}

.modal-surface,
.help-modal {
  width: min(560px, 100%);
  max-height: min(720px, calc(100vh - 36px));
  overflow: auto;
  padding: 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius-modal);
  background: var(--card);
  box-shadow: var(--shadow-lifted);
}

.modal-surface .panel-head,
.help-modal .panel-head {
  align-items: flex-start;
}

.modal-surface .panel-title-line,
.help-modal h2 {
  margin-top: 3px;
  font-size: 1.35rem;
}

.past-edit-modal {
  display: grid;
  gap: 26px;
  width: min(560px, calc(100% - 28px));
  animation: editorial-sheet-rise var(--editorial-motion-medium) var(--editorial-ease) both;
}

.past-edit-modal p:not(.eyebrow) {
  max-width: 34rem;
  margin: 0;
  color: #5F584F;
  font-size: 1rem;
  line-height: 1.6;
}

.past-edit-actions {
  align-items: end;
}

.past-edit-actions .save-entry-button {
  width: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--editorial-ink);
  background: transparent;
  box-shadow: none;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.1rem;
  font-style: italic;
  font-weight: 700;
  line-height: 1.35;
}

.past-edit-actions .save-entry-button:hover,
.past-edit-actions .save-entry-button:focus-visible {
  color: #154B33;
  background: transparent;
}

.past-edit-actions .compact-button {
  margin-left: 0;
}

.help-content {
  display: grid;
  gap: 16px;
}

.help-content h3 {
  margin: 0 0 6px;
  font-size: 0.98rem;
}

.help-content p,
.help-content li {
  color: var(--muted);
  line-height: 1.55;
}

.help-content ul {
  margin: 0;
  padding-left: 20px;
}

.guided-tour-layer {
  position: fixed;
  inset: 0;
  z-index: var(--layer-guided-tour);
  pointer-events: none;
}

.guided-tour-highlight {
  position: fixed;
  z-index: var(--layer-guided-tour-highlight);
  border: 2px solid var(--primary);
  border-radius: calc(var(--radius) + 4px);
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  box-shadow: 0 0 0 9999px color-mix(in srgb, var(--bg) 18%, rgba(0, 0, 0, 0.16)), 0 0 0 6px color-mix(in srgb, var(--primary) 18%, transparent);
  pointer-events: none;
}

.guided-tour-bubble {
  position: fixed;
  top: 16px;
  left: 16px;
  right: auto;
  bottom: auto;
  z-index: var(--layer-guided-tour-bubble);
  display: grid;
  gap: 12px;
  width: min(360px, calc(100vw - 32px));
  max-height: min(540px, calc(100vh - 32px));
  overflow: auto;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow);
  pointer-events: auto;
}

.guided-tour-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.guided-tour-head h2 {
  margin: 3px 0 0;
  font-size: 1.12rem;
}

.guided-tour-bubble p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.tour-action-hint {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--soft-primary);
  color: var(--text) !important;
  font-weight: 800;
}

.tour-action-hint.is-complete {
  border-color: var(--color-recovery-green);
  background: var(--recovery-surface);
}

.guided-tour-actions {
  margin-top: 0;
}

.stim-recommendations,
.stim-list,
.stim-form,
.stim-decision-list {
  display: grid;
  gap: 10px;
}

.recommendation-subtitle {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.4;
}

.stim-decision-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--color-sage) 42%, var(--border));
  border-radius: var(--radius);
  background: var(--sage-surface);
}

.stim-decision-copy {
  min-width: 0;
}

.stim-decision-copy p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.4;
}

.recommendation-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.recommendation-tags span {
  padding: 4px 8px;
  border: 1px solid color-mix(in srgb, var(--color-sage) 34%, var(--border));
  border-radius: 999px;
  color: var(--text);
  background: color-mix(in srgb, var(--color-sage) 10%, var(--card));
  font-size: 0.78rem;
  font-weight: 800;
}

.stim-decision-actions,
.feedback-options {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.recommendation-reflection-list {
  display: grid;
  gap: 20px;
}

.recommendation-follow-path {
  display: grid;
  gap: 10px;
}

.support-section-label {
  display: grid;
  gap: 3px;
}

.support-section-label>span {
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.support-section-label small {
  color: var(--muted);
  line-height: 1.35;
}

.recommendation-reflection-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.recommendation-reflection-card strong {
  display: block;
  margin-top: 2px;
}

.recommendation-reflection-card p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.reflection-feedback-flow {
  display: grid;
  gap: 10px;
}

.reflection-question {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}

.reflection-question>span {
  font-weight: 800;
}

.stacked-question {
  align-items: flex-start;
  flex-direction: column;
}

.chip-feedback-options {
  justify-content: flex-start;
}

.recommendation-reflection-list .feedback-options,
.tracker-support-sheet .chip-feedback-options {
  display: grid;
  gap: 3px;
  justify-content: stretch;
}

.tracker-support-mark {
  font-size: 0.9rem;
}

.per-stim-helpfulness {
  display: grid;
  gap: 10px;
}

.stim-helpfulness-row {
  display: grid;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}

.stim-helpfulness-row>span {
  font-weight: 800;
}

.recommendation-follow-path {
  display: grid;
  gap: 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.support-category-list {
  display: grid;
  gap: 0;
  width: 100%;
}

.support-category-group {
  display: grid;
  gap: 8px;
  padding: 18px 0;
  border: 0;
  border-top: 1px solid var(--editorial-rule);
  border-radius: 0;
  background: transparent;
  overflow: visible;
}

.support-category-group h4 {
  margin: 0;
  color: var(--editorial-muted);
  font-family: inherit;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1.4;
  text-transform: uppercase;
}

.support-category-group summary::-webkit-details-marker {
  display: none;
}

.support-category-group summary span:last-child {
  display: grid;
  place-items: center;
  min-width: 24px;
  height: 24px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--bg);
  font-size: 0.78rem;
}

.support-category-group[open] summary {
  border-bottom: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  background: color-mix(in srgb, var(--soft-primary) 58%, transparent);
}

.support-category-group .chip-feedback-options {
  padding: 0;
}

.feedback-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--muted);
  background: var(--recovery-surface);
  font-size: 0.9rem;
  font-weight: 800;
}

.feedback-status.is-active-choice {
  border-style: dashed;
  background: transparent;
}

.stim-mini-card,
.stim-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.stim-mini-card .info-hint {
  align-self: flex-start;
}

.stim-mini-card p,
.stim-card p,
.stim-card span,
.stim-card small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.4;
}

.stim-mini-card>span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: var(--text);
  background: var(--sage-surface);
  font-weight: 800;
}

.why-details {
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.why-details summary {
  width: fit-content;
  cursor: pointer;
  font-weight: 800;
}

.why-details ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.stim-library-panel {
  margin-bottom: 18px;
}

.stim-library-page {
  display: grid;
  gap: 18px;
}

.stim-library-title {
  margin-bottom: 0;
}

.stim-library-title h3 {
  font-size: 1.35rem;
}

.supports-editorial-container {
  display: grid;
  color: var(--editorial-body);
}

.supports-add-form {
  display: grid;
  gap: 0;
  margin-top: 0;
}

.supports-add-intro {
  display: grid;
  gap: 22px;
  padding: 0;
  border-bottom: 0;
}

.supports-add-name,
.supports-add-note {
  display: grid;
  gap: 14px;
}

.supports-add-name span,
.supports-add-note span,
.supports-add-contexts legend {
  color: var(--editorial-body);
  font-family: inherit;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5;
}

.supports-add-name span {
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.22;
}

.supports-add-name input,
.supports-add-note textarea {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--editorial-rule);
  color: var(--editorial-body);
  background: transparent;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.55;
}

.supports-add-name input {
  min-height: 46px;
}

.supports-add-name input::placeholder,
.supports-add-note textarea::placeholder {
  color: var(--editorial-muted);
  font-style: italic;
}

.supports-add-name input:focus,
.supports-add-note textarea:focus {
  outline: 0;
  border-bottom-color: var(--editorial-focus);
}

.supports-add-contexts {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 34px 0;
  border: 0;
  border-bottom: 1px solid var(--editorial-rule);
}

.supports-add-contexts p {
  margin: 0 0 6px;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.supports-add-option-list {
  display: grid;
  gap: 0;
}

.supports-add-option {
  width: 100%;
  min-height: 0;
  padding: 7px 12px 7px 28px;
  border: 0;
  border-left: 2px solid transparent;
  color: var(--editorial-body);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.78rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
}

.supports-add-option:hover,
.supports-add-option:focus-visible {
  color: var(--editorial-hover-ink);
  background: var(--editorial-hover-bg);
}

.supports-add-option:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 3px;
}

.supports-add-option.is-selected {
  border-left-color: var(--editorial-focus);
  color: var(--editorial-selected-ink);
  background: var(--editorial-selected-bg);
  font-weight: 500;
}

.supports-add-note {
  padding: 34px 0;
  border-bottom: 1px solid var(--editorial-rule);
}

.supports-add-note textarea {
  min-height: 96px;
  padding: 8px 0 12px;
  border-bottom: 0;
  border-left: 0;
  color: var(--editorial-body);
  background: transparent;
  font-size: 1rem;
  line-height: 1.55;
  resize: vertical;
  box-shadow: none;
  appearance: none;
}

.supports-add-note textarea:focus {
  background: transparent;
}

.supports-add-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  margin-top: 0;
  padding-top: 34px;
  border-top: 0;
}

.supports-add-actions .supports-editorial-toggle {
  margin-left: auto;
}

.supports-add-actions .supports-editorial-add,
.supports-add-actions .supports-editorial-toggle {
  min-height: 38px;
  padding: 8px 0 7px;
  border: 0;
  border-bottom: 0;
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.4;
}

.supports-add-actions .supports-editorial-add {
  color: var(--editorial-hover-ink);
}

.supports-add-actions .supports-editorial-toggle {
  color: var(--editorial-muted);
}

.supports-add-submit:disabled {
  cursor: not-allowed;
  color: var(--editorial-muted);
  opacity: 0.44;
}

.supports-add-confirmation {
  display: grid;
  gap: 6px;
  margin-top: 34px;
  padding: 0 0 30px;
  border-bottom: 1px solid var(--editorial-rule);
}

.supports-add-confirmation strong {
  color: var(--editorial-body);
  font-family: inherit;
  font-size: 1rem;
  font-weight: 500;
}

.supports-add-confirmation p {
  max-width: 560px;
  margin: 0;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  line-height: 1.55;
}

.supports-detail-actions button {
  justify-self: start;
  padding: 0 0 3px;
  border: 0;
  border-bottom: 0;
  color: var(--editorial-muted);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  font-weight: 500;
  cursor: pointer;
}

.supports-detail-actions button:hover,
.supports-detail-actions button:focus-visible {
  color: var(--editorial-hover-ink);
}

.supports-detail-actions button:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.supports-detail-hero {
  display: grid;
  gap: 22px;
  padding: 0;
  border-bottom: 0;
}

.supports-detail-type,
.supports-detail-section h3 {
  margin: 0;
  color: var(--editorial-muted);
  font-family: inherit;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-transform: uppercase;
}

.supports-detail-hero h2 {
  max-width: none;
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: 0;
}

.supports-detail-hero p:last-child,
.supports-detail-prose p,
.supports-detail-note,
.supports-detail-empty {
  max-width: 620px;
  margin: 0;
  color: var(--editorial-body);
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.55;
}

.supports-detail-section {
  display: grid;
  gap: 16px;
  padding: 34px 0;
  border-bottom: 1px solid var(--editorial-rule);
}

.supports-detail-prose {
  display: grid;
  gap: 12px;
}

.supports-detail-note {
  padding-left: 0;
  border-left: 0;
  color: var(--editorial-body);
}

.supports-detail-empty {
  color: var(--editorial-muted);
  font-style: italic;
}

.supports-detail-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px 44px;
  margin-top: 0;
  padding-top: 34px;
  border-top: 0;
}

.supports-detail-actions button:last-child {
  margin-left: auto;
}

.supports-archive-confirmation {
  display: grid;
  gap: 16px;
  margin-top: 34px;
  padding-top: 34px;
  border-top: 1px solid var(--editorial-rule);
}

.supports-archive-confirmation h3 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.22;
}

.supports-archive-confirmation div:not(.supports-archive-actions) {
  display: grid;
  gap: 12px;
  max-width: 620px;
}

.supports-archive-confirmation p {
  margin: 0;
  color: var(--editorial-body);
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.55;
}

.supports-archive-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px 44px;
}

.supports-archive-actions button {
  padding: 0 0 3px;
  border: 0;
  border-bottom: 0;
  color: var(--editorial-muted);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  font-weight: 500;
  cursor: pointer;
}

.supports-archive-actions button:last-child {
  margin-left: auto;
}

.supports-archive-actions button:hover,
.supports-archive-actions button:focus-visible {
  color: var(--editorial-hover-ink);
}

.supports-archive-actions button:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.supports-editorial-header {
  margin-bottom: 0;
}

.supports-editorial-header .supports-detail-back {
  min-height: 44px;
  margin: 0;
  color: var(--editorial-soft-muted);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}

.supports-editorial-header .supports-detail-back:hover,
.supports-editorial-header .supports-detail-back:focus-visible {
  color: var(--editorial-muted);
  transform: none;
}

.supports-editorial-header .supports-detail-back:active {
  opacity: 0.76;
  transform: none;
}

.supports-editorial-kicker,
.supports-section-heading h3,
.supports-editorial-footer {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.supports-editorial-kicker,
.supports-editorial-header time,
.supports-editorial-header .editorial-date-in-document {
  color: var(--editorial-soft-muted);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}

.supports-editorial-intro {
  display: grid;
  gap: 22px;
  max-width: 100%;
  padding: 0;
  color: var(--editorial-ink);
  border-bottom: 0;
}

.supports-editorial-intro h1 {
  max-width: none;
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: 0;
  white-space: normal;
}

.supports-editorial-intro p {
  max-width: 100%;
  margin: 0;
  color: var(--editorial-body);
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.55;
}

.supports-section-content>p,
.supports-editorial-empty {
  max-width: 610px;
  margin: 0;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.supports-editorial-sections {
  display: grid;
  gap: 0;
  margin-top: 34px;
}

.supports-editorial-section {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--editorial-rule);
  color: var(--editorial-ink);
}

.supports-editorial-section:last-of-type {
  border-bottom: 1px solid var(--editorial-rule);
}

.supports-section-content {
  display: grid;
  gap: 18px;
}

.supports-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 48px;
}

.supports-section-heading h3 {
  color: var(--editorial-muted);
  font-family: inherit;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1.5;
}

.supports-section-disclosure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  color: var(--editorial-muted);
  background: transparent;
  cursor: pointer;
}

.supports-section-disclosure span {
  font-size: 0.95rem;
  line-height: 1;
}

.supports-section-disclosure:hover,
.supports-section-disclosure:focus-visible {
  color: var(--editorial-hover-ink);
}

.supports-section-disclosure:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 3px;
}

.supports-editorial-list {
  display: grid;
  border-top: 1px solid var(--editorial-rule);
}

.supports-editorial-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid var(--editorial-rule);
  color: var(--editorial-body);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.supports-editorial-row:hover,
.supports-editorial-row:focus-visible {
  color: var(--editorial-hover-ink);
}

.supports-editorial-row:focus-visible,
.supports-editorial-add:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.supports-editorial-row span:first-child {
  display: grid;
  gap: 8px;
}

.supports-editorial-row strong {
  color: inherit;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.25;
}

.supports-editorial-row em {
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.84rem;
  font-style: italic;
  line-height: 1.55;
}

.supports-editorial-affordance {
  color: color-mix(in srgb, var(--editorial-muted) 58%, transparent);
  font-size: 1rem;
  opacity: 0;
  transition: opacity 160ms var(--editorial-ease-soft), transform 160ms var(--editorial-ease-soft);
}

.supports-editorial-row:hover .supports-editorial-affordance,
.supports-editorial-row:focus-visible .supports-editorial-affordance {
  opacity: 0.42;
  transform: translateX(2px);
}

.supports-editorial-empty {
  padding: 18px 0;
  border-bottom: 1px solid var(--editorial-rule);
}

.supports-editorial-add {
  justify-self: start;
  padding: 0 0 3px;
  border: 0;
  border-bottom: 1px solid currentColor;
  color: var(--editorial-muted);
  background: transparent;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 1.05rem;
  font-style: italic;
  font-weight: 700;
  cursor: pointer;
}

.supports-editorial-add-entry {
  position: relative;
  display: grid;
  gap: 12px;
  width: 100%;
  margin-top: 44px;
  padding: 0;
  border-top: 0;
  border-bottom: 0;
  border-radius: 2px;
  color: #6A6458;
  font: inherit;
  text-align: left;
  transition:
    color var(--editorial-motion-short) var(--editorial-ease),
    opacity var(--editorial-motion-short) var(--editorial-ease),
    transform var(--editorial-motion-short) var(--editorial-ease);
}

.supports-editorial-add-entry::after {
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 44px;
  height: 1px;
  background: currentColor;
  content: "";
  opacity: 0.16;
  transform: scaleX(0.48);
  transform-origin: left center;
  transition:
    opacity var(--editorial-motion-medium) var(--editorial-ease),
    transform var(--editorial-motion-medium) var(--editorial-ease);
}

.supports-editorial-add-entry span {
  color: var(--editorial-soft-muted);
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.supports-editorial-add-entry strong {
  color: #6A6458;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.supports-editorial-add-entry:hover strong,
.supports-editorial-add-entry:focus-visible strong {
  color: var(--editorial-ink);
}

.supports-editorial-add-entry:hover {
  transform: translateY(-1px);
}

.supports-editorial-add-entry:hover::after,
.supports-editorial-add-entry:focus-visible::after {
  opacity: 0.34;
  transform: scaleX(1);
}

.supports-editorial-add-entry:active {
  opacity: 0.76;
  transform: translateY(1px);
}

.supports-editorial-add-entry:focus-visible {
  outline: 2px solid rgba(154, 148, 136, 0.42);
  outline-offset: 8px;
}

.supports-editorial-toggle {
  justify-self: start;
  margin-top: 0;
  padding: 4px 0;
  border: 0;
  border-bottom: 0;
  color: var(--editorial-muted);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.84rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.45;
  cursor: pointer;
}

.supports-editorial-toggle:hover,
.supports-editorial-toggle:focus-visible {
  color: var(--editorial-hover-ink);
}

.supports-editorial-toggle:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 4px;
}

.supports-editorial-add:hover,
.supports-editorial-add:focus-visible {
  color: var(--primary);
}

.supports-editorial-footer {
  margin-top: 48px;
  padding-top: 0;
  border-top: 0;
  color: rgba(140, 137, 126, 0.45);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.55;
  text-transform: uppercase;
}

@media (hover: none) {
  .supports-editorial-affordance {
    opacity: 0.32;
  }
}

@media (max-width: 420px) {
  .supports-editorial-intro h1 {
    white-space: normal;
  }

  .supports-add-actions {
    display: grid;
    justify-items: start;
    gap: 18px;
  }

  .supports-add-actions .supports-editorial-toggle {
    margin-left: 0;
  }

  .supports-detail-actions {
    display: grid;
    justify-items: start;
    gap: 18px;
  }

  .supports-detail-actions button:last-child {
    margin-left: 0;
  }

  .supports-archive-actions {
    display: grid;
    justify-items: start;
    gap: 18px;
  }

  .supports-archive-actions button:last-child {
    margin-left: 0;
  }
}

.stim-form {
  margin-bottom: 16px;
}

.simplified-stim-form {
  gap: 12px;
  margin-bottom: 0;
}

.simple-chip-field {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.simple-chip-field legend {
  margin-bottom: 2px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.stim-category-field {
  max-width: 360px;
}

.chip-field {
  display: grid;
  gap: 8px;
  margin: 0 0 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--card);
}

.chip-field legend {
  padding: 0 6px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.stim-category-list {
  display: grid;
  gap: 10px;
}

.stim-category-group {
  display: grid;
  gap: 8px;
}

.stim-category-group h4 {
  margin: 0;
  color: var(--text);
  font-size: 1rem;
}

.stim-category-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 0 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text);
  background: var(--panel);
  font-weight: 800;
  box-shadow: var(--shadow);
}

.stim-category-toggle span:last-child {
  display: grid;
  place-items: center;
  min-width: 28px;
  height: 28px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--bg);
  font-size: 0.86rem;
}

.stim-category-toggle[aria-expanded="true"] {
  border-color: var(--primary);
  background: var(--soft-primary);
}

.stim-category-group .stim-list {
  gap: 8px;
}

.stim-card {
  flex-direction: column;
  align-items: stretch;
  box-shadow: none;
}

.stim-card-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.stim-card.is-editing {
  border-color: var(--primary);
  background: var(--soft-primary);
  box-shadow: inset 0 0 0 1px var(--primary);
}

.inline-stim-editor {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.chip {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text);
  background: var(--input-bg);
  font-weight: 700;
}

.example-box {
  display: grid;
  gap: 6px;
  margin: 0 0 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--soft-secondary);
  color: var(--text);
  line-height: 1.45;
}

.settings-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.85fr) minmax(280px, 1fr);
  gap: 18px;
  align-items: start;
}

.settings-main-column,
.settings-side-column {
  display: grid;
  gap: 14px;
}

.settings-editorial-shell {
  --settings-ink: var(--editorial-body);
  --settings-heading: var(--editorial-ink);
  --settings-muted: var(--editorial-muted);
  --settings-soft-muted: var(--editorial-soft-muted);
  --settings-line: var(--editorial-rule);
  --settings-paper: var(--editorial-paper-bg);
  --settings-selected: var(--editorial-selected-bg);
}

.settings-editorial-shell:not(.editorial-page-shell) {
  box-sizing: border-box;
  display: flex;
  width: min(100%, 760px);
  min-height: 100vh;
  margin: 0 auto;
  padding: clamp(48px, 5vw, 72px) clamp(52px, 7vw, 88px) 42px;
  border: 1px solid color-mix(in srgb, var(--color-sage) 18%, transparent);
  border-radius: 14px;
  color: var(--settings-ink);
  background: var(--settings-paper);
  box-shadow: none;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
}

.settings-editorial-page:not(.editorial-page-surface) {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: min(100%, 620px);
  margin: 0 auto;
  padding: 0;
}

.settings-editorial-eyebrow,
.settings-editorial-footer {
  margin: 0;
  color: color-mix(in srgb, var(--settings-soft-muted) 74%, var(--settings-paper));
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.settings-editorial-divider {
  height: 1px;
  margin: 22px 0 30px;
  background: var(--settings-line);
}

.settings-editorial-header {
  margin: 30px 0 20px;
}

.settings-editorial-header h1 {
  max-width: none;
  margin: 0;
  color: var(--settings-heading);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: 0;
}

.settings-editorial-header p {
  max-width: 34ch;
  margin: 18px 0 0;
  color: var(--settings-muted);
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 1rem;
  line-height: 1.55;
}

.settings-rhythms-page .settings-editorial-header p {
  max-width: min(100%, 54ch);
}

.settings-editorial-section {
  position: relative;
  display: grid;
  gap: 0;
  margin-top: 34px;
  padding-top: 30px;
  border-top: 0;
  color: var(--settings-heading);
}

.settings-editorial-section::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: color-mix(in srgb, var(--settings-line) 88%, var(--settings-ink));
  content: "";
}

.settings-editorial-header+.settings-editorial-section {
  margin-top: 14px;
  padding-top: 0;
}

.settings-editorial-header+.settings-editorial-section::before {
  content: none;
}

.settings-editorial-section h2 {
  display: flex;
  align-items: center;
  min-height: 48px;
  margin: 0;
  padding: 0;
  color: var(--settings-muted);
  font-family: inherit;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-transform: uppercase;
}

.settings-editorial-section-body {
  border-top: 0;
}

.settings-primary-section .settings-editorial-section-body::after {
  display: block;
  width: 100%;
  height: 1px;
  margin: 0;
  background: var(--editorial-divider);
  content: "";
}

.settings-navigation-row {
  position: relative;
  display: grid;
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr) minmax(12px, auto);
  gap: 16px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 72px;
  padding: 18px 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-ink);
  background: transparent;
  text-align: left;
  font: inherit;
}

.settings-row+.settings-row {
  border-top: 1px solid var(--editorial-divider);
}

.settings-navigation-row.is-enabled {
  cursor: pointer;
}

.settings-navigation-row.is-disabled {
  cursor: default;
}

.settings-navigation-row.is-enabled:hover .settings-row-arrow,
.settings-navigation-row.is-enabled:focus-visible .settings-row-arrow {
  opacity: 0.45;
}

.settings-navigation-row:focus-visible,
.settings-back-link:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
}

.settings-row-copy {
  display: grid;
  gap: 7px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.settings-row-copy strong {
  min-width: 0;
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.settings-row-copy em {
  min-width: 0;
  max-width: 42ch;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.settings-row-summary {
  min-width: 0;
  color: var(--editorial-focus);
  font-size: 0.78rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.settings-row-arrow {
  align-self: start;
  display: inline-block;
  justify-self: end;
  margin-top: 8px;
  width: 12px;
  color: color-mix(in srgb, var(--settings-line) 70%, var(--settings-paper));
  font-family: inherit;
  font-size: 0.74rem;
  line-height: 1;
  opacity: 1;
  transform: rotate(-90deg);
  transform-origin: center;
  transition:
    opacity var(--editorial-motion-short) var(--editorial-ease);
}

.settings-version-row {
  min-height: 44px;
  padding: 14px 0;
  color: color-mix(in srgb, var(--settings-soft-muted) 62%, transparent);
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 0.9rem;
  font-style: italic;
}

.settings-about-section {
  margin-top: 42px;
}

.settings-about-section h2 {
  min-height: 42px;
}

.settings-about-section .settings-navigation-row {
  min-height: 68px;
  padding: 17px 0;
}

.settings-about-section .settings-row-copy strong {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.35;
}

.settings-about-section .settings-version-row {
  min-height: 54px;
  padding: 18px 0 0;
  border-bottom: 1px solid var(--editorial-divider);
  color: color-mix(in srgb, var(--settings-soft-muted) 52%, var(--settings-paper));
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-style: italic;
  font-weight: 400;
}

.settings-editorial-footer {
  align-self: flex-start;
  margin-top: auto;
  padding-top: 72px;
  color: rgba(140, 137, 126, 0.45);
}

@media (max-width: 640px) {
  .settings-editorial-header {
    margin: 24px 0 18px;
  }

  .settings-editorial-header p {
    max-width: none;
    margin-top: 14px;
  }

  .settings-editorial-section {
    margin-top: 26px;
    padding-top: 24px;
  }

  .settings-editorial-header+.settings-editorial-section {
    margin-top: 10px;
    padding-top: 0;
  }

  .settings-editorial-section h2 {
    min-height: 38px;
  }

  .settings-navigation-row {
    gap: 12px;
    min-height: 64px;
    padding: 14px 0;
  }

  .settings-row-copy {
    gap: 5px;
  }

  .settings-row-copy em {
    max-width: none;
    font-size: 0.84rem;
    line-height: 1.42;
  }

  .settings-row-summary {
    font-size: 0.74rem;
    line-height: 1.25;
  }

  .settings-about-section {
    margin-top: 34px;
  }

  .settings-about-section .settings-navigation-row {
    min-height: 60px;
    padding: 14px 0;
  }

  .settings-editorial-footer {
    padding-top: 48px;
  }
}

.settings-back-link {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0;
  border: 0;
  color: var(--settings-muted);
  background: transparent;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 0.9rem;
  font-style: italic;
  cursor: pointer;
}

.app-shell[class*="app-shell-settings"] button {
  text-decoration: none;
  text-underline-offset: 0;
}

.settings-destination-space {
  min-height: 34vh;
}

.developer-mode-status-label {
  width: fit-content;
  margin: 0 0 10px;
  color: color-mix(in srgb, var(--editorial-muted) 80%, var(--editorial-paper-bg));
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.developer-editorial-shell:not(.editorial-page-shell) {
  display: grid;
  width: 100%;
  min-width: 0;
  min-height: 100vh;
  padding: clamp(24px, 4vw, 48px) clamp(24px, 5vw, 72px);
  justify-items: center;
  background: var(--editorial-screen-bg);
}

.developer-editorial-page {
  --settings-ink: var(--editorial-body);
  --settings-heading: var(--editorial-ink);
  --settings-muted: var(--editorial-muted);
  --settings-soft-muted: var(--editorial-soft-muted);
  --settings-line: var(--editorial-rule);
  --settings-paper: var(--editorial-paper-bg);
  --settings-selected: var(--editorial-selected-bg);
}

.developer-editorial-shell:not(.editorial-page-shell) .developer-editorial-page.todays-plan-page:not(.editorial-page-surface) {
  width: min(100%, 920px);
  max-width: 920px;
  min-height: calc(100vh - clamp(48px, 8vw, 96px));
  padding: clamp(48px, 5vw, 72px) clamp(52px, 7vw, 88px) clamp(42px, 5vw, 68px);
  border: 0;
  border-radius: 14px;
  color: var(--editorial-body);
  background: var(--editorial-paper-bg);
  box-shadow: none;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
}

.developer-editorial-top.editorial-page-header {
  margin-bottom: 0;
}

.developer-editorial-header {
  margin: 0 0 24px;
}

.developer-editorial-header h1 {
  max-width: none;
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: 0;
}

.developer-editorial-header p {
  max-width: min(100%, 58ch);
  margin: 20px 0 0;
  color: var(--editorial-body);
  font-size: 0.96rem;
  line-height: 1.72;
}

.developer-editorial-page .settings-editorial-section {
  color: var(--editorial-ink);
}

.developer-editorial-footer {
  margin: 72px 0 0;
  padding: 0;
  color: rgba(140, 137, 126, 0.45);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.developer-editorial-footer p {
  margin: 0;
}

.developer-tool-content {
  display: grid;
  gap: 18px;
  min-width: 0;
  margin-top: 22px;
}

.developer-tool-content .panel,
.developer-tool-content .visual-settings {
  min-width: 0;
}

.developer-tool-content,
.developer-tool-content * {
  overflow-wrap: anywhere;
}

.settings-profile-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, auto);
  gap: 18px;
  align-items: center;
  min-height: 48px;
  padding: 10px 0;
  border-bottom: 1px solid var(--settings-line);
}

.settings-profile-row>* {
  min-width: 0;
}

.settings-profile-action-row {
  width: 100%;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  border-radius: 0;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.settings-profile-action-row:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}

.settings-profile-row-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-profile-row-copy strong {
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.25;
}

.settings-profile-row-copy em {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-profile-row-control {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}

.settings-profile-inline-input {
  width: min(150px, 42vw);
  border: 0;
  border-bottom: 1px solid var(--settings-line);
  border-radius: 0;
  background: transparent;
  color: var(--settings-ink);
  font: inherit;
  text-align: right;
}

.settings-profile-edit-control {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  width: min(260px, 100%);
}

.settings-profile-edit-control .settings-profile-inline-input {
  flex: 1;
  min-width: 0;
  width: auto;
}

.settings-profile-inline-input::placeholder {
  color: var(--settings-muted);
  opacity: 1;
}

.settings-profile-inline-input:focus,
.settings-profile-inline-input:focus-visible {
  outline: 0;
  border-bottom-color: var(--editorial-focus);
}

.settings-profile-option:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 3px;
}

.settings-profile-current-value {
  max-width: 100%;
  color: var(--settings-muted);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
  text-align: right;
}

.settings-profile-options {
  display: grid;
  gap: 0;
  margin-top: 8px;
  padding: 14px 0 10px;
}

.settings-rhythm-time-options {
  max-height: 260px;
  overflow-y: auto;
}

.settings-rhythm-time-options .settings-profile-option {
  min-height: 32px;
  padding-left: 18px;
  padding-top: 9px;
  padding-bottom: 9px;
  line-height: 1.35;
}

.settings-profile-option {
  width: 100%;
  min-height: 0;
  border: 0;
  border-left: 2px solid transparent;
  background: transparent;
  color: var(--editorial-body);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.78rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  padding: 7px 12px 7px 28px;
  cursor: pointer;
}

.settings-profile-option.is-selected {
  border-left-color: var(--editorial-focus);
  background: var(--editorial-selected-bg);
  color: var(--editorial-selected-ink);
  font-weight: 500;
}

.settings-profile-option:hover,
.settings-profile-option:focus-visible {
  color: var(--editorial-hover-ink);
  background: var(--editorial-hover-bg);
}

.settings-rhythm-field {
  display: grid;
  gap: 10px;
  padding: 10px 0 16px;
  border-bottom: 1px solid var(--settings-line);
}

.settings-rhythm-field-heading {
  display: grid;
  gap: 2px;
}

.settings-rhythm-field-heading strong,
.settings-rhythm-toggle-row strong {
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.25;
}

.settings-rhythm-field-heading em {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-rhythm-day-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.settings-rhythm-day-button,
.settings-rhythm-choice {
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--settings-line) 84%, var(--settings-paper));
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font: inherit;
  font-size: 0.78rem;
  line-height: 1.25;
  cursor: pointer;
}

.settings-rhythm-day-button.is-enabled,
.settings-rhythm-choice.is-selected {
  border-color: var(--editorial-focus);
  color: var(--settings-heading);
  background: var(--editorial-selected-bg);
  font-weight: 700;
}

.settings-rhythm-day-button.is-active {
  box-shadow: inset 0 -2px 0 var(--editorial-focus);
}

.settings-rhythm-day-button:hover,
.settings-rhythm-day-button:focus-visible,
.settings-rhythm-choice:hover,
.settings-rhythm-choice:focus-visible {
  color: var(--editorial-hover-ink);
  background: var(--editorial-hover-bg);
}

.settings-rhythm-day-button:focus-visible,
.settings-rhythm-choice:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 3px;
}

.settings-rhythm-day-editor {
  display: grid;
  gap: 10px;
  margin-top: 4px;
  padding: 10px 0 0 12px;
  border-left: 1px solid var(--editorial-focus);
}

.settings-rhythm-day-editor-header,
.settings-rhythm-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.settings-rhythm-day-editor-header strong {
  color: var(--settings-heading);
  font-size: 0.9rem;
}

.settings-rhythm-day-editor-header button {
  min-height: 0;
  padding: 0 0 2px;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font: inherit;
  font-size: 0.78rem;
  font-style: italic;
}

.settings-rhythm-day-editor-header button:hover,
.settings-rhythm-day-editor-header button:focus-visible {
  color: var(--editorial-hover-ink);
}

.settings-rhythm-day-editor-header button:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 3px;
}

.settings-rhythm-choice-group {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
}

.settings-rhythm-choice-group.is-wrapping {
  flex-wrap: wrap;
}

.settings-rhythm-subsection-label,
.settings-rhythm-time-pair>div>span {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.74rem;
  font-style: italic;
  line-height: 1.4;
}

.settings-rhythm-time-pair {
  display: grid;
  grid-template-columns: minmax(150px, 220px) minmax(150px, 220px);
  justify-content: space-between;
  gap: clamp(48px, 12vw, 120px);
}

.settings-rhythm-time-pair>div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-rhythm-time-pair .settings-profile-row {
  grid-template-columns: minmax(0, 1fr);
  min-height: 36px;
  padding: 6px 0;
}

.settings-rhythm-time-pair .settings-profile-row-copy {
  display: none;
}

.settings-rhythm-time-pair .settings-profile-current-value {
  width: 100%;
  text-align: left;
}

.settings-rhythm-time-pair .settings-profile-row-control {
  justify-content: stretch;
  width: 100%;
}

.settings-rhythm-time-pair .settings-rhythm-time-options {
  margin-top: 10px;
  padding-top: 10px;
}

@media (max-width: 520px) {
  .settings-rhythm-time-pair {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
}

.settings-personalization-page .settings-editorial-header p {
  max-width: min(100%, 48ch);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-style: italic;
}

.settings-personalization-list {
  display: grid;
  gap: 10px;
  padding: 14px 0 18px;
  border-bottom: 1px solid var(--settings-line);
}

.settings-personalization-list p {
  margin: 0;
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.35;
}

.settings-personalization-list em,
.settings-personalization-panel em,
.settings-personalization-note,
.settings-personalization-reset em,
.settings-personalization-reset-confirm p {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-personalization-tabs {
  display: flex;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--settings-line);
}

.settings-personalization-tabs button {
  min-height: 0;
  padding: 0 0 3px;
  border: 0;
  border-radius: 0;
  color: color-mix(in srgb, var(--settings-soft-muted) 72%, var(--settings-paper));
  background: transparent;
  font: inherit;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.settings-personalization-tabs button[aria-selected="true"] {
  color: var(--editorial-focus);
  font-weight: 900;
}

.settings-personalization-tabs button:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.settings-personalization-panel {
  display: grid;
  gap: 16px;
  padding: 18px 0;
  border-bottom: 1px solid var(--settings-line);
}

.settings-personalization-still {
  display: grid;
  gap: 12px;
}

.settings-personalization-still p,
.settings-personalization-observation p {
  margin: 0;
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.55;
}

.settings-personalization-observations {
  display: grid;
  gap: 0;
}

.settings-personalization-observations>em {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--settings-line);
}

.settings-personalization-observation {
  display: grid;
  gap: 8px;
  padding: 16px 0;
  border-bottom: 1px solid var(--settings-line);
}

.settings-personalization-observation>span {
  color: var(--settings-muted);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.settings-personalization-observation.is-adjusted {
  opacity: 0.62;
}

.settings-personalization-observation button,
.settings-personalization-reset-confirm button {
  justify-self: start;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font: inherit;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
}

.settings-personalization-feedback {
  display: grid;
  gap: 14px;
  margin-top: 4px;
  padding-left: 18px;
  border-left: 1px solid var(--editorial-focus);
}

.settings-personalization-feedback button {
  justify-self: start;
  color: var(--settings-muted);
}

.settings-personalization-observation button:hover,
.settings-personalization-observation button:focus-visible,
.settings-reset-sheet button:hover,
.settings-reset-sheet button:focus-visible {
  color: var(--editorial-hover-ink);
}

.settings-personalization-observation button:focus-visible,
.settings-reset-sheet button:focus-visible,
.settings-personalization-reset:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.settings-personalization-reset {
  display: grid;
  gap: 6px;
  width: 100%;
  padding: 16px 0 18px;
  border: 0;
  border-bottom: 1px solid var(--settings-line);
  border-radius: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  text-align: left;
}

.settings-personalization-reset strong {
  color: #B75C4B;
  font-size: 1rem;
  font-weight: 500;
}

.settings-reset-sheet-overlay {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 18px;
  background: color-mix(in srgb, var(--settings-forest) 46%, transparent);
}

.settings-reset-sheet {
  width: min(100%, 520px);
  max-height: min(82vh, 720px);
  overflow-y: auto;
  padding: 10px 22px calc(22px + env(safe-area-inset-bottom));
  border: 1px solid var(--settings-line);
  border-radius: 24px 24px 0 0;
  color: var(--settings-heading);
  background: var(--settings-paper);
  box-shadow: 0 -18px 50px color-mix(in srgb, #000 22%, transparent);
  animation: settings-reset-sheet-in 180ms ease-out;
}

.settings-reset-sheet-handle {
  display: block;
  width: 42px;
  height: 4px;
  margin: 0 auto 18px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--settings-muted) 24%, transparent);
}

.settings-reset-sheet-content {
  display: grid;
  gap: 16px;
}

.settings-reset-sheet h2 {
  margin: 0;
  color: var(--settings-heading);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 5vw, 2.2rem);
  line-height: 1.08;
  letter-spacing: 0;
}

.settings-reset-sheet p,
.settings-reset-sheet li {
  margin: 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.98rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-reset-sheet-deletion {
  display: grid;
  margin-top: 2px;
  padding-top: 16px;
  border-top: 1px solid var(--settings-line);
}

.settings-reset-sheet-deletion strong {
  color: var(--settings-heading);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  line-height: 1.45;
}

.settings-reset-sheet-warning {
  color: var(--settings-heading);
  font-size: 1rem;
}

.settings-reset-sheet-actions {
  display: grid;
  gap: 12px;
  padding-top: 4px;
}

.settings-reset-sheet button {
  justify-self: start;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font: inherit;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.96rem;
  font-style: italic;
}

.settings-reset-sheet button.is-destructive {
  color: #B75C4B;
}

.settings-connections-page .settings-editorial-header p {
  max-width: min(100%, 46ch);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-style: italic;
}

.settings-connection-status-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 2px 0 34px;
  color: color-mix(in srgb, var(--settings-soft-muted) 62%, var(--settings-paper));
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  line-height: 1.4;
  text-transform: uppercase;
}

.settings-connection-status-strip span {
  border-bottom: 1px solid transparent;
}

.settings-connection-status-strip span.is-active {
  color: var(--editorial-focus);
  border-bottom-color: var(--editorial-focus);
}

.settings-connection-provider {
  display: grid;
  gap: 18px;
  padding: 22px 0 18px;
  border-bottom: 1px solid var(--settings-line);
}

.settings-connection-provider-head,
.settings-connection-row-button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
}

.settings-connection-provider-head strong,
.settings-connection-row-button span {
  color: var(--settings-heading);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.3;
}

.settings-connection-provider-head>span,
.settings-connection-row-button strong {
  color: var(--editorial-focus);
  font-size: 0.96rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: right;
}

.settings-connection-provider p {
  max-width: 46ch;
  margin: 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-connection-provider .settings-connection-diagnostic {
  max-width: 58ch;
  color: color-mix(in srgb, var(--settings-muted) 82%, var(--settings-heading));
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-style: normal;
  letter-spacing: 0.02em;
}

.settings-connection-provider button {
  justify-self: start;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font: inherit;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.35;
}

.settings-connection-provider button:hover,
.settings-connection-provider button:focus-visible {
  color: var(--editorial-hover-ink);
}

.settings-connection-provider button:focus-visible,
.settings-connection-calendar-selector input:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.settings-connection-provider button:disabled {
  color: color-mix(in srgb, var(--settings-soft-muted) 44%, var(--settings-paper));
}

.settings-connection-provider button.is-destructive {
  color: #B75C4B;
}

.settings-connection-row-button {
  justify-self: stretch;
  width: 100%;
  padding: 18px 0;
  border-top: 1px solid var(--settings-line);
  border-bottom: 1px solid var(--settings-line);
  font-style: normal;
  text-align: left;
}

.settings-connection-row-button strong span {
  display: inline-block;
  margin-left: 4px;
  color: #C8BEA8;
  font-size: 0.68rem;
  transform: rotate(-90deg);
}

.settings-connection-calendar-selector {
  display: grid;
  gap: 18px;
  padding-left: 18px;
  border-left: 1px solid var(--editorial-focus);
}

.settings-connection-calendar-selector label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  color: var(--settings-heading);
  font-weight: 700;
}

.settings-connection-calendar-selector label.is-unavailable {
  color: var(--settings-muted);
  opacity: 0.62;
}

.settings-connection-calendar-selector input {
  appearance: none;
  position: relative;
  width: 56px;
  height: 40px;
  margin: 0;
  border: 0;
  border-radius: 12px;
  background: color-mix(in srgb, var(--settings-line) 72%, var(--settings-paper));
}

.settings-connection-calendar-selector input::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 8px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--settings-paper);
  box-shadow: 0 1px 2px color-mix(in srgb, #000 16%, transparent);
  transition: left 160ms ease;
}

.settings-connection-calendar-selector input:checked {
  background: var(--editorial-focus);
}

.settings-connection-calendar-selector input:checked::after {
  left: 24px;
}

.settings-connection-status-message {
  margin: 20px 0 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
}

.settings-notifications-page .settings-editorial-header {
  margin-bottom: 18px;
}

.settings-notification-status-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 2px 0 22px;
  color: color-mix(in srgb, var(--settings-soft-muted) 62%, var(--settings-paper));
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  line-height: 1.4;
  text-transform: uppercase;
}

.settings-notification-status-strip span {
  border-bottom: 1px solid transparent;
}

.settings-notification-status-strip span.is-active {
  color: var(--editorial-focus);
  border-bottom-color: var(--editorial-focus);
}

.settings-notification-permission-note,
.settings-notification-conflict {
  display: grid;
  gap: 10px;
  margin: 0 0 28px;
  padding-left: 16px;
  border-left: 1px solid var(--editorial-focus);
  color: var(--settings-heading);
}

.settings-notification-permission-note strong {
  font-size: 1rem;
  line-height: 1.35;
}

.settings-notification-permission-note p,
.settings-notification-conflict,
.settings-notification-limitation {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-notification-permission-note p,
.settings-notification-limitation {
  margin: 0;
}

.settings-notification-permission-note button {
  justify-self: start;
  min-height: 0;
  padding: 0 0 2px;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font: inherit;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
}

.settings-notification-permission-note button:hover,
.settings-notification-permission-note button:focus-visible {
  color: var(--editorial-hover-ink);
}

.settings-notification-permission-note button:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.settings-notification-limitation {
  padding: 10px 0 12px;
  border-bottom: 1px solid var(--settings-line);
}

.settings-privacy-page .settings-editorial-header p {
  max-width: min(100%, 46ch);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-style: italic;
}

.settings-privacy-inventory,
.settings-privacy-actions {
  display: grid;
  gap: 0;
}

.settings-privacy-inventory-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: baseline;
  min-height: 36px;
  padding: 8px 0;
  border-bottom: 1px solid var(--settings-line);
}

.settings-privacy-inventory-row span {
  min-width: 0;
  color: var(--settings-heading);
  font-size: 0.96rem;
  line-height: 1.3;
}

.settings-privacy-inventory-row em {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.72rem;
  font-style: italic;
  line-height: 1.35;
  text-align: right;
  white-space: nowrap;
}

.settings-privacy-export {
  display: grid;
  gap: 8px;
  padding: 12px 0 16px;
  border-bottom: 1px solid var(--settings-line);
}

.settings-privacy-import {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-privacy-export strong,
.settings-privacy-action strong {
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.3;
}

.settings-privacy-export em,
.settings-privacy-action em,
.settings-privacy-error {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-privacy-export button {
  justify-self: start;
  min-height: 0;
  padding: 0 0 2px;
  border: 0;
  color: var(--settings-muted);
  background: transparent;
  font: inherit;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.35;
}

.settings-privacy-export button:hover,
.settings-privacy-export button:focus-visible {
  color: var(--editorial-hover-ink);
}

.settings-privacy-export button:focus-visible,
.settings-privacy-action:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.settings-privacy-action {
  display: grid;
  gap: 8px;
  width: 100%;
  min-width: 0;
  padding: 16px 0 18px;
  border: 0;
  border-bottom: 1px solid var(--settings-line);
  border-left: 1px solid transparent;
  border-radius: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  text-align: left;
}

.settings-privacy-action.is-destructive strong {
  color: #B75C4B;
}

.settings-privacy-action:hover strong,
.settings-privacy-action:focus-visible strong {
  color: var(--editorial-hover-ink);
}

.settings-privacy-action.is-destructive:hover strong,
.settings-privacy-action.is-destructive:focus-visible strong {
  color: #B75C4B;
}

.settings-privacy-legal {
  display: grid;
  gap: 0;
  padding: 0 0 16px;
  border-bottom: 0;
}

.settings-privacy-legal p {
  margin: 12px 0 20px;
  padding-left: 16px;
  border-left: 1px solid var(--editorial-focus);
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.96rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-privacy-legal button {
  justify-self: start;
  min-height: 0;
  margin: 0 0 14px;
  padding: 0 0 2px;
  border: 0;
  color: var(--settings-muted);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
}

.settings-privacy-legal button:hover,
.settings-privacy-legal button:focus-visible {
  color: var(--editorial-hover-ink);
}

.settings-privacy-legal button:focus-visible {
  outline: 2px solid var(--editorial-hover-ink);
  outline-offset: 4px;
}

.settings-privacy-error {
  margin: 20px 0 0;
  color: #B75C4B;
}

.settings-legal-summary-page .settings-editorial-header {
  margin-bottom: 28px;
}

.settings-legal-draft-notice {
  margin: 0 0 30px;
  padding-left: 18px;
  border-left: 1px solid var(--editorial-focus);
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.96rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-legal-summary-sections {
  display: grid;
  gap: 0;
}

.settings-legal-summary-section {
  display: grid;
  gap: 12px;
  padding: 22px 0 26px;
  border-top: 1px solid var(--settings-line);
}

.settings-legal-summary-section h2 {
  margin: 0;
  color: var(--settings-heading);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.3;
}

.settings-legal-summary-section p {
  max-width: 50ch;
  margin: 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.65;
}

.settings-feedback-page .settings-editorial-header {
  margin-bottom: 28px;
}

.settings-help-page .settings-editorial-header,
.settings-contact-page .settings-editorial-header {
  margin-bottom: 28px;
}

.settings-help-page .settings-editorial-header p,
.settings-contact-page .settings-editorial-header p {
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-style: italic;
}

.settings-help-faq {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--settings-line);
}

.settings-help-faq-item {
  border-bottom: 1px solid var(--settings-line);
}

.settings-help-faq-item>button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  width: 100%;
  min-height: 58px;
  padding: 14px 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-heading);
  background: transparent;
  font: inherit;
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
}

.settings-help-faq-item>button span:first-child {
  min-width: 0;
}

.settings-help-faq-item>button span[aria-hidden="true"] {
  color: #C8BEA8;
  font-size: 0.72rem;
  transform: rotate(-90deg);
  transform-origin: center;
  transition: transform var(--editorial-motion-medium) var(--editorial-ease);
}

.settings-help-faq-item.is-open>button span[aria-hidden="true"] {
  transform: rotate(0deg);
}

.settings-help-faq-item>button:hover,
.settings-help-faq-item>button:focus-visible {
  color: var(--editorial-hover-ink);
}

.settings-help-faq-item>button:focus-visible,
.settings-help-actions button:focus-visible,
.settings-contact-message textarea:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}

.settings-help-faq-answer {
  padding: 0 0 18px 18px;
  border-left: 1px solid var(--editorial-focus);
}

.settings-help-faq-answer p {
  max-width: 55ch;
  margin: 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.95rem;
  font-style: italic;
  line-height: 1.65;
}

.settings-help-actions {
  display: grid;
  gap: 0;
  margin-top: 36px;
  border-top: 1px solid var(--settings-line);
}

.settings-help-actions button {
  justify-self: start;
  min-height: 58px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-style: italic;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
}

.settings-contact-form {
  display: grid;
  gap: 0;
}

.settings-contact-message {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.settings-contact-message strong {
  color: var(--settings-heading);
  font-size: 1rem;
  line-height: 1.3;
}

.settings-contact-message textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 164px;
  padding: 18px 20px;
  border: 0;
  border-top: 1px solid var(--settings-line);
  border-bottom: 1px solid var(--settings-line);
  border-left: 1px solid var(--settings-line);
  border-radius: 0;
  resize: vertical;
  color: var(--settings-ink);
  background: transparent;
  font: inherit;
  line-height: 1.55;
}

.settings-contact-message textarea::placeholder {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-style: italic;
  opacity: 1;
}

.settings-feedback-form {
  display: grid;
  gap: 0;
}

.settings-feedback-type-group {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.settings-feedback-type-group legend {
  margin: 0 0 14px;
  padding: 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.95rem;
  font-style: italic;
  line-height: 1.5;
}

.settings-feedback-options {
  display: grid;
  gap: 0;
  margin-bottom: 22px;
}

.settings-feedback-option {
  width: 100%;
  min-height: 38px;
  padding: 8px 14px 8px 22px;
  border: 0;
  border-left: 2px solid transparent;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
}

.settings-feedback-option.is-selected {
  border-left-color: var(--editorial-focus);
  color: var(--editorial-selected-ink);
  background: var(--editorial-selected-bg);
  font-weight: 700;
}

.settings-feedback-option:hover,
.settings-feedback-option:focus-visible {
  color: var(--editorial-hover-ink);
  background: var(--editorial-hover-bg);
}

.settings-feedback-option:focus-visible,
.settings-feedback-submit:focus-visible,
.settings-feedback-handoff-actions button:focus-visible,
.settings-feedback-message textarea:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}

.settings-feedback-message {
  display: grid;
  min-width: 0;
  border-top: 1px solid var(--settings-line);
  border-bottom: 1px solid var(--settings-line);
}

.settings-feedback-message textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 128px;
  padding: 18px 20px;
  border: 0;
  border-left: 1px solid var(--settings-line);
  border-radius: 0;
  resize: vertical;
  color: var(--settings-ink);
  background: transparent;
  font: inherit;
  line-height: 1.55;
}

.settings-feedback-message textarea::placeholder {
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-style: italic;
  opacity: 1;
}

.settings-feedback-field {
  display: grid;
  gap: 4px;
  padding: 18px 0 0;
  border-bottom: 1px solid var(--settings-line);
}

.settings-feedback-field h2 {
  margin: 0;
  color: var(--settings-heading);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.3;
}

.settings-feedback-field p {
  max-width: 50ch;
  margin: 0;
  color: var(--settings-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-feedback-submit,
.settings-feedback-handoff-actions button {
  justify-self: start;
  min-height: 32px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--settings-muted);
  background: transparent;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.95rem;
  font-style: italic;
  line-height: 1.35;
  cursor: pointer;
}

.settings-feedback-submit {
  margin-top: 18px;
}

.settings-feedback-submit:disabled {
  color: color-mix(in srgb, var(--settings-soft-muted) 52%, var(--settings-paper));
  cursor: not-allowed;
}

.settings-feedback-handoff-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin-top: 8px;
}

.settings-feedback-limitation {
  padding-bottom: 8px;
}

.settings-feedback-field-error,
.settings-feedback-status {
  margin: 10px 0 0;
  color: #B75C4B;
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.88rem;
  font-style: italic;
  line-height: 1.55;
}

.settings-feedback-status:empty {
  display: none;
}

@keyframes settings-reset-sheet-in {
  from {
    opacity: 0;
    transform: translateY(18px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (min-width: 720px) {
  .settings-reset-sheet-overlay {
    align-items: center;
    padding: 32px;
  }

  .settings-reset-sheet {
    border-radius: 18px;
    padding: 28px 34px 32px;
    box-shadow: 0 24px 70px color-mix(in srgb, #000 24%, transparent);
  }

  .settings-reset-sheet-handle {
    display: none;
  }
}

.settings-help-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.developer-learning-section {
  display: grid;
  gap: 20px;
  padding-top: 28px;
  border-top: 1px solid var(--editorial-rule);
  color: var(--editorial-ink);
}

.developer-learning-summary {
  margin-top: 4px;
}

.developer-learning-section+.developer-learning-section {
  margin-top: 38px;
}

.developer-support-learning {
  gap: 22px;
}

.developer-observer-coverage {
  gap: 18px;
}

.developer-learning-section-heading {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.developer-learning-heading-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: baseline;
  min-width: 0;
}

.developer-learning-section-heading h2 {
  margin: 0;
  color: var(--editorial-muted);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1.5;
  text-transform: uppercase;
}

.developer-learning-section-heading p {
  max-width: 48ch;
  margin: 0;
  color: var(--editorial-body);
  font-size: 0.92rem;
  line-height: 1.62;
}

.developer-learning-position-indicator {
  color: var(--editorial-muted);
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.5;
}

.developer-learning-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 28px;
  border-top: 1px solid var(--editorial-rule);
}

.developer-learning-summary-item {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 18px 0 19px;
  border-bottom: 1px solid var(--editorial-rule);
}

.developer-learning-summary-item span {
  color: var(--editorial-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-transform: uppercase;
}

.developer-learning-summary-item strong {
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-weight: 650;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.developer-support-empty {
  display: grid;
  gap: 8px;
  padding: 26px 0;
  border-top: 1px solid var(--editorial-rule);
  border-bottom: 1px solid var(--editorial-rule);
}

.developer-support-empty h3 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.38rem;
  line-height: 1.24;
}

.developer-support-empty p {
  max-width: 46ch;
  margin: 0;
  color: var(--editorial-body);
  line-height: 1.62;
}

.developer-support-carousel {
  min-width: 0;
  outline: none;
}

.developer-support-carousel:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 8px;
}

.developer-support-carousel-nav {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 38px;
  gap: 18px;
  align-items: center;
  margin: 0;
}

.developer-support-nav-divider {
  padding-bottom: 22px;
  border-bottom: 1px solid var(--editorial-rule);
}

.developer-support-carousel-nav button {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--editorial-rule);
  border-radius: 999px;
  color: var(--editorial-ink);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.developer-support-carousel-nav button:disabled {
  cursor: default;
  opacity: 0.32;
}

.developer-support-carousel-nav button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
}

.developer-support-carousel-nav strong {
  min-width: 0;
  color: var(--editorial-ink);
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
  line-height: 1.24;
  text-align: center;
  overflow-wrap: anywhere;
}

.developer-support-slide {
  display: grid;
  gap: 24px;
  min-width: 0;
  padding: clamp(24px, 4vw, 34px);
  border: 1px solid color-mix(in srgb, var(--editorial-rule) 86%, var(--editorial-paper-bg));
  border-radius: 14px;
  background: color-mix(in srgb, var(--editorial-paper-bg) 88%, var(--editorial-screen-bg));
}

.developer-support-slide-grid {
  display: grid;
  gap: 24px;
}

.developer-support-slide-section {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.developer-support-section-divider {
  margin-top: 2px;
  padding-top: 24px;
  border-top: 1px solid var(--editorial-rule);
}

.developer-support-slide-section h4 {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1.5;
  text-transform: uppercase;
}

.developer-learning-field-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px 28px;
}

.developer-support-effect .developer-learning-signal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 34px;
}

.developer-learning-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.developer-learning-field span,
.developer-learning-signal span,
.developer-observer-status span {
  color: var(--editorial-muted);
  font-size: 0.8rem;
  line-height: 1.45;
}

.developer-learning-field strong,
.developer-observer-status strong {
  color: var(--editorial-ink);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.developer-learning-fact-rows {
  display: grid;
  gap: 12px 20px;
  padding: 16px 18px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--editorial-paper-bg) 72%, var(--editorial-screen-bg));
}

.developer-learning-fact-row {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1fr);
  gap: 18px;
  align-items: baseline;
  min-width: 0;
}

.developer-learning-fact-row span {
  color: var(--editorial-muted);
  font-size: 0.84rem;
  line-height: 1.45;
}

.developer-learning-fact-row strong {
  color: var(--editorial-ink);
  font-size: 0.95rem;
  font-weight: 650;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.developer-learning-signal {
  display: grid;
  gap: 7px;
  min-width: 0;
  align-content: start;
}

.developer-learning-signal strong {
  color: var(--editorial-ink);
  font-size: 1.05rem;
  line-height: 1.45;
}

.developer-learning-signal em {
  color: var(--editorial-body);
  font-size: 0.88rem;
  font-style: italic;
  line-height: 1.45;
}

.developer-support-technical {
  margin-top: 0;
  border-top: 1px solid var(--editorial-rule);
}

.developer-support-technical summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  cursor: pointer;
  padding: 16px 0;
  color: var(--editorial-muted);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0;
}

.developer-support-technical summary::after {
  content: "+";
  color: var(--editorial-soft-muted);
  font-size: 1rem;
}

.developer-support-technical[open] summary::after {
  content: "−";
}

.developer-support-technical .developer-learning-fact-rows {
  margin-bottom: 4px;
  background: color-mix(in srgb, var(--color-sage) 12%, var(--editorial-paper-bg));
  border: 1px solid color-mix(in srgb, var(--color-sage) 20%, transparent);
}

.developer-observer-container {
  min-width: 0;
  padding: clamp(18px, 3vw, 24px);
  border: 1px solid color-mix(in srgb, var(--editorial-rule) 82%, var(--editorial-paper-bg));
  border-radius: 12px;
  background: color-mix(in srgb, var(--editorial-paper-bg) 78%, var(--editorial-screen-bg));
}

.developer-observer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 36px;
}

.developer-observer-status {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.guided-preview-library {
  display: grid;
  gap: 28px;
  color: var(--editorial-ink);
}

.guided-preview-note {
  max-width: 58ch;
  margin: 0;
  color: var(--editorial-body);
  font-size: 0.94rem;
  line-height: 1.62;
}

.guided-preview-group {
  display: grid;
  gap: 0;
  padding-top: 28px;
}

.guided-preview-group:first-of-type {
  border-top: 1px solid var(--editorial-rule);
}

.guided-preview-group h2 {
  margin: 0 0 2px;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
}

.guided-preview-rows {
  display: grid;
  gap: 0;
}

.guided-preview-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 20px 0;
  border-bottom: 1px solid var(--editorial-rule);
}

.guided-preview-row h3 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.18rem;
  font-weight: 700;
  line-height: 1.28;
}

.guided-preview-row p {
  max-width: 52ch;
  margin: 6px 0 0;
  color: var(--editorial-body);
  font-size: 0.92rem;
  line-height: 1.5;
}

.guided-preview-action {
  min-height: 42px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--editorial-muted);
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 0.98rem;
  font-weight: 800;
  line-height: 1.4;
  cursor: pointer;
  white-space: nowrap;
}

.guided-preview-action:hover {
  color: var(--color-sage);
}

.guided-preview-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 5px;
  color: var(--color-sage);
}

.guided-preview-technical-path {
  padding-top: 24px;
}

.guided-preview-technical-path summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  min-height: 42px;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
  cursor: pointer;
  list-style: none;
}

.guided-preview-technical-path summary::-webkit-details-marker {
  display: none;
}

.guided-preview-technical-path summary::after {
  content: "+";
  color: var(--editorial-muted);
  font-size: 1rem;
  line-height: 1;
}

.guided-preview-technical-path[open] summary::after {
  content: "−";
}

.guided-preview-technical-path summary:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 5px;
}

.guided-preview-technical-path ol {
  display: grid;
  gap: 8px;
  margin: 12px 0 0;
  padding-left: 24px;
  color: var(--editorial-body);
  font-size: 0.92rem;
  line-height: 1.55;
}

.developer-mode-entry {
  border-style: dashed;
  background: color-mix(in srgb, var(--panel) 90%, var(--soft-secondary));
}

.recommendation-inspector-record-panel {
  display: grid;
  gap: 24px;
  min-width: 0;
  padding: clamp(24px, 4vw, 34px);
  border: 1px solid color-mix(in srgb, var(--editorial-rule) 86%, var(--editorial-paper-bg));
  border-radius: 14px;
  color: var(--editorial-ink);
  background: color-mix(in srgb, var(--editorial-paper-bg) 88%, var(--editorial-screen-bg));
}

.recommendation-inspector-record-header {
  display: grid;
  gap: 18px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--editorial-rule);
}

.recommendation-inspector-record-nav {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
}

.recommendation-inspector-record-nav button {
  display: inline-grid;
  place-items: center;
  width: 36px;
  min-width: 36px;
  height: 36px;
  border: 0;
  color: var(--editorial-muted);
  background: transparent;
  font: inherit;
  font-size: 1.1rem;
  font-weight: 900;
  cursor: pointer;
}

.recommendation-inspector-record-nav button:disabled {
  color: color-mix(in srgb, var(--editorial-muted) 38%, transparent);
  cursor: not-allowed;
}

.recommendation-inspector-record-nav button:not(:disabled):hover,
.recommendation-inspector-record-nav button:focus-visible {
  color: var(--color-sage);
}

.recommendation-inspector-record-nav button:focus-visible,
.recommendation-inspector-carousel:focus-visible,
.recommendation-inspector-disclosure-summary:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 4px;
  border-radius: 4px;
}

.recommendation-inspector-record-nav time {
  justify-self: center;
  min-width: 0;
  color: var(--editorial-muted);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
  overflow-wrap: anywhere;
}

.recommendation-inspector-record-title {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.recommendation-inspector-record-title h3,
.recommendation-inspector-empty h2 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  letter-spacing: 0;
}

.recommendation-inspector-record-title h3 {
  font-size: 1.34rem;
  font-weight: 650;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.recommendation-inspector-record-title p {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.5;
}

.recommendation-inspector-carousel,
.recommendation-inspector-candidates,
.recommendation-inspector-snapshot,
.recommendation-inspector-outcome {
  display: grid;
  gap: 14px;
}

.recommendation-inspector-muted,
.recommendation-inspector-count {
  color: var(--editorial-muted);
  font-size: 0.84rem;
  font-style: normal;
  line-height: 1.45;
}

.recommendation-inspector-count {
  justify-self: end;
  font-weight: 800;
}

.recommendation-inspector-section {
  display: grid;
  gap: 14px;
  padding: 24px 0 0;
  border-top: 1px solid var(--editorial-rule);
}

.recommendation-inspector-record-header+.recommendation-inspector-section {
  border-top: 0;
}

.recommendation-inspector-section h3,
.recommendation-inspector-disclosure-summary,
.recommendation-inspector-snapshot h3,
.recommendation-inspector-outcome h3 {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.45;
  text-transform: uppercase;
}

.recommendation-inspector-rows,
.recommendation-inspector-reasons {
  display: grid;
  gap: 8px;
}

.recommendation-inspector-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.45;
}

.recommendation-inspector-pills span {
  overflow-wrap: anywhere;
}

.recommendation-inspector-row {
  display: grid;
  gap: 4px;
  align-content: start;
  min-width: 0;
  padding: 0;
  border: 0;
  color: var(--editorial-muted);
  font-size: 0.86rem;
  line-height: 1.45;
}

.recommendation-inspector-row strong {
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.42;
  overflow-wrap: anywhere;
}

.recommendation-inspector-row.is-technical strong {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.78rem;
}

.recommendation-inspector-reasons ul,
.recommendation-inspector-simple-list {
  margin: 8px 0 0;
  padding-left: 20px;
  color: var(--editorial-body);
  line-height: 1.55;
}

.recommendation-inspector-reasons p,
.recommendation-inspector-snapshot .empty-state,
.recommendation-inspector-outcome .empty-state,
.recommendation-inspector-section .empty-state,
.recommendation-inspector-shared-context p {
  margin: 0;
  color: var(--editorial-body);
  line-height: 1.58;
}

.recommendation-inspector-candidate {
  display: grid;
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid var(--editorial-rule);
}

.recommendation-inspector-candidate:first-child {
  border-top: 0;
  padding-top: 0;
}

.recommendation-inspector-candidate-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
}

.recommendation-inspector-candidate-head span,
.recommendation-inspector-candidate-head em {
  color: var(--editorial-muted);
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 800;
}

.recommendation-inspector-candidate-head strong {
  min-width: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.recommendation-inspector-shared-context {
  display: grid;
  gap: 8px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--editorial-rule);
}

.recommendation-inspector-shared-context p {
  color: var(--editorial-muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.recommendation-inspector-disclosure-group {
  display: grid;
  gap: 0;
  margin-top: 22px;
  padding-top: 4px;
  border-top: 1px solid var(--editorial-rule);
}

.recommendation-inspector-disclosure {
  border-bottom: 1px solid var(--editorial-rule);
}

.recommendation-inspector-disclosure-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  width: 100%;
  min-height: 52px;
  padding: 12px 0;
  border: 0;
  cursor: pointer;
  background: transparent;
  text-align: left;
}

.recommendation-inspector-disclosure-summary span:last-child {
  justify-self: end;
}

.recommendation-inspector-disclosure-body {
  padding: 4px 0 18px;
}

.recommendation-inspector-technical-inset {
  display: grid;
  gap: 10px;
  padding: 16px 18px;
  border: 1px solid color-mix(in srgb, var(--color-sage) 20%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--color-sage) 12%, var(--editorial-paper-bg));
  font-size: 0.82rem;
}

.recommendation-inspector-empty {
  display: grid;
  gap: 8px;
  max-width: 46ch;
  padding: 24px 0 2px;
  text-align: left;
}

.recommendation-inspector-empty p {
  margin: 0;
  color: var(--editorial-body);
  line-height: 1.55;
}

.backup-management-editorial {
  display: grid;
  gap: 0;
  color: var(--editorial-ink);
}

.backup-editorial-section {
  display: grid;
  gap: 16px;
  padding: 28px 0;
  border-top: 1px solid var(--editorial-rule);
}

.backup-editorial-section:first-child {
  padding-top: 0;
  border-top: 0;
}

.backup-editorial-heading {
  display: grid;
  gap: 8px;
  max-width: 54ch;
}

.backup-editorial-heading h2 {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
}

.backup-editorial-heading p,
.backup-consequence,
.backup-privacy-note {
  margin: 0;
  color: var(--editorial-body);
  font-size: 0.94rem;
  line-height: 1.62;
}

.backup-consequence {
  max-width: 58ch;
  color: var(--editorial-ink);
}

.backup-privacy-note {
  color: var(--editorial-muted);
  font-size: 0.88rem;
}

.backup-included-list {
  display: grid;
  gap: 8px;
  max-width: 58ch;
  margin: 0;
  padding-left: 20px;
  color: var(--editorial-body);
  line-height: 1.55;
}

.backup-editorial-action,
.backup-file-action {
  justify-self: start;
  min-height: 42px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--color-sage);
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
}

.backup-editorial-action:hover,
.backup-file-action:hover {
  color: var(--editorial-ink);
}

.backup-editorial-action:focus-visible,
.backup-file-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 5px;
}

.backup-editorial-action:disabled,
.backup-editorial-action.is-restore:disabled {
  color: color-mix(in srgb, var(--editorial-muted) 62%, transparent);
  cursor: not-allowed;
}

.backup-editorial-action.is-restore {
  color: color-mix(in srgb, var(--color-sage) 68%, var(--editorial-ink));
}

.backup-file-selector {
  display: grid;
  gap: 8px;
  max-width: 58ch;
  min-width: 0;
  padding: 16px 0 4px;
}

.backup-file-selector label,
.backup-detail-row span {
  color: var(--editorial-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.45;
  text-transform: uppercase;
}

.backup-file-name {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.backup-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 28px;
}

.backup-detail-row {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.backup-detail-row strong {
  color: var(--editorial-ink);
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.48;
  overflow-wrap: anywhere;
}

.backup-status {
  margin: 22px 0 0;
  padding: 12px 0 0;
  border-top: 1px solid var(--editorial-rule);
  font-weight: 700;
  line-height: 1.55;
}

.backup-status.is-success {
  color: var(--color-sage);
}

.backup-status.is-error {
  color: var(--danger);
}

.backup-modal-content {
  display: grid;
  gap: 12px;
}

.backup-modal-actions {
  justify-content: flex-end;
  margin-top: 4px;
}

.backup-restore-dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--layer-modal);
  display: grid;
  place-items: center;
  padding: 18px;
  background: color-mix(in srgb, var(--settings-paper) 72%, rgba(25, 30, 24, 0.34));
}

.backup-restore-dialog {
  display: grid;
  gap: 28px;
  width: min(520px, 100%);
  max-height: min(680px, calc(100vh - 36px));
  overflow: auto;
  padding: 30px;
  border: 1px solid color-mix(in srgb, var(--editorial-rule) 82%, transparent);
  border-radius: 12px;
  color: var(--editorial-ink);
  background: var(--settings-paper);
  box-shadow: 0 18px 42px rgba(50, 47, 38, 0.12);
}

.backup-restore-dialog:focus {
  outline: none;
}

.backup-restore-dialog:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 4px;
}

.backup-restore-dialog-copy {
  display: grid;
  gap: 16px;
}

.backup-restore-dialog-copy h2 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 3vw, 2rem);
  font-weight: 700;
  line-height: 1.16;
}

.backup-restore-dialog-copy p {
  margin: 0;
  color: var(--editorial-body);
  font-size: 1rem;
  line-height: 1.62;
}

.backup-restore-unaffected,
.backup-restore-selected-file {
  display: grid;
  gap: 5px;
  padding-top: 14px;
  border-top: 1px solid var(--editorial-rule);
}

.backup-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 18px;
  padding: 14px 0;
  border-top: 1px solid var(--editorial-rule);
  border-bottom: 1px solid var(--editorial-rule);
}

.backup-preview-row {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.backup-preview-row span {
  color: var(--editorial-muted);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.45;
  text-transform: uppercase;
}

.backup-preview-row strong {
  color: var(--editorial-ink);
  font-size: 0.92rem;
  font-weight: 650;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.backup-preview-note {
  margin: 0;
  color: var(--editorial-muted);
  font-family: "Lora", Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
  font-style: italic;
  line-height: 1.55;
}

.backup-restore-unaffected span,
.backup-restore-selected-file span {
  color: var(--editorial-muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1.45;
  text-transform: uppercase;
}

.backup-restore-selected-file strong {
  color: var(--editorial-ink);
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.backup-restore-dialog-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
}

.backup-dialog-action {
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.04rem;
  line-height: 1.4;
  cursor: pointer;
}

.backup-dialog-action-secondary {
  justify-self: start;
  color: var(--editorial-muted);
  font-weight: 650;
}

.backup-dialog-action-primary {
  justify-self: end;
  color: color-mix(in srgb, var(--color-sage) 72%, var(--editorial-ink));
  font-weight: 800;
}

.backup-dialog-action:hover {
  color: var(--editorial-ink);
}

.backup-dialog-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 5px;
}

.developer-control-page-section {
  display: grid;
  gap: 18px;
  padding-top: 28px;
  border-top: 1px solid var(--editorial-rule);
  color: var(--editorial-ink);
}

.developer-control-page-section:first-child {
  padding-top: 0;
  border-top: 0;
}

.developer-control-section-heading h2 {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
}

.developer-control-copy {
  display: grid;
  gap: 10px;
  max-width: 58ch;
}

.developer-control-copy p {
  margin: 0;
  color: var(--editorial-body);
  font-size: 0.98rem;
  line-height: 1.62;
}

.developer-control-action {
  justify-self: start;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.04rem;
  font-weight: 800;
  line-height: 1.4;
  cursor: pointer;
}

.developer-control-action-caution {
  color: color-mix(in srgb, var(--editorial-muted) 76%, var(--editorial-ink));
}

.developer-control-action-destructive {
  color: var(--danger-text);
}

.developer-control-action:hover {
  color: var(--editorial-ink);
}

.developer-control-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 5px;
}

.developer-lock-action {
  justify-self: start;
  min-height: 44px;
  margin-top: 34px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--editorial-muted);
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.4;
  cursor: pointer;
}

.developer-lock-action:hover {
  color: var(--editorial-ink);
}

.developer-lock-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 5px;
}

.developer-control-lists {
  display: grid;
  gap: 22px;
  max-width: 62ch;
}

.developer-control-lists div {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.developer-control-lists h3 {
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.45;
  text-transform: uppercase;
}

.developer-control-lists ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding-left: 20px;
  color: var(--editorial-body);
  line-height: 1.55;
}

.storage-diagnostics-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 22px;
  align-items: center;
}

.storage-diagnostics-key-list {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.storage-diagnostics-key-row {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--editorial-rule);
}

.storage-diagnostics-key-row:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.storage-diagnostics-wide {
  grid-column: 1 / -1;
}

.developer-confirm-dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--layer-modal);
  display: grid;
  place-items: center;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  background: color-mix(in srgb, var(--settings-paper) 72%, rgba(25, 30, 24, 0.34));
}

.developer-access-dialog-backdrop {
  background: var(--editorial-screen-bg);
}

.developer-confirm-dialog {
  display: grid;
  gap: 28px;
  width: min(520px, 100%);
  max-height: min(680px, calc(100vh - 36px));
  max-height: min(680px, calc(100dvh - max(36px, env(safe-area-inset-top) + env(safe-area-inset-bottom) + 28px)));
  overflow: auto;
  overscroll-behavior: contain;
  padding: 30px;
  border: 1px solid color-mix(in srgb, var(--editorial-rule) 82%, transparent);
  border-radius: 12px;
  color: var(--editorial-ink);
  background: var(--settings-paper);
  box-shadow: 0 18px 42px rgba(50, 47, 38, 0.12);
}

.developer-access-dialog {
  background: var(--editorial-paper-bg);
}

.developer-confirm-dialog:focus {
  outline: none;
}

.developer-confirm-dialog:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 4px;
}

.developer-confirm-dialog-copy {
  display: grid;
  gap: 16px;
}

.developer-confirm-dialog-copy h2 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 3vw, 2rem);
  font-weight: 700;
  line-height: 1.16;
}

.developer-confirm-dialog-copy p {
  margin: 0;
  color: var(--editorial-body);
  font-size: 1rem;
  line-height: 1.62;
}

.energy-verify-result {
  margin-top: 12px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid var(--editorial-hairline, #ddd);
}

.energy-verify-result.is-pass {
  border-color: #4a8a5a;
  background: rgba(74, 138, 90, 0.08);
}

.energy-verify-result.is-fail {
  border-color: #b34a4a;
  background: rgba(179, 74, 74, 0.08);
}

.energy-verify-result-heading {
  margin: 0 0 8px;
  font-weight: 700;
}

.energy-verify-result-body {
  margin: 0;
  max-height: 320px;
  overflow: auto;
  font-family: "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.8rem;
  white-space: pre-wrap;
  word-break: break-word;
}

.energy-verify-record-list {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
  font-family: "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.78rem;
}

.energy-verify-record-list li {
  padding: 6px 8px;
  border-radius: 6px;
  background: var(--editorial-surface-raised, rgba(0, 0, 0, 0.03));
}

.developer-danger-action {
  color: #b34a4a;
  border-color: #b34a4a;
}

.developer-confirm-dialog-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
}

.developer-access-field {
  display: grid;
  gap: 8px;
  margin-top: 4px;
  color: var(--editorial-body);
}

.developer-access-field span {
  color: var(--editorial-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.4;
  text-transform: uppercase;
}

.developer-access-field input {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--editorial-rule);
  border-radius: 8px;
  color: var(--editorial-ink);
  background: color-mix(in srgb, var(--settings-paper) 82%, var(--editorial-rule));
  font: inherit;
  font-size: 1rem;
}

.developer-access-field input:focus {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

.developer-access-field input:disabled {
  color: color-mix(in srgb, var(--editorial-muted) 56%, transparent);
  background: color-mix(in srgb, var(--settings-paper) 90%, var(--editorial-rule));
}

.developer-access-message {
  min-height: 1.5em;
  margin: 0;
  color: var(--editorial-muted);
  font-size: 0.92rem;
  line-height: 1.5;
}

.developer-access-message.is-error {
  color: var(--danger-text);
}

.developer-confirm-action {
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.04rem;
  line-height: 1.4;
  cursor: pointer;
}

.developer-confirm-action-secondary {
  justify-self: start;
  color: var(--editorial-muted);
  font-weight: 650;
}

.developer-confirm-action-caution {
  justify-self: end;
  color: color-mix(in srgb, var(--editorial-muted) 70%, var(--editorial-ink));
  font-weight: 800;
}

.developer-confirm-action-destructive {
  justify-self: end;
  color: var(--danger-text);
  font-weight: 800;
}

.developer-confirm-action:hover {
  color: var(--editorial-ink);
}

.developer-confirm-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 5px;
}

.developer-confirm-action:disabled {
  color: color-mix(in srgb, var(--editorial-muted) 58%, transparent);
  cursor: default;
}

.product-notes-editorial {
  display: grid;
  gap: 38px;
  color: var(--editorial-ink);
}

.product-note-section {
  display: grid;
  gap: 20px;
  padding-top: 28px;
  border-top: 1px solid var(--editorial-rule);
}

.product-note-new-section {
  margin-top: 4px;
}

.product-note-form {
  display: grid;
  gap: 18px;
}

.product-note-details {
  display: grid;
  gap: 12px;
}

.product-note-details h3 {
  margin: 0;
  color: var(--editorial-muted);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1.5;
  text-transform: uppercase;
}

.product-note-details-grid,
.product-note-filters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 28px;
  border-top: 1px solid var(--editorial-rule);
}

.product-note-text {
  display: grid;
  gap: 8px;
  margin-bottom: 0;
}

.product-note-text textarea {
  min-height: 188px;
  padding: 16px;
  border-color: var(--editorial-rule);
  border-radius: 8px;
  color: var(--editorial-ink);
  background: color-mix(in srgb, var(--settings-paper) 84%, white);
  font-size: 1rem;
  line-height: 1.58;
}

.product-note-text textarea::placeholder {
  color: var(--editorial-muted);
}

.product-note-text textarea:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
  border-color: color-mix(in srgb, var(--color-sage) 48%, var(--editorial-rule));
}

.product-note-primary-actions {
  margin-top: -4px;
}

.product-note-meta-row,
.product-note-filter-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 14px;
  align-items: end;
  min-width: 0;
  min-height: 68px;
  padding: 14px 0;
  border-bottom: 1px solid var(--editorial-rule);
  cursor: pointer;
}

.product-note-meta-label,
.product-note-filter-row span {
  grid-column: 1 / -1;
  color: var(--editorial-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-transform: uppercase;
}

.product-note-meta-row strong,
.product-note-filter-row strong {
  min-width: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-weight: 650;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.product-note-meta-row em,
.product-note-filter-row::after {
  color: var(--editorial-muted);
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 800;
  line-height: 1.4;
}

.product-note-filter-row::after {
  content: "Change";
}

.product-note-meta-row:hover strong,
.product-note-meta-row:focus-within strong,
.product-note-filter-row:hover strong,
.product-note-filter-row:focus-within strong {
  color: var(--color-sage);
}

.product-note-meta-row:focus-within,
.product-note-filter-row:focus-within {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
  border-radius: 4px;
}

.product-note-meta-row input,
.product-note-meta-row select,
.product-note-filter-row select {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  border: 0;
  color: transparent;
  background: transparent;
  opacity: 0.01;
  cursor: pointer;
  appearance: none;
}

.product-note-date-row input {
  position: static;
  inset: auto;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  color: var(--editorial-ink);
  background: transparent;
  opacity: 1;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.02rem;
  font-weight: 650;
  line-height: 1.4;
  appearance: auto;
}

.product-note-date-row input::-webkit-calendar-picker-indicator {
  cursor: pointer;
}

.product-note-meta-row input:focus-visible,
.product-note-meta-row select:focus-visible,
.product-note-filter-row select:focus-visible {
  outline: none;
}

.product-note-filters {
  grid-template-columns: repeat(2, minmax(0, 180px));
  gap: 0 24px;
  margin-top: 0;
  border-top: 0;
}

.product-note-list {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--editorial-rule);
}

.product-note-empty {
  display: grid;
  gap: 8px;
  padding: 24px 0;
  border-top: 1px solid var(--editorial-rule);
  border-bottom: 1px solid var(--editorial-rule);
}

.product-note-empty h3,
.product-note-empty p {
  margin: 0;
}

.product-note-empty h3 {
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.12rem;
  font-weight: 650;
  line-height: 1.38;
}

.product-note-empty p {
  max-width: 44ch;
  color: var(--editorial-body);
  font-size: 0.94rem;
  line-height: 1.58;
}

.product-note-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: flex-start;
  min-width: 0;
  padding: 18px 0;
  border-bottom: 1px solid var(--editorial-rule);
}

.product-note-record {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.product-note-record time {
  color: var(--editorial-muted);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.4;
}

.product-note-item p {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  font-size: 1.04rem;
  font-weight: 650;
  line-height: 1.48;
  overflow-wrap: anywhere;
}

.product-note-item span {
  color: var(--editorial-muted);
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.48;
  overflow-wrap: anywhere;
}

.product-note-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  justify-content: flex-end;
  min-width: max-content;
}

.product-note-export {
  display: flex;
  justify-content: flex-start;
  padding-top: 4px;
}

.product-note-link-action {
  min-height: 36px;
  padding: 0;
  border: 0;
  color: var(--editorial-muted);
  background: transparent;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.4;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.product-note-link-action:hover,
.product-note-link-action:focus-visible {
  color: var(--color-sage);
}

.product-note-link-action:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 4px;
  border-radius: 3px;
}

.product-note-link-action.is-destructive {
  color: color-mix(in srgb, var(--danger-text) 76%, var(--editorial-muted));
}

.product-note-link-action.is-destructive:hover,
.product-note-link-action.is-destructive:focus-visible {
  color: var(--danger-text);
}

.product-note-export-action {
  color: var(--editorial-muted);
  text-decoration: none;
}

.product-note-primary-action {
  color: var(--editorial-muted);
}

.product-note-cancel-action {
  color: var(--editorial-muted);
}

.product-note-primary-action::after {
  content: none;
}

.product-note-primary-action:disabled,
.product-note-primary-action[aria-disabled="true"] {
  color: color-mix(in srgb, var(--editorial-muted) 62%, transparent);
  cursor: not-allowed;
}

.stim-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.toggle-field {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
  color: var(--ink);
  font-weight: 700;
}

.toggle-field input {
  width: 18px;
  height: 18px;
  accent-color: var(--color-sage);
}

.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.library-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.support-card {
  min-height: 180px;
  padding: 18px;
  border: 1px solid var(--border);
  border-top: 5px solid var(--color-recovery-green);
  border-radius: var(--radius);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.support-card:nth-child(2n) {
  border-top-color: var(--color-capacity-amber);
}

.support-card:nth-child(3n) {
  border-top-color: var(--color-overload-rose);
}

.support-card h3 {
  margin-bottom: 10px;
}

.support-card ul {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.55;
}

@media (max-width: 1180px) {
}

@media (max-width: 1023px) {
  .daily-tracker-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    display: none;
  }

  main {
    padding: 24px 22px calc(88px + env(safe-area-inset-bottom));
  }

  .mobile-app-brand {
    display: flex;
  }

  .floating-mobile-nav-trigger {
    display: grid;
  }

  .floating-mobile-nav-scrim,
  .floating-mobile-nav-panel {
    display: block;
  }

  .editorial-flow-menu {
    display: none;
  }

  .brand {
    display: none;
    min-height: 0;
  }

  .sidebar-logo {
    display: none;
  }

  .sidebar-brand-icon {
    display: none;
  }

  .tabs {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .tab {
    justify-content: flex-start;
  }

  .menu-toggle {
    display: flex;
  }

  .nav-group {
    gap: 7px;
  }

  .date-card,
  .score-card,
  .recovery-score-card.is-compact {
    display: none;
  }

  .todays-plan-layout {
    gap: 18px;
  }

  .todays-plan-shell:not(.editorial-page-shell) {
    padding: 22px 14px 28px;
  }

  .backup-details-grid {
    grid-template-columns: 1fr;
  }

  .backup-preview {
    grid-template-columns: 1fr;
  }

  .backup-editorial-action,
  .backup-file-action {
    min-height: 44px;
  }

  .backup-restore-dialog-backdrop {
    place-items: end center;
    padding: 0;
  }

  .backup-restore-dialog {
    width: 100%;
    max-height: 88vh;
    padding: 26px 20px calc(26px + env(safe-area-inset-bottom));
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 18px 18px 0 0;
  }

  .backup-restore-dialog::before {
    display: block;
    width: 44px;
    height: 4px;
    margin: 0 auto -4px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--editorial-rule) 76%, var(--editorial-ink));
    content: "";
  }

  .backup-restore-dialog-actions {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .backup-dialog-action-secondary,
  .backup-dialog-action-primary {
    justify-self: stretch;
    text-align: left;
  }

  .developer-confirm-dialog-backdrop {
    place-items: end center;
    padding: 0;
  }

  .developer-confirm-dialog {
    width: 100%;
    max-height: 88vh;
    padding: 26px 20px calc(26px + env(safe-area-inset-bottom));
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 18px 18px 0 0;
  }

  .developer-confirm-dialog::before {
    display: block;
    width: 44px;
    height: 4px;
    margin: 0 auto -4px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--editorial-rule) 76%, var(--editorial-ink));
    content: "";
  }

  .developer-confirm-dialog-actions {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .developer-confirm-action-secondary,
  .developer-confirm-action-caution,
  .developer-confirm-action-destructive {
    justify-self: stretch;
    text-align: left;
  }

  .guided-preview-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .guided-preview-action {
    justify-self: start;
    min-height: 44px;
  }

  .entry-history-meta {
    grid-template-columns: 1fr;
  }

  .entry-history-date {
    font-size: 1.32rem;
  }

  .recommendation-inspector-row,
  .recommendation-inspector-candidate-head {
    grid-template-columns: 1fr;
  }

  .recommendation-inspector-record-panel {
    padding: 18px;
  }

  .recommendation-inspector-record-nav {
    gap: 10px;
  }

  .recommendation-inspector-empty {
    padding-top: 14px;
  }

  .developer-learning-summary-grid {
    grid-template-columns: 1fr;
  }

  .developer-learning-heading-row,
  .developer-support-carousel-nav,
  .developer-support-slide-grid,
  .developer-learning-field-grid,
  .developer-support-effect .developer-learning-signal-grid,
  .developer-observer-grid,
  .developer-learning-fact-row {
    grid-template-columns: 1fr;
  }

  .developer-learning-position-indicator {
    justify-self: start;
  }

  .developer-support-carousel-nav {
    gap: 12px;
  }

  .developer-support-carousel-nav button {
    justify-self: start;
  }

  .developer-support-carousel-nav button:last-child {
    justify-self: end;
  }

  .developer-support-carousel-nav strong {
    text-align: left;
  }

  .product-note-details-grid,
  .product-note-filters {
    grid-template-columns: 1fr;
  }

  .product-note-item {
    grid-template-columns: 1fr;
  }

  .product-note-actions {
    justify-content: flex-start;
  }
}

@media (min-width: 981px) and (max-width: 1199px) {
  main {
    padding: 24px;
  }
}

@media (min-width: 1200px) {
  main {
    padding: 24px;
  }
}

:root[data-theme="dark"] .sidebar {
  backdrop-filter: none;
  background: var(--surface);
  color: var(--text);
  border-right-color: var(--border);
}

:root[data-theme="dark"] .sidebar-wordmark {
  color: var(--text);
}

:root[data-theme="dark"] .sidebar-tagline,
:root[data-theme="dark"] .nav-group-label {
  color: var(--muted);
}

:root[data-theme="dark"] .tab {
  color: var(--muted);
}

:root[data-theme="dark"] .tab svg {
  color: currentColor;
}

:root[data-theme="dark"] .tab.is-active {
  color: var(--text);
  background: color-mix(in srgb, var(--color-sage) 22%, transparent);
}

:root[data-theme="dark"] .tab.is-active svg {
  color: var(--primary);
}

:root[data-theme="dark"] .sidebar-collapse-button {
  color: var(--text);
  background: var(--surface-raised);
  border-color: var(--border);
}

:root[data-theme="dark"] .meter span {
  background: linear-gradient(90deg, var(--color-overload-rose), var(--color-capacity-amber), var(--color-recovery-green));
}

:root[data-theme="reduced"] .sidebar,
:root[data-theme="reduced"] .mobile-app-brand,
:root[data-theme="reduced"] .floating-mobile-nav-panel,
:root[data-theme="reduced"] .editorial-flow-menu-panel,
:root[data-theme="reduced"] .editorial-calendar-dialog,
:root[data-theme="reduced"] .modal-surface,
:root[data-theme="reduced"] .help-modal,
:root[data-theme="reduced"] .guided-tour-bubble,
:root[data-theme="reduced"] .backup-restore-dialog,
:root[data-theme="reduced"] .developer-confirm-dialog {
  box-shadow: none;
}

:root[data-theme="dark"] body,
:root[data-theme="dark"] #root,
:root[data-theme="dark"] .app-shell,
:root[data-theme="dark"] .app-main,
:root[data-theme="dark"] main,
:root[data-theme="dark"] .guided-editorial-screen,
:root[data-theme="dark"] .weekly-overview-screen:not(.editorial-page-shell),
:root[data-theme="dark"] .todays-plan-shell:not(.editorial-page-shell),
:root[data-theme="dark"] .planning-flow:not(.editorial-page-shell),
:root[data-theme="dark"] .tracker-editorial-shell:not(.editorial-page-shell),
:root[data-theme="dark"] .developer-editorial-shell:not(.editorial-page-shell) {
  color: var(--text-primary);
  background: var(--surface-app);
}

:root[data-theme="dark"] .settings-editorial-shell {
  border-color: var(--border-subtle);
  color: var(--editorial-body);
  background: var(--editorial-paper-bg);
}

:root[data-theme="dark"] .editorial-page-shell.settings-editorial-shell {
  border-color: transparent;
  color: var(--text-primary);
  background: var(--surface-app);
}

:root[data-theme="dark"] .todays-plan-page:not(.editorial-page-surface),
:root[data-theme="dark"] .tracker-editorial-page:not(.editorial-page-surface),
:root[data-theme="dark"] .settings-editorial-page,
:root[data-theme="dark"] .developer-editorial-page:not(.editorial-page-surface),
:root[data-theme="dark"] .planning-editorial-panel:not(.editorial-page-surface),
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .metric-panel,
:root[data-theme="dark"] .ds-card,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .support-action-card,
:root[data-theme="dark"] .recommendation-inspector-record-panel,
:root[data-theme="dark"] .developer-support-carousel,
:root[data-theme="dark"] .developer-learning-summary-card,
:root[data-theme="dark"] .backup-file-selector,
:root[data-theme="dark"] .product-note-empty,
:root[data-theme="dark"] .product-note-item {
  border-color: var(--border-subtle);
  color: var(--text-primary);
  background: var(--surface-panel);
  box-shadow: none;
}

:root[data-theme="dark"] .settings-editorial-page,
:root[data-theme="dark"] .developer-editorial-page,
:root[data-theme="dark"] .todays-plan-page:not(.editorial-page-surface),
:root[data-theme="dark"] .tracker-editorial-page:not(.editorial-page-surface) {
  --settings-ink: var(--editorial-body);
  --settings-heading: var(--editorial-ink);
  --settings-muted: var(--editorial-muted);
  --settings-soft-muted: var(--editorial-soft-muted);
  --settings-line: var(--editorial-rule);
  --settings-paper: var(--editorial-paper-bg);
  --settings-selected: var(--editorial-selected-bg);
}

:root[data-theme="dark"] .modal-backdrop,
:root[data-theme="dark"] .help-backdrop,
:root[data-theme="dark"] .tutorial-backdrop,
:root[data-theme="dark"] .backup-restore-dialog-backdrop,
:root[data-theme="dark"] .developer-confirm-dialog-backdrop,
:root[data-theme="dark"] .floating-mobile-nav-scrim {
  background: color-mix(in srgb, var(--surface-page) 72%, rgba(0, 0, 0, 0.66));
}

:root[data-theme="dark"] .developer-confirm-dialog-backdrop {
  background: color-mix(in srgb, #17261d 84%, rgba(0, 0, 0, 0.66));
}

:root[data-theme="dark"] .developer-access-dialog-backdrop {
  background: var(--editorial-screen-bg);
}

:root[data-theme="dark"] .modal-surface,
:root[data-theme="dark"] .help-modal,
:root[data-theme="dark"] .guided-tour-bubble,
:root[data-theme="dark"] .editorial-flow-menu-panel,
:root[data-theme="dark"] .floating-mobile-nav-panel,
:root[data-theme="dark"] .editorial-calendar-dialog,
:root[data-theme="dark"] .backup-restore-dialog,
:root[data-theme="dark"] .developer-confirm-dialog {
  border-color: var(--editorial-rule);
  color: var(--editorial-body);
  background: var(--editorial-paper-bg);
  box-shadow: none;
}

:root[data-theme="dark"] .developer-confirm-dialog {
  border-color: color-mix(in srgb, var(--color-sage) 38%, var(--border-subtle));
  color: var(--color-cream);
  background: color-mix(in srgb, #26362b 78%, var(--surface-panel));
}

:root[data-theme="dark"] .developer-access-dialog {
  background: var(--editorial-paper-bg);
}

:root[data-theme="dark"] .modal-surface h2,
:root[data-theme="dark"] .help-modal h2,
:root[data-theme="dark"] .guided-tour-bubble h2,
:root[data-theme="dark"] .backup-restore-dialog-copy h2,
:root[data-theme="dark"] .developer-confirm-dialog-copy h2,
:root[data-theme="dark"] .backup-restore-selected-file strong,
:root[data-theme="dark"] .developer-confirm-dialog-copy strong {
  color: var(--editorial-ink);
}

:root[data-theme="dark"] .developer-confirm-dialog-copy h2 {
  color: var(--color-cream);
}

:root[data-theme="dark"] .developer-confirm-dialog-copy p,
:root[data-theme="dark"] .developer-access-field {
  color: color-mix(in srgb, var(--color-cream) 82%, var(--color-sage));
}

:root[data-theme="dark"] .developer-access-field span,
:root[data-theme="dark"] .developer-access-message {
  color: color-mix(in srgb, var(--color-cream) 72%, var(--color-sage));
}

:root[data-theme="dark"] .developer-access-message.is-error {
  color: color-mix(in srgb, #ffb3a8 84%, var(--color-cream));
}

:root[data-theme="dark"] .date-card input,
:root[data-theme="dark"] .date-input-inline input,
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select,
:root[data-theme="dark"] .field input,
:root[data-theme="dark"] .editorial-day-activity-fields input,
:root[data-theme="dark"] .editorial-day-activity-fields select,
:root[data-theme="dark"] .product-note-meta-row input,
:root[data-theme="dark"] .product-note-meta-row select,
:root[data-theme="dark"] .product-note-filter-row select,
:root[data-theme="dark"] .product-note-text textarea {
  border-color: var(--border-subtle);
  color: var(--text-primary);
  background: var(--input-bg);
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: color-mix(in srgb, var(--text-secondary) 74%, transparent);
}

:root[data-theme="dark"] .developer-access-field input {
  border-color: color-mix(in srgb, var(--color-sage) 54%, var(--border-subtle));
  color: var(--color-cream);
  background: color-mix(in srgb, #111a14 78%, var(--surface-inset));
  caret-color: var(--color-cream);
}

:root[data-theme="dark"] .developer-access-field input:focus {
  outline-color: var(--focus-ring);
  border-color: var(--color-sage);
}

:root[data-theme="dark"] button,
:root[data-theme="dark"] .text-button,
:root[data-theme="dark"] .icon-button,
:root[data-theme="dark"] .ds-button-secondary,
:root[data-theme="dark"] .compact-button,
:root[data-theme="dark"] .backup-dialog-action,
:root[data-theme="dark"] .developer-confirm-action,
:root[data-theme="dark"] .product-note-link-action,
:root[data-theme="dark"] .product-note-primary-action,
:root[data-theme="dark"] .product-note-cancel-action {
  color: inherit;
}

:root[data-theme="dark"] .developer-confirm-action-secondary {
  color: color-mix(in srgb, var(--color-cream) 74%, var(--color-sage));
}

:root[data-theme="dark"] .developer-confirm-action-caution {
  color: color-mix(in srgb, var(--color-sage) 64%, var(--color-cream));
}

:root[data-theme="dark"] .save-entry-button,
:root[data-theme="dark"] .ds-button-primary {
  border-color: var(--accent-primary);
  color: #111711;
  background: var(--accent-primary);
}

:root[data-theme="dark"] button:disabled,
:root[data-theme="dark"] .text-button:disabled,
:root[data-theme="dark"] .save-entry-button:disabled,
:root[data-theme="dark"] .product-note-primary-action:disabled {
  color: color-mix(in srgb, var(--text-secondary) 54%, transparent);
  border-color: color-mix(in srgb, var(--border-subtle) 60%, transparent);
  background: color-mix(in srgb, var(--surface-inset) 58%, transparent);
}

:root[data-theme="dark"] .delete-button,
:root[data-theme="dark"] .is-destructive,
:root[data-theme="dark"] .developer-confirm-action-destructive {
  color: color-mix(in srgb, var(--color-sand) 78%, var(--color-cream));
}

@media (hover: hover) and (pointer: fine) {

  :root[data-theme="dark"] .text-button:hover,
  :root[data-theme="dark"] .icon-button:hover,
  :root[data-theme="dark"] .sidebar-home-link:hover,
  :root[data-theme="dark"] .tab:hover,
  :root[data-theme="dark"] .settings-navigation-row.is-enabled:hover,
  :root[data-theme="dark"] .editorial-flow-menu-panel button:hover,
  :root[data-theme="dark"] .floating-mobile-nav-item:hover,
  :root[data-theme="dark"] .backup-dialog-action:hover,
  :root[data-theme="dark"] .developer-confirm-action:hover {
    color: var(--editorial-hover-ink);
    background: var(--editorial-hover-bg);
  }

  :root[data-theme="dark"] .tab.is-active:hover,
  :root[data-theme="dark"] .visual-comfort-segment.is-selected:hover,
  :root[data-theme="dark"] [aria-selected="true"]:hover,
  :root[data-theme="dark"] .is-selected:hover {
    color: var(--editorial-selected-ink);
    background: var(--editorial-selected-bg);
  }
}

body[data-reduce-motion="true"] *,
body[data-reduce-motion="true"] *::before,
body[data-reduce-motion="true"] *::after {
  animation: none !important;
  scroll-behavior: auto !important;
  transition: none !important;
}

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    animation: none !important;
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

@media (max-width: 640px) {

  main,
  .sidebar {
    padding: 16px;
  }

  main {
    padding: 20px 16px calc(88px + env(safe-area-inset-bottom));
  }

  .mobile-app-brand {
    margin-bottom: var(--space-6);
  }

  .topbar {
    align-items: flex-start;
    flex-direction: column;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
  }

  .topbar h2 {
    font-size: 2rem;
    line-height: 1.08;
  }

  .page-connection {
    font-size: 0.95rem;
  }

  .top-actions {
    display: none;
  }

  .date-controls {
    display: grid;
    grid-template-columns: var(--tap-target) minmax(0, 1fr) var(--tap-target) auto;
    width: 100%;
  }

  .editorial-date-trigger {
    width: 100%;
  }

  .editorial-date-in-document .editorial-date-trigger {
    width: auto;
  }

  .editorial-date-trigger strong {
    font-size: 1rem;
  }

  .editorial-date-in-document .editorial-date-trigger strong {
    font-size: inherit;
  }

  .editorial-calendar-layer:not([data-layout="sheet"]) {
    width: min(96vw, 390px);
  }

  .editorial-calendar-dialog {
    max-height: calc(100dvh - 24px);
    padding: 12px;
    background: var(--editorial-paper-bg);
    box-shadow: 0 20px 70px color-mix(in srgb, #000 34%, transparent);
  }

  .calendar-connection-preview-day+.calendar-connection-preview-day {
    margin-top: 10px;
  }

  .calendar-connection-preview-event {
    grid-template-columns: minmax(52px, 64px) minmax(0, 1fr);
    gap: 12px;
    padding: 13px 0;
  }

  .calendar-connection-preview-event-time {
    font-size: 0.72rem;
  }

  .calendar-connection-preview-event-title {
    font-size: 0.94rem;
  }

  .calendar-connection-footer--sticky-preview {
    margin-inline: -16px;
    padding: 18px 16px calc(16px + env(safe-area-inset-bottom));
  }

  .calendar-connection-footer--sticky-preview .calendar-connection-actions {
    gap: 24px;
  }

  .editorial-calendar-day {
    min-height: 40px;
  }

  .date-input-inline {
    min-width: 0;
  }

  .date-input-inline span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 1px solid var(--editorial-surface-border);
  }

  .date-input-inline input {
    min-width: 0;
    height: var(--tap-target);
    text-align: center;
  }

  .selected-date-status {
    width: 100%;
    justify-content: center;
  }

  .planning-editorial-screen {
    gap: 16px;
  }

  .planning-editorial-opening h4 {
    font-size: 2.35rem;
    line-height: 1.02;
  }

  .planning-calendar {
    padding: 14px;
  }

  .planning-calendar-weekdays,
  .planning-calendar-grid {
    gap: 3px;
  }

  .planning-calendar-day {
    min-height: 38px;
    font-size: 0.9rem;
  }

  .planning-day-card {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 12px;
    padding: 14px 0;
  }

  .planning-day-card em {
    grid-column: 1 / -1;
    text-align: left;
  }

  .metric-content-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 150px;
    align-items: center;
    gap: 32px;
    margin-top: var(--space-3);
  }

  .metric-gauge {
    display: grid;
    place-items: center;
    justify-self: center;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    margin: 0;
    background:
      conic-gradient(from -45deg, var(--metric-ring-color) var(--gauge-value), color-mix(in srgb, var(--border) 76%, transparent) 0),
      var(--surface);
  }

  .metric-gauge span {
    width: 40px;
    height: 40px;
  }

  .support-action-card .text-button {
    width: 100%;
  }

  .principle-strip {
    display: none;
  }

  .modal-backdrop {
    place-items: end center;
    padding: 0;
  }

  .modal-surface,
  .help-modal {
    width: 100%;
    max-height: 88vh;
    border-radius: var(--radius-modal) var(--radius-modal) 0 0;
  }

  .modal-surface::before {
    display: block;
    width: 44px;
    height: 4px;
    margin: 0 auto var(--space-4);
    border-radius: 999px;
    background: color-mix(in srgb, var(--border) 74%, var(--text));
    content: "";
  }

  .score-explanation-grid {
    grid-template-columns: 1fr;
  }

  .editorial-day-activity-fields {
    grid-template-columns: minmax(72px, 0.34fr) 1px minmax(0, 1fr) 30px;
    gap: 12px;
  }

  .editorial-day-activity-rule {
    grid-row: 1 / span 3;
  }

  .editorial-day-activity-main {
    grid-column: 3 / 4;
  }

  .editorial-day-activity-line {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .editorial-day-category-cell {
    min-width: max-content;
  }

  .editorial-day-kind-field,
  .editorial-day-kind-field select {
    width: auto;
    min-width: max-content;
  }

  .editorial-day-overflow-menu {
    grid-column: 4 / 5;
    grid-row: 1 / 2;
  }

  .editorial-day-bottom-sheet {
    width: 100%;
    bottom: 0;
    margin-bottom: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 18px 18px 0 0;
  }

  .editorial-day-sheet-grid {
    grid-template-columns: 1fr;
  }

  .saved-entry {
    align-items: flex-start;
    flex-direction: column;
  }

  .stim-card,
  .stim-mini-card,
  .stim-decision-card {
    align-items: flex-start;
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .stim-decision-actions,
  .feedback-options {
    justify-content: stretch;
    width: 100%;
  }

  .stim-decision-actions .text-button,
  .feedback-options .text-button {
    justify-content: center;
    width: 100%;
  }

  .saved-actions,
  .saved-actions .text-button {
    width: 100%;
  }

  .saved-actions .text-button {
    justify-content: center;
  }

  .stim-form-grid {
    grid-template-columns: 1fr;
  }

  .todays-plan-page:not(.editorial-page-surface) {
    max-width: 100%;
    padding: 42px 28px 66px;
  }

  .todays-plan-page-header {
    align-items: flex-start;
    margin-bottom: 34px;
  }

  .todays-plan-actions {
    justify-content: flex-end;
  }

  .todays-plan-page-header .todays-plan-actions .text-button {
    width: auto;
  }

  .todays-plan-opening h1 {
    max-width: none;
    font-size: 1.72rem;
  }

  .todays-plan-rule {
    margin: 34px 0;
  }

  .todays-plan-phase {
    margin-bottom: 28px;
  }

  .todays-plan-block.readonly-block {
    display: block;
  }

  .todays-plan-block-toggle {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
  }

  .todays-plan-block-time,
  .todays-plan-block.readonly-block>span {
    grid-column: 1 / -1;
    padding-top: 0;
  }

  .todays-plan-block-toggle>div {
    grid-column: 1;
  }

  .todays-plan-chevron {
    grid-column: 2;
    grid-row: 2;
  }

  .todays-plan-block-expanded {
    margin-left: 0;
  }

  .todays-plan-consideration {
    padding: 22px 20px 24px;
    margin-bottom: 38px;
  }

  .todays-plan-consideration>p:last-child {
    font-size: 0.98rem;
  }

  .section-title,
  .today-plan-header,
  .edit-plan-header {
    align-items: stretch;
    flex-direction: column;
  }

  .edit-plan-actions {
    justify-content: stretch;
  }

  .today-plan-header p {
    max-width: none;
    text-align: left;
  }

  .todays-plan-actions .text-button,
  .edit-plan-actions .text-button,
  .add-block-button {
    justify-content: center;
    width: 100%;
  }

  .guided-tour-highlight {
    box-shadow: 0 0 0 9999px color-mix(in srgb, var(--bg) 12%, rgba(0, 0, 0, 0.12)), 0 0 0 4px color-mix(in srgb, var(--primary) 18%, transparent);
  }

  .guided-tour-bubble {
    width: min(360px, calc(100vw - 24px));
    max-height: 52vh;
  }

  .guided-tour-actions {
    grid-template-columns: 1fr;
  }

  .guided-tour-actions .text-button {
    justify-content: center;
    width: 100%;
  }

  .readonly-block {
    grid-template-columns: 1fr;
  }

  .more-options-menu,
  .more-options-list {
    width: 100%;
  }

  .more-options-list {
    position: static;
  }

  .check-grid,
  .symptom-groups {
    grid-template-columns: 1fr;
  }

  .tab span {
    display: none;
  }

  .tab {
    min-width: 0;
    padding: 0;
  }
}

@media (max-width: 640px) {

  html,
  body {
    overflow-x: hidden;
  }

  .planning-flow:not(.editorial-page-shell) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding: max(12px, env(safe-area-inset-top)) 12px max(22px, env(safe-area-inset-bottom));
    overflow-x: hidden;
  }

  .planning-editorial-panel:not(.editorial-page-surface) {
    width: 100%;
    max-width: 100%;
    padding: 24px 18px 30px;
    border-radius: 8px;
  }

  .planning-editorial-panel .panel-head {
    margin-bottom: 14px;
  }

  .planning-editorial-screen {
    gap: 18px;
    max-width: 100%;
    padding: 0;
  }

  .planning-editorial-opening {
    gap: 9px;
  }

  .planning-editorial-opening h4 {
    font-size: clamp(1.48rem, 9vw, 1.9rem);
    line-height: 1.15;
  }

  .planning-editorial-opening p {
    font-size: 0.9rem;
    line-height: 1.55;
  }

  .planning-selected-week {
    gap: 5px;
    padding: 12px 0;
  }

  .planning-day-week-card {
    padding: 12px;
  }

  .planning-selected-week span {
    font-size: 0.62rem;
    letter-spacing: 0.08em;
  }

  .planning-selected-week strong {
    overflow-wrap: anywhere;
    font-size: 1rem;
    line-height: 1.3;
  }

  .planning-calendar {
    gap: 10px;
    padding: 0;
  }

  .planning-calendar header h4 {
    font-size: 1.12rem;
  }

  .planning-calendar-weekdays,
  .planning-calendar-grid {
    gap: 2px 0;
  }

  .planning-calendar-weekdays span {
    font-size: 0.56rem;
    letter-spacing: 0.05em;
  }

  .planning-calendar-day {
    min-height: 0;
    font-size: 0.78rem;
  }

  .planning-editorial-actions {
    gap: 14px;
    padding-top: 18px;
  }

  .planning-day-cards {
    gap: 9px;
  }

  .planning-day-card {
    grid-template-columns: 26px minmax(0, 1fr);
    grid-auto-rows: auto;
    align-items: start;
    gap: 4px 10px;
    padding: 12px;
  }

  .planning-day-card-marker {
    grid-column: 1;
    grid-row: 1 / span 3;
    width: 24px;
    height: 24px;
    font-size: 0.76rem;
  }

  .planning-day-card-name {
    grid-column: 2;
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 1.08rem;
    line-height: 1.18;
  }

  .planning-day-card strong {
    grid-column: 2;
    justify-self: start;
    max-width: 100%;
    font-size: 0.68rem;
    letter-spacing: 0.04em;
  }

  .planning-day-card em {
    grid-column: 2;
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 0.82rem;
    line-height: 1.35;
  }

  .todays-plan-page:not(.editorial-page-surface) {
    width: 100%;
    max-width: 100%;
    padding:
      max(32px, env(safe-area-inset-top)) 20px max(54px, env(safe-area-inset-bottom));
    overflow-x: hidden;
  }

  .todays-plan-page:has(.editorial-calendar-layer) {
    overflow: visible;
  }

  .todays-plan-page-header {
    gap: 12px;
    margin-bottom: 28px;
  }

  .todays-plan-page-header h2,
  .todays-plan-page-header time {
    font-size: 0.75rem;
  }

  .todays-plan-opening h1 {
    font-size: clamp(1.42rem, 9vw, 1.82rem);
    line-height: 1.16;
  }

  .todays-plan-opening>p:last-child {
    font-size: 1rem;
    line-height: 1.5;
  }

  .todays-plan-rule {
    margin: 28px 0;
  }

  .todays-plan-phase-row {
    align-items: flex-start;
    gap: 8px;
  }

  .todays-plan-phase-row>span:first-child {
    font-size: 0.72rem;
    letter-spacing: 0.12em;
  }

  .todays-plan-phase-row>span:last-child {
    white-space: normal;
    text-align: right;
  }

  .todays-plan-phase-interpretation {
    font-size: 0.96rem;
    line-height: 1.55;
  }

  .editorial-day-activity-editor {
    padding-top: 14px;
  }

  .editorial-day-activity-fields,
  .editorial-day-activity-fields:has(.editorial-day-time-field input:focus) {
    grid-template-columns: 1px minmax(0, 1fr) 26px;
    column-gap: 12px;
    row-gap: 5px;
  }

  .editorial-day-activity-rule {
    grid-column: 1;
    grid-row: 1 / span 3;
    min-height: 68px;
  }

  .editorial-day-time-field {
    grid-column: 2;
    grid-row: 1;
    justify-self: start;
    width: auto;
  }

  .editorial-day-time-range-fields {
    grid-column: 2;
    grid-row: 1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: min(100%, 168px);
  }

  .editorial-day-time-range-fields .editorial-day-time-field {
    grid-column: auto;
    grid-row: auto;
    width: 100%;
  }

  .editorial-day-time-range-fields .editorial-day-time-message {
    grid-column: 1 / -1;
  }

  .editorial-day-time-field input {
    width: 54px;
    min-width: 0;
    min-height: 20px;
    padding: 0;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
    color: #7C756A;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.15;
  }

  .editorial-day-time-field input:focus {
    width: 62px;
    padding: 0 3px;
  }

  .editorial-day-time-range-fields .editorial-day-time-field input,
  .editorial-day-time-range-fields .editorial-day-time-field input:focus {
    width: 100%;
  }

  .editorial-day-activity-main {
    grid-column: 2;
    grid-row: 2 / span 2;
    gap: 6px;
  }

  .editorial-day-activity-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
  }

  .editorial-day-activity-main input {
    min-height: 28px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.96rem;
  }

  .editorial-day-activity-main input:focus {
    padding: 0 6px;
  }

  .editorial-day-activity-main p {
    max-width: 100%;
    font-size: 0.88rem;
    line-height: 1.5;
  }

  .editorial-day-category-cell {
    min-width: 0;
  }

  .editorial-day-kind-field {
    max-width: 100%;
    min-width: 0;
  }

  .editorial-day-kind-field select {
    width: auto;
    max-width: 142px;
    min-width: 0;
    min-height: 24px;
    padding: 3px 30px 3px 10px;
    background-position: right 12px center;
    background-size: 10px 7px;
    font-size: 0.56rem;
    letter-spacing: 0.08em;
  }

  .editorial-day-overflow-button {
    width: 26px;
    height: 26px;
  }

  .editorial-day-overflow-menu {
    grid-column: 3;
    grid-row: 2;
  }

  .editorial-day-add-row .editorial-day-new-activity {
    min-height: 46px;
    font-size: 0.94rem;
  }

  .editorial-day-bottom-sheet {
    max-height: min(78vh, 560px);
    padding: 24px 20px max(22px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 430px) {
  .planning-flow:not(.editorial-page-shell) {
    padding-right: 10px;
    padding-left: 10px;
  }

  .planning-editorial-panel:not(.editorial-page-surface) {
    padding-right: 16px;
    padding-left: 16px;
  }

  .planning-day-card-name {
    font-size: 1rem;
  }

  .editorial-day-activity-fields,
  .editorial-day-activity-fields:has(.editorial-day-time-field input:focus) {
    grid-template-columns: 1px minmax(0, 1fr) 24px;
    column-gap: 10px;
  }

  .editorial-day-time-field input {
    width: 50px;
    font-size: 0.68rem;
  }

  .editorial-day-time-field input:focus {
    width: 58px;
  }

  .editorial-day-activity-line {
    grid-template-columns: minmax(0, 1fr);
  }

  .editorial-day-kind-field select {
    max-width: 128px;
  }
}

/* Help Regulate Learn approved editorial composition */
.app-main-tracker,
.app-main-toolkit {
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background: var(--editorial-screen-bg);
}

.app-shell-tracker,
.app-shell-toolkit {
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: none;
  overflow-x: hidden;
  background: var(--editorial-screen-bg);
}

.app-shell-stims,
.app-shell-stims.sidebar-collapsed {
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--editorial-screen-bg);
}

.app-shell-tracker .editorial-flow-menu,
.app-shell-toolkit .editorial-flow-menu {
  top: clamp(18px, 3vw, 32px);
  right: clamp(18px, 3vw, 32px);
}

.app-shell-stims .editorial-flow-menu {
  top: clamp(18px, 3vw, 32px);
  right: clamp(18px, 3vw, 32px);
}

.app-shell-tracker .editorial-flow-menu-toggle,
.app-shell-toolkit .editorial-flow-menu-toggle {
  border-color: color-mix(in srgb, var(--editorial-paper-bg) 42%, transparent);
  color: var(--editorial-paper-bg);
  background: color-mix(in srgb, var(--editorial-screen-bg) 52%, transparent);
  box-shadow: none;
}

.app-shell-stims .editorial-flow-menu-toggle {
  border-color: color-mix(in srgb, var(--editorial-paper-bg) 42%, transparent);
  color: var(--editorial-paper-bg);
  background: color-mix(in srgb, var(--editorial-screen-bg) 52%, transparent);
  box-shadow: none;
}

.app-shell-tracker .editorial-flow-menu-toggle:hover,
.app-shell-tracker .editorial-flow-menu-toggle:focus-visible,
.app-shell-toolkit .editorial-flow-menu-toggle:hover,
.app-shell-toolkit .editorial-flow-menu-toggle:focus-visible,
.app-shell-stims .editorial-flow-menu-toggle:hover,
.app-shell-stims .editorial-flow-menu-toggle:focus-visible {
  background: color-mix(in srgb, var(--editorial-paper-bg) 14%, transparent);
}

.app-shell-stims .sidebar,
.app-shell-stims .mobile-app-brand,
.app-shell-stims .mobile-toolkit-button {
  display: none;
}

.app-main-stims {
  display: block;
  width: 100%;
  max-width: none;
  min-width: 0;
  min-height: 100vh;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  background: var(--editorial-screen-bg);
}

.app-main-developerHome,
.app-main-developerRecommendationInspector,
.app-main-developerLearningStatus,
.app-main-developerGuidedPreview,
.app-main-developerProductTestingNotes,
.app-main-developerBackupManagement,
.app-main-developerDailyEntryHistory,
.app-main-developerGuidedTour,
.app-main-developerSignOut,
.app-main-developerDangerZone {
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background: var(--editorial-screen-bg);
}

.app-main-tracker .tracker-editorial-shell:not(.editorial-page-shell),
.app-main-toolkit .tracker-editorial-shell:not(.editorial-page-shell) {
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  padding: clamp(18px, 3vw, 36px) 10px;
  justify-items: center;
  background: var(--editorial-screen-bg);
}

.tracker-editorial-page.todays-plan-page:not(.editorial-page-surface) {
  width: min(100%, 840px);
  max-width: 840px;
  min-height: calc(100vh - clamp(36px, 6vw, 72px));
  padding:
    clamp(48px, 5vw, 72px) clamp(52px, 7vw, 88px) clamp(42px, 5vw, 68px);
  border: 0;
  border-radius: 14px;
  background: var(--editorial-paper-bg);
  box-shadow: none;
}

.tracker-page-header.todays-plan-page-header {
  display: block;
  margin-bottom: 74px;
  padding-bottom: 0;
  border-bottom: 0;
}

.tracker-page-header.todays-plan-page-header time,
.tracker-page-header.todays-plan-page-header .editorial-date-in-document {
  margin-top: 0;
}

.tracker-support-sheet-layer .editorial-day-sheet-scrim {
  background: var(--editorial-screen-bg);
}

.tracker-support-sheet.editorial-day-bottom-sheet {
  top: 34px;
  right: auto;
  bottom: 0;
  left: 50%;
  width: min(420px, calc(100% - 36px));
  height: calc(100vh - 34px);
  height: calc(100dvh - 34px);
  max-height: none;
  min-height: auto;
  padding: 48px 28px max(22px, env(safe-area-inset-bottom));
  border: 0;
  border-radius: 0;
  background: var(--editorial-paper-bg);
  box-shadow: none;
  overflow: auto;
  overscroll-behavior: contain;
}

.tracker-support-sheet.editorial-day-bottom-sheet::before {
  display: none;
}

.tracker-support-sheet.editorial-day-bottom-sheet h3 {
  color: var(--editorial-muted);
  font-family: inherit;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.tracker-support-sheet-actions.editorial-day-sheet-actions {
  justify-content: flex-start;
}

.tracker-support-sheet-actions.editorial-day-sheet-actions span {
  margin-left: auto;
}

@media (max-width: 640px) {

  .guided-editorial-screen,
  .weekly-overview-screen:not(.editorial-page-shell),
  .todays-plan-shell:not(.editorial-page-shell),
  .planning-flow:not(.editorial-page-shell),
  .app-main-stims,
  .app-main-settings,
  .app-main-settingsProfile,
  .app-main-settingsRhythms,
  .app-main-settingsVisualComfort,
  .app-main-settingsConnections,
  .app-main-settingsNotifications,
  .app-main-settingsPrivacyData,
  .app-main-settingsPrivacySummary,
  .app-main-settingsTermsSummary,
  .app-main-settingsFeedback,
  .app-main-settingsHelpSupport,
  .app-main-settingsContactSupport,
  .app-main-developerHome,
  .app-main-settingsLegacyControls,
  .app-main-developerRecommendationInspector,
  .app-main-developerLearningStatus,
  .app-main-developerGuidedPreview,
  .app-main-developerProductTestingNotes,
  .app-main-developerBackupManagement,
  .app-main-developerDailyEntryHistory,
  .app-main-settingsVisualComfort,
  .app-main-developerGuidedTour,
  .app-main-developerSignOut,
  .app-main-developerDangerZone {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding: 12px 1px max(40px, env(safe-area-inset-bottom));
    overflow-x: hidden;
    justify-items: center;
  }

  .guided-editorial-screen .todays-plan-page:not(.editorial-page-surface),
  .todays-plan-page:not(.editorial-page-surface),
  .planning-editorial-panel:not(.editorial-page-surface),
  .settings-editorial-shell:not(.editorial-page-shell) {
    width: min(100%, 840px);
    max-width: 840px;
    border-radius: 8px;
    padding: 44px 20px 40px;
  }

  .planning-editorial-panel:not(.editorial-page-surface) {
    margin: 0 auto;
  }
}

@media (max-width: 640px) {

  .app-main-tracker .tracker-editorial-shell:not(.editorial-page-shell),
  .app-main-toolkit .tracker-editorial-shell:not(.editorial-page-shell) {
    padding: 12px 1px;
  }

  .tracker-editorial-page.todays-plan-page:not(.editorial-page-surface) {
    width: min(100%, 840px);
    max-width: 840px;
    border-radius: 8px;
    padding: 44px 20px 40px;
  }

  .developer-editorial-shell:not(.editorial-page-shell) {
    padding: 12px 1px max(40px, env(safe-area-inset-bottom));
    justify-items: center;
  }

  .developer-editorial-shell:not(.editorial-page-shell) .developer-editorial-page.todays-plan-page:not(.editorial-page-surface) {
    width: min(100%, 840px);
    max-width: 840px;
    min-height: auto;
    border-radius: 8px;
    padding: 44px 20px 40px;
  }

  .tracker-page-header.todays-plan-page-header {
    margin-bottom: 72px;
  }

  .tracker-editorial-intro h1 {
    max-width: none;
    font-size: clamp(1.42rem, 9vw, 1.82rem);
    line-height: 1.16;
  }

  .tracker-editorial-intro p {
    font-size: 0.84rem;
  }

  .tracker-editorial-flow {
    margin-top: 32px;
  }

  .app-shell-tracker .editorial-flow-menu,
  .app-shell-toolkit .editorial-flow-menu {
    top: 16px;
    right: 16px;
  }

  .app-main-stims {
    padding: 12px 1px max(40px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 640px) {

  html,
  body,
  #root,
  .app-shell,
  .app-main,
  .guided-editorial-screen,
  .weekly-overview-screen:not(.editorial-page-shell),
  .todays-plan-shell:not(.editorial-page-shell),
  .planning-flow:not(.editorial-page-shell),
  .app-main-stims,
  .app-main-settings,
  .app-main-settingsProfile,
  .app-main-settingsRhythms,
  .app-main-settingsVisualComfort,
  .app-main-settingsNotifications,
  .app-main-settingsPrivacyData,
  .app-main-settingsPrivacySummary,
  .app-main-settingsTermsSummary,
  .app-main-settingsFeedback,
  .app-main-settingsHelpSupport,
  .app-main-settingsContactSupport,
  .app-main-developerHome,
  .app-main-settingsLegacyControls,
  .app-main-developerRecommendationInspector,
  .app-main-developerLearningStatus,
  .app-main-developerGuidedPreview,
  .app-main-developerProductTestingNotes,
  .app-main-developerBackupManagement,
  .app-main-developerDailyEntryHistory,
  .app-main-settingsVisualComfort,
  .app-main-developerGuidedTour,
  .app-main-developerSignOut,
  .app-main-developerDangerZone,
  .app-main-tracker,
  .app-main-toolkit,
  .app-main-tracker .tracker-editorial-shell:not(.editorial-page-shell),
  .app-main-toolkit .tracker-editorial-shell:not(.editorial-page-shell),
  .developer-editorial-shell:not(.editorial-page-shell) {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .app-main-tracker,
  .app-main-toolkit,
  .app-main-stims {
    padding: 0;
  }

  .guided-editorial-screen,
  .weekly-overview-screen:not(.editorial-page-shell),
  .todays-plan-shell:not(.editorial-page-shell),
  .planning-flow:not(.editorial-page-shell),
  .app-main-stims,
  .app-main-settings,
  .app-main-settingsProfile,
  .app-main-settingsRhythms,
  .app-main-settingsVisualComfort,
  .app-main-settingsNotifications,
  .app-main-settingsPrivacyData,
  .app-main-settingsPrivacySummary,
  .app-main-settingsTermsSummary,
  .app-main-settingsFeedback,
  .app-main-settingsHelpSupport,
  .app-main-settingsContactSupport,
  .app-main-developerHome,
  .app-main-settingsLegacyControls,
  .app-main-developerRecommendationInspector,
  .app-main-developerLearningStatus,
  .app-main-developerGuidedPreview,
  .app-main-developerProductTestingNotes,
  .app-main-developerBackupManagement,
  .app-main-developerDailyEntryHistory,
  .app-main-developerGuidedTour,
  .app-main-developerSignOut,
  .app-main-developerDangerZone,
  .app-main-tracker .tracker-editorial-shell:not(.editorial-page-shell),
  .app-main-toolkit .tracker-editorial-shell:not(.editorial-page-shell) {
    padding-right: 1px;
    padding-left: 1px;
  }

  .guided-editorial-screen .todays-plan-page,
  .weekly-overview-screen:not(.editorial-page-shell) .todays-plan-page,
  .todays-plan-shell:not(.editorial-page-shell) .todays-plan-page,
  .planning-flow:not(.editorial-page-shell) .planning-editorial-panel,
  .app-main-settings .settings-editorial-shell:not(.editorial-page-shell),
  .app-main-settingsProfile .settings-editorial-shell,
  .app-main-settingsRhythms .settings-editorial-shell,
  .app-main-settingsConnections .settings-editorial-shell,
  .app-main-settingsNotifications .settings-editorial-shell,
  .app-main-settingsPrivacyData .settings-editorial-shell,
  .app-main-settingsPrivacySummary .settings-editorial-shell,
  .app-main-settingsTermsSummary .settings-editorial-shell,
  .app-main-settingsFeedback .settings-editorial-shell,
  .app-main-settingsHelpSupport .settings-editorial-shell,
  .app-main-settingsContactSupport .settings-editorial-shell,
  .app-main-settingsVisualComfort .settings-editorial-shell,
  .app-main-settingsLegacyControls .settings-editorial-shell,
  .app-main-developerHome .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerRecommendationInspector .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerLearningStatus .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerGuidedPreview .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerProductTestingNotes .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerBackupManagement .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerDailyEntryHistory .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerGuidedTour .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerSignOut .developer-editorial-page:not(.editorial-page-surface),
  .app-main-developerDangerZone .developer-editorial-page:not(.editorial-page-surface),
  .app-main-tracker .tracker-editorial-page.todays-plan-page:not(.editorial-page-surface),
  .app-main-toolkit .tracker-editorial-page.todays-plan-page:not(.editorial-page-surface) {
    box-sizing: border-box;
    width: 100%;
    max-width: 840px;
  }
}

.tracker-editorial-intro p {
  max-width: 34rem;
}

/* EditorialPage keeps shared primitive ownership after legacy route media rules. */
.editorial-page-shell {
  display: grid;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  min-height: 100dvh;
  padding:
    calc(var(--editorial-page-padding-top) + var(--editorial-safe-area-top)) var(--editorial-page-padding-inline) calc(var(--editorial-page-padding-bottom) + var(--editorial-safe-area-bottom));
  border: 0;
  border-radius: 0;
  place-items: start center;
  background: var(--editorial-page-background);
}

.editorial-page-shell>.editorial-page-surface {
  width: min(100%, var(--editorial-shell-max-desktop));
  max-width: var(--editorial-shell-max-desktop);
  padding:
    var(--editorial-surface-padding-block) var(--editorial-surface-padding-inline) var(--editorial-page-padding-bottom);
  background: var(--editorial-surface-background);
}

.editorial-page-shell>.editorial-page-surface-index,
.editorial-page-shell>.editorial-page-surface-utility,
.editorial-page-shell>.editorial-page-surface-action,
.editorial-page-shell>.editorial-page-surface.tracker-editorial-page,
.editorial-page-shell>.editorial-page-surface.toolkit-editorial-page,
.editorial-page-shell>.editorial-page-surface.settings-editorial-page,
.editorial-page-shell>.editorial-page-surface.insights-page,
.editorial-page-shell>.editorial-page-surface.weekly-planner-page,
.editorial-page-shell>.editorial-page-surface.planning-editorial-panel {
  width: min(100%, var(--editorial-shell-max-desktop));
  max-width: var(--editorial-shell-max-desktop);
  padding:
    var(--editorial-surface-padding-block) var(--editorial-surface-padding-inline) max(42px, var(--editorial-page-padding-bottom));
  background: var(--editorial-surface-background);
}

@media (max-width: 1024px) {
  .editorial-shell-surface,
  .editorial-page-surface,
  .editorial-page-shell>.editorial-page-surface,
  .editorial-page-shell>.editorial-page-surface-index,
  .editorial-page-shell>.editorial-page-surface-utility,
  .editorial-page-shell>.editorial-page-surface-action,
  .editorial-page-shell>.editorial-page-surface.tracker-editorial-page,
  .editorial-page-shell>.editorial-page-surface.toolkit-editorial-page,
  .editorial-page-shell>.editorial-page-surface.settings-editorial-page,
  .editorial-page-shell>.editorial-page-surface.insights-page,
  .editorial-page-shell>.editorial-page-surface.weekly-planner-page,
  .editorial-page-shell>.editorial-page-surface.planning-editorial-panel {
    width: min(100%, var(--editorial-shell-max-tablet));
    max-width: var(--editorial-shell-max-tablet);
  }
}

.editorial-page-shell>.editorial-page-surface.tracker-editorial-page,
.editorial-page-shell>.editorial-page-surface-action,
.editorial-page-shell>.editorial-page-surface.toolkit-editorial-page,
.editorial-page-shell>.editorial-page-surface.weekly-planner-page,
.editorial-page-shell>.editorial-page-surface.planning-editorial-panel {
  min-height: calc(100vh - clamp(36px, 6vw, 72px));
  min-height: calc(100dvh - clamp(36px, 6vw, 72px));
}

@media (max-width: 640px) {
  .app-main:has(.editorial-page-shell) {
    padding: 0;
    background: var(--editorial-page-background);
  }

  .editorial-page-shell {
    overflow-x: clip;
    overscroll-behavior-x: none;
    padding:
      var(--editorial-mobile-frame-top) var(--editorial-mobile-frame-inline) var(--editorial-mobile-frame-bottom);
    background: var(--editorial-page-background);
    touch-action: pan-y;
  }

  .editorial-page-shell input[type="range"] {
    touch-action: none;
  }

  .editorial-page-shell>.editorial-page-surface,
  .editorial-page-shell>.editorial-page-surface-index,
  .editorial-page-shell>.editorial-page-surface-utility,
  .editorial-page-shell>.editorial-page-surface-action,
  .editorial-page-shell>.editorial-page-surface.tracker-editorial-page,
  .editorial-page-shell>.editorial-page-surface.toolkit-editorial-page,
  .editorial-page-shell>.editorial-page-surface.settings-editorial-page,
  .editorial-page-shell>.editorial-page-surface.insights-page,
  .editorial-page-shell>.editorial-page-surface.weekly-planner-page,
  .editorial-page-shell>.editorial-page-surface.planning-editorial-panel {
    width: 100%;
    max-width: none;
    min-height: auto;
    padding:
      var(--editorial-mobile-page-padding-top) var(--editorial-mobile-page-padding-inline) var(--editorial-mobile-page-padding-bottom);
    border: 1px solid var(--editorial-surface-border);
    border-radius: var(--editorial-surface-radius-mobile);
    box-shadow: none;
  }

  .editorial-page-shell>.editorial-page-surface.tracker-editorial-page.is-complete {
    display: flex;
    min-height: calc(100vh - var(--editorial-mobile-frame-top) - var(--editorial-mobile-frame-bottom));
    min-height: calc(100dvh - var(--editorial-mobile-frame-top) - var(--editorial-mobile-frame-bottom));
    flex-direction: column;
  }

  .tracker-editorial-page.is-complete .tracker-completion-block {
    margin-top: auto;
  }

  .tracker-editorial-page.is-complete .tracker-editorial-footer {
    margin-top: clamp(24px, 7vw, 32px);
  }

  .editorial-shell-content {
    width: 100%;
    max-width: none;
  }

  .editorial-page-shell>.editorial-page-surface.todays-plan-page.is-adjusting {
    border-left-color: var(--editorial-adjusted-accent);
    border-left-width: 3px;
  }

}

.tracker-mark-option.is-selected {
  color: #1F1D18;
  background: transparent;
  font-weight: 500;
}

.tracker-mark-option.is-selected:hover,
.tracker-mark-option.is-selected:focus-visible {
  background: rgba(196, 169, 106, 0.035);
}

.tracker-browse-supports,
.tracker-browse-supports.text-button {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #6F685E;
  background: transparent;
  box-shadow: none;
  font-size: 0.82rem;
  font-style: normal;
  line-height: 1.35;
  text-decoration: underline;
  text-decoration-color: rgba(111, 104, 94, 0.42);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.tracker-browse-supports:hover,
.tracker-browse-supports:focus-visible,
.tracker-browse-supports.text-button:hover,
.tracker-browse-supports.text-button:focus-visible {
  border: 0;
  color: var(--editorial-hover-ink);
  background: transparent;
  text-decoration-color: var(--editorial-hover-ink);
}

/* Regulate shell theme (redesign phase 1), from design_handoff_login_shell/tokens.css.
   <html data-mode="light|dark|reduced"> is set by ThemeProvider. The tokens are scoped to
   .regulate-shell so names shared with the tokens above (--bg, --font-sans, --text-muted)
   only change inside the new shell, and the existing app keeps its current look.
   Components inside the shell read colors, shadows, and transitions only from these variables. */
.regulate-shell,
[data-mode="light"] .regulate-shell {
  --font-sans: "DM Sans", -apple-system, system-ui, sans-serif;

  /* Surfaces */
  --bg: #F7F1EA;
  --sheet-bg: #FBF6F0;
  --shell-bg: #EFEAE4;
  --shell-border: rgba(138,119,111,0.30);
  --toggle-bg: #E8DECE;
  --toggle-active: #F7F1EA;
  --toggle-shadow: 0 1px 3px rgba(63,48,56,0.10);
  --sheet-shadow: 0 -8px 32px rgba(63,48,56,0.14);
  --scrim: rgba(63,48,56,0.24);
  --divider: rgba(138,119,111,0.13);

  /* Text */
  --text-pri: #3F3038;
  --text-body: #5C4B44;
  --text-sec: #8A776F;
  --text-muted: rgba(138,119,111,0.55);

  /* Accent + controls */
  --accent: #C7775A;
  --on-accent: #FFF4EE;
  --sel-bg: #C7775A;
  --sel-fg: #FFF4EE;
  --sel-wd-fg: rgba(255,244,238,0.82);
  --btn-border: rgba(138,119,111,0.32);
  --step-border: rgba(138,119,111,0.42);
  --chip-bg: rgba(216,161,137,0.24);
  --chip-border: rgba(199,119,90,0.30);
  --chip-fg: #8B4E36;
  --dim-disabled-border: rgba(138,119,111,0.14);
  --dim-disabled-fg: rgba(138,119,111,0.26);
  --fill-edge: inset 0 1.5px 0 rgba(138,119,111,0.26);
  --fill-edge-h: inset -1.5px 0 0 rgba(138,119,111,0.22);
  --fill-transition: all 0.26s cubic-bezier(0.34,1.2,0.64,1);

  /* Energy levels 0–4 (fill + text on fill) */
  --lvl-0: #D9CCBE; --lvl-0-text: #4E4238;
  --lvl-1: #E0BFAA; --lvl-1-text: #4A3A31;
  --lvl-2: #DA9F82; --lvl-2-text: #3B2E27;
  --lvl-3: #C7775A; --lvl-3-text: #FFF4EE;
  --lvl-4: #A9573C; --lvl-4-text: #FFF4EE;

  /* Status pills */
  --status-predicted-bg: rgba(199,119,90,0.10); --status-predicted-fg: #B0644A;
  --status-confirmed-bg: rgba(138,119,111,0.12); --status-confirmed-fg: #7C6A62;
  --status-adjusted-bg: rgba(207,165,92,0.18);  --status-adjusted-fg: #8A6A2E;

  /* Apple button (must follow Apple HIG styles) */
  --apple-btn-bg: #000000;
  --apple-btn-fg: #FFFFFF;

  /* Google button (Google's official Light theme) */
  --google-btn-bg: #FFFFFF;
  --google-btn-border: #747775;
  --google-btn-fg: #1F1F1F;
}

[data-mode="dark"] .regulate-shell {
  --bg: #241C20;
  --sheet-bg: #2C2327;
  --shell-bg: #342A2E;
  --shell-border: rgba(231,201,181,0.22);
  --toggle-bg: #372C31;
  --toggle-active: #4A3B41;
  --toggle-shadow: none;
  --sheet-shadow: 0 -8px 32px rgba(12,8,10,0.5);
  --scrim: rgba(12,8,10,0.5);
  --divider: rgba(231,201,181,0.13);

  --text-pri: #F6EDE6;
  --text-body: #D6C4BA;
  --text-sec: #A6918A;
  --text-muted: rgba(166,145,138,0.6);

  --accent: #C7775A;
  --on-accent: #FFF4EE;
  --sel-bg: #C7775A;
  --sel-fg: #FFF4EE;
  --sel-wd-fg: rgba(255,244,238,0.82);
  --btn-border: rgba(231,201,181,0.26);
  --step-border: rgba(231,201,181,0.34);
  --chip-bg: rgba(216,161,137,0.16);
  --chip-border: rgba(216,161,137,0.34);
  --chip-fg: #E7C9B5;
  --dim-disabled-border: rgba(231,201,181,0.12);
  --dim-disabled-fg: rgba(231,201,181,0.22);
  --fill-edge: inset 0 1.5px 0 rgba(231,201,181,0.20);
  --fill-edge-h: inset -1.5px 0 0 rgba(231,201,181,0.18);
  --fill-transition: all 0.26s cubic-bezier(0.34,1.2,0.64,1);

  --lvl-0: #4A3C41; --lvl-0-text: #B5A29A;
  --lvl-1: #61483F; --lvl-1-text: #DCC7BC;
  --lvl-2: #835A49; --lvl-2-text: #F6EAE2;
  --lvl-3: #AC7458; --lvl-3-text: #2A2024;
  --lvl-4: #D8A189; --lvl-4-text: #2A2024;

  --status-predicted-bg: rgba(199,119,90,0.20); --status-predicted-fg: #E0A186;
  --status-confirmed-bg: rgba(231,201,181,0.12); --status-confirmed-fg: #C3AFA6;
  --status-adjusted-bg: rgba(207,165,92,0.20);  --status-adjusted-fg: #D8B677;

  --apple-btn-bg: #FFFFFF;
  --apple-btn-fg: #000000;

  --google-btn-bg: #131314;
  --google-btn-border: #8E918F;
  --google-btn-fg: #E3E3E3;
}

[data-mode="reduced"] .regulate-shell {
  --bg: #F3F0EB;
  --sheet-bg: #F6F3EF;
  --shell-bg: #EDEAE6;
  --shell-border: rgba(120,110,105,0.26);
  --toggle-bg: #E9E5E0;
  --toggle-active: #F3F0EB;
  --toggle-shadow: none;
  --sheet-shadow: none;
  --scrim: rgba(74,67,64,0.14);
  --divider: rgba(120,110,105,0.14);

  --text-pri: #4A4340;
  --text-body: #5F5854;
  --text-sec: #8B837E;
  --text-muted: rgba(139,131,126,0.55);

  --accent: #A8887C;
  --on-accent: #F8F5F2;
  --sel-bg: #DCD4CD;
  --sel-fg: #4A4340;
  --sel-wd-fg: rgba(74,67,64,0.6);
  --btn-border: rgba(120,110,105,0.24);
  --step-border: rgba(120,110,105,0.30);
  --chip-bg: rgba(200,180,169,0.20);
  --chip-border: rgba(150,130,120,0.28);
  --chip-fg: #6B5C55;
  --dim-disabled-border: rgba(120,110,105,0.12);
  --dim-disabled-fg: rgba(120,110,105,0.24);
  --fill-edge: inset 0 1px 0 rgba(120,110,105,0.18);
  --fill-edge-h: inset -1px 0 0 rgba(120,110,105,0.16);
  --fill-transition: none;

  --lvl-0: #DBD5CE; --lvl-0-text: #5A534E;
  --lvl-1: #D3C6BC; --lvl-1-text: #4E4642;
  --lvl-2: #C6B2A5; --lvl-2-text: #413A36;
  --lvl-3: #B2937F; --lvl-3-text: #FBF7F4;
  --lvl-4: #96725E; --lvl-4-text: #FBF7F4;

  --status-predicted-bg: rgba(168,136,124,0.14); --status-predicted-fg: #7E6A62;
  --status-confirmed-bg: rgba(120,110,105,0.12); --status-confirmed-fg: #7A716C;
  --status-adjusted-bg: rgba(168,136,124,0.18);  --status-adjusted-fg: #6B5C55;

  --apple-btn-bg: #000000;
  --apple-btn-fg: #FFFFFF;

  --google-btn-bg: #FFFFFF;
  --google-btn-border: #747775;
  --google-btn-fg: #1F1F1F;
}

/* Reduced mode also disables all motion */
[data-mode="reduced"] .regulate-shell,
[data-mode="reduced"] .regulate-shell *,
[data-mode="reduced"] .regulate-shell *::before,
[data-mode="reduced"] .regulate-shell *::after {
  transition: none !important;
  animation: none !important;
}

.regulate-shell {
  font-family: var(--font-sans);
  color: var(--text-pri);
}

.auth-shell-screen {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 0 45px;
  background: var(--bg);
}

/* Login (design_handoff_login_shell, "Screen: Login"). Sizes are in em against a 17px base so
   text follows iOS Dynamic Type through -apple-system-body; the page scrolls if the hero overflows. */
.login-screen {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  padding: env(safe-area-inset-top) 45px calc(env(safe-area-inset-bottom) + 51px);
  background: var(--bg);
  font-size: 17px;
}

@supports (font: -apple-system-body) {
  .login-screen {
    font: -apple-system-body;
    font-family: var(--font-sans);
  }
}

.login-hero {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 51px;
  padding: 24px 0;
  text-align: center;
}

.login-screen:not([data-step="main"]) .login-hero {
  gap: 32px;
}

/* On the email and code steps, the battery steps aside only while the native keyboard is open
   (data-keyboard is set from @capacitor/keyboard events; it is never set in the browser). */
.login-screen[data-keyboard="open"]:not([data-step="main"]) .login-battery {
  display: none;
}

.login-battery {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.login-battery-cap {
  display: block;
  width: 33px;
  height: 10.5px;
  margin-bottom: -1.5px;
  border-radius: 4.5px 4.5px 0 0;
  background: var(--shell-border);
}

.login-battery-body {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: 111px;
  height: 198px;
  overflow: hidden;
  border: 2px solid var(--shell-border);
  border-radius: 30px;
  background: var(--shell-bg);
}

.login-battery-fill {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 58%;
  border-radius: 0 0 27px 27px;
  background: var(--accent);
  opacity: 0.92;
}

.login-screen[data-loading="true"] .login-battery-fill {
  animation: login-battery-pulse 1.6s ease-in-out infinite alternate;
}

@keyframes login-battery-pulse {
  from { opacity: 0.92; }
  to { opacity: 0.6; }
}

.login-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 21px;
}

.login-wordmark {
  /* The negative margin balances the trailing letter-spacing so the word sits centered. */
  margin: 0 -0.34em 0 0;
  color: var(--text-pri);
  font-size: 1.0588em;
  font-weight: 700;
  letter-spacing: 0.34em;
  text-transform: uppercase;
}

.login-statement {
  display: flex;
  flex-direction: column;
  gap: 15px;
  text-wrap: pretty;
}

.login-lead {
  margin: 0;
  color: var(--text-pri);
  font-size: 1.5em;
  font-weight: 500;
  line-height: 1.4;
}

.login-sub {
  margin: 0;
  color: var(--text-sec);
  font-size: 1.1029em;
  line-height: 1.45;
}

.login-actions {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
}

.login-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-sizing: border-box;
  min-height: 50px;
  padding: 0 20px;
  border: 2px solid transparent;
  border-radius: 24px;
  font: inherit;
  font-size: 1em;
  font-weight: 600;
  cursor: pointer;
  transition: transform 120ms ease, opacity 120ms ease;
  -webkit-tap-highlight-color: transparent;
}

.login-button:active:not(:disabled) {
  transform: scale(0.98);
  opacity: 0.85;
}

[data-mode="reduced"] .login-button:active:not(:disabled) {
  transform: none;
}

.login-button:disabled {
  cursor: default;
}

.login-button:disabled:not([aria-busy="true"]) {
  opacity: 0.55;
}

.login-button:focus-visible,
.login-link:focus-visible,
.login-legal a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

/* Apple HIG: black, white, or white-outlined only. The tokens flip it for dark mode. */
.login-button-apple {
  border-color: var(--apple-btn-bg);
  background: var(--apple-btn-bg);
  color: var(--apple-btn-fg);
}

/* Google's official button themes (colours from the tokens) and iOS spacing:
   16px before the logo, 12px between logo and label, 16px after the label. */
.login-button-google {
  gap: 12px;
  padding: 0 16px;
  border: 1px solid var(--google-btn-border);
  background: var(--google-btn-bg);
  color: var(--google-btn-fg);
}

.login-google-mark {
  display: block;
  flex: none;
  width: 20px;
  height: 20px;
}

.login-button-accent {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--on-accent);
}

.login-button-icon {
  flex: none;
  width: 1.1em;
  height: 1.1em;
}

.login-spinner {
  display: inline-block;
  box-sizing: border-box;
  width: 18px;
  height: 18px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: login-spin 0.8s linear infinite;
}

@keyframes login-spin {
  to { transform: rotate(360deg); }
}

.login-message {
  margin: 0;
  color: var(--text-body);
  font-size: 0.8235em;
  line-height: 1.4;
  text-align: center;
  text-wrap: pretty;
}

.login-note {
  margin: 0;
  color: var(--text-sec);
  font-size: 0.8824em;
  line-height: 1.45;
  text-align: center;
  overflow-wrap: anywhere;
}

.login-link {
  align-self: center;
  min-height: 44px;
  padding: 0 12px;
  border: 0;
  background: none;
  color: var(--text-sec);
  font: inherit;
  font-size: 0.8824em;
  font-weight: 500;
  cursor: pointer;
}

.login-link:disabled {
  color: var(--text-muted);
  cursor: default;
}

.login-legal {
  margin: 0;
  color: var(--text-sec);
  font-size: 0.7647em;
  line-height: 1.45;
  text-align: center;
  text-wrap: pretty;
}

.login-legal a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.login-field {
  box-sizing: border-box;
  width: 100%;
  min-height: 50px;
  padding: 0 18px;
  border: 2px solid var(--btn-border);
  border-radius: 16px;
  background: var(--sheet-bg);
  color: var(--text-pri);
  font: inherit;
  font-size: 1em;
  appearance: none;
}

.login-field::placeholder {
  color: var(--text-muted);
}

.login-field:focus {
  border-color: var(--accent);
  outline: none;
}

.login-code-field {
  font-size: 1.25em;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.4em;
  text-align: center;
}

.login-verifying {
  display: flex;
  justify-content: center;
  margin: 0;
  color: var(--text-sec);
}

.login-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Temporary dev-only mode switcher (ThemeModeSwitcher). */
.theme-mode-switcher {
  position: fixed;
  left: 12px;
  bottom: calc(env(safe-area-inset-bottom) + 12px);
  z-index: 10000;
  display: flex;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: var(--toggle-bg);
  box-shadow: var(--toggle-shadow);
}

.theme-mode-switcher button {
  min-height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--text-sec);
  font: 600 13px var(--font-sans);
  text-transform: capitalize;
  cursor: pointer;
}

.theme-mode-switcher button[aria-pressed="true"] {
  background: var(--toggle-active);
  color: var(--text-pri);
}