/* ============================================================================
   Tavern4 — Theme layer (2026 refresh)

   Loaded AFTER assets/css/style.css and after Bootstrap. This file owns the
   visual language of the portal: colour, type, elevation and motion.
   Component rules are scoped under `body.gaming-theme` so they outrank the
   single-class selectors that still live inside page-level <style> blocks,
   which lets the refresh land without touching every template.
   ========================================================================= */

/* ------------------------------------------------------------------ tokens */

:root {
    /* Surfaces — mahogany, soot and candlelight */
    --t4-bg:            #140C08;
    --t4-bg-alt:        #1A100C;
    --t4-surface:       #241610;
    --t4-surface-2:     #2E1C12;
    --t4-surface-3:     #3A2418;

    /* Lines */
    --t4-border:        rgba(224, 168, 74, 0.16);
    --t4-border-strong: rgba(224, 168, 74, 0.32);

    /* Text — parchment */
    --t4-text:          #F4E6C8;
    --t4-text-dim:      #C4A882;
    --t4-text-mute:     #8A6E4E;

    /* Brand — ember, gold, wine. No neon blue. */
    --t4-cyan:          #E8B86D;
    --t4-blue:          #C4842A;
    --t4-violet:        #7A1F1F;
    --t4-amber:         #F5A524;
    --t4-amber-lt:      #FFE08A;
    --t4-ember:         #E85D04;
    --t4-gold:          #E0A84A;
    --t4-wine:          #7A1F1F;

    --t4-brand-gradient: linear-gradient(135deg, #FFE08A 0%, #F5A524 42%, #E85D04 100%);
    --t4-amber-gradient: linear-gradient(135deg, var(--t4-amber-lt), var(--t4-ember));

    /* Type */
    --t4-font-display: 'Cinzel', 'Palatino Linotype', 'Times New Roman', serif;
    --t4-font-body:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;

    /* Radii — slightly tighter, more like wood joinery */
    --t4-r-sm: 6px;
    --t4-r:    12px;
    --t4-r-lg: 16px;
    --t4-r-pill: 999px;

    --t4-shadow-sm: 0 1px 2px rgba(0, 0, 0, .50);
    --t4-shadow:    0 8px 24px -8px rgba(0, 0, 0, .70);
    --t4-shadow-lg: 0 24px 56px -16px rgba(0, 0, 0, .80);
    --t4-glow:      0 0 0 1px rgba(232, 93, 4, .35), 0 12px 40px -12px rgba(245, 165, 36, .40);

    --t4-ease: cubic-bezier(.22, .8, .3, 1);
    --t4-speed: .28s;

    --primary-color: #C4842A;
    --warning-color: #F5A524;
    --dark-color:    #140C08;
    --border-radius: var(--t4-r);
    --border-radius-lg: var(--t4-r-lg);
}

/* -------------------------------------------------------------------- base */

body.gaming-theme {
    background-color: var(--t4-bg);
    color: var(--t4-text);
    font-family: var(--t4-font-body);
    font-size: 1rem;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Ambient brand wash behind the page — subtle, non-repeating */
body.gaming-theme::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(20, 12, 8, .55), rgba(20, 12, 8, .88)),
        url("../images/brand/tavern-atmosphere.jpg") center top / cover no-repeat fixed;
    opacity: .55;
    mix-blend-mode: normal;
}
body.gaming-theme::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(900px 520px at 12% -8%,  rgba(232, 93, 4, .18), transparent 70%),
        radial-gradient(760px 460px at 92% 4%,   rgba(224, 168, 74, .10), transparent 70%),
        radial-gradient(700px 500px at 50% 108%, rgba(122, 31, 31, .16), transparent 70%),
        url("../images/brand/wood-grain.jpg") center / 680px repeat;
    opacity: .18;
    mix-blend-mode: multiply;
}

body.gaming-theme .main-content {
    position: relative;
}

body.gaming-theme h1, body.gaming-theme h2, body.gaming-theme h3,
body.gaming-theme h4, body.gaming-theme h5, body.gaming-theme h6 {
    font-family: var(--t4-font-display);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.18;
    color: var(--t4-text);
}

body.gaming-theme a {
    color: #E8B86D;
    text-decoration: none;
    transition: color var(--t4-speed) var(--t4-ease);
}

body.gaming-theme a:hover { color: #FFE08A; }

body.gaming-theme .text-muted,
body.gaming-theme .text-secondary { color: var(--t4-text-dim) !important; }

body.gaming-theme hr { border-color: var(--t4-border); opacity: 1; }

::selection { background: rgba(232, 93, 4, .45); color: #fff; }

/* Scrollbar */
body.gaming-theme { scrollbar-color: var(--t4-surface-3) var(--t4-bg); scrollbar-width: thin; }
body.gaming-theme ::-webkit-scrollbar { width: 11px; height: 11px; }
body.gaming-theme ::-webkit-scrollbar-track { background: var(--t4-bg); }
body.gaming-theme ::-webkit-scrollbar-thumb {
    background: var(--t4-surface-3);
    border-radius: var(--t4-r-pill);
    border: 3px solid var(--t4-bg);
}
body.gaming-theme ::-webkit-scrollbar-thumb:hover { background: #35425e; }

/* Visible, on-brand focus ring for keyboard users */
body.gaming-theme :focus-visible {
    outline: 2px solid var(--t4-cyan);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ------------------------------------------------------------------ header */

body.gaming-theme .top-bar {
    background: rgba(20, 12, 8, .90) !important;
    backdrop-filter: saturate(150%) blur(14px);
    -webkit-backdrop-filter: saturate(150%) blur(14px);
    border-bottom: 1px solid var(--t4-border);
    padding-top: .7rem !important;
    padding-bottom: .7rem !important;
}

/* Brand lockup: SVG mark + live text wordmark (no raster, always crisp) */
body.gaming-theme .t4-brand {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    line-height: 1;
}

body.gaming-theme .t4-brand__mark {
    width: 36px;
    height: 36px;
    display: block;
    border-radius: 10px;
    transition: transform var(--t4-speed) var(--t4-ease), filter var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .t4-brand__word {
    font-family: var(--t4-font-display);
    font-weight: 700;
    font-size: 1.5rem;
    letter-spacing: -.03em;
    color: #fff;
    white-space: nowrap;
}

body.gaming-theme .t4-brand__word i {
    font-style: normal;
    background: var(--t4-amber-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

body.gaming-theme .t4-brand:hover .t4-brand__mark {
    transform: translateY(-1px) scale(1.05);
    filter: drop-shadow(0 6px 16px rgba(232, 93, 4, .55));
}

/* Search */
body.gaming-theme .top-bar .form-control {
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--t4-border);
    border-right: 0;
    color: var(--t4-text);
    border-radius: var(--t4-r-pill) 0 0 var(--t4-r-pill);
    padding-left: 1rem;
    height: 38px;
}

body.gaming-theme .top-bar .form-control::placeholder { color: var(--t4-text-mute); }

body.gaming-theme .top-bar .form-control:focus {
    background: rgba(255, 255, 255, .09);
    border-color: rgba(232, 93, 4, .65);
    box-shadow: none;
    color: #fff;
}

body.gaming-theme .top-bar .input-group .btn {
    border-radius: 0 var(--t4-r-pill) var(--t4-r-pill) 0;
    border: 1px solid var(--t4-border);
    border-left: 0;
    background: rgba(255, 255, 255, .05);
    color: var(--t4-text-dim);
    height: 38px;
    padding-inline: 1rem;
}

body.gaming-theme .top-bar .input-group .btn:hover {
    background: var(--t4-blue);
    border-color: var(--t4-blue);
    color: #fff;
}

/* Auth + language buttons */
body.gaming-theme .top-bar .btn-outline-light {
    border-color: var(--t4-border-strong);
    color: var(--t4-text);
    border-radius: var(--t4-r-pill);
    font-weight: 500;
    font-size: .84rem;
    padding: .38rem .85rem;
}

body.gaming-theme .top-bar .btn-outline-light:hover {
    background: rgba(255, 255, 255, .08);
    border-color: var(--t4-border-strong);
    color: #fff;
    transform: none;
}

body.gaming-theme .top-bar .btn-group .btn-primary,
body.gaming-theme .btn-primary {
    background: var(--t4-brand-gradient);
    border: 0;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 6px 18px -8px rgba(232, 93, 4, .9);
}

body.gaming-theme .top-bar .btn-group { gap: .4rem; }
body.gaming-theme .top-bar .btn-group > .btn { border-radius: var(--t4-r-pill) !important; }

/* Category navigation */
body.gaming-theme .main-header {
    background: rgba(26, 16, 12, .94) !important;
    backdrop-filter: saturate(140%) blur(12px);
    -webkit-backdrop-filter: saturate(140%) blur(12px);
    border-bottom: 1px solid var(--t4-border);
    box-shadow: none;
    position: sticky;
    top: 0;
    z-index: 1030;
}

body.gaming-theme .main-header .navbar { padding-block: .3rem; }

body.gaming-theme .main-header .nav-link {
    color: var(--t4-text-dim) !important;
    font-family: var(--t4-font-display);
    font-weight: 600 !important;
    font-size: .875rem;
    letter-spacing: .01em;
    padding: .55rem .85rem !important;
    border-radius: var(--t4-r-pill);
    position: relative;
    transition: color var(--t4-speed) var(--t4-ease), background var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .main-header .nav-link:hover {
    background: rgba(255, 255, 255, .06);
    color: #fff !important;
    transform: none;
}

/* Gradient underline that grows from the centre on hover */
body.gaming-theme .main-header .nav-link::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 2px;
    height: 2px;
    width: 0;
    border-radius: 2px;
    background: var(--t4-brand-gradient);
    transform: translateX(-50%);
    transition: width var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .main-header .nav-link:hover::after { width: calc(100% - 1.7rem); }

body.gaming-theme .main-header .nav-link i {
    color: var(--t4-amber);
    font-size: .82rem;
    margin-right: .3rem;
    opacity: .9;
}

/* Slogan strip */
body.gaming-theme .slogan-bar {
    background: linear-gradient(90deg, rgba(59,130,246,.10), rgba(124,58,237,.10)) !important;
    border-bottom: 1px solid var(--t4-border);
    border-top: 0;
}

body.gaming-theme .slogan-bar small {
    color: var(--t4-text-dim) !important;
    font-family: var(--t4-font-display);
    font-size: .78rem;
    letter-spacing: .09em;
    text-transform: uppercase;
}

body.gaming-theme .slogan-bar i { color: var(--t4-amber); }

/* Dropdowns */
body.gaming-theme .dropdown-menu {
    background: var(--t4-surface);
    border: 1px solid var(--t4-border-strong);
    border-radius: var(--t4-r);
    box-shadow: var(--t4-shadow-lg);
    padding: .4rem;
}

body.gaming-theme .dropdown-item {
    color: var(--t4-text-dim);
    border-radius: var(--t4-r-sm);
    padding: .5rem .7rem;
    font-size: .9rem;
}

body.gaming-theme .dropdown-item:hover,
body.gaming-theme .dropdown-item:focus {
    background: rgba(255, 255, 255, .07);
    color: #fff;
}

body.gaming-theme .dropdown-item.active {
    background: rgba(232, 93, 4, .22);
    color: #fff;
}

body.gaming-theme .dropdown-divider { border-color: var(--t4-border); }
body.gaming-theme .dropdown-header { color: var(--t4-text-mute); }

/* -------------------------------------------------------------------- hero */

body.gaming-theme .hero-section {
    position: relative;
    border-bottom: 1px solid var(--t4-border);
}

body.gaming-theme .hero-image {
    position: relative;
    min-height: 560px;
    background-size: cover;
    background-position: center;
    cursor: pointer;
}

/* Scrim: dark at the bottom-left where the copy sits, clear at top-right */
body.gaming-theme .hero-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to top, rgba(10, 14, 23, .96) 0%, rgba(10, 14, 23, .72) 32%, rgba(10, 14, 23, .18) 62%, rgba(10, 14, 23, .35) 100%),
        linear-gradient(to right, rgba(10, 14, 23, .88) 0%, rgba(10, 14, 23, .35) 48%, transparent 78%);
}

body.gaming-theme .hero-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    padding-bottom: 4.5rem;
    z-index: 2;
    background: none;
}

body.gaming-theme .hero-content { max-width: 46rem; }

body.gaming-theme .hero-title {
    font-family: var(--t4-font-display);
    font-size: clamp(1.9rem, 4vw, 3.35rem);
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 1.06;
    color: #fff;
    margin-bottom: .9rem;
    text-shadow: 0 2px 30px rgba(0, 0, 0, .6);
    transition: color var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .hero-clickable:hover .hero-title { color: #FFE08A; }

body.gaming-theme .hero-summary {
    font-size: 1.05rem;
    line-height: 1.6;
    color: rgba(233, 238, 248, .82);
    max-width: 38rem;
    margin-bottom: 1rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

body.gaming-theme .hero-meta small { color: var(--t4-text-dim) !important; font-size: .82rem; }
body.gaming-theme .hero-meta i { color: var(--t4-amber); }

body.gaming-theme .hero-content .badge.bg-primary,
body.gaming-theme .badge.bg-primary {
    background: var(--t4-brand-gradient) !important;
    font-family: var(--t4-font-display);
    font-weight: 600;
    font-size: .68rem;
    letter-spacing: .09em;
    text-transform: uppercase;
    padding: .42em .8em;
    border-radius: var(--t4-r-pill);
    box-shadow: 0 4px 14px -6px rgba(232, 93, 4, .9);
}

body.gaming-theme .carousel-indicators { margin-bottom: 1.4rem; z-index: 3; }

body.gaming-theme .carousel-indicators [data-bs-target] {
    width: 28px;
    height: 4px;
    border-radius: var(--t4-r-pill);
    background: rgba(255, 255, 255, .32);
    border: 0;
    opacity: 1;
    transition: background var(--t4-speed) var(--t4-ease), width var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .carousel-indicators .active {
    width: 46px;
    background: var(--t4-amber-gradient);
}

body.gaming-theme .carousel-control-prev,
body.gaming-theme .carousel-control-next { width: 8%; opacity: 0; transition: opacity var(--t4-speed) var(--t4-ease); z-index: 3; }
body.gaming-theme .hero-section:hover .carousel-control-prev,
body.gaming-theme .hero-section:hover .carousel-control-next { opacity: .85; }

body.gaming-theme .carousel-control-prev-icon,
body.gaming-theme .carousel-control-next-icon {
    background-color: rgba(10, 14, 23, .7);
    border: 1px solid var(--t4-border-strong);
    border-radius: 50%;
    width: 46px;
    height: 46px;
    background-size: 42%;
}

/* ------------------------------------------------------------------- cards */

body.gaming-theme .card {
    background: var(--t4-surface);
    border: 1px solid var(--t4-border);
    border-radius: var(--t4-r-lg);
    overflow: hidden;
    color: var(--t4-text);
    box-shadow: var(--t4-shadow-sm);
    transition: transform var(--t4-speed) var(--t4-ease),
                border-color var(--t4-speed) var(--t4-ease),
                box-shadow var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .card:hover {
    transform: translateY(-5px);
    border-color: rgba(232, 93, 4, .5);
    box-shadow: var(--t4-shadow-lg);
}

body.gaming-theme .card-img-wrapper {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background: var(--t4-surface-2);
}

body.gaming-theme .card-img-wrapper::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 55%;
    background: linear-gradient(to top, rgba(20, 27, 43, .85), transparent);
    pointer-events: none;
}

body.gaming-theme .card-img-top,
body.gaming-theme .card-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .55s var(--t4-ease);
}

body.gaming-theme .card:hover .card-img-top,
body.gaming-theme .card:hover .card-img-wrapper img { transform: scale(1.06); }

body.gaming-theme .card-img-wrapper .badge { z-index: 2; }

body.gaming-theme .card-body { padding: 1.05rem 1.15rem 1.15rem; }

body.gaming-theme .card-title {
    font-family: var(--t4-font-display);
    font-size: 1.03rem;
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: -.015em;
    margin-bottom: .5rem;
}

body.gaming-theme .card-title,
body.gaming-theme .card-title a { color: var(--t4-text); }
body.gaming-theme .card:hover .card-title { color: #FFE08A; }

body.gaming-theme .card-text {
    color: var(--t4-text-dim);
    font-size: .89rem;
    line-height: 1.55;
}

body.gaming-theme .card-footer {
    background: transparent;
    border-top: 1px solid var(--t4-border);
    color: var(--t4-text-mute);
    font-size: .78rem;
    padding: .7rem 1.15rem;
}

body.gaming-theme .card-footer i { color: var(--t4-text-mute); }
body.gaming-theme .card.card-clickable { cursor: pointer; }

/* --------------------------------------------------------- section framing */

body.gaming-theme .section-title,
body.gaming-theme .news-gallery-section h2,
body.gaming-theme .trending-section h3,
body.gaming-theme .twitter-section h3 {
    font-family: var(--t4-font-display);
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--t4-text);
}

/* Small caps label with a gradient rule, applied to the "Latest News" style
   headings that the templates already render. */
body.gaming-theme .news-gallery-section h2 {
    position: relative;
    font-size: .95rem;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--t4-text-dim);
    padding-bottom: .7rem;
    margin-bottom: 1.1rem;
    border-bottom: 1px solid var(--t4-border);
}

body.gaming-theme .news-gallery-section h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 62px;
    height: 2px;
    border-radius: 2px;
    background: var(--t4-brand-gradient);
}

/* The homepage gallery band used to be a hard white block — make it a
   surface that belongs to the dark theme. */
body.gaming-theme .news-gallery-section {
    background: linear-gradient(180deg, var(--t4-bg-alt), var(--t4-bg)) !important;
    border-bottom: 1px solid var(--t4-border);
}

body.gaming-theme .gallery-featured-image,
body.gaming-theme .gallery-main-image { border-radius: var(--t4-r-lg); }

body.gaming-theme .gallery-featured-image { overflow: hidden; }

body.gaming-theme .gallery-overlay {
    background: linear-gradient(to top, rgba(10, 14, 23, .95) 8%, rgba(10, 14, 23, .55) 45%, transparent 80%);
}

body.gaming-theme .gallery-title {
    font-family: var(--t4-font-display);
    letter-spacing: -.02em;
}

/* Latest-news rail items */
body.gaming-theme .news-item,
body.gaming-theme .gallery-news-item {
    background: var(--t4-surface);
    border: 1px solid var(--t4-border);
    border-radius: var(--t4-r);
    transition: background var(--t4-speed) var(--t4-ease),
                border-color var(--t4-speed) var(--t4-ease),
                transform var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .news-item:hover,
body.gaming-theme .gallery-news-item:hover,
body.gaming-theme .news-item.active,
body.gaming-theme .gallery-news-item.active {
    background: var(--t4-surface-2);
    border-color: rgba(232, 93, 4, .5);
    transform: translateX(3px);
}

body.gaming-theme .news-item h4,
body.gaming-theme .gallery-news-item h4 {
    font-size: .96rem;
    line-height: 1.32;
}

/* Trending / social panels */
body.gaming-theme .trending-section,
body.gaming-theme .twitter-section {
    background: var(--t4-surface);
    border: 1px solid var(--t4-border);
    border-radius: var(--t4-r-lg);
    box-shadow: var(--t4-shadow-sm);
}

body.gaming-theme .trending-item {
    border-bottom: 1px solid var(--t4-border);
    transition: background var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .trending-item:hover { background: rgba(255, 255, 255, .04); }

/* Rank numerals in the "most viewed" list */
body.gaming-theme .trending-rank,
body.gaming-theme .trending-number {
    font-family: var(--t4-font-display);
    font-weight: 700;
    background: var(--t4-brand-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* ----------------------------------------------------------------- buttons */

body.gaming-theme .btn {
    font-family: var(--t4-font-display);
    font-weight: 600;
    letter-spacing: .005em;
    border-radius: var(--t4-r-pill);
    transition: transform var(--t4-speed) var(--t4-ease),
                box-shadow var(--t4-speed) var(--t4-ease),
                background var(--t4-speed) var(--t4-ease);
}

body.gaming-theme .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px -10px rgba(232, 93, 4, 1);
    color: #fff;
}

body.gaming-theme .btn-lg { padding: .72rem 1.6rem; font-size: 1rem; }

body.gaming-theme .btn-outline-light {
    border-color: var(--t4-border-strong);
    color: var(--t4-text);
}

body.gaming-theme .btn-outline-light:hover {
    background: rgba(255, 255, 255, .1);
    border-color: var(--t4-border-strong);
    color: #fff;
}

body.gaming-theme .btn-outline-primary {
    border-color: rgba(232, 93, 4, .55);
    color: #E8B86D;
}

body.gaming-theme .btn-outline-primary:hover {
    background: var(--t4-blue);
    border-color: var(--t4-blue);
    color: #fff;
}

/* Pagination */
body.gaming-theme .page-link {
    background: var(--t4-surface);
    border: 1px solid var(--t4-border);
    color: var(--t4-text-dim);
    border-radius: var(--t4-r-sm) !important;
    margin: 0 .18rem;
    font-weight: 600;
}

body.gaming-theme .page-link:hover {
    background: var(--t4-surface-2);
    border-color: var(--t4-border-strong);
    color: #fff;
}

body.gaming-theme .page-item.active .page-link {
    background: var(--t4-brand-gradient);
    border-color: transparent;
    color: #fff;
}

body.gaming-theme .page-item.disabled .page-link {
    background: var(--t4-bg-alt);
    color: var(--t4-text-mute);
    border-color: var(--t4-border);
}

/* ------------------------------------------------------------------- forms */

body.gaming-theme .form-control,
body.gaming-theme .form-select {
    background: var(--t4-surface);
    border: 1px solid var(--t4-border);
    color: var(--t4-text);
    border-radius: var(--t4-r-sm);
}

body.gaming-theme .form-control::placeholder { color: var(--t4-text-mute); }

body.gaming-theme .form-control:focus,
body.gaming-theme .form-select:focus {
    background: var(--t4-surface-2);
    border-color: rgba(232, 93, 4, .7);
    box-shadow: 0 0 0 .2rem rgba(232, 93, 4, .18);
    color: #fff;
}

body.gaming-theme .input-group-text {
    background: var(--t4-surface-2);
    border-color: var(--t4-border);
    color: var(--t4-text-dim);
}

/* ------------------------------------------------------------------ footer */

body.gaming-theme footer,
body.gaming-theme .site-footer {
    background: linear-gradient(180deg, var(--t4-bg-alt), #070A11) !important;
    border-top: 1px solid var(--t4-border);
    color: var(--t4-text-dim);
}

body.gaming-theme footer h5,
body.gaming-theme footer h6 {
    font-family: var(--t4-font-display);
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--t4-text);
    margin-bottom: .9rem;
}

body.gaming-theme footer a { color: var(--t4-text-dim); }
body.gaming-theme footer a:hover { color: #fff; }
body.gaming-theme footer .list-unstyled li { margin-bottom: .4rem; }

/* ------------------------------------------------------- article / news page */

body.news-page,
body.gaming-theme.news-page { background: var(--t4-bg); }

body.gaming-theme .article-content {
    font-family: var(--t4-font-body);
    font-size: 1.09rem;
    line-height: 1.78;
    color: #D7E0EE;
}

body.gaming-theme .article-content p { margin-bottom: 1.35rem; }

body.gaming-theme .article-content h2,
body.gaming-theme .article-content h3 {
    margin-top: 2.4rem;
    margin-bottom: .9rem;
}

body.gaming-theme .article-content h2 { font-size: 1.7rem; }
body.gaming-theme .article-content h3 { font-size: 1.32rem; }

body.gaming-theme .article-content a { color: #E8B86D; text-decoration: underline; text-underline-offset: 3px; }

body.gaming-theme .article-content img,
body.gaming-theme .article-content figure img {
    border-radius: var(--t4-r);
    box-shadow: var(--t4-shadow);
    max-width: 100%;
    height: auto;
}

body.gaming-theme .article-content blockquote {
    border-left: 3px solid transparent;
    border-image: var(--t4-brand-gradient) 1;
    background: var(--t4-surface);
    border-radius: 0 var(--t4-r) var(--t4-r) 0;
    padding: 1rem 1.3rem;
    margin: 1.8rem 0;
    color: var(--t4-text);
    font-size: 1.06rem;
}

body.gaming-theme .breadcrumb {
    background: transparent;
    padding-left: 0;
    font-size: .85rem;
}

body.gaming-theme .breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: var(--t4-text-mute); }
body.gaming-theme .breadcrumb-item.active { color: var(--t4-text-dim); }

body.gaming-theme .list-group-item {
    background: var(--t4-surface);
    border-color: var(--t4-border);
    color: var(--t4-text);
}

body.gaming-theme .list-group-item:hover { background: var(--t4-surface-2); }

/* Newsletter call-out in the article sidebar — a branded card rather than a
   flat Bootstrap blue block. */
body.gaming-theme .newsletter-sidebar,
body.gaming-theme .newsletter-sidebar.bg-primary {
    background: linear-gradient(150deg, rgba(232, 93, 4, .28), rgba(122, 31, 31, .35)) !important;
    border: 1px solid rgba(224, 168, 74, .34);
    border-radius: var(--t4-r-lg);
    box-shadow: var(--t4-shadow);
}

body.gaming-theme .newsletter-sidebar h5 { color: #fff !important; }
body.gaming-theme .newsletter-sidebar p { color: rgba(233, 238, 248, .82) !important; }

body.gaming-theme .newsletter-sidebar .form-control {
    background: rgba(10, 14, 23, .55);
    border: 1px solid rgba(255, 255, 255, .18);
    color: #fff;
}

body.gaming-theme .newsletter-sidebar .btn,
body.gaming-theme .newsletter-sidebar .btn-light {
    background: var(--t4-amber-gradient);
    border: 0;
    color: #211603;
    font-weight: 700;
}

body.gaming-theme .table-of-contents {
    background: var(--t4-surface) !important;
    border: 1px solid var(--t4-border);
    border-radius: var(--t4-r-lg);
}

body.gaming-theme .table-of-contents a { color: var(--t4-text-dim); }
body.gaming-theme .table-of-contents a:hover { color: #fff; }

body.gaming-theme .author-bio {
    background: var(--t4-surface) !important;
    border: 1px solid var(--t4-border);
    border-radius: var(--t4-r-lg);
}

/* Bootstrap light utilities used by templates read badly on a dark page */
body.gaming-theme .bg-light {
    background: var(--t4-surface) !important;
    color: var(--t4-text);
}

body.gaming-theme .bg-white { background: var(--t4-surface) !important; }
body.gaming-theme .text-dark { color: var(--t4-text) !important; }
body.gaming-theme .border { border-color: var(--t4-border) !important; }
body.gaming-theme .shadow-sm { box-shadow: var(--t4-shadow-sm) !important; }

/* --------------------------------------------------------------- utilities */

/* Skeleton shimmer for lazily inserted content */
@keyframes t4-shimmer {
    0%   { background-position: -600px 0; }
    100% { background-position: 600px 0; }
}

body.gaming-theme .t4-skeleton {
    background: linear-gradient(90deg, var(--t4-surface) 25%, var(--t4-surface-3) 50%, var(--t4-surface) 75%);
    background-size: 1200px 100%;
    animation: t4-shimmer 1.6s infinite linear;
    border-radius: var(--t4-r-sm);
}

/* --------------------------------------------------------------- responsive */

@media (max-width: 991.98px) {
    body.gaming-theme .hero-image { min-height: 440px; }
    body.gaming-theme .hero-overlay { padding-bottom: 3rem; }
    body.gaming-theme .main-header { position: static; }
    body.gaming-theme .main-header .navbar-collapse {
        background: var(--t4-surface);
        border: 1px solid var(--t4-border);
        border-radius: var(--t4-r);
        padding: .5rem;
        margin-top: .5rem;
    }
}

@media (max-width: 575.98px) {
    body.gaming-theme .hero-image { min-height: 380px; }
    body.gaming-theme .hero-title { font-size: 1.6rem; }
    body.gaming-theme .hero-summary { -webkit-line-clamp: 2; font-size: .95rem; }
    body.gaming-theme .t4-brand__word { font-size: 1.25rem; }
    body.gaming-theme .t4-brand__mark { width: 30px; height: 30px; }
}

/* Wider hall on large / ultrawide screens */
@media (min-width: 1400px) {
    body.gaming-theme .container {
        max-width: 1600px;
    }
}

/* --------------------------------------------------------------- tavern hall */

.t4-hall {
    padding: 2.4rem 0 1.2rem;
}

.t4-hall__intro {
    text-align: center;
    margin-bottom: 1.6rem;
}

.t4-hall__sign {
    display: inline-block;
    font-family: var(--t4-font-display);
    font-size: .72rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--t4-gold);
    border: 1px solid var(--t4-border-strong);
    padding: .28rem .8rem;
    border-radius: var(--t4-r-pill);
    margin-bottom: .7rem;
}

.t4-hall__title {
    font-size: clamp(1.5rem, 2.4vw, 2.15rem);
    margin: 0 0 .4rem;
    color: var(--t4-text);
}

.t4-hall__lead {
    color: var(--t4-text-dim);
    margin: 0 auto;
    max-width: 36rem;
}

.t4-ticker {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    justify-content: center;
    margin-bottom: 1.5rem;
}

.t4-ticker__item {
    background: var(--t4-surface);
    border: 1px solid var(--t4-border);
    border-radius: var(--t4-r);
    padding: .55rem 1rem;
    min-width: 8.5rem;
    text-align: center;
}

.t4-ticker__label {
    display: block;
    font-size: .68rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--t4-text-mute);
}

.t4-ticker__value {
    display: block;
    font-family: var(--t4-font-display);
    font-size: 1.15rem;
    color: var(--t4-amber-lt);
    line-height: 1.3;
}

.t4-ticker__chg { font-size: .75rem; font-weight: 600; }
.t4-ticker__chg.is-up { color: #8FCB6A; }
.t4-ticker__chg.is-down { color: #E07070; }

.t4-board {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1.15rem;
    align-items: stretch;
}

.t4-panel {
    background: linear-gradient(180deg, rgba(46, 28, 18, .92), rgba(26, 16, 12, .96));
    border: 1px solid var(--t4-border);
    border-radius: var(--t4-r-lg);
    box-shadow: var(--t4-shadow);
    overflow: hidden;
    min-width: 0;
}

.t4-panel__head {
    padding: .85rem 1.05rem .55rem;
    border-bottom: 1px solid var(--t4-border);
}

.t4-panel__head h3 {
    margin: 0;
    font-size: 1rem;
    letter-spacing: .04em;
    color: var(--t4-gold);
}

.t4-panel__head i { margin-right: .4rem; color: var(--t4-ember); }

.t4-panel--youtube { grid-column: span 7; }
.t4-panel--x       { grid-column: span 5; }
.t4-panel--tiktok  { grid-column: span 12; }

.t4-embed {
    position: relative;
    aspect-ratio: 16 / 9;
    background: #000;
}

.t4-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.t4-panel__list {
    list-style: none;
    margin: 0;
    padding: .4rem 0;
}

.t4-panel__list a {
    display: flex;
    gap: .75rem;
    align-items: center;
    padding: .55rem 1rem;
    color: var(--t4-text);
}

.t4-panel__list a:hover { background: rgba(232, 93, 4, .08); color: var(--t4-amber-lt); }

.t4-panel__list img {
    width: 96px;
    height: 54px;
    object-fit: cover;
    border-radius: 6px;
    flex-shrink: 0;
}

.t4-panel__list strong {
    display: block;
    font-size: .88rem;
    line-height: 1.3;
}

.t4-panel__list small { color: var(--t4-text-mute); }

.t4-tweets {
    list-style: none;
    margin: 0;
    padding: .3rem 0 0.6rem;
}

.t4-tweets li + li { border-top: 1px solid var(--t4-border); }

.t4-tweets a {
    display: block;
    padding: .85rem 1.05rem;
    color: var(--t4-text);
}

.t4-tweets a:hover { background: rgba(232, 93, 4, .08); color: var(--t4-text); }

.t4-tweets__author {
    display: block;
    font-size: .75rem;
    color: var(--t4-gold);
    margin-bottom: .25rem;
}

.t4-tweets p {
    margin: 0;
    font-size: .92rem;
    line-height: 1.45;
    color: var(--t4-text-dim);
}

.t4-tweets--embed { padding: .6rem .8rem 1rem; }

.t4-tiktok-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .7rem;
    padding: .85rem 1rem 1rem;
}

.t4-tiktok-card {
    display: flex;
    flex-direction: column;
    background: var(--t4-surface-2);
    border-radius: var(--t4-r);
    overflow: hidden;
    color: var(--t4-text);
    min-height: 180px;
}

.t4-tiktok-card img,
.t4-tiktok-card__ph {
    width: 100%;
    aspect-ratio: 9 / 12;
    object-fit: cover;
    background: #1a100c;
}

.t4-tiktok-card__ph {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: var(--t4-gold);
}

.t4-tiktok-card__cap {
    padding: .5rem .65rem .7rem;
    font-size: .78rem;
    color: var(--t4-text-dim);
}

@media (max-width: 991.98px) {
    .t4-panel--youtube,
    .t4-panel--x,
    .t4-panel--tiktok { grid-column: span 12; }
    .t4-tiktok-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Respect users who ask for less animation */
@media (prefers-reduced-motion: reduce) {
    body.gaming-theme *,
    body.gaming-theme *::before,
    body.gaming-theme *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}