:root {
  color-scheme: light;
  --ink: #1c2426;
  --muted: #4e5a5a;
  --paper: #f6f5ef;
  --surface: #fffefa;
  --line: #d6d7cd;
  --accent: #bd4f35;
  --accent-dark: #8e3525;
  --deep: #243c3b;
  --gold: #e6bc65;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 400 16px/1.66 Arial, Helvetica, sans-serif;
}
a { color: inherit; }
button { font: inherit; }
img { max-width: 100%; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.shell { width: min(100% - 48px, 1250px); margin-inline: auto; }
.skip-link { position: absolute; top: -80px; left: 16px; z-index: 10; padding: 10px 16px; background: #fff; }
.skip-link:focus { top: 10px; }
.site-header {
  position: sticky; top: 0; z-index: 5;
  border-bottom: 1px solid var(--line);
  background: rgba(246,245,239,.97);
  backdrop-filter: blur(12px);
}
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); font-size: 16px; font-weight: 900; line-height: 1.02; letter-spacing: -.035em; text-decoration: none; }
.brand img { display: block; width: 250px; height: auto; }
.brand-mark {
  display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px;
  border-radius: 50% 50% 7px 7px; background: var(--accent); color: #fff;
  font: 900 16px/1 Arial, Helvetica, sans-serif; letter-spacing: -.12em; transform: rotate(-5deg);
  box-shadow: 3px 3px 0 var(--ink);
}
.brand-accent { color: var(--accent); }
.desktop-nav { display: flex; gap: 31px; font-size: 14px; font-weight: 750; }
.desktop-nav a, .mobile-nav a { text-decoration: none; }
.desktop-nav a:hover, .mobile-nav a:hover { color: var(--accent); }
.menu-button, .mobile-nav { display: none; }
.hero-grid { padding: 58px 0 43px; border-bottom: 2px solid var(--ink); }
.eyebrow { margin-bottom: 17px; color: var(--accent-dark); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.eyebrow-separator { margin-inline: 6px; color: #8c9188; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3 { font-family: Arial, Helvetica, sans-serif; }
h1 { max-width: 1050px; margin-bottom: 18px; font-size: clamp(1.85rem, 2.8vw, 2.75rem); line-height: 1.18; letter-spacing: -.035em; font-weight: 700; }
h1 em { font-style: normal; color: var(--accent); }
h1 .js-current-month { color: var(--deep); white-space: nowrap; }
.hero-intro { max-width: 1100px; margin-bottom: 23px; font-size: 17px; line-height: 1.72; }
.hero-intro strong { color: var(--accent-dark); }
.hero-cta, .visit-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 22px;
  min-height: 48px; padding: 10px 21px; background: var(--accent); border: 1px solid var(--accent-dark);
  border-radius: 2px; color: #fff; font-size: 15px; font-weight: 800; text-decoration: none;
  box-shadow: 4px 4px 0 var(--ink); transition: transform .16s ease, box-shadow .16s ease;
}
.hero-cta:hover, .visit-button:hover { transform: translate(2px,2px); box-shadow: 2px 2px 0 var(--ink); background: var(--accent-dark); }
.hero-cta span, .visit-button span { font-size: 18px; font-weight: 400; }
.ranking-section { padding: 30px 0 28px; scroll-margin-top: 90px; }
.section-topline { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 10px; }
.section-topline h2 { margin: 0; font-size: clamp(1.65rem, 2.3vw, 2.25rem); }
.selection-pill { padding: 7px 13px; border: 1px solid var(--deep); border-radius: 30px; font-size: 13px; font-weight: 800; white-space: nowrap; }
.ranking-list { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.ranking-card {
  display: grid; grid-template-columns: 42px minmax(225px,1fr) minmax(290px,1.42fr) 164px;
  align-items: center; gap: 15px; min-height: 83px; padding: 10px 13px;
  border: 1px solid var(--line); background: var(--surface);
  box-shadow: 3px 3px 0 #d9d9d0;
}
.rank-number { display: grid; place-items: center; width: 42px; height: 42px; background: var(--deep); color: #fff; font: 800 14px/1 Arial,Helvetica,sans-serif; }
.casino-brand { display: flex; align-items: center; gap: 14px; min-width: 0; }
.logo-frame { display: grid; place-items: center; flex: 0 0 110px; width: 110px; height: 58px; padding: 6px; border: 1px solid var(--line); background: #fff; }
.logo-frame img { width: 100%; height: 100%; object-fit: contain; }
.casino-name { font-weight: 850; line-height: 1.2; }
.offer-panel { display: grid; gap: 3px; padding: 8px 14px; border-left: 2px solid var(--accent); background: #f2f0e7; font-size: 15px; font-weight: 700; line-height: 1.34; }
.offer-label { color: var(--accent-dark); font-size: 11px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.visit-button { justify-content: space-between; min-height: 49px; padding-inline: 15px; background: var(--deep); border-color: #132827; box-shadow: 3px 3px 0 var(--accent); white-space: nowrap; }
.visit-button:hover { background: #142d2c; box-shadow: 1px 1px 0 var(--accent); }
.brand-notes { display: grid; gap: 14px; margin: 48px 0 28px; }
.brand-notes article { padding: 23px 25px 25px; border: 1px solid var(--line); background: var(--surface); box-shadow: 5px 5px 0 #e6e4d9; }
.brand-notes article:nth-child(even) { border-left: 5px solid var(--deep); }
.brand-notes article:nth-child(odd) { border-left: 5px solid var(--accent); }
.brand-note-head { display: flex; align-items: baseline; gap: 14px; border-bottom: 1px solid var(--line); margin-bottom: 13px; }
.brand-note-head > span { color: var(--accent-dark); font: 700 21px/1 Arial,Helvetica,sans-serif; }
.brand-notes h3 { font-size: 1.45rem; line-height: 1.2; margin: 0 0 11px; }
.brand-notes p { color: #394847; margin: 0 0 18px; font-size: 16px; }
.brand-highlights { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; padding: 0; margin: 0; list-style: none; }
.brand-highlights li { min-height: 79px; padding: 12px 14px; border: 1px solid #d7d7cc; background: #f4f1e7; }
.brand-highlights b, .brand-highlights small { display: block; }
.brand-highlights b { font-size: 14px; color: var(--deep); }
.brand-highlights small { font-size: 13px; line-height: 1.45; color: var(--muted); }
.editorial { padding-bottom: 68px; }
.article-section { padding: 40px 0 55px; border-top: 1px solid var(--line); scroll-margin-top: 84px; }
.article-section h2 { margin: 0 0 15px; max-width: 100%; font-size: clamp(1.85rem,2.8vw,2.75rem); line-height: 1.18; letter-spacing: -.034em; }
.article-section h3 { margin: 32px 0 10px; font-size: clamp(1.35rem,2vw,1.75rem); line-height: 1.25; letter-spacing: -.025em; }
.article-section p { max-width: 100%; margin-bottom: 16px; color: #364443; font-size: 16px; line-height: 1.77; }
.article-section p strong { color: var(--accent-dark); }
.article-section .after-component { margin-top: 18px; color: var(--muted); }
.table-wrap { margin: 23px 0 17px; border: 1px solid var(--ink); background: var(--surface); overflow-x: auto; box-shadow: 5px 5px 0 #e1dfd4; }
.table-wrap table { width: 100%; min-width: 680px; border-collapse: collapse; text-align: left; }
.table-wrap caption { padding: 12px 18px; background: var(--deep); color: #fff; font-size: 14px; font-weight: 750; text-align: left; }
.table-wrap th, .table-wrap td { padding: 13px 17px; vertical-align: top; line-height: 1.47; }
.table-wrap thead { color: #fff; background: var(--ink); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.table-wrap tbody tr { border-top: 1px solid var(--line); }
.table-wrap tbody tr:nth-child(even) { background: #f4f2ea; }
.table-wrap tbody th { width: 21%; border-left: 4px solid var(--accent); font-weight: 400; }
.table-wrap tbody td { font-weight: 400; }
.model-table caption, .privacy-table caption { background: var(--accent-dark); }
.model-table tbody th, .privacy-table tbody th { border-color: var(--deep); }
.bonus-table caption, .ceiling-table caption { background: #65412c; }
.bonus-table tbody tr:nth-child(even), .ceiling-table tbody tr:nth-child(even) { background: #f9eee4; }
.evidence-table caption { background: #293f4c; }
.signal-list, .policy-list, .slot-list, .risk-list, .checklist, .safety-list { list-style: none; padding: 0; margin: 23px 0; }
.signal-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; counter-reset: step; }
.signal-list li { counter-increment: step; position: relative; padding: 15px 17px 15px 54px; background: #ecebe0; border-bottom: 2px solid var(--deep); }
.signal-list li:before { content: counter(step,decimal-leading-zero); position: absolute; left: 15px; top: 16px; color: var(--accent-dark); font: 700 19px Arial,Helvetica,sans-serif; }
.signal-list b, .signal-list span, .policy-list b, .policy-list span, .risk-list b, .risk-list span, .safety-list b, .safety-list span { display: block; }
.signal-list span, .policy-list span, .risk-list span, .safety-list span { color: var(--muted); font-size: 14px; line-height: 1.5; }
.policy-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.policy-list li { padding: 17px; border: 1px solid #d2d1c4; background: #fffdf8; box-shadow: inset 0 4px 0 var(--accent); }
.slot-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; border: 1px solid var(--deep); background: var(--deep); counter-reset: slot; }
.slot-list li { position: relative; counter-increment: slot; min-height: 82px; padding: 14px 18px 14px 51px; background: #fffefa; }
.slot-list li:before { content: counter(slot,decimal-leading-zero); position: absolute; left: 15px; top: 16px; color: var(--accent-dark); font: 700 19px Arial,Helvetica,sans-serif; }
.slot-list b, .slot-list span { display: block; }
.slot-list span { color: var(--muted); font-size: 14px; }
.risk-list, .safety-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.risk-list li, .safety-list li { padding: 14px 17px; border: 1px solid var(--line); background: #f0ede3; }
.risk-list li { border-left: 4px solid var(--accent); }
.safety-list li { border-left: 4px solid var(--deep); }
.checklist { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.checklist li { display: flex; gap: 13px; padding: 15px; background: #fffefa; border: 1px solid var(--line); }
.checklist li span { color: var(--accent-dark); font: 700 19px Arial,Helvetica,sans-serif; }
.checklist li div { font-size: 15px; }
.route-panels { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; margin: 23px 0; }
.route-panels > div { min-height: 188px; padding: 18px; background: var(--deep); color: #f5f1e7; }
.route-panels > div:nth-child(2), .route-panels > div:nth-child(4) { background: var(--accent-dark); }
.route-panels span { color: var(--gold); font: 700 24px Arial,Helvetica,sans-serif; }
.route-panels h4 { margin: 10px 0 8px; font: 700 20px/1.2 Arial,Helvetica,sans-serif; }
.route-panels div div { font-size: 14px; line-height: 1.55; }
.faq-section details { margin: 8px 0; border: 1px solid var(--line); background: #fffefa; }
.faq-section details[open] { border-color: var(--accent); box-shadow: 4px 4px 0 #e6d8c4; }
.faq-section summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px 17px; cursor: pointer; list-style: none; }
.faq-section summary::-webkit-details-marker { display: none; }
.faq-section summary:after { content: "+"; color: var(--accent-dark); font-size: 25px; line-height: 1; }
.faq-section details[open] summary:after { content: "−"; }
.faq-section summary h3 { margin: 0; font: 700 18px/1.35 Arial,Helvetica,sans-serif; }
.faq-section details p { padding: 0 17px 16px; margin: 0; }
.site-footer { padding-top: 50px; background: #1b2b2c; color: #e5e9e3; }
.footer-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 65px; }
.footer-brand { color: #fff; font-size: 21px; }
.footer-about p { margin-top: 18px; }
.site-footer p { color: #d5dfd9; font-size: 14px; line-height: 1.68; }
.footer-label { color: #f1c876; font-size: 12px; font-weight: 850; letter-spacing: .1em; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 10px 19px; font-size: 14px; font-weight: 750; }
.footer-nav a { text-decoration: none; border-bottom: 1px solid var(--gold); }
.footer-disclosure { border-top: 1px solid #51615b; padding-top: 16px; }
.support-links { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 17px; }
.support-logo { display: grid; place-items: center; width: 135px; height: 61px; padding: 8px; border: 1px solid #798c89; background: #354b4b; }
.support-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 35px; padding: 16px 0; border-top: 1px solid #51615b; color: #b7c7c3; font-size: 12px; }
@media (max-width: 1050px) {
  .ranking-card { grid-template-columns: 42px minmax(170px,1fr) minmax(230px,1.35fr) 150px; gap: 9px; }
  .logo-frame { flex-basis: 88px; width: 88px; }
  .route-panels { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .shell { width: min(100% - 30px,1250px); }
  .header-inner { min-height: 66px; }
  .brand { font-size: 13px; }
  .brand img { width: 185px; }
  .brand-mark { flex-basis: 35px; width: 35px; height: 35px; font-size: 13px; }
  .desktop-nav { display: none; }
  .menu-button { display: inline-flex; gap: 8px; align-items: center; padding: 8px 10px; border: 1px solid var(--line); background: #fffefa; color: var(--ink); font-size: 13px; font-weight: 750; }
  .mobile-nav:not([hidden]) { display: grid; padding-bottom: 12px; }
  .mobile-nav a { padding: 8px 0; border-top: 1px solid var(--line); font-weight: 750; }
  .hero-grid { padding: 32px 0; }
  h1 { font-size: clamp(1.75rem,6.5vw,2.15rem); }
  .hero-intro { font-size: 16px; }
  .selection-pill { display: none; }
  .ranking-card { grid-template-columns: 38px minmax(0,1fr); padding: 11px; }
  .rank-number { width: 38px; height: 38px; }
  .logo-frame { flex-basis: 88px; height: 52px; }
  .offer-panel, .visit-button { grid-column: 1/-1; }
  .visit-button { justify-content: center; position: relative; }
  .visit-button span { position: absolute; right: 17px; }
  .brand-notes article { padding: 19px; }
  .brand-highlights, .policy-list { grid-template-columns: 1fr; }
  .brand-highlights li { min-height: 0; }
  .article-section { padding: 33px 0 40px; }
  .signal-list, .slot-list, .risk-list, .safety-list, .checklist { grid-template-columns: 1fr; }
  .route-panels { grid-template-columns: 1fr 1fr; }
  .route-panels > div { min-height: 0; }
  .footer-grid { grid-template-columns: 1fr; gap: 24px; }
  .footer-bottom { display: block; }
  .footer-bottom span { display: block; margin-bottom: 5px; }
}
@media (max-width: 430px) {
  .route-panels { grid-template-columns: 1fr; }
  .eyebrow { font-size: 12px; }
  .casino-name { font-size: 14px; }
  .logo-frame { flex-basis: 78px; width: 78px; }
  .brand { letter-spacing: -.05em; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .hero-cta, .visit-button { transition: none; } }