/* Mobile-first non-critical stylesheet for editorial pages and comparison cards. */
:focus-visible{outline:3px solid var(--green);outline-offset:3px}
.skip-link{position:absolute;z-index:200;top:-60px;left:12px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:8px}
.skip-link:focus{top:8px}
main.wrap{padding-top:13px;padding-bottom:34px}
section[id],h2[id],h3[id]{scroll-margin-top:80px}
.listing-section h2{font-size:19px;line-height:1.25;letter-spacing:-.02em;margin:0 0 8px}
.listing-subline{display:flex;justify-content:space-between;flex-wrap:wrap;gap:0 12px;color:var(--muted);font-size:10.5px;margin-bottom:9px}
.casino-list{display:grid;gap:10px}
.casino-card{position:relative;display:grid;gap:8px;background:var(--surface);border:1px solid #dce4e8;border-radius:15px;padding:12px;box-shadow:0 2px 14px rgb(25 40 52 / 4%)}
.card-number{position:absolute;top:12px;right:12px;color:#85929a;font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.05em}
.brand-block{display:flex;align-items:center;gap:12px;min-width:0;padding-right:25px}
.brand-logo-wrap{width:95px;min-width:95px;aspect-ratio:9/5;display:flex;align-items:center;justify-content:center;border:1px solid #e9eef1;border-radius:8px;background:#fbfcfd;position:relative;overflow:hidden}
.brand-logo{display:block;width:100%;height:100%;aspect-ratio:9/5;object-fit:contain;padding:5px}
.logo-fallback{display:none;font-size:12px;font-weight:850;text-align:center;line-height:1.15;padding:5px}
.has-fallback .brand-logo{display:none}.has-fallback .logo-fallback{display:block}
.brand-meta{min-width:0}.brand-meta h3{font-size:16px;line-height:1.15;letter-spacing:-.025em;margin:0 0 5px}
.stars{display:flex;gap:1px;color:#9aa6ae;white-space:nowrap;height:14px}
.rating-note{color:var(--muted);font-size:10px;line-height:1.15;display:block;margin-top:3px}
.bonus-block{border-top:1px solid var(--line);padding-top:9px;min-width:0}
.card-label{display:inline-block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px}
.bonus-copy{font-size:15px;font-weight:780;line-height:1.33;letter-spacing:-.015em;margin:0 0 4px}
.bonus-detail{font-size:11px;color:var(--muted);margin:0;line-height:1.3}
.casino-features{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.casino-features li{display:flex;align-items:flex-start;gap:8px;color:#42525f;font-size:12px;line-height:1.3}
.check-icon{color:#576c78;flex:none;margin-top:0}
.card-action{display:grid;gap:5px;align-content:center}
.play-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:40px;padding:10px 12px;border-radius:9px;background:var(--green);text-decoration:none;font-size:13px;font-weight:800;color:#fff;transition:background .15s ease}
.play-button:hover,.play-button:focus-visible{background:var(--green-dark)}
.action-note{text-align:center;color:var(--muted);font-size:10px;line-height:1.3}
.listing-disclaimer{color:var(--muted);font-size:11px;line-height:1.5;margin:10px 0 0}
.editorial-content{background:#fff;margin-top:22px;border-radius:15px;padding:17px 15px;border:1px solid var(--line);max-width:100%;overflow-wrap:break-word}
.editorial-content h2{font-size:22px;line-height:1.25;letter-spacing:-.02em;margin:26px 0 12px}
.editorial-content h2:first-child{margin-top:0}
.editorial-content h3{font-size:17px;line-height:1.28;letter-spacing:-.012em;margin:20px 0 9px}
.editorial-content p{font-size:14.5px;line-height:1.75;margin:0 0 13px;color:#354553}
.editorial-content ul,.editorial-content ol{font-size:14.5px;line-height:1.7;padding-left:23px;margin:8px 0 17px;color:#354553}
.editorial-content li{margin:5px 0;padding-left:2px}
/* The user's source table markup stays byte-for-byte the same; make it fit on small screens. */
.editorial-content table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-spacing:0;border-collapse:separate;border:1px solid var(--line);border-radius:11px;margin:13px 0 22px;background:#fff}
.editorial-content td,.editorial-content th{white-space:normal;min-width:115px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top;font-size:12px;line-height:1.4}
.editorial-content tr:first-child td{background:#f1f5f7;font-weight:750;color:var(--ink)}
.editorial-content td:first-child{min-width:135px}.editorial-content td:last-child{border-right:0}
.editorial-content tr:last-child td{border-bottom:0}
.editorial-content td p{font-size:inherit;line-height:inherit;margin:0;color:inherit}
.author-card{display:flex;gap:15px;align-items:flex-start;margin-top:21px;padding:20px;border:1px solid var(--line);border-radius:15px;background:#fff}
.author-monogram{flex:none;width:49px;height:49px;display:grid;place-items:center;background:#e8edf0;border-radius:13px;color:var(--ink);font-weight:850}
.author-card h2{margin:0 0 2px;font-size:20px}.author-role{font-weight:650;color:var(--muted);font-size:12px;margin:0 0 8px}
.author-card p:not(.author-role){font-size:13.5px;line-height:1.65;margin:0;color:#455561}
.site-information{margin-top:26px}.site-information h2{font-size:22px;margin:0 0 12px;letter-spacing:-.02em}
.info-grid{display:grid;grid-template-columns:1fr;gap:9px}
.info-tile{background:#fff;border:1px solid var(--line);padding:15px;border-radius:11px;min-width:0;overflow-wrap:anywhere}
.info-tile h3{font-size:14px;line-height:1.3;margin:0 0 7px}
.info-tile p{color:#536473;font-size:12.5px;line-height:1.6;margin:0}
.info-tile a{color:var(--ink);text-decoration-thickness:1px;text-underline-offset:2px}
.site-footer{border-top:1px solid #d9e1e5;background:#eef2f4;padding:24px 0 19px}
.footer-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px}
.footer-brand .site-logo{width:177px}
.adm-link{display:flex;align-items:center;gap:9px;text-decoration:none;color:#52626f}
.adm-symbol{width:67px;height:27px}
.adm-link span{font-size:10px;max-width:130px;line-height:1.2}
.responsible-warning{font-size:12px;line-height:1.6;color:#354553;margin:16px 0 13px;max-width:900px}
.responsible-warning a{color:inherit;text-underline-offset:2px}
.footer-links{display:flex;flex-wrap:wrap;gap:9px 16px;border-top:1px solid #d5dee3;padding-top:15px}
.footer-links a{font-size:11.5px;color:#42535f;text-decoration:none}.footer-links a:hover,.footer-links a:focus-visible{color:var(--green);text-decoration:underline}
.footer-end{font-size:11px;margin:17px 0 0;color:#687784}
@media(min-width:600px){
 .casino-card{grid-template-columns:1fr 1fr;column-gap:15px;padding:15px}
 .brand-block{grid-column:1}.bonus-block{grid-column:2;grid-row:1;border-top:0;padding-top:0;padding-right:15px}
 .casino-features{grid-column:1}.card-action{grid-column:2;align-self:center}
 .info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .editorial-content{padding:24px}
}
@media(min-width:1000px){
 main.wrap{padding-top:27px;padding-bottom:60px}
 section[id],h2[id],h3[id]{scroll-margin-top:98px}
 .listing-section h2{font-size:25px;margin-bottom:8px}
 .listing-subline{font-size:12px;margin-bottom:16px}
 .casino-list{gap:11px}
 .casino-card{grid-template-columns:34px minmax(180px,1.1fr) minmax(210px,1.25fr) minmax(225px,1.2fr) minmax(155px,.85fr);gap:14px;align-items:center;padding:18px 18px 18px 15px}
 .card-number{position:static;grid-column:1;grid-row:1;align-self:start;margin-top:5px;font-size:13px}
 .brand-block{grid-column:2;grid-row:1;gap:11px;padding-right:0}
 .brand-logo-wrap{width:91px;min-width:91px}
 .brand-meta h3{font-size:15px}
 .bonus-block{grid-column:3;grid-row:1;border:0;padding:0}
 .bonus-copy{font-size:15px}.bonus-detail{font-size:11px}
 .casino-features{grid-column:4;grid-row:1;gap:8px}.casino-features li{font-size:12px}
 .card-action{grid-column:5;grid-row:1;align-self:center}
 .play-button{min-height:43px}.listing-disclaimer{font-size:12px}
 .editorial-content{padding:38px 50px;margin-top:35px}
 .editorial-content h2{font-size:27px;margin-top:33px}.editorial-content h3{font-size:20px}
 .editorial-content p,.editorial-content ul,.editorial-content ol{font-size:16px}
 .editorial-content table{display:table;width:100%;table-layout:auto}
 .editorial-content td,.editorial-content th{min-width:0;font-size:12px}
 .editorial-content td:first-child{min-width:0}
 .author-card{padding:25px 30px;gap:22px;margin-top:29px}
 .site-information{margin-top:33px}.site-information h2{font-size:26px;margin-bottom:15px}
 .info-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
 .info-tile{padding:17px}.info-tile h3{font-size:15px}
 .site-footer{padding:32px 0 25px}.responsible-warning{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.play-button{transition:none}}

/* Contextual interlinking shared between the home and bonus guides. */
.related-resource{border:1px solid #d6e3dd;border-left:3px solid var(--green);background:#f7faf8;border-radius:10px;padding:13px 15px;margin:24px 0}
.related-resource .related-label{font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--green)}
.editorial-content .related-resource p{margin:5px 0 0;font-size:14px;line-height:1.55}
.related-resource a{font-weight:750;text-underline-offset:3px;color:var(--ink)}
.related-resource a:hover{color:var(--green)}
.footer-guide-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:7px 19px;border-top:1px solid #d5dee3;margin-top:17px;padding:13px 0;font-size:12px}
.footer-guide-links strong{font-size:12px;color:var(--ink)}
.footer-guide-links a{font-size:12px;color:#42535f;text-decoration:none;text-underline-offset:3px}
.footer-guide-links a:hover,.footer-guide-links a:focus-visible{color:var(--green);text-decoration:underline}
.footer-guide-links a[aria-current="page"]{color:var(--green);font-weight:750}
/* Accessible table overflow on small screens without viewport-wide horizontal scrolling. */
.editorial-content table{max-width:100%}
.editorial-content th{background:#f1f5f7;font-weight:750}
@media(min-width:600px){.footer-guide-links{gap:12px 22px}.related-resource{padding:16px 19px}}

/* In-article brand visuals, loaded lazily after each complete brand description. */
.editorial-content .casino-content-figure{
  width:100%;max-width:860px;margin:16px 0 28px;
  overflow:hidden;border:1px solid var(--line);border-radius:12px;
  background:#f7f9fa;
}
.editorial-content .casino-content-figure img{
  display:block;width:100%;height:auto;aspect-ratio:16/9;
  object-fit:contain;
}
@media(min-width:760px){
  .editorial-content .casino-content-figure{margin:20px 0 34px}
}

/* Mobile containment fallback (also included in critical CSS in each page). */
html,body{max-width:100%;overflow-x:clip}
.wrap,main.wrap,.editorial-content{min-width:0;max-width:100%}
.editorial-content .casino-content-figure{display:block;box-sizing:border-box;width:100%;max-width:min(100%,860px);margin:16px 0 28px;overflow:hidden}
.editorial-content .casino-content-figure img{display:block;box-sizing:border-box;width:100%;max-width:100%;height:auto;object-fit:contain;aspect-ratio:auto}
@media(max-width:759.98px){
 body{padding-top:59px}
 header.site-header{position:fixed;inset:0 0 auto 0;width:100%;z-index:1100}
 header.site-header .header-inner{width:100%;max-width:100%;min-width:0}
 header.site-header .logo-link{max-width:48%;min-width:0}
 header.site-header .site-cta{max-width:52%}
}


/* Layout correction v3: a single constrained column; no page-wide horizontal scroll. */
.listing-section,.casino-list,.editorial-content,.author-card,.site-information,.info-grid,.info-tile,.site-footer{min-width:0;max-width:100%}
.casino-list{grid-template-columns:minmax(0,1fr)}
.casino-card,.brand-block,.bonus-block,.casino-features,.card-action{min-width:0;max-width:100%}
.casino-card{grid-template-columns:minmax(0,1fr)}
.listing-section h2,.editorial-content h2,.editorial-content h3,.editorial-content p,.hero h1,.hero p{max-width:100%;overflow-wrap:break-word}
.editorial-content img,.editorial-content svg{max-width:100%}
.editorial-content .casino-content-figure{width:100%;max-width:100%;overflow:hidden}
.editorial-content .casino-content-figure img{display:block;width:100%;max-width:100%;height:auto}
@media(min-width:600px) and (max-width:999.98px){
 .casino-card{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:1000px){
 .casino-card{grid-template-columns:34px minmax(180px,1.1fr) minmax(210px,1.25fr) minmax(225px,1.2fr) minmax(155px,.85fr)}
}
/* Reinstate gutters after the legacy fixed-header fallback, which set width:100%. */
@media(max-width:759.98px){
 header.site-header .header-inner{width:calc(100% - 32px);max-width:1120px;margin-inline:auto;gap:9px}
 header.site-header .logo-link{max-width:none;min-width:0;flex:0 1 auto}
 header.site-header .site-logo{width:clamp(128px,41vw,174px);height:auto;max-width:100%}
 header.site-header .site-cta{max-width:calc(100% - 144px);min-width:0;flex:0 0 auto;padding:10px 11px;font-size:11.5px}
}
@media(max-width:350px){
 header.site-header .header-inner{gap:7px}
 header.site-header .site-logo{width:128px}
 header.site-header .site-cta{max-width:calc(100% - 135px);padding:9px;font-size:11px;gap:4px}
 header.site-header .site-cta svg{width:14px;height:14px}
}
