/* Townline Editorial — de-boxing layer (founder request 2026-10-06: "get rid of all the whitebox borders and
   ugliness", "less boxy and static", "are photos supposed to be blurred out behind titles?").
   Loaded on every /townline/ page right after townline-fresh.css by scripts/inject-townline-fresh.mjs.
   Keeps the Townline floral palette (cream paper, cedar ink, blossom / lake accents). Styling only: no copy,
   prices, offers, legal text or links are touched. Rollback: delete this file's injection (one line in the injector).
   Rules: no blur anywhere; no white cards, outlines or heavy shadows; photos are sharp, full-bleed, with a dark
   gradient scrim at the bottom where a title sits; content blends into the page; motion respects reduced-motion. */
html body.tlf{--tle-paper:#fffaf1;--tle-paper-2:#fbf3ea;--tle-ink:#1f2a24;--tle-ink-2:#3a4841;--tle-accent:#8c1d4d;--tle-lake:#0a6670;
  --tle-scrim:linear-gradient(180deg,rgba(12,26,34,0) 30%,rgba(12,26,34,.42) 62%,rgba(12,26,34,.88) 100%);
  --tle-ease:cubic-bezier(.2,.7,.2,1);background:var(--tle-paper)!important}
/* the fixed, washed-out photo behind the whole page is gone (Fresh ::before and place-photography's body photo) */
html body.tlf::before{display:none!important;background:none!important}
@font-face{font-family:"TL Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format("woff2")}
html body.tlf{font-family:"TL Inter",Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
/* bare utility pages (no .wrap / sections) still get page margins */
html body.tlf>main:not(:has(.wrap,section,.hero,header)){width:min(1100px,calc(100% - 40px));margin:clamp(28px,5vw,64px) auto}
html body.tlf .tlf-herofill .tlf-sec.tlf-panel{border-radius:18px!important;border:0!important;box-shadow:0 24px 60px rgba(0,0,0,.22)!important}
html:root body.tlf.tlf{background:var(--tle-paper)!important;background-image:none!important}

/* ---------- 1. no blur, anywhere ---------- */
html body.tlf *,html body.tlf *::before,html body.tlf *::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html body.tlf :is(img,picture,video,.bg,.img,.tlf-ph,.spotimg,[style*="background"]){filter:none!important}

/* ---------- 2. chrome: solid paper, no outlines ---------- */
html body.tlf :is(header.top,.top){background:var(--tle-paper)!important;border:0!important;box-shadow:none!important;transition:box-shadow .3s var(--tle-ease)}
html body.tlf.tle-scrolled :is(header.top,.top){box-shadow:0 10px 30px rgba(31,42,36,.07)!important}
html body.tlf .ticker{background:var(--tle-paper-2)!important;border:0!important;box-shadow:none!important}
html body.tlf .appbar{background:var(--tle-paper)!important;border:0!important;box-shadow:0 -12px 32px rgba(31,42,36,.08)!important}
html body.tlf :is(footer,.footer,.tl-master-footer){border:0!important;box-shadow:none!important}
html body.tlf :is(footer,.footer,.tl-master-footer) *{border-color:transparent!important;box-shadow:none!important}

/* ---------- 3. cards blend into the page: no white plate, border, shadow or frosted glass ---------- */
html body.tlf :is(.card,.panel,.place,.reason,.house>*,.member,.cal,.agenda,.status,.notice,.alert,.stat,.mo,.tl-card,.feature,article,[class$=-card],[class*="-card "],details[class*=Offer],details[class*=plan],details.compactOffer,.tlf-glass,.tlf-glass-wrap,.townline-shady-radar-city,.townline-intelligence-brand,.tl-live-four,.townline-breaking-news,.townline-ticket-hub-city,#west-coast-news .card):not(.wx):not(.score):not(.tlf-herofill .tlf-lit):not(.tlf-photohero *):not(#arqs-site-arrival *){background:transparent!important;border-color:transparent!important;border-style:none!important;box-shadow:none!important}
html body.tlf .tlf-lit:not(.tlf-herofill .tlf-lit):not(.tlf-herofill){border-color:transparent!important;box-shadow:none!important}
html body.tlf :is(.card,.panel,.place:not(.spot),.reason,.member,article,.tl-card,.feature,[class$=-card]):not(.wx):not(.score):not(.tlf-photohero *){padding-left:0!important;padding-right:0!important}
html body.tlf .tlf-glass{padding:0!important;border-radius:0!important}
html body.tlf .tlf-notice{min-height:0!important}
/* generic "any bordered box" sweep for page-specific markup on interior routes (forms keep their field outlines) */
html body.tlf main :is(div,section,aside,a,li,figure,details):not(.wx):not(.score):not(.tlf-photohero *):not(form *):not(.calgrid *):not(.lightbox *):not(#arqs-site-arrival *):not(.tile):not(.town):not([role=dialog] *)[class]{border-color:transparent!important;box-shadow:none!important}
html body.tlf main hr{border:0!important;height:1px;background:linear-gradient(90deg,transparent,rgba(31,42,36,.14),transparent)!important}

/* ---------- 4. photos: sharp, full-bleed, gentle zoom on hover/tap ---------- */
html body.tlf .tlf-ph{height:auto!important;aspect-ratio:16/10;min-height:150px;border-radius:12px!important;margin:0 0 14px!important;box-shadow:none!important;position:relative;overflow:hidden;isolation:isolate}
html body.tlf .tlf-ph.tlf-ph-sum{aspect-ratio:auto;height:120px!important;min-height:0}
html body.tlf .tlf-ph:not(.tlf-ph-empty)::before{content:"";position:absolute;inset:0;background:inherit;background-size:cover;background-position:center;transition:transform .9s var(--tle-ease);z-index:-1}
html body.tlf .tlf-ph.tlf-ph-empty{border:0!important}
html body.tlf :is(a,article,.card,.panel,.reason,.member,details,.feature,[class$=-card]):is(:hover,:focus-within,.tle-touch)>.tlf-ph:not(.tlf-ph-empty)::before,
html body.tlf :is(a,article,.card,.panel,.reason,.member,details,.feature,[class$=-card]):is(:hover,:focus-within,.tle-touch)>summary>.tlf-ph:not(.tlf-ph-empty)::before{transform:scale(1.06)}
html body.tlf main :is(article,.card,figure,.feature,[class$=-card]) img:not(.spotimg){border-radius:12px;transition:transform .9s var(--tle-ease)}
html body.tlf main :is(article,.card,figure,.feature,[class$=-card]):hover img:not(.spotimg){transform:scale(1.03)}
html body.tlf main :is(article,.card,figure,.feature,[class$=-card]):has(> img){overflow:hidden}

/* quick tiles: a sharp photo with a dark scrim at the bottom, white label */
html body.tlf .tile{border:0!important;box-shadow:none!important;border-radius:16px!important;min-height:150px;justify-content:flex-end!important;overflow:hidden!important;isolation:isolate;padding:16px!important;transition:transform .5s var(--tle-ease)!important}
html body.tlf .tile.tlf-tilephoto::after{content:"";display:block!important;position:absolute;inset:0;background:inherit;background-size:cover;background-position:center;z-index:-1;transition:transform 1s var(--tle-ease)}
html body.tlf .tile:is(:hover,:focus-visible,.tle-touch)::after{transform:scale(1.07)}
html body.tlf .tile:is(:hover,:focus-visible){transform:none!important;box-shadow:none!important}
html body.tlf .tile.tlf-tilephoto:not(#tle-id-boost),html body.tlf .tile.tlf-tilephoto :is(span,small,b):not(#tle-id-boost){color:#fff!important;text-shadow:0 1px 12px rgba(0,0,0,.55)!important}
html body.tlf .tile.tlf-tilephoto span{font-size:15px!important;font-weight:800!important;line-height:1.2}
html body.tlf .tile.tlf-tilephoto small{color:rgba(255,255,255,.92)!important;font-weight:500!important}
html body.tlf .tile.tlf-tilephoto svg{stroke:#fff!important;color:#fff!important}
html body.tlf .tile .n{background:#fff!important;color:var(--tle-accent)!important}

/* town editions: the photo is the card; name on a dark scrim at the bottom; asymmetric grid */
html body.tlf .town{border:0!important;box-shadow:none!important;background:#1d2b2f!important;border-radius:18px!important;isolation:isolate;overflow:hidden!important;position:relative;display:flex!important;align-items:flex-end!important;padding:18px!important;color:#fff!important}
html body.tlf .town .img{position:absolute!important;inset:0!important;height:auto!important;width:auto!important;border-radius:0!important;margin:0!important;z-index:-1!important;background-size:cover!important;background-position:center!important;transition:transform 1.1s var(--tle-ease)!important;filter:none!important}
html body.tlf .town::after{content:""!important;display:block!important;position:absolute!important;inset:0!important;z-index:-1!important;background:var(--tle-scrim)!important;opacity:1!important}
html body.tlf .town::before{display:none!important}
html body.tlf .town:is(:hover,:focus-visible,.tle-touch) .img{transform:scale(1.07)}
html body.tlf .town>div:not(.img){background:none!important;box-shadow:none!important;border-radius:0!important;margin:0!important;padding:0!important}
html body.tlf .town>div:not(.img) :is(b,strong){color:#fff!important;font-family:var(--display)!important;font-size:clamp(22px,2.4vw,30px)!important;line-height:1.02!important;text-shadow:0 2px 16px rgba(0,0,0,.45)!important;display:block}
html body.tlf .town>div:not(.img) small:not(#tle-id-boost){color:rgba(255,255,255,.9)!important;text-shadow:0 1px 10px rgba(0,0,0,.5)!important;letter-spacing:.02em}
html body.tlf .towngrid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-flow:dense;gap:12px!important}
html body.tlf .towngrid .town{width:auto!important;height:auto!important;min-height:0!important;aspect-ratio:4/5}
html body.tlf .towngrid .town:nth-child(1){grid-column:span 2;aspect-ratio:16/11}
html body.tlf .towngrid .town:nth-child(1)>div:not(.img) :is(b,strong){font-size:clamp(34px,5vw,58px)!important}
html body.tlf .towngrid .town:nth-child(6n+5){grid-column:span 2;aspect-ratio:16/9}
@media (min-width:900px){
  html body.tlf .towngrid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important}
  html body.tlf .towngrid .town{aspect-ratio:3/4}
  html body.tlf .towngrid .town:nth-child(1){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
  html body.tlf .towngrid .town:nth-child(6n+5){grid-column:span 2;aspect-ratio:auto}
}

/* "Experience <town>" mosaic and photo of the day: same photo-card treatment (sharp, dark bottom scrim, white type) */
html:root body.tlf :is(.ph,.potd){border:0!important;box-shadow:none!important;background:#1d2b2f!important;isolation:isolate;overflow:hidden!important;position:relative;color:#fff!important}
html:root body.tlf :is(.ph,.potd)>.img{position:absolute!important;inset:0!important;height:auto!important;width:auto!important;margin:0!important;border-radius:0!important;z-index:-1!important;filter:none!important;transition:transform 1.1s var(--tle-ease)!important}
html:root body.tlf .ph::after{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;background:var(--tle-scrim)!important}
html:root body.tlf :is(.ph,.potd):is(:hover,:focus-visible,.tle-touch)>.img{transform:scale(1.06)}
html:root body.tlf :is(.ph,.potd) :is(b,strong,h3,small,span,p,.kicker):not(#tle-id-boost){color:#fff!important;opacity:1!important;text-shadow:0 1px 14px rgba(0,0,0,.5)!important}
html:root body.tlf .ph :is(b,strong){font-family:var(--display)!important}
html:root body.tlf .potd .cap{background:var(--tle-scrim)!important;padding-top:70px!important}
html:root body.tlf .potd .cap .kicker:not(#tle-id-boost){background:none!important;border:0!important;padding:0!important;box-shadow:none!important}
/* 5-day outlook: open columns, not boxed cells */
html body.tlf .day{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}
html body.tlf .day+.day{box-shadow:inset 1px 0 0 rgba(31,42,36,.08)!important}

/* signature spots + feature rails: image on top, copy on the paper, no plate */
html body.tlf .place.spot{padding:0!important;gap:6px!important;background:transparent!important;border:0!important;box-shadow:none!important}
html body.tlf .place.spot .spotimg{height:auto!important;aspect-ratio:4/5;border-radius:16px!important;margin:0 0 8px!important;transition:transform .9s var(--tle-ease)}
html body.tlf .place.spot>:not(img){margin-left:2px!important;margin-right:2px!important}
html body.tlf .place.spot{overflow:visible!important}
html body.tlf .place.spot:hover .spotimg{transform:translateY(-3px)}
html body.tlf .rail{gap:18px!important}
html body.tlf .place:not(.spot){gap:8px!important}
html body.tlf .place:not(.spot) .ico{width:30px;height:30px;color:var(--tle-lake)!important;stroke:var(--tle-lake)!important}

/* desktop spreads: wide cards with a photo header alternate image left / right (class set by townline-editorial.js) */
@media (min-width:900px){
  html body.tlf .tle-split{display:flow-root!important;padding-top:clamp(12px,2vw,28px)!important;padding-bottom:clamp(12px,2vw,28px)!important}
  html body.tlf .tle-split>.tlf-ph{float:left;width:48%!important;margin:0 4% 8px 0!important;aspect-ratio:4/3}
  html body.tlf .tle-split.tle-flip>.tlf-ph{float:right;margin:0 0 8px 4%!important}
  html body.tlf .tle-split>:not(.tlf-ph){max-width:none}
}

/* ---------- 5. type: editorial kickers instead of outlined pills ---------- */
html body.tlf :is(.kicker,.ey,.eyebrow,.tag,.sumtag,.pill,.badge):not(.wx *):not(#aqi):not(.tlf-photohero *):not(.tlf-herofill *):not(.tile *):not(.town *){background:none!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important;color:var(--tle-accent)!important;letter-spacing:.16em!important;font-size:11.5px!important}
html body.tlf :is(.kicker,.eyebrow):not(.wx *):not(.tlf-photohero *):not(.tlf-herofill *)::before{content:"";display:inline-block;width:22px;height:2px;margin:0 10px 0 0;vertical-align:middle;background:currentColor;opacity:.6}
html body.tlf .tlf-herofill :is(.kicker,.ey,.eyebrow,.tag,.pill,.badge):not(.tlf-inlight *):not(.tlf-inlight){background:none!important;border:0!important;box-shadow:none!important;padding:0!important;color:#fff!important;text-shadow:0 1px 10px rgba(0,0,0,.5)!important}
html body.tlf .chip:not(.wx *):not(#aqi){border:0!important;box-shadow:none!important;background:rgba(168,35,90,.08)!important}
html body.tlf :is(h2,.head h2){letter-spacing:-.015em!important}
html body.tlf .head{margin-bottom:clamp(20px,3vw,34px)!important}
html body.tlf .head p{max-width:60ch}

/* ---------- 6. buttons: keep the floral fill, lose the outlines ---------- */
html body.tlf :is(.btn,button.btn,a.btn,.button,.cta a,.join,.links .join):not(.iconbtn):not(#tle-id-boost){border-color:transparent!important;box-shadow:none!important;transition:transform .25s var(--tle-ease),filter .25s,background-color .25s!important}
html body.tlf :is(.btn,a.btn,.button,.join):not(.iconbtn):is(:hover,:focus-visible){transform:translateY(-2px)}
/* form submit buttons that shipped as low-contrast green (white on #2a8f72 ≈ 4:1) use the floral button with cedar ink */
html body.tlf main button[type=submit]:not(.iconbtn):not(#tle-id-boost),html body.tlf main form button:not([type=button]):not(.iconbtn):not(#tle-id-boost){background:var(--tlf-btn)!important;color:var(--tle-ink)!important;border-color:transparent!important;text-shadow:none!important;box-shadow:none!important}
html body.tlf .tlf-photohero .btn.ghost,html body.tlf .tlf-herofill .btn.ghost{background:rgba(255,255,255,.92)!important;color:var(--tle-ink)!important}

/* ---------- 7. heroes: sharp photo, darker toward the bottom where the title sits ---------- */
html body.tlf .tlf-photohero .bg{filter:none!important}
html body.tlf .tlf-photohero .bg:before{background:linear-gradient(90deg,rgba(14,30,38,.34),rgba(14,30,38,0) 70%)!important}
html body.tlf .tlf-photohero:not(.tlf-herofill):after{background:linear-gradient(180deg,rgba(14,30,38,.22) 0%,rgba(14,30,38,0) 24%,rgba(14,30,38,.12) 46%,rgba(14,30,38,.70) 80%,rgba(14,30,38,.86) 100%)!important}
html body.tlf .tlf-photohero .wx{border:0!important;box-shadow:0 18px 40px rgba(0,0,0,.18)!important}
html body.tlf .tlf-herofill{border:0!important;box-shadow:none!important}

/* ---------- 8. sections: generous spacing, alternating paper tones ---------- */
html body.tlf .section{padding-top:clamp(56px,8vw,104px)!important}
html body.tlf .tlf-sec{padding-bottom:clamp(40px,6vw,80px)!important}
html body.tlf .calgrid>*{border-color:transparent!important;box-shadow:none!important}
html body.tlf .calgrid .today,html body.tlf .calgrid [aria-current]{background:var(--tle-accent)!important;color:#fff!important}

/* ---------- 8b. leftovers found in the full-site QA ---------- */
html body.tlf :is(.calgrid,.empty,.city,.people,.maincard,.score,.scores>*,.house>*):not(#tle-id-boost){background-color:transparent!important;border-color:transparent!important;box-shadow:none!important}
html body.tlf .calgrid{padding-left:0!important;padding-right:0!important}
html body.tlf .empty{padding-left:0!important;font-style:italic}
html body.tlf :is(.score,.scores>*){border-bottom:1px solid rgba(31,42,36,.10)!important;border-radius:0!important}
html body.tlf main li{border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important;box-shadow:none!important}
html body.tlf :is(main,section,article) img:not(#tle-id-boost),html body.tlf .spotimg:not(#tle-id-boost){box-shadow:none!important}
html:root body.tlf a.city:has(>img){background:#1d2b2f!important}
html:root body.tlf a.city:has(>img)::after{background:var(--tle-scrim)!important;z-index:1}
html:root body.tlf a.city:has(>img)>div,html:root body.tlf a.city:has(>img)>div :is(strong,span,b,small):not(#tle-id-boost){color:#fff!important;text-shadow:0 1px 14px rgba(0,0,0,.5)!important;z-index:2}
html:root body.tlf a.city:has(>img)>img{transition:transform 1.1s var(--tle-ease)}
html:root body.tlf a.city:has(>img):is(:hover,.tle-touch)>img{transform:scale(1.06)}

/* ---------- 9. motion: fade/slide in on scroll (added by townline-editorial.js only when motion is allowed) ---------- */
html.tle-motion body.tlf .tle-reveal{opacity:0;transform:translate3d(0,26px,0);transition:opacity .8s var(--tle-ease),transform .8s var(--tle-ease);transition-delay:var(--tle-delay,0s)}
html.tle-motion body.tlf .tle-reveal.tle-in{opacity:1;transform:none}
html.tle-motion body.tlf .tle-reveal-x{transform:translate3d(-26px,0,0)}
@media (prefers-reduced-motion:reduce){
  html body.tlf .tle-reveal{opacity:1!important;transform:none!important;transition:none!important}
  html body.tlf *,html body.tlf *::before,html body.tlf *::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
@media print{html body.tlf .tle-reveal{opacity:1!important;transform:none!important}}

/* ---------- 10. phone: no sideways scroll ---------- */
@media (max-width:760px){
  html body.tlf{overflow-x:clip}
  html body.tlf main{overflow-x:clip}
  html body.tlf .tile{min-height:132px}
  html body.tlf .section{padding-top:56px!important}
}

/* ---------- 9. QA follow-up sweep (2026-10-06): the last white plates and outlines found on the live site ---------- */
/* city-hero weather: no cream plate over the photo; a dark, unblurred scrim panel with white type (photo stays sharp) */
html:root body.tlf.tlf .tlf-photohero .wx{background:linear-gradient(180deg,rgba(8,18,26,.64),rgba(8,18,26,.80))!important;border:0!important;box-shadow:none!important;color:#fff!important}
html:root body.tlf.tlf .tlf-photohero .wx :is(.temp,.cond,b,.sym){color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.35)!important}
html:root body.tlf.tlf .tlf-photohero .wx :is(small,.lbl){color:rgba(255,255,255,.84)!important}
html:root body.tlf.tlf .tlf-photohero .wx .meta{border-top-color:rgba(255,255,255,.2)!important}
html:root body.tlf.tlf .tlf-photohero .wx .chip,html:root body.tlf.tlf .tlf-photohero #aqi{background:rgba(255,255,255,.16)!important;color:#fff!important;border:0!important}
/* sunset countdown: no tinted plate */
html:root body.tlf.tlf .count{background:none!important;border:0!important;box-shadow:none!important;padding-left:0!important;padding-right:0!important}
/* "Latest from Townline" news strip (inline-styled white cards from the company-news builder): editorial list, no plates */
html:root body.tlf.tlf section#news{background:transparent!important}
html:root body.tlf.tlf section#news a[href][style*="border"]{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:8px 0 20px!important;transition:transform .35s var(--tle-ease)}
html:root body.tlf.tlf section#news a[href][style*="border"]:hover{transform:translateY(-3px)}
/* page-specific boxes on interior routes (sports pools, ticket hub, app, live, forms, notes, plans): no outline, no
   shadow, no white plate; a faint paper tint keeps grouping where a block is interactive. Form fields keep outlines. */
html:root body.tlf.tlf main :is(.mini,.step,.feed-card,.notice,.note,.included,.q,.dataStrip,.sport,div.cta,.plan,.live-panel,section.box,div.box,form.box,.formBox,.maincard,aside.form,aside.panel,.heroCard,.giving):not(#arqs-site-arrival *){border-color:transparent!important;box-shadow:none!important}
html:root body.tlf.tlf main :is(.mini,.step,.feed-card,.notice,.note,.included,.q,.dataStrip,.sport,div.cta,.plan,.live-panel,section.box,div.box,form.box,.formBox,aside.form):not(.tlf-herofill *):not(.tlf-photohero *):not(#arqs-site-arrival *){background:rgba(31,42,36,.045)!important}
html:root body.tlf.tlf main .tlf-herofill :is(.mini,.step,.feed-card,.notice,.note){background:rgba(31,42,36,.05)!important}
html:root body.tlf.tlf :is(.tlf-herofill .tlf-inlight,.heroCard,main .tlf-inlight) :is(.kicker,.ey,.eyebrow,.tag,.pill,.badge):not(#tle-id-boost){border:0!important;box-shadow:none!important;background:rgba(168,35,90,.09)!important}

/* ---------- 10. TOWNLINE brand refresh (2026-10-06): full-width masthead, slim sticky pill nav, vivid icons, bold
   buttons + footer, arrival entrance. Logo: /townline/media/brand/townline-masthead.svg (Canva AI wordmark, traced to
   vector). Swap colourways: /townline/media/brand/alt/*.svg (one src in assets/arqs-brand.js). ---------- */
html body.tlf{--tle-spectrum:linear-gradient(90deg,#f0287f,#f6416c 18%,#f76a58 36%,#f8923f 52%,#f7b433 66%,#52d29c 80%,#10c6c2);
  --tle-mw:min(calc(100vw - 20px),620px);--tle-mh:calc(var(--tle-mw) * .5094 + 16px);
  /* bold buttons in the logo's spectrum (dark ink stays AA on every stop) */
  --tlf-btn:linear-gradient(120deg,#ff5a9c 0%,#ff8150 45%,#ffb52e 75%,#3fe0c5 100%);
  --tlf-btn-soft:linear-gradient(120deg,#3fe0c5 0%,#7cc8ff 50%,#b99bff 100%)}
/* header: masthead row scrolls away, the pill nav stays pinned (slim) */
html body.tlf .tl-master-header.tl-master-header{position:sticky!important;top:calc(-1 * var(--tle-mh))!important;z-index:9999!important;background:var(--tle-paper)!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html body.tlf.tle-scrolled .tl-master-header.tl-master-header{box-shadow:0 10px 26px -14px rgba(31,42,36,.35)!important}
html body.tlf .tl-master-header .tl-master-inner{display:block!important;width:100%!important;max-width:none!important;min-height:0!important;padding:0!important;margin:0!important}
html body.tlf .tl-master-header .tl-master-brand{display:block!important;position:relative;width:var(--tle-mw)!important;min-width:0!important;margin:0 auto!important;padding:10px 0 6px!important;line-height:0}
html body.tlf .tl-master-header .tl-master-brand img{display:block!important;width:100%!important;height:auto!important;max-width:none!important;aspect-ratio:5259/2679;object-fit:contain!important;background:none!important;filter:none!important}
html body.tlf .tle-mast-sweep{position:absolute;inset:10px 0 6px;pointer-events:none;-webkit-mask:url(/townline/media/brand/townline-masthead.svg) center/100% 100% no-repeat;mask:url(/townline/media/brand/townline-masthead.svg) center/100% 100% no-repeat;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.85) 50%,transparent 62%) 160% 0/260% 100% no-repeat;opacity:0}
html body.tlf .tl-master-header .tl-master-nav{display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;gap:8px!important;width:100%!important;margin:0!important;padding:8px 14px 10px!important;overflow-x:auto!important;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent)}
html body.tlf .tl-master-header .tl-master-nav::-webkit-scrollbar{display:none}
html body.tlf .tl-master-header .tl-master-nav a{flex:none;scroll-snap-align:start;white-space:nowrap!important;padding:10px 16px!important;border-radius:999px!important;border:0!important;background:rgba(31,42,36,.065)!important;color:#1f2a24!important;font:800 14px/1 "TL Inter",Inter,system-ui,sans-serif!important;letter-spacing:.01em!important;text-decoration:none!important;transition:transform .25s var(--tle-ease),background .25s}
html body.tlf .tl-master-header .tl-master-nav a:hover{transform:translateY(-1px);background:rgba(240,40,127,.12)!important}
html body.tlf .tl-master-header .tl-master-nav a.tle-here{background:var(--tlf-btn)!important;color:#1f2a24!important}
html body.tlf .tl-master-header .tl-master-nav a.join{background:#1f2a24!important;color:#fff!important;margin-left:auto}
@media(min-width:900px){html body.tlf .tl-master-header .tl-master-nav{justify-content:center!important;-webkit-mask-image:none;mask-image:none}html body.tlf .tl-master-header .tl-master-nav a.join{margin-left:0}}
/* the old in-page brand rows (hidden behind the master header) never show the retired lockup */
html body.tlf header.top .brand img[src*="mountain-lockup"]{content:url(/townline/media/brand/townline-masthead.svg)}

/* footer: bold ink with spectrum light, the new wordmark, white links */
html:root body.tlf.tlf footer.tl-master-footer{position:relative;background:#0e1626!important;background-image:radial-gradient(90% 70% at 0% 0%,rgba(240,40,127,.30),transparent 60%),radial-gradient(90% 70% at 100% 100%,rgba(16,198,194,.28),transparent 60%)!important;color:#fff!important;border:0!important;padding-top:40px!important}
html:root body.tlf.tlf footer.tl-master-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--tle-spectrum)}
html:root body.tlf.tlf footer.tl-master-footer img{width:min(72vw,320px)!important;height:auto!important;aspect-ratio:5259/2679;object-fit:contain!important}
html:root body.tlf.tlf footer.tl-master-footer :is(a,p,h4,b,span,small,strong){color:#fff!important}
html:root body.tlf.tlf footer.tl-master-footer nav a{font-size:13px!important;opacity:.92}
html:root body.tlf.tlf footer.tl-master-footer nav a:hover{opacity:1;text-decoration:underline!important}
html:root body.tlf.tlf footer.tl-master-footer .powered{color:rgba(255,255,255,.78)!important}

/* buttons: bold spectrum, heavier type, lively press */
html body.tlf :is(.btn,a.btn,button.btn,.button,.cta a,.join):not(.ghost):not(.line):not(.iconbtn){font-weight:900!important;transition:transform .25s cubic-bezier(.34,1.56,.64,1),filter .25s!important}
html body.tlf :is(.btn,a.btn,button.btn,.button,.cta a,.join):not(.iconbtn):hover{transform:translateY(-2px);filter:saturate(1.15) brightness(1.03)}
html body.tlf :is(.btn,a.btn,button.btn,.button,.cta a,.join):not(.iconbtn):active{transform:scale(.97)}

/* icons: bright gradient tiles with white glyphs (self-hosted set), tappable, lively */
html body.tlf .tle-icon{--ia:#f0287f;--ib:#f8923f;position:relative;display:inline-grid!important;place-items:center;flex:none;width:64px;height:64px;margin:0 0 12px;border-radius:21px;background:linear-gradient(140deg,var(--ia),var(--ib));box-shadow:0 12px 24px -10px var(--ia),inset 0 1px 0 rgba(255,255,255,.4);overflow:hidden;isolation:isolate;transition:transform .45s cubic-bezier(.34,1.56,.64,1),box-shadow .35s}
html body.tlf .tle-icon::after{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;background:linear-gradient(155deg,rgba(255,255,255,.42) 0%,rgba(255,255,255,0) 46%)}
html body.tlf .tle-icon svg.ico{position:relative;z-index:1;display:block!important;width:34px!important;height:34px!important;margin:0!important;padding:0!important;stroke:#fff!important;color:#fff!important;fill:none;stroke-width:2!important;background:none!important;border:0!important;box-shadow:none!important;opacity:1!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.18))}
html body.tlf .tle-icon svg.ico *{stroke:#fff}
html body.tlf :is(a,button):is(:hover,:focus-visible,.tle-touch) .tle-icon{transform:translateY(-5px) scale(1.08) rotate(-4deg);box-shadow:0 18px 32px -10px var(--ia),0 0 0 6px color-mix(in srgb,var(--ia) 20%,transparent),inset 0 1px 0 rgba(255,255,255,.4)}
html body.tlf :is(a,button):active .tle-icon{animation:tle-bounce .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes tle-bounce{0%{transform:scale(1)}30%{transform:scale(.88)}65%{transform:scale(1.12)}100%{transform:scale(1)}}
/* photo tiles: icon sits top-left on the photo */
html body.tlf .tile .tle-icon{margin:0 0 auto 0;width:60px;height:60px;border-radius:19px}
html body.tlf .tile .tle-icon svg.ico{width:32px!important;height:32px!important}
@media(min-width:900px){html body.tlf :is(.place,.reason,.feature) .tle-icon{width:72px;height:72px;border-radius:24px}html body.tlf :is(.place,.reason,.feature) .tle-icon svg.ico{width:38px!important;height:38px!important}}
/* compact contexts: app bar, alerts, inline links */
html body.tlf .appbar .tle-icon{width:34px;height:34px;margin:0 auto 3px;border-radius:12px;box-shadow:0 6px 14px -6px var(--ia)}
html body.tlf .appbar .tle-icon svg.ico{width:20px!important;height:20px!important}
html body.tlf .appbar a.post .tle-icon{width:40px;height:40px;border-radius:14px}
html body.tlf .appbar a.post{background:none!important}
html body.tlf .appbar a.post svg{stroke:#fff!important}
html body.tlf .alert .tle-icon{width:48px;height:48px;border-radius:16px;margin:0 12px 0 0}
html body.tlf .alert .tle-icon svg.ico{width:26px!important;height:26px!important}

/* arrival: after the intro hands off, masthead sweeps in, hero copy and icons stagger, a light sweep crosses the hero */
html body.tlf .tle-sweep{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;opacity:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 45%,rgba(255,214,150,.20) 50%,transparent 64%) 150% 0/250% 100% no-repeat;mix-blend-mode:screen}
@media (prefers-reduced-motion:no-preference){
  html.tle-pre body.tlf .tl-master-brand img,html.tle-pre body.tlf .tle-st,html.tle-pre body.tlf .tle-icon{opacity:0!important}
  html.tle-arrive body.tlf .tl-master-brand img{animation:tle-mast-in 1.05s cubic-bezier(.2,.8,.2,1) both}
  html.tle-arrive body.tlf .tle-mast-sweep{animation:tle-sweep 1.6s .75s ease-out both}
  html.tle-arrived body.tlf .tle-mast-sweep{animation:tle-sweep 1.8s ease-in-out 6s infinite}
  html.tle-arrive body.tlf .tle-st{animation:tle-up .8s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(.45s + var(--si,0) * .12s)}
  html.tle-arrive body.tlf .tle-sweep{animation:tle-sweep 2.2s 1s ease-out both}
  html.tle-arrive body.tlf .tle-icon{animation:tle-pop .75s cubic-bezier(.34,1.56,.64,1) backwards;animation-delay:calc(.8s + var(--i,0) * .07s)}
  html.tle-motion body.tlf .tle-reveal:not(.tle-in) .tle-icon{opacity:0;transform:scale(.5)}
  html.tle-motion body.tlf .tle-reveal.tle-in .tle-icon{animation:tle-pop .75s cubic-bezier(.34,1.56,.64,1) backwards;animation-delay:calc(var(--tle-delay,0s) + .15s)}
}
@keyframes tle-mast-in{0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(8px) scale(.985)}60%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0);transform:none}}
@keyframes tle-sweep{0%{opacity:0;background-position:160% 0}15%{opacity:1}85%{opacity:1}100%{opacity:0;background-position:-60% 0}}
@keyframes tle-up{0%{opacity:0;transform:translateY(18px)}100%{opacity:1;transform:none}}
@keyframes tle-pop{0%{opacity:0;transform:scale(.4) rotate(-12deg)}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html body.tlf .tle-icon,html body.tlf .tle-icon *{transition:none!important;animation:none!important}html body.tlf .tle-mast-sweep,html body.tlf .tle-sweep{display:none}}