:root {
    --gold-primary: #f6d889;
    --gold-accent: #e4b347;
    --gold-deep: #b47914;
    --gold-glow: rgba(246,216,137,.35);
    --bg-deep: #080604;
    --bg-panel: rgba(18,14,10,.55);
    --radius-full: 40px;
    /* Font stacks */
    --font-sans: "Montserrat", "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --font-heading: "Montserrat", "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --fixed-header-h: 0; /* fallback */
}

/* Global paragraph sizing */
p { font-size:14px; line-height:1.5; }

/* Global body background with layered warm glow */
html, body {
    background: url('/assets/img/bghome.jpg') fixed center center;
    background-size: cover;
}

body {
    position: relative;
    min-height: 100vh;
    font-family: var(--font-sans);
    font-optical-sizing: auto;
}

body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 50% -10%, rgba(180,90,0,.35), rgba(60,30,0,.25) 35%, rgba(12,8,4,.9) 70%);
    z-index: -1;
    pointer-events: none;
}

/* Curved horizon / arc overlay */
body::before {
    content: "";
    position: fixed;
    left: 50%;
    top: -18vh;
    width: 180vw;
    height: 70vh;
    transform: translateX(-50%);
    background: radial-gradient(circle at 50% 35%, rgba(255,200,120,.10), transparent 62%), linear-gradient(140deg, rgba(255,170,60,.12), rgba(120,60,10,.05) 40%, rgba(0,0,0,0) 80%);
    border-bottom-left-radius: 50% 100%;
    border-bottom-right-radius: 50% 100%;
    pointer-events: none;
    z-index: 0;
    filter: blur(2px);
}

/* Optional subtle light shafts */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    background: linear-gradient(115deg, rgba(255,180,70,.05), rgba(0,0,0,0) 60%), linear-gradient(60deg, rgba(255,180,70,.04), rgba(0,0,0,0) 55%);
    pointer-events: none;
    mix-blend-mode: screen;
    z-index: 0;
}

/* Elevate stacking context for main content */
.site-header, main, footer, .live-box, .category-block, .widget {
    position: relative;
    z-index: 2;
}

/* Gold buttons override */
.btn-gold, .btn.btn-gold {
    background: linear-gradient(135deg, var(--gold-primary) 0%, var(--gold-accent) 45%, var(--gold-deep) 100%);
    color: #14100a;
    font-weight: 600;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 6px 18px -6px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.06), 0 0 0 1px rgba(246,216,137,.35) inset;
    border-radius: 28px;
    padding: .7rem 1.3rem;
    letter-spacing: .4px;
    position: relative;
    overflow: hidden;
}

.btn-gold:hover {
    filter: brightness(1.07);
    box-shadow: 0 10px 24px -8px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.08), 0 0 0 1px rgba(246,216,137,.45) inset;
}

.btn-gold:active {
    transform: translateY(2px);
}

.btn-outline-gold {
    border-radius: 28px;
}

/* Form controls */
.form-control, .form-control-lg {
    background: rgba(18,14,10,.65);
    border: 1px solid rgba(255,255,255,.08);
    color: #f4f2ef;
    box-shadow: 0 0 0 1px rgba(255,255,255,.04);
}

.form-control:focus {
    background: rgba(24,18,12,.75);
    border-color: var(--gold-accent);
    box-shadow: 0 0 0 1px var(--gold-accent), 0 0 0 4px rgba(246,216,137,.25);
    color: #fff;
}

/* Panel glass unify */
.glass-panel, .widget, .card-casino, .comments-card, .player-card {
    background: linear-gradient(160deg, rgba(22,18,14,.55), rgba(14,10,8,.58));
    backdrop-filter: blur(34px) saturate(160%);
    -webkit-backdrop-filter: blur(34px) saturate(160%);
    border: 1px solid rgba(255,255,255,.07);
    box-shadow: 0 12px 32px -12px rgba(0,0,0,.75), 0 0 0 1px rgba(255,255,255,.05);
}

.glass-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: 22px;
    background: radial-gradient(circle at 18% 18%, rgba(255,220,140,.08), transparent 60%);
}

/* Navigation tweaks */
.site-header {
    background: rgba(12,10,8,.78);
    border-bottom: 1px solid rgba(255,255,255,.07);
    backdrop-filter: blur(20px);
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1090;
    width: 100%;
}

/* Body offset for fixed header */
body.with-fixed-header { padding-top: var(--fixed-header-h); background: #2e100a;}
@media (max-width: 991.98px){ body.with-fixed-header { padding-top: calc(var(--fixed-header-h) + 4px); } }

.navbar-nav .nav-link {
    font-weight: 500;
}

.navbar-nav .nav-link.active {
    color: var(--gold-primary);
}

/* Dropdown */
.navbar .dropdown-menu {
    background: rgba(18,14,10,.9);
    backdrop-filter: blur(26px) saturate(160%);
    border: 1px solid rgba(255,255,255,.08);
}

/* Category block highlight */
.category-block {
    border: 1px solid rgba(246,216,137,.18);
    background: linear-gradient(145deg, rgba(246,216,137,.08), rgba(24,18,12,.65));
}

/* Footer */
.site-footer {
    background: #070504;
    border-top: 1px solid rgba(255,255,255,.07);
}

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,.06);
}

/* === Enhanced Footer === */
.footer-premium {
    background: linear-gradient(180deg, #0b0907 0%, #070504 60%, #050403 100%);
    position: relative;
    font-size: .85rem;
}
.footer-premium .footer-bg-layer {
    position:absolute;inset:0;pointer-events:none;
    background:
      radial-gradient(circle at 18% 22%, rgba(246,216,137,.15), transparent 62%),
      radial-gradient(circle at 82% 78%, rgba(246,216,137,.12), transparent 65%),
      linear-gradient(140deg, rgba(246,216,137,.06), rgba(0,0,0,0) 60%);
    mix-blend-mode: overlay;
}
.footer-grid { display:grid; gap:2.2rem 2rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.footer-col-title { font-size:.75rem; text-transform:uppercase; letter-spacing:.55px; font-weight:600; color:var(--gold-primary); display:flex; align-items:center; gap:.45rem; margin:0 0 1rem; }
.footer-col-title i { color:var(--gold-primary); filter:drop-shadow(0 0 4px rgba(246,216,137,.4)); }
.footer-brand-logo { max-height:46px; width:auto; filter: drop-shadow(0 4px 12px rgba(0,0,0,.6)); }
.footer-brand-text { font-size:1.05rem; font-weight:600; letter-spacing:.6px; }
.footer-desc { line-height:1.5; }
.footer-links li { margin:0 0 .55rem; }
.footer-links li a { display:flex; align-items:center; gap:.55rem; color:#d5d1ca; text-decoration:none; padding:.4rem .55rem; border-radius:10px; font-size:.72rem; letter-spacing:.3px; background:rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.04); transition:background .35s, border-color .35s, color .35s; }
.footer-links li a i { color:var(--gold-primary); font-size:.6rem; }
.footer-links li a:hover { background:linear-gradient(145deg, rgba(246,216,137,.12), rgba(24,18,12,.55)); border-color:rgba(246,216,137,.35); color:#fff; }
.footer-social .social-btn { --_sz:38px; width:var(--_sz); height:var(--_sz); display:inline-flex; align-items:center; justify-content:center; border-radius:14px; background:linear-gradient(140deg, rgba(246,216,137,.10), rgba(24,18,12,.75)); border:1px solid rgba(246,216,137,.25); color:var(--gold-primary); transition:filter .35s, transform .25s, box-shadow .4s; position:relative; overflow:hidden; }
.footer-social .social-btn::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0)); opacity:.4; pointer-events:none; }
.footer-social .social-btn:hover { filter:brightness(1.08); transform:translateY(-3px); box-shadow:0 8px 20px -8px rgba(0,0,0,.75), 0 0 0 1px rgba(246,216,137,.45) inset; }
.footer-disclaimer { line-height:1.5; font-size:.7rem; background:rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.05); padding:.65rem .75rem; border-radius:14px; }
.footer-note { font-size:.62rem; letter-spacing:.4px; }
.footer-divider { height:1px; background:linear-gradient(90deg, rgba(246,216,137,0), rgba(246,216,137,.55) 50%, rgba(246,216,137,0)); opacity:.8; }
.footer-bottom { font-size:.65rem; }
@media (max-width: 600px){ .footer-links li a { font-size:.68rem; padding:.4rem .55rem; } .footer-grid { gap:1.8rem 1.4rem; } }

/* Subtle text coloring */
.text-gold {
    color: var(--gold-primary)!important;
}

.link-gold {
    color: var(--gold-primary);
}

.link-gold:hover {
    color: #ffeec4;
}

/* Utility new */
.shadow-gold-soft {
    box-shadow: 0 0 0 1px rgba(246,216,137,.25), 0 8px 24px -8px rgba(0,0,0,.75);
}

/* Responsive arc adjustment */
@media (max-width: 768px) {
    body::before {
        top:-22vh;
        height: 65vh;
        width: 200vw;
    }
}

@media (prefers-reduced-transparency: reduce) {
    .glass-panel, .widget, .card-casino, .comments-card, .player-card {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: #14110c;
    }
}

/* === Casino Homepage Layout Additions === */
/* Hero banner (full width) */
.casino-hero {
    position: relative;
    padding: 4.5rem 0 3.5rem;
    overflow: hidden;
}

.casino-hero .container {
    position: relative;
    z-index: 2;
}

.casino-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 25% 35%, rgba(246,216,137,.16), rgba(0,0,0,0) 60%), linear-gradient(140deg, rgba(246,216,137,.12), rgba(180,90,20,.08) 35%, rgba(0,0,0,0) 75%);
    pointer-events: none;
}

.casino-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,.0), rgba(0,0,0,.65) 85%);
}

.casino-hero-title {
    font-size: clamp(1.9rem,3.4vw,3rem);
    font-weight: 700;
    letter-spacing: .6px;
    margin-bottom: 1.1rem;
    background: linear-gradient(120deg,#fff,#f7e2a8 55%,#c08a28);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.casino-hero-sub {
    max-width: 760px;
    font-size: clamp(.9rem,1.05vw + .6rem,1.05rem);
    color: #d7d4cf;
    line-height: 1.5;
}

.casino-hero-actions {
    display: flex;
    gap: .9rem;
    flex-wrap: wrap;
    margin-top: 1.6rem;
}

.casino-hero-actions .btn {
    min-width: 170px;
}

/* Feature tiles row */
.casino-feature-row {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
    margin-top: 2.8rem;
}

.casino-feature {
    position: relative;
    padding: 1.1rem 1rem 1.15rem;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    background: linear-gradient(160deg, rgba(24,18,12,.55), rgba(14,10,8,.6));
    backdrop-filter: blur(22px) saturate(150%);
    -webkit-backdrop-filter: blur(22px) saturate(150%);
    box-shadow: 0 10px 26px -10px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.04);
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.casino-feature {
    position: relative;
    padding: 1.1rem 1rem 1.15rem;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    background: linear-gradient(160deg, rgba(24,18,12,.55), rgba(14,10,8,.6));
    backdrop-filter: blur(22px) saturate(150%);
    -webkit-backdrop-filter: blur(22px) saturate(150%);
    box-shadow: 0 10px 26px -10px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.04);
    display: flex;
    flex-direction: column;
    gap: .55rem;
    /* performance */
    will-change: transform, box-shadow, filter;
    transform: translateZ(0);
    transition: transform .38s cubic-bezier(.16,.84,.44,1), box-shadow .38s ease, filter .38s ease;
}

.casino-feature .icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(255,255,255,.15), rgba(255,255,255,.05));
    border: 1px solid rgba(255,255,255,.2);
    box-shadow: 0 4px 14px -6px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08);
    color: var(--gold-primary);
    font-size: 1.1rem;
}

.casino-feature h3 {
    font-size: .9rem;
    font-weight: 600;
    letter-spacing: .45px;
    margin: 0;
    color: #f1efe9;
}

.casino-feature p {
    font-size: .68rem;
    line-height: 1.35;
    color: #bcb8b2;
    margin: 0;
}

.casino-feature:hover {
    box-shadow: 0 12px 30px -12px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.06);
    transform: translateY(-4px);
}

/* Live + comments unified wrapper improvements */
.casino-live-wrapper {
    margin-top: 3.4rem;
}

.casino-live-grid {
    display: grid;
    gap: 1.5rem;
}

@media(min-width: 992px) {
    .casino-live-grid {
        grid-template-columns:1fr 340px;
    }
}

/* Category grid modern */
.casino-categories-grid {
    display: grid;
    gap: 1.4rem;
    grid-template-columns: repeat(auto-fill,minmax(260px,1fr));
    margin-top: 3.2rem;
}

.casino-cat-card {
    position: relative;
    border: 1px solid rgba(246,216,137,.25);
    border-radius: 22px;
    background: linear-gradient(150deg, rgba(246,216,137,.08), rgba(24,18,12,.62));
    overflow: hidden;
    padding: .9rem .9rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    box-shadow: 0 8px 22px -10px rgba(0,0,0,.7), 0 0 0 1px rgba(246,216,137,.14);
}

.casino-cat-card {
    position: relative;
    border: 1px solid rgba(246,216,137,.25);
    border-radius: 22px;
    background: linear-gradient(150deg, rgba(246,216,137,.08), rgba(24,18,12,.62));
    overflow: hidden;
    padding: .9rem .9rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    box-shadow: 0 8px 22px -10px rgba(0,0,0,.7), 0 0 0 1px rgba(246,216,137,.14);
    will-change: transform, box-shadow;
    transform: translateZ(0);
    transition: transform .42s cubic-bezier(.16,.84,.44,1), box-shadow .42s ease;
}

.casino-cat-card:hover {
    box-shadow: 0 12px 30px -12px rgba(0,0,0,.78), 0 0 0 1px rgba(246,216,137,.26);
    transform: translateY(-4px);
}

.casino-cat-card-thumb {
    position: relative;
    width: 100%;
    height: 140px;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 4px 16px -6px rgba(0,0,0,.65);
}

.casino-cat-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .65s cubic-bezier(.16,.84,.44,1);
    will-change: transform;
    transform: translateZ(0);
}

.casino-cat-card:hover .casino-cat-card-thumb img {
    transform: scale(1.04);
}

.casino-cat-card h3 {
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .45px;
    margin: .4rem 0 .2rem;
    color: var(--gold-primary);
}

.casino-cat-meta {
    font-size: .6rem;
    letter-spacing: .4px;
    text-transform: uppercase;
    color: #b8b5af;
    display: flex;
    gap: .6rem;
}

.casino-cat-meta span+span:before {
    content: "•";
    margin: 0 .4rem;
    opacity: .5;
}

.casino-cat-card-excerpt {
    font-size: .65rem;
    color: #c2beb8;
    line-height: 1.4;
    margin: 0;
    min-height: 42px;
}

.casino-cat-card a.cat-btn {
    align-self: flex-start;
    margin-top: .4rem;
    font-size: .6rem;
    padding: .45rem .75rem;
    border-radius: 30px;
    background: linear-gradient(135deg,var(--gold-primary),var(--gold-deep));
    color: #15110c;
    text-decoration: none;
    font-weight: 600;
    letter-spacing: .4px;
    box-shadow: 0 4px 14px -6px rgba(0,0,0,.6);
}

.casino-cat-card a.cat-btn:hover {
    filter: brightness(1.08);
}

/* Sidebar widgets vertical spacing tweak */
.casino-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

/* Legacy wrapper hidden toggle */
#legacyHomeWrapper {
    display: none;
}

#legacyHomeWrapper.active {
    display: block;
}

/* === Live Box Modern Redesign === */
.live-box-modern {
    display: grid;
    gap: 1.6rem;
}

@media(min-width: 1100px) {
    .live-box-modern {
        grid-template-columns:1fr 340px;
    }
}

.live-player-card {
    position: relative;
    border-radius: 20px;
    padding: 1rem 1rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: .85rem;
}

.live-player-shell {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: #000;
    aspect-ratio: 16/9;
    box-shadow: 0 14px 38px -16px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.05);
}

.live-player-shell video {
    width: 100%;
    height: 100%;
    display: block;
    background: #000;
}

.live-topbar {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .6rem .75rem .55rem;
    background: linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.35) 55%, rgba(0,0,0,0));
    z-index: 3;
    pointer-events: none;
}

.live-topbar .pill-live {
    background: linear-gradient(135deg,#ff3355,#c60034);
    color: #fff;
    font-size: .6rem;
    font-weight: 600;
    letter-spacing: .55px;
    padding: .38rem .6rem;
    border-radius: 40px;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    box-shadow: 0 4px 14px -6px rgba(0,0,0,.7);
    pointer-events: auto;
    cursor: default;
}

.live-topbar .pill-live i {
    font-size: .65rem;
}

.live-topbar .pill-muted {
    background: rgba(40,40,40,.75);
    color: #fff;
    border: 1px solid rgba(255,255,255,.15);
    font-size: .6rem;
    padding: .38rem .55rem;
    border-radius: 40px;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    cursor: pointer;
    pointer-events: auto;
    transition: .28s ease;
}

.live-topbar .pill-muted:hover {
    background: rgba(55,55,55,.85);
}

.live-topbar .spacer {
    flex: 1;
}

.live-topbar .viewer-count {
    font-size: .6rem;
    letter-spacing: .5px;
    color: #d3d0cb;
    background: rgba(35,30,25,.65);
    border: 1px solid rgba(255,255,255,.12);
    padding: .35rem .6rem;
    border-radius: 40px;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    pointer-events: auto;
}

.live-switch-overlay {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,.55);
    backdrop-filter: blur(4px);
    font-size: .85rem;
    font-weight: 500;
    letter-spacing: .5px;
    z-index: 4;
}

.live-controls-bar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .6rem .75rem .7rem;
    background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.65) 55%, rgba(0,0,0,.85));
    opacity: 0;
    transition: opacity .35s ease;
    z-index: 3;
}

.live-player-shell:hover .live-controls-bar, .live-player-shell:focus-within .live-controls-bar {
    opacity: 1;
}

.live-controls-bar .live-btn {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.15);
    color: #fff;
    padding: .45rem .65rem;
    font-size: .7rem;
    line-height: 1;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
    transition: .25s ease;
}

.live-controls-bar .live-btn:hover {
    background: rgba(255,255,255,.15);
}

.live-controls-bar select {
    background: rgba(0,0,0,.5);
    color: #fff;
    border: 1px solid rgba(255,255,255,.18);
    font-size: .65rem;
    padding: .4rem .5rem;
    border-radius: 6px;
}

.live-time-badge {
    margin-left: auto;
    font-size: .6rem;
    color: #b5b2ad;
    letter-spacing: .5px;
}

.live-meta-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .85rem;
    font-size: .65rem;
    color: #b5b2ad;
    margin-top: .35rem;
    background: linear-gradient(145deg, rgba(246,216,137,.06), rgba(24,18,12,.65));
    padding: .55rem .75rem .55rem;
    border: 1px solid rgba(246,216,137,.14);
    border-radius: 12px;
}

.live-meta-strip .pill-auto {
    background: #2b2b2b;
    padding: .25rem .55rem;
    border-radius: 30px;
    font-size: .55rem;
    letter-spacing: .5px;
    text-transform: uppercase;
}

.comments-card-modern {
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    min-height: 420px;
}

.comments-card-modern .comments-head {
    padding: .85rem 1rem .75rem;
    border-bottom: 1px solid rgba(246,216,137,.14);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.comments-card-modern .comments-list {
    list-style: none;
    margin: 0;
    padding: .9rem 1rem 1rem;
    flex: 1;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: .7rem;
    max-height: 300px;
    scroll-behavior: smooth;
}

.comments-card-modern .comment-form {
    border-top: 1px solid rgba(246,216,137,.14);
    padding: .75rem 1rem 1rem;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

/* Enhanced casino styling for comment form */
.comments-card-modern .comment-form {
    background: linear-gradient(155deg, rgba(246,216,137,.05), rgba(18,14,10,.65));
    box-shadow: 0 10px 28px -12px rgba(0,0,0,.65), 0 0 0 1px rgba(246,216,137,.08) inset;
    border-radius: 16px;
    position: relative;
    overflow: hidden;
}
.comments-card-modern .comment-form::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 14% 18%, rgba(246,216,137,.12), transparent 60%);
    mix-blend-mode: overlay;
}
.comments-card-modern .comment-form .field-row { display:flex; gap:.55rem; }
.comments-card-modern .comment-form input, .comments-card-modern .comment-form textarea {
    background: linear-gradient(145deg, rgba(28,22,16,.85), rgba(18,14,10,.92));
    border: 1px solid rgba(246,216,137,.18);
    box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset;
    color: #f5f2ed;
    padding: .6rem .75rem;
    font-size: .78rem;
    letter-spacing: .3px;
    transition: border-color .25s ease, background .35s ease, box-shadow .35s ease;
}
.comments-card-modern .comment-form input::placeholder, .comments-card-modern .comment-form textarea::placeholder {
    color: #a9a49d;
    font-size: .7rem;
}
.comments-card-modern .comment-form input:focus, .comments-card-modern .comment-form textarea:focus {
    outline: none;
    background: linear-gradient(145deg, rgba(34,26,18,.92), rgba(22,16,10,.95));
    border-color: var(--gold-primary);
    box-shadow: 0 0 0 1px var(--gold-primary), 0 0 0 4px rgba(246,216,137,.25);
}
.comments-card-modern .comment-form textarea {
    min-height: 110px;
    resize: vertical;
    line-height: 1.45;
    scrollbar-width: thin;
    scrollbar-color: var(--gold-primary) rgba(22,16,10,.6);
}
.comments-card-modern .comment-form textarea::-webkit-scrollbar { width:8px; }
.comments-card-modern .comment-form textarea::-webkit-scrollbar-track { background: rgba(22,16,10,.55); }
.comments-card-modern .comment-form textarea::-webkit-scrollbar-thumb { background: var(--gold-primary); border-radius: 40px; }
.comments-card-modern .comment-form textarea::-webkit-scrollbar-thumb:hover { background: var(--gold-accent); }
.comments-card-modern .comment-form button[type=submit], .comments-card-modern .comment-form #homeSubmit {
    background: linear-gradient(135deg, var(--gold-primary), var(--gold-accent) 55%, var(--gold-deep));
    color: #140f08;
    font-weight: 600;
    font-size: .7rem;
    letter-spacing: .55px;
    padding: .65rem 1.1rem;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 6px 18px -8px rgba(0,0,0,.75), 0 0 0 1px rgba(246,216,137,.45) inset;
    border-radius: 40px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: filter .35s ease, transform .25s ease, box-shadow .4s ease;
}
.comments-card-modern .comment-form button[type=submit]::after, .comments-card-modern .comment-form #homeSubmit::after {
    content: "";
    position: absolute;
    top:0; left:-40%;
    width:40%; height:100%;
    background: linear-gradient(90deg, rgba(255,255,255,.35), rgba(255,255,255,0));
    transform: skewX(-25deg);
    transition: left .6s ease;
    pointer-events:none;
}
.comments-card-modern .comment-form button[type=submit]:hover, .comments-card-modern .comment-form #homeSubmit:hover {
    filter: brightness(1.08);
    box-shadow: 0 12px 32px -12px rgba(0,0,0,.85), 0 0 0 1px rgba(246,216,137,.55) inset;
}
.comments-card-modern .comment-form button[type=submit]:hover::after, .comments-card-modern .comment-form #homeSubmit:hover::after { left:110%; }
.comments-card-modern .comment-form button[type=submit]:active, .comments-card-modern .comment-form #homeSubmit:active { transform: translateY(1px); }
.comments-card-modern .comment-form .text-dim { font-size:.6rem; letter-spacing:.4px; }

@media (max-width: 780px) {
    .comments-card-modern .comment-form { padding:.75rem .85rem .9rem; }
    .comments-card-modern .comment-form input, .comments-card-modern .comment-form textarea { font-size:.72rem; }
    .comments-card-modern .comment-form button[type=submit], .comments-card-modern .comment-form #homeSubmit { font-size:.65rem; padding:.6rem .95rem; }
}

.comments-card-modern .comment-form input, .comments-card-modern .comment-form textarea {
    background: #141414;
    border: 1px solid #2c2c2c;
    color: #e5e5e5;
    padding: .55rem .65rem;
    font-size: 1rem;
    border-radius: 8px;
    width: 100%;
}

.comments-card-modern .comment-form textarea {
    min-height: 90px;
    resize: none;
    line-height: 1.4;
}

.comments-card-modern .comment-form button[type=submit] {
    background: var(--casino-red,#ff184c);
    color: #fff;
    border: none;
    padding: .6rem .9rem;
    font-size: .7rem;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    letter-spacing: .5px;
}

@media (max-width: 991.98px) {
    .live-box-modern {
        grid-template-columns:1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .live-topbar, .live-controls-bar, .live-player-shell video {
        transition: none !important;
    }
}

/* === Casino Premium Styling Enhancements (Live Box) === */
.live-player-card {
    border: 1px solid rgba(246,216,137,.18);
    background: linear-gradient(155deg, rgba(246,216,137,.08), rgba(18,14,10,.72));
    position: relative;
    overflow: hidden;
}

.live-player-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 12% 18%, rgba(246,216,137,.12), transparent 60%), radial-gradient(circle at 88% 82%, rgba(246,216,137,.10), transparent 65%), linear-gradient(140deg, rgba(246,216,137,.08), rgba(0,0,0,0) 55%);
    mix-blend-mode: overlay;
}

.live-player-shell {
    border: 1px solid rgba(246,216,137,.20);
    box-shadow: 0 14px 38px -18px rgba(0,0,0,.85), 0 0 0 1px rgba(246,216,137,.10), 0 0 0 1px rgba(255,255,255,.05) inset;
    position: relative;
}

.live-player-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255,255,255,.04);
    border-radius: inherit;
    pointer-events: none;
}

.live-player-shell:hover {
    box-shadow: 0 18px 46px -18px rgba(0,0,0,.9), 0 0 0 1px rgba(246,216,137,.14), 0 0 0 1px rgba(255,255,255,.06) inset;
}

.live-topbar .pill-live {
    background: linear-gradient(135deg, var(--gold-primary), var(--gold-deep) 85%);
    color: #140f08;
    box-shadow: 0 4px 14px -6px rgba(0,0,0,.7), 0 0 0 1px rgba(246,216,137,.55) inset;
}

.live-topbar .pill-live i {
    color: #c00028;
    filter: drop-shadow(0 0 4px rgba(255,60,80,.55));
}

.live-topbar .pill-muted {
    background: rgba(24,20,16,.75);
    border: 1px solid rgba(255,255,255,.18);
}

.live-topbar .pill-muted:hover {
    background: rgba(30,26,22,.85);
}

.live-topbar .viewer-count {
    background: linear-gradient(135deg, rgba(246,216,137,.18), rgba(18,14,10,.72));
    border: 1px solid rgba(246,216,137,.28);
}
.tag-pill {
    display:inline-flex;
    align-items:center;
    gap:.35rem;
    background:linear-gradient(145deg, rgba(246,216,137,.15), rgba(24,18,12,.75));
    border:1px solid rgba(246,216,137,.35);
    padding:.32rem .7rem .3rem;
    font-size:.55rem;
    letter-spacing:.55px;
    text-transform:uppercase;
    color:var(--gold-primary);
    border-radius:40px;
    position:relative;
    box-shadow:0 4px 14px -6px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.05) inset;
}
.tag-pill::after {
    content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
    background:radial-gradient(circle at 18% 28%, rgba(255,255,255,.18), transparent 60%);
    mix-blend-mode:overlay; opacity:.45;
}
.tag-pill i { color:var(--gold-primary); filter:drop-shadow(0 0 4px rgba(246,216,137,.4)); font-size:.65rem; }

/* Category sort select */
.casino-select-shell { position:relative; }
.casino-select {
    appearance:none;
    -webkit-appearance:none;
    background:linear-gradient(145deg, rgba(246,216,137,.12), rgba(24,18,12,.78));
    border:1px solid rgba(246,216,137,.38);
    color:var(--gold-primary);
    font-size:.72rem;
    padding:.45rem 2.1rem .42rem .85rem;
    border-radius:40px;
    letter-spacing:.5px;
    font-weight:600;
    position:relative;
    box-shadow:0 4px 14px -6px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.05) inset;
    cursor:pointer;
    background-blend-mode:overlay;
}
.casino-select:focus { outline:none; box-shadow:0 0 0 2px rgba(246,216,137,.55), 0 0 0 1px rgba(255,255,255,.08) inset; }
.casino-select:hover { border-color:rgba(246,216,137,.55); }
.casino-select-shell::after {
    content:"\f107"; /* fa-chevron-down */
    font-family: "Font Awesome 7 Free";
    font-weight:900;
    position:absolute;
    right:.95rem;
    top:50%;
    transform:translateY(-50%);
    font-size:.65rem;
    color:var(--gold-primary);
    pointer-events:none;
    filter:drop-shadow(0 0 4px rgba(246,216,137,.4));
}
@media (max-width: 768px) {
    .casino-select { width:100%; }
}

/* Casino pagination */
.casino-pagination { list-style:none; display:flex; gap:.45rem; padding:0; margin:0; flex-wrap:wrap; }
.casino-page-item { display:inline-flex; }
.casino-page-link {
    display:inline-flex; align-items:center; justify-content:center;
    min-width:36px; height:34px; padding:0 .85rem;
    background:linear-gradient(140deg, rgba(246,216,137,.14), rgba(24,18,12,.78));
    border:1px solid rgba(246,216,137,.38);
    color:var(--gold-primary);
    font-size:.65rem; letter-spacing:.5px; font-weight:600;
    text-decoration:none; border-radius:40px;
    box-shadow:0 4px 14px -6px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.05) inset;
    position:relative;
}
.casino-page-link:hover { border-color:rgba(246,216,137,.55); color:var(--gold-primary); }
.casino-page-item.active .casino-page-link {
    background:linear-gradient(135deg, var(--gold-primary), var(--gold-deep) 85%);
    color:#140f08; border-color:rgba(246,216,137,.65);
    box-shadow:0 4px 18px -6px rgba(0,0,0,.7), 0 0 0 1px rgba(246,216,137,.4) inset;
}
.casino-page-item.disabled .casino-page-link { opacity:.45; pointer-events:none; filter:grayscale(.4); }
.casino-page-link:focus { outline:none; box-shadow:0 0 0 2px rgba(246,216,137,.55), 0 0 0 1px rgba(255,255,255,.08) inset; }
@media (max-width: 576px) { .casino-page-link { min-width:34px; height:32px; font-size:.6rem; } }

/* Contact form modern */
.contact-form-modern { position:relative; }
.contact-form-modern .form-label-casino { font-weight:600; letter-spacing:.4px; color:var(--gold-primary); margin-bottom:.35rem; font-size:.65rem; text-transform:uppercase; }
.casino-input, .casino-textarea {
    width:100%;
    background:linear-gradient(145deg, rgba(246,216,137,.10), rgba(26,18,12,.80));
    border:1px solid rgba(246,216,137,.30);
    color:var(--gold-primary);
    font-size:.72rem;
    padding:.55rem .85rem .50rem;
    border-radius:14px;
    letter-spacing:.35px;
    font-weight:500;
    box-shadow:0 4px 14px -6px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.04) inset;
    transition:.25s ease;
}
.casino-textarea { resize:vertical; min-height:160px; line-height:1.4; }
.casino-input::placeholder, .casino-textarea::placeholder { color:rgba(246,216,137,.55); font-weight:400; }
.casino-input:focus, .casino-textarea:focus { outline:none; border-color:rgba(246,216,137,.55); box-shadow:0 0 0 2px rgba(246,216,137,.45), 0 0 0 1px rgba(255,255,255,.06) inset; }
.was-validated .casino-input:invalid, .was-validated .casino-textarea:invalid { border-color:#c84a3c; box-shadow:0 0 0 1px rgba(255,255,255,.04) inset, 0 0 0 2px rgba(200,74,60,.55); }
.form-check-casino { display:flex; align-items:center; gap:.45rem; }
.form-check-casino .form-check-input { width:16px; height:16px; margin-top:0; background:#1e140d; border:1px solid rgba(246,216,137,.35); cursor:pointer; }
.form-check-casino .form-check-input:checked { background:var(--gold-primary); border-color:var(--gold-primary); box-shadow:0 0 0 1px rgba(255,255,255,.08) inset; }
.form-check-casino .form-check-input:focus { outline:none; box-shadow:0 0 0 2px rgba(246,216,137,.55); }
.contact-side-info ul li strong { font-weight:600; }
@media (max-width: 768px) { .contact-side-info { margin-top:.5rem; } }

/* Page Loading Overlay */
.page-loading-overlay { position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; padding:2rem; background:radial-gradient(circle at 50% 50%, rgba(246,216,137,.08), rgba(14,10,6,.94)); backdrop-filter:blur(8px); transition:opacity .55s ease, visibility .55s ease; }
.page-loading-overlay::after { content:""; position:absolute; inset:0; background:linear-gradient(160deg, rgba(246,216,137,.05), transparent 60%); pointer-events:none; }
.page-loading-overlay.hidden { opacity:0; visibility:hidden; }
.loader-shell { text-align:center; max-width:320px; width:100%; }
.loader-visual { position:relative; width:96px; height:96px; margin:0 auto; }
.loader-ring { position:absolute; inset:0; border-radius:50%; border:4px solid transparent; }
.loader-ring.layer-1 { border-top-color:var(--gold-primary); border-right-color:rgba(246,216,137,.45); animation:loaderSpin 1.05s linear infinite; filter:drop-shadow(0 0 6px rgba(246,216,137,.35)); }
.loader-ring.layer-2 { inset:10px; border:4px solid transparent; border-left-color:var(--gold-deep); border-bottom-color:rgba(246,216,137,.35); animation:loaderSpinReverse 1.6s linear infinite; }
.loader-ring.layer-3 { inset:22px; border:3px solid rgba(246,216,137,.28); animation:loaderPulse 2.8s ease-in-out infinite; }
.loader-core { position:absolute; inset:34px; background:linear-gradient(135deg, var(--gold-primary), var(--gold-deep)); border-radius:50%; box-shadow:0 0 0 4px rgba(255,255,255,.06) inset, 0 0 12px -2px rgba(246,216,137,.65); animation:coreGlow 3.8s ease-in-out infinite; }
@keyframes loaderSpin { to { transform:rotate(360deg); } }
@keyframes loaderSpinReverse { to { transform:rotate(-360deg); } }
@keyframes loaderPulse { 0%,100% { transform:scale(1); opacity:.65; } 50% { transform:scale(1.05); opacity:1; } }
@keyframes coreGlow { 0%,100% { filter:brightness(1); } 50% { filter:brightness(1.25); } }
.loader-logo-img { max-height:52px; width:auto; object-fit:contain; filter:drop-shadow(0 0 8px rgba(246,216,137,.4)); animation:logoFade 1.6s ease; }
@keyframes logoFade { 0% { opacity:0; transform:translateY(4px); } 100% { opacity:1; transform:translateY(0); } }
.loader-brand { font-weight:600; letter-spacing:.7px; text-transform:uppercase; filter:drop-shadow(0 0 6px rgba(246,216,137,.35)); animation:brandPulse 5s ease-in-out infinite; font-size:.72rem; }
@keyframes brandPulse { 0%,92% { opacity:1; } 46% { opacity:.85; } }
.loader-progress { position:relative; height:6px; border-radius:40px; background:rgba(246,216,137,.12); overflow:hidden; box-shadow:0 0 0 1px rgba(255,255,255,.06) inset; }
.loader-progress .loader-bar { position:absolute; inset:0; width:45%; background:linear-gradient(90deg, rgba(246,216,137,.15), var(--gold-primary), rgba(246,216,137,.15)); animation:barSlide 1.4s ease-in-out infinite; filter:drop-shadow(0 0 4px rgba(246,216,137,.4)); }
@keyframes barSlide { 0% { transform:translateX(-60%); } 50% { transform:translateX(25%); } 100% { transform:translateX(120%); } }
.loader-hint { font-size:.6rem; letter-spacing:.4px; }
.loader-ellipsis::after { content:""; display:inline-block; width:1.2em; text-align:left; animation:ellipsisSteps 1.6s steps(4,end) infinite; }
@keyframes ellipsisSteps { 0% { content:""; } 25% { content:"."; } 50% { content:".."; } 75% { content:"..."; } 100% { content:""; } }
@media (prefers-reduced-motion: reduce) { .loader-ring.layer-1,.loader-ring.layer-2,.loader-ring.layer-3,.loader-core,.loader-progress .loader-bar { animation:none; } }

.live-topbar .viewer-count {
    display:inline-flex; align-items:center; gap:.4rem;
    padding:.32rem .65rem .30rem;
    font-size:.58rem; letter-spacing:.5px; font-weight:600;
    background:linear-gradient(140deg, rgba(246,216,137,.12), rgba(24,18,12,.75));
    border:1px solid rgba(246,216,137,.35);
    color:var(--gold-primary);
    border-radius:40px;
    position:relative;
    box-shadow:0 4px 14px -6px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.05) inset;
    animation: viewerPulse 6s ease-in-out infinite;
}
.live-topbar .viewer-count .vc-num { min-width:26px; text-align:center; display:inline-block; }
.live-topbar .viewer-count i { font-size:.7rem; filter:drop-shadow(0 0 4px rgba(246,216,137,.45)); }
@keyframes viewerPulse { 0%, 92% { filter:brightness(1); } 45% { filter:brightness(1.15); } }

#homeViewer .vc-num {
    min-width: 24px;
    text-align: center;
}

/* Tabs styling (replaces inline rules) */
#homeLiveTabs {
    display: flex;
    gap: .55rem;
    flex-wrap: wrap;
    margin: 0 0 .35rem;
}

#homeLiveTabs .tab-btn {
    background: linear-gradient(150deg, rgba(246,216,137,.10), rgba(18,14,10,.85));
    color: #d3d0cb;
    border: 1px solid rgba(246,216,137,.22);
    padding: .55rem .85rem;
    font-size: .65rem;
    font-weight: 600;
    border-radius: 10px;
    cursor: pointer;
    letter-spacing: .45px;
    position: relative;
    transition: background .35s ease, box-shadow .35s ease, color .35s ease;
}

#homeLiveTabs .tab-btn:hover {
    background: linear-gradient(150deg, rgba(246,216,137,.16), rgba(28,22,16,.88));
    color: #fff;
}

#homeLiveTabs .tab-btn:focus-visible {
    outline: 2px solid var(--gold-primary);
    outline-offset: 2px;
}

#homeLiveTabs .tab-btn.active, #homeLiveTabs .tab-btn[aria-selected="true"] {
    background: linear-gradient(145deg, var(--gold-primary), var(--gold-accent) 70%, var(--gold-deep));
    color: #140f08;
    border-color: var(--gold-primary);
    box-shadow: 0 6px 18px -8px rgba(0,0,0,.75), 0 0 0 1px rgba(246,216,137,.55) inset;
}

#homeLiveTabs .tab-btn.active::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -6px;
    width: 10px;
    height: 10px;
    background: var(--gold-primary);
    transform: translateX(-50%) rotate(45deg);
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0,0,0,.4);
}

@media (max-width: 600px) {
    #homeLiveTabs .tab-btn {
        font-size:.6rem;
        padding: .5rem .7rem;
    }
}

/* Meta strip polish */
.live-meta-strip {
    box-shadow: 0 8px 24px -12px rgba(0,0,0,.65), 0 0 0 1px rgba(246,216,137,.12) inset;
}

.live-meta-strip div {
    display: flex;
    align-items: center;
    gap: .35rem;
}

.live-meta-strip span#homeLevel, .live-meta-strip span#homeState {
    color: var(--gold-primary);
    font-weight: 600;
    letter-spacing: .5px;
}

/* Comments card refinement */
.comments-card-modern {
    border: 1px solid rgba(246,216,137,.18);
    background: linear-gradient(160deg, rgba(246,216,137,.07), rgba(18,14,10,.78));
}

.comments-card-modern .comments-head {
    background: linear-gradient(140deg, rgba(246,216,137,.08), rgba(24,18,12,.6));
}

.comments-card-modern .comment-form button[type=submit] {
    box-shadow: 0 4px 14px -6px rgba(0,0,0,.7);
}

.comments-card-modern .comment-form button[type=submit]:hover {
    filter: brightness(1.1);
}

.comments-card-modern .comments-list li {
    background: #181818;
    border: 1px solid #2a2a2a;
}
.comments-card-modern .comments-list .live-comment-item {
    background: linear-gradient(140deg, rgba(246,216,137,.05), rgba(24,18,12,.65));
    border: 1px solid rgba(246,216,137,.14);
    border-radius: 12px;
    padding: .65rem .75rem .6rem;
    display: flex;
    flex-direction: column;
    gap: .35rem;
    position: relative;
    box-shadow: 0 6px 18px -10px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.04) inset;
    animation: liveCommentFade .45s ease;
}
.comments-card-modern .comments-list .live-comment-item:hover {
    border-color: rgba(246,216,137,.28);
    box-shadow: 0 8px 22px -10px rgba(0,0,0,.7), 0 0 0 1px rgba(246,216,137,.18) inset;
}
.comments-card-modern .comments-list .live-comment-item .lc-head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:.6rem;
    text-transform:uppercase;
    letter-spacing:.55px;
    color:#a9a49d;
    margin-bottom:.1rem;
}
.comments-card-modern .comments-list .live-comment-item .lc-user i {
    color: var(--gold-primary);
    margin-right:.35rem;
    filter: drop-shadow(0 0 4px rgba(246,216,137,.4));
}
.comments-card-modern .comments-list .live-comment-item .lc-time i {
    color:#c2b8a8;
    margin-right:.3rem;
}
.comments-card-modern .comments-list .live-comment-item .lc-body {
    font-size:.78rem;
    line-height:1.38;
    color:#e5e2dc;
    word-wrap:break-word;
    overflow-wrap:anywhere;
}
@media (max-width: 600px) {
    .comments-card-modern .comments-list .live-comment-item { padding:.6rem .65rem .55rem; }
    .comments-card-modern .comments-list .live-comment-item .lc-body { font-size:.74rem; }
}
@keyframes liveCommentFade {
    from { opacity:0; transform:translateY(6px); }
    to { opacity:1; transform:translateY(0); }
}

/* Glow animation subtle */
@keyframes goldGlowPulse {
    0%, 90% {
        filter: drop-shadow(0 0 4px rgba(246,216,137,.4));
    }

    45% {
        filter: drop-shadow(0 0 8px rgba(246,216,137,.75));
    }
}

.live-topbar .pill-live {
    animation: goldGlowPulse 4.8s ease-in-out infinite;
}

/* === About Section (moved to bottom) === */
/* === Latest Posts Grid (4x2) === */
.latest-posts-grid {
    display: grid;
    gap: 1.4rem;
    grid-template-columns: repeat(auto-fill,minmax(240px,1fr));
}

@media(min-width: 1100px) {
    .latest-posts-grid {
        grid-template-columns:repeat(4,1fr);
    }
}

.latest-post-card {
    padding: .75rem .75rem 1rem;
    position: relative;
}

.latest-post-card .latest-thumb {
    height: 140px;
}

.latest-post-card .latest-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .65s cubic-bezier(.16,.84,.44,1);
}

.latest-post-card:hover .latest-thumb img {
    transform: scale(1.04);
}

.latest-post-title {
    margin: .5rem 0 .35rem;
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .4px;
}

@media(max-width: 768px) {
    .latest-posts-grid {
        grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
    }

    .latest-post-card .latest-thumb {
        height: 120px;
    }
}

/* === Login Demo (Casino Style) === */
.login-demo-section {
    background: linear-gradient(160deg, rgba(246,216,137,.05), rgba(12,9,6,.85));
    border-top: 1px solid rgba(246,216,137,.18);
}

.login-card {
    width: 100%;
    margin: 0 auto;
    padding: 2rem 2.1rem 2.4rem;
    border: 1px solid rgba(246,216,137,.22);
    border-radius: 28px;
    position: relative;
    background: linear-gradient(155deg, rgba(24,18,12,.82), rgba(12,8,5,.94));
    box-shadow: 0 16px 44px -18px rgba(0,0,0,.85), 0 0 0 1px rgba(246,216,137,.12), inset 0 0 0 1px rgba(255,255,255,.05);
    backdrop-filter: blur(26px) saturate(150%);
}

.login-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 18% 16%, rgba(246,216,137,.16), transparent 62%), radial-gradient(circle at 86% 82%, rgba(246,216,137,.12), transparent 65%);
    mix-blend-mode: overlay;
}

.login-title {
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: .55px;
    margin: 0 0 1.4rem;
    display: flex;
    align-items: center;
    gap: .55rem;
    color: var(--gold-primary);
}

.login-fields {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.login-field {
    position: relative;
}

.login-field input {
    width: 100%;
    background: linear-gradient(145deg, rgba(38,30,22,.85), rgba(18,14,10,.92));
    border: 1px solid rgba(246,216,137,.18);
    border-radius: 18px;
    padding: .85rem 1rem .85rem 3rem;
    font-size: .8rem;
    color: #e9e6e1;
    letter-spacing: .4px;
    box-shadow: 0 4px 12px -6px rgba(0,0,0,.7), inset 0 0 0 1px rgba(255,255,255,.04);
    transition: border-color .35s ease, background .35s ease;
}

.login-field input:focus {
    outline: none;
    border-color: var(--gold-primary);
    background: linear-gradient(145deg, rgba(46,36,26,.9), rgba(24,18,12,.95));
}

.login-field .icon {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    color: var(--gold-primary);
    opacity: .9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .75rem;
}

.login-field .toggle-pass {
    position: absolute;
    right: .9rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #d1ceca;
    cursor: pointer;
    font-size: .85rem;
    padding: .25rem;
    line-height: 1;
}

.login-primary-btn {
    width: 100%;
    border: none;
    cursor: pointer;
    font-weight: 600;
    letter-spacing: .6px;
    font-size: .8rem;
    padding: .95rem 1.2rem;
    border-radius: 40px;
    color: #140f08;
    background: linear-gradient(145deg, var(--gold-primary) 0%, var(--gold-accent) 55%, var(--gold-deep) 100%);
    box-shadow: 0 8px 26px -10px rgba(0,0,0,.8), 0 0 0 1px rgba(246,216,137,.5) inset, 0 0 0 1px rgba(255,255,255,.06);
    transition: filter .35s ease, transform .35s cubic-bezier(.16,.84,.44,1);
}

.login-primary-btn:hover {
    filter: brightness(1.08);
}

.login-primary-btn:active {
    transform: translateY(2px);
}

.login-divider {
    margin: 1.6rem 0 1.2rem;
    text-align: center;
    font-size: .65rem;
    letter-spacing: .5px;
    color: #a9a49d;
    position: relative;
}

.login-divider::before, .login-divider::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 34%;
    height: 1px;
    background: linear-gradient(90deg, rgba(246,216,137,.25), rgba(246,216,137,.05));
}

.login-divider::before {
    left: 0;
}

.login-divider::after {
    right: 0;
}

.login-alt-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    border: none;
    padding: .85rem 1.1rem;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .55px;
    border-radius: 40px;
    background: linear-gradient(145deg, rgba(20,16,12,.85), rgba(12,8,6,.95));
    color: #f1ede6;
    box-shadow: 0 8px 22px -10px rgba(0,0,0,.75), 0 0 0 1px rgba(246,216,137,.22), inset 0 0 0 1px rgba(255,255,255,.05);
    transition: background .35s ease, box-shadow .35s ease;
}

.login-alt-btn:hover {
    background: linear-gradient(145deg, rgba(28,22,16,.9), rgba(16,12,8,.97));
}

.login-alt-btn i {
    color: var(--gold-primary);
    font-size: .85rem;
}

.login-note {
    margin-top: 1.2rem;
    font-size: .6rem;
    letter-spacing: .45px;
    color: #8e8a83;
    text-align: center;
}

@media (max-width: 600px) {
    .login-card {
        padding:1.4rem 1.3rem 1.6rem;
        border-radius: 22px;
    }

    .login-fields {
        gap: .85rem;
    }
}

/* === Hero Duo Layout (Login + About) === */
.hero-duo {
    display: grid;
    gap: 2.2rem;
    align-items: start;
    margin-top: 1.2rem;
    /* Prevent child overflowing horizontal viewport */
    overflow:hidden;
}

@media (min-width: 992px) {
    .hero-duo {
        grid-template-columns:minmax(340px,420px) minmax(0,1fr); /* second column shrink within available space */
    }
}

@media (max-width: 991.98px) {
    .hero-duo {
        grid-template-columns:1fr;
    }
}

.hero-duo .about-box {
    max-width: 100%;
    padding: 1.4rem 1.4rem 1.6rem;
    box-sizing:border-box;
}

.hero-duo .about-scroll {
    max-height: 380px;
    overflow:auto;
}

@media (max-width: 768px) {
    .hero-duo .about-scroll {
        max-height:300px;
    }
}

.about-section {
    background: linear-gradient(145deg, rgba(246,216,137,.06), rgba(18,14,10,.82));
    border-top: 1px solid rgba(246,216,137,.18);
}

.about-box {
    max-width: 980px;
    margin: 0 auto;
    border: 1px solid rgba(246,216,137,.22);
    border-radius: 22px;
    padding: 1.4rem 1.6rem 1.6rem;
    position: relative;
    background: linear-gradient(155deg, rgba(246,216,137,.08), rgba(18,14,10,.75));
    box-shadow: 0 12px 38px -18px rgba(0,0,0,.85), 0 0 0 1px rgba(246,216,137,.12);
}

.about-box::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 14% 16%, rgba(246,216,137,.14), transparent 60%), radial-gradient(circle at 88% 82%, rgba(246,216,137,.10), transparent 65%);
    mix-blend-mode: overlay;
}

.about-title {
    font-weight: 600;
    letter-spacing: .55px;
    display: flex;
    align-items: center;
    gap: .6rem;
    margin: 0 0 1rem;
}

.about-scroll {
    max-height: 360px;
    overflow: auto;
    padding-right: .75rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(246,216,137,.35) rgba(18,14,10,.6);
}

.about-scroll::-webkit-scrollbar {
    width: 10px;
}

.about-scroll::-webkit-scrollbar-track {
    background: rgba(18,14,10,.5);
    border-radius: 10px;
}

.about-scroll::-webkit-scrollbar-thumb {
    background: linear-gradient(160deg, rgba(246,216,137,.55), rgba(180,120,40,.85));
    border-radius: 10px;
    border: 2px solid rgba(18,14,10,.55);
}

.about-scroll::-webkit-scrollbar-thumb:hover {
    filter: brightness(1.07);
}

.about-scroll h2, .about-scroll h3, .about-scroll h4 {
    color: var(--gold-primary);
    font-weight: 600;
    letter-spacing: .5px;
}

/* Allow h1 now (intro block) but visually scale within panel */
.about-scroll h1 { color: var(--gold-primary); font-weight:600; letter-spacing:.55px; font-size:1.55rem; margin:.4rem 0 .75rem; }

.about-scroll img {
    max-width:100%;
    height:auto;
    display:block;
    margin:.65rem auto .9rem;
    border-radius:14px;
    box-shadow:0 4px 22px -6px rgba(0,0,0,.65);
}

/* Prevent wide tables/code/pre from breaking layout */
.about-scroll table, .about-scroll pre, .about-scroll code {
    max-width:100%;
    overflow-x:auto;
    word-break:break-word;
}

/* Constrain long continuous text (URLs) */
.about-scroll p, .about-scroll li, .about-scroll h1, .about-scroll h2, .about-scroll h3, .about-scroll h4 {
    overflow-wrap: anywhere;
}

.about-scroll p, .about-scroll li {
    color: #d0ccc6;
    line-height: 1.55;
}

.about-scroll ul {
    padding-left: 1.1rem;
    margin: 0 0 1rem;
}

@media(max-width: 768px) {
    .about-box {
        padding:1.1rem 1.15rem 1.3rem;
    }

    .about-scroll {
        max-height: 300px;
    }
}

/* === Casino Nav Redesign === */
.casino-nav-bar {
    position: relative;
}

.casino-nav-bar::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 12% 18%, rgba(246,216,137,.22), transparent 62%), radial-gradient(circle at 88% 78%, rgba(246,216,137,.18), transparent 65%), linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.55));
    mix-blend-mode: overlay;
    border-radius: 20px;
}

.casino-nav-inner {
    padding: .65rem 1.1rem;
}
.casino-nav-inner.flex-column { display:flex; flex-direction:column; align-items:stretch; }
.casino-nav-inner .logo-bar {padding: 0;}
.casino-nav-inner .logo-bar { text-align:center; }
.casino-nav-inner .logo-bar .navbar-brand { display:inline-flex; }
.casino-nav-inner .logo-bar .navbar-toggler { position:absolute; right:0; top:50%; transform:translateY(-50%); }
.casino-nav-inner .logo-bar .navbar-brand { margin:0; }
.casino-nav-inner .casino-menu { justify-content:center; }
@media (max-width: 991.98px){
    .casino-nav-inner .logo-bar {margin-bottom: 0 !important;}
    .casino-nav-inner .casino-menu { justify-content:flex-start; }
}

.navbar-brand {
    font-weight: 600;
    letter-spacing: .55px;
    font-size: 1rem;
}

.navbar-brand .fa-dice {
    color: var(--gold-primary);
    filter: drop-shadow(0 0 4px rgba(246,216,137,.4));
}

.navbar-nav {
    align-items: center;
    gap: .35rem;
}

.navbar-nav .nav-link {
    position: relative;
    padding: .55rem .9rem;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: #d5d2cd;
    border-radius: 14px;
    transition: color .35s ease, background .35s ease, box-shadow .35s ease;
}

.navbar-nav .nav-link:hover {
    color: #fff;
    background: linear-gradient(160deg, rgba(246,216,137,.12), rgba(24,18,12,.7));
}

.navbar-nav .nav-link.active {
    color: #140f08;
    background: linear-gradient(145deg, var(--gold-primary), var(--gold-accent) 60%, var(--gold-deep));
    box-shadow: 0 6px 18px -8px rgba(0,0,0,.75), 0 0 0 1px rgba(246,216,137,.55) inset;
}

.navbar-nav .nav-link.active::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0px;
    width: 10px;
    height: 10px;
    background: var(--gold-primary);
    transform: translateX(-50%) rotate(45deg);
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0,0,0,.4);
}

.navbar .dropdown-menu {
    border-radius: 18px;
    padding: .55rem .55rem;
    border: 1px solid rgba(246,216,137,.22);
    box-shadow: 0 12px 34px -14px rgba(0,0,0,.75), 0 0 0 1px rgba(246,216,137,.14);
}

.navbar .dropdown-item {
    font-size: .6rem;
    letter-spacing: .45px;
    font-weight: 600;
    padding: .55rem .7rem;
    border-radius: 10px;
    color: #d5d2cd;
    transition: background .3s ease, color .3s ease;
}

.navbar .dropdown-item:hover, .navbar .dropdown-item:focus {
    background: linear-gradient(150deg, rgba(246,216,137,.16), rgba(24,18,12,.82));
    color: #fff;
}

.navbar .dropdown-divider {
    border-color: rgba(246,216,137,.18);
}

.navbar-toggler {
    border: 1px solid rgba(246,216,137,.25);
    padding: .45rem .65rem;
    border-radius: 12px;
    background: linear-gradient(160deg, rgba(24,18,12,.85), rgba(14,10,8,.92));
    color: var(--gold-primary);
    box-shadow: 0 6px 18px -8px rgba(0,0,0,.7), 0 0 0 1px rgba(246,216,137,.12);
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 2px var(--gold-primary), 0 0 0 5px rgba(246,216,137,.35);
}

.navbar-toggler-icon {
    filter: drop-shadow(0 0 2px rgba(246,216,137,.45));
}

@media (max-width: 991.98px) {
    .casino-nav-bar {
        border-radius:16px;
    }

    .casino-nav-inner {
        padding: 0rem .85rem;
    }

    .navbar-nav {
        align-items: stretch;
    }

    .navbar-collapse {
        background: linear-gradient(165deg, rgba(24,18,12,.92), rgba(12,8,5,.98));
        padding: .75rem .6rem 1rem;
        border: 1px solid rgba(246,216,137,.18);
        border-radius: 16px;
        box-shadow: 0 12px 34px -12px rgba(0,0,0,.8), 0 0 0 1px rgba(246,216,137,.10);
    }

    .navbar-nav .nav-link {
        margin: .15rem 0;
    }
}

.casino-nav-bar .btn-sm {
    padding: .55rem .95rem;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .5px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    border-radius: 32px;
}

@media (prefers-reduced-motion: reduce) {
    .navbar-nav .nav-link, .navbar .dropdown-item {
        transition: none !important;
    }
}
img.brand-logo {
    width: 140px;
}

li.breadcrumb-item.active {
    color: white;
}