/*
 * supportive.css — production visual enhancement layer
 * Load AFTER main.css and responsive.css.
 * Preserves existing HTML/JS classes and application functionality.
 */

:root {
  --support-primary: var(--primary, #6c5ce7);
  --support-primary-dark: var(--primary-dark, #5a4bd1);
  --support-dark: var(--surface-dark, #1a1a2e);
  --support-dark-2: var(--dark-2, #16213e);
  --support-bg: var(--bg, #f8fafc);
  --support-surface: var(--white, #fff);
  --support-text: var(--dark, #1a1a2e);
  --support-muted: var(--gray, #64748b);
  --support-border: var(--light-gray, #e2e8f0);
  --support-success: var(--success, #00b894);
  --support-danger: var(--danger, #e74c3c);
  --support-warning: var(--warning, #fdcb6e);
  --support-radius-xs: 6px;
  --support-radius-sm: 8px;
  --support-radius-md: 12px;
  --support-radius-lg: 16px;
  --support-radius-xl: 22px;
  --support-shadow-xs: 0 1px 2px rgba(15,23,42,.04);
  --support-shadow-sm: 0 3px 10px rgba(15,23,42,.06);
  --support-shadow-md: 0 8px 24px rgba(15,23,42,.08);
  --support-shadow-lg: 0 18px 50px rgba(15,23,42,.12);
  --support-focus: 0 0 0 3px color-mix(in srgb,var(--support-primary) 20%,transparent);
  --support-readable: 760px;
  --support-font-body: Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --support-font-display: Orbitron,Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --support-font-mono: "SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
}

/* Global readability */
html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-synthesis: none;
  scroll-padding-top: 84px;
}

/* body{}/h1-h6{} base rules consolidated into section 31.1/31.2 below —
   this file previously had two separate, overlapping copies of both. */

button,input,select,textarea { font: inherit; }
strong,b{font-weight:700}

small,.muted,.help-text,.form-help,.field-help{color:var(--support-muted)}
code,pre,kbd{font-family:var(--support-font-mono)}
code{background:color-mix(in srgb,var(--support-primary) 7%,var(--support-bg));color:var(--support-primary-dark);padding:2px 6px;border-radius:5px}
::selection{background:color-mix(in srgb,var(--support-primary) 25%,transparent)}
.review-content,.news-content,.page-content,.article-content,.prose,.rich-content{max-width:var(--support-readable)}

/* Accessibility */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:0;box-shadow:var(--support-focus)}
:where(a,button):focus-visible{border-radius:var(--support-radius-sm)}
a{text-underline-offset:3px}
a:hover{text-decoration-thickness:1.5px}

/* Layout */
.container{width:min(100%,var(--container,1200px))}
.layout-wrapper{align-items:start}
.main-content{min-width:0}
.section{position:relative}
.section--alt{border-top:1px solid color-mix(in srgb,var(--support-border) 55%,transparent);border-bottom:1px solid color-mix(in srgb,var(--support-border) 45%,transparent)}
.section-header{gap:20px}
.section-header .link{white-space:nowrap}

/* Header — consolidated. This file previously had two separate
   .site-header sections (this one, and one further down commented
   "Modern navbar") which duplicated/partially overrode each other;
   the later one's active-link treatment silently killed this one's
   underline effect via display:none. Merged into one. */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: linear-gradient(180deg, color-mix(in srgb, var(--support-dark) 98%, #000 2%), var(--support-dark));
  border-bottom: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 8px 30px rgba(5,8,20,.2), inset 0 -1px 0 rgba(255,255,255,.025);
  backdrop-filter: saturate(140%) blur(14px);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
}
.header-inner{position:relative;min-height:68px;height:auto;padding-top:var(--space-2);padding-bottom:var(--space-2);gap:var(--space-3)}
.logo{min-width:0}
.logo-icon{filter:drop-shadow(0 5px 14px color-mix(in srgb, var(--theme-accent, #A855F7) 70%, transparent));transition:transform .22s ease}
.logo:hover .logo-icon{transform:translateY(-1px) scale(1.03)}
.logo-text{font-family:var(--support-font-display);font-size:clamp(1rem,1.8vw,1.22rem);letter-spacing:.015em;line-height:1;text-shadow:0 2px 12px color-mix(in srgb, var(--theme-accent, #A855F7) 60%, transparent)}

.main-nav{align-items:center;gap:5px}
.main-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 11px;border-radius:9px;color:rgba(255,255,255,.78);font-size:13px;font-weight:650;letter-spacing:.005em;text-decoration:none;transition:color var(--support-fast, .14s) ease,background var(--support-fast, .14s) ease,transform var(--support-fast, .14s) ease}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,.075);transform:translateY(-1px)}
.main-nav a.active,.main-nav a[aria-current="page"]{
  color:#fff;
  background:linear-gradient(135deg, color-mix(in srgb, var(--support-primary) 28%, transparent), color-mix(in srgb, var(--support-primary) 10%, transparent));
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--support-primary) 45%, white 20%), 0 5px 15px rgba(0,0,0,.1);
}
.main-nav a.active::before,.main-nav a[aria-current="page"]::before{
  content:"";
  width:5px;
  height:5px;
  margin-right:7px;
  border-radius:50%;
  background: color-mix(in srgb, var(--support-primary) 55%, white);
  box-shadow: 0 0 10px color-mix(in srgb, var(--support-primary) 55%, white 20%);
}

.header-actions{gap:var(--space-2)}

.search-box input{min-height:40px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.065);color:#fff;border-radius:9px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:width .22s,border-color .14s,background .14s,box-shadow .14s}
.search-box input::placeholder{color:rgba(255,255,255,.52)}
.search-box input:focus{width:240px;outline:none;border-color:color-mix(in srgb,var(--support-primary) 70%,white 15%);background:rgba(255,255,255,.095);box-shadow:0 0 0 3px color-mix(in srgb, var(--support-primary) 22%, transparent), inset 0 1px 0 rgba(255,255,255,.05)}
.search-results{margin-top:8px;overflow:hidden;border:1px solid var(--support-border);box-shadow:var(--support-shadow-lg)}
.search-result-item{min-height:54px;transition:background .14s}

.nav-toggle{min-width:44px;min-height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.055);color:#fff;box-shadow:0 3px 12px rgba(0,0,0,.12)}
.nav-toggle:hover,.nav-toggle:focus-visible{background:color-mix(in srgb, var(--support-primary) 18%, transparent);border-color:color-mix(in srgb, var(--support-primary) 30%, white 20%)}

@media (max-width:1024px){.main-nav a{padding-left:9px;padding-right:9px;font-size:12.5px}.header-actions{gap:7px}}
@media (max-width:768px){
 .site-header{background:linear-gradient(180deg,rgba(20,22,42,.99),rgba(26,26,46,.97))}
 .header-inner{min-height:62px}
 .main-nav{border-top:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,rgba(18,20,38,.99),rgba(26,26,46,.99));box-shadow:0 16px 35px rgba(0,0,0,.2)}
 .main-nav a{min-height:46px;justify-content:flex-start;padding:10px 14px;border-radius:8px}
 .main-nav a:hover,.main-nav a.active,.main-nav a[aria-current="page"]{transform:none}
 .main-nav a.active,.main-nav a[aria-current="page"]{background:linear-gradient(90deg, color-mix(in srgb, var(--support-primary) 23%, transparent), color-mix(in srgb, var(--support-primary) 6%, transparent))}
 .main-nav a.active::before,.main-nav a[aria-current="page"]::before{width:6px;height:22px;margin-right:9px;border-radius:5px}
}


/* Buttons */
.btn,button.btn{min-height:40px;border:1px solid transparent;border-radius:10px;font-weight:700;letter-spacing:-.005em;box-shadow:var(--support-shadow-xs);transition:transform .14s,box-shadow .22s,background .14s,border-color .14s,color .14s}
.btn:hover{transform:translateY(-1px);box-shadow:var(--support-shadow-sm)}
.btn:active{transform:translateY(0);box-shadow:var(--support-shadow-xs)}
.btn--primary{background:linear-gradient(135deg,var(--support-primary),color-mix(in srgb,var(--support-primary) 82%,#8b5cf6));border-color:color-mix(in srgb,var(--support-primary) 80%,#000 20%);box-shadow:0 6px 18px color-mix(in srgb,var(--support-primary) 22%,transparent),inset 0 1px 0 rgba(255,255,255,.16)}
.btn--primary:hover{background:linear-gradient(135deg,var(--support-primary-dark),var(--support-primary));box-shadow:0 9px 24px color-mix(in srgb,var(--support-primary) 26%,transparent),inset 0 1px 0 rgba(255,255,255,.16)}
.btn--secondary{border-color:rgba(255,255,255,.08);box-shadow:var(--support-shadow-sm)}
.btn--ghost{background:var(--support-surface);border:1px solid var(--support-border)}
.btn--ghost:hover{background:color-mix(in srgb,var(--support-primary) 5%,var(--support-surface));border-color:color-mix(in srgb,var(--support-primary) 40%,var(--support-border))}
.btn--danger{box-shadow:0 6px 18px rgba(231,76,60,.14)}
.btn--lg{min-height:48px;border-radius:12px}
.btn--sm{min-height:34px;border-radius:8px}
.btn--block{display:flex}
.btn-group,.button-group,.form-actions,.actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}

/* Hero */
.hero{min-height:360px;display:flex;align-items:center;padding:clamp(64px,9vw,104px) 0;background:radial-gradient(circle at 18% 15%,rgba(108,92,231,.22),transparent 34%),radial-gradient(circle at 82% 30%,rgba(168,85,247,.16),transparent 30%),linear-gradient(135deg,var(--support-dark),var(--support-dark-2))}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.hero h1{font-size:clamp(2rem,5vw,3.35rem);max-width:900px;letter-spacing:-.04em;text-shadow:0 8px 30px rgba(0,0,0,.22)}
.hero p{max-width:760px;margin-left:auto;margin-right:auto;color:rgba(255,255,255,.78);font-size:clamp(1rem,2vw,1.16rem);line-height:1.75}
.hero-content--left p,.hero-content--right p{margin-left:0;margin-right:0}
.hero-actions{flex-wrap:wrap}
.hero-badge{border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.08);padding:7px 12px;border-radius:999px;backdrop-filter:blur(8px)}

/* Public cards */.news-grid,
.features-grid {align-items:stretch}.news-card,
.feature-card,
.sidebar-block,
.info-block,
.info-card,
.pros-cons-block,
.auth-card,
.review-summary {border:1px solid color-mix(in srgb,var(--support-border) 80%,transparent)}.news-card {position:relative;isolation:isolate}
.bonus-title{letter-spacing:.07em;font-weight:700}.bonus-value{font-size:17px}
.news-card{border-radius:var(--support-radius-lg);padding:22px;box-shadow:var(--support-shadow-sm);transition:transform .22s,box-shadow .22s,border-color .22s}
.news-card:hover{transform:translateY(-4px);box-shadow:var(--support-shadow-md);border-color:color-mix(in srgb,var(--support-primary) 22%,var(--support-border))}
.news-card h3{line-height:1.3}.news-card p{line-height:1.65}
.feature-card{border-radius:var(--support-radius-lg);background:linear-gradient(180deg,var(--support-surface),color-mix(in srgb,var(--support-bg) 55%,var(--support-surface)));box-shadow:var(--support-shadow-xs)}
.feature-card:hover{box-shadow:var(--support-shadow-md);transform:translateY(-3px)}
.feature-icon{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:16px;background:color-mix(in srgb,var(--support-primary) 9%,var(--support-surface));color:var(--support-primary)}

/* Sidebar / chips */
.sidebar{gap:22px}.sidebar-block{border-radius:var(--support-radius-lg);padding:22px;box-shadow:var(--support-shadow-sm)}
.sidebar-block h3{font-weight:750}.sidebar-casino{min-height:52px;padding:9px;border:1px solid transparent}.sidebar-casino:hover{border-color:var(--support-border);background:var(--support-bg)}
.sidebar-casino img{width:36px;height:36px;padding:2px;background:var(--support-surface);border:1px solid var(--support-border)}
.chip,.feature-tag{border-radius:999px;font-weight:600;transition:background .14s,color .14s,border-color .14s,transform .14s}
.chip:hover,.feature-tag:hover{transform:translateY(-1px)}
.status-badge,.badge,.tag,.pill{display:inline-flex;align-items:center;gap:5px;min-height:26px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.1;white-space:nowrap}
.status-published{background:color-mix(in srgb,var(--support-success) 11%,var(--support-surface));color:color-mix(in srgb,var(--support-success) 80%,#064e3b);border:1px solid color-mix(in srgb,var(--support-success) 22%,transparent)}
.status-draft{background:color-mix(in srgb,var(--support-warning) 18%,var(--support-surface));color:#8a5b00;border:1px solid color-mix(in srgb,var(--support-warning) 35%,transparent)}

/* Detail / editorial */
.casino-hero{border-radius:var(--support-radius-xl);border:1px solid var(--support-border);box-shadow:var(--support-shadow-md);padding:clamp(22px,4vw,34px)}
.casino-hero__logo{width:88px;height:88px;padding:8px;background:#fff;border:1px solid var(--support-border);box-shadow:var(--support-shadow-sm)}
.casino-hero__left{min-width:0}.casino-hero__right{min-width:220px}
.bonus-box{min-width:190px;border:1px solid color-mix(in srgb,var(--support-primary) 16%,var(--support-border));background:linear-gradient(135deg,color-mix(in srgb,var(--support-primary) 7%,var(--support-bg)),var(--support-bg));box-shadow:var(--support-shadow-xs)}
.bonus-amount{font-size:clamp(1.35rem,3vw,1.75rem)}
.info-block,.info-card,.pros-cons-block{border-radius:var(--support-radius-lg);box-shadow:var(--support-shadow-sm)}
.info-block{padding:clamp(20px,3vw,28px)}.info-block h2{font-size:clamp(1.35rem,2vw,1.7rem)}.info-card{padding:22px}.info-card dl{row-gap:10px}.info-card dt{font-weight:500}.info-card dd{color:var(--support-text)}
.review-detail,.news-detail{padding:clamp(28px,5vw,54px) 0}.review-header h1,.news-header h1{font-size:clamp(2rem,4vw,2.7rem);letter-spacing:-.035em}
.review-meta{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}.review-content,.news-content{font-size:clamp(1rem,1.25vw,1.08rem);line-height:1.82}
.review-content h2,.news-content h2{margin-top:2em;margin-bottom:.7em;font-size:clamp(1.35rem,2.5vw,1.8rem)}
.review-content h3,.news-content h3{margin-top:1.7em;margin-bottom:.6em}
.review-content img,.news-content img,.page-content img,.rich-content img{max-width:100%;height:auto;border-radius:12px;box-shadow:var(--support-shadow-sm)}
.review-content blockquote,.news-content blockquote,.page-content blockquote,.rich-content blockquote{margin:1.5rem 0;padding:16px 20px;border-left:4px solid var(--support-primary);border-radius:0 10px 10px 0;background:color-mix(in srgb,var(--support-primary) 5%,var(--support-bg))}
.review-pros-cons{align-items:stretch}.pros-cons-block{transition:transform .22s,box-shadow .22s}.pros-cons-block:hover{transform:translateY(-2px);box-shadow:var(--support-shadow-md)}

/* Tables */
.table-responsive,.table-wrap,.table-container,.admin-table-wrapper,.data-table-wrapper,.overflow-table{width:100%;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;border-radius:var(--support-radius-md)}
table{border-spacing:0}
.admin-table{border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid var(--support-border);border-radius:var(--support-radius-md);background:var(--support-surface);box-shadow:var(--support-shadow-xs)}
.admin-table th,.mini-table th{background:linear-gradient(180deg,color-mix(in srgb,var(--support-bg) 82%,var(--support-surface)),var(--support-bg));color:var(--support-muted);font-size:11px;font-weight:800;letter-spacing:.065em;padding:13px 15px;white-space:nowrap;border-bottom:1px solid var(--support-border)}
.admin-table td,.mini-table td{padding:14px 15px;vertical-align:middle;border-bottom:1px solid var(--support-border)}
.admin-table tbody tr:last-child td,.mini-table tbody tr:last-child td{border-bottom:0}.admin-table tbody tr{transition:background .14s}.admin-table tbody tr:hover{background:color-mix(in srgb,var(--support-primary) 3.5%,var(--support-surface))}.admin-table td:first-child{font-weight:600}
.admin-table .table-actions{align-items:center;flex-wrap:wrap;min-width:max-content}
.mini-table{border-collapse:separate;border-spacing:0;border:1px solid var(--support-border);border-radius:var(--support-radius-md);overflow:hidden}.mini-table th,.mini-table td{padding:11px 13px}
.comparison-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--support-border);border-radius:var(--support-radius-md);overflow:hidden;box-shadow:var(--support-shadow-sm)}
.comparison-table th{background:var(--support-dark);color:#fff;font-weight:750;padding:14px;text-align:left}.comparison-table td{padding:14px;border-top:1px solid var(--support-border);vertical-align:top}
.comparison-table tbody tr:nth-child(even){background:color-mix(in srgb,var(--support-bg) 60%,var(--support-surface))}
.review-content table,.news-content table,.page-content table,.rich-content table{width:100%;margin:1.5rem 0;border-collapse:separate;border-spacing:0;border:1px solid var(--support-border);border-radius:12px;overflow:hidden}
.review-content th,.news-content th,.page-content th,.rich-content th{background:var(--support-bg);font-weight:750}
.review-content th,.review-content td,.news-content th,.news-content td,.page-content th,.page-content td,.rich-content th,.rich-content td{padding:12px 14px;border-bottom:1px solid var(--support-border);border-right:1px solid var(--support-border);vertical-align:top}

/* Admin */
.admin-wrapper{grid-template-columns:248px minmax(0,1fr);background:linear-gradient(90deg,var(--support-dark) 0 248px,var(--support-bg) 248px)}
.admin-nav{position:sticky;top:64px;height:calc(100vh - 64px);overflow-y:auto;scrollbar-width:thin;padding:16px 10px;gap:3px;border-right:1px solid rgba(255,255,255,.06);box-shadow:8px 0 30px rgba(15,23,42,.08)}
.admin-nav a{display:flex;align-items:center;min-height:42px;border-radius:9px;margin:0;padding:9px 13px;color:rgba(255,255,255,.68);font-size:13px;font-weight:600;transition:background .14s,color .14s,transform .14s}
.admin-nav a:hover{transform:translateX(2px);background:rgba(255,255,255,.065);color:#fff}.admin-nav a.active,.admin-nav a[aria-current="page"]{color:#fff;background:linear-gradient(135deg,color-mix(in srgb,var(--support-primary) 95%,#fff 5%),var(--support-primary-dark));box-shadow:0 6px 18px rgba(108,92,231,.20),inset 0 1px 0 rgba(255,255,255,.14)}
.admin-logout{border-top:1px solid rgba(255,255,255,.07);padding-top:13px!important;margin-top:10px!important}
.admin-content{min-width:0;padding:clamp(22px,3vw,34px);background:radial-gradient(circle at 100% 0%,rgba(108,92,231,.035),transparent 32%),var(--support-bg)}
.admin-content h1{font-size:clamp(1.55rem,2.5vw,2rem);letter-spacing:-.035em}.admin-header{min-height:48px;gap:16px}.admin-header h1{line-height:1.15}
.stats-grid{gap:16px}.stat-card{position:relative;overflow:hidden;border:1px solid var(--support-border);border-radius:var(--support-radius-lg);padding:22px;text-align:left;box-shadow:var(--support-shadow-sm);transition:transform .22s,box-shadow .22s,border-color .22s}
.stat-card::after{content:"";position:absolute;right:-35px;top:-35px;width:120px;height:120px;border-radius:50%;background:color-mix(in srgb,var(--support-primary) 7%,transparent);pointer-events:none}
.stat-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--support-primary) 20%,var(--support-border));box-shadow:var(--support-shadow-md)}
.stat-icon{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;border-radius:12px;background:color-mix(in srgb,var(--support-primary) 9%,var(--support-bg));margin-bottom:13px;font-size:23px}
.stat-value{position:relative;z-index:1;font-size:clamp(1.65rem,3vw,2.1rem);line-height:1.1;letter-spacing:-.035em}.stat-label{position:relative;z-index:1;font-size:13px;font-weight:600;color:var(--support-muted)}
.admin-section{border:1px solid var(--support-border);border-radius:var(--support-radius-lg);padding:clamp(20px,2.5vw,28px);box-shadow:var(--support-shadow-sm)}
.admin-section h2{font-size:18px;letter-spacing:-.02em}
.dashboard-grid,.admin-grid,.card-grid,.content-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}.dashboard-card,.admin-card{grid-column:span 4;min-width:0;background:var(--support-surface);border:1px solid var(--support-border);border-radius:var(--support-radius-lg);padding:22px;box-shadow:var(--support-shadow-sm)}
.dashboard-card:hover,.admin-card:hover{box-shadow:var(--support-shadow-md)}

/* Forms */
.admin-form,.auth-card{border:1px solid var(--support-border);border-radius:var(--support-radius-lg)}
.admin-form{max-width:900px;padding:clamp(22px,3vw,32px);box-shadow:var(--support-shadow-sm)}
.form-row,.form-row-3{align-items:start}.form-group{min-width:0;gap:7px}
.admin-form label,.form-group label{color:var(--support-text);font-size:13px;font-weight:700;line-height:1.35}
.admin-form input,.admin-form select,.admin-form textarea,.form-group input,.form-group select,.form-group textarea{min-height:42px;color:var(--support-text);background:var(--support-surface);border:1px solid var(--support-border);border-radius:9px;padding:10px 13px;line-height:1.45;box-shadow:inset 0 1px 2px rgba(15,23,42,.025);transition:border-color .14s,box-shadow .14s,background .14s}
.admin-form textarea,.form-group textarea{min-height:130px}.admin-form input:hover,.admin-form select:hover,.admin-form textarea:hover,.form-group input:hover,.form-group select:hover,.form-group textarea:hover{border-color:color-mix(in srgb,var(--support-primary) 25%,var(--support-border))}
.admin-form input:focus,.admin-form select:focus,.admin-form textarea:focus,.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--support-primary);box-shadow:var(--support-focus),inset 0 1px 2px rgba(15,23,42,.025)}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--support-muted) 72%,transparent)}
input[type="checkbox"],input[type="radio"]{accent-color:var(--support-primary)}
input[type="file"]{min-height:44px;padding:8px}input[type="file"]::file-selector-button{margin-right:10px;padding:8px 12px;border:1px solid var(--support-border);border-radius:7px;background:var(--support-bg);color:var(--support-text);font-weight:650;cursor:pointer}
fieldset{min-width:0;margin:0 0 20px;padding:20px;border:1px solid var(--support-border);border-radius:var(--support-radius-md)}legend{padding:0 8px;font-weight:750}
.form-actions{margin-top:20px;padding-top:18px;border-top:1px solid var(--support-border)}
.alert{border:1px solid transparent;box-shadow:var(--support-shadow-xs)}
.alert--error{background:color-mix(in srgb,var(--support-danger) 8%,var(--support-surface));border-color:color-mix(in srgb,var(--support-danger) 22%,var(--support-border))}
.alert--success{background:color-mix(in srgb,var(--support-success) 8%,var(--support-surface));border-color:color-mix(in srgb,var(--support-success) 22%,var(--support-border))}

/* Auth */
.auth-page{min-height:calc(100vh - 160px);background:radial-gradient(circle at 50% 0%,rgba(108,92,231,.09),transparent 40%)}
.auth-card{padding:clamp(26px,5vw,42px);box-shadow:var(--support-shadow-lg)}.auth-card h1{font-size:clamp(1.6rem,3vw,2rem);letter-spacing:-.035em}.auth-form{gap:18px}.auth-footer{color:var(--support-muted)}

/* Toolbars / pagination */
.toolbar,.filters,.filter-bar,.list-toolbar,.admin-toolbar,.search-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:18px}.toolbar .spacer,.filters .spacer,.admin-toolbar .spacer{flex:1 1 auto}
.pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px;margin:28px 0}.pagination a,.pagination button,.pagination .page{display:inline-flex;min-width:38px;min-height:38px;align-items:center;justify-content:center;padding:7px 11px;border:1px solid var(--support-border);border-radius:9px;background:var(--support-surface);color:var(--support-text);font-weight:650}.pagination a:hover,.pagination button:hover,.pagination .active{border-color:var(--support-primary);background:color-mix(in srgb,var(--support-primary) 8%,var(--support-surface));color:var(--support-primary-dark);text-decoration:none}

/* Modals / dialogs */
.modal,.modal-overlay,.dialog-overlay,.drawer-overlay{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.modal-content,.modal>div,.dialog,.drawer,[role="dialog"]{border:1px solid var(--support-border);border-radius:var(--support-radius-lg);box-shadow:var(--support-shadow-lg)}
[role="dialog"]{background:var(--support-surface)}
.modal-header,.dialog-header,.drawer-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--support-border)}
.modal-footer,.dialog-footer,.drawer-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:9px;padding-top:16px;border-top:1px solid var(--support-border)}

/* Media */
.media-grid,.media-library-grid,.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}.media-item,.media-card,.gallery-item{position:relative;min-width:0;overflow:hidden;border:1px solid var(--support-border);border-radius:12px;background:var(--support-surface);box-shadow:var(--support-shadow-xs);transition:transform .22s,box-shadow .22s,border-color .22s}.media-item:hover,.media-card:hover,.gallery-item:hover{transform:translateY(-2px);box-shadow:var(--support-shadow-md);border-color:color-mix(in srgb,var(--support-primary) 25%,var(--support-border))}.media-item img,.media-card img,.gallery-item img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}.media-meta{padding:10px 12px;font-size:12px;color:var(--support-muted)}
.upload-zone,.dropzone,.media-dropzone{border:1.5px dashed color-mix(in srgb,var(--support-primary) 35%,var(--support-border));border-radius:var(--support-radius-lg);background:color-mix(in srgb,var(--support-primary) 3%,var(--support-surface));padding:28px;text-align:center;transition:border-color .14s,background .14s}.upload-zone:hover,.dropzone:hover,.media-dropzone:hover,.upload-zone.is-dragover,.dropzone.is-dragover,.media-dropzone.is-dragover{border-color:var(--support-primary);background:color-mix(in srgb,var(--support-primary) 7%,var(--support-surface))}

/* TinyMCE */
.tox.tox-tinymce,.tox.tox-tinymce-aux{border-radius:12px!important}.tox.tox-tinymce{border:1px solid var(--support-border)!important;box-shadow:var(--support-shadow-xs)!important;overflow:hidden}.tox .tox-toolbar,.tox .tox-toolbar__overflow,.tox .tox-toolbar__primary{background:var(--support-bg)!important}.tox .tox-edit-area__iframe{background:#fff}

/* Component engine / content blocks */
.component,.page-component,.content-component,.review-block,.review-blocks>* ,.content-block{min-width:0}.component-card,.content-card,.review-block-card{border:1px solid var(--support-border);border-radius:var(--support-radius-lg);background:var(--support-surface);box-shadow:var(--support-shadow-sm)}.component-card:hover,.content-card:hover{box-shadow:var(--support-shadow-md)}
.component-grid,.content-grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:18px}

/* AI / code */
pre,.code-block,.json-viewer,.schema-preview{overflow:auto;max-width:100%;padding:16px;border:1px solid var(--support-border);border-radius:10px;background:#0f172a;color:#e2e8f0;font-size:12px;line-height:1.65}
.ai-response,.ai-result,.ai-panel,.ai-card{border:1px solid color-mix(in srgb,var(--support-primary) 18%,var(--support-border));border-radius:var(--support-radius-lg);background:linear-gradient(145deg,color-mix(in srgb,var(--support-primary) 4%,var(--support-surface)),var(--support-surface));box-shadow:var(--support-shadow-sm)}
.ai-message,.chat-message{max-width:min(88%,760px);padding:12px 15px;border-radius:14px;line-height:1.65}.chat-message.user{margin-left:auto;background:color-mix(in srgb,var(--support-primary) 9%,var(--support-surface))}.chat-message.assistant{margin-right:auto;background:var(--support-surface);border:1px solid var(--support-border)}

/* Empty/loading */
.empty-state,.no-results,.empty-message{padding:44px 24px;border:1px dashed var(--support-border);border-radius:var(--support-radius-lg);background:color-mix(in srgb,var(--support-bg) 65%,var(--support-surface));color:var(--support-muted);text-align:center}
.loading,.skeleton{background:linear-gradient(90deg,color-mix(in srgb,var(--support-border) 45%,var(--support-surface)),color-mix(in srgb,var(--support-border) 15%,var(--support-surface)),color-mix(in srgb,var(--support-border) 45%,var(--support-surface)));background-size:200% 100%;animation:support-shimmer 1.35s linear infinite}
@keyframes support-shimmer{to{background-position:-200% 0}}

/* Footer */
.site-footer{position:relative;overflow:hidden;margin-top:30px;background:radial-gradient(circle at 10% 0%,color-mix(in srgb, var(--support-primary) 13%, transparent),transparent 28%),radial-gradient(circle at 90% 30%,color-mix(in srgb, var(--theme-accent, #A855F7) 8%, transparent),transparent 26%),linear-gradient(180deg,var(--support-dark),#111322);border-top:1px solid rgba(255,255,255,.06)}
.site-footer::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);background-size:40px 40px;mask-image:linear-gradient(to bottom,black,transparent 80%)}
.site-footer .container{position:relative;z-index:1}.footer-compliance-box{padding-top:34px;border-bottom-color:rgba(255,255,255,.09)}
.compliance-logos img{max-width:120px;max-height:44px;object-fit:contain;filter:grayscale(.1)}.rg-text{color:rgba(255,255,255,.64);font-size:13px}.rg-text a{color:#b9aaff}.disclaimer-text{color:rgba(255,255,255,.43);font-size:11.5px}
.footer-grid{position:relative;gap:clamp(22px,4vw,44px);padding-top:34px;padding-bottom:34px;border-bottom-color:rgba(255,255,255,.09)}.footer-col h4{font-size:12px;letter-spacing:.1em;color:rgba(255,255,255,.92)}.footer-col li{margin-bottom:9px}.footer-col a{display:inline-block;color:rgba(255,255,255,.60);line-height:1.45;transition:color .14s,transform .14s}.footer-col a:hover{color:#fff;transform:translateX(2px)}
.trustpilot-review-box{padding:26px 0 18px}.trustpilot-review-btn{border-radius:999px;background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.11);backdrop-filter:blur(8px)}.footer-bottom{color:rgba(255,255,255,.52);font-size:12px}

/* Breadcrumbs */
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:5px;min-height:30px;color:var(--support-muted);font-size:12px}.breadcrumbs a{color:var(--support-muted);font-weight:550}.breadcrumbs a:hover{color:var(--support-primary)}

/* Responsive */
@media (max-width:1100px){
  .admin-wrapper{grid-template-columns:220px minmax(0,1fr);background:linear-gradient(90deg,var(--support-dark) 0 220px,var(--support-bg) 220px)}
  .dashboard-card,.admin-card{grid-column:span 6}
}
@media (max-width:968px){.layout-wrapper,.casino-body,.casino-columns{gap:22px}.casino-hero__right{align-items:flex-start}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:768px){
  body{font-size:15px}.container{padding-left:16px;padding-right:16px}.header-inner{gap:10px}.logo-text{font-size:1rem}.search-box{display:none}
  .hero{min-height:330px;padding:58px 0}.hero-actions{align-items:stretch}.hero-actions .btn{width:100%}.section{padding:38px 0}.section-header{align-items:flex-start}.section-header h2{font-size:23px}.news-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}.casino-hero{padding:20px}.casino-hero__left,.casino-hero__right{width:100%}.bonus-box{width:100%}.info-card dl{grid-template-columns:1fr}.info-card dd{text-align:left}.review-pros-cons{grid-template-columns:1fr}
  .admin-wrapper{display:block;background:var(--support-bg)}.admin-nav{position:sticky;top:64px;z-index:90;height:auto;flex-direction:row;overflow-x:auto;padding:8px;border-right:0;border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 8px 22px rgba(15,23,42,.14);scrollbar-width:thin}.admin-nav a{flex:0 0 auto;white-space:nowrap;min-height:40px}.admin-logout{margin-top:0!important;padding-top:9px!important;border-top:0;border-left:1px solid rgba(255,255,255,.08)}
  .admin-content{padding:20px 16px}.admin-header{align-items:flex-start;flex-wrap:wrap}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid,.admin-grid,.card-grid,.content-grid{grid-template-columns:1fr}.dashboard-card,.admin-card{grid-column:auto}.form-row,.form-row-3{grid-template-columns:1fr}.admin-form{max-width:none;padding:20px}.admin-table{min-width:720px}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.btn{min-height:44px}.btn--sm{min-height:36px}.table-actions .btn{min-height:36px}
}
@media (max-width:520px){
  .stats-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;gap:26px}.auth-card{padding:24px 18px;border-radius:14px}.review-header h1,.news-header h1{font-size:1.8rem}.review-content,.news-content{font-size:15.5px;line-height:1.78}.admin-content{padding:16px 12px}.admin-section{padding:18px 15px;border-radius:14px}.admin-form{padding:18px 15px}
}
@media (max-width:380px){.logo-text{display:none}.hero{padding:48px 0}.hero h1{font-size:1.8rem}}

/* Existing mobile bottom navigation: visual-only enhancement */
@media (max-width:768px){
  .mobile-bottom-nav{background:linear-gradient(180deg,rgba(26,26,46,.94),rgba(15,18,34,.98));border-top-color:rgba(255,255,255,.09);box-shadow:0 -10px 30px rgba(15,23,42,.18);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}
  .mobile-nav-item{min-height:44px;border-radius:10px}.mobile-nav-item.active{background:rgba(108,92,231,.12);color:#b9aaff}
}

/* Print */
@media print{.site-header,
.admin-nav,
.mobile-bottom-nav,
.nav-toggle,
.header-actions,
.site-footer,
.btn {display:none!important}
  body{background:#fff;color:#000}.layout-wrapper,.admin-wrapper,.casino-body,.casino-columns{display:block;max-width:none;margin:0;padding:0}.admin-content{padding:0;background:#fff}.news-card,
.info-block,
.info-card,
.admin-section,
.admin-table {box-shadow:none!important;break-inside:avoid}a{color:#000;text-decoration:underline}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* Safe utilities */
.text-muted,.muted{color:var(--support-muted)}.text-primary{color:var(--support-primary)}.text-success{color:var(--support-success)}.text-danger{color:var(--support-danger)}.text-warning{color:#9a6700}
.surface{background:var(--support-surface);border:1px solid var(--support-border);border-radius:var(--support-radius-lg);box-shadow:var(--support-shadow-sm)}
.surface-flat{background:var(--support-surface);border:1px solid var(--support-border);border-radius:var(--support-radius-md)}
.stack{display:flex;flex-direction:column;gap:16px}.cluster{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.center{display:grid;place-items:center}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* High-clarity typography on normal/light surfaces.
   Fix: the ':where(' opener below was missing its closing paren
   before '{', making the whole rule invalid — browsers silently
   dropped it. Its intended effect (theme-aware text color) was
   masked by a second, valid rule that used a hardcoded hex instead.
   Merged into one valid, theme-aware rule. */
:where(.main-content,
.page-content,
.review-content,
.news-content,
.casino-page,
.casino-detail,
.admin-content,
.admin-section,
.admin-form,
.auth-card,
.info-block,
.info-card,
.sidebar-block,
.feature-card,
.news-card,
.text-muted,
small,
.help-text,
.form-help,
.field-help) {color:var(--support-text, #526174)}

/* Sharp readable text on dark surfaces. */
:where(.site-header,.site-footer,.hero,.admin-nav,.mobile-bottom-nav){color:rgba(255,255,255,.94)}
/* .site-footer text-color rules (p/li/a/footer-col h4 etc.) removed
   from here — section 31.18 "FOOTER — MAXIMUM READABILITY" further
   down uses higher-specificity selectors (.site-footer p vs this
   block's .site-footer :where(p) ) and always won anyway; this was
   dead weight that never actually rendered. */


/* Premium breadcrumbs: visible on light and dark backgrounds. */
.breadcrumbs{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:fit-content;max-width:100%;min-height:34px;margin:0 0 18px;padding:7px 12px;border:1px solid #d8dee8;border-radius:10px;background:rgba(255,255,255,.96);color:#334155;box-shadow:0 3px 12px rgba(15,23,42,.08);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:12.5px;font-weight:650;line-height:1.35;letter-spacing:.005em;text-shadow:none;backdrop-filter:blur(10px) saturate(125%);-webkit-backdrop-filter:blur(10px) saturate(125%)}
.breadcrumbs a{color:#475569;font-weight:650;text-decoration:none}
.breadcrumbs a:hover,.breadcrumbs a:focus-visible{color:var(--support-primary-dark);text-decoration:none}
.breadcrumbs>*+*::before{content:"›";display:inline-block;margin-right:6px;color:#64748b;font-size:16px;font-weight:750;line-height:.8;vertical-align:-1px}
.breadcrumbs [aria-current="page"],.breadcrumbs .current,.breadcrumbs .active{color:#172033;font-weight:750}

/* Breadcrumb glass mode on dark/hero surfaces. */
.hero .breadcrumbs,.casino-hero .breadcrumbs,.dark .breadcrumbs,.bg-dark .breadcrumbs,[data-theme="dark"] .breadcrumbs{border-color:rgba(255,255,255,.17);background:rgba(15,23,42,.78);color:rgba(255,255,255,.94);box-shadow:0 7px 22px rgba(0,0,0,.2)}
.hero .breadcrumbs a,.casino-hero .breadcrumbs a,.dark .breadcrumbs a,.bg-dark .breadcrumbs a,[data-theme="dark"] .breadcrumbs a{color:rgba(255,255,255,.82)}
.hero .breadcrumbs a:hover,.hero .breadcrumbs a:focus-visible,.casino-hero .breadcrumbs a:hover,.casino-hero .breadcrumbs a:focus-visible,.dark .breadcrumbs a:hover,.dark .breadcrumbs a:focus-visible,.bg-dark .breadcrumbs a:hover,.bg-dark .breadcrumbs a:focus-visible,[data-theme="dark"] .breadcrumbs a:hover,[data-theme="dark"] .breadcrumbs a:focus-visible{color:#fff}
.hero .breadcrumbs>*+*::before,.casino-hero .breadcrumbs>*+*::before,.dark .breadcrumbs>*+*::before,.bg-dark .breadcrumbs>*+*::before,[data-theme="dark"] .breadcrumbs>*+*::before{color:rgba(255,255,255,.55)}

/* .site-header/.header-inner/.main-nav/.nav-toggle/.search-box for
   this breakpoint set are now part of the single consolidated header
   section near the top of this file (see "Header — consolidated"). */
@media (max-width:768px){
 .breadcrumbs{width:100%;max-width:100%;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;scrollbar-width:none}
 .breadcrumbs::-webkit-scrollbar{display:none}
}
@media (max-width:520px){.breadcrumbs{margin-bottom:14px;padding:7px 10px;font-size:12px}.site-footer{margin-top:20px}

/* --------------------------------------------------------------------------
   31.1 CORE TYPOGRAPHY
   -------------------------------------------------------------------------- */

:root {
  /* These previously loaded last and won the cascade for body text
     color with fully hardcoded hex — bypassing --support-text (above)
     and the theme system entirely. Now derived from the same
     theme-aware chain as everything else, original values kept only
     as the fallback. */
  --text-strong: var(--dark, #111827);
  --text-body: var(--dark, #263244);
  --text-secondary: var(--gray, #526174);
  --text-muted-strong: var(--gray, #64748b);

  --dark-text-strong: #ffffff;
  --dark-text-body: rgba(255,255,255,.91);
  --dark-text-secondary: rgba(255,255,255,.78);
  --dark-text-muted: rgba(255,255,255,.68);

  --text-outline-light: rgba(255,255,255,.08);
  --text-outline-dark: rgba(15,23,42,.08);
}

body {
  font-family: var(--support-font-body);
  color: var(--text-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* --------------------------------------------------------------------------
   31.2 ALL IMPORTANT HEADINGS
   (Consolidated — this file previously had two separate h1..h6 blocks,
   one near the top of the file and this one; the sizes below were
   missing from both, so bare headings had no controlled font-size at
   all and fell back to browser UA defaults.)
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
  color: var(--text-strong);
  line-height: 1.2;
  letter-spacing: -.025em;
  text-rendering: optimizeLegibility;
  text-wrap: balance;
}

h1 { font-size: var(--text-5xl); font-weight: 800; }
h2 { font-size: var(--text-4xl); font-weight: 780; }
h3 { font-size: var(--text-2xl); font-weight: 740; }
h4 { font-size: var(--text-xl); font-weight: 700; }
h5,
h6 { font-size: var(--text-lg); font-weight: 700; }


/* --------------------------------------------------------------------------
   31.3 SECTION TITLES / SUBTITLES
   -------------------------------------------------------------------------- */

.section-header h1,
.section-header h2,
.section-header h3,
.section-title,
.section-heading {
  color: #111827;
  font-weight: 800;
  letter-spacing: -.03em;
}

.section-subtitle,
.section-description,
.section-header p,
.section-intro,
.section-lead {
  color: #4b5a6e;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: -.005em;
}

.section-subtitle strong,
.section-description strong,
.section-header p strong,
.section-intro strong,
.section-lead strong {
  color: #263244;
  font-weight: 700;
}


/* --------------------------------------------------------------------------
   31.4 HERO TYPOGRAPHY
   -------------------------------------------------------------------------- */

.hero h1,
.hero h2,
.hero h3,
.hero h4,
.hero .hero-title {
  color: #ffffff;
  font-weight: 850;
  letter-spacing: -.035em;
  text-shadow:
    0 2px 3px rgba(0,0,0,.30),
    0 8px 24px rgba(0,0,0,.20);
}

.hero p,
.hero .hero-subtitle,
.hero .hero-description,
.hero .hero-lead {
  color: rgba(255,255,255,.92);
  font-weight: 500;
  line-height: 1.72;
  text-shadow:
    0 1px 2px rgba(0,0,0,.32),
    0 4px 16px rgba(0,0,0,.15);
}

.hero .hero-badge,
.hero .badge,
.hero .tag,
.hero .chip {
  color: #ffffff;
  font-weight: 750;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}


/* --------------------------------------------------------------------------
   31.5 HERO / DARK CONTENT — FORCE HIGH CONTRAST
   -------------------------------------------------------------------------- */

.hero :where(
  h1,h2,h3,h4,h5,h6,
  p,li,span,strong,b,
  .title,.subtitle,.description,
  .meta,.date,.author
) {
  color: #ffffff;
}

.hero :where(
  .subtitle,
  .description,
  .meta,
  .date,
  .author,
  small
) {
  color: rgba(255,255,255,.84);
}


/* --------------------------------------------------------------------------
   31.6 DATES / AUTHORS / METADATA
   -------------------------------------------------------------------------- */

.date,
.dates,
.post-date,
.publish-date,
.published-date,
.created-date,
.updated-date,
.article-date,
.news-date,
.review-date,
.author,
.author-name,
.post-author,
.article-author,
.review-author,
.meta,
.metadata,
.post-meta,
.article-meta,
.review-meta,
.card-meta {
  color: #526174;
  font-weight: 600;
  line-height: 1.45;
}

.author,
.author-name,
.post-author,
.article-author,
.review-author {
  color: #334155;
  font-weight: 700;
}

.date,
.dates,
.post-date,
.publish-date,
.published-date,
.created-date,
.updated-date,
.article-date,
.news-date,
.review-date {
  color: #475569;
  font-weight: 600;
}

.meta strong,
.metadata strong,
.post-meta strong,
.article-meta strong,
.review-meta strong {
  color: #1f2937;
  font-weight: 750;
}


/* --------------------------------------------------------------------------
   31.7 PUBLIC CONTENT / ARTICLES / REVIEWS
   -------------------------------------------------------------------------- */

.review-content,
.news-content,
.page-content,
.article-content,
.rich-content {
  color: #263244;
}

.review-content p,
.news-content p,
.page-content p,
.article-content p,
.rich-content p {
  color: #263244;
}

.review-content li,
.news-content li,
.page-content li,
.article-content li,
.rich-content li {
  color: #263244;
}

.review-content h2,
.review-content h3,
.review-content h4,
.news-content h2,
.news-content h3,
.news-content h4,
.page-content h2,
.page-content h3,
.page-content h4,
.article-content h2,
.article-content h3,
.article-content h4,
.rich-content h2,
.rich-content h3,
.rich-content h4 {
  color: #111827;
  font-weight: 780;
}

.review-content strong,
.news-content strong,
.page-content strong,
.article-content strong,
.rich-content strong {
  color: #172033;
  font-weight: 750;
}

.review-content a,
.news-content a,
.page-content a,
.article-content a,
.rich-content a {
  color: var(--support-primary-dark);
  font-weight: 650;
  text-decoration-thickness: 1.5px;
}

/*
  Keep the card itself readable even when its background is customized by
  another component or theme.
*/h2,
h3,
h4,
h5,
h6,
p,
li,
span,
div,
strong,
b,
small,
label
) {
  text-rendering: optimizeLegibility;
}h2,
h3,
h4,
h5,
h6
) {
  color: #111827;
  font-weight: 780;
}.casino-name,
.card-title
) {
  color: #111827;
  font-weight: 800;
  letter-spacing: -.018em;
  line-height: 1.28;
}.casino-description,
.card-description,
.description
) {
  color: #3d4b5e;
  font-weight: 500;
  line-height: 1.58;
}.rating,
.rating-value,
.score
) {
  color: #172033;
  font-weight: 800;
}.meta,
.casino-meta,
small
) {
  color: #526174;
  font-weight: 600;
}.bonus-box,
.bonus
) {
  color: #263244;
}.bonus-label
) {
  color: #526174;
  font-weight: 750;
}.bonus-amount
) {
  color: #111827;
  font-weight: 850;
  letter-spacing: -.015em;
}h2,
h3,
h4,
h5,
h6,
.casino-name,
.card-title
),
h2,
h3,
h4,
h5,
h6,
.casino-name,
.card-title
),
h2,
h3,
h4,
h5,
h6,
.casino-name,
.card-title
) {
  color: #ffffff;
  text-shadow: 0 2px 4px rgba(0,0,0,.30);
}.description,
.casino-description),
.description,
.casino-description),
.description,
.casino-description) {
  color: rgba(255,255,255,.88);
}.casino-meta,
small),
.casino-meta,
small),
.casino-meta,
small) {
  color: rgba(255,255,255,.74);
}.bonus-label),
.bonus-label),
.bonus-label) {
  color: rgba(255,255,255,.78);
}.bonus-amount),
.bonus-amount),
.bonus-amount) {
  color: #ffffff;
}


/* --------------------------------------------------------------------------
   31.10 NEWS / ARTICLE CARDS
   -------------------------------------------------------------------------- */

.news-card,
.article-card {
  color: #263244;
}

.news-card h2,
.news-card h3,
.news-card h4,
.article-card h2,
.article-card h3,
.article-card h4 {
  color: #111827;
  font-weight: 800;
}

.news-card p,
.article-card p {
  color: #3d4b5e;
  font-weight: 500;
}

.news-card .date,
.news-card .author,
.news-card .meta,
.article-card .date,
.article-card .author,
.article-card .meta {
  color: #526174;
  font-weight: 650;
}


/* --------------------------------------------------------------------------
   31.11 FEATURE CARDS
   -------------------------------------------------------------------------- */

.feature-card h2,
.feature-card h3,
.feature-card h4 {
  color: #111827;
  font-weight: 800;
}

.feature-card p {
  color: #3d4b5e;
  font-weight: 500;
}

.feature-card .feature-icon {
  color: var(--support-primary-dark);
}


/* --------------------------------------------------------------------------
   31.12 SIDEBAR CONTENT
   -------------------------------------------------------------------------- */

.sidebar-block {
  color: #263244;
}

.sidebar-block h2,
.sidebar-block h3,
.sidebar-block h4 {
  color: #111827;
  font-weight: 800;
}

.sidebar-block p,
.sidebar-block li {
  color: #3d4b5e;
}

.sidebar-block .meta,
.sidebar-block small {
  color: #526174;
  font-weight: 600;
}

.sidebar-casino :where(
  h3,.casino-name,.title
) {
  color: #172033;
  font-weight: 750;
}

.sidebar-casino :where(
  p,.description,.meta,small
) {
  color: #526174;
}


/* --------------------------------------------------------------------------
   31.13 CASINO HERO / DETAIL PAGE
   -------------------------------------------------------------------------- */

.casino-hero {
  color: #263244;
}

.casino-hero h1,
.casino-hero h2,
.casino-hero h3 {
  color: #111827;
  font-weight: 820;
}

.casino-hero p {
  color: #3d4b5e;
}

.casino-hero .casino-meta,
.casino-hero .meta,
.casino-hero .date,
.casino-hero .author {
  color: #526174;
  font-weight: 650;
}

.casino-hero .bonus-amount,
.casino-hero .bonus-value {
  color: #111827;
  font-weight: 850;
}


/* --------------------------------------------------------------------------
   31.14 BADGES / TAGS / CHIPS
   -------------------------------------------------------------------------- */

.badge,
.tag,
.pill,
.chip,
.feature-tag,
.status-badge {
  font-weight: 750;
  letter-spacing: .005em;
  text-shadow: none;
}

.badge--light,
.tag--light,
.pill--light {
  color: #1f2937;
}

.badge--dark,
.tag--dark,
.pill--dark {
  color: #ffffff;
}


/* --------------------------------------------------------------------------
   31.15 TABLE TEXT
   -------------------------------------------------------------------------- */

table th {
  color: #263244;
  font-weight: 800;
}

table td {
  color: #344256;
  font-weight: 500;
}

.admin-table th,
.mini-table th {
  color: #334155;
  font-weight: 800;
}

.admin-table td,
.mini-table td {
  color: #344256;
}

.admin-table td strong,
.mini-table td strong {
  color: #111827;
  font-weight: 750;
}


/* --------------------------------------------------------------------------
   31.16 DASHBOARD / ADMIN TEXT
   -------------------------------------------------------------------------- */

.admin-content {
  color: #263244;
}

.admin-content h1,
.admin-content h2,
.admin-content h3,
.admin-content h4 {
  color: #111827;
  font-weight: 800;
}

.admin-content p {
  color: #3d4b5e;
}

.admin-header h1 {
  color: #111827;
  font-weight: 820;
}

.admin-header p,
.admin-header .subtitle {
  color: #526174;
  font-weight: 550;
}

.stat-value {
  color: #111827;
  font-weight: 850;
}

.stat-label {
  color: #526174;
  font-weight: 650;
}

.stat-card :where(
  h2,h3,h4,p,span
) {
  text-shadow: none;
}


/* --------------------------------------------------------------------------
   31.17 FORMS
   -------------------------------------------------------------------------- */

.form-group label,
.admin-form label {
  color: #263244;
  font-weight: 750;
}

.form-group label small,
.admin-form label small {
  color: #64748b;
  font-weight: 550;
}

.form-help,
.field-help,
.help-text {
  color: #526174;
  font-weight: 500;
}


/* --------------------------------------------------------------------------
   31.18 FOOTER — MAXIMUM READABILITY
   -------------------------------------------------------------------------- */

.site-footer {
  color: #ffffff;
}

.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6 {
  color: #ffffff;
  font-weight: 800;
}

.site-footer p,
.site-footer li,
.site-footer dd,
.site-footer dt {
  color: rgba(255,255,255,.80);
  font-weight: 450;
}

.site-footer .footer-col h4 {
  color: #ffffff;
  font-weight: 800;
  letter-spacing: .08em;
}

.site-footer .footer-col a {
  color: rgba(255,255,255,.84);
  font-weight: 550;
}

.site-footer .footer-col a:hover {
  color: #ffffff;
}

.site-footer .rg-text {
  color: rgba(255,255,255,.82);
  font-weight: 500;
}

.site-footer .disclaimer-text {
  color: rgba(255,255,255,.72);
  font-weight: 450;
  line-height: 1.65;
}

.site-footer .footer-bottom {
  color: rgba(255,255,255,.76);
  font-weight: 500;
}


/* --------------------------------------------------------------------------
   31.19 MOBILE TEXT VISIBILITY
   -------------------------------------------------------------------------- */

@media (max-width: 768px) {

  h1,
  h2,
  h3,
  h4 {
    letter-spacing: -.018em;
  }

  .section-subtitle,
  .section-description,
  .section-header p {
    line-height: 1.65;
  }.casino-name,
.card-title
  ) {
    font-size: 17px;
  }.description,
.casino-description
  ) {
    color: #3b495b;
  }.casino-meta,
small
  ) {
    color: #526174;
  }

  .news-card h3,
  .feature-card h3 {
    font-size: 17px;
  }

  .news-card p,
  .feature-card p {
    color: #3b495b;
  }

  .site-footer p,
  .site-footer li,
  .site-footer .rg-text {
    color: rgba(255,255,255,.84);
  }

  .site-footer .disclaimer-text {
    color: rgba(255,255,255,.76);
  }
}


/* --------------------------------------------------------------------------
   31.20 HIGH-CONTRAST / LOW-LIGHT ENVIRONMENTS
   -------------------------------------------------------------------------- */

@media (prefers-contrast: more) {

  body {
    color: #111827;
  }.news-card,
.feature-card,
.info-card,
.info-block,
.sidebar-block,
.admin-section,
.admin-form {
    border-color: #b8c2d1;
  }h2,
h3,
h4,
h5,
h6),
.news-card :where(h1,
h2,
h3,
h4,
h5,
h6),
.feature-card :where(h1,
h2,
h3,
h4,
h5,
h6) {
    color: #0b1220;
  }.description),
.news-card :where(p,
.description),
.feature-card :where(p,
.description) {
    color: #27364a;
  }

  .site-footer :where(p,li,a,span) {
    color: #ffffff;
  }

  .hero :where(p,li,span) {
    color: #ffffff;
  }
}


/* --------------------------------------------------------------------------
   31.21 TEXT OVER IMAGES / GRADIENTS / VISUAL MEDIA
   -------------------------------------------------------------------------- */

.text-over-image,
.overlay-content,
.image-overlay,
.hero-overlay,
.card-overlay {
  color: #ffffff;
}

.text-over-image :where(
  h1,h2,h3,h4,h5,h6
),
.overlay-content :where(
  h1,h2,h3,h4,h5,h6
),
.image-overlay :where(
  h1,h2,h3,h4,h5,h6
),
.hero-overlay :where(
  h1,h2,h3,h4,h5,h6
),
.card-overlay :where(
  h1,h2,h3,h4,h5,h6
) {
  color: #ffffff;
  text-shadow:
    0 2px 4px rgba(0,0,0,.55),
    0 8px 22px rgba(0,0,0,.28);
}

.text-over-image :where(
  p,span,small,.meta,.date,.author
),
.overlay-content :where(
  p,span,small,.meta,.date,.author
),
.image-overlay :where(
  p,span,small,.meta,.date,.author
),
.hero-overlay :where(
  p,span,small,.meta,.date,.author
),
.card-overlay :where(
  p,span,small,.meta,.date,.author
) {
  color: rgba(255,255,255,.92);
  text-shadow:
    0 1px 3px rgba(0,0,0,.58),
    0 5px 16px rgba(0,0,0,.25);
}


/* --------------------------------------------------------------------------
   31.22 PREVENT "FAINT TEXT" FROM BEING ACCIDENTALLY CREATED
   -------------------------------------------------------------------------- */

.main-content :where(
  .text-light,
  .text-white-50,
  .opacity-50,
  .opacity-60,
  .opacity-70
) {
  /*
    Keep existing utility classes functional but prevent critical content
    from becoming unreadable.
  */
  color: #526174;
}

.hero :where(
  .text-light,
  .text-white-50,
  .opacity-50,
  .opacity-60,
  .opacity-70
),
.site-footer :where(
  .text-light,
  .text-white-50,
  .opacity-50,
  .opacity-60,
  .opacity-70
) {
  color: rgba(255,255,255,.82);
}


/* --------------------------------------------------------------------------
   31.23 LINKS
   -------------------------------------------------------------------------- */

.main-content a,
.page-content a,
.review-content a,
.news-content a {
  color: var(--support-primary-dark);
  font-weight: 600;
}

.main-content a:hover,
.page-content a:hover,
.review-content a:hover,
.news-content a:hover {
  color: var(--support-primary);
}


/* --------------------------------------------------------------------------
   31.24 FINAL FONT RENDERING
   -------------------------------------------------------------------------- */

:where(
  h1,h2,h3,h4,h5,h6,
  .section-title,
  .section-heading,
  .hero-title,
  .casino-name,
  .card-title,
  .stat-value,
  .bonus-value,
  .bonus-amount
) {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* --------------------------------------------------------------------------
   32.1 GLOBAL SECTION RHYTHM
   -------------------------------------------------------------------------- */

main > section,
.main-content > section,
.page-content > section,
.content-section,
.page-section,
.section {
  margin-top: clamp(24px, 3vw, 42px);
  margin-bottom: clamp(24px, 3vw, 42px);
}

/*
  The first section should not receive an unnecessary top gap when the
  container/header already provides spacing.
*/
main > section:first-child,
.main-content > section:first-child,
.page-content > section:first-child,
.content-section:first-child,
.page-section:first-child,
.section:first-child {
  margin-top: 0;
}

/*
  When two sections sit directly together, don't let both margins stack
  visually into a large empty area.
*/

main > section + section,
.main-content > section + section,
.page-content > section + section,
.content-section + .content-section,
.page-section + .page-section,
.section + .section {
  margin-top: clamp(18px, 2.2vw, 30px);
}


/* --------------------------------------------------------------------------
   32.3 SECTION HEADER SPACING
   -------------------------------------------------------------------------- */

.section-header {
  margin-bottom: 18px;
}

.section-header h1,
.section-header h2,
.section-header h3,
.section-header h4 {
  margin-top: 0;
  margin-bottom: 7px;
}

.section-header p,
.section-subtitle,
.section-description,
.section-intro {
  margin-top: 0;
  margin-bottom: 0;
}


/* --------------------------------------------------------------------------
   32.4 HEADING → CONTENT
   -------------------------------------------------------------------------- */

section > h1,
section > h2,
section > h3,
section > h4 {
  margin-top: 0;
  margin-bottom: 14px;
}

section > h1 + p,
section > h2 + p,
section > h3 + p,
section > h4 + p {
  margin-top: 0;
}

/*
  Avoid a large blank region after card grids.
*/.news-grid,
.feature-grid,
.cards-grid,
.card-grid {
  margin-bottom: 0;
}.news-grid + *,
.feature-grid + *,
.cards-grid + *,
.card-grid + * {
  margin-top: clamp(18px, 2vw, 28px);
}


/* --------------------------------------------------------------------------
   32.6 HERO → FIRST CONTENT SECTION
   -------------------------------------------------------------------------- */

.hero + section,
.hero + .content-section,
.hero + .page-section,
.hero + main section {
  margin-top: clamp(20px, 2.5vw, 34px);
}


/* --------------------------------------------------------------------------
   32.7 BREADCRUMBS → TITLE
   -------------------------------------------------------------------------- */

.breadcrumbs {
  margin-bottom: 12px;
}

.breadcrumbs + h1,
.breadcrumbs + h2,
.breadcrumbs + .section-header,
.breadcrumbs + .page-header {
  margin-top: 0;
}


/* --------------------------------------------------------------------------
   32.8 PAGE HEADER → FIRST SECTION
   -------------------------------------------------------------------------- */

.page-header,
.content-header,
.admin-header {
  margin-bottom: clamp(18px, 2.2vw, 30px);
}

.page-header h1,
.content-header h1,
.admin-header h1 {
  margin-top: 0;
  margin-bottom: 7px;
}

.page-header p,
.content-header p,
.admin-header p {
  margin-top: 0;
}


/* --------------------------------------------------------------------------
   32.9 RELATED CONTENT SHOULD FEEL CONNECTED
   -------------------------------------------------------------------------- */

.related-content,
.related-casinos,
.related-reviews,
.related-news,
.recommended-casinos,
.recommendations {
  margin-top: clamp(22px, 2.5vw, 34px);
}

.related-content > h2,
.related-casinos > h2,
.related-reviews > h2,
.related-news > h2,
.recommended-casinos > h2,
.recommendations > h2 {
  margin-top: 0;
  margin-bottom: 14px;
}


/* --------------------------------------------------------------------------
   32.10 DETAIL PAGE CONTENT RHYTHM
   -------------------------------------------------------------------------- */

.review-content > section,
.article-content > section,
.rich-content > section,
.casino-detail > section {
  margin-top: 28px;
  margin-bottom: 28px;
}

.review-content > section:first-child,
.article-content > section:first-child,
.rich-content > section:first-child,
.casino-detail > section:first-child {
  margin-top: 0;
}


/* --------------------------------------------------------------------------
   32.11 CONTENT HEADINGS
   -------------------------------------------------------------------------- */

.review-content h2,
.article-content h2,
.rich-content h2,
.casino-detail h2 {
  margin-top: 28px;
  margin-bottom: 12px;
}

.review-content h3,
.article-content h3,
.rich-content h3,
.casino-detail h3 {
  margin-top: 22px;
  margin-bottom: 9px;
}

.review-content h2:first-child,
.article-content h2:first-child,
.rich-content h2:first-child,
.casino-detail h2:first-child {
  margin-top: 0;
}


/* --------------------------------------------------------------------------
   32.12 PARAGRAPH RHYTHM
   -------------------------------------------------------------------------- */

.review-content p,
.article-content p,
.rich-content p,
.page-content p {
  margin-top: 0;
  margin-bottom: 12px;
}

.review-content p + p,
.article-content p + p,
.rich-content p + p,
.page-content p + p {
  margin-top: 0;
}


/* --------------------------------------------------------------------------
   32.13 LISTS — DON'T CREATE HUGE GAPS
   -------------------------------------------------------------------------- */

.review-content ul,
.review-content ol,
.article-content ul,
.article-content ol,
.rich-content ul,
.rich-content ol {
  margin-top: 8px;
  margin-bottom: 14px;
}

.review-content li,
.article-content li,
.rich-content li {
  margin-bottom: 5px;
}


/* --------------------------------------------------------------------------
   32.14 INFO BLOCKS / BOXES
   -------------------------------------------------------------------------- */

.info-block,
.info-card,
.content-card,
.editorial-block {
  margin-top: 18px;
  margin-bottom: 18px;
}

.info-block:first-child,
.info-card:first-child,
.content-card:first-child,
.editorial-block:first-child {
  margin-top: 0;
}

.info-block:last-child,
.info-card:last-child,
.content-card:last-child,
.editorial-block:last-child {
  margin-bottom: 0;
}


/* --------------------------------------------------------------------------
   32.16 SIDEBAR RHYTHM
   -------------------------------------------------------------------------- */

.sidebar-block + .sidebar-block,
.sidebar-card + .sidebar-card {
  margin-top: 18px;
}

.sidebar-block h2,
.sidebar-block h3,
.sidebar-block h4 {
  margin-top: 0;
  margin-bottom: 10px;
}


/* --------------------------------------------------------------------------
   32.17 TABLE RHYTHM
   -------------------------------------------------------------------------- */

.table-wrapper,
.table-responsive,
.admin-table-wrapper {
  margin-top: 14px;
  margin-bottom: 20px;
}

table {
  margin-top: 0;
  margin-bottom: 0;
}


/* --------------------------------------------------------------------------
   32.18 FORMS — KEEP FIELDS COMPACT BUT PROFESSIONAL
   -------------------------------------------------------------------------- */

.form-group,
.form-field,
.admin-form .form-group {
  margin-bottom: 16px;
}

.form-group:last-child,
.form-field:last-child {
  margin-bottom: 0;
}

.form-section + .form-section,
.form-group + .form-section {
  margin-top: 22px;
}


/* --------------------------------------------------------------------------
   32.19 DASHBOARD SECTIONS
   -------------------------------------------------------------------------- */

.admin-section + .admin-section {
  margin-top: 22px;
}

.stats-grid + .admin-section,
.admin-section + .stats-grid {
  margin-top: 22px;
}

.admin-section h2,
.admin-section h3 {
  margin-top: 0;
  margin-bottom: 14px;
}

/*
  Keep the footer visually separated from content, but avoid an excessive
  empty zone before it.
*/

.layout-wrapper + .site-footer {
  margin-top: 30px;
}

/* --------------------------------------------------------------------------
   32.21 REMOVE ACCIDENTAL EMPTY SPACE FROM EMPTY CONTAINERS
   -------------------------------------------------------------------------- */.section:empty,
.content-section:empty,
.page-section:empty,
.info-block:empty,
.card-grid:empty {
  display: none;
}


/* --------------------------------------------------------------------------
   32.22 COLLAPSE UNNECESSARY LAST-CHILD MARGINS
   -------------------------------------------------------------------------- */

section > :last-child,
.section > :last-child,
.content-section > :last-child,
.page-section > :last-child,
.info-block > :last-child,
.info-card > :last-child,
.editorial-block > :last-child {
  margin-bottom: 0;
}


/* --------------------------------------------------------------------------
   32.23 MOBILE — TIGHTER BUT STILL PREMIUM
   -------------------------------------------------------------------------- */

@media (max-width: 768px) {

  main > section,
  .main-content > section,
  .page-content > section,
  .content-section,
  .page-section,
  .section {
    margin-top: 22px;
    margin-bottom: 22px;
  }

  main > section + section,
  .main-content > section + section,
  .page-content > section + section,
  .content-section + .content-section,
  .page-section + .page-section,
  .section + .section {
    margin-top: 16px;
  }

  .section-header {
    margin-bottom: 14px;
  }

  .section-header h1,
  .section-header h2,
  .section-header h3 {
    margin-bottom: 6px;
  }

  .hero + section,
  .hero + .content-section,
  .hero + .page-section {
    margin-top: 18px;
  }

  .related-content,
  .related-casinos,
  .related-reviews,
  .related-news,
  .recommended-casinos,
  .recommendations {
    margin-top: 20px;
  }

  .review-content > section,
  .article-content > section,
  .rich-content > section,
  .casino-detail > section {
    margin-top: 22px;
    margin-bottom: 22px;
  }

  .review-content h2,
  .article-content h2,
  .rich-content h2,
  .casino-detail h2 {
    margin-top: 22px;
    margin-bottom: 10px;
  }

  .info-block,
  .info-card,
  .content-card,
  .editorial-block {
    margin-top: 14px;
    margin-bottom: 14px;
  }

  .sidebar-block + .sidebar-block,
  .sidebar-card + .sidebar-card {
    margin-top: 14px;
  }
  .layout-wrapper + .site-footer {
    margin-top: 20px;
  }
}


/* --------------------------------------------------------------------------
   32.24 VERY SMALL SCREENS
   -------------------------------------------------------------------------- */

@media (max-width: 480px) {

  main > section,
  .main-content > section,
  .page-content > section,
  .content-section,
  .page-section,
  .section {
    margin-top: 18px;
    margin-bottom: 18px;
  }

  main > section + section,
  .main-content > section + section,
  .page-content > section + section,
  .content-section + .content-section,
  .page-section + .page-section,
  .section + .section {
    margin-top: 14px;
  }

  .section-header {
    margin-bottom: 12px;
  }

  .section-header p,
  .section-subtitle,
  .section-description {
    line-height: 1.55;
  }
}


/* ==========================================================================
   END OF SECTION RHYTHM / VERTICAL SPACING SYSTEM
   ========================================================================== */

/* ==========================================================================
   FULL-BLEED CONTAINERS ON MOBILE (platform-wide)
   Zeroes out .container's own side padding below 768px, so every
   section built on .container -- home, listing pages (category,
   country, news-list), detail pages (casino, review, news), cards,
   grids, text blocks -- spans the full device width. This has to be
   the last rule touching .container in the whole cascade (hence
   living at the very end of the last-loaded stylesheet): the
   max-width:768px block earlier in this same file is what actually
   sets the 16px mobile gutter today, so anything upstream of this
   point gets overridden by it.

   Long-form reading text (article bodies) gets its own inset put
   back below -- .container itself going flush is fine, but body
   copy glued to the literal screen edge hurts readability and isn't
   what "full-bleed" is going for in editorial content. Card-style
   components (casino-card, news-card, info-block, etc.) already
   carry their own internal padding, so they don't need this --
   their outer edge is meant to touch the screen.
   ========================================================================== */

@media (max-width: 767px) {
  .container {
    padding-left: 0;
    padding-right: 0;
  }

  .review-content,
  .news-content,
  .page-content,
  .rich-content,
  .hero-content,
  .section-header {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* ==========================================================================
   ORANGE ACCENT BORDERS -- cards & content containers, all pages
   Applies to every card-shaped unit on the platform (casino cards,
   news cards, text/info cards, sidebar blocks, auth cards) so they
   read as a consistent family. Uses var(--primary), the platform's
   live theme-accent token (currently #EE9F28), rather than a
   hardcoded color, so it tracks the theme if that token ever changes
   rather than drifting out of sync with it.
   ========================================================================== */

.casino-card,
.news-card,
.info-block,
.info-card,
.pros-cons-block,
.sidebar-block,
.auth-card,
.feature-card,
.review-summary {
  border: 1px solid var(--primary);
}