/* The active workspace, presented as a quiet, readable daily journal. */
.home-page {
  --home-ink: #493f34;
  --home-muted: #83786a;
  --home-moss: #6d7d61;
  --home-caramel: #aa7957;
  --home-line: #e7e0d5;
  --home-paper: #fffdf8;
  width: 100%;
  max-width: 1312px;
  min-width: 0;
  margin: 0 auto;
  padding: 30px 36px 34px;
  color: var(--home-ink);
}
.home-page *, .home-page *::before, .home-page *::after { box-sizing: border-box; }
.home-page button { transition: background-color .18s, color .18s, border-color .18s, box-shadow .18s; }
.home-page button:focus-visible { outline: 2px solid var(--home-moss); outline-offset: 4px; }
.home-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.home-eyebrow { color: #8a795f; font: 9px/1.6 var(--mono, monospace); letter-spacing: 2px; }
.home-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  align-items: center;
  column-gap: 40px;
  padding: 24px 40px;
  margin-bottom: 20px;
  border: 1px solid #e4ddcf;
  border-radius: 22px;
  background: linear-gradient(112deg, #fffdf6 0%, #f8f6ed 56%, #edf0e4 100%);
  box-shadow: 0 1px 0 #fff inset, 0 8px 30px #65513906;
}
.home-hero::before { content: ""; position: absolute; z-index: -1; width: 240px; height: 240px; right: 47px; top: 50%; transform: translateY(-50%); border: 1px solid #b5bf9d38; border-radius: 50%; background: #e5ead95c; }
.home-hero-copy { min-width: 0; }
.home-hero-kicker { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-bottom: 12px; }
.home-hero-kicker > .home-eyebrow { display: inline-flex; align-items: center; gap: 10px; }
.home-hero-kicker > .home-eyebrow::before { content: ""; width: 23px; height: 1px; background: #a5ac91; }
.home-space { display: inline-block; max-width: 100%; color: #6f7c60; border: 1px solid #dce1ce; border-radius: 5px; background: #f8faef; padding: 3px 8px; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.home-name { margin: 0 0 6px; color: #837056; font-size: 11px; line-height: 1.6; letter-spacing: 3px; }
.home-hero h1 { margin: 0 0 10px; color: #4d4436; font: 500 32px/1.36 Georgia, "Noto Serif SC", "Microsoft YaHei", serif; letter-spacing: 1px; }
.home-hero h1 span { display: block; }
.home-hero h1 span + span { color: #6d7b5c; }
.home-hero-description { margin: 0; color: #827563; font-size: 12px; line-height: 1.9; }
.home-hero-date { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 7px; color: #7a816b; font-size: 10px; line-height: 1.7; margin-top: 12px; }
.home-hero-date .home-icon { width: 13px; height: 13px; }
.home-hero-photo { position: relative; width: 180px; max-width: 100%; min-width: 0; justify-self: center; margin: 0; padding: 8px 8px 11px; border: 1px solid #e5ddce; border-radius: 4px; background: #fffcf5; box-shadow: 0 12px 25px #5e51351c, 0 2px 4px #5e51350a; transform: rotate(4deg); }
.home-hero-photo::before { content: ""; position: absolute; width: 65px; height: 19px; top: -10px; left: calc(50% - 32px); background: #d7d7baa8; border: 1px solid #babc9c21; transform: rotate(-7deg); }
.home-hero-photo img { display: block; width: 100%; height: 193px; background: #f0ebdf; object-fit: contain; border-radius: 2px; }
.home-hero-photo figcaption { text-align: center; margin-top: 9px; color: #8e7e65; font: italic 10px/1.6 Georgia, serif; }
.home-photo-star { position: absolute; right: -22px; bottom: 10px; color: #9da580; font: 38px/1 Georgia, serif; transform: rotate(9deg); }
.home-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-bottom: 30px; border: 1px solid #e5dfd3; border-radius: 17px; background: var(--home-paper); box-shadow: 0 4px 16px #65513904; overflow: hidden; }
.home-metric { position: relative; min-width: 0; padding: 18px 25px 17px; }
.home-metric + .home-metric::before { content: ""; position: absolute; left: 0; top: 23px; bottom: 23px; width: 1px; background: var(--home-line); }
.home-metric-label { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #7c715f; font-size: 11px; line-height: 1.7; }
.home-metric-label .home-icon { order: 1; width: 17px; height: 17px; color: #8a9878; }
.home-metric-expense .home-icon { color: #ad8765; }
.home-metric strong { display: block; margin-top: 8px; color: #4f493a; font-family: Georgia, "Segoe UI", serif; font-size: 32px; font-weight: 500; line-height: 1.25; letter-spacing: -.7px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.home-metric-tasks strong { color: #697b59; }
.home-metric-expense strong { color: #996e4b; }
.home-metric strong small { margin-left: 7px; color: #8f8270; font-family: "Segoe UI", "Microsoft YaHei", sans-serif; font-size: 11px; font-weight: 400; letter-spacing: 0; }
.home-metric strong.home-long-number { font-size: 24px; line-height: 1.67; }
.home-metric p { margin: 7px 0 0; color: #918674; font-size: 10px; line-height: 1.7; }
.home-section-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 1px 17px; }
.home-section-intro .home-eyebrow { font-size: 8px; letter-spacing: 1.7px; }
.home-section-intro h2 { margin: 5px 0 0; color: #514838; font-size: 18px; font-weight: 500; line-height: 1.5; letter-spacing: .4px; }
.home-section-intro > p { margin: 0 0 2px; color: #948674; font-size: 11px; line-height: 1.8; }
.home-module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.home-module { --module-accent: #78896a; display: flex; flex-direction: column; min-width: 0; min-height: 335px; padding: 23px 26px 17px; border: 1px solid #e4ddcf; border-radius: 18px; background: var(--home-paper); box-shadow: 0 1px 0 #fff inset, 0 5px 18px #65513904; }
.home-module-head { display: flex; align-items: center; min-width: 0; gap: 11px; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid #eee9df; }
.home-module-mark { display: grid; place-items: center; width: 39px; height: 39px; flex: none; border: 1px solid #dce2ce; border-radius: 11px; background: #edf0e4; color: var(--module-accent); }
.home-module-mark .home-icon { width: 19px; height: 19px; }
.home-module-title { min-width: 0; }
.home-module-title .home-eyebrow { display: block; color: #97836a; font-size: 8px; letter-spacing: 1px; overflow-wrap: anywhere; }
.home-module-title h2 { margin: 3px 0 0; color: #514735; font-size: 16px; font-weight: 600; line-height: 1.5; letter-spacing: .3px; }
.home-open { display: inline-flex; align-items: center; justify-content: center; flex: none; gap: 6px; min-height: 32px; margin-left: auto; padding: 6px 9px; border: 1px solid #e4dccb; border-radius: 7px; background: #fcfaf4; color: #897354; font-size: 10px; line-height: 1.7; }
.home-open .home-icon, .home-text-link .home-icon { width: 12px; height: 12px; }
.home-open:hover { background: #eef1e5; border-color: #c9d2b7; color: #65774f; }
.home-module-caption { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 13px; color: #8c7c64; font-size: 10px; line-height: 1.8; }
.home-module-caption > span { color: #b9ad98; }
.home-note-list, .home-task-list { list-style: none; margin: 0; padding: 0; }
.home-note-list { flex: 1; margin-bottom: 8px; }
.home-note { padding: 13px 0; border-bottom: 1px solid #eee8dd; }
.home-note:first-child { padding-top: 0; }
.home-note:last-child { border: 0; }
.home-note-top { display: flex; align-items: baseline; gap: 12px; }
.home-note h3 { flex: 1; min-width: 0; margin: 0; color: #5c503e; font-size: 13px; font-weight: 500; line-height: 1.7; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.home-note time { color: #a18f73; font: 9px/1.7 var(--mono, monospace); flex: none; }
.home-note p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 6px 0 0; color: #90816a; font-size: 11px; line-height: 1.85; overflow-wrap: anywhere; }
.home-note-tag { display: inline-block; max-width: 100%; margin-top: 7px; padding: 2px 7px; border: 1px solid #e0e5d3; border-radius: 4px; background: #f1f4e9; color: #7f8c6c; font-size: 9px; line-height: 1.6; overflow-wrap: anywhere; }
.home-module-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; padding-top: 13px; border-top: 1px solid var(--home-line); color: #9b8b73; font-size: 9px; line-height: 1.8; }
.home-module-foot > span { min-width: 0; }
.home-quiet-count { color: #9b8b73; font-size: 9px; text-align: right; }
.home-text-link { display: inline-flex; align-items: center; gap: 5px; padding: 4px 0 4px 6px; color: #78875e; font-size: 10px; white-space: nowrap; flex: none; }
.home-text-link:hover { color: #4f683e; background: transparent; }
.home-empty { display: flex; align-items: center; justify-content: center; flex-direction: column; flex: 1; min-height: 177px; padding: 20px 12px 27px; text-align: center; }
.home-empty-mark { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 14px; border-radius: 50%; background: #f0f2e6; color: #a0ab87; font: 28px/1 Georgia, serif; }
.home-empty h3 { margin: 0 0 8px; color: #7c6c53; font-size: 13px; font-weight: 500; line-height: 1.8; }
.home-empty p { max-width: 295px; margin: 0; color: #9b896e; font-size: 11px; line-height: 1.9; }
.home-task-summary { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 12px; color: #8e7d63; font-size: 11px; line-height: 1.8; }
.home-task-summary p { margin: 0; }
.home-task-summary p strong { margin-right: 5px; color: #6b7e57; font: 500 29px/1.3 Georgia, serif; }
.home-task-summary > span { display: inline-flex; align-items: center; gap: 5px; color: #83956a; font-size: 10px; }
.home-task-summary > span .home-icon { width: 13px; height: 13px; }
.home-task-progress { width: 100%; height: 5px; margin: 12px 0 8px; border-radius: 5px; background: #ebeedf; overflow: hidden; }
.home-task-progress i { display: block; height: 100%; border-radius: inherit; background: #97a97a; }
.home-task-list { flex: 1; margin: 6px 0 18px; }
.home-task { display: flex; align-items: center; gap: 11px; padding: 16px 0; border-bottom: 1px solid #eee8dd; }
.home-task:last-child { border-bottom: 0; }
.home-task-circle { width: 16px; height: 16px; flex: none; border: 1px solid #b6c09d; border-radius: 5px; background: #fdfdf7; }
.home-task-copy { display: -webkit-box; flex: 1; min-width: 0; color: #6f6048; font-size: 13px; line-height: 1.75; overflow-wrap: anywhere; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.home-task-priority { flex: none; padding: 3px 7px; border-radius: 5px; background: #f6edde; color: #aa7e50; font-size: 9px; }
.home-task-empty { min-height: 162px; }
.home-ledger { --module-accent: #ab8461; }
.home-ledger .home-module-mark { border-color: #eadfcb; background: #f6edde; }
.home-money-list { margin: 1px 0 20px; }
.home-money-row { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 15px 0; border-bottom: 1px solid #eee8dd; }
.home-money-row dt { display: inline-flex; align-items: center; flex: none; gap: 8px; color: #8a785c; font-size: 11px; line-height: 1.7; }
.home-money-row dt i { width: 5px; height: 5px; border-radius: 50%; background: #95a77b; }
.home-money-row.expense dt i { background: #c39a68; }
.home-money-row.balance dt i { background: #a69d83; }
.home-money-row dd { min-width: 0; margin: 0; color: #778962; font: 500 27px/1.4 Georgia, "Segoe UI", serif; font-variant-numeric: tabular-nums; text-align: right; overflow-wrap: anywhere; }
.home-money-row dd > span { margin-right: 5px; font-family: "Segoe UI", sans-serif; font-size: 12px; }
.home-money-row.expense dd { color: #ae8255; }
.home-money-row.balance dd { color: #837257; }
.home-money-row:last-child { border-bottom: 0; }
.home-ledger-empty { margin: -3px 0 20px; color: #9b886b; font-size: 10px; line-height: 1.9; }
.home-recipe-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0 0 14px; }
.home-meal-badge { padding: 4px 9px; border: 1px solid #dce4cb; border-radius: 5px; background: #edf2e3; color: #798a5f; font-size: 10px; line-height: 1.6; }
.home-recipe-meta p { margin: 0; color: #948166; font-size: 10px; line-height: 1.7; }
.home-recipe-meta time { margin-left: auto; color: #a18d6f; font: 9px/1.7 var(--mono, monospace); }
.home-meal-list { flex: 1; margin: 0 0 19px; }
.home-meal-list > div { display: grid; grid-template-columns: 62px minmax(0, 1fr); align-items: baseline; gap: 12px; padding: 10px 0; border-bottom: 1px solid #eee8dd; }
.home-meal-list > div:last-child { border-bottom: 0; }
.home-meal-list dt { color: #978367; font-size: 10px; line-height: 1.8; }
.home-meal-list dd { margin: 0; color: #796445; font-size: 12px; line-height: 1.9; overflow-wrap: anywhere; }
.home-recipe-empty { min-height: 231px; }
.home-recipe-empty > .home-icon { width: 37px; height: 37px; margin-bottom: 15px; color: #9eaf7f; stroke-width: 1.2; }
.home-empty-action { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; margin-top: 18px; padding: 7px 12px; border: 1px solid #d4ddc1; border-radius: 7px; background: #edf2e2; color: #73865a; font-size: 11px; line-height: 1.7; }
.home-empty-action .home-icon { width: 13px; height: 13px; }
.home-empty-action:hover { background: #e1eace; color: #5b7442; border-color: #bbcaa3; }
.home-bottom-note { display: flex; align-items: center; justify-content: center; gap: 9px; margin: 27px 0 0; color: #a28f70; font-size: 10px; line-height: 1.8; text-align: center; }
.home-bottom-note > span { color: #a1ac89; font: 19px/1 Georgia, serif; }
@media (max-width: 1120px) {
  .home-page { padding: 26px 27px 30px; }
  .home-hero { grid-template-columns: minmax(0, 1fr) 210px; gap: 24px; padding: 25px 32px; }
  .home-hero::before { width: 210px; height: 210px; right: 32px; }
  .home-hero h1 { font-size: 31px; }
  .home-hero-photo { width: 180px; }
  .home-hero-photo img { height: 204px; }
  .home-metric { padding: 18px 21px 17px; }
  .home-metric strong { font-size: 30px; }
  .home-module { padding: 22px 22px 17px; }
  .home-module-grid { gap: 18px; }
  .home-module-head { gap: 9px; }
  .home-module-mark { width: 35px; height: 37px; }
  .home-module-title .home-eyebrow { font-size: 7px; letter-spacing: .6px; }
  .home-open { padding: 6px 7px; font-size: 9px; }
}
@media (max-width: 820px) {
  .home-hero { grid-template-columns: minmax(0, 1fr) 175px; gap: 22px; padding: 25px 28px; }
  .home-hero::before { width: 180px; height: 180px; right: 24px; }
  .home-hero h1 { font-size: 28px; }
  .home-hero-photo { width: 160px; }
  .home-hero-photo img { height: 185px; }
  .home-hero-description { font-size: 11px; }
  .home-metric { padding: 17px 16px 16px; }
  .home-metric strong { font-size: 27px; }
  .home-metric-label { gap: 7px; font-size: 10px; }
  .home-metric-label .home-icon { width: 15px; height: 15px; }
  .home-metric p { font-size: 9px; }
  .home-module-grid { grid-template-columns: minmax(0, 1fr); }
  .home-module { padding: 23px 25px 17px; min-height: 320px; }
  .home-module-title .home-eyebrow { font-size: 8px; letter-spacing: 1px; }
  .home-open { padding: 7px 9px; font-size: 10px; }
  .home-empty { min-height: 165px; }
  .home-recipe-empty { min-height: 195px; }
}
@media (max-width: 620px) {
  .home-page { padding: 20px 16px 27px; }
  .home-hero { grid-template-columns: minmax(0, 1fr) 112px; grid-template-rows: auto auto auto auto; column-gap: 15px; row-gap: 10px; align-items: start; padding: 22px 23px 20px; margin-bottom: 16px; border-radius: 17px; }
  .home-hero::before { width: 143px; height: 143px; top: 88px; right: 10px; transform: none; }
  .home-hero-copy { display: contents; }
  .home-hero-kicker { grid-column: 1 / -1; grid-row: 1; gap: 10px; margin: 0 0 5px; }
  .home-hero-kicker > .home-eyebrow { font-size: 7px; letter-spacing: 1.4px; gap: 7px; }
  .home-hero-kicker > .home-eyebrow::before { width: 15px; }
  .home-space { padding: 2px 7px; font-size: 9px; }
  .home-hero-heading { grid-column: 1; grid-row: 2; align-self: center; min-width: 0; }
  .home-name { margin: 0 0 7px; font-size: 10px; letter-spacing: 2px; }
  .home-hero h1 { margin: 0; font-size: clamp(20px, 5.35vw, 26px); line-height: 1.6; letter-spacing: .3px; }
  .home-hero-description { grid-column: 1 / -1; grid-row: 3; margin-top: 6px; font-size: 11px; line-height: 1.9; }
  .home-hero-description br { display: none; }
  .home-hero-date { grid-column: 1 / -1; grid-row: 4; margin-top: 2px; font-size: 9px; }
  .home-hero-photo { grid-column: 2; grid-row: 2; align-self: center; width: 112px; margin: 2px 0 0; padding: 6px 6px 8px; transform: rotate(3deg); }
  .home-hero-photo::before { width: 40px; height: 13px; top: -7px; left: calc(50% - 20px); }
  .home-hero-photo img { height: 129px; }
  .home-hero-photo figcaption { margin-top: 6px; font-size: 7.5px; line-height: 1.4; }
  .home-photo-star { right: -12px; bottom: 3px; font-size: 25px; }
  .home-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 25px; border-radius: 14px; }
  .home-metric { padding: 16px 18px 15px; }
  .home-metric:nth-child(3), .home-metric:nth-child(4) { border-top: 1px solid var(--home-line); }
  .home-metric:nth-child(3)::before { display: none; }
  .home-metric + .home-metric::before { top: 20px; bottom: 20px; }
  .home-metric-label { font-size: 10px; }
  .home-metric strong { margin-top: 8px; font-size: 28px; }
  .home-metric strong.home-long-number { font-size: 19px; line-height: 1.85; }
  .home-metric p { margin-top: 6px; font-size: 9px; }
  .home-section-intro { gap: 12px; margin-bottom: 15px; }
  .home-section-intro h2 { font-size: 17px; }
  .home-section-intro > p { max-width: 110px; font-size: 9px; text-align: right; }
  .home-section-intro .home-eyebrow { font-size: 7px; letter-spacing: 1.2px; }
  .home-module-grid { gap: 16px; }
  .home-module { min-height: 305px; padding: 20px 20px 16px; border-radius: 15px; }
  .home-module-head { gap: 9px; margin-bottom: 14px; padding-bottom: 14px; }
  .home-module-mark { width: 32px; height: 34px; border-radius: 9px; }
  .home-module-mark .home-icon { width: 17px; height: 17px; }
  .home-module-title .home-eyebrow { font-size: 7px; letter-spacing: .6px; }
  .home-module-title h2 { font-size: 15px; }
  .home-open { gap: 4px; padding: 6px; font-size: 9px; }
  .home-open .home-icon { width: 10px; height: 10px; }
  .home-note-top { gap: 9px; }
  .home-note h3 { font-size: 12px; }
  .home-note time { font-size: 8px; }
  .home-note p { font-size: 10px; }
  .home-module-foot { gap: 10px; align-items: flex-start; }
  .home-task-summary > span { font-size: 9px; }
  .home-task-copy { font-size: 12px; }
  .home-money-row { gap: 13px; padding: 14px 0; }
  .home-money-row dd { font-size: 25px; }
  .home-money-row dt { gap: 6px; font-size: 10px; }
  .home-meal-list > div { grid-template-columns: 58px minmax(0, 1fr); gap: 10px; }
  .home-meal-list dd { font-size: 11px; }
  .home-empty p { font-size: 10px; }
  .home-bottom-note { font-size: 9px; }
}
@media (max-width: 380px) {
  .home-page { padding-left: 13px; padding-right: 13px; }
  .home-hero { grid-template-columns: minmax(0, 1fr) 100px; column-gap: 12px; padding: 21px 18px 19px; }
  .home-hero h1 { font-size: 20px; line-height: 1.65; }
  .home-hero-photo { width: 100px; padding: 5px 5px 7px; }
  .home-hero-photo img { height: 116px; }
  .home-hero-photo figcaption { font-size: 7px; }
  .home-hero-kicker { gap: 8px; }
  .home-hero-kicker > .home-eyebrow { font-size: 7px; letter-spacing: 1px; }
  .home-module { padding-left: 16px; padding-right: 16px; }
  .home-module-title .home-eyebrow { font-size: 6px; letter-spacing: .4px; }
  .home-module-title h2 { font-size: 14px; }
  .home-module-mark { width: 29px; height: 32px; }
  .home-metric { padding: 15px 16px 14px; }
  .home-metric strong { font-size: 25px; }
  .home-metric strong.home-long-number { font-size: 17px; }
  .home-metric-label { font-size: 9px; }
  .home-metric-label .home-icon { width: 14px; height: 14px; }
  .home-money-row dd { font-size: 22px; }
  .home-module-foot, .home-module-foot .home-quiet-count { font-size: 8px; }
  .home-text-link { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) { .home-page button { transition: none; } }