/**
 * royale-aviator-az.online — «QRAFİT & ŞİMŞƏK»
 *
 * THE PALETTE LAW — ƏMSAL NƏRDİVANI (the multiplier ladder), and the reason every rule below
 * addresses a ROLE and never a token. The domain's word is `aviator`, and the word names a
 * flight: something with a trajectory, something you could extrapolate. That is exactly the
 * mistake the search market is built on — «signal», «hack», «tricks», «prediction». The game
 * is not a flight. Each round DRAWS a crash point, and a drawn value has no trajectory. So
 * this palette is not a ramp of tints; it is a payout ladder. Token k's WCAG contrast against
 * the ground `qrafit` is exactly
 *
 *       m(k) = 12 / (12 - k)      k = 1 … 11
 *
 * and the eleven rungs are 12/11 · 1,20 · 4/3 · 1,50 · 12/7 · 2,00 · 2,40 · 3,00 · 4,00 ·
 * 6,00 · 12,00. Worst deviation over the shipped 8-bit hexes: 0,540 % (a grey, quantisation-
 * bound; the five chromatics land inside 0,009 %).
 *
 *   R2  CHROMA MARKS THE WHOLE NUMBERS. m(k) is an integer exactly when (12-k) divides 12,
 *       i.e. k ∈ {6, 8, 9, 10, 11} → 2,00 · 3,00 · 4,00 · 6,00 · 12,00. Those five are the
 *       only chromatic tokens; the other six are STRICTLY achromatic, R = G = B, measured
 *       chroma 0,000000. A player sets auto-cashout at 2,00×, never at 1,714×, so colour on
 *       this page falls exactly on the multipliers somebody would actually choose.
 *   R3  THE AA THRESHOLD CUTS THE LADDER, AND IT CUTS INSIDE THE COLOUR. 4,5 : 1 needs
 *       m ≥ 4,5 ⟺ k ≥ 9,34, so exactly TWO of the eleven tokens may carry body copy
 *       (şimşək 6,00× and ayaz 12,00×). 3 : 1 admits two more (cizgi 3,00×, üfüq 4,00×).
 *       All four are chromatic — so GREY CANNOT SPEAK here: every achromatic token is, by
 *       the law, barred from text and from a visible border, and there is no white anywhere.
 *   R4  THE STEP GROWS MONOTONICALLY: 1,100 1,111 1,125 1,143 1,167 1,200 1,250 1,333 1,500
 *       2,000. All the resolution is at the top. The six surfaces are therefore ~10 % apart
 *       on a very small contrast and CANNOT be told apart by fill — they are told apart by
 *       hairline and gap — while the two inks are 2× apart and separate at a glance.
 *   R5  THE RECIPROCAL IS EVEN. 1/m(k) = (12-k)/12: eleven equal steps of probability under
 *       an exploding ladder of payouts. That is the whole honest picture of the game, and it
 *       is what the mark draws (ƏMSAL-QÖVSÜ, eleven evenly spaced arcs of radius (12-k)/12).
 *   R6  CHROMA IS NOT A CHOICE. R1 fixes the luminance, so chroma is only ever the most sRGB
 *       still holds at that luminance on this hue. Measured: 0,0837 at 2,00× · 0,1928 at
 *       3,00× · 0,2204 at 4,00× · 0,0845 at 6,00× · 0,0707 at 12,00×. It PEAKS AT 4,00× and
 *       collapses above it, because a blue that bright does not exist. The most saturated
 *       colour on this site is its 4,00× — the multiplier that is neither near-certain nor a
 *       fantasy. Nothing was toned down; the gamut ran out.
 *   R7  EVERY PAIR'S CONTRAST IS A RATIO OF MULTIPLIERS. All contrasts are taken against one
 *       ground, so C(a,b) = m(a)/m(b) exactly (verified on all 66 pairs, worst 1,034 %).
 *       Accessibility here is arithmetic, not measurement — and the arithmetic is severe: a
 *       fill can carry body copy only if 12/m ≥ 4,5, i.e. m ≤ 8/3, which admits the six greys
 *       and exactly ONE chromatic (əqrəb, 2,00×).
 *
 *       ayaz    #B0CDFA  12,00×  --rav-ink / --rav-head    body + every heading level
 *       şimşək  #7190C3   6,00×  --rav-rule / -second /    control fill (label = qrafit,
 *                                 -quiet / -accent          6,00 : 1), links, helper text
 *       üfüq    #0D69F2   4,00×  --rav-axis                LARGE text and icons ONLY
 *       cizgi   #0B57CB   3,00×  --rav-line                hairline — sits ON the 3:1 line
 *       buz     #505050   2,40×  --rav-edge                brightest grey; divider, disabled
 *       əqrəb   #294471   2,00×  --rav-dial                the one chromatic SURFACE
 *       şeh     #3A3A3A   12/7×  --rav-band                section band
 *       külək   #313131   1,50×  --rav-raise               raised surface
 *       tüstü   #292929   4/3×   --rav-well                deep inset
 *       bulud   #202020   1,20×  --rav-plate               card fill (ink 10,00 : 1)
 *       duman   #181818   12/11× --rav-haze                faintest wash
 *       qrafit  #0B0D11   1,00×  --rav-ground              the field, and every control label
 *
 *
 * THE CENSUS (census_rav.py, 100 sibling themes on this machine, 1663 palette colours):
 *   C1  the ƏMSAL LADDER at a 2 % tolerance — four times looser than the 0,540 % this build
 *       ships — is held by 0 of 100.
 *   C2  chromatic ⟺ whole multiplier, with the greys strictly R=G=B: 0 of 100.
 *   C3  exactly TWO body-capable tokens: 0 of 100, and the sibling MEDIAN is 12. This one was
 *       included because it looked like it might be vacuous (a dark theme could hold it by
 *       accident) and it turned out to be the sharpest number here: the network's typical
 *       palette offers twelve readable inks and this one offers two. That is not austerity for
 *       its own sake — it is what R1 costs.
 *   C4  0 of this build's 12 hexes appears anywhere in the network's 1663.
 * Per the 96th's lesson, a rate is reported for every invariant rather than only for the ones
 * that pass, so a claim that holds by chance cannot be quoted as novelty.
 * SO THE INVERSION IS THE HOUSE STYLE: THE GREYS HOLD THE TEXT AND THE GROUND HOLDS THE
 * COLOUR. cizgi/üfüq/şimşək/ayaz may be ink, rule, icon or a control whose label is qrafit
 * itself — they may never be a card you write on. Every card on this site is grey (or the one
 * blue dial at 2,00×), which is the opposite of the usual dark-theme habit of a tinted panel
 * under white text.
 *
 * THE RADIUS LADDER — QÖVS-RADİUSU. radius = 12/m px = (12-k) px, so the rungs step by
 * exactly 1px: duman 11 · bulud 10 · tüstü 9 · külək 8 · şeh 7 · əqrəb 6 · buz 5 · cizgi 4 ·
 * üfüq 3 · şimşək 2 · ayaz 1. The fainter the surface the rounder it is; the higher the
 * multiplier the sharper the corner. The money control is at 6,00× and is therefore 2px —
 * nearly square — while the atmosphere behind it is soft.
 *
 * FOUR RULES THAT BIND WHILE EDITING THIS FILE.
 *   (a) NO RULE HERE MAY NAME A TOKEN. Every declaration addresses a semantic var; the twelve
 *       hexes appear once each, in :root, and nowhere else in the theme. lint_rav.py sweeps
 *       the WHOLE theme (including PHP strings, where the 96th's donor palette hid inside
 *       var() fallbacks) for any hex outside this set.
 *   (b) TEXT HIERARCHY IS NOT MADE OF COLOUR — there is no third readable ink. Headings and
 *       body take the SAME ayaz and are separated by SIZE, WEIGHT and FACE: the headings are
 *       Crimson Pro, a serif, because a heading here states a published RULE, and the prose
 *       is Gentium Book Plus. Grading headings by colour is not available on this palette.
 *   (c) FIGURES ARE A DIFFERENT VOICE, NOT A DIFFERENT COLOUR. Jura — squarish, uniform-
 *       stroke, centre-dotted zero — sets every multiplier, amount, limit and date, because
 *       those are READOUTS. It never sets a word.
 *   (d) NO GRADIENTS, NO rgba() WASHES. A wash between two rungs lands on a contrast that is
 *       not on the ladder, which falsifies R1 in a form a hex sweep cannot see (the 79th's
 *       recorded trap). Every surface here is flat.
 *
 * @package royale-aviator-az-net
 */

:root {
  --rav-ground: #0B0D11;   /* qrafit · 1,00× */
  --rav-haze: #181818;   /* duman · 1,09× */
  --rav-plate: #202020;   /* bulud · 1,20× */
  --rav-well: #292929;   /* tüstü · 1,33× */
  --rav-raise: #313131;   /* külək · 1,50× */
  --rav-band: #3A3A3A;   /* şeh · 1,71× */
  --rav-dial: #294471;   /* əqrəb · 2,00× */
  --rav-edge: #505050;   /* buz · 2,40× */
  --rav-line: #0B57CB;   /* cizgi · 3,00× */
  --rav-axis: #0D69F2;   /* üfüq · 4,00× */
  --rav-rule: #7190C3;   /* şimşək · 6,00× */
  --rav-second: #7190C3;   /* şimşək · 6,00× */
  --rav-quiet: #7190C3;   /* şimşək · 6,00× */
  --rav-accent: #7190C3;   /* şimşək · 6,00× */
  --rav-head: #B0CDFA;   /* ayaz · 12,00× */
  --rav-ink: #B0CDFA;   /* ayaz · 12,00× */

  /* QÖVS-RADİUSU: radius = 12/m px = (12-k) px — one px per rung. */
  --rav-r-ground: 12px;
  --rav-r-haze: 11px;
  --rav-r-plate: 10px;
  --rav-r-well: 9px;
  --rav-r-raise: 8px;
  --rav-r-band: 7px;
  --rav-r-dial: 6px;
  --rav-r-edge: 5px;
  --rav-r-line: 4px;
  --rav-r-axis: 3px;
  --rav-r-rule: 2px;
  --rav-r-second: 2px;
  --rav-r-quiet: 2px;
  --rav-r-accent: 2px;
  --rav-r-head: 1px;
  --rav-r-ink: 1px;

  --rav-measure: 704px;
  --rav-shell: 1160px;
  --rav-radius: var(--rav-r-rule);
  --rav-tap: 44px;
  --rav-focus: var(--rav-ink);
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}

body {
  background: var(--rav-ground);
  color: var(--rav-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.rav-modal-open { overflow: hidden; }

/* ---------- skip link + focus ---------- */
.rav-skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--rav-rule); color: var(--rav-ground);
  padding: 12px 18px; font-weight: 600; text-decoration: none;
}
.rav-skip-link:focus { left: 8px; top: 8px; }

:where(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--rav-rule);
  outline-offset: 2px;
  border-radius: 1px;
}

/* ---------- shell ---------- */
.rav-main { display: block; }
.rav-sec {
  max-width: var(--rav-measure);
  margin-inline: auto;
  padding-block: var(--wp--preset--spacing--xl);
}
.rav-band {
  background: var(--rav-plate);
  border-block: 1px solid var(--rav-line);
}
/* A section inside a full-bleed band must take the SHELL and hand the MEASURE to its
   children, with margin-inline:auto on them - widening the parent without that left-aligns
   every paragraph in the band (the 95th's recorded layout defect). */
.rav-band > .rav-sec { max-width: var(--rav-shell); }
.rav-band > .rav-sec > * { max-width: var(--rav-measure); margin-inline: auto; }
.rav-band > .rav-sec > .rav-sec--wide,
.rav-band > .rav-sec > .rav-tablewrap,
.rav-band > .rav-sec > .rav-qayda { max-width: none; }

.rav-prose > * + * { margin-top: var(--wp--preset--spacing--s); }
.rav-prose p { max-width: 68ch; }

/* ---------- eyebrow / lede ---------- */
.rav-eyebrow {
  font-family: var(--wp--preset--font-family--figure);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 600;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: var(--rav-quiet);
  margin: 0 0 10px;
}
.rav-lede {
  font-size: 19.5px;
  line-height: 1.56;
  color: var(--rav-second);
  max-width: 62ch;
}

/* ---------- the balance rule: mil, and it is structure ---------- */
.rav-rule {
  border: 0;
  height: 2px;
  background: var(--rav-rule);
  margin: var(--wp--preset--spacing--m) 0;
  max-width: 96px;
}
h2 { padding-top: var(--wp--preset--spacing--xs); }
h2::before {
  content: "";
  display: block;
  width: 64px; height: 2px;
  background: var(--rav-rule);
  margin-bottom: 14px;
}

/* ---------- hero ---------- */
.rav-hero {
  padding-block: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--l);
  max-width: var(--rav-measure);
  margin-inline: auto;
}
.rav-hero h1 { margin: 0 0 var(--wp--preset--spacing--s); }

/* ---------- plates ---------- */
.rav-plate {
  background: var(--rav-plate);
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  padding: var(--wp--preset--spacing--m);
}
.rav-plate--quiet { background: transparent; border-style: dashed; }
/* The DEEP well is the one surface with a real cost: on it only ink (5,00), head (4,92) and
   accent (4,78) clear 4,5 : 1. second (4,41) and rule (3,16) are large-text only, and axis
   (2,72) and quiet (2,25) are forbidden outright. Measured in palette_hsb.py R6, and
   lint_hsb.py fails a well that carries a forbidden ink. */
.rav-well {
  background: var(--rav-well);
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  padding: var(--wp--preset--spacing--m);
  color: var(--rav-ink);
}
.rav-well .rav-quiet, .rav-well .rav-axis { color: var(--rav-ink); }

/* ---------- buttons ---------- */
.rav-btn, .rav-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: var(--rav-tap);
  padding: 14px 28px;
  font-family: var(--wp--preset--font-family--figure);
  font-size: 16px; font-weight: 600; letter-spacing: .005em;
  border-radius: var(--rav-radius);
  border: 2px solid var(--rav-rule);
  background: var(--rav-rule);
  color: var(--rav-ground);
  text-decoration: none;
  cursor: pointer;
  transition: background .16s ease, color .16s ease;
}
.rav-btn:hover, .rav-cta:hover { background: var(--rav-second); border-color: var(--rav-second); color: var(--rav-ground); }
.rav-btn-outline {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: var(--rav-tap); padding: 13px 24px;
  font-family: var(--wp--preset--font-family--figure);
  font-size: 15.5px; font-weight: 600;
  border: 1px solid var(--rav-accent);
  border-radius: var(--rav-radius);
  background: transparent;
  color: var(--rav-accent);
  text-decoration: none;
  cursor: pointer;
}
.rav-btn-outline:hover { border-color: var(--rav-head); color: var(--rav-head); }

/* ---------- trust bar ---------- */
.rav-trust {
  display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center;
  font-family: var(--wp--preset--font-family--figure);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  color: var(--rav-second);
  margin: 0; padding: 0; list-style: none;
}
.rav-trust li { display: flex; align-items: center; gap: 8px; }
.rav-trust .rav-num { color: var(--rav-head); font-weight: 600; }

/* ---------- TOC ---------- */
.rav-toc {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 0; padding: 0; list-style: none;
}
.rav-toc a {
  display: inline-flex; align-items: center;
  min-height: 38px; padding: 8px 15px;
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  font-family: var(--wp--preset--font-family--figure);
  font-size: 14.5px; font-weight: 500;
  color: var(--rav-accent);
  text-decoration: none;
}
.rav-toc a:hover { border-color: var(--rav-accent); color: var(--rav-head); }

/* ---------- THE LEDGER ---------- */
.rav-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.rav-qayda {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--wp--preset--font-size--medium);
  min-width: 620px;
}
.rav-qayda caption {
  caption-side: top;
  text-align: left;
  color: var(--rav-quiet);
  font-size: var(--wp--preset--font-size--small);
  padding-bottom: 12px;
  /* a caption shrink-wraps to the narrowest column unless it is told not to (87th) */
  width: 100%;
}
.rav-qayda th, .rav-qayda td {
  text-align: left;
  padding: 13px 14px;
  border-bottom: 1px solid var(--rav-line);
  vertical-align: top;
}
.rav-qayda thead th {
  font-family: var(--wp--preset--font-family--figure);
  font-size: 13.5px; font-weight: 600;
  letter-spacing: .07em; text-transform: uppercase;
  color: var(--rav-quiet);
  border-bottom: 2px solid var(--rav-rule);   /* the balance rule divides the two sides */
  white-space: nowrap;
}
.rav-qayda td:first-child { color: var(--rav-ink); }
.rav-qayda .rav-num {
  font-family: var(--wp--preset--font-family--figure);
  font-variant-numeric: lining-nums tabular-nums;
  font-weight: 600;
  color: var(--rav-head);
  white-space: nowrap;
}

/* status marks: a WORD plus which side of the rule the mark sits on. Never a hue. */
.rav-tag {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--wp--preset--font-family--figure);
  font-size: 13.5px; font-weight: 600;
  letter-spacing: .05em; text-transform: uppercase;
  white-space: nowrap;
}
.rav-tag::before {
  content: ""; display: block;
  width: 11px; height: 11px;
  border: 2px solid currentColor;
}
/* ALACAQ - a credit: the mark rides ABOVE the row's baseline and is an open square */
.rav-tag--qayda { color: var(--rav-head); }
.rav-tag--qayda::before { border-radius: 0; border-right-color: transparent; }
/* BORC - a debit: the same statement printed on a filled chip, the mark BELOW the baseline */
.rav-tag--pay { color: var(--rav-head); }
.rav-tag--pay::before { background: currentColor; border-radius: 999px; }
/* «—» - unsettled: a bare em dash, no mark at all, because nothing was written */
.rav-tag--yox { color: var(--rav-quiet); letter-spacing: 0; }
.rav-tag--yox::before { display: none; }

.rav-key {
  display: flex; flex-wrap: wrap; gap: 12px 26px;
  margin: 0; padding: 0; list-style: none;
  font-size: var(--wp--preset--font-size--small);
  color: var(--rav-second);
}
.rav-key li { display: flex; align-items: baseline; gap: 9px; }

/* the computed tally */
.rav-sayim {
  display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--m);
  margin: 0; padding: 0;
}
.rav-sayim > div {
  flex: 1 1 180px;
  min-width: 0;               /* a flex item's default min-width:auto breaks narrow cells (91st) */
  border-top: 2px solid var(--rav-rule);
  padding-top: 12px;
}
.rav-sayim dt {
  font-size: var(--wp--preset--font-size--small);
  color: var(--rav-quiet);
  margin: 0 0 6px;
}
.rav-sayim dd {
  margin: 0;
  font-family: var(--wp--preset--font-family--figure);
  font-variant-numeric: lining-nums tabular-nums;
  font-size: 34px; font-weight: 600; line-height: 1;
  color: var(--rav-head);
}
.rav-count {
  font-family: var(--wp--preset--font-family--figure);
  font-variant-numeric: lining-nums tabular-nums;
  font-weight: 600;
  color: var(--rav-head);
}

/* ---------- steps ---------- */
.rav-steps { margin: 0; padding: 0; list-style: none; counter-reset: rhs; }
.rav-step {
  counter-increment: rhs;
  position: relative;
  padding: 0 0 var(--wp--preset--spacing--m) 52px;
  border-left: 1px solid var(--rav-line);
  margin-left: 16px;
}
.rav-step:last-child { border-left-color: transparent; padding-bottom: 0; }
.rav-step::before {
  content: counter(rhs);
  position: absolute; left: -17px; top: 0;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  background: var(--rav-ground);
  border: 2px solid var(--rav-rule);
  border-radius: 999px;
  font-family: var(--wp--preset--font-family--figure);
  font-variant-numeric: lining-nums tabular-nums;
  font-weight: 600; font-size: 15px;
  color: var(--rav-head);
}
.rav-step h3 { margin: 3px 0 8px; }

/* ---------- grids ---------- */
.rav-grid { display: grid; gap: var(--wp--preset--spacing--m); }
.rav-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rav-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- FAQ ---------- */
.rav-faq { border-top: 1px solid var(--rav-line); }
.rav-faq details { border-bottom: 1px solid var(--rav-line); }
.rav-faq summary {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  min-height: var(--rav-tap);
  padding: 16px 0;
  cursor: pointer;
  font-family: var(--wp--preset--font-family--heading);
  font-size: 19px; font-weight: 600;
  color: var(--rav-head);
  list-style: none;
}
.rav-faq summary::-webkit-details-marker { display: none; }
.rav-faq summary::after {
  content: "+";
  font-family: var(--wp--preset--font-family--figure);
  font-size: 22px; font-weight: 500;
  color: var(--rav-quiet);
  flex: 0 0 auto;
}
.rav-faq details[open] summary::after { content: "–"; }
.rav-faq details > div { padding: 0 0 18px; color: var(--rav-second); }
.rav-faq details > div > * + * { margin-top: 12px; }

/* ---------- chips / notes ---------- */
.rav-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.rav-chip {
  display: inline-flex; align-items: center;
  padding: 7px 13px;
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  font-family: var(--wp--preset--font-family--figure);
  font-size: 14px; font-weight: 500;
  color: var(--rav-second);
}
.rav-note {
  border-left: 2px solid var(--rav-rule);
  padding: 4px 0 4px 18px;
  color: var(--rav-second);
  font-size: var(--wp--preset--font-size--medium);
}
.rav-code {
  font-family: var(--wp--preset--font-family--figure);
  font-variant-numeric: lining-nums tabular-nums;
  color: var(--rav-head);
}
.rav-lastmod {
  font-family: var(--wp--preset--font-family--figure);
  font-size: var(--wp--preset--font-size--small);
  color: var(--rav-quiet);
}

/* ---------- the mark ---------- */
.rav-brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; }
.rav-mark { display: block; width: 34px; height: 34px; flex: 0 0 auto; }
.rav-wordmark {
  font-family: var(--wp--preset--font-family--heading);
  font-size: 21px; font-weight: 700; letter-spacing: -.01em;
  color: var(--rav-head);
  white-space: nowrap;
}

/* ---------- header ---------- */
.rav-head {
  position: sticky; top: 0; z-index: 60;
  background: var(--rav-ground);
  border-bottom: 1px solid var(--rav-line);
}
.rav-head > div {
  max-width: var(--rav-shell); margin-inline: auto;
  padding: 12px 18px;
  display: flex; align-items: center; gap: 18px;
}
.rav-nav { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.rav-nav a {
  min-height: 38px; display: inline-flex; align-items: center;
  padding: 8px 12px;
  font-family: var(--wp--preset--font-family--figure);
  font-size: 15px; font-weight: 500;
  color: var(--rav-second);
  text-decoration: none;
}
.rav-nav a:hover { color: var(--rav-head); }

/* ---------- footer ---------- */
.rav-foot {
  border-top: 1px solid var(--rav-line);
  background: var(--rav-plate);
  margin-top: var(--wp--preset--spacing--xxl);
}
.rav-foot > div {
  max-width: var(--rav-shell); margin-inline: auto;
  padding: var(--wp--preset--spacing--xl) 18px var(--wp--preset--spacing--l);
}
.rav-foot h2 { font-size: 19px; margin: 0 0 12px; }
.rav-foot h2::before { display: none; }
.rav-foot p, .rav-foot li { font-size: var(--wp--preset--font-size--small); color: var(--rav-second); }
.rav-foot a { color: var(--rav-accent); }
.rav-payrail { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.rav-pay {
  display: inline-flex; align-items: center;
  padding: 6px 11px;
  border: 1px solid var(--rav-line);
  font-family: var(--wp--preset--font-family--figure);
  font-size: 13px; font-weight: 500;
  color: var(--rav-second);
}

/* ---------- sticky mobile CTA ---------- */
.rav-sticky {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
  display: none;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
  background: var(--rav-plate);
  border-top: 1px solid var(--rav-line);
}
.rav-sticky .rav-cta { width: 100%; }
/* The sticky bar must never be the thing that covers the hero's own CTA at scroll 0 (the
   91st and 92nd both shipped that), so it stays hidden until the page has been scrolled. */
.rav-sticky--yield { display: none !important; }

/* ---------- age gate + cookie ---------- */
.rav-agegate {
  position: fixed; inset: 0; z-index: 120;
  display: grid; place-items: center;
  padding: 20px;
  background: var(--rav-ground);
}
.rav-agegate > div {
  max-width: 460px;
  background: var(--rav-plate);
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  padding: var(--wp--preset--spacing--l);
}
.rav-agegate-title { margin: 0 0 12px; font-size: 27px; }
.rav-agegate-title::before { display: none; }
.rav-agegate-body { color: var(--rav-second); margin: 0 0 var(--wp--preset--spacing--m); }
.rav-agegate .rav-btn, .rav-agegate .rav-btn-outline { width: 100%; margin-top: 10px; }

.rav-cookie {
  position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 110;
  max-width: 560px;
  background: var(--rav-plate);
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  padding: var(--wp--preset--spacing--m);
}
.rav-cookie p { margin: 0 0 14px; font-size: var(--wp--preset--font-size--small); color: var(--rav-second); }
.rav-cookie div { display: flex; flex-wrap: wrap; gap: 10px; }
/* [hidden] must beat an author display rule or a dismissed gate keeps painting while the DOM
   says it is hidden (the 88th's recorded defect). */
[hidden] { display: none !important; }

/* ---------- skeleton ---------- */
.rav-skeleton { background: var(--rav-plate); border-radius: var(--rav-radius); min-height: 1em; }

/* ---------- images ---------- */
.rav-fig { margin: 0; }
.rav-fig img { display: block; width: 100%; height: auto; border-radius: var(--rav-radius); }
.rav-fig figcaption {
  margin-top: 10px;
  font-size: var(--wp--preset--font-size--small);
  color: var(--rav-quiet);
}

/* ---------- crumbs ---------- */
.rav-crumbs {
  font-family: var(--wp--preset--font-family--figure);
  font-size: var(--wp--preset--font-size--small);
  color: var(--rav-quiet);
  padding-top: var(--wp--preset--spacing--m);
  max-width: var(--rav-measure);
  margin-inline: auto;
}
.rav-crumbs a { color: var(--rav-quiet); }
.rav-crumbs a:hover { color: var(--rav-accent); }

/* ---------- breakpoints: 360 / 768 / 1024 / 1440 ---------- */
@media (max-width: 1023px) {
  .rav-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .rav-sec { padding-block: var(--wp--preset--spacing--l); }
  .rav-grid--2, .rav-grid--3 { grid-template-columns: minmax(0, 1fr); }
  .rav-sticky { display: block; }
  .rav-nav { gap: 2px; }
  .rav-nav a { padding: 8px 9px; font-size: 14px; }
  .rav-lede { font-size: 18px; }
  .rav-sayim dd { font-size: 29px; }
  /* the ledger keeps its columns and scrolls inside its own wrapper rather than reflowing,
     because a two-sided register that stacks stops being two-sided */
  .rav-qayda { min-width: 560px; }
  .rav-foot { margin-top: var(--wp--preset--spacing--xl); }
}
@media (max-width: 400px) {
  .rav-wordmark { font-size: 18px; }
  .rav-btn, .rav-cta { padding: 13px 18px; font-size: 15px; }
  .rav-qayda { min-width: 520px; }
}

@media print {
  .rav-head, .rav-sticky, .rav-cookie, .rav-agegate { display: none !important; }
}


/* ============================================================================
   Classes the inherited chrome.php ACTUALLY EMITS.
   The stylesheet above was authored against .rav-nav / .rav-head / .rav-trust; chrome.php
   emits a BEM layer underneath them. Markup with no rules is not a missing nicety, it is a
   broken page, so the two vocabularies are reconciled here rather than in the PHP - the
   chrome's age-gate, cookie and sticky-CTA behaviour is tested and is not worth re-typing.
   ========================================================================= */

.rav-head__in {
  max-width: var(--rav-shell);
  margin-inline: auto;
  padding: 12px 18px;
  display: flex; align-items: center; gap: 16px;
}
.rav-head__cta {
  margin-left: auto;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 40px; padding: 10px 20px;
  background: var(--rav-rule);
  color: var(--rav-ground);
  border: 2px solid var(--rav-rule);
  border-radius: var(--rav-radius);
  font-family: var(--wp--preset--font-family--figure);
  font-size: 15px; font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.rav-head__cta:hover { background: var(--rav-second); border-color: var(--rav-second); color: var(--rav-ground); }

.rav-nav { margin-left: auto; }
.rav-nav__list { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; }
.rav-nav__list a {
  display: inline-flex; align-items: center;
  min-height: 40px; padding: 8px 12px;
  font-family: var(--wp--preset--font-family--figure);
  font-size: 15px; font-weight: 500;
  color: var(--rav-second);
  text-decoration: none;
}
.rav-nav__list a:hover { color: var(--rav-head); }
.rav-nav__list a[aria-current] { color: var(--rav-head); box-shadow: inset 0 -2px 0 0 var(--rav-rule); }
.rav-nav__mobile { display: none; }
.rav-nav__mobile > summary {
  display: inline-flex; align-items: center; gap: 9px;
  min-height: var(--rav-tap); padding: 10px 14px;
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  font-family: var(--wp--preset--font-family--figure);
  font-size: 15px; font-weight: 600;
  color: var(--rav-accent);
  cursor: pointer; list-style: none;
}
.rav-nav__mobile > summary::-webkit-details-marker { display: none; }
.rav-nav__bars {
  width: 16px; height: 2px;
  background: currentColor;
  box-shadow: 0 5px 0 0 currentColor, 0 -5px 0 0 currentColor;
  flex: 0 0 auto;
}
.rav-nav__panel {
  position: absolute; left: 12px; right: 12px; z-index: 70;
  margin: 10px 0 0; padding: 8px;
  background: var(--rav-plate);
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-radius);
  list-style: none;
}
.rav-nav__panel a {
  display: block;
  min-height: var(--rav-tap);
  padding: 12px 14px;
  font-size: 15.5px;
  color: var(--rav-accent);
  text-decoration: none;
}
.rav-nav__panel a:hover { color: var(--rav-head); }

.rav-trust { background: var(--rav-plate); border-bottom: 1px solid var(--rav-line); }
.rav-trust__in {
  max-width: var(--rav-shell);
  margin-inline: auto;
  padding: 11px 18px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px;
  font-family: var(--wp--preset--font-family--figure);
  font-size: 14px; font-weight: 500;
  color: var(--rav-second);
}
.rav-trust__in strong { color: var(--rav-head); font-weight: 600; }
.rav-trust__in em { color: var(--rav-quiet); font-style: normal; }
/* The lead is the ledger's headline number. It is LARGE, so it may take the axis ink; the
   axis clears 5,67 : 1 on this plate, well over the body floor. */
/* The headline figure CANNOT be üfüq, and this is R6/R3 refusing a choice rather than a
   preference. üfüq (4,00x) is the most saturated colour on the site and the obvious place to
   put the number the whole page turns on - but 4,00 : 1 against the bulud bar is 3,33 : 1, and
   21px is not «large text» (that starts at 24px, or 18,66px bold). So the loudest colour is
   not allowed to state the finding, and the finding takes ayaz at 10,00 : 1 like every other
   fact here. Measured by probe_rav.js at four viewports; caught nowhere else. */
.rav-trust__lead {
  font-family: var(--wp--preset--font-family--figure);
  font-variant-numeric: lining-nums tabular-nums;
  font-size: 21px; font-weight: 600; line-height: 1;
  color: var(--rav-ink);
  padding-right: 14px;
  border-right: 2px solid var(--rav-rule);
}

.rav-foot__in { display: block; }
.rav-foot__in--pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--wp--preset--spacing--l);
}
.rav-foot__jump { margin: 14px 0 0; padding: 0; list-style: none; }
.rav-foot__jump li + li { margin-top: 7px; }
.rav-foot__link { color: var(--rav-accent); }
.rav-foot ul:not(.rav-foot__jump):not(.rav-payrail) { margin: 0; padding-left: 1.15em; }
.rav-foot ul:not(.rav-foot__jump):not(.rav-payrail) li + li { margin-top: 7px; }

/* figures, wherever they appear in inherited markup */
.rav-fig, .rav-num {
  font-family: var(--wp--preset--font-family--figure);
  font-variant-numeric: lining-nums tabular-nums;
  font-weight: 600;
}
.rav-fig { color: inherit; }

@media (max-width: 860px) {
  .rav-nav__list { display: none; }
  .rav-nav__mobile { display: block; position: relative; }
  .rav-head__cta { display: none; }
}
@media (max-width: 767px) {
  .rav-foot__in--pair { grid-template-columns: minmax(0, 1fr); }
  .rav-trust__lead { font-size: 18px; }
}

.rav-sayim__nb {
  margin-top: 8px;
  font-size: var(--wp--preset--font-size--small);
  color: var(--rav-quiet);
  line-height: 1.45;
}


/* ------------------------------------------------------------------------- *
 * What this row adds. Everything below addresses a ROLE and a RADIUS RUNG:
 * radius = 12/m px, so a surface's corner says which multiplier it stands at.
 * ------------------------------------------------------------------------- */

/* The section-group header inside the table. It is a rowgroup heading, so it is a th and
   carries the one chromatic SURFACE the law allows (əqrəb, 2,00x) - ayaz on it is 6,00 : 1
   by R7. Every other card on this site is grey, which is the inversion this palette forces. */
.rav-qayda__axis > th {
  background: var(--rav-dial);
  color: var(--rav-head);
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--sub);
  font-weight: 700;
  letter-spacing: -0.01em;
  border-bottom: 2px solid var(--rav-rule);
  border-radius: var(--rav-r-dial) var(--rav-r-dial) 0 0;
}

/* The status key. A dl, so each mark and its definition are actually associated. */
.rav-key { display: grid; gap: 14px 22px; margin: 18px 0 0; padding: 0; }
.rav-key > div {
  display: grid; grid-template-columns: 132px 1fr; gap: 4px 16px;
  align-items: baseline;
  border-top: 1px solid var(--rav-line);
  padding-top: 12px;
}
.rav-key dt { margin: 0; }
.rav-key dd {
  margin: 0;
  color: var(--rav-second);
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.5;
}
@media (max-width: 620px) {
  .rav-key > div { grid-template-columns: 1fr; }
}

/* The ladder table. The five WHOLE multipliers are the major graticule - the same five the
   mark draws thicker - so their rows carry the heavier rule. Not a colour: a weight. */
.rav-nerdivan {
  width: 100%; border-collapse: collapse;
  font-size: var(--wp--preset--font-size--medium);
  min-width: 560px;
}
.rav-nerdivan caption {
  caption-side: top; text-align: left; width: 100%;
  color: var(--rav-quiet);
  font-size: var(--wp--preset--font-size--small);
  padding-bottom: 12px;
}
.rav-nerdivan th, .rav-nerdivan td {
  text-align: left; padding: 10px 14px; vertical-align: baseline;
  border-bottom: 1px solid var(--rav-line);
}
.rav-nerdivan thead th {
  font-family: var(--wp--preset--font-family--figure);
  font-size: 13.5px; font-weight: 600;
  letter-spacing: .07em; text-transform: uppercase;
  color: var(--rav-quiet);
  border-bottom: 2px solid var(--rav-rule);
}
.rav-nerdivan tbody th { color: var(--rav-ink); white-space: nowrap; }
.rav-nerdivan td { color: var(--rav-second); }
.rav-nerdivan__whole > * { border-bottom-width: 2px; }
.rav-nerdivan__whole th .rav-fig { color: var(--rav-head); }
.rav-nerdivan abbr {
  font-family: var(--wp--preset--font-family--figure);
  font-size: 12px; letter-spacing: .06em; text-transform: uppercase;
  color: var(--rav-quiet); text-decoration: none; border-bottom: 1px dotted currentColor;
}
@media (max-width: 700px) { .rav-nerdivan { min-width: 460px; } }

/* Payment channels. Names, not logos - a logo is a claim about a partnership. */
.rav-odenis {
  display: flex; flex-wrap: wrap; gap: 9px;
  margin: 0 0 14px; padding: 0; list-style: none;
}
.rav-odenis li {
  font-family: var(--wp--preset--font-family--figure);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500; letter-spacing: .02em;
  /* ayaz, not simsek: on the kulek fill (1,50x) simsek gives 6,00/1,50 = 4,00 : 1, which is
     legal for large text and this label is 14,5px. R7 makes that arithmetic, not a judgement -
     12,00/1,50 = 8,00 : 1 is the only readable ink for a chip on a raised surface. */
  color: var(--rav-ink);
  background: var(--rav-raise);
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-r-raise);
  padding: 8px 13px;
  min-height: 36px; display: inline-flex; align-items: center;
}

/* The hero's field is the FAINTEST rung (duman, 12/11x): by R3 it cannot be told from the
   page, which is exactly the point - a 1,09x win is invisible too. It is separated from the
   page by its radius (11px, the roundest rung) and by a cizgi hairline, never by fill. */
.rav-hero {
  background: var(--rav-haze);
  border: 1px solid var(--rav-line);
  border-radius: var(--rav-r-haze);
}
.rav-plate  { border-radius: var(--rav-r-plate); }
.rav-well   { border-radius: var(--rav-r-well); }
.rav-cta    { border-radius: var(--rav-r-rule); }
.rav-chip   { border-radius: var(--rav-r-edge); }

/* The mark, enlarged, as the section's own illustration. Its aspect is 1:1 and its size is
   fixed in both axes so it cannot shift layout while the fonts load (anti-CLS). */
.rav-markfig {
  display: flex; gap: var(--wp--preset--spacing--m);
  align-items: flex-start; flex-wrap: wrap;
  border-top: 2px solid var(--rav-rule);
  padding-top: var(--wp--preset--spacing--m);
}
.rav-markfig .rav-mark { width: 168px; height: 168px; flex: 0 0 auto; }
.rav-markfig figcaption {
  flex: 1 1 300px; min-width: 0;
  color: var(--rav-second);
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.55;
}
@media (max-width: 520px) {
  .rav-markfig .rav-mark { width: 128px; height: 128px; }
}