/* CONFIDENTIAL - TRADE SECRET - Property of Joseph M. Castillo - All rights reserved */
/* yosemite-camp — "Go Climb A Rock" design system. Mobile-first. */

:root {
  /* ---- Go Climb A Rock palette ---- */
  --bg:        #0c0c0d;   /* near-black canvas */
  --bg-2:      #141416;   /* raised surface */
  --bg-3:      #1c1d20;   /* card */
  --ink:       #f4f3f0;   /* primary text */
  --ink-dim:   #b7b4ad;   /* secondary text */
  --ink-mute:  #7d7a73;   /* muted */
  --gold:      #d8a84b;   /* gold-hour amber — the accent */
  --gold-soft: #e7c587;
  --granite:   #3a3d42;   /* granite grey */
  --pine:      #4a6b54;   /* deep pine (rare) */
  --line:      #26262a;

  /* ---- type ---- */
  --face: "Helvetica Neue", Helvetica, Arimo, Arial, sans-serif;

  /* ---- spacing (4px base) ---- */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:72px;

  /* ---- safe areas (iOS notch / home indicator) ---- */
  --safe-t: env(safe-area-inset-top, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-l: env(safe-area-inset-left, 0px);
  --safe-r: env(safe-area-inset-right, 0px);

  --nav-h: 56px;
}

* { box-sizing:border-box; -webkit-tap-highlight-color: transparent; }
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--face); line-height:1.5;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }

/* ============ display type — the YMS shirt voice ============ */
.gcar {
  font-weight:700; letter-spacing:-0.04em; line-height:0.92;
  text-transform:lowercase;
}

/* ============ top bar (thumb-safe) ============ */
.topbar {
  position:fixed; top:0; left:0; right:0; z-index:50;
  height:calc(var(--nav-h) + var(--safe-t));
  padding:var(--safe-t) max(var(--s4), var(--safe-l)) 0 max(var(--s4), var(--safe-r));
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(12,12,13,0.72); backdrop-filter:saturate(160%) blur(12px);
  -webkit-backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--line);
}
.topbar .mark { font-weight:700; letter-spacing:-0.03em; font-size:17px; }
.topbar .mark b { color:var(--gold); }
.topbar .dot { color:var(--ink-mute); font-weight:400; }

/* ============ bottom tab nav — primary on mobile ============ */
.tabnav {
  position:fixed; left:0; right:0; bottom:0; z-index:50;
  display:flex; justify-content:flex-start; align-items:stretch;
  padding-bottom:var(--safe-b);
  background:rgba(12,12,13,0.92); backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; scroll-snap-type:x proximity;
}
.tabnav::-webkit-scrollbar { display:none; }
.tabnav a {
  flex:0 0 auto; min-width:62px; min-height:54px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:3px; scroll-snap-align:center;
  color:var(--ink-mute); font-size:9.5px; letter-spacing:0.03em;
  text-transform:uppercase; padding:7px 8px; transition:color .18s ease;
}
.tabnav a .ic { font-size:20px; line-height:1; filter:grayscale(.45) opacity(.85); transition:filter .18s ease; }
.tabnav a.active { color:var(--gold); }
.tabnav a.active .ic { filter:none; }

/* ============ layout shell ============ */
main { padding-top:calc(var(--nav-h) + var(--safe-t)); padding-bottom:90px; }
.section { padding:var(--s7) max(var(--s4), var(--safe-l)) var(--s7) max(var(--s4), var(--safe-r)); }
.section h2.eyebrow { font-size:12px; letter-spacing:0.22em; text-transform:uppercase; color:var(--gold); margin:0 0 var(--s2); font-weight:700; }
.section h3.title { font-weight:700; letter-spacing:-0.03em; font-size:30px; margin:0 0 var(--s4); line-height:1; }
.lead { color:var(--ink-dim); max-width:60ch; }

/* ============ HERO ============ */
.hero {
  position:relative; min-height:100svh; min-height:100vh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:var(--s6) max(var(--s5), var(--safe-l)) calc(var(--s8) + var(--safe-b)) max(var(--s5), var(--safe-r));
  overflow:hidden;
  /* gold-hour over granite — El Cap at sunset, rendered in pure CSS */
  background:
    radial-gradient(120% 80% at 70% 8%, rgba(216,168,75,0.30), transparent 55%),
    radial-gradient(140% 90% at 20% 100%, rgba(74,107,84,0.18), transparent 50%),
    linear-gradient(180deg, #1a1410 0%, #100f10 40%, #0a0a0b 100%);
}
.hero::after { /* granite grain */
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero .ridge { /* a granite skyline silhouette */
  position:absolute; left:0; right:0; bottom:0; height:38vh; z-index:0; opacity:0.9;
}
.hero-inner { position:relative; z-index:2; }
.hero .kicker { color:var(--gold-soft); font-size:13px; letter-spacing:0.2em; text-transform:uppercase; font-weight:700; margin-bottom:var(--s4); }
.hero .gcar { font-size:clamp(64px, 22vw, 132px); color:var(--ink); }
.hero .gcar .amp { color:var(--gold); }
.hero .school { margin-top:var(--s4); font-weight:700; letter-spacing:-0.01em; color:var(--ink-dim); font-size:15px; }
.hero .trip {
  margin-top:var(--s6); display:flex; flex-wrap:wrap; gap:var(--s2) var(--s4);
  align-items:baseline; color:var(--ink-dim);
}
.hero .trip .where { color:var(--ink); font-weight:700; font-size:18px; letter-spacing:-0.01em; }
.hero .trip .when { color:var(--gold); font-weight:700; }
.scrollcue { margin-top:var(--s6); color:var(--ink-mute); font-size:11px; letter-spacing:0.2em; text-transform:uppercase; animation:bob 2.4s ease-in-out infinite; }
@keyframes bob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(5px)} }

/* ============ generic cards / placeholders ============ */
.placeholder {
  border:1px dashed var(--line); border-radius:14px; padding:var(--s6) var(--s4);
  color:var(--ink-mute); text-align:center; background:var(--bg-2);
}
.photo-slot {
  position:relative; border-radius:14px; overflow:hidden; background:
    radial-gradient(120% 90% at 60% 10%, rgba(216,168,75,0.22), transparent 60%),
    linear-gradient(180deg, #20211f, #0e0e0f);
  border:1px solid var(--line); aspect-ratio:4/3; display:flex; align-items:flex-end; padding:var(--s4);
}
.photo-slot .cap { font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-mute); }

/* ============ family roster ============ */
.family-grid { display:grid; grid-template-columns:1fr; gap:var(--s3); margin-top:var(--s5); }
.fam-card {
  display:flex; align-items:center; gap:var(--s4);
  background:var(--bg-3); border:1px solid var(--line); border-radius:14px;
  padding:var(--s4); transition:border-color .2s ease, transform .2s ease;
}
.fam-card.lead { border-color:rgba(216,168,75,0.5); background:linear-gradient(180deg, rgba(216,168,75,0.08), var(--bg-3)); }
.fam-card .mono {
  flex:0 0 auto; width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:24px; letter-spacing:-1px;
  background:radial-gradient(120% 120% at 30% 20%, var(--gold-soft), var(--gold)); color:#171206;
}
.fam-name { margin:0; font-weight:700; letter-spacing:-0.02em; font-size:19px; }
.fam-role { color:var(--gold); font-size:12px; letter-spacing:0.12em; text-transform:uppercase; margin-top:1px; }
.fam-from { color:var(--ink-dim); font-size:13px; margin-top:3px; }
.fam-tag { color:var(--ink-mute); font-size:12px; font-style:italic; margin-top:3px; }
.photo-img { width:100%; border-radius:14px; border:1px solid var(--line); }
@media (min-width:620px){ .family-grid { grid-template-columns:1fr 1fr; } }
@media (min-width:1000px){ .family-grid { grid-template-columns:1fr 1fr 1fr; } }

/* ============ trip + logistics ============ */
.badge-draft { display:inline-block; font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  color:#171206; background:var(--gold-soft); border-radius:999px; padding:4px 10px; margin-bottom:var(--s4); font-weight:700; }
.trip-meta { display:grid; grid-template-columns:1fr; gap:var(--s2); margin:var(--s4) 0 var(--s5); }
.trip-meta .tm { display:flex; gap:var(--s3); align-items:baseline; background:var(--bg-3); border:1px solid var(--line); border-radius:10px; padding:var(--s3) var(--s4); }
.trip-meta .k { color:var(--gold); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; flex:0 0 64px; font-weight:700; }
.trip-meta .v { color:var(--ink); }
.timeline { list-style:none; margin:0; padding:0; position:relative; }
.timeline .day { display:flex; gap:var(--s4); padding:var(--s3) 0; position:relative; }
.timeline .day-d { flex:0 0 58px; color:var(--gold); font-weight:700; font-size:13px; padding-top:2px; letter-spacing:0.02em; }
.timeline .day-c { border-left:2px solid var(--line); padding-left:var(--s4); padding-bottom:var(--s2); }
.timeline .day-c h4 { margin:0 0 2px; font-weight:700; letter-spacing:-0.01em; }
.timeline .day-c p { margin:0; color:var(--ink-dim); font-size:14px; }
.log-arrivals { display:grid; grid-template-columns:1fr; gap:var(--s3); margin:var(--s4) 0 var(--s6); }
.arr { display:flex; gap:var(--s4); align-items:flex-start; background:var(--bg-3); border:1px solid var(--line); border-radius:12px; padding:var(--s4); }
.arr.fly { border-color:rgba(216,168,75,0.4); }
.arr-ic { font-size:22px; color:var(--gold); flex:0 0 26px; text-align:center; }
.arr-who { font-weight:700; }
.arr-meta { color:var(--gold); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; margin:1px 0; }
.arr-detail { color:var(--ink-dim); font-size:13px; }
.gear-h { margin:var(--s5) 0 var(--s3); font-weight:700; letter-spacing:-0.01em; }
.gear { list-style:none; margin:0; padding:0; }
.gear-item { display:flex; align-items:center; gap:var(--s3); padding:var(--s3) 0; border-bottom:1px solid var(--line); }
.gear-item .box { flex:0 0 22px; height:22px; width:22px; border:1.5px solid var(--ink-mute); border-radius:6px; display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:14px; }
.gear-item .box.on { border-color:var(--gold); background:rgba(216,168,75,0.15); }
.gear-item .gi { flex:1; }
.gear-item .go { color:var(--ink-mute); font-size:12px; }
@media (min-width:620px){ .trip-meta { grid-template-columns:1fr 1fr 1fr; } .log-arrivals { grid-template-columns:1fr 1fr 1fr; } }

/* ============ legends ============ */
.legends { display:grid; grid-template-columns:1fr; gap:var(--s4); margin-top:var(--s5); }
.legend { margin:0; background:var(--bg-3); border:1px solid var(--line); border-radius:16px; overflow:hidden; transition:transform .25s ease, border-color .25s ease; }
.legend:hover, .legend:focus-within { transform:translateY(-3px); border-color:rgba(216,168,75,0.5); }
.legend-media .photo-slot { border:0; border-radius:0; aspect-ratio:3/4; }
.legend-media .photo-img { border-radius:0; border:0; aspect-ratio:3/4; object-fit:cover; }
.legend-cap { padding:var(--s4); }
.legend-cap h4 { margin:0; font-weight:700; letter-spacing:-0.02em; font-size:20px; }
.legend-for { margin:4px 0 0; color:var(--ink-dim); font-size:13px; }
.legend-q { margin:var(--s3) 0 0; color:var(--gold); font-style:italic; font-size:14px; }
@media (min-width:620px){ .legends { grid-template-columns:1fr 1fr; } }
@media (min-width:1000px){ .legends { grid-template-columns:1fr 1fr 1fr; } }

/* ============ a11y: skip link + focus ============ */
.skip { position:absolute; left:-999px; top:0; z-index:100; background:var(--gold); color:#171206; padding:10px 16px; border-radius:0 0 10px 0; font-weight:700; }
.skip:focus { left:0; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline:2px solid var(--gold); outline-offset:3px; border-radius:4px; }

/* ============ reveal-on-scroll ============ */
.reveal { opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in { opacity:1; transform:none; }

/* ============ footer ============ */
.foot { padding:var(--s7) var(--s4) calc(var(--s7) + var(--safe-b)); color:var(--ink-mute); font-size:12px; text-align:center; border-top:1px solid var(--line); }
.foot b { color:var(--gold); }

/* ============ laptop / tablet enhancement (mobile is the base) ============ */
@media (min-width:760px) {
  .tabnav { left:50%; right:auto; bottom:24px; transform:translateX(-50%);
    width:auto; max-width:min(92vw,820px); gap:var(--s2); border-radius:999px; border:1px solid var(--line);
    padding:0 var(--s2); box-shadow:0 10px 40px rgba(0,0,0,.5); }
  .tabnav a { min-width:72px; border-radius:999px; }
  main { padding-bottom:0; }
  .section { padding-left:max(var(--s8), 8vw); padding-right:max(var(--s8), 8vw); }
  .section h3.title { font-size:42px; }
  .hero .school { font-size:18px; }
}
@media (min-width:1100px) {
  .section { max-width:1100px; margin:0 auto; }
  .hero .gcar { font-size:clamp(96px, 12vw, 168px); }
}
@media (prefers-reduced-motion:reduce) {
  * { scroll-behavior:auto !important; animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; }
}

/* ============================================================
   BUILD PROGRAM — modular feature styles (YC-K / T1-T4)
   ============================================================ */

/* ---- lock bar (privacy gate, in topbar) — YC-I.2 ---- */
.lockbar { display:flex; align-items:center; gap:var(--s2); font-size:11px; flex-wrap:wrap; justify-content:flex-end; }
.lockbar.shake { animation:shake .4s; }
@keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }
.lock-state { color:var(--ink-mute); letter-spacing:0.04em; }
.lock-in { background:var(--bg-3); border:1px solid var(--line); color:var(--ink); border-radius:8px; padding:5px 8px; font-size:12px; width:118px; }
.lock-in:focus { outline:none; border-color:var(--gold); }
.lock-btn { background:var(--gold); color:#171206; border:0; border-radius:8px; padding:5px 10px; font-weight:700; font-size:11px; letter-spacing:0.04em; text-transform:uppercase; cursor:pointer; }
.lock-btn:active { transform:translateY(1px); }

/* ---- masked (locked sensitive section) ---- */
.masked { border:1px dashed var(--line); border-radius:14px; padding:var(--s6) var(--s4); text-align:center; background:var(--bg-2); }
.masked-ic { font-size:28px; }
.masked-t { font-weight:700; margin-top:var(--s2); }
.masked-s { color:var(--ink-mute); font-size:13px; margin-top:4px; }

/* ---- CONDITIONS (T2) ---- */
.cond-wrap { margin-top:var(--s5); }
.cond-light { display:flex; align-items:center; gap:var(--s4); border-radius:16px; padding:var(--s5) var(--s4); border:1px solid var(--line); }
.cond-light.go { background:linear-gradient(180deg, rgba(74,107,84,.22), var(--bg-3)); border-color:rgba(122,180,130,.5); }
.cond-light.caution { background:linear-gradient(180deg, rgba(216,168,75,.18), var(--bg-3)); border-color:rgba(216,168,75,.55); }
.cond-light.nogo { background:linear-gradient(180deg, rgba(200,90,80,.20), var(--bg-3)); border-color:rgba(220,120,110,.6); }
.cl-badge { flex:0 0 auto; font-weight:800; letter-spacing:0.04em; font-size:22px; padding:10px 16px; border-radius:12px; background:#0e0e0f; }
.cond-light.go .cl-badge { color:#8fe0a0; }
.cond-light.caution .cl-badge { color:var(--gold-soft); }
.cond-light.nogo .cl-badge { color:#f0a097; }
.cl-text { display:flex; flex-direction:column; }
.cl-text b { font-size:15px; }
.cl-text span { color:var(--ink-dim); font-size:13px; margin-top:2px; }
.cond-fresh { color:var(--ink-mute); font-size:12px; margin:var(--s3) 0 var(--s4); letter-spacing:0.02em; }
.cf-mock { color:var(--gold); font-weight:700; text-transform:uppercase; font-size:10px; letter-spacing:0.12em; }
.cond-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--s3); }
.cond-card { background:var(--bg-3); border:1px solid var(--line); border-radius:12px; padding:var(--s4); }
.cc-k { color:var(--gold); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; font-weight:700; }
.cc-big { font-size:24px; font-weight:700; letter-spacing:-0.02em; margin:2px 0; }
.cc-sub { color:var(--ink-dim); font-size:13px; }
.cc-sub .flag { color:#f0a097; font-size:11px; text-transform:uppercase; letter-spacing:0.08em; }
.cond-roads-h { margin:var(--s5) 0 var(--s3); font-weight:700; }
.cond-roads { background:var(--bg-3); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.road { display:grid; grid-template-columns:1fr auto auto; gap:var(--s3); align-items:center; padding:var(--s3) var(--s4); border-bottom:1px solid var(--line); }
.road.bad { background:rgba(216,168,75,.08); }
.rd-name { font-weight:700; }
.rd-status { color:var(--ink-dim); font-size:13px; }
.rd-chain { color:var(--ink-mute); font-size:12px; }
.road.bad .rd-chain { color:var(--gold); }
.rd-note { grid-column:1/-1; color:var(--ink-mute); font-size:12px; padding:0 var(--s4) var(--s3); }
.cond-alerts { margin-top:var(--s3); }
.alert { background:rgba(200,90,80,.14); border:1px solid rgba(220,120,110,.4); border-radius:10px; padding:var(--s3) var(--s4); color:#f0c0b8; font-size:13px; margin-top:var(--s2); }
@media (min-width:620px){ .cond-grid { grid-template-columns:1fr 1fr 1fr; } }

/* ---- GEAR (T1) ---- */
.gear-wrap { margin-top:var(--s5); }
.gear-cold { background:rgba(110,150,210,.14); border:1px solid rgba(140,180,230,.4); color:#bcd4f0; border-radius:12px; padding:var(--s3) var(--s4); font-size:13px; margin-bottom:var(--s4); }
.gear-redundant { background:rgba(216,168,75,.10); border:1px solid rgba(216,168,75,.35); color:var(--gold-soft); border-radius:12px; padding:var(--s3) var(--s4); font-size:13px; margin:var(--s4) 0; }
.ess { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); margin-bottom:var(--s4); }
.ess-h, .pp-h { color:var(--gold); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; font-weight:700; margin-bottom:var(--s3); }
.ess-row { display:flex; flex-wrap:wrap; gap:var(--s2); }
.ess-chip { font-size:12px; padding:5px 10px; border-radius:999px; border:1px solid var(--line); }
.ess-chip.ok { color:#8fe0a0; border-color:rgba(122,180,130,.45); background:rgba(74,107,84,.14); }
.ess-chip.miss { color:#f0a097; border-color:rgba(220,120,110,.4); }
.ess-chip.urgent { animation:pulse 1.6s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.55} }
.pp { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); margin-bottom:var(--s4); }
.pp-row { display:grid; grid-template-columns:80px 1fr 42px; gap:var(--s3); align-items:center; padding:4px 0; }
.pp-name { font-size:13px; font-weight:700; }
.pp-bar { height:8px; background:#0e0e0f; border-radius:999px; overflow:hidden; }
.pp-fill { display:block; height:100%; background:linear-gradient(90deg, var(--gold), var(--gold-soft)); }
.pp-pct { font-size:12px; color:var(--ink-dim); text-align:right; }
.pp-pct.zero { color:#f0a097; }
.gear-filters { display:flex; flex-wrap:wrap; gap:var(--s2); margin:var(--s3) 0; }
.fchip { background:var(--bg-3); border:1px solid var(--line); color:var(--ink-dim); border-radius:999px; padding:6px 12px; font-size:12px; cursor:pointer; }
.fchip.on { background:var(--gold); color:#171206; border-color:var(--gold); font-weight:700; }
.gear-matrix { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.gm-row { display:grid; grid-template-columns:30px 1fr auto; gap:var(--s2) var(--s3); align-items:center; padding:var(--s3) var(--s4); border-bottom:1px solid var(--line); }
.gm-check { grid-row:1/3; width:26px; height:26px; border:1.5px solid var(--ink-mute); border-radius:7px; background:transparent; color:var(--gold); font-size:15px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.gm-check.on { border-color:var(--gold); background:rgba(216,168,75,.15); }
.gm-item { font-weight:600; }
.gm-qty { color:var(--ink-mute); font-weight:400; }
.gm-ess { font-size:10px; text-transform:uppercase; letter-spacing:0.08em; color:var(--gold); border:1px solid rgba(216,168,75,.4); border-radius:999px; padding:1px 6px; margin-left:4px; }
.gm-cat { color:var(--ink-mute); font-size:12px; }
.gm-owner { color:var(--ink-dim); font-size:12px; grid-column:2; }
.gm-status { font-size:11px; text-transform:uppercase; letter-spacing:0.06em; font-weight:700; text-align:right; }
.gm-status.s-provided { color:#8fe0a0; }
.gm-status.s-in-progress { color:var(--gold); }
.gm-status.s-willing { color:#9fc0e6; }
.gm-status.s-maybe { color:var(--ink-mute); }
.gear-foot { display:flex; align-items:center; justify-content:space-between; margin-top:var(--s4); color:var(--ink-dim); font-size:13px; }
.gear-foot b { color:var(--gold); }

/* ---- ROCK (T3) ---- */
.rock-wrap { margin-top:var(--s5); }
.rock-src { color:var(--ink-mute); font-size:12px; font-style:italic; margin:0 0 var(--s4); }
.rock-filters { display:flex; flex-direction:column; gap:var(--s2); margin-bottom:var(--s4); }
.rseg { display:flex; flex-wrap:wrap; gap:var(--s2); align-items:center; }
.rseg-l { color:var(--gold); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; font-weight:700; flex:0 0 40px; }
.rchip { background:var(--bg-3); border:1px solid var(--line); color:var(--ink-dim); border-radius:999px; padding:5px 11px; font-size:12px; cursor:pointer; }
.rchip.on { background:var(--gold); color:#171206; border-color:var(--gold); font-weight:700; }
.rock-list { display:grid; grid-template-columns:1fr; gap:var(--s3); }
.route { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); }
.route.t-boulder { border-left:3px solid var(--pine); }
.route.t-trad { border-left:3px solid var(--gold); }
.rt-head { display:flex; justify-content:space-between; align-items:baseline; gap:var(--s3); }
.rt-name { font-weight:700; font-size:17px; letter-spacing:-0.01em; }
.rt-grade { color:var(--gold); font-weight:800; font-size:16px; }
.rt-meta { display:flex; gap:var(--s3); align-items:center; margin:4px 0; flex-wrap:wrap; }
.rt-type { font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--ink-mute); }
.rt-area { color:var(--ink-dim); font-size:13px; }
.rt-stars { color:var(--gold); letter-spacing:1px; font-size:13px; margin-left:auto; }
.rt-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:var(--s2); }
.rtag { font-size:11px; color:var(--ink-dim); background:#0e0e0f; border:1px solid var(--line); border-radius:999px; padding:2px 9px; }
.rt-kit { color:var(--ink-mute); font-size:12px; margin-top:var(--s2); }
.rt-link { display:inline-block; margin-top:var(--s3); color:var(--gold); font-size:13px; font-weight:700; }
.rock-foot { color:var(--ink-mute); font-size:12px; margin-top:var(--s4); text-align:center; }
@media (min-width:620px){ .rock-list { grid-template-columns:1fr 1fr; } .pp-row { grid-template-columns:110px 1fr 48px; } }

/* ---- family handles + tentative days (T4) ---- */
.fam-handle { font-size:11px; color:var(--gold-soft); letter-spacing:0; text-transform:none; margin-left:6px; }
.fam-handle.pend { color:var(--ink-mute); font-style:italic; }
.fam-card.pending { opacity:.82; border-style:dashed; }
.trip-decision { color:var(--gold-soft); font-size:13px; margin:0 0 var(--s4); }
.timeline .day.tentative .day-c { border-left-style:dashed; }
.day-d .tent { font-size:10px; text-transform:uppercase; letter-spacing:0.08em; color:var(--ink-mute); border:1px solid var(--line); border-radius:999px; padding:1px 6px; }
.log-foot { color:var(--ink-mute); font-size:13px; font-style:italic; }

/* ============================================================
   ~go additions — breaking news · flight · top-rope · legend photos
   ============================================================ */

/* ---- breaking news bar (under the topbar) ---- */
.breaking { position:sticky; top:calc(var(--nav-h) + var(--safe-t)); z-index:40;
  background:linear-gradient(90deg, rgba(216,168,75,.20), rgba(216,168,75,.10));
  border-bottom:1px solid rgba(216,168,75,.5); }
.bk-inner { display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap;
  max-width:1100px; margin:0 auto; padding:10px max(var(--s4), var(--safe-l)); }
.bk-tag { font-weight:800; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:#171206; background:var(--gold); border-radius:999px; padding:3px 10px; white-space:nowrap; }
.bk-body { flex:1; min-width:200px; font-size:14px; color:var(--ink); }
.bk-body b { color:var(--gold-soft); }
.bk-src { font-size:11px; color:var(--ink-mute); white-space:nowrap; }
.bk-x { background:transparent; border:0; color:var(--ink-mute); font-size:16px; cursor:pointer; padding:2px 6px; }
.bk-x:hover { color:var(--ink); }

/* ---- flight card (Dad's inbound, for James) ---- */
.flight { margin:var(--s5) 0 var(--s4); background:
    radial-gradient(120% 80% at 85% 0%, rgba(111,195,223,.10), transparent 55%), var(--bg-3);
  border:1px solid var(--line); border-radius:16px; padding:var(--s5) var(--s4); }
.fl-head { display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap; }
.fl-ic { font-size:26px; color:var(--gold); }
.fl-who { font-weight:700; font-size:17px; letter-spacing:-.01em; }
.fl-sum { color:var(--gold); font-size:12px; text-transform:uppercase; letter-spacing:.08em; margin-top:1px; }
.fl-conf { margin-left:auto; font-size:12px; color:var(--ink-dim); }
.fl-conf b { color:var(--ink); font-family:Consolas,Menlo,monospace; letter-spacing:1px; }
.fl-note { color:var(--ink-dim); font-size:13px; margin:var(--s3) 0 0; }
.fl-legs { margin-top:var(--s4); display:flex; flex-direction:column; gap:var(--s2); }
.fl-leg { background:#0e0e0f; border:1px solid var(--line); border-radius:12px; padding:var(--s4); }
.fl-leg.land { border-color:rgba(216,168,75,.5); background:linear-gradient(180deg, rgba(216,168,75,.08), #0e0e0f); }
.fl-no { color:var(--ink-mute); font-size:11px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:var(--s3); }
.fl-od { display:grid; grid-template-columns:1fr auto 1fr; gap:var(--s3); align-items:start; }
.fl-pt .fl-t { font-size:20px; font-weight:700; letter-spacing:-.02em; }
.fl-pt .fl-d { font-size:12px; color:var(--gold); }
.fl-pt .fl-pl { font-size:12px; color:var(--ink-dim); margin-top:3px; }
.fl-arrow { color:var(--ink-mute); font-size:18px; padding-top:4px; }
.fl-layover { text-align:center; color:var(--ink-mute); font-size:12px; font-style:italic; padding:2px 0; }

/* ---- top-rope route styling (joins boulder) ---- */
.route.t-toprope { border-left:3px solid var(--accent); }

/* ---- legend photos (real img or cinematic SVG fallback) ---- */
.legend-media .legend-art { width:100%; aspect-ratio:3/4; display:block; }
.legend.click, .legend a { cursor:pointer; }

/* ============================================================
   WAVE 2 — people/profiles · activity sections · gear rework
   ============================================================ */

/* ---- people: clickable cards, icons, stats ---- */
.fam-card.click { cursor:pointer; }
.fam-card.click:active { transform:scale(.99); }
.fam-card .mono.emoji { font-size:26px; background:radial-gradient(120% 120% at 30% 20%, #2a2b2f, #17181b); color:#fff; }
.fam-photo { flex:0 0 auto; width:52px; height:52px; border-radius:50%; object-fit:cover; border:1px solid var(--line); }
.fam-stat { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; align-items:center; }
.fam-lvl { font-size:11px; color:#171206; background:var(--gold-soft); border-radius:999px; padding:2px 8px; font-weight:700; }
.fam-chip { font-size:11px; color:var(--ink-dim); background:#0e0e0f; border:1px solid var(--line); border-radius:999px; padding:2px 8px; }
.fam-edit { color:var(--ink-mute); font-size:11px; margin-top:6px; letter-spacing:.02em; }

/* ---- profile drawer ---- */
.drawer { position:fixed; inset:0; z-index:80; pointer-events:none; }
.drawer.open { pointer-events:auto; }
.dr-scrim { position:absolute; inset:0; background:rgba(0,0,0,.6); backdrop-filter:blur(2px); }
.dr-panel { position:absolute; left:0; right:0; bottom:0; max-height:90vh; overflow-y:auto;
  background:var(--bg-2); border-top:2px solid var(--gold); border-radius:18px 18px 0 0;
  padding:var(--s5) max(var(--s4),var(--safe-l)) calc(var(--s6) + var(--safe-b)); animation:slideup .25s ease; }
@keyframes slideup { from { transform:translateY(100%); } to { transform:none; } }
@media (min-width:620px){ .dr-panel { left:50%; right:auto; bottom:auto; top:50%; transform:translate(-50%,-50%); width:480px; max-width:92vw; border-radius:18px; border:2px solid var(--gold); } @keyframes slideup { from{opacity:0} to{opacity:1} } }
.dr-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--s3); }
.dr-top h3 { margin:0; font-weight:700; }
.dr-h { color:var(--gold-soft); font-size:13px; font-weight:400; }
.dr-x { background:transparent; border:0; color:var(--ink-mute); font-size:20px; cursor:pointer; }
.dr-sec { padding:var(--s4) 0; border-top:1px solid var(--line); }
.dr-lbl { color:var(--gold); font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; margin-bottom:var(--s3); }
.ic-grid { display:grid; grid-template-columns:repeat(8,1fr); gap:6px; }
.ic-opt { aspect-ratio:1; font-size:20px; background:var(--bg-3); border:1px solid var(--line); border-radius:10px; cursor:pointer; }
.ic-opt.on { border-color:var(--gold); background:rgba(216,168,75,.18); }
.dr-in { width:100%; margin-top:var(--s2); background:var(--bg-3); border:1px solid var(--line); color:var(--ink); border-radius:10px; padding:10px 12px; font-size:14px; font-family:inherit; }
.dr-in:focus { outline:none; border-color:var(--gold); }
.dr-ta { min-height:64px; resize:vertical; }
.lvl-row, .gear-tools { display:flex; flex-wrap:wrap; gap:var(--s2); }
.lvl-opt { background:var(--bg-3); border:1px solid var(--line); color:var(--ink-dim); border-radius:999px; padding:6px 12px; font-size:12px; cursor:pointer; }
.lvl-opt.on { background:var(--gold); color:#171206; border-color:var(--gold); font-weight:700; }
.dr-claims { list-style:none; margin:0; padding:0; }
.dr-claims li { color:var(--green); font-size:13px; padding:3px 0; }
.dr-empty { color:var(--ink-mute); font-size:13px; }
.dr-req { margin-top:var(--s2); background:transparent; border:1px solid var(--line); color:var(--accent); border-radius:10px; padding:8px 12px; font-size:13px; cursor:pointer; width:100%; }
.dr-save { margin-top:var(--s4); width:100%; background:var(--gold); color:#171206; border:0; border-radius:12px; padding:13px; font-weight:700; font-size:15px; cursor:pointer; }

/* ---- activity sections (hiking / fishing) ---- */
.place-wrap { margin-top:var(--s5); }
.place-src { color:var(--ink-mute); font-size:12px; font-style:italic; margin:0 0 var(--s4); }
.place-list { display:grid; grid-template-columns:1fr; gap:var(--s3); }
.place { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); border-left:3px solid var(--pine); }
.pl-head { display:flex; justify-content:space-between; align-items:baseline; gap:var(--s3); }
.pl-name { font-weight:700; font-size:17px; letter-spacing:-.01em; }
.pl-stars { color:var(--gold); font-size:13px; letter-spacing:1px; }
.pl-meta { display:flex; flex-wrap:wrap; gap:var(--s2); align-items:center; margin:var(--s2) 0; }
.pl-badge { font-size:11px; color:var(--ink-dim); background:#0e0e0f; border:1px solid var(--line); border-radius:999px; padding:2px 9px; }
.pl-badge.grade { color:var(--gold); border-color:rgba(216,168,75,.4); }
.pl-badge.fish { color:#9fc0e6; }
.pl-area { color:var(--ink-mute); font-size:12px; }
.pl-why { color:var(--ink-dim); font-size:14px; margin:var(--s2) 0; }
.pl-tags { display:flex; flex-wrap:wrap; gap:6px; }
.ptag { font-size:11px; color:var(--ink-dim); background:#0e0e0f; border:1px solid var(--line); border-radius:999px; padding:2px 9px; }
.pl-link { display:inline-block; margin-top:var(--s3); color:var(--gold); font-size:13px; font-weight:700; }
.fish-license { background:rgba(111,195,223,.10); border:1px solid rgba(111,195,223,.35); color:#cfe7f2; border-radius:12px; padding:var(--s3) var(--s4); font-size:13px; margin-bottom:var(--s4); }
.fish-license a { color:var(--accent); font-weight:700; }
@media (min-width:620px){ .place-list { grid-template-columns:1fr 1fr; } }

/* ---- golf ---- */
.golf-wrap { margin-top:var(--s5); }
.golf-card { background:radial-gradient(120% 80% at 80% 0%, rgba(74,107,84,.18), transparent 55%), var(--bg-3); border:1px solid var(--line); border-radius:16px; padding:var(--s5) var(--s4); max-width:560px; }
.gf-head { display:flex; align-items:center; gap:var(--s3); }
.gf-flag { font-size:30px; }
.gf-name { font-weight:700; font-size:20px; }
.gf-sub { color:var(--gold); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.gf-blurb { color:var(--ink-dim); font-size:14px; margin:var(--s4) 0; }
.gf-rows { display:flex; flex-direction:column; gap:var(--s2); }
.gf-row { display:flex; gap:var(--s3); border-top:1px solid var(--line); padding-top:var(--s2); }
.gf-k { flex:0 0 60px; color:var(--gold); font-size:11px; text-transform:uppercase; letter-spacing:.1em; font-weight:700; padding-top:2px; }
.gf-v { color:var(--ink); font-size:14px; }
.gf-note { color:var(--ink-mute); font-size:12px; font-style:italic; margin:var(--s3) 0 0; }
.gf-book { display:inline-block; margin-top:var(--s4); background:var(--gold); color:#171206; border-radius:12px; padding:11px 18px; font-weight:700; font-size:14px; }

/* ---- gear rework: tools, groups, tables, tents ---- */
.gear-tools { margin:var(--s4) 0; align-items:center; }
.gt-me { font-size:13px; color:var(--ink-dim); display:flex; align-items:center; gap:6px; }
.gt-who, .gt-search { background:var(--bg-3); border:1px solid var(--line); color:var(--ink); border-radius:10px; padding:8px 10px; font-size:13px; font-family:inherit; }
.gt-who.nudge { border-color:var(--gold); box-shadow:0 0 0 3px rgba(216,168,75,.3); }
.gt-search { flex:1; min-width:160px; }
.grp { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); margin-bottom:var(--s3); }
.grp.signup { border-left:3px solid var(--gold); }
.grp-h { color:var(--gold); font-size:13px; font-weight:700; letter-spacing:.02em; margin-bottom:var(--s3); }
.grp-n { color:var(--ink-mute); font-weight:400; font-size:12px; }
.grp-note { color:var(--ink-mute); font-size:12px; margin:var(--s2) 0 0; }
.grp-tbl { display:flex; flex-direction:column; }
.trow { display:grid; grid-template-columns:1fr auto auto auto; gap:var(--s2) var(--s3); align-items:center; padding:var(--s3) 0; border-top:1px solid var(--line); }
.signup-row { grid-template-columns:1fr auto auto; }
.t-item { font-weight:600; font-size:14px; }
.t-q { color:var(--ink-mute); font-weight:400; }
.t-ess { font-size:9px; text-transform:uppercase; letter-spacing:.08em; color:var(--gold); border:1px solid rgba(216,168,75,.4); border-radius:999px; padding:1px 5px; }
.t-who { color:var(--ink-dim); font-size:12px; }
.t-open { color:var(--ink-mute); font-style:italic; }
.t-status { font-size:10px; text-transform:uppercase; letter-spacing:.05em; font-weight:700; }
.t-status.s-provided { color:#8fe0a0; } .t-status.s-in-progress { color:var(--gold); }
.t-status.s-willing { color:#9fc0e6; } .t-status.s-maybe { color:var(--ink-mute); }
.t-claim { background:transparent; border:1px solid var(--line); color:var(--ink-dim); border-radius:999px; padding:5px 11px; font-size:11px; cursor:pointer; white-space:nowrap; }
.t-claim:hover { border-color:var(--gold); color:var(--gold); }
.t-claim.mine { background:rgba(216,168,75,.18); border-color:var(--gold); color:var(--gold-soft); font-weight:700; }
.tent-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--s2); margin-top:var(--s2); }
.tent { background:#0e0e0f; border:1px solid var(--line); border-radius:10px; padding:var(--s3); }
.tent.over { border-color:#e58a8a; }
.tent-n { font-weight:700; font-size:13px; }
.tent-cap { color:var(--gold); font-size:11px; }
.tent-occ { color:var(--ink-dim); font-size:12px; margin-top:3px; }
.tent-occ i { color:var(--ink-mute); }
.pp-row2 { display:flex; justify-content:space-between; padding:4px 0; border-top:1px solid var(--line); }
.pp-count { color:var(--gold); font-weight:700; }
@media (min-width:620px){ .tent-grid { grid-template-columns:repeat(4,1fr); } }

/* ---- roster rows: every row is a list you can join (gear + sign-ups) ---- */
.srow { padding:var(--s3) 0; border-top:1px solid var(--line); }
.srow:first-child { border-top:0; }
.srow-top { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); }
.s-label { font-weight:600; font-size:14px; flex:1; min-width:0; }
.s-join { background:var(--gold); border:1px solid var(--gold); color:#171206; border-radius:999px; padding:7px 15px; font-size:13px; font-weight:700; cursor:pointer; white-space:nowrap; flex:0 0 auto; }
.s-join:hover { filter:brightness(1.08); }
.s-join.on { background:transparent; color:var(--gold); }
.s-join.on:hover { border-color:#e58a8a; color:#e58a8a; }
.s-roster { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:8px; }
.s-none { color:var(--ink-mute); font-style:italic; font-size:13px; }
.s-count { color:var(--ink-mute); font-size:11px; margin-left:auto; }
.chip { display:inline-flex; align-items:center; gap:5px; background:#0e0e0f; border:1px solid var(--line); color:var(--ink); border-radius:999px; padding:4px 11px; font-size:13px; }
.chip.lead { border-color:rgba(216,168,75,.4); }
.chip.mine { background:rgba(216,168,75,.18); border-color:var(--gold); color:var(--gold-soft); font-weight:700; cursor:pointer; }
.chip.mine:hover { border-color:#e58a8a; color:#e58a8a; }
.chip .x { font-size:11px; opacity:.7; }
.chip-ic { font-size:14px; }

/* ---- add your own gear / ask to borrow ---- */
.gt-add { background:transparent; border:1px solid var(--gold); color:var(--gold); border-radius:10px; padding:8px 12px; font-size:13px; font-weight:700; cursor:pointer; white-space:nowrap; }
.gt-add:hover { background:rgba(216,168,75,.12); }
.gear-add { background:var(--bg-3); border:1px solid var(--gold); border-radius:14px; padding:var(--s4); margin-bottom:var(--s4); }
.ga-item { width:100%; box-sizing:border-box; background:#0e0e0f; border:1px solid var(--line); color:var(--ink); border-radius:10px; padding:10px 12px; font-size:15px; font-family:inherit; }
.ga-item.nudge { border-color:var(--gold); box-shadow:0 0 0 3px rgba(216,168,75,.3); }
.ga-row { display:flex; flex-wrap:wrap; gap:var(--s3); align-items:center; margin-top:var(--s3); }
.ga-cat { background:#0e0e0f; border:1px solid var(--line); color:var(--ink); border-radius:10px; padding:8px 10px; font-size:13px; font-family:inherit; }
.ga-kind { display:flex; flex-wrap:wrap; gap:var(--s2); flex:1; }
.ga-kind label { font-size:13px; color:var(--ink-dim); display:inline-flex; align-items:center; gap:5px; border:1px solid var(--line); border-radius:999px; padding:6px 11px; cursor:pointer; }
.ga-kind label.ga-on { border-color:var(--gold); color:var(--gold-soft); background:rgba(216,168,75,.12); }
.ga-go { margin-top:var(--s3); background:var(--gold); border:1px solid var(--gold); color:#171206; border-radius:999px; padding:9px 18px; font-size:14px; font-weight:700; cursor:pointer; }
.ga-go:hover { filter:brightness(1.08); }
.ga-hint { color:var(--ink-mute); font-size:12px; margin:var(--s3) 0 0; line-height:1.4; }
.t-added { font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-mute); border:1px solid var(--line); border-radius:999px; padding:1px 6px; }
.g-del { background:transparent; border:0; color:var(--ink-mute); font-size:11px; cursor:pointer; text-decoration:underline; padding:4px 6px; white-space:nowrap; }
.g-del:hover { color:#e58a8a; }
.need-grp { border-left:3px solid #9fc0e6; }
.need-by { color:var(--gold-soft); font-weight:700; }
.share-by { color:#9ad29a; font-weight:700; }

/* ---- pull-to-refresh + toast ---- */
.yc-ptr { position:fixed; top:0; left:50%; transform:translateX(-50%); z-index:60;
  width:38px; height:38px; margin-top:-46px; border-radius:999px; display:flex; align-items:center; justify-content:center;
  background:rgba(12,12,13,.95); border:1px solid var(--line); color:var(--gold); font-size:18px; font-weight:700;
  box-shadow:0 6px 20px rgba(0,0,0,.5); transition:transform .15s ease; pointer-events:none; }
.yc-ptr.armed { border-color:var(--gold); color:var(--gold); }
.yc-ptr.spin { animation:ptr-spin .7s linear infinite; }
@keyframes ptr-spin { to { transform:translateX(-50%) translateY(50px) rotate(360deg); } }
.yc-toast { position:fixed; left:50%; bottom:96px; transform:translateX(-50%) translateY(20px); z-index:70;
  background:var(--gold); color:#171206; font-weight:700; font-size:13px; padding:9px 16px; border-radius:999px;
  box-shadow:0 8px 28px rgba(0,0,0,.5); opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease; max-width:86vw; text-align:center; }
.yc-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ---- back-to-top (round, gold, above the tab bar) — adapted from wateroflife.supply ---- */
.back-to-top { position:fixed; right:16px; bottom:calc(72px + var(--safe-b)); width:46px; height:46px;
  background:var(--gold); color:#171206; border:none; border-radius:50%; font-size:20px; font-weight:900; cursor:pointer;
  opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s, transform .3s; z-index:55;
  display:flex; align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(0,0,0,.55); }
.back-to-top.visible { opacity:.95; visibility:visible; }
.back-to-top:hover { transform:scale(1.1); filter:brightness(1.08); }
@media (min-width:760px){ .back-to-top { right:28px; bottom:96px; } }

/* ---- cost-share: anyone can chip in to split a cost ---- */
.costshare { background:#0e0e0f; border:1px solid rgba(122,180,130,.35); border-radius:12px; padding:var(--s3) var(--s4); margin-top:var(--s3); }
.cs-top { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); }
.cs-label { font-size:13px; font-weight:700; color:#9ad29a; }
.cs-btn { background:#9ad29a; border:1px solid #9ad29a; color:#0c1a0c; border-radius:999px; padding:6px 14px; font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap; }
.cs-btn.on { background:transparent; color:#9ad29a; }
.cs-roster { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.cs-math { margin-top:8px; font-size:12.5px; color:var(--ink-dim); }
.cs-math b { color:#9ad29a; }

/* ---- reservation card ---- */
.resv { background:var(--bg-3); border:1px solid var(--line); border-left:3px solid #9ad29a; border-radius:14px; padding:var(--s4); margin:var(--s4) 0; }
.resv-head { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); flex-wrap:wrap; }
.resv-tag { color:#9ad29a; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.resv-by { color:var(--gold-soft); font-size:12px; font-style:italic; }
.resv-name { font-size:17px; font-weight:700; margin-top:var(--s2); }
.resv-sites { color:var(--gold); font-size:13px; font-weight:600; }
.resv-keys { display:grid; grid-template-columns:1fr 1fr; gap:6px var(--s3); margin-top:var(--s3); }
.resv-kv { display:flex; flex-direction:column; }
.resv-kv .rk { color:var(--ink-mute); font-size:10px; text-transform:uppercase; letter-spacing:.06em; }
.resv-kv .rv { color:var(--ink); font-size:13.5px; font-weight:600; }
.resv-toggle { margin-top:var(--s3); background:transparent; border:1px solid var(--line); color:var(--gold); border-radius:999px; padding:6px 13px; font-size:12px; font-weight:700; cursor:pointer; }
.resv-toggle:hover { border-color:var(--gold); }
.resv-details { margin-top:var(--s3); border-top:1px solid var(--line); padding-top:var(--s3); display:grid; grid-template-columns:1fr 1fr; gap:6px var(--s3); }
.resv-details .resv-kv { grid-column:auto; }
.resv-note { grid-column:1/-1; color:var(--ink-dim); font-size:12.5px; }
.resv-costs { grid-column:1/-1; width:100%; border-collapse:collapse; margin-top:6px; font-size:13px; }
.resv-costs td { padding:4px 0; border-bottom:1px solid var(--line); color:var(--ink-dim); }
.resv-costs tr:last-child td { color:var(--ink); font-weight:700; border-bottom:0; }
.resv-costs td:last-child { text-align:right; }
.resv-backup { color:var(--ink-mute); font-size:12.5px; margin:var(--s3) 0 0; }

/* ---- legend lifespan + epitaph ---- */
.legend-years { color:var(--ink-mute); font-size:12px; font-weight:400; }
.legend-died { color:var(--gold-soft); font-size:12px; font-style:italic; margin:2px 0 0; }

/* ---- roadwork badge in the live closures box ---- */
.pn-row b.work { color:#e7c587; }

/* ============================================================
   WAVE 3 — sign-ups · park-now · cell · first aid · advice
   ============================================================ */

/* ---- per-section sign-up bar ---- */
.su-bar { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); margin-top:var(--s3); padding-top:var(--s3); border-top:1px dashed var(--line); }
.su-who { font-size:12px; color:var(--ink-dim); }
.su-none { color:var(--ink-mute); font-style:italic; }
.su-btn { background:transparent; border:1px solid var(--gold); color:var(--gold); border-radius:999px; padding:5px 13px; font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap; }
.su-btn.on { background:var(--gold); color:#171206; }
.rt-why { color:var(--ink-dim); font-size:13px; margin:var(--s2) 0; }

/* ---- gear advice ---- */
.advice-grp .grp-h { color:var(--gold-soft); }
.advice-list { margin:0; padding-left:18px; }
.advice-list li { color:var(--ink-dim); font-size:13.5px; margin:6px 0; }

/* ---- park right now ---- */
.pn-wrap { margin-top:var(--s5); }
.pn-entry { background:rgba(74,107,84,.14); border:1px solid rgba(122,180,130,.4); color:#cfe9cf; border-radius:12px; padding:var(--s3) var(--s4); font-size:13.5px; margin-bottom:var(--s4); }
.pn-entry a, .pn-links a, .pn-list a { color:var(--accent); font-weight:700; }
.pn-closures { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); margin-bottom:var(--s4); }
.pn-h { color:var(--gold); font-size:13px; font-weight:700; margin-bottom:var(--s3); }
.pn-clbox { display:flex; flex-direction:column; gap:6px; }
.pn-row { display:grid; grid-template-columns:80px auto 1fr; gap:var(--s3); align-items:baseline; font-size:13px; border-top:1px solid var(--line); padding-top:6px; }
.pn-row:first-child { border-top:0; }
.pn-row b.ok { color:#8fe0a0; } .pn-row b.bad { color:#f0a097; }
.pn-row.alert { grid-template-columns:1fr; color:#f0c0b8; }
.pn-note { color:var(--ink-mute); font-size:12px; }
.pn-stamp, .pn-muted { color:var(--ink-mute); font-size:11px; }
.pn-refresh { margin-top:var(--s3); width:100%; background:var(--accent); color:#04121a; border:0; border-radius:10px; padding:11px; font-weight:700; font-size:14px; cursor:pointer; }
.pn-refresh:disabled { opacity:.6; }
.pn-warn { border-left:3px solid var(--gold); } .pn-pos { border-left:3px solid var(--pine); }
.pn-list { margin:0; padding-left:18px; } .pn-list li { color:var(--ink-dim); font-size:13.5px; margin:6px 0; }
.pn-sms { margin:var(--s3) 0; color:var(--gold-soft); font-size:13px; font-weight:600; }
.pn-links { display:flex; flex-wrap:wrap; gap:var(--s3); margin-top:var(--s3); }
.pn-links a { font-size:13px; }

/* ---- cell coverage ---- */
.cell-wrap { margin-top:var(--s5); }
.cell-note { background:rgba(216,168,75,.10); border:1px solid rgba(216,168,75,.35); color:var(--gold-soft); border-radius:12px; padding:var(--s3) var(--s4); font-size:13px; margin-bottom:var(--s4); }
.cell-grid { display:grid; grid-template-columns:1fr; gap:var(--s3); }
.cell-card { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); }
.cc-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:var(--s3); }
.cc-name { font-weight:700; font-size:16px; }
.cc-rank { font-size:11px; color:var(--gold); text-transform:uppercase; letter-spacing:.08em; }
.cc-line { display:grid; grid-template-columns:88px 1fr; gap:var(--s3); font-size:12.5px; color:var(--ink-dim); padding:4px 0; border-top:1px solid var(--line); }
.cc-line span { color:var(--gold); font-size:11px; text-transform:uppercase; letter-spacing:.06em; padding-top:2px; }
.cc-take { color:var(--ink); font-size:13px; margin-top:var(--s3); font-weight:600; }
.cell-wifi { color:var(--ink-dim); font-size:13px; margin-top:var(--s4); background:#0e0e0f; border:1px solid var(--line); border-radius:12px; padding:var(--s3) var(--s4); }
@media (min-width:620px){ .cell-grid { grid-template-columns:repeat(3,1fr); } }

/* ---- first aid ---- */
.fa-wrap { margin-top:var(--s5); }
.fa-intro { color:var(--ink-dim); font-size:13.5px; margin-bottom:var(--s4); }
.fa-emerg { display:grid; grid-template-columns:1fr 1fr; gap:var(--s3); margin-bottom:var(--s4); }
.fa-big { display:flex; flex-direction:column; gap:2px; background:linear-gradient(180deg, rgba(200,90,80,.18), var(--bg-3)); border:1px solid rgba(220,120,110,.5); border-radius:14px; padding:var(--s4); text-align:center; }
.fb-l { color:var(--ink-dim); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
.fb-v { color:#f4b8b0; font-size:22px; font-weight:800; letter-spacing:.5px; }
.fa-card { background:var(--bg-3); border:1px solid var(--line); border-radius:14px; padding:var(--s4); margin-bottom:var(--s3); }
.fa-h { color:var(--gold); font-weight:700; font-size:14px; margin-bottom:var(--s2); }
.fa-row { color:var(--ink-dim); font-size:13px; margin:3px 0; }
.fa-row.sub { font-size:12px; } .fa-row.note { color:var(--ink-mute); font-size:12px; }
.fa-tel { display:inline-block; margin:var(--s2) 0; color:var(--gold); font-weight:700; font-size:16px; }
.fa-tel.sm { font-size:13px; margin:0; white-space:nowrap; }
.fa-noservice { background:#0e0e0f; border:1px solid var(--line); color:var(--ink-dim); border-radius:12px; padding:var(--s3) var(--s4); font-size:13px; margin-bottom:var(--s3); }
.fa-hosp { display:flex; justify-content:space-between; align-items:flex-start; gap:var(--s3); padding:var(--s3) 0; border-top:1px solid var(--line); }
.fa-hosp:first-of-type { border-top:0; }

/* ---- legend portrait photos (real) ---- */
.legend-media .photo-img { aspect-ratio:3/4; object-fit:cover; width:100%; }
.legends-credit { color:var(--ink-mute); font-size:11px; font-style:italic; margin-top:var(--s3); }

/* ============================================================
   HERO v2 — John Muir + Tunnel View background
   ============================================================ */
.hero { background:#0a0a0b; justify-content:center; }
.hero-photo { position:absolute; inset:0; z-index:0;
  background-image:
    linear-gradient(180deg, rgba(10,10,11,0.50) 0%, rgba(10,10,11,0.30) 38%, rgba(10,10,11,0.55) 70%, rgba(10,10,11,0.92) 100%),
    url("assets/hero-yosemite.jpg");
  background-size:cover; background-position:center 30%; }
.hero::after { opacity:0.05; } /* dial back the grain over the photo */
.hero-inner { position:relative; z-index:2; }
.muir { margin:0 0 var(--s7); padding:0; display:flex; flex-direction:column; align-items:flex-start; gap:var(--s3); }
.muir-face { width:72px; height:72px; border-radius:50%; object-fit:cover; object-position:center 20%;
  border:2px solid var(--gold); box-shadow:0 6px 24px rgba(0,0,0,.5); background:#1a1410; }
.muir-q { margin:0; font-weight:700; font-size:clamp(24px, 6vw, 40px); line-height:1.08; letter-spacing:-0.02em;
  color:#fff; text-shadow:0 2px 24px rgba(0,0,0,.7); }
.muir-by { color:var(--gold); font-size:13px; letter-spacing:0.2em; text-transform:uppercase; font-weight:700; }
.muir-by::before { content:"— "; }
.hero .gcar { text-shadow:0 4px 30px rgba(0,0,0,.6); }
.hero .school, .hero .trip { text-shadow:0 1px 12px rgba(0,0,0,.7); }
.hero-credit { position:absolute; bottom:6px; right:10px; z-index:2; color:rgba(255,255,255,.4); font-size:9px; letter-spacing:.03em; }
@media (min-width:760px){ .muir-q { font-size:clamp(32px, 4vw, 46px); } .muir-face { width:84px; height:84px; } }