:root {
  --paper: #363636;
  --paper-deep: #2a2a2a;
  --surface: #404040;
  --surface-soft: #474747;
  --ink: #d7ddd2;
  --muted: #a9aaa6;
  --wine: #8c3232;
  --wine-deep: #682323;
  --gold: #d0a565;
  --sage: #99a696;
  --line: rgba(226, 226, 214, 0.12);
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.24);
  --chrome: rgba(140, 50, 50, .97);
  --chrome-text: #f1e8df;
  --chrome-active: #fff0c4;
  --hero-start: #532727;
  --hero-mid: #8c3232;
  --hero-end: #a84c45;
  --hero-ink: #f5ece3;
  color-scheme: dark;
}

:root[data-theme="day"] {
  --paper: #f2efe9;
  --paper-deep: #e8e4dd;
  --surface: #fbfaf7;
  --surface-soft: #eee9e2;
  --ink: #3f3c38;
  --muted: #807c75;
  --wine: #9bb29f;
  --wine-deep: #7f9986;
  --gold: #9e713d;
  --sage: #7d8c7c;
  --line: rgba(71, 59, 48, 0.14);
  --shadow: 0 18px 50px rgba(72, 49, 32, 0.12);
  --chrome: rgba(184, 196, 180, .97);
  --chrome-text: #242823;
  --chrome-active: #526b59;
  --hero-start: #e8e3d9;
  --hero-mid: #ded8ca;
  --hero-end: #bdc8b8;
  --hero-ink: #353a34;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
html, body { margin: 0; min-height: 100%; max-width: 100%; overflow-x: hidden; overflow-x: clip; overscroll-behavior-x: none; background: var(--paper-deep); }
body { color: var(--ink); font-family: "Noto Serif SC", "Noto Serif", "Songti SC", Georgia, serif; -webkit-font-smoothing: antialiased; }
body.modal-open { overflow: hidden; }
button, textarea { font: inherit; }
button { color: inherit; }

.app-shell { min-height: 100svh; width: min(100%, 520px); max-width: 100%; margin: 0 auto; overflow-x: hidden; overflow-x: clip; background: var(--paper); position: relative; box-shadow: 0 0 50px rgba(0,0,0,.24); }
.topbar { position: fixed; z-index: 50; top: 0; left: 50%; transform: translateX(-50%); width: min(100%, 520px); height: 54px; padding: 0 15px; display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: 8px; align-items: center; background: rgba(140,50,50,.96); border-bottom: 1px solid rgba(255,255,255,.09); backdrop-filter: blur(18px); color: #f1e8df; }
.brand { min-width: 0; display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; letter-spacing: .12em; white-space: nowrap; }.brand span { min-width:0;overflow:hidden;text-overflow:ellipsis }
.brand-mark { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid rgba(255,255,255,.55); border-radius: 50% 50% 46% 54%; font-size: 12px; transform: rotate(-5deg); }
.brand-logo { width: 34px; height: 29px; object-fit: contain; filter: drop-shadow(0 1px 1px rgba(0,0,0,.18)); }
.location-button, .icon-button, .language-button { border: 0; background: transparent; cursor: pointer; }
.location-button { width:100%;min-width: 0; padding: 9px 0; display: flex; align-items: center; gap: 5px; font-size: 12px; justify-self: start; }.location-button #current-city { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.location-mark { flex:0 0 auto;font-size: 17px; }.chevron { flex:0 0 auto;opacity: .68; }.topbar-actions { min-width:0;justify-self:end;display:flex;align-items:center;justify-content:flex-end;gap:2px }.language-button { min-width:34px;height:30px;padding:0 7px;border:1px solid color-mix(in srgb,currentColor 32%,transparent);border-radius:14px;color:inherit;font:700 9px/1 system-ui,sans-serif;letter-spacing:.04em }.icon-button { width: 34px; height: 36px; font-size: 18px; }

.main-content { min-height: 100svh; padding: 54px 0 calc(78px + env(safe-area-inset-bottom)); }
.view { display: none; min-height: calc(100svh - 132px); padding: 18px 16px 32px; overflow-x: hidden; overflow-x: clip; animation: reveal .28s ease; }
.view.active { display: block; }
@keyframes reveal { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }

.hero-card { min-height: 205px; padding: 29px 23px; position: relative; overflow: hidden; display: flex; align-items: center; border-radius: 20px; background: linear-gradient(135deg, #532727 0%, #8c3232 58%, #a84c45 100%); box-shadow: var(--shadow); color: #f5ece3; }
.hero-card::after { content: ""; position: absolute; inset: 0; opacity: .09; background-image: repeating-linear-gradient(7deg, transparent 0 8px, #fff 9px 10px); }
.hero-copy { position: relative; z-index: 2; width: 69%; }.eyebrow, .section-kicker, .modal-kicker { color: var(--gold); font: 600 9px/1.4 system-ui, sans-serif; letter-spacing: .2em; }
.hero-card .eyebrow { color: #e5c79d; }.hero-copy h1 { margin: 10px 0 8px; font-size: 25px; line-height: 1.38; letter-spacing: .06em; }.hero-copy p { margin: 0; max-width: 220px; font-size: 11px; line-height: 1.8; opacity: .75; }
.hero-orbit { position: absolute; right: -12px; top: 23px; width: 145px; height: 158px; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; transform: rotate(-12deg); z-index: 1; }
.hero-orbit::before { content: ""; position: absolute; inset: 22px; border: 1px dashed rgba(255,255,255,.2); border-radius: 50%; }.hero-orbit span { position: absolute; inset: 50px; display: grid; place-items: center; color: #5b2b28; background: #e3d2ba; border-radius: 50%; font-size: 21px; box-shadow: 0 8px 24px rgba(0,0,0,.2); }
.paper { position: absolute; width: 24px; height: 32px; border-radius: 2px; background: #eee2cf; box-shadow: 0 5px 12px rgba(0,0,0,.18); }.paper::after { content: ""; position: absolute; left: 5px; right: 5px; top: 9px; height: 1px; background: #9b7664; box-shadow: 0 5px #9b7664, 0 10px #9b7664; opacity: .55; }.paper-one { top: 5px; left: 26px; transform: rotate(28deg); }.paper-two { bottom: 9px; right: 21px; transform: rotate(-15deg); }

.privacy-strip { display: flex; align-items: center; gap: 11px; margin: 14px 1px 24px; padding: 12px 14px; background: color-mix(in srgb, var(--sage) 11%, transparent); border: 1px solid color-mix(in srgb, var(--sage) 24%, transparent); border-radius: 13px; }.privacy-icon { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 auto; border-radius: 50%; background: color-mix(in srgb, var(--sage) 24%, transparent); color: var(--sage); }.privacy-strip strong, .privacy-strip small { display: block; }.privacy-strip strong { font-size: 12px; }.privacy-strip small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 13px; }.section-heading h2 { margin: 3px 0 0; font-size: 20px; }.text-button { padding: 7px 0; border: 0; color: var(--gold); background: transparent; font-size: 11px; cursor: pointer; }
.filter-row { display: flex; gap: 8px; margin: 0 0 15px; overflow: auto; overscroll-behavior-inline: contain; scrollbar-width: none; }.filter-row::-webkit-scrollbar { display: none; }.filter-chip { padding: 7px 14px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); color: var(--muted); font-size: 11px; cursor: pointer; }.filter-chip.active { border-color: var(--wine); background: var(--wine); color: #fff4e8; }

.place-list { display: grid; gap: 12px; }.place-card { display: grid; grid-template-columns: 112px 1fr; min-height: 136px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 5px 16px rgba(0,0,0,.09); cursor: pointer; transition: transform .18s, border-color .18s; }.place-card:hover,.place-card:focus-visible { transform: translateY(-2px); border-color: color-mix(in srgb,var(--wine) 52%,var(--line)); outline:none }.place-photo { position: relative; background-position: center; background-size: cover; }.place-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 65%, rgba(0,0,0,.15)); }.place-type { position: absolute; z-index: 1; left: 9px; top: 9px; padding: 4px 7px; border-radius: 9px; background: rgba(250,246,238,.9); color: #70403a; font: 600 9px system-ui; }
.place-body { min-width: 0; padding: 13px 13px 11px; display: flex; flex-direction: column; }.place-body h3 { margin: 0; display:flex;align-items:center;justify-content:space-between;gap:6px;font-size: 16px; }.place-detail-arrow{color:var(--muted);font:normal 20px/1 system-ui}.place-subtitle { margin: 4px 0 9px; color: var(--muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.place-tags { display: flex; flex-wrap: wrap; gap: 5px; }.place-tags span { padding: 3px 6px; background: var(--surface-soft); border-radius: 6px; color: var(--muted); font: 9px system-ui; }.place-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 10px; }.place-footer small { color: var(--gold); font: 10px system-ui; }.checkin-button { padding: 7px 10px; border: 1px solid color-mix(in srgb, var(--wine) 50%, transparent); border-radius: 14px; color: #f3ded4; background: var(--wine); font-size: 10px; cursor: pointer; }.empty-state { padding: 50px 15px; text-align: center; color: var(--muted); font-size: 13px; }

.quiet-view { padding-top: 52px; text-align: center; }.quiet-art { width: 220px; height: 190px; margin: 0 auto 26px; position: relative; }.quiet-art::before { content: ""; position: absolute; inset: 30px; border: 1px solid var(--line); border-radius: 50%; }.lantern, .tower { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 74px; height: 94px; transform: translate(-50%,-50%); color: #e4d2b6; background: linear-gradient(#983c39,#652724); border-radius: 46% 46% 38% 38%; box-shadow: 0 18px 40px rgba(92,34,32,.3); font-size: 24px; }.lantern::before { content: ""; position: absolute; width: 92px; height: 26px; top: -9px; border-top: 2px solid var(--gold); border-radius: 50%; }.bubble { position: absolute; z-index: 2; padding: 7px 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--muted); font-size: 9px; box-shadow: var(--shadow); }.bubble-a { left: 4px; top: 34px; }.bubble-b { right: 0; bottom: 25px; }.status-pill { display: inline-block; padding: 5px 11px; border: 1px solid color-mix(in srgb, var(--gold) 34%, transparent); border-radius: 13px; color: var(--gold); font-size: 10px; }.quiet-view h1 { margin: 15px 0 11px; font-size: 21px; }.quiet-view > p { max-width: 390px; margin: 0 auto; color: var(--muted); font-size: 12px; line-height: 1.9; }
.book-stack { position: absolute; left: 28px; right: 28px; bottom: 18px; display: grid; gap: 5px; }.book-stack i { height: 13px; border-radius: 3px; background: var(--surface-soft); border: 1px solid var(--line); }.book-stack i:nth-child(2) { margin-left: 20px; background: var(--wine); }.book-stack i:nth-child(3) { margin-right: 14px; background: var(--sage); }.tower { top: 42%; width: 62px; height: 88px; border-radius: 6px 6px 20px 20px; }.tower::before, .tower::after { content: ""; position: absolute; left: 10px; right: 10px; height: 1px; background: rgba(255,255,255,.26); }.tower::before { top: 25px; }.tower::after { bottom: 24px; }
.boundary-card { margin: 28px auto 0; max-width: 390px; padding: 17px 18px; text-align: left; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }.boundary-card > span { color: var(--gold); font-size: 10px; letter-spacing: .08em; }.boundary-card ul { margin: 11px 0 0; padding-left: 18px; color: var(--muted); font-size: 11px; line-height: 2; }

.page-intro { padding: 13px 4px 18px; }.page-intro h1 { margin: 7px 0; font-size: 24px; }.page-intro p { margin: 0; max-width: 430px; color: var(--muted); font-size: 11px; line-height: 1.8; }.external-notice { display: flex; gap: 10px; align-items: center; padding: 12px 14px; margin: 0 0 18px; border-radius: 13px; background: color-mix(in srgb, var(--gold) 10%, transparent); border: 1px solid color-mix(in srgb, var(--gold) 22%, transparent); }.external-notice > span { font-size: 22px; color: var(--gold); }.external-notice p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }.external-notice strong { color: var(--ink); font-size: 12px; }
.event-list { display: grid; gap: 15px; }.event-card { overflow: hidden; border: 1px solid var(--line); border-radius: 17px; background: var(--surface); box-shadow: 0 8px 24px rgba(0,0,0,.1); }.event-cover { height: 145px; position: relative; background-position: center; background-size: cover; }.event-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(27,20,18,.62), transparent 58%); }.event-tag { position: absolute; z-index: 2; left: 12px; top: 12px; padding: 5px 8px; border-radius: 10px; background: rgba(250,246,238,.91); color: #6f302d; font: 600 9px system-ui; }.event-date { position: absolute; z-index: 2; left: 13px; bottom: 10px; color: #fff; font-size: 11px; }.event-body { padding: 15px; }.event-body h2 { margin: 0 0 11px; font-size: 17px; line-height: 1.5; }.event-meta { display: grid; gap: 7px; color: var(--muted); font-size: 10px; }.event-meta span b { display: inline-block; width: 18px; color: var(--gold); }.event-description { margin: 12px 0; padding-top: 11px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; line-height: 1.75; }.event-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.event-host { min-width: 0; }.event-host small, .event-host strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.event-host small { color: var(--muted); font-size: 9px; }.event-host strong { margin-top: 2px; font-size: 11px; }.external-button { flex: 0 0 auto; padding: 9px 13px; border-radius: 16px; color: #fff0e6; background: var(--wine); font-size: 10px; text-decoration: none; }

.profile-view { padding: 0; }.profile-hero { position: relative; min-height: 255px; padding: 30px 20px 24px; text-align: center; background: linear-gradient(145deg, var(--wine), var(--wine-deep)); color: #f5eae2; }.profile-hero::after { content: ""; position: absolute; inset: 0; opacity: .08; background: repeating-radial-gradient(circle at 30% 20%, #fff 0 1px, transparent 1px 9px); }.profile-hero > * { position: relative; z-index: 1; }.profile-theme { position: absolute; right: 15px; top: 13px; border: 0; background: transparent; color: #fff; font-size: 18px; cursor: pointer; }.avatar { width: 64px; height: 64px; margin: 2px auto 9px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; background: rgba(255,255,255,.11); font-size: 23px; }.profile-hero h1 { margin: 0; font-size: 17px; }.profile-hero > p { margin: 5px 0 18px; opacity: .62; font-size: 10px; }.profile-stats { display: flex; justify-content: center; align-items: stretch; gap: 24px; }.profile-stats div { min-width: 55px; }.profile-stats strong, .profile-stats span { display: block; }.profile-stats strong { font: 700 23px system-ui; }.profile-stats span { margin-top: 3px; font-size: 9px; opacity: .68; }.profile-stats i { width: 1px; background: rgba(255,255,255,.2); }
.profile-content { padding: 16px; }.local-card { display: flex; gap: 12px; padding: 15px; margin-bottom: 15px; border: 1px solid color-mix(in srgb, var(--sage) 22%, transparent); border-radius: 14px; background: color-mix(in srgb, var(--sage) 9%, transparent); }.local-icon { display: grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; background: color-mix(in srgb, var(--sage) 24%, transparent); color: var(--sage); }.local-card strong { font-size: 12px; }.local-card p { margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.7; }.settings-group { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; }.settings-group button { width: 100%; padding: 14px; display: flex; gap: 12px; align-items: center; border: 0; border-bottom: 1px solid var(--line); background: var(--surface); text-align: left; cursor: pointer; }.settings-group button:last-child { border-bottom: 0; }.settings-group button > span { width: 27px; text-align: center; color: var(--gold); font-size: 18px; }.settings-group button div { min-width: 0; flex: 1; }.settings-group strong, .settings-group small { display: block; overflow-wrap: anywhere; }.settings-group strong { font-size: 12px; }.settings-group small { margin-top: 3px; color: var(--muted); font-size: 9px; }.settings-group b { color: var(--muted); font-size: 20px; }.version-note { margin-top: 24px; text-align: center; }.version-note span { color: var(--gold); font: 600 8px system-ui; letter-spacing: .2em; }.version-note p { color: var(--muted); font-size: 9px; }

.tabbar { position: fixed; z-index: 50; left: 50%; bottom: 0; transform: translateX(-50%); width: min(100%, 520px); height: calc(66px + env(safe-area-inset-bottom)); padding: 5px 7px calc(6px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5, 1fr); background: rgba(140,50,50,.97); border-top: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(18px); }.tab { display: flex; flex-direction: column; gap: 2px; align-items: center; justify-content: center; border: 0; background: transparent; color: rgba(237,229,218,.58); cursor: pointer; }.tab span { font-size: 18px; line-height: 1; transition: transform .2s; }.tab small { font-size: 9px; }.tab.active { color: #fff0c4; }.tab.active span { transform: translateY(-1px) scale(1.08); }

.modal-backdrop, .city-sheet { position: fixed; z-index: 100; inset: 0; display: flex; align-items: end; justify-content: center; background: rgba(15,12,11,.6); backdrop-filter: blur(3px); }.modal-backdrop[hidden], .city-sheet[hidden] { display: none; }.modal { position: relative; width: min(100%,520px); max-height: 87svh; overflow-y: auto; padding: 24px 20px calc(24px + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; background: var(--paper); box-shadow: 0 -18px 50px rgba(0,0,0,.3); }.modal-handle { width: 36px; height: 4px; margin: -13px auto 18px; border-radius: 2px; background: var(--line); }.modal-close { position: absolute; right: 15px; top: 17px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--surface); color: var(--muted); font-size: 21px; cursor: pointer; }.modal h2 { margin: 7px 0 2px; font-size: 22px; }.modal > p { margin: 0 0 20px; color: var(--muted); font-size: 11px; }.modal label { display: flex; justify-content: space-between; gap:12px;font-size: 12px; }.modal label span { color: var(--sage); font-size: 10px; }.modal label .note-label { color:inherit;font-size:inherit }.modal textarea { width: 100%; min-height: 130px; margin-top: 8px; padding: 13px; resize: vertical; border: 1px solid var(--line); border-radius: 12px; outline: none; background: var(--surface); color: var(--ink); font-size: 12px; line-height: 1.7; }.modal textarea:focus { border-color: var(--wine); }.modal-privacy { margin: 10px 0 16px; color: var(--muted); font-size: 9px; }.primary-button { width: 100%; padding: 13px; border: 0; border-radius: 12px; background: var(--wine); color: #fff0e8; font-weight: 600; cursor: pointer; }.footprints-list { display: grid; gap: 10px; margin-top: 18px; }.footprint-entry { padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }.footprint-entry header { display: flex; justify-content: space-between; gap: 10px; }.footprint-entry strong { font-size: 12px; }.footprint-entry time { color: var(--muted); font: 9px system-ui; }.footprint-entry p { margin: 8px 0 0; color: var(--muted); font-size: 10px; line-height: 1.7; }.footprints-empty { padding: 40px 10px; text-align: center; color: var(--muted); font-size: 11px; }
.about-modal { padding-top: 28px; }.about-modal > h2 { margin-bottom: 17px; padding-right: 38px; }.about-project-card, .about-contact-card { border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }.about-project-card { position: relative; padding: 18px; overflow: hidden; }.about-project-card::after { content: ""; position: absolute; width: 72px; height: 88px; right: -20px; bottom: -28px; border: 1px solid color-mix(in srgb, var(--sage) 13%, transparent); border-radius: 4px 18px 4px 4px; background: linear-gradient(150deg, transparent 0 62%, color-mix(in srgb, var(--sage) 7%, transparent) 63%); transform: rotate(-9deg); pointer-events: none; }.about-section-label { display: block; margin-bottom: 8px; color: var(--sage); font: 600 9px/1.4 system-ui; letter-spacing: .12em; text-transform: uppercase; }.about-project-card p { position: relative; z-index: 1; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.95; overflow-wrap: anywhere; }.about-contact-card { display: flex; align-items: center; gap: 13px; margin-top: 12px; padding: 16px; background: color-mix(in srgb, var(--sage) 8%, var(--surface)); }.about-mark { width: 45px; height: 45px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid color-mix(in srgb, var(--sage) 30%, transparent); border-radius: 50%; background: color-mix(in srgb, var(--sage) 16%, transparent); color: var(--sage); font-size: 18px; }.about-contact-copy { min-width: 0; flex: 1; }.about-contact-copy .about-section-label { margin-bottom: 4px; }.about-contact-copy strong { display: block; font-size: 14px; }.about-contact-copy p { margin: 3px 0 9px; color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }.about-contact-copy a { display: inline-flex; max-width: 100%; flex-wrap: wrap; gap: 3px 8px; color: var(--sage); font: 9px/1.5 system-ui; text-decoration: none; overflow-wrap: anywhere; }.about-contact-copy a span { color: var(--muted); }.about-contact-copy a b { max-width: 100%; font-weight: 600; overflow-wrap: anywhere; }
.city-sheet-panel { width: min(100%,520px); padding: 22px 18px calc(25px + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; background: var(--paper); }.city-sheet-panel > strong { font-size: 16px; }.city-options { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; margin-top: 15px; }.city-options button { padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); cursor: pointer; }
.toast { position: fixed; z-index: 200; left: 50%; bottom: calc(82px + env(safe-area-inset-bottom)); transform: translate(-50%,20px); width: max-content; max-width: calc(100% - 32px); padding: 10px 15px; border-radius: 19px; background: rgba(20,18,17,.9); color: #f5eee7; font: 11px/1.55 system-ui; text-align: center; overflow-wrap: anywhere; opacity: 0; pointer-events: none; transition: .25s; box-shadow: var(--shadow); white-space: normal; }.toast.show { opacity: 1; transform: translate(-50%,0); }

/* 足迹探索工具与完整白天主题 */
.topbar { background: var(--chrome); color: var(--chrome-text); border-bottom-color: var(--line); }
.hero-card { background: linear-gradient(135deg, var(--hero-start), var(--hero-mid) 58%, var(--hero-end)); color: var(--hero-ink); }
.hero-card .eyebrow { color: color-mix(in srgb, var(--hero-ink) 72%, var(--gold)); }
.tabbar { background: var(--chrome); border-top-color: var(--line); }
.tab { color: color-mix(in srgb, var(--chrome-text) 58%, transparent); }
.tab.active { color: var(--chrome-active); }
.tab span svg { width: 20px; height: 20px; display: block; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.explore-tools { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: -10px 0 25px; }
.explore-tools.two-tools { grid-template-columns: repeat(2, 1fr); margin: 10px 0 25px; }
.island-notepad { position: relative; margin: 4px 0 0; padding: 20px 17px 15px; border: 1px solid rgba(178,151,101,.25); border-radius: 4px 5px 14px 4px; background-color: #e9e3c8; background-image: repeating-linear-gradient(to bottom, transparent 0 28px, rgba(126,101,71,.12) 29px 30px); color: #3e3930; box-shadow: 2px 4px 0 rgba(89,61,37,.08), 0 13px 32px rgba(0,0,0,.13); transform: rotate(-.25deg); }
.paper-tape { position: absolute; width: 62px; height: 17px; left: calc(50% - 31px); top: -9px; background: rgba(215,191,153,.66); box-shadow: 0 1px 2px rgba(0,0,0,.08); transform: rotate(1.5deg); }
.island-notepad header { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }.island-notepad header > div { min-width: 0; }.island-notepad h2 { margin: 1px 0 0; font-size: 15px; color: #713632; }.island-notepad .modal-kicker { color: #9b7645; font-size: 7px; }.island-notepad > p { margin: 0; font-size: 11px; line-height: 2.05; }.query-badge { margin-left: auto; flex: 0 0 auto; padding: 5px 8px; border-radius: 11px; background: rgba(113,54,50,.1); color: #713632; font: 9px system-ui; }.island-notepad .prompt-chips { margin: 11px 0; }.island-notepad .prompt-chips button { border-color: rgba(113,54,50,.15); background: rgba(255,255,255,.32); color: #665d4e; }.island-notepad .guide-input input { border-color: rgba(113,54,50,.22); background: rgba(255,255,255,.55); color: #332f29; }.island-notepad .guide-input button { width: 39px; padding: 0; font-size: 14px; }.island-notepad .feature-result { max-height: 340px; overflow-y: auto; }.island-notepad .guide-reply { background: rgba(255,255,255,.36); color: #3e3930; }.island-notepad .mini-place { background: rgba(255,255,255,.32); color: #3e3930; border-color: rgba(113,54,50,.13); }.island-notepad .mini-place small { color: #766d5f; }.island-notepad footer { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 13px; padding-top: 10px; border-top: 1px dashed rgba(113,54,50,.18); color: #7e7465; font: 7px system-ui; }.island-notepad footer i { width: 3px; height: 3px; border-radius: 50%; background: #9b7645; }
.source-label { display: block; margin-top: 6px; color: #897c69; font: 8px system-ui; }

/* 原足迹页：便签、推荐店卡、路线便签、周边文化圈 */
.island-notepad { margin: 4px 0 14px; padding: 16px; border: 1px solid rgba(212,169,78,.4); border-radius: 2px 16px 16px 16px; background: linear-gradient(135deg,#fff0c4,#ffebae); color: #000; box-shadow: 2px 3px 8px rgba(212,169,78,.3), inset 0 1px 0 rgba(255,255,255,.5); transform: none; }
.paper-tape { width: 50px; height: 16px; left: 24px; top: -6px; background: rgba(140,50,50,.2); transform: rotate(-3deg); }
.island-notepad .feature-avatar { width: 32px; height: 32px; background: linear-gradient(135deg,#8c3232,#d4a94e); }.island-notepad h2 { color: #8c3232; }.island-notepad > p { font-size: 13px; line-height: 1.9; }.island-notepad .query-badge { color: #8c3232; background: rgba(139,115,85,.1); }.island-notepad .modal-kicker { color: #8c3232; }.island-notepad .feature-result { max-height: none; overflow: visible; }
.guide-thinking { padding: 12px 4px; color: #6c6255; font-size: 10px; }.guide-thinking span { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #8c3232; animation: pulse-dot 1s infinite alternate; }.guide-thinking span:nth-child(2){animation-delay:.2s}.guide-thinking span:nth-child(3){animation-delay:.4s}@keyframes pulse-dot{to{opacity:.25;transform:translateY(-2px)}}
.guide-reply.chat-style { max-width: 92%; margin: 12px 8px 12px 0; padding: 14px 16px; border: 1px solid rgba(212,169,78,.35); border-left-width: 1px; border-radius: 2px 16px 16px 16px; background: linear-gradient(135deg,#e8c988,#d4a94e); color: #000; box-shadow: 2px 3px 8px rgba(212,169,78,.25); font-size: 12px; line-height: 1.8; transform: rotate(.2deg); }
.original-store-list { display: grid; gap: 10px; margin-top: 12px; }.original-store-card { padding: 14px; border: 1px solid rgba(90,74,58,.16); border-radius: 12px; background: rgba(255,255,255,.78); box-shadow: 0 2px 12px rgba(54,54,54,.06); color: #3d3934; transition: transform .15s; }.original-store-card.selected { border-color: #8c3232; box-shadow: 0 0 0 1px rgba(140,50,50,.12); }.store-card-main { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }.store-thumb { width: 48px; height: 48px; flex: 0 0 auto; border-radius: 8px; object-fit: cover; background: #d8d1c5; }.store-copy { min-width: 0; flex: 1; }.store-copy strong { display: block; font-size: 15px; color: #37332e; }.store-copy small { display: block; margin-top: 2px; color: #80786f; font-size: 10px; }.store-rating { margin-top: 3px; color: #b07d32; font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.store-verified { flex: 0 0 auto; align-self: flex-start; padding: 3px 6px; border-radius: 8px; color: #55725c; background: rgba(125,154,132,.15); font: 8px system-ui; }.store-card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.store-card-actions button { height: 34px; border: 1px solid rgba(90,74,58,.16); border-radius: 8px; background: rgba(245,240,232,.86); color: #4c4640; font-size: 11px; cursor: pointer; }.store-card-actions button.active { border-color: #8c3232; background: #8c3232; color: #fff; }.store-card-actions button.checkin { color: #8c3232; }
.selected-route-bar { display: none; position: sticky; bottom: calc(74px + env(safe-area-inset-bottom)); z-index: 15; margin: 12px 0 0; padding: 9px 10px; border-radius: 12px; background: rgba(255,240,196,.94); box-shadow: 0 8px 24px rgba(86,57,35,.2); backdrop-filter: blur(8px); }.selected-route-bar.show { display: block; }.selected-route-bar #plan-selected-route { width: 100%; height: 40px; border: 0; border-radius: 10px; background: linear-gradient(135deg,#8c3232,#682323); color: #fff6e8; font-weight: 600; cursor: pointer; }
.original-plan-note, .surrounding-note { position: relative; margin-top: 16px; padding: 16px; border: 1px solid rgba(212,169,78,.4); border-radius: 2px 16px 16px 16px; background: linear-gradient(135deg,#e8c988,#d4a94e); color: #16130f; box-shadow: 2px 3px 8px rgba(212,169,78,.3); }.original-plan-note::before, .surrounding-note::before { content:""; position:absolute; top:-6px; left:24px; width:50px; height:16px; border-radius:2px; background:rgba(168,69,69,.2); }.plan-note-title, .surrounding-title { min-width:0; display: flex; align-items: center; gap: 6px; padding-bottom: 8px; margin-bottom: 6px; border-bottom: 1px dashed rgba(112,72,44,.32); font-size: 12px; font-weight: 700; }.plan-note-step { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 8px; padding: 8px 0; border-bottom: 1px dashed rgba(112,72,44,.2); }.plan-note-step > span { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: #8c3232; color: white; font: 10px system-ui; }.plan-note-step>div{min-width:0}.plan-note-step strong,.plan-note-step small { display: block; overflow-wrap:anywhere; }.plan-note-step strong { font-size: 12px; }.plan-note-step small { margin-top: 2px; color: #675c4d; font-size: 9px; }.plan-tips { margin-top: 9px; padding-top: 8px; border-top: 1px dashed rgba(112,72,44,.25); overflow-wrap:anywhere; font-size: 9px; line-height: 1.7; }.plan-stats { display: flex; justify-content: space-around; margin-top: 9px; padding-top: 9px; border-top: 1px dashed rgba(112,72,44,.25); text-align: center; }.plan-stats strong,.plan-stats small { display:block }.plan-stats strong { color:#8c3232;font-size:15px}.plan-stats small{font-size:8px;color:#675c4d}
.culture-sketch-map { height: 170px; margin: 8px 0 10px; position: relative; overflow: hidden; border: 1px solid rgba(112,72,44,.22); border-radius: 8px; background: #f6ebc8; }.culture-sketch-map::before,.culture-sketch-map::after{content:"";position:absolute;background:rgba(113,91,59,.16);transform:rotate(-15deg)}.culture-sketch-map::before{width:280px;height:8px;left:-20px;top:82px}.culture-sketch-map::after{width:7px;height:220px;left:160px;top:-22px}.sketch-ring{position:absolute;left:50%;top:50%;width:125px;height:125px;border:1px dashed rgba(140,50,50,.35);border-radius:50%;transform:translate(-50%,-50%)}.sketch-center,.sketch-pin{position:absolute;z-index:2;display:grid;place-items:center;border-radius:50%;color:#fff;box-shadow:0 3px 8px rgba(0,0,0,.16)}.sketch-center{width:30px;height:30px;left:calc(50% - 15px);top:calc(50% - 15px);background:#8c3232;font-size:9px}.sketch-pin{width:24px;height:24px;background:#2b7c8e;font-size:8px}.surrounding-list { display: grid; gap: 2px; }.surrounding-row { min-width:0;display:flex;align-items:center;gap:6px;padding:5px 2px;font-size:9px}.surrounding-row i{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:#2b7c8e}.surrounding-row strong{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px}.surrounding-row span{flex:0 0 auto;color:#675c4d}

/* 更轻的纸张便签与原版手绘地图容器 */
.island-notepad { background-color:#f8f5ec;background-image:none;border-color:rgba(165,143,104,.25);color:#34322d;box-shadow:0 10px 28px rgba(55,43,31,.11),inset 0 1px 0 rgba(255,255,255,.82) }
.island-notepad .feature-avatar { background:linear-gradient(135deg,#7f9986,#667e6c) }.island-notepad h2,.island-notepad .modal-kicker,.island-notepad .query-badge{color:#526b59}.island-notepad .query-badge{background:rgba(127,153,134,.12)}
.guide-reply.chat-style { border-color:rgba(185,157,105,.28);background:linear-gradient(145deg,#fffaf0,#f3e8c9);box-shadow:0 5px 18px rgba(94,72,43,.1) }
.original-plan-note,.surrounding-note { background-color:#f8f5ec;background-image:none;border-color:rgba(165,143,104,.28);color:#34322d;box-shadow:0 10px 28px rgba(55,43,31,.12),inset 0 1px 0 rgba(255,255,255,.8) }
.original-plan-note::before,.surrounding-note::before { background:rgba(143,159,139,.46);box-shadow:0 1px 2px rgba(0,0,0,.08) }
.plan-note-title,.surrounding-title { border-bottom-color:rgba(112,96,68,.2);font-size:13px;line-height:1.6 }
.plan-title-mark { flex:0 0 auto;padding:3px 7px;border-radius:9px;background:#e1eadf;color:#526b59;font:700 8px system-ui;letter-spacing:.08em }
.plan-note-step { border-bottom-color:rgba(112,96,68,.14) }
.plan-note-step small,.plan-tips,.plan-stats small,.surrounding-row span { color:#746d62 }
.selected-route-bar { background:rgba(248,245,236,.95);border:1px solid rgba(127,153,134,.2);box-shadow:0 8px 24px rgba(55,43,31,.14) }.selected-route-bar.show { display:block }
.store-card-main { width:100%;padding:0;border:0;background:transparent;text-align:left;color:inherit;cursor:pointer }
.store-detail-arrow { flex:0 0 auto;color:#9b9387;font:22px/1 system-ui }
.map-loading-card { min-height:176px;margin:8px 0 10px;display:flex;align-items:center;justify-content:center;gap:5px;position:relative;border:1px dashed rgba(91,111,92,.25);border-radius:12px;background:linear-gradient(145deg,rgba(225,234,223,.72),rgba(255,255,255,.45)) }
.map-loading-card.compact { min-height:100px }
.map-loading-card span { width:6px;height:6px;border-radius:50%;background:#7f9986;animation:pulse-dot 1s infinite alternate }
.map-loading-card span:nth-child(2){animation-delay:.2s}.map-loading-card span:nth-child(3){animation-delay:.4s}
.map-loading-card small { position:absolute;left:0;right:0;top:calc(50% + 16px);text-align:center;color:#746d62;font-size:9px }
.generated-map { margin:8px 0 10px }.generated-map img { display:block;width:100%;height:auto;object-fit:contain;border:1px solid rgba(112,96,68,.18);border-radius:11px;box-shadow:0 5px 16px rgba(54,48,39,.1) }
.map-actions { display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px }.map-actions button { padding:6px 10px;border:1px solid rgba(91,111,92,.24);border-radius:14px;background:rgba(225,234,223,.72);color:#526b59;font-size:9px;cursor:pointer }
.map-fallback-note { display:block;margin:-3px 0 8px;text-align:center;color:#80776a;font-size:8px }.route-map-container{margin-top:12px}
.prompt-chips button:disabled,.guide-input button:disabled,.select-store:disabled,#plan-selected-route:disabled{cursor:wait;opacity:.55}

/* 参照原版 PlaceDetail 的合规详情弹层 */
.place-detail-modal { height:min(87svh,780px);padding:0 0 calc(22px + env(safe-area-inset-bottom));display:flex;flex-direction:column;overflow:hidden;background:var(--paper) }
#place-detail-content { min-height:0;flex:1;display:flex;flex-direction:column }
.place-detail-modal .modal-handle { position:absolute;z-index:3;top:12px;left:50%;margin:0;transform:translateX(-50%);background:rgba(255,255,255,.62) }
.place-detail-modal .modal-close { z-index:4;background:rgba(25,25,23,.46);color:#fff;backdrop-filter:blur(6px) }
.detail-hero-image { height:230px;flex:0 0 230px;position:relative;background-position:center;background-size:cover }
.detail-hero-image::after { content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(20,18,15,.5)) }
.detail-hero-image>span { position:absolute;z-index:2;left:18px;bottom:16px;padding:5px 9px;border-radius:12px;background:rgba(250,247,240,.9);color:#526b59;font:600 9px system-ui }
.detail-copy { min-height:0;max-height:none;flex:1;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:20px }
.detail-copy h2 { margin:5px 0 3px;font-size:23px }.detail-subtitle { margin:0 0 12px!important;color:var(--muted);font-size:11px;line-height:1.7 }
.detail-rating { display:flex;align-items:center;gap:7px;min-height:25px;margin-bottom:13px;color:var(--muted);font-size:10px }.detail-stars{color:var(--gold);letter-spacing:1px}.detail-rating strong{color:var(--ink);font-size:13px}.detail-rating em{margin-left:auto;padding:4px 7px;border-radius:9px;background:color-mix(in srgb,var(--sage) 18%,transparent);color:var(--sage);font:normal 8px system-ui}
.detail-feature-grid { display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-bottom:16px }.detail-feature { min-width:0;padding:9px 3px;text-align:center;border:1px solid var(--line);border-radius:10px;background:var(--surface) }.detail-feature b,.detail-feature span{display:block}.detail-feature b{height:20px;font:16px/20px system-ui}.detail-feature span{margin-top:3px;color:var(--muted);font-size:8px}.detail-feature.off{opacity:.34}.detail-feature.on{border-color:color-mix(in srgb,var(--sage) 35%,var(--line));background:color-mix(in srgb,var(--sage) 10%,var(--surface))}
.detail-rows { display:grid;margin-bottom:16px;border-top:1px solid var(--line) }.detail-row { display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;padding:12px 2px;border-bottom:1px solid var(--line) }.detail-row>div{min-width:0}.detail-row>b{color:var(--gold);font:normal 17px/1.2 system-ui}.detail-row small,.detail-row span{display:block}.detail-row small{margin-bottom:3px;color:var(--muted);font-size:8px}.detail-row span{overflow-wrap:anywhere;font-size:11px;line-height:1.65}.detail-boundary{margin:10px 0 0!important;text-align:center;color:var(--muted);font-size:8px!important}
:root[data-theme="day"] .lantern,
:root[data-theme="day"] .tower { background: linear-gradient(#adc2af,#819c87); color:#fff; box-shadow:0 18px 40px rgba(90,118,96,.22) }
:root[data-theme="day"] .hero-orbit span { background:#9bb29f;color:#fff }
:root[data-theme="day"] .paper-tape { background:rgba(155,178,159,.55) }
:root[data-theme="day"] .island-notepad .feature-avatar { background:linear-gradient(135deg,#9bb29f,#78927f) }
:root[data-theme="day"] .island-notepad h2,
:root[data-theme="day"] .island-notepad .modal-kicker,
:root[data-theme="day"] .island-notepad .query-badge { color:#58705e }
:root[data-theme="day"] .island-notepad .prompt-chips button { border-color:rgba(127,153,134,.28) }
:root[data-theme="day"] .island-notepad .guide-input input { border-color:rgba(127,153,134,.35) }
:root[data-theme="day"] .island-notepad footer { border-top-color:rgba(127,153,134,.3) }
:root[data-theme="day"] .guide-thinking span { background:#7f9986 }
:root[data-theme="day"] .original-store-card.selected { border-color:#9bb29f; box-shadow:0 0 0 1px rgba(155,178,159,.24) }
:root[data-theme="day"] .store-card-actions button.active { border-color:#9bb29f;background:#9bb29f }
:root[data-theme="day"] .store-card-actions button.checkin { color:#58705e }
:root[data-theme="day"] .selected-route-bar #plan-selected-route { background:linear-gradient(135deg,#9bb29f,#7f9986) }
:root[data-theme="day"] .plan-note-step>span,
:root[data-theme="day"] .sketch-center { background:#7f9986 }
:root[data-theme="day"] .plan-stats strong { color:#58705e }
:root[data-theme="day"] .original-plan-note::before,
:root[data-theme="day"] .surrounding-note::before { background:rgba(155,178,159,.55) }
:root[data-theme="day"] .sketch-ring { border-color:rgba(127,153,134,.45) }
:root[data-theme="day"] .place-type,
:root[data-theme="day"] .event-tag { color:#526b59 }
.tool-card { min-width: 0; min-height: 105px; padding: 12px 9px; position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); text-align: left; cursor: pointer; box-shadow: 0 5px 16px rgba(0,0,0,.07); transition: transform .2s, border-color .2s; }
.tool-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--gold) 45%, transparent); }
.tool-card > span:nth-child(2) { min-width: 0; max-width:100%; }.tool-card strong, .tool-card small { display: block; }.tool-card strong { overflow:hidden;text-overflow:ellipsis;font-size: 11px; white-space: nowrap; }.tool-card small { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.5; }.tool-card b { position: absolute; right: 8px; top: 15px; color: var(--muted); font-size: 15px; }.tool-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--wine) 14%, transparent); color: var(--wine); font-size: 13px; }.tool-ai { background: linear-gradient(145deg, color-mix(in srgb, var(--wine) 9%, var(--surface)), var(--surface)); }
.feature-modal { min-height: 390px; }.feature-heading { display: flex; align-items: center; gap: 11px; margin-bottom: 17px; }.feature-heading h2 { margin-top: 2px; }.feature-avatar { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: #f8ede1; background: linear-gradient(135deg, var(--wine), var(--gold)); }.guide-message { padding: 14px; border-radius: 4px 14px 14px; background: var(--surface); color: var(--ink); font-size: 11px; line-height: 1.8; }.prompt-chips { display: flex; gap: 6px; overflow-x: auto; margin: 12px 0; scrollbar-width: none; }.prompt-chips button, .route-options button { flex: 0 0 auto; padding: 7px 10px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); color: var(--muted); font-size: 9px; cursor: pointer; }.guide-input { display: grid; grid-template-columns: 1fr auto; gap: 7px; }.guide-input input { min-width: 0; padding: 11px 12px; border: 1px solid var(--line); border-radius: 20px; outline: none; background: var(--surface); color: var(--ink); font: 11px inherit; }.guide-input input:focus { border-color: var(--wine); }.guide-input button { padding: 0 15px; border: 0; border-radius: 18px; background: var(--wine); color: #fff0e8; font-size: 10px; cursor: pointer; }.feature-result { margin-top: 15px; }.guide-reply { margin-bottom: 10px; padding: 12px 13px; border-left: 2px solid var(--gold); border-radius: 4px 11px 11px 4px; background: color-mix(in srgb, var(--gold) 8%, var(--surface)); font-size: 10px; line-height: 1.75; }.mini-place { padding: 11px 12px; display: flex; align-items: center; gap: 9px; border-bottom: 1px dashed var(--line); background: var(--surface); }.mini-place:first-of-type { border-radius: 12px 12px 0 0; }.mini-place:last-of-type { border-bottom: 0; border-radius: 0 0 12px 12px; }.mini-place i { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--wine); color: white; font: normal 10px system-ui; }.mini-place div { flex: 1; min-width: 0; }.mini-place strong, .mini-place small { display: block; }.mini-place strong { font-size: 11px; }.mini-place small { margin-top: 2px; color: var(--muted); font-size: 8px; }.local-disclaimer { margin: 14px 0 0 !important; text-align: center; font-size: 8px !important; }
.route-options { display: flex; gap: 7px; margin: 0 0 14px; overflow-x: auto; }.route-options button.active { border-color: var(--wine); background: var(--wine); color: #fff; }.route-canvas { position: relative; margin-top: 14px; padding: 14px; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: linear-gradient(135deg, color-mix(in srgb, var(--sage) 12%, var(--surface)), var(--surface)); }.route-canvas::before { content: ""; position: absolute; inset: 0; opacity: .25; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 22px 22px; }.route-stop { position: relative; z-index: 1; display: grid; grid-template-columns: 28px 1fr auto; gap: 9px; align-items: center; padding: 8px 0; }.route-stop:not(:last-child)::after { content: ""; position: absolute; left: 13px; top: 36px; height: 18px; border-left: 1px dashed var(--wine); }.route-stop > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--wine); color: #fff; font: 10px system-ui; }.route-stop strong { display: block; font-size: 11px; }.route-stop small { color: var(--muted); font-size: 8px; }.route-stop em { color: var(--gold); font: normal 9px system-ui; }
.culture-map { height: 200px; margin: 6px 0 14px; position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: radial-gradient(circle, color-mix(in srgb, var(--sage) 20%, var(--surface)), var(--surface) 68%); }.culture-map::before, .culture-map::after { content: ""; position: absolute; background: color-mix(in srgb, var(--gold) 20%, transparent); transform: rotate(-18deg); }.culture-map::before { width: 270px; height: 8px; left: -25px; top: 98px; }.culture-map::after { width: 8px; height: 250px; left: 188px; top: -20px; }.ring { position: absolute; left: 50%; top: 50%; border: 1px dashed color-mix(in srgb, var(--wine) 40%, transparent); border-radius: 50%; transform: translate(-50%,-50%); }.ring-one { width: 95px; height: 95px; }.ring-two { width: 175px; height: 175px; }.map-center, .map-pin { position: absolute; z-index: 2; display: grid; place-items: center; border: 0; border-radius: 50%; color: #fff; box-shadow: 0 5px 14px rgba(0,0,0,.18); }.map-center { left: calc(50% - 16px); top: calc(50% - 16px); width: 32px; height: 32px; background: var(--wine); font-size: 11px; }.map-pin { width: 27px; height: 27px; background: var(--gold); font-size: 9px; cursor: pointer; }.pin-one { left: 21%; top: 23%; }.pin-two { right: 18%; top: 29%; background: var(--sage); }.pin-three { left: 30%; bottom: 15%; background: #a06d63; }.circle-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; }.circle-item { min-width: 0; padding: 10px 8px; border-radius: 10px; background: var(--surface); }.circle-item strong, .circle-item small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.circle-item strong { font-size: 9px; }.circle-item small { margin-top: 4px; color: var(--muted); font-size: 8px; }
:root[data-theme="day"] .brand-mark { border-color: rgba(36,40,35,.45); }
:root[data-theme="day"] .hero-card::after { opacity: .13; }
:root[data-theme="day"] .hero-orbit { border-color: rgba(66,72,62,.16); }
:root[data-theme="day"] .hero-orbit::before { border-color: rgba(66,72,62,.22); }
:root[data-theme="day"] .paper { background: #fffaf0; }
:root[data-theme="day"] .checkin-button,
:root[data-theme="day"] .external-button { color: #fff7ef; }

/* 窄屏与动态内容保护：API 返回长名称时也不挤出纸页边缘。 */
.prompt-chips,
.route-options { overscroll-behavior-inline: contain; }
.route-stop { grid-template-columns: 28px minmax(0,1fr) auto; }
.route-stop > div { min-width: 0; }
.route-stop strong,
.route-stop small,
.guide-reply,
.footprint-entry p { overflow-wrap: anywhere; }
.store-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.footprint-entry header > * { min-width: 0; overflow-wrap: anywhere; }
.modal h2,
.modal > p { overflow-wrap: anywhere; }

/* 双语布局保护：英文文案更长，允许关键区域收缩、换行而不横向溢出。 */
:root[lang="en"] body { font-family: "Noto Serif", Georgia, "Times New Roman", "Noto Serif SC", serif; }
:root[lang="en"] .brand { gap:6px;font-size:14px;letter-spacing:.07em }
:root[lang="en"] .hero-copy h1 { font-size:23px;letter-spacing:.015em }
:root[lang="en"] .privacy-strip small,
:root[lang="en"] .local-card p,
:root[lang="en"] .version-note p,
:root[lang="en"] .boundary-card li { overflow-wrap:anywhere }
:root[lang="en"] .island-notepad header { align-items:flex-start }
:root[lang="en"] .query-badge { max-width:46%;flex:0 1 auto;text-align:right;white-space:normal;line-height:1.35 }
:root[lang="en"] .island-notepad footer { flex-wrap:wrap;gap:5px 8px;font-size:7.5px;line-height:1.45 }
:root[lang="en"] .event-footer { align-items:stretch;flex-wrap:wrap }
:root[lang="en"] .event-host { flex:1 1 150px }
:root[lang="en"] .external-button { max-width:48%;padding:8px 10px;display:grid;place-items:center;text-align:center;line-height:1.35;white-space:normal }
:root[lang="en"] .profile-stats { gap:12px }
:root[lang="en"] .profile-stats div { min-width:0;flex:1 }
:root[lang="en"] .profile-stats span,
:root[lang="en"] .tab small { overflow-wrap:anywhere;line-height:1.2 }
:root[lang="en"] .tab small { font-size:8px;text-align:center }
:root[lang="en"] .store-verified { max-width:70px;text-align:center;white-space:normal;line-height:1.25 }
:root[lang="en"] .detail-feature span,
:root[lang="en"] .map-actions button,
:root[lang="en"] .store-card-actions button { overflow-wrap:anywhere;line-height:1.25 }
:root[lang="en"] .detail-feature-grid { gap:5px }
:root[lang="en"] .detail-feature { padding-inline:2px }
:root[lang="en"] .selected-route-bar #plan-selected-route { height:auto;min-height:40px;padding:9px 8px;line-height:1.35 }

@media (max-width: 390px) {
  .topbar { padding-inline:10px;gap:5px }
  .brand { gap:5px;font-size:14px;letter-spacing:.08em }
  .brand-logo { width:29px;height:26px }
  .topbar-actions { gap:0 }
  .language-button { min-width:31px;padding-inline:5px }
  .icon-button { width:31px }
  :root[lang="en"] .brand { font-size:13px;letter-spacing:.04em }
  :root[lang="en"] .location-button { font-size:11px }
  :root[lang="en"] .hero-copy { width:72% }
  :root[lang="en"] .hero-copy h1 { font-size:21px }
  :root[lang="en"] .section-heading { gap:12px }
  :root[lang="en"] .section-heading > div { min-width:0 }
  :root[lang="en"] .section-heading h2 { font-size:18px;overflow-wrap:anywhere }
  :root[lang="en"] .text-button { flex:0 0 auto;max-width:42%;text-align:right;line-height:1.35 }
  :root[lang="en"] .detail-feature-grid { grid-template-columns:repeat(3,1fr) }
}

@media (min-width: 700px) {
  body { padding: 22px 0; background: radial-gradient(circle at 20% 10%, #4a3a36, var(--paper-deep) 45%); }
  .app-shell { min-height: calc(100svh - 44px); border-radius: 22px; overflow: hidden; }
  .topbar { top: 22px; border-radius: 22px 22px 0 0; }
  .tabbar { bottom: 22px; border-radius: 0 0 22px 22px; }
  .main-content { min-height: calc(100svh - 44px); }
  .modal, .city-sheet-panel { margin-bottom: 22px; border-radius: 22px; }
}

@media (max-height: 640px) {
  .place-detail-modal { height: 92svh; max-height: 92svh; }
  .detail-hero-image { height: 170px; flex-basis: 170px; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* Account, consent and operations surfaces keep the same paper-and-sage visual language. */
.sr-only { position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important }
.profile-role-badge { display:inline-flex;margin:-10px 0 13px;padding:4px 8px;border:1px solid rgba(255,255,255,.26);border-radius:999px;background:rgba(255,255,255,.1);font:700 8px/1.2 system-ui,sans-serif;letter-spacing:.08em }
.account-card { margin-bottom:15px;padding:14px;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:11px;align-items:center;border:1px solid color-mix(in srgb,var(--sage) 28%,var(--line));border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--sage) 12%,var(--surface)),var(--surface));box-shadow:0 7px 20px rgba(0,0,0,.07) }
.account-card-mark { width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--sage) 23%,transparent);color:var(--sage);font-size:16px }
.account-card-copy { min-width:0 }.account-kicker { display:block;margin-bottom:3px;color:var(--gold);font:700 7px/1.3 system-ui,sans-serif;letter-spacing:.14em }.account-card-copy strong,.account-card-copy p,.account-meta span { display:block;overflow-wrap:anywhere }.account-card-copy strong{font-size:12px}.account-card-copy p{margin:4px 0 0;color:var(--muted);font-size:9px;line-height:1.55}.account-meta{margin-top:6px}.account-meta span{color:var(--muted);font:8px/1.5 system-ui,sans-serif}.account-action{max-width:78px;padding:8px 11px;border:1px solid color-mix(in srgb,var(--sage) 42%,var(--line));border-radius:999px;background:var(--surface);color:var(--sage);font:700 9px/1.2 system-ui,sans-serif;cursor:pointer}.account-action:disabled{opacity:.5}
.memo-sync-card{margin:0 0 15px;padding:14px;border:1px solid color-mix(in srgb,var(--gold) 25%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--gold) 6%,var(--surface))}.memo-sync-heading{display:flex;align-items:flex-start;gap:12px}.memo-sync-heading>div{min-width:0;flex:1}.memo-sync-heading strong{font-size:12px}.memo-sync-heading p{margin:4px 0 0;color:var(--muted);font-size:8.5px;line-height:1.65}.memo-sync-card>small{display:block;margin-top:9px;color:var(--sage);font-size:8px;line-height:1.5}.memo-switch{flex:0 0 auto;position:relative!important;display:block!important;width:38px;height:22px}.memo-switch input{position:absolute;opacity:0}.memo-switch>span{position:absolute;inset:0;border:1px solid var(--line);border-radius:999px;background:var(--surface-soft);transition:.18s}.memo-switch>span::after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:var(--muted);transition:.18s}.memo-switch input:checked+span{border-color:var(--sage);background:color-mix(in srgb,var(--sage) 32%,var(--surface))}.memo-switch input:checked+span::after{left:19px;background:var(--sage)}.memo-switch input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}.memo-switch input:disabled+span{opacity:.45}.memo-sync-card>button{margin-top:9px;padding:7px 9px;border:1px solid color-mix(in srgb,var(--wine) 33%,var(--line));border-radius:9px;background:transparent;color:var(--wine);font-size:8px;cursor:pointer}.memo-sync-card>button:disabled{opacity:.45}
.analytics-consent { position:fixed;z-index:80;left:50%;bottom:calc(72px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 24px),496px);padding:15px;border:1px solid color-mix(in srgb,var(--gold) 28%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 15px 42px rgba(0,0,0,.28);backdrop-filter:blur(16px) }.analytics-consent strong{font-size:12px}.analytics-consent p{margin:6px 0 12px;color:var(--muted);font-size:9px;line-height:1.65}.analytics-consent-actions,.analytics-settings-actions{display:flex;gap:8px}.analytics-primary,.analytics-secondary{min-width:0;flex:1;padding:9px;border-radius:10px;font-size:9px;cursor:pointer}.analytics-primary{border:0;background:var(--wine);color:#fff}.analytics-secondary{border:1px solid var(--line);background:var(--surface);color:var(--muted)}.analytics-settings-copy{margin:16px 0;padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.analytics-settings-copy p,.analytics-settings-copy li{color:var(--muted);font-size:9px;line-height:1.75}.analytics-settings-copy ul{margin:9px 0 0;padding-left:18px}.analytics-current-status{margin:0 0 12px;display:flex;justify-content:space-between;color:var(--muted);font-size:9px}.analytics-current-status span:last-child{color:var(--sage);font-weight:700}
.auth-modal { max-height:min(90svh,760px) }.auth-form{display:grid;gap:11px;margin-top:16px}.auth-intents,.auth-methods{margin:0;padding:3px;display:grid;grid-template-columns:1fr 1fr;gap:3px;border:1px solid var(--line);border-radius:12px;background:var(--surface-soft)}.auth-intents label,.auth-methods label{display:block;cursor:pointer}.auth-intents input,.auth-methods input{position:absolute;opacity:0;pointer-events:none}.auth-intents span,.auth-methods span{min-height:34px;padding:8px;display:grid;place-items:center;border-radius:9px;color:var(--muted)!important;font:700 9px/1.2 system-ui,sans-serif!important;text-align:center}.auth-intents input:checked+span,.auth-methods input:checked+span{background:var(--surface);color:var(--ink)!important;box-shadow:0 3px 10px rgba(0,0,0,.08)}.auth-field{display:grid!important;gap:6px!important}.auth-field>span:first-child{color:var(--ink)!important;font-size:10px!important}.auth-field input{width:100%;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:11px;outline:none;background:var(--surface);color:var(--ink);font:11px/1.4 system-ui,sans-serif}.auth-field input:focus{border-color:var(--sage);box-shadow:0 0 0 3px color-mix(in srgb,var(--sage) 12%,transparent)}.auth-hint{margin-top:-6px;color:var(--muted);font-size:8px;line-height:1.55}.auth-otp-panel,.auth-password-panel{display:grid;gap:10px}.auth-secondary-button{padding:11px;border:1px solid color-mix(in srgb,var(--sage) 38%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--sage) 11%,var(--surface));color:var(--sage);font-size:10px;cursor:pointer}.password-input-wrap{position:relative;display:block!important}.password-input-wrap input{padding-right:58px}.password-input-wrap button{position:absolute;right:5px;top:50%;transform:translateY(-50%);padding:6px 8px;border:0;border-radius:8px;background:transparent;color:var(--sage);cursor:pointer}.password-input-wrap button span{color:inherit!important;font-size:8px!important}.auth-consent{padding:11px!important;display:grid!important;grid-template-columns:17px minmax(0,1fr);gap:9px!important;align-items:start;border:1px solid color-mix(in srgb,var(--gold) 30%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--gold) 7%,var(--surface))}.auth-consent input{width:16px;height:16px;margin:1px 0 0;accent-color:var(--sage)}.auth-consent span{color:var(--muted)!important;font-size:8.5px!important;line-height:1.65}.auth-message{margin:0!important;padding:9px 10px;border-radius:9px;background:color-mix(in srgb,var(--sage) 11%,transparent);color:var(--sage)!important;font-size:9px!important;line-height:1.55}.auth-message.error{background:rgba(169,70,65,.1);color:#c8817c!important}.auth-submit{margin-top:1px}.auth-local-note{margin:14px 0 0!important;padding-top:12px;border-top:1px dashed var(--line);text-align:center;font-size:8px!important;line-height:1.65!important}
#auth-method-field[hidden],#auth-password-hint[hidden],#auth-name-field[hidden],#auth-code-field[hidden],#auth-otp-panel[hidden],#auth-password-panel[hidden],#auth-consent-field[hidden],.admin-panel[hidden]{display:none!important}
.admin-modal{height:min(90svh,820px);display:flex;flex-direction:column;overflow:hidden}.admin-heading{padding-right:42px;display:flex;align-items:center;justify-content:space-between;gap:10px}.admin-heading h2{margin:5px 0 0}.admin-refresh{padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--sage);font-size:9px;cursor:pointer}.admin-tabs{padding:3px;display:grid;grid-template-columns:1fr 1fr;gap:3px;border:1px solid var(--line);border-radius:11px;background:var(--surface-soft)}.admin-tabs button{padding:9px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:9px;cursor:pointer}.admin-tabs button[aria-selected="true"]{background:var(--surface);color:var(--ink);box-shadow:0 3px 9px rgba(0,0,0,.07)}.admin-status{min-height:18px;margin:9px 0 0!important;color:var(--sage)!important;font-size:8px!important}.admin-status.error{color:#c8817c!important}.admin-panel{min-height:0;overflow:auto;padding:2px 1px 8px}.admin-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.admin-kpis article{min-width:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.admin-kpis span,.admin-kpis strong{display:block}.admin-kpis span{color:var(--muted);font-size:8px;line-height:1.35}.admin-kpis strong{margin-top:6px;color:var(--sage);font:700 20px/1 system-ui,sans-serif}.admin-trend-card{margin-top:10px;padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.admin-section-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.admin-section-heading strong{font-size:11px}.admin-section-heading small{color:var(--muted);font-size:7px}.admin-trend{margin:10px 0 0;padding:0;list-style:none}.admin-trend li{padding:9px 0;display:grid;grid-template-columns:minmax(78px,1fr) repeat(4,minmax(0,1fr));gap:5px;border-top:1px dashed var(--line);align-items:center}.admin-trend time,.admin-trend span{min-width:0;color:var(--muted);font-size:7px;line-height:1.4}.admin-trend b{display:block;color:var(--ink);font-size:10px}.admin-empty{padding:28px 8px!important;display:block!important;text-align:center;color:var(--muted);font-size:9px}.admin-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-bottom:10px}.admin-search input{min-width:0;padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-size:10px}.admin-search button,.admin-pagination button{padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--sage);font-size:8px;cursor:pointer}.admin-user-list{display:grid;gap:7px}.admin-user-card{min-width:0;padding:10px;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:9px;align-items:center;border:1px solid var(--line);border-radius:11px;background:var(--surface)}.admin-user-avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--sage) 18%,transparent);color:var(--sage);font-size:12px}.admin-user-card>div:nth-child(2){min-width:0}.admin-user-card strong,.admin-user-card a,.admin-user-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-user-card strong{font-size:10px}.admin-user-card a{margin-top:2px;color:var(--gold);font:8px/1.4 system-ui,sans-serif;text-decoration:none}.admin-user-card small{margin-top:3px;color:var(--muted);font-size:7px}.admin-user-status{max-width:80px;padding:5px 6px;border-radius:8px;background:rgba(176,114,68,.1);color:var(--gold);font:700 7px/1.3 system-ui,sans-serif;text-align:right}.admin-user-status.verified{background:color-mix(in srgb,var(--sage) 13%,transparent);color:var(--sage)}.admin-user-status small{margin:2px 0 0}.admin-pagination{margin-top:10px;display:flex;align-items:center;justify-content:center;gap:10px}.admin-pagination span{color:var(--muted);font-size:8px}.admin-pagination button:disabled{opacity:.35;cursor:not-allowed}
@media (max-width:390px){.account-card{grid-template-columns:36px minmax(0,1fr)}.account-card-mark{width:36px;height:36px}.account-action{grid-column:2;justify-self:start}.admin-trend li{grid-template-columns:1fr 1fr}.admin-trend time{grid-column:1/-1}.admin-user-card{grid-template-columns:30px minmax(0,1fr)}.admin-user-avatar{width:30px;height:30px}.admin-user-status{grid-column:2;justify-self:start;max-width:none;text-align:left}}
