/* MTTF — inner pages. Extends theme.css; uses its tokens only. */

.page { padding: 30px 0 68px; }

/* breadcrumb */
.crumb {
  display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-3); margin-bottom: 22px;
}
.crumb a { color: var(--ink-3); }
.crumb a:hover { color: var(--blue); }
.crumb b { color: var(--ink-2); font-weight: 500; max-width: 46ch;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crumb span { color: var(--rule-2); }

/* month jump chips */
.rail { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 26px; }
.rail a {
  font-size: 12px; letter-spacing: .08em; padding: 8px 13px;
  border: 1px solid var(--rule); border-radius: 999px;
  background: var(--card); color: var(--ink-2);
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.rail a:hover { background: var(--blue); border-color: var(--blue); color: #fff; }

/* a .mod that lists everything instead of scrolling internally */
.grid--stack { display: grid; grid-template-columns: 1fr; gap: 18px; }
.mod--full { height: auto; }
.mod--full .mod__b { overflow: visible; mask-image: none; }

/* article */
.art { display: grid; grid-template-columns: minmax(0, 1fr) 348px; gap: 34px; align-items: start; }
.art__main { min-width: 0; }
.art__date {
  display: block; font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--blue); margin-bottom: 12px;
}
/* Headlines are sentences, not labels, so they are set in the case they were
   written in: caps strip the word shapes readers scan by, and these run to 122
   characters. Mixed case at display size wants tighter tracking and a little
   more leading than caps did, for the descenders. */
.art__title {
  font-family: "IBM Plex Sans", sans-serif; font-weight: 600; text-transform: none;
  font-size: clamp(30px, 4.4vw, 58px); line-height: 1.14; letter-spacing: -.015em;
  margin: 0 0 26px; color: #fff;
}
.art__hero { margin: 0 0 28px; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--rule); background: var(--card); }
.art__hero img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover;
  display: block; }
.art__body { font-size: 17px; line-height: 1.75; color: var(--ink-2);
  display: flow-root; }   /* contain the floated image deck */
/* Keep prose to a readable measure, but let tables and figures use the column.
   `ch` is the width of a zero, which is narrower than the average lowercase
   letter here — 70ch measured out at 85 real characters, so this is tuned by
   what lands on screen rather than by the nominal number. */
.art__body > p, .art__body > h2, .art__body > h3 { max-width: 60ch; }
.art__body p { margin: 0 0 18px; }
.art__body a { color: var(--blue); border-bottom: 1px solid var(--rule-2); }
.art__body a:hover { border-bottom-color: var(--blue); }
.art__body strong { color: var(--ink); }
.art__body h2, .art__body h3 { font-family: "IBM Plex Sans", sans-serif; text-transform: none;
  font-size: 24px; font-weight: 600; letter-spacing: -.01em; color: #fff; margin: 30px 0 12px; }
.art__body figure { margin: 26px 0; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--rule); }
.art__body img { width: 100%; display: block; }
.art__back { margin-top: 30px; }
.art__side { position: sticky; top: calc(var(--barh) + 14px); }

@media (max-width: 1040px) {
  .art { grid-template-columns: 1fr; }
  .art__side { position: static; }
}
@media (max-width: 720px) {
  .page { padding: 20px 0 48px; }
  .rail { gap: 6px; }
  .rail a { font-size: 11px; padding: 7px 10px; }
}

/* standing note under a listing */
.pnote {
  margin: 22px 0 0; padding: 16px 18px;
  border: 1px solid var(--rule); border-left: 3px solid var(--gold);
  border-radius: 8px; background: var(--card);
  color: var(--ink-3); font-size: 14.5px; max-width: 78ch;
}

/* the masthead is sticky (~127px) — keep anchored sections clear of it */
.mod[id], [id^="m2"] { scroll-margin-top: calc(var(--barh) + 32px); }

/* page lede */
.lede { max-width: 74ch; margin: 0 0 24px; color: var(--ink-2); font-size: 17px; line-height: 1.66; }

/* leadership */
/* Two fixed columns, not auto-fit: one card spans the row, and a span only
   fills cleanly against a known column count — auto-fit's third column left
   two rule-coloured holes. The count answers to the column the grid sits in,
   not the viewport: that column is 666px wide on a desktop, but dips to about
   400px between 820 and 1010, where two cards are too narrow to hold a name,
   and jumps back to 758px once the page stacks. */
[data-page="despre"] .documents-content .grid-2 > div:first-child { container-type: inline-size; }
.roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px; background: var(--rule); }
@container (max-width: 470px) { .roles { grid-template-columns: 1fr; } }
.role { background: var(--card); padding: 18px 20px 20px; }
.role h3 { margin: 0 0 12px; font-family: "IBM Plex Sans", sans-serif;
  text-transform: uppercase; font-size: 15px; letter-spacing: .06em; color: #69a9e9; }
.people { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.person { font-size: 14.5px; color: #e2e9f2; display: flex; align-items: center; gap: 8px; }
.person--ru { color: var(--ink-3); }
.person .tag { font-size: 9.5px; letter-spacing: .1em; padding: 2px 5px; border-radius: 3px;
  border: 1px solid var(--rule-2); color: var(--ink-3); }

/* fair play */
.princs { list-style: none; margin: 0; padding: 0; }
.princ { display: grid; grid-template-columns: 54px 1fr; gap: 16px; align-items: start;
  padding: 16px 18px; border-bottom: 1px solid var(--rule); }
.princ:last-child { border-bottom: 0; }
.princ__n { font-family: "IBM Plex Sans", sans-serif; font-size: 26px;
  line-height: 1; color: #69a9e9; letter-spacing: .02em; }
.princ__t { font-size: 15px; line-height: 1.6; color: #e2e9f2; }
.modtext { margin: 0; padding: 18px; font-size: 15.5px; line-height: 1.7;
  color: var(--ink-2); max-width: 82ch; }

/* national squads */
.squads { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1px; background: var(--rule); border-top: 1px solid var(--rule); }
.squad { background: var(--card); padding: 16px 18px 18px; }
.squad h3 { margin: 0 0 12px; font-family: "IBM Plex Sans", sans-serif;
  text-transform: uppercase; font-size: 14px; letter-spacing: .07em; color: #69a9e9; }
.aths { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ath { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: baseline; }
.ath__n { color: var(--ink-3); font-size: 12px; }
.ath__name { color: #e2e9f2; font-size: 14.5px; font-weight: 500; }
.ath__meta { grid-column: 2; color: var(--ink-3); font-size: 11.5px; letter-spacing: .04em; }

/* contact cards */
.ccards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1px; background: var(--rule); }
.ccard { background: var(--card); padding: 18px 20px 20px; display: grid; gap: 7px; }
.ccard h3 { margin: 0 0 6px; font-family: "IBM Plex Sans", sans-serif;
  text-transform: uppercase; font-size: 14px; letter-spacing: .07em; color: #69a9e9; }
.ccard a, .ccard span { color: #e2e9f2; font-size: 14.5px; }
.ccard a:hover { color: var(--blue); }
.kv { cursor: default; }
.kv .li__x { color: #e2e9f2; font-size: 13px; letter-spacing: .02em; }

/* ===================================================================
   Page hero — structure borrowed from the ATTP site, rebuilt on the
   federation's own tokens (deep blue, condensed display, spaced meta).
   =================================================================== */
.flow { position: relative; isolation: isolate; overflow: hidden;
  background: linear-gradient(180deg, #0a2848 0%, var(--bg) 700px); }

.phero { position: relative; min-height: clamp(380px, 40vw, 520px);
  overflow: hidden; isolation: isolate; }
.phero__art { position: absolute; z-index: -2; inset: 0 0 0 auto;
  width: min(62vw, 900px); height: 100%; object-fit: cover; object-position: center;
  filter: saturate(.92) contrast(1.04);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.22) 12%, #000 38%),
                      linear-gradient(180deg, #000 0%, #000 84%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.22) 12%, #000 38%),
              linear-gradient(180deg, #000 0%, #000 84%, transparent 100%);
  mask-composite: intersect; }
.phero::before { content: ""; position: absolute; z-index: -1; inset: 0;
  background: radial-gradient(circle at 82% 34%, rgba(61,142,232,.16), transparent 30%),
              linear-gradient(90deg, #061936 0%, rgba(6,25,54,.97) 29%,
                              rgba(6,25,54,.55) 52%, rgba(6,25,54,.06) 78%); }
.phero__in { min-height: inherit; display: flex; align-items: center;
  padding-block: clamp(56px, 6vw, 92px); }
.phero__copy { width: min(620px, 52%); }
.phero__copy h1 { font-family: var(--display);
  text-transform: uppercase; color: #fff;
  font-size: clamp(40px, 5.6vw, 78px); line-height: 1.04; letter-spacing: .004em;
  margin: 0; }
.breadcrumb { font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-3); margin-bottom: 14px; display: flex; gap: 8px; flex-wrap: wrap;
  align-items: center; }
.breadcrumb a { color: var(--ink-3); }
.breadcrumb a:hover { color: var(--blue); }
.breadcrumb b { color: var(--ink-2); font-weight: 500; max-width: 46ch;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.breadcrumb span { color: var(--rule-2); }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; font-size: 11.5px;
  font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
  color: #69a9e9; margin-bottom: 14px; }
.eyebrow::before { content: ""; width: 22px; height: 2px; background: var(--red); }
.phero .lede { font-size: 17.5px; color: var(--ink-2); max-width: 540px; margin: 16px 0 0;
  line-height: 1.62; }
.phero__note { display: inline-flex; align-items: center; gap: 8px; margin-top: 22px;
  font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-3); border: 1px solid var(--rule); border-radius: 999px;
  padding: 7px 14px; background: rgba(6,25,54,.55); }
.phero__note b { color: #69a9e9; font-weight: 600; }

.section-tight { padding: 46px 0 68px; }

@media (max-width: 900px) {
  .phero { min-height: 0; }
  .phero__art { width: 100%; opacity: .34;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 92%);
    mask-image: linear-gradient(180deg, #000 0%, transparent 92%); }
  .phero::before { background: linear-gradient(180deg, rgba(6,25,54,.72), var(--bg)); }
  .phero__copy { width: 100%; }
  .phero__in { padding-block: 40px 34px; }
}

/* article pages: same gradient ground, no full hero */
.flow--soft { background: linear-gradient(180deg, #0a2848 0%, var(--bg) 420px); }
.flow--soft .page { padding-top: 26px; }
.flow--soft .breadcrumb { margin-bottom: 18px; }

/* ===== structure copied from ATTP, recoloured to the federation palette ===== */
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 48px; align-items: start; }
.dim { color: var(--ink-2); }
.mt-16 { margin-top: 16px; } .mt-40 { margin-top: 40px; } .mb-16 { margin-bottom: 16px; }

.section-tight h2 { font-family: var(--display); text-transform: uppercase;
  color: #fff; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.02; letter-spacing: .004em; margin: 0; }
.section-tight h3 { font-family: "IBM Plex Sans", sans-serif; text-transform: uppercase;
  color: #fff; font-size: 20px; letter-spacing: .03em; margin: 0; }

.rule-list { margin-top: 24px; }
.rule-item { display: flex; gap: 14px; padding: 16px 0; border-top: 1px solid var(--rule); }
.rule-item:first-child { border-top: 0; }
.rule-item p { margin: 0; font-size: 15px; line-height: 1.62; }
.rule-num { font-family: "IBM Plex Sans", sans-serif; color: #69a9e9; font-weight: 700;
  flex: 0 0 auto; font-size: 15px; }

.sanction-box { background: rgba(208,79,74,.10); border: 1px solid rgba(208,79,74,.36);
  border-radius: 10px; padding: 22px; margin-top: 28px; }
.sanction-box h3 { color: #f09b96; margin-bottom: 10px; }
.sanction-box p { margin: 0; font-size: 15px; line-height: 1.62; }

.resource-links { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 16px; }
.resource-links a { padding: 12px 16px; border: 1px solid var(--rule-2); border-radius: 9px;
  font-size: 13.5px; font-weight: 600; color: #e2e9f2; transition: background .16s ease, border-color .16s ease; }
.resource-links a:hover { background: var(--card); border-color: var(--blue); color: #fff; }

.fairplay-content { position: relative; z-index: 1; padding-top: clamp(48px, 6vw, 84px); }

@media (max-width: 820px) { .grid-2 { grid-template-columns: 1fr; gap: 34px; } }
@media (max-width: 600px) { .resource-links { grid-template-columns: 1fr; } }

/* ---- ATTP news-list-item ---- */
.news-list-item { display: grid; grid-template-columns: 200px 1fr; gap: 24px;
  padding: 24px 0; border-top: 1px solid var(--rule); align-items: start; }
.news-list-item:first-child { border-top: 0; }
.news-list-cover { aspect-ratio: 4/3; border-radius: 10px; overflow: hidden;
  background: linear-gradient(135deg, #0b2448, #0d2b54); }
.news-list-cover img { width: 100%; height: 100%; object-fit: cover;
  transition: transform .5s cubic-bezier(.2,.7,.3,1); }
.news-list-item:hover .news-list-cover img { transform: scale(1.05); }
.news-list-item h3 { font-family: "IBM Plex Sans", sans-serif; font-weight: 600; text-transform: none;
  color: #fff; font-size: clamp(19px, 2vw, 26px); line-height: 1.18; margin: 0 0 8px;
  letter-spacing: -.012em; transition: color .16s ease; }
.news-list-item:hover h3 { color: #69a9e9; }
.news-list-item p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-2); }
.news-list-item .muted { font-family: "IBM Plex Sans", sans-serif; font-size: 12px;
  display: block; margin-top: 10px; color: var(--ink-3); }
.tag { display: inline-block; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 4px; border: 1px solid var(--rule-2); color: #69a9e9; }
.tag-muted { color: var(--ink-3); }
.mb-8 { margin-bottom: 8px; }

/* ---- ATTP doc-row ---- */
.doc-cat { margin: 40px 0 14px; display: flex; align-items: center;
  justify-content: space-between; gap: 12px; }
.doc-cat:first-child { margin-top: 0; }
.doc-cat small { color: var(--ink-3); font-family: "IBM Plex Sans", sans-serif;
  font-size: 10.5px; font-weight: 500; }
.doc-row { display: flex; align-items: center; gap: 14px; padding: 14px 16px;
  border-radius: 10px; border: 1px solid transparent;
  transition: background .15s ease, border-color .15s ease, transform .15s ease; }
.doc-row:hover { background: var(--card); border-color: var(--rule); transform: translateX(3px); }
.doc-icon { width: 36px; height: 36px; border-radius: 8px; background: rgba(61,142,232,.12);
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto; color: #69a9e9; }
.doc-title { min-width: 0; flex: 1; }
.doc-title strong { display: block; font-size: 14.5px; color: #e2e9f2; font-weight: 500; }
.doc-meta { display: block; margin-top: 3px; color: var(--ink-3);
  font-family: "IBM Plex Sans", sans-serif; font-size: 10.5px; }
.doc-open { color: #69a9e9; font-family: "IBM Plex Sans", sans-serif; font-size: 11px;
  flex: 0 0 auto; letter-spacing: .08em; }

.empty-state { text-align: center; padding: 60px 20px; color: var(--ink-3);
  border: 1px dashed var(--rule-2); border-radius: 10px; }

@media (max-width: 700px) {
  .news-list-item { grid-template-columns: 1fr; gap: 14px; }
  .news-list-cover { aspect-ratio: 16/9; }
  .doc-row { align-items: flex-start; padding: 13px 8px; }
  .doc-open { display: none; }
}

/* ===================== calendar 2026 ===================== */
.calbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;
  flex-wrap: wrap; padding-bottom: 20px; border-bottom: 1px solid var(--rule); margin-bottom: 8px; }

.ystrip { display: flex; align-items: flex-end; gap: 4px; }
.ystrip__m { display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 6px 7px 8px; border-radius: 8px; transition: background .16s ease; }
.ystrip__m:hover { background: var(--card); }
.ystrip__bar { width: 22px; border-radius: 3px; display: block;
  background: linear-gradient(180deg, #57a2ee, #245d98); }
.ystrip__m:hover .ystrip__bar { background: linear-gradient(180deg, #7dbcf7, #3d8ee8); }
.ystrip__lbl { font-family: "IBM Plex Sans", sans-serif; font-size: 9.5px; letter-spacing: .1em;
  color: var(--ink-3); }
.ystrip__n { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; color: #93c7fa; font-weight: 600; }

.calfilter { display: flex; gap: 4px; background: var(--card); border: 1px solid var(--rule);
  border-radius: 999px; padding: 3px; }
.calfilter button { border: 0; background: none; cursor: pointer; color: var(--ink-3);
  font: 500 12.5px/1 "IBM Plex Sans", sans-serif; padding: 9px 15px; border-radius: 999px;
  transition: background .16s ease, color .16s ease; }
.calfilter button[aria-pressed="true"] { background: var(--blue); color: #fff; }
.calfilter button:hover:not([aria-pressed="true"]) { color: #e2e9f2; }

.camonth { padding: 30px 0 8px; border-bottom: 1px solid var(--rule); scroll-margin-top: calc(var(--barh) + 32px); }
.camonth:last-of-type { border-bottom: 0; }
.camonth--run { background: rgba(6,25,54,.5); border: 1px solid var(--rule);
  border-radius: 12px; padding: 22px 22px 10px; margin: 26px 0 8px; }
.camonth__h { display: flex; align-items: baseline; gap: 14px; margin-bottom: 14px; }
.camonth__h h3 { font-family: var(--display); text-transform: uppercase;
  color: #fff; font-size: clamp(22px, 2.6vw, 32px); letter-spacing: .02em; margin: 0; }
.camonth__n { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; color: var(--ink-3); }

.daygrid { display: grid; grid-template-columns: repeat(31, 1fr); gap: 3px; margin-bottom: 18px; }
.dg__d { font-family: "IBM Plex Sans", sans-serif; font-size: 9.5px; text-align: center;
  padding: 5px 0; border-radius: 4px; color: var(--ink-3);
  background: rgba(255,255,255,.03); }
.dg__d.is-on { background: rgba(61,142,232,.9); color: #04142d; font-weight: 700; }

.evlist { display: grid; gap: 8px; }
.ev { display: grid; grid-template-columns: 74px 1fr auto; gap: 16px; align-items: center;
  padding: 12px 14px; border: 1px solid var(--rule); border-radius: 10px;
  background: rgba(8,32,67,.55); transition: border-color .16s ease, transform .16s ease; }
.ev:hover { border-color: var(--rule-2); transform: translateX(3px); }
.ev--i { background: rgba(48,28,20,.28); }
.ev__date { text-align: center; }
.ev__date b { display: block; font-family: "IBM Plex Sans", sans-serif;
  font-size: 20px; color: #fff; line-height: 1; letter-spacing: .02em; }
.ev__date i { display: block; font-style: normal; font-family: "IBM Plex Sans", sans-serif;
  font-size: 9.5px; letter-spacing: .12em; color: #69a9e9; margin-top: 3px; }
.ev__body { min-width: 0; }
.ev__body h4 { margin: 0 0 4px; font-size: 14.5px; font-weight: 600; color: #e9eef5; line-height: 1.32; }
.ev__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.ev__where, .ev__ref { font-family: "IBM Plex Sans", sans-serif; font-size: 10.5px; color: var(--ink-3); }
.ev__note { display: block; margin-top: 5px; font-size: 10.5px; color: var(--gold); }
.ev__tag { font-family: "IBM Plex Sans", sans-serif; font-size: 9.5px; letter-spacing: .1em;
  text-transform: uppercase; padding: 5px 9px; border-radius: 999px;
  border: 1px solid var(--rule-2); color: #8fb6da; white-space: nowrap; }
.ev__tag--i { border-color: rgba(208,79,74,.5); color: #e59a95; }
.cal__empty { color: var(--ink-3); font-size: 13.5px; padding: 6px 2px 14px; margin: 0; }
/* Running now / still to come / already over. A year of dates all rendered the
   same way gives the reader nothing to aim at; the badge and the dimming do. */
.ev--live { border-color: rgba(46,166,110,.55); background: rgba(46,166,110,.10); }
.ev--live .ev__date b { color: #3FBE85; }
.ev--live .ev__date i { color: #2EA66E; }
.ev__state { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 5px;
  font-family: "IBM Plex Sans", sans-serif; font-size: 9.5px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase; border-radius: 999px;
  padding: 2px 8px; background: rgba(46,166,110,.18); color: #3FBE85; }
.ev__state[hidden] { display: none; }
/* finished events stay legible but stop competing for attention */
.ev--past { opacity: .55; }
.ev--past:hover { opacity: 1; }

/* Official result sheets — a card index of the competition's categories.
   These are the federation's own paper: handwritten group tables and printed
   draws. Two things were wrong with showing them as a photo grid. They were
   sized like thumbnails, so a dense A4 page became an unreadable smudge; and
   they carried no labels, so fourteen of them said nothing about which category
   was which. The name the federation gave each scan is the label. */
.sheets {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(232px, 1fr));
  gap: 26px 20px;
  margin: 18px 0 0;
}
.sheet { margin: 0; }

/* paper on a dark desk: the preview keeps the top of the page, where the
   heading and the first rows are, and the label carries the identity */
.sheet__img {
  display: block; position: relative; overflow: hidden;
  aspect-ratio: 4 / 3; border-radius: 4px; background: #fbfaf7;
  box-shadow: 0 1px 0 rgba(255,255,255,.10), 0 10px 22px -14px rgba(0,0,0,.85);
  transition: transform .18s ease, box-shadow .18s ease;
}
.sheet__img img {
  width: 100%; height: 100%; display: block;
  object-fit: cover; object-position: top center;
}
.sheet__img::after {                       /* the page edge, not a UI border */
  content: ""; position: absolute; inset: 0; pointer-events: none;
  border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(3,13,32,.14);
}
.sheet__img:hover { transform: translateY(-3px); box-shadow: 0 2px 0 rgba(255,255,255,.14), 0 18px 30px -16px rgba(0,0,0,.9); }
.sheet__img:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }

.sheet figcaption {
  margin: 9px 1px 0; font-family: "IBM Plex Sans", sans-serif;
  font-size: 12.5px; line-height: 1.35; color: var(--ink-2);
  letter-spacing: .005em;
}

.sheet__cap { margin: 22px 0 0; font-family: "IBM Plex Sans", sans-serif;
  font-size: 12.5px; color: var(--ink-3); }
.sheet__cap a { color: var(--blue); border-bottom: 1px solid var(--rule-2); }
.sheet__cap a:hover { border-bottom-color: var(--blue); }

@media (prefers-reduced-motion: reduce) { .sheet__img { transition: none; } }
@media (max-width: 620px) {
  .sheets { grid-template-columns: repeat(auto-fill, minmax(146px, 1fr)); gap: 18px 12px; }
  .sheet figcaption { font-size: 11.5px; }
}

.ev.is-hidden { display: none; }

@media (max-width: 820px) {
  .daygrid { grid-template-columns: repeat(16, 1fr); }
  .ev { grid-template-columns: 60px 1fr; }
  .ev__tag { grid-column: 2; justify-self: start; margin-top: 6px; }
  .ystrip__bar { width: 14px; }
}

/* calendar column is wider than the document column */
.grid-2--cal { grid-template-columns: 1.55fr 1fr; gap: 40px; }
.calcol { min-width: 0; }
.docol { min-width: 0; }

/* the calendar inside a column: tighter than full-width */
.calcol .calbar { flex-direction: column; align-items: stretch; gap: 14px; }
.calcol .ystrip { justify-content: space-between; }
.calcol .ystrip__m { padding: 4px 3px 6px; }
.calcol .ystrip__bar { width: 100%; min-width: 12px; }
.calcol .calfilter { align-self: flex-start; }
.calcol .ev { grid-template-columns: 62px 1fr; gap: 12px; padding: 11px 12px; }
.calcol .ev__tag { grid-column: 2; justify-self: start; margin-top: 6px; }
.calcol .ev__date b { font-size: 17px; }
.calcol .daygrid { gap: 2px; }
.calcol .dg__d { font-size: 8.5px; padding: 4px 0; }

@media (max-width: 1100px) {
  .grid-2--cal { grid-template-columns: 1fr; gap: 34px; }
  .calcol .ev { grid-template-columns: 74px 1fr auto; }
  .calcol .ev__tag { grid-column: auto; margin-top: 0; }
}

/* month selector: active month highlighted */
.ystrip__m { border: 0; background: none; cursor: pointer; font: inherit; }
.ystrip__m[aria-pressed="true"] { background: var(--card); box-shadow: inset 0 0 0 1px var(--rule-2); }
.ystrip__m[aria-pressed="true"] .ystrip__bar { background: linear-gradient(180deg, #8fc9ff, #3d8ee8); }
.ystrip__m[aria-pressed="true"] .ystrip__lbl { color: #e2e9f2; }
.camonth--panel[hidden] { display: none; }
.camonth--panel { border-bottom: 0; padding-top: 22px; }

/* selector sticks under the masthead while you read the month */
.calcol .calbar { position: sticky; top: var(--barh); z-index: 6;
  background: linear-gradient(180deg, var(--bg) 72%, rgba(3,13,32,0));
  padding-top: 10px; padding-bottom: 14px; margin-bottom: 0; border-bottom: 0; }

/* prev / next in the month header */
.camonth__h { align-items: center; }
.mnav { border: 1px solid var(--rule); background: var(--card); color: #9dc6ee;
  width: 30px; height: 30px; border-radius: 50%; cursor: pointer; flex: 0 0 auto;
  font: 400 17px/1 "IBM Plex Sans", sans-serif; display: grid; place-items: center;
  transition: background .16s ease, color .16s ease, border-color .16s ease; }
.mnav:hover { background: var(--blue); color: #fff; border-color: var(--blue); }
.camonth--run .camonth__h { margin-top: 6px; }
.camonth--panel { padding-top: 6px; }
.camonth--run { margin-top: 26px; }

/* document list that shows N rows then scrolls */
.doclist--scroll.is-scrollable { overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin; scrollbar-color: #245d98 transparent;
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 46px), transparent 100%);
  mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 46px), transparent 100%); }
/* at the bottom of the list there is nothing more to promise */
.doclist--scroll.is-scrollable.is-end { -webkit-mask-image: none; mask-image: none; }
.doclist--scroll.is-scrollable:focus-visible { outline: 2px solid var(--blue);
  outline-offset: 3px; border-radius: 4px; }
.doclist--scroll::-webkit-scrollbar { width: 8px; }
.doclist--scroll::-webkit-scrollbar-thumb { background: #245d98; border-radius: 99px;
  border: 2px solid var(--bg); }
.doclist--scroll::-webkit-scrollbar-track { background: transparent; }

/* leadership: the largest body spans the row, and its members lay out in
   columns instead of one long list. With five bodies and one of them wide,
   the two columns fill exactly: 2 + span + 2. */
.roles .role--wide { grid-column: 1 / -1; }
.roles .role--wide .people {
  /* 240px, not 150: a name plus the chair chip runs to about 220px, and
     narrower tracks break "Vladimir ZASTAVNIȚCHI" across two lines. */
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 9px 20px;
}

/* ===================== galerie ===================== */
.albums { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 16px; }
.album { position: relative; border-radius: 12px; overflow: hidden; display: block;
  border: 1px solid var(--rule); background: var(--card);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.album:hover { transform: translateY(-3px); border-color: var(--rule-2);
  box-shadow: 0 20px 40px -26px rgba(0,0,0,.6); }
.album__img { display: block; aspect-ratio: 4/3; overflow: hidden; background: #071628; }
.album__img img { width: 100%; height: 100%; object-fit: cover;
  transition: transform .55s cubic-bezier(.2,.7,.3,1); }
.album:hover .album__img img { transform: scale(1.05); }
/* Album titles sit on the photo itself, and the covers run from a dark hall to
   a white-lit podium — a single-stop scrim left the first line unreadable on
   the bright ones. Ramp it earlier and carry a shadow under the text. */
.album__c { position: absolute; inset: auto 0 0 0; padding: 52px 14px 12px; color: #fff;
  background: linear-gradient(to top, rgba(3,12,28,.97) 0%, rgba(3,12,28,.90) 30%,
    rgba(3,12,28,.66) 60%, rgba(3,12,28,.22) 84%, rgba(3,12,28,0) 100%);
  text-shadow: 0 1px 3px rgba(0,0,0,.6); }
.album__c b { display: block; font-size: 13.5px; font-weight: 600; line-height: 1.28; }
.album__c i { font-style: normal; font-family: "IBM Plex Sans", sans-serif; font-size: 10px;
  color: #9dc6ee; }

.albumhead { display: flex; align-items: flex-end; justify-content: space-between;
  gap: 20px; flex-wrap: wrap; margin-bottom: 24px; }
.albumhead .art__title { margin: 0 0 6px; font-size: clamp(24px, 3.4vw, 44px); }
.albumhead .art__date { margin: 0; }

.shots { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.shot { display: block; aspect-ratio: 1; border-radius: 9px; overflow: hidden;
  background: #071628; border: 1px solid transparent; transition: border-color .16s ease; }
.shot:hover { border-color: var(--blue); }
.shot img { width: 100%; height: 100%; object-fit: cover;
  transition: transform .4s ease; }
.shot:hover img { transform: scale(1.06); }

.albumnav { display: flex; justify-content: space-between; gap: 16px; margin-top: 40px;
  padding-top: 20px; border-top: 1px solid var(--rule); flex-wrap: wrap; }
.albumnav a { font-size: 13.5px; color: var(--ink-2); }
.albumnav a:hover { color: var(--blue); }

@media (max-width: 640px) {
  .albums { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; }
  .shots { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 7px; }
}

/* ===================== lightbox ===================== */
.lightbox { position: fixed; inset: 0; z-index: 200; display: grid;
  grid-template-columns: 64px 1fr 64px; align-items: center;
  background: rgba(2, 8, 20, .93); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.lightbox[hidden] { display: none; }
.lb__stage { grid-column: 2; margin: 0; display: grid; place-items: center; gap: 12px;
  max-height: 100vh; padding: 26px 0; }
.lb__stage img { max-width: 100%; max-height: calc(100vh - 96px); object-fit: contain;
  border-radius: 6px; box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.lb__count { font-family: "IBM Plex Sans", sans-serif; font-size: 12px; letter-spacing: .12em;
  color: #9dc6ee; }
.lb__nav { width: 46px; height: 46px; border-radius: 50%; justify-self: center; cursor: pointer;
  background: rgba(255,255,255,.07); border: 1px solid rgba(157,198,238,.28); color: #dcebfa;
  font: 400 26px/1 "IBM Plex Sans", sans-serif; display: grid; place-items: center;
  transition: background .16s ease, border-color .16s ease; }
.lb__nav:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.lb__prev { grid-column: 1; } .lb__next { grid-column: 3; }
.lb__close { position: absolute; top: 16px; right: 18px; width: 40px; height: 40px;
  border-radius: 50%; cursor: pointer; background: rgba(255,255,255,.07);
  border: 1px solid rgba(157,198,238,.28); color: #dcebfa; font-size: 24px; line-height: 1;
  display: grid; place-items: center; }
.lb__close:hover { background: var(--red); border-color: var(--red); color: #fff; }

@media (max-width: 700px) {
  .lightbox { grid-template-columns: 1fr; }
  .lb__stage { grid-column: 1; padding: 60px 10px 76px; }
  .lb__nav { position: absolute; bottom: 16px; }
  .lb__prev { left: 26%; } .lb__next { right: 26%; }
}

/* year separator on the news archive */
.yearhead { display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  margin: 46px 0 10px; padding-bottom: 10px; border-bottom: 2px solid var(--rule-2);
  scroll-margin-top: calc(var(--barh) + 32px); }
.yearhead:first-child { margin-top: 0; }
.yearhead span { font-family: "IBM Plex Sans", sans-serif; font-size: clamp(30px,4vw,46px);
  color: #fff; letter-spacing: .02em; line-height: 1; }
.yearhead small { font-family: "IBM Plex Sans", sans-serif; font-size: 11px; color: var(--ink-3); }

/* ===================== rezultate ===================== */
.rescards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.rescard { display: block; padding: 18px 20px 20px; border: 1px solid var(--rule);
  border-radius: 12px; background: var(--card);
  transition: transform .2s ease, border-color .2s ease; }
.rescard:hover { transform: translateY(-3px); border-color: var(--blue); }
.rescard__d { font-family: "IBM Plex Sans", sans-serif; font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; color: #69a9e9; }
.rescard h2 { font-family: "IBM Plex Sans", sans-serif; font-weight: 600; text-transform: none;
  color: #fff; font-size: 21px; line-height: 1.2; margin: 8px 0 6px; letter-spacing: -.01em; }
.rescard__m { font-size: 12.5px; color: var(--ink-3); }

.resgroup { margin-top: 34px; }
.resgroup h2 { font-family: "IBM Plex Sans", sans-serif; font-weight: 600; text-transform: none;
  color: #fff; font-size: clamp(22px,2.6vw,30px); margin: 0 0 14px; letter-spacing: -.012em; }

/* podium */
.pods { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px;
  margin-bottom: 18px; }
.pod { padding: 14px 16px; border-radius: 10px; background: var(--card);
  border: 1px solid var(--rule); border-left-width: 3px; display: grid; gap: 3px; }
.pod--gold   { border-left-color: #d9b24c; }
.pod--silver { border-left-color: #b9c6d4; }
.pod--bronze { border-left-color: #c08457; }
.pod__p { font-family: "IBM Plex Sans", sans-serif; font-size: 15px; color: #9dc6ee;
  letter-spacing: .08em; }
.pod__n { font-size: 15px; font-weight: 600; color: #eef4fb; line-height: 1.25; }
.pod__m { font-family: "IBM Plex Sans", sans-serif; font-size: 10.5px; color: var(--ink-3); }

/* results table */
.rt__wrap { overflow-x: auto; border: 1px solid var(--rule); border-radius: 12px;
  background: var(--card); }
.rt { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 640px; }
.rt caption { text-align: left; padding: 13px 16px; font-family: "IBM Plex Sans", sans-serif;
  font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3);
  border-bottom: 1px solid var(--rule); }
.rt th { font-family: "IBM Plex Sans", sans-serif; font-size: 10.5px; font-weight: 500;
  letter-spacing: .08em; color: var(--ink-3); text-align: center; padding: 10px 8px;
  border-bottom: 1px solid var(--rule); white-space: nowrap; }
.rt td { padding: 11px 8px; text-align: center; color: #d8e3f0;
  border-bottom: 1px solid rgba(96,158,224,.10); font-variant-numeric: tabular-nums; }
.rt tbody tr:last-child td { border-bottom: 0; }
.rt tbody tr:hover td { background: rgba(61,142,232,.07); }
.rt__pos { color: var(--ink-3); width: 40px; }
.rt__team { text-align: left !important; font-weight: 600; color: #fff; white-space: nowrap; }
.rt__pts { font-weight: 700; color: #fff; }
.rt__pts small { display: block; font-size: 9.5px; font-weight: 400; color: var(--ink-3);
  font-family: "IBM Plex Sans", sans-serif; }
.rt__place { font-family: "IBM Plex Sans", sans-serif; font-size: 16px; }
.rt__place.gold { color: #e6c463; } .rt__place.silver { color: #cdd8e4; }
.rt__place.bronze { color: #d09a6d; }
.rt td.is-self { background: repeating-linear-gradient(45deg, rgba(96,158,224,.14) 0 4px,
  transparent 4px 8px); color: transparent; }

/* knockout draw */
.ko { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.ko__round { background: var(--card); border: 1px solid var(--rule); border-radius: 12px;
  padding: 15px 16px 16px; }
.ko__round h2, .ko__round h3 { font-family: "IBM Plex Sans", sans-serif; font-size: 10.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-3); margin: 0 0 12px; font-weight: 500; }
.ko__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ko__m { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center;
  font-size: 13px; padding: 8px 0; border-bottom: 1px solid rgba(96,158,224,.10); }
.ko__m:last-child { border-bottom: 0; }
.ko__m span { color: var(--ink-2); }
.ko__m span:last-child { text-align: right; }
.ko__m span.is-win { color: #fff; font-weight: 600; }
.ko__m b { font-family: "IBM Plex Sans", sans-serif; font-size: 12px; color: #69a9e9;
  font-variant-numeric: tabular-nums; }

/* ===================== placements ===================== */
.places { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr));
  gap: 12px; margin: 22px 0; }
.place { background: var(--card); border: 1px solid var(--rule); border-radius: 12px;
  padding: 14px 16px 12px; }
.place h2, .place h3, .place h4 { margin: 0 0 10px; font-family: "IBM Plex Sans", sans-serif;
  text-transform: uppercase; font-size: 15px; letter-spacing: .06em; color: #69a9e9;
  padding-bottom: 8px; border-bottom: 1px solid var(--rule); }
.place ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.place li { display: grid; grid-template-columns: 22px 62px 1fr; gap: 10px;
  align-items: baseline; padding: 7px 0; border-bottom: 1px solid rgba(96,158,224,.09); }
.place li:last-child { border-bottom: 0; }
.place li i { font-style: normal; font-size: 14px; line-height: 1; }
.place li b { font-family: "IBM Plex Sans", sans-serif; font-size: 10px; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.place li span { font-size: 14px; color: #e8eff7; line-height: 1.35; }

/* consecutive placement blocks in one article sit together as one grid */
.art__body .places + .places { margin-top: -6px; }

@media (max-width: 560px) {
  .place li { grid-template-columns: 20px 56px 1fr; gap: 8px; }
  .place li span { font-size: 13.5px; }
}

/* a highlighted line that follows a results list (congratulations, titles won) */
.laurel { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start;
  margin: 14px 0; padding: 14px 18px; border-radius: 12px;
  background: rgba(61,142,232,.08); border: 1px solid var(--rule);
  border-left: 3px solid var(--blue); font-size: 15.5px; color: var(--ink-2); max-width: none; }
.laurel i { font-style: normal; font-size: 19px; line-height: 1.2; }
.laurel span { line-height: 1.55; }
.laurel--win { background: rgba(200,154,60,.10); border-left-color: var(--gold); color: #f0e7d3; }
.laurel--win span { color: #f4ecda; }

/* a section label above a group of result tables (Bărbați / Femei / …) */
.places__section { margin: 26px 0 10px; padding: 9px 16px; border-radius: 10px;
  display: inline-block; font-family: "IBM Plex Sans", sans-serif;
  text-transform: uppercase; font-size: 17px; letter-spacing: .07em; color: #fff;
  background: linear-gradient(135deg, rgba(61,142,232,.30), rgba(61,142,232,.12));
  border: 1px solid var(--rule-2); }
.art__body .places__section:first-child { margin-top: 6px; }

/* ===================== photo strip (contact sheet) =====================
   The photos on a report are the full take from one afternoon in a sports
   hall — two to thirty-odd frames, unedited. A contact strip is the honest
   form: fixed height, so the band costs the page the same whether there are
   three frames or thirty, and nothing is cropped — every frame keeps its own
   width at a common height, portrait beside landscape. */
.strip { margin: 40px 0 4px; width: max-content; max-width: 100%; }

.strip__h { display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px; padding-bottom: 9px; border-bottom: 1px solid var(--rule); }
.strip__h h2 { margin: 0; font-family: "IBM Plex Sans", sans-serif;
  text-transform: uppercase; letter-spacing: .04em; font-size: 21px;
  font-weight: 600; color: var(--ink); line-height: 1; }
.strip__n { font-family: "IBM Plex Sans", sans-serif; font-size: 11px;
  letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3);
  white-space: nowrap; }

/* the well — darker than the page, so the strip sits into it rather than on it */
.strip__reel { display: flex; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x proximity; scroll-behavior: smooth;
  background: var(--night); border: 1px solid var(--rule); border-top: 0;
  border-radius: 0 0 10px 10px; width: 100%; }
.strip__reel::-webkit-scrollbar { height: 10px; }
.strip__reel::-webkit-scrollbar-thumb { background: var(--rule-2); border-radius: 0;
  border: 3px solid var(--night); }
.strip__reel::-webkit-scrollbar-thumb:hover { background: var(--blue); }
.strip__reel::-webkit-scrollbar-track { background: rgba(96,158,224,.10); }

/* one strip, not a row of cards: square inner corners, hairline splices */
.frame { flex: 0 0 auto; scroll-snap-align: start; display: grid;
  grid-template-rows: 1fr auto; border-right: 1px solid var(--rule);
  text-decoration: none; position: relative; }
.frame:last-child { border-right: 0; }
.strip .frame img { display: block; height: 160px; width: auto; max-width: none;
  filter: brightness(.9); transition: filter .18s ease; }
.frame:hover img, .frame:focus-visible img { filter: none; }
.frame:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; z-index: 1; }

/* the rail: frame numbers are shooting order — information, not decoration */
.frame__n { font-family: "IBM Plex Sans", sans-serif; font-size: 10px;
  letter-spacing: .14em; color: var(--ink-3); text-align: center;
  padding: 7px 10px 8px; border-top: 1px solid var(--rule);
  transition: color .14s ease; }
.frame:hover .frame__n, .frame:focus-visible .frame__n { color: var(--blue); }

@media (hover: none) { .strip .frame img { filter: none; } }

@media (max-width: 640px) {
  .strip { margin-top: 30px; }
  .strip__h h2 { font-size: 18px; }
  .strip .frame img { height: 124px; }
  .frame__n { font-size: 9px; padding: 5px 6px 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .strip__reel { scroll-behavior: auto; }
  .strip .frame img, .frame__n { transition: none; }
}

/* documents filed alongside a post's photos — same band as the contact strip,
   because they answer the same question: what else came with this report */
.artdocs { margin-top: 34px; width: 100%; }
.artdocs__list { border: 1px solid var(--rule); border-top: 0;
  border-radius: 0 0 10px 10px; overflow: hidden; background: var(--night); }
.artdocs__list .li--doc { border-bottom: 1px solid var(--rule); }
.artdocs__list .li--doc:last-child { border-bottom: 0; }

/* ---- contact page: the address block spans, so no empty cell is left over */
/* Office, president and address sit as three equal cards; below them the
   address gets an actual map, because it is the one contact detail people act
   on by travelling to it. */
.ccards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .ccards { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }

/* spans both columns of .grid-2, below them */
.cmap { margin: 40px 0 0; border: 1px solid var(--rule); border-radius: 12px;
  overflow: hidden; background: var(--card); }
.cmap iframe { display: block; width: 100%; height: 420px; border: 0;
  filter: saturate(.9) contrast(1.02); }
.cmap__cap { display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap; padding: 11px 16px; border-top: 1px solid var(--rule);
  font-size: 13px; color: var(--ink-3); }
.cmap__cap a { color: var(--blue); border-bottom: 1px solid var(--rule-2);
  padding-bottom: 1px; white-space: nowrap; }
.cmap__cap a:hover { border-bottom-color: var(--blue); }
@media (max-width: 640px) { .cmap iframe { height: 240px; } }
/* bank details are values to copy, not files to open */
.kvrow .mono-val { font-family: "IBM Plex Sans", sans-serif; letter-spacing: .04em;
  -webkit-user-select: all; user-select: all; }

/* ---- outbound links say so, like the document rows do */
.resource-links a { display: flex; align-items: center; justify-content: space-between;
  gap: 10px; }
.resource-links .ext { color: var(--ink-3); font-size: 12px; flex: none; }
.resource-links a:hover .ext { color: var(--blue); }

/* ---- 404 */
.notfound { padding: clamp(50px, 9vw, 110px) 0 clamp(60px, 10vw, 130px); max-width: 62ch; }
.notfound h1 { font-family: var(--display);
  text-transform: uppercase; letter-spacing: .005em;
  font-size: clamp(32px, 5.4vw, 60px); margin: 12px 0 18px; }
.notfound .lede { color: var(--ink-2); font-size: 17px; line-height: 1.65; }
.notfound__go { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }

/* ---- print: coaches and referees print the regulations and the result sheets */
@media print {
  .tri, .bar, .skip, .phero__art, .mainnav, .foot, .search, .lang,
  .art__side, .rail, .strip, .lightbox, .bt { display: none !important; }
  html, body { background: #fff !important; color: #000 !important; }
  .wrap, .page, .art { width: auto !important; max-width: none !important;
    display: block !important; margin: 0 !important; padding: 0 !important; }
  a { color: #000 !important; text-decoration: none !important; border: 0 !important; }
  /* a printed link is useless without its destination */
  .art__body a[href^="http"]::after,
  .doc-row[href^="http"]::after { content: " (" attr(href) ")"; font-size: 10pt;
    word-break: break-all; }
  h1, h2, h3 { color: #000 !important; page-break-after: avoid; }
  .places, .doc-row, .li, tr { page-break-inside: avoid; }
  .phero { min-height: 0 !important; padding: 0 0 12pt !important; }
  .phero__in, .phero__copy { position: static !important; padding: 0 !important; }
  img { max-width: 100% !important; }
}

/* a report with a photo strip says so in the listing, next to its date */
.news-list-shots { position: relative; margin-left: 16px; padding-left: 17px; }
.news-list-shots::before { content: ""; position: absolute; left: 0; top: 50%;
  width: 10px; height: 8px; margin-top: -4px; border: 1.5px solid currentColor;
  border-radius: 2px; opacity: .8; }

/* the strip shows about four frames; its album holds the whole set */
.strip__all { font-family: "IBM Plex Sans", sans-serif; font-size: 11px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--blue);
  white-space: nowrap; border-bottom: 1px solid var(--rule-2); padding-bottom: 1px; }
.strip__all:hover { border-bottom-color: var(--blue); }
.strip__all::after { content: " \2192"; }

/* an album built from a report links back to what was written about it */
.albumsrc { display: inline-block; margin-top: 10px; font-size: 13.5px;
  color: var(--blue); border-bottom: 1px solid var(--rule-2); padding-bottom: 1px; }
.albumsrc:hover { border-bottom-color: var(--blue); }



/* ===================== clasament =====================
   Five hundred–odd players, so the table is one scannable column set with a
   filter over it rather than a paged list — a parent looking for one name
   should type it, not click through pages. */
.rbar { display: flex; align-items: center; justify-content: space-between;
  gap: 18px; flex-wrap: wrap; margin-bottom: 18px; }
.rtabs { display: flex; gap: 6px; background: var(--night); padding: 4px;
  border: 1px solid var(--rule); border-radius: 999px; }
.rtab { display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  border: 0; background: none; border-radius: 999px; padding: 9px 16px;
  font: 600 13.5px/1 "IBM Plex Sans", sans-serif; color: var(--ink-2); }
.rtab:hover { color: #fff; }
.rtab.is-on { background: var(--blue); color: #fff; }
.rtab__n { font-size: 11px; opacity: .7; font-variant-numeric: tabular-nums; }

.rsearch { display: flex; align-items: center; gap: 9px; height: 42px;
  padding: 0 14px; border: 1px solid var(--rule-2); border-radius: 10px;
  background: var(--card); color: var(--ink-3); width: min(320px, 100%); }
.rsearch:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(61,142,232,.14); }
.rsearch input { flex: 1; min-width: 0; border: 0; background: none; outline: none;
  color: var(--ink); font: 400 14.5px/1 "IBM Plex Sans", sans-serif; }
.rsearch input::placeholder { color: var(--ink-3); }

/* Age band and town. They sit with the search box as one control group, so the
   tabs stay pinned left and the filters flow together on the right. */
.rbar { justify-content: flex-start; }
.rtabs { margin-right: auto; }

.rfilt { position: relative; display: inline-flex; }
.rfilt select {
  appearance: none; height: 42px; padding: 0 34px 0 14px; max-width: 210px;
  border: 1px solid var(--rule-2); border-radius: 10px; background: var(--card);
  color: var(--ink); font: 500 13.5px/1 "IBM Plex Sans", sans-serif;
  cursor: pointer; text-overflow: ellipsis;
}
.rfilt select:hover { border-color: var(--blue); }
.rfilt select:focus-visible { outline: 0; border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(61,142,232,.14); }
/* a chevron, drawn rather than fetched */
.rfilt::after {
  content: ""; position: absolute; right: 14px; top: 50%; width: 7px; height: 7px;
  margin-top: -5px; border-right: 1.6px solid var(--ink-3);
  border-bottom: 1.6px solid var(--ink-3); transform: rotate(45deg);
  pointer-events: none;
}
/* the browser paints the open list in its own colours, not the page's */
.rfilt option { background: var(--card); color: var(--ink); }

.rfilt__n { font: 500 12.5px/1 "IBM Plex Sans", sans-serif; color: var(--ink-3);
  font-variant-numeric: tabular-nums; min-width: 0; }

@media (max-width: 700px) {
  .rbar { gap: 10px; }
  .rtabs { margin-right: 0; }
  .rsearch, .rfilt, .rfilt select { width: 100%; max-width: none; }
  .rfilt { flex: 1 1 46%; }
}

.rpanel { display: none; }
.rpanel.is-on { display: block; }
.rk { width: 100%; border-collapse: collapse; background: var(--night);
  border: 1px solid var(--rule); border-radius: 12px; overflow: hidden; }
.rk th { text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--rule-2);
  font: 600 10.5px/1 "IBM Plex Sans", sans-serif; letter-spacing: .12em;
  text-transform: uppercase; color: var(--ink-3); white-space: nowrap; }
.rk td { padding: 11px 16px; border-bottom: 1px solid var(--rule);
  font-size: 14.5px; color: var(--ink-2); }
.rk tbody tr:last-child td { border-bottom: 0; }
.rk tbody tr:hover td { background: rgba(61,142,232,.08); }
.rk__p { width: 68px; font-variant-numeric: tabular-nums; color: var(--ink-3); }
.rk__n { color: var(--ink); font-weight: 500; }
.rk__v { width: 96px; font-variant-numeric: tabular-nums; color: #9dc6ee; font-weight: 600; }
.rk__c { width: 150px; }
.rk__y { width: 76px; font-variant-numeric: tabular-nums; color: var(--ink-3); }
/* the top three carry the same medal colours the result pages use */
.rk tbody tr:nth-child(1) .rk__p { color: var(--gold); font-weight: 700; }
.rk tbody tr:nth-child(2) .rk__p { color: #c6d2e1; font-weight: 700; }
.rk tbody tr:nth-child(3) .rk__p { color: #cd8b5a; font-weight: 700; }

.rk__none { margin: 18px 0 0; color: var(--ink-2); font-size: 15px; }
.rk__none b { color: var(--ink); display: block; margin-bottom: 4px; }
.rfoot { margin: 16px 0 0; font-size: 13px; color: var(--ink-3); }
.rfoot a { color: var(--blue); border-bottom: 1px solid var(--rule-2); }
.rfoot a:hover { border-bottom-color: var(--blue); }

@media (max-width: 720px) {
  .rbar { gap: 12px; }
  .rsearch { width: 100%; }
  .rk__c, .rk__y { display: none; }
  .rk th, .rk td { padding: 10px 12px; }
}

/* a player's row opens the matches behind their rating */
.rk__row { cursor: pointer; }
.rk__row:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.rk__row.is-open td { background: rgba(61,142,232,.12); }
.rk__row.is-open .rk__n::after { content: " ▾"; color: var(--blue); font-size: 11px; }
.rh td { padding: 0; border-bottom: 1px solid var(--rule); background: var(--card); }
.rh__in { padding: 16px 16px 18px; }
.rh__in h3 { margin: 0 0 10px; font: 600 10.5px/1 "IBM Plex Sans", sans-serif;
  letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.rh__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 1px;
  background: var(--rule); border: 1px solid var(--rule); border-radius: 9px;
  overflow: hidden; }
.rh__m { display: grid; grid-template-columns: 104px minmax(0,1fr) 132px 68px;
  gap: 12px; align-items: baseline; padding: 9px 13px; background: var(--night);
  font-size: 13.5px; }
.rh__d { color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rh__e { color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rh__r { color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rh__delta { font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; }
.rh__delta--up { color: #5fbf7f; }
.rh__delta--down { color: var(--red-text); }
.rh__delta--flat { color: var(--ink-3); }
.rh__none { margin: 0; color: var(--ink-3); font-size: 13.5px; }
@media (max-width: 720px) {
  .rh__m { grid-template-columns: 1fr auto; gap: 3px 10px; }
  .rh__d { grid-column: 1; } .rh__delta { grid-column: 2; grid-row: 1; }
  .rh__e { grid-column: 1 / -1; } .rh__r { grid-column: 1 / -1; }
}

/* Album covers are shown in landscape frames with object-fit: cover. A portrait
   source then gets cropped to a band across its middle, which on a photograph of
   people is their chests — the faces sit at roughly a third of the way down, so
   that is where the crop is taken from. Landscape covers are untouched. */
.cov.is-tall { object-position: 50% 30%; }

/* The two legal pages. Prose, so it gets a measure — the children are capped
   rather than the section, which keeps the column aligned with the page gutter
   instead of centring a narrow block against a left-aligned hero. */
.legal > * { max-width: 68ch; }
.legal h2 { margin: 36px 0 10px; }
.legal h2:first-of-type { margin-top: 26px; }
.legal p { margin: 0 0 13px; line-height: 1.62; }
.legal__stamp {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 11.5px; letter-spacing: .09em; text-transform: uppercase;
  color: var(--ink-3); margin: 0;
}

/* The Facebook mark, used on its own as a button — no heading, no URL beside
   it. It inherits the surrounding link colour rather than carrying Facebook
   blue, so it sits with the phone number and the address instead of shouting
   over them. */
.fbmark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-top: 2px;
  border-radius: 8px;
  color: inherit;
  transition: color .16s ease, background-color .16s ease;
}
.fbmark:hover, .fbmark:focus-visible { color: #1877F2; background: rgba(24,119,242,.10); }
.contact__soc { margin-top: 2px; }


/* ---- pointer targets ----
   WCAG 2.2 asks 24x24 CSS px of any pointer target, mouse included, so these
   are not scoped to a phone. The breadcrumb links measured 17px tall and the
   footer's 20px at every width. */
.crumb a, .crumb b, .crumb span,
.breadcrumb a, .breadcrumb b, .breadcrumb span,
.strip__all, .albumnav a, .rfoot a, .albumsrc, .doc-open, .resource-links a,
.ccard a, .cmap__cap a, .art__back {
  display: inline-flex; align-items: center; min-height: 26px;
}

/* Both search bars are tall enough on their own; the input inside them was
   only 17-21px, so most of the bar did not respond to a click. */
.rsearch input, .search input { align-self: stretch; height: 100%; }

/* a month button came out exactly 24px wide — the minimum with nothing spare */
.ystrip__m { min-width: 26px; }

/* ---- mobile refinements (see the matching block in theme.css) ---- */
@media (max-width: 700px) {

  /* twelve months across 320px left 24px per button with 4px between them.
     Give each month a comfortable width and let the strip scroll rather
     than squeezing the year into the viewport. */
  /* min-width:0 is what actually lets a flex item shrink below its content
     and hand the overflow to its own scroller — without it the strip just
     grows to 570px and an ancestor clips the last four months away. */
  .ystrip { overflow-x: auto; scrollbar-width: none; gap: 6px;
    min-width: 0; max-width: 100%; scroll-snap-type: x proximity; }
  .ystrip::-webkit-scrollbar { display: none; }
  .ystrip__m, .calcol .ystrip__m { flex: 0 0 auto; min-width: 42px; padding: 6px 7px 8px;
    scroll-snap-align: start; }
}