/* Homepage chrome — extracted from index.html */
    :root {
      --ink: #141414;
      --mist: #f4f4f2;
      --paper: #ffffff;
      --card: #ffffff;
      --mute: #6b6e68;
      --mute-2: #8a8e86;
      --line: #e3e3df;
      --line-2: #ecece8;
      --lacquer: #be123c;
      --lacquer-deep: #9f1239;
      --lacquer-soft: #fadbe3;
      --lacquer-tint: #fdf2f5;
      --char: #1c1c1c;
      --safe-bottom: env(safe-area-inset-bottom, 0px);
      --safe-top: env(safe-area-inset-top, 0px);
      --frost: rgba(255, 255, 255, 0.88);
      --r-xl: 28px;
      --r-lg: 20px;
      --r-md: 14px;
      --shadow-soft: 0 1px 2px rgba(20, 20, 20, .03), 0 10px 30px -14px rgba(20, 20, 20, .14);
      --shadow-pop: 0 18px 44px -16px rgba(20, 20, 20, .3);
      --shadow-accent: 0 10px 24px -10px rgba(190, 18, 60, .45);
      --grad-accent: linear-gradient(135deg, #e11d48 0%, #be123c 55%, #9f1239 100%);
      /* promo 专用：同色系但更柔和，避免和加载更多抢戏 */
      --grad-promo: linear-gradient(135deg, #e88394 0%, #d65a72 52%, #c94a62 100%);
      --shadow-promo: 0 12px 28px -12px rgba(201, 74, 98, .38);
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: var(--mist);
      color: var(--ink);
      font-family: "Noto Serif SC", "Songti SC", serif;
      font-size: 16px;
      line-height: 1.75;
      -webkit-font-smoothing: antialiased;
    }
    button, input { font: inherit; }
    a { color: inherit; text-decoration: none; }
    .page {
      max-width: 480px;
      margin: 0 auto;
      background: var(--paper);
      min-height: 100dvh;
      padding-bottom: calc(6.5rem + var(--safe-bottom));
      overflow-x: hidden;
    }

    /* —— sticky chrome —— */
    .chrome {
      position: sticky;
      top: 0;
      z-index: 30;
      transition: transform .3s ease;
    }
    .chrome.is-hidden { transform: translateY(-110%); }
    .header {
      position: relative;
      padding: calc(14px + var(--safe-top)) 20px 18px;
      background: var(--frost);
      border-bottom: 1px solid var(--line);
      backdrop-filter: blur(16px) saturate(1.2);
      -webkit-backdrop-filter: blur(16px) saturate(1.2);
    }
    .header__meta {
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .masthead {
      font-family: Syne, system-ui, sans-serif;
      font-size: 10px;
      letter-spacing: 0.28em;
      text-transform: uppercase;
      color: var(--lacquer);
      font-weight: 700;
    }
    .header__actions { display: flex; align-items: center; gap: 8px; }
    .avatar, .login-btn {
      display: grid;
      place-items: center;
      height: 32px;
      border: 0;
      cursor: pointer;
      transition: transform .15s ease;
    }
    .avatar:active, .login-btn:active { transform: scale(0.94); }
    .avatar {
      width: 32px;
      border-radius: 50%;
      background: var(--char);
      color: #fff;
      font-size: 13px;
      font-weight: 700;
    }
    .login-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: 40px;
      padding: 0 12px;
      border-radius: 999px;
      border: 1.5px solid #141414;
      background: #fff;
      font-family: Syne, system-ui, sans-serif;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: none;
      line-height: 1;
      color: #141414;
      box-shadow: none;
      cursor: pointer;
      flex-shrink: 0;
      -webkit-appearance: none;
      appearance: none;
    }
    .brand-row {
      margin-top: 14px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }
    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
      background: none;
      border: 0;
      padding: 0;
      text-align: left;
      cursor: pointer;
      color: var(--ink);
    }
    .brand__logo {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      object-fit: cover;
      background: #fff;
      flex-shrink: 0;
      box-shadow: 0 0 0 2px var(--lacquer-soft), 0 0 0 3.5px rgba(190, 18, 60, .32);
    }
    .brand__title {
      margin: 0;
      font-size: 28px;
      line-height: 1;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--ink);
    }
    .brand__en {
      margin: 6px 0 0;
      font-family: Fraunces, serif;
      font-size: 12px;
      font-style: italic;
      color: var(--mute);
      letter-spacing: 0.02em;
    }
.search {
      margin-top: 0;
      display: flex;
      align-items: center;
      flex-wrap: nowrap;
      gap: 6px;
      width: 100%;
      min-width: 0;
    }
    .header--compact {
      position: sticky;
      top: 0;
      z-index: 20;
      padding: calc(8px + var(--safe-top)) 12px 10px;
      background: linear-gradient(180deg, #fff 70%, rgba(255,255,255,.92));
    }
    .brand-mini {
      border: 0;
      background: transparent;
      padding: 0;
      cursor: pointer;
      flex-shrink: 0;
    }
    .brand-mini img {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      object-fit: cover;
      display: block;
      box-shadow: 0 0 0 2px #fadbe3;
    }
    .search__field {
      flex: 1 1 0;
      min-width: 0;
      height: 40px;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 0 12px;
      border-radius: 999px;
      background: #f4f4f2;
      border: 1px solid #d8d8d4;
      box-shadow: none;
      transition: border-color .2s ease, box-shadow .2s ease;
    }
    .search__field:focus-within {
      border-color: var(--lacquer);
      box-shadow: 0 0 0 3px var(--lacquer-soft);
      background: #fff;
    }
    .search__field input {
      flex: 1;
      min-width: 0;
      width: 100%;
      border: 0;
      background: transparent;
      outline: none;
      font-size: 13px;
      color: var(--ink);
      -webkit-appearance: none;
      appearance: none;
    }
    .search__field input::placeholder { color: #6b6e68; }
    .search__field svg { color: #6b6e68; flex-shrink: 0; }
    .search__go {
      height: 40px;
      padding: 0 12px;
      border: 0;
      border-radius: 999px;
      background: var(--grad-accent);
      color: #fff;
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
      font-family: Syne, system-ui, sans-serif;
      letter-spacing: 0.04em;
      flex-shrink: 0;
      white-space: nowrap;
      box-shadow: var(--shadow-accent);
      transition: transform .15s ease;
      -webkit-appearance: none;
      appearance: none;
    }
    .search__go:active { transform: scale(0.95); }

    .label {
      margin: 0;
      font-family: Syne, system-ui, sans-serif;
      font-size: 10px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--lacquer);
      font-weight: 700;
    }

    /* —— cover story: full-bleed hero (original presentation) —— */
    .cover {
      margin: 0;
      padding: 0;
    }
    .cover__card {
      position: relative;
      display: block;
      width: 100%;
      min-height: min(86dvh, 720px);
      overflow: hidden;
      border: 0;
      padding: 0;
      margin: 0;
      background: var(--char);
      color: #fff;
      text-align: left;
      cursor: pointer;
      isolation: isolate;
    }
    .cover__media {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      background: #1a1a1a;
    }
    .cover__media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transform: scale(1.1);
      animation: coverZoom 14s ease-out forwards;
    }
    .cover__scrim {
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background:
        linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.08) 36%, rgba(0,0,0,.82) 100%),
        radial-gradient(120% 80% at 50% 0%, transparent 40%, rgba(0,0,0,.28) 100%);
    }
    .cover__top {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      z-index: 2;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      padding: 18px 20px 0;
    }
    .cover__badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-family: Syne, system-ui, sans-serif;
      font-size: 10px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      font-weight: 700;
      color: #ffd0da;
    }
    .cover__badge::before {
      content: "";
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--lacquer);
      box-shadow: 0 0 0 3px rgba(190, 18, 60, 0.28);
    }
    .cover__date {
      font-family: Syne, system-ui, sans-serif;
      font-size: 10px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: rgba(255,255,255,.72);
      font-weight: 700;
    }
    .cover__body {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 2;
      padding: 0 20px 28px;
    }
    .cover__kicker {
      margin: 0 0 12px;
      font-family: Syne, system-ui, sans-serif;
      font-size: 11px;
      letter-spacing: 0.24em;
      text-transform: uppercase;
      color: #ffd0da;
      font-weight: 700;
    }
    .cover__title {
      margin: 0;
      font-size: clamp(30px, 8.4vw, 40px);
      line-height: 1.18;
      font-weight: 700;
      letter-spacing: -0.025em;
      max-width: 11em;
      text-shadow: 0 10px 40px rgba(0,0,0,.35);
    }
    .cover__excerpt {
      margin: 14px 0 0;
      max-width: 28em;
      font-size: 14px;
      line-height: 1.65;
      color: rgba(255,255,255,.78);
      font-family: Syne, system-ui, sans-serif;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .cover__cta {
      margin-top: 22px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 12px 18px;
      background: var(--paper);
      color: var(--char);
      font-size: 12px;
      font-weight: 700;
      font-family: Syne, system-ui, sans-serif;
      letter-spacing: 0.06em;
    }
    .cover__scroll {
      margin-top: 20px;
      display: flex;
      align-items: center;
      gap: 10px;
      font-family: Syne, system-ui, sans-serif;
      font-size: 10px;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      opacity: .7;
    }
    .cover__scroll i {
      display: block;
      width: 1px;
      height: 28px;
      background: #fff;
      transform-origin: top;
      animation: pulseLine 1.6s ease-in-out infinite;
    }
    @keyframes coverZoom {
      from { transform: scale(1.14); }
      to { transform: scale(1); }
    }
    @keyframes pulseLine {
      0%, 100% { transform: scaleY(0.35); opacity: .4; }
      50% { transform: scaleY(1); opacity: 1; }
    }
    @media (prefers-reduced-motion: reduce) {
      .cover__media img { animation: none; transform: none; }
      .cover__scroll i { animation: none; }
    }

    /* —— chips —— */
    .chips {
      margin-top: 20px;
      display: flex;
      gap: 8px;
      overflow-x: auto;
      padding: 0 20px;
      scrollbar-width: none;
    }
    .chips::-webkit-scrollbar { display: none; }
    .chip {
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 9px 16px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: var(--card);
      color: var(--mute);
      font-size: 13px;
      cursor: pointer;
      transition: .2s ease;
      box-shadow: var(--shadow-soft);
    }
    .chip:active { transform: scale(0.95); }
    .chip[aria-pressed="true"] {
      background: var(--char);
      border-color: var(--char);
      color: #fff;
      font-weight: 700;
      box-shadow: 0 10px 24px -10px rgba(20, 20, 20, .45);
    }
    .chip[aria-pressed="true"]::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--lacquer);
      box-shadow: 0 0 0 2.5px rgba(190, 18, 60, .32);
    }
    /* —— TravelMate AI 入口（编辑右侧 ✨，Gemini 风格四角星） —— */
    .chip--ai {
      padding: 9px 13px;
      border-color: var(--lacquer-soft);
      background: var(--lacquer-tint);
    }
    .chip--ai svg {
      width: 16px;
      height: 16px;
      display: block;
      flex: 0 0 auto;
    }
    .chip--ai:active { transform: scale(0.92); }

    /* —— feed —— */
    .feed { margin-top: 26px; padding: 0 20px; }
    .feed__head {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      gap: 12px;
    }
    .feed__head .label { margin: 0; }
    .feed__title {
      margin: 3px 0 0;
      font-size: 22px;
      line-height: 1.25;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--ink);
    }
    .feed__count {
      font-family: Syne, system-ui, sans-serif;
      font-size: 10px;
      letter-spacing: 0.06em;
      color: var(--mute-2);
      white-space: nowrap;
      padding-bottom: 5px;
    }

    /* HOME_PLAN_LAYOUT_LOCK=20260811-v2
       —— 行程灵感：12 篇 · 两行 × 横滑（LOCK · 禁止回退）——
       禁止：单行 flex 82% carousel；plan-tile scroll-snap-align:start（会吸掉左 gutter 贴边）。
       锁定：plan-track padding-left:20px 对齐标题；列宽留 48px 第3列 peek；两行 grid-auto-flow:column。 */
    .plan-feed {
      margin-top: 28px;
      padding: 0 20px;
    }
    .plan-feed[hidden] { display: none; }
    .plan-scroller {
      container-type: inline-size;
      container-name: plan-feed;
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior-x: contain;
      margin: 18px -20px 0;
      padding: 0 0 10px;
      scrollbar-width: none;
      scroll-padding-left: 20px;
      scroll-padding-right: 20px;
    }
    .plan-scroller::-webkit-scrollbar { display: none; }
    .plan-track {
      display: grid;
      grid-template-rows: auto auto;
      grid-auto-flow: column;
      gap: 22px 14px;
      width: max-content;
      box-sizing: content-box;
      padding-left: 20px;
      padding-right: 20px;
      /* 可视：左20 + 2列 + gap + ~48px 第3列露出 */
      grid-auto-columns: calc((min(100vw, 480px) - 20px - 14px - 48px) / 2);
    }
    @supports (width: 1cqi) {
      .plan-track {
        grid-auto-columns: calc((100cqi - 20px - 14px - 48px) / 2);
      }
    }
    .plan-tile {
      position: relative;
      width: 100%;
      min-width: 0;
      transition: transform .2s ease;
    }
    .plan-tile__link {
      display: block;
      color: inherit;
      text-decoration: none;
    }
    .plan-tile:active { transform: scale(0.97); }
    .plan-tile__media {
      position: relative;
      aspect-ratio: 10 / 13;
      overflow: hidden;
      background: transparent;
      border-radius: 18px;
      border: 0;
      box-shadow: var(--shadow-soft, 0 8px 22px rgba(20, 20, 20, .08));
    }
    .plan-tile__media img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      /* Source plan covers are square templates with ~24% color bands above/below.
         Zoom to the central photo band so the portrait card is true full-bleed. */
      transform: scale(1.92);
      display: block;
      transition: transform .55s ease;
    }
    .plan-tile__link:active .plan-tile__media img { transform: scale(1.98); }
    .plan-tile__scrim {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background: linear-gradient(180deg, transparent 42%, rgba(12, 10, 8, .78) 100%);
    }
    .plan-tile__badge {
      position: absolute;
      left: 10px;
      top: 10px;
      margin: 0;
      padding: 5px 10px;
      border-radius: 999px;
      background: #c72b17;
      font-family: "Noto Serif SC", serif;
      font-size: 11px;
      letter-spacing: .04em;
      color: #fff;
      font-weight: 700;
      pointer-events: none;
    }
    .plan-tile__fav {
      position: absolute;
      z-index: 2;
      right: 8px;
      top: 8px;
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: rgba(255, 255, 255, .16);
      color: #fff;
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      cursor: pointer;
      transition: transform .16s ease, background .2s ease;
    }
    .plan-tile__fav:active { transform: scale(.9); }
    .plan-tile__fav svg {
      width: 17px;
      height: 17px;
      fill: transparent;
      stroke: currentColor;
      stroke-width: 1.7;
      transition: fill .2s ease, transform .2s ease;
    }
    .plan-tile__fav[aria-pressed="true"] {
      background: rgba(190, 18, 60, .9);
    }
    .plan-tile__fav[aria-pressed="true"] svg {
      fill: currentColor;
      transform: scale(1.06);
    }
    .plan-tile__body {
      position: absolute;
      z-index: 1;
      left: 10px;
      right: 10px;
      bottom: 12px;
      text-align: center;
      color: #fff;
      pointer-events: none;
    }
    .plan-tile__title {
      margin: 0;
      font-size: 13px;
      line-height: 1.35;
      font-weight: 600;
      letter-spacing: .01em;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-shadow: 0 2px 10px rgba(0, 0, 0, .65);
    }
    .plan-tile__foot {
      margin: 6px 0 0;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .plan-tile__foot .tag {
      max-width: 90%;
      padding: 0;
      border: 0;
      border-radius: 0;
      background: transparent;
      color: #fff;
      font-family: "Noto Serif SC", serif;
      font-size: 11px;
      font-weight: 400;
      letter-spacing: .04em;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-shadow: 0 2px 8px rgba(0, 0, 0, .72);
    }
    .state {
      padding: 48px 12px;
      text-align: center;
      color: var(--mute);
      font-size: 14px;
    }
    .state--err { color: var(--lacquer); }
    .row {
      display: block;
      width: 100%;
      margin-top: 14px;
      padding: 16px 16px 15px;
      border: 1px solid var(--line-2);
      border-radius: var(--r-lg);
      background: var(--card);
      box-shadow: var(--shadow-soft);
      text-align: left;
      cursor: pointer;
      transition: transform .18s ease;
    }
    .row:active { transform: scale(0.985); }
    .row__meta {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
    }
    .row__meta-text {
      margin: 0;
      font-family: Syne, system-ui, sans-serif;
      font-size: 10.5px;
      letter-spacing: 0.06em;
      color: var(--lacquer);
    }
    /* Ghost bookmark button (ribbon icon): outline idle, red fill when saved */
    .bookmark {
      margin-left: auto;
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 50%;
      background: rgba(255, 255, 255, .55);
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
      color: var(--mute-2);
      cursor: pointer;
      display: grid;
      place-items: center;
      padding: 0;
      touch-action: manipulation;
      transition: transform .15s ease, color .2s ease, background .2s ease;
    }
    .bookmark svg {
      width: 18px;
      height: 18px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
      transition: fill .2s ease, stroke .2s ease;
    }
    .bookmark:active { transform: scale(0.85); }
    .bookmark[aria-pressed="true"] { color: var(--lacquer); }
    .bookmark[aria-pressed="true"] svg {
      fill: currentColor;
      animation: bookmark-pop .3s ease;
    }
    @keyframes bookmark-pop {
      0% { transform: scale(0.6); }
      60% { transform: scale(1.18); }
      100% { transform: scale(1); }
    }
    .row__main {
      margin-top: 10px;
      display: flex;
      gap: 14px;
      color: inherit;
      text-decoration: none;
    }
    .row__text { min-width: 0; flex: 1; }
    .row__title {
      margin: 0;
      font-size: 17px;
      line-height: 1.35;
      font-weight: 700;
      letter-spacing: -0.01em;
    }
    .row__excerpt {
      margin: 6px 0 0;
      font-size: 12.5px;
      line-height: 1.55;
      color: var(--mute);
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .row__foot {
      margin-top: 10px;
      display: flex;
      align-items: center;
      gap: 8px;
      font-family: Syne, system-ui, sans-serif;
      font-size: 9px;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--mute-2);
    }
    .tag {
      padding: 4px 10px;
      border-radius: 999px;
      background: var(--mist);
      color: var(--ink);
    }
    .row__thumb {
      width: 88px;
      height: 88px;
      flex-shrink: 0;
      overflow: hidden;
      background: var(--mist);
      border-radius: var(--r-md);
    }
    .row__thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform .5s ease;
    }
    .row:active .row__thumb img { transform: scale(1.04); }
    .more {
      margin: 20px 0 4px;
      width: 100%;
      padding: 14px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: var(--card);
      font-size: 13px;
      font-weight: 700;
      color: var(--mute);
      cursor: pointer;
      font-family: Syne, system-ui, sans-serif;
      letter-spacing: 0.04em;
      box-shadow: var(--shadow-soft);
      transition: transform .15s ease, border-color .2s ease, color .2s ease;
    }
    .more:active {
      transform: scale(0.98);
      border-color: var(--lacquer-soft);
      color: var(--ink);
    }
    .more:disabled { opacity: .55; }

    /* —— promo —— */
    .promo {
      position: relative;
      margin: 22px 20px 0;
      padding: 18px 16px;
      background: var(--grad-promo);
      color: #fff;
      border: 0;
      border-radius: var(--r-lg);
      display: flex;
      align-items: center;
      gap: 14px;
      overflow: hidden;
      box-shadow: var(--shadow-promo);
    }
    .promo::after {
      content: "";
      position: absolute;
      right: -36px;
      top: -48px;
      width: 140px;
      height: 140px;
      border-radius: 50%;
      background: rgba(255, 255, 255, .14);
      pointer-events: none;
    }
    .promo__icon {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: rgba(255, 255, 255, .2);
      border: 1px solid rgba(255, 255, 255, .35);
      color: #fff;
      display: grid;
      place-items: center;
      flex-shrink: 0;
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
    }
    .promo__icon svg {
      width: 20px;
      height: 20px;
      display: block;
    }
    .promo__title {
      margin: 0;
      font-size: 15px;
      font-weight: 700;
      line-height: 1.3;
      color: #fff;
    }
    .promo__sub {
      margin: 4px 0 0;
      font-size: 11px;
      color: rgba(255, 255, 255, .85);
      line-height: 1.4;
    }
    .promo__go {
      position: relative;
      z-index: 1;
      margin-left: auto;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      border: 0;
      background: #fff;
      color: #c94a62;
      cursor: pointer;
      font-size: 16px;
      font-weight: 700;
      flex-shrink: 0;
      box-shadow: 0 6px 16px rgba(140, 40, 60, .22);
      transition: transform .15s ease;
    }
    .promo__go:active { transform: scale(0.9); }

    /* —— footer：居中四行文案（布局对齐法务 footer；字体/色仍用知日食旅 token） —— */
    .site-foot {
      margin-top: 36px;
      padding: 28px 20px 20px;
      border-top: 1px solid var(--line);
      text-align: center;
    }
    .site-foot__nav {
      margin: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 10px;
      font-size: 13px;
      font-weight: 700;
      color: var(--ink);
    }
    .site-foot__nav a,
    .site-foot__nav button {
      appearance: none;
      border: 0;
      background: none;
      padding: 0;
      margin: 0;
      font: inherit;
      color: inherit;
      cursor: pointer;
      text-decoration: none;
      -webkit-tap-highlight-color: transparent;
    }
    .site-foot__nav a:active,
    .site-foot__nav button:active { opacity: 0.65; }
    .site-foot__dot {
      color: var(--mute-2);
      font-weight: 500;
      user-select: none;
    }
    .site-foot__legal {
      margin: 12px 0 0;
      font-family: Syne, system-ui, sans-serif;
      font-size: 11px;
      line-height: 1.55;
      color: var(--mute);
    }
    .site-foot__legal + .site-foot__legal { margin-top: 4px; }
    .site-foot__beian {
      color: inherit;
      text-decoration: none;
    }
    .site-foot__beian:active { opacity: 0.7; }
    .site-foot__founded {
      margin: 16px 0 0;
      font-family: Fraunces, "Noto Serif SC", serif;
      font-style: italic;
      font-size: 12px;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--mute-2);
    }

    /* —— bottom nav: liquid glass pill —— */
    .bottom-nav {
      position: fixed;
      bottom: calc(12px + var(--safe-bottom));
      left: 50%;
      transform: translateX(-50%);
      width: calc(100% - 28px);
      max-width: 452px;
      z-index: 40;
      display: flex;
      justify-content: space-around;
      align-items: center;
      padding: 7px 12px;
      background: rgba(255, 255, 255, 0.12);
      border: 1px solid rgba(255, 255, 255, 0.22);
      border-radius: 999px;
      box-shadow: 0 8px 28px -16px rgba(20, 20, 20, 0.12), inset 0 0.5px 0 rgba(255, 255, 255, 0.4);
      backdrop-filter: blur(36px) saturate(1.85);
      -webkit-backdrop-filter: blur(36px) saturate(1.85);
      transition: transform .3s ease;
    }
    .bottom-nav.is-hidden {
      transform: translate(-50%, 160%);
      pointer-events: none;
    }
    .nav-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      min-width: 48px;
      border: 0;
      background: transparent;
      color: rgba(20, 20, 20, 0.42);
      font-family: Syne, system-ui, sans-serif;
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.08em;
      cursor: pointer;
      padding: 0;
      transition: color .2s ease;
    }
    .nav-item[aria-current="page"] { color: #be123c; font-weight: 700; }
    .nav-item__icon {
      width: 36px; height: 36px; display: grid; place-items: center;
      border-radius: 50%;
      transition: background .2s ease, color .2s ease, box-shadow .2s ease;
    }
    .nav-item__icon svg { width: 20px; height: 20px; display: block; }
    .nav-item[aria-current="page"] .nav-item__icon {
      background: var(--grad-accent);
      color: #fff;
      box-shadow: 0 8px 18px -8px rgba(190, 18, 60, 0.42);
    }

    @media (prefers-reduced-motion: reduce) {
      .chrome, .bottom-nav, .row__thumb img { transition: none; }
    }