:root,
html[data-theme="blush"],
body[data-theme="blush"] {
  --bg: #ead8d1;
  --bg-deep: #dfc6bc;
  --page-top: #fbf2ee;
  --surface: #fff9f6;
  --surface-2: #e4c9bf;
  --surface-3: #d2b2a5;
  --ink: #432f2a;
  --muted: #7a625a;
  --brand: #a26b5e;
  --brand-deep: #603d35;
  --accent: #d2b2a5;
  --accent-soft: #f0d9d1;
  --sage: #96a095;
  --danger: #994e52;
  --ok: #637969;
  --gold: #af8058;
  --line: rgba(67, 47, 42, 0.14);
  --shadow: 0 20px 50px rgba(77, 48, 41, 0.16);
  --shadow-soft: 0 10px 30px rgba(77, 48, 41, 0.09);
  --radius: 26px;
  --hero-start: #d2b2a5;
  --hero-end: #ad7669;
  --hero-ink: #35231f;
  --orb: rgba(210, 178, 165, .70);
  --secondary-orb: rgba(150, 160, 149, .22);
  --summary-1a: #efd1c7;
  --summary-1b: #dfb8aa;
  --summary-2a: #f8ebe5;
  --summary-2b: #ead5cb;
  --summary-3a: #dde2da;
  --summary-3b: #cbd3c8;
  --warning-bg: #f3ddd4;
  --warning-text: #7a473a;
  --status-bg: #dfe6dc;
  --status-text: #4f6353;
  --field-bg: #fffdfb;
  --day-bg: #fff9f6;
  --today-bg: #dfe5dc;
  --pill-bg: #f4e5df;
  --profile-end: #f8ebe5;
  --font-display: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --font-ui: "Avenir Next", Avenir, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-theme="rose"],
body[data-theme="rose"] {
  --bg: #ead5d9;
  --bg-deep: #dab9c0;
  --page-top: #fff2f4;
  --surface: #fff8f9;
  --surface-2: #e6c1c7;
  --surface-3: #c98f98;
  --ink: #442c32;
  --muted: #7e5c65;
  --brand: #aa6471;
  --brand-deep: #653945;
  --accent: #c98f98;
  --accent-soft: #f1d4da;
  --hero-start: #d9a8b0;
  --hero-end: #a85f6d;
  --hero-ink: #321e24;
  --orb: rgba(201, 143, 152, .72);
  --secondary-orb: rgba(162, 139, 151, .22);
  --summary-1a: #f0cbd1;
  --summary-1b: #ddaab3;
  --summary-2a: #f9e7ea;
  --summary-2b: #e9cfd4;
  --summary-3a: #e4dde0;
  --summary-3b: #d3c5ca;
  --warning-bg: #f1d5d9;
  --warning-text: #7f3f4b;
  --status-bg: #e3dfe2;
  --status-text: #65545a;
  --field-bg: #fffafb;
  --day-bg: #fff8f9;
  --today-bg: #eadde1;
  --pill-bg: #f5e0e4;
  --profile-end: #f8e5e8;
}

html[data-theme="mocha"],
body[data-theme="mocha"] {
  --bg: #e4d5c8;
  --bg-deep: #d2baa7;
  --page-top: #fbf3eb;
  --surface: #fffaf4;
  --surface-2: #dcc7b5;
  --surface-3: #b59680;
  --ink: #3f3128;
  --muted: #746358;
  --brand: #8d6957;
  --brand-deep: #563e32;
  --accent: #b59680;
  --accent-soft: #ead9cb;
  --hero-start: #c9aa94;
  --hero-end: #886353;
  --hero-ink: #2e211b;
  --orb: rgba(181, 150, 128, .70);
  --secondary-orb: rgba(146, 151, 133, .20);
  --summary-1a: #ead2c0;
  --summary-1b: #d4b39c;
  --summary-2a: #f5e9df;
  --summary-2b: #e1d0c1;
  --summary-3a: #dedfd5;
  --summary-3b: #c7cabd;
  --warning-bg: #eeddd0;
  --warning-text: #714b37;
  --status-bg: #e0e2d7;
  --status-text: #56604e;
  --field-bg: #fffdf8;
  --day-bg: #fffaf4;
  --today-bg: #e4e5da;
  --pill-bg: #f0e3d8;
  --profile-end: #f5e9df;
}

html[data-theme="sage"],
body[data-theme="sage"] {
  --bg: #dfe2db;
  --bg-deep: #c8cec4;
  --page-top: #f5f4ef;
  --surface: #fcfbf6;
  --surface-2: #d7d1c6;
  --surface-3: #9fa99a;
  --ink: #313b34;
  --muted: #657068;
  --brand: #768675;
  --brand-deep: #435246;
  --accent: #9fa99a;
  --accent-soft: #dce2d8;
  --hero-start: #b9b2a6;
  --hero-end: #7f8c7d;
  --hero-ink: #243028;
  --orb: rgba(159, 169, 154, .72);
  --secondary-orb: rgba(210, 178, 165, .34);
  --summary-1a: #e6d4cb;
  --summary-1b: #d2b8ac;
  --summary-2a: #f0eee7;
  --summary-2b: #ddd9cf;
  --summary-3a: #d9e0d5;
  --summary-3b: #bec9bb;
  --warning-bg: #eee0d8;
  --warning-text: #6f5144;
  --status-bg: #d7e1d5;
  --status-text: #4a604f;
  --field-bg: #fffef9;
  --day-bg: #fcfbf6;
  --today-bg: #d7e1d5;
  --pill-bg: #e7e7df;
  --profile-end: #eeeae2;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 92% -4%, var(--orb), transparent 25rem),
    radial-gradient(circle at -12% 28%, var(--secondary-orb), transparent 24rem),
    linear-gradient(180deg, var(--page-top) 0%, var(--bg) 48%, var(--bg-deep) 145%);
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(75,55,49,.11) 1px, transparent 0);
  background-size: 24px 24px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.45), transparent 42%);
}
button, input, select { font: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; }

.app-shell { min-height: 100vh; max-width: 760px; margin: 0 auto; padding-bottom: 100px; position: relative; }
.topbar {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; justify-content: space-between;
  padding: calc(18px + env(safe-area-inset-top)) 20px 14px;
  background: color-mix(in srgb, var(--bg) 84%, transparent);
  backdrop-filter: blur(22px) saturate(1.15);
  border-bottom: 1px solid var(--line);
}
.topbar h1 { margin: 1px 0 0; font-size: 29px; line-height: 1; letter-spacing: -.025em; color: var(--brand-deep); }
.eyebrow {
  color: var(--brand);
  font-size: 10px;
  letter-spacing: .2em;
  line-height: 1.4;
  font-weight: 800;
  text-transform: uppercase;
}
.icon-btn {
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(75,55,49,.1);
  background: rgba(255,250,248,.82); color: var(--brand-deep); font-size: 25px;
  box-shadow: var(--shadow-soft);
}
.hidden { display: none !important; }

.view { display: none; padding: 20px 16px 32px; }
.view.active { display: block; animation: fade .28s ease; }
@keyframes fade { from { opacity: .1; transform: translateY(7px);} to {opacity:1; transform:none;} }

.hero {
  position: relative; overflow: hidden; padding: 25px; border-radius: 34px;
  background: linear-gradient(145deg, var(--hero-start) 0%, var(--hero-end) 100%);
  color: var(--hero-ink); box-shadow: var(--shadow); margin-bottom: 16px;
  border: 1px solid rgba(255,255,255,.44);
}
.hero::before {
  content: "";
  position: absolute; width: 230px; height: 230px; border-radius: 50%;
  right: -82px; top: -106px;
  border: 1px solid rgba(255,255,255,.46);
  box-shadow: 0 0 0 24px rgba(255,255,255,.11), 0 0 0 48px rgba(255,255,255,.06);
}
.hero::after {
  content: "✦";
  position: absolute;
  right: 28px;
  bottom: 16px;
  color: rgba(255,255,255,.58);
  font-size: 28px;
}
.hero h2 { margin: 6px 0 8px; font-size: 31px; line-height: 1.03; letter-spacing: -.035em; }
.hero p { margin: 0; color: color-mix(in srgb, var(--hero-ink) 76%, transparent); line-height: 1.5; font-size: 14px; }
.hero .eyebrow { color: color-mix(in srgb, var(--hero-ink) 78%, transparent); }
.hero-row { display:flex; align-items:center; gap:17px; position: relative; z-index: 1; }
.hero-animal {
  width: 80px; height: 80px; flex: 0 0 auto;
  filter: drop-shadow(0 10px 16px rgba(72,44,37,.15));
  border-radius: 50%;
}

.section-head { display:flex; justify-content:space-between; align-items:end; gap:12px; margin: 24px 5px 13px; }
.section-head h2, .section-head h3 { margin:0; letter-spacing:-.025em; font-size: 25px; }
.section-head p { margin:5px 0 0; color:var(--muted); font-size:12px; line-height: 1.45; }

.summary-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:18px; }
.summary-card {
  padding:16px 10px; border-radius:22px; border:1px solid rgba(255,255,255,.55);
  text-align:center; box-shadow:var(--shadow-soft);
}
.summary-card:nth-child(1) { background: linear-gradient(145deg, var(--summary-1a), var(--summary-1b)); }
.summary-card:nth-child(2) { background: linear-gradient(145deg, var(--summary-2a), var(--summary-2b)); }
.summary-card:nth-child(3) { background: linear-gradient(145deg, var(--summary-3a), var(--summary-3b)); }
.summary-card strong { display:block; font-family:var(--font-display); font-size:27px; font-weight:600; color: var(--brand-deep); }
.summary-card span { display:block; color:var(--muted); font-size:11px; margin-top:2px; font-weight:700; letter-spacing:.02em; }

.card {
  position: relative;
  overflow: hidden;
  background: color-mix(in srgb, var(--surface) 96%, transparent);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: var(--radius);
  padding: 19px;
  margin-bottom: 14px;
  box-shadow: var(--shadow-soft);
}
.card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(to bottom, var(--surface-3), transparent 78%);
}
.card.unsuitable { opacity:.66; background:color-mix(in srgb, var(--warning-bg) 72%, var(--surface)); }
.card-top { display:flex; gap:14px; align-items:flex-start; }
.zodiac-img { width:60px; height:60px; flex:0 0 auto; filter: drop-shadow(0 8px 12px rgba(82,54,46,.08)); }
.card-title { flex:1; min-width:0; }
.card-title h3 { margin:1px 0 8px; font-size:20px; line-height:1.18; color:var(--brand-deep); }
.meta { display:flex; flex-wrap:wrap; gap:6px; }
.chip {
  display:inline-flex; align-items:center; gap:4px;
  padding:6px 9px; border-radius:999px;
  background:var(--accent-soft); color:var(--brand-deep);
  font-size:11px; font-weight:800;
  border: 1px solid rgba(255,255,255,.52);
}
.chip.warn { background:#f3d7d4; color:var(--danger); }
.chip.ok { background:#dfe7df; color:var(--ok); }
.chip.gold { background:#f1e2d2; color:#7e5f45; }
.action-line { margin:14px 0 0; color:var(--ink); line-height:1.55; font-size:14px; }
.warning { margin-top:12px; padding:12px 13px; border-radius:16px; background:var(--warning-bg); color:var(--warning-text); font-size:12.5px; line-height:1.45; border: 1px solid rgba(157,100,82,.08); }
.details { margin-top:13px; border-top:1px solid var(--line); padding-top:12px; }
.details summary { font-weight:800; color:var(--brand); font-size:13px; }
.details p { white-space:normal; color:var(--ink); line-height:1.62; font-size:14px; }
.card-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:15px; }

.primary-btn, .secondary-btn, .ghost-btn {
  border:0; border-radius:16px; padding:12px 16px; font-weight:800;
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}
.primary-btn:active, .secondary-btn:active, .ghost-btn:active { transform: scale(.98); }
.primary-btn { background:linear-gradient(135deg, var(--brand), var(--brand-deep)); color:white; box-shadow:0 10px 22px rgba(112,74,66,.2); }
.secondary-btn { background:var(--accent-soft); color:var(--brand-deep); border:1px solid rgba(112,74,66,.07); }
.ghost-btn { background:transparent; color:var(--brand); border:1px solid var(--line); }
.primary-btn:disabled { opacity:.5; cursor:not-allowed; }

.filter-row { display:flex; gap:8px; overflow-x:auto; padding:2px 2px 11px; scrollbar-width:none; }
.filter-row::-webkit-scrollbar { display:none; }
.filter-btn {
  flex:0 0 auto; border:1px solid rgba(75,55,49,.1);
  background:rgba(255,250,248,.72); color:var(--ink);
  padding:9px 13px; border-radius:999px; font-weight:800; font-size:12px;
}
.filter-btn.active { background:var(--brand-deep); color:white; box-shadow:0 8px 18px rgba(112,74,66,.16); }

.calendar-panel { background:color-mix(in srgb, var(--surface) 92%, transparent); border:1px solid rgba(255,255,255,.7); border-radius:29px; padding:17px; box-shadow:var(--shadow); }
.calendar-title { display:flex; justify-content:space-between; align-items:center; margin-bottom:15px; }
.calendar-title h2 { margin: 2px 0 0; font-size: 27px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:7px; }
.weekday { text-align:center; color:var(--muted); font-size:10px; font-weight:900; padding-bottom:5px; letter-spacing:.04em; }
.day-cell {
  min-height:67px; padding:7px 5px; border:1px solid rgba(75,55,49,.1); border-radius:15px;
  background:var(--day-bg); text-align:left; color:var(--ink); position:relative;
  box-shadow: 0 4px 12px rgba(88,58,50,.025);
}
.day-cell.empty { visibility:hidden; }
.day-cell.active { outline:2px solid var(--brand); background:var(--accent-soft); }
.day-cell.today { background:var(--today-bg); }
.day-num { font-family:var(--font-display); font-weight:700; font-size:16px; }
.day-count { display:block; font-size:9px; color:var(--muted); margin-top:3px; }
.day-dots { display:flex; gap:2px; position:absolute; bottom:7px; left:7px; }
.dot { width:5px; height:5px; border-radius:50%; background:var(--brand); }
.dot.bad { background:var(--danger); }

.walk-panel { text-align:center; padding:25px 19px; }
.walk-panel h2 { margin:6px 0 5px; font-size:30px; color:var(--brand-deep); }
.compass {
  width:220px; height:220px; margin:12px auto 23px; border-radius:50%; position:relative;
  background:
    radial-gradient(circle, #fffaf8 0 44%, transparent 45%),
    repeating-conic-gradient(from 0deg, rgba(112,74,66,.10) 0 1deg, transparent 1deg 15deg),
    radial-gradient(circle, var(--accent-soft) 0 66%, #f8f0eb 67% 100%);
  border:1px solid rgba(112,74,66,.13); box-shadow:var(--shadow);
}
.compass::before { content:"С"; position:absolute; top:10px; left:50%; transform:translateX(-50%); font-weight:900; color:var(--danger); }
.compass::after { content:"Ю"; position:absolute; bottom:10px; left:50%; transform:translateX(-50%); font-weight:900; color:var(--brand-deep); }
.compass .east { position:absolute; right:12px; top:50%; transform:translateY(-50%); font-weight:900; }
.compass .west { position:absolute; left:12px; top:50%; transform:translateY(-50%); font-weight:900; }
.arrow { position:absolute; left:50%; top:50%; width:12px; height:86px; transform-origin:50% 100%; transform:translate(-50%,-100%) rotate(0deg); background:linear-gradient(var(--danger) 0 50%, var(--brand-deep) 50% 100%); clip-path:polygon(50% 0,100% 28%,72% 28%,72% 100%,28% 100%,28% 28%,0 28%); transition:transform .35s ease; }
.compass-center { position:absolute; width:19px; height:19px; border-radius:50%; background:var(--gold); left:50%; top:50%; transform:translate(-50%,-50%); border:4px solid white; }
.walk-controls { display:grid; grid-template-columns:1fr 1fr; gap:10px; text-align:left; margin-top:18px; }
.walk-controls label:last-child { grid-column:1/-1; }
.status-box { margin-top:14px; padding:13px; border-radius:17px; background:var(--status-bg); color:var(--status-text); font-size:12.5px; text-align:left; line-height:1.45; }


.walk-controls-v3 { grid-template-columns:1fr 1fr; }
.walk-controls-v3 label:nth-child(3),
.walk-controls-v3 label:nth-child(5) { grid-column:1/-1; }
.walk-plan { margin-top:20px; padding-top:20px; border-top:1px solid var(--line); text-align:left; }
.walk-plan-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.walk-plan-head h3 { margin:4px 0 0; font-size:22px; color:var(--brand-deep); }
.walk-steps { display:grid; gap:10px; margin:16px 0; }
.walk-step { display:flex; gap:12px; align-items:flex-start; padding:13px; border-radius:18px; background:color-mix(in srgb, var(--accent-soft) 66%, var(--surface)); border:1px solid rgba(255,255,255,.55); }
.walk-step b { width:30px; height:30px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; color:white; background:linear-gradient(135deg,var(--brand),var(--brand-deep)); font-family:var(--font-display); font-size:16px; }
.walk-step strong { display:block; font-size:13px; color:var(--brand-deep); }
.walk-step span { display:block; margin-top:3px; color:var(--muted); font-size:12px; line-height:1.45; }
.anchor-timer-card { display:grid; gap:4px; padding:16px; border-radius:20px; text-align:center; background:linear-gradient(135deg,var(--hero-start),var(--hero-end)); color:var(--hero-ink); box-shadow:var(--shadow-soft); }
.anchor-timer-card > span { font-size:11px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; opacity:.75; }
.anchor-timer-card strong { font-family:var(--font-display); font-size:31px; line-height:1; }
.anchor-timer-card small { opacity:.72; }
.timer-done { font-size:23px !important; }
.walk-action-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:14px; }
.walk-action-grid button { min-height:48px; }
.walk-action-grid button:nth-child(1),
.walk-action-grid button:nth-child(4) { grid-column:1/-1; }
.walk-note { margin:13px 2px 0; color:var(--muted); font-size:11.5px; line-height:1.5; }

.profile-card { display:grid; gap:15px; }
.profile-card h2 { margin: 4px 0 0; font-size:28px; }
label { display:grid; gap:7px; color:var(--ink); font-size:12px; font-weight:800; }
input, select {
  width:100%; border:1px solid rgba(75,55,49,.13); border-radius:15px; padding:13px 14px;
  background:var(--field-bg); color:var(--ink); outline:none;
}
input:focus, select:focus { border-color:var(--brand); box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 26%, transparent); }
.checkbox-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.check-pill { display:flex; align-items:center; gap:8px; padding:11px; border-radius:15px; background:var(--pill-bg); font-size:12px; }
.check-pill input { width:auto; accent-color: var(--brand); }
.profile-result { display:flex; gap:14px; align-items:center; padding:15px; border-radius:20px; background:linear-gradient(135deg, var(--accent-soft), var(--profile-end)); border:1px solid rgba(255,255,255,.65); }
.profile-result img { width:66px; height:66px; }
.profile-result strong { display:block; font-family:var(--font-display); font-size:21px; color:var(--brand-deep); }
.profile-result span { color:var(--muted); font-size:12px; }

.theme-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.theme-choice {
  position:relative; display:block; cursor:pointer;
}
.theme-choice input { position:absolute; opacity:0; pointer-events:none; }
.theme-swatch {
  display:grid; gap:7px; place-items:center; min-height:82px;
  padding:10px 6px; border-radius:17px; border:2px solid transparent;
  background:var(--surface); box-shadow:0 7px 18px rgba(89,58,50,.06);
  color:var(--muted); font-size:10px; font-weight:900;
}
.theme-choice input:checked + .theme-swatch { border-color:var(--brand); color:var(--brand-deep); }
.swatch-dots { display:flex; }
.swatch-dots i { display:block; width:22px; height:22px; border-radius:50%; margin-left:-5px; border:2px solid #fff; }
.swatch-dots i:first-child { margin-left:0; }
.theme-blush i:nth-child(1){background:#d2b2a5}.theme-blush i:nth-child(2){background:#f0d9d1}.theme-blush i:nth-child(3){background:#603d35}
.theme-rose i:nth-child(1){background:#c98f98}.theme-rose i:nth-child(2){background:#f1d4da}.theme-rose i:nth-child(3){background:#653945}
.theme-mocha i:nth-child(1){background:#b59680}.theme-mocha i:nth-child(2){background:#ead9cb}.theme-mocha i:nth-child(3){background:#563e32}
.theme-sage i:nth-child(1){background:#9fa99a}.theme-sage i:nth-child(2){background:#dce2d8}.theme-sage i:nth-child(3){background:#435246}
.theme-hint { margin:8px 2px 0; color:var(--muted); font-size:11px; line-height:1.4; }

.bottom-nav {
  position:fixed; z-index:20; left:50%; bottom:0; transform:translateX(-50%);
  width:min(760px,100%); display:grid; grid-template-columns:repeat(4,1fr);
  padding:9px 10px calc(9px + env(safe-area-inset-bottom));
  background:color-mix(in srgb, var(--surface) 91%, transparent); backdrop-filter:blur(22px) saturate(1.2); border-top:1px solid var(--line);
  box-shadow:0 -12px 34px rgba(89,58,50,.06);
}
.nav-item { border:0; background:transparent; color:var(--muted); border-radius:17px; padding:7px 2px; }
.nav-item span { display:block; font-size:20px; line-height:1; }
.nav-item small { display:block; margin-top:5px; font-size:9.5px; font-weight:900; letter-spacing:.01em; }
.nav-item.active { color:var(--brand-deep); background:var(--accent-soft); }

.dialog-card { width:min(92vw,430px); border:0; border-radius:30px; padding:23px; color:var(--ink); background:var(--surface); box-shadow:0 30px 80px rgba(58,35,30,.24); }
.dialog-card::backdrop { background:rgba(61,42,37,.5); backdrop-filter:blur(8px); }
.dialog-card form { display:grid; gap:13px; }
.dialog-card h2 { margin:0; font-size:28px; }
.dialog-hero { font-size:56px; text-align:center; padding:6px; border-radius:24px; background:var(--accent-soft); }
.muted { color:var(--muted); line-height:1.55; }
.empty-state { padding:29px 18px; text-align:center; color:var(--muted); background:color-mix(in srgb, var(--surface) 78%, transparent); border:1px dashed var(--line); border-radius:23px; }
.toast { position:fixed; z-index:99; left:50%; bottom:108px; transform:translate(-50%,20px); background:var(--brand-deep); color:white; padding:11px 17px; border-radius:999px; opacity:0; pointer-events:none; transition:.25s; white-space:nowrap; max-width:90vw; overflow:hidden; text-overflow:ellipsis; box-shadow:var(--shadow); }
.toast.show { opacity:1; transform:translate(-50%,0); }

@media (max-width:420px) {
  .hero { padding:21px; }
  .hero h2 { font-size:27px; }
  .hero-animal { width:72px; height:72px; }
  .summary-grid { gap:7px; }
  .summary-card { padding:14px 7px; }
  .card { padding:16px; }
  .calendar-grid { gap:5px; }
  .day-cell { min-height:61px; border-radius:13px; }
  .theme-grid { gap:6px; }
  .theme-swatch { min-height:77px; }
  .walk-action-grid { grid-template-columns:1fr; }
  .walk-action-grid button:nth-child(1), .walk-action-grid button:nth-child(4) { grid-column:auto; }
  .walk-controls-v3 { grid-template-columns:1fr; }
  .walk-controls-v3 label:nth-child(3), .walk-controls-v3 label:nth-child(5) { grid-column:auto; }
}

/* v3.2 — местное солнечное время */
.solar-banner {
  display:flex; gap:12px; align-items:flex-start; margin:12px 0 16px; padding:14px 15px;
  border-radius:20px; background:linear-gradient(135deg,var(--accent-soft),var(--profile-end));
  border:1px solid rgba(255,255,255,.68); box-shadow:var(--shadow-soft); color:var(--brand-deep);
}
.solar-banner > span { font-size:25px; line-height:1; }
.solar-banner strong { display:block; font-size:13px; }
.solar-banner small { display:block; margin-top:4px; color:var(--muted); font-size:11.5px; line-height:1.45; }
.solar-time-note { margin-top:12px; padding:10px 12px; border-radius:14px; background:var(--status-bg); color:var(--status-text); font-size:11.5px; line-height:1.45; }
.solar-time-note strong { color:var(--brand-deep); }
.calendar-time-hint { margin:4px 0 0; color:var(--muted); font-size:11px; }
.walk-time-pill { display:inline-flex; flex-wrap:wrap; justify-content:center; gap:4px; margin:4px auto 8px; padding:8px 12px; border-radius:999px; background:var(--accent-soft); color:var(--brand-deep); font-size:12px; font-weight:900; }
.walk-time-pill small { font-weight:700; color:var(--muted); }
.solar-settings { display:grid; gap:12px; padding:16px; border-radius:22px; background:linear-gradient(135deg,var(--accent-soft),var(--profile-end)); border:1px solid rgba(255,255,255,.72); }
.solar-settings h3 { margin:3px 0 5px; font-family:var(--font-display); color:var(--brand-deep); font-size:21px; }
.solar-settings p { margin:0; color:var(--muted); font-size:12px; line-height:1.5; }
.solar-check { background:color-mix(in srgb,var(--surface) 72%,transparent); }
.solar-help, .onboarding-note { padding:11px 12px; border-radius:15px; background:var(--status-bg); color:var(--status-text); font-size:11.5px; line-height:1.45; }