/* krikya-tokens.css · krikya.ing (en-BD) · design spec 14.10.2026 (_design/HOME_SPEC.md)
   Copy over build/assets/qk-tokens.css (it is linked LAST). Every engine name from the temporary file is kept; new names are marked ★.
   Direction: light base, operator green in the header, accents and the offer board, operator orange ONLY on action buttons.
   Contrast (WCAG 2.x, computed): see HOME_SPEC.md, section «б». Fonts: files in _design/type/ → build/assets/type/. */

/* ───────── fonts: Readex Pro (operator's own face, used on none of our sites) + a one-glyph fallback for ৳ ───────── */
/* Both Readex subsets carry the SAME weight range 160 700 (Chrome unicode-range weight trap). Readex has no U+09F3 (৳):
   that glyph alone comes from "KY Taka" = Noto Sans Bengali, variable 100–900, subset to U+09F3 + space (4 KB). */
@font-face { font-family: "Readex Pro"; font-style: normal; font-weight: 160 700; font-display: swap;
  src: url(/assets/type/readex-pro-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Readex Pro"; font-style: normal; font-weight: 160 700; font-display: swap;
  src: url(/assets/type/readex-pro-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "KY Taka"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/type/ky-taka.woff2) format("woff2"); unicode-range: U+09F3; }

:root {
  /* surfaces (light) */
  --qk-night: #F3F6F4;          /* page background, band A */
  --qk-night-2: #FFFFFF;        /* band B */
  --qk-night-rgb: 243, 246, 244;
  --qk-well: #E6EDE9;           /* recessed: slider track, table cells */
  --qk-panel: #FFFFFF;          /* card (always with --qk-line border on white bands) */
  --qk-raise: #EAF3EE;          /* raised card, hover, table head */
  --qk-dusk: #E3F1E9;           /* deep band (calculator, CTA strip): pale pitch green */
  --qk-ember: #FFF3E6;          /* tip panel (B06) */
  --qk-ember-line: #F2C291;
  --qk-c-wine: #F4ECEF;

  /* borders */
  --qk-line: #D5E0D9;
  --qk-line-hi: #B7C9BE;
  --qk-line-ctl: #7A8F83;       /* controls: 3.2 on --qk-night, 3.5 on white (not on --qk-dusk: 2.96) */

  /* text */
  --qk-ink: #13241B;            /* 14.9 on night · 16.2 on white · 13.9 on dusk */
  --qk-ink-2: #33473C;          /* 9.2 · 10.0 · 8.6 */
  --qk-ink-3: #4F6357;          /* 5.9 · 6.5 · 5.5 */
  --qk-ink-4: #5E7266;          /* 4.7 · 5.2 — not on dusk */
  --qk-link: #18704B;           /* 5.6 · 6.1 · 5.2; always underlined */

  /* accent 1 = operator green: fills, chips, progress, step numbers (white text on it) */
  --qk-red: #23805A;            /* white on it 4.88 */
  --qk-red-hi: #2F9468;
  --qk-red-deep: #17613F;       /* white 7.5 */
  --qk-red-rgb: 35, 128, 90;
  --qk-royal: #23805A;
  --qk-royal-rgb: 35, 128, 90;
  --qk-ticket-a: #0F4D36;       /* offer board gradient, top-left */
  --qk-ticket-b: #1C6B4A;       /* offer board gradient, bottom-right */

  /* accent 2 = operator orange: ONLY action buttons (/go/ fill, header «Play now») */
  --qk-flame: #F06000;          /* white label 3.29 → labels are 19px/700 = WCAG «large text», AA ≥ 3 */
  --qk-flame-hi: #FF7A1F;       /* gradient top */
  --qk-flame-deep: #C24A00;     /* hover/pressed; white 4.92 */
  --qk-flame-rgb: 240, 96, 0;
  --qk-on-flame: #FFFFFF;
  --qk-gold: #0E5A3B;           /* amounts and figures on light surfaces (engine used it as «gold text»): 7.6 on night, 8.3 on white */

  /* ★ new names */
  --qk-on-royal: #FFFFFF;       /* text on --qk-royal / --qk-red / --qk-ok fills (replaces color:var(--qk-ink) there) */
  --qk-accent-ink: #17613F;     /* accent TEXT (eyebrows, highlighted words, menu hover): replaces color:var(--qk-flame) — 6.9 on night, 7.5 on white */
  --qk-board-ink: #FFFFFF;      /* text on the offer board: 9.8 on --qk-ticket-a, 6.5 on --qk-ticket-b */
  --qk-board-ink-2: #CFE7DA;    /* secondary text on the board: 7.5 / 4.95 */
  --qk-board-num: #FFD34D;      /* percentages and caps on the board: 6.9 / 4.5 (bold ≥ 26px) */
  --qk-board-line: rgba(255, 255, 255, 0.18);
  --qk-head-a: #26845B;         /* header gradient top (operator header #67BD95→#3F9671, deepened for white menu text) */
  --qk-head-b: #1E7350;         /* header gradient bottom; white text ≥ 4.6 at every point of the gradient (top 4.6, bottom 5.8) */
  --qk-head-ink: #FFFFFF;
  --qk-pitch-soft: #DCEFE4;     /* pitch oval behind the hero art */
  --qk-pitch-line: #FFFFFF;     /* the crease ring inside the oval */
  --qk-foot: #0F3B2C;           /* footer background (the white operator logo needs a dark surface) */
  --qk-foot-ink: #E6F2EB;       /* 10.9 on --qk-foot */
  --qk-foot-ink-2: #B5CFC1;     /* 7.5 on --qk-foot */
  --qk-wicket: #23805A;         /* the three-stump mark before every eyebrow */

  /* states */
  --qk-ok: #1E7B45;             /* white 5.3 */
  --qk-ok-hi: #1B7A3E;          /* as text: 5.0 on night, 5.4 on white */
  --qk-alert: #C62828;          /* text: 5.2 on night, 5.6 on white */
  --qk-amber: #8A5A00;          /* text: 5.5 on night, 5.9 on white */
  --qk-focus: #0F4D36;          /* focus ring 2px + offset 2px (not orange: orange is for buttons only) */

  /* categories (fills, white text) */
  --qk-cat-slot: #A61E55;       /* 7.2 */
  --qk-cat-sport: #1F5FBF;      /* 6.1 */
  --qk-cat-special: #6A3BC9;    /* 6.8 */
  --qk-cat-vip: #8A6100;        /* 5.5 */
  --qk-cat-new: #23805A;        /* 4.9 */

  /* ranks and colour marks (VIP cards; on light) */
  --qk-c-bronze: #B86A2B;
  --qk-c-silver: #6F7F88;
  --qk-c-cyan: #0E7C86;
  --qk-c-blue: #2A63C9;
  --qk-c-violet: #6A4BC4;

  /* fonts */
  --qk-display: "Readex Pro", "KY Taka", "Segoe UI", Roboto, Arial, sans-serif;
  --qk-text: "Readex Pro", "KY Taka", "Segoe UI", Roboto, Arial, sans-serif;
  --qk-num: "Readex Pro", "KY Taka", "Segoe UI", Roboto, Arial, sans-serif;   /* with font-variant-numeric: tabular-nums */

  /* sizes ≥ 900 px (phone values below). Readex is wide: no negative letter-spacing anywhere. */
  --qk-fs-h1: 38px;   --qk-lh-h1: 1.18;
  --qk-fs-h2: 30px;   --qk-lh-h2: 1.22;
  --qk-fs-h3: 20px;   --qk-lh-h3: 1.35;
  --qk-fs-lead: 18px; --qk-lh-lead: 1.55;
  --qk-fs-body: 17px; --qk-lh-body: 1.65;
  --qk-fs-small: 14px; --qk-lh-small: 1.5;
  --qk-fs-tag: 13px;  --qk-lh-tag: 1.4;
  --qk-fs-btn: 19px;  --qk-lh-btn: 1.2;      /* never below 19px: see --qk-flame */
  --qk-fs-num: 34px;  --qk-lh-num: 1.1;
  --qk-btn-h: 52px;

  /* radii: squarer than our other sites (operator buttons are near-square) */
  --qk-r-pill: 8px;             /* buttons, inputs */
  --qk-r-card: 12px;
  --qk-r-tile: 10px;
  --qk-r-tag: 4px;              /* chips, tags */
  --qk-r-ticket: 16px;          /* offer board */
  --qk-r-round: 999px;          /* avatar, eyebrow pill, dots */

  /* shadows (light, green-tinted; no 3px «rib» under buttons) */
  --qk-sh-card: 0 1px 2px rgba(15, 59, 44, 0.06), 0 8px 24px -16px rgba(15, 59, 44, 0.25);
  --qk-sh-raise: 0 14px 36px -18px rgba(15, 59, 44, 0.35);
  --qk-sh-ticket: 0 22px 48px -24px rgba(15, 77, 54, 0.55);
  --qk-sh-btn: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 6px 14px -8px rgba(240, 96, 0, 0.7);
  --qk-sh-btn-press: inset 0 1px 0 rgba(0, 0, 0, 0.08);

  /* grid and spacing */
  --qk-wrap: 1160px;
  --qk-gutter: 24px;
  --qk-col-gap: 32px;
  --qk-band-y: 64px;
  --qk-s1: 4px; --qk-s2: 8px; --qk-s3: 12px; --qk-s4: 16px; --qk-s5: 24px; --qk-s6: 32px; --qk-s7: 48px; --qk-s8: 64px;
  --qk-head-h: 64px;
}

@media (max-width: 899px) {
  :root {
    --qk-fs-h1: 26px;   --qk-lh-h1: 1.2;
    --qk-fs-h2: 23px;   --qk-lh-h2: 1.25;
    --qk-fs-h3: 18px;   --qk-lh-h3: 1.35;
    --qk-fs-lead: 16px; --qk-lh-lead: 1.5;
    --qk-fs-body: 16px; --qk-lh-body: 1.6;
    --qk-fs-small: 13px;
    --qk-fs-tag: 12.5px;
    --qk-fs-btn: 19px;
    --qk-fs-num: 26px;
    --qk-btn-h: 48px;
    --qk-gutter: 16px;
    --qk-band-y: 40px;
    --qk-r-ticket: 14px;
    --qk-head-h: 56px;
  }
}

/* ───────── light-theme corrections the variables alone cannot do (HOME_SPEC «ж»; selectors of this fork) ───────── */
html, body { background: var(--qk-night); color: var(--qk-ink); font-family: var(--qk-text); }
.qk-6qmip { font-size: var(--qk-fs-h2); line-height: var(--qk-lh-h2); font-weight: 700; letter-spacing: 0; color: var(--qk-ink); }   /* H2 of every band */
.qk-uox1a { font-size: var(--qk-fs-body); line-height: var(--qk-lh-body); color: var(--qk-ink-2); max-width: 760px; }                   /* band intro */
.qk-prdnu, .qk-prdnu:not(.dl-sash) { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px 4px 10px; border-radius: var(--qk-r-round);
  background: var(--qk-raise); color: var(--qk-accent-ink); font: 600 13px/1.4 var(--qk-text); letter-spacing: 0.02em; text-transform: none; }
.qk-prdnu::before { content: ""; width: 10px; height: 12px; flex: 0 0 10px;                                                               /* three stumps */
  background: linear-gradient(90deg, var(--qk-wicket) 0 2px, transparent 2px 4px, var(--qk-wicket) 4px 6px, transparent 6px 8px, var(--qk-wicket) 8px 10px)}
.qk-1dsfx { background: var(--qk-night); }                                                                                               /* hero band: the pitch oval is drawn by the hero itself */
:focus-visible { outline: 2px solid var(--qk-focus); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}