/* /aviator/sites/, /casino/, /casino/slots/ blocks (cz- prefix). Loaded only there by mu-plugins/betadvisor-page-casino-hubs.php. Mobile first. */

/* ----- First screen: compact head, cover image moves into the text ----- */
.cz-page .page-hero { display: none; }
.cz-page .page-head { padding: 10px 0 6px; margin-bottom: 10px; }
.cz-page .page-head .eyebrow { margin-bottom: 2px; }
.cz-page .page-head .page-title { font-size: clamp(1.45rem, 5vw, 2.2rem); margin: .1em 0 .25em; }
.cz-page .page-head .lead { font-size: 1rem; margin-bottom: .4em; }
.cz-page .page-head .meta-line { margin: 0; font-size: .82rem; }
.cz-page .disclosure { margin: 6px 0 8px; font-size: .78rem; }
.cz-page .method-link { display: none; }
.cz-casino .children, .cz-casino-slots .children { display: none; }
@media (max-width: 640px) { .cz-page .page-head .lead { display: none; } .cz-page .breadcrumbs { font-size: .78rem; } }

/* ----- Hero block shared by the three pages ----- */
.cz-hero { margin: 0 0 24px; padding: 14px; border-radius: var(--radius); background: var(--card); border: 2px solid var(--green); box-shadow: var(--shadow); }
.cz-hero__grid { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .cz-hero__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); } .cz-hero--slots .cz-hero__grid { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); } }
.cz-k { margin: 0; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--green-2); }
.entry-content .cz-hero__h, .cz-hero__h { margin: 2px 0 10px; padding: 0; font-size: 1.12rem; }
.entry-content .cz-hero__h::before { display: none; }
.cz-top__h { margin: 2px 0 8px; font-family: var(--font-head); font-weight: 800; color: var(--green); }
.cz-top__list, .cz-pick__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.cz-row { margin: 0; display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; align-items: center; gap: 6px 10px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 10px; background: #fbfaf6; }
.cz-row--first { border-color: var(--gold); background: #fffaf0; }
.cz-row__n { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--green); color: #fff; font-weight: 800; font-size: .76rem; }
.cz-row--first .cz-row__n { background: var(--gold); color: var(--gold-ink); }
.cz-row .rv-tile { width: 54px; height: 34px; padding: 4px 6px; }
.cz-row__main { min-width: 0; }
.cz-row__name { margin: 0; font-weight: 800; line-height: 1.25; }
.cz-row__name a { color: var(--ink); text-decoration: none; }
.cz-row__name a:hover { text-decoration: underline; }
.cz-row__score { color: var(--green-2); white-space: nowrap; }
.cz-row__score small { color: var(--ink-soft); font-weight: 600; }
.cz-row__note { margin: 2px 0 0; font-size: .78rem; line-height: 1.35; color: var(--ink-soft); }
.entry .cz-row__go { margin: 0; min-height: 34px; padding: 5px 14px; font-size: .86rem; }
@media (max-width: 520px) { .cz-top .cz-row__note { display: none; } .cz-top .cz-row--first .cz-row__note { display: block; } }
.cz-fine { margin: 8px 0 0; font-size: .72rem; color: var(--ink-soft); }
.cz-chips { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.cz-chips li { margin: 0; }
.cz-chips a, .cz-chip { display: inline-block; padding: 5px 11px; border-radius: 999px; border: 1px solid var(--green-2); color: var(--green); font: inherit; font-size: .8rem; font-weight: 700; text-decoration: none; background: #fff; cursor: pointer; }
.cz-chips a:hover, .cz-chip:hover, .cz-chip.is-on { background: var(--green); color: #fff; }

/* ----- Contents strip and numbers ----- */
.cz-carnet { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 6px; grid-template-columns: repeat(2, minmax(0, 1fr)); counter-reset: czc; }
@media (min-width: 760px) { .cz-carnet { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.cz-carnet li { margin: 0; counter-increment: czc; }
.cz-carnet a { display: flex; gap: 8px; align-items: baseline; padding: 8px 10px; border-radius: 8px; background: var(--green-soft); color: var(--green); font-size: .82rem; font-weight: 700; text-decoration: none; line-height: 1.25; }
.cz-carnet a::before { content: counter(czc, decimal-leading-zero); font-family: var(--mono); font-size: .74rem; color: var(--green-2); }
.cz-carnet a:hover { background: var(--green); color: #fff; }
.cz-num { display: inline-block; margin-right: 8px; font-family: var(--mono); font-size: .8em; color: var(--green-2); }

/* ----- Cards ----- */
.cz-cards { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); margin: 0 0 1.2em; }
@media (min-width: 700px) { .cz-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cz-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cz-card { padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: #fbfaf6; min-width: 0; }
.cz-card h3 { margin: 0 0 6px; font-size: 1.02rem; }
.cz-card p { margin: 0 0 .5em; font-size: .93rem; }
.cz-card p:last-child { margin: 0; }
.cz-card__tag { display: inline-block; margin: 0 0 6px; padding: 1px 8px; border-radius: 999px; background: var(--green); color: var(--lime); font-family: var(--mono); font-size: .74rem; font-weight: 700; }
.cz-keep, .cz-watch { margin: 0 0 1.2em; padding: 12px 14px 12px 44px; border-radius: 10px; position: relative; font-size: .95rem; }
.cz-keep { background: var(--green-soft); }
.cz-watch { background: var(--red-soft); border: 1px solid var(--red-line); }
.cz-keep::before, .cz-watch::before { position: absolute; left: 14px; top: 12px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; font-weight: 800; font-size: .75rem; }
.cz-keep::before { content: "\2713"; background: var(--green-2); color: #fff; }
.cz-watch::before { content: "!"; background: #fff; color: #a4511b; border: 1px solid var(--red-line); }
.cz-keep p, .cz-watch p { margin: 0 0 .4em; }
.cz-keep p:last-child, .cz-watch p:last-child { margin: 0; }
.cz-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 0 1.2em; }
.cz-tablewrap table { min-width: 520px; margin: 0; }

/* ----- Picker ----- */
.cz-pick { margin: 0 0 1.4em; padding: 16px; border: 2px solid var(--green); border-radius: var(--radius); background: var(--card); }
.cz-pick__h, .cz-cost__h { margin: 0 0 10px; font-family: var(--font-head); font-weight: 800; color: var(--green); font-size: 1.05rem; }
.cz-pick__opts { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.cz-pick__opts input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cz-pick__opts label { padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fbfaf6; font-size: .86rem; font-weight: 700; cursor: pointer; }
.cz-pick__opts input:checked + label { background: var(--green); border-color: var(--green); color: #fff; }
.cz-pick__opts input:focus-visible + label { outline: 3px solid var(--gold); }

/* ----- Game navigator ----- */
.cz-games { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cz-games li { margin: 0; }
.cz-game { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; align-items: center; padding: 9px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fbfaf6; color: var(--ink); text-decoration: none; height: 100%; }
.cz-game:hover { border-color: var(--green-2); background: var(--green-soft); }
.cz-game__i { grid-row: 1 / span 2; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--green); color: var(--lime); font-family: var(--font-head); font-weight: 800; }
.cz-game__t { font-weight: 800; font-size: .92rem; line-height: 1.2; }
.cz-game__d { font-size: .74rem; color: var(--ink-soft); line-height: 1.3; }
@media (max-width: 400px) { .cz-game__d { display: none; } }

/* ----- Flow and map SVG ----- */
.cz-flow, .cz-map, .cz-reels { margin: 0 0 1.2em; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); }
.cz-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cz-scroll svg { display: block; width: 100%; min-width: 520px; height: auto; }
.cz-flow figcaption, .cz-map figcaption, .cz-reels figcaption { font-size: .8rem; color: var(--ink-soft); margin-top: 6px; }
.czf-same { fill: var(--lime); }
.czf-diff { fill: var(--green); }
.czf-n { fill: var(--gold); font: 800 13px var(--mono); }
.czf-same + .czf-n { fill: var(--green); }
.czf-t { fill: #fff; font: 800 14px var(--font); }
.czf-d { fill: #cfe2d8; font: 600 11px var(--font); }
.czf-arr { fill: none; stroke: var(--ink-soft); stroke-width: 2; }
.czf-lg { fill: var(--green-2); font: 700 12px var(--font); }
.czf-lg--b { fill: var(--green); }
.cz-flow rect.czf-same ~ text { }
.czm-g { stroke: var(--line); }
.czm-ax { fill: var(--ink-soft); font: 12px var(--font); }
.czm-b { fill-opacity: .75; stroke: #fff; stroke-width: 2; }
.czm-bj, .czm-bac { fill: var(--green-2); }
.czm-rlive { fill: #6aa84f; }
.czm-rrng { fill: #d99a00; }
.czm-avi { fill: #c0262d; }
.czm-slot { fill: #8e3fbf; }
.czm-l { fill: var(--ink); font: 700 12px var(--font); }

/* ----- Cost and RTP forms ----- */
.cz-cost, .cz-rtp { margin: 0 0 1.4em; padding: 16px; border: 2px solid var(--green); border-radius: var(--radius); background: var(--card); }
.cz-cost__g { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .cz-cost__g { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cz-rtp .cz-cost__g { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cz-cost label, .cz-rtp label { display: flex; flex-direction: column; gap: 3px; font-size: .8rem; font-weight: 700; color: var(--ink-soft); }
.cz-cost select, .cz-cost input, .cz-rtp input { width: 100%; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; font: inherit; font-weight: 700; color: var(--ink); background: #fff; }
.cz-cost__out { display: block; margin-top: 12px; padding: 10px 12px; border-radius: 8px; background: var(--green-soft); font-size: .92rem; }

/* ----- Slot navigator ----- */
.cz-slots__f { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.cz-slots__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .cz-slots__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cz-slot { margin: 0; }
.cz-slot[hidden] { display: none; }
.cz-slot a { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 9px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fbfaf6; color: var(--ink); text-decoration: none; }
.cz-slot a:hover { border-color: var(--green-2); background: var(--green-soft); }
.cz-slot__n { font-weight: 800; font-size: .9rem; line-height: 1.2; }
.cz-slot__m { font-size: .7rem; color: var(--ink-soft); line-height: 1.25; }
.cz-slot__b { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; margin-top: 3px; font-size: .74rem; }
.cz-slot__b b { color: var(--green); }
.cz-slot__f { font-size: .72rem; color: var(--ink-soft); line-height: 1.3; }
@media (max-width: 520px) { .cz-hero .cz-slot__f, .cz-hero .cz-slot__m { display: none; } }
.cz-vol { font-style: normal; padding: 0 6px; border-radius: 999px; font-weight: 800; font-size: .66rem; text-transform: uppercase; letter-spacing: .04em; }
.cz-vol--low { background: var(--green-soft); color: var(--green-2); }
.cz-vol--medium { background: #fff5d9; color: #8a5f00; }
.cz-vol--high, .cz-vol--very-high, .cz-vol--extreme { background: var(--red-soft); color: #a4511b; }

/* ----- Reels SVG ----- */
.czr-t { fill: var(--green); font: 800 13px var(--font); }
.czr-n { fill: var(--ink-soft); font: 600 12px var(--font); }
.czr-c { fill: #1c3b30; }
.czr-on { fill: #2f6b4f; stroke: var(--lime); stroke-width: 2; }
.czr-s--a { fill: #c0262d; }
.czr-s--b { fill: #f2b01e; }
.czr-s--c { fill: #4a8fd8; }
.czr-s--d { fill: #8e3fbf; }
.czr-s--w { fill: var(--lime); }
.czr-line { fill: none; stroke: var(--lime); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; opacity: .85; }

/* ----- Figures ----- */
.cz-fig { margin: 0 0 1.2em; }
.cz-fig img { display: block; width: 100%; height: auto; border-radius: var(--radius); }
.cz-fig figcaption { font-size: .8rem; color: var(--ink-soft); margin-top: 6px; }