/* Morning mint: a calm, readable layer over the preserved V2 layout. */
:root {
  color-scheme: light;
  --bg: #f4f8f4;
  --sidebar: #fffefa;
  --panel: #ffffff;
  --panel2: #f5faf6;
  --line: #dde9e1;
  --text: #17352f;
  --muted: #637a70;
  --mint: #16765b;
  --accent: #d7f4d4;
  --cyan: #317f91;
  --gold: #c48130;
  --coral: #b7574b;
  --violet: #7665a6;
  --shadow: 0 20px 55px rgba(36, 83, 63, .10);
}
html { scroll-padding-top: 28px; }
body {
  background: radial-gradient(circle at 83% 0%, #e7f7e8 0, transparent 27rem),
              linear-gradient(160deg, #f8faf4 0%, #f1f8f5 68%, #f8faf4 100%);
  font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .005em;
}
h1, h2, h3, .logo-title { font-family: "Trebuchet MS", "PingFang SC", "Microsoft YaHei", sans-serif; }
a { text-underline-offset: 3px; }
button, input, select, textarea { touch-action: manipulation; }
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 3px solid #77c8a5;
  outline-offset: 3px;
}

/* The navigation reads like a quiet index, with a strong current location. */
.sidebar { box-shadow: 7px 0 30px rgba(40, 87, 63, .035); }
.logo { padding-bottom: 6px; }
.logo-mark, .growth-auth-logo {
  background: #c7f4b2;
  color: #174b36;
  box-shadow: 0 5px 16px rgba(27, 122, 77, .15);
}
.logo-title { color: #173a31; }
.sidebar-group { color: #71877b; }
.nav-btn { min-height: 44px; color: #526c60; transition: background .18s, color .18s, transform .18s; }
.nav-btn:hover { background: #eff8ef; color: #176448; transform: translateX(2px); }
.nav-btn.active, .nav-btn.active:hover {
  background: #def3e4;
  color: #115c43;
  box-shadow: inset 3px 0 #188365;
}
.sidebar-bottom {
  border-color: #d4e9d9;
  background: linear-gradient(140deg, #e4f7dc, #e9f7f3 78%);
}
.sidebar-bottom strong, .sidebar-bottom p { color: #285b46; }
.mini-progress { background: #c7dfcf; }
.mini-progress > span { background: #2a9a68; }

/* Page hierarchy, action buttons and daily overview. */
.main { max-width: 1540px; padding-top: 26px; }
.topbar { border-bottom-color: #d9e7dd; }
.crumb b { color: #255446; }
.dateclock { color: #6b8275; }
.top-actions { justify-content: flex-end; }
.btn {
  min-height: 40px;
  border-color: #d4e4d9;
  background: #fff;
  color: #295b49;
  box-shadow: 0 1px 2px rgba(32, 86, 57, .035);
  transition: background .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.btn:hover { filter: none; background: #ecf7ef; border-color: #a7d4b7; transform: translateY(-1px); }
.btn.primary {
  background: #16765b;
  border-color: #16765b;
  color: #fff;
  box-shadow: 0 7px 18px rgba(22, 118, 91, .16);
}
.btn.primary:hover { background: #0e614a; border-color: #0e614a; }
.btn.ghost { color: #517165; border-color: #d4e4d9; background: transparent; }
.btn.danger { color: #a64237; border-color: #f0c5bc; background: #fff1ee; }
.btn.small { min-height: 34px; }
.eyebrow { color: #277f5e; }
.page-title { margin-top: 28px; }
.page-title h1 { color: #173b31; }
.day-chip { background: #e1f4e5; color: #206d4d; border: 1px solid #cce9d3; }
.hero { gap: 16px; }
.hero-main {
  background: radial-gradient(circle at 88% 5%, rgba(255,255,255,.75), transparent 30%),
              linear-gradient(122deg, #d9f5d2 0%, #e8f7e9 57%, #d9f0ed 100%);
  border-color: #c8e9d2;
  box-shadow: 0 12px 35px rgba(63, 139, 91, .075);
}
.hero-main:after { color: rgba(33, 126, 82, .065); }
.hero-main h2 { color: #164636; }
.hero-main p { color: #436f58; }
.hero-pills span { background: rgba(255,255,255,.73); border-color: #c4dfcb; color: #2f694b; }
.hero-score, .metric, .card, .phase {
  box-shadow: 0 3px 20px rgba(45, 93, 67, .045);
}
.ring { background: conic-gradient(#249468 var(--pct), #e2f1e7 0); }
.ring-inner { background: #fff; }
.metric { border-radius: 18px; }
.metric .value { color: #184d3c; font-variant-numeric: tabular-nums; }
.metric .hint { color: #638c73; }
.card { border-radius: 20px; }
.card-head h2, .section-heading h2 { color: #20483a; }

/* A clear path through dates, tasks and progress. */
.date-steps button, .calendar-head button {
  min-width: 36px; min-height: 36px;
  border-color: #d1e4d8; background: #f7fbf7; color: #356b54;
}
.date-steps button:hover, .calendar-head button:hover { background: #e6f5e9; }
.date-steps input { min-height: 36px; border-color: #d1e4d8; background: #fff; color: #2d604d; }
.event-time { color: #647f71; }
.timeline-dot:before { border-left-color: #d7e8dc; }
.timeline-dot:after { background: #a9c5b5; border-color: #fff; }
.event-card { background: #fbfdfa; border-color: #e0eae1; }
.event-card:hover { border-color: #aed5ba; }
.event-card.completed { opacity: .72; }
.event-check { width: 22px; height: 22px; border-color: #93b4a0; background: #fff; }
.event-check:checked { background: #258d68; border-color: #258d68; }
.event-check:checked:after { color: #fff; top: -2px; left: 4px; }
.event-circle { color: #8aa89a; }
.event-title { color: #214337; }
.event-desc { color: #697f74; }
.tag { background: #eef3ee; color: #587062; }
.tag.专业 { background: #e4f4f6; color: #247185; }
.tag.求职 { background: #eeeafa; color: #69569a; }
.tag.英语 { background: #e8effa; color: #456ca5; }
.tag.运动 { background: #e3f4e6; color: #267249; }
.tag.交易, .tag.复盘 { background: #fff0dd; color: #946221; }
.tag.生活 { background: #edf1f1; color: #597371; }
.icon-btn { min-width: 32px; min-height: 32px; color: #698478; }
.icon-btn:hover { background: #e6f2e9; color: #1e7655; }
.focus-card { background: linear-gradient(145deg, #e8f6e9, #f2faf4); border-color: #d0e8d4; }
.focus-card p { color: #4b745d; }
.stat-line { border-bottom-color: #e1ebe3; }
.bar, .chartbar, .cal-day .mini { background: #e4eee7; }
.bar span, .chartbar > span, .cal-day .mini span { background: #37a071; }
.quick-row, .routine { background: #fbfdfa; border-color: #dfeae2; }
.quick-icon { background: #e3f4e7; }
.nudge { background: #f5f7e9; border-color: #e3e8c5; color: #657238; }
.phase.active { background: #e9f7e9; border-color: #79bf8f; }
.select, .field {
  min-height: 42px; border-color: #cbded2; background: #fff; color: #1f4638;
}
.field::placeholder, textarea::placeholder { color: #82988a; }
.field-row label, .checkbox-label { color: #416656; }
.calendar-head button { padding: 7px 12px; }
.cal-dow { color: #698276; }
.cal-day { background: #fff; border-color: #dce9df; }
.cal-day:hover { border-color: #9dcbb0; background: #f8fcf8; }
.cal-day.selected { background: #e4f5e8; border-color: #298563; }
.cal-day .sport { color: #607b6c; }
.data-table th { color: #5c7968; }
.data-table td { border-bottom-color: #e4eee5; }
.data-table tr:hover td { background: #f4faf5; }
.empty { color: #607b6a; border-color: #bcd7c5; background: #fbfdfa; }
.empty strong { color: #2e5a43; }
.entry, .workout-item { border-bottom-color: #e2ede4; }
.workout-item small { color: #6b8376; }
.pill { border-color: #d8e6db; background: #f8fbf8; color: #537261; }
.pill.active { background: #dff2e2; border-color: #8bc9a0; color: #176346; }
.toast { background: #1b7755; color: #fff; box-shadow: 0 14px 35px rgba(21, 83, 60, .22); }
.dialog-backdrop { background: rgba(28, 57, 45, .35); }
.dialog { background: #fff; border-color: #d5e5d9; }
.notice { border-color: #eed8af; background: #fff8e8; color: #805c25; }
.footer { color: #789184; }
details summary { color: #2d5846; }
.day-links button { min-height: 44px; background: #f8fbf8; border-color: #dce9df; color: #587669; }
.day-links button.active { background: #e0f3e5; border-color: #7fbd94; color: #176546; }
.exercise-guide summary { min-height: 56px; }
.exercise-guide summary:hover .exercise-title { color: #136e51; }
.exercise-toggle { background: #f2f9f3; }
.exercise-explainer { border-color: #cfe6d6; background: linear-gradient(130deg, #f0f9ed, #f3faf8); }
.exercise-explainer strong { color: #16765b; }
.exercise-reference a { color: #16765b; }

/* Authentication and cloud-state messages use the same palette. */
.growth-auth {
  background: radial-gradient(circle at 15% 15%, #daf4d8 0, transparent 29%),
              radial-gradient(circle at 86% 81%, #dff3f1 0, transparent 33%), #f5faf5;
}
.growth-auth-card { border-color: #d5e8da; background: #fff; box-shadow: 0 25px 75px rgba(43, 98, 64, .13); }
.growth-auth-card h1 { color: #194634; }
.growth-auth-accent { color: #4d9e6b; }
.growth-auth-card p, #auth-message { color: #627b6e; }
.growth-auth-field { color: #315d47; }
.growth-auth-field input { border-color: #cbded2; background: #fff; color: #1f4638; }
.growth-auth-field input:focus { outline-color: #77c8a5; }
.growth-auth-submit { background: #16765b; color: #fff; }
.growth-auth-submit:hover { background: #0e614a; }
.growth-auth-switch { color: #146d51; }
#auth-message[data-kind=error] { color: #a64237; }
#auth-message[data-kind=ok] { color: #16765b; }
.growth-auth-note { border-top-color: #e0ebe3; }
.growth-sync { color: #607b6a; }
.growth-sync strong { color: #16765b; }
.growth-sync strong[data-kind=error] { color: #a64237; }
.growth-conflict { border-color: #eed8af; background: #fff8e8; color: #805c25; }
.growth-conflict p { color: #805c25; }

@media (max-width: 850px) {
  .main { padding-top: 16px; }
  .bottom-nav {
    background: rgba(255, 254, 250, .97);
    border-top-color: #d4e6da;
    box-shadow: 0 -9px 28px rgba(38, 92, 58, .09);
  }
  .bottom-nav button { min-height: 50px; color: #668174; }
  .bottom-nav button.active { color: #137758; font-weight: 800; }
}
@media (max-width: 560px) {
  body { font-size: 14px; }
  .main { padding: 13px 13px 104px; }
  .topbar { align-items: flex-start; flex-direction: column; gap: 11px; }
  .top-actions { width: 100%; justify-content: space-between; gap: 6px; }
  .top-actions .btn { min-height: 40px; padding: 8px 10px; font-size: 12px; }
  #quick-add { flex: 1; }
  .growth-sync { justify-content: flex-end; width: auto; flex: 0 1 auto; }
  #cloud-status { font-size: 11px; }
  #growth-signout { padding: 7px 9px; }
  .page-title { margin-bottom: 17px; }
  .hero { gap: 10px; }
  .hero-main { min-height: 190px; padding: 23px; }
  .hero-main:after { font-size: 190px; bottom: -80px; }
  .hero-main h2 { font-size: 25px; }
  .hero-score { min-height: 128px; }
  .metrics { gap: 8px; }
  .metric { padding: 14px; }
  .metric .label { font-size: 11px; }
  .metric .hint { font-size: 11px; }
  .card { padding: 17px; }
  .date-steps button { min-width: 36px; }
  .date-steps input { max-width: 125px; }
  .event-card { padding: 11px; }
  .event-title { font-size: 13px; }
  .cal-day { min-height: 76px; }
  #page-fitness .grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  #page-fitness .grid3 > :last-child { grid-column: 1 / -1; }
  #page-fitness .grid3 .card { padding: 14px; }
  .growth-auth-card { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .nav-btn, .btn { transition: none; }
}