:root {
  --paper: #fffaf7;
  --paper-warm: #fff2ec;
  --surface: rgba(255, 255, 255, 0.86);
  --surface-solid: #ffffff;
  --ink: #3d3033;
  --muted: #8d777b;
  --line: #f0dedb;
  --line-strong: #e9c8c7;
  --berry: #bc536b;
  --berry-deep: #96394f;
  --berry-soft: #f9e8ea;
  --peach: #f5b69d;
  --shadow: 0 16px 42px rgba(110, 52, 67, 0.1);
  --shadow-sm: 0 8px 22px rgba(110, 52, 67, 0.07);
}

* { -webkit-tap-highlight-color: transparent; }

html { background: var(--paper); }

body.app-body {
  background:
    radial-gradient(circle at 8% -5%, rgba(251, 205, 194, 0.72), transparent 25rem),
    radial-gradient(circle at 96% 12%, rgba(244, 213, 223, 0.7), transparent 23rem),
    var(--paper);
  color: var(--ink);
}
body.modal-open { overflow: hidden; }

body.login-body {
  background:
    linear-gradient(160deg, rgba(252, 226, 218, 0.72) 0%, transparent 42%),
    radial-gradient(circle at 100% 100%, rgba(241, 205, 216, 0.52), transparent 28rem),
    var(--paper);
}

button, a, input, select, textarea { font: inherit; }
button { cursor: pointer; }

::selection { background: #f5cbd2; color: var(--ink); }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: #edc8cd; border-radius: 999px; }

.app-header {
  border-color: rgba(240, 222, 219, 0.82);
  background: rgba(255, 250, 247, 0.76);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
}

.app-frame { max-width: 44rem; }

.brand-lockup {
  color: var(--ink);
  font-family: Georgia, "Songti SC", "STSong", serif;
  font-size: 1.08rem;
  letter-spacing: 0.025em;
}

.user-chip {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.68);
  color: var(--muted);
  padding: 0.3rem 0.65rem;
}
.header-actions { display: flex; align-items: center; gap: 0.6rem; }
.global-search-link {
  color: var(--muted); font-size: 0.72rem; font-weight: 700;
  padding: 0.35rem 0.25rem; transition: color 0.15s ease;
}
.global-search-link:hover { color: var(--berry); }
.global-search-link.is-active { color: var(--berry); }

.app-main { padding-top: 1.75rem; padding-bottom: 1.5rem; animation: pageIn 0.32s ease both; }
@keyframes pageIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }

.page-head { margin-bottom: 1.35rem; }
.page-title {
  color: var(--ink);
  font-family: Georgia, "Songti SC", "STSong", serif;
  font-size: 1.52rem;
  font-weight: 600;
  letter-spacing: -0.025em;
}
.page-kicker {
  margin-bottom: 0.25rem;
  color: var(--berry);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.count-pill {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.68);
  color: var(--muted);
  padding: 0.34rem 0.64rem;
  font-size: 0.72rem;
}

.home-hero {
  position: relative;
  overflow: hidden;
  margin-bottom: 1.2rem;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 1.85rem;
  background: linear-gradient(125deg, #c65e75 0%, #a94059 100%);
  box-shadow: 0 18px 36px rgba(151, 56, 78, 0.22);
  color: white;
  padding: 1.5rem;
}
.home-hero::before,
.home-hero::after { position: absolute; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 50%; content: ""; }
.home-hero::before { width: 12rem; height: 12rem; right: -3.5rem; top: -7rem; }
.home-hero::after { width: 7rem; height: 7rem; right: 2.5rem; bottom: -5rem; }
.hero-copy { position: relative; z-index: 1; }
.hero-topline { display: flex; align-items: center; justify-content: space-between; }
.hero-topline > span { font-size: 0.68rem; opacity: 0.72; }
.hero-kicker { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.03em; opacity: 0.84; }
.hero-days-row { display: flex; align-items: baseline; gap: 0.55rem; margin-top: 1.1rem; }
.hero-days-row > span { font-size: 0.82rem; font-weight: 700; opacity: 0.8; }
.hero-days {
  margin: 0;
  font-family: Georgia, "Songti SC", serif;
  font-size: clamp(3.2rem, 13vw, 4.25rem);
  font-weight: 600;
  letter-spacing: -0.07em;
  line-height: 0.95;
}
.hero-caption { margin-top: 0.55rem; font-size: 0.75rem; opacity: 0.78; }
.hero-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.18); padding-top: 0.85rem;
}
.hero-stats > div { display: flex; align-items: baseline; gap: 0.32rem; }
.hero-stats strong { font-family: Georgia, "Songti SC", serif; font-size: 1rem; font-weight: 600; }
.hero-stats span { font-size: 0.62rem; opacity: 0.68; }

.quick-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; margin-bottom: 1.7rem; }
.quick-card {
  position: relative;
  display: flex;
  min-height: 6.5rem;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(240, 222, 219, 0.95);
  border-radius: 1.35rem;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  padding: 0.9rem;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.quick-card::after { position: absolute; top: 0.9rem; right: 0.9rem; width: 0.38rem; height: 0.38rem; border-radius: 50%; background: #e9c8cd; content: ""; }
.quick-card:nth-child(2)::after { background: #e8b98f; }
.quick-card:nth-child(3)::after { background: #bcb4d9; }
.quick-card:nth-child(4)::after { background: #bf9d77; }
.quick-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--line-strong); }
.quick-card:active { transform: scale(0.98); }
.quick-index { color: var(--berry); font-family: Georgia, serif; font-size: 0.72rem; letter-spacing: 0.08em; }
.quick-label { color: var(--ink); font-size: 0.78rem; font-weight: 700; }
.quick-hint { margin-top: 0.15rem; color: var(--muted); font-size: 0.65rem; }

.section-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.8rem; padding: 0 0.25rem; }
.section-title { color: var(--ink); font-size: 0.88rem; font-weight: 700; }
.section-note { color: var(--muted); font-size: 0.7rem; }

.moment-card,
.trip-card,
.map-surface,
.empty-state {
  border: 1px solid rgba(240, 222, 219, 0.95);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.moment-card { border-radius: 1.4rem; transition: transform 0.18s ease, box-shadow 0.18s ease; }
.moment-card:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.moment-card:active { transform: scale(0.99); }
.moment-card .p-4 { padding: 1.05rem 1.1rem; }
.moment-card h3 { color: var(--ink); font-size: 1rem; }
.moment-card p { line-height: 1.65; }
.moment-card img { filter: saturate(0.94) contrast(0.98); }
.moment-card .text-stone-400 { color: #a18b8f; }
.moment-card .text-stone-600 { color: #625155; }
.moment-card .text-rose-400 { color: var(--berry); }

.empty-state { border-radius: 1.5rem; color: var(--muted); padding: 2.25rem 1.5rem; text-align: center; }
.empty-state p { line-height: 1.75; }

.primary-action {
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #cb6077, var(--berry-deep));
  box-shadow: 0 9px 18px rgba(151, 56, 78, 0.2);
  color: white;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.58rem 0.85rem;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.primary-action:hover { box-shadow: 0 12px 23px rgba(151, 56, 78, 0.26); transform: translateY(-1px); }
.primary-action:active { transform: scale(0.97); }

.trip-card { border-radius: 1.35rem; overflow: hidden; transition: transform 0.18s ease, box-shadow 0.18s ease; }
.trip-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.trip-card:active { transform: scale(0.99); }
.trip-icon { border-radius: 1rem; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6); }
.trip-count { color: var(--berry); font-family: Georgia, "Songti SC", serif; font-size: 1.3rem; line-height: 1; }

/* 恋爱基金 */
.fund-hero {
  position: relative; overflow: hidden; border-radius: 1.75rem;
  background: linear-gradient(135deg, #3f3235 0%, #241d20 100%);
  box-shadow: 0 18px 42px rgba(56, 39, 43, 0.2); color: white; padding: 1.35rem;
}
.fund-hero::after {
  position: absolute; width: 11rem; height: 11rem; right: -4rem; top: -5rem;
  border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 50%; content: "";
}
.fund-hero-copy { position: relative; z-index: 1; }
.fund-hero-copy > p { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.12em; opacity: 0.62; }
.fund-balance { margin-top: 0.42rem; font-family: Georgia, "Songti SC", serif; font-size: clamp(2.4rem, 11vw, 3.25rem); font-variant-numeric: tabular-nums; letter-spacing: -0.045em; line-height: 1; }
.fund-balance span { margin-right: 0.35rem; font-size: 1rem; opacity: 0.58; vertical-align: 0.8rem; }
.fund-total-line { display: flex; align-items: center; gap: 0.55rem; margin-top: 0.85rem; font-size: 0.62rem; opacity: 0.58; }
.fund-total-line i { width: 1px; height: 0.65rem; background: rgba(255, 255, 255, 0.3); }
.fund-actions { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 0.65rem; margin-top: 1.35rem; }
.fund-action { display: flex; align-items: center; justify-content: center; gap: 0.38rem; height: 2.8rem; border-radius: 0.9rem; font-size: 0.75rem; font-weight: 800; transition: transform 0.16s ease, background 0.16s ease; }
.fund-action:active { transform: scale(0.98); }
.fund-action span { font-size: 1rem; font-weight: 400; }
.fund-action-save { background: #f7e4e7; color: #953b50; }
.fund-action-save:hover { background: #fff0f2; }
.fund-action-spend { border: 1px solid rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.9); }
.fund-action-spend:hover { background: rgba(255, 255, 255, 0.14); }

.fund-month-card {
  margin-top: 0.85rem; border: 1px solid rgba(240, 222, 219, 0.95); border-radius: 1.35rem;
  background: var(--surface); box-shadow: var(--shadow-sm); padding: 1rem 1.05rem;
}
.fund-section-head { display: flex; align-items: flex-end; justify-content: space-between; }
.fund-section-head p { color: var(--berry); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.14em; }
.fund-section-head h2 { margin-top: 0.08rem; font-size: 0.9rem; font-weight: 800; }
.fund-section-head > span { color: var(--muted); font-size: 0.62rem; }
.fund-month-numbers { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; margin-top: 0.9rem; }
.fund-month-numbers > div { border-radius: 0.9rem; background: rgba(251, 243, 240, 0.86); padding: 0.7rem 0.75rem; }
.fund-month-numbers span { display: block; color: var(--muted); font-size: 0.62rem; }
.fund-month-numbers strong { display: block; margin-top: 0.18rem; color: var(--ink); font-size: 0.85rem; font-variant-numeric: tabular-nums; }
.fund-flow-bar { display: flex; height: 0.28rem; overflow: hidden; margin-top: 0.8rem; border-radius: 999px; background: #eee6e4; }
.fund-flow-bar i { display: block; height: 100%; }
.fund-flow-save { background: var(--berry); }
.fund-flow-spend { background: #51464a; }

.fund-ledger-head { display: flex; align-items: flex-end; justify-content: space-between; margin: 1.55rem 0 0.75rem; padding: 0 0.2rem; }
.fund-ledger-head h2 { color: var(--ink); font-size: 1rem; font-weight: 800; }
.fund-ledger-head .page-kicker { margin-bottom: 0.1rem; font-size: 0.56rem; }
.fund-tabs { display: flex; gap: 0.25rem; }
.fund-tabs a { border-radius: 999px; color: var(--muted); font-size: 0.65rem; font-weight: 700; padding: 0.34rem 0.55rem; }
.fund-tabs a.is-active { background: var(--berry-soft); color: var(--berry-deep); }
.fund-ledger { display: grid; gap: 0.55rem; }
.fund-entry {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center; gap: 0.75rem; border: 1px solid rgba(240, 222, 219, 0.9);
  border-radius: 1.15rem; background: var(--surface); box-shadow: var(--shadow-sm); padding: 0.85rem 0.9rem;
}
.fund-entry-mark { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: 0.78rem; font-size: 0.65rem; font-weight: 900; }
.fund-entry-mark.deposit { background: var(--berry-soft); color: var(--berry-deep); }
.fund-entry-mark.expense { background: #eee9e7; color: #665a5e; }
.fund-entry-copy > div { display: flex; align-items: baseline; gap: 0.45rem; }
.fund-entry-copy strong { color: var(--ink); font-size: 0.78rem; }
.fund-entry-copy span { color: var(--muted); font-size: 0.58rem; }
.fund-entry-copy p { overflow: hidden; margin-top: 0.18rem; color: var(--muted); font-size: 0.66rem; text-overflow: ellipsis; white-space: nowrap; }
.fund-entry-amount { font-size: 0.78rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.fund-entry-amount.deposit { color: var(--berry); }
.fund-entry-amount.expense { color: #5f5357; }
.fund-entry-delete { position: absolute; top: 0.28rem; right: 0.38rem; color: transparent; font-size: 0.8rem; line-height: 1; transition: color 0.15s ease; }
.fund-entry:hover .fund-entry-delete { color: #c8b7ba; }

.fund-form { display: grid; gap: 1rem; }
.fund-form > label,
.fund-form-grid label { color: #756266; font-size: 0.7rem; font-weight: 700; }
.fund-form input,
.fund-form select { width: 100%; height: 2.85rem; margin-top: 0.32rem; border: 1px solid var(--line-strong); border-radius: 0.82rem; background: #fffdfc; color: var(--ink); padding: 0 0.75rem; outline: 0; }
.fund-form input:focus,
.fund-form select:focus { border-color: #d48392; }
.fund-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
.fund-amount-input { position: relative; }
.fund-amount-input span { position: absolute; left: 0.85rem; top: 1.2rem; z-index: 1; color: var(--berry); font-family: Georgia, serif; }
.fund-amount-input input { height: 3.5rem; padding-left: 2rem; font-family: Georgia, serif; font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.fund-form button[type="submit"] { height: 3rem; border-radius: 0.9rem; background: linear-gradient(135deg, #cb6077, var(--berry-deep)); box-shadow: 0 10px 20px rgba(151, 56, 78, 0.18); color: white; font-size: 0.8rem; font-weight: 800; }

/* 共同计划 */
.plans-hero {
  position: relative; display: grid; gap: 1.2rem; overflow: hidden; border-radius: 1.75rem;
  background: linear-gradient(135deg, #47363e 0%, #251f2a 100%); box-shadow: 0 18px 42px rgba(56, 39, 43, 0.2); color: white; padding: 1.35rem;
}
.plans-hero::after { position: absolute; right: -3.5rem; bottom: -5.5rem; width: 12rem; height: 12rem; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 50%; content: ""; }
.plans-hero-copy { position: relative; z-index: 1; }
.plans-hero-copy > p { font-size: 0.6rem; font-weight: 800; letter-spacing: 0.16em; opacity: 0.58; }
.plans-hero-copy h2 { margin-top: 0.45rem; font-family: Georgia, "Songti SC", serif; font-size: clamp(1.7rem, 8vw, 2.35rem); letter-spacing: -0.04em; line-height: 1; }
.plans-hero-copy > span { display: block; margin-top: 0.7rem; font-size: 0.7rem; line-height: 1.6; opacity: 0.68; }
.plans-action { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 0.38rem; height: 2.85rem; border-radius: 0.92rem; background: #f6e4e6; color: #8e394e; font-size: 0.76rem; font-weight: 800; transition: transform 0.16s ease, background 0.16s ease; }
.plans-action b { font-size: 1.05rem; font-weight: 400; }
.plans-action:hover { background: #fff0f2; }
.plans-action:active { transform: scale(0.98); }
.plans-section { margin-top: 1.55rem; }
.plans-section-head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 0.72rem; padding: 0 0.2rem; }
.plans-section-head p { color: var(--berry); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.14em; }
.plans-section-head h2 { margin-top: 0.08rem; color: var(--ink); font-size: 0.95rem; font-weight: 800; }
.plans-section-head > span { color: var(--muted); font-size: 0.62rem; }
.plans-list { display: grid; gap: 0.58rem; }
.plan-card { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; border: 1px solid rgba(240, 222, 219, 0.92); border-radius: 1.2rem; background: var(--surface); box-shadow: var(--shadow-sm); padding: 0.78rem; transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease; }
.plan-card:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.plan-date { display: grid; width: 2.55rem; height: 2.55rem; place-content: center; border-radius: 0.84rem; background: var(--berry-soft); color: var(--berry-deep); text-align: center; }
.plan-date strong { font-family: Georgia, "Songti SC", serif; font-size: 1rem; line-height: 0.9; }
.plan-date span { margin-top: 0.14rem; font-size: 0.5rem; font-weight: 800; }
.plan-date.range { background: #eee8de; color: #806745; }
.plan-date.someday { background: #ece8ee; color: #6f6176; }
.plan-card-copy { min-width: 0; }
.plan-card-copy > div { display: flex; align-items: baseline; gap: 0.4rem; min-width: 0; }
.plan-card-copy h3 { overflow: hidden; color: var(--ink); font-size: 0.79rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.plan-card-copy p { overflow: hidden; margin-top: 0.18rem; color: var(--muted); font-size: 0.65rem; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.plan-card-actions { display: flex; align-items: center; gap: 0.38rem; }
.plan-toggle { min-width: 3.6rem; height: 2rem; border: 1px solid #e2b5bd; border-radius: 999px; color: var(--berry-deep); font-size: 0.62rem; font-weight: 800; transition: background 0.16s ease, color 0.16s ease; }
.plan-toggle:hover { background: var(--berry-soft); }
.plan-delete { width: 1.4rem; color: #c8b7ba; font-size: 0.9rem; line-height: 1; }
.plan-card.is-done { opacity: 0.62; }
.plan-card.is-done .plan-date { background: #ede8e7; color: #766a6d; }
.plan-card.is-done .plan-card-copy h3 { text-decoration: line-through; }
.plan-card.is-done .plan-toggle { border-color: #d9d1d0; color: #766a6d; }
.plan-card.is-overdue .plan-date { background: #eee9e7; color: #78696c; }
.plans-empty { border: 1px dashed #e6d5d3; border-radius: 1.15rem; background: rgba(255, 253, 252, 0.58); color: var(--muted); padding: 1.25rem; text-align: center; }
.plans-empty p { font-size: 0.7rem; line-height: 1.7; }
.plans-completed { padding-bottom: 0.2rem; }
.plan-form { display: grid; gap: 1rem; }
.plan-form label { color: #756266; font-size: 0.7rem; font-weight: 700; }
.plan-form input, .plan-form select, .plan-form textarea { width: 100%; margin-top: 0.32rem; border: 1px solid var(--line-strong); border-radius: 0.82rem; background: #fffdfc; color: var(--ink); outline: 0; padding: 0 0.75rem; }
.plan-form input, .plan-form select { height: 2.9rem; }
.plan-form textarea { min-height: 5.2rem; padding: 0.7rem 0.75rem; line-height: 1.55; resize: vertical; }
.plan-form input:focus, .plan-form select:focus, .plan-form textarea:focus { border-color: #d48392; box-shadow: 0 0 0 3px rgba(188, 83, 107, 0.08); }
.plan-time-fields { display: grid; gap: 0.7rem; }
.plan-time-fields[data-plan-timing="range"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.plan-form-hint { margin: -0.25rem 0 0; color: var(--muted); font-size: 0.62rem; line-height: 1.6; }
.plan-form button[type="submit"] { height: 3rem; border-radius: 0.9rem; background: linear-gradient(135deg, #cb6077, var(--berry-deep)); box-shadow: 0 10px 20px rgba(151, 56, 78, 0.18); color: white; font-size: 0.8rem; font-weight: 800; }

.search-panel {
  margin-bottom: 1.25rem; border: 1px solid rgba(240, 222, 219, 0.95);
  border-radius: 1.5rem; background: var(--surface); box-shadow: var(--shadow-sm); padding: 1rem;
}
.search-box {
  display: flex; align-items: center; gap: 0.65rem; border: 1px solid var(--line-strong);
  border-radius: 1rem; background: rgba(255, 253, 252, 0.94); padding: 0 0.9rem;
}
.search-box:focus-within { border-color: #d48392; box-shadow: 0 0 0 3px rgba(188, 83, 107, 0.08); }
.search-icon { width: 0.9rem; height: 0.9rem; flex: none; fill: none; stroke: var(--berry); stroke-linecap: round; stroke-width: 1.8; }
.search-box input { width: 100%; height: 3rem; outline: 0; background: transparent; color: var(--ink); font-size: 0.88rem; }
.search-box input::placeholder { color: #b5a3a6; }
.search-kind { display: flex; gap: 0.45rem; margin-top: 0.8rem; }
.search-kind-option {
  border: 1px solid var(--line); border-radius: 999px; color: var(--muted);
  cursor: pointer; font-size: 0.7rem; font-weight: 700; padding: 0.38rem 0.72rem;
}
.search-kind-option:has(input:checked) { border-color: #df9dab; background: var(--berry-soft); color: var(--berry-deep); }
.search-kind-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.search-filters { margin-top: 0.75rem; border-top: 1px solid var(--line); padding-top: 0.7rem; }
.search-filters summary { color: var(--muted); cursor: pointer; font-size: 0.7rem; font-weight: 700; list-style: none; }
.search-filters summary::-webkit-details-marker { display: none; }
.search-filter-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem; margin-top: 0.75rem; }
.search-filter-grid label { color: var(--muted); font-size: 0.65rem; font-weight: 700; }
.search-filter-grid select,
.search-filter-grid input {
  width: 100%; height: 2.6rem; margin-top: 0.25rem; border: 1px solid var(--line-strong);
  border-radius: 0.75rem; background: rgba(255, 253, 252, 0.94); color: var(--ink); padding: 0 0.65rem;
  font-size: 0.75rem; outline: 0;
}
.search-filter-grid select:focus,
.search-filter-grid input:focus { border-color: #d48392; }
.search-reset { color: var(--berry); font-size: 0.68rem; font-weight: 700; }
.search-result-head { display: flex; align-items: center; justify-content: space-between; margin: 1.2rem 0 0.75rem; padding: 0 0.25rem; }
.search-result-head h2 { color: var(--ink); font-size: 0.86rem; font-weight: 800; }
.search-result-head span { color: var(--muted); font-size: 0.68rem; }
.search-section-title { margin: 1rem 0 0.65rem; color: var(--muted); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.08em; }
.search-loading { display: none; color: var(--muted); font-size: 0.65rem; }
.htmx-request .search-loading,
.htmx-request.search-loading { display: inline; }

.trip-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 1.75rem;
  box-shadow: var(--shadow);
}
.trip-hero::after { position: absolute; right: -2.6rem; bottom: -4rem; width: 10rem; height: 10rem; border: 1px solid rgba(255, 255, 255, 0.25); border-radius: 50%; content: ""; }
.back-link { color: var(--muted); transition: color 0.15s ease; }
.back-link:hover { color: var(--berry); }

.map-surface { position: relative; border-radius: 1.55rem; overflow: hidden; background: #f6efeb; }
.map-shell { height: calc(100vh - 13.5rem); min-height: 360px; background: #f6efeb; }
.map-legend {
  position: absolute; z-index: 45; right: 0.75rem; bottom: 0.75rem;
  display: flex; gap: 0.75rem; border: 1px solid rgba(226, 211, 209, 0.9);
  border-radius: 999px; background: rgba(255, 250, 247, 0.92);
  box-shadow: var(--shadow-sm); color: #746267; font-size: 11px; font-weight: 700;
  padding: 0.45rem 0.7rem; backdrop-filter: blur(10px);
}
.map-legend span { display: inline-flex; align-items: center; gap: 0.35rem; }
.map-dot { width: 0.55rem; height: 0.55rem; border-radius: 999px; }
.map-dot-unvisited { background: #171518; }
.map-dot-visited { background: #d45f79; }

.app-nav {
  border-color: rgba(240, 222, 219, 0.9);
  background: rgba(255, 250, 247, 0.9);
  box-shadow: 0 -8px 28px rgba(109, 63, 70, 0.06);
}
.app-nav .nav-btn { position: relative; color: #a08a8f; font-weight: 600; letter-spacing: 0.02em; transition: color 0.15s ease, transform 0.15s ease; }
.app-nav .nav-btn:hover { color: var(--berry); transform: translateY(-1px); }
.app-nav .nav-btn.text-rose-500 { color: var(--berry); }
.app-nav .nav-btn.text-rose-500::before { position: absolute; top: 0.82rem; width: 0.22rem; height: 0.22rem; border-radius: 999px; background: currentColor; content: ""; }
.compose-button { min-width: 3.4rem; }
.compose-orb {
  width: 3.35rem;
  height: 3.35rem;
  border: 4px solid var(--paper);
  border-radius: 1.15rem;
  background: linear-gradient(145deg, #d27085, var(--berry-deep));
  box-shadow: 0 12px 24px rgba(151, 56, 78, 0.31);
  font-size: 1.65rem;
}

#modal { padding: 1rem; }
#modal > div:first-child { border-radius: 1.35rem; }
#modal > div.relative {
  margin-top: max(1.5rem, env(safe-area-inset-top));
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 1.6rem;
  box-shadow: 0 24px 64px rgba(57, 28, 35, 0.28);
}
#modal-title { color: var(--ink); font-family: Georgia, "Songti SC", serif; font-size: 1.05rem; }
#modal-content { padding: 1.15rem; }
#modal:not(.hidden) > div.relative { animation: modalIn 0.22s ease both; }
@keyframes modalIn { from { opacity: 0; transform: translateY(10px) scale(0.99); } to { opacity: 1; transform: none; } }
#modal-content input:not([type="file"]),
#modal-content textarea,
#modal-content select {
  border-color: var(--line-strong) !important;
  border-radius: 0.85rem !important;
  background: rgba(255, 253, 252, 0.92) !important;
  color: var(--ink);
  box-shadow: none;
}
#modal-content input:focus,
#modal-content textarea:focus,
#modal-content select:focus { border-color: #d48392 !important; }
#modal-content button[type="submit"],
#cp-add-btn {
  border-radius: 0.95rem !important;
  background: linear-gradient(135deg, #cc6178, var(--berry-deep)) !important;
  box-shadow: 0 10px 18px rgba(151, 56, 78, 0.2) !important;
}

#city-panel { border-left: 1px solid var(--line); animation: slideIn 0.25s ease; }
@keyframes slideIn { from { transform: translateX(100%); } to { transform: translateX(0); } }

.amap-info { max-width: 220px; }
.amap-info .popup-photo { width: 200px; border-radius: 0.8rem; margin-bottom: 0.55rem; }
.amap-pop-meta { font-size: 11px; color: #9f898e; }
.amap-pop-title { color: var(--ink); font-weight: 700; margin: 3px 0; }
.amap-pop-content { color: #625155; font-size: 12px; line-height: 1.55; white-space: pre-wrap; }
.amap-pop-place { color: var(--berry); font-size: 11px; margin-top: 3px; }
.amap-pop-title-sm { color: var(--ink); font-size: 13px; font-weight: 700; margin: 3px 0; }
.amap-pop-more { color: #9f898e; font-size: 11px; margin-top: 4px; }

.amap-back-btn {
  position: absolute; z-index: 50; top: 0.75rem; left: 0.75rem;
  border: 1px solid var(--line); border-radius: 0.75rem;
  background: rgba(255, 255, 255, 0.94); box-shadow: var(--shadow-sm);
  color: var(--berry); font-size: 12px; font-weight: 700; padding: 0.45rem 0.75rem;
}

.app-toast {
  position: fixed; z-index: 80; left: 50%; bottom: 6rem; transform: translate(-50%, 8px);
  border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 999px;
  background: rgba(55, 43, 47, 0.94); box-shadow: 0 12px 30px rgba(45, 31, 35, 0.2);
  color: white; font-size: 0.7rem; font-weight: 700; opacity: 0; padding: 0.55rem 0.85rem;
  pointer-events: none; transition: opacity 0.18s ease, transform 0.18s ease;
}
.app-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

.login-shell { display: grid; max-width: 22rem; gap: 2rem; }
.login-intro { padding-top: 0.5rem; }
.login-eyebrow { margin-bottom: 0.7rem; color: var(--berry); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.2em; }
.login-brand { color: var(--ink); font-family: Georgia, "Songti SC", serif; font-size: 2.85rem; font-weight: 600; letter-spacing: -0.06em; line-height: 1.06; }
.login-subtitle { margin-top: 1rem; color: var(--muted); font-size: 0.82rem; line-height: 1.75; }
.login-card { border: 1px solid rgba(236, 216, 212, 0.92); border-radius: 1.35rem; background: rgba(255, 255, 255, 0.76); box-shadow: 0 16px 38px rgba(108, 57, 68, 0.08); }
.login-form-heading { margin-bottom: 1.1rem; }
.login-form-heading p { color: var(--ink); font-size: 1rem; font-weight: 800; }
.login-form-heading span { color: var(--muted); font-size: 0.7rem; }
.login-card label { color: #756266; font-size: 0.7rem; font-weight: 700; }
.login-card input { height: 3.15rem; border-color: var(--line-strong) !important; border-radius: 0.8rem !important; background: rgba(255, 253, 252, 0.92) !important; font-size: 0.9rem; }
.login-card button { height: 3.15rem; border-radius: 0.8rem !important; background: linear-gradient(135deg, #c75c74, var(--berry-deep)) !important; box-shadow: 0 10px 18px rgba(151, 56, 78, 0.16) !important; font-size: 0.88rem; }
.login-private { color: #b6a3a6; font-size: 0.58rem; font-weight: 700; letter-spacing: 0.18em; text-align: center; }

@media (min-width: 640px) {
  .app-main { padding-top: 2.25rem; }
  .home-hero { padding: 1.8rem; }
  .quick-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .quick-card { min-height: 7rem; padding: 1.05rem; }
  .search-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fund-hero { display: grid; grid-template-columns: 1fr 14rem; align-items: end; gap: 1.5rem; padding: 1.6rem; }
  .fund-actions { margin-top: 0; }
  .plans-hero { grid-template-columns: 1fr 10.5rem; align-items: end; gap: 1.5rem; padding: 1.6rem; }
}

@media (max-width: 639px) {
  #modal { padding: 0; }
  #modal > div.relative {
    position: absolute; right: 0.6rem; bottom: calc(5rem + env(safe-area-inset-bottom)); left: 0.6rem;
    width: auto; max-height: calc(100vh - 7rem); margin: 0; border-radius: 1.45rem;
  }
  #modal-content { max-height: calc(100vh - 12rem); }
  .fund-entry-delete { color: #c8b7ba; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

@media (min-width: 768px) {
  body.login-body { align-items: center; padding: 3rem; }
  .login-shell {
    max-width: 58rem;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 23rem);
    align-items: center;
    column-gap: 6rem;
    row-gap: 1.25rem;
  }
  .login-intro { grid-column: 1; grid-row: 1 / span 2; padding: 0; }
  .login-brand { font-size: 4rem; }
  .login-subtitle { font-size: 0.9rem; }
  .login-card { grid-column: 2; grid-row: 1; }
  .login-private { grid-column: 2; grid-row: 2; }
}