/* ============================================================================
   ivybetde.de — redesign layer (preview)
   Loads AFTER /css/style.css. Changes composition, typography and atmosphere.
   Touches no markup, no text, no meta, no JSON-LD, no href / data-link.
   Hue: 100deg (yellow-green "ivy") — single chromatic tone, everything else neutral.
   ========================================================================= */

/* --- 1. Fonts, self-hosted (no external host) ---------------------------- */
@font-face{font-family:'Anybody';font-style:normal;font-weight:800;font-stretch:110%;font-display:swap;
  src:url(/fonts/anybody-800-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:'Anybody';font-style:normal;font-weight:800;font-stretch:110%;font-display:swap;
  src:url(/fonts/anybody-800-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-stretch:100%;font-display:swap;
  src:url(/fonts/archivo-var-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:'Archivo';font-style:normal;font-weight:100 900;font-stretch:100%;font-display:swap;
  src:url(/fonts/archivo-var-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* --- 2. Tokens ----------------------------------------------------------- */
:root{
  --ivy-h:100;
  --acid:hsl(100 96% 56%);
  --acid-hi:hsl(100 96% 72%);
  --acid-mid:hsl(100 62% 38%);
  --acid-dim:hsl(100 44% 17%);
  --acid-veil:hsl(100 96% 56% / .14);
  --acid-line:hsl(100 60% 46% / .28);

  --ink-900:hsl(100 14% 5%);
  --ink-850:hsl(100 13% 7%);
  --ink-800:hsl(100 12% 9%);
  --ink-700:hsl(100 10% 13%);
  --ink-600:hsl(100 9% 18%);
  --line:hsl(100 12% 20%);
  --grid-line:hsl(100 22% 12%);

  --fg:hsl(100 10% 97%);
  --fg-2:hsl(100 7% 74%);
  --fg-3:hsl(100 6% 52%);

  --display:'Anybody',ui-sans-serif,sans-serif;
  --body:'Archivo',ui-sans-serif,sans-serif;

  --hdr-h:120px;
  --rail:264px;

  /* remap of the old token set — re-skins every legacy rule at once */
  --ivybe-primary:var(--acid);
  --ivybe-primary-light:var(--acid-hi);
  --ivybe-primary-dark:var(--acid-mid);
  --ivybe-primary-alpha-20:var(--acid-veil);
  --ivybe-accent:var(--acid-mid);          /* was indigo #6366f1 — second hue removed */
  --ivybe-bg-dark:var(--ink-900);
  --ivybe-bg-light:var(--ink-850);
  --ivybe-bg-card:var(--ink-800);
  --ivybe-bg-card-hover:var(--ink-700);
  --ivybe-text-primary:var(--fg);
  --ivybe-text-secondary:var(--fg-2);
  --ivybe-text-muted:var(--fg-3);
  --ivybe-success:var(--acid);
  --ivybe-success-dark:var(--acid-mid);
  --ivybe-warning:var(--fg-2);             /* status colours go achromatic on purpose */
  --ivybe-danger:var(--fg-3);
  --ivybe-gradient-primary:linear-gradient(135deg,var(--acid),var(--acid-mid));
  --ivybe-gradient-dark:linear-gradient(180deg,var(--ink-850),var(--ink-900));
  --ivybe-radius-sm:0px;
  --ivybe-radius:0px;
  --ivybe-radius-lg:0px;
  --ivybe-font-heading:var(--display);
  --ivybe-font-body:var(--body);
}

/* --- 3. Ground ----------------------------------------------------------- */
body{
  /* legacy overflow-x:hidden turned <body> into a scroll container, which silently
     disabled every position:sticky on the page (header, rail, section headings).
     clip guards the same horizontal overflow without creating a scrollport. */
  overflow-x:clip!important;overflow-y:visible!important; /* beats legacy body{overflow-x:hidden!important} that killed position:sticky */
  font-family:var(--body);
  font-size:17px;
  line-height:1.62;
  background:var(--ink-900);
  color:var(--fg);
  -webkit-font-smoothing:antialiased;
}
main.bcd-ivybe-article{
  /* the legacy tail forces overflow:hidden at high priority; clip keeps the horizontal guard
     but lets the hero band bleed upward under the sticky header */
  overflow-x:clip!important;overflow-y:visible!important; /* beats legacy main{overflow:hidden!important}; keeps the horizontal guard */
  display:flex;
  flex-direction:column;
  counter-reset:ivy-sec;
  background-color:var(--ink-900);
  background-image:
    repeating-linear-gradient(to right,var(--grid-line) 0 1px,transparent 1px 96px),
    repeating-linear-gradient(to bottom,var(--grid-line) 0 1px,transparent 1px 96px);
  background-attachment:fixed;
}
::selection{background:var(--acid);color:var(--ink-900);}

/* order: hero -> H1 + lead -> game showcase -> screenshot -> body blocks */
main.bcd-ivybe-article > .aaa-ivybe-lead{order:1;}
main.bcd-ivybe-article > div.fbb-ivybe-wrap:nth-of-type(1){order:2;}
main.bcd-ivybe-article > .acd-ivybe-games-block{order:3;}
main.bcd-ivybe-article > div.fbb-ivybe-wrap:nth-of-type(2){order:4;}
main.bcd-ivybe-article > .fdd-ivybe-body-block{order:5;counter-increment:ivy-sec;}

/* --- 4. Header ----------------------------------------------------------- */
.dac-ivybe-top{
  height:var(--hdr-h);
  padding:0 32px;
  gap:32px;
  background:hsl(100 14% 5% / .78);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid var(--line);
}
.dac-ivybe-top .cdd-mark-ref{display:flex;align-items:center;}
/* the logo image carries a height attribute; only an explicit CSS height overrides it */
.dac-ivybe-top .cdd-mark-ref img{height:100px;width:auto;max-width:none;display:block;}
.fda-top-menu{gap:4px;}
.fda-top-menu a,.fda-top-menu div{
  font-family:var(--display);font-weight:800;font-size:13px;
  letter-spacing:.1em;text-transform:uppercase;
  padding:8px 12px;border-radius:0;color:var(--fg-2);
  border-bottom:2px solid transparent;background:none;
}
.fda-top-menu a:hover,.fda-top-menu div:hover{color:var(--fg);background:none;border-bottom-color:var(--acid-line);}
.fda-top-menu a.active{color:var(--acid);background:none;border-bottom-color:var(--acid);}
.ebc-top-actions{gap:8px;}
.cba-act-login,.bad-act-register{
  font-family:var(--display);font-weight:800;font-size:13px;letter-spacing:.08em;
  text-transform:uppercase;border-radius:0;padding:12px 16px;
}
.cba-act-login{background:none;border:1px solid var(--line);color:var(--fg-2);}
.cba-act-login:hover{border-color:var(--acid);color:var(--acid);background:none;}
.bad-act-register{background:var(--acid);color:var(--ink-900);border:1px solid var(--acid);}
.bad-act-register:hover{background:var(--acid-hi);border-color:var(--acid-hi);color:var(--ink-900);}
.cbc-act-search,.dbe-hamburger{border-radius:0;border:1px solid var(--line);}

/* --- 5. Left icon rail --------------------------------------------------- */
.bdf-sidebar{
  top:var(--hdr-h);height:calc(100vh - var(--hdr-h));
  background:var(--ink-850);border-right:1px solid var(--line);gap:4px;
}
.edb-sidebar-unit{border-radius:0;border-left:2px solid transparent;color:var(--fg-3);}
.edb-sidebar-unit:hover{background:var(--ink-700);color:var(--fg);}
.edb-sidebar-unit.active{background:var(--acid-veil);color:var(--acid);border-left-color:var(--acid);}

/* --- 6. Hero band — edge to edge, bleeding under the header -------------- */
.aaa-ivybe-lead{
  margin-top:calc(-1 * var(--hdr-h));
  padding:0;background:none;text-align:left;position:relative;
}
.aaa-ivybe-lead > .fbb-ivybe-wrap{max-width:none;margin:0;padding:0;}
.dbf-ivybe-lead-gradient-strip{
  margin:0;border-radius:0;
  padding:calc(var(--hdr-h) + 96px) 48px 96px;
  text-align:left;
  background-position:center 30%;
  background-size:cover;
  border-bottom:1px solid var(--acid-line);
}
.dbf-ivybe-lead-gradient-strip::before{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(180deg,hsl(100 14% 5% / .86) 0%,hsl(100 14% 5% / .55) 42%,hsl(100 14% 5% / .94) 100%),
    radial-gradient(120% 90% at 12% 100%,var(--acid-veil) 0%,transparent 62%);
}
.afd-ivybe-strip-body{position:relative;max-width:920px;margin-inline:0;}
.aff-ivybe-strip-cap{
  font-family:var(--display);font-weight:800;font-size:12px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--acid);
}
.faa-ivybe-strip-head{
  font-family:var(--display);font-weight:800;
  font-size:clamp(38px,5.4vw,68px);line-height:.94;letter-spacing:-.03em;
  color:var(--fg);margin-bottom:24px;
}
.cbb-ivybe-strip-text{color:var(--fg-2);font-size:19px;max-width:60ch;margin:0 0 32px;}
.aaa-ivybe-lead p{margin-inline:0;}

/* --- 7. CTA — casino chip stack, four states ---------------------------- */
.dbb-ivybe-act{
  font-family:var(--display);font-weight:800;font-size:15px;
  letter-spacing:.08em;text-transform:uppercase;
  border-radius:0;padding:16px 32px;
  transition:transform .14s ease,box-shadow .14s ease,background .14s ease;
}
.ccd-ivybe-act-primary{
  background:var(--acid);color:var(--ink-900);
  box-shadow:8px 8px 0 0 var(--acid-dim);
  animation:none; /* legacy neon-pulse animated box-shadow — replaced by the press states below */
}
.ccd-ivybe-act-primary:hover{
  background:var(--acid-hi);transform:translate(-2px,-2px);
  box-shadow:12px 12px 0 0 var(--acid-dim);
}
.ccd-ivybe-act-primary:active{transform:translate(4px,4px);box-shadow:0 0 0 0 var(--acid-dim);}
.dbb-ivybe-act:focus-visible,.bad-act-register:focus-visible,.cba-act-login:focus-visible,
.bcf-act-view-all-games:focus-visible{outline:2px solid var(--fg);outline-offset:4px;}

/* --- 8. H1 + opener ------------------------------------------------------ */
main.bcd-ivybe-article > div.fbb-ivybe-wrap:nth-of-type(1){
  max-width:1320px;padding:96px 24px 32px;
  display:grid;grid-template-columns:var(--rail) minmax(0,1fr);column-gap:64px;
}
.fdd-ivybe-page-head{
  grid-column:1 / -1;
  font-family:var(--display);font-weight:800;
  font-size:clamp(44px,7vw,76px);line-height:.96;letter-spacing:-.035em;
  text-align:left;margin:0 0 24px;text-wrap:balance;
}
.cbb-ivybe-opener{grid-column:2;margin:0;font-size:19px;line-height:1.66;color:var(--fg-2);}
.cbb-ivybe-opener p{max-width:66ch;}
.cde-ivybe-slogan{
  font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--acid);border-top:1px solid var(--line);
  padding-top:16px;margin-top:24px;
}

/* --- 9. Game showcase — bento ------------------------------------------- */
.acd-ivybe-games-block{padding:96px 0;background:var(--ink-850);border-block:1px solid var(--line);}
.acd-ivybe-games-block > .fbb-ivybe-wrap{max-width:1320px;padding:0 24px;}
.cae-games-block-head{
  font-family:var(--display);font-weight:800;text-align:left;
  font-size:32px;letter-spacing:-.025em;text-transform:uppercase;
  margin-bottom:32px;padding-bottom:16px;border-bottom:1px solid var(--line);
}
.cfa-ivybe-games-matrix{
  grid-template-columns:repeat(5,minmax(0,1fr));
  grid-auto-rows:168px;gap:8px;margin-bottom:32px;
}
.ffb-ivybe-slot-tile{
  aspect-ratio:auto;border-radius:0;background:var(--ink-800);
  border:1px solid var(--line);
}
.ffb-ivybe-slot-tile:nth-child(12n+1){grid-column:span 2;grid-row:span 2;}
.ffb-ivybe-slot-tile:nth-child(12n+5),
.ffb-ivybe-slot-tile:nth-child(12n+9){grid-column:span 2;}
.ffb-ivybe-slot-tile img{width:100%;height:100%;object-fit:cover;display:block;}
.ffb-ivybe-slot-tile:hover{border-color:var(--acid);transform:none;}
.feb-ivybe-slot-veil{background:linear-gradient(0deg,hsl(100 14% 5% / .92),transparent 70%);}
.dca-ivybe-slot-head{font-family:var(--display);font-weight:800;letter-spacing:.02em;}
.bcf-act-view-all-games{
  font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.08em;
  border-radius:0;border:1px solid var(--acid);color:var(--acid);background:none;
}
.bcf-act-view-all-games:hover{background:var(--acid);color:var(--ink-900);}

/* --- 10. Screenshot ------------------------------------------------------ */
main.bcd-ivybe-article > div.fbb-ivybe-wrap:nth-of-type(2){max-width:1320px;padding:64px 24px;}
.eaa-ivybe-site-screenshot{border-radius:0;border:1px solid var(--line);width:100%;height:auto;}

/* --- 11. Body blocks — side rail + alternating band density -------------- */
.fdd-ivybe-body-block{padding:64px 0;background:none;border-bottom:1px solid var(--line);}
.fdd-ivybe-body-block:nth-of-type(even){background:var(--ink-850);padding:96px 0;}
.fdd-ivybe-body-block > .fbb-ivybe-wrap{
  max-width:1320px;padding:0 24px;
  display:grid;grid-template-columns:var(--rail) minmax(0,1fr);column-gap:64px;
}
.fdd-ivybe-body-block > .fbb-ivybe-wrap > *{grid-column:2;min-width:0;}
.fdd-ivybe-body-block > .fbb-ivybe-wrap > h2{
  grid-column:1;grid-row:1;position:sticky;top:calc(var(--hdr-h) + 32px);align-self:start;
  font-family:var(--display);font-weight:800;
  /* NO uppercase here: almost every h2 carries the brand, and the site was just
     brought to the "IvyBet" spelling — capsing it back would undo that visually. */
  font-size:30px;line-height:1.04;letter-spacing:-.025em;
  color:var(--fg);margin:0;padding-top:24px;border-top:2px solid var(--acid);
}
/* Порядковые номера секций (01…20) сняты по правке владельца 23.08.2026.
   Счётчик ivy-sec оставлен объявленным: он ничего не рисует без ::before,
   а удалять его — трогать две другие строки без нужды. */
.fdd-ivybe-body-block h3{
  font-family:var(--display);font-weight:800;font-size:21px;letter-spacing:-.01em;
  color:var(--fg);margin-top:48px;
}
.fdd-ivybe-body-block p,.fdd-ivybe-body-block li{max-width:68ch;color:var(--fg-2);}
.fdd-ivybe-body-block ul{padding-left:0;list-style:none;}
.fdd-ivybe-body-block li{position:relative;padding-left:24px;}
.fdd-ivybe-body-block li::before{
  content:'';position:absolute;left:0;top:.72em;width:8px;height:1px;background:var(--acid);
}

/* --- 12. Tables — hairline ledger --------------------------------------- */
.fdd-ivybe-body-block table,.cdd-ivybe-quick-grid2,.ded-ivybe-wheel-grid2,.dbf-ivybe-shop-grid2{
  border-radius:0;background:none;border:0;border-top:1px solid var(--line);
  font-variant-numeric:tabular-nums;
}
.fdd-ivybe-body-block th,.cdd-ivybe-quick-grid2 th,.ded-ivybe-wheel-grid2 th,.dbf-ivybe-shop-grid2 th{
  background:none;color:var(--fg-3);
  font-family:var(--display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  border-bottom:1px solid var(--line);
}
.fdd-ivybe-body-block td,.cdd-ivybe-quick-grid2 td,.ded-ivybe-wheel-grid2 td,.dbf-ivybe-shop-grid2 td{
  border-bottom:1px solid var(--line);color:var(--fg-2);
}
.fdd-ivybe-body-block tr:hover td{background:var(--acid-veil);color:var(--fg);}

/* --- 13. Data carriers — typographic block instead of card -------------- */
.acb-ivybe-stats-matrix{
  grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:32px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.fdb-ivybe-fig-tile{
  background:none;border-radius:0;padding:32px 24px;text-align:left;cursor:default;
  border-left:1px solid var(--line);
}
.fdb-ivybe-fig-tile:nth-child(odd){border-left:0;}
.fdb-ivybe-fig-tile:hover{background:none;transform:none;box-shadow:none;}
.ada-ivybe-fig-glyph{
  width:auto;height:auto;background:none;border-radius:0;margin:0 0 16px;
  display:block;font-size:16px;color:var(--acid);
}
.acc-ivybe-fig-val{
  font-family:var(--display);font-weight:800;
  font-size:clamp(44px,4.4vw,76px);line-height:.88;letter-spacing:-.045em;
  color:var(--fg);margin-bottom:8px;font-variant-numeric:tabular-nums;
}
.aab-ivybe-fig-cap{
  font-family:var(--display);font-weight:800;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--fg-3);
}
.acd-ivybe-cashback-tile{background:none;border:0;border-radius:0;padding:0;}
.adc-ivybe-cashback-highlight{background:none;border-radius:0;padding:0 0 32px;text-align:left;}
.adc-ivybe-cashback-highlight::before{display:none;}
.bbb-ivybe-cashback-glyph{font-size:16px;color:var(--acid);margin:0 0 16px;}
.def-ivybe-cashback-val{
  font-family:var(--display);font-weight:800;
  font-size:clamp(56px,7vw,112px);line-height:.86;letter-spacing:-.05em;color:var(--acid);
}
.fea-ivybe-cashback-cap{
  font-family:var(--display);font-weight:800;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--fg-3);
}
.caa-ivybe-cashback-stats{border-top:1px solid var(--line);}
.fcc-ivybe-cashback-fig{background:none;border-radius:0;border-left:1px solid var(--line);padding:24px;}
.fcc-ivybe-cashback-fig:first-child{border-left:0;}
.cce-ivybe-cashback-fig-val{
  font-family:var(--display);font-weight:800;font-size:36px;letter-spacing:-.03em;color:var(--fg);
}
.add-ivybe-cashback-fig-cap{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3);}
.dea-ivybe-flow-number{
  width:48px;height:48px;border-radius:0;background:none;border:1px solid var(--acid);
  color:var(--acid);font-family:var(--display);font-weight:800;font-size:19px;
}
.caa-ivybe-flow-head{font-family:var(--display);font-weight:800;letter-spacing:-.01em;}

/* --- 14. Tiles, chips, pills — squared outside, pill inside ------------- */
.ada-ivybe-shop-tile,.afd-ivybe-wheel-tile,.ece-ivybe-security-chip,.bfc-ivybe-info-pane,
.cad-ivybe-deal-code-highlight{
  border-radius:0;background:var(--ink-800);border:1px solid var(--line);
}
.ada-ivybe-shop-tile:hover,.afd-ivybe-wheel-tile:hover,.ece-ivybe-security-chip:hover{
  border-color:var(--acid);background:var(--ink-700);transform:none;
}
.cfe-ivybe-shop-tile-top::before{display:none;}
.bce-ivybe-shop-glyph,.cab-ivybe-wheel-glyph,.def-ivybe-security-glyph,.aff-ivybe-info-glyph{
  border-radius:0;background:none;color:var(--acid);
}
.efd-ivybe-shop-category,.acd-ivybe-wheel-name,.bbc-ivybe-security-chip-head{
  font-family:var(--display);font-weight:800;letter-spacing:-.01em;
}
.baf-ivybe-shop-count,.afb-ivybe-wheel-cost{
  font-family:var(--display);font-weight:800;color:var(--acid);font-variant-numeric:tabular-nums;
}
.bec-ivybe-vendor-pill,.ccb-ivybe-lang-pill,.dbd-rtag,.cad-ivybe-age-chip,.ebf-ivybe-ssl-chip,
.cff-ivybe-deal-code-chip{
  border-radius:999px;border:1px solid var(--line);background:var(--ink-800);color:var(--fg-2);
}
.bec-ivybe-vendor-pill:hover,.ccb-ivybe-lang-pill:hover{border-color:var(--acid);color:var(--acid);background:var(--ink-800);}
.bfd-ivybe-deal-code{
  font-family:var(--display);font-weight:800;letter-spacing:.14em;color:var(--acid);
}
.afe-ivybe-copy-code-act{border-radius:999px;border:1px solid var(--acid);color:var(--acid);background:none;}
.afe-ivybe-copy-code-act:hover{background:var(--acid);color:var(--ink-900);}
.ccb-ivybe-restricted-unit{color:var(--fg-3);}
.ccb-ivybe-restricted-unit i{color:var(--fg-3);}
.bfc-ivybe-info-pane{border-left:2px solid var(--acid);}
.eac-ivybe-info-success .aff-ivybe-info-glyph{color:var(--acid);}
.eeb-ivybe-info-warning .aff-ivybe-info-glyph{color:var(--fg-2);}

/* --- 15. FAQ — hairline rows -------------------------------------------- */
.eaf-ivybe-qa-unit{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;}
.dab-ivybe-qa-question{
  font-family:var(--display);font-weight:800;font-size:17px;letter-spacing:-.01em;
  color:var(--fg);background:none;padding:24px 32px 24px 0;
}
.dab-ivybe-qa-question:hover{background:none;color:var(--acid);}
.cab-ivybe-qa-answer{color:var(--fg-2);}

/* --- 16. Footer --------------------------------------------------------- */
.dca-ivybe-foot{background:var(--ink-850);border-top:1px solid var(--acid-line);padding:96px 0 32px;}
.dca-ivybe-foot > .fbb-ivybe-wrap{max-width:1320px;padding:0 24px;}
.cdb-ivybe-foot-top{text-align:left;margin-bottom:48px;}
.dca-ivybe-foot .cdd-mark-ref{display:inline-flex;}
/* same reason as the header: the height attribute needs an explicit CSS height */
.dca-ivybe-foot .cdd-mark-ref img{height:128px;width:auto;max-width:none;display:block;}
.bed-foot-col strong{
  font-family:var(--display);font-weight:800;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--acid);
}
.bed-foot-col a,.bed-foot-col div{color:var(--fg-3);}
.bed-foot-col a:hover,.bed-foot-col div:hover{color:var(--acid);}
.afc-ivybe-foot-disclaimer,.footer-affiliate-disclosure{color:var(--fg-3);border-top:1px solid var(--line);}
.bba-ivybe-foot-bottom{border-top:1px solid var(--line);color:var(--fg-3);}

/* --- 17. Misc chrome ---------------------------------------------------- */
[id="cfc-ivybe-progress-bar"],#cfc-ivybe-progress-bar{background:var(--acid);}
#eae-ivybe-sticky-bar,.bec-ivybe-sticky-strip2-actions{background:var(--ink-850);border-top:1px solid var(--acid-line);}
.dff-ivybe-sticky-strip2-act{
  border-radius:0;font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.08em;
}
.dfe-ivybe-breadcrumb{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3);}
.bba-mobile-nav2,.bfe-mobile-nav2-veil{border-radius:0;}
.bba-mobile-nav2{background:var(--ink-850);border-left:1px solid var(--line);}
.fcc-mobile-nav2-act,.daa-mobile-nav2-act-secondary{
  border-radius:0;font-family:var(--display);font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}
/* menu labels stay in their authored case: uppercase display type wraps them onto two lines */
.afa-mobile-nav2-unit{border-radius:0;font-family:var(--display);font-weight:800;letter-spacing:.01em;}
a:focus-visible,button:focus-visible,[data-link]:focus-visible,summary:focus-visible{
  outline:2px solid var(--acid);outline-offset:3px;
}

/* --- 18. Responsive ------------------------------------------------------ */
@media (max-width:1240px){
  :root{--rail:200px;}
  .cfa-ivybe-games-matrix{grid-auto-rows:150px;}
}
@media (max-width:1040px){
  .fdd-ivybe-body-block > .fbb-ivybe-wrap,
  main.bcd-ivybe-article > div.fbb-ivybe-wrap:nth-of-type(1){grid-template-columns:minmax(0,1fr);column-gap:0;}
  .fdd-ivybe-body-block > .fbb-ivybe-wrap > *,
  .fdd-ivybe-body-block > .fbb-ivybe-wrap > h2,
  .fdd-ivybe-page-head,.cbb-ivybe-opener{grid-column:1;}
  .fdd-ivybe-body-block > .fbb-ivybe-wrap > h2{position:static;margin-bottom:24px;}
  .cfa-ivybe-games-matrix{grid-template-columns:repeat(4,minmax(0,1fr));}
  .dbf-ivybe-lead-gradient-strip{padding:calc(var(--hdr-h) + 64px) 24px 64px;}
}
@media (max-width:790px){
  body{font-size:16px;}
  :root{--hdr-h:112px;}
  .dac-ivybe-top{padding:0 16px;gap:16px;}
  .dac-ivybe-top .cdd-mark-ref img{height:96px;}
  .dca-ivybe-foot .cdd-mark-ref img{height:112px;}
  .cfa-ivybe-games-matrix{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:132px;}
  .ffb-ivybe-slot-tile:nth-child(12n+1){grid-column:span 2;grid-row:span 1;}
  .ffb-ivybe-slot-tile:nth-child(12n+5),
  .ffb-ivybe-slot-tile:nth-child(12n+9){grid-column:span 2;}
  .fdd-ivybe-body-block{padding:48px 0;}
  .fdd-ivybe-body-block:nth-of-type(even){padding:48px 0;}
  main.bcd-ivybe-article > div.fbb-ivybe-wrap:nth-of-type(1){padding:48px 16px 24px;}
  .fdd-ivybe-body-block > .fbb-ivybe-wrap,.acd-ivybe-games-block > .fbb-ivybe-wrap,
  .dca-ivybe-foot > .fbb-ivybe-wrap{padding:0 16px;}
  .acb-ivybe-stats-matrix{grid-template-columns:minmax(0,1fr);}
  .fdb-ivybe-fig-tile{border-left:0;border-top:1px solid var(--line);}
  .fdb-ivybe-fig-tile:first-child{border-top:0;}
  .acd-ivybe-games-block{padding:64px 0;}
}
@media (max-width:420px){
  /* 96px logo + the register button collide below ~420px */
  .dac-ivybe-top .cdd-mark-ref img{height:88px;}
  .bad-act-register{padding:12px;font-size:12px;letter-spacing:.06em;}
  .caa-ivybe-cashback-stats{grid-template-columns:minmax(0,1fr);}
  .fcc-ivybe-cashback-fig{border-left:0;border-top:1px solid var(--line);}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;} /* a11y: canon 9.1 requires motion to stop */
  html{scroll-behavior:auto;}
}

/* --- 12. Header fit ------------------------------------------------------ */
/* Пункты меню набраны капсом с трекингом .1em, поэтому шире, чем при строчном
   начертании исходной версии. Флекс-контейнер ужимал их ниже собственной ширины
   (flex-shrink:1, min-width:0), а при overflow:visible текст не обрезался, а
   вылезал на соседний пункт. Снимаем сжатие и переносим бургер на ту ширину,
   где горизонтальное меню действительно перестаёт помещаться (замер: 1217px
   при обязательном зазоре 32px между логотипом и первым пунктом). */
.dac-ivybe-top > *{flex:0 0 auto;}
.fda-top-menu a,.fda-top-menu div,
.ebc-top-actions a,.ebc-top-actions button{flex:0 0 auto;white-space:nowrap;}

@media (max-width:1220px){
  .fda-top-menu{display:none;}
  .cbc-act-search{display:none;}
  .dbe-hamburger{display:flex;}
}

/* Логотип обёрнут в <picture>, а у <img> стоят атрибуты width=160 height=40.
   Из них берётся соотношение для расчёта места, поэтому ссылка резервировала
   69px, тогда как картинка при height:100px рисуется на 186px и заходила на
   первый пункт меню. Соотношение снимаем, обёртку делаем блочным флексом,
   чтобы ссылка занимала фактическую ширину картинки. */
.dac-ivybe-top .cdd-mark-ref,
.dca-ivybe-foot .cdd-mark-ref{flex:0 0 auto;}
.dac-ivybe-top .cdd-mark-ref picture,
.dca-ivybe-foot .cdd-mark-ref picture{display:flex;align-items:center;line-height:0;}
.dac-ivybe-top .cdd-mark-ref img,
.dca-ivybe-foot .cdd-mark-ref img{aspect-ratio:auto;}
/* Картинка логотипа — тоже флекс-элемент, и сжималась вместе с шапкой
   (186 -> 50px на 1081px). Логотип задан по высоте намеренно, сжимать нельзя. */
.dac-ivybe-top .cdd-mark-ref picture,
.dca-ivybe-foot .cdd-mark-ref picture,
.dac-ivybe-top .cdd-mark-ref img,
.dca-ivybe-foot .cdd-mark-ref img{flex:0 0 auto;}

/* Мобильная шапка: логотип теперь не сжимается, поэтому его высота и ширина
   кнопки должны сходиться по бюджету ширины. У оригинала на 375px лого 156x84
   при зазоре ровно 0 — то есть запаса там не было изначально. Ужимаем набор
   кнопки и высоту логотипа так, чтобы зазор был положительным вплоть до 320px. */
@media (max-width:420px){
  .dac-ivybe-top .cdd-mark-ref img{height:72px;}
  .cba-act-login,.bad-act-register{padding:10px 12px!important;font-size:12px!important;letter-spacing:.06em;}
}
@media (max-width:380px){
  .dac-ivybe-top .cdd-mark-ref img{height:56px;}
  .cba-act-login,.bad-act-register{padding:8px 9px!important;font-size:11px!important;letter-spacing:.04em;}
}

/* Правка владельца 23.08: таблицы на узких экранах не помещались и обрезались
   без возможности прокрутить. В шаблоне уже есть общее правило
   table{display:block;overflow-x:auto}, но его перебивают два более специфичных
   (.fdd-ivybe-body-block table и table.cdd-ivybe-quick-grid2 -> display:table),
   поэтому override делаем адресным и с !important: это корректирующее правило,
   а не часть каскада макета. */
@media (max-width:1000px){
  .fdd-ivybe-body-block table,
  .bcd-ivybe-article table,
  table.cdd-ivybe-quick-grid2,
  table{
    display:block!important; width:100%!important; max-width:100%!important;
    overflow-x:auto!important; -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  table > thead, table > tbody, table > tfoot{
    display:table!important; width:max-content!important; min-width:100%!important;
  }
}

/* Раскатка 23.08: композиция первого экрана (боковой рельс) написана под
   главную. На подстраницах у первой обёртки другая структура — три ребёнка
   вместо двух, — и контент уезжал в 264px-колонку. Возвращаем ей блочный
   поток; типографика, палитра и компоненты редизайна остаются. */
body[data-rd-page="inner"] main.bcd-ivybe-article > div.fbb-ivybe-wrap:nth-of-type(1){
  display:block; max-width:1200px; margin-left:auto; margin-right:auto;
}

/* Раскатка 23.08: main стал флекс-колонкой, а .fbb-ivybe-wrap центрируется
   через margin:0 auto — в флексе такой элемент не растягивается, а ужимается
   по содержимому. Обёртка со скриншотом сайта содержит только ленивую картинку
   шириной 100%, то есть нулевую до загрузки: блок схлопывался в 50px, картинка
   из-за нулевой площади не входила во вьюпорт и не загружалась вовсе.
   Явная ширина разрывает этот круг; max-width и центрирование сохраняются. */
main.bcd-ivybe-article > .fbb-ivybe-wrap{ width:100%; }
