/* Roamville styles. Order matters: her v7 brand layers first, then the base app styles, then small additions. */
/* ===== ROAMVILLE LOCKED BRAND EXPERIENCE ===== */
body{background:linear-gradient(180deg,#FFF8EA 0,#fffdf8 55%,#FFF8EA 100%);background-attachment:fixed}
.app{gap:18px}
.top{position:sticky;top:0;z-index:4;margin:-16px -10px 0;padding:12px 10px 10px;background:rgba(255,248,234,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(7,94,84,.08)}
.logo img{height:52px;max-width:210px;object-fit:contain;object-position:left center}
.card{box-shadow:0 8px 24px rgba(23,42,58,.055);border-color:#eee2cb}
.card.link{padding:0;overflow:hidden;gap:0;box-shadow:0 10px 30px rgba(23,42,58,.08);transition:transform .18s ease,box-shadow .18s ease}
.card.link:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(23,42,58,.12)}
.listing-media{height:150px;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--leaf),#0b7c6e)}
.listing-media:after{content:'';position:absolute;inset:auto -8% -50% -8%;height:75%;background:#fff;border-radius:50% 50% 0 0/35% 35% 0 0;opacity:.13}
.listing-media .scene-icon{position:absolute;left:22px;bottom:18px;width:68px;height:68px;border-radius:22px;background:rgba(255,255,255,.94);display:grid;place-items:center;font-size:36px;box-shadow:0 8px 20px rgba(23,42,58,.14)}
.listing-media .sun-dot{position:absolute;right:20px;top:18px;width:30px;height:30px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 8px rgba(255,200,61,.16)}
.listing-media.world{background:linear-gradient(135deg,#67C5E8,#1F7FA6)} .listing-media.club{background:linear-gradient(135deg,#FF6B57,#ff8a65)} .listing-media.group{background:linear-gradient(135deg,#FFC83D,#f2a900)}
.listing-body{padding:15px 16px 16px;display:grid;gap:9px;text-align:left}
.listing-body h3{font-size:1.12rem}
.brand-hero{position:relative;overflow:hidden;border-radius:26px;padding:24px 22px 22px;background:var(--leaf);color:#fff;min-height:230px;box-shadow:0 18px 40px rgba(7,94,84,.18)}
.brand-hero:before{content:'';position:absolute;right:-50px;bottom:-80px;width:250px;height:190px;border-radius:50%;background:#2EAf7D;transform:rotate(-10deg)}
.brand-hero:after{content:'';position:absolute;right:48px;bottom:-95px;width:260px;height:180px;border-radius:50%;background:#67C5E8;opacity:.9}
.brand-hero>*{position:relative;z-index:2} .brand-hero .sun:not(.btn){position:absolute;right:28px;top:24px;width:46px;height:46px;border-radius:50%;background:var(--sun);z-index:1}
.brand-hero h1{font-size:2.15rem;max-width:430px} .brand-hero .hand{color:var(--sun);font-size:1.15rem;margin-top:8px;display:block}
.brand-hero p{max-width:440px;margin-top:10px;color:#eaf8f4}
.journey-line{height:5px;width:120px;background:var(--sun);border-radius:99px;margin-top:15px;transform:rotate(-2deg)}
.category-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:12px 7px;text-align:center;font-size:.72rem;font-weight:700;box-shadow:0 5px 16px rgba(23,42,58,.04)} .cat b{display:grid;place-items:center;width:42px;height:42px;margin:0 auto 7px;border-radius:14px;font-size:23px;background:var(--sun-soft)} .cat:nth-child(2) b{background:var(--coral-soft)} .cat:nth-child(3) b{background:var(--sky-soft)} .cat:nth-child(4) b{background:var(--leaf-soft)}
.photo-banner{height:170px;border-radius:24px;background-size:cover;background-position:center;position:relative;overflow:hidden;box-shadow:0 10px 28px rgba(23,42,58,.10)}
.photo-banner:after{content:none}
.detail-visual{height:180px;border-radius:24px;display:grid;place-items:center;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--leaf),#2EAf7D);font-size:62px} .detail-visual:after{content:'';position:absolute;width:55px;height:55px;border-radius:50%;background:var(--sun);right:28px;top:22px}
.tabs{box-shadow:0 -8px 28px rgba(23,42,58,.08);border-top:0} .tabs button[aria-current=page]{background:var(--leaf-soft);border-radius:14px}
.btn{box-shadow:0 5px 14px rgba(7,94,84,.12)}
@media(max-width:520px){.brand-hero{min-height:245px;padding:22px 18px}.brand-hero h1{font-size:1.9rem}.category-strip{grid-template-columns:repeat(2,1fr)}.listing-media{height:138px}}


/* ===== V2 LAYOUT REFINEMENT ===== */
.app{padding-left:4px;padding-right:4px}
.section-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.section-grid>.card,.section-grid>button.card{height:100%;min-width:0}
.lifts-intro{padding:4px 2px 8px;display:grid;gap:8px}
.lift-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lift-grid>.card,.lift-grid>button.card{height:100%;min-width:0}
.lift-grid .row.between{align-items:flex-start}
.lift-grid h3{line-height:1.28}
.lift-grid .btn{margin-top:4px}
.family-brand-icon{width:48px;height:34px;display:block;object-fit:contain}
.scene-icon .family-brand-icon{width:54px;height:40px}
.detail-visual .family-brand-icon{width:118px;height:76px}
@media(max-width:560px){.section-grid,.lift-grid{grid-template-columns:1fr}.app{padding-left:8px;padding-right:8px}.card{padding:18px}.lifts-intro{padding-inline:4px}}

/* V6 structural layout: deliberately changes screen composition, not just colours */
@media (min-width: 760px){
  body{padding-left:28px;padding-right:28px}
  .app,.demo{max-width:1120px!important}
  .app{gap:28px!important;padding-top:24px!important}
  .top{margin-bottom:4px}
  .hero{grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);column-gap:42px;align-items:center;padding:28px 0 12px}
  .hero > *{grid-column:1}
  .hero .brand-hero-art{grid-column:2;grid-row:1 / span 6}
  .screen-intro{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:28px;align-items:center;padding:26px 28px;border-radius:28px;background:linear-gradient(135deg,var(--leaf-soft),var(--sun-soft));border:1px solid var(--line)}
  .screen-intro .intro-copy{display:grid;gap:8px}
  .screen-intro .intro-art{min-height:170px;display:grid;place-items:center;border-radius:22px;background:var(--card);overflow:hidden}
  .screen-intro .intro-art svg{width:min(240px,90%);height:auto}
  .section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-top:8px}
  .section-head p{max-width:620px}
  .content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
  .content-grid > .card,.content-grid > button.card{height:100%;padding:22px!important}
  .journey-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .journey-card{padding:22px!important;gap:16px!important}
  .journey-route{font-family:var(--display);font-size:1.12rem;font-weight:700;line-height:1.25}
  .journey-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;padding:14px;border-radius:14px;background:var(--bg)}
  .journey-meta div{display:grid;gap:2px;min-width:0}
  .journey-meta span{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
  .journey-meta b{font-size:.92rem;overflow-wrap:anywhere}
  .lift-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:auto}
  .safety-panel{padding:18px 20px!important;border-left:0!important;border-radius:18px;background:var(--sky-soft);color:var(--ink)!important}
  .records-layout,.you-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
  .wide{grid-column:1/-1}
}
@media (max-width:759px){
  .screen-intro{display:grid;gap:14px;padding:20px;border-radius:22px;background:linear-gradient(135deg,var(--leaf-soft),var(--sun-soft));border:1px solid var(--line)}
  .screen-intro .intro-art{display:grid;place-items:center;min-height:120px;background:var(--card);border-radius:18px}
  .screen-intro .intro-art svg{width:180px;max-width:85%}
  .section-head{display:grid;gap:5px;margin-top:6px}
  .content-grid,.journey-grid{display:grid;grid-template-columns:1fr;gap:14px}
  .journey-card{padding:18px!important;gap:14px!important}
  .journey-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;border-radius:14px;background:var(--bg)}
  .journey-meta div{display:grid;gap:1px}.journey-meta span{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}.journey-meta b{font-size:.88rem}
  .lift-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
  .safety-panel{padding:16px!important;border-radius:16px;background:var(--sky-soft);border-left:0!important;color:var(--ink)!important}
}



/* V3 layout: deliberately roomier, with columns where they improve scanning. */
@media (min-width:760px){
  body{padding-left:28px!important;padding-right:28px!important}
  .app,.demo{max-width:940px!important}
  .tabs nav{max-width:940px!important}
}
.app{gap:24px!important;padding-bottom:116px!important}
.card{padding:20px!important;border-radius:22px!important}
.card.link{padding:0!important}
.listing-body{padding:18px 20px 20px!important}
.lifts-intro{padding:22px 24px!important;border-radius:24px;background:linear-gradient(135deg,#E0F0EC,#FFF8EA);border:1px solid #D7E8E2;position:relative;overflow:hidden}
.lifts-intro:after{content:'↗';position:absolute;right:22px;top:12px;font:700 56px/1 var(--display);color:rgba(7,94,84,.10)}
.lifts-intro h1{font-size:clamp(2rem,5vw,2.65rem)!important}
.lift-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important;margin:2px 0 8px!important}
.lift-grid>.card,.lift-grid>button.card{padding:20px!important;min-width:0!important;height:100%!important;align-content:start!important}
.lift-grid>button.card{display:grid!important;gap:12px!important}
.lift-grid .row.between{gap:12px!important;align-items:flex-start!important}
.lift-grid h3{font-size:1.08rem!important;line-height:1.35!important;overflow-wrap:anywhere}
.lift-grid p{line-height:1.6!important}
.lift-grid .pill{white-space:normal!important;text-align:center}
.lift-grid .btn{width:auto!important;max-width:100%!important}
#app>h2{margin-top:8px!important;font-size:1.45rem!important}
#app>h2 + .small.muted,#app>h2 + .muted{margin-top:-14px!important;max-width:720px}
.note{padding:14px 16px!important;border-left:4px solid var(--sun)!important;background:var(--sun-soft)!important;border-radius:0 14px 14px 0!important;line-height:1.55!important}
.family-brand-icon{width:62px!important;height:44px!important;object-fit:contain!important}
.scene-icon .family-brand-icon{width:64px!important;height:46px!important}
.detail-visual .family-brand-icon{width:142px!important;height:90px!important}
@media(max-width:759px){
  body{padding-left:max(18px,env(safe-area-inset-left,0px))!important;padding-right:max(18px,env(safe-area-inset-right,0px))!important}
  .app,.demo{max-width:680px!important}
  .app{gap:20px!important}
  .card{padding:18px!important}
  .card.link{padding:0!important}
  .listing-body{padding:16px 18px 18px!important}
  .lift-grid{grid-template-columns:1fr!important;gap:14px!important}
  .lifts-intro{padding:20px!important}
}
@media(max-width:390px){
  body{padding-left:14px!important;padding-right:14px!important}
  .card{padding:16px!important}
  .card.link{padding:0!important}
  .row.between{align-items:flex-start!important}
}


/* Explore is intentionally composed, not a uniform stack of cards. */
.explore-hero{position:relative;overflow:hidden;border-radius:30px;padding:30px 32px;background:linear-gradient(115deg,#E0F0EC 0%,#FFF8EA 55%,#E2F4FB 100%);border:1px solid #E4DDCC;min-height:170px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.explore-hero h1{font-size:clamp(2rem,5vw,3.2rem);color:var(--leaf);max-width:650px}.explore-hero .hand{font-size:1.12rem;max-width:620px;margin-top:8px}.explore-road{font-size:2.4rem;color:var(--sun);letter-spacing:.08em;white-space:nowrap;transform:rotate(-5deg)}
.explore-tools{display:grid;gap:12px}.explore-search{background:#fff;border:1px solid var(--line);box-shadow:0 8px 24px rgba(23,42,58,.06);border-radius:18px;padding:14px 18px;color:var(--muted);display:flex;gap:10px;align-items:center;font-size:1rem}
.category-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.cat{min-height:105px;border-radius:22px;padding:16px;display:grid;place-items:center;text-align:center;font-family:var(--display);font-weight:700}.cat b{font-size:2rem}.cat img{width:52px;height:36px}.cat.green{background:#E0F0EC}.cat.yellow{background:#FFF1C9}.cat.coral{background:#FFE4DF}.cat.blue{background:#E2F4FB}
.feature-wrap,.popular-wrap{display:grid;gap:12px}.section-title{display:flex;align-items:end;justify-content:space-between;gap:16px}.section-title .hand{font-size:.95rem;color:var(--muted)}
.activity-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.activity-card{padding:0!important;overflow:hidden;border:1px solid var(--line)!important;border-radius:24px!important;background:#fff!important;text-align:left!important;display:grid!important;grid-template-rows:190px 1fr;min-height:0!important;box-shadow:0 10px 30px rgba(23,42,58,.07);cursor:pointer;color:var(--ink);font:inherit}.activity-card:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(23,42,58,.11)}
.activity-photo{position:relative;background-size:cover;background-position:center}.activity-photo:after{content:"";position:absolute;inset:auto 0 0;height:40%;background:linear-gradient(transparent,rgba(0,0,0,.18))}.activity-tag,.activity-status{position:absolute;z-index:1;top:12px;border-radius:999px;padding:6px 10px;font-family:var(--display);font-size:.72rem;font-weight:700}.activity-tag{left:12px;background:var(--sun);color:var(--ink)}.activity-status{right:12px;background:#fff;color:var(--leaf)}
.activity-copy{padding:18px;display:grid;gap:8px}.activity-copy h3{font-size:1.18rem}.activity-meta{font-size:.84rem;color:var(--muted)}.activity-bottom{display:flex;justify-content:space-between;align-items:end;gap:10px;margin-top:3px}.families-going{display:flex;align-items:center;gap:5px;font-size:.78rem;color:var(--muted);white-space:nowrap}.families-going img{width:42px;height:27px}.view-cta{margin-top:3px;background:var(--sun);color:var(--ink);font-family:var(--display);font-weight:700;text-align:center;padding:10px 14px;border-radius:999px}.feature-summary{color:var(--muted);max-width:62ch}
.feature-card{grid-template-columns:minmax(320px,1.1fr) minmax(330px,1fr);grid-template-rows:none;min-height:390px!important}.feature-card .activity-photo{min-height:390px}.feature-card .activity-copy{padding:26px;align-content:center}.feature-card .activity-copy h3{font-size:1.65rem}.feature-card .view-cta{justify-self:start;min-width:160px}.feature-card .activity-bottom{margin-top:8px}
.idea-banner{background:linear-gradient(110deg,#E2F4FB,#FFF8EA 58%,#FFF1C9);border:1px solid var(--line);border-radius:28px;padding:26px;display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:center}.idea-banner h2{font-size:1.55rem}.idea-banner .idea-form .card,.idea-banner form{background:transparent;border:0;padding:0;box-shadow:none}
@media(max-width:760px){.explore-hero{padding:22px;min-height:0}.explore-road{display:none}.category-strip{grid-template-columns:repeat(4,1fr);gap:7px}.cat{min-height:84px;padding:10px 5px;font-size:.72rem}.cat b{font-size:1.5rem}.cat img{width:42px}.activity-grid{grid-template-columns:1fr}.feature-card{grid-template-columns:1fr;grid-template-rows:210px auto;min-height:0!important}.feature-card .activity-photo{min-height:210px}.feature-card .activity-copy{padding:18px}.idea-banner{grid-template-columns:1fr;padding:20px}.section-title .hand{display:none}}

/* Roamville brand: Roam Green, Sunshine, Coral, Sky on Cream, with Ink text.
   Poppins for headings, accents and buttons, Lato for body text.
   The brand is light and warm by design, so the app uses one light theme. */
:root{
  --bg:#FFF8EA; --card:#FFFFFF; --ink:#172A3A; --muted:#5A6672; --line:#EDE3CF;
  --leaf:#075E54; --leaf-soft:#E0F0EC; --sun:#FFC83D; --sun-soft:#FFF1C9; --coral:#FF6B57; --coral-soft:#FFE4DF;
  --sky:#1F7FA6; --sky-bright:#67C5E8; --sky-soft:#E2F4FB;
  --on-leaf:#FFFFFF; --warn:#8A5A00; --bad:#C2412D;
  --display:"Poppins","Avenir Next",system-ui,sans-serif;
  --body:"Lato",system-ui,-apple-system,"Segoe UI",sans-serif;
  --hand:var(--display);
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;
  padding-top:env(safe-area-inset-top,0px);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.app{max-width:640px;margin:0 auto;padding-block:16px 104px;display:grid;gap:16px}
h1,h2,h3{font-family:var(--display);margin:0;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:1.7rem;line-height:1.15} h2{font-size:1.3rem} h3{font-size:1.08rem}
p{margin:0}
a{color:var(--leaf)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
[hidden]{display:none!important}
.muted{color:var(--muted)} .small{font-size:.86rem}
.top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.logo{display:flex;align-items:center;text-decoration:none}
.logo img{height:38px;width:auto;display:block}
.logo i{width:28px;height:28px;border-radius:9px;background:var(--leaf);display:grid;place-items:center;color:var(--on-leaf);font-style:normal;font-size:.95rem}
.badge{font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--sun-soft);color:var(--warn);border-radius:999px;padding:4px 10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;display:grid;gap:10px;min-width:0}
.card.link{cursor:pointer;text-align:left;font:inherit;color:inherit;width:100%}
.card.link:hover{border-color:var(--leaf)}
.eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.between{justify-content:space-between}
.stack{display:grid;gap:10px}
.pill{font-size:.74rem;font-weight:700;border-radius:999px;padding:3px 10px;background:var(--leaf-soft);color:var(--leaf);white-space:nowrap}
.pill.sun{background:var(--sun-soft);color:var(--warn)} .pill.coral{background:var(--coral-soft);color:#A3321F} .pill.sky{background:var(--sky-soft);color:var(--sky)} .pill.grey{background:var(--bg);color:var(--muted)}
.btn{border:0;border-radius:999px;padding:11px 20px;font-family:var(--display);font-weight:600;letter-spacing:.01em;background:var(--leaf);color:var(--on-leaf);cursor:pointer;text-decoration:none;display:inline-block;text-align:center}
.btn.ghost{background:transparent;border:1.5px solid var(--leaf);color:var(--leaf)}
.btn.sun{background:var(--sun);color:var(--ink)}
.btn.coral{background:var(--coral);color:#fff}
.btn.small{padding:7px 14px;font-size:.86rem;border-radius:999px}
.btn.danger{background:transparent;border:1.5px solid var(--bad);color:var(--bad)}
.btn:disabled{opacity:.55;cursor:default}
.link-btn{background:none;border:0;padding:0;color:var(--leaf);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 13px;font-size:.86rem;font-weight:600;white-space:nowrap;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--leaf);color:var(--on-leaf);border-color:var(--leaf)}
.bar{height:10px;border-radius:999px;background:var(--bg);overflow:hidden}
.bar span{display:block;height:100%;background:var(--sun);border-radius:999px}
.bar.done span{background:var(--leaf)}
.price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.price b{font-family:var(--display);font-size:1.35rem}
.price s{color:var(--muted)}
.field{display:grid;gap:5px}
.field label{font-weight:700;font-size:.9rem}
.hint{font-size:.8rem;color:var(--muted)}
input[type=text],input[type=email],input[type=number],input[type=date],input[type=url],select,textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
textarea{resize:vertical;min-height:70px}
input.code{font-size:1.6rem;letter-spacing:.4em;text-align:center;font-family:var(--display)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.check{display:flex;gap:8px;align-items:flex-start;font-size:.92rem}
.check input{margin-top:4px}
.opt{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--card);cursor:pointer;text-align:left;width:100%}
.opt[aria-pressed="true"]{border-color:var(--leaf);background:var(--leaf-soft)}
.tick{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;font-size:.75rem}
.tick.on{background:var(--leaf);border-color:var(--leaf);color:var(--on-leaf)}
.note{font-size:.82rem;color:var(--muted);border-left:3px solid var(--sun);padding-left:10px}
.err{color:var(--bad);font-size:.9rem}
table{width:100%;border-collapse:collapse;font-size:.88rem;font-variant-numeric:tabular-nums}
td,th{padding:7px 4px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.num{text-align:right}
.scroll{overflow-x:auto}
.hero{display:grid;gap:12px;padding-block:8px}
.hero h1{font-size:clamp(1.8rem,6vw,2.4rem)}
.steps3{display:grid;gap:8px;grid-template-columns:repeat(3,1fr)}
.steps3 div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px;font-size:.88rem}
.steps3 b{display:block;font-family:var(--display);font-size:1rem;margin-bottom:2px}
.tabs{position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);z-index:5;
  padding:6px max(8px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px))}
.tabs nav{max-width:640px;margin:0 auto;display:grid;grid-auto-flow:column;grid-auto-columns:1fr}
.tabs button{background:none;border:0;padding:6px 2px;display:grid;justify-items:center;gap:2px;font-size:.72rem;font-weight:700;color:var(--muted);cursor:pointer}
.tabs button[aria-current="page"]{color:var(--leaf)}
.tabs svg{width:22px;height:22px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:14px;font-size:.9rem;z-index:6;max-width:calc(100% - 32px);text-align:center}
.plan-day{border-top:1px solid var(--line);padding-top:10px;display:grid;gap:6px}
.plan-day ol{margin:0;padding-left:1.2em}
.stat{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stat div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center}
.stat b{display:block;font-family:var(--display);font-size:1.3rem;font-variant-numeric:tabular-nums}
.stat span{font-size:.74rem;color:var(--muted)}
@media (max-width:520px){ .grid2{grid-template-columns:1fr} .steps3{grid-template-columns:1fr} .stat{grid-template-columns:repeat(2,1fr)} }
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.app > .link-btn{justify-self:start}
.plans{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.plans .card.pick{border-color:var(--sun);border-width:2px}
.feat{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:.86rem}
.feat li{display:grid;grid-template-columns:16px 1fr;gap:6px}
.feat li > span:first-child{color:var(--leaf);font-weight:800}
.feat li.off{color:var(--muted)}
.feat li.off > span:first-child{color:var(--muted)}
@media print{
  body{background:#fff;color:#000;padding:0}
  .top,.tabs,.chips,.no-print,#toast,.app > p.eyebrow,.app > div:first-of-type{display:none!important}
  .app{padding:0;max-width:none}
  .card.report{border:0;padding:0}
}
ul.plain{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:.92rem}
.driver{border-left:3px solid var(--line);padding-left:12px}
.card > .pill{justify-self:start}
.session{border-top:1px solid var(--line);padding-top:10px;display:grid;gap:6px}
.session:first-of-type{border-top:0;padding-top:0}
.label{font-weight:700;font-size:.9rem}

h1,h2,h3{font-weight:700;letter-spacing:-.015em}
.eyebrow{color:var(--leaf)}
.hand{font-family:var(--display);font-weight:600;font-size:1.05em;color:var(--leaf);line-height:1.35;letter-spacing:-.005em}
.tabs button[aria-current="page"]{color:var(--leaf)}
.bar span{background:var(--sun)} .bar.done span{background:var(--leaf)}
.card{border-radius:20px}

/* ===== Real-app additions to the v7 design ===== */
img{max-width:100%}
[hidden]{display:none!important}
.explore-search{cursor:text}
.explore-search input{flex:1;min-width:0;border:0;background:none;padding:0;font:inherit;color:var(--ink);outline:none;box-shadow:none}
.explore-search:focus-within{border-color:var(--leaf);box-shadow:0 0 0 3px rgba(7,94,84,.15)}
button.cat{border:0;cursor:pointer;color:var(--ink);font:inherit;font-family:var(--display);font-weight:700}
button.cat[aria-pressed="true"]{outline:3px solid var(--leaf);outline-offset:-3px}
button.cat:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
.detail-visual.has-photo{background-size:cover;background-position:center;background-color:var(--leaf);height:220px}
.detail-visual.has-photo:after{display:none}
.photo-edit{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.photo-thumb{width:120px;height:80px;border-radius:14px;background-size:cover;background-position:center;background-color:var(--line);flex:none}
.photo-edit input[type=file]{max-width:100%;font-size:.85rem}

/* Coming-soon photo tiles (shown while there are no live listings) */
.soon-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:760px){.soon-grid{grid-template-columns:repeat(4,1fr)}}

/* ===== Place cards (used until a listing has a real photo) ===== */
.placecard{position:relative;overflow:hidden;display:grid;place-content:center;justify-items:center;gap:10px;padding:18px;text-align:center;background:var(--pc-bg);color:var(--pc-fg);isolation:isolate}
.placecard:before{content:"";position:absolute;width:75%;aspect-ratio:1;border-radius:50%;background:var(--pc-blob);left:-22%;bottom:-38%;z-index:-1}
.pc-dot{position:absolute;width:34px;height:34px;border-radius:50%;background:var(--pc-dot);right:16px;top:14px;z-index:-1}
.pc-route{position:absolute;left:10%;right:10%;bottom:16px;border-top:3px dashed var(--pc-line);border-radius:50%;height:22px;z-index:-1}
.pc-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:var(--pc-chip);color:var(--pc-icon);box-shadow:0 8px 18px rgba(23,42,58,.12)}
.pc-icon svg{width:36px;height:36px}
.pc-label{font-family:var(--display);font-weight:700;font-size:1.05rem;line-height:1.2;max-width:22ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pc-leaf{--pc-bg:#075E54;--pc-fg:#fff;--pc-blob:rgba(255,255,255,.08);--pc-dot:#FFC83D;--pc-line:rgba(255,200,61,.55);--pc-chip:#fff;--pc-icon:#075E54}
.pc-coral{--pc-bg:#FF6B57;--pc-fg:#fff;--pc-blob:rgba(255,255,255,.14);--pc-dot:#FFC83D;--pc-line:rgba(255,255,255,.55);--pc-chip:#fff;--pc-icon:#E04A36}
.pc-sky{--pc-bg:#67C5E8;--pc-fg:#172A3A;--pc-blob:rgba(255,255,255,.22);--pc-dot:#FFC83D;--pc-line:rgba(7,94,84,.4);--pc-chip:#fff;--pc-icon:#1F7FA6}
.pc-yellow{--pc-bg:#FFC83D;--pc-fg:#172A3A;--pc-blob:rgba(255,255,255,.25);--pc-dot:#FF6B57;--pc-line:rgba(7,94,84,.4);--pc-chip:#fff;--pc-icon:#075E54}
.activity-photo.placecard:after{display:none}
.activity-photo.placecard{min-height:190px}
.detail-visual.placecard{height:220px;font-size:inherit}.detail-visual.placecard:after{display:none}
.detail-visual.placecard .pc-label{font-size:1.3rem}
.photo-thumb.placecard{padding:6px;gap:4px}.photo-thumb.placecard .pc-icon{width:34px;height:34px;border-radius:10px}.photo-thumb.placecard .pc-icon svg{width:20px;height:20px}.photo-thumb.placecard .pc-label,.photo-thumb.placecard .pc-dot,.photo-thumb.placecard .pc-route{display:none}
.soon-tile.placecard{aspect-ratio:4/3;border-radius:20px;gap:8px;padding:12px;box-shadow:0 8px 22px rgba(23,42,58,.08)}
.soon-tile.placecard .pc-label{font-size:.95rem}
@media(max-width:520px){.soon-tile.placecard .pc-icon{width:50px;height:50px;border-radius:16px}.soon-tile.placecard .pc-icon svg{width:28px;height:28px}.soon-tile.placecard .pc-label{font-size:.85rem}}
.soon-tile.photo{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:var(--leaf) center/cover no-repeat;box-shadow:0 8px 22px rgba(23,42,58,.08)}
.soon-tile.photo:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(7,30,27,.62))}
.soon-tile.photo .soon-label{position:absolute;left:12px;right:12px;bottom:10px;z-index:1;color:#fff;font-family:var(--display);font-weight:700;font-size:.95rem;line-height:1.2}

/* Pod cards have no photo, so they keep normal card padding */
.card.link.pod-card{padding:18px 20px!important;display:grid;gap:8px!important;text-align:left}
/* Coming-soon photos are wide banners, to suit the photos' shape */
.soon-grid{grid-template-columns:1fr!important}
@media(min-width:760px){.soon-grid{grid-template-columns:repeat(2,1fr)!important}}
.soon-tile.photo{aspect-ratio:2.2/1!important;background-position:center 40%!important}
