/*
 * 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(--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 {
  font-family: var(--support-font-body);
  color: var(--support-text);
  font-size: 15px;
  line-height: 1.65;
  letter-spacing: -.005em;
}

button,input,select,textarea { font: inherit; }

h1,h2,h3,h4,h5,h6 {
  color: var(--support-text);
  line-height: 1.18;
  letter-spacing: -.025em;
  text-wrap: balance;
}
h1{font-weight:800} h2{font-weight:750} h3{font-weight:700} h4,h5,h6{font-weight:650}
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 */
.site-header {
  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,.07);
  box-shadow:0 8px 30px rgba(15,23,42,.10);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
}
.header-inner{min-height:64px;height:auto;padding-top:8px;padding-bottom:8px;gap:12px}
.logo{min-width:0}
.logo-icon{filter:drop-shadow(0 5px 14px rgba(168,85,247,.20));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 rgba(168,85,247,.18)}
.main-nav{align-items:center}
.main-nav a{position:relative;padding:9px 2px;border-radius:6px;transition:color .14s ease}
.main-nav a::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:2px;border-radius:999px;background:var(--support-primary);transform:scaleX(0);transition:transform .22s ease}
.main-nav a:hover::after,.main-nav a.active::after,.main-nav a[aria-current="page"]::after{transform:scaleX(1)}
.header-actions{gap:10px}
.search-box input{min-height:40px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.08);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:focus{width:240px;outline:none;border-color:color-mix(in srgb,var(--support-primary) 70%,white 10%);background:rgba(255,255,255,.12);box-shadow:0 0 0 3px rgba(108,92,231,.18)}
.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}
.nav-toggle:hover{background:rgba(255,255,255,.08)}

/* 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 */
.casino-grid,.news-grid,.features-grid{align-items:stretch}
.casino-card,.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)}
.casino-card,.news-card{position:relative;isolation:isolate}
.casino-card{border-radius:var(--support-radius-lg);box-shadow:var(--support-shadow-sm);transition:transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .22s,border-color .22s}
.casino-card::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(145deg,color-mix(in srgb,var(--support-primary) 7%,transparent),transparent 42%);opacity:0;transition:opacity .22s;pointer-events:none}
.casino-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--support-primary) 24%,var(--support-border));box-shadow:var(--support-shadow-lg)}
.casino-card:hover::after{opacity:1}
.casino-card__header{min-height:82px;padding:18px}
.casino-card__logo{width:52px;height:52px;flex:0 0 52px;padding:5px;background:#fff;border:1px solid var(--support-border);box-shadow:var(--support-shadow-xs)}
.casino-card__body{padding:0 18px 14px}
.casino-card__body h3{font-size:18px;line-height:1.25}
.casino-card__rating{font-weight:700;letter-spacing:.01em}
.casino-card__bonus{margin-top:12px;border:1px solid color-mix(in srgb,var(--support-primary) 12%,var(--support-border));background:linear-gradient(135deg,color-mix(in srgb,var(--support-primary) 5%,var(--support-bg)),var(--support-bg))}
.bonus-title{letter-spacing:.07em;font-weight:700}.bonus-value{font-size:17px}
.casino-card__actions{padding:0 18px 18px}
.casino-card__actions .btn{min-width:0}
.casino-card__bookmark{box-shadow:0 8px 20px rgba(0,0,0,.20);backdrop-filter:blur(10px)}
.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:70px;background:radial-gradient(circle at 10% 0%,rgba(108,92,231,.13),transparent 28%),radial-gradient(circle at 90% 30%,rgba(168,85,247,.08),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{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}
  .casino-grid,.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}.casino-card__header{padding:16px}.casino-card__body,.casino-card__actions{padding-left:16px;padding-right:16px}.casino-card__actions{flex-direction:column}.casino-card__actions .btn{width:100%}.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,.casino-card__bookmark{display:none!important}
  body{background:#fff;color:#000}.layout-wrapper,.admin-wrapper,.casino-body{display:block;max-width:none;margin:0;padding:0}.admin-content{padding:0;background:#fff}
  .casino-card,.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}

/* ==========================================================================
   30. FINAL VISUAL CONSISTENCY PASS
   ========================================================================== */

/* Equal-height casino cards: content may differ, card/action rows stay aligned. */
.casino-grid{align-items:stretch}
.casino-grid>.casino-card{height:100%;min-height:100%;display:flex;flex-direction:column;align-self:stretch;box-sizing:border-box}
.casino-grid>.casino-card .casino-card__header{flex:0 0 auto}
.casino-grid>.casino-card .casino-card__body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.casino-grid>.casino-card .casino-card__bonus{margin-top:auto}
.casino-grid>.casino-card .casino-card__actions{flex:0 0 auto;margin-top:0}

/* High-clarity typography on normal/light surfaces. */
: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,.casino-card){color:var(--support-text)}
: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,.casino-card) :where(.muted,.text-muted,small,.help-text,.form-help,.field-help){color:#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 :where(p,li,dd,dt,span,small,.rg-text,.disclaimer-text,.footer-bottom){color:rgba(255,255,255,.78)}
.site-footer :where(.footer-col h4,h1,h2,h3,h4,h5,h6){color:#fff}
.site-footer :where(a){color:rgba(255,255,255,.84);text-shadow:0 1px 2px rgba(0,0,0,.2)}
.site-footer :where(a:hover,a:focus-visible){color:#fff}

/* 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)}

/* Modern navbar: refined desktop + responsive mobile treatment. */
.site-header{position:sticky;top:0;z-index:1000;background:linear-gradient(180deg,rgba(20,22,42,.98),rgba(26,26,46,.95));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)}
.header-inner{position:relative;min-height:68px}
.main-nav{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) ease,background var(--support-fast) ease,transform var(--support-fast) ease}
.main-nav a::after{display:none}
.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,rgba(108,92,231,.28),rgba(108,92,231,.1));box-shadow:inset 0 0 0 1px rgba(167,139,250,.17),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:#a78bfa;box-shadow:0 0 10px rgba(167,139,250,.75)}
.nav-toggle{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:rgba(108,92,231,.18);border-color:rgba(167,139,250,.3)}
.search-box input{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.065);color:#fff;border-radius:9px}
.search-box input::placeholder{color:rgba(255,255,255,.52)}
.search-box input:focus{border-color:rgba(167,139,250,.55);background:rgba(255,255,255,.095);box-shadow:0 0 0 3px rgba(108,92,231,.2),inset 0 1px 0 rgba(255,255,255,.05)}

@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,rgba(108,92,231,.23),rgba(108,92,231,.06))}
 .main-nav a.active::before,.main-nav a[aria-current="page"]::before{width:6px;height:22px;margin-right:9px;border-radius:5px}
 .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:48px}.site-footer :where(p,li,dd,dt,span,small,.rg-text,.disclaimer-text,.footer-bottom){color:rgba(255,255,255,.82)}}








/* ==========================================================================
   31. FINAL TYPOGRAPHY + CONTENT VISIBILITY / CONTRAST PASS
   ==========================================================================
   Purpose:
   - Make every important title, subtitle, author, date and card text clearly
     readable across light, dark, gradient and image-backed surfaces.
   - Preserve existing layout, sizing and functionality.
   - Avoid relying on shadows alone for readability.
   ========================================================================== */


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

:root {
  --text-strong: #111827;
  --text-body: #263244;
  --text-secondary: #526174;
  --text-muted-strong: #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
   -------------------------------------------------------------------------- */

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

h1 {
  font-weight: 800;
}

h2 {
  font-weight: 780;
}

h3 {
  font-weight: 740;
}

h4,
h5,
h6 {
  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;
}


/* --------------------------------------------------------------------------
   31.8 CASINO CARD TYPOGRAPHY
   -------------------------------------------------------------------------- */

.casino-card {
  color: #263244;
}

/*
  Keep the card itself readable even when its background is customized by
  another component or theme.
*/

.casino-card :where(
  h1,h2,h3,h4,h5,h6,
  p,li,span,div,
  strong,b,
  small,
  label
) {
  text-rendering: optimizeLegibility;
}

.casino-card :where(
  h1,h2,h3,h4,h5,h6
) {
  color: #111827;
  font-weight: 780;
}

.casino-card :where(
  h3,
  .casino-card__title,
  .casino-name,
  .card-title
) {
  color: #111827;
  font-weight: 800;
  letter-spacing: -.018em;
  line-height: 1.28;
}

.casino-card :where(
  p,
  .casino-description,
  .card-description,
  .description
) {
  color: #3d4b5e;
  font-weight: 500;
  line-height: 1.58;
}

.casino-card :where(
  .casino-card__rating,
  .rating,
  .rating-value,
  .score
) {
  color: #172033;
  font-weight: 800;
}

.casino-card :where(
  .casino-card__meta,
  .meta,
  .casino-meta,
  small
) {
  color: #526174;
  font-weight: 600;
}

.casino-card :where(
  .casino-card__bonus,
  .bonus-box,
  .bonus
) {
  color: #263244;
}

.casino-card :where(
  .bonus-title,
  .bonus-label
) {
  color: #526174;
  font-weight: 750;
}

.casino-card :where(
  .bonus-value,
  .bonus-amount
) {
  color: #111827;
  font-weight: 850;
  letter-spacing: -.015em;
}

.casino-card :where(
  .casino-card__body
) {
  color: #263244;
}


/* --------------------------------------------------------------------------
   31.9 CASINO CARD — DARK / COLORED CARD VARIANTS
   -------------------------------------------------------------------------- */

/*
  If a casino card intentionally has a dark background, the content switches
  to a high-contrast light palette.
*/

.casino-card.dark,
.casino-card.dark-card,
.casino-card[data-theme="dark"],
.casino-card[style*="background:#"],
.casino-card[style*="background: #"] {
  color: #ffffff;
}

.casino-card.dark :where(
  h1,h2,h3,h4,h5,h6,
  .casino-card__title,
  .casino-name,
  .card-title
),
.casino-card.dark-card :where(
  h1,h2,h3,h4,h5,h6,
  .casino-card__title,
  .casino-name,
  .card-title
),
.casino-card[data-theme="dark"] :where(
  h1,h2,h3,h4,h5,h6,
  .casino-card__title,
  .casino-name,
  .card-title
) {
  color: #ffffff;
  text-shadow: 0 2px 4px rgba(0,0,0,.30);
}

.casino-card.dark :where(p,.description,.casino-description),
.casino-card.dark-card :where(p,.description,.casino-description),
.casino-card[data-theme="dark"] :where(p,.description,.casino-description) {
  color: rgba(255,255,255,.88);
}

.casino-card.dark :where(.meta,.casino-meta,small),
.casino-card.dark-card :where(.meta,.casino-meta,small),
.casino-card[data-theme="dark"] :where(.meta,.casino-meta,small) {
  color: rgba(255,255,255,.74);
}

.casino-card.dark :where(.bonus-title,.bonus-label),
.casino-card.dark-card :where(.bonus-title,.bonus-label),
.casino-card[data-theme="dark"] :where(.bonus-title,.bonus-label) {
  color: rgba(255,255,255,.78);
}

.casino-card.dark :where(.bonus-value,.bonus-amount),
.casino-card.dark-card :where(.bonus-value,.bonus-amount),
.casino-card[data-theme="dark"] :where(.bonus-value,.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-card :where(
    h3,
    .casino-card__title,
    .casino-name,
    .card-title
  ) {
    font-size: 17px;
  }

  .casino-card :where(
    p,
    .description,
    .casino-description
  ) {
    color: #3b495b;
  }

  .casino-card :where(
    .meta,
    .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;
  }

  .casino-card,
  .news-card,
  .feature-card,
  .info-card,
  .info-block,
  .sidebar-block,
  .admin-section,
  .admin-form {
    border-color: #b8c2d1;
  }

  .casino-card :where(h1,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;
  }

  .casino-card :where(p,.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;
}


/* ==========================================================================
   END OF FINAL TYPOGRAPHY + VISIBILITY PASS
   ========================================================================== */