/* Zishin Crestone Guide, Trail Card design (research/redesign-opus.md). */
:root{
  --sand:#F5E9D6;--paper:#FFFAF2;--ink:#241F1B;--dust:#6B5F53;--line:#E6D5BC;
  --chile:#C4461E;--chile-d:#9E3612;--chile-t:#F8DDD0;--sun:#F2A93B;
  --jun:#3E5B3F;--jun-t:#DCE6D5;--sage:#9DB08C;--night:#18213D;--night2:#232E52;--star:#DCE2F0;
  --sky:#BFD5E6;--dune:#E8C9A0;
  --ochre:#7A5200;--ochrebg:#FFE9B8;--ochreln:#C9921E;
  --serif:ui-serif,"New York","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:system-ui,-apple-system,"SF Pro Text","Segoe UI",Roboto,sans-serif;
  --round:ui-rounded,"SF Pro Rounded",system-ui,-apple-system,sans-serif;
  --shadow:0 1px 0 rgba(36,31,27,.05),0 10px 24px -12px rgba(36,31,27,.4);
}
*{box-sizing:border-box}
html{background:#D9CBB4}
body{margin:0;font:16px/1.5 var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
a{color:inherit}
img{display:block}
h1,h2,h3{font-family:var(--serif);font-weight:700;margin:0;letter-spacing:-.01em}
p{margin:0}
.phone{position:relative;width:390px;max-width:100%;min-height:844px;margin:0 auto;background:var(--sand);padding-bottom:120px;overflow:hidden}
.phone.dark{background:var(--night);color:var(--star)}
.pad{padding:0 16px}
.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.kicker{font:700 12px/16px var(--sans);letter-spacing:.14em;text-transform:uppercase}
.muted{color:var(--dust)}
.small{font-size:14px;line-height:20px}


/* Floating tab bar: SwiftUI TabView */
.tabbar{position:fixed;z-index:50;bottom:0;left:50%;transform:translateX(-50%);width:390px;max-width:100%;padding:10px 12px 24px;background:linear-gradient(rgba(245,233,214,0),rgba(245,233,214,.95) 45%)}
.tabbar nav{display:flex;height:64px;border-radius:32px;background:rgba(255,250,242,.96);box-shadow:0 8px 28px rgba(36,31,27,.2),inset 0 0 0 1px rgba(36,31,27,.07);padding:4px}
.tabbar a{flex:1;min-width:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:28px;color:var(--ink);text-decoration:none;font:600 10.5px/1.1 var(--sans);white-space:nowrap}
.tabbar a .i{width:24px;height:24px;stroke-width:1.8}
.tabbar a.on{background:var(--chile-t);color:var(--chile-d)}
.tabbar.dark{background:linear-gradient(rgba(24,33,61,0),rgba(24,33,61,.95) 45%)}
.tabbar.dark nav{background:rgba(35,46,82,.96);box-shadow:0 8px 28px rgba(0,0,0,.4),inset 0 0 0 1px rgba(255,255,255,.08)}
.tabbar.dark a{color:var(--star)}
.tabbar.dark a.on{background:rgba(242,169,59,.18);color:var(--sun)}

/* Section banner with ridge: custom SectionBanner view */
.banner{position:relative;height:184px;padding:62px 20px 0;color:var(--paper);overflow:hidden}
.banner.eat{background:var(--chile)}
.banner.explore{background:var(--jun)}
.banner.hist{background:var(--night)}
.banner h1{font-size:38px;line-height:42px;margin-top:2px}
.banner p{font-size:15px;line-height:20px;margin-top:6px;opacity:.92;max-width:290px}
.banner .kicker{opacity:.85}
.banner .ridge{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:36px}
.banner .art{position:absolute;right:16px;top:58px;width:72px;height:72px;opacity:.95}
.stars{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1.5px 1.5px at 18% 30%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 42% 18%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 66% 40%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 84% 22%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 30% 60%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 90% 64%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 56% 70%,#fff 50%,transparent 51%)}

/* Cards and media: fixed aspect ratios everywhere, so nothing shifts while images load */
.card{display:block;position:relative;background:var(--paper);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:inherit}
.media{position:relative;width:100%;overflow:hidden;background:var(--dune)}
.media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.r169{aspect-ratio:16/9}.r32{aspect-ratio:3/2}.r11{aspect-ratio:1/1}.r89{aspect-ratio:8/9}.r21{aspect-ratio:2/1}.r43{aspect-ratio:4/3}
.credit{font:12px/16px var(--sans);color:var(--dust)}
.credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.dark .credit{color:#AEB6CC}

/* Numbered stop medallion */
.med{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--chile);color:#fff;font:800 17px/1 var(--round);box-shadow:0 0 0 3px var(--paper),0 3px 8px rgba(0,0,0,.25);flex:none}
.med.lg{width:60px;height:60px;font-size:28px;box-shadow:0 0 0 5px var(--sand),0 6px 14px rgba(0,0,0,.25)}
.med.sm{width:28px;height:28px;font-size:14px;box-shadow:0 0 0 2px var(--paper)}

/* EXAMPLE badge: never removed, never restyled */
.ex{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;background:var(--ochrebg);color:var(--ochre);border:1.5px solid var(--ochreln);font:800 11px/14px var(--sans);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.exph{background:var(--dune);display:grid;place-items:center;color:var(--ochre)}
/* Conglomerate placeholder: cobbles on dune (night: #33406B), dusk tint for Spiritual Centers, night for Valley lore */
.cong{position:relative;background:var(--dune)}.cong canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.cong .cl{position:absolute;left:10px;bottom:8px;z-index:1;font:800 10px/1 var(--sans);letter-spacing:.14em;color:var(--ink);background:var(--paper);padding:5px 8px;border-radius:999px;white-space:nowrap}
.cong.lore{background:#33406B}.cong.lore .cl{left:50%;bottom:10px;transform:translateX(-50%);background:none;padding:0;color:var(--sun);font:italic 14px/1 var(--serif);letter-spacing:0}
.cong>.i{position:relative;z-index:1}
.exph span{font:800 11px/1 var(--sans);letter-spacing:.14em;margin-top:6px}

/* Buttons: every tap target at least 44pt */
.btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 18px;border-radius:14px;font:700 16px/1 var(--sans);text-decoration:none;border:0;cursor:pointer}
.btn.primary{background:var(--chile);color:#fff}
.btn.jun{background:var(--jun);color:#fff}
.btn.ghost{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.back{position:absolute;top:52px;left:16px;width:44px;height:44px;border-radius:50%;background:rgba(255,250,242,.94);display:grid;place-items:center;z-index:20;box-shadow:0 2px 10px rgba(0,0,0,.22);color:var(--ink)}
.back .i{width:22px;height:22px;stroke-width:2.4}
.pill{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 12px;border-radius:999px;background:rgba(255,250,242,.94);font:700 13px/1 var(--sans);color:var(--ink)}

/* Section heads */
.sh{display:flex;align-items:flex-end;justify-content:space-between;margin:28px 16px 12px}
.sh h2{font-size:24px;line-height:28px}
.sh a{font:600 15px/1 var(--sans);color:var(--chile-d);text-decoration:none;min-height:44px;display:flex;align-items:center}

/* Sources: 48pt rows */
.sources{list-style:none;padding:0;margin:4px 0 0}
.sources a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px;color:var(--jun);font-weight:600;font-size:15px;line-height:20px;text-decoration:underline;text-underline-offset:3px;border-bottom:1px solid var(--line);word-break:break-word}
.dark .sources a{color:var(--sun);border-color:rgba(255,255,255,.12)}

/* Get the app (placeholder, nothing to buy) */
.soon{font:700 11px/1 var(--sans);background:var(--dust);color:#fff;border-radius:999px;padding:5px 9px}
.foot{margin:16px 20px 0;font-size:13px;line-height:18px;color:var(--dust)}

/* ---------- Home ---------- */
.hero{position:relative;width:100%;overflow:hidden;background:#2457A8}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(24,33,61,.35) 0%,rgba(24,33,61,0) 22%,rgba(24,33,61,0) 44%,rgba(24,33,61,.8) 100%)}
.hero .sunm{position:absolute;right:26px;top:70px;width:76px;height:76px}
.hero .title{position:absolute;left:20px;right:20px;bottom:64px;color:#fff}
.hero .title .kicker{color:#FFD9A0}
.hero h1{font-size:66px;line-height:60px;margin-top:6px;letter-spacing:-.02em;text-shadow:0 2px 20px rgba(0,0,0,.25)}
.hero h1 small{display:block;font-size:23px;line-height:28px;letter-spacing:0;margin-top:8px;font-weight:600}
.hero .tag{margin-top:8px;font-size:16px;line-height:22px;opacity:.95}
.ridgecut{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:30px}
.facts{display:flex;gap:8px;padding:2px 16px 0;overflow:hidden}
.fact{flex:1;min-width:0;background:var(--paper);border-radius:14px;padding:10px 10px 9px;box-shadow:var(--shadow);text-align:center}
.fact b{display:block;font:800 20px/24px var(--round);color:var(--chile-d)}
.fact span{display:block;font-size:12px;line-height:16px;color:var(--dust);white-space:nowrap}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 16px}
.tile{display:block;background:var(--paper);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:var(--ink)}
.tile .lab{display:flex;align-items:center;gap:8px;height:52px;padding:0 12px;font:700 17px/1 var(--sans);white-space:nowrap}
.tile .lab .i{width:22px;height:22px}
.tile .lab .go{margin-left:auto;width:16px;height:16px;color:var(--dust)}
.tile.t-eat .lab .i:first-child{color:var(--chile)}
.tile.t-exp .lab .i:first-child{color:var(--jun)}
.tile.t-his .lab .i:first-child{color:var(--night)}
.tile.t-map .lab .i:first-child{color:#2F6E9B}
.fly{display:block;position:relative;margin:12px 16px 0;aspect-ratio:358/140;border-radius:20px;overflow:hidden;background:var(--night);color:#fff;text-decoration:none;box-shadow:var(--shadow)}
.fly svg.bg{position:absolute;inset:0;width:100%;height:100%}
.fly .txt{position:absolute;left:18px;top:18px;right:140px}
.fly h2,.fly h3{font-size:22px;line-height:26px}
.fly p{font-size:14px;line-height:19px;color:#C9D1E6;margin-top:4px}
.fly .cta{position:absolute;left:18px;bottom:16px;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;background:var(--sun);color:var(--night);font:800 14px/1 var(--sans)}
.story{display:grid;grid-template-columns:112px 1fr;gap:14px;margin:0 16px;padding:12px;background:var(--paper);border-radius:20px;box-shadow:var(--shadow);text-decoration:none;color:inherit}
.story .media{border-radius:12px}
.story .yr{font:800 28px/28px var(--serif);color:var(--chile-d)}
.story h3{font-size:19px;line-height:23px;margin-top:4px}
.story p{font-size:14px;line-height:19px;color:var(--dust);margin-top:4px}
.story{min-height:136px}
.story h3{text-wrap:balance;hyphens:manual}
.story p{text-wrap:pretty;hyphens:manual}
.story .yr.nd{font:700 13px/28px var(--sans);letter-spacing:.12em;text-transform:uppercase}
.story .cong.lore{border-radius:12px}

/* ---------- Eat & Shop ---------- */
.chips{display:flex;gap:8px;padding:14px 16px 4px;overflow-x:auto;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:999px;background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line);font:700 15px/1 var(--sans);color:var(--ink);text-decoration:none;white-space:nowrap}
.chip em{font-style:normal;font-weight:600;color:var(--dust);font-size:13px}
.chip.on{background:var(--ink);color:var(--paper);box-shadow:none}
.chip.on em{color:#CFC4B6}
.grp{display:flex;align-items:center;gap:10px;margin:22px 16px 10px}
.grp h2{font-size:21px;line-height:26px}
.grp .ln{flex:1;height:1.5px;background:var(--line)}
.grp .ct{font:700 13px/1 var(--round);color:var(--dust)}
.rows{display:grid;gap:12px;padding:0 16px}
.row{display:grid;grid-template-columns:104px 1fr 20px;gap:12px;align-items:start;padding:10px;background:var(--paper);border-radius:18px;box-shadow:var(--shadow);text-decoration:none;color:inherit;min-height:124px}
.row .media{border-radius:12px;width:104px}
.row h2,.row h3{font-size:18px;line-height:22px}
.row .meta{font-size:14px;line-height:19px;color:var(--dust);margin-top:3px}
.row .credit{margin-top:6px;font-size:11.5px;line-height:15px}
.row .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.row > .i{align-self:center;color:var(--dust);width:18px;height:18px}
.tagp{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:6px;background:var(--sand);font:700 11px/1 var(--sans);color:var(--dust);letter-spacing:.02em}
.row.example{background:#FFF7E4;box-shadow:inset 0 0 0 2px var(--ochreln),var(--shadow);border:0}
.row.example .exnote{font-size:13px;line-height:18px;color:var(--ochre);margin-top:6px;font-weight:600}

/* ---------- Detail (biz + stop) ---------- */
.dhero{position:relative}
.dhero .topbar{position:absolute;top:52px;right:16px;z-index:20;display:flex;gap:8px}
.capbar{padding:8px 16px 0}
.capbar .credit{font-size:12px}
.areatag{position:absolute;left:16px;bottom:12px;display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:8px;background:rgba(24,33,61,.78);color:#fff;font:700 12px/1 var(--sans)}
.dt{padding:18px 16px 0}
.dt .kicker{color:var(--chile-d)}
.dt h1{font-size:34px;line-height:38px;margin-top:4px}
.dt .addr{display:flex;align-items:center;gap:6px;margin-top:8px;color:var(--dust);font-size:15px}
.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:18px 16px 0}
.act{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:76px;border-radius:16px;background:var(--paper);box-shadow:var(--shadow);text-decoration:none;color:var(--ink);font:700 14px/1 var(--sans)}
.act .i{width:24px;height:24px;color:var(--chile)}
.act.primary{background:var(--chile);color:#fff}
.act.primary .i{color:#fff}
.info{margin:18px 16px 0;background:var(--paper);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}
.info .li{display:grid;grid-template-columns:24px 1fr;gap:12px;padding:13px 16px;min-height:56px;border-bottom:1px solid var(--line)}
.info .li:last-child{border-bottom:0}
.info .li .i{color:var(--dust);margin-top:2px}
.info .k{font:700 12px/16px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dust)}
.info .v{font-size:16px;line-height:22px}
.info .v a{color:var(--jun);font-weight:600}
.notice{display:flex;gap:12px;margin:14px 16px 0;padding:14px 16px;border-radius:16px;background:var(--jun-t);color:#2C432D;font-size:14px;line-height:20px}
.notice .i{color:var(--jun)}
.hscroll{display:flex;gap:12px;overflow-x:auto;padding:0 16px 4px;scrollbar-width:none}
.hscroll::-webkit-scrollbar{display:none}
.mini{flex:none;width:220px}
.mini .b{padding:10px 12px 12px}
.mini h3{font-size:17px;line-height:21px}
.mini p{font-size:13px;line-height:18px;color:var(--dust);margin-top:2px}
.mini .credit{font-size:11.5px;line-height:15px}

/* Stop detail */
.medrow{position:relative;display:flex;align-items:flex-start;gap:14px;padding:0 16px}
.medrow .med.lg{margin-top:-30px;position:relative;z-index:5}
.medrow .credit{padding-top:8px}
.gps{display:flex;align-items:center;gap:10px;margin:16px 16px 0;padding:12px 12px 12px 16px;background:var(--paper);border-radius:16px;box-shadow:var(--shadow)}
.gps .coord{font:700 16px/20px var(--round);letter-spacing:.01em}
.gps .k{font:700 11px/14px var(--sans);letter-spacing:.12em;color:var(--dust)}
.gps .btn{min-height:48px;padding:0 14px;font-size:15px}
.lede{padding:16px 16px 0;font-size:18px;line-height:27px}
.mapcard{margin:0 16px;border-radius:20px;overflow:hidden;box-shadow:var(--shadow);position:relative;background:#EDE0C7}
.mapcard svg{display:block;width:100%;height:100%}
.mapcard .attr{position:absolute;right:8px;bottom:6px;font:11px/14px var(--sans);color:var(--dust);background:rgba(255,250,242,.85);padding:2px 6px;border-radius:6px}
.pager{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 16px}
.pg{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:center;min-height:72px;padding:12px;border-radius:16px;background:var(--paper);box-shadow:var(--shadow);text-decoration:none;color:inherit}
.pg .k{font:700 11px/14px var(--sans);letter-spacing:.1em;color:var(--dust);text-transform:uppercase}
.pg b{font:700 15px/19px var(--serif);display:block}
.pg.next{background:var(--jun);color:#fff}
.pg.next .k{color:#CFE0C8}
.pg.next .med{box-shadow:0 0 0 2px #fff}

/* ---------- Explore trail ---------- */
.seg{display:flex;margin:14px 16px 0;padding:3px;border-radius:14px;background:#EADBC4}
.seg a{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;border-radius:11px;font:700 15px/1 var(--sans);text-decoration:none;color:var(--dust)}
.seg a.on{background:var(--paper);color:var(--ink);box-shadow:0 1px 4px rgba(36,31,27,.15)}
.trail{position:relative;padding:18px 16px 0 16px}
.trail::before{content:"";position:absolute;left:33px;top:30px;bottom:40px;border-left:3px dotted #C8B391}
.stop{position:relative;display:grid;grid-template-columns:36px 1fr;gap:12px;margin-bottom:18px;text-decoration:none;color:inherit}
.stop .med{margin-top:10px;position:relative;z-index:2}
.stop .card .b{padding:12px 14px 14px}
.stop h2,.stop h3{font-size:20px;line-height:24px}
.stop .blurb{font-size:14px;line-height:20px;color:#4A4038;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stop .gpsl{display:flex;align-items:center;gap:6px;margin-top:8px;font:700 12px/16px var(--round);color:var(--jun)}
.stop .gpsl .i{width:14px;height:14px}
.stop .credit{margin-top:6px;font-size:11.5px;line-height:15px}

/* ---------- History (night) ---------- */
.years{position:sticky;top:0;z-index:15;display:flex;gap:6px;padding:12px 16px;overflow-x:auto;background:rgba(24,33,61,.96);scrollbar-width:none}
.years::-webkit-scrollbar{display:none}
.years a{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;font:800 14px/1 var(--round);color:var(--star);text-decoration:none;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.14)}
.years a.on{background:var(--sun);color:var(--night);box-shadow:none}
.tl{position:relative;padding:8px 16px 0 16px}
.tl::before{content:"";position:absolute;left:27px;top:20px;bottom:30px;width:2px;background:linear-gradient(var(--sun),rgba(242,169,59,.15))}
.ev{position:relative;padding-left:34px;margin-bottom:22px}
.ev .dot{position:absolute;left:4px;top:12px;width:16px;height:16px;border-radius:50%;background:var(--night);box-shadow:inset 0 0 0 3px var(--sun)}
.ev .yr{font:800 34px/40px var(--serif);color:var(--sun);letter-spacing:-.01em}
.ev .yr.nd{font-size:18px;line-height:40px;color:#AEB6CC;font-family:var(--sans);letter-spacing:.12em;text-transform:uppercase}
.ev .card{background:var(--night2);color:var(--star);box-shadow:0 10px 24px -12px rgba(0,0,0,.6);margin-top:6px}
.ev .b{padding:12px 14px 14px}
.ev h2,.ev h3{font-size:21px;line-height:26px;color:#fff}
.ev p{font-size:15px;line-height:22px;margin-top:6px;color:#D3D9E8}
.ev .credit{margin-top:8px;font-size:12px;line-height:16px;color:#AEB6CC}
.ev .more{display:inline-flex;align-items:center;gap:4px;min-height:44px;margin-top:2px;font:700 14px/1 var(--sans);color:var(--sun);text-decoration:none}
.lore{position:relative;background:radial-gradient(120% 90% at 70% 0%,#33406B,#1B2444);display:grid;place-items:center}
.lore svg{width:100%;height:100%;position:absolute;inset:0}
.ev.feature .card{box-shadow:inset 0 0 0 1.5px rgba(242,169,59,.5),0 12px 28px -12px rgba(0,0,0,.7)}
.ev .quote{margin-top:10px;padding:10px 12px;border-left:3px solid var(--sun);background:rgba(242,169,59,.08);font:italic 17px/24px var(--serif);color:#F4E6CF;border-radius:0 10px 10px 0}

/* ---------- Map ---------- */
.mapfull{position:absolute;left:0;right:0;top:0;height:844px;background:#EDE0C7}
.mapfull>svg{display:block;width:390px;height:844px}
.maptop{position:absolute;top:52px;left:16px;right:16px;z-index:20;display:flex;gap:8px;align-items:center}
.maptop .ttl{flex:1;display:flex;align-items:center;gap:10px;height:52px;padding:0 8px 0 16px;border-radius:26px;background:rgba(255,250,242,.96);box-shadow:0 6px 18px rgba(36,31,27,.18)}
.maptop .ttl h1{font-size:22px;line-height:26px}
.maptop .ttl .muted{font-size:13px;margin-left:auto}
.rbtn{width:52px;height:52px;border-radius:26px;display:grid;place-items:center;background:rgba(255,250,242,.96);box-shadow:0 6px 18px rgba(36,31,27,.18);color:var(--ink);text-decoration:none}
.rbtn .i{width:24px;height:24px}
.rbtn.dark{background:var(--night);color:var(--sun)}
.sheet{position:absolute;left:0;right:0;bottom:0;z-index:30;padding:8px 0 110px;background:var(--paper);border-radius:28px 28px 0 0;box-shadow:0 -10px 30px rgba(36,31,27,.22)}
.sheet .grab{width:40px;height:5px;border-radius:3px;background:#D8C8AE;margin:0 auto 10px}
.sel{display:grid;grid-template-columns:76px 1fr;gap:12px;padding:0 16px}
.sel .media{border-radius:14px}
.sel h2{font-size:21px;line-height:25px;display:flex;align-items:center;gap:8px}
.sel .coord{font:700 13px/18px var(--round);color:var(--jun);margin-top:2px}
.sel .credit{font-size:11px;line-height:14px;margin-top:3px}
.selbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 16px 0}
.strip{display:flex;gap:6px;overflow-x:auto;padding:12px 16px 0;scrollbar-width:none}
.strip::-webkit-scrollbar{display:none}
.strip{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent)}
.strip a{flex:none;height:40px;display:inline-flex;align-items:center;gap:6px;padding:0 14px 0 11px;border-radius:20px;background:var(--sand);font:600 15px/1 system-ui,sans-serif;color:var(--ink);text-decoration:none;white-space:nowrap}
.strip a svg{color:var(--c);flex:none}
.strip a.on{background:var(--c);color:#fff}
.strip a.on svg{color:#fff}
.ckick{display:flex;align-items:center;gap:5px;font:700 12px/1.2 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;margin-bottom:3px}
.med svg{display:block}
.mapattr{position:absolute;right:10px;z-index:25;font:11px/14px var(--sans);color:var(--dust);background:rgba(255,250,242,.9);padding:3px 7px;border-radius:6px}

/* ---------- Flyover ---------- */
.fly3d{position:relative;width:390px;max-width:100%;height:844px;margin:0 auto;overflow:hidden;background:#9DB9D8}
.fly3d > svg{position:absolute;inset:0;width:390px;height:844px}
.fly3d .top{position:absolute;top:52px;left:16px;right:16px;z-index:20;display:flex;align-items:center;gap:10px}
.fly3d .top h1{flex:1;font-size:22px;line-height:26px;color:#fff;text-shadow:0 1px 8px rgba(24,33,61,.6)}
.glass{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(24,33,61,.72);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5);text-decoration:none}
.glass .i{width:22px;height:22px}
.lbl{position:absolute;z-index:10;display:flex;align-items:center;gap:6px;height:44px;padding:0 12px 0 6px;border-radius:22px;background:rgba(24,33,61,.86);color:#fff;font:700 14px/1 var(--sans);white-space:nowrap;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.lbl .med{width:30px;height:30px;font-size:14px;box-shadow:0 0 0 2px #fff}
.lbl.sel{background:var(--paper);color:var(--ink);box-shadow:0 0 0 3px var(--sun),0 6px 16px rgba(0,0,0,.3)}
.lbl.num{padding:0 7px}
.fsheet{position:absolute;left:12px;right:12px;bottom:84px;z-index:20;padding:12px;border-radius:22px;background:var(--paper);box-shadow:0 10px 30px rgba(0,0,0,.3)}
.fsheet .row1{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center}
.fsheet .media{border-radius:12px}
.fsheet h2{font-size:20px;line-height:24px}
.fsheet p{font-size:14px;line-height:19px;color:var(--dust)}
.fsheet .credit{font-size:11px;line-height:14px;margin-top:2px}
.fsheet .btns{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:10px}
.fsheet .btns .btn{min-height:44px;font-size:14px;padding:0 8px;border-radius:12px}
.cr3d{position:absolute;left:0;right:0;bottom:0;z-index:25;padding:8px 14px 24px;background:rgba(24,33,61,.88);color:#E3E8F3;font:11px/15px var(--sans)}

/* ---------- App overrides (mockup frame to real app) ---------- */
html{background:var(--sand);overflow-x:hidden}
body{overflow-x:clip}
@media (min-width:600px){html:not(:has(body.scenic)){background:#D9CBB4}}
main{position:relative;max-width:480px;min-height:100vh;margin:0 auto;background:var(--sand);padding-bottom:calc(120px + env(safe-area-inset-bottom));overflow-x:clip}
body.dark main{background:var(--night);color:var(--star)}
body.dark{background:var(--night)}
.tabbar{width:100%;max-width:480px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
body.dark .tabbar{background:linear-gradient(rgba(24,33,61,0),rgba(24,33,61,.95) 45%)}
body.dark .tabbar nav{background:rgba(35,46,82,.96);box-shadow:0 8px 28px rgba(0,0,0,.4),inset 0 0 0 1px rgba(255,255,255,.08)}
body.dark .tabbar a{color:var(--star)}body.dark .tabbar a.on{background:rgba(242,169,59,.18);color:var(--sun)}
body.is3d .tabbar{display:none}
.back{position:fixed;top:calc(12px + env(safe-area-inset-top));left:max(16px,calc(50% - 224px))}
.dhero .topbar{position:fixed;top:calc(12px + env(safe-area-inset-top));right:max(16px,calc(50% - 224px))}
/* Fix: banner subtitle never sits under the ridge. Height grows with text, ridge gets its own 44px. */
.banner{height:auto;min-height:184px;padding:calc(28px + env(safe-area-inset-top)) 104px 52px 20px}
.banner.hasback{padding-left:72px}
.banner p{max-width:none}
.banner .art{top:calc(28px + env(safe-area-inset-top))}
.hero .sunm{top:calc(24px + env(safe-area-inset-top))}
.chip{border:0;cursor:pointer}
button.btn,button.act{font-family:var(--sans)}
.dark .sources a{color:var(--sun)}
.toast{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);background:var(--night);color:#fff;padding:10px 16px;border-radius:999px;font-size:14px;z-index:2000;white-space:nowrap}
.leaflet-container{font:12px/1.4 var(--sans);background:#EDE0C7}
.mapcard #map{width:100%;height:100%}
.mapfull{position:fixed;inset:0;height:auto;max-width:480px;margin:0 auto}
.mapfull #map{position:absolute;inset:0}
.maptop{position:fixed;top:calc(12px + env(safe-area-inset-top));left:max(16px,calc(50% - 224px));right:max(16px,calc(50% - 224px));z-index:1001}
.sheet{position:fixed;left:50%;transform:translateX(-50%);width:100%;max-width:480px;z-index:1001;padding-bottom:calc(104px + env(safe-area-inset-bottom))}
.mapfull .leaflet-bottom{bottom:calc(var(--sheeth,300px) + 4px)}
.tpin{background:none;border:0}
.tpin svg{display:block;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
.tpin.on .pp>path{fill:var(--night)}
.tpin.on{z-index:1000!important}
.plbl{position:absolute;left:36px;top:7px;white-space:nowrap;background:rgba(251,245,234,.94);color:#2B2622;font:600 13px/1 system-ui,-apple-system,sans-serif;padding:4px 8px;border-radius:10px;border:1px solid rgba(43,38,34,.18);box-shadow:0 1px 3px rgba(0,0,0,.2);pointer-events:none}
.plbl.l{left:auto;right:36px}
.plbl.off{display:none}
.spin .plbl{left:30px;top:5px;font-size:12px;padding:3px 7px}
.spin .plbl.l{left:auto;right:30px}
.tpin.on .plbl{background:var(--night);color:#fff;border-color:transparent}
.truedot{stroke:#fff}
.v3d{position:fixed;inset:0;background:#9DB9D8;overflow:hidden;max-width:none}
#t3d{position:absolute;inset:0;touch-action:none}#t3d canvas{display:block}
#t3d .ov{position:absolute;inset:0;pointer-events:none;width:100%;height:100%}
.v3d .top{position:absolute;top:calc(12px + env(safe-area-inset-top));left:16px;right:16px;z-index:20;display:flex;align-items:center;gap:10px}
.v3d .top h1{flex:1;font-size:22px;line-height:26px;color:#fff;text-shadow:0 1px 8px rgba(24,33,61,.6)}
.glass{border:0;cursor:pointer}
.lbl{left:0;top:0;cursor:pointer;border:0;will-change:transform}
.fsheet{bottom:calc(64px + env(safe-area-inset-bottom))}
.cr3d{padding-bottom:calc(8px + env(safe-area-inset-bottom))}
.hint3d{position:absolute;left:12px;right:12px;bottom:calc(72px + env(safe-area-inset-bottom));text-align:center;font-size:13px;color:#fff;text-shadow:0 1px 3px #000;pointer-events:none}
.lede.dk{color:#D3D9E8}
.nf{padding:24px 16px}
.mapfull .tpin svg.pp{width:34px;height:42px}
.fly .txt{right:150px}
.tabbar{z-index:1100}.mapcard{isolation:isolate}.pad .sources{padding:0}.pad .sh{margin-left:0;margin-right:0}
.zfoot,body.scenic .zfoot{display:block;min-height:44px;margin:4px 20px 0;font-size:12px;line-height:44px;color:var(--dust);text-decoration:none}
/* wordmark is all caps trimmed to its ink box: bottom edge on the baseline, height = cap height */
.zfoot img,body.scenic .zfoot img{display:inline;width:auto;height:.75em;margin:0 0 0 3px;padding:0;vertical-align:baseline;position:relative;top:1px}
body.dark .zfoot{color:#DCE2F0}
/* Spiritual Centers (design: design/opus-2026-10-31-sacred-sites.md) */
:root{--dusk:#6B3F6E;--dusk-d:#4E2C51;--dusk-t:#EEE2EC}
.banner.sac{background:var(--dusk)}
.sbadge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;line-height:16px;padding:4px 10px;border-radius:999px}
.sbadge .i{width:14px;height:14px}.sbadge.lg{font-size:14px;padding:6px 12px}.sbadge.lg .i{width:18px;height:18px}
.sbadge.open{color:#2E5E34;background:#DDEBD5}.sbadge.appt{color:#7A5200;background:#FFE9B8}.sbadge.retreat{color:#4A4552;background:#E7E2E6;border:1px solid #B9B0BA}
.media.sacph{background:var(--dusk-t);display:flex;align-items:center;justify-content:center}.media.sacph.cong{aspect-ratio:1}.media.sacph.cong.r32{aspect-ratio:3/2}.media.sacph .i{width:44%;height:44%;color:var(--dusk);opacity:.45}
.spanel{margin:12px 16px;padding:14px 16px;border-radius:16px;background:#FFFAF2;border:1.5px solid var(--dusk-t)}
.spanel p{margin-top:8px;font-size:15px;line-height:21px}.spanel .hrs{font-size:14px}
.blist{margin:0;padding-left:36px;font-size:15px;line-height:22px}.blist li{margin:4px 0}
.etq{margin:12px 16px}.etq summary{cursor:pointer;font-weight:700;color:var(--dusk);padding:12px 14px;background:var(--dusk-t);border-radius:12px;list-style-position:inside}
.etq ul{margin:10px 0 0;padding-left:22px;font-size:14px;line-height:21px}
.spin{background:none;border:0}
body.sac .chip.on{background:var(--dusk);border-color:var(--dusk);color:#fff}
.mapfull .spin svg,.spin svg{width:28px!important;height:28px!important;position:static!important}
/* Immersive hero (design/opus-2026-10-31-immersive-hero.md) */
body.home main{overflow-x:visible}
.hero.imm{height:100vh;height:100svh;max-height:900px;min-height:560px;width:100vw;margin-left:calc(50% - 50vw)}
.hero.imm img{object-fit:cover;opacity:0;transition:opacity .4s}
.hero.imm img.in{opacity:1}
.hero.imm .veil{background:linear-gradient(180deg,rgba(24,33,61,.55) 0,rgba(24,33,61,0) 18%),linear-gradient(180deg,rgba(24,33,61,0) 35%,rgba(24,33,61,.5) 58%,rgba(24,33,61,.74) 78%,rgba(24,33,61,.85) 100%)}
.hero.imm .title{bottom:calc(132px + env(safe-area-inset-bottom));padding-left:max(0px,calc(50% - 240px));text-shadow:0 1px 2px rgba(0,0,0,.35),0 2px 24px rgba(0,0,0,.3)}
.scue{position:absolute;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%);width:44px;height:44px;border-radius:50%;border:0;background:rgba(24,33,61,.4);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;animation:bob 2.4s ease-in-out 3;transition:opacity .3s}
.scue.gone{opacity:0;pointer-events:none}
@keyframes bob{50%{transform:translateX(-50%) translateY(6px)}}
.hero.imm .ridgecut{height:36px}
body.onhero .tabbar{background:none}
.banner.tall{height:56svh;min-height:380px;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:56px}
.banner.tall picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.banner.tall .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(24,33,61,.35),rgba(24,33,61,0) 30%,rgba(24,33,61,.7))}
.banner.tall>*:not(picture):not(.veil):not(.ridge){position:relative}
@media (prefers-reduced-motion:reduce){.scue{animation:none}.hero.imm img{transition:none}}
/* Floating over scenery (design/opus-2026-10-31-floating-parallax.md) */
#bg{position:fixed;left:0;top:0;width:100%;height:calc(100lvh + 200px);z-index:-1;will-change:transform;contain:strict;background:#2A3550}
#bg img{width:100%;height:100%;object-fit:cover;display:block}
#bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,20,36,.6) 0,rgba(16,20,36,.35) 28%,rgba(16,20,36,.12) 45%,rgba(16,20,36,.28) 100%)}
@media (prefers-reduced-motion:reduce){#bg{height:100lvh;will-change:auto}}
body.scenic,body.scenic main{background:transparent}
html:has(body.scenic){background:#2A3550}
body.scenic main{overflow-x:clip}
body.scenic .hero.imm{height:clamp(300px,46svh,440px);min-height:0;width:auto;margin:0;background:none!important;overflow:visible}
body.scenic .hero.imm .title{bottom:20px;padding-left:0}
body.scenic .hero.imm h1{font-size:56px;line-height:54px}
:root{--glass:rgba(255,250,242,.86);--glassd:rgba(24,33,61,.62)}
body.scenic :is(.fact,.tile,.row,.story,.stop .card,.pg:not(.next),.sheet,.etq summary,.seg){background:var(--glass)!important;-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border:1px solid rgba(255,255,255,.6);box-shadow:0 8px 24px rgba(16,20,36,.22)}
body.scenic :is(.meta,.blurb,.gpsl,.fact span,.story p){color:#5A4F45!important}
body.scenic :is(.tagp){background:rgba(36,31,27,.08)!important}
body.scenic .chip{background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
body.scenic .chip.on{background:var(--ink);color:#fff}
body.scenic.sac .chip.on{background:var(--dusk)}
body.scenic .banner{background:none!important;min-height:0;padding-bottom:20px;color:#fff}
body.scenic .banner .ridge{display:none}
body.scenic .banner h1{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5),0 2px 16px rgba(0,0,0,.35)}
body.scenic .banner p{text-shadow:0 1px 3px rgba(0,0,0,.8),0 0 14px rgba(0,0,0,.5)}
body.scenic .banner .kicker::before{content:"";display:block;width:28px;height:4px;border-radius:2px;margin-bottom:8px;background:var(--chile)}
body.scenic .banner.explore .kicker::before{background:var(--jun)}body.scenic .banner.sac .kicker::before{background:var(--dusk)}
body.scenic .grp h2,body.scenic .sh h2{display:inline-block;background:var(--glassd);color:#E9EDF6;padding:6px 12px;border-radius:999px}
body.scenic .grp .ln{display:none}body.scenic .grp .ct{color:#E9EDF6;background:var(--glassd);padding:2px 8px;border-radius:999px}
body.scenic .sh a{background:var(--glassd);color:#FFD9A0;padding:4px 10px;border-radius:999px}
body.scenic main>.credit,body.scenic .credit.pad{background:var(--glassd);color:#E9EDF6;margin:8px 16px 0;padding:6px 10px;border-radius:10px;font-size:12px}
body.scenic main>.credit a,body.scenic .credit.pad a{color:#E9EDF6}
body.scenic .stop .credit{color:#5A4F45}
body.scenic .foot,body.scenic .zfoot{background:var(--glassd);color:#E9EDF6!important}
body.scenic .foot{margin:20px 16px 0;padding:13px 16px 0;border-radius:16px 16px 0 0}
body.scenic .zfoot{margin:0 16px;padding:0 16px;border-radius:0 0 16px 16px}
body.scenic .zfoot img{filter:brightness(0) invert(1);opacity:.9}
body.scenic .tabbar{background:none}
body.scenic .tabbar nav{background:rgba(255,250,242,.82);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
body.scenic .row{content-visibility:auto;contain-intrinsic-size:auto 148px}
body.scenic .med{box-shadow:0 2px 8px rgba(0,0,0,.3)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){:root{--glass:rgba(255,250,242,.96);--glassd:rgba(24,33,61,.9)}body.scenic .tabbar nav{background:rgba(255,250,242,.96)}}
@media (prefers-reduced-transparency:reduce){:root{--glass:rgba(255,250,242,.96);--glassd:rgba(24,33,61,.9)}}
body.scenic .etq{background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:12px;box-shadow:0 8px 24px rgba(16,20,36,.22)}body.scenic .etq[open]{padding-bottom:10px}body.scenic .etq ul{margin:10px 12px 0}body.scenic .etq summary{box-shadow:none!important;border:0!important}
/* Footer wordmark inline like a word (owner request pt37u) */
/* Liquid Glass tab bar and map top bar (Opus spec appended to design/opus-2026-10-31-floating-parallax.md) */
.tabbar,body.scenic .tabbar,body.dark .tabbar{background:none;left:12px;right:12px;transform:none;width:auto;max-width:420px;margin:0 auto;padding:0 0 calc(10px + env(safe-area-inset-bottom))}
.tabbar nav,body.scenic .tabbar nav{position:relative;isolation:isolate;height:62px;border-radius:31px;padding:5px;background:linear-gradient(180deg,rgba(255,252,246,.62),rgba(255,248,238,.48));-webkit-backdrop-filter:blur(24px) saturate(1.8) brightness(1.05);backdrop-filter:blur(24px) saturate(1.8) brightness(1.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),inset 0 -1px 0 rgba(255,255,255,.18),0 10px 30px rgba(16,20,36,.28),0 1px 3px rgba(16,20,36,.18)}
.tabbar nav::before,.maptop .ttl::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(255,255,255,.15) 40%,rgba(255,255,255,.05) 60%,rgba(255,255,255,.55));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.tabbar a{color:var(--ink);text-shadow:0 0 8px rgba(255,250,242,.7)}
.tabbar a .i{filter:drop-shadow(0 0 6px rgba(255,250,242,.6))}
.tabbar a.on{background:rgba(255,255,255,.7);color:var(--chile-d);font-weight:700;box-shadow:inset 0 1px 0 #fff,0 2px 8px rgba(16,20,36,.14)}
body.dark .tabbar nav{background:linear-gradient(180deg,rgba(44,56,98,.62),rgba(24,33,61,.72));-webkit-backdrop-filter:blur(24px) saturate(1.5);backdrop-filter:blur(24px) saturate(1.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 30px rgba(0,0,0,.45)}
body.dark .tabbar nav::before{opacity:.4}
body.dark .tabbar a{color:var(--star);text-shadow:0 1px 6px rgba(0,0,0,.5)}
body.dark .tabbar a .i{filter:none}
body.dark .tabbar a.on{background:rgba(242,169,59,.2);color:var(--sun);box-shadow:inset 0 1px 0 rgba(255,214,150,.3)}
.maptop .ttl{position:relative;isolation:isolate;background:rgba(255,250,242,.66);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.tabbar nav,body.scenic .tabbar nav,.maptop .ttl{background:rgba(255,250,242,.94)}body.dark .tabbar nav{background:rgba(35,46,82,.96)}}
@media (prefers-reduced-transparency:reduce){.tabbar nav,body.scenic .tabbar nav,.maptop .ttl{background:rgba(255,250,242,.97);backdrop-filter:none;-webkit-backdrop-filter:none}body.dark .tabbar nav{background:#232E52}.tabbar nav::before,.maptop .ttl::before{display:none}.tabbar a{text-shadow:none}}
/* Map search and layers (Opus spec 2026-10-31 map-flyover-layers) */
.mapfull,.mapfull #map,#t3d{touch-action:none}
/* Embedded maps: vertical swipes scroll the page on touch screens (drag and pinch are off there; the +/- buttons zoom). */
#map:not(.mapfull #map){touch-action:pan-y}
.maptop .ttl.srch{padding:0 4px 0 14px;gap:8px}
.srch .sic{width:20px;height:20px;flex:none;fill:none;stroke:var(--ink,#241F1B);stroke-width:2;stroke-linecap:round;opacity:.7}
.srch input{flex:1;min-width:0;height:44px;border:0;background:transparent;font:inherit;font-size:16px;color:inherit;outline:none;-webkit-appearance:none;appearance:none}
.srch input::-webkit-search-cancel-button{display:none}
.qclr{width:44px;height:44px;border:0;background:transparent;border-radius:22px;display:grid;place-items:center;color:inherit;cursor:pointer}
.qclr svg{width:18px;height:18px}
.lchips{position:fixed;z-index:1001;top:calc(72px + env(safe-area-inset-top));left:max(16px,calc(50% - 224px));right:max(16px,calc(50% - 224px));display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 0 6px}
.lchips::-webkit-scrollbar{display:none}
.lchip{flex:none;display:flex;align-items:center;gap:7px;height:44px;padding:0 15px;border-radius:22px;border:0;font:inherit;font-size:14px;font-weight:600;color:#241F1B;background:rgba(255,250,242,.7);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);box-shadow:0 4px 14px rgba(36,31,27,.16),inset 0 0 0 1px rgba(255,255,255,.6);cursor:pointer}
.lchip i{width:10px;height:10px;border-radius:5px;background:var(--lc);box-shadow:0 0 0 1.5px #fff}
.lchip.on{background:var(--lc);color:#fff;box-shadow:0 4px 14px rgba(36,31,27,.22)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.lchip{background:rgba(255,250,242,.96)}}
.sres{position:fixed;z-index:1002;top:calc(72px + env(safe-area-inset-top));left:max(16px,calc(50% - 224px));right:max(16px,calc(50% - 224px));max-height:min(60vh,360px);overflow:auto;border-radius:16px;padding:6px;background:rgba(255,250,242,.9);-webkit-backdrop-filter:blur(24px) saturate(1.6);backdrop-filter:blur(24px) saturate(1.6);box-shadow:0 10px 30px rgba(36,31,27,.25),inset 0 0 0 1px rgba(255,255,255,.6)}
.srow{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:6px 10px;border:0;border-radius:12px;background:transparent;font:inherit;color:#241F1B;text-align:left;cursor:pointer}
.srow:hover,.srow:focus-visible{background:rgba(36,31,27,.07);outline:none}
.srow span{display:flex;flex-direction:column;min-width:0}.srow b{font-size:16px}.srow small{font-size:13px;color:#6B5B4B}
.mpin{flex:none;width:24px;height:24px;border-radius:12px;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.25);display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800}
.mpin.s{background:#C4461E}.mpin.b{background:#3E6B48}.mpin.c{background:#6B3F6E}.mpin.t{background:#6B5B4B}
.shd{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#6B5B4B;padding:8px 10px 2px}
.sask{padding:14px 10px;font-size:14px;color:#6B5B4B}
.sask.load{background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent) 0 0/200% 100%;animation:shim 1.2s linear infinite;border-radius:12px}
@keyframes shim{to{background-position:-200% 0}}
.olbl,.tlbl{background:none;border:0;box-shadow:none;padding:0;font-size:12px;font-weight:700;font-variant:small-caps;letter-spacing:.04em;text-shadow:0 0 3px #FFFAF2,0 0 3px #FFFAF2,0 0 3px #FFFAF2}
.olbl::before,.tlbl::before{display:none}.olbl.cr{color:#9A3412}.olbl.bg{color:#3E6B48}.tlbl{color:#4A3F35;font-size:13px}
.media.bph{background:#3E6B48;display:grid;place-items:center}
/* 3D layers, pivot */
.lbl .dot{width:14px;height:14px;border-radius:7px;margin-left:4px;box-shadow:0 0 0 2px #fff;flex:none}
.lbl.kb .dot{background:#3E6B48}.lbl.kc .dot{background:#6B3F6E}.lbl.kt .dot{display:none}
.lbl.kb,.lbl.kc{height:36px;font-size:13px;border-radius:18px}
.lbl.kt{height:30px;padding:0 10px;background:rgba(24,33,61,.55);font-size:13px;font-variant:small-caps;letter-spacing:.04em}
.lbl.num.kb,.lbl.num.kc{padding:0 6px 0 2px}
.fsheet .kick{font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;margin:0 0 4px}.kick.kb{color:#3E6B48}.kick.kc{color:#6B3F6E}
.reset3d{position:absolute;z-index:26;left:50%;transform:translateX(-50%);bottom:calc(64px + env(safe-area-inset-bottom));height:44px;padding:0 18px;border-radius:22px;color:#fff;font:700 14px/1 var(--sans);border:0;cursor:pointer}
.reset3d[hidden]{display:none}.reset3d{white-space:nowrap;bottom:calc(96px + env(safe-area-inset-bottom))}
.reset3d.glass{width:auto;min-width:0;display:flex;align-items:center}
/* Flyover sky photo (design/opus-2026-10-31-flyover-sky.md) */
.sky3d{position:absolute;left:0;right:0;top:0;height:60%;z-index:0;pointer-events:none;background-color:var(--fog,#9DB9D8);background-repeat:no-repeat;background-size:auto 70%;background-position:50% 0;transition:background-image .4s}
.sky3d::after{content:"";position:absolute;left:0;right:0;top:calc(70% - 2px);bottom:0;background:linear-gradient(var(--fog),var(--fog))}
.sky3d::before{content:"";position:absolute;left:0;right:0;top:calc(70% - 18vh);height:18vh;background:linear-gradient(to bottom,transparent,var(--fog))}
.sky3d[data-mode=day]{background-size:auto 70%}
.sky3d[data-mode=night]{background-size:max(100%,calc(42vh * 2.34)) auto}
#t3d canvas{position:relative;z-index:1}
#t3d .ov{z-index:2}
.v3d.night{background:#0B1426}
.v3d.night .lbl{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}.v3d.night .lbl.kt{opacity:.9}
.v3d.night .top h1,.v3d.night .hint3d{text-shadow:0 1px 3px #000}
.v3d.night .cr3d{background:rgba(6,10,20,.85)}
.cr3d a{color:inherit}
.reset3d[hidden]{display:none!important}

.card.tap{cursor:pointer}.card.tap:focus-visible{outline:3px solid var(--sun,#F2A93B);outline-offset:2px}

/* Desktop layout, Opus pass design/opus-2026-10-31-desktop-layout.md */
@media (min-width:900px){
  :root{--mw:1120px}

  /* Canvas: navy or photo, never sand */
  html,html:not(:has(body.scenic)){background:#2A3550!important}
  body{overflow-x:clip}
  main{max-width:min(var(--mw),100% - 48px);margin-top:16px}
  body:not(.home) main{overflow-x:clip}
  body:not(.scenic):not(.dark) main{background:rgba(245,233,214,.94);border-radius:24px 24px 0 0;box-shadow:0 20px 60px rgba(16,20,36,.35)}

  /* Back button pinned to the content edge */
  .back{top:calc(44px + env(safe-area-inset-top));left:max(28px,calc(50% - min(var(--mw),100% - 48px)/2 + 28px))}
  .banner.hasback{padding-left:84px}

  /* Tab bar: same floating pill, add hover */
  .tabbar a:not(.on):hover{background:rgba(255,255,255,.35)}
  body.dark .tabbar a:not(.on):hover{background:rgba(255,255,255,.08)}

  /* Banners */
  .banner h1{font-size:52px;line-height:56px}
  .banner p{max-width:640px;font-size:17px;line-height:24px}
  .banner.tall{max-height:520px}

  /* Home */
  body.scenic .hero.imm{height:clamp(340px,50svh,520px)}
  body.scenic .hero.imm h1{font-size:76px;line-height:72px}
  .facts{gap:12px}
  .tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
  .fly{aspect-ratio:auto;height:220px}
  .fly .txt{right:auto;max-width:520px}
  .story{grid-template-columns:180px 1fr;gap:20px;padding:14px}

  /* Hover lift (transform only, no reflow) */
  .row,.tile,.story,.pg,.stop .card,.ev .card{transition:transform .15s ease,box-shadow .15s ease}
  .row:hover,.tile:hover,.story:hover,.pg:hover,.stop:hover .card{transform:translateY(-2px)}

  /* Horizontal strips wrap for mouse users */
  .chips{flex-wrap:wrap;overflow:visible}
  .years{flex-wrap:wrap;overflow:visible}
  .hscroll{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));overflow:visible;padding-bottom:0}
  .mini{width:auto}

  /* Eat and Spiritual Centers lists */
  .rows{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}

  /* Explore trail as a grid of stops */
  .seg{max-width:520px}
  .trail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px;padding-top:20px}
  .trail::before{display:none}
  .trail>:not(.stop){grid-column:1/-1}
  .stop{margin-bottom:0}

  /* History: two columns of equal-height cards */
  .tl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 28px;padding-top:16px}
  .tl::before{display:none}
  .tl>:not(.ev){grid-column:1/-1}
  .ev{margin-bottom:0;display:flex;flex-direction:column}
  .ev .card{flex:1}

  /* Detail pages: hero left, info right */
  .lede{max-width:760px}
  main:has(>.dhero){display:flow-root}
  main:has(>.dhero)>.dhero{float:left;width:calc(50% - 24px);margin:16px 0 0 16px;border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
  main:has(>.dhero)>.dhero+.capbar{float:left;clear:left;width:calc(50% - 24px);margin-left:16px;padding:8px 4px 0}
  main:has(>.dhero)>:not(.dhero,.capbar,.back){margin-left:calc(50% + 8px)!important}
  .dhero .topbar{position:absolute;top:12px;right:12px}
  main:has(>.dhero) .medrow .med.lg{margin-top:0}
  .dt{padding-top:24px}
  .dt h1{font-size:44px;line-height:48px}

  /* Full map with a left side panel */
  .mapfull{max-width:none}
  .maptop{left:16px;right:auto;width:400px}
  .lchips{left:16px;right:16px}
  .sres{left:16px;right:auto;width:400px;max-height:min(70vh,520px)}
  .sheet{left:16px;right:auto;top:calc(128px + env(safe-area-inset-top));bottom:auto;width:400px;max-width:none;max-height:calc(100vh - 224px - env(safe-area-inset-top));overflow:auto;transform:none!important;border-radius:24px;padding:16px 0;background:var(--glass);-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);border:1px solid rgba(255,255,255,.6);box-shadow:0 10px 30px rgba(16,20,36,.28)}
  .sheet .grab{display:none}
  .strip{flex-wrap:wrap;overflow:visible}
  .mapfull .leaflet-bottom{bottom:16px}

  /* 3D flyover card as a left panel */
  .fsheet{left:16px;right:auto;width:400px}
}

@media (min-width:1280px){
  :root{--mw:1200px}
  .rows{grid-template-columns:repeat(3,minmax(0,1fr))}
  .trail{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tl{gap:28px 36px}
  main:has(>.dhero)>.dhero,main:has(>.dhero)>.dhero+.capbar{width:calc(55% - 24px)}
  main:has(>.dhero)>:not(.dhero,.capbar,.back){margin-left:calc(55% + 8px)!important}
}
@media (min-width:900px){.mapfull .leaflet-left{left:432px}}
/* Today's view credit: wrap instead of ellipsis */

/* support link */
.sup{margin:12px 20px 0;font-size:12px;line-height:18px;color:var(--dust)}
.sup a,.supm a,.sup3{display:inline-block;min-height:44px;line-height:44px;padding:0 4px;margin:-13px 0;color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.sup a{color:var(--chile)}
body.dark .sup{color:#DCE2F0}body.dark .sup a{color:#F2C46D}
body.scenic .sup{background:var(--glassd);color:#E9EDF6!important;margin:0 16px;padding:12px 16px 0}
body.scenic :not(.foot)+.sup,body.scenic .sup:first-child{padding-top:17px}
body.scenic .sup a{color:#fff}
body.scenic :not(.foot)+.sup,body.scenic .sup:first-child{margin-top:20px;border-radius:16px 16px 0 0}
.supm{margin:2px 16px 0;padding:0 0 4px;font-size:12px;line-height:18px;color:var(--dust);text-align:center}
.sup3{margin:-14px 0 -14px 4px;font-size:11px}

/* Readability pass (design/opus-2026-10-31-readability.md, owner pt65u/pt66u) */
:root{--glass:rgba(255,250,242,.9);--glassd:rgba(24,33,61,.74);--dust:#574B40}
.tiles{margin-top:12px}html.night .exph{background:var(--dune)}
.story p,.row .meta,.fly p,.fsheet p{font-size:15px;line-height:21px}
.mini p,.stop .blurb{font-size:14px;line-height:20px}
.fact span{font-size:13px;line-height:17px;font-weight:500}
.credit,.row .credit,.stop .credit,.mini .credit,.capbar .credit,.ev .credit{font-size:13px;line-height:18px}
.sel .credit,.fsheet .credit{font-size:12.5px;line-height:17px}
body.scenic main>.credit,body.scenic .credit.pad{font-size:13px;line-height:18px}
.soon{font-size:12px;font-weight:700;background:#574B40}
.tabbar a{font-size:12px}
.foot,.sup,.supm,.zfoot,body.scenic .zfoot{font-size:13.5px}
.sup3{font-size:12.5px}
.maptop .ttl .muted,.srow small{font-size:13px}
.fly p{color:#DCE2F0}.ev p{color:#E3E8F2}.ev .credit,.dark .credit{color:#C3CADC}
body.scenic :is(.meta,.blurb,.gpsl,.fact span,.story p),body.scenic .stop .credit,body.scenic :is(.row,.mini,.story) .credit{color:#4A4038!important}
body.scenic main>.credit,body.scenic .credit.pad,body.scenic .foot,body.scenic .zfoot,body.scenic .sup,body.scenic .grp h2,body.scenic .sh h2{color:#F4F6FB!important;text-shadow:0 1px 2px rgba(0,0,0,.45)}
body.scenic .banner p,body.scenic .hero .tag{color:#fff}
.tabbar a:not(.on),body.scenic .tabbar a:not(.on){color:#2E2722}
.tabbar nav,body.scenic .tabbar nav{background:linear-gradient(180deg,rgba(255,252,246,.82),rgba(255,248,238,.74))}
.fact{padding:10px 6px 9px}.fact span{white-space:normal;text-wrap:balance}

.sheet{touch-action:none}.sheet .grab{box-sizing:content-box;padding:10px 40px;margin:-10px auto 0;background-clip:content-box;cursor:grab}
.sheet.gone{translate:0 110%!important;visibility:hidden;pointer-events:none}
.mapsup{display:none;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(98px + env(safe-area-inset-bottom));z-index:1001;margin:0;padding:0 12px;border-radius:14px;background:rgba(255,253,248,.92);box-shadow:0 4px 12px rgba(16,20,36,.2);white-space:nowrap}
.sheet.gone~.mapsup{display:block}
@media (min-width:900px){.sheet{touch-action:auto}}

/* fly tile: flow layout so subtitle never sits under the CTA */
.fly{aspect-ratio:auto;min-height:140px;display:flex;flex-direction:column;justify-content:space-between;gap:12px;padding:18px}
.fly .txt{position:relative;left:auto;top:auto;right:auto;max-width:none}
.fly .cta{position:relative;left:auto;bottom:auto;align-self:flex-start}
/* 2510: tab highlight padding, wellness banner, explore grid, history light theme */
.tabbar a{flex:1 1 0;min-width:max-content;padding:0 4px;box-sizing:border-box}.tabbar a.on{flex-grow:1.4;padding:4px 16px}
.tabbar nav{gap:2px}
.banner.well{background:#7A5C8E}
@media (min-width:900px){
  .trail{gap:20px}
  .stop{display:block}
  .stop .med{position:absolute;top:10px;left:10px;margin:0;z-index:3}
}
/* History uses the same light theme as the rest of the site */
.banner.hist{background:#7A5A3A}
.banner.hist .stars{display:none}
.years{background:rgba(245,233,214,.96);box-shadow:0 1px 0 rgba(36,31,27,.08)}
.years a{color:var(--ink);background:rgba(255,250,242,.9);box-shadow:inset 0 0 0 1.5px rgba(36,31,27,.16)}
.years a.on{background:var(--chile);color:#fff;box-shadow:none}
.ev .dot{background:var(--paper);box-shadow:inset 0 0 0 3px var(--chile)}
.ev .yr{color:var(--chile-d)}
.ev .yr.nd{color:#5A4F45}
.ev .card{background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}
.ev h2,.ev h3{color:var(--ink)}
.ev p{color:#3A322C}
.ev .credit{color:#5A4F45}
.ev .more{color:var(--chile-d)}
.ev.feature .card{box-shadow:inset 0 0 0 1.5px rgba(196,74,36,.45),var(--shadow)}
.ev .quote{background:rgba(196,74,36,.07);border-left-color:var(--chile);color:#3A322C}
.lede.dk{color:#3A322C}

/* 2520: Fly over tile shows a real render of the flyover default view */
.fly img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.fly::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(16,22,40,.82) 0%,rgba(16,22,40,.45) 45%,rgba(16,22,40,0) 75%);z-index:1}
.fly .txt,.fly .cta{z-index:2}
.fly .flycr{position:absolute;right:10px;bottom:6px;max-width:60%;text-align:right;font-size:9px!important;line-height:11px!important;z-index:2;font-size:10px;line-height:12px;color:rgba(255,255,255,.85);text-shadow:0 1px 2px rgba(0,0,0,.7)}
/* Text on colored fills stays paper white at night; the paper token itself turns navy then. */
html.night :is(.banner,.banner h1,.banner p,.banner .kicker,.pg.next,.pg.next b,.btn.primary,.btn.jun,.act.primary){color:#FFFAF2}
html.night .banner.hist h1,html.night .banner.hist p{color:#FFFAF2}

/* ---------- Accounts and visitor photos (ugc.js) ---------- */
.vgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 16px}
.vp{margin:0;min-width:0}.vp>a{display:block;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--dune)}.vp img{width:100%;height:100%;object-fit:cover;display:block}
.vp figcaption{font-size:11px;line-height:14px;color:var(--dust);margin-top:4px;overflow-wrap:anywhere}.vp .cap{display:block;color:var(--ink);font-weight:600;font-size:12px;line-height:15px}
.rep{border:0;background:none;color:var(--dust);font:inherit;font-size:11px;line-height:14px;text-decoration:underline;text-underline-offset:2px;padding:0;cursor:pointer;min-height:24px}.rep:disabled{text-decoration:none;cursor:default}
.feed .feedmsg{padding:0 0 8px;flex:none;max-width:320px}.fcard .b{padding:10px 12px 12px}.fcard .credit{margin-top:4px}
body.scenic .fcard{background:var(--glass);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border:1px solid rgba(255,255,255,.6)}
body.scenic .feedmsg{background:var(--glassd);color:#E9EDF6;padding:8px 12px;border-radius:10px}body.scenic .feedmsg a{color:#FFD9A0}
html.night body.scenic .fcard{border-color:rgba(255,255,255,.14)}
.form{margin:12px 16px 0;padding:16px;background:var(--paper);border-radius:20px;box-shadow:var(--shadow);display:grid;gap:12px}
.form p{font-size:15px;line-height:21px}.form h3{font-size:20px}
.fl span{display:block;font:700 12px/16px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dust);margin-bottom:4px}
.fl input{width:100%;min-height:48px;padding:0 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--sand);color:var(--ink);font:inherit;font-size:16px}
.fl input[type=file]{padding:11px 14px;font-size:15px}.fl input:focus-visible{outline:3px solid var(--sun);outline-offset:1px}
.fck{display:flex;gap:10px;align-items:flex-start;min-height:44px;font-size:15px;line-height:22px}.fck input{width:22px;height:22px;margin:0;flex:none;accent-color:var(--chile)}.fck a{color:var(--jun)}
.fmsg{font-size:14px;line-height:20px;color:var(--chile-d);margin:0}.fmsg:empty{display:none}.fmsg.ok{color:var(--jun)}
.prev{border-radius:14px;overflow:hidden;background:var(--dune)}.prev img{width:100%;height:auto;display:block;max-height:60vh;object-fit:contain}
.vst{display:inline-flex;white-space:nowrap;align-items:center;height:22px;padding:0 8px;border-radius:6px;font:700 11px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;background:var(--sand);color:var(--dust)}.vst.ok{background:var(--jun-t);color:var(--jun)}.vst.no{background:var(--chile-t);color:var(--chile-d)}
.vrow,.rvrow{grid-template-columns:104px 1fr auto}.vrow .rep{align-self:start;margin-top:4px}
.rvbtns{display:flex;gap:8px;margin-top:10px}.rvbtns .btn{min-height:44px;padding:0 14px;font-size:14px}
.flinks{margin:14px 20px 0;font-size:13px;line-height:18px;color:var(--dust)}.flinks a{color:var(--jun);font-weight:600;text-decoration:none}
body.scenic .flinks{background:var(--glassd);color:#E9EDF6;margin:0 16px;padding:8px 16px 0}body.scenic .flinks a{color:#FFD9A0}
.terms h2{font-size:22px;margin-top:22px}.terms p{margin-top:8px;font-size:16px;line-height:24px}.terms .blist{margin-top:8px;padding-left:22px}.terms a{color:var(--jun)}
html.night :is(.sources a,.info .v a,.stop .gpsl,.sel .coord,.notice .i,.tile.t-exp .lab .i:first-child,.fck a,.flinks a,.terms a,.vst.ok){color:var(--jun-ink)}
@media (min-width:900px){.vgrid{grid-template-columns:repeat(6,minmax(0,1fr))}.form{max-width:560px}.feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}

/* 0610: sign-in not set up yet reads as a notice, not an error (Opus round review) */
.fmsg.info{color:var(--dust);background:rgba(36,31,27,.05);border-radius:10px;padding:8px 10px;margin-top:8px}

/* ---------- Night palette (0610). One theme site-wide; follows the OS, ?night=1|0 overrides. ---------- */
html.night{--sand:#141B33;--paper:#1F2948;--ink:#F1F3F9;--dust:#C9D0E0;--line:rgba(255,255,255,.16);--chile-d:#FFB38E;--chile-t:rgba(242,169,59,.2);--jun:#B9CDA6;--jun-ink:#B9CDA6;--jun-t:#26342A;--dune:#2A3557;--sage:#B9CDA6;--glass:rgba(31,41,72,.9);--shadow:0 8px 24px rgba(0,0,0,.5);--dusk-t:#3D2C3E;--ochrebg:#4A3A14;--ochre:#FFD98A;--ochreln:#C9921E;background:#0F1529;color-scheme:dark}
html.night body,html.night main{background:var(--sand);color:var(--ink)}
html.night body.scenic main{background:transparent}
html.night body.scenic :is(.fact,.tile,.row,.story,.stop .card,.pg:not(.next),.sheet,.etq summary,.seg){border-color:rgba(255,255,255,.12)}
html.night body.scenic :is(.meta,.blurb,.gpsl,.fact span,.story p),html.night body.scenic .stop .credit,html.night body.scenic :is(.row,.mini,.story) .credit{color:var(--dust)!important}
html.night :is(.stop .blurb,.ev p,.ev .quote,.lede.dk){color:#DCE2F0}
html.night :is(.ev .credit,.ev .yr.nd){color:var(--dust)}
html.night .ev .card,html.night .spanel{background:var(--paper);color:var(--ink)}
html.night :is(.mapcard,.mapfull){background:#1B2340}
html.night .row.example{background:#2A2414}
html.night :is(.lchip,.srow){color:var(--ink)}
html.night .lchip{background:rgba(31,41,72,.85)}
html.night :is(.srow small,.shd,.sask){color:var(--dust)}
html.night .srch .sic{stroke:var(--ink)}
html.night .olbl,html.night .tlbl{text-shadow:0 0 3px #141B33,0 0 3px #141B33,0 0 3px #141B33}
html.night .tlbl{color:#E6E9F2}
html.night .years{background:rgba(20,27,51,.96);box-shadow:0 1px 0 rgba(255,255,255,.08)}
html.night .years a{color:var(--ink);background:var(--paper);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18)}
html.night .tabbar nav{background:rgba(31,41,72,.94)!important;box-shadow:0 8px 28px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.1)}
html.night .tabbar a{color:var(--ink)}
html.night .tabbar a.on{background:rgba(242,169,59,.22);color:var(--sun)}
html.night :is(.zfoot,.sup,.supm,.foot){color:var(--dust)}
html.night .sup a,html.night .supm a{color:#F2C46D}
html.night .zfoot img{filter:brightness(0) invert(1);opacity:.9}
html.night :is(input,textarea,select){background:#18203C;color:var(--ink);border-color:rgba(255,255,255,.22)}
html.night .fmsg.info{background:rgba(255,255,255,.06)}
.banner.shop{background:#3E6A85}
@media (min-width:900px){.form{margin-left:auto;margin-right:auto}#accbody,#accbody>.pad{max-width:560px;margin-left:auto;margin-right:auto}}
[hidden]{display:none!important}
html.night .notice,html.night .notice p{color:var(--ink)}
html.night body:not(.scenic) .banner.explore{background:#2E4A3B}
html.night body:not(.scenic):not(.dark) main{background:rgba(20,27,51,.96)}
html.night .sres{background:rgba(31,41,72,.96);color:var(--ink);box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.1)}
html.night .back{background:rgba(31,41,72,.94);color:#F1F3F9}
html.night .chip.on,html.night body.scenic .chip.on{background:#F2A93B;border-color:#F2A93B;color:#141B33}
html.night body.sac .chip.on{background:#B48ED6;border-color:#B48ED6;color:#141B33}
html.night .etq summary{color:#E6D6F5;background:rgba(180,142,214,.18)}
html.night .v3d{background:#0B1426}
html.night .leaflet-container{background:#1B2238}
html.night .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.85) contrast(.9) saturate(.6)}
html.night .tabbar nav{background:rgba(31,41,72,.98)!important}
html.night .tabbar{background:linear-gradient(rgba(20,27,51,0),rgba(20,27,51,.95) 45%)}
main{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
.pad.terms>*{max-width:68ch}
html.night .tabbar a:not(.on){color:#F1F3F9!important}
/* Soft fade behind the map header controls (like Apple Maps), so pins sliding under read as under the header. Taps pass through. */
.maptop::before{content:'';position:fixed;left:0;right:0;top:0;height:calc(150px + env(safe-area-inset-top));background:linear-gradient(rgba(245,233,214,.82),rgba(245,233,214,.6) 40%,rgba(245,233,214,.25) 70%,rgba(245,233,214,0));pointer-events:none;z-index:-1}
html.night .maptop::before{background:linear-gradient(rgba(20,27,51,.82),rgba(20,27,51,.6) 40%,rgba(20,27,51,.25) 70%,rgba(20,27,51,0))}
html.night .ttl.srch{background:rgba(20,27,51,.96);box-shadow:0 6px 18px rgba(0,0,0,.4),inset 0 0 0 1px rgba(255,250,242,.16)}
html.night .ttl.srch input{background:transparent}
html.night .maptop button:not(.qclr),html.night .maptop a{box-shadow:0 6px 18px rgba(0,0,0,.4),inset 0 0 0 1px rgba(255,250,242,.16)}

/* 2026-11-01: conglomerate label fits small tiles; Add a photo on business pages; scenic business pages */
.cong.sm .cl{left:6px;right:6px;bottom:6px;text-align:center;white-space:normal;font-size:8px;line-height:1.2;letter-spacing:.06em;padding:4px 5px;border-radius:8px}
.addfirst{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 24px;border-radius:999px;background:var(--chile);color:#fff;font:800 18px/1 var(--sans);text-decoration:none;box-shadow:0 8px 24px rgba(16,20,36,.35);white-space:nowrap}
.addfirst .i,.addph .i{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2}
.addph{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;margin:12px 16px 0;border-radius:16px;background:var(--chile);color:#fff;font:800 17px/1 var(--sans);text-decoration:none;box-shadow:var(--shadow)}
body.scenic :is(.dt,.act,.info,.card.mini){background:var(--glass)!important;-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border:1px solid rgba(255,255,255,.6);box-shadow:0 8px 24px rgba(16,20,36,.22)}
body.scenic .dt{margin:16px 16px 0;padding:16px;border-radius:18px}
body.scenic .act.primary{background:var(--chile)!important;color:#fff}
body.scenic .notice{box-shadow:0 8px 24px rgba(16,20,36,.22)}
body.scenic .vphotos>p,body.scenic .pad .sources{background:var(--glass);border-radius:14px;padding:10px 14px;margin:0 16px}
.dhero .cong{-webkit-mask-image:linear-gradient(#000 90%,transparent);mask-image:linear-gradient(#000 90%,transparent)}
.dhero .cong canvas{filter:saturate(.7)}
html.night .cong canvas{filter:brightness(.72) saturate(.8)}
.rep{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:0 12px;border-radius:999px;background:rgba(36,31,27,.08);color:var(--ink);font:700 12px/1 var(--sans);text-decoration:none;margin-top:6px}
.rep .i{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
html.night .rep{background:rgba(255,255,255,.12);color:#E9EDF6}

/* v0721 Opus review: visitor photo grid legibility over the photo background, Report pill */
body.scenic .vgrid{background:var(--glass);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border:1px solid rgba(255,255,255,.6);border-radius:16px;margin:0 16px;padding:10px}
html.night body.scenic .vgrid{border-color:rgba(255,255,255,.14)}
.vgrid{align-items:stretch}
.vp{display:flex;flex-direction:column}
.vp figcaption{display:flex;flex-direction:column;align-items:flex-start;flex:1;font-size:12px;line-height:16px}
.vp .cap{font-size:13px;line-height:17px}
.vp .credit{font-size:12px;line-height:16px;color:var(--dust)}
.vp .rep{margin-top:8px}
.rep{min-height:44px;padding:0 14px}
.rep:disabled{opacity:.6;background:transparent;box-shadow:inset 0 0 0 1px currentColor;cursor:default}
/* Admin: businesses (v0730) */
.adbody{padding-bottom:24px}
.adtop{display:flex;align-items:center;gap:12px;justify-content:space-between;margin:14px 16px 0;flex-wrap:wrap}
.adtop .small{margin:0}
.adrows{margin-top:12px}
.adoff{opacity:.62}
.adtag{background:var(--chile);color:#fff}
.adform{margin-top:14px}
.adh{font:700 22px/1.2 var(--serif,Georgia,serif);margin:0;color:var(--ink)}
.adhidden{margin:0;padding:10px 12px;border-radius:12px;background:rgba(176,64,32,.1);color:var(--chile-d);font-size:14px}
.adform select,.adform textarea{width:100%;min-height:48px;padding:10px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--sand);color:var(--ink);font:inherit;font-size:16px}
.adform textarea{resize:vertical;line-height:22px}
.adpair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:420px){.adpair{grid-template-columns:1fr}}
.adloc{border:1.5px solid var(--line);border-radius:16px;padding:12px;margin:0;display:grid;gap:12px;min-width:0}
.adloc legend{font:700 12px/16px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dust);padding:0 6px}
.admap{height:260px;border-radius:12px;overflow:hidden;background:var(--dune)}
.fhint{display:block;font-size:13px;line-height:18px;color:var(--dust);margin-top:4px}
.ferr{display:block;font-style:normal;font-size:13px;line-height:18px;color:var(--chile-d);margin-top:4px}
.ferr:empty{display:none}
.fl.bad input,.fl.bad select,.fl.bad textarea{border-color:var(--chile)}
.req{color:var(--chile);font-weight:700}
.adact{display:flex;gap:10px;flex-wrap:wrap}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.adcur .media{max-width:320px}
html.night .adform select,html.night .adform textarea{background:rgba(255,255,255,.06)}
/* Admin: Opus review round (v0730) */
.adform ::placeholder{color:var(--dust);opacity:.7;font-style:italic}
.adform :is(select,textarea,.btn,input[type=checkbox],input[type=file]):focus-visible{outline:3px solid var(--sun);outline-offset:1px}
.adoff{opacity:1;background:transparent;box-shadow:none;border:1.5px dashed var(--line)}
.adoff img,.adoff .media,.adoff canvas{filter:grayscale(1);opacity:.6}
.adform .adhide{padding:12px;border-radius:12px;background:var(--chile-t)}
.adhidden{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.adhidden p{margin:0}
.adbody{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
.adform input,.adform textarea,.adform select{scroll-margin-bottom:110px}
.fl input[type=file]{min-height:auto;padding:8px 0;border:0;background:none}
.fl input[type=file]::file-selector-button{min-height:44px;padding:0 14px;border-radius:10px;border:0;background:var(--chile-t);color:var(--chile-d);font:700 14px var(--sans);margin-right:10px;cursor:pointer}
.adprev{max-width:240px;border-radius:12px;display:block}
.fck .ferr{margin-top:4px}
.adh:focus{outline:none}
@media (min-width:900px){.adform{max-width:720px}.admap{height:340px}}
/* Admin-only buttons on Eat & Shop and business pages (v0740) */
.adminbar{display:flex;gap:10px;margin:12px 16px 0}
.adminbar .btn .i{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2}
body.scenic .adminbar .btn.ghost{background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.adminbar{align-items:center}
.adlabel{font:700 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--dust);background:var(--paper);padding:6px 8px;border-radius:8px}
#adtitle:focus{outline:none}
/* Business photo gallery with a primary photo (v0750) */
.vp>a{position:relative}
.pbadge{position:absolute;top:6px;left:6px;z-index:1;font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;background:var(--chile);color:#fff;padding:5px 7px;border-radius:7px}
.vp.isprim>a{box-shadow:0 0 0 3px var(--chile)}
.vp .credit a{color:inherit;display:inline;aspect-ratio:auto;background:none}
.rep.mkp{margin-top:6px}
.adphotos .vgrid{margin:0;padding:0;background:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.adphotos .vphotos>p{margin:0}
.adminbar{flex-wrap:wrap}
body.scenic .capbar .credit{display:inline-block;background:var(--glass);border-radius:10px;padding:6px 10px;color:var(--ink)}
/* v0750 review fixes: badge clear of the back button, aligned actions, 2 columns for admins */
.pbadge{left:auto;right:6px}
.vp .rep{margin-top:8px}.vp .rep.mkp{margin-top:6px}
@media (max-width:899px){.vgrid:has(.mkp){grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Take photo / Choose photo (design/opus-2026-11-01-take-photo.md). Phones get both; mouse-and-keyboard screens only Choose. */
.pick{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pick .btn{width:100%;padding:0 10px}.pick .i{width:20px;height:20px}
@media (hover:hover) and (pointer:fine){.camonly{display:none!important}.pick{grid-template-columns:1fr}}

/* Map zoom buttons (design/opus-2026-11-01-map-zoom.md) */
.leaflet-control-zoom.cgzoom{border:1px solid rgba(255,255,255,.6)!important;border-radius:24px;overflow:hidden;background:var(--glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 8px 24px rgba(16,20,36,.22);margin:0 16px 12px 0}
.leaflet-control-zoom.cgzoom a{width:48px;height:48px;display:grid;place-items:center;background:transparent;color:var(--ink);border:0;border-radius:0;transition:background .12s,transform .12s,color .12s}
.leaflet-control-zoom.cgzoom a+a{border-top:1px solid var(--line)}
.leaflet-control-zoom.cgzoom a:hover{background:rgba(36,31,27,.06)}
.leaflet-control-zoom.cgzoom a:focus-visible{outline:2px solid var(--chile);outline-offset:-4px;border-radius:24px}
.leaflet-control-zoom.cgzoom a:active{transform:scale(.94);color:var(--chile)}
.leaflet-control-zoom.cgzoom a.leaflet-disabled{background:transparent;color:var(--ink);opacity:.35;cursor:default}
html.night .leaflet-control-zoom.cgzoom{background:rgba(24,33,61,.85);border-color:rgba(255,255,255,.12)!important}
html.night .leaflet-control-zoom.cgzoom a{color:#F3EBDD}
html.night .leaflet-control-zoom.cgzoom a+a{border-top-color:rgba(255,255,255,.12)}
@media (prefers-reduced-motion:reduce){.leaflet-control-zoom.cgzoom a{transition:none}}

/* ---------- Snap, stream, events (snap.js; design/ugc-2026-11-01-snap.md) ---------- */
.snapbtns{display:grid;gap:10px;margin:16px 16px 0}
.snapbtn{min-height:60px;font-size:17px;cursor:pointer;justify-content:flex-start;padding:0 22px}
.snapbtn .i{width:24px;height:24px}
.snapterms h3{font-size:20px}.snapterms .blist li{margin:6px 0;font-size:15px;line-height:22px}
.snapcard{margin:16px 16px 0;background:var(--paper);border-radius:20px;box-shadow:var(--shadow);overflow:hidden}
.snapimg{background:var(--dune);max-height:60vh;display:grid;place-items:center}.snapimg img{max-width:100%;max-height:60vh;display:block;object-fit:contain}
.snapst{display:flex;align-items:center;gap:10px;padding:14px 16px;font-size:16px;line-height:22px;border-bottom:1px solid var(--line)}
.snapst .i{width:22px;height:22px;color:var(--jun);flex:none}.snapst a{color:var(--jun);font-weight:700}
.snapspin{width:18px;height:18px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--chile);animation:spin 1s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.snapspin{animation:none;border-top-color:var(--line)}}
.snapev{display:grid;gap:2px;padding:12px 16px 0}.snapev b{font-family:var(--serif);font-size:19px}.snapev span{font-size:14px;color:var(--dust)}
.snapcap{display:flex;gap:8px;padding:12px 16px 0}.snapcap input{flex:1;min-width:0;min-height:48px;padding:0 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--sand);color:var(--ink);font:inherit;font-size:16px}
.snapacts{display:flex;gap:10px;flex-wrap:wrap;padding:12px 16px 16px}.snapacts .btn{flex:1;min-width:140px}
#refile .form{margin:0 16px 16px}
.newpill{position:sticky;top:calc(10px + env(safe-area-inset-top));z-index:20;display:block;margin:10px auto 0;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:var(--chile);color:#fff;font:700 14px/1 var(--sans);box-shadow:0 6px 18px rgba(36,31,27,.3);cursor:pointer}
.newpill[hidden]{display:none}
.stream{display:grid;gap:14px;padding:14px 16px 0}
.scard{background:var(--paper);border-radius:20px;box-shadow:var(--shadow);overflow:hidden}
.simg{display:block;background:var(--dune)}.simg img{width:100%;height:auto;display:block;max-height:80vh;object-fit:cover}
.sb{padding:12px 14px 14px}.splace{font-family:var(--serif);font-weight:700;font-size:19px;color:var(--ink);text-decoration:none}.sb p{font-size:15px;line-height:21px;margin-top:4px}.sb .credit{margin-top:6px}
@media (min-width:900px){.stream{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media (min-width:1280px){.stream{grid-template-columns:repeat(3,minmax(0,1fr))}}
.evrow .evwhen{font:700 12px/16px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dusk-ink,var(--dusk));margin-bottom:2px}
.evstrip{display:flex;align-items:center;gap:14px;margin:12px 16px 0;min-height:72px;padding:0 16px;border-radius:20px;background:var(--paper);box-shadow:var(--shadow);color:var(--ink);text-decoration:none}
.evstrip>.i:first-child{width:28px;height:28px;flex:none;color:var(--dusk-ink,var(--dusk))}.evstrip div{flex:1;min-width:0}.evstrip b{display:block;font-family:var(--serif);font-size:17px;line-height:22px}.evstrip span{display:block;font-size:13px;color:var(--dust);margin-top:2px}.evstrip>.i:last-child{flex:none;color:var(--dust)}
body.scenic .evstrip{background:var(--glass);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border:1px solid rgba(255,255,255,.6)}
html.night body.scenic .evstrip{border-color:rgba(255,255,255,.14)}
.flyer{display:block;border-radius:16px;overflow:hidden;background:var(--dune);box-shadow:var(--shadow)}.flyer img{width:100%;height:auto;display:block;max-height:70vh;object-fit:contain}
html.night .snapst .i,html.night .snapst a,html.night .fck a{color:var(--jun-ink)}

/* Multi-photo upload (v1700) and the Spiritual Centers strip photo */
.snapsum{margin:16px 0 0;font-size:15px;color:var(--dust)}
.snaplist{display:grid;gap:12px}
.snapcard.multi{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:start}
.snapcard.multi .snapimg{grid-row:span 3;max-height:none;height:100%;min-height:96px}.snapcard.multi .snapimg img{width:96px;height:100%;max-height:none;object-fit:cover}
.snapcard.multi .snapst{border-bottom:0;font-size:15px;padding:12px 14px}.snapcard.multi .snapmeta,.snapcard.multi .refile{grid-column:2}
.snapcard.multi .snapcap{padding:0 14px}.snapcard.multi .snapacts{padding:10px 14px 14px}
.snapcard.skip{opacity:.78}.snapcard.skip .snapst .i,.uprow.skip .i{color:var(--dust)}.snapcard.bad .snapst .i,.uprow.bad .i{color:var(--chile)}
.snapmore{padding:16px}
.prev.multi{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:6px;background:none}.prev.multi img{aspect-ratio:1;object-fit:cover;border-radius:10px;max-height:none}
.uplist{display:grid;gap:8px;margin-top:12px}
.uprow{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:center;padding:6px;border-radius:14px;background:var(--sand)}.uprow img{width:56px;height:56px;object-fit:cover;border-radius:10px}
.upst{display:flex;align-items:center;gap:8px;font-size:15px;line-height:20px}.upst .i{width:20px;height:20px;flex:none;color:var(--jun)}
.uprow.skip{opacity:.78}

.credwrap{margin:8px 16px 0}
.credbtn{background:rgba(24,33,61,.62);color:#fff;border:0;border-radius:999px;font:600 13px/18px var(--sans);padding:6px 14px;min-height:32px;cursor:pointer}
.credtile{position:relative;background:rgba(24,33,61,.72);color:#fff;border-radius:14px;padding:10px 44px 10px 12px}.credtile .credit{color:#fff;margin:0}
.credx{position:absolute;top:4px;right:4px;width:36px;height:36px;display:grid;place-items:center;background:none;border:0;color:#fff;cursor:pointer;border-radius:50%}.credx .i{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.4}
.credbtn:focus-visible,.credx:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* Today's view credit close button (v1700) */

/* Account control, top right (v1700) */
.acct{position:fixed;z-index:60;top:calc(10px + env(safe-area-inset-top));right:max(12px,calc(50% - 300px))}
body.onmap .acct,body.is3d .acct{display:none}
.acctbtn{display:inline-flex;align-items:center;max-width:46vw;min-height:36px;padding:0 14px;border:0;border-radius:999px;background:rgba(24,33,61,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:600 13px/18px var(--sans);text-decoration:none;cursor:pointer}
.acctbtn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acctbtn:focus-visible,.acctmenu :focus-visible{outline:2px solid #fff;outline-offset:2px}
.acctmenu{position:absolute;right:0;top:calc(100% + 6px);min-width:160px;background:var(--paper);border-radius:14px;box-shadow:var(--shadow);padding:6px;display:grid}
.acctmenu[hidden]{display:none}
.acctmenu>*{display:block;text-align:left;min-height:44px;padding:0 12px;border:0;background:none;border-radius:10px;color:var(--ink);font:500 15px/44px var(--sans);text-decoration:none;cursor:pointer}
.acctmenu>*:hover{background:var(--sand)}
body.scenic .snapsum{color:#F4F6FB;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.snapcard.multi .snapacts .btn{min-width:0}

/* v1820: card photo focus vars, desktop photo panel, 44px Today's view X */

/* v1830: Spiritual Centers is a home tile like Eat & Shop. Phones: 5th tile spans both columns at 2:1. Desktop: 5 columns. */
@media (max-width:899px){.tile.t-sac{grid-column:1/-1}.tile.t-sac .media{aspect-ratio:2/1}}
@media (min-width:900px){.tiles{grid-template-columns:repeat(5,minmax(0,1fr))}}
/* v1835: solid secondary photo buttons over the scenic background; Today's view chip leaves room for its X */
.snapbtn.btn.ghost,.pick .btn.ghost{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line),var(--shadow)}
/* v1835: text that sat directly on the scenic photo on Snap, Latest and Events gets a readable card */
body.scenic :is(#snapbody,#streambody,#evbody,#evpage)>p.small,body.scenic #snapbody .snapsum,body.scenic .snapbtns+p.small{background:var(--paper);color:var(--ink)!important;text-shadow:none!important;margin-left:16px;margin-right:16px;padding:12px 14px;border-radius:14px;box-shadow:var(--shadow)}
body.scenic #evbody>p.small{margin:0}
body.scenic :is(#snapbody,#streambody,#evbody,#evpage)>p.small a{color:var(--jun)}
html.night body.scenic :is(#snapbody,#streambody,#evbody,#evpage)>p.small a{color:var(--jun-ink)}

/* v1840: home stat cards are links */
a.fact{text-decoration:none;color:inherit;cursor:pointer;transition:transform .12s}
a.fact span::after{content:" \203A";font-weight:700;color:var(--chile)}
a.fact:active{transform:scale(.97)}a.fact:focus-visible{outline:2px solid var(--chile);outline-offset:2px}

/* v1855: History entry highlight and All history link */
.ev.flash .card{box-shadow:0 0 0 3px var(--chile),var(--shadow);transition:box-shadow .3s}
.btn.allh{display:inline-flex;gap:6px;align-items:center;margin-top:12px}

/* v1945: dark mode keeps the photo background (body was painting over #bg); tile icons reach 3:1 on dark glass */
html.night body.scenic{background:transparent}
html.night .tile.t-eat .lab .i:first-child{color:#F2946B}
html.night .tile.t-exp .lab .i:first-child{color:#E9C46A}
html.night .tile.t-his .lab .i:first-child{color:#A8C49A}
html.night .tile.t-map .lab .i:first-child{color:#8FC3D9}
html.night .tile.t-sac .lab .i:first-child{color:#D7A6C9}
/* v2030: /stream reserves a screen of height until the first page arrives so the footer does not jump (QA CLS 0.1185 at 1280) */
.stream.loading{min-height:100svh}
/* v2030: no top-right 'Log in' link while a sign-in form is already on the page (signed-out only; the signed-in email menu stays) */
body:has(#f-signin) .acct a.acctbtn{display:none}
/* v2100: photo background on every page except maps and 3D (Opus spec, web/design/opus-2026-11-01-v2100-scenic-default.md).
   Text never sits on the bare photo: long text goes in one near-solid reading panel; labels get dark glass pills. */
:root{--panel:rgba(255,250,242,.96)}html.night{--panel:rgba(31,41,72,.96)}
body.scenic :is(.terms,p.lede,ul.blist.pad,.nf,.rows>p.small,.medrow>p.credit){background:var(--panel);color:var(--ink);border-radius:20px;box-shadow:0 8px 24px rgba(16,20,36,.22);margin-left:16px;margin-right:16px}
body.scenic :is(.terms,.nf){padding:20px}
body.scenic :is(p.lede,ul.blist.pad,.rows>p.small){padding:14px 18px;margin-top:12px}
body.scenic .medrow>p.credit{padding:8px 12px;margin-top:8px}
body.scenic .ev>p.lede.dk{color:var(--ink)}
@media (min-width:900px){body.scenic .terms{max-width:760px;margin-left:auto;margin-right:auto;padding:40px 48px}}
body.scenic .tl .ev>.yr{display:inline-block;background:var(--glassd);color:#FFD9A0!important;padding:2px 12px;border-radius:12px;text-shadow:none}
body.scenic .tl .ev>.yr.nd{color:#E9EDF6!important}
body.scenic a.btn.ghost{background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line),0 6px 18px rgba(16,20,36,.22)}
html.night body.scenic :is(.terms,p.lede,ul.blist.pad,.nf,.rows>p.small,.medrow>p.credit){color:var(--ink)}
@media (prefers-reduced-transparency:reduce){:root{--panel:#FFFAF2}html.night{--panel:#1F2948}}
/* v2100: support line stays on one line where it fits and wraps word by word on narrow phones; tap area kept by padding */
.sup a{display:inline;line-height:inherit;margin:0;padding:13px 2px;min-height:0}
/* Feedback form */
.fl textarea{width:100%;min-height:140px;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--sand);color:var(--ink);font:inherit;font-size:16px;line-height:1.45;resize:vertical}
.fl textarea:focus-visible{outline:3px solid var(--sun);outline-offset:1px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
#f-feedback>.btn.ghost{margin-top:12px}
/* v2100 contrast fixes found by the route audit (dark mode) */
html.night .chip.on em{color:#141B33}
html.night .pill{background:rgba(31,41,72,.94);color:#F1F3F9;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
html.night .btn.jun{color:#141B33}
html.night .kicker[style*="--dusk"]{color:#D7A6C9!important}
body.scenic main>.pad.signing{background:var(--panel);margin:100px 16px 0;padding:20px!important;border-radius:20px;box-shadow:0 8px 24px rgba(16,20,36,.22)}
/* v2100: account/sign-in header has no back button, so no side gutters; reserve the form's height so the footer does not shift on cold load */
.banner.acch{padding-left:20px;padding-right:20px;padding-top:calc(60px + env(safe-area-inset-top))}
#accbody{min-height:400px}
/* v2100: background credit pill under page titles wraps instead of being cut off */
html.night body .btn.jun{color:#141B33!important}
/* v2100: compact photo credits (source name button + hidden attribution panel) */
.ccbtn{display:inline-flex;align-items:center;gap:2px;min-height:28px;padding:2px 8px 2px 10px;margin:-2px 0;border:0;border-radius:999px;background:rgba(36,31,27,.08);color:inherit;font:600 12px/16px var(--sans);cursor:pointer;position:relative}
.ccbtn::after{content:"";position:absolute;inset:-8px -2px}
.ccbtn .i{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;transition:transform .15s}
.ccbtn[aria-expanded="true"] .i{transform:rotate(180deg)}
.ccbtn:focus-visible{outline:2px solid var(--chile);outline-offset:2px}
.ccpanel{display:block;margin-top:6px;padding:8px 10px;border-radius:10px;background:var(--panel,rgba(255,250,242,.96));color:var(--ink);box-shadow:0 4px 14px rgba(16,20,36,.18);font-size:12px;line-height:17px}
.ccpanel[hidden]{display:none!important}
.ccpanel a{color:inherit;text-decoration:underline}
html.night .ccbtn{background:rgba(255,255,255,.12)}
html.night .ccbtn:focus-visible{outline-color:#F0875E}
@media (prefers-reduced-motion:reduce){.ccbtn .i{transition:none}}
/* v2110: History year strip has no band; the solid year chips float over the photo and stay sticky for jumping */
body.scenic .years,html.night body.scenic .years{background:transparent!important;box-shadow:none!important}
body.scenic .years a:not(.on){box-shadow:inset 0 0 0 1.5px rgba(36,31,27,.16),0 4px 12px rgba(16,20,36,.25)}
/* v2120: upload result cards show the whole photo (no crop) and open a full-screen viewer */
.snapimg{position:relative;width:100%;padding:0;border:0;cursor:zoom-in;font:inherit;color:inherit}
.snapcard.multi{display:block}
.snapcard.multi .snapimg{height:auto;min-height:0;max-height:none;background:#10141f}
.snapcard.multi .snapimg img{width:100%;height:auto;max-height:44vh;object-fit:contain;margin:0 auto}
.snapzoom{position:absolute;right:10px;bottom:10px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(16,20,36,.72);color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.snapzoom .i{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2}
.snapimg:focus-visible{outline:3px solid var(--sun);outline-offset:-3px}
.lbox{position:fixed;inset:0;z-index:3000;background:#05070c;display:flex;flex-direction:column}
.lbimg{flex:1;min-height:0;overflow:auto;display:grid;place-items:center;touch-action:pinch-zoom pan-x pan-y;cursor:zoom-in}
.lbimg img{max-width:100vw;max-height:100%;object-fit:contain;display:block}
.lbimg.zoom{place-items:start;cursor:zoom-out}.lbimg.zoom img{max-width:none;max-height:none;width:200vw}
.lbbar{display:flex;gap:10px;justify-content:center;padding:12px 16px calc(16px + env(safe-area-inset-bottom));background:rgba(16,20,36,.92)}
.lbbar .btn{min-height:48px}
.lbbar .btn.ghost{background:#FFFAF2;color:#241F1B}
.lbx{position:absolute;top:calc(12px + env(safe-area-inset-top));right:12px;width:48px;height:48px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(16,20,36,.8);color:#fff;box-shadow:0 0 0 1.5px rgba(255,255,255,.5);cursor:pointer}
.lbx .i{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.4}.lbx:focus-visible{outline:3px solid #fff;outline-offset:2px}
body.lbopen{overflow:hidden}body.lbopen .acct,body.lbopen .tabbar{display:none}
/* Account pill: shows the name (or 'Account'), not the full email; fades away once you scroll so it never covers content */
.acct{transition:opacity .2s,transform .2s}body.scrolled .acct{opacity:0;transform:translateY(-8px);pointer-events:none}
.acctmenu .acctwho{display:block;padding:8px 14px;font-size:12px;color:var(--dust);max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (prefers-reduced-motion:reduce){.acct{transition:none}}
body.scrolled .acct{visibility:hidden;transition:opacity .2s,transform .2s,visibility 0s .2s}
.snapimg{background:none;-webkit-appearance:none;appearance:none}
.lbx{-webkit-appearance:none}
/* v2150 QA fixes (design: design/opus-2026-11-01-v2150-qa-fixes.md) */
.pg.next,html.night .pg.next,body.scenic .pg.next{background:#3E5B3F;color:#fff;border:1px solid rgba(255,255,255,.35);box-shadow:0 8px 24px rgba(16,20,36,.22)}
html.night .pg.next .k{color:#CFE0C8}
@media (max-width:899px){.dhero .topbar{right:auto;left:72px}}
@media (min-width:900px){.acct{right:12px}body:not(.home):not(.onmap):not(.is3d) main{margin-top:60px}}
body.scenic main{overflow-x:clip}
@media (max-width:899px){.years{top:env(safe-area-inset-top,0)}}
.years a[aria-current]{background:var(--chile);color:#fff;box-shadow:none}
html.night .years a.on,html.night .years a[aria-current]{background:#F2B64B;color:#18213D;font-weight:900;box-shadow:0 0 0 2px #F2B64B}
.lbimg{display:flex;align-items:center;justify-content:center}
.lbimg img{max-width:100%;max-height:100%;width:auto;height:auto}
.lbimg.zoom{display:block}.lbimg.zoom img{max-width:none;max-height:none}
.lbimg.nozoom{cursor:default}
.lbimg:not(.zoom){touch-action:pan-y pinch-zoom}
.lbnav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(16,20,36,.8);color:#fff;box-shadow:0 0 0 1.5px rgba(255,255,255,.5);cursor:pointer;-webkit-appearance:none}
.lbnav .i{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.4}
.lbnav[disabled]{opacity:.35;cursor:default}.lbnav:focus-visible{outline:3px solid #fff;outline-offset:2px}
.lbprev{left:12px}.lbnext{right:12px}
.lbcount{position:absolute;top:calc(24px + env(safe-area-inset-top));left:16px;padding:4px 10px;border-radius:999px;background:rgba(16,20,36,.8);color:#fff;font:600 13px/18px var(--sans)}
.accnote{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:var(--paper);color:var(--ink);font-weight:600}
/* Captions are alt text only; photos larger (design/opus-2026-11-01-v2160-photos-larger.md) */
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.vgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.vp>a{aspect-ratio:4/3}
.vgrid:has(>.vp:only-child){grid-template-columns:1fr}.vgrid>.vp:only-child>a{aspect-ratio:16/9}
@media (max-width:899px){.vgrid>.vp:first-child:nth-last-child(odd):not(:only-child){grid-column:1/-1}.vgrid>.vp:first-child:nth-last-child(odd):not(:only-child)>a{aspect-ratio:16/9}}
@media (min-width:900px){.vgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.vgrid>.vp:only-child>a{max-height:480px}}
.row{grid-template-columns:128px 1fr 20px;min-height:148px;align-items:center}.row .media{width:128px}
@media (min-width:900px){.row{grid-template-columns:160px 1fr 20px;min-height:180px}.row .media{width:160px}}
.feed .fcard{width:min(82vw,340px)}
@media (min-width:900px){.feed .fcard{width:auto}}
.fcard h3{font-size:15px;font-weight:600}
/* Page pinch-zoom is allowed (Issac, Nov 1 2026). The map, 3D view and photo viewer take their own gestures (touch-action:none on those elements only). */
.lbimg,.lbimg:not(.zoom){touch-action:none}
/* Prerendered crawlable text (tools/prerender.mjs): shown only without JS; the app renders the same content over it */
.js .pre{display:none}
.pre{padding:24px 20px;max-width:640px;margin:0 auto;font:16px/1.5 var(--sans);color:var(--ink)}.pre a{color:inherit}
/* Photo page (/photo/<id>) */
.phhero{padding:64px 16px 0}.phimg{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.phimg img{display:block;width:100%;height:auto;max-height:78svh;object-fit:contain;background:#05070c}
@media (min-width:900px){.phhero{max-width:960px;margin:0 auto}}

.phgo{margin:20px 0 32px}

/* Auth chip (top right, ~46px tall) stays put; header text and art start below it. */
.banner{padding-top:calc(56px + env(safe-area-inset-top))}
.banner .art{top:calc(56px + env(safe-area-inset-top))}
.lbnav{touch-action:none}
/* v2170: source lines ("From the business website") are one plain linked line, 8px below the value; photo page credit is plain text */
.credit.srcline{margin-top:8px;font-size:12px;line-height:16px}
.info .v+.credit{margin-top:8px}
.phcred{overflow-wrap:normal;word-break:normal}
/* v2170: back button pinned to the viewport's top-left and the camera button to its bottom-right on wide screens; on phones the page ends above the camera button so it never covers the footer */
@media (min-width:900px){.back{top:calc(16px + env(safe-area-inset-top));left:calc(16px + env(safe-area-inset-left))}}
/* v2180 (QA + Opus receipts in design/opus-2026-11-01-*.md) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.phph{width:100%;max-height:78svh;background:rgba(5,7,12,.5);cursor:default}
.phpage .dt h1{min-height:1.2em}
.phnf{background:var(--panel);color:var(--ink);border-radius:20px;box-shadow:0 8px 24px rgba(16,20,36,.22);margin:72px 16px 0;padding:24px}
.phnf h1{font-family:var(--serif);font-size:24px;line-height:30px;margin-bottom:8px}
html.night .phnf{color:var(--ink)}
.tabbar a{white-space:nowrap}
.fcard .credit{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
@media (min-width:900px){.back{top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left))}}

/* v2210: last content clears the floating tab bar and camera button (--clear is measured in ugc.js). */
main{padding-bottom:var(--clear,calc(172px + env(safe-area-inset-bottom)))!important}
/* v2230: background credit is one small plain line in the footer, above Made by. */
.bgline{margin:4px 20px 0;padding-bottom:6px;font:400 12px/1.45 var(--sans);color:var(--dust);text-wrap:balance}
.bgline a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}.bgline a:focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:2px}
body.scenic .bgline{margin:0 16px;padding:8px 16px 6px;background:var(--glassd);color:#E9EDF6}
html.night .bgline{color:#DCE2F0}

/* v2240: a stop with no public location shows where and a visit note instead of GPS. */
.where{margin:12px 16px 0;padding:12px 16px;border-radius:12px;background:var(--paper);color:var(--ink);box-shadow:var(--shadow);font-size:15px;line-height:1.45}
.where .k{font:700 11px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dust);margin-bottom:6px}
.where .visit{margin-top:8px;font-weight:600}

/* v2250: the camera action lives in the top bar next to the account control (no floating button over content). Opus receipt opus-2026-11-02-camera-and-sources.md */
.acct{display:flex;align-items:center;gap:8px}
.camtop{position:relative;isolation:isolate;display:grid;place-items:center;width:44px;height:44px;margin:-4px 0;border-radius:50%;color:#fff;text-decoration:none}
.camtop::before{content:"";position:absolute;left:4px;top:4px;width:36px;height:36px;border-radius:50%;background:rgba(24,33,61,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:-1}
.camtop .i{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2}
.camtop:focus-visible{outline:2px solid #fff;outline-offset:-2px}
/* v2250: source links wrap only between words or after / - _ (never mid-word) */
.sources a{overflow-wrap:normal;word-break:normal;hyphens:manual}
/* v2270: places with no photo render text-only (no placeholder pattern) */
.medrow.noimg{align-items:center;padding-top:calc(4px + env(safe-area-inset-top));padding-left:76px;min-height:64px}
.medrow.noimg .med.lg{margin-top:0}
.medrow.noimg .k{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.8}
.nophoto{display:flex;align-items:center;gap:14px;margin:16px 16px 4px;padding:16px;border-radius:18px;background:rgba(255,250,242,.94);color:var(--ink);border:2px dashed rgba(61,58,54,.35);text-decoration:none;box-shadow:0 2px 10px rgba(0,0,0,.12)}
.nophoto b{display:block;font-size:18px}.nophoto b+span{font-size:15px;opacity:.8}
.npcam{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--chile,#C4471D);color:#fff}.npcam .i{width:26px;height:26px}
html.night .nophoto{background:rgba(31,41,72,.94);color:#F1F3F9;border-color:rgba(241,243,249,.35)}
.card.noimg .b{padding-top:16px}
/* v2270: the floating back button hides while scrolling on phones, like the Log in pill, so it never sits over body text */
@media (max-width:899px){.back{transition:opacity .2s,transform .2s,visibility 0s}body.scrolled .back{opacity:0;transform:translateY(-8px);pointer-events:none;visibility:hidden;transition:opacity .2s,transform .2s,visibility 0s .2s}}
/* v2270: story body and sources cards line up with the title card and keep inner padding */
body.scenic .ev>p.lede{padding:14px 18px!important;margin:12px 0 0!important}
body.scenic div.pad>ul.sources{margin-left:0!important;margin-right:0!important}
body.scenic .pad .sources{padding:10px 18px}
.sources li:last-child a{border-bottom:0}
body:has(.nophoto) .camtop{display:none}
.medrow.noimg .k{background:rgba(31,41,72,.88);color:#fff;padding:6px 12px;border-radius:999px;opacity:1}
/* v2280: photo captions use the 18px card inset (Opus note) */
body.scenic .capbar .credit{padding:6px 18px}
body.scenic .medrow>p.credit{padding:8px 18px}
/* v2290: captions (viewer, feed cards, inline edit) and the admin stop form. Opus design: design/opus-2026-11-02-captions-stops.md */
.phcap{font:400 17px/24px var(--sans);margin:6px 0 4px;overflow-wrap:normal;word-break:normal;hyphens:none}
.phcredrow{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px}
.phcredrow .credit{margin:0}
.linkbtn{background:none;border:0;padding:10px 4px;min-height:44px;font:600 15px/20px var(--sans);color:var(--jun);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
html.night .linkbtn{color:var(--jun-ink)}
.linkbtn.danger{color:var(--chile,#C4461E)}
.capedit{flex:none;white-space:nowrap}
.capform textarea{width:100%;min-height:84px;font:400 17px/24px var(--sans);padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--card,#fff);color:var(--ink);resize:vertical;box-sizing:border-box}
.caprow{display:flex;justify-content:space-between;gap:8px;min-height:20px;margin-top:4px}
.capn{font:600 12px/20px var(--sans);color:var(--dust);flex:none}.capn.near{color:var(--chile,#C4461E)}
.capacts{display:flex;align-items:center;gap:12px;margin-top:6px}
.adstop{margin-top:12px}
.stcats{border:0;padding:0;margin:0 0 14px;min-width:0}.stcats legend{font:700 13px/18px var(--sans);margin-bottom:8px}
.stcats .stchips{display:flex;flex-wrap:wrap;gap:8px}.stcats .stchip{position:relative}
.stcats .stchip input{position:absolute;opacity:0;inset:0}
.stcats .stchip span{display:inline-block;padding:8px 14px;border-radius:999px;border:1px solid var(--line);font:600 15px/20px var(--sans);background:var(--card,#fff);color:var(--ink)}
.stcats .stchip input:checked+span{background:var(--jun);color:#fff;border-color:var(--jun)}
.stcats .stchip input:focus-visible+span{outline:2px solid var(--jun);outline-offset:2px}
.sthid{margin-top:16px}
.vpadd{margin:16px 0 4px}.vpadd a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;background:var(--glass);color:var(--ink);font:600 15px/20px var(--sans);text-decoration:none}
body.scenic .vphotos>p.vpadd{background:none;box-shadow:none;padding:0 16px;margin:16px 0 4px}
/* v2290 Opus pass 1 fixes */
.vp figcaption{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 8px;overflow-wrap:normal}
.vp figcaption .cap,.vp figcaption .vpby,.vp figcaption .vplic{flex-basis:100%}.vp .rep,.vp .rep.mkp{margin-top:2px}
.vp .cap{white-space:normal;word-break:normal;hyphens:none}
.stcats legend{display:block;font:700 12px/16px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dust);padding:0;margin:0 0 6px}
html.night .stcats .stchip span{background:rgba(255,255,255,.08);color:#F1F3F9;border-color:rgba(241,243,249,.35)}
html.night .stcats .stchip input:checked+span{background:#C9DDB8;color:#14203A;border-color:#C9DDB8}
.capform textarea{border:1.5px solid var(--line);background:var(--sand)}
html.night .capform textarea{background:rgba(255,255,255,.06);color:#F1F3F9;border-color:rgba(241,243,249,.3)}
.capform{padding-bottom:8px}
.capform textarea:focus,.capform textarea:focus-visible{outline:2px solid var(--jun);outline-offset:1px;border-color:var(--jun)}html.night .capform textarea:focus,html.night .capform textarea:focus-visible{outline-color:#C9DDB8;border-color:#C9DDB8}
/* v2300: dark mode, fade out content in the gap under the floating nav (Opus v2290 note) */
html.night .tabbar::after{content:"";position:fixed;z-index:-1;left:0;right:0;bottom:0;height:calc(34px + env(safe-area-inset-bottom));background:linear-gradient(rgba(20,27,51,0),rgba(20,27,51,.92) 60%);pointer-events:none}
/* v2300: camera at the top left, beside the back button on detail pages, hidden on scroll like the account pill. History scenic chip band has no fade; chips carry their own shadow. Home tile credits live in the footer. Opus receipt opus-2026-11-02-camera-left-history-fade-tile-credits.md */
.camtop{position:fixed;z-index:60;margin:0;top:calc(10px + env(safe-area-inset-top));left:max(12px,calc(50% - 300px));transition:opacity .2s,transform .2s,visibility 0s}
body:has(main .back) .camtop{top:calc(12px + env(safe-area-inset-top));left:calc(max(16px,calc(50% - 224px)) + 52px)}
@media (min-width:900px){.camtop{top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left))}body:has(main .back) .camtop{left:calc(max(16px,env(safe-area-inset-left)) + 52px)}}
body.scrolled .camtop{opacity:0;transform:translateY(-8px);pointer-events:none;visibility:hidden;transition:opacity .2s,transform .2s,visibility 0s .2s}
@media (prefers-reduced-motion:reduce){.camtop{transition:none}}
body.onmap .camtop,body.is3d .camtop,body.lbopen .camtop{display:none}
body.scenic .years,html.night body.scenic .years{background:transparent!important;box-shadow:none!important}
body.scenic .years a:not(.on):not([aria-current]){background:rgba(255,250,242,.94);box-shadow:inset 0 0 0 1.5px rgba(36,31,27,.16),0 4px 12px rgba(16,20,36,.28)}
html.night body.scenic .years a:not(.on):not([aria-current]){background:rgba(31,41,72,.94);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18),0 4px 12px rgba(0,0,0,.4)}
body.scenic .years a.on,body.scenic .years a[aria-current]{box-shadow:0 4px 12px rgba(16,20,36,.28)}
@media (max-width:899px){body:has(.camtop) .dhero .topbar{left:124px}}
/* v2310: More photos license on its own muted line; account pill on stop pages shrinks so it never meets the Stop pill; list credits paragraph wraps prettily. Opus receipt opus-2026-11-02-v2310-photos-time-topbar-list-credits.md */
.vplic{display:block;font-size:11.5px;line-height:15px;opacity:.75}
.listcr{text-wrap:pretty}
@media (max-width:899px){body:has(.dhero .topbar) .acctbtn{max-width:max(44px,calc(100vw - 272px));min-width:0}}
@media (max-width:899px){body:has(.camtop) .dhero .topbar{left:calc(max(16px,calc(50% - 224px)) + 108px)}}
/* v2310: Account "Signed in as" card has even padding, a 12px gap above the name card, and the same width as it at every size. */
#accbody p.lede.accwho,body.scenic #accbody p.lede.accwho{padding:14px 18px;margin:12px 16px 0;font-size:17px;line-height:24px}
@media (min-width:900px){#accbody .form{margin:12px 16px 0;max-width:none}}
/* v2310: account and review photo rows keep a sized column for the Delete button (the 128px row rule had reset it to 20px and clipped it). */
@media (max-width:899px){.row.vrow,.row.rvrow{grid-template-columns:128px minmax(0,1fr) auto}.row.vrow .rep{align-self:center;margin-top:0;white-space:nowrap}}
@media (max-width:420px){.row.vrow,.row.rvrow{grid-template-columns:104px minmax(0,1fr) auto}.row.vrow .media{width:104px}}
/* v2310: Your photos is one readable list at every width (wide screens had squeezed it into thumbnail-only tiles), and the Sign out button and account note sit on a panel so they read over the photo. */
#mine.rows{grid-template-columns:minmax(0,1fr)}#mine .row.vrow{grid-template-columns:128px minmax(0,1fr) auto;align-items:center}#mine .row.vrow .rep{align-self:center;margin-top:0;white-space:nowrap}
#mine .row.vrow .media{width:128px}
body.scenic #accbody .btn.ghost{background:var(--panel);color:var(--ink)}
body.scenic #accbody>p.small.pad{background:var(--panel);color:var(--ink);border-radius:16px;margin:16px 16px 0;padding:12px 16px}
/* v2320: account pill initials mode, a 36px circle with a 44px tap area. Opus receipt opus-2026-11-02-v2320-account-initials.md */
.acctbtn.ini{width:36px;min-width:36px;max-width:36px;padding:0;justify-content:center;position:relative}.acctbtn.ini span{font-size:14px;letter-spacing:.02em;overflow:visible}
.acctbtn.ini::before{content:"";position:absolute;inset:-4px}
.adlist{list-style:none;margin:12px 0 0;padding:0;border-radius:18px;background:var(--paper);overflow:hidden}
.adlist li{border-top:1px solid var(--line)}.adlist li:first-child{border-top:0}
.adlist a{display:flex;align-items:center;gap:10px;min-height:48px;padding:14px 16px;color:var(--ink);font-weight:600;text-decoration:none}
.adlist a>span:first-child{flex:1}.adlist .i{width:18px;height:18px;color:var(--dust)}
.adtag{font-size:12px;font-weight:700;color:var(--dust);background:var(--sand);border-radius:8px;padding:3px 8px}
/* Continue with Google / Apple (Opus receipt opus-2026-11-02-social-signin.md): Google's own outline pill button, Apple white-outline in light and white in dark, both 40px and the same width, then "or", then the email form. */
.form.hassocial{max-width:400px;margin-left:max(16px,calc(50% - 200px));margin-right:max(16px,calc(50% - 200px))}@media (min-width:900px){.form.hassocial{margin-left:auto;margin-right:auto}}
.social{display:grid;gap:12px;margin-top:4px}.social.busy{pointer-events:none;opacity:.5}
.gbtn{min-height:40px;display:flex;justify-content:center}
.applebtn{display:flex;align-items:center;justify-content:center;position:relative;height:40px;border-radius:20px;background:#fff;color:#000;border:1px solid #000;text-decoration:none;font:500 15px/1 -apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif}
.applebtn .alogo{position:absolute;left:12px;width:14px;height:16px}
.applebtn:focus-visible{outline:2px solid var(--chile);outline-offset:2px}
html.night .applebtn{border-color:#fff}
.ordiv{display:flex;align-items:center;gap:12px;margin:8px 0 0;color:var(--dust);font-size:14px}.ordiv::before,.ordiv::after{content:"";flex:1;height:1px;background:currentColor;opacity:.35}
.fmsg.err{color:var(--chile-d,#A33A16)}
.social{justify-items:center}.gbtn,.applebtn{width:min(100%,320px);box-sizing:border-box}

/* v2350: a photo whose file is gone keeps its box (no layout jump), card title and byline stay. Opus receipt design/opus-2026-11-02-v2350-photo-unavailable.md */
.pgone{display:grid!important;text-decoration:none;place-items:center;background:var(--sand);pointer-events:none}.pgone img{visibility:hidden;position:absolute}.pgone .gonemsg{font:500 14px/20px var(--sans);color:var(--dust);text-align:center;padding:0 16px}
/* v2360: admin places list and publish rule (design/opus-2026-11-02-admin-places.md) */
.adln{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.adln small{font-weight:400;overflow-wrap:anywhere}
.adpills{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.adpills .pill{min-height:26px;font-size:12px;box-shadow:none}
.adpills .pill.pub{background:rgba(74,110,70,.16);color:var(--ink)}.adpills .pill.draft{background:rgba(120,110,100,.16);color:var(--ink)}.adpills .pill.noloc{background:transparent;box-shadow:inset 0 0 0 1px #B7791F;color:var(--ink)}
html.night .adpills .pill.pub{background:rgba(140,190,130,.2);color:#F1F3F9}html.night .adpills .pill.draft{background:rgba(255,255,255,.12);color:#F1F3F9}html.night .adpills .pill.noloc{color:#F1F3F9;box-shadow:inset 0 0 0 1px #E0A44A}
.stpub input:disabled+span{opacity:.6}.fhint.warn{color:#9A5B00}html.night .fhint.warn{color:#E0A44A}.stpub small{display:block;font-weight:400}
/* QA minor 1: the Google iframe paints an opaque white box when its parent is in a dark color scheme */
#gbtn{color-scheme:light}
/* v2390: list bullets sit inside their card (Opus spec, web/design/opus-2026-11-02-card-list-bullets.md). The scenic card padding shorthand had reset the list indent, so native outside discs hung on the card edge. */
:is(body.scenic ul.blist.pad,.terms .blist,.etq ul){list-style:none}
body.scenic ul.blist.pad{padding:14px 18px}
.terms .blist,.etq ul{padding-left:0}
:is(body.scenic ul.blist.pad,.terms .blist,.etq ul) li{position:relative;padding-left:16px}
:is(body.scenic ul.blist.pad,.terms .blist,.etq ul) li::before{content:"";position:absolute;left:1px;top:calc(.5lh - 3px);width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.55}
/* v2410 admin place form: button gap, local knowledge, photos (design/opus-2026-11-02-v2410-place-form.md) */
.adacts{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.adacts .btn{min-height:44px}
.adacts .btn[aria-disabled=true]{opacity:.5;pointer-events:none}
.stform .stlocal{margin-top:-8px}
.stform .stbhint{margin-top:8px}
.stphotos .pick{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.stchoose{cursor:pointer}
.stphl{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:12px}
.stphl:empty{display:none}
.stph{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;padding:10px;border-radius:12px;background:var(--sand)}
.stph img{width:72px;height:72px;object-fit:cover;border-radius:8px;flex:none}
.stph textarea{flex:1;min-width:0;min-height:72px}
.stph .stphx{width:44px;height:44px;padding:0;justify-content:center;font-size:22px;flex:none}
.stph .ferr{flex-basis:100%}
html.night .stph{background:rgba(255,255,255,.06)}
html.night .stph img{box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.srclocal{margin-top:4px}
.stphotos{border:0;padding:0;margin:0 0 14px;min-width:0}
.stphotos legend{display:block;font:700 12px/16px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dust);padding:0;margin:0 0 6px}

/* v2430: credit for a visitor cover photo sits on the hero, so swapping it in never pushes the page down */
.dhero{position:relative}.dhero .vcred{position:absolute;left:16px;bottom:12px;margin:0;font-size:12px;line-height:18px;background:var(--glass);color:var(--ink);border-radius:10px;padding:6px 12px}
/* v2440: feed card title to byline gap matches photo to title (10px); no empty caption line (Opus web/design/opus-2026-11-02-feed-gap-add-event.md) */
.fcard h3{margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fcard .b .credit{margin-top:10px}
/* v2440: hero credit chip hides when the cover photo fails */
.dhero:has(.pgone) .vcred{display:none}
/* v2440: Add event */
.evadd{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 16px 0}.evadd .btn{min-height:48px}
.evform .opt{font-style:normal;font-weight:400;opacity:.75;text-transform:none;letter-spacing:0}
.evtimes{display:grid;grid-template-columns:1fr 1fr;gap:12px}.evth{margin-top:-6px}
.evform textarea{width:100%;min-height:120px;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--sand);color:var(--ink);font:inherit;font-size:16px;resize:vertical}
.evform .evcount{display:block;text-align:right;font-weight:400}.evform .evcount.over{color:var(--chile-d)}
.evform .fhint{display:block;font:400 12px/16px var(--sans);font-style:normal;color:var(--dust);margin-top:4px}
.evform .ferr{display:block;font:400 13px/18px var(--sans);font-style:normal;color:var(--chile-d)}.evform .ferr:empty{display:none}
.evform .fl.bad input,.evform .fl.bad textarea{border-color:var(--chile)}
.evform .adbtns{display:grid;gap:10px}
.evdone{justify-items:start}.evdone>.i{width:32px;height:32px;color:var(--jun)}.evdone .adbtns{display:flex;gap:10px;flex-wrap:wrap}
html.night .evform :is(input,textarea),.dark .evform :is(input,textarea){color-scheme:dark}
html.night .evform :is(.fhint,.opt){color:#AEB6CC}
/* v2440: content photos open the full-screen viewer */
.lbable{cursor:zoom-in}.lbable:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
/* v2441: feed cards end right after the byline (no stretch to the tallest card; Issac t407u). Opus web/design/opus-2026-11-02-feed-no-gap.md */
.feed{align-items:flex-start}

/* v2460: equal-height feed cards (Issac): 1-line title, always 1 caption line (muted fallback), byline 10px under. Opus web/design/opus-2026-11-02-v2460-feed-cards.md */
.fcard h3{line-height:20px;height:20px;white-space:nowrap;text-overflow:ellipsis;display:block;-webkit-line-clamp:unset}

/* v2480 offline-app card, shown only when a store listing exists (design/opus-2026-11-02-v2480-offline-cta.md) */
.appcta{margin:40px 16px 24px;padding:24px 20px;background:#FFFAF2;border:1px solid #E6D5BC;border-left:4px solid #C4461E;border-radius:20px;max-width:560px}
@media (min-width:600px){.appcta{margin-inline:auto;padding:28px}}
.appcta-eb{margin:0 0 6px;font:600 13px/1.3 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:#9E3612}
.appcta h2{margin:0 0 8px;font:600 26px/1.15 var(--serif);color:#241F1B}
.appcta-body{margin:0 0 20px;font-size:16px;line-height:1.5;color:#6B5F53}
.appcta-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;font-size:17px;font-weight:600;border-radius:12px;text-decoration:none}
@media (min-width:600px){.appcta-btn{width:auto;padding-inline:28px;display:inline-flex}}
.appcta-btn:hover{background:#9E3612}.appcta-btn:active{transform:scale(.98)}
.appcta-btn:focus-visible{outline:3px solid #F2A93B;outline-offset:3px}
.appcta-price{margin:12px 0 0;font-size:15px;line-height:1.4;font-weight:600;color:#241F1B}
.appcta-free{margin:4px 0 0;font-size:14px;line-height:1.4;color:#6B5F53}
body.scenic .appcta{background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-left:4px solid #C4461E}
html.night .appcta,body.dark .appcta{background:#1F2948;border-color:#2E3A60;border-left-color:#F2A93B}
html.night .appcta-eb,body.dark .appcta-eb{color:#F2A93B}
html.night :is(.appcta h2,.appcta-price),body.dark :is(.appcta h2,.appcta-price){color:#F1F3F9}
html.night :is(.appcta-body,.appcta-free),body.dark :is(.appcta-body,.appcta-free){color:#C3C9DA}
.offbar{position:fixed;left:12px;right:12px;bottom:calc(80px + env(safe-area-inset-bottom));z-index:1050;max-width:456px;margin:0 auto;display:flex;align-items:center;gap:8px;min-height:72px;padding:12px 8px 12px 16px;background:#241F1B;color:#FFFAF2;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.28);transform:translateY(calc(100% + 100px));transition:transform .25s ease-out}
.offbar.on{transform:none}
.offbar p{margin:0;flex:1;font:15px/1.35 var(--sans)}
.offbar a{flex:none;min-height:44px;padding:0 16px;display:flex;align-items:center;background:#C4461E;color:#fff;border-radius:999px;font:600 15px var(--sans);text-decoration:none;white-space:nowrap}
.offbar button{flex:none;width:44px;height:44px;border:0;background:none;color:#FFFAF2;font-size:22px;cursor:pointer}
html.night .offbar{background:#F1F3F9;color:#141B33}html.night .offbar button{color:#141B33}
@media (prefers-reduced-motion:reduce){.offbar{transition:none}}
/* v2520: a story with no photo is text only across the full card (Issac: no placeholder on the Home story card) */
.story.noimg{grid-template-columns:minmax(0,1fr);min-height:0;padding:14px 16px}
/* v2520: history card title is the link (the card no longer poses as one); it reads as the heading */
.ev h2 a.evt{color:inherit;text-decoration:none}.ev h2 a.evt:focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:4px}