/* Marfeldt design system (0.85).
   One set of rules every page follows: fonts, the heading scale and patterns, the number rows,
   two button sizes, one selected state, one gold, two label styles and the text sizes.
   Loaded on every page after the page styles; "html body.mfw" gives these rules the last word
   over the older per-page rules without needing !important. */

html body.mfw{
  --ds-h1:clamp(46px,6.4vw,92px);   /* page titles (capitals) */
  --ds-h2:clamp(34px,3.9vw,56px);   /* section headings */
  --ds-h3:clamp(26px,2.5vw,36px);   /* sub-headings and list titles (italic) */
  --ds-intro:18px;                   /* the opening paragraph of a page */
  --ds-body:16px;                    /* running text */
  --ds-small:14px;
  --ds-btn:40px;                     /* secondary buttons */
  --ds-btn-main:52px;                /* the one main button of a block */
  --ds-gold:#D9A45B;
}

/* ---------- fonts: Elementor's default font never shows through ---------- */
html body.mfw a,html body.mfw button,html body.mfw input,html body.mfw select,html body.mfw textarea,
html body.mfw h1,html body.mfw h2,html body.mfw h3,html body.mfw h4,html body.mfw label,html body.mfw small,html body.mfw b,html body.mfw strong,
html body.mfw .elementor-widget-text-editor{font-family:inherit}
html body.mfw .leaflet-container{font-family:var(--mf-sans)}

/* ---------- headings ---------- */
/* page titles: a small italic line above big capitals (pattern A), the same size on every page */
html body.mfw :is(.mf-p-title,.mf-g-title,.mf-ab-title,.mf-ct-title,.mf-c-title){font-size:var(--ds-h1);line-height:.9;letter-spacing:-.01em}
html body.mfw :is(.mf-p-title,.mf-g-title,.mf-ab-title,.mf-ct-title) > .mf-ser{display:block;font-size:.65em;line-height:1.05;letter-spacing:-.015em;margin:0 0 .1em}
/* collection pages: the italic description moves above the title, like every other page */
html body.mfw .mf-c-hero .inner .row2{display:contents}
html body.mfw .mf-c-hero .mf-c-desc{order:1;margin:0;font-family:var(--mf-serif);font-style:italic;font-weight:var(--mf-sw);font-size:calc(var(--ds-h1) * .65);line-height:1.05;color:var(--mf-bone);max-width:none}
html body.mfw .mf-c-hero .mf-c-title{order:2}
html body.mfw .mf-c-hero .inner > .row2 > .mf-note{order:3}
/* half-width openings (About, Contact): the title sits in a narrower column, so one step smaller */
html body.mfw :is(.mf-ab-title,.mf-ct-title){font-size:clamp(42px,5.2vw,76px)}
/* a collection's description is a sentence, not a short line: smaller than a page kicker */
html body.mfw .mf-c-hero .mf-c-desc{font-size:clamp(22px,2.4vw,34px);max-width:34ch}
/* About keeps its own order (capitals, then "Martin."), at the same sizes */
html body.mfw .mf-ab-title > .mf-ser{margin:.05em 0 0}

/* section headings: capitals with an italic word (pattern B); the italic reads a touch smaller than the capitals */
html body.mfw :is(.mf-index .mf-head-title,.mf-stories .mf-head-title,.mf-ways h2,.mf-support h2,.mf-best-title,.mf-suggest h2){font-size:var(--ds-h2);line-height:.95}
html body.mfw :is(.mf-index .mf-head-title,.mf-stories .mf-head-title,.mf-ways h2,.mf-best-title) .mf-ser{font-size:1.15em}
html body.mfw :is(.mf-support h2,.mf-suggest h2) .mf-ser,html body.mfw h2 .mf-ser.is-block{display:block;font-size:.65em;margin:0 0 .12em}

/* ---------- number rows: one design everywhere ---------- */
html body.mfw .mf-ph-stats dt{font-family:var(--mf-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;color:var(--mf-fog)}
html body.mfw .mf-ph-stats dd{font-size:32px;line-height:1;margin-top:8px}
html body.mfw .mf-locs .mf-ph-stats dt,html body.mfw .has-mapnav .mf-ph-stats dt{font-size:11px;white-space:nowrap}
html body.mfw .mf-facts b{font-size:32px}
html body.mfw .mf-facts .fact span,html body.mfw .mf-facts .fact small,html body.mfw .mf-facts .fact em{font-family:var(--mf-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-style:normal}
@media (max-width:700px){html body.mfw .mf-ph-stats dd{font-size:28px}}

/* ---------- text ---------- */
html body.mfw :is(.mf-p-intro,.mf-ph-r > p,.mf-ab-hero .txt p,.mf-cond-head .mf-p-intro){font-size:var(--ds-intro);line-height:1.6}
html body.mfw .mf-ways p{font-size:var(--ds-body);line-height:1.65}
/* captions are never italic mono */
html body.mfw .mf-pair figcaption,html body.mfw .mf-pair figcaption *,html body.mfw .mf-st-photos figcaption{font-style:normal}
@media (max-width:1100px){html body.mfw .mf-pairs.is-pinned .mf-pair figcaption{font-size:11px}}

/* two label styles: label (11px, wide) and meta (12px) */
html body.mfw .mf-note{font-family:var(--mf-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
/* text links with an arrow: one style */
html body.mfw .mf-note.is-link,html body.mfw .mf-locs .lx-cond{font-family:var(--mf-mono);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--mf-bone);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
html body.mfw .mf-note.is-link:hover,html body.mfw .mf-locs .lx-cond:hover{color:var(--ds-gold)}

/* ---------- buttons: two sizes, square, mono capitals ---------- */
html body.mfw :is(.mf-cbtn,.mf-chips button,.mf-seg button,.mf-best-tabs button,.mf-rev-next,.mf-locs .mf-act,.mf-locs .mf-lctl button,.mf-locs .mf-lw .mf-lb,.mf-locs .mo-base button,.mf-mapnav button){
  min-height:var(--ds-btn);height:var(--ds-btn);border-radius:0;font-family:var(--mf-mono);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase}
html body.mfw .mf-best-tabs button{padding:0 16px!important;height:var(--ds-btn)!important}
html body.mfw .mf-locs .mo-base button{height:32px;min-height:32px}
html body.mfw .mf-mapnav button{height:36px;min-height:36px}
html body.mfw :is(.mf-send,.mf-send.is-big){height:var(--ds-btn-main);min-height:var(--ds-btn-main);padding:0 28px;border-radius:0;font-family:var(--mf-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
/* the main action of a block: solid light, like "Send the note" */

html body.mfw .mf-locs .mf-act.is-main:hover{background:var(--ds-gold);border-color:var(--ds-gold);color:var(--mf-ink)}
html body.mfw .mf-locs .mf-act:not(.is-main){background:transparent}

/* one selected state: solid light fill */
html body.mfw :is(.mf-chips button[aria-pressed="true"],.mf-seg button[aria-pressed="true"],.mf-best-tabs button[aria-selected="true"],.mf-locs .mo-base button.on,.mf-locs .mo-base button[aria-pressed="true"],.mf-mapnav button[aria-current="true"]){background:var(--mf-bone)!important;color:var(--mf-ink)!important;border-color:var(--mf-bone)!important}

/* ---------- Locations: the same language as the rest of the site ---------- */
html body.mfw .mf-locs :is(.mf-lstep button,.mo-thumbs button,.mf-phbox,.mf-fsb,.lx-chips a,.mf-rate-a button,.mf-rate-a a,.mf-copy){border-radius:0}
html body.mfw .mf-locs .lx-chips a{font-family:var(--mf-sans);font-size:13px;min-height:32px}
html body.mfw .mf-locs :is(.mf-rate-a button,.mf-rate-a a){font-family:var(--mf-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;min-height:32px;display:inline-flex;align-items:center}
html body.mfw .mf-locs .mf-copy{font-family:var(--mf-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;min-height:28px}
html body.mfw .mf-mapnav .in{border-radius:0}
html body.mfw .leaflet-bar a,html body.mfw .leaflet-bar a:first-child,html body.mfw .leaflet-bar a:last-child,html body.mfw .leaflet-bar{border-radius:0}

/* ---------- index lists (Stories, Locations, About "How I work"): one design ---------- */
html body.mfw .mf-s-row .dt{font-family:var(--mf-mono);font-size:12px;letter-spacing:.08em;color:var(--mf-fog)}
html body.mfw .mf-s-row .tt,html body.mfw .mf-ways h3{font-size:var(--ds-h3);line-height:1.08}
html body.mfw .mf-s-row .tg{font-family:var(--mf-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mf-fog)}
html body.mfw .mf-s-row .ar{font-family:var(--mf-sans)}
html body.mfw .mf-ways .wn{font-family:var(--mf-mono);font-size:12px;letter-spacing:.08em;color:var(--mf-fog)}

/* ---------- floating things: one look ---------- */
html body.mfw .mf-rail{position:fixed;left:8px;top:50%;z-index:9960;display:flex;flex-direction:column;gap:6px;transform:translateY(-50%)}
html body.mfw .mf-rail a{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(236,232,224,.24);background:rgba(11,12,11,.6);color:var(--mf-bone);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .25s,color .25s}
html body.mfw .mf-rail a:hover,html body.mfw .mf-rail a:focus-visible{border-color:var(--ds-gold);color:var(--ds-gold);outline:none}
html body.mfw .mf-rail svg{width:16px;height:16px}
html body.mfw .mf-rail.off{display:none}
html body.mfw #sfsi_floater.mf-replaced{display:none!important}
@media (max-width:760px){html body.mfw .mf-rail{display:none}}

/* ---------- the cookie question: slim and square ---------- */
html body.mfw .mf-consent{max-width:440px;padding:14px 16px;border-radius:0;font-size:14px;line-height:1.45}
html body.mfw .mf-consent p{margin:0 0 10px}
html body.mfw .mf-consent button{height:36px}
@media (max-width:600px){
  html body.mfw .mf-consent{left:8px;right:8px;bottom:8px;max-width:none;display:flex;align-items:center;gap:12px;padding:10px 12px;font-size:13px}
  html body.mfw .mf-consent p{margin:0;flex:1}
  html body.mfw .mf-consent .b{flex:none;flex-direction:column;gap:6px}
  html body.mfw .mf-consent button{height:32px;padding:0 12px}
}

/* big collections: the rest of the photos behind one button */
html body.mfw .mf-jg > a[hidden]{display:none}
html body.mfw .mf-jmore{display:flex;justify-content:center;padding:36px var(--mf-gutter) 8px}

/* ---------- the sky outside: one backdrop for every page opening (0.87) ---------- */
html body.mfw .hb-sky,html body.mfw .mf-cond-sky{display:none}
html body.mfw .mf-cond{position:relative}
html body.mfw .mf-cond > .mf-cond-bg{position:absolute;left:0;right:0;top:0;bottom:auto;height:min(720px,92vh);z-index:0}
html body.mfw .mf-cond > :not(.mf-cond-bg){position:relative;z-index:1}
html body.mfw .mf-skycap{position:absolute;left:var(--mf-gutter);top:clamp(84px,11vh,104px);z-index:2;display:inline-flex;align-items:center;gap:10px;min-height:32px;font-family:var(--mf-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mf-fog);text-decoration:none;opacity:0;animation:mf-skycap-in .8s ease .6s forwards}
html body.mfw .mf-skycap i{width:6px;height:6px;border-radius:50%;background:var(--ds-gold)}
html body.mfw .mf-skycap b{font-weight:400;transition:transform .3s}
html body.mfw .mf-skycap:hover{color:var(--mf-bone)}
html body.mfw .mf-skycap:hover b{transform:translateX(4px)}
@keyframes mf-skycap-in{to{opacity:1}}
@media (prefers-reduced-motion:reduce){html body.mfw .mf-skycap{animation:none;opacity:1}}

/* ---------- one rhythm: the space between sections ---------- */
html body.mfw{--ds-sec:clamp(72px,10vh,120px)}
html body.mfw :is(.mf-ways,.mf-support,.mf-index,.mf-stories,.mf-best){padding-top:var(--ds-sec);padding-bottom:var(--ds-sec)}

/* ---------- Continue: the same ending on every main page ---------- */
html body.mfw .mf-next-band{border-top:1px solid var(--mf-line);margin:var(--ds-sec) 0 0}
html body.mfw .mf-next-band a{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 32px;padding:clamp(48px,8vh,96px) var(--mf-gutter);color:var(--mf-bone);text-decoration:none;overflow:hidden}
html body.mfw .mf-next-band .k{grid-column:1;font-family:var(--mf-serif);font-style:italic;font-weight:var(--mf-sw);font-size:calc(var(--ds-h2) * .7);line-height:1.05;color:var(--mf-bone)}
html body.mfw .mf-next-band b{grid-column:1;font-family:var(--mf-display);font-weight:900;text-transform:uppercase;font-size:var(--ds-h2);line-height:.95;letter-spacing:-.005em;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
html body.mfw .mf-next-band .go{grid-column:2;grid-row:1 / span 2;align-self:end;display:inline-flex;align-items:center;gap:10px;height:var(--ds-btn);padding:0 18px;border:1px solid var(--mf-line);font-family:var(--mf-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;transition:border-color .3s,color .3s,background-color .3s}
html body.mfw .mf-next-band .go i{font-style:normal;transition:transform .3s}
html body.mfw .mf-next-band a:hover b{transform:translateX(12px)}
html body.mfw .mf-next-band a:hover .go{border-color:var(--ds-gold);color:var(--ds-gold)}
html body.mfw .mf-next-band a:hover .go i{transform:translateX(4px)}
@media (max-width:700px){html body.mfw .mf-next-band a{grid-template-columns:minmax(0,1fr)}html body.mfw .mf-next-band .go{grid-column:1;grid-row:auto;justify-self:start;margin-top:14px}}

/* ---------- the field guide joins the site ---------- */
/* actions use the site's buttons: outline, mono capitals, gold on hover; green is kept for nature data only ("in season") */
html body.mfw .mf-hb :is(.hb-idb,.hb-repb,.hb-chorus,.hb-zall,.hb-all,.hb-tb){border-radius:0;border:1px solid var(--mf-line);background:transparent;color:var(--mf-bone);font-family:var(--mf-mono);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;min-height:var(--ds-btn)}
html body.mfw .mf-hb :is(.hb-idb,.hb-repb,.hb-chorus,.hb-zall,.hb-all,.hb-tb):hover{border-color:var(--ds-gold);color:var(--ds-gold);background:transparent}
html body.mfw .mf-hb .hb-zall{min-height:28px}
/* the group filter: the site's selected state */
html body.mfw .mf-hb .hb-frg button{border-radius:0}
html body.mfw .mf-hb .hb-frg button[aria-pressed="true"],html body.mfw .mf-hb .hb-frg button.on,html body.mfw .mf-hb .hb-lms button.now{background:var(--mf-bone)!important;color:var(--mf-ink)!important;border-color:var(--mf-bone)!important}
html body.mfw .mf-hb .hb-ym.now{background:rgba(217,164,91,.08)}
/* cards and panels are square like everywhere else */
html body.mfw .mf-hb :is(.hb-card,.hb-more,.sg-c,.sg-id,.hb-rari,.hb-idcta,.hb-spotcta,.hb-today,.hb-ym,.hb-zi){border-radius:0}
/* footprints: light prints on the dark card instead of white tiles */
html body.mfw .mf-hb .k-track .sg-art svg,html body.mfw .mf-hb .k-track .sg-art img{filter:invert(1) hue-rotate(180deg) brightness(.82) contrast(1.05)}
/* the drawings stay still until you point at them */
html body.mfw .mf-hb .hb-svg,html body.mfw .mf-hb .hb-svg *{animation-play-state:paused}
html body.mfw .mf-hb :is(.hb-card,.sg-c,.hb-zi):hover .hb-svg,html body.mfw .mf-hb :is(.hb-card,.sg-c,.hb-zi):hover .hb-svg *{animation-play-state:running}

/* ---------- category colours stay inside data, at one quieter strength ---------- */
html body.mfw .leaflet-marker-icon:not(.leaflet-marker-draggable){filter:saturate(.72) brightness(.96)}
/* the painted scenes of the Conditions strip sit in the site palette: a little quieter, warmer */
html body.mfw .cx-p .cx-sc{filter:saturate(.7) contrast(.96)}

/* ---------- motion and photo text on Home: one treatment ---------- */
/* the big word over a photo is always the italic, in plain light text: no inverted (difference) blending, which broke
   the letters into patches over busy photos */
html body.mfw .mf-reveal .mf-rev-word{mix-blend-mode:normal;color:var(--mf-bone);text-shadow:0 2px 40px rgba(0,0,0,.45)}
html body.mfw .mf-reveal .mf-rev-word.is-disp{font-family:var(--mf-serif);font-style:italic;font-weight:var(--mf-sw);text-transform:none;letter-spacing:-.04em;font-size:clamp(80px,15vw,260px)}

/* ---------- stories: the same voice as the rest of the site ---------- */
/* subheads read like the site's sub-headings (the italic), the opening paragraph is the page's intro size */
html body.mfw .mf-st-body .elementor-widget-heading .elementor-heading-title{font-family:var(--mf-serif)!important;font-style:italic!important;font-weight:var(--mf-sw)!important;text-transform:none!important;letter-spacing:-.015em!important;font-size:var(--ds-h3)!important;line-height:1.08!important}
html body.mfw .mf-st-body .mf-lead p,html body.mfw .mf-st-body .mf-lead{font-size:var(--ds-intro);line-height:1.65;color:var(--mf-bone)}
html body.mfw .mf-st-body .elementor-widget-video{border:1px solid var(--mf-line)}

/* ---------- page openings: one size and one layout (0.89) ----------
   Gallery, Stories, Locations, the field guide and Conditions share it: the title on the left, sitting on the same line
   at the bottom; on the right, under a thin rule, the intro, then the numbers or the live picture, then one card,
   then the actions. Every opening is the same height on a given screen. */
@media (min-width:1000px){
  html body.mfw :is(.mf-ph,.mf-cond-head){display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.9fr)!important;column-gap:56px!important;row-gap:28px!important;align-items:end!important;align-content:end!important;
    padding-top:180px!important;padding-bottom:clamp(40px,6vh,64px)!important;min-height:clamp(560px,86vh,780px);box-sizing:border-box}
  html body.mfw .mf-cond{padding-top:0}
}
html body.mfw .mf-cond-head{border-bottom:0;padding-left:var(--mf-gutter);padding-right:var(--mf-gutter)}
html body.mfw .hb-ph{align-items:end;align-content:end}
@media (max-width:999px){html body.mfw :is(.mf-ph,.mf-cond-head){padding-top:clamp(120px,18vh,150px)!important;padding-bottom:40px!important;min-height:0}html body.mfw .mf-cond{padding-top:0}}
/* the right column: one rhythm on every page */
html body.mfw .mf-cond-where{display:flex;flex-direction:column;gap:8px!important;padding:22px 0 0!important;border:0!important;border-top:1px solid var(--mf-line)!important}
html body.mfw .mf-cond-where > *{margin-top:0;margin-bottom:0}
html body.mfw :is(.mf-ph-r,.mf-cond-where) > .mf-p-intro{margin:0;max-width:52ch;font-size:17px;line-height:1.55;color:#D9D5CC;text-shadow:none}
/* the field guide's link to Conditions is the site's text link */
html body.mfw .hb-ph .hb-tocond{font-family:var(--mf-mono);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--mf-bone);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
html body.mfw .hb-ph .hb-tocond:hover{color:var(--ds-gold)}

/* Conditions carries the most in its right column: the date line (already in the place picker) steps aside so the opening keeps the shared height */
@media (min-width:1000px){html body.mfw .mf-cond-where > .mf-cond-upd{display:none}html body.mfw .mf-cond-where .lv-next li:nth-child(n+3){display:none}html body.mfw .mf-cond-where > .mf-p-intro{margin-bottom:6px}}
html body.mfw .mf-cond > .mf-cond-bg{-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,#000 82%,transparent 100%)}

/* ---------- 0.90: openings a little lower, and the right column refined to one set of blocks ---------- */
@media (min-width:1000px){
  html body.mfw :is(.mf-ph,.mf-cond-head){padding-top:150px!important;padding-bottom:clamp(32px,5vh,48px)!important;min-height:clamp(500px,72vh,660px)}
}
/* every block in the right column runs the full width of the column, with the same spacing */
html body.mfw :is(.mf-ph-r,.mf-cond-where){gap:16px!important}
html body.mfw :is(.mf-ph-r,.mf-cond-where) > *{width:100%;max-width:none;box-sizing:border-box}
html body.mfw :is(.mf-ph-r,.mf-cond-where) > .mf-p-intro{font-size:16px;line-height:1.55;max-width:none}
/* the numbers: one look, smaller when there are four so they never touch */
html body.mfw .mf-ph-stats dd{font-size:30px}
html body.mfw .mf-ph-stats:has(> div:nth-child(4)) dd{font-size:24px}
html body.mfw .mf-ph-stats > div{padding-left:14px}
/* one card style: the "newest" / "latest" / "species of the day" card, and Conditions' answers */
html body.mfw .mf-cond-live .lv-vd{margin:0;gap:6px}
html body.mfw .mf-cond-live .lv-vd .vd{width:100%;box-sizing:border-box;padding:10px 14px;border:1px solid var(--mf-line);border-left:2px solid var(--tc,var(--mf-line));background:rgba(20,22,20,.6);-webkit-backdrop-filter:none;backdrop-filter:none}
html body.mfw .mf-cond-live .lv-vd b{font-size:15px}
html body.mfw .mf-cond-live .lv-vd small{font-size:13px}
/* the field guide's two shortcuts sit side by side as a pair of equal cards */
/* actions row at the bottom of the column: the same height everywhere */
html body.mfw .mf-ph-r .mf-g-meta{display:flex;flex-wrap:wrap;gap:8px}

/* the field guide's Compare button gets room to breathe */
html body.mfw .hb-cmpb,html body.mfw .hb-cmpb:hover,html body.mfw .hb-cmpb:focus{width:auto;min-width:84px;padding:10px 14px;gap:6px;font-family:var(--mf-mono);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase}

/* ---------- Conditions: "Plan your day" is the opening's action (0.90) ----------
   It replaces the "next chances" list there (the plan holds the same moments, with where to go). */
html body.mfw .mf-cond-where .lv-h,html body.mfw .mf-cond-where .lv-next{display:none}
html body.mfw .yd-tog.yd-hero,html body.mfw .yd-tog.yd-hero:focus{position:relative;display:grid!important;grid-template-columns:64px minmax(0,1fr) auto;grid-template-rows:auto auto auto;column-gap:16px;row-gap:2px;align-items:center;width:100%;height:auto;min-height:76px;margin:0;padding:12px 18px 12px 14px;border:1px solid rgba(217,164,91,.45);border-radius:0;background:linear-gradient(100deg,rgba(217,164,91,.12),rgba(217,164,91,.02) 60%),rgba(20,22,20,.6);color:var(--mf-bone);text-align:left;cursor:pointer;overflow:hidden;box-shadow:none;transition:border-color .3s,background-color .3s}
html body.mfw .yd-tog.yd-hero .yd-route{grid-row:1 / span 3;grid-column:1;width:64px;height:40px;overflow:visible}
html body.mfw .yd-tog.yd-hero .yd-route path{fill:none;stroke-width:1.4;stroke-linecap:round}
html body.mfw .yd-tog.yd-hero .yd-route .r0{stroke:rgba(236,232,224,.18)}
html body.mfw .yd-tog.yd-hero .yd-route .r1{stroke:var(--ds-gold);stroke-dasharray:3 6;animation:yd-walk 2.4s linear infinite}
html body.mfw .yd-tog.yd-hero .yd-route circle{fill:var(--mf-ink);stroke:rgba(236,232,224,.6);stroke-width:1.2}
html body.mfw .yd-tog.yd-hero .yd-route .end{fill:var(--ds-gold);stroke:none;transform-origin:58px 8px;animation:yd-pulse 2.4s ease-in-out infinite}
html body.mfw .yd-tog.yd-hero .mf-note{grid-column:2;grid-row:1;display:block!important;color:var(--ds-gold)}
html body.mfw .yd-tog.yd-hero b{grid-column:2;grid-row:2;font:900 calc(var(--mf-dk) * 34px)/1 var(--mf-display);text-transform:uppercase;letter-spacing:0;color:var(--mf-bone)}
html body.mfw .yd-tog.yd-hero small{grid-column:2;grid-row:3;display:block!important;font-size:13px;color:var(--mf-soft)}
html body.mfw .yd-tog.yd-hero .chev{grid-column:3;grid-row:1 / span 3;position:static;width:9px;height:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .3s}
html body.mfw .yd-tog.yd-hero[aria-expanded="true"] .chev{transform:rotate(45deg)}
html body.mfw .yd-tog.yd-hero:hover,html body.mfw .yd-tog.yd-hero:focus-visible{border-color:var(--ds-gold);background-color:rgba(217,164,91,.06);outline:none}
html body.mfw .yd-tog.yd-hero:hover .chev{transform:rotate(-45deg) translate(3px,3px)}
html body.mfw .yd-tog.yd-hero .twk-c,html body.mfw .yd-tog.yd-hero::before,html body.mfw .yd-tog.yd-hero::after{display:none}
@keyframes yd-walk{to{stroke-dashoffset:-18}}
@keyframes yd-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}
@media (prefers-reduced-motion:reduce){html body.mfw .yd-tog.yd-hero .yd-route .r1,html body.mfw .yd-tog.yd-hero .yd-route .end{animation:none}}
html body.mfw .mf-cond-where .mf-cond-live .lv-h,html body.mfw .mf-cond-where .mf-cond-live .lv-next{display:none!important}
html body.mfw :is(.mf-ph-r,.mf-cond-where) > .mf-p-intro{font-size:16px!important;line-height:1.55!important}
html body.mfw .hb-ph > .mf-ph-bg{-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 72%,transparent 100%)}

/* ---------- square everywhere: Elementor's site settings give buttons and fields rounded corners (30px);
   these rules take them back to the site's square look, in the mini apps, the alerts and the sign-up forms too ---------- */
html body.mfw[class*="elementor-kit"] :is(button,input,select,textarea,.elementor-button,.wpforms-form input,.wpforms-form button,.wpforms-form textarea){border-radius:0}
html body.mfw[class*="elementor-kit"] .mft-x,html body.mfw[class*="elementor-kit"] .pl-time{border-radius:0}
html body.mfw .mf-st-body .elementor-widget-container{border-radius:0}

/* ---------- Through time: the listen bar and the archive films (0.91) ---------- */
html body.mfw .mf-hist :is(.mh-lbar,.mh-vbar,.mh-lbar .mh-tb,.mh-tb){border-radius:0}
/* the film's bar is joined to the player: no gap, one frame */
html body.mfw .mf-hist .mh-vid .mh-vframe{box-shadow:none}
html body.mfw .mf-hist .mh-vid .mh-vbar{margin-top:0;border:1px solid rgba(181,140,255,.32);border-top:0;padding:6px 8px 6px 14px}

/* ---------- Conditions: "Plan your day" as the last cell of the outdoors row (0.91) ---------- */
html body.mfw .mf-c-outd .yd-tog.yd-bar,html body.mfw .mf-c-outd .yd-tog.yd-bar:focus{position:relative;order:99;flex:0 0 auto!important;display:grid!important;grid-template-columns:40px auto 10px;grid-template-rows:auto auto;column-gap:12px;row-gap:4px;align-items:center;align-content:center;min-width:0;width:auto;height:auto;margin:0;padding:14px 20px;border:0;border-radius:0;background:var(--mf-ink);box-shadow:inset 3px 0 0 var(--ds-gold);color:var(--mf-bone);text-align:left;cursor:pointer;transition:background-color .25s}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route{grid-row:1 / span 2;grid-column:1;width:40px;height:26px;overflow:visible}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route path{fill:none;stroke-width:1.6;stroke-linecap:round}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route .r0{stroke:rgba(236,232,224,.18)}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route .r1{stroke:var(--ds-gold);stroke-dasharray:3 6;animation:yd-walk 2.4s linear infinite}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route circle{fill:var(--mf-ink);stroke:rgba(236,232,224,.6);stroke-width:1.4}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route .end{fill:var(--ds-gold);stroke:none;transform-origin:58px 8px;animation:yd-pulse 2.4s ease-in-out infinite}
html body.mfw .mf-c-outd .yd-tog.yd-bar .mf-note{display:none!important}
html body.mfw .mf-c-outd .yd-tog.yd-bar b{grid-column:2;grid-row:1;font:600 11px/1.2 var(--mf-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mf-bone);text-shadow:none;white-space:nowrap}
html body.mfw .mf-c-outd .yd-tog.yd-bar small{grid-column:2;grid-row:2;display:block!important;font:500 12px/1.2 var(--mf-mono);letter-spacing:.04em;color:var(--ds-gold);white-space:nowrap}
html body.mfw .mf-c-outd .yd-tog.yd-bar .chev{grid-column:3;grid-row:1 / span 2;position:static;margin:0;width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);animation:none!important;transition:transform .25s}
html body.mfw .mf-c-outd .yd-tog.yd-bar[aria-expanded="true"] .chev{transform:rotate(-135deg)}
html body.mfw .mf-c-outd .yd-tog.yd-bar:hover,html body.mfw .mf-c-outd .yd-tog.yd-bar:focus-visible{background:#151816;outline:none}
html body.mfw .mf-c-outd .yd-tog.yd-bar[aria-expanded="true"]{background:rgba(217,164,91,.08)}
html body.mfw .mf-c-outd .yd-tog.yd-bar :is(.twk-c,canvas),html body.mfw .mf-c-outd .yd-tog.yd-bar::before,html body.mfw .mf-c-outd .yd-tog.yd-bar::after{display:none!important}
@media (max-width:900px){html body.mfw .mf-c-outd .yd-tog.yd-bar,html body.mfw .mf-c-outd .yd-tog.yd-bar:focus{grid-template-columns:40px minmax(0,1fr) 10px;padding:14px 16px}}
@media (prefers-reduced-motion:reduce){html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route :is(.r1,.end){animation:none}}

/* ---------- Locations: the rating card, streamlined (0.91) ---------- */
html body.mfw .mf-rate.is-card{margin:16px 0 6px;border:1px solid rgba(236,232,224,.12);background:rgba(255,255,255,.02)}
html body.mfw .mf-rate-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px 20px;padding:14px 16px}
html body.mfw .mf-rate-avg{display:flex;align-items:center;gap:12px;min-width:0}
html body.mfw .mf-rate-avg > b.no{display:none}
html body.mfw .mf-rate-avg > b{font:700 28px/1 var(--mf-sans)}
html body.mfw .mf-rate-avg > span{gap:4px}
html body.mfw .mf-rate-avg em{font:500 11px/1.2 var(--mf-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mf-fog)}
html body.mfw .mf-rate-avg:has(> b.no) > span > :not(em){display:none}
html body.mfw .mf-rate-me{flex-direction:column;align-items:flex-end;gap:4px}
html body.mfw .mf-rate-me em{font:500 11px/1.2 var(--mf-mono);letter-spacing:.12em}
html body.mfw .mf-rate-me .st{gap:2px;margin-right:-3px}
html body.mfw .mf-rate-me button{width:24px;height:24px;font-size:20px}
html body.mfw .mf-rate-a{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;padding:0;border-top:1px solid rgba(236,232,224,.12);background:none}
html body.mfw .mf-rate-a > :is(button,a){justify-content:center;gap:8px;min-height:44px;margin:0;padding:0 12px;font:600 11px/1 var(--mf-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mf-soft);transition:color .2s,background-color .2s}
html body.mfw .mf-rate-a > :is(button,a):not([hidden]) ~ :is(button,a){border-left:1px solid rgba(236,232,224,.12)}
html body.mfw .mf-rate-a > :is(button,a):hover{color:var(--ds-gold);background:rgba(255,255,255,.03)}
html body.mfw .mf-rate-a > [hidden]{display:none!important}
html body.mfw .mf-rate-x{padding:12px 16px 14px;border-top:1px solid rgba(236,232,224,.12)}
@media (max-width:420px){html body.mfw .mf-rate-top{grid-template-columns:minmax(0,1fr)}html body.mfw .mf-rate-me{align-items:flex-start}}

/* ---------- 0.91: every opening's right column is the same four blocks — intro, numbers, one card, a row of 40px buttons ---------- */
/* the shared secondary button used in the opening's action row */
html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts) > :is(button,a,.mf-cond-pick),html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts) > :is(button,a):hover{
  position:relative;display:inline-flex!important;flex-direction:row;align-items:center;gap:8px;width:auto;height:40px;min-height:40px;margin:0!important;padding:0 14px!important;
  border:1px solid rgba(236,232,224,.24)!important;border-radius:0;background:transparent!important;box-shadow:none!important;transform:none!important;
  color:var(--mf-bone)!important;font:500 11px/1 var(--mf-mono)!important;letter-spacing:.12em!important;text-transform:uppercase;text-decoration:none!important;text-shadow:none!important;white-space:nowrap;cursor:pointer;box-sizing:border-box;transition:border-color .2s,color .2s}
html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts) > :is(button,a,.mf-cond-pick):hover,html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts) > :is(button,a,.mf-cond-pick):focus-within{border-color:var(--ds-gold)!important;color:var(--ds-gold)!important}
html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts) > [hidden]{display:none!important}
html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts){display:flex;flex-wrap:wrap;gap:8px}
html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts) svg{width:15px!important;height:15px!important;flex:none;transform:none!important}
/* Nature: the two shortcut cards become plain buttons with their icon and label */
html body.mfw .hb-ph .hb-acts :is(.hb-idic,.hb-spic){display:contents!important}
html body.mfw .hb-ph .hb-acts :is(.hb-idcta,.hb-spotcta) > span:not(.hb-idic):not(.hb-spic){display:contents!important}
html body.mfw .hb-ph .hb-acts :is(.hb-idcta,.hb-spotcta) em{font:inherit!important;letter-spacing:inherit!important;color:inherit!important}
html body.mfw .hb-ph .hb-acts :is(.hb-idcta,.hb-spotcta) :is(b,i){display:none!important}
html body.mfw .hb-ph .hb-acts .hb-idcta::after{display:none!important}
html body.mfw .hb-ph .hb-acts .hb-tocond{margin-left:auto!important}
html body.mfw .hb-ph .hb-today{padding:10px 14px 10px 10px!important}
html body.mfw .hb-ph .hb-today .hb-tdart{width:72px!important;height:52px!important}
html body.mfw .hb-ph .mf-ph-stats > div:nth-child(odd){padding-left:14px;border-left:1px solid var(--mf-line)}
html body.mfw .hb-ph .mf-ph-stats > div:first-child{padding-left:0;border-left:0}
html body.mfw .hb-ph .mf-ph-stats dd{font-size:30px}
/* Conditions: the place picker is a button in the action row; its "Conditions for" label stays for screen readers only */
html body.mfw .mf-cond-where .mf-cw-top,html body.mfw .mf-cond-where.has-acts > .row{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html body.mfw .mf-cond-where.has-acts > .mf-cond-upd{display:none}
html body.mfw .mf-cond-acts .mf-cond-pick{padding:0 12px!important}
html body.mfw .mf-cond-acts .mf-cond-pick select{appearance:none;-webkit-appearance:none;width:auto!important;height:38px;min-height:0;margin:0;padding:0 18px 0 0!important;border:0!important;border-radius:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23ECE8E0' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right center/9px 6px!important;color:inherit!important;font:inherit!important;letter-spacing:inherit!important;text-transform:uppercase;cursor:pointer;field-sizing:content;box-shadow:none!important;outline:none}
html body.mfw .mf-cond-acts .mf-cond-pick select option,html body.mfw .mf-cond-acts .mf-cond-pick select optgroup{background:#151816;color:var(--mf-bone);text-transform:none;font-family:var(--mf-sans);letter-spacing:0}
html body.mfw .mf-cond-acts .mf-al-open{margin-left:auto!important}
/* Conditions: the numbers and the one card, drawn exactly like Gallery's */
html body.mfw .mf-cond-live.v91{display:flex;flex-direction:column;gap:16px;margin:0;padding:0;border:0;background:none}
html body.mfw .mf-cond-live.v91[hidden]{display:none}
html body.mfw .mf-cond-live.v91 .mf-ph-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0}
html body.mfw .mf-cond-live.v91 .mf-ph-stats > div{padding:0 0 0 14px;border-left:1px solid var(--mf-line)}
html body.mfw .mf-cond-live.v91 .mf-ph-stats > div:first-child{padding-left:0;border-left:0}
html body.mfw .mf-cond-live.v91 .mf-ph-stats dd{margin:8px 0 0;font:900 30px/1 var(--mf-display);color:var(--mf-bone);font-variant-numeric:tabular-nums}
html body.mfw .mf-cond-live.v91 .lv-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:10px 14px 10px 10px;border:1px solid var(--mf-line);background:rgba(20,22,20,.6);color:var(--mf-bone);text-decoration:none;transition:border-color .25s,background-color .25s}
html body.mfw .mf-cond-live.v91 .lv-card:hover{border-color:var(--mf-soft);background:rgba(28,30,28,.8)}
html body.mfw .mf-cond-live.v91 .lv-art{display:grid;place-items:center;width:72px;height:52px;background:rgba(255,255,255,.04);color:var(--ds-gold)}
html body.mfw .mf-cond-live.v91 .lv-art svg{width:26px;height:26px}
html body.mfw .mf-cond-live.v91 .lv-card > span:not(.lv-art){display:flex;flex-direction:column;gap:3px;min-width:0}
html body.mfw .mf-cond-live.v91 .lv-card em{font:500 11px/1.2 var(--mf-mono);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--ds-gold)}
html body.mfw .mf-cond-live.v91 .lv-card b{font:500 15px/1.3 var(--mf-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body.mfw .mf-cond-live.v91 .lv-card i{font:500 11px var(--mf-mono);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--mf-fog);white-space:nowrap;transition:transform .25s,color .25s}
html body.mfw .mf-cond-live.v91 .lv-card:hover i{transform:translateX(4px);color:var(--mf-bone)}
@media (max-width:600px){html body.mfw .mf-cond-live.v91 .lv-card i{display:none}html body.mfw .mf-cond-live.v91 .lv-card b{white-space:normal}html body.mfw :is(.hb-ph .hb-acts,.mf-cond-acts) .hb-tocond,html body.mfw .mf-cond-acts .mf-al-open{margin-left:0!important}}
html body.mfw .mf-cond-live.v91{height:auto!important;max-height:none!important;overflow:visible!important;min-height:0!important}
html body.mfw .mf-cond-where.has-acts > .row{display:none!important}
html body.mfw .mf-cond-live.v91 .lv-card b{font-family:var(--mf-sans)!important;font-size:15px!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important;color:var(--mf-bone)!important}
html body.mfw .mf-cond-acts > *{height:40px!important;min-height:40px!important;max-height:40px}
html body.mfw .mf-cond-where .mf-cond-live.v91{display:flex!important;flex-direction:column;gap:16px!important;padding:0!important;margin:0!important}
html body.mfw .mf-cond-where .mf-cond-acts > .mf-cond-me,html body.mfw .mf-cond-where .mf-cond-acts > .mf-cond-me:hover{height:40px!important;min-height:40px!important;align-self:center}
html body.mfw .mf-cond-acts{align-items:center}
html body.mfw .mf-cond-where .mf-cond-live.v91.nx.on,html body.mfw .mf-cond-where .mf-cond-live.v91.on{display:flex!important;padding:0!important;margin:0!important}

/* the plan cell: as narrow as the "Outdoors" label — the route on top, the name and count under it */
html body.mfw .mf-c-outd .yd-tog.yd-bar,html body.mfw .mf-c-outd .yd-tog.yd-bar:focus{grid-template-columns:auto 10px;grid-template-rows:auto auto auto;justify-content:center;justify-items:start;column-gap:10px;row-gap:6px;padding:14px 22px;box-shadow:none}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route{grid-row:1;grid-column:1 / -1;width:44px;height:26px}
html body.mfw .mf-c-outd .yd-tog.yd-bar b{grid-column:1;grid-row:2;color:var(--ds-gold)}
html body.mfw .mf-c-outd .yd-tog.yd-bar small{grid-column:1;grid-row:3;color:var(--mf-fog);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
html body.mfw .mf-c-outd .yd-tog.yd-bar .chev{grid-column:2;grid-row:2}
html body.mfw .mf-c-outd .yd-tog.yd-bar:hover b{color:var(--mf-bone)}
@media (max-width:900px){html body.mfw .mf-c-outd .yd-tog.yd-bar,html body.mfw .mf-c-outd .yd-tog.yd-bar:focus{grid-template-columns:44px minmax(0,1fr) 10px;grid-template-rows:auto auto;justify-content:stretch;padding:14px 16px}
html body.mfw .mf-c-outd .yd-tog.yd-bar .yd-route{grid-row:1 / span 2;grid-column:1}
html body.mfw .mf-c-outd .yd-tog.yd-bar b{grid-column:2;grid-row:1}html body.mfw .mf-c-outd .yd-tog.yd-bar small{grid-column:2;grid-row:2}
html body.mfw .mf-c-outd .yd-tog.yd-bar .chev{grid-column:3;grid-row:1 / span 2}}
@media (max-width:600px){html body.mfw .mf-cond-live.v91 .mf-ph-stats dd{font-size:24px}html body.mfw .mf-cond-live.v91 .mf-ph-stats > div{padding-left:10px}}

/* ---------- location help sheet (0.92) ---------- */
html body.mfw .mf-geohelp{position:fixed;left:16px;right:16px;bottom:16px;z-index:100000;max-width:440px;margin:0 auto;padding:16px 18px 18px;border:1px solid rgba(236,232,224,.24);border-top:2px solid var(--ds-gold);background:#121412;color:var(--mf-bone);box-shadow:0 20px 60px rgba(0,0,0,.6);transform:translateY(calc(100% + 30px));transition:transform .35s cubic-bezier(.2,.8,.2,1);font-size:14px;line-height:1.5}
html body.mfw .mf-geohelp.on{transform:none}
html body.mfw .mf-geohelp .hd{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
html body.mfw .mf-geohelp .hd span{font:600 11px/1.3 var(--mf-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ds-gold)}
html body.mfw .mf-geohelp .x{width:36px;height:36px;padding:0;border:1px solid rgba(236,232,224,.2);border-radius:0;background:none;color:var(--mf-bone);font-size:20px;line-height:1;cursor:pointer}
html body.mfw .mf-geohelp p{margin:0 0 8px;color:var(--mf-soft)}
html body.mfw .mf-geohelp ol{margin:0 0 10px;padding-left:20px}
html body.mfw .mf-geohelp li{margin:0 0 4px}
html body.mfw .mf-geohelp .sm{margin:0;font-size:12px;color:var(--mf-fog)}

/* ---------- the three maps on phones (0.92): search + full screen on top, Map/Aerial under the search,
   one row of actions along the bottom; pinch replaces the zoom buttons ---------- */
html body.mfw :is(.mf-out,.mf-hist) .mh-me.on,html body.mfw :is(.mf-out,.mf-hist) .mh-me.is-on{background:var(--mf-bone)!important;border-color:var(--mf-bone)!important;color:var(--mf-ink)!important}
@media (max-width:600px){
  html body.mfw :is(.mf-locs .mf-map,.mf-out,.mf-hist) .leaflet-control-zoom,html body.mfw .mf-locs .mf-map .mf-zoom{display:none!important}
  html body.mfw :is(.mf-locs .mf-map,.mf-out,.mf-hist) .mh-search{left:8px!important;top:8px!important;right:56px!important;width:auto!important}
  html body.mfw :is(.mf-locs .mf-map,.mf-out,.mf-hist) .mh-search input{height:40px}
  html body.mfw :is(.mf-locs .mf-map,.mf-out,.mf-hist) .mf-fsb{top:8px!important;right:8px!important}
  html body.mfw .mf-locs .mf-map .mf-lbase,html body.mfw :is(.mf-out,.mf-hist) .mo-base{top:56px!important;left:8px!important;right:auto!important;padding:2px!important}
  html body.mfw .mf-locs .mf-map .mf-lbase button,html body.mfw :is(.mf-out,.mf-hist) .mo-base button{height:30px!important;min-height:30px!important;padding:0 12px!important;font-size:10.5px!important;letter-spacing:.1em!important}
  html body.mfw .mf-locs .mf-lctl,html body.mfw :is(.mf-out,.mf-hist) .mh-ctl{left:8px!important;right:8px!important;bottom:26px!important;flex-wrap:nowrap!important;gap:6px!important;align-items:center!important}
  html body.mfw .mf-locs .mf-lctl > *,html body.mfw :is(.mf-out,.mf-hist) .mh-ctl > *{flex:none}
  html body.mfw .mf-locs .mf-lctl :is(button,.mf-lb),html body.mfw :is(.mf-out,.mf-hist) .mh-ctl button{height:40px!important;min-height:40px!important;padding:0 12px!important;font-size:11px!important;letter-spacing:.08em!important;white-space:nowrap}
  html body.mfw .mf-locs .mf-lctl .mf-lsurp,html body.mfw :is(.mf-out,.mf-hist) .mh-ctl .mo-findb{width:40px!important;padding:0!important;justify-content:center}
  html body.mfw :is(.mf-locs .mf-map,.mf-out,.mf-hist) .leaflet-control-attribution{font-size:9px!important;line-height:1.4!important;padding:1px 5px!important}
}

/* ---------- Conditions, phones: the Today cards' tool buttons stack full width so their names fit (0.92) ---------- */
@media (max-width:600px){
  html body.mfw .mf-c-today .mf-c-card .cpl{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:6px!important;width:100%!important;margin-top:auto}
  html body.mfw .mf-c-today .mf-c-card .cpill,html body.mfw .mf-c-today .mf-c-card .cpill:hover{flex:none!important;display:flex!important;align-items:center;justify-content:flex-start;gap:8px;width:100%!important;max-width:none!important;min-width:0!important;height:40px!important;padding:0 10px!important;font-size:10.5px!important;letter-spacing:.06em!important}
  html body.mfw .mf-c-today .mf-c-card .cpill span{overflow:visible!important;text-overflow:clip!important;white-space:nowrap;max-width:none!important}
  html body.mfw .mf-c-today .mf-c-card .cpill svg{flex:none;width:15px;height:15px}
}
/* the campsite map's buttons speak the same language as the photo map's */
html body.mfw .mf-out .mh-layb,html body.mfw .mf-hist .mh-layb{font-family:var(--mf-mono)!important;font-size:11px!important;letter-spacing:.1em!important;text-transform:uppercase}
html body.mfw :is(.mf-out,.mf-hist) .mh-me:not(.on):not(.is-on){color:var(--ds-gold)!important}

/* ---------- Conditions: the Soomaa day trip, tidied (0.92) ---------- */
html body.mfw .xtr-fold .xtr-chev{border-radius:0!important}
html body.mfw .xtr-fold .xtr-h h4{font-size:clamp(17px,2vw,20px)!important;line-height:1.2}
html body.mfw .xtr-r li i{border-radius:0!important}
@media (max-width:600px){
  html body.mfw .xtr.c.xtr-fold{padding:16px!important}
  html body.mfw .xtr-fold .xtr-chev{width:40px!important;height:40px!important;flex:none}
  html body.mfw .xtr-fold .xtr-b{display:grid!important;grid-template-columns:1fr 1fr;gap:6px!important}
  html body.mfw .xtr-fold .xtr-b > :first-child{grid-column:1 / -1}
  html body.mfw .xtr-fold .xtr-b > *{justify-content:center;width:100%!important;min-height:40px;padding:0 10px!important;font-size:10.5px!important;letter-spacing:.08em!important;box-sizing:border-box}
  /* the stops as a numbered route down the page */
  html body.mfw .xtr-fold .xtr-r{display:flex!important;flex-direction:column;align-items:stretch;gap:0!important;margin:12px 0 4px!important}
  html body.mfw .xtr-fold .xtr-r li{display:flex!important;margin:0!important;padding:10px 0 10px 40px!important;min-height:44px;box-sizing:border-box;border:0!important;border-bottom:1px solid rgba(236,232,224,.08)!important;background:none!important;font-size:15px}
  html body.mfw .xtr-fold .xtr-r li::after{left:13px!important;right:auto!important;top:0!important;bottom:0;width:1px!important;height:auto!important;background:rgba(140,196,238,.35)!important;z-index:0}
  html body.mfw .xtr-fold .xtr-r li:first-child::after{top:50%!important}
  html body.mfw .xtr-fold .xtr-r li:last-child::after{display:block!important;bottom:50%}
  html body.mfw .xtr-fold .xtr-r li i{position:absolute;left:2px;top:50%;z-index:1;width:24px!important;height:24px!important;margin-top:-12px;background:#16202a!important;border:1px solid rgba(140,196,238,.5)}
  html body.mfw .xtr-fold .xtr-r li.on,html body.mfw .xtr-fold .xtr-r li:hover{background:rgba(140,196,238,.06)!important}
  html body.mfw .xtr-fold .xtr-r li.back{color:var(--mf-fog)}
}
/* the plan opens straight on "Where should I go?": today's highlights are already in the Today cards above (0.92) */
html body.mfw .mf-c-plan .yd-row{display:none!important}
/* hovering "Alerts" used to drop its push-to-the-right margin, so it jumped next to "Where I am" and back (blinking) (0.92) */
html body.mfw .mf-cond-acts > .mf-al-open,html body.mfw .mf-cond-acts > .mf-al-open:is(:hover,:focus,:focus-visible),html body.mfw .hb-ph .hb-acts > .hb-tocond,html body.mfw .hb-ph .hb-acts > .hb-tocond:is(:hover,:focus,:focus-visible){margin-left:auto!important}
@media (max-width:600px){html body.mfw .mf-cond-acts > .mf-al-open,html body.mfw .mf-cond-acts > .mf-al-open:is(:hover,:focus,:focus-visible),html body.mfw .hb-ph .hb-acts > .hb-tocond,html body.mfw .hb-ph .hb-acts > .hb-tocond:is(:hover,:focus,:focus-visible){margin-left:0!important}}
html body.mfw .mf-cond-acts > .mf-al-open:hover svg{animation:none}

/* ---------- page openings on phones (0.92): three numbers stay in one row; the buttons sit in a tidy two-column grid ---------- */
@media (max-width:600px){
  html body.mfw .mf-ph-stats:not(:has(> div:nth-child(4))){grid-template-columns:repeat(3,minmax(0,1fr))!important;row-gap:0!important}
  html body.mfw .mf-ph-stats:not(:has(> div:nth-child(4))) > div{padding-left:12px!important;border-left:1px solid var(--mf-line)!important}
  html body.mfw .mf-ph-stats:not(:has(> div:nth-child(4))) > div:first-child{padding-left:0!important;border-left:0!important}
  html body.mfw .mf-ph-stats dd{font-size:24px!important}
  html body.mfw .mf-ph-stats dt{white-space:nowrap!important;font-size:10.5px!important;letter-spacing:.1em!important}
  html body.mfw :is(.mf-cond-acts,.hb-ph .hb-acts,.mf-ph-r .mf-g-meta){display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important}
  html body.mfw :is(.mf-cond-acts,.hb-ph .hb-acts,.mf-ph-r .mf-g-meta) > *{width:100%!important;min-width:0!important;justify-content:center!important;margin:0!important;box-sizing:border-box}
  html body.mfw .mf-cond-acts > .mf-cond-pick,html body.mfw .hb-ph .hb-acts > :last-child,html body.mfw .mf-ph-r .mf-g-meta > .mf-seg{grid-column:1 / -1}
  html body.mfw .mf-cond-acts .mf-cond-pick select{flex:0 1 auto}
  html body.mfw .mf-ph-r .mf-g-meta > .mf-seg{display:grid!important;grid-template-columns:1fr 1fr}
  html body.mfw .mf-ph-r .mf-g-meta > .mf-seg button{width:100%;justify-content:center}
  html body.mfw .mf-ph-r .mf-g-meta > :is(button,a){height:40px!important;padding:0 10px!important}
}
@media (max-width:600px){
  html body.mfw .mf-ph-r .mf-g-meta > .mf-g-acts{grid-column:1 / -1;display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important}
  html body.mfw .mf-ph-r .mf-g-meta > .mf-g-acts > *{width:100%!important;height:40px!important;margin:0!important;justify-content:center!important;padding:0 10px!important}
  html body.mfw .hb-ph .hb-acts > .hb-tocond{grid-column:auto!important;order:2}
  html body.mfw .hb-ph .hb-acts > .hb-spotcta{grid-column:1 / -1!important;order:3}
}
html body.mfw :is(.mf-out,.mf-hist) .mh-me:not(.on):not(.is-on) svg,html body.mfw :is(.mf-out,.mf-hist) .mh-me:not(.on):not(.is-on) svg *{stroke:var(--ds-gold)!important;color:var(--ds-gold)!important}
html body.mfw :is(.mf-out,.mf-hist) .mh-me:not(.on):not(.is-on) svg circle{fill:none!important}
@media (max-width:600px){html body.mfw .mf-hist .mh-search{right:112px!important}}

/* ---------- Nature: "Easily mistaken for" — the name gets the whole width, Compare runs along the bottom (0.93) ---------- */
html body.mfw .hb-look{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))!important}
html body.mfw .hb-look .hb-lk{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto}
html body.mfw .hb-look .hb-lk [data-open]{order:1;width:100%}
html body.mfw .hb-look .hb-lk [data-open] b{overflow-wrap:break-word;hyphens:auto}
html body.mfw .hb-look .hb-lk .hb-cmpb,html body.mfw .hb-look .hb-lk .hb-cmpb:hover,html body.mfw .hb-look .hb-lk .hb-cmpb:focus{order:2;display:flex!important;flex-direction:row!important;align-items:center;justify-content:center;gap:8px;width:100%!important;min-width:0!important;height:34px!important;min-height:34px;margin:0!important;padding:0 10px!important;border:0!important;border-top:1px solid var(--mf-line)!important;border-radius:0;background:rgba(255,255,255,.02)!important;font:500 10.5px/1 var(--mf-mono)!important;letter-spacing:.12em!important;text-transform:uppercase;color:var(--mf-soft)!important}
html body.mfw .hb-look .hb-lk .hb-cmpb:hover{color:var(--ds-gold)!important;background:rgba(255,255,255,.04)!important}
html body.mfw .hb-look .hb-lk .hb-cmpb svg{width:14px;height:14px;flex:none}

/* ---------- Plan your day / "Where should I go?": the action row in the site's button language (0.93) ----------
   Directions is the main action (solid bone), Waze and the tool are hairline secondaries, all 40px, square, mono capitals, no glow. */
html body.mfw .gw-act{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:12px}
html body.mfw .gw-act > :is(.gw-go,.cpill),html body.mfw .gw-act > :is(.gw-go,.cpill):is(:hover,:focus,:focus-visible){display:inline-flex!important;align-items:center;gap:8px;height:40px!important;min-height:40px!important;width:auto!important;margin:0!important;padding:0 16px!important;border-radius:0!important;box-shadow:none!important;transform:none!important;font:500 11px/1 var(--mf-mono)!important;letter-spacing:.12em!important;text-transform:uppercase;text-decoration:none!important;text-shadow:none!important;white-space:nowrap;transition:background-color .2s,border-color .2s,color .2s}
html body.mfw .gw-act > :is(.gw-go,.cpill) :is(svg,.ic){width:15px!important;height:15px!important;transform:none!important;flex:none}


html body.mfw .gw-act > :is(.gw-go.mf-waze,.cpill){border:1px solid rgba(236,232,224,.28)!important;background:transparent!important;color:var(--mf-bone)!important}
html body.mfw .gw-act > :is(.gw-go.mf-waze,.cpill):is(:hover,:focus-visible){border-color:var(--ds-gold)!important;color:var(--ds-gold)!important}
html body.mfw .gw-act > .cpill svg{color:var(--ds-gold)}
html body.mfw .gw-act > .cpill :is(.twk-c,canvas),html body.mfw .gw-act > .cpill::before,html body.mfw .gw-act > .cpill::after{display:none!important}
html body.mfw .gw-msd,html body.mfw .gw-msd:hover,html body.mfw .gw-msd:focus{height:40px!important;min-height:40px;padding:0 16px!important;border:1px solid rgba(236,232,224,.28)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--mf-bone)!important;font:500 11px/1 var(--mf-mono)!important;letter-spacing:.12em!important;text-transform:uppercase}
html body.mfw .gw-msd:hover{border-color:var(--ds-gold)!important;color:var(--ds-gold)!important}
html body.mfw .gw-msd[aria-pressed="true"]{border-color:var(--mf-bone)!important;background:var(--mf-bone)!important;color:var(--mf-ink)!important}
@media (max-width:600px){html body.mfw .gw-act{display:grid;grid-template-columns:1fr 1fr}html body.mfw .gw-act > *{justify-content:center;width:100%!important}html body.mfw .gw-act > .cpill{grid-column:1 / -1;margin-left:0!important}}

/* ---------- 0.94 ---------- */
/* "Where should I go?" rows: one full-width button each (their arrow and Waze links are gone) */
html body.mfw .gw-list li{grid-template-columns:minmax(0,1fr)!important}
html body.mfw .gw-list li > :is(.gw-a,.mf-waze){display:none!important}
/* the rating card's actions: the Google link fits its cell on phones (the arrow spilled out) */
html body.mfw .mf-rate-a > :is(button,a){min-width:0;overflow:hidden}
@media (max-width:600px){html body.mfw .mf-rate-a > :is(button,a){gap:6px;padding:0 8px;letter-spacing:.06em!important;font-size:10.5px!important}html body.mfw .mf-rate-a > a{white-space:normal;text-align:center;line-height:1.25}}
/* maps on phones: the action row sits right on the bottom edge; the map credit moves up beside the Map/Aerial switch */
@media (max-width:600px){
  html body.mfw .mf-locs .mf-lctl,html body.mfw :is(.mf-out,.mf-hist) .mh-ctl{bottom:8px!important}
  html body.mfw :is(.mf-locs .mf-map,.mf-out,.mf-hist) .leaflet-bottom.leaflet-right{top:56px!important;bottom:auto!important}
  html body.mfw :is(.mf-locs .mf-map,.mf-out,.mf-hist) .leaflet-bottom.leaflet-right .leaflet-control-attribution{margin:0 8px 0 0!important;padding:3px 6px!important;background:rgba(12,14,12,.8)!important;color:var(--mf-fog)!important;line-height:1.3!important;max-width:44vw;white-space:normal;text-align:right}
}
/* route / trip / save rows in every map card (photo spots, campsites, Through time): one look — a 2-column grid of 44px cells,
   mono capitals that may wrap, Google Maps as the solid main action and the rest as hairline buttons */
html body.mfw :is(.mh-place,.mf-actrow,.mf-locs .mf-acts){display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important}
html body.mfw :is(.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-acts > .mf-act),html body.mfw :is(.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-acts > .mf-act):is(:hover,:focus){display:flex!important;align-items:center;justify-content:center;gap:8px;width:100%!important;min-width:0!important;height:auto!important;min-height:44px!important;margin:0!important;padding:8px 10px!important;box-sizing:border-box;border:1px solid rgba(236,232,224,.28)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;transform:none!important;color:var(--mf-bone)!important;font:500 11px/1.25 var(--mf-mono)!important;letter-spacing:.1em!important;text-transform:uppercase;text-align:center;text-decoration:none!important;white-space:normal!important}
html body.mfw :is(.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-acts > .mf-act) span{overflow:visible!important;text-overflow:clip!important;white-space:normal!important;max-width:none!important}
html body.mfw :is(.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-acts > .mf-act) svg{flex:none;width:15px!important;height:15px!important}

html body.mfw :is(.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-acts > .mf-act):not(:first-child):not(.is-main):hover{border-color:var(--ds-gold)!important;color:var(--ds-gold)!important}

html body.mfw :is(.mh-place > .mh-pa,.mf-locs .mf-acts > .mf-act)[aria-pressed="true"],html body.mfw :is(.mh-place > .mh-pa.on){border-color:var(--ds-gold)!important;color:var(--ds-gold)!important}

/* ---------- 0.95: the one "main action" look, everywhere a route or the next step is offered ----------
   Gold hairline, gold label, a faint gold wash; hover deepens the wash. Solid bone stays only for a selected state. */
html body.mfw :is(.gw-act > .gw-go:not(.mf-waze),.mh-place > .mh-pa:first-child,.mf-actrow > .mf-ab.is-main,.mf-locs .mf-acts > .mf-act.is-main,.xtr-fold .xtr-b > .xtr-a:first-child,.mf-locs .mf-act.is-main),
html body.mfw :is(.gw-act > .gw-go:not(.mf-waze),.mh-place > .mh-pa:first-child,.mf-actrow > .mf-ab.is-main,.mf-locs .mf-acts > .mf-act.is-main,.xtr-fold .xtr-b > .xtr-a:first-child,.mf-locs .mf-act.is-main):focus{
  border:1px solid var(--ds-gold)!important;background:rgba(217,164,91,.1)!important;color:var(--ds-gold)!important;box-shadow:none!important}
html body.mfw :is(.gw-act > .gw-go:not(.mf-waze),.mh-place > .mh-pa:first-child,.mf-actrow > .mf-ab.is-main,.mf-locs .mf-acts > .mf-act.is-main,.xtr-fold .xtr-b > .xtr-a:first-child,.mf-locs .mf-act.is-main):is(:hover,:focus-visible){
  background:rgba(217,164,91,.2)!important;color:#F0C887!important;border-color:#F0C887!important}
html body.mfw :is(.gw-act > .gw-go,.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-act) svg,html body.mfw :is(.gw-act > .gw-go,.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-act) svg *{stroke:currentColor}
/* nothing in an action row moves on hover: no margins, lifts or position changes */
html body.mfw .gw-act > *,html body.mfw .gw-act > *:is(:hover,:focus,:focus-visible){margin:0!important;transform:none!important}

/* ---------- 0.95: "Where should I go?" in the site's language ---------- */
html body.mfw .gw-h{align-items:flex-end!important;gap:16px 32px!important;margin-bottom:16px!important}
html body.mfw .gw-t{display:flex!important;flex-direction:column;gap:6px}
html body.mfw .gw-ttl{margin:0;font:900 var(--ds-h3)/1.05 var(--mf-display);text-transform:uppercase;letter-spacing:0;color:var(--mf-bone)}
html body.mfw .gw-ttl em{font-family:var(--mf-serif,'Cormorant Garamond',serif);font-style:italic;font-weight:500;text-transform:none;font-size:1.15em;letter-spacing:0}
html body.mfw .gw-sub{font-size:14px;color:var(--mf-soft);max-width:60ch}
/* the goals and the distance: mono capitals, one selected state (solid bone), quality dots kept as data */
html body.mfw .gw-g button,html body.mfw .gw-g button:hover,html body.mfw .gw-g button:focus,html body.mfw .gw-seg button,html body.mfw .gw-seg button:hover,html body.mfw .gw-seg button:focus{height:40px!important;min-height:40px;border-radius:0!important;box-shadow:none!important;font:500 11px/1 var(--mf-mono)!important;letter-spacing:.12em!important;text-transform:uppercase;transform:none!important}
html body.mfw .gw-g button{border:1px solid rgba(236,232,224,.18)!important;background:transparent!important;color:var(--mf-soft)!important}
html body.mfw .gw-g button:hover{border-color:var(--ds-gold)!important;color:var(--ds-gold)!important}
html body.mfw .gw-g button:is(.on,[aria-pressed="true"]),html body.mfw .gw-seg button:is(.on,[aria-pressed="true"]){border-color:var(--mf-bone)!important;background:var(--mf-bone)!important;color:var(--mf-ink)!important}
html body.mfw .gw-g button:is(.on,[aria-pressed="true"]) svg{color:var(--mf-ink)!important}
html body.mfw .gw-seg button{border:0!important;background:transparent!important;color:var(--mf-soft)!important;padding:0 14px!important}
html body.mfw .gw-seg{border:1px solid rgba(236,232,224,.18)!important;padding:0!important}
html body.mfw .gw-f > span:first-child{font:500 11px var(--mf-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mf-fog)}
/* the ranked list: the bar keeps clear of the edge */
html body.mfw .gw-list .gw-row{padding-right:18px!important}
html body.mfw .gw-list li.on{box-shadow:inset 2px 0 0 var(--ds-gold)!important}
@media (max-width:600px){html body.mfw .gw-g{display:grid!important;grid-template-columns:1fr 1fr;gap:6px!important}html body.mfw .gw-g button{width:100%}html body.mfw .gw-seg{display:grid!important;grid-template-columns:repeat(4,1fr);width:100%}html body.mfw .gw-seg button{padding:0 4px!important;font-size:10px!important;letter-spacing:.06em!important}}
@media (max-width:600px){html body.mfw .gw-f{display:flex!important;flex-direction:column;align-items:stretch!important;gap:6px!important;width:100%}html body.mfw .gw-seg{width:100%!important}html body.mfw .gw-g button:last-child:nth-child(odd){grid-column:1 / -1}}

/* ---------- 0.96: one icon colour in every action button: gold ----------
   Older page styles painted these icons green, blue or ink; the button's own text colour never reached them. */
html body.mfw :is(.gw-act > *,.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-act,.xtr-b > .xtr-a,.mf-cond-acts > *,.hb-ph .hb-acts > *,.mf-c-card .cpill,.mf-rate-a > *,.mf-lctl > *,.mh-ctl > *) svg:not(.mf-g-logo){color:var(--ds-gold)!important;stroke:currentColor}
html body.mfw :is(.gw-act > *,.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-act,.xtr-b > .xtr-a,.mf-cond-acts > *,.hb-ph .hb-acts > *,.mf-c-card .cpill,.mf-rate-a > *,.mf-lctl > *,.mh-ctl > *) svg:not(.mf-g-logo) [stroke]:not([stroke="none"]){stroke:currentColor!important}
/* secondary buttons: bone label at rest, gold label and border on hover — the same in every map card */
html body.mfw :is(.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-act):not(.is-main):not(:first-child){color:var(--mf-bone)!important;border-color:rgba(236,232,224,.28)!important;background:transparent!important}
html body.mfw :is(.mh-place > .mh-pa,.mf-actrow > .mf-ab,.mf-locs .mf-act):not(.is-main):not(:first-child):is(:hover,:focus-visible){color:var(--ds-gold)!important;border-color:var(--ds-gold)!important}
html body.mfw .mf-actrow > .mf-ab.is-main ~ .mf-ab{color:var(--mf-bone)!important}

/* ---------- 0.97 ---------- */
/* the campsite card's small links: the site's text link (mono capitals, bone, gold on hover), not green */
html body.mfw .mo-links{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
html body.mfw .mo-links > :is(a,button),html body.mfw .mo-links > :is(a,button):is(:hover,:focus){display:inline-flex;align-items:center;min-height:32px;margin:0;padding:0;border:0!important;border-radius:0;background:none!important;box-shadow:none!important;color:var(--mf-bone)!important;font:500 11px/1 var(--mf-mono)!important;letter-spacing:.12em!important;text-transform:uppercase;text-decoration:none!important;cursor:pointer}
html body.mfw .mo-links > :is(a,button):is(:hover,:focus-visible){color:var(--ds-gold)!important}
/* the arrow after "Reviews on Google" is gold like the pencil before "Leave a note" */
html body.mfw .mf-rate-a a > span[aria-hidden]{color:var(--ds-gold)}
/* "Where I am" (and every button in the opening's action row): hover = gold border and label, never a white fill */
html body.mfw .mf-cond-where .mf-cond-acts > *:is(:hover,:focus-visible,:active),html body.mfw .hb-ph .hb-acts > *:is(:hover,:focus-visible,:active){background:transparent!important;color:var(--ds-gold)!important;border-color:var(--ds-gold)!important;box-shadow:none!important}
html body.mfw .mf-cond-where .mf-cond-acts > .mf-cond-me.on{background:transparent!important;color:var(--ds-gold)!important;border-color:var(--ds-gold)!important}
/* goal tabs: gold icons (not one colour per goal), ink when selected */
html body.mfw .gw-g button svg{color:var(--ds-gold)!important}
html body.mfw .gw-g button svg [stroke]:not([stroke="none"]),html body.mfw .gw-g button svg :is(path,circle,line,polyline,rect){stroke:currentColor!important}
html body.mfw .gw-g button:is(.on,[aria-pressed="true"]) svg{color:var(--mf-ink)!important}
/* the map buttons on hover: gold border and label, no light fill (campsite "Near me" turned white) */
html body.mfw :is(.mf-lctl,.mh-ctl) > :is(button,a):not(.on):not(.is-on):is(:hover,:focus-visible){background:rgba(12,14,12,.92)!important;color:var(--ds-gold)!important;border-color:var(--ds-gold)!important}
/* Nature opening: Photo ID and Spotted in the wild hover like every other button (the old green hovers out-ranked the shared rule) */
html body.mfw .hb-ph .mf-ph-r .hb-acts > :is(.hb-idcta,.hb-spotcta,.hb-tocond):is(:hover,:focus-visible,:active){background:transparent!important;border-color:var(--ds-gold)!important;color:var(--ds-gold)!important;box-shadow:none!important}
/* species card: "Report a sighting" is a normal secondary button (it was green), and nothing in that row moves on hover */
html body.mfw .hb-dlg .hb-acts > .hb-saw,html body.mfw .hb-dlg .hb-acts > .hb-saw:focus{border:1px solid rgba(236,232,224,.28)!important;background:transparent!important;color:var(--mf-bone)!important;box-shadow:none!important}
html body.mfw .hb-dlg .hb-acts > .hb-saw:is(:hover,:focus-visible){border-color:var(--ds-gold)!important;color:var(--ds-gold)!important;background:transparent!important}
html body.mfw .hb-dlg .hb-acts > .hb-saw svg{color:var(--ds-gold)!important}
html body.mfw .hb-dlg .hb-acts > .hb-saw svg :is(path,circle,line,polyline,rect){stroke:currentColor!important}
html body.mfw .hb-dlg .hb-acts > *:is(:hover,:focus,:focus-visible){transform:none!important;margin:0!important}