/*
Theme Name: Three Lanes
Theme URI: https://three-lanes.example/
Author: WE Web Design
Author URI: https://example.org/
Description: City-by-city guides to car, motorcycle and truck accident lawyers, built to be quick: the front page is a road of three lanes beside a warning triangle, one lane for each kind of accident, each opening on the cities it covers A to Z; the newest guides follow as a short list. A guide opens on its lane and city, the firms it names on numbered evidence markers with a number to call, and the guides for the other kinds of accident in the same city. No web font, no image: the road and the markers are drawn by the stylesheet. Sign indigo and crash red on a roadside grey; light indigo and rose at night. Categories, tags and author archives are never shown or linked.
Version: 1.0.1
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: three-lanes
Tags: blog, grid-layout, custom-menu, threaded-comments, translation-ready, block-patterns, wide-blocks, editor-style
*/

/* ========================================================================
   1. TOKENS - sign indigo + crash red on roadside grey, light indigo + rose at night (34/34 pairs AA, worst 4.81:1); system faces only (no web font)
   ======================================================================== */
:root{
  --paper:#f5f4f0;
  --paper-2:#e7e8e2;
  --ink:#17181a;
  --ink-2:#3a3c40;
  --ink-3:#585b60;
  --rule:#d3d4ce;
  --card:#ffffff;
  --accent:#5356ac;
  --accent-2:#590d24;
  --warn:#9a4708;
  --warn-soft:#fef3c7;
  --safe:#0e7490;
  --safe-soft:#e0f2fe;
  --link:var(--accent);
  --focus:#17181a;

  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --serif:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;

  --measure:42rem;
  --measure-wide:64rem;
  --shell:84rem;

  --space-1:.25rem;
  --space-2:.5rem;
  --space-3:.75rem;
  --space-4:1rem;
  --space-5:1.5rem;
  --space-6:2rem;
  --space-7:3rem;
  --space-8:4rem;
  --space-9:6rem;

  --radius-1:.25rem;
  --radius-2:.5rem;
  --radius-3:.75rem;

  --shadow-1:0 1px 2px rgba(26,36,33,.06),0 1px 1px rgba(26,36,33,.04);
  --shadow-2:0 4px 12px rgba(26,36,33,.08),0 2px 4px rgba(26,36,33,.04);

  --z-base:0;
  --z-sticky:10;
  --z-rail:20;
  --z-progress:30;
  --z-topbar:40;
  --z-drawer:50;
  --z-skip:999;

  color-scheme:light;
}
[data-theme="dark"]{
  --paper:#131415;
  --paper-2:#1b1c1e;
  --ink:#eeeeec;
  --ink-2:#c8c9cb;
  --ink-3:#9fa2a6;
  --rule:#2c2e31;
  --card:#17181a;
  --accent:#7285ca;
  --accent-2:#dd5f74;
  --warn:#fbbf24;
  --warn-soft:#1c1410;
  --safe:#7dd3fc;
  --safe-soft:#0c1f2e;
  --link:var(--accent);
  --focus:#e7e8e2;
  --shadow-1:0 1px 2px rgba(0,0,0,.4),0 1px 1px rgba(0,0,0,.3);
  --shadow-2:0 4px 12px rgba(0,0,0,.5),0 2px 4px rgba(0,0,0,.4);
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#131415;
    --paper-2:#1b1c1e;
    --ink:#eeeeec;
    --ink-2:#c8c9cb;
    --ink-3:#9fa2a6;
    --rule:#2c2e31;
    --card:#17181a;
    --accent:#7285ca;
    --accent-2:#dd5f74;
    --warn:#fbbf24;
    --warn-soft:#1c1410;
    --safe:#7dd3fc;
    --safe-soft:#0c1f2e;
    --link:var(--accent);
    --focus:#e7e8e2;
    --shadow-1:0 1px 2px rgba(0,0,0,.4),0 1px 1px rgba(0,0,0,.3);
    --shadow-2:0 4px 12px rgba(0,0,0,.5),0 2px 4px rgba(0,0,0,.4);
    color-scheme:dark;
  }
}

/* ========================================================================
   2. RESET + BASE
   ======================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.7;
  font-feature-settings:'ss01','kern','liga';
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}
img{aspect-ratio:attr(width)/attr(height)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
a{color:var(--link);text-underline-offset:.18em;text-decoration-thickness:.06em}
a:hover{text-decoration-thickness:.12em}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--focus);
  outline-offset:2px;
  border-radius:var(--radius-1);
}
hr{border:0;border-top:1px solid var(--rule);margin:var(--space-6) 0}
::selection{background:var(--accent);color:var(--paper)}

/* ========================================================================
   3. SKIP LINK (WD-9 — focus override mandatory)
   ======================================================================== */
.skip-link{
  position:absolute;
  left:-9999px;top:-9999px;
  width:auto;height:auto;
  clip:auto;clip-path:none;overflow:visible;
  background:var(--ink);
  color:var(--paper);
  padding:.75rem 1.25rem;
  border-radius:var(--radius-2);
  font-weight:600;
  z-index:var(--z-skip);
  text-decoration:none;
}
.skip-link:focus{left:1rem;top:1rem}

/* ========================================================================
   4. TYPOGRAPHY (WD-10, WD-14)
   ======================================================================== */
h1,h2,h3,h4,h5,h6{
  font-family:var(--serif);
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.01em;
  margin:2.4rem 0 .8rem;
  color:var(--ink);
  text-wrap:balance;
}
h1{font-size:clamp(2rem,4.2vw,2.75rem);line-height:1.15;letter-spacing:-.02em;margin-top:0}
h2{font-size:clamp(1.5rem,2.6vw,1.875rem)}
h3{font-size:clamp(1.25rem,2vw,1.4rem)}
h4{font-size:1.125rem}
h5,h6{font-size:1rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}
p{margin:0 0 1.1rem;text-wrap:pretty}
strong,b{font-weight:600;color:var(--ink)}
em,i{font-style:italic}
small{font-size:.8125rem;color:var(--ink-2)}
blockquote{
  border-left:3px solid var(--accent);
  margin:1.6rem 0;
  padding:.4rem 0 .4rem 1.2rem;
  font-family:var(--serif);
  font-size:1.125rem;
  font-style:italic;
  color:var(--ink-2);
}
blockquote cite{display:block;font-style:normal;font-size:.875rem;color:var(--ink-3);margin-top:.4rem}
code,kbd,pre,samp{font-family:ui-monospace,'SF Mono','Menlo','Consolas',monospace;font-size:.9em}
:not(pre)>code{background:var(--paper-2);padding:.15em .4em;border-radius:var(--radius-1);color:var(--ink)}
pre{
  background:var(--paper-2);
  border:1px solid var(--rule);
  border-radius:var(--radius-2);
  padding:1rem 1.2rem;
  overflow-x:auto;
  font-size:.875rem;
  line-height:1.55;
  margin:1.5rem 0;
}
ul,ol{margin:0 0 1.2rem;padding-left:1.4rem}
li{margin:.4rem 0}
ul li::marker{color:var(--accent)}
dl{margin:1.2rem 0}
dt{font-weight:600;margin-top:.8rem}
dd{margin:0 0 .4rem 1.2rem;color:var(--ink-2)}
table{border-collapse:collapse;width:100%;margin:1.5rem 0;font-size:.95rem}
th,td{padding:.6rem .8rem;text-align:left;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-weight:600;color:var(--ink);background:var(--paper-2)}
tbody tr:hover{background:var(--paper-2)}
figure{margin:1.6rem 0}
figcaption{font-size:.875rem;color:var(--ink-3);text-align:center;margin-top:.5rem;font-style:italic}

/* ========================================================================
   5. LAYOUT — page shell
   ======================================================================== */
.page-shell{min-height:100vh;display:flex;flex-direction:column}
.site-main{flex:1 0 auto}
.wrap{max-width:var(--shell);margin:0 auto;padding:0 clamp(1rem,4vw,2rem)}

/* ========================================================================
   6. TOPBAR (WD-7 touch 44+)
   ======================================================================== */
.topbar{
  position:sticky;top:0;z-index:var(--z-topbar);
  background:color-mix(in oklab,var(--paper) 92%,transparent);
  backdrop-filter:saturate(160%) blur(10px);
  -webkit-backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--rule);
}
.topbar__inner{
  max-width:var(--shell);
  margin:0 auto;
  padding:.6rem clamp(1rem,4vw,2rem);
  display:flex;align-items:center;gap:1rem;
  min-height:60px;
}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand__mark{
  width:34px;height:34px;border-radius:50%;
  background:var(--accent);
  color:var(--paper);
  font-family:var(--serif);
  font-weight:600;
  font-size:1.05rem;
  display:grid;place-items:center;
  letter-spacing:-.02em;
}
.brand__name{font-family:var(--serif);font-weight:600;font-size:1.125rem;letter-spacing:-.01em}
.topbar__inner{flex-wrap:wrap;row-gap:.35rem}
.brand{flex:1 1 auto;min-width:0;min-height:44px}
.brand__mark{flex:0 0 auto}
.brand__name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar__nav{display:flex;order:4;flex:1 1 100%;flex-wrap:wrap;gap:0 1.2rem;font-size:.95rem;align-items:center}
.topbar__nav a{color:var(--ink-2);text-decoration:none;padding:.6rem 0;min-height:44px;display:inline-flex;align-items:center}
.topbar__nav a:hover,.topbar__nav a[aria-current="page"]{color:var(--ink)}
.topbar__search{order:3;flex:1 1 100%;min-width:0}
.theme-toggle{order:2;flex:0 0 auto;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--ink-2)}
.theme-toggle:hover{color:var(--ink);background:var(--paper-2)}
.theme-toggle:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.theme-toggle .sun{display:none}
[data-theme="dark"] .theme-toggle .moon{display:none}
[data-theme="dark"] .theme-toggle .sun{display:block}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .theme-toggle .moon{display:none}
  :root:not([data-theme="light"]) .theme-toggle .sun{display:block}
}
@media (min-width:48rem){
  .topbar__inner{flex-wrap:nowrap}
  .brand{flex:0 0 auto}
  .topbar__nav{order:0;flex:0 1 auto;margin-left:auto;flex-wrap:nowrap}
  .topbar__search{order:0;flex:0 1 20rem;margin-left:auto}
  .topbar__nav + .topbar__search{margin-left:0}
  .theme-toggle{order:0}
}

/* ========================================================================
   7. SEARCH INPUT
   ======================================================================== */
.search-form{position:relative;width:100%}
.search-form__input{
  width:100%;
  background:var(--paper-2);
  border:1px solid var(--rule);
  border-radius:999px;
  padding:.55rem 3rem .55rem 2.4rem;
  font-size:1rem;
  min-height:44px;
  color:var(--ink);
}
.search-form__input::placeholder{color:var(--ink-3)}
.search-form__icon{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--ink-3);pointer-events:none}
.search-form__submit{position:absolute;right:.05rem;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);background:transparent}
.search-form__submit:hover{color:var(--ink);background:var(--paper)}

/* ========================================================================
   8. READING PROGRESS BAR (WD-16 reduced-motion respect)
   ======================================================================== */
.reading-progress{
  position:fixed;top:0;left:0;right:0;height:3px;
  z-index:var(--z-progress);
  background:transparent;
  pointer-events:none;
}
.reading-progress__bar{
  display:block;height:100%;width:0;
  background:var(--accent);
  transition:width .12s linear;
  transform-origin:left;
}
@media (prefers-reduced-motion:reduce){
  .reading-progress__bar{transition:none}
}

/* ========================================================================
   9-10. (front-page hero + magazine grid removed)
   The front page is a road of three lanes, one per kind of accident, each opening on its cities, and lists the newest guides (section 28).
   ======================================================================== */

/* ========================================================================
   11. ARTICLE — two-column long-form
   ======================================================================== */
.article-shell{
  max-width:var(--measure-wide);
  margin:0 auto;
  padding:clamp(2rem,4vw,3rem) clamp(1rem,4vw,2rem);
}
.article-main{min-width:0;max-width:46rem;margin-inline:auto}
.article-main--page{margin-inline:auto;padding-block:clamp(2.5rem,5vw,4rem)}

/* ========================================================================
   11b. COLLAPSIBLE SUMMARY CARD (optional — sits at top of article)
   ======================================================================== */
.tldr-card{
  background:var(--card);
  border:1px solid var(--rule);
  border-left:4px solid var(--accent);
  border-radius:var(--radius-3);
  padding:1.2rem 1.4rem;
  margin:0 0 2rem;
  box-shadow:var(--shadow-1);
}
.tldr-card[open] summary{margin-bottom:.8rem}
.tldr-card summary{
  cursor:pointer;
  display:flex;align-items:center;gap:.6rem;
  list-style:none;
  font-family:var(--serif);
  font-size:1rem;
  font-weight:600;
  color:var(--accent-2);
  letter-spacing:-.005em;
  min-height:32px;
}
.tldr-card summary::-webkit-details-marker{display:none}
.tldr-card summary::before{
  content:'';
  width:0;height:0;
  border-left:5px solid currentColor;
  border-top:4px solid transparent;
  border-bottom:4px solid transparent;
  transition:transform .15s ease;
  flex-shrink:0;
}
.tldr-card[open] summary::before{transform:rotate(90deg)}
.tldr-card__label{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.72rem;
  font-weight:700;
  color:var(--accent);
  margin-right:auto;
}
.tldr-card p,.tldr-card ul,.tldr-card ol{
  font-size:.985rem;
  line-height:1.65;
  color:var(--ink-2);
  margin:0 0 .8rem;
}
.tldr-card p:last-child,.tldr-card ul:last-child,.tldr-card ol:last-child{margin-bottom:0}
@media (prefers-reduced-motion:reduce){
  .tldr-card summary::before{transition:none}
}

/* ========================================================================
   11c. FOOTNOTE-STYLE REFERENCES (sourced citations, bottom of article)
   ======================================================================== */
.article-refs{
  margin:3rem 0 0;
  padding:1.6rem 0 0;
  border-top:2px solid var(--accent);
}
.article-refs__heading{
  font-family:var(--serif);
  font-size:1.05rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.1em;
  margin:0 0 1rem;
  color:var(--ink);
}
.article-refs__list{
  list-style:none;
  margin:0;padding:0;
  counter-reset:refs;
  font-size:.9rem;
  line-height:1.55;
}
.article-refs__list li{
  counter-increment:refs;
  display:flex;
  gap:.6rem;
  margin:.6rem 0;
  color:var(--ink-2);
}
.article-refs__list li::before{
  content:counter(refs);
  font-family:var(--mono);
  font-size:.8rem;
  font-weight:600;
  color:var(--accent-2);
  min-width:1.6rem;
  text-align:right;
  flex-shrink:0;
}
.article-refs__list a{color:var(--link);text-underline-offset:.16em;word-break:break-word}
.article-refs__source{font-style:italic;color:var(--ink-3)}

/* In-prose footnote callout */
.prose sup.fn-ref{
  font-family:var(--mono);
  font-size:.72em;
  font-weight:600;
  vertical-align:super;
  line-height:0;
}
.prose sup.fn-ref a{
  color:var(--accent-2);
  text-decoration:none;
  padding:0 .15em;
  background:var(--paper-2);
  border-radius:.2em;
}
.prose sup.fn-ref a:hover{background:var(--accent);color:var(--paper)}

/* ========================================================================
   11d. INLINE RELATED CARD (in-flow related card)
   ======================================================================== */
.inline-related-card{
  background:var(--card);
  border:1px solid var(--rule);
  border-left:3px solid var(--accent);
  border-radius:var(--radius-3);
  padding:1.1rem 1.3rem;
  margin:2rem 0;
  display:flex;flex-direction:column;gap:.4rem;
}
.inline-related-card__label{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.72rem;
  font-weight:700;
  color:var(--ink-3);
}
.inline-related-card__title{font-family:var(--serif);font-size:1.05rem;line-height:1.3;margin:0;letter-spacing:-.01em}
.inline-related-card__title a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule)}
.inline-related-card__title a:hover{color:var(--accent-2);border-bottom-color:var(--accent)}
.inline-related-card__why{font-size:.95rem;color:var(--ink-2);margin:.2rem 0 0;line-height:1.55}

/* Decision/comparison card — two options side by side */
.diy-vs-pro{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border:1px solid var(--rule);
  border-radius:var(--radius-3);
  overflow:hidden;
  margin:2rem 0;
}
@media (min-width:720px){.diy-vs-pro{grid-template-columns:1fr 1fr}}
.diy-vs-pro__col{padding:1.2rem 1.4rem;display:flex;flex-direction:column;gap:.5rem}
.diy-vs-pro__col--safe{background:var(--safe-soft);border-bottom:1px solid var(--rule)}
.diy-vs-pro__col--pro{background:var(--warn-soft)}
@media (min-width:720px){
  .diy-vs-pro__col--safe{border-bottom:0;border-right:1px solid var(--rule)}
}
.diy-vs-pro__label{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.72rem;
  font-weight:700;
}
.diy-vs-pro__col--safe .diy-vs-pro__label{color:var(--safe)}
.diy-vs-pro__col--pro .diy-vs-pro__label{color:var(--warn)}
.diy-vs-pro__title{font-family:var(--serif);font-size:1.05rem;font-weight:600;margin:0;color:var(--ink)}
.diy-vs-pro__body{font-size:.925rem;color:var(--ink-2);line-height:1.55;margin:0}
.diy-vs-pro__body ul{margin:.4rem 0 0;padding-left:1.2rem}
.diy-vs-pro__body li{margin:.2rem 0}

/* ========================================================================
   12. ARTICLE HEAD
   ======================================================================== */
.post__header{margin-bottom:2rem}
.post__kicker{
  display:inline-block;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.78rem;
  font-weight:600;
  color:var(--accent-2);
  text-decoration:none;
  margin-bottom:.8rem;
}
.post__kicker:hover{color:var(--accent)}
.post__title{
  font-family:var(--serif);
  font-size:clamp(2rem,4vw,2.75rem);
  line-height:1.12;
  letter-spacing:-.02em;
  margin:0 0 1rem;
  text-wrap:balance;
}
.post__byline{
  display:flex;flex-wrap:wrap;gap:1rem 1.4rem;
  font-size:.875rem;color:var(--ink-3);
  margin:0 0 1.4rem;
  padding:0;
}
.post__byline > span{display:inline-flex;align-items:baseline;gap:.4rem}
.post__byline .label{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.7rem;
  font-weight:600;
  color:var(--ink-3);
}
.post__byline time{color:var(--ink-2)}
.post__featured-img{margin:0 0 2rem;border-radius:var(--radius-3);overflow:hidden;border:1px solid var(--rule)}
.post__featured-img img{width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover}

/* ========================================================================
   13. PROSE — body content (long-form readability)
   ======================================================================== */
.prose{font-size:1.0625rem;line-height:1.75}
/* A raw URL or a long unbroken string in the content must wrap instead of
   widening the page on a phone (tema 53: a references list of raw URLs pushed
   the page to 473px at 320). Tables are excluded - they scroll in their region. */
.prose :is(p,li,dd,dt,blockquote,figcaption,h2,h3,h4){overflow-wrap:anywhere}
.prose > * + *{margin-top:0}
.prose p{margin:0 0 1.2rem}
.prose h2{margin:2.6rem 0 .9rem;scroll-margin-top:5rem;font-size:clamp(1.4rem,2.4vw,1.75rem)}
.prose h3{margin:2rem 0 .7rem;scroll-margin-top:5rem;font-size:clamp(1.15rem,1.8vw,1.3rem)}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose ul,.prose ol{margin:0 0 1.2rem;padding-left:1.6rem}
.prose li{margin:.5rem 0}
.prose img{border-radius:var(--radius-2);border:1px solid var(--rule);margin:1.6rem 0}
.prose a{color:var(--link)}
.prose a:hover{color:var(--accent)}

/* ========================================================================
   14. TL;DR CARD (block pattern)
   ======================================================================== */
.tldr{
  background:var(--card);
  border:1px solid var(--rule);
  border-left:3px solid var(--accent);
  border-radius:var(--radius-3);
  padding:1.2rem 1.4rem;
  margin:0 0 2rem;
}
.tldr__label{
  display:block;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.72rem;
  font-weight:700;
  color:var(--accent-2);
  margin-bottom:.5rem;
}
.tldr p{margin:0 0 .6rem;font-size:.985rem;line-height:1.6;color:var(--ink-2)}
.tldr p:last-child{margin-bottom:0}
.tldr ul,.tldr ol{margin:.4rem 0 0;padding-left:1.2rem;font-size:.975rem;color:var(--ink-2)}

/* ========================================================================
   15. LEGAL DISCLAIMER CALLOUT
   ======================================================================== */
.legal-disclaimer{
  background:var(--warn-soft);
  border:1px solid color-mix(in oklab,var(--warn) 35%,var(--rule));
  border-radius:var(--radius-3);
  padding:1.1rem 1.3rem;
  margin:0 0 2rem;
  font-size:.925rem;
  line-height:1.55;
  color:var(--ink-2);
}
.legal-disclaimer__label{
  display:flex;align-items:center;gap:.5rem;
  font-weight:700;
  color:var(--warn);
  margin-bottom:.4rem;
  font-size:.85rem;
  letter-spacing:.04em;
}
.legal-disclaimer__label::before{
  content:'';
  display:inline-block;
  width:14px;height:14px;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 2L1 21h22L12 2zm0 6l7.5 13h-15L12 8zm-1 4v4h2v-4h-2zm0 5v2h2v-2h-2z'/></svg>") no-repeat center / contain;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'><path d='M12 2L1 21h22L12 2zm0 6l7.5 13h-15L12 8zm-1 4v4h2v-4h-2zm0 5v2h2v-2h-2z'/></svg>") no-repeat center / contain;
  flex-shrink:0;
}
.legal-disclaimer p{margin:0 0 .5rem}
.legal-disclaimer p:last-child{margin-bottom:0}

/* ========================================================================
   16. CALLOUT (general block pattern, info/warning)
   ======================================================================== */
.callout{
  background:var(--paper-2);
  border:1px solid var(--rule);
  border-left:3px solid var(--accent);
  border-radius:var(--radius-3);
  padding:1rem 1.2rem;
  margin:1.6rem 0;
  font-size:.975rem;
}
.callout.is-style-warning{
  border-left-color:var(--warn);
  background:var(--warn-soft);
}
.callout p{margin:0 0 .6rem}
.callout p:last-child{margin-bottom:0}

/* ========================================================================
   17. META RAIL (right column on article)
   ======================================================================== */
.meta-rail__group{margin-bottom:1.4rem;padding-bottom:1.4rem;border-bottom:1px solid var(--rule)}
.meta-rail__group:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.meta-rail__label{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.72rem;
  font-weight:700;
  color:var(--ink-3);
  margin:0 0 .55rem;
}
.meta-rail__value{font-size:.925rem;color:var(--ink-2);margin:0;line-height:1.5}
.meta-rail__value strong{color:var(--ink);font-weight:600}

/* ========================================================================
   18. TOC (table of contents — scrollspy)
   ======================================================================== */
.toc__list{list-style:none;margin:0;padding:0;font-size:.9rem;line-height:1.4}
.toc__list li{margin:.35rem 0}
.toc__list a{
  color:var(--ink-2);
  text-decoration:none;
  display:block;
  padding:.2rem .55rem;
  border-left:2px solid transparent;
  border-radius:0 var(--radius-1) var(--radius-1) 0;
  transition:color .15s ease,border-color .15s ease,background .15s ease;
}
.toc__list a:hover{color:var(--ink);background:var(--paper-2)}
.toc__list a.is-active{
  color:var(--accent-2);
  border-left-color:var(--accent);
  background:var(--paper-2);
  font-weight:600;
}
@media (prefers-reduced-motion:reduce){
  .toc__list a{transition:none}
}
.toc__list .toc-h3{padding-left:.9rem;font-size:.85rem;color:var(--ink-3)}
.toc__list .toc-h3 a{padding-left:.9rem}

/* ========================================================================
   19. MOBILE TOC DRAWER
   ======================================================================== */
.inline-toc{
  background:var(--paper-2);
  border:1px solid var(--rule);
  border-radius:var(--radius-3);
  padding:.8rem 1.2rem;
  margin:0 0 2rem;
}
.inline-toc summary{
  cursor:pointer;
  font-weight:600;
  font-size:.95rem;
  color:var(--ink);
  list-style:none;
  display:flex;align-items:center;gap:.5rem;
  padding:.3rem 0;
  min-height:32px;
}
.inline-toc summary::-webkit-details-marker{display:none}
.inline-toc summary::before{
  content:'';
  display:inline-block;
  width:0;height:0;
  border-left:5px solid currentColor;
  border-top:4px solid transparent;
  border-bottom:4px solid transparent;
  transition:transform .15s ease;
  flex-shrink:0;
}
.inline-toc[open] summary::before{transform:rotate(90deg)}
.inline-toc .toc__list{margin-top:.6rem;padding-left:.4rem}
@media (prefers-reduced-motion:reduce){
  .inline-toc summary::before{transition:none}
}

.toc-drawer-toggle{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--paper-2);
  border:1px solid var(--rule);
  border-radius:999px;
  padding:.5rem 1rem;
  font-size:.9rem;
  color:var(--ink-2);
  margin:0 0 1rem;
  min-height:44px;
}
.toc-drawer-toggle:hover{color:var(--ink);background:var(--card)}
@media (min-width:1080px){
  .toc-drawer-toggle{display:none}
}
.toc-drawer{
  position:fixed;
  inset:0;
  z-index:var(--z-drawer);
  background:rgba(26,36,33,.5);
  display:none;
  padding:5rem 1rem 1rem;
}
.toc-drawer[data-open="true"]{display:block}
.toc-drawer__panel{
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:var(--radius-3);
  padding:1.4rem;
  max-width:32rem;
  margin:0 auto;
  max-height:80vh;
  overflow:auto;
}
.toc-drawer__close{
  float:right;
  width:36px;height:36px;
  display:grid;place-items:center;
  border-radius:var(--radius-2);
  color:var(--ink-2);
}
.toc-drawer__close:hover{color:var(--ink);background:var(--paper-2)}

/* ========================================================================
   20. PAGINATION
   ======================================================================== */
.pagination{
  display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;
  margin:3rem 0 2rem;
  padding-top:1.5rem;
  border-top:1px solid var(--rule);
}
.pagination a,.pagination span{
  display:inline-grid;place-items:center;
  min-width:44px;height:44px;
  padding:0 .8rem;
  border-radius:var(--radius-2);
  font-size:.95rem;
  color:var(--ink-2);
  text-decoration:none;
  border:1px solid var(--rule);
}
.pagination a:hover{color:var(--ink);background:var(--paper-2);border-color:var(--ink-3)}
.pagination .current{background:var(--accent);color:var(--paper);border-color:var(--accent);font-weight:600}
.pagination .dots{border:0;background:transparent}

/* ========================================================================
   21. POST NAV (prev / next)
   ======================================================================== */
.post-nav{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  margin:3rem 0 0;
  padding-top:1.6rem;
  border-top:1px solid var(--rule);
}
@media (min-width:640px){.post-nav{grid-template-columns:1fr 1fr}}
.post-nav a{
  display:block;
  padding:1rem 1.2rem;
  background:var(--card);
  border:1px solid var(--rule);
  border-radius:var(--radius-3);
  text-decoration:none;
  color:var(--ink);
  transition:border-color .15s ease;
}
.post-nav a:hover{border-color:var(--accent)}
.post-nav__label{
  display:block;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:.72rem;
  font-weight:600;
  color:var(--ink-3);
  margin-bottom:.3rem;
}
.post-nav__title{font-family:var(--serif);font-size:1.025rem;line-height:1.3;color:var(--ink)}
.post-nav__next{text-align:right}

/* ========================================================================
   22. FOOTER
   ======================================================================== */
.site-footer{
  border-top:1px solid var(--rule);
  padding:clamp(2.5rem,5vw,4rem) 0 clamp(1.5rem,3vw,2.5rem);
  margin-top:clamp(3rem,6vw,5rem);
  font-size:.925rem;
  color:var(--ink-2);
}
.site-footer__top{
  display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:1.6rem;
  margin-bottom:2rem;
  padding-bottom:1.6rem;
  border-bottom:1px solid var(--rule);
}
.site-footer__brand{display:flex;flex-direction:column;gap:.4rem;max-width:24rem}
.site-footer__name{font-family:var(--serif);font-weight:600;font-size:1.05rem;color:var(--ink)}
.site-footer__tag{color:var(--ink-3);font-size:.9rem;line-height:1.5;margin:0}
.site-footer__links{display:flex;flex-wrap:wrap;gap:1.4rem;font-size:.9rem}
.site-footer__links a{color:var(--ink-2);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.site-footer__links a:hover{color:var(--ink)}
.site-footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;font-size:.825rem;color:var(--ink-3)}
.site-footer__disclaimer{max-width:50rem;line-height:1.55;color:var(--ink-3);font-size:.825rem;margin:1rem 0 0}

/* ========================================================================
   23. COMMENTS
   ======================================================================== */
.comments-area{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--rule)}
.comments-title{font-family:var(--serif);font-size:1.4rem;margin:0 0 1.4rem}
.comment-list{list-style:none;margin:0;padding:0}
.comment-list li{margin:0 0 1.4rem;padding:1rem 1.2rem;background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-3)}
.comment-meta{font-size:.875rem;color:var(--ink-3);margin-bottom:.5rem}
.comment-meta cite{font-style:normal;color:var(--ink);font-weight:600}
.comment-form label{display:block;font-size:.875rem;margin:.8rem 0 .3rem;color:var(--ink-2);font-weight:500}
.comment-form input[type="text"],.comment-form input[type="email"],.comment-form input[type="url"],.comment-form textarea{
  width:100%;
  background:var(--paper-2);
  border:1px solid var(--rule);
  border-radius:var(--radius-2);
  padding:.6rem .8rem;
  font:inherit;
  color:var(--ink);
  min-height:44px;
}
.comment-form textarea{min-height:8rem;resize:vertical}
.form-submit input[type="submit"],.button{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--accent);
  color:var(--paper);
  border:0;
  padding:.7rem 1.4rem;
  border-radius:var(--radius-2);
  font:inherit;
  font-weight:600;
  cursor:pointer;
  min-height:44px;
  min-width:44px;
  transition:background .15s ease;
}
.form-submit input[type="submit"]:hover,.button:hover{background:var(--accent-2)}
@media (prefers-reduced-motion:reduce){
  .form-submit input[type="submit"],.button{transition:none}
}

/* ========================================================================
   24. 404 / SEARCH
   ======================================================================== */
.error-404,.search-results-head{padding:clamp(3rem,6vw,5rem) 0;text-align:center}
.error-404__code{font-family:var(--serif);font-size:clamp(4rem,12vw,7rem);line-height:1;color:var(--accent);letter-spacing:-.04em;margin:0}
.error-404__title{font-family:var(--serif);font-size:clamp(1.6rem,3vw,2rem);margin:.6rem 0 1rem}
.error-404__lede{color:var(--ink-2);max-width:36rem;margin:0 auto 1.4rem;line-height:1.6}
.error-404__suggest{max-width:34rem;margin:1.6rem auto 0;text-align:left}

/* ========================================================================
   25. WP HELPERS
   ======================================================================== */
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden;padding:0;margin:-1px;border:0;word-wrap:normal!important}
.alignleft{float:left;margin:.5rem 1.4rem 1rem 0}
.alignright{float:right;margin:.5rem 0 1rem 1.4rem}
.aligncenter{margin-left:auto;margin-right:auto;display:block}
.alignwide{max-width:min(var(--measure-wide),100%);margin-left:auto;margin-right:auto}
.alignfull{max-width:100%;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);width:100vw}
.wp-block-image img{border-radius:var(--radius-2)}
.wp-block-quote{border-left:3px solid var(--accent);padding:.4rem 0 .4rem 1.2rem;margin:1.6rem 0;font-family:var(--serif);font-style:italic;color:var(--ink-2)}
.wp-block-pullquote{border:0;padding:1.5rem 1.5rem;text-align:left;font-family:var(--serif);font-size:1.3rem;line-height:1.4}
.wp-block-table{margin:1.5rem 0}
.wp-block-table table{border:1px solid var(--rule)}

/* ========================================================================
   28. THE ROAD
   Front page, quick and plain: the head (the name of the site, the title, what the guides hold) beside
   a red warning triangle; then the road: one asphalt lane for each kind of accident, a vehicle drawn
   on it and the lanes parted by dashed lines; a lane opens on its cities, A to Z; then the newest
   guides as a plain list. No web font, no image, no script: the road, the vehicles and the triangle
   are drawn here.
   ======================================================================== */
:root{--tln-asphalt:#2b2d31;--tln-paint:#f4f4f0;--tln-red:#d0021b;--tln-yellow:#f5c518}
html{scroll-padding-top:var(--tln-pad,5rem)}
@media (max-width:47.99rem){html{scroll-padding-top:var(--tln-pad,11.5rem)}}
.prose h2,.prose h3{scroll-margin-top:0}
.brand__mark{font-weight:800}
@media (max-width:47.99rem){.brand{flex:1 1 0}.brand__name{white-space:normal;overflow:visible;line-height:1.15}}
.reading-progress__bar{background-color:var(--accent)}

.tln-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:start;padding-top:clamp(1.6rem,4.5vw,3rem);padding-bottom:1.2rem}
@media (min-width:48rem){.tln-head{align-items:center}}
.tln-head__text{min-width:0}
.tln-head__eyebrow{margin:0 0 .6rem;font-weight:700;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-2);overflow-wrap:anywhere}
.tln-head__title{max-width:21ch;margin:0 0 .6rem;font-family:var(--serif);font-weight:800;font-size:clamp(2rem,5.2vw,3.5rem);line-height:1.04;letter-spacing:-.025em;text-wrap:balance;overflow-wrap:anywhere}
.tln-head__count{margin:0;font-weight:700;font-size:1.05rem;color:var(--ink-2)}
.tln-triangle{position:relative;width:4.6rem;height:4rem;margin-top:1.6rem;justify-self:end}
@media (min-width:48rem){.tln-triangle{width:10rem;height:8.7rem;margin-top:0}}
.tln-triangle::before,.tln-triangle::after{content:'';position:absolute;clip-path:polygon(50% 0,100% 100%,0 100%)}
.tln-triangle::before{inset:0;background:var(--tln-red)}
.tln-triangle::after{left:22%;right:22%;top:34%;bottom:12%;background:var(--paper)}
.tln-triangle__mark{position:absolute;left:50%;bottom:20%;z-index:1;width:9%;height:30%;margin-left:-4.5%;border-radius:.3rem;background:linear-gradient(var(--ink),var(--ink)) top / 100% 68% no-repeat,radial-gradient(circle,var(--ink) 0 48%,transparent 52%) bottom / 100% 26% no-repeat}

.tln-road{padding-top:1rem;padding-bottom:1rem}
.tln-road__title{margin:0 0 .7rem;font-family:var(--serif);font-weight:800;font-size:clamp(1.3rem,2.8vw,1.6rem);line-height:1.2}
.tln-lanes{border-top:6px solid var(--tln-asphalt);border-bottom:6px solid var(--tln-asphalt)}
.tln-lane{margin:0}
.tln-lane__head{position:relative;display:flex;align-items:center;gap:1rem;box-sizing:border-box;min-height:4.4rem;padding:.6rem 1rem .9rem;list-style:none;cursor:pointer;
  background:repeating-linear-gradient(90deg,var(--tln-paint) 0 2.2rem,transparent 2.2rem 3.8rem) left bottom / 100% 3px no-repeat,var(--tln-asphalt);color:var(--tln-paint)}
.tln-lane:last-child .tln-lane__head{background:var(--tln-asphalt)}
.tln-lane__head::-webkit-details-marker{display:none}
.tln-lane__head::after{content:'+';content:'+' / '';flex:none;margin-left:auto;font-weight:800;font-size:1.4rem;line-height:1}
.tln-lane[open] > .tln-lane__head::after{content:'\2212';content:'\2212' / ''}
.tln-lane__head:focus-visible{outline:3px solid var(--tln-paint);outline-offset:-6px}
.tln-lane__name{font-weight:800;font-size:clamp(1.05rem,2.4vw,1.3rem);line-height:1.2;overflow-wrap:anywhere;min-width:0}
.tln-lane__n{flex:none;font-size:.9rem;font-weight:600;opacity:.92}
.tln-lane__head:hover .tln-lane__name{text-decoration:underline;text-decoration-thickness:.07em;text-underline-offset:.16em}
.tln-lane__cities{columns:5 8.5rem;column-gap:1.2rem;margin:0;padding:.8rem 1rem 1rem;list-style:none;background:var(--card);border-left:6px solid var(--tln-asphalt);border-right:6px solid var(--tln-asphalt)}
.tln-lane__cities li{break-inside:avoid;margin:0}
.tln-lane__city{display:block;box-sizing:border-box;min-height:44px;padding:.7rem 0;font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.tln-lane__state{font-weight:400;color:var(--ink-3)}

/* the vehicles: drawn in the colour of the text around them (paint on the road, red on the list); each takes the kind of the lane, row, strip or link it
   sits in (the strip only, on an opened guide, so the links to the other kinds keep their own) */
.tln-veh{position:relative;display:inline-block;flex:none;width:3.4em;height:1.7em;font-size:1rem;color:inherit}
.tln-veh::before,.tln-veh::after{content:'';position:absolute;background:currentColor}
.tln-lane--car .tln-veh,.tln-row--car .tln-veh,.tln-scene--car .tln-strip .tln-veh,.tln-also__link--car .tln-veh,.tln-foot__link--car .tln-veh{
  background:radial-gradient(circle,currentColor 0 .3em,transparent .32em) .45em 100% / .7em .7em no-repeat,radial-gradient(circle,currentColor 0 .3em,transparent .32em) 2.25em 100% / .7em .7em no-repeat}
.tln-lane--car .tln-veh::before,.tln-row--car .tln-veh::before,.tln-scene--car .tln-strip .tln-veh::before,.tln-also__link--car .tln-veh::before,.tln-foot__link--car .tln-veh::before{left:0;right:0;bottom:.4em;height:.6em;border-radius:.3em .45em .15em .15em}
.tln-lane--car .tln-veh::after,.tln-row--car .tln-veh::after,.tln-scene--car .tln-strip .tln-veh::after,.tln-also__link--car .tln-veh::after,.tln-foot__link--car .tln-veh::after{left:.75em;width:1.6em;bottom:.9em;height:.6em;border-radius:.55em .6em 0 0}
.tln-lane--truck .tln-veh,.tln-row--truck .tln-veh,.tln-scene--truck .tln-strip .tln-veh,.tln-also__link--truck .tln-veh,.tln-foot__link--truck .tln-veh{
  background:radial-gradient(circle,currentColor 0 .26em,transparent .28em) .25em 100% / .6em .6em no-repeat,radial-gradient(circle,currentColor 0 .26em,transparent .28em) 1.3em 100% / .6em .6em no-repeat,
    radial-gradient(circle,currentColor 0 .26em,transparent .28em) 2.7em 100% / .6em .6em no-repeat}
.tln-lane--truck .tln-veh::before,.tln-row--truck .tln-veh::before,.tln-scene--truck .tln-strip .tln-veh::before,.tln-also__link--truck .tln-veh::before,.tln-foot__link--truck .tln-veh::before{left:0;width:2.3em;bottom:.42em;height:1.1em;border-radius:.1em}
.tln-lane--truck .tln-veh::after,.tln-row--truck .tln-veh::after,.tln-scene--truck .tln-strip .tln-veh::after,.tln-also__link--truck .tln-veh::after,.tln-foot__link--truck .tln-veh::after{left:2.4em;right:0;bottom:.42em;height:.85em;border-radius:.1em .45em .1em .1em}
.tln-lane--motorcycle .tln-veh,.tln-row--motorcycle .tln-veh,.tln-scene--motorcycle .tln-strip .tln-veh,.tln-also__link--motorcycle .tln-veh,.tln-foot__link--motorcycle .tln-veh{
  background:radial-gradient(circle,transparent 0 .2em,currentColor .22em .4em,transparent .42em) .2em 100% / .9em .9em no-repeat,radial-gradient(circle,transparent 0 .2em,currentColor .22em .4em,transparent .42em) 2.3em 100% / .9em .9em no-repeat}
.tln-lane--motorcycle .tln-veh::before,.tln-row--motorcycle .tln-veh::before,.tln-scene--motorcycle .tln-strip .tln-veh::before,.tln-also__link--motorcycle .tln-veh::before,.tln-foot__link--motorcycle .tln-veh::before{left:.75em;width:1.9em;bottom:.5em;height:.32em;border-radius:.2em;transform:skewY(-12deg)}
.tln-lane--motorcycle .tln-veh::after,.tln-row--motorcycle .tln-veh::after,.tln-scene--motorcycle .tln-strip .tln-veh::after,.tln-also__link--motorcycle .tln-veh::after,.tln-foot__link--motorcycle .tln-veh::after{left:2.25em;width:.28em;bottom:.6em;height:.95em;border-radius:.15em;transform:rotate(18deg)}
.tln-veh--small{font-size:.62rem;margin-right:.45rem;vertical-align:-.1em}

.tln-latest{padding-top:clamp(1.6rem,4vw,2.6rem);padding-bottom:clamp(2.8rem,6vw,4.4rem)}
.tln-latest__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.2rem 1.5rem;margin:0 0 .4rem}
.tln-latest__title{margin:0;font-family:var(--serif);font-weight:800;font-size:clamp(1.3rem,2.8vw,1.6rem);line-height:1.2}
.tln-latest__note{margin:0;font-size:.9rem;color:var(--ink-3)}
.tln-list{margin:0;padding:0;list-style:none;border-top:2px solid var(--ink)}
.tln-row{min-width:0;margin:0;padding:.7rem 0 .8rem;border-bottom:1px solid var(--rule)}
.tln-row__kind{display:flex;align-items:center;margin:0;font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-2)}
.tln-row__title{margin:0;font-family:var(--serif);font-weight:800;font-size:1.15rem;line-height:1.3}
.tln-row__link{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
.tln-row__link:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:.07em;text-underline-offset:.16em}
.tln-row__firms,.tln-row__desc{margin:0;font-size:.92rem;line-height:1.5;color:var(--ink-2);overflow-wrap:anywhere}
.tln-row__k{font-weight:700}
.tln-empty{margin:0;color:var(--ink-2)}

.tln-turn{display:block;margin:2rem 0 0;padding:0;border:0}
.tln-turn .nav-links{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;padding:0}
.tln-turn .page-numbers{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:44px;min-height:44px;height:auto;margin:0;padding:0 1rem;border:2px solid var(--ink);border-radius:.3rem;
  background:var(--card);font-weight:700;font-size:1rem;line-height:1.2;color:var(--ink);text-decoration:none}
.tln-turn .page-numbers.current{background:var(--ink);color:var(--paper)}
.tln-turn a.page-numbers:hover{border-color:var(--accent);color:var(--accent);text-decoration:underline}
.tln-turn .page-numbers.dots{border-color:transparent;background:none}

/* ========================================================================
   29. ONE GUIDE, THE SCENE
   A guide: the trail (all guides, the lane, the city); the lane strip with its vehicle; the title and
   what the guide holds; the five firms on yellow evidence markers (number, a jump to the firm's part of
   the guide, the number to call it); the guides for the other kinds of accident in the same city; the
   guide; at the END the note and the way back. On every page the footer links to the guides the publisher chose (tln_footer_guides()).
   ======================================================================== */
.tln-scene>.wrap{max-width:calc(var(--measure-wide) + 2 * clamp(1rem,4vw,2rem))}
.tln-trail{padding-top:1.1rem}
.tln-trail__list{list-style:none;display:flex;flex-wrap:wrap;gap:0 .5rem;margin:0;padding:0;font-size:.9rem;color:var(--ink-3)}
.tln-trail__list li{display:flex;align-items:center;min-height:44px;margin:0;min-width:0;overflow-wrap:anywhere}
.tln-trail__list li+li::before{content:'\203A';content:'\203A' / '';margin-right:.5rem}
.tln-trail__list a{display:inline-flex;align-items:center;min-width:44px;min-height:44px}
.tln-scene__head{padding-top:.4rem;padding-bottom:1.2rem}
.tln-strip{display:flex;align-items:center;gap:.9rem;max-width:40rem;box-sizing:border-box;margin:0 0 1rem;padding:.55rem 1rem .8rem;
  background:repeating-linear-gradient(90deg,var(--tln-paint) 0 2.2rem,transparent 2.2rem 3.8rem) left bottom / 100% 3px no-repeat,var(--tln-asphalt);color:var(--tln-paint)}
.tln-strip__name{font-weight:800;font-size:1.05rem;letter-spacing:.04em;text-transform:uppercase}
.tln-scene__title{max-width:var(--measure);margin:0 0 .6rem;font-family:var(--serif);font-weight:800;font-size:clamp(1.8rem,4.6vw,2.7rem);line-height:1.08;letter-spacing:-.02em;text-wrap:balance;overflow-wrap:anywhere}
.tln-scene__meta{margin:0;font-size:.95rem;color:var(--ink-3)}

.tln-markers{margin-bottom:1.6rem}
.tln-markers__title{margin:0 0 .6rem;font-weight:700;font-size:.82rem;line-height:1.3;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.tln-markers__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15.5rem),1fr));gap:.8rem;margin:0;padding:0;list-style:none}
.tln-marker{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:0 .8rem;min-width:0;margin:0;padding:.6rem .8rem;background:var(--card);border:1px solid var(--ink-3);border-radius:.3rem}
.tln-marker__tent{grid-row:1 / span 2;display:grid;place-items:end center;box-sizing:border-box;width:2.8rem;height:2.6rem;padding-bottom:.3rem;background:var(--tln-yellow);clip-path:polygon(22% 0,78% 0,100% 100%,0 100%);
  font-weight:800;font-size:1.25rem;line-height:1;color:#17181a}
.tln-marker__name{display:inline-flex;align-items:center;min-height:44px;font-weight:800;line-height:1.25;color:var(--ink);text-decoration:none;overflow-wrap:anywhere;min-width:0}
.tln-marker__name:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:.07em;text-underline-offset:.16em}
.tln-marker__call{display:inline-flex;align-items:center;justify-self:start;min-height:44px;font-weight:700;font-variant-numeric:tabular-nums}

.tln-also{margin-bottom:1.8rem}
.tln-also__title{margin:0 0 .3rem;font-weight:700;font-size:.82rem;line-height:1.3;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.tln-also__list{display:flex;flex-wrap:wrap;gap:.2rem 1.6rem;margin:0;padding:0;list-style:none}
.tln-also__list li{margin:0;min-width:0}
.tln-also__link{display:inline-flex;align-items:center;min-height:44px;font-weight:700;overflow-wrap:anywhere}

.tln-scene__body .prose,.tln-scene__end>*{max-width:var(--measure)}
.tln-scene__body .prose{overflow-wrap:anywhere}
.tln-scene__body .prose h2{padding-top:1rem;border-top:3px solid var(--rule)}
.prose p>strong:first-child{color:var(--ink-2)}
.tln-call{display:inline-flex;align-items:center;min-height:44px;font-weight:700;font-variant-numeric:tabular-nums}
.tln-scene__end{margin-top:2.4rem;padding-bottom:clamp(3rem,6vw,5rem)}
.tln-back{margin:2rem 0 0;font-weight:700}
.tln-back a{display:inline-flex;align-items:center;min-height:44px}
.prose table{font-variant-numeric:tabular-nums}
.prose th{font-weight:700;color:var(--ink);background-color:var(--paper-2)}
.prose iframe,.prose embed,.prose object{display:block;max-width:100%}
@media (max-width:47.99rem){
  .prose table{display:block;max-width:100%;overflow-x:auto;font-size:.88rem}
  .prose th,.prose td{min-width:5.5rem;padding:.5rem .45rem;overflow-wrap:anywhere}
}
.tln-split .post-page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
/* the footer: links to the guides the publisher chose (each by its own title, with its vehicle) */
.tln-foot{margin:0 0 1.2rem}
.tln-foot__title{margin:0 0 .3rem;font-weight:700;font-size:.82rem;line-height:1.3;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.tln-foot__list{display:flex;flex-wrap:wrap;gap:.2rem 1.6rem;margin:0;padding:0;list-style:none}
.tln-foot__list li{margin:0;min-width:0}
.tln-foot__link{display:inline-flex;align-items:center;min-height:44px;font-weight:700;overflow-wrap:anywhere}
@media (forced-colors:active){
  .tln-lane__head,.tln-strip,.tln-marker{border:2px solid CanvasText}
  .tln-triangle,.tln-veh,.tln-marker__tent{forced-color-adjust:none}
}
@media print{
  .tln-triangle,.tln-road,.tln-turn,.tln-back,.tln-veh{display:none}
  .tln-strip{background:none;color:inherit;padding:0}
}

/* ========================================================================
   26. PRINT
   ======================================================================== */
@media print{
  .topbar,.site-footer,.meta-rail,.toc-drawer,.reading-progress,.post-nav,.comments-area,.skip-link{display:none!important}
  html:root:root{--paper:#fff;--paper-2:#fff;--card:#fff;--ink:#000;--ink-2:#222;--ink-3:#444;--rule:#999;--accent:#000;--accent-2:#000;--link:#000;--warn:#000;--safe:#000}
  body{background:#fff;color:#000}
  .article-shell{display:block;padding:0}
  .article-main{max-width:none}
  a{color:inherit;text-decoration:underline}
  .prose h2,.prose h3{break-after:avoid}
  .prose img{max-width:100%;break-inside:avoid}
}

/* ========================================================================
   27. GLOBAL REDUCED MOTION OVERRIDE (WD-16 safety net)
   ======================================================================== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
}