/*
 * Casinononline editorial blocks, tables and prose components.
 * Loaded on the front end after main.css and in the block editor canvas (with light tokens).
 * Selectors that live inside .prose use two classes so they win over the generic prose rules.
 */

/* ---------------------------------------------------------------------------
 * Prose: lists, links that are buttons, cards inside content, citations
 * ------------------------------------------------------------------------ */

.prose :where(ul, ol).wp-block-list, .prose :where(ul, ol):not([class]) { list-style: revert; }
.prose a.btn { text-decoration: none; }
.prose a.btn--primary { color: var(--c-on-accent); }
.prose a.btn--secondary { color: var(--c-text); }
.prose a.btn--dark { color: var(--c-accent); }
.prose .post-card__title a { color: var(--c-text); }
.prose .post-card__title { margin-top: 0; }
.prose > .section-nav, .prose > .info-box, .prose > .rg-notice, .prose > .ad-disclosure, .prose > .expert-quote,
.prose > .cta-block, .prose > .method-block, .prose > .faq-block, .prose > .sources, .prose > .related-block { margin-top: clamp(28px, 4vw, 40px); }
.prose > .faq-block + *, .prose > .info-box + *, .prose > .cta-block + *, .prose > .method-block + *, .prose > .expert-quote + * { margin-top: clamp(28px, 4vw, 40px); }

.cno-cite { font-size: .72em; line-height: 0; position: relative; top: -.5em; vertical-align: baseline; }
.cno-cite a { font-family: var(--font-numeric); font-weight: 600; padding-inline: 1px; text-decoration: none; }
.cno-cite a:hover { text-decoration: underline; }
:target { scroll-margin-top: calc(var(--header-height, 72px) + 20px); }
.sources__item:target { background: var(--c-accent-soft); border-radius: 8px; }

.prose--legal { font-size: var(--step-0); }
.prose--legal h2 { border-top: var(--line); font-size: var(--step-2); padding-top: 1em; }
.prose--legal h3 { font-size: var(--step-1); }
.prose--legal p, .prose--legal li { max-width: 70ch; }

/* ---------------------------------------------------------------------------
 * Tables (core/table and bare tables in content)
 * ------------------------------------------------------------------------ */

.wp-block-table, .table-scroll {
	-webkit-overflow-scrolling: touch; background: var(--c-surface); border: var(--line); border-radius: var(--radius-card); margin-inline: 0; max-width: 100%; overflow-x: auto;
}
.wp-block-table:focus-visible, .table-scroll:focus-visible { box-shadow: var(--focus); }
.wp-block-table table, .table-scroll table, .prose .wp-block-table table {
	border-collapse: separate; border-spacing: 0; color: var(--c-text-secondary); font-size: var(--step-n1); font-variant-numeric: tabular-nums; margin: 0; min-width: 100%; width: max-content;
}
@media (min-width: 768px) { .wp-block-table table, .table-scroll table { width: 100%; } }
.wp-block-table th, .wp-block-table td, .table-scroll th, .table-scroll td, .prose .wp-block-table th, .prose .wp-block-table td {
	border: 0; border-bottom: var(--line); line-height: 1.45; padding: .85em 1em; text-align: left; vertical-align: top;
}
.wp-block-table thead th, .table-scroll thead th, .wp-block-table thead td {
	background: var(--c-bg-alt); border-bottom: 1px solid color-mix(in srgb, var(--c-accent) 55%, var(--c-border)); color: var(--c-text);
	font-size: var(--step-n2); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap;
}
.wp-block-table tbody tr:last-child > *, .table-scroll tbody tr:last-child > * { border-bottom: 0; }
.wp-block-table tbody tr:hover > *, .table-scroll tbody tr:hover > * { background: color-mix(in srgb, var(--c-accent) 5%, transparent); }
.wp-block-table tbody th, .table-scroll tbody th { color: var(--c-text); font-weight: 650; }
.wp-block-table tfoot td, .wp-block-table tfoot th { background: var(--c-bg-alt); border-bottom: 0; border-top: var(--line); color: var(--c-text); font-weight: 650; }
.wp-block-table.is-style-stripes { border-bottom: var(--line); }
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) > * { background: color-mix(in srgb, var(--c-text) 3.5%, transparent); }
.wp-block-table.is-style-cno-compact th, .wp-block-table.is-style-cno-compact td { padding: .5em .75em; }
.wp-block-table.is-style-cno-comparison tbody td:first-child, .wp-block-table.is-style-cno-comparison tbody th:first-child {
	background: var(--c-bg-alt); color: var(--c-text); font-weight: 650; left: 0; position: sticky; z-index: 1;
}
.wp-block-table.is-style-cno-comparison thead > tr > :first-child { left: 0; position: sticky; z-index: 2; }
.wp-block-table figcaption, .wp-block-table .wp-element-caption { border-top: var(--line); color: var(--c-text-muted); font-size: var(--step-n2); margin: 0; padding: .7em 1em; }

/* ---------------------------------------------------------------------------
 * Info box
 * ------------------------------------------------------------------------ */

.info-box {
	--box-tone: var(--c-link);
	background: color-mix(in srgb, var(--box-tone) 7%, var(--c-surface)); border: 1px solid color-mix(in srgb, var(--box-tone) 28%, var(--c-border));
	border-left: 3px solid var(--box-tone); border-radius: var(--radius-card); color: var(--c-text-secondary); padding: clamp(16px, 2.4vw, 22px) clamp(18px, 2.6vw, 26px);
}
.info-box--tip { --box-tone: var(--c-success); }
.info-box--warning { --box-tone: var(--c-warning); }
.info-box--note { --box-tone: var(--c-accent); }
.info-box .info-box__title, .info-box__title {
	align-items: center; color: var(--c-text); display: flex; font-family: var(--font-body); font-size: var(--step-n1); font-weight: 750; gap: 8px; letter-spacing: .02em; margin: 0 0 8px;
}
.info-box__title svg { color: var(--box-tone); height: 18px; width: 18px; }
.info-box__body { font-size: var(--step-n1); line-height: 1.6; }
.info-box__body > * + * { margin-top: .75em; }
.info-box__body > :first-child { margin-top: 0; }
.info-box__body ul, .info-box__body ol { padding-left: 1.2em; }
textarea.info-box__title { background: transparent; border: 0; padding: 0; resize: none; width: 100%; }

/* ---------------------------------------------------------------------------
 * Responsible gambling notice
 * ------------------------------------------------------------------------ */

.rg-notice { align-items: flex-start; background: var(--c-surface); border: var(--line); border-radius: var(--radius-card); display: flex; gap: 16px; padding: clamp(16px, 2.4vw, 22px); }
.rg-notice__badge {
	align-items: center; border: 2px solid var(--c-accent); border-radius: 50%; color: var(--c-accent-text); display: inline-flex; flex: none; font-family: var(--font-numeric);
	font-size: var(--step-n1); font-weight: 650; height: 48px; justify-content: center; width: 48px;
}
.rg-notice__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rg-notice__title { color: var(--c-text); font-weight: 700; }
.rg-notice__text { color: var(--c-text-secondary); font-size: var(--step-n1); }
.rg-notice__age { color: var(--c-text-muted); font-size: var(--step-n2); }
.rg-notice .rg-notice__resources { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; margin: 4px 0 0; padding: 0; }
.rg-notice .rg-notice__resources li { margin: 0; }
.rg-notice__resources a { align-items: center; color: var(--c-text); display: inline-flex; font-size: var(--step-n1); font-weight: 650; gap: 5px; text-decoration-color: var(--c-accent); }
.rg-notice__resources svg { color: var(--c-accent); height: 13px; width: 13px; }
.rg-notice--full .rg-notice__resources { display: grid; gap: 10px; }
.rg-notice--full .rg-notice__resources li { border-top: var(--line); display: flex; flex-direction: column; padding-top: 10px; }
.rg-notice--full .rg-notice__resources span { color: var(--c-text-muted); font-size: var(--step-n1); }

/* ---------------------------------------------------------------------------
 * FAQ (blocks and homepage section share .faq)
 * ------------------------------------------------------------------------ */

.faq-block .faq-block__title { font-size: var(--step-3); margin: 0 0 12px; }
.faq-block .faq__a > * + * { margin-top: .8em; }
.prose .faq__q { color: var(--c-text); }

/* ---------------------------------------------------------------------------
 * Related articles block
 * ------------------------------------------------------------------------ */

.related-block .related-block__title { font-size: var(--step-2); margin: 0 0 18px; }
.post-grid--compact { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
.post-grid--compact .post-card__title { font-size: var(--step-0); }
.related-block--list .post-list .post-card { padding: 16px 0; }

/* ---------------------------------------------------------------------------
 * Expert quote
 * ------------------------------------------------------------------------ */

.expert-quote { border-top: 1px solid var(--c-accent); padding-top: 20px; position: relative; }
.expert-quote__mark { color: var(--c-accent); height: 34px; margin-bottom: 8px; width: 34px; }
.expert-quote .expert-quote__text { border: 0; color: var(--c-text); font-family: var(--font-heading); font-size: var(--step-2); font-style: italic; letter-spacing: -.01em; line-height: 1.35; margin: 0; padding: 0; }
.expert-quote__by { align-items: center; display: flex; gap: 14px; margin-top: 18px; }
.expert-quote .expert-quote__img { border-radius: 50%; flex: none; height: 52px; object-fit: cover; width: 52px; }
.expert-quote__who { display: flex; flex-direction: column; font-size: var(--step-n1); line-height: 1.4; }
.expert-quote__name { color: var(--c-text); font-weight: 700; }
.expert-quote__role, .expert-quote__source { color: var(--c-text-muted); }
.expert-quote__source a { color: inherit; }

/* ---------------------------------------------------------------------------
 * Source references
 * ------------------------------------------------------------------------ */

.sources { border-top: var(--line); padding-top: 18px; }
.sources .sources__title { font-family: var(--font-body); font-size: var(--step-n1); font-weight: 750; letter-spacing: .12em; margin: 0 0 12px; text-transform: uppercase; }
.sources ol.sources__list { counter-reset: none; font-size: var(--step-n1); list-style: decimal; margin: 0; padding-left: 1.6em; }
.sources .sources__item { margin: 0; padding: 6px 6px 6px 4px; }
.sources__item::marker { color: var(--c-text-muted); font-family: var(--font-numeric); }
.sources__ref { color: var(--c-text); }
.sources__ref a { color: var(--c-link); }
.sources__meta, .sources__note { color: var(--c-text-muted); display: block; font-size: var(--step-n2); }

/* ---------------------------------------------------------------------------
 * CTA block (shares .cta-panel with the homepage section)
 * ------------------------------------------------------------------------ */

.cta-block { padding: clamp(22px, 4vw, 40px); }
.cta-block .cta-block__title { font-family: var(--font-heading); font-size: var(--step-3); line-height: 1.12; margin: 0; }
.cta-block .cta-panel__intro { font-size: var(--step-0); margin-top: 10px; }
.cta-block .eyebrow { margin-bottom: .6rem; }
@media (min-width: 900px) { .prose .cta-block, .article-main .cta-block { grid-template-columns: 1fr; } }
.sponsored-label { align-self: center; border: 1px solid currentColor; border-radius: 4px; color: var(--c-text-muted); font-size: var(--step-n2); font-weight: 700; letter-spacing: .08em; padding: .1em .45em; text-transform: uppercase; }
.cta-panel--accent .sponsored-label { color: inherit; }

/* ---------------------------------------------------------------------------
 * Section navigation
 * ------------------------------------------------------------------------ */

.section-nav { background: var(--c-bg-alt); border: var(--line); border-radius: var(--radius-card); padding: 16px 18px; }
.section-nav .section-nav__title { align-items: center; color: var(--c-text-muted); display: flex; font-size: var(--step-n2); font-weight: 700; gap: 8px; letter-spacing: .12em; margin: 0 0 10px; text-transform: uppercase; }
.section-nav__title svg { color: var(--c-accent); height: 16px; width: 16px; }
.section-nav .section-nav__list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.section-nav .section-nav__list li { margin: 0; }
.section-nav__link {
	background: var(--c-surface); border: var(--line); border-radius: 999px; color: var(--c-text); display: inline-flex; font-size: var(--step-n1); font-weight: 550;
	min-height: 36px; align-items: center; padding: .3em .9em; text-decoration: none; transition: border-color var(--dur) var(--ease), background-color var(--dur) var(--ease);
}
.prose .section-nav__link { color: var(--c-text); text-decoration: none; }
.section-nav__link:hover { background: var(--c-accent-soft); border-color: color-mix(in srgb, var(--c-accent) 60%, transparent); }

/* ---------------------------------------------------------------------------
 * Methodology summary
 * ------------------------------------------------------------------------ */

.method-block { background: var(--c-surface); border: var(--line); border-radius: var(--radius-lg); padding: clamp(20px, 3.4vw, 34px); }
.method-block .method-block__title { font-size: var(--step-3); margin: 0; }
.method-block__intro { color: var(--c-text-secondary); margin-top: 10px; }
.method-block ol.method-block__steps { counter-reset: none; display: grid; gap: 16px; list-style: none; margin: 22px 0 0; padding: 0; }
@media (min-width: 768px) { .method-block .method-block__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.method-block .method-block__step { display: flex; gap: 14px; margin: 0; }
.method-block__num {
	align-items: center; border: 1px solid var(--c-accent); border-radius: 50%; color: var(--c-accent-text); display: inline-flex; flex: none; font-family: var(--font-numeric);
	font-size: var(--step-n1); font-weight: 600; height: 34px; justify-content: center; width: 34px;
}
.method-block__step-title { color: var(--c-text); font-weight: 700; }
.method-block__step-text { color: var(--c-text-secondary); font-size: var(--step-n1); line-height: 1.55; }
.method-block__foot { align-items: center; border-top: var(--line); color: var(--c-text-muted); display: flex; flex-wrap: wrap; font-size: var(--step-n1); gap: 10px 24px; justify-content: space-between; margin-top: 22px; padding-top: 16px; }
.method-block__foot span { align-items: flex-start; display: inline-flex; gap: 8px; }
.method-block__foot svg { height: 16px; margin-top: 3px; width: 16px; }
.prose .method-block .link-arrow { color: var(--c-text); text-decoration: none; }

/* Plain fallback when no theme template exists. */
.cno-block { border: var(--line); border-radius: var(--radius-card); padding: 16px 18px; }

/* ---------------------------------------------------------------------------
 * Casinos (milestone 3): logo, score, cards, lists, review, comparison
 * ------------------------------------------------------------------------ */

.casino-logo {
	align-items: center; background: var(--brand, var(--c-navy)); border: 1px solid color-mix(in srgb, var(--c-text) 10%, transparent); border-radius: 14px;
	display: inline-flex; flex: none; height: 64px; justify-content: center; overflow: hidden; padding: 8px; width: 96px;
}
.casino-logo--sm { border-radius: 10px; height: 40px; padding: 5px; width: 60px; }
.casino-logo--lg { border-radius: 18px; height: 88px; padding: 10px; width: 132px; }
.casino-logo__img { height: 100%; max-height: 100%; object-fit: contain; width: 100%; }
.casino-logo__initials { color: #fff; font-family: var(--font-heading); font-size: 1.35em; font-weight: 600; letter-spacing: .02em; }
.casino-logo--sm .casino-logo__initials { font-size: .95em; }

.score { align-items: baseline; color: var(--c-text); display: inline-flex; font-family: var(--font-numeric); font-variant-numeric: tabular-nums; gap: 2px; white-space: nowrap; }
.score__value { font-size: 1.15em; font-weight: 700; }
.score__max { color: var(--c-text-muted); font-size: .8em; }
.score--sm { background: var(--c-accent-soft); border-radius: 999px; font-size: var(--step-n1); padding: .15em .6em; }
.score--md { font-size: var(--step-1); }
.score--lg {
	align-items: center; background: conic-gradient(var(--c-accent) calc(var(--score, 0) * 360deg), var(--c-border) 0); border-radius: 50%; height: 76px;
	justify-content: center; margin-top: 10px; position: relative; width: 76px;
}
.score--lg::before { background: var(--c-bg); border-radius: 50%; content: ""; inset: 5px; position: absolute; }
.score--lg > * { position: relative; }
.score--lg .score__value { font-size: var(--step-2); }
.score--none { color: var(--c-text-muted); font-family: var(--font-body); font-size: var(--step-n1); }
.score--lg.score--none { background: none; height: auto; width: auto; }
.score--lg.score--none::before { content: none; }

.terms-line { color: var(--c-text-muted); font-size: var(--step-n2); line-height: 1.45; margin: 8px 0 0; }
.check { align-items: flex-start; color: var(--c-text-muted); display: inline-flex; font-size: var(--step-n2); gap: 5px; line-height: 1.4; }
.check svg { flex: none; height: 14px; margin-top: 1px; width: 14px; }
.check--ok svg { color: var(--c-success); }
.check--stale { color: var(--c-warning); }
.check a { color: inherit; }
.casino-notice { align-items: flex-start; background: color-mix(in srgb, var(--c-warning) 10%, var(--c-surface)); border: 1px solid color-mix(in srgb, var(--c-warning) 35%, var(--c-border)); border-radius: 10px; color: var(--c-text-secondary); display: flex; font-size: var(--step-n1); gap: 8px; margin: 0; padding: 10px 12px; }
.casino-notice svg { color: var(--c-warning); flex: none; height: 18px; margin-top: 2px; width: 18px; }

/* Card */
.casino-list { counter-reset: none; display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
.prose .casino-list, .prose ol.casino-list { list-style: none; padding: 0; }
.casino-list > li { margin: 0; }
.casino-card {
	background: var(--c-surface); border: var(--line); border-radius: var(--radius-card); display: grid; gap: 14px 20px; grid-template-areas: "brand" "body" "actions" "foot";
	padding: clamp(16px, 2.4vw, 22px); position: relative;
}
.casino-card.has-rank { padding-top: clamp(22px, 3vw, 26px); }
.casino-card__rank {
	align-items: center; background: var(--c-accent); border-radius: 0 0 10px 10px; color: var(--c-on-accent); display: inline-flex; font-family: var(--font-numeric); font-size: var(--step-n1);
	font-weight: 700; height: 26px; justify-content: center; left: 16px; min-width: 30px; padding: 0 8px; position: absolute; top: -1px;
}
.casino-card__brand { align-items: center; display: flex; gap: 14px; grid-area: brand; min-width: 0; }
.casino-card__id { display: flex; flex-direction: column; gap: 6px; min-width: 0; align-items: flex-start; }
.casino-card .casino-card__name { font-size: var(--step-1); line-height: 1.2; margin: 0; }
.casino-card__name a { color: var(--c-text); text-decoration: none; }
.casino-card__name a:hover { text-decoration: underline; text-decoration-color: var(--c-accent); }
.casino-card__body { display: flex; flex-direction: column; gap: 8px; grid-area: body; min-width: 0; }
.casino-card__offer { color: var(--c-text); font-weight: 650; line-height: 1.35; margin: 0; }
.casino-card__terms { color: var(--c-text-muted); font-size: var(--step-n2); margin: 0; }
.casino-card ul.casino-card__pros { display: grid; gap: 4px; list-style: none; margin: 0; padding: 0; }
.casino-card__pros li { align-items: flex-start; color: var(--c-text-secondary); display: flex; font-size: var(--step-n1); gap: 6px; margin: 0; }
.casino-card__pros svg { color: var(--c-success); flex: none; height: 16px; margin-top: 3px; width: 16px; }
.casino-card__actions { align-items: stretch; display: flex; flex-direction: column; gap: 10px; grid-area: actions; justify-content: center; }
.casino-card__actions .btn { width: 100%; }
.casino-card__review { align-self: center; font-size: var(--step-n1); }
.prose .casino-card__review { color: var(--c-text); text-decoration: none; }
.casino-card__foot { border-top: var(--line); grid-area: foot; padding-top: 10px; }
.casino-card__foot .terms-line { margin: 0; }
@media (min-width: 768px) {
	.casino-card { align-items: center; grid-template-areas: "brand body actions" "foot foot foot"; grid-template-columns: minmax(200px, 1fr) minmax(0, 1.4fr) minmax(170px, 210px); }
}
.article-main .casino-card, .prose .casino-card { grid-template-areas: "brand" "body" "actions" "foot"; grid-template-columns: 1fr; }
@media (min-width: 600px) {
	.article-main .casino-card, .prose .casino-card { grid-template-areas: "brand actions" "body body" "foot foot"; grid-template-columns: minmax(0, 1fr) minmax(170px, 200px); }
}

/* Toplist, comparison and featured blocks */
.toplist-block .toplist-block__title, .compare-block .compare-block__title { font-size: var(--step-3); margin: 0 0 10px; }
.toplist-block__intro { color: var(--c-text-secondary); margin: 0 0 12px; }
.toplist-block > .ad-disclosure, .section--toplist .ad-disclosure { border: 0; margin-bottom: 14px; padding-bottom: 0; }
.featured-review .casino-card { box-shadow: var(--shadow-md); }
.compare__table { min-width: 560px; }
.compare__table th, .compare__table td { vertical-align: middle; }
.compare__table thead th { text-transform: none; letter-spacing: 0; font-size: var(--step-n1); }
.compare__head { align-items: center; display: flex; flex-direction: column; gap: 8px; text-align: center; }
.compare__head a { color: var(--c-text); font-weight: 700; text-decoration: none; }
.compare__table tbody th { white-space: nowrap; }
.compare + .terms-line { margin-top: 10px; }

/* Review */
.review-hero { border-bottom: var(--line); padding-block: clamp(24px, 4vw, 56px) clamp(24px, 3.5vw, 40px); position: relative; }
.review-hero::before { background: radial-gradient(45% 80% at 90% 0%, color-mix(in srgb, var(--c-accent) calc(var(--glow-strength) * 12%), transparent), transparent 70%); content: ""; inset: 0; pointer-events: none; position: absolute; z-index: -1; }
.review-hero__grid { display: grid; gap: 24px clamp(28px, 4vw, 56px); }
@media (min-width: 1024px) { .review-hero__grid { align-items: start; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); } }
.review-hero__brand { align-items: center; display: flex; flex-wrap: wrap; gap: 18px 22px; }
.review-hero__title { font-size: var(--step-5); }
.review-hero__intro { color: var(--c-text-secondary); font-size: var(--step-1); line-height: 1.55; margin-top: 16px; max-width: 60ch; }
.review-offer { background: var(--c-surface); border: var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); display: flex; flex-direction: column; gap: 10px; padding: clamp(18px, 2.4vw, 24px); position: relative; }
.review-offer::before { background: linear-gradient(90deg, var(--c-accent), transparent); border-radius: var(--radius-lg) var(--radius-lg) 0 0; content: ""; height: 2px; left: 20px; position: absolute; right: 20px; top: -1px; }
.review-offer__label { color: var(--c-text-muted); font-size: var(--step-n2); font-weight: 700; letter-spacing: .12em; margin: 0; text-transform: uppercase; }
.review-offer__title { color: var(--c-text); font-family: var(--font-heading); font-size: var(--step-2); line-height: 1.2; margin: 0; }
.review-offer__terms { color: var(--c-text-secondary); font-size: var(--step-n1); margin: 0; }
.review-offer__meta { display: grid; gap: 6px; list-style: none; margin: 4px 0; padding: 0; }
.review-offer__meta li { border-top: var(--line); display: flex; font-size: var(--step-n1); gap: 12px; justify-content: space-between; padding-top: 6px; }
.review-offer__meta span { color: var(--c-text-muted); }
.review-offer__meta strong { color: var(--c-text); text-align: right; }
.review-offer__check { margin: 0; }
.review-offer .terms-line { margin: 0; }
.entry--review .byline { margin-top: 20px; }

.review-verdict__text { color: var(--c-text); font-size: var(--step-1); line-height: 1.55; }
.proscons { display: grid; gap: 14px; margin-top: 18px; }
@media (min-width: 600px) { .proscons { grid-template-columns: 1fr 1fr; } }
.proscons__col { background: var(--c-surface); border: var(--line); border-radius: var(--radius-card); padding: 16px 18px; }
.prose .proscons__col ul { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.proscons__col li { align-items: flex-start; display: flex; font-size: var(--step-n1); gap: 8px; margin: 0; }
.proscons__col svg { flex: none; height: 16px; margin-top: 4px; width: 16px; }
.proscons__col--pros svg { color: var(--c-success); }
.proscons__col--cons svg { color: var(--c-error); }
.proscons__title { color: var(--c-text); font-weight: 700; margin: 0 0 10px; }

.prose ul.score-rows { display: grid; gap: 16px; list-style: none; padding: 0; }
.score-row { margin: 0; }
.score-row__head { align-items: baseline; display: flex; gap: 12px; justify-content: space-between; }
.score-row__label { color: var(--c-text); font-weight: 650; }
.score-row__value { color: var(--c-text-secondary); font-family: var(--font-numeric); font-size: var(--step-n1); white-space: nowrap; }
.score-row__bar { background: var(--c-border); border-radius: 4px; display: block; height: 6px; margin-top: 6px; overflow: hidden; }
.score-row__bar span { background: linear-gradient(90deg, var(--c-accent-strong, var(--c-accent)), var(--c-accent)); display: block; height: 100%; width: var(--w); }
.score-row__reason { color: var(--c-text-secondary); font-size: var(--step-n1); margin: 6px 0 0; }

.review-facts__check { margin-top: 10px; }
.facts { border: var(--line); border-radius: var(--radius-card); margin: 0; overflow: hidden; }
.facts__row { border-top: var(--line); display: grid; gap: 4px 16px; grid-template-columns: minmax(130px, 40%) 1fr; padding: 10px 14px; }
.facts__row:first-child { border-top: 0; }
.facts dt { color: var(--c-text-muted); font-size: var(--step-n1); }
.facts dd { color: var(--c-text); font-size: var(--step-n1); margin: 0; }
.facts--inline { background: var(--c-surface); margin-top: 20px; }
@media (max-width: 479px) { .facts__row { grid-template-columns: 1fr; } }

.prose ul.checklog__list { display: grid; gap: 0; list-style: none; padding: 0; border: var(--line); border-radius: var(--radius-card); }
.checklog__list li { align-items: baseline; border-top: var(--line); display: flex; flex-wrap: wrap; gap: 4px 14px; justify-content: space-between; margin: 0; padding: 10px 14px; }
.checklog__list li:first-child { border-top: 0; }
.checklog__group { color: var(--c-text); font-size: var(--step-n1); font-weight: 650; }
.checklog__note { color: var(--c-text-muted); flex-basis: 100%; font-size: var(--step-n2); }

.review-stickybar {
	align-items: center; background: color-mix(in srgb, var(--c-bg) 94%, transparent); border-top: var(--line); bottom: 0; box-shadow: 0 -8px 24px -12px rgb(0 0 0 / .35); display: flex; gap: 12px;
	left: 0; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); position: fixed; right: 0; z-index: 40;
}
.review-stickybar[hidden] { display: none; }
.review-stickybar__name { color: var(--c-text); flex: 1; font-weight: 650; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-stickybar .btn { flex: none; }
@media (min-width: 1024px) { .review-stickybar { display: none !important; } }

/* Archive filter, payment pages */
.casino-filter { align-items: end; background: var(--c-surface); border: var(--line); border-radius: var(--radius-card); display: flex; flex-wrap: wrap; gap: 12px 16px; margin-bottom: 20px; padding: 14px 16px; }
.casino-filter__field { display: flex; flex: 1 1 180px; flex-direction: column; font-size: var(--step-n2); font-weight: 700; gap: 6px; letter-spacing: .06em; text-transform: uppercase; color: var(--c-text-muted); }
.casino-filter select { -webkit-appearance: none; appearance: none; background: var(--c-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a9bb8' stroke-width='2'%3E%3Cpath d='m6.5 9.5 5.5 5.5 5.5-5.5'/%3E%3C/svg%3E") no-repeat right 10px center / 16px; border: var(--line); border-radius: 10px; color: var(--c-text); font-size: max(16px, var(--step-n1)); font-weight: 500; letter-spacing: 0; min-height: 44px; padding: 0 36px 0 12px; text-transform: none; }
.casino-filter .btn { min-height: 44px; }
.archive-hero + .section .ad-disclosure { margin-bottom: 14px; border: 0; padding-bottom: 0; }

.payment-hero { align-items: center; display: flex; gap: 16px; }
.payment-logo { align-items: center; background: var(--c-surface-raised); border: var(--line); border-radius: 12px; color: var(--c-text); display: inline-flex; flex: none; font-family: var(--font-numeric); font-weight: 700; height: 56px; justify-content: center; overflow: hidden; width: 56px; }
.payment-logo__img { height: 100%; object-fit: contain; padding: 6px; width: 100%; }
.payment-grid { display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); list-style: none; margin: 0; padding: 0; }
.payment-tile { align-items: center; display: grid; gap: 4px 14px; grid-template-columns: auto 1fr; padding: 16px; }
.payment-tile .payment-logo { grid-row: span 2; height: 48px; width: 48px; }
.payment-tile__name { color: var(--c-text); font-weight: 700; text-decoration: none; }
.payment-tile__meta { color: var(--c-text-muted); font-size: var(--step-n2); }

/* Generated review sections inside prose */
.prose > section > * + *, .prose > .review-text > * + * { margin-top: 1em; }
.prose > section > h2 + * { margin-top: .9em; }
.prose > .review-text > :first-child { margin-top: 0; }
.prose .chips li { margin: 0; }
.prose a.chip { color: var(--c-text); text-decoration: none; }
.score--lg .score__value { font-size: var(--step-1); }
.score--lg .score__max { font-size: .62em; }

/* Toplist with tabs (homepage section) */
.toplist-tabs__list {
	display: flex; gap: 6px; margin: 0 calc(-1 * var(--gutter)) 18px; overflow-x: auto; padding: 4px var(--gutter) 8px; scroll-padding-inline: var(--gutter); scrollbar-width: none;
}
.toplist-tabs__list::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .toplist-tabs__list { flex-wrap: wrap; margin-inline: 0; overflow: visible; padding-inline: 0; } }
.toplist-tabs__tab {
	align-items: center; background: var(--c-surface); border: var(--line); border-radius: 999px; color: var(--c-text-secondary); cursor: pointer; display: inline-flex; flex: none;
	font-size: var(--step-n1); font-weight: 650; gap: 8px; min-height: 44px; padding: .45em 1.1em; transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), color var(--dur) var(--ease); white-space: nowrap;
}
.toplist-tabs__tab:hover { border-color: color-mix(in srgb, var(--c-accent) 55%, var(--c-border)); color: var(--c-text); }
.toplist-tabs__tab[aria-selected="true"] { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-on-accent); }
.toplist-tabs__count { background: color-mix(in srgb, currentColor 14%, transparent); border-radius: 999px; font-family: var(--font-numeric); font-size: var(--step-n2); min-width: 1.6em; padding: .05em .45em; text-align: center; }
.toplist-tabs__panel:focus-visible { border-radius: var(--radius-card); box-shadow: var(--focus); outline: none; }
.toplist-tabs__panel[hidden] { display: none; }
.toplist-tabs__heading { font-size: var(--step-2); margin: 0 0 12px; }
.toplist-tabs__panel + .toplist-tabs__panel { margin-top: 28px; }
.toplist-tabs:not([data-tabs-ready]) .toplist-tabs__list { display: none; }
.toplist-tabs[data-tabs-ready] .toplist-tabs__heading { display: none; }
.toplist-tabs[data-tabs-ready] .toplist-tabs__panel + .toplist-tabs__panel { margin-top: 0; }
.section--toplist-tabs .ad-disclosure { border: 0; margin-bottom: 14px; padding-bottom: 0; }

/* Public casino guide (AI) */
.ai-guide { background: var(--c-surface); border: var(--line); border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 16px; padding: clamp(18px, 3vw, 30px); }
.ai-guide__head { align-items: flex-start; display: flex; gap: 14px; }
.ai-guide__icon { align-items: center; background: var(--c-accent-soft); border-radius: 12px; color: var(--c-accent-text); display: inline-flex; flex: none; height: 44px; justify-content: center; width: 44px; }
.ai-guide__icon svg { height: 22px; width: 22px; }
.ai-guide .ai-guide__title { font-size: var(--step-2); margin: 0; }
.ai-guide__intro { color: var(--c-text-secondary); font-size: var(--step-n1); margin: 4px 0 0; }
.ai-guide__form { align-items: stretch; display: flex; flex-wrap: wrap; gap: 10px; }
.ai-guide__input {
	background: var(--c-bg); border: var(--line); border-radius: var(--radius-card); color: var(--c-text); flex: 1 1 260px; font: inherit; font-size: max(16px, var(--step-0)); min-height: 54px; padding: 12px 14px; resize: vertical;
}
.ai-guide__input:focus { border-color: var(--c-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-accent) 22%, transparent); outline: none; }
.ai-guide__submit { align-self: flex-end; }
.ai-guide__submit[disabled] { opacity: .6; }
.ai-guide__answer { background: var(--c-bg-alt); border-left: 3px solid var(--c-accent); border-radius: 0 var(--radius-card) var(--radius-card) 0; color: var(--c-text); display: flex; flex-direction: column; gap: .7em; padding: 14px 16px; }
.ai-guide__answer[hidden] { display: none; }
.ai-guide__answer[aria-busy="true"] { color: var(--c-text-muted); }
.ai-guide__links { color: var(--c-text-secondary); font-size: var(--step-n1); }
.ai-guide__disclaimer { color: var(--c-text-muted); font-size: var(--step-n2); margin: 0; }