:root { --ink:#17120d; --cream:#f3ead8; --paper:#fffaf0; --lime:#f2b632; --orange:#d84a25; --muted:#716a60; --line:#ddd2c2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Manrope",sans-serif; }
.skip-link { position:fixed; top:8px; left:8px; z-index:20; padding:12px 16px; color:var(--ink); background:var(--lime); transform:translateY(-150%); }
.skip-link:focus { transform:none; }
a { color:inherit; }
.shell { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.hero { min-height:760px; background:var(--ink); color:var(--paper); overflow:hidden; position:relative; }
.nav { height:90px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #ffffff26; position:relative; z-index:2; }
.brand { font:600 25px/1 "Newsreader",serif; text-decoration:none; letter-spacing:-1px; }
.brand span { color:var(--lime); font-style:italic; }
.nav-links { display:flex; gap:36px; }
.nav-links a { color:#cdd2cc; text-decoration:none; font-size:13px; }
.live-pill { border:1px solid #ffffff38; border-radius:999px; padding:8px 13px; text-transform:uppercase; font:500 10px "DM Mono",monospace; letter-spacing:.08em; }
.live-pill i { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--lime); margin-right:7px; }
.hero-content { position:relative; z-index:1; padding-top:112px; }
.eyebrow { margin:0 0 26px; text-transform:uppercase; font:500 11px "DM Mono",monospace; letter-spacing:.14em; color:var(--lime); }
.eyebrow span { margin:0 8px; }
h1,h2 { font-family:"Newsreader",serif; font-weight:500; margin:0; letter-spacing:-.045em; }
h1 { font-size:clamp(78px,11vw,148px); line-height:.75; }
h1 em { color:var(--lime); font-weight:500; }
.lede { max-width:520px; margin:42px 0 35px; font-size:17px; line-height:1.7; color:#bdc4be; }
.hero-actions { display:flex; align-items:center; gap:30px; }
.button { display:inline-flex; gap:28px; align-items:center; padding:16px 19px; text-decoration:none; font-size:13px; font-weight:600; }
.button-primary { background:var(--lime); color:var(--ink); }
.text-link { font-size:13px; color:#e5e7e3; text-decoration:none; border-bottom:1px solid #ffffff50; padding-bottom:5px; }
.text-link span { margin-left:8px; }
.route-line { position:absolute; right:2%; bottom:58px; width:53%; display:flex; align-items:center; gap:0; color:#8f9891; font:12px "DM Mono",monospace; }
.route-line:before { content:""; position:absolute; height:1px; background:#ffffff30; left:25px; right:30px; }
.route-line i { position:relative; z-index:1; width:7px; height:7px; background:var(--ink); border:1px solid #859087; border-radius:50%; margin:auto; }
.route-line span { position:relative; z-index:1; width:50px; height:50px; display:grid; place-items:center; border:1px solid #ffffff4a; border-radius:50%; background:var(--ink); }
.route-line .route-destination { background:var(--lime); color:var(--ink); border:none; }
.stats { display:grid; grid-template-columns:repeat(4,1fr); padding:48px 0; border-bottom:1px solid var(--line); }
.stats div { display:flex; flex-direction:column; padding-left:35px; border-left:1px solid var(--line); }
.stats div:first-child { border:0; padding-left:0; }
.stats strong { font:500 44px "Newsreader",serif; }
.stats span { margin-top:4px; color:var(--muted); text-transform:uppercase; font:10px "DM Mono",monospace; letter-spacing:.12em; }
.route-section,.notes-section,.sleep-section { padding-block:115px; }
.section-heading { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; margin-bottom:64px; }
.section-heading h2 { font-size:clamp(52px,6vw,78px); line-height:.9; }
.section-heading>p { max-width:470px; justify-self:end; margin:0; color:var(--muted); line-height:1.8; font-size:15px; }
.eyebrow.dark { color:#66715a; }
.route-card { background:#e7e2d5; padding:30px 36px 42px; }
.map-section { padding-top:110px; background:#21170f; color:var(--paper); }
.map-heading>p { color:#a5aea7; }
.map-toolbar,.map-foot { display:flex; align-items:center; justify-content:space-between; }
.map-toolbar { padding-bottom:25px; }
.map-toolbar p { margin:0; color:#a5aea7; font:10px "DM Mono",monospace; text-transform:uppercase; }
.map-filters { display:flex; gap:8px; }
.map-filter { padding:10px 14px; border:1px solid #ffffff35; background:transparent; color:#c2c9c4; cursor:pointer; font:10px "DM Mono",monospace; text-transform:uppercase; }
.map-filter.active { color:var(--ink); background:var(--lime); border-color:var(--lime); }
.legend { margin-left:15px; margin-right:5px; font-size:16px; }
.legend.camera { color:var(--orange); }.legend.astro { color:#75aee7; }
#route-map { width:100%; height:min(68vh,720px); min-height:510px; background:#dbe3dc; }
.map-foot { min-height:95px; gap:30px; color:#a5aea7; font-size:11px; line-height:1.6; }
.map-foot p:first-child { max-width:760px; }.map-foot strong { color:var(--lime); font-size:22px; }
.photo-marker-wrap { background:none; border:0; }
.photo-marker { display:grid; place-items:center; width:28px; height:28px; border:3px solid #fff; border-radius:50%; background:var(--orange); color:#fff; box-shadow:0 2px 8px #0008; font-size:13px; }
.photo-marker.is-astro { background:#286eaa; color:#fff; }
.active-route-marker-wrap { background:none; border:0; }
.active-route-marker { display:grid; place-items:center; width:30px; height:30px; border:3px solid var(--ink); border-radius:50%; background:var(--lime); color:var(--ink); box-shadow:0 2px 10px #0009; font-size:18px; font-weight:800; }
.active-route-marker.is-photo { background:var(--orange); color:#fff; }
.active-route-marker.is-food { border-radius:7px; background:#fff7e9; }
.leaflet-popup-content-wrapper { border-radius:0; box-shadow:0 5px 25px #0005; }
.leaflet-popup-content { margin:0; width:280px!important; }
.map-popup { padding:20px; color:var(--ink); font-family:"Manrope",sans-serif; }
.map-popup>p:first-child { margin:0 0 8px; color:#6c756e; text-transform:uppercase; font:9px "DM Mono",monospace; }
.map-popup h3 { margin:0 0 6px; font:500 23px/1.05 "Newsreader",serif; }
.map-popup strong { display:block; color:#bb481f; font-size:11px; text-transform:uppercase; }
.map-popup span { display:inline-block; margin-top:7px; padding:4px 7px; background:#e5edf5; color:#286eaa; font:9px "DM Mono",monospace; }
.map-popup>p:not(:first-child) { color:#59625c; line-height:1.5; font-size:11px; }
.map-popup div { display:flex; gap:14px; }.map-popup a { font-size:10px; font-weight:700; }
.route-card-top { display:flex; justify-content:space-between; text-transform:uppercase; font:10px "DM Mono",monospace; letter-spacing:.11em; color:#6d716c; padding-bottom:30px; border-bottom:1px solid #c8c5ba; }
.cities { list-style:none; margin:45px 0 0; padding:0; display:grid; grid-template-columns:repeat(7,1fr); position:relative; }
.cities:before { content:""; position:absolute; top:7px; left:3%; right:3%; height:1px; background:#b3b2a9; }
.cities li { position:relative; padding-top:32px; font:500 13px "Newsreader",serif; }
.cities li:before { content:""; position:absolute; top:3px; left:0; width:8px; height:8px; border-radius:50%; background:#e7e2d5; border:2px solid var(--ink); }
.cities li:first-child:before,.cities li:last-child:before { width:14px; height:14px; top:0; background:var(--orange); border:0; }
.cities small { display:block; margin-top:4px; color:#777c76; font:9px "DM Mono",monospace; text-transform:uppercase; }
.itinerary-section { background:var(--ink); color:var(--paper); padding-block:110px; }
.itinerary-heading>p { color:#9da69f; }
.journey-key { display:flex; justify-content:flex-end; gap:18px; margin:-24px 0 45px; color:#7f8981; text-transform:uppercase; font:9px "DM Mono",monospace; letter-spacing:.08em; }
.journey-key span:before { content:""; display:inline-block; width:8px; height:8px; margin-right:6px; border:1px solid #7f8981; border-radius:50%; }
.journey-key .done:before { background:#69736c; border-color:#69736c; }.journey-key .next:before { background:var(--lime); border-color:var(--lime); }
.journey-day { padding:0 0 65px; }
.journey-day+.journey-day { padding-top:65px; border-top:1px solid #ffffff26; }
.journey-day-header { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:end; padding-bottom:30px; }
.journey-day-header>div:first-child>span { color:var(--lime); text-transform:uppercase; font:10px "DM Mono",monospace; letter-spacing:.11em; }
.journey-day-header h3 { margin:9px 0 7px; font:500 34px/1 "Newsreader",serif; }
.journey-day-header p { max-width:650px; margin:0; color:#929b94; font-size:12px; line-height:1.6; }
.day-metrics { display:flex; gap:25px; color:#c9ceca; font:10px "DM Mono",monospace; white-space:nowrap; }
.journey-events { position:relative; }
.journey-stop { display:grid; grid-template-columns:105px 35px minmax(0,1fr) auto; gap:15px; padding:24px 0; position:relative; border-top:1px solid #ffffff12; }
.journey-stop time { color:#9ca59e; font:11px "DM Mono",monospace; padding-top:4px; }
.journey-stop time span,.journey-stop time small { display:block; white-space:nowrap; }
.journey-stop time small { margin-top:5px; color:#69736c; font:9px "DM Mono",monospace; }
.route-milestone-order { color:#9ca59e; font:9px "DM Mono",monospace; text-transform:uppercase; letter-spacing:.08em; }
.route-milestone-order span,.route-milestone-order strong { display:block; }
.route-milestone-order strong { margin-top:3px; color:var(--lime); font-size:20px; }
.stop-dot { width:12px; height:12px; margin-top:4px; border:2px solid #7f8981; border-radius:50%; position:relative; z-index:1; background:var(--ink); }
.journey-stop.food .stop-dot { border-color:var(--orange); }.journey-stop.photo .stop-dot { border-color:#75aee7; }
.journey-stop.sleep .stop-dot,.journey-stop.destination .stop-dot { background:var(--lime); border-color:var(--lime); }
.journey-stop h3 { margin:4px 0 5px; font:500 21px "Newsreader",serif; }
.journey-stop p { margin:0; color:#929b94; font-size:12px; line-height:1.6; }
.event-state { color:#8a958c; text-transform:uppercase; font:8px "DM Mono",monospace; letter-spacing:.1em; }
.journey-stop.is-done { opacity:.52; }.journey-stop.is-done .stop-dot { background:#69736c; border-color:#69736c; }
.journey-stop.is-next { margin-inline:-18px; padding-inline:18px; background:#ffffff09; }
.journey-stop.is-next .stop-dot { background:var(--lime); border-color:var(--lime); box-shadow:0 0 0 5px #d5f24b1f; }
.journey-stop.is-next .event-state { color:var(--lime); }
.stop-link { align-self:start; color:#d9ddd9; text-decoration:none; font:10px "DM Mono",monospace; border:1px solid #ffffff28; padding:9px 11px; }
.journey-dispatch { display:grid; grid-template-columns:105px 35px minmax(0,1fr); gap:15px; padding:20px 0 34px; }
.dispatch-marker { display:grid; place-items:center; grid-column:2; width:28px; height:28px; border-radius:50%; background:var(--orange); color:#fff; box-shadow:0 0 0 5px #d84a2524; font-size:12px; }
.dispatch-content { grid-column:3; padding:30px; background:var(--paper); color:var(--ink); }
.dispatch-content header { display:flex; justify-content:space-between; gap:20px; color:var(--muted); text-transform:uppercase; font:9px "DM Mono",monospace; letter-spacing:.08em; }
.dispatch-content h3 { margin:26px 0 10px; font:500 36px/1 "Newsreader",serif; }
.dispatch-content>p { margin:0; color:var(--muted); font-size:14px; line-height:1.75; white-space:pre-line; }
.dispatch-content aside { margin-top:22px; padding:16px; border-left:4px solid var(--lime); background:var(--ink); color:#e5ddd0; font-size:12px; line-height:1.6; }
.dispatch-content aside strong { display:block; margin-bottom:5px; color:var(--lime); text-transform:uppercase; font:9px "DM Mono",monospace; letter-spacing:.1em; }
.update-photos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:24px; }
.update-photos figure { margin:0; }.update-photos img,.update-photos video { display:block; width:100%; max-height:680px; object-fit:contain; object-position:left center; background:#ddd2c2; }
.update-photos figcaption { margin-top:7px; color:var(--muted); font-size:10px; line-height:1.4; }
.sleep-section { border-bottom:1px solid var(--line); }
.sleep-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.sleep-card { border:1px solid var(--line); padding:30px; min-height:270px; }
.sleep-card>p:first-child,.sleep-card span { text-transform:uppercase; font:10px "DM Mono",monospace; letter-spacing:.1em; }
.sleep-card span { display:inline-block; margin-top:28px; color:var(--orange); }
.sleep-card h3 { margin:10px 0 20px; font:500 28px "Newsreader",serif; }
.sleep-card p:last-child { color:var(--muted); font-size:13px; line-height:1.7; }
.note-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.note { background:var(--paper); padding:35px; min-height:220px; }
.note-number { color:var(--orange); font:11px "DM Mono",monospace; }
.note h3 { margin:50px 0 10px; font:500 24px "Newsreader",serif; }
.note p { color:var(--muted); font-size:13px; line-height:1.7; margin:0; }
.lodging-badge { display:inline-block; margin-left:8px; padding:3px 6px; border:1px solid #ffffff40; color:#aeb6b0; text-transform:uppercase; font:8px "DM Mono",monospace; }
.lodging-badge.is-targeting,.sleep-state.is-targeting { color:var(--orange); border-color:var(--orange); }
.lodging-badge.is-booked,.sleep-state.is-booked { color:var(--lime); border-color:var(--lime); }
.sleep-state { border:1px solid transparent; padding:4px 7px; }
.flight-card { margin-top:24px; border:1px solid #c9c0b2; background:#f5edde; }
.flight-card>header { display:flex; justify-content:space-between; gap:16px; padding:12px 14px; color:#5b625d; border-bottom:1px solid #c9c0b2; }
.flight-card ol { list-style:none; margin:0; padding:0; }
.flight-leg { display:grid; grid-template-columns:75px 1fr 46px 1fr; gap:12px; padding:16px 14px; align-items:center; }
.flight-leg+.flight-leg { border-top:1px solid #d8d0c3; }
.flight-number span,.flight-airport span { display:block; color:#7a817b; text-transform:uppercase; font:8px "DM Mono",monospace; }
.flight-number strong,.flight-airport strong { display:block; margin-top:4px; font-size:12px; }
.flight-airport time { font:10px "DM Mono",monospace; }
.flight-airport small { color:#707770; font-size:9px; }
.flight-path { text-align:center; color:var(--orange); }
.flight-connection { grid-column:1/-1; margin:0; color:#707770; font-size:9px; }
.journey-error { padding:28px; color:#fff; background:#7c2d18; }
footer { min-height:150px; display:flex; justify-content:space-between; align-items:center; color:#707770; font:11px "DM Mono",monospace; }
.dark-brand { color:var(--ink); }
.mobile-dock { display:none; }
@media (max-width:760px) {
  html { scroll-padding-top:70px; }
  body { padding-bottom:72px; }
  .shell { width:min(100% - 32px,1180px); }
  .hero { min-height:520px; }
  .nav { height:64px; }
  .nav-links { display:none; }
  .live-pill { padding:7px 10px; }
  .hero-content { padding-top:58px; }
  .hero-content .eyebrow { margin-bottom:18px; font-size:9px; }
  h1 { font-size:clamp(58px,19vw,76px); line-height:.78; }
  .lede { margin:28px 0 24px; font-size:14px; line-height:1.55; }
  .hero-actions { gap:18px; }
  .button { min-height:48px; padding:14px 16px; }
  .route-line { width:76%; bottom:24px; }
  .route-line span { width:38px; height:38px; }
  .stats { grid-template-columns:1fr 1fr; gap:0; padding:0; border-bottom:0; }
  .stats div { min-height:92px; justify-content:center; padding:14px 0 14px 18px; border-bottom:1px solid var(--line); }
  .stats div:nth-child(3) { border:0; padding-left:0; }
  .stats div:nth-child(3),.stats div:nth-child(4) { border-bottom:1px solid var(--line); }
  .stats strong { font-size:34px; }
  .route-section,.notes-section,.sleep-section { padding-block:64px; }
  .itinerary-section { padding-block:60px; }
  .section-heading { grid-template-columns:1fr; gap:25px; }
  .section-heading { margin-bottom:36px; }
  .section-heading h2 { font-size:48px; }
  .section-heading>p { justify-self:start; }
  .route-card { padding:22px 20px 26px; }
  .route-card-top span:last-child { display:none; }
  .cities { grid-template-columns:1fr; margin-top:25px; }
  .map-toolbar,.map-foot { align-items:flex-start; flex-direction:column; }
  .map-toolbar { gap:18px; }.map-toolbar p { display:none; }
  #route-map { min-height:560px; height:72vh; }
  .cities:before { left:6px; top:8px; bottom:8px; width:1px; height:auto; right:auto; }
  .cities li { padding:0 0 25px 30px; }
  .cities li:before { top:3px; }
  .cities li:first-child:before,.cities li:last-child:before { top:1px; }
  .journey-key { justify-content:flex-start; margin:0 0 32px; gap:12px; }
  .journey-day { padding-bottom:46px; }
  .journey-day+.journey-day { padding-top:46px; }
  .journey-day-header { grid-template-columns:1fr; gap:14px; padding-bottom:22px; }
  .journey-day-header h3 { font-size:29px; }
  .day-metrics { gap:14px; }
  .journey-stop { grid-template-columns:78px 18px minmax(0,1fr); gap:8px; padding:21px 0; }
  .journey-stop.is-next { margin-inline:-8px; padding-inline:8px; }
  .journey-stop time { line-height:1.45; }
  .route-milestone-order { line-height:1.45; }
  .journey-stop time b { color:#cbd1cc; font-size:8px; font-weight:500; text-transform:uppercase; }
  .journey-stop h3 { font-size:19px; line-height:1.15; }
  .journey-stop p { font-size:12px; line-height:1.55; }
  .stop-link { grid-column:3; justify-self:start; min-height:42px; display:inline-flex; align-items:center; margin-top:4px; padding:9px 12px; }
  .journey-dispatch { grid-template-columns:18px minmax(0,1fr); gap:10px; padding:18px 0 30px; }
  .journey-dispatch .dispatch-marker { grid-column:1; }
  .journey-dispatch .dispatch-content { grid-column:2; }
  .dispatch-marker { width:24px; height:24px; font-size:10px; }
  .dispatch-content { padding:22px 18px; }
  .dispatch-content header { flex-direction:column; gap:5px; }
  .dispatch-content h3 { margin-top:20px; font-size:29px; }
  .update-photos { grid-template-columns:1fr; }
  .flight-card>header { align-items:flex-start; flex-direction:column; }
  .flight-leg { grid-template-columns:1fr 30px 1fr; }
  .flight-number { grid-column:1/-1; }
  .note-grid { grid-template-columns:1fr; }
  .sleep-grid { grid-template-columns:1fr; }
  footer { padding:35px 0; flex-direction:column; align-items:flex-start; gap:15px; }
  .mobile-dock { position:fixed; z-index:10; left:0; right:0; bottom:0; height:72px; display:grid; grid-template-columns:repeat(3,1fr); padding:7px max(8px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); color:#dce1dc; background:#101a15f2; border-top:1px solid #ffffff24; backdrop-filter:blur(12px); }
  .mobile-dock a { min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; text-decoration:none; text-transform:uppercase; font:9px "DM Mono",monospace; letter-spacing:.06em; }
  .mobile-dock span { color:var(--lime); font:18px/1 "Manrope",sans-serif; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
/* Mobile road mode: the map is the app's home screen. */
.legend.bbq { color:var(--lime); }
.locate-button { min-height:38px; padding:8px 13px; border:1px solid #ffffff50; background:#fff; color:var(--ink); cursor:pointer; font:600 10px "DM Mono",monospace; text-transform:uppercase; }
.locate-button:disabled { opacity:.65; }
.photo-marker.is-bbq { width:30px; height:30px; border-radius:7px; background:var(--lime); color:var(--ink); font-size:14px; }
.last-location-marker span { display:block; width:28px; height:28px; border:5px solid #fff; border-radius:50%; background:#286eaa; box-shadow:0 0 0 5px #286eaaaa,0 3px 12px #0008; }
@media (max-width:760px) {
  .hero { min-height:64px; height:64px; position:sticky; top:0; z-index:900; }
  .hero-content,.route-line { display:none; }
  main { display:flex; flex-direction:column; }
  .map-section { order:-3; padding-top:0; height:calc(100dvh - 136px); min-height:480px; display:flex; flex-direction:column; }
  .stats { order:-2; grid-template-columns:repeat(4,1fr); }
  .route-section { order:-1; display:none; }
  .map-section>.shell:first-child { width:100%; }
  .map-heading { display:none; }
  .map-toolbar { padding:8px; gap:7px; align-items:center; flex-direction:row; overflow-x:auto; scrollbar-width:none; background:#21170f; }
  .map-toolbar::-webkit-scrollbar { display:none; }
  .map-toolbar>p { display:none; }
  .map-filters { gap:5px; flex:0 0 auto; }
  .map-filter { min-height:40px; padding:8px 10px; white-space:nowrap; }
  .locate-button { flex:0 0 auto; min-height:40px; white-space:nowrap; }
  #route-map { flex:1; min-height:0; height:auto; }
  .map-foot { display:none; }
  .stats div,.stats div:nth-child(3) { min-height:72px; padding:10px 4px; border-left:1px solid var(--line); align-items:center; text-align:center; }
  .stats div:first-child { border-left:0; }
  .stats strong { font-size:24px; }
  .stats span { font-size:8px; }
  .mobile-dock { z-index:1000; }
}