/* Cycle.tw: "Route atlas".
   Off-white paper, charcoal ink, one high-visibility accent (always with dark text on it), and
   route badges that carry a text label and a shape, never color alone. Mobile first, 44px touch
   targets, fast on weak mobile data (two Latin font files, no images required). */
:root{
  --paper:#F5F3EC;
  --paper-2:#ECE8DD;
  --card:#FFFFFF;
  --ink:#1B1E1D;
  --ink-2:#2A2F2D;
  --text:#1E2321;
  --muted:#545B57;
  --line:#D6D1C3;
  --hivis:#D9F24B;      /* high-visibility accent, only ever behind dark text */
  --hivis-deep:#B9D61E;
  --link:#0C6B4C;       /* 6.4:1 on paper */
  --link-hover:#084D37;
  --warn-bg:#FFF1DC;
  --warn-line:#D8891A;
  --stop-bg:#FDE6E1;
  --stop-line:#B3341E;
  --ok-bg:#E3F3E8;
  --ok-line:#2C7A4B;
  /* traffic exposure scale (always paired with a label and a shape) */
  --t-separated:#2C7A4B;
  --t-shared:#2F7D86;
  --t-mixed:#9A7A12;
  --t-lowroad:#B85E14;
  --t-road:#B3341E;

  --font-display:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Atkinson Hyperlegible',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-zh:'PingFang TC','Noto Sans TC','Microsoft JhengHei','Heiti TC',sans-serif;
  --maxw:1140px;
  --r:12px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{overflow-wrap:break-word;font-family:var(--font-body);color:var(--text);background:var(--paper);line-height:1.6;font-size:1.0625rem}
html:lang(zh-Hant-TW) body{font-family:var(--font-body),var(--font-zh);line-height:1.8}
img{max-width:100%;height:auto}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 16px}
@media(min-width:700px){.wrap{padding:0 32px}}
a{color:var(--link)}
a:hover{color:var(--link-hover)}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 6px var(--hivis);border-radius:4px}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--hivis);color:var(--ink);padding:12px 16px;border-radius:8px;font-weight:700}
.skip:focus{left:12px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.eyebrow{font-family:var(--font-display);font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:800;font-stretch:88%;line-height:1.08;letter-spacing:-.01em;text-wrap:balance;color:var(--ink)}
html:lang(zh-Hant-TW) h1,html:lang(zh-Hant-TW) h2,html:lang(zh-Hant-TW) h3,html:lang(zh-Hant-TW) h4{font-family:var(--font-display),var(--font-zh);letter-spacing:.02em;line-height:1.25}

/* ---------- header: a road with a center line ---------- */
header.site{background:var(--ink);color:#F5F3EC;position:relative;z-index:30}
header.site::after{content:"";display:block;height:4px;background:repeating-linear-gradient(90deg,var(--hivis) 0 28px,transparent 28px 44px)}
.nav{display:flex;align-items:center;gap:20px;min-height:64px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#F5F3EC;padding:8px 0}
.brand:hover{color:#fff}
.brand .mark{width:34px;height:34px;flex:none}
.brand .name{font-family:var(--font-display);font-weight:900;font-stretch:75%;font-size:1.55rem;letter-spacing:.01em;text-transform:lowercase}
.brand .name b{color:var(--hivis);font-weight:900}
.nav nav{flex:1 1 auto;min-width:0}
.nav ul{list-style:none;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.nav ul::-webkit-scrollbar{display:none}
.nav ul a{display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:999px;color:#E9E6DC;text-decoration:none;font-family:var(--font-display);font-weight:650;font-stretch:90%;white-space:nowrap;font-size:.98rem}
.nav ul a:hover,.nav ul a:focus-visible{background:#2E3432;color:#fff}
.nav ul a[aria-current="page"]{background:var(--hivis);color:var(--ink)}
.rides-link{border:1.5px solid #6A716D}
.rides-link [data-rides-count]:not(:empty){display:inline-block;margin-left:6px;min-width:22px;padding:0 6px;border-radius:999px;background:var(--hivis);color:var(--ink);font-size:.8rem;text-align:center;line-height:22px}
.nav ul.langs{flex:none}
.nav ul.langs a{border:1.5px solid #6A716D;font-weight:600}
@media(max-width:899px){
  .nav{gap:0 12px;padding-bottom:6px}
  .nav nav{order:3;flex-basis:100%;margin:0 -16px;padding:0 10px}
  .nav ul.langs{margin-left:auto}
}

/* ---------- heroes ---------- */
.hero{background:var(--paper-2);border-bottom:1px solid var(--line)}
.hero .inner{max-width:var(--maxw);margin:0 auto;padding:36px 16px 30px}
@media(min-width:700px){.hero .inner{padding:56px 32px 44px}}
.hero h1{font-size:clamp(2rem,6vw,3.4rem);margin:.25em 0 .2em;max-width:22ch}
.hero .lede{font-size:1.15rem;max-width:62ch;color:var(--ink-2)}
.hero.has-photo{position:relative;background:var(--ink) var(--hero-sm) center/cover no-repeat;color:#fff}
@media(min-width:900px){.hero.has-photo{background-image:var(--hero)}
.hero.has-photo::before{background:linear-gradient(90deg,rgba(15,18,17,.82) 0%,rgba(15,18,17,.62) 45%,rgba(15,18,17,.18) 78%,rgba(15,18,17,.08) 100%)}}
@media(min-width:900px){.hero-home .quick{max-width:720px}}
@media(max-width:600px){.hero .quick a{font-size:.88rem;padding:0 12px}.hero .quick{gap:6px}}
.hero.has-photo::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,18,17,.25),rgba(15,18,17,.78))}
.hero.has-photo .inner{position:relative}
.hero.has-photo h1,.hero.has-photo .lede,.hero.has-photo .eyebrow{color:#fff}
.hero-home{background:var(--ink);color:#F5F3EC;border:0;position:relative;overflow:hidden}
.hero-home .inner{padding-top:44px;padding-bottom:40px}
.hero-home h1{color:#fff;font-size:clamp(2.4rem,9vw,5.2rem);font-stretch:72%;font-weight:900;max-width:14ch;line-height:1.24}
.hero-home h1 em{font-style:normal;background:var(--hivis);color:var(--ink);padding:0 .12em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero-home .lede{color:#D9D6CC;margin-top:14px}
.hero-home .eyebrow{color:var(--hivis)}
.hero-home .road{position:absolute;right:-40px;top:0;bottom:0;width:180px;opacity:.5;pointer-events:none}
@media(max-width:699px){.hero-home .road{display:none}}

.hero-home.has-photo::before{background:linear-gradient(90deg,rgba(15,18,17,.88) 0%,rgba(15,18,17,.62) 45%,rgba(15,18,17,.18) 100%)}
@media(max-width:699px){.hero-home.has-photo::before{background:linear-gradient(180deg,rgba(15,18,17,.55),rgba(15,18,17,.86))}}
.hero-home.has-photo .road{display:none}
.hero.has-photo .lede,.hero.has-photo .zhname,.hero.has-photo .statusline{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.hero.has-photo .checked{background:#fff;color:var(--ink);text-shadow:none;border-color:#fff}
.hero.has-photo .eyebrow a{color:#fff}

/* quick picks on the home page */
.quick{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;list-style:none}
.quick a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;background:#2A302E;color:#fff;text-decoration:none;font-weight:700;border:1.5px solid #4D5551}
.quick a:hover,.quick a:focus-visible{background:var(--hivis);color:var(--ink);border-color:var(--hivis)}

/* ---------- buttons ---------- */
.btn,button.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;border:2px solid var(--ink);background:var(--ink);color:#fff;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.btn:hover,.btn:focus-visible{background:var(--ink-2);color:#fff}
.btn.hv{background:var(--hivis);border-color:var(--ink);color:var(--ink)}
.btn.hv:hover{background:var(--hivis-deep);color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--paper-2);color:var(--ink)}
.btn[aria-pressed="true"]{background:var(--hivis);color:var(--ink)}
.btn-row{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}

/* ---------- sections and prose ---------- */
main{display:block}
section.band{padding:40px 0}
section.band.alt{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{margin-bottom:18px}
.sec-head h2{font-size:clamp(1.5rem,4vw,2.2rem)}
.sec-head .sub{color:var(--muted);margin-top:6px;max-width:64ch}
.prose{padding:28px 0 36px}
.prose .wrap{max-width:780px}
.prose.wide .wrap{max-width:var(--maxw)}
.prose p,.prose ul,.prose ol,.prose table,.prose .tablewrap,.prose dl{margin:0 0 1em}
.prose h2{font-size:clamp(1.45rem,3.6vw,1.9rem);margin:1.6em 0 .55em;padding-top:.5em;border-top:3px solid var(--ink)}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.25rem;margin:1.4em 0 .4em}
.prose ul,.prose ol{padding-left:1.3em}
.prose li{margin:.3em 0}
.prose li::marker{color:var(--muted)}
.prose strong{color:var(--ink)}
.prose table{width:100%;border-collapse:collapse;font-size:.97rem;background:var(--card)}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r)}
.tablewrap table{margin:0;border:0}
.prose th,.prose td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line)}
.prose thead th{background:var(--ink);color:#fff;font-family:var(--font-display);font-weight:700;font-stretch:92%}
.prose tbody tr:last-child td{border-bottom:0}
.prose ul.facts{list-style:none;padding:0;display:grid;gap:0;border:1px solid var(--line);border-radius:var(--r);background:var(--card);overflow:hidden}
.prose ul.facts li{margin:0;padding:10px 14px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(110px,32%) 1fr;gap:12px}
.prose ul.facts li:last-child{border-bottom:0}
.prose ul.facts li strong{font-family:var(--font-display);font-stretch:92%}
.tip,.warn,.law,.advice{border-radius:var(--r);padding:14px 16px;margin:0 0 1em;border-left:6px solid}
.tip{background:#F0F6DA;border-color:var(--hivis-deep)}
.warn{background:var(--warn-bg);border-color:var(--warn-line)}
.law{background:#E9EEF3;border-color:#3A5A78}
.advice{background:var(--ok-bg);border-color:var(--ok-line)}
.tip strong:first-child,.warn strong:first-child,.law strong:first-child,.advice strong:first-child{display:block;font-family:var(--font-display);font-stretch:92%;margin-bottom:2px}
.sources{font-size:.95rem;color:var(--ink-2);background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.sources ul{margin:.4em 0 .6em;padding-left:1.2em}
.checked{display:inline-block;font-weight:700;background:var(--paper-2);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:.9rem}
.arrowlinks{list-style:none;padding:0!important;display:flex;flex-wrap:wrap;gap:6px 18px}
.arrowlinks a::before{content:"→ ";text-decoration:none}

/* ---------- cards ---------- */
.cards{list-style:none;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));padding:0!important}
.cards li{margin:0!important}
a.card{display:flex;flex-direction:column;gap:6px;height:100%;padding:18px;border-radius:var(--r);background:var(--card);border:1.5px solid var(--line);text-decoration:none;color:var(--text)}
a.card:hover,a.card:focus-visible{border-color:var(--ink);box-shadow:0 4px 0 var(--ink);color:var(--text)}
.card-kicker{font-family:var(--font-display);font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.card-title{font-family:var(--font-display);font-weight:800;font-stretch:88%;font-size:1.25rem;color:var(--ink);line-height:1.15}
.card-text{color:var(--ink-2);font-size:.98rem}

/* ---------- route cards ---------- */
.routes{list-style:none;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));padding:0!important;margin:0}
.routes>li{margin:0!important}
.rcard{position:relative;display:flex;flex-direction:column;height:100%;background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);overflow:hidden}
.rcard:hover,.rcard:focus-within{border-color:var(--ink)}
.rcard-top{padding:16px 16px 10px;flex:1}
.rcard .region{font-family:var(--font-display);font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.rcard h3{font-size:1.3rem;margin:4px 0 2px}
.rcard h3 a{color:var(--ink);text-decoration:none}
.rcard h3 a::after{content:"";position:absolute;inset:0}
.rcard h3 a:hover{text-decoration:underline}
.rcard .zh{color:var(--muted);font-size:.95rem}
.rcard p.sum{margin-top:8px;font-size:.97rem;color:var(--ink-2)}
.spec{display:grid;grid-template-columns:repeat(3,1fr);border-top:1.5px dashed var(--line)}
.spec>div{padding:9px 12px;border-right:1px solid var(--line);font-size:.9rem;line-height:1.3}
.spec>div:last-child{border-right:0}
.spec dt,.spec .k{display:block;font-size:.7rem;font-family:var(--font-display);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.spec dd,.spec .v{font-weight:700;color:var(--ink)}
.rcard .badges{padding:0 16px 12px}
.rcard .save{position:relative;z-index:2;margin:0 16px 14px;align-self:flex-start}

/* badges: label + shape, never color alone */
.badges{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0!important;margin:8px 0 0!important}
.badges li{margin:0!important}
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;border-radius:999px;font-size:.82rem;font-weight:700;border:1.5px solid currentColor;background:#fff;line-height:1.3}
.badge::before{content:"";width:10px;height:10px;flex:none;background:currentColor}
.badge.t-separated{color:var(--t-separated)}.badge.t-separated::before{border-radius:50%}
.badge.t-shared_path{color:var(--t-shared)}.badge.t-shared_path::before{border-radius:50%;background:linear-gradient(90deg,currentColor 50%,transparent 50%);border:1.5px solid currentColor}
.badge.t-mixed_segments{color:var(--t-mixed)}.badge.t-mixed_segments::before{transform:rotate(45deg);width:9px;height:9px}
.badge.t-low_traffic_road{color:var(--t-lowroad)}.badge.t-low_traffic_road::before{clip-path:polygon(50% 0,100% 100%,0 100%)}
.badge.t-road_with_traffic{color:var(--t-road)}.badge.t-road_with_traffic::before{border-radius:1px}
.badge.lv{color:var(--ink)}
.badge.lv::before{width:16px;height:10px;background:linear-gradient(90deg,currentColor 0 4px,transparent 4px 6px,var(--l2,#ccc) 6px 10px,transparent 10px 12px,var(--l3,#ccc) 12px 16px)}
.badge.lv-moderate{--l2:currentColor}
.badge.lv-challenging{--l2:currentColor;--l3:currentColor}
.badge.fam-yes{color:var(--ok-line)}.badge.fam-yes::before{border-radius:50%}
.badge.fam-with_care{color:var(--t-mixed)}.badge.fam-with_care::before{transform:rotate(45deg);width:9px;height:9px}
.badge.fam-no{color:var(--stop-line)}.badge.fam-no::before{border-radius:1px}
.badge.surf{color:var(--ink-2)}.badge.surf::before{height:4px;width:12px}

/* ---------- finder ---------- */
.finder{background:var(--card);border:1.5px solid var(--ink);border-radius:var(--r);padding:16px;margin-bottom:18px}
.finder fieldset{border:0;margin:0 0 12px}
.finder legend{font-family:var(--font-display);font-weight:800;font-stretch:90%;font-size:.95rem;margin-bottom:6px;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips label{position:relative}
.chips input{position:absolute;opacity:0;width:1px;height:1px}
.chips span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;border:1.5px solid var(--line);background:var(--paper);cursor:pointer;font-weight:700;font-size:.95rem}
.chips input:checked+span{background:var(--ink);color:#fff;border-color:var(--ink)}
.chips input:checked+span::before{content:"✓ ";}
.chips input:focus-visible+span{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 6px var(--hivis)}
.finder-grid{display:grid;gap:4px 18px}
@media(min-width:900px){.finder-grid{grid-template-columns:1fr 1fr}}
.finder-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:4px 0 14px}
.finder-bar .count{font-family:var(--font-display);font-weight:800;font-size:1.1rem}
.finder input[type="search"]{width:100%;min-height:46px;border:1.5px solid var(--line);border-radius:10px;padding:0 14px;font:inherit;background:var(--paper)}
.noresults{padding:18px;background:var(--warn-bg);border-radius:var(--r);border-left:6px solid var(--warn-line)}

/* ---------- route page ---------- */
.route-head .inner{padding-bottom:22px}
.route-head .zhname{font-size:1.1rem;color:var(--ink-2);font-weight:700}
.statusline{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:12px;font-size:.95rem}
.specs{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border:1.5px solid var(--ink);border-radius:var(--r);background:var(--card);overflow:hidden;margin:0 0 1.2em}
@media(min-width:700px){.specs{grid-template-columns:repeat(4,1fr)}}
.specs>div{padding:12px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.specs dt{font-size:.72rem;font-family:var(--font-display);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.specs dd{font-weight:700;color:var(--ink);font-size:1.02rem;line-height:1.35}
.specs dd small{display:block;font-weight:400;color:var(--muted);font-size:.85rem}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 1.4em}
.why{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:1em}
.why h3{margin-top:0!important;font-size:1.05rem!important}
.plan-list{counter-reset:stop;list-style:none;padding:0!important}
.plan-list li{counter-increment:stop;position:relative;padding:4px 0 12px 46px;margin:0!important;border-left:3px dashed var(--line);margin-left:15px!important;padding-left:30px}
.plan-list li::before{content:counter(stop);position:absolute;left:-17px;top:0;width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--hivis);font-family:var(--font-display);font-weight:800;display:grid;place-items:center;font-size:.9rem}
.plan-list li:last-child{border-left-color:transparent}
.providers{list-style:none;padding:0!important;display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
.providers li{min-width:0;overflow-wrap:anywhere;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin:0!important}
.providers .pname{font-weight:700;color:var(--ink)}
.providers .kinds{font-size:.85rem;color:var(--muted)}

.more{margin:10px 0}
.more summary{cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center;color:var(--link)}
@media print{.more:not([open]) .providers{display:block}}

/* ---------- maps ---------- */
.mapbox{margin:0 0 1.2em}
.map{height:340px;border:1.5px solid var(--ink);border-radius:var(--r);background:var(--paper-2);overflow:hidden;position:relative;z-index:0}
@media(min-width:900px){.map{height:420px}}
.map-all{height:min(62vh,520px);margin-bottom:8px}
.map-section{margin:0 0 24px}
.map-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 10px}
.map-bar .form-terms{margin:0}
.map-fallback{padding:16px;color:var(--muted)}
.map.is-failed::after{content:"Map unavailable";position:absolute;inset:auto 0 0 0;padding:10px;background:var(--warn-bg)}
.map-legend-title{font-family:var(--font-display);font-weight:800;font-size:.85rem;margin:8px 0 4px}
.map-legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;padding:0!important;margin:0 0 6px!important;font-size:.9rem}
.map-legend li{display:flex;align-items:center;gap:6px;margin:0!important}
.leaflet-container{font:inherit}
.leaflet-popup-content a{font-weight:700}
.rcard .dist{margin-top:6px;font-weight:700;color:var(--ink);font-size:.92rem}
@media print{.map{height:300px;break-inside:avoid}.leaflet-control-zoom{display:none}}

.map-river{height:min(60vh,480px);margin:12px 0 8px}
[data-river] .row{grid-template-columns:minmax(0,1fr) auto}
[data-river] select{max-width:none}
.river-from{margin-top:14px}
.river-zone{font-size:1.1rem!important;margin:16px 0 6px!important}
.river-list{list-style:none;padding:0!important;display:grid;gap:6px}
.river-list li{margin:0!important;background:var(--card);border:1px solid var(--line);border-radius:10px}
.river-dest{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;width:100%;padding:10px 14px;min-height:44px}
.river-dest:focus-visible{outline:3px solid var(--ink);box-shadow:0 0 0 6px var(--hivis)}
.river-dest[aria-expanded="true"]{background:var(--paper-2)}
.rd-name{font-weight:700;color:var(--ink)}
.rd-km{font-family:var(--font-display);font-weight:800}
.rd-km small{font-family:var(--font-body);font-weight:400;color:var(--muted);margin-left:4px}
.rd-more{padding:0 14px 10px;font-size:.95rem}
.rd-flag{color:var(--stop-line);font-weight:700}
.ideas{list-style:none;padding:0!important;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.ideas li{margin:0!important}
.idea{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:14px 16px;height:100%}
.idea h3{margin:0 0 4px!important;font-size:1.1rem!important}
.idea-km{color:var(--ink-2)}
.idea-via{font-size:.9rem;color:var(--muted)}
.stat{display:inline-block;font-size:.75rem;font-weight:700;padding:1px 8px;border-radius:999px;border:1.5px solid currentColor;margin-left:4px;vertical-align:1px}
.stat-reported{color:#3A5A78}.stat-advice{color:var(--ok-line)}.stat-unconfirmed{color:var(--t-mixed)}

.poi{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.35);font:800 11px/1 var(--font-display);color:#fff;vertical-align:middle}
.poi span{line-height:1}
.poi-rest{background:#1F6B43}.poi-train{background:#1B1E1D}.poi-youbike{background:#D9A400;color:#1B1E1D}.poi-metro{background:#0B5CAD}.poi-stay{background:#6B3FA0}.poi-camera{background:#6E7672}
.map-layers{border:0;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px}
.map-layers legend{font-family:var(--font-display);font-weight:800;font-size:.85rem;margin-bottom:4px}
.map-layers label{display:flex;align-items:center;gap:6px;min-height:36px;font-size:.92rem;cursor:pointer}
.map-layers input{width:18px;height:18px}
.poi-list h3{font-size:1rem!important}
.poi-list ul{columns:2 220px;font-size:.92rem}

.stale{display:inline-block;background:#FFF4D6;color:#1B1E1D;border:1.5px solid #8A5A00;border-radius:var(--r);padding:6px 12px;margin:8px 0 0;font-weight:600}
.stale::before{content:"⚠ "}
.profile{margin:0 0 1.2em}.profile svg{width:100%;height:auto;max-height:240px;display:block;font:20px var(--font-body,sans-serif);fill:var(--ink)}
.profile .g{stroke:var(--line);stroke-width:1}.profile .a{fill:#1F6B43;fill-opacity:.18}.profile .l{fill:none;stroke:#1F6B43;stroke-width:2.5}.profile .p{fill:#D9F24B;stroke:#1B1E1D;stroke-width:2}
.profile svg text{fill:currentColor}
.events{list-style:none;padding:0!important}.event{border-top:1.5px solid var(--line);padding:12px 0}.event h3{margin:0 0 4px}
details.month{border-top:1.5px solid var(--line)}details.month>summary{min-height:48px;display:flex;align-items:center;cursor:pointer;font-family:var(--font-display);font-size:1.15em}
details.month h4{margin:1em 0 .2em}
.chips li{list-style:none;margin:0!important}.chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;border:1.5px solid var(--line);background:var(--paper);font-weight:700;text-decoration:none;color:inherit}
ul.chips{padding:0!important}.firstride{border-top:1.5px solid var(--line);padding-top:8px;margin-top:1.5em}
.rtype{border-top:1.5px solid var(--line);margin-top:1.5em}.rents{list-style:none;padding:0!important}.rent{padding:8px 0;border-bottom:1px solid var(--line)}
.rent details summary{min-height:44px;display:flex;align-items:center;cursor:pointer}
.quick-label{margin:14px 0 6px;font-weight:700;font-size:.95rem}
:is(h1,h2,h3,h4,.card-title,.big,.finder legend,.result .verdict,.compare th,.prose thead th,.map-legend-title,.map-layers legend,.rd-km,details.month>summary,.before strong,.tip strong,.warn strong,.law strong,.advice strong,.prose ul.facts li strong){word-spacing:.12em}
.home-feat .badges li:has(.surf){display:none}
.band-photo{display:block;width:100%;height:260px;object-fit:cover;object-position:center 62%;border-radius:var(--r);margin:0 0 22px}
@media(max-width:600px){.band-photo{height:170px}}
.trip{border-top:1.5px solid var(--line);margin-top:1.6em;padding-top:6px}.trip h4{margin:1em 0 .3em}.trip h4 small{font-weight:600;font-family:var(--font-body,inherit)}
.src{font-size:.85rem;overflow-wrap:anywhere}
.before{background:var(--card);border:1.5px solid var(--line);border-left:6px solid var(--ink);border-radius:var(--r);padding:12px 16px;margin:0 0 1.2em}
.before strong{font-family:var(--font-display)}
.before ul{list-style:none;padding:0!important;margin:6px 0 0!important;display:flex;flex-wrap:wrap;gap:4px 18px}
.before li{margin:0!important}
.before a{display:inline-flex;align-items:center;min-height:36px}
.before a::after{content:" ↗";text-decoration:none}

/* ---------- tools ---------- */
.tool{background:var(--card);border:1.5px solid var(--ink);border-radius:var(--r);padding:18px;margin:0 0 1.4em}
.tool h2,.tool h3{border:0!important;padding:0!important;margin-top:0!important}
.tool label{display:block;font-weight:700;margin:10px 0 4px}
.tool label select{font-weight:400;margin-top:4px}
.tool input,.tool select{width:100%;max-width:420px;min-height:46px;border:1.5px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;background:var(--paper)}
.tool .row{display:grid;gap:4px 16px}
@media(min-width:700px){.tool .row{grid-template-columns:repeat(3,1fr)}}
.result{margin-top:14px;padding:14px 16px;border-radius:var(--r);border-left:6px solid var(--line);background:var(--paper)}
.result[data-state="yes"]{background:var(--ok-bg);border-color:var(--ok-line)}
.result[data-state="limited"]{background:var(--warn-bg);border-color:var(--warn-line)}
.result[data-state="no"]{background:var(--stop-bg);border-color:var(--stop-line)}
.result .verdict{font-family:var(--font-display);font-weight:800;font-size:1.25rem;font-stretch:88%;color:var(--ink)}
.result ul{margin:.5em 0 .3em;padding-left:1.2em}
.result .fine{font-size:.9rem;color:var(--muted)}
.big{font-family:var(--font-display);font-weight:900;font-stretch:75%;font-size:2.6rem;line-height:1;color:var(--ink)}

/* compare table */
.compare th[scope="row"]{background:var(--paper-2);font-family:var(--font-display);font-stretch:92%;white-space:nowrap}
.compare td{min-width:170px}
.empty{padding:20px;border:2px dashed var(--line);border-radius:var(--r);text-align:center;color:var(--muted)}

/* stage table */
.stages td.km{font-weight:700;white-space:nowrap}
.compare-3{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:0 0 1.2em}
.compare-3>div{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:16px}
.compare-3 .big{font-size:2.2rem}
.compare-3 h3{margin-top:4px!important}

/* ---------- FAQ ---------- */
.faq{padding:30px 0 40px;background:var(--paper-2);border-top:1px solid var(--line)}
.faq .wrap{max-width:780px}
.faq h2{font-size:1.6rem;margin-bottom:12px}
.faq .qa{padding:14px 0;border-bottom:1px solid var(--line)}
.faq .q{font-size:1.1rem;margin-bottom:4px}

/* ---------- forms ---------- */
.afield{display:grid;gap:12px;max-width:560px}
.afield label{display:grid;gap:4px;font-weight:700}
.afield input,.afield textarea,.afield select{font:inherit;font-weight:400;min-height:46px;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff}
.afield button{justify-self:start}
.afield button,.choices-btn{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;border-radius:999px;border:2px solid var(--ink);background:var(--ink);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.form-terms{font-size:.9rem;color:var(--muted)}
.panel{background:var(--card);border:1.5px solid var(--ink);border-radius:var(--r);padding:20px}

/* ---------- consent banner ---------- */
.consent{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;max-width:560px;margin:0 auto;background:var(--ink);color:#F5F3EC;border-radius:var(--r);padding:16px;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.consent a{color:var(--hivis)}
.consent-actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.consent button{min-height:44px;padding:0 18px;border-radius:999px;border:2px solid var(--hivis);background:var(--hivis);color:var(--ink);font:inherit;font-weight:700;cursor:pointer}
.consent button.quiet{background:transparent;color:#F5F3EC;border-color:#8A918D}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:60;background:var(--ink);color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;box-shadow:0 6px 20px rgba(0,0,0,.25)}

/* ---------- footer ---------- */
footer.site{background:var(--ink);color:#D9D6CC;margin-top:0;padding:36px 0 26px}
footer.site::before{content:"";display:block;height:4px;margin-top:-36px;margin-bottom:32px;background:repeating-linear-gradient(90deg,var(--hivis) 0 28px,transparent 28px 44px)}
footer.site a{color:#F5F3EC;text-decoration:none}
footer.site a:hover{text-decoration:underline;color:#fff}
.foot-top{display:grid;gap:24px;grid-template-columns:1fr}
@media(min-width:800px){.foot-top{grid-template-columns:1.4fr 1fr 1fr 1fr}}
footer .brand-blurb .name{font-family:var(--font-display);font-weight:900;font-stretch:75%;font-size:1.6rem;color:#fff;text-transform:lowercase}
footer .brand-blurb .name b{color:var(--hivis)}
footer .brand-blurb p{margin-top:8px;font-size:.95rem;max-width:40ch}
.fcol h2{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hivis);margin-bottom:8px}
.fcol a{display:flex;align-items:center;min-height:36px}
.colophon{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between;margin-top:26px;padding-top:16px;border-top:1px solid #3A403D;font-size:.9rem}
.colophon .legal a{display:inline-flex;min-height:36px;align-items:center}

/* ---------- print: the route sheet ---------- */
.print-only{display:none}
@media print{
  @page{margin:14mm}
  body{background:#fff;font-size:10.5pt;color:#000}
  header.site,footer.site,.consent,.toast,.actions,.btn,.save,.nav,.skip,.noprint,.faq,.finder,.quick{display:none!important}
  .print-only{display:block}
  .hero,.hero.has-photo{background:#fff!important;color:#000;border-bottom:2px solid #000}
  .hero.has-photo::before{display:none}
  .hero h1,.hero .lede,.hero .eyebrow{color:#000!important}
  .hero .inner{padding:0 0 8px}
  .prose{padding:8px 0}
  .prose h2{break-after:avoid;border-top:1.5px solid #000;margin-top:1em}
  .specs,.prose ul.facts,.why,.tip,.warn,.law,.advice,.sources,.providers li,.plan-list li{break-inside:avoid}
  .specs{border:1.5px solid #000}
  a{color:#000;text-decoration:underline}
  .sources a[href^="http"]::after,.print-urls a[href^="http"]::after{content:" (" attr(href) ")";font-size:8.5pt;word-break:break-all}
  .badge{border-width:1px}
  .wrap{max-width:none;padding:0}
}