/* ===================== Explore / Destination search (redesign) ===================== */
  .exp-screen, .exp-tabbar { font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
  .exp-screen { color:#0F1B3D; background:#fff; min-height:100vh; min-height:100dvh; padding:14px 20px 96px; max-width:620px; margin:0 auto; }
  .exp-header { display:flex; align-items:center; justify-content:space-between; padding:6px 0 12px; }
  .exp-logo img { height:30px; width:auto; display:block; }
  .exp-bell { background:none; border:none; cursor:pointer; color:#0F1B3D; padding:6px; display:flex; }
  .exp-bell svg { width:24px; height:24px; }
  .exp-title { font-weight:800; font-size:27px; line-height:1.18; letter-spacing:-0.02em; color:#0F1B3D; margin:6px 0 18px; }
  .exp-search { position:relative; margin-bottom:26px; }
  .exp-search > svg { position:absolute; left:17px; top:50%; transform:translateY(-50%); width:19px; height:19px; color:#9aa3b2; pointer-events:none; }
  .exp-search input { width:100%; box-sizing:border-box; background:#FAF8F4; border:1px solid #ece6dc; border-radius:16px; padding:15px 16px 15px 46px; font:400 16px/1 'Hanken Grotesk',sans-serif; color:#0F1B3D; outline:none; }
  .exp-search input::placeholder { color:#9aa3b2; }
  .exp-search input:focus { border-color:#FF6B57; background:#fff; }
  .exp-suggest { position:absolute; left:0; right:0; top:calc(100% + 6px); background:#fff; border:1px solid #ece6dc; border-radius:14px; box-shadow:0 12px 30px rgba(8,13,32,.14); overflow:hidden auto; z-index:6; display:none; max-height:280px; }
  .exp-suggest-item { padding:11px 16px; font-family:'Hanken Grotesk',sans-serif; color:#0F1B3D; cursor:pointer; border-bottom:1px solid #f1ece3; }
  .exp-suggest-item:last-child { border-bottom:none; }
  .exp-suggest-item:hover { background:#FAF8F4; }
  .exp-sug-main { display:block; font:600 14.5px/1.3 'Hanken Grotesk',sans-serif; }
  .exp-sug-sub { display:block; font:400 12.5px/1.3 'Hanken Grotesk',sans-serif; color:#9aa3b2; margin-top:1px; }
  .exp-label { font:600 12px/1 'Hanken Grotesk',sans-serif; letter-spacing:.16em; text-transform:uppercase; color:#9aa3b2; margin:0 0 14px; }
  .exp-guides { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
  .exp-guide { position:relative; border:none; padding:0; cursor:pointer; border-radius:18px; overflow:hidden; aspect-ratio:1/1; background:#0F1B3D center/cover no-repeat; display:flex; align-items:flex-end; text-align:left; }
  .exp-guide:first-child { grid-column:1 / -1; aspect-ratio:16/9; }
  .exp-guide::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,13,32,0) 42%, rgba(8,13,32,.62) 100%); }
  .exp-guide-name { position:relative; z-index:1; color:#fff; font:700 16px/1.2 'Hanken Grotesk',sans-serif; padding:14px 16px; letter-spacing:-0.01em; }
  /* New bottom tab bar */
  .exp-tabbar { position:fixed; left:0; right:0; bottom:0; z-index:40; display:flex; background:#fff; border-top:1px solid #eef0f3; padding:8px 4px calc(8px + env(safe-area-inset-bottom,0px)); }
  .exp-tabbar button { flex:1; background:none; border:none; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:3px; color:#9aa3b2; font:600 10.5px/1.2 'Hanken Grotesk',sans-serif; padding:4px 0; }
  .exp-tabbar button svg { width:23px; height:23px; }
  .exp-tabbar button.active { color:#FF6B57; }
  body.explore-view #mobileTabbar { display:none !important; }
  body.explore-view { background:#fff; }
  body.explore-view #main { padding:0; }

  /* ===================== Guide Choice (redesign) — shown when the chosen destination has a guide ===================== */
  .gc-screen { font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; -webkit-font-smoothing:antialiased; color:#0F1B3D; background:#fff; min-height:100vh; min-height:100dvh; max-width:620px; margin:0 auto; position:relative; overflow:hidden; }
  /* Hero photo + gradient */
  .gc-hero { position:relative; height:44vh; min-height:340px; max-height:460px; background:#0F1B3D center/cover no-repeat; }
  .gc-hero-ov { position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,12,28,.36) 0%, rgba(8,12,28,0) 32%, rgba(8,12,28,.58) 100%); }
  .gc-topbar { position:absolute; top:calc(env(safe-area-inset-top,0px) + 16px); left:20px; right:20px; display:flex; align-items:center; justify-content:space-between; }
  .gc-iconbtn { width:40px; height:40px; border-radius:999px; background:rgba(255,255,255,.22); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.32); display:flex; align-items:center; justify-content:center; color:#fff; cursor:pointer; padding:0; }
  .gc-iconbtn svg { width:20px; height:20px; }
  .gc-iconbtn:active { transform:scale(.94); }
  .gc-herotext { position:absolute; left:24px; right:24px; bottom:50px; }
  .gc-dest { margin:0; color:#fff; font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; font-weight:700; font-size:clamp(34px,9vw,42px); line-height:1.04; letter-spacing:-0.03em; }
  .gc-destsub { margin-top:8px; font-weight:600; font-size:15px; color:rgba(255,255,255,.88); }
  /* White sheet pulled up over the photo */
  .gc-sheet { position:relative; z-index:2; margin-top:-28px; background:#fff; border-radius:28px 28px 0 0; padding:26px 22px calc(26px + env(safe-area-inset-bottom,0px)); }
  .gc-h2 { margin:0; color:#0F1B3D; font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; font-weight:700; font-size:22px; letter-spacing:-0.03em; }
  /* Option cards (full-card buttons) */
  .gc-card { display:flex; align-items:center; gap:14px; width:100%; box-sizing:border-box; border-radius:20px; text-align:left; cursor:pointer; transition:transform .12s ease; -webkit-tap-highlight-color:transparent; }
  .gc-card:active { transform:translateY(1px); }
  .gc-card--guide { margin-top:16px; padding:20px 18px; background:#0F1B3D; border:none; }
  .gc-card--diy { margin-top:12px; padding:18px; background:transparent; border:1px solid #E6E8EC; }
  .gc-card-main { flex:1 1 auto; min-width:0; }
  .gc-mark { width:22px; height:auto; display:block; margin-bottom:10px; }
  .gc-card-head { display:flex; align-items:baseline; gap:8px; }
  .gc-card-title { font-weight:700; font-size:17.5px; letter-spacing:-0.015em; }
  .gc-card--guide .gc-card-title { color:#fff; }
  .gc-card--diy .gc-card-title { color:#0F1B3D; }
  .gc-card-price { font-weight:700; font-size:16px; color:#FF6B57; }
  .gc-badge { font-weight:700; font-size:11.5px; letter-spacing:0.04em; color:#0F1B3D; background:#F4F1EA; border-radius:999px; padding:4px 10px; }
  .gc-card-desc { margin:7px 0 0; font-weight:400; font-size:13.5px; line-height:1.45; }
  .gc-card--guide .gc-card-desc { color:rgba(255,255,255,.72); }
  .gc-card-desc--muted { color:#6D778F; }
  .gc-arrow { flex:none; width:38px; height:38px; border-radius:999px; display:flex; align-items:center; justify-content:center; }
  .gc-arrow svg { width:17px; height:17px; }
  .gc-arrow--coral { background:#FF6B57; color:#fff; }
  .gc-arrow--ghost { background:transparent; border:1.5px solid #E6E8EC; color:#0F1B3D; }
  .gc-foot { margin-top:16px; text-align:center; font-weight:400; font-size:12.5px; color:#6D778F; }
  body.guidechoice-view #mobileTabbar { display:none !important; }
  body.guidechoice-view { background:#fff; }
  body.guidechoice-view #main { padding:0; }

  /* ===================== Guide Studio + Builder (web redesign) ===================== */
  /* Full-bleed shell: hide the old sidebar/tab-bar, give the studio the whole window. */
  body.studio-view .app { grid-template-columns:1fr; }
  body.studio-view .sidebar { display:none !important; }
  body.studio-view #mobileTabbar { display:none !important; }
  body.studio-view #main { padding:0 !important; }
  body.studio-view { background:#FAF8F4; }
  .st-wrap, .st-wrap * { font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; box-sizing:border-box; -webkit-font-smoothing:antialiased; }
  .st-wrap { color:#0F1B3D; background:#FAF8F4; min-height:100vh; min-height:100dvh; }
  .st-mono { font-family:'IBM Plex Mono',ui-monospace,monospace; }
  /* Slim top bar */
  .st-topbar { display:flex; align-items:center; gap:14px; height:60px; padding:0 28px; background:#fff; border-bottom:1px solid #ECE6DC; position:sticky; top:0; z-index:5; }
  .st-back { display:inline-flex; align-items:center; gap:6px; background:none; border:none; cursor:pointer; color:#6D778F; font:600 14.5px/1 'Hanken Grotesk',sans-serif; padding:8px 4px; }
  .st-back svg { width:20px; height:20px; }
  .st-back:hover { color:#0F1B3D; }
  .st-topbar-logo { height:24px; width:auto; display:block; }
  .st-topbar-sp { flex:1; }
  .st-avatar { width:38px; height:38px; border-radius:999px; background:#0F1B3D; color:#fff; font:700 15px/1 'Hanken Grotesk',sans-serif; display:flex; align-items:center; justify-content:center; }
  /* Buttons */
  .st-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:999px; font:700 15.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:-0.01em; padding:0 24px; height:48px; cursor:pointer; border:none; transition:transform .1s ease, background .15s ease; white-space:nowrap; }
  .st-btn:active { transform:translateY(1px); }
  .st-btn svg { width:18px; height:18px; }
  .st-btn--coral { background:#FF6B57; color:#fff; box-shadow:0 10px 24px rgba(255,107,87,.3); }
  .st-btn--coral:hover { background:#f65a45; }
  .st-btn--navy { background:#0F1B3D; color:#fff; }
  .st-btn--navy:hover { background:#16244d; }
  .st-btn--ghost { background:#fff; color:#0F1B3D; border:1px solid #E6E8EC; }
  .st-btn--ghost:hover { border-color:#0F1B3D; }
  .st-btn--sm { height:44px; font-size:15px; padding:0 20px; }
  .st-btn:disabled { opacity:.55; cursor:default; transform:none; box-shadow:none; }
  /* ---- Studio (list) ---- */
  .st-page { max-width:1140px; margin:0 auto; padding:40px 48px 72px; }
  .st-eyebrow { color:#FF6B57; font:700 11px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.14em; text-transform:uppercase; margin:0 0 10px; }
  .st-h1 { color:#0F1B3D; font:700 38px/1.05 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; margin:0; }
  .st-sub { color:#6D778F; font:400 15px/1.4 'Hanken Grotesk',sans-serif; margin:9px 0 0; max-width:520px; }
  .st-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:28px; }
  .st-statrow { display:flex; gap:16px; margin-bottom:34px; flex-wrap:wrap; }
  .st-stat { background:#fff; border:1px solid #ECE6DC; border-radius:20px; padding:20px 22px; min-width:170px; }
  .st-stat-num { color:#0F1B3D; font:500 32px/1 'IBM Plex Mono',monospace; letter-spacing:-0.01em; }
  .st-stat-num.coral { color:#FF6B57; }
  .st-stat-lbl { color:#6D778F; font:600 13px/1.2 'Hanken Grotesk',sans-serif; margin-top:6px; }
  .st-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
  .st-card { background:#fff; border:1px solid #ECE6DC; border-radius:20px; overflow:hidden; display:flex; flex-direction:column; }
  .st-card-cover { position:relative; height:168px; background:#0F1B3D center/cover no-repeat; }
  .st-card-cover.noimg { display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.5); background:#0F1B3D; }
  .st-card-cover.noimg svg { width:40px; height:40px; }
  .st-pill { position:absolute; top:14px; left:14px; display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.92); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-radius:999px; padding:5px 11px; font:700 11px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.04em; }
  .st-pill .dot { width:6px; height:6px; border-radius:999px; }
  .st-pill.live { color:#1F8A5B; } .st-pill.live .dot { background:#1F8A5B; }
  .st-pill.draft { color:#6D778F; } .st-pill.draft .dot { background:#b8bdc7; }
  .st-card-body { padding:18px 20px 20px; }
  .st-card-title { color:#0F1B3D; font:700 22px/1.15 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; }
  .st-card-meta { color:#6D778F; font:400 13.5px/1.3 'Hanken Grotesk',sans-serif; margin-top:4px; }
  .st-card-actions { display:flex; gap:10px; margin-top:16px; }
  .st-cta { display:flex; align-items:center; gap:18px; background:#fff; border:1px solid #ECE6DC; border-radius:20px; padding:22px 26px; margin-top:24px; }
  .st-cta-ico { flex:none; width:50px; height:50px; border-radius:999px; background:#FF6B57; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 22px rgba(255,107,87,.32); }
  .st-cta-ico svg { width:24px; height:24px; }
  .st-cta-main { flex:1; min-width:0; }
  .st-cta-title { color:#0F1B3D; font:700 17px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.015em; }
  .st-cta-sub { color:#6D778F; font:400 13.5px/1.35 'Hanken Grotesk',sans-serif; margin-top:2px; }
  .st-empty { background:#fff; border:1px dashed #d8d2c6; border-radius:20px; padding:40px; text-align:center; color:#6D778F; }
  .st-empty strong { display:block; color:#0F1B3D; font-size:17px; margin-bottom:4px; }
  /* ---- Builder (two columns) ---- */
  .st-builder { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0; align-items:start; }
  /* Add-places map view (guide builder) */
  .ap-builder { display:grid; grid-template-columns:380px minmax(0,1fr); min-height:calc(100vh - 60px); }
  .ap-panel { padding:26px 26px 24px; border-right:1px solid #ECE6DC; display:flex; flex-direction:column; max-height:calc(100vh - 60px); overflow:auto; }
  .ap-crumb { color:#6D778F; font:700 11px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.1em; text-transform:uppercase; }
  .ap-h1 { color:#0F1B3D; font:700 24px/1.1 'Hanken Grotesk',sans-serif; letter-spacing:-0.02em; margin:9px 0 4px; }
  .ap-sub { color:#6D778F; font:400 14px/1.45 'Hanken Grotesk',sans-serif; margin:0 0 18px; }
  .ap-sech { color:#0F1B3D; font:700 12px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.05em; text-transform:uppercase; margin:18px 0 10px; display:flex; justify-content:space-between; align-items:center; }
  .ap-sech span { color:#6D778F; font-weight:600; letter-spacing:0; text-transform:none; }
  .ap-empty { background:#fff; border:1px dashed #d8d2c6; border-radius:16px; padding:26px 18px; text-align:center; color:#6D778F; font:400 13.5px/1.5 'Hanken Grotesk',sans-serif; }
  .ap-empty strong { display:block; color:#0F1B3D; font:700 15px/1.3 'Hanken Grotesk',sans-serif; margin-bottom:5px; }
  .ap-actions { margin-top:18px; display:flex; flex-direction:column; gap:10px; }
  .ap-addmanual { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:#fff; border:1px solid #E6E8EC; border-radius:13px; padding:12px; cursor:pointer; color:#0F1B3D; font:700 14px/1 'Hanken Grotesk',sans-serif; }
  .ap-addmanual:hover { border-color:#0F1B3D; }
  .ap-addmanual svg { width:16px; height:16px; }
  .ap-done { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:#FF6B57; color:#fff; border:none; border-radius:13px; padding:14px; cursor:pointer; font:700 15px/1 'Hanken Grotesk',sans-serif; box-shadow:0 10px 24px rgba(255,107,87,.3); margin-top:20px; }
  .ap-done svg { width:18px; height:18px; flex:none; }
  .ap-mapwrap { position:relative; background:#E2EAEB; min-height:calc(100vh - 60px); }
  .ap-mapwrap .map-container { position:absolute; inset:0; width:100%; height:100%; }
  .ap-mapwrap .map-loading { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#6D778F; font:600 14px/1 'Hanken Grotesk',sans-serif; }
  .ap-search { position:absolute; top:18px; left:50%; transform:translateX(-50%); width:min(540px,88%); z-index:6; }
  .ap-search-box { display:flex; align-items:center; gap:10px; background:#fff; border-radius:14px; box-shadow:0 6px 22px rgba(8,12,28,.16); padding:12px 16px; }
  .ap-search-box svg { width:18px; height:18px; flex:none; color:#6D778F; }
  .ap-search-box input { flex:1; border:none; outline:none; background:none; font:500 15px/1.2 'Hanken Grotesk',sans-serif; color:#0F1B3D; }
  .ap-suggest { display:none; margin-top:8px; background:#fff; border-radius:14px; box-shadow:0 12px 32px rgba(8,12,28,.18); overflow:hidden; }
  .ap-suggest-item { display:block; width:100%; text-align:left; border:none; background:none; cursor:pointer; padding:12px 16px; border-bottom:1px solid #F0ECE3; }
  .ap-suggest-item:last-child { border-bottom:none; }
  .ap-suggest-item:hover { background:#FAF8F4; }
  .ap-sug-main { display:block; color:#0F1B3D; font:600 14.5px/1.2 'Hanken Grotesk',sans-serif; }
  .ap-sug-sub { display:block; color:#6D778F; font:400 12.5px/1.3 'Hanken Grotesk',sans-serif; margin-top:2px; }
  .ap-sug-foot { padding:8px 16px; color:#9aa3b2; font:400 11px/1 'Hanken Grotesk',sans-serif; text-align:right; }
  .ap-mapcount { position:absolute; top:74px; left:50%; transform:translateX(-50%); z-index:5; background:rgba(255,255,255,.96); border-radius:999px; padding:7px 15px; color:#0F1B3D; font:700 12.5px/1 'Hanken Grotesk',sans-serif; box-shadow:0 4px 16px rgba(8,12,28,.12); }
  /* Bottom card carousel over the builder map (mirrors the trip map .em-strip) */
  .ap-strip { position:absolute; left:0; right:0; bottom:18px; z-index:5; overflow-x:auto; overflow-y:visible; padding:6px 18px; scrollbar-width:none; }
  .ap-strip::-webkit-scrollbar { display:none; }
  .ap-strip .card-row { display:flex; gap:12px; width:max-content; max-width:none; }
  .ap-card-save { position:absolute; top:8px; right:8px; width:30px; height:30px; border-radius:999px; background:rgba(255,255,255,.93); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#0F1B3D; box-shadow:0 2px 8px rgba(8,12,28,.14); }
  .ap-card-save svg { width:15px; height:15px; }
  .ap-card-save.on { background:#FF6B57; color:#fff; }
  @media (max-width:860px) {
    .ap-builder { grid-template-columns:1fr; }
    .ap-mapwrap { min-height:0; height:300px; order:-1; }
    .ap-panel { max-height:none; border-right:none; border-top:1px solid #ECE6DC; }
  }
  .st-editor { padding:32px 40px 40px; max-width:640px; margin:0 auto; width:100%; }
  .st-preview-col { background:#FAF8F4; border-left:1px solid #ECE6DC; min-height:calc(100vh - 60px); position:sticky; top:60px; align-self:stretch; }
  .st-crumb { color:#6D778F; font:600 13px/1 'Hanken Grotesk',sans-serif; }
  .st-edit-head { display:flex; align-items:center; gap:12px; margin:14px 0 0; }
  .st-edit-title { color:#0F1B3D; font:700 27px/1.1 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; margin:0; }
  .st-edit-sub { color:#6D778F; font:400 14px/1.4 'Hanken Grotesk',sans-serif; margin:10px 0 0; }
  .st-step { display:flex; align-items:center; gap:12px; margin:30px 0 14px; }
  .st-step-num { flex:none; width:24px; height:24px; border-radius:999px; background:#0F1B3D; color:#fff; font:700 11.5px/1 'Hanken Grotesk',sans-serif; display:flex; align-items:center; justify-content:center; }
  .st-step-lbl { color:#0F1B3D; font:700 12px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.12em; text-transform:uppercase; }
  .st-step-line { flex:1; height:1px; background:#E6E8EC; }
  /* cover */
  .st-cover { position:relative; height:150px; border-radius:14px; overflow:hidden; background:#0F1B3D center/cover no-repeat; display:flex; align-items:center; justify-content:center; }
  .st-cover.noimg { color:rgba(255,255,255,.5); }
  .st-cover.noimg svg { width:34px; height:34px; }
  .st-cover-ov { position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,12,28,0) 40%,rgba(8,12,28,.34) 100%); }
  .st-cover-btn { position:absolute; right:12px; bottom:12px; display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border:none; border-radius:999px; padding:8px 14px; font:700 12.5px/1 'Hanken Grotesk',sans-serif; color:#0F1B3D; cursor:pointer; }
  .st-cover-btn svg { width:14px; height:14px; }
  .st-field { margin-top:16px; }
  .st-field-head { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:7px; }
  .st-label { color:#0F1B3D; font:700 13px/1 'Hanken Grotesk',sans-serif; letter-spacing:-0.01em; }
  .st-counter { color:#6D778F; font:600 11.5px/1 'Hanken Grotesk',sans-serif; }
  .st-input, .st-textarea { width:100%; background:#fff; border:1px solid #E6E8EC; border-radius:14px; padding:13px 15px; font:600 15px/1.4 'Hanken Grotesk',sans-serif; color:#0F1B3D; outline:none; }
  .st-textarea { resize:vertical; min-height:64px; font-weight:600; }
  .st-input::placeholder, .st-textarea::placeholder { color:#9aa3b2; font-weight:500; }
  .st-input:focus, .st-textarea:focus { border-color:#FF6B57; }
  /* places summary (navy) */
  .st-places-sum { display:flex; align-items:center; gap:14px; background:#0F1B3D; border-radius:14px; padding:14px 16px; }
  .st-places-sum-main { flex:1; min-width:0; }
  .st-places-sum-t { color:#fff; font:700 13.5px/1.3 'Hanken Grotesk',sans-serif; }
  .st-places-sum-t b { color:#fff; }
  .st-places-sum-sub { color:rgba(255,255,255,.66); font:400 11.5px/1.35 'Hanken Grotesk',sans-serif; margin-top:2px; }
  .st-places-sum-count { color:#FF6B57; font:700 12.5px/1 'Hanken Grotesk',sans-serif; white-space:nowrap; }
  /* place row */
  .st-place { display:flex; align-items:center; gap:12px; background:#fff; border:1px solid #E6E8EC; border-radius:14px; padding:10px 12px; margin-top:10px; }
  .st-place-grip { flex:none; display:grid; grid-template-columns:3.5px 3.5px; gap:3.5px; padding:2px; cursor:grab; }
  .st-place-grip span { width:3.5px; height:3.5px; border-radius:9px; background:#cdd2da; }
  .st-place-thumb { flex:none; width:46px; height:46px; border-radius:10px; background:#eceae4 center/cover no-repeat; }
  .st-place-thumb.noimg { display:flex; align-items:center; justify-content:center; color:#b8bdc7; }
  .st-place-thumb.noimg svg { width:20px; height:20px; }
  .st-place-info { flex:1; min-width:0; cursor:pointer; }
  .st-place-name { color:#0F1B3D; font:700 14px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .st-place-meta { color:#6D778F; font:400 12px/1.3 'Hanken Grotesk',sans-serif; margin-top:2px; }
  .st-place-right { flex:none; display:flex; align-items:center; gap:9px; }
  .st-place-flag { font:700 11px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.02em; }
  .st-place-flag.free { color:#FF6B57; } .st-place-flag.locked { color:#9aa3b2; }
  .st-toggle { flex:none; width:38px; height:22px; border-radius:999px; background:#E6E8EC; border:none; cursor:pointer; padding:0; position:relative; transition:background .15s ease; }
  .st-toggle.on { background:#FF6B57; }
  .st-toggle::after { content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:999px; background:#fff; transition:transform .15s ease; box-shadow:0 1px 3px rgba(0,0,0,.2); }
  .st-toggle.on::after { transform:translateX(16px); }
  .st-morebtn { display:block; width:100%; margin-top:10px; background:#F7F4EE; border:1px solid #ECE6DC; border-radius:13px; padding:12px; cursor:pointer; color:#0F1B3D; font:700 13.5px/1 'Hanken Grotesk',sans-serif; }
  .st-morebtn:hover { border-color:#0F1B3D; }
  .st-place-actions { display:flex; gap:10px; margin-top:12px; }
  .st-chipbtn { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:6px; border-radius:13px; height:44px; font:700 13px/1 'Hanken Grotesk',sans-serif; cursor:pointer; }
  .st-chipbtn svg { width:16px; height:16px; flex:none; }
  .st-chipbtn--ghost { background:#fff; border:1px solid #E6E8EC; color:#6D778F; }
  .st-chipbtn--ghost:hover { color:#0F1B3D; border-color:#0F1B3D; }
  .st-chipbtn--add { background:#fff6f4; border:1px solid #ffd9d1; color:#FF6B57; }
  .st-chipbtn--add:hover { background:#ffeee9; }
  /* price box (navy) */
  .st-pricebox { background:#0F1B3D; border-radius:16px; padding:20px; }
  .st-price-lbl { color:rgba(255,255,255,.6); font:700 12px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.1em; text-transform:uppercase; }
  .st-price-row { display:flex; align-items:center; gap:18px; margin-top:14px; }
  .st-step-btn { flex:none; width:40px; height:40px; border-radius:999px; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font:700 22px/1 'Hanken Grotesk',sans-serif; }
  .st-step-btn.minus { background:rgba(255,255,255,.1); color:#fff; }
  .st-step-btn.plus { background:#FF6B57; color:#fff; }
  .st-price-val { flex:1; display:flex; align-items:baseline; gap:2px; color:#fff; }
  .st-price-cur { font:500 26px/1 'IBM Plex Mono',monospace; }
  .st-price-amt { font:500 44px/1 'IBM Plex Mono',monospace; letter-spacing:-0.02em; }
  .st-price-free { font:700 22px/1 'Hanken Grotesk',sans-serif; color:#fff; }
  .st-price-div { height:1px; background:rgba(255,255,255,.14); margin:16px 0; }
  .st-keep { display:flex; align-items:center; gap:9px; }
  .st-keep-ico { width:18px; height:18px; border-radius:999px; background:#1F8A5B; color:#fff; display:flex; align-items:center; justify-content:center; flex:none; }
  .st-keep-ico svg { width:11px; height:11px; }
  .st-keep-t { color:#fff; font:700 14.5px/1 'Hanken Grotesk',sans-serif; }
  .st-keep-sub { color:rgba(255,255,255,.62); font:400 12px/1.3 'Hanken Grotesk',sans-serif; margin-top:5px; }
  /* action bar */
  .st-actionbar { display:flex; align-items:center; gap:12px; margin-top:30px; padding-top:20px; border-top:1px solid #E6E8EC; }
  .st-actionbar-status { color:#6D778F; font:600 12.5px/1 'Hanken Grotesk',sans-serif; display:flex; align-items:center; gap:7px; flex:1; }
  .st-actionbar-status .dot { width:7px; height:7px; border-radius:999px; background:#1F8A5B; }
  /* ---- Live preview pane ---- */
  .st-preview { padding:24px 28px 40px; }
  .st-preview-head { display:flex; align-items:center; gap:9px; margin-bottom:14px; }
  .st-preview-head .dot { width:8px; height:8px; border-radius:999px; background:#FF6B57; }
  .st-preview-head-t { color:#0F1B3D; font:700 12px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.08em; text-transform:uppercase; flex:1; }
  .st-preview-head-badge { background:#fff; border:1px solid #E6E8EC; border-radius:999px; padding:5px 11px; color:#0F1B3D; font:700 12px/1 'Hanken Grotesk',sans-serif; }
  .st-pv-card { background:#fff; border:1px solid #ECE6DC; border-radius:20px; overflow:hidden; }
  .st-pv-hero { position:relative; height:190px; background:#0F1B3D center/cover no-repeat; display:flex; flex-direction:column; justify-content:flex-end; padding:16px 18px; }
  .st-pv-hero-ov { position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,12,28,.15) 0%,rgba(8,12,28,.66) 100%); }
  .st-pv-tag { position:absolute; top:14px; left:16px; background:rgba(255,255,255,.93); border-radius:999px; padding:5px 10px; color:#0F1B3D; font:700 9.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.1em; text-transform:uppercase; }
  .st-pv-herorow { position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
  .st-pv-title { color:#fff; font:700 26px/1.05 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; }
  .st-pv-sub { color:rgba(255,255,255,.86); font:400 13.5px/1.3 'Hanken Grotesk',sans-serif; margin-top:5px; }
  .st-pv-price { flex:none; background:#FF6B57; color:#fff; border-radius:999px; padding:9px 16px; font:700 16px/1 'Hanken Grotesk',sans-serif; }
  .st-pv-body { padding:18px; }
  .st-pv-desc { color:#6D778F; font:400 14px/1.5 'Hanken Grotesk',sans-serif; margin:0 0 16px; }
  .st-pv-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; }
  .st-pv-mini { border-radius:13px; overflow:hidden; border:1px solid #ECE6DC; background:#fff; }
  .st-pv-mini-img { position:relative; height:84px; background:#eceae4 center/cover no-repeat; }
  .st-pv-mini-price { position:absolute; top:8px; right:8px; background:rgba(255,255,255,.94); border-radius:999px; padding:3px 8px; color:#0F1B3D; font:700 10.5px/1 'Hanken Grotesk',sans-serif; }
  .st-pv-mini-tag { position:absolute; top:8px; left:8px; background:#FF6B57; color:#fff; border-radius:999px; padding:3px 7px; font:700 9px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.04em; text-transform:uppercase; }
  .st-pv-mini-lock { position:absolute; inset:0; background:rgba(247,245,241,.32); display:flex; align-items:center; justify-content:center; }
  .st-pv-mini-lock-ic { width:30px; height:30px; border-radius:999px; background:rgba(15,27,61,.92); color:#fff; display:flex; align-items:center; justify-content:center; }
  .st-pv-mini-lock-ic svg { width:15px; height:15px; }
  .st-pv-mini-body { padding:9px 10px 11px; }
  .st-pv-mini-cat { color:#6D778F; font:700 9.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.07em; text-transform:uppercase; }
  .st-pv-mini-name { color:#0F1B3D; font:700 12.5px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.01em; margin-top:4px; }
  .st-pv-empty { color:#9aa3b2; font:500 13px/1.5 'Hanken Grotesk',sans-serif; text-align:center; padding:24px; }
  /* ---- Publish success modal ---- */
  .st-modal { position:fixed; inset:0; z-index:120; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(8,12,28,.42); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
  .st-modal.open { display:flex; }
  .st-modal-card { background:#fff; border-radius:24px; width:100%; max-width:460px; overflow:hidden; box-shadow:0 30px 80px rgba(8,12,28,.4); }
  .st-modal-hero { position:relative; height:140px; background:#0F1B3D center/cover no-repeat; }
  .st-modal-check { position:absolute; right:18px; bottom:-18px; width:46px; height:46px; border-radius:999px; background:#1F8A5B; color:#fff; display:flex; align-items:center; justify-content:center; border:3px solid #fff; }
  .st-modal-check svg { width:22px; height:22px; }
  .st-modal-body { padding:28px 26px 26px; }
  .st-modal-h { color:#0F1B3D; font:700 26px/1.1 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; margin:0; }
  .st-modal-p { color:#6D778F; font:400 14px/1.5 'Hanken Grotesk',sans-serif; margin:8px 0 0; }
  .st-modal-p b { color:#0F1B3D; }
  .st-modal-link { display:flex; align-items:center; gap:10px; background:#F4F1EA; border-radius:14px; padding:8px 8px 8px 14px; margin:18px 0; }
  .st-modal-link span { flex:1; min-width:0; color:#0F1B3D; font:400 13px/1.3 'Hanken Grotesk',sans-serif; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .st-modal-actions { display:flex; gap:12px; }
  .st-modal-actions .st-btn { flex:1; }
  @media (max-width:980px) {
    .st-page { padding:28px 22px 64px; }
    .st-grid { grid-template-columns:1fr; }
    .st-h1 { font-size:30px; }
  }
  /* Builder is desktop-only "for now": the gate panel */
  .st-gate { max-width:480px; margin:0 auto; padding:80px 28px; text-align:center; }
  .st-gate-ico { width:64px; height:64px; border-radius:18px; background:#fff; border:1px solid #ECE6DC; color:#FF6B57; display:flex; align-items:center; justify-content:center; margin:0 auto 20px; }
  .st-gate-ico svg { width:30px; height:30px; }
  .st-gate h2 { color:#0F1B3D; font:700 24px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.02em; margin:0 0 8px; }
  .st-gate p { color:#6D778F; font:400 15px/1.5 'Hanken Grotesk',sans-serif; margin:0 0 22px; }

  /* ===================== Explore Map (trip map redesign) ===================== */
  /* Full-bleed map shell — hide the old sidebar/tab bar (new bottom tab bar takes over). */
  body.exploremap-view .app { grid-template-columns:1fr; }
  body.exploremap-view .sidebar { display:none !important; }
  body.exploremap-view #mobileTabbar { display:none !important; }
  body.exploremap-view #main { padding:0 !important; overflow:hidden !important; }
  .em-screen { position:relative; height:100vh; height:100dvh; width:100%; overflow:hidden; font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
  .em-screen .map-container { position:absolute; inset:0; width:100%; height:100%; }
  .em-screen .map-loading, .em-screen .map-error { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:1; }
  /* Top floating search + filter */
  .em-top { position:absolute; top:calc(env(safe-area-inset-top,0px) + 14px); left:0; right:0; z-index:6; display:flex; align-items:flex-start; gap:10px; padding:0 20px; max-width:720px; margin:0 auto; box-sizing:border-box; }
  .em-searchwrap { flex:1; position:relative; min-width:0; }
  .em-search { display:flex; align-items:center; gap:10px; height:46px; padding:0 17px; background:rgba(255,255,255,.95); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-radius:999px; box-shadow:0 4px 18px rgba(8,12,28,.12); color:#6D778F; font:400 14px/1 'Hanken Grotesk',sans-serif; }
  .em-search svg { width:18px; height:18px; color:#9aa3b2; flex:none; }
  .em-search input { flex:1; min-width:0; border:none; outline:none; background:none; font:400 14px/1 'Hanken Grotesk',sans-serif; color:#0F1B3D; }
  .em-search input::placeholder { color:#6D778F; }
  /* the search-to-add dropdown floats below the pill without stretching the row */
  .em-searchwrap .ap-suggest { position:absolute; top:100%; left:0; right:0; z-index:20; }
  .em-iconbtn { flex:none; width:46px; height:46px; border-radius:999px; background:rgba(255,255,255,.95); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 4px 18px rgba(8,12,28,.12); display:flex; align-items:center; justify-content:center; border:none; cursor:pointer; color:#0F1B3D; position:relative; }
  .em-iconbtn svg { width:20px; height:20px; }
  .em-guidesbtn { flex:none; height:46px; padding:0 16px; border-radius:999px; background:rgba(255,255,255,.95); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 4px 18px rgba(8,12,28,.12); display:flex; align-items:center; gap:8px; border:none; cursor:pointer; color:#0F1B3D; font:700 13px/1 'Hanken Grotesk',sans-serif; white-space:nowrap; }
  .em-guidesbtn svg { width:18px; height:18px; flex:none; }
  .em-filter-count { position:absolute; top:-3px; right:-3px; min-width:17px; height:17px; padding:0 4px; border-radius:999px; background:#FF6B57; color:#fff; font:700 10px/17px 'Hanken Grotesk',sans-serif; text-align:center; }
  /* Count chip */
  .em-count { position:absolute; top:calc(env(safe-area-inset-top,0px) + 72px); left:20px; z-index:5; background:rgba(255,255,255,.95); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:0 4px 14px rgba(8,12,28,.1); border-radius:999px; padding:7px 13px; color:#0F1B3D; font:700 12px/1 'Hanken Grotesk',sans-serif; }
  /* Empty 'add your first place' card */
  .em-emptycard { position:absolute; top:46%; left:50%; transform:translate(-50%,-50%); width:min(320px, calc(100% - 80px)); z-index:5; background:rgba(255,255,255,.97); border-radius:24px; box-shadow:0 18px 44px rgba(8,12,28,.16); padding:26px 24px 24px; display:flex; flex-direction:column; align-items:center; text-align:center; cursor:pointer; border:none; }
  .em-emptycard-ico { width:54px; height:54px; border-radius:999px; background:#FF6B57; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 24px rgba(255,107,87,.32); margin-bottom:14px; }
  .em-emptycard-ico svg { width:26px; height:26px; }
  .em-emptycard h3 { margin:0; color:#0F1B3D; font:700 17px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.015em; }
  .em-emptycard p { margin:6px 0 0; color:#6D778F; font:400 13.5px/1.5 'Hanken Grotesk',sans-serif; }
  /* Guide-upsell banner (day zero, when a guide exists) */
  .em-banner { position:absolute; left:20px; right:20px; bottom:calc(86px + env(safe-area-inset-bottom,0px)); z-index:5; display:flex; align-items:center; gap:14px; background:#0F1B3D; border-radius:20px; box-shadow:0 14px 34px rgba(8,12,28,.28); padding:16px 18px; cursor:pointer; max-width:680px; margin:0 auto; box-sizing:border-box; }
  .em-banner-main { flex:1; min-width:0; }
  .em-banner-t { color:#fff; font:700 15.5px/1.25 'Hanken Grotesk',sans-serif; letter-spacing:-0.01em; }
  .em-banner-t b { color:#FF6B57; font-weight:700; }
  .em-banner-sub { color:rgba(255,255,255,.72); font:400 12.5px/1.45 'Hanken Grotesk',sans-serif; margin-top:4px; }
  .em-banner-arrow { flex:none; width:36px; height:36px; border-radius:999px; background:#FF6B57; color:#fff; display:flex; align-items:center; justify-content:center; }
  .em-banner-arrow svg { width:16px; height:16px; }
  /* Place-card carousel */
  .em-strip { position:absolute; left:0; right:0; bottom:calc(80px + env(safe-area-inset-bottom,0px)); z-index:5; overflow-x:auto; overflow-y:visible; -webkit-overflow-scrolling:touch; padding:6px 20px; scrollbar-width:none; }
  .em-strip::-webkit-scrollbar { display:none; }
  .em-strip .card-row { display:flex; gap:12px; width:max-content; max-width:none; }
  .em-card { flex:none; width:200px; background:#fff; border-radius:20px; box-shadow:0 12px 30px rgba(8,12,28,.16); padding:9px; cursor:pointer; transition:transform .12s ease; }
  .em-card:active { transform:translateY(1px); }
  .em-card-imgwrap { position:relative; height:98px; border-radius:12px; overflow:hidden; background:#eceae4; }
  .em-card-img { width:100%; height:100%; object-fit:cover; display:block; }
  .em-card-badge { position:absolute; top:8px; left:8px; background:rgba(255,255,255,.93); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border-radius:999px; padding:4px 10px; color:#0F1B3D; font:700 9.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.08em; text-transform:uppercase; }
  .em-card-badge.guide { color:#FF6B57; }
  .em-card-body { padding:9px 7px 5px; }
  .em-card-title { color:#0F1B3D; font:700 14.5px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.015em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .em-card-meta { color:#6D778F; font:400 12px/1.3 'Hanken Grotesk',sans-serif; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .em-card.flash { box-shadow:0 0 0 3px #FF6B57, 0 12px 30px rgba(8,12,28,.2); }
  .em-novisible { flex:none; background:rgba(255,255,255,.95); border-radius:16px; padding:14px 18px; color:#6D778F; font:500 13px/1.4 'Hanken Grotesk',sans-serif; box-shadow:0 8px 24px rgba(8,12,28,.12); max-width:280px; }
  .em-novisible strong { color:#0F1B3D; }
  /* FAB */
  .em-fab { position:absolute; right:20px; bottom:calc(250px + env(safe-area-inset-bottom,0px)); z-index:6; width:50px; height:50px; border-radius:999px; background:#FF6B57; color:#fff; border:none; cursor:pointer; box-shadow:0 10px 26px rgba(255,107,87,.36); display:flex; align-items:center; justify-content:center; }
  .em-fab svg { width:24px; height:24px; }
  /* The bottom tab bar reuses .exp-tabbar (fixed, already styled). */

  /* New-user welcome map overlays: a top-left "add a place" pill and a
     bottom-right "browse guides" pill beside the FAB (design "Explore · new user"). */
  .em-addpill { display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.97); border:none; cursor:pointer; border-radius:999px; padding:11px 18px 11px 14px; box-shadow:0 8px 24px rgba(8,12,28,.14); color:#0F1B3D; font:700 14px/1 'Hanken Grotesk',sans-serif; letter-spacing:-.01em; }
  .em-addpill svg { width:20px; height:20px; color:#FF6B57; }
  .em-browsepill { position:absolute; right:82px; bottom:calc(252px + env(safe-area-inset-bottom,0px)); z-index:6; display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.97); border:none; cursor:pointer; border-radius:999px; padding:12px 18px; box-shadow:0 10px 26px rgba(8,12,28,.16); color:#0F1B3D; font:700 14px/1 'Hanken Grotesk',sans-serif; letter-spacing:-.01em; }
  .em-browsepill svg { width:18px; height:18px; color:#FF6B57; }

  /* ===== Desktop Explore two-pane (design "Explore · guide owned") ============
     A left list panel beside the live map. The panel + grid ONLY switch on at
     wide widths in the explore context; on narrow screens (and Collection/Trip
     maps) .ex2-map stays absolutely full-bleed and the panel is hidden, so the
     mobile map is byte-for-byte unchanged. */
  .ex2-map { position:absolute; inset:0; }
  .ex2-panel { display:none; }
  /* Desktop: the map screens get the SAME top nav as the rest of the app (like
     .wh-page) and hide the bottom tabbar. .em-screen becomes a grid with a 64px
     nav row; the map (and, in the explore two-pane, the left panel) fill the row
     below. Mobile (<=820px) keeps the full-bleed map + bottom tabbar unchanged. */
  @media (min-width: 821px) {
    .em-screen { display:grid; grid-template-rows:64px 1fr; }
    .em-screen > .wh-nav { grid-row:1; grid-column:1 / -1; }
    .em-screen .ex2-map { position:relative; inset:auto; width:100%; height:100%; grid-row:2; }
    .em-screen > .exp-tabbar { display:none; }
  }
  @media (min-width: 960px) {
    .em-screen.ex2-explore { grid-template-columns:400px 1fr; }
    .em-screen.ex2-explore .ex2-map { grid-column:2; }
    .em-screen.ex2-explore .ex2-panel {
      grid-row:2; grid-column:1;
      display:flex; flex-direction:column; box-sizing:border-box; min-width:0;
      /* min-height:0 lets the panel shrink to the grid row instead of growing to
         fit its full card list — without it the row expands past the screen and
         .em-screen's overflow:hidden clips the cards, so .ex2-list can't scroll. */
      min-height:0;
      background:#fff; border-right:1px solid #eef0f3;
    }
    .ex2-head { flex-shrink:0; padding:22px 24px 14px; border-bottom:1px solid #eef0f3; }
    .ex2-region { display:inline-flex; align-items:center; gap:7px; padding:6px 12px; border-radius:999px; background:#FAF8F4; color:#0F1B3D; font:700 13px/1 'Hanken Grotesk',sans-serif; }
    .ex2-region svg { width:15px; height:15px; }
    .ex2-stamprow { margin-top:12px; }
    .ex2-stamp { display:inline-block; font:700 10.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#FF6B57; background:color-mix(in oklab,#FF6B57 12%,white); border-radius:999px; padding:5px 11px; }
    .ex2-title { margin:11px 0 0; font:700 25px/1.1 'Hanken Grotesk',sans-serif; letter-spacing:-.03em; color:#0F1B3D; }
    .ex2-subcount { margin-top:6px; font:600 13.5px/1.3 'Hanken Grotesk',sans-serif; color:#5b647a; }
    .ex2-chips { margin-top:15px; display:flex; flex-wrap:wrap; gap:8px; }
    .ex2-chip { padding:7px 14px; border-radius:999px; background:#fff; color:#0F1B3D; border:1px solid #eef0f3; font:600 13px/1 'Hanken Grotesk',sans-serif; letter-spacing:-.01em; cursor:pointer; white-space:nowrap; }
    .ex2-chip:hover { border-color:#d6dae2; }
    .ex2-chip.on { background:#0F1B3D; color:#fff; border-color:#0F1B3D; }
    .ex2-list { flex:1; min-height:0; overflow-y:auto; padding:14px 24px; display:flex; flex-direction:column; gap:12px; }
    .ex2-row { display:flex; gap:13px; padding:10px; border-radius:16px; background:#fff; border:1px solid #eef0f3; cursor:pointer; text-align:left; width:100%; font-family:'Hanken Grotesk',sans-serif; transition:border-color .12s ease, box-shadow .12s ease; }
    .ex2-row:hover { border-color:#FF6B57; box-shadow:0 6px 16px rgba(8,12,28,.06); }
    .ex2-thumb { width:84px; height:66px; flex-shrink:0; border-radius:11px; background:#eef0f3 center/cover no-repeat; }
    .ex2-rowbody { flex:1; min-width:0; align-self:center; }
    .ex2-rowname { font:700 15px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-.015em; color:#0F1B3D; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .ex2-rowmeta { margin-top:4px; display:flex; align-items:center; gap:7px; min-width:0; }
    .ex2-rowmetatext { font:500 12.5px/1 'Hanken Grotesk',sans-serif; color:#5b647a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .ex2-badge { flex-shrink:0; font:700 10px/1 'Hanken Grotesk',sans-serif; letter-spacing:.05em; text-transform:uppercase; color:#FF6B57; background:color-mix(in oklab,#FF6B57 12%,white); border-radius:999px; padding:3px 8px; }
    .ex2-emptylist { color:#5b647a; font:500 14px/1.5 'Hanken Grotesk',sans-serif; padding:18px 4px; }
    .ex2-foot { flex-shrink:0; padding:16px 24px 20px; border-top:1px solid #eef0f3; display:flex; gap:12px; }
    .ex2-btn { flex:1; height:48px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center; gap:8px; font:700 14.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:-.01em; cursor:pointer; border:none; }
    .ex2-btn svg { width:18px; height:18px; }
    .ex2-btn.coral { background:#FF6B57; color:#fff; box-shadow:0 10px 22px rgba(255,107,87,.28); }
    .ex2-btn.coral:hover { background:#f0563f; }
    .ex2-btn.light { background:#fff; color:#0F1B3D; border:1px solid #eef0f3; }
    .ex2-btn.light:hover { background:#FAF8F4; }
    /* The left panel replaces the bottom card strip on desktop; drop the FAB
       down now that the strip is gone (it no longer sits above the cards). */
    .em-screen.ex2-explore .em-strip { display:none; }
    .em-screen.ex2-explore .em-fab { bottom:calc(26px + env(safe-area-inset-bottom,0px)); }
    .em-screen.ex2-explore .em-count { right:auto; }
    .em-screen.ex2-explore .em-browsepill { bottom:calc(28px + env(safe-area-inset-bottom,0px)); }

    /* New-user welcome left panel (design "Explore · new user"): sits in the same
       400px column as the owned-state list panel. */
    .exw-panel { padding:0; }
    .exw-scroll { flex:1; min-height:0; overflow-y:auto; padding:26px 26px 30px; }
    .exw-region { display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:999px; background:#FAF8F4; color:#0F1B3D; font:700 13px/1 'Hanken Grotesk',sans-serif; }
    .exw-region svg { width:16px; height:16px; }
    .exw-title { margin:18px 0 0; font:700 30px/1.05 'Hanken Grotesk',sans-serif; letter-spacing:-.03em; color:#0F1B3D; }
    .exw-lede { margin:12px 0 0; color:#5b647a; font:400 15px/1.5 'Hanken Grotesk',sans-serif; }
    .exw-ghead { margin-top:26px; display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
    .exw-h2 { margin:0; font:700 18px/1.1 'Hanken Grotesk',sans-serif; letter-spacing:-.02em; color:#0F1B3D; }
    .exw-gcount { color:#8791a3; font:600 13px/1 'Hanken Grotesk',sans-serif; }
    .exw-gsub { margin:5px 0 0; color:#5b647a; font:400 13.5px/1.45 'Hanken Grotesk',sans-serif; }
    .exw-cards { margin:15px -26px 0; padding:2px 26px 6px; display:flex; gap:14px; overflow-x:auto; scrollbar-width:none; }
    .exw-cards::-webkit-scrollbar { display:none; }
    .exw-card { position:relative; flex:0 0 auto; width:168px; height:224px; border-radius:18px; overflow:hidden; border:none; cursor:pointer; background:#eef0f3 center/cover no-repeat; box-shadow:0 8px 22px rgba(8,12,28,.12); text-align:left; padding:0; }
    .exw-card.noimg { background:linear-gradient(150deg,#213056,#0F1B3D); }
    .exw-badge { position:absolute; top:11px; left:11px; z-index:2; font:700 10px/1 'Hanken Grotesk',sans-serif; letter-spacing:.05em; text-transform:uppercase; color:#fff; background:#FF6B57; border-radius:999px; padding:5px 9px; }
    .exw-cardprice { position:absolute; top:11px; right:11px; z-index:2; font:700 12.5px/1 'Hanken Grotesk',sans-serif; color:#0F1B3D; background:rgba(255,255,255,.96); border-radius:999px; padding:6px 10px; }
    .exw-cardgrad { position:absolute; inset:0; z-index:1; background:linear-gradient(to top,rgba(8,12,28,.82) 0%,rgba(8,12,28,.28) 42%,transparent 68%); }
    .exw-cardfoot { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:14px; display:flex; flex-direction:column; }
    .exw-cardregion { font:700 10px/1 'Hanken Grotesk',sans-serif; letter-spacing:.07em; text-transform:uppercase; color:rgba(255,255,255,.82); margin-bottom:5px; }
    .exw-cardtitle { font:700 16px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-.02em; color:#fff; }
    .exw-cardmeta { margin-top:4px; font:500 12px/1 'Hanken Grotesk',sans-serif; color:rgba(255,255,255,.82); }
    .exw-or { display:flex; align-items:center; gap:14px; margin:22px 2px 16px; color:#8791a3; font:600 13px/1 'Hanken Grotesk',sans-serif; }
    .exw-or::before, .exw-or::after { content:""; flex:1; height:1px; background:#eef0f3; }
    .exw-addfirst { width:100%; height:52px; border-radius:15px; display:inline-flex; align-items:center; justify-content:center; gap:9px; background:#fff; color:#0F1B3D; border:1px solid #dfe3ea; cursor:pointer; font:700 15px/1 'Hanken Grotesk',sans-serif; letter-spacing:-.01em; }
    .exw-addfirst:hover { border-color:#c7ccd6; background:#FAF8F4; }
    .exw-addfirst svg { width:19px; height:19px; }
  }

  /* ===================== App shell (web top nav + mobile bottom nav) — full redesign base ===================== */
  body.wh-shell-view .app { grid-template-columns:1fr; }
  body.wh-shell-view .sidebar { display:none !important; }
  body.wh-shell-view #mobileTabbar { display:none !important; }
  body.wh-shell-view #main { padding:0 !important; }
  body.wh-shell-view { background:#FAF8F4; }
  .wh-page, .wh-page * { font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; box-sizing:border-box; -webkit-font-smoothing:antialiased; }
  .wh-page { min-height:100vh; min-height:100dvh; background:#FAF8F4; color:#0F1B3D; }
  /* Web top nav (design "Wildhart Web · nav"): logo+wordmark left, a centered
     pill nav with icons (active = coral pill), bell + account pill on the right. */
  .wh-nav { display:flex; align-items:center; justify-content:space-between; height:64px; padding:0 24px; background:#fff; border-bottom:1px solid #ECE6DC; position:sticky; top:0; z-index:20; }
  .wh-nav-logo { flex:none; display:flex; align-items:center; gap:9px; background:none; border:none; cursor:pointer; padding:0; }
  .wh-nav-logo img { height:26px; width:auto; display:block; }
  .wh-nav-word { font:800 20px/1 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; color:#0F1B3D; }
  /* Absolutely-centered nav so it stays centred regardless of the side widths. */
  .wh-nav-links { position:absolute; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:6px; }
  .wh-nav-links button { display:inline-flex; align-items:center; gap:8px; background:none; border:none; cursor:pointer; font:600 14.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:-0.01em; color:#6D778F; padding:9px 16px; border-radius:999px; }
  .wh-nav-links button svg { width:18px; height:18px; }
  .wh-nav-links button:hover { color:#0F1B3D; background:#FAF8F4; }
  .wh-nav-links button.on { color:#0F1B3D; font-weight:700; background:color-mix(in oklab,#FF6B57 12%,white); }
  .wh-nav-links button.on svg { color:#FF6B57; }
  .wh-nav-right { flex:none; display:flex; align-items:center; gap:12px; }
  .wh-nav-icon { position:relative; flex:none; width:42px; height:42px; border-radius:999px; background:#fff; border:1px solid #E6E8EC; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#0F1B3D; }
  .wh-nav-icon:hover { border-color:#0F1B3D; }
  .wh-nav-icon svg { width:19px; height:19px; }
  .wh-nav-dot { position:absolute; top:9px; right:10px; width:8px; height:8px; border-radius:50%; background:#FF6B57; border:2px solid #fff; }
  .wh-nav-acct { flex:none; display:inline-flex; align-items:center; gap:9px; height:42px; padding:0 6px 0 13px; border-radius:999px; background:#fff; border:1px solid #E6E8EC; cursor:pointer; color:#5b647a; }
  .wh-nav-acct:hover { border-color:#0F1B3D; }
  .wh-nav-acct svg { width:19px; height:19px; }
  .wh-nav-photo { width:30px; height:30px; border-radius:50%; background:#eef0f3 center/cover no-repeat; flex:none; }
  .wh-nav-initial { width:30px; height:30px; border-radius:50%; background:#0F1B3D; color:#fff; flex:none; display:flex; align-items:center; justify-content:center; font:700 13px/1 'Hanken Grotesk',sans-serif; }
  /* Content wrapper */
  .wh-content { max-width:1200px; margin:0 auto; padding:40px 48px 72px; }
  .wh-eyebrow { color:#FF6B57; font:700 11px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.14em; text-transform:uppercase; margin:0 0 12px; }
  .wh-h1 { color:#0F1B3D; font:700 40px/1.05 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; margin:0; }
  .wh-h1.sm { font-size:30px; }
  .wh-sub { color:#6D778F; font:400 15px/1.4 'Hanken Grotesk',sans-serif; margin:9px 0 0; }
  .wh-home-empty { background:#fff; border:1px dashed #d8d2c6; border-radius:24px; padding:56px 40px; text-align:center; margin-top:28px; }
  .wh-home-empty h2 { color:#0F1B3D; font:700 22px/1.2 'Hanken Grotesk',sans-serif; margin:0 0 6px; }
  .wh-home-empty p { color:#6D778F; font:400 15px/1.5 'Hanken Grotesk',sans-serif; margin:0 0 20px; }
  .wh-btn-coral { display:inline-flex; align-items:center; gap:9px; background:#FF6B57; color:#fff; border:none; border-radius:999px; padding:14px 24px; cursor:pointer; font:700 15.5px/1 'Hanken Grotesk',sans-serif; box-shadow:0 10px 24px rgba(255,107,87,.3); }
  .wh-btn-coral svg { width:18px; height:18px; }
  /* Explore home — welcome (first login / no places yet). Design: Explore Home · state A */
  .xh-lede { max-width:560px; font-size:16.5px; line-height:1.5; margin-top:14px; }
  .xh-paths { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:30px; }
  .xh-path { position:relative; border-radius:24px; padding:30px 30px 28px; background:#fff; border:1px solid #E6E8EC; box-shadow:0 1px 0 rgba(8,12,28,.03); display:flex; flex-direction:column; min-height:268px; }
  .xh-path.dark { background:#0F1B3D; border:none; box-shadow:0 20px 44px rgba(8,12,28,.22); }
  .xh-path-top { display:flex; align-items:center; justify-content:space-between; }
  .xh-path-ic { width:50px; height:50px; border-radius:15px; background:rgba(255,107,87,.12); display:flex; align-items:center; justify-content:center; color:#FF6B57; }
  .xh-path-ic svg { width:24px; height:24px; }
  .xh-path-ic.dark { background:rgba(255,255,255,.12); color:#fff; }
  .xh-tag { font:700 11.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#6D778F; background:#F4EFE7; border-radius:999px; padding:6px 12px; white-space:nowrap; }
  .xh-tag.dark { color:#FF6B57; background:rgba(255,107,87,.14); }
  .xh-path-title { margin:22px 0 0; font:700 27px/1.1 'Hanken Grotesk',sans-serif; letter-spacing:-0.02em; color:#0F1B3D; }
  .xh-path.dark .xh-path-title { color:#fff; }
  .xh-path-body { margin:11px 0 0; font:400 15px/1.55 'Hanken Grotesk',sans-serif; color:#6D778F; }
  .xh-path.dark .xh-path-body { color:rgba(255,255,255,.74); }
  .xh-path-cta { margin-top:auto; padding-top:24px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
  .xh-foot { font:600 13px/1.3 'Hanken Grotesk',sans-serif; color:#6D778F; white-space:nowrap; }
  .xh-path.dark .xh-foot { color:rgba(255,255,255,.6); }
  .xh-btn-light { display:inline-flex; align-items:center; gap:9px; background:#fff; color:#0F1B3D; border:1px solid #E6E8EC; border-radius:999px; padding:13px 22px; cursor:pointer; font:700 15px/1 'Hanken Grotesk',sans-serif; }
  .xh-btn-light:hover { border-color:#0F1B3D; }
  .xh-btn-light svg { width:18px; height:18px; }
  .xh-guides-head { margin:42px 0 16px; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
  .xh-guides-head .wh-eyebrow { color:#6D778F; margin-bottom:8px; }
  .xh-seeall { background:none; border:none; cursor:pointer; font:700 14px/1 'Hanken Grotesk',sans-serif; color:#FF6B57; white-space:nowrap; }
  .xh-guide-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
  .xh-guide-card { text-align:left; background:none; border:none; padding:0; cursor:pointer; display:flex; flex-direction:column; }
  .xh-guide-cover { height:180px; border-radius:16px; background:#0F1B3D center/cover no-repeat; }
  .xh-guide-cover.noimg { background:linear-gradient(135deg,#16244d,#0F1B3D); }
  .xh-guide-card:hover .xh-guide-cover { box-shadow:0 12px 28px rgba(8,12,28,.14); }
  .xh-guide-title { margin-top:12px; font:700 16.5px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.015em; color:#0F1B3D; }
  .xh-guide-sub { margin-top:3px; font:400 13px/1.3 'Hanken Grotesk',sans-serif; color:#6D778F; }
  .xh-guide-foot { margin-top:12px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .xh-price { font:700 15px/1 'Hanken Grotesk',sans-serif; color:#0F1B3D; }
  .xh-unlock { display:inline-flex; align-items:center; gap:6px; height:38px; padding:0 16px; border-radius:999px; background:#0F1B3D; color:#fff; font:700 13.5px/1 'Hanken Grotesk',sans-serif; white-space:nowrap; }
  .xh-unlock svg { width:14px; height:14px; }
  @media (max-width:760px) {
    .xh-paths { grid-template-columns:1fr; }
    .xh-guide-grid { grid-template-columns:1fr 1fr; }
    .xh-path-title { font-size:23px; }
  }
  /* Explore destination (08) — browse a destination's places */
  .ed-hero { position:relative; height:300px; background:#0F1B3D center/cover no-repeat; display:flex; align-items:flex-end; }
  .ed-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,13,32,.2) 0%, rgba(8,13,32,.72) 100%); }
  .ed-hero-inner { position:relative; z-index:1; width:100%; max-width:1200px; margin:0 auto; padding:0 48px 30px; }
  .ed-eyebrow { color:rgba(255,255,255,.8); font:700 11px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.14em; text-transform:uppercase; margin:0 0 10px; }
  .ed-h1 { color:#fff; font:700 clamp(34px,5vw,48px)/1.02 'Hanken Grotesk',sans-serif; letter-spacing:-0.03em; margin:0; }
  .ed-bar { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:24px; }
  .ed-chips { display:flex; gap:9px; flex-wrap:wrap; }
  .ed-chip { background:#fff; border:1px solid #E6E8EC; border-radius:999px; padding:9px 16px; color:#0F1B3D; font:600 14px/1 'Hanken Grotesk',sans-serif; cursor:pointer; white-space:nowrap; }
  .ed-chip:hover { border-color:#0F1B3D; }
  .ed-chip.on { background:#0F1B3D; color:#fff; border-color:#0F1B3D; }
  .ed-viewmap { flex:none; display:inline-flex; align-items:center; gap:8px; background:#0F1B3D; color:#fff; border:none; border-radius:999px; padding:11px 20px; cursor:pointer; font:700 15px/1 'Hanken Grotesk',sans-serif; }
  .ed-viewmap svg { width:17px; height:17px; }
  .ed-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .ed-card { cursor:pointer; }
  .ed-card-img { position:relative; aspect-ratio:16/11; border-radius:20px; overflow:hidden; background:#eceae4 center/cover no-repeat; }
  .ed-card-badge { position:absolute; top:12px; left:12px; background:rgba(255,255,255,.93); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-radius:999px; padding:5px 11px; color:#0F1B3D; font:700 9.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:0.08em; text-transform:uppercase; }
  .ed-card-save { position:absolute; top:10px; right:10px; width:32px; height:32px; border-radius:999px; background:rgba(255,255,255,.92); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#0F1B3D; }
  .ed-card-save svg { width:17px; height:17px; }
  .ed-card-save.on { background:#FF6B57; color:#fff; }
  .ed-card-name { color:#0F1B3D; font:700 16.5px/1.2 'Hanken Grotesk',sans-serif; letter-spacing:-0.01em; margin-top:11px; }
  .ed-card-meta { color:#6D778F; font:400 13.5px/1.3 'Hanken Grotesk',sans-serif; margin-top:2px; }
  .ed-empty { background:#fff; border:1px dashed #d8d2c6; border-radius:20px; padding:48px; text-align:center; color:#6D778F; grid-column:1/-1; }
  .ed-empty strong { display:block; color:#0F1B3D; font-size:18px; margin-bottom:6px; }
  /* .co-back — a back button shared with the checkout/account panel (07). */
  .co-back { display:inline-flex; align-items:center; gap:6px; background:none; border:none; cursor:pointer; padding:0; margin-bottom:14px; color:color-mix(in oklab,#0F1B3D 60%, white); font:700 14px/1 'Hanken Grotesk',sans-serif; }
  .co-back svg { width:18px; height:18px; }
  .co-back:hover { color:#FF6B57; }
  /* Trip route map (10) */
  .tr-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
  .tr-left { padding:32px 40px 48px; max-width:620px; }
  .tr-header { margin-bottom:26px; }
  .tr-day { display:flex; gap:16px; }
  .tr-day-rail { flex:none; width:16px; display:flex; flex-direction:column; align-items:center; padding-top:4px; }
  .tr-dot { flex:none; width:14px; height:14px; border-radius:999px; background:#FF6B57; }
  .tr-line { flex:1; width:2px; background:#E6E8EC; margin:6px 0 0; min-height:24px; }
  .tr-day-body { flex:1; min-width:0; padding-bottom:22px; }
  .tr-day-head { display:flex; align-items:baseline; gap:10px; }
  .tr-day-label { color:#0F1B3D; font:700 16px/1 'Hanken Grotesk',sans-serif; }
  .tr-day-sub { color:#6D778F; font:400 13.5px/1 'Hanken Grotesk',sans-serif; }
  .tr-place { display:flex; align-items:center; gap:12px; margin-top:12px; cursor:pointer; }
  .tr-place-thumb { flex:none; width:50px; height:50px; border-radius:12px; background:#eceae4 center/cover no-repeat; }
  .tr-place-name { color:#0F1B3D; font:700 15px/1.2 'Hanken Grotesk',sans-serif; }
  .tr-place-note { color:#6D778F; font:400 12.5px/1.3 'Hanken Grotesk',sans-serif; margin-top:2px; }
  .tr-day-empty { color:#9aa3b2; font:500 13px/1.4 'Hanken Grotesk',sans-serif; margin-top:10px; }
  .tr-addday { display:inline-flex; align-items:center; gap:8px; margin-top:8px; background:#fff; border:1px solid #E6E8EC; border-radius:999px; padding:11px 20px; cursor:pointer; color:#0F1B3D; font:600 14.5px/1 'Hanken Grotesk',sans-serif; }
  .tr-addday:hover { border-color:#0F1B3D; }
  .tr-right { position:sticky; top:64px; height:calc(100vh - 64px); background:#E2EAEB; }
  .tr-right .map-container { position:absolute; inset:0; width:100%; height:100%; }
  .tr-route-pill { position:absolute; top:18px; left:50%; transform:translateX(-50%); z-index:2; background:rgba(255,255,255,.96); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:0 4px 18px rgba(8,12,28,.12); border-radius:999px; padding:9px 18px; color:#0F1B3D; font:600 14.5px/1 'Hanken Grotesk',sans-serif; }
  .tr-empty { padding:60px 40px; }
  @media (max-width:900px) {
    .tr-layout { grid-template-columns:1fr; }
    .tr-left { padding:20px 18px 28px; max-width:none; }
    .tr-right { position:relative; top:0; height:340px; order:-1; }
  }


  /* ===================== Landing page (logged-out front door · v210) =====================
     Full-screen, scroll-snapped landing ported from the Wildhart Prototype design
     (app/app-landing.jsx). Markup built by renderHome() in js/01-core.js. */
  body.landing-view .app { grid-template-columns:1fr; }
  body.landing-view .sidebar { display:none !important; }
  body.landing-view #mobileTabbar { display:none !important; }
  body.landing-view #main { padding:0 !important; height:100vh; height:100dvh; overflow:hidden; }
  body.landing-view { background:#0F1B3D; }

  .lp { --navy:#0F1B3D; --coral:#FF6B57; --paper:#FAF8F4; --sand:#F4F1EA;
        --sub:color-mix(in oklab,#0F1B3D 56%,white); --faint:color-mix(in oklab,#0F1B3D 9%,white);
        position:relative; height:100vh; height:100dvh; overflow:hidden; background:var(--paper); color:var(--navy); }
  .lp, .lp * { box-sizing:border-box; font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }

  /* headings — grotesk + tight tracking (design token type:'grotesk'); set
     explicitly so the global Montserrat h1..h4 rule can't override */
  .lp-hero-h1, .lp-act-title, .lp-guides-h2, .lp-close-h2, .lp-gc-title, .lp-pl-day { font-family:'Hanken Grotesk',sans-serif; font-weight:700; letter-spacing:-0.03em; }

  .lp-eyebrow { margin:0; font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; white-space:nowrap; }
  .lp-eyebrow.coral { color:var(--coral); }
  .lp-eyebrow.light { color:rgba(255,255,255,0.82); }

  /* buttons */
  .lp-btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; border:none; border-radius:999px; font-family:'Hanken Grotesk',sans-serif; font-weight:700; white-space:nowrap; text-decoration:none; cursor:pointer; transition:transform .14s ease, filter .14s ease; }
  .lp-btn:hover { transform:translateY(-2px); filter:brightness(1.03); }
  .lp-btn-sm { height:44px; padding:0 22px; font-size:15px; }
  .lp-btn-lg { height:58px; padding:0 28px; font-size:17px; }
  .lp-btn-coral { background:var(--coral); color:#fff; box-shadow:0 12px 30px color-mix(in oklab,#FF6B57 38%,transparent); }
  .lp-btn-glass { background:rgba(255,255,255,0.14); color:#fff; border:1px solid rgba(255,255,255,0.34); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
  .lp-arrow { width:20px; height:20px; flex:none; }
  .lp-link { background:transparent; border:none; cursor:pointer; font-family:'Hanken Grotesk',sans-serif; font-weight:700; font-size:15px; color:#fff; padding:0; }

  /* fixed header (transparent over hero, frosted once scrolled) */
  .lp-head { position:fixed; top:0; left:0; right:0; z-index:50; height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(20px,4vw,56px); border-bottom:1px solid transparent; transition:background .3s ease, border-color .3s ease; }
  .lp-head-solid { background:rgba(250,248,244,0.92); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--faint); }
  .lp-head-actions { display:flex; align-items:center; gap:10px; }
  .lp-head-solid .lp-link { color:var(--navy); }
  .lp-brand { display:flex; align-items:center; gap:9px; }
  .lp-brand img { height:24px; width:auto; display:block; }
  .lp-brand span { font-size:16px; font-weight:700; letter-spacing:0.02em; color:#fff; }
  .lp-brand img.lp-brand-n { display:none; }
  .lp-head-solid .lp-brand span { color:var(--navy); }
  .lp-head-solid .lp-brand img.lp-brand-w { display:none; }
  .lp-head-solid .lp-brand img.lp-brand-n { display:block; }

  /* right-side dot nav */
  .lp-dots { position:fixed; right:24px; top:50%; transform:translateY(-50%); z-index:50; display:flex; flex-direction:column; gap:12px; }
  .lp-dots-diff { mix-blend-mode:difference; }
  .lp-dot { width:10px; height:10px; padding:0; border-radius:999px; border:none; cursor:pointer; background:rgba(255,255,255,0.4); transition:all .2s ease; }
  .lp-dot.on { background:#fff; transform:scale(1.15); }

  /* scroller + panels */
  .lp-scroller { height:100vh; height:100dvh; overflow-y:auto; scroll-snap-type:y mandatory; scroll-behavior:smooth; }
  .lp-panel { scroll-snap-align:start; min-height:100vh; min-height:100dvh; position:relative; }

  /* 0 · hero */
  .lp-hero { display:flex; align-items:center; overflow:hidden; }
  .lp-hero-bg { position:absolute; inset:0; background-size:cover; background-position:center; }
  .lp-hero-scrim { position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,12,28,0.52) 0%,rgba(8,12,28,0.28) 44%,rgba(8,12,28,0.72) 100%); }
  .lp-hero-inner { position:relative; z-index:2; padding:0 clamp(24px,6vw,96px); max-width:940px; }
  .lp-hero-inner .lp-eyebrow { margin-bottom:22px; }
  .lp-hero-h1 { margin:0; font-size:clamp(48px,7vw,108px); line-height:0.98; color:#fff; text-wrap:balance; }
  .lp-hero-sub { margin:26px 0 0; max-width:560px; font-size:clamp(17px,1.5vw,21px); line-height:1.55; color:rgba(255,255,255,0.9); text-wrap:pretty; }
  .lp-hero-cta { margin-top:34px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
  .lp-scrollcue { position:absolute; left:50%; bottom:30px; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:6px; }
  .lp-scrollcue span { font-size:12px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:rgba(255,255,255,0.7); }
  .lp-scrollcue svg { width:22px; height:22px; color:rgba(255,255,255,0.7); }

  /* 1-3 · acts */
  .lp-act { display:flex; }
  .lp-act-text { flex:1; min-width:0; padding:0 clamp(32px,6vw,96px); display:flex; flex-direction:column; justify-content:center; }
  .lp-act-text .lp-eyebrow { margin-bottom:16px; }
  .lp-act-title { margin:0; font-size:clamp(38px,4.6vw,64px); line-height:1.02; color:var(--navy); max-width:620px; text-wrap:balance; }
  .lp-act-body { margin:22px 0 0; max-width:470px; font-size:clamp(16px,1.3vw,19px); line-height:1.6; color:var(--sub); text-wrap:pretty; }
  .lp-act-visual { flex:1; min-width:0; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; background-size:cover; background-position:center; }
  .lp-act-vscrim { position:absolute; inset:0; background:linear-gradient(270deg,rgba(8,12,28,0.28),rgba(8,12,28,0.08)); }
  .lp-flip .lp-act-vscrim { background:linear-gradient(90deg,rgba(8,12,28,0.28),rgba(8,12,28,0.08)); }
  .lp-act-mock { position:relative; z-index:2; }

  /* mock · collect */
  .lp-mock-collect { width:300px; border-radius:22px; background:#fff; box-shadow:0 24px 60px rgba(8,12,28,0.20); overflow:hidden; transform:rotate(-2deg); }
  .lp-mc-photo { position:relative; height:168px; background-size:cover; background-position:center; }
  .lp-mc-glass { position:absolute; top:12px; right:12px; width:40px; height:40px; border-radius:999px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.22); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,0.32); }
  .lp-mc-glass svg { width:19px; height:19px; }
  .lp-mc-body { padding:14px 16px 16px; }
  .lp-mc-name { font-size:17px; font-weight:700; letter-spacing:-0.015em; color:var(--navy); }
  .lp-mc-meta { margin-top:3px; font-size:13.5px; color:var(--sub); }

  /* mock · plan */
  .lp-mock-plan { width:320px; border-radius:22px; background:#fff; box-shadow:0 24px 60px rgba(8,12,28,0.20); padding:20px 22px; transform:rotate(1.5deg); }
  .lp-pl-head { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:14px; }
  .lp-pl-day { font-size:22px; color:var(--navy); }
  .lp-pl-region { font-size:12.5px; font-weight:600; color:var(--sub); }
  .lp-pl-rows { display:flex; flex-direction:column; gap:10px; }
  .lp-pl-row { display:flex; align-items:center; gap:12px; }
  .lp-pl-time { font-size:12px; font-weight:700; color:var(--sub); width:42px; flex:none; }
  .lp-pl-item { flex:1; padding:10px 13px; border-radius:12px; font-size:14px; font-weight:700; color:var(--navy); }

  /* mock · remember */
  .lp-mock-remember { width:288px; height:360px; border-radius:22px; overflow:hidden; box-shadow:0 24px 60px rgba(8,12,28,0.24); transform:rotate(-1.5deg); position:relative; background-size:cover; background-position:center; }
  .lp-mr-scrim { position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,12,28,0.1),rgba(8,12,28,0.72)); }
  .lp-mr-body { position:absolute; left:22px; right:22px; bottom:24px; z-index:2; }
  .lp-mr-quote { font-family:'Hanken Grotesk',sans-serif; font-style:italic; font-weight:500; font-size:21px; line-height:1.3; color:#fff; text-wrap:pretty; }

  /* 4 · guides */
  .lp-guides { background:var(--navy); display:flex; flex-direction:column; justify-content:center; padding:clamp(60px,8vh,120px) 0; }
  .lp-guides-head { max-width:1180px; margin:0 auto; width:100%; padding:0 clamp(24px,6vw,96px); }
  .lp-guides-top { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
  .lp-guides-head .lp-eyebrow { margin-bottom:16px; }
  .lp-guides-h2 { margin:0; font-size:clamp(36px,4.4vw,60px); line-height:1.02; color:#fff; max-width:720px; text-wrap:balance; }
  .lp-guides-sub { margin:20px 0 0; max-width:560px; font-size:clamp(16px,1.3vw,19px); line-height:1.55; color:rgba(255,255,255,0.76); text-wrap:pretty; }
  /* prev / next arrows that scroll the guide rail — hidden until the rail
     actually overflows (JS adds .show), so a handful of guides just center. */
  .lp-rail-nav { display:none; gap:10px; flex:none; }
  .lp-rail-nav.show { display:flex; }
  .lp-rail-btn { width:48px; height:48px; border-radius:999px; cursor:pointer; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.3); display:flex; align-items:center; justify-content:center; color:#fff; transition:background .15s ease; }
  .lp-rail-btn:hover { background:rgba(255,255,255,0.2); }
  .lp-rail-btn svg { width:20px; height:20px; }
  /* Center the cards when they all fit; `safe` falls back to start on overflow
     so the first card is never clipped/unreachable when there are many guides. */
  /* align-items:flex-start keeps every card top-aligned so the photos line up
     in a neat row (the cards are <button>s, which vertically-center their own
     content when stretched — that staggered the photos otherwise). */
  .lp-rail { margin-top:clamp(20px,3vh,38px); display:flex; align-items:flex-start; gap:22px; justify-content:safe center; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px clamp(24px,6vw,96px); scroll-padding-left:clamp(24px,6vw,96px); }
  /* new card: rounded photo on top, then place / title / meta below on navy */
  .lp-guide-card { flex:0 0 320px; max-width:78vw; scroll-snap-align:start; border:none; padding:0; margin:0; cursor:pointer; text-align:left; font:inherit; color:inherit; background:transparent; -webkit-appearance:none; appearance:none; display:block; text-decoration:none; }
  .lp-gc-photo { position:relative; height:clamp(180px,30vh,320px); border-radius:20px; overflow:hidden; box-shadow:0 10px 24px rgba(8,12,28,0.18); transition:box-shadow .3s ease; }
  .lp-gc-places { position:absolute; top:13px; left:13px; display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; background:rgba(8,12,28,0.44); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); font-size:12px; font-weight:700; color:#fff; }
  .lp-gc-places svg { width:13px; height:13px; flex:none; }
  .lp-gc-price { position:absolute; top:13px; right:13px; padding:6px 13px; border-radius:999px; background:rgba(255,255,255,0.94); font-size:13.5px; font-weight:800; color:var(--navy); }
  .lp-gc-owned { color:#177049; }
  .lp-gc-place { margin-top:12px; display:flex; align-items:center; gap:7px; font-size:11.5px; font-weight:700; letter-spacing:0.07em; text-transform:uppercase; color:var(--coral); }
  .lp-gc-place svg { width:14px; height:14px; flex:none; }
  .lp-gc-title { margin-top:6px; font-size:23px; line-height:1.08; color:#fff; }
  .lp-gc-meta { margin-top:5px; font-size:13px; color:rgba(255,255,255,0.62); }

  /* 5 · closing + footer */
  .lp-close { display:flex; flex-direction:column; overflow:hidden; }
  .lp-close-bg { position:absolute; inset:0; background-size:cover; background-position:center; }
  .lp-close-scrim { position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,12,28,0.42),rgba(8,12,28,0.66)); }
  .lp-close-inner { position:relative; z-index:2; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 24px; }
  .lp-close-inner .lp-eyebrow { margin-bottom:20px; }
  .lp-close-h2 { margin:0; font-size:clamp(42px,6vw,86px); line-height:0.98; color:#fff; text-wrap:balance; }
  .lp-close-sub { margin:22px 0 0; max-width:500px; font-size:clamp(16px,1.4vw,20px); line-height:1.55; color:rgba(255,255,255,0.88); text-wrap:pretty; }
  .lp-close-inner .lp-btn { margin-top:32px; }
  .lp-footer { position:relative; z-index:2; padding:26px clamp(24px,6vw,56px); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; border-top:1px solid rgba(255,255,255,0.16); }
  .lp-footer .lp-brand span { color:#fff; }
  .lp-foot-links { display:flex; gap:24px; align-items:center; flex-wrap:wrap; }
  .lp-foot-links a, .lp-foot-links .lp-link { font-size:13.5px; font-weight:600; color:rgba(255,255,255,0.72); text-decoration:none; }
  .lp-foot-links a:hover, .lp-foot-links .lp-link:hover { color:#fff; }
  .lp-foot-copy { font-size:13px; color:rgba(255,255,255,0.6); }

  /* the act photo sits on its own layer behind the scrim + sample card */
  .lp-act-photo { position:absolute; inset:0; background-size:cover; background-position:center; }

  /* Guide-card hover: the card lifts and its cover photo zooms gently inside
     the rounded frame, with a deeper shadow. Only motion on the landing. */
  .lp-guide-card { transition:transform .3s cubic-bezier(.19,1,.22,1); }
  .lp-guide-card:hover { transform:translateY(-6px); }
  .lp-gc-img { position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .55s cubic-bezier(.19,1,.22,1); }
  .lp-guide-card:hover .lp-gc-img { transform:scale(1.06); }
  .lp-guide-card:hover .lp-gc-photo { box-shadow:0 22px 44px rgba(8,12,28,0.30); }

  @media (prefers-reduced-motion:reduce) {
    .lp-guide-card, .lp-gc-img, .lp-gc-photo { transition:none; }
    .lp-guide-card:hover { transform:none; }
    .lp-guide-card:hover .lp-gc-img { transform:none; }
  }

  /* mobile — dots hidden, acts become full-bleed photo + overlaid text */
  @media (max-width:860px) {
    .lp-dots { display:none; }
    .lp-act { flex-direction:column; }
    .lp-act-visual { position:absolute; inset:0; z-index:0; }
    .lp-act-vscrim, .lp-flip .lp-act-vscrim { background:linear-gradient(180deg,rgba(8,12,28,0.55),rgba(8,12,28,0.78)); }
    .lp-act-mock { display:none; }
    .lp-act-text { position:relative; z-index:2; flex:1; justify-content:center; padding:0 26px; }
    .lp-act-title { color:#fff; }
    .lp-act-body { color:rgba(255,255,255,0.9); }
    .lp-act .lp-eyebrow.coral { color:#fff; }
    .lp-footer { justify-content:center; text-align:center; }
  }