:root {
  font-size: 16px;
  font-weight: 570;
  text-rendering: optimizeLegibility;
  font-optical-sizing: auto;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-weight: 570;
  letter-spacing: -.08px;
}

h1 { letter-spacing: -.025em; line-height: 1.08; }
h2 { letter-spacing: -.018em; line-height: 1.15; }
h3 { letter-spacing: -.012em; line-height: 1.22; }
p, small, input, select, textarea { letter-spacing: 0; }
.eyebrow { letter-spacing: .018em; line-height: 1.35; }

h1, h2, h3, b, strong, .brand, .card-body h3 {
  font-weight: 750;
}

h1, h2, h3, .card-body h3, .profile-card h2 {
  text-shadow: 0 1px 0 #0005, 0 5px 18px #0002;
}

button, input, select, textarea {
  font-weight: 620;
}

.brand { font-size: 17px; }
.demo-label, .topbar-label { font-size: 12px; font-weight: 700; }
.eyebrow, .reference-shell .heading .eyebrow { font-size: 14px; font-weight: 720; }
.heading-sub { font-size: 15px; line-height: 1.65; }
.reference-shell h1 { font-size: 42px; font-weight: 780; }
.section-title h2 { font-size: 21px; font-weight: 760; }
.section-title > .muted { font-size: 13px; line-height: 1.45; }

.primary, .soft-button { font-size: 14px; font-weight: 740; }
.text-button { font-size: 14px; font-weight: 700; }
.quick-tile { font-size: 13px; font-weight: 720; }
.home-caption { font-size: 13px; font-weight: 680; }
.home-caption .text-button { font-size: 13px; }

.reference-shell .card-body h3 { font-size: 25px; font-weight: 760; }
.reference-shell .card-body p { font-size: 18px; font-weight: 720; }
.card-foot { font-size: 11px; font-weight: 700; }
.starter-card h3 { font-size: 23px; font-weight: 760; }
.starter-card p, .empty h3 { font-size: 14px; }
.empty p { font-size: 13px; line-height: 1.65; }

.mobile-nav > button { font-size: 14px; font-weight: 750; }
.page-footer { font-size: 10px; font-weight: 720; }
.segmented button { font-size: 14px; font-weight: 700; }
.toolbar > .text-button { font-size: 13px; }

.task-row b, .meal-row b { font-size: 15px; font-weight: 700; }
.task-row small, .meal-row small, .alarm-info small { font-size: 12px; line-height: 1.55; }
.alarm-info strong { font-size: 29px; font-weight: 650; }
.timer-card small { font-size: 13px; }
.timer-card b { font-size: 29px; font-weight: 700; }
.reminders > p, .meal-section > p { font-size: 14px; }
.meal-section h3 { font-size: 17px; }

.nutrition-summary h2 { font-size: 20px; }
.nutrition-total strong { font-weight: 700; }
.nutrition-summary > p, .macros small { font-size: 13px; }
.macros b { font-size: 22px; font-weight: 720; }
.macros b span { font-size: 12px; }

.together-banner h2 { font-size: 24px; }
.together-banner p { font-size: 14px; line-height: 1.75; }
.leader-me b { font-size: 17px; }
.leader-me small { font-size: 13px; line-height: 1.5; }
.leader-row > b { font-size: 15px; }
.leader-streak, .rank { font-size: 14px; font-weight: 720; }

.ai-provider > h2 { font-size: 27px; }
.ai-provider > p, .info-note p { font-size: 14px; line-height: 1.75; }
.status-pill { font-size: 11px; font-weight: 720; }
.ai-placeholder { font-size: 13px; }
.reset-row b { font-size: 14px; }
.reset-row small { font-size: 13px; }
.reset-row span { font-size: 11px; }
.info-note h3 { font-size: 17px; }

.profile-card h2 { font-size: 26px; }
.profile-card > p { font-size: 14px; }
.profile-stats b { font-size: 30px; font-weight: 730; }
.profile-stats small, .privacy-note { font-size: 12px; }
.settings-panel > h3 { font-size: 18px; }
.theme-option > span { font-size: 13px; font-weight: 700; }
.setting-label { font-size: 14px; font-weight: 700; }
.switch-field b { font-size: 14px; }
.switch-field small { font-size: 12px; line-height: 1.55; }

.field > span { font-size: 13px; font-weight: 680; }
.field input, .field select, .field textarea { font-size: 15px; font-weight: 620; }
.help, .muted { font-size: 13px; }
.help { line-height: 1.7; }
.modal-head h2 { font-size: 24px; font-weight: 780; }
dialog form > h3 { font-size: 17px; }
.setting-inline small { font-size: 12px; font-weight: 700; }
.habit-icon-picker small { font-size: 10px; font-weight: 680; }
.days-picker span { font-size: 13px; font-weight: 720; }
.template-grid b { font-size: 15px; font-weight: 730; }
.template-grid small { font-size: 12px; }

.habit-detail > p { font-size: 15px; line-height: 1.65; }
.habit-detail .detail-stats b { font-weight: 760; }
.habit-detail .detail-stats span { font-size: 13px; font-weight: 650; }
.habit-detail .calendar-header b { font-size: 20px; font-weight: 760; }
.calendar small { font-size: 12px; font-weight: 700; }
.calendar button { font-weight: 700; }
.members-list b { font-size: 15px; font-weight: 720; }
.members-list small, .shared-total { font-size: 12px; line-height: 1.5; }
.members-list strong { font-size: 14px; font-weight: 740; }

#toast { font-size: 14px; font-weight: 720; }

:root[data-theme="light"] h1,
:root[data-theme="light"] h2,
:root[data-theme="light"] h3,
:root[data-theme="light"] .card-body h3,
:root[data-theme="light"] .profile-card h2 {
  text-shadow: 0 1px 0 #fff, 0 4px 16px #26331814;
}

@media (max-width: 700px) {
  :root { font-size: 16px; }
  .brand { font-size: 15px; }
  .reference-shell h1 { font-size: 36px; }
  .reference-shell .heading .eyebrow { font-size: 12px; }
  .reference-shell .card-body h3 { font-size: 21px; }
  .reference-shell .card-body p { font-size: 15px; }
  .home-caption, .home-caption .text-button { font-size: 12px; }
  .quick-tile { font-size: 12px; }
  .mobile-nav > button { font-size: 13px; }
  .section-title h2 { font-size: 19px; }
  .section-title > .muted { font-size: 11px; }
  .primary, .soft-button, .text-button { font-size: 13px; }
  .segmented button { font-size: 12px; }
  .field > span { font-size: 12px; }
  .field input, .field select, .field textarea { font-size: 15px; }
  .settings-panel .field input, .settings-panel .field select { font-size: 14px; }
  .switch-field b { font-size: 13px; }
  .switch-field small { font-size: 11px; }
  .theme-option > span { font-size: 12px; }
  .modal-head h2 { font-size: 22px; }
  .habit-detail .members-list b { font-size: 16px; }
  .habit-detail .members-list small { font-size: 12px; }
  .page-footer { font-size: 9px; }
}

@media (max-width: 370px) {
  .reference-shell h1 { font-size: 32px; }
  .reference-shell .card-body h3 { font-size: 19px; }
  .reference-shell .card-body p { font-size: 14px; }
  .mobile-nav > button { font-size: 12px; }
}