/* ==========================================================================
   Neeko — design system
   Concept: "табло" — the site reads as a stadium scoreboard. Green = live:
   today's news, the wire, the score. Amber = the archive and the analysis,
   2011–2017 and the research written on it. Condensed display type for
   fixtures, serif for the column, mono tabular figures for every number.

   Token layers (playbook §7.1): primitive -> semantic -> component.
   Raw hex never appears below the :root blocks.
   ========================================================================== */

[hidden]{display:none!important}

/* Research and tools: readable without scripts, keyboard and mobile friendly. */
.research-chart,.tool-card,.archive-explorer{margin:2rem 0;padding:clamp(1rem,3vw,1.75rem);border:1px solid var(--border);border-radius:var(--r-3);background:var(--bg-raised,var(--bg))}
.research-chart figcaption{font-family:Oswald,sans-serif;font-size:var(--fs-lg);line-height:1.35;font-weight:600}
.chart-note{font-size:.875rem!important;line-height:1.6;color:var(--text-muted)}
.chart-bars{display:grid;gap:.85rem;margin:1.5rem 0}
.chart-bar-row{display:grid;grid-template-columns:3rem minmax(0,1fr) 4.5rem;gap:.7rem;align-items:center;font-family:"JetBrains Mono",monospace;font-size:.8125rem}
.chart-bar-row>div{height:1.15rem;background:var(--border);border-radius:var(--r-1);overflow:hidden}
.chart-bar-row i{display:block;height:100%;background:var(--accent,var(--amber-500))}
.chart-bar-row b{text-align:right;font-weight:400}
.chart-table summary,.faq summary{min-height:44px;cursor:pointer}
.chart-table summary{padding:.65rem 0;color:var(--text)}
.tool-card form{display:grid;gap:.8rem}
.tool-card label,.archive-explorer>label{display:block;font-size:.9375rem;font-weight:bold;margin:.5rem 0}
.tool-card input,.archive-explorer select{box-sizing:border-box;min-height:44px;max-width:100%;width:100%;padding:.65rem .8rem;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--r-2);font:inherit}
.tool-card input:focus-visible,.archive-explorer select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.tool-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.tool-card button{justify-self:start;min-height:44px;cursor:pointer;font:inherit}
.tool-result{display:block;padding:1rem;border-left:3px solid var(--accent);background:var(--bg);font-size:1rem;line-height:1.7}
.tool-result[data-state=error]{border-color:var(--red-400)}
.archive-explorer [data-research-panel]{margin-top:2rem}
.yt-wrap{position:relative;aspect-ratio:16/9;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-3);overflow:hidden}
.yt-facade{width:100%;height:100%;min-height:44px;display:grid;place-content:center;gap:1rem;background:var(--surface-2);color:var(--text);border:0;font:inherit;cursor:pointer}
.yt-play{font-size:2rem;color:var(--accent)}
.radar-video{margin:2.5rem 0}
.radar-video h3{overflow-wrap:anywhere}
.chart-bars--radar .chart-bar-row{grid-template-columns:6rem minmax(0,1fr) 4.5rem}
.cluster-links{margin:2rem 0;padding:1.25rem;border:1px solid var(--border);border-radius:var(--r-3)}
.cluster-links ul{display:grid;gap:.65rem;padding-left:1.25rem}
@media(max-width:420px){.tool-fields{grid-template-columns:1fr}.chart-bar-row{grid-template-columns:2.6rem minmax(0,1fr) 3.7rem;gap:.4rem;font-size:.75rem}}

/* --- fonts: self-hosted, zero external requests --------------------------- */
@font-face{font-family:Oswald;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/Oswald-500-normal-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Oswald;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/Oswald-500-normal-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Oswald;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/Oswald-600-normal-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Oswald;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/Oswald-600-normal-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:Oswald;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/Oswald-700-normal-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Oswald;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/Oswald-700-normal-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}

@font-face{font-family:"PT Serif";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/PTSerif-400-normal-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"PT Serif";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/PTSerif-400-normal-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"PT Serif";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/PTSerif-400-italic-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"PT Serif";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/PTSerif-400-italic-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"PT Serif";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/PTSerif-700-normal-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"PT Serif";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/PTSerif-700-normal-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}

@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/JetBrainsMono-400-normal-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/JetBrainsMono-400-normal-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/JetBrainsMono-500-normal-cyrillic.woff2)format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/JetBrainsMono-500-normal-latin.woff2)format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}

/* ==========================================================================
   LAYER 1 — primitives
   ========================================================================== */
:root{
  /* neutrals carry a faint green cast: pitch grass seen at night */
  --n-950:#080b0a; --n-900:#0d1211; --n-850:#121816; --n-800:#18201d;
  --n-750:#1f2825; --n-700:#28332f; --n-600:#3a4844; --n-500:#5b6b66;
  --n-400:#849690; --n-350:#93a29c; --n-300:#b3c0bb; --n-200:#d3dcd8;
  --n-100:#e9efec; --n-050:#f4f7f5; --n-000:#fbfcfb;
  --paper:#f7f5ef;            /* warm newsprint for the light theme */
  --paper-2:#fffefa;

  /* amber = archive, the scoreboard bulb */
  --amber-300:#f5cd74; --amber-400:#ecb63f; --amber-500:#d99c1c;
  --amber-600:#a8760d; --amber-700:#7a5507;
  /* green = live, navigation, "current" */
  --grass-300:#8fd8a4; --grass-400:#57b072; --grass-500:#3d8c58;
  --grass-600:#2c6a41; --grass-700:#1f4d2f;
  --red-400:#e5695c; --red-600:#a8332a;

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

  --fs-xs:.75rem; --fs-sm:.8125rem; --fs-base:1.0625rem; --fs-md:1.1875rem;
  --fs-lg:1.375rem; --fs-xl:1.75rem; --fs-2xl:2.25rem; --fs-3xl:3rem;

  --r-0:0; --r-1:2px; --r-2:4px; --r-3:8px;
  --dur-fast:140ms; --dur:200ms; --dur-slow:320ms;
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-in:cubic-bezier(.4,0,1,1);
  --wrap:74rem; --measure:40rem;
  --z-base:0; --z-raised:10; --z-sticky:40; --z-overlay:100; --z-modal:1000;
}

/* ==========================================================================
   LAYER 2 — semantic. Dark is the default (playbook §7.2); light is designed,
   not inverted. Both themes are contrast-checked independently.
   ========================================================================== */
:root,:root[data-theme=dark]{
  --bg:var(--n-950); --bg-raised:var(--n-900); --bg-sunken:#050707;
  --surface:var(--n-850); --surface-2:var(--n-800); --surface-3:var(--n-750);
  --text:#e7edea;              /* 14.6:1 on --bg */
  --text-strong:#f6faf8;
  --text-muted:var(--n-350);   /* 6.9:1 on --bg  */
  --text-faint:#72857e;        /* 5.06:1 on --bg. Was --n-500 at 3.52:1,
                                  which fails AA — and this token is not
                                  labels-only in practice: breadcrumbs,
                                  dates and counters all use it. */
  --border:var(--n-750); --border-strong:var(--n-600);
  --accent:var(--amber-400);        /* 9.8:1 on --bg */
  --accent-hover:var(--amber-300);
  --accent-quiet:rgba(236,182,63,.13);
  --accent-on:var(--n-950);
  --live:var(--grass-400);          /* 6.5:1 on --bg */
  --live-hover:var(--grass-300);
  --live-quiet:rgba(87,176,114,.14);
  --danger:var(--red-400);
  --link:var(--amber-300); --link-visited:#d9b98a;
  --focus:var(--amber-300);
  --scrim:rgba(5,7,7,.72);
  --shadow-1:0 1px 2px rgba(0,0,0,.5);
  --shadow-2:0 6px 22px -6px rgba(0,0,0,.7);
  --grain-opacity:.035;
  color-scheme:dark;
}
:root[data-theme=light]{
  --bg:var(--paper); --bg-raised:var(--paper-2); --bg-sunken:#efece3;
  --surface:var(--paper-2); --surface-2:#f2efe7; --surface-3:#e8e4d9;
  --text:#161a18;              /* 15.1:1 on --paper */
  --text-strong:#080b0a;
  --text-muted:#4e5a55;        /* 7.4:1 */
  --text-faint:#616e68;        /* 4.89:1 on --paper; было 4.11:1 — ниже AA */
  --border:#ddd8cb; --border-strong:#bdb6a5;
  --accent:var(--amber-700);        /* 6.4:1 on --paper */
  --accent-hover:var(--amber-600);
  --accent-quiet:rgba(122,85,7,.10);
  --accent-on:#fffefa;
  --live:var(--grass-600);          /* 5.9:1 */
  --live-hover:var(--grass-700);
  --live-quiet:rgba(44,106,65,.10);
  --danger:var(--red-600);
  --link:#8a5c05; --link-visited:#6a4a2c;
  --focus:var(--amber-600);
  --scrim:rgba(22,26,24,.55);
  --shadow-1:0 1px 2px rgba(30,26,16,.10);
  --shadow-2:0 8px 24px -8px rgba(30,26,16,.22);
  --grain-opacity:.05;
  color-scheme:light;
}
/* honour the OS only when the reader has not chosen — dark stays the default,
   so the light override lives under an explicit data-theme, not here. */

/* ==========================================================================
   LAYER 3 — component tokens
   ========================================================================== */
:root{
  --hdr-h:3.5rem;
  --card-bg:var(--surface); --card-border:var(--border);
  --card-bg-hover:var(--surface-2);
  --chip-bg:var(--surface-2); --chip-text:var(--text-muted);
  --rule:1px solid var(--border);
  --kicker-color:var(--accent);
  --meta-color:var(--text-faint);
}

/* ==========================================================================
   base
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;
  scrollbar-color:var(--border-strong) var(--bg)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--bg);color:var(--text);
  font:400 var(--fs-base)/1.68 "PT Serif",Georgia,"Times New Roman",serif;
  font-feature-settings:"kern" 1,"liga" 1;
  min-height:100dvh;display:flex;flex-direction:column;
  overflow-x:hidden;
}
/* faint paper grain: keeps large dark fields from looking like flat #000 */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  opacity:var(--grain-opacity);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}
h1,h2,h3,h4,h5,h6{
  font-family:Oswald,"Arial Narrow",Arial,sans-serif;font-weight:600;
  line-height:1.14;margin:0 0 var(--sp-3);color:var(--text-strong);
  letter-spacing:.004em;text-wrap:balance;
}
h1{font-size:clamp(1.65rem,1.15rem + 2.2vw,var(--fs-2xl));font-weight:700}
h2{font-size:clamp(1.3rem,1.05rem + 1.1vw,var(--fs-xl));margin-top:var(--sp-7)}
h3{font-size:var(--fs-lg);margin-top:var(--sp-6)}
h4{font-size:var(--fs-md)}
p{margin:0 0 var(--sp-4)}
a{color:var(--link);text-decoration-thickness:1px;text-underline-offset:.18em;
  transition:color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--accent-hover)}
a:visited{color:var(--link-visited)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r-1)}
img,svg,video{max-width:100%;height:auto;display:block}
hr{border:0;border-top:var(--rule);margin:var(--sp-6) 0}
code,kbd,samp,.mono,time,.num{
  font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
::selection{background:var(--accent-quiet);color:var(--text-strong)}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;
  padding-inline:clamp(var(--sp-4),3.5vw,var(--sp-6));position:relative;z-index:2}
.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--sp-4);top:var(--sp-4);z-index:var(--z-modal);
  background:var(--accent);color:var(--accent-on);padding:var(--sp-2) var(--sp-4);
  border-radius:var(--r-2);font-family:Oswald,sans-serif}

/* ==========================================================================
   header — the scoreboard bar
   ========================================================================== */
.site-hdr{
  position:sticky;top:0;z-index:var(--z-sticky);
  background:color-mix(in srgb,var(--bg) 92%,transparent);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:var(--rule)
}
.hdr-in{display:flex;align-items:center;gap:var(--sp-4);min-height:var(--hdr-h)}
.logo{display:flex;align-items:baseline;gap:.45rem;text-decoration:none;
  font-family:Oswald,sans-serif;font-weight:700;font-size:1.32rem;
  letter-spacing:.02em;color:var(--text-strong);flex:0 0 auto}
.logo:hover{color:var(--text-strong)}
.logo b{color:var(--accent)}
.logo .logo-era{font:500 var(--fs-xs)/1 "JetBrains Mono",monospace;
  color:var(--text-faint);letter-spacing:.08em;padding-bottom:.15rem}
.nav{display:flex;gap:.15rem;flex:1 1 auto;overflow-x:auto;scrollbar-width:none;
  -ms-overflow-style:none;margin-inline:var(--sp-2)}
.nav::-webkit-scrollbar{display:none}
.nav a{
  font-family:Oswald,sans-serif;font-weight:500;font-size:.9rem;
  text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);
  text-decoration:none;padding:.7rem .62rem;white-space:nowrap;
  border-bottom:2px solid transparent;min-height:44px;display:flex;align-items:center
}
.nav a:hover{color:var(--text-strong);border-bottom-color:var(--border-strong)}
.nav a[aria-current]{color:var(--live);border-bottom-color:var(--live)}
/* A news site has thirteen sections — they never fit beside the logo in a
   74rem bar, and an overflow strip hid «Разборы» and «Архив» past the edge
   with no cue. The nav gets its own row under the logo at every width. */
.hdr-in{flex-wrap:wrap;row-gap:0}
.logo{flex:1 1 auto}
.nav{order:3;flex:1 0 100%;margin-inline:0;border-top:var(--rule)}
.nav a{min-height:42px;padding-block:.55rem}
.nav a:first-child{padding-left:0}
/* On a phone the logo (137px) and the two controls (92px) plus gaps leave the
   nav about 66px of a 375px bar — a scroll strip barely one item wide, which
   is not navigation. Below 40rem the nav drops to its own full-width row and
   scrolls there; min-width:0 is what actually lets a flex child shrink enough
   to scroll instead of pushing the document sideways. */
.nav{min-width:0}
@media (max-width:40rem){
  .hdr-in{flex-wrap:wrap;row-gap:0;padding-bottom:.15rem}
  .logo{flex:1 1 auto}
  .hdr-act{flex:0 0 auto}
  .nav{order:3;flex:1 0 100%;margin-inline:0;
    padding-inline:var(--sp-4);margin-inline:calc(var(--sp-4) * -1);
    border-top:var(--rule);scroll-snap-type:x proximity}
  .nav a{scroll-snap-align:start;min-height:40px;padding-block:.5rem}
}
.hdr-act{display:flex;gap:var(--sp-1);flex:0 0 auto}
.iconbtn{
  width:44px;height:44px;display:grid;place-items:center;background:none;
  border:1px solid transparent;border-radius:var(--r-2);color:var(--text-muted);
  cursor:pointer;transition:color var(--dur-fast),border-color var(--dur-fast)
}
.iconbtn:hover{color:var(--accent);border-color:var(--border)}
.iconbtn svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.7}
[data-theme=dark] .ic-sun{display:block}[data-theme=dark] .ic-moon{display:none}
[data-theme=light] .ic-sun{display:none}[data-theme=light] .ic-moon{display:block}

/* ==========================================================================
   article cards / feed
   ========================================================================== */
.kicker{
  font:500 var(--fs-xs)/1 "JetBrains Mono",monospace;text-transform:uppercase;
  letter-spacing:.12em;color:var(--kicker-color);display:flex;gap:.5rem;
  align-items:center;margin-bottom:var(--sp-2)
}
.kicker .sep{color:var(--border-strong)}
.meta{font:400 var(--fs-sm)/1.5 "JetBrains Mono",monospace;color:var(--meta-color);
  display:flex;flex-wrap:wrap;gap:.3rem .9rem;align-items:center}
.meta a{color:var(--text-muted);text-decoration:none;border-bottom:1px dotted var(--border-strong)}
.meta a:hover{color:var(--accent)}

.feed{display:grid;gap:var(--sp-5);grid-template-columns:1fr}
@media (min-width:48rem){.feed{grid-template-columns:repeat(2,1fr)}}
@media (min-width:64rem){.feed{grid-template-columns:repeat(3,1fr)}}

.card{
  display:flex;flex-direction:column;background:var(--card-bg);
  border:1px solid var(--card-border);border-radius:var(--r-2);
  overflow:hidden;position:relative;
  transition:border-color var(--dur) var(--ease-out),
             background var(--dur) var(--ease-out),transform var(--dur) var(--ease-out)
}
.card:hover{border-color:var(--border-strong);background:var(--card-bg-hover)}
@media (hover:hover){.card:hover{transform:translateY(-2px)}}
/* section colour lives on the left edge — the reader learns the league by it */
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--cat-color,var(--accent));opacity:.85}
.card-media{aspect-ratio:3/2;background:var(--surface-2);overflow:hidden}
.card-media img,.card-media svg{width:100%;height:100%;object-fit:cover}
.card-body{padding:var(--sp-4) var(--sp-4) var(--sp-4) calc(var(--sp-4) + 3px);
  display:flex;flex-direction:column;gap:var(--sp-2);flex:1}
.card-title{font-family:Oswald,sans-serif;font-weight:600;font-size:var(--fs-md);
  line-height:1.2;margin:0}
.card-title a{color:var(--text-strong);text-decoration:none}
.card-title a:hover{color:var(--accent)}
.card-dek{font-size:var(--fs-sm);line-height:1.6;color:var(--text-muted);margin:0}
.card-foot{margin-top:auto;padding-top:var(--sp-2)}

/* lead story: asymmetric editorial hero (21st "Editorial Hero" pattern) */
.lead{display:grid;gap:var(--sp-5);align-items:start;margin-bottom:var(--sp-7)}
@media (min-width:56rem){.lead{grid-template-columns:1.35fr 1fr;gap:var(--sp-6)}}
.lead-media{border-radius:var(--r-2);overflow:hidden;border:1px solid var(--border);
  aspect-ratio:16/9;background:var(--surface-2)}
.lead-media img,.lead-media svg{width:100%;height:100%;object-fit:cover}
.lead h2{font-size:clamp(1.5rem,1.1rem + 1.9vw,2.1rem);font-weight:700;margin:0 0 var(--sp-3)}
.lead h2 a{color:var(--text-strong);text-decoration:none}
.lead h2 a:hover{color:var(--accent)}
.lead-dek{font-size:var(--fs-md);color:var(--text-muted);margin-bottom:var(--sp-4)}

/* compact list for archive runs */
.rows{list-style:none;margin:0;padding:0;border-top:var(--rule)}
.rows li{border-bottom:var(--rule)}
.rows a{display:grid;grid-template-columns:5.6rem 1fr;gap:var(--sp-3);
  padding:.72rem var(--sp-2);text-decoration:none;color:var(--text);
  align-items:baseline;transition:background var(--dur-fast)}
.rows a:hover{background:var(--surface);color:var(--text-strong)}
.rows time{font-size:var(--fs-xs);color:var(--text-faint)}
.rows .t{font-family:Oswald,sans-serif;font-weight:500;font-size:1.02rem;line-height:1.3}
@media (max-width:34rem){
  .rows a{grid-template-columns:1fr;gap:.15rem}
  .rows time{order:-1}
}

/* ==========================================================================
   article page
   ========================================================================== */
/* minmax(0,1fr), not the implicit `auto`: an auto-sized grid column takes its
   width from the widest child, so one long table stretched the column past the
   viewport and every article page scrolled sideways on a phone. The wide child
   still scrolls inside its own .tbl-scroll wrapper — but only if the column is
   allowed to shrink first. */
.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-7);align-items:start}
@media (min-width:64rem){.layout{grid-template-columns:minmax(0,1fr) 17rem;gap:var(--sp-8)}}
main{flex:1;padding-block:var(--sp-6) var(--sp-9)}

.crumbs{font:400 var(--fs-xs)/1.5 "JetBrains Mono",monospace;color:var(--text-faint);
  margin-bottom:var(--sp-4);display:flex;gap:.4rem;flex-wrap:wrap}
.crumbs a{color:var(--text-muted);text-decoration:none}
.crumbs a:hover{color:var(--accent)}

.art-hdr{margin-bottom:var(--sp-5);padding-bottom:var(--sp-4);border-bottom:2px solid var(--border)}
.art-hdr h1{margin-bottom:var(--sp-3)}
.art-dek{font-size:var(--fs-md);color:var(--text-muted);line-height:1.6;
  margin:0 0 var(--sp-4);max-width:var(--measure)}

/* Spacing comes from the sibling rule, not per-element margins. `.prose p
   {margin:0}` used to sit *after* this and silently cancelled it — equal
   specificity, later wins — so paragraphs ran together. Reset first, space
   second. */
.prose{max-width:var(--measure);font-size:var(--fs-base)}
.prose p,.prose ul,.prose ol,.prose figure,.prose blockquote{margin:0}
.prose>*+*{margin-top:var(--sp-4)}
.prose h2,.prose h3{max-width:none}
.prose h2::after{content:"";display:block;width:2.5rem;height:2px;
  background:var(--accent);margin-top:var(--sp-2);opacity:.7}
.prose a{color:var(--link);text-decoration:underline}
.prose img,.prose figure{border-radius:var(--r-2);border:1px solid var(--border)}
.prose figure{margin:var(--sp-5) 0;overflow:hidden}
.prose figcaption{font:400 var(--fs-xs)/1.5 "JetBrains Mono",monospace;
  color:var(--text-faint);padding:var(--sp-2) var(--sp-3);background:var(--surface);
  border-top:1px solid var(--border)}
.prose blockquote{
  margin:var(--sp-5) 0;padding:var(--sp-2) 0 var(--sp-2) var(--sp-4);
  border-left:3px solid var(--accent);font-size:var(--fs-md);
  color:var(--text-strong);font-style:normal}
.prose blockquote p:last-child{margin-bottom:0}
.prose ul,.prose ol{padding-left:1.3em;margin:0}
.prose li+li{margin-top:var(--sp-2)}
.prose ul{list-style:none;padding-left:0}
.prose ul>li{position:relative;padding-left:1.35em}
.prose ul>li::before{content:"";position:absolute;left:.25em;top:.62em;
  width:.42em;height:.42em;background:var(--accent);border-radius:50%;opacity:.75}
.prose strong{color:var(--text-strong);font-weight:700}

/* Table styling is attached to .tbl-scroll as well as .prose, because hub pages
   (entity timelines, section index, archive map) put tables outside the article
   body — without this they rendered as unstyled browser default. */
.tbl-scroll{overflow-x:auto;margin:var(--sp-5) 0;border:1px solid var(--border);
  border-radius:var(--r-2);background:var(--surface)}
.prose table,.tbl-scroll table{width:100%;border-collapse:collapse;
  font-size:var(--fs-sm);font-variant-numeric:tabular-nums}
.prose caption,.tbl-scroll caption{text-align:left;font-family:Oswald,sans-serif;
  font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.06em;
  color:var(--text-muted);padding:var(--sp-3);border-bottom:1px solid var(--border)}
.prose th,.prose td,.tbl-scroll th,.tbl-scroll td{padding:.6rem var(--sp-3);
  text-align:left;border-bottom:1px solid var(--border);vertical-align:top}
.prose th,.tbl-scroll th{background:var(--surface-2);font-family:Oswald,sans-serif;
  font-weight:600;text-transform:uppercase;font-size:var(--fs-xs);
  letter-spacing:.05em;color:var(--text-muted);white-space:nowrap}
.prose tr:last-child td,.tbl-scroll tr:last-child td{border-bottom:0}
.tbl-scroll tbody tr:hover{background:var(--surface-2)}
.tbl-scroll td.num,.tbl-scroll th.num{text-align:right;
  font-family:"JetBrains Mono",monospace}
.tbl-scroll th[scope=row]{background:none;font-size:var(--fs-sm);
  text-transform:none;color:var(--text)}

/* attention blocks */
.callout{display:flex;gap:var(--sp-3);margin:var(--sp-5) 0;padding:var(--sp-4);
  background:var(--surface);border-left:3px solid var(--c,var(--accent));
  border-radius:0 var(--r-2) var(--r-2) 0;font-size:var(--fs-sm);line-height:1.6}
.callout-i{flex:0 0 auto;width:20px;height:20px;color:var(--c,var(--accent))}
.callout-i svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8}
.callout>div>p:last-child{margin-bottom:0}
.callout b{font-family:Oswald,sans-serif;text-transform:uppercase;font-size:var(--fs-xs);
  letter-spacing:.07em;display:block;margin-bottom:.25rem;color:var(--c,var(--accent))}
.callout--info{--c:var(--live)}
.callout--archive{--c:var(--accent)}
.callout--warn{--c:var(--danger)}

/* ---- flagship pieces: TL;DR, FAQ, sources ------------------------------- */
.tldr{background:var(--surface);border:1px solid var(--border);
  border-left:3px solid var(--accent);border-radius:0 var(--r-2) var(--r-2) 0;
  padding:var(--sp-4) var(--sp-5);margin:0 0 var(--sp-6)}
.tldr b{display:block;font-family:Oswald,sans-serif;text-transform:uppercase;
  font-size:var(--fs-xs);letter-spacing:.1em;color:var(--accent);
  margin-bottom:var(--sp-3)}
.tldr ul{margin:0;padding:0;list-style:none;display:grid;gap:var(--sp-3)}
.tldr li{position:relative;padding-left:1.4em;font-size:var(--fs-base);
  line-height:1.6}
.tldr li::before{content:"";position:absolute;left:.2em;top:.68em;width:.45em;
  height:.45em;background:var(--accent);border-radius:50%;opacity:.8}

.faq{margin-top:var(--sp-8);padding-top:var(--sp-5);border-top:2px solid var(--border)}
.faq h2{margin-top:0}
.faq details{border:1px solid var(--border);border-radius:var(--r-2);
  background:var(--surface);margin-bottom:var(--sp-3);overflow:hidden}
.faq summary{padding:var(--sp-3) var(--sp-4);cursor:pointer;list-style:none;
  font-family:Oswald,sans-serif;font-weight:500;font-size:var(--fs-md);
  line-height:1.35;color:var(--text-strong);display:flex;gap:var(--sp-3);
  align-items:flex-start;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";flex:0 0 auto;color:var(--accent);
  font-family:"JetBrains Mono",monospace;font-weight:400;line-height:1.4;
  transition:transform var(--dur) var(--ease-out)}
.faq details[open] summary::before{content:"−"}
.faq summary:hover{background:var(--surface-2)}
.faq details>div{padding:0 var(--sp-4) var(--sp-4) calc(var(--sp-4) + 1.35em);
  font-size:var(--fs-base);line-height:1.65;color:var(--text-muted)}
.faq details>div p{margin:0 0 var(--sp-3)}
.faq details>div p:last-child{margin-bottom:0}
.faq details>div a{color:var(--link)}

.sources{margin-top:var(--sp-7);padding-top:var(--sp-5);
  border-top:2px solid var(--border)}
.sources h2{margin-top:0}

/* archive banner: the honest note on every restored page */
.archive-note{
  margin:0 0 var(--sp-5);padding:var(--sp-3) var(--sp-4);
  background:var(--accent-quiet);border:1px solid var(--border);
  border-left:3px solid var(--accent);border-radius:0 var(--r-2) var(--r-2) 0;
  font:400 var(--fs-sm)/1.55 "PT Serif",serif;color:var(--text-muted)}
.archive-note strong{color:var(--text);font-weight:700}

/* author box */
.authorbox{display:flex;gap:var(--sp-4);margin-top:var(--sp-7);padding-top:var(--sp-5);
  border-top:2px solid var(--border);align-items:flex-start}
.avatar{flex:0 0 auto;width:52px;height:52px;border-radius:var(--r-2);
  background:var(--surface-2);display:grid;place-items:center;
  font-family:Oswald,sans-serif;font-weight:700;font-size:1.2rem;color:var(--accent);
  border:1px solid var(--border)}
.authorbox h3{margin:0 0 .2rem;font-size:var(--fs-base)}
.authorbox p{font-size:var(--fs-sm);color:var(--text-muted);margin:0;line-height:1.6}

/* ==========================================================================
   sidebar / related / chips
   ========================================================================== */
.side{display:flex;flex-direction:column;gap:var(--sp-6);position:sticky;
  top:calc(var(--hdr-h) + 2.75rem + var(--sp-4))}
@media (max-width:63.99rem){.side{position:static}}
.side-h{font-family:Oswald,sans-serif;font-size:var(--fs-sm);text-transform:uppercase;
  letter-spacing:.09em;color:var(--text-muted);margin:0 0 var(--sp-3);
  padding-bottom:var(--sp-2);border-bottom:2px solid var(--accent);
  display:inline-block}
.chips{display:flex;flex-wrap:wrap;gap:var(--sp-2);list-style:none;margin:0;padding:0}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.34rem .6rem;
  background:var(--chip-bg);border:1px solid var(--border);border-radius:var(--r-2);
  font:400 var(--fs-xs)/1 "JetBrains Mono",monospace;color:var(--chip-text);
  text-decoration:none;min-height:32px;position:relative}
/* A chip reads best at 32px but a finger needs 44. Keep the visual box and
   extend the hit area with a transparent overlay — only where the pointer is
   coarse, so the desktop hover region stays exactly the size of the chip. */
@media (pointer:coarse){
  .chip::after{content:"";position:absolute;inset:50% 0 auto;
    translate:0 -50%;height:44px;min-width:100%}
}
.chip:hover{border-color:var(--accent);color:var(--accent)}
.chip .n{color:var(--text-faint)}
.chip--cat{border-left:3px solid var(--cat-color,var(--accent))}

.related{margin-top:var(--sp-7);padding-top:var(--sp-5);border-top:2px solid var(--border)}

/* ==========================================================================
   pagination / footer / misc
   ========================================================================== */
.pager{display:flex;gap:var(--sp-2);justify-content:center;align-items:center;
  margin-top:var(--sp-8);flex-wrap:wrap}
.pager a,.pager span{min-width:44px;min-height:44px;display:grid;place-items:center;
  padding:0 .7rem;border:1px solid var(--border);border-radius:var(--r-2);
  font:500 var(--fs-sm)/1 "JetBrains Mono",monospace;text-decoration:none;
  color:var(--text-muted)}
.pager a:hover{border-color:var(--accent);color:var(--accent)}
.pager .cur{background:var(--accent);color:var(--accent-on);border-color:var(--accent)}

.site-ftr{border-top:2px solid var(--border);background:var(--bg-sunken);
  padding-block:var(--sp-7) var(--sp-6);margin-top:auto;font-size:var(--fs-sm)}
.ftr-grid{display:grid;gap:var(--sp-6);grid-template-columns:1fr}
@media (min-width:44rem){.ftr-grid{grid-template-columns:1.4fr 1fr 1fr}}
.ftr-grid h4{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.1em;
  color:var(--text-faint);font-family:"JetBrains Mono",monospace;font-weight:500}
.ftr-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.ftr-grid a{color:var(--text-muted);text-decoration:none}
.ftr-grid a:hover{color:var(--accent)}
.ftr-legal{margin-top:var(--sp-6);padding-top:var(--sp-4);border-top:var(--rule);
  color:var(--text-faint);font-size:var(--fs-xs);line-height:1.7}

/* stat strip — numbers get the mono tabular treatment */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));
  gap:var(--sp-4);margin:var(--sp-6) 0;padding:var(--sp-5) 0;
  border-block:2px solid var(--border)}
.stat{text-align:left}
.stat .v{font:500 1.85rem/1 "JetBrains Mono",monospace;color:var(--accent);
  font-variant-numeric:tabular-nums;display:block}
.stat .l{font-size:var(--fs-xs);color:var(--text-faint);text-transform:uppercase;
  letter-spacing:.07em;margin-top:.35rem;display:block;font-family:Oswald,sans-serif}

/* search overlay */
.srch{position:fixed;inset:0;z-index:var(--z-modal);background:var(--scrim);
  display:none;padding:8vh var(--sp-4) var(--sp-4);backdrop-filter:blur(4px)}
.srch[open],.srch.on{display:block}
.srch-box{max-width:38rem;margin-inline:auto;background:var(--bg-raised);
  border:1px solid var(--border-strong);border-radius:var(--r-3);
  box-shadow:var(--shadow-2);overflow:hidden}
.srch input{width:100%;padding:var(--sp-4);font:400 var(--fs-md)/1.4 "PT Serif",serif;
  background:none;border:0;border-bottom:1px solid var(--border);color:var(--text)}
.srch input:focus{outline:none}
.srch-res{max-height:56vh;overflow-y:auto;list-style:none;margin:0;padding:0}
.srch-res li a{display:block;padding:var(--sp-3) var(--sp-4);text-decoration:none;
  color:var(--text);border-bottom:1px solid var(--border)}
.srch-res li a:hover,.srch-res li a.sel{background:var(--surface)}
.srch-res .c{font:400 var(--fs-xs)/1 "JetBrains Mono",monospace;
  color:var(--text-faint);display:block;margin-bottom:.2rem}

/* reading progress */
.progress{position:fixed;top:0;left:0;height:2px;background:var(--accent);
  z-index:var(--z-overlay);width:100%;transform:scaleX(0);transform-origin:left;transition:transform 80ms linear}

/* table of contents */
.toc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2);
  padding:var(--sp-4)}
.toc ul{list-style:none;margin:0;padding:0;display:grid;gap:.4rem;font-size:var(--fs-sm)}
.toc ul ul{padding-left:var(--sp-4);margin-top:.4rem}
.toc a{color:var(--text-muted);text-decoration:none}
.toc a:hover{color:var(--accent)}

/* prose figure shortcode wrapper */
.fig{margin:var(--sp-5) 0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media print{
  .site-hdr,.site-ftr,.side,.related,.pager,.progress,body::before{display:none}
  body{background:#fff;color:#000}
  .prose{max-width:none}
}

/* ==========================================================================
   news — the live side of the board. Green marks "now": the wire time, the
   rubric of a fresh item, the score line. Amber stays with the archive and
   the analysis, so the two halves of the site never read alike.
   ========================================================================== */
.kicker--live{color:var(--live)}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-4);
  margin:0 0 var(--sp-5)}
.sec-h .side-h{font-size:var(--fs-lg);margin:0}
.masthead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:var(--sp-2) var(--sp-6);margin-bottom:var(--sp-6);padding-bottom:var(--sp-3);
  border-bottom:2px solid var(--border)}
.masthead h1{margin:0;font-size:clamp(1.5rem,1.1rem + 1.6vw,2.1rem)}
.masthead p{margin:0;color:var(--text-muted);font-size:var(--fs-sm);line-height:1.55;max-width:46rem}

.top{display:grid;gap:var(--sp-6);margin-bottom:var(--sp-8)}
@media (min-width:64rem){.top{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--sp-7)}}
.top .lead{grid-template-columns:1fr;margin:0;gap:var(--sp-4)}
.top-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--live)}
.top-list li{border-bottom:var(--rule)}
.top-list a{display:block;padding:var(--sp-3) 0;text-decoration:none;color:var(--text)}
.top-list .k{display:flex;flex-wrap:wrap;gap:.2rem .6rem;margin-bottom:.35rem;
  font:500 var(--fs-xs)/1.2 "JetBrains Mono",monospace;text-transform:uppercase;
  letter-spacing:.1em;color:var(--live)}
.top-list .k time{color:var(--text-faint);letter-spacing:.04em}
.top-list .t{display:block;font-family:Oswald,sans-serif;font-weight:600;
  font-size:var(--fs-md);line-height:1.25;color:var(--text-strong);
  transition:color var(--dur-fast) var(--ease-out)}
.top-list a:hover .t{color:var(--accent)}

.split{display:grid;gap:var(--sp-7);grid-template-columns:minmax(0,1fr);align-items:start}
@media (min-width:64rem){.split{grid-template-columns:minmax(0,1fr) 19rem;gap:var(--sp-8)}}

.wire{list-style:none;margin:0;padding:0}
.wire-day{font:500 var(--fs-xs)/1 "JetBrains Mono",monospace;text-transform:uppercase;
  letter-spacing:.1em;color:var(--text-muted);padding:var(--sp-5) 0 var(--sp-2);
  border-bottom:2px solid var(--border)}
.wire-day:first-child{padding-top:var(--sp-1)}
.wire li:not(.wire-day){border-bottom:var(--rule)}
.wire a{display:grid;grid-template-columns:3.2rem minmax(0,1fr);gap:var(--sp-3);
  padding:.72rem var(--sp-2) .72rem 0;text-decoration:none;color:var(--text);
  align-items:baseline;transition:background var(--dur-fast)}
.wire a:hover{background:var(--surface)}
.wire time{font-size:var(--fs-sm);color:var(--live)}
.wire .c{display:block;font:400 var(--fs-xs)/1.2 "JetBrains Mono",monospace;
  color:var(--text-faint);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.3rem}
.wire .t{font-family:Oswald,sans-serif;font-weight:500;font-size:1.06rem;line-height:1.3;
  color:var(--text-strong)}
.wire a:hover .t{color:var(--accent)}
.side .wire a{grid-template-columns:2.9rem minmax(0,1fr);padding-block:.6rem}
.side .wire time{font-size:var(--fs-xs)}
.side .wire .t{font-size:.95rem}

.leagues{display:grid;gap:var(--sp-6);grid-template-columns:minmax(0,1fr)}
@media (min-width:48rem){.leagues{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:64rem){.leagues{grid-template-columns:repeat(3,minmax(0,1fr))}}
.league{border-top:3px solid var(--cat-color,var(--accent));padding-top:var(--sp-3)}
.league-h{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);
  margin-bottom:var(--sp-2)}
.league-h h3{margin:0;font-size:var(--fs-md)}
.league-h h3 a{color:var(--text-strong);text-decoration:none}
.league-h h3 a:hover{color:var(--accent)}
.league ul{list-style:none;margin:0;padding:0}
.league li+li{border-top:var(--rule)}
.league li a{display:block;padding:.6rem 0;text-decoration:none;color:var(--text);
  font-family:Oswald,sans-serif;font-weight:500;font-size:.98rem;line-height:1.3}
.league li a:hover{color:var(--accent)}
.league li time{display:block;font-size:var(--fs-xs);color:var(--text-faint);margin-bottom:.2rem}

.scoreline{display:inline-flex;align-items:center;margin:0 0 var(--sp-4);
  padding:.45rem .85rem;border:1px solid var(--border-strong);border-left:3px solid var(--live);
  border-radius:var(--r-2);background:var(--surface);
  font:500 var(--fs-base)/1.25 "JetBrains Mono",monospace;color:var(--text-strong)}
.news-src{margin:var(--sp-6) 0 0;padding-top:var(--sp-4);border-top:var(--rule);
  font-size:var(--fs-sm);line-height:1.6;color:var(--text-muted);max-width:var(--measure)}
.news-src b{font:500 var(--fs-xs)/1 "JetBrains Mono",monospace;text-transform:uppercase;
  letter-spacing:.1em;color:var(--text-faint);margin-right:.6rem}
/* stadium frames (30_photos.py). The caption sits on the photo itself, so its
   colours are fixed for both themes: light text on a dark scrim, 7:1+. */
:root{--on-photo:#f6faf8;--photo-scrim:rgba(5,7,7,.66)}
.news-photo{position:relative;margin:0 0 var(--sp-5);border:1px solid var(--border);
  border-radius:var(--r-2);overflow:hidden;background:var(--surface-2);aspect-ratio:16/9}
.news-photo picture,.lead-media picture,.photo-band picture{display:block;height:100%}
.news-photo img,.photo-band img{width:100%;height:100%;object-fit:cover;display:block}
.news-photo figcaption{position:absolute;right:var(--sp-2);bottom:var(--sp-2);
  font:400 var(--fs-xs)/1 "JetBrains Mono",monospace;letter-spacing:.04em;
  color:var(--on-photo);background:var(--photo-scrim);padding:.3rem .5rem;border-radius:var(--r-1)}
.photo-band{margin:0 0 var(--sp-5);border:1px solid var(--border);border-radius:var(--r-2);
  overflow:hidden;aspect-ratio:16/5;background:var(--surface-2)}
@media (max-width:40rem){.photo-band{aspect-ratio:16/7}}
.archive-band{margin-top:var(--sp-8);padding:var(--sp-6) clamp(var(--sp-4),3vw,var(--sp-6));
  border:1px solid var(--border);border-radius:var(--r-2);background:var(--surface)}
.archive-band .art-dek{font-size:var(--fs-base)}

/* priority block: «Разобрано подробно» under the text, study card on hubs */
.topical{margin:var(--sp-6) 0;padding:var(--sp-4) 0 0;border-top:2px solid var(--border)}
.topical .side-h{margin:0 0 var(--sp-3)}
.topical .rows a,.topical-home a{display:grid;grid-template-columns:1fr;gap:.2rem;padding:.75rem 0}
.topical .k{font-size:var(--fs-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.topical .d,.topical-home .d{font-size:var(--fs-sm);color:var(--text-muted);line-height:1.5}

/* Editorial updates, explicit issue date and accessible complete news lists. */
.updated,.edition-note,.edition-notice{font-size:var(--fs-sm);color:var(--text-muted);line-height:1.6}
.edition-note,.edition-notice{border-left:3px solid var(--accent);padding:.7rem 1rem;background:var(--surface)}
.revisions{margin:2rem 0;padding:1.2rem;border:1px solid var(--border);border-radius:4px}
.revisions h2{margin:0 0 .8rem;font-size:var(--fs-lg)}
.revisions time{font-family:'JetBrains Mono',monospace;font-size:var(--fs-xs);color:var(--text-muted)}
.revisions p{margin:.3rem 0 1rem}.more-news{margin-top:1.25rem}.more-news summary{cursor:pointer;min-height:44px;padding:.6rem 0;color:var(--accent)}

.search-toolbar{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:1rem}.search-toolbar label,#srch-status{font-size:var(--fs-sm);color:var(--text-muted)}.search-toolbar select{font:inherit;max-width:100%;min-height:44px;color:var(--text);background:var(--bg);border:1px solid var(--border);padding:.4rem}.search-toolbar #srch-close{margin-left:auto}.srch-box{max-height:90dvh;overflow:auto}.srch-res a[role=option]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}