/* ============================================================================
   Darkan theme — a dark medieval/RuneScape skin layered on top of Bootstrap 5.3.
   Bootstrap provides the grid, components and JS; this file re-themes its CSS
   variables and adds a few bespoke pieces (hero, clan motif, skill rail, etc.).
   ========================================================================== */

:root,
[data-bs-theme="dark"] {
    /* palette — gold signature + a verdigris secondary accent over a neutral, slightly warm base.
       Keeps the RuneScape feel while breaking up the old all-brown monochrome. */
    --gold: #d4af37;
    --gold-2: #f0d27a;
    --accent: #5fa89f;        /* verdigris/teal — secondary accent for variety */
    --accent-2: #86c9c0;
    --accent-rgb: 95, 168, 159;
    --panel-edge: #3c3a32;    /* warm-neutral edge (less brown) */
    --panel-edge-light: #585444;

    /* Bootstrap variable overrides */
    --bs-body-bg: #0e0f12;
    --bs-body-color: #e3dfd3;
    --bs-body-font-family: 'EB Garamond', Georgia, serif;
    --bs-body-font-size: 1.05rem;
    --bs-emphasis-color: #ffffff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: #a7a08e;
    --bs-tertiary-color: #7f7868;
    --bs-heading-color: #d4af37;

    --bs-primary: #d4af37;
    --bs-primary-rgb: 212, 175, 55;
    --bs-link-color: #e6c777;
    --bs-link-color-rgb: 230, 199, 119;
    --bs-link-hover-color: #86c9c0;   /* teal hover adds variety against the gold */

    --bs-border-color: #37352e;
    --bs-border-color-translucent: rgba(90, 86, 72, 0.45);

    --bs-secondary-bg: #1d1f25;       /* neutral slate surfaces instead of brown */
    --bs-tertiary-bg: #16171c;

    --bs-card-bg: #191b21;
    --bs-card-border-color: #33312b;
    --bs-card-cap-bg: rgba(0, 0, 0, 0.25);

    --bs-border-radius: 0.4rem;
}

body {
    background:
        radial-gradient(circle at 50% -10%, rgba(212, 175, 55, 0.07), transparent 55%),
        radial-gradient(circle at 85% 8%, rgba(var(--accent-rgb), 0.05), transparent 45%),
        var(--bs-body-bg);
}

.text-accent { color: var(--accent) !important; }

h1, h2, h3, h4, h5, h6, .navbar-brand, .card-title {
    font-family: 'Cinzel', serif;
    letter-spacing: 0.02em;
}

a { text-decoration: none; }
.text-gold { color: var(--gold) !important; }

/* ---------- players-online button (in the navbar) — looks like the Log in button, but no hover ---------- */
.navbar-online {
    cursor: default;
    /* neutralise Bootstrap's hover/active states so it never changes on hover */
    --bs-btn-hover-color: var(--bs-btn-color);
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: var(--bs-btn-border-color);
    --bs-btn-active-color: var(--bs-btn-color);
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: var(--bs-btn-border-color);
    --bs-btn-active-shadow: none;
}
.navbar-online:focus, .navbar-online:focus-visible, .navbar-online:active { box-shadow: none; }
.navbar-online .bi { color: #3fb950; }
.navbar-online.off .bi { color: var(--bs-tertiary-color); }

/* ---------- navbar ---------- */
.site-navbar {
    background: linear-gradient(180deg, #1b1d23, #0f1014);
    border-bottom: 2px solid var(--gold);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5);
    padding-top: 0; padding-bottom: 0; min-height: 3.4rem; align-items: stretch;
}
.site-navbar .navbar-brand, .site-navbar .navbar-toggler { align-self: center; }
/* full-height nav items so hover dropdowns drop from the navbar's bottom border. The nav-links stay
   visually centered (align-items:center on the items), so appearance is unchanged — only the items'
   hit area / height grows to span the full bar. The navbar's flex parent is the inner .container. */
@media (min-width: 992px) {
    .site-navbar > .container,
    .site-navbar .navbar-collapse,
    .site-navbar .navbar-nav { align-items: stretch; }
    .site-navbar .navbar-nav > .nav-item { display: flex; align-items: center; }
    .site-navbar .hover-dropdown > .dropdown-menu { top: 100%; margin-top: 0; }
}
.navbar-brand { display: flex; align-items: center; gap: 0.6rem; color: var(--gold); }
.navbar-brand:hover { color: var(--gold-2); }
.brand-mark {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2.1rem; height: 2.1rem; border-radius: 50%;
    background: radial-gradient(circle at 30% 25%, #3a2d18, #1a140b);
    border: 1px solid var(--gold); color: var(--gold);
    font-size: 1rem; box-shadow: 0 0 10px rgba(212, 175, 55, 0.25);
}
.brand-name { font-weight: 700; text-transform: uppercase; font-size: 1.3rem; letter-spacing: 0.06em; }

.site-navbar .nav-link {
    position: relative; display: flex; align-items: center; gap: 0.45rem;
    font-family: 'Cinzel', serif; text-transform: uppercase; font-size: 0.86rem;
    letter-spacing: 0.04em; color: #ffffff;
    padding: 0.5rem 0.9rem; transition: color 0.15s ease;
}
/* navbar action buttons (Log in, Create Account, players-online) — a touch more padding */
.site-navbar .btn-sm { padding: 0.42rem 0.85rem; }
.site-navbar .nav-link .bi { font-size: 0.95rem; opacity: 0.85; }
/* active/hover underline uses ::before so it never clashes with the dropdown caret (::after) */
.site-navbar .nav-link::before {
    content: ''; position: absolute; left: 0.9rem; right: 0.9rem; bottom: 0.2rem; height: 2px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    transform: scaleX(0); transform-origin: center; transition: transform 0.2s ease;
}
.site-navbar .nav-link:hover { color: var(--gold-2); }
.site-navbar .nav-link:hover::before,
.site-navbar .nav-link.active::before { transform: scaleX(1); }
.site-navbar .nav-link.active { color: var(--gold); }
.site-navbar .dropdown-toggle::after { margin-left: 0.35rem; vertical-align: 0.12em; }
.account-link .bi-person-circle { font-size: 1.1rem; color: var(--gold); opacity: 1; }

/* dropdown menus */
.dropdown-menu {
    --bs-dropdown-bg: #16171c;
    --bs-dropdown-border-color: var(--panel-edge);
    --bs-dropdown-link-color: var(--bs-secondary-color);
    --bs-dropdown-link-hover-bg: rgba(212, 175, 55, 0.10);
    --bs-dropdown-link-hover-color: var(--gold-2);
    --bs-dropdown-link-active-bg: rgba(212, 175, 55, 0.16);
    --bs-dropdown-link-active-color: var(--gold);
    --bs-dropdown-divider-bg: var(--panel-edge);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.55); margin-top: 0.45rem;
}
.dropdown-item { font-family: 'Cinzel', serif; font-size: 0.82rem; padding: 0.55rem 1rem; display: flex; align-items: center; gap: 0.6rem; }
.dropdown-item .bi { color: var(--gold); font-size: 0.95rem; width: 1.1rem; text-align: center; }
button.dropdown-item { text-align: left; }

/* navbar dropdowns: drop flush from the navbar's bottom edge (gold top border) + open on hover */
.site-navbar .dropdown-menu {
    margin-top: 0; border-top: 2px solid var(--gold); border-radius: 0 0 0.45rem 0.45rem;
}
@media (min-width: 992px) {
    .site-navbar .hover-dropdown:hover > .dropdown-menu { display: block; }
}

/* collapsed (mobile) navbar: show dropdowns inline as a sub-list instead of a floating menu */
@media (max-width: 991.98px) {
    .site-navbar .navbar-nav { padding-top: 0.5rem; }
    .site-navbar .dropdown-menu {
        display: block; position: static; float: none; border: 0; box-shadow: none;
        background: transparent; margin: 0 0 0 0.6rem; padding: 0; border-left: 1px solid var(--panel-edge);
    }
    .site-navbar .nav-link::before { display: none; }
    .site-navbar .nav-link.active { background: rgba(212, 175, 55, 0.10); border-radius: 0.3rem; }
}

/* ---------- buttons ---------- */
.btn { font-family: 'Cinzel', serif; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.03em; }
.btn-primary {
    --bs-btn-color: #2a2008; --bs-btn-bg: var(--gold); --bs-btn-border-color: #8c6f1f;
    --bs-btn-hover-color: #1a1404; --bs-btn-hover-bg: #e0bd4a; --bs-btn-hover-border-color: #a07f24;
    --bs-btn-active-bg: #c39f2f; --bs-btn-active-border-color: #a07f24;
    font-weight: 700;
}
.btn-outline-primary {
    --bs-btn-color: var(--gold-2); --bs-btn-border-color: var(--gold);
    --bs-btn-hover-color: #1a1404; --bs-btn-hover-bg: var(--gold); --bs-btn-hover-border-color: var(--gold);
}
.btn-outline-secondary {
    --bs-btn-color: #ffffff; --bs-btn-border-color: var(--gold);
    --bs-btn-hover-color: #1a1404; --bs-btn-hover-bg: var(--gold); --bs-btn-hover-border-color: var(--gold);
    --bs-btn-active-color: #1a1404; --bs-btn-active-bg: var(--gold); --bs-btn-active-border-color: var(--gold);
}

/* ---------- cards (panels) ---------- */
.card {
    background: linear-gradient(180deg, #191b21, #16171c);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.4), 0 6px 18px rgba(0, 0, 0, 0.4);
}
.card-title {
    color: var(--gold); border-bottom: 1px solid var(--bs-border-color);
    padding-bottom: 0.6rem; margin-bottom: 1rem;
}
.page-title { color: var(--gold); margin: 1.6rem 0 1rem; }

/* ---------- page header (below navbar) — clean title, no full-width band ---------- */
.page-header { padding: 1.6rem 0 0; }
.page-header > .container { padding-bottom: 0.8rem; border-bottom: 1px solid var(--panel-edge); }
.page-header-title {
    margin: 0; color: var(--gold-2); line-height: 1.2;
    font-family: 'Cinzel', serif; font-size: clamp(1.4rem, 3vw, 1.85rem); letter-spacing: 0.01em;
}
.page-header-sub { margin: 0.3rem 0 0; color: var(--bs-secondary-color); }

/* ---------- tables ---------- */
.table { --bs-table-bg: transparent; --bs-table-color: var(--bs-body-color); --bs-table-border-color: var(--bs-border-color); }
.table > thead th {
    font-family: 'Cinzel', serif; text-transform: uppercase; font-size: 0.78rem;
    letter-spacing: 0.03em; color: var(--gold); border-bottom-color: var(--panel-edge-light);
}
.table.table-hover > tbody > tr:hover > * { --bs-table-hover-bg: rgba(212, 175, 55, 0.07); }
.table .col-num, .text-num { text-align: right; font-variant-numeric: tabular-nums; }

/* ---------- forms ---------- */
.form-control, .form-select {
    background-color: #101116; border-color: var(--bs-border-color); color: var(--bs-body-color);
    color-scheme: dark; /* render native popups (select list, date pickers) in dark mode */
}
.form-control:focus, .form-select:focus {
    background-color: #101116; color: var(--bs-body-color);
    border-color: var(--gold); box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.2);
}
/* gold caret instead of Bootstrap's near-black one; theme the option list */
.form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23f0d27a' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.form-select option { background-color: #16171c; color: var(--bs-body-color); }
.form-select option:checked { background-color: var(--gold); color: #1a1404; }
.form-label { font-family: 'Cinzel', serif; font-size: 0.78rem; text-transform: uppercase; color: var(--gold); }
.form-text { color: var(--bs-tertiary-color); }

/* ---------- badges ---------- */
.badge.text-bg-gold { background: var(--gold); color: #1a1404; }
.iron-badge { color: #9fb4c9; }

/* ---------- pagination ---------- */
.pagination {
    --bs-pagination-bg: transparent; --bs-pagination-color: var(--bs-secondary-color);
    --bs-pagination-border-color: var(--bs-border-color);
    --bs-pagination-hover-bg: rgba(212, 175, 55, 0.1); --bs-pagination-hover-color: var(--gold);
    --bs-pagination-hover-border-color: var(--gold);
    --bs-pagination-active-bg: var(--gold); --bs-pagination-active-border-color: var(--gold);
    --bs-pagination-active-color: #1a1404;
    --bs-pagination-disabled-bg: transparent; --bs-pagination-disabled-color: #5b4f37;
    --bs-pagination-disabled-border-color: var(--bs-border-color);
    --bs-pagination-font-family: 'Cinzel', serif;
}

/* ---------- footer ---------- */
.site-footer { border-top: 2px solid var(--gold); background: #101116; color: #ffffff; }
.site-footer a { color: #ffffff; }
.site-footer a:hover { color: var(--gold-2); }

/* ============================================================================
   Bespoke components
   ========================================================================== */

/* hero */
.hero {
    min-height: 420px;
    background:
        linear-gradient(180deg, rgba(15, 13, 10, 0.2), var(--bs-body-bg) 95%),
        radial-gradient(circle at 50% 30%, #3a2d18, #120e08 70%);
    border-bottom: 2px solid var(--panel-edge);
    display: flex; align-items: center;
}
.hero-title { font-size: clamp(2rem, 5vw, 2.9rem); color: var(--gold-2); text-shadow: 0 3px 12px #000; }
.hero-sub { font-size: 1.25rem; color: var(--bs-secondary-color); }

/* news */
.news-cat {
    display: inline-block; font-family: 'Cinzel', serif; font-size: 0.7rem; text-transform: uppercase;
    letter-spacing: 0.06em; color: #1a1404; background: var(--gold); padding: 0.1rem 0.5rem; border-radius: 0.2rem;
}
.news-card-img { min-height: 160px; background-size: cover; background-position: center; }
.article-body { font-size: 1.1rem; }
.article-body p { margin-bottom: 1rem; }
.article-hero { height: 280px; background-size: cover; background-position: center; border-radius: 0.4rem; border: 1px solid var(--panel-edge); }

/* hiscores index: header selector + right-hand search/compare/clan panel */
.hiscores-select { max-width: 220px; flex: 0 0 auto; margin: 0; }
.hs-side-title {
    font-family: 'Cinzel', serif; color: var(--gold); font-size: 0.92rem;
    text-transform: uppercase; letter-spacing: 0.03em;
    margin-bottom: 0.6rem; padding-bottom: 0.4rem; border-bottom: 1px solid var(--panel-edge-light);
}
.hs-sidebar-inner {
    height: 100%; padding: 1.25rem;
    background: rgba(0, 0, 0, 0.22);
    border: 1px solid var(--panel-edge); border-radius: 0.5rem;
}

/* hiscores overall row */
.overall-row > * { background: rgba(212, 175, 55, 0.10) !important; border-top: 2px solid var(--panel-edge-light); border-bottom: 2px solid var(--panel-edge-light); }
.compare-table .win { color: var(--gold-2); font-weight: 700; }
.vs { color: var(--bs-tertiary-color); font-family: 'Cinzel', serif; }
.hs-skill-icon { width: 22px; height: 22px; object-fit: contain; vertical-align: middle; }

/* hiscores versus (single + compare share this): each side is a bordered panel, icons float between */
.vs-table { border-collapse: separate; border-spacing: 0; }
.vs-table th, .vs-table td { border: 0; padding: 0.45rem 0.6rem; }
.vs-table .vs-a, .vs-table .vs-b { background: rgba(0, 0, 0, 0.22); }
.vs-table .vs-center { background: transparent; width: 64px; }
/* vertical outer edges of each panel */
.vs-table .vs-edge-l { border-left: 1px solid var(--panel-edge); }
.vs-table .vs-edge-r { border-right: 1px solid var(--panel-edge); }
/* horizontal row separators inside each panel */
.vs-table thead tr.vs-subhead .vs-a, .vs-table thead tr.vs-subhead .vs-b,
.vs-table tbody tr .vs-a, .vs-table tbody tr .vs-b { border-bottom: 1px solid var(--panel-edge); }
/* top of panel = the input row; bottom of panel = last body row */
.vs-table thead tr.vs-inputs .vs-a, .vs-table thead tr.vs-inputs .vs-b { border-top: 1px solid var(--panel-edge); }
.vs-table thead tr.vs-inputs .vs-edge-l { border-top-left-radius: 0.5rem; }
.vs-table thead tr.vs-inputs .vs-edge-r { border-top-right-radius: 0.5rem; }
.vs-table tbody tr:last-child .vs-edge-l { border-bottom-left-radius: 0.5rem; }
.vs-table tbody tr:last-child .vs-edge-r { border-bottom-right-radius: 0.5rem; }
.vs-table .win { color: var(--gold-2); font-weight: 700; }
/* the two name inputs — a touch larger + roomier than form-control-sm */
.vs-table .vs-inputs .form-control { font-size: 0.95rem; padding: 0.45rem 0.7rem; }
/* row hover: lift both side panels (centre icon column stays transparent) */
.vs-table tbody tr:hover .vs-a, .vs-table tbody tr:hover .vs-b { background: rgba(212, 175, 55, 0.10); }

/* public profile */
.profile-avatar {
    width: 84px; height: 84px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Cinzel', serif; font-size: 2.2rem; color: var(--c, #f0d27a);
    background: rgba(0, 0, 0, 0.3); border: 2px solid var(--c, #f0d27a);
}

/* game guide */
.guide-card { transition: border-color 0.12s, transform 0.12s; }
.guide-card:hover { border-color: var(--panel-edge-light); transform: translateY(-2px); }
.guide-article-body { line-height: 1.7; }
.guide-article-body img { max-width: 100%; height: auto; border-radius: 0.4rem; }
.guide-article-body h2, .guide-article-body h3 { font-family: 'Cinzel', serif; color: var(--gold-2); margin-top: 1.4rem; }
.guide-article-body table { width: 100%; margin: 1rem 0; }
.guide-article-body table, .guide-article-body th, .guide-article-body td { border: 1px solid var(--panel-edge); padding: 0.4rem 0.6rem; }

/* quest guide */
.guide-block { border: 1px solid var(--panel-edge); }
.guide-block > .card-header {
    font-family: 'Cinzel', serif; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.82rem;
    color: var(--gold); background: rgba(212, 175, 55, 0.07); border-bottom: 1px solid var(--panel-edge-light);
}
.quest-h {
    font-family: 'Cinzel', serif; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.95rem;
    color: var(--gold); margin: 1.6rem 0 0.7rem; padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--panel-edge-light);
}
.quest-guide .card-body > .quest-h:first-child { margin-top: 0; }
.quest-overview { margin: 0; }
.quest-overview th {
    width: 1%; white-space: nowrap; vertical-align: top; padding-right: 1.5rem !important;
    font-family: 'Cinzel', serif; font-weight: 600; color: var(--gold-2); background: rgba(212, 175, 55, 0.04);
}
.quest-overview td { vertical-align: top; }
.quest-overview > tbody > tr > * { padding: 0.7rem 1rem; }
@media (max-width: 575.98px) { .quest-overview th { white-space: normal; } }
.quest-reqs { margin: 0; padding-left: 1.25rem; }
.quest-reqs > li { margin-bottom: 0.2rem; }
.req-label { display: block; font-weight: 600; color: var(--gold-2); margin-bottom: 0.15rem; }
.quest-links { padding-left: 1rem; }
.quest-links > li { margin-bottom: 0.15rem; }
.quest-link-marker { color: var(--bs-tertiary-color); margin-right: 0.35rem; }
/* nested requirement levels: each deeper list gets its own left guide line + extra indent, so going
   deeper stacks parallel vertical lines that separate the levels. */
.quest-links .quest-links {
    margin: 0.15rem 0 0.2rem 0.25rem;
    padding-left: 0.95rem;
    border-left: 1px solid var(--panel-edge-light);
}
.quest-links .quest-links .quest-links { border-left-color: var(--gold-2); border-left-style: dotted; }
.quest-checklist .form-check { padding: 0.25rem 0 0.25rem 1.9rem; border-bottom: 1px solid var(--panel-edge); }
.quest-checklist .form-check:last-child { border-bottom: 0; }
.quest-checklist .form-check-input { cursor: pointer; }
.quest-checklist .form-check-label { cursor: pointer; }
/* Walkthrough steps: the image floats inside the step body so text wraps around it,
   alternating sides by step number. No step numbers. */
.quest-steps { display: flex; flex-direction: column; gap: 1.4rem; }
.quest-step { line-height: 1.6; }
.quest-step-title { margin-bottom: 0.35rem; }
.quest-step-body::after { content: ''; display: block; clear: both; } /* contain the floated image */
.quest-step-img {
    height: auto; display: block; border-radius: 6px;
    border: 1px solid var(--panel-edge); background: var(--panel-edge-light);
}
.quest-step-img.qs-img-left { float: left; margin: 0.2rem 1.2rem 0.7rem 0; }
.quest-step-img.qs-img-right { float: right; margin: 0.2rem 0 0.7rem 1.2rem; }
/* Block placements (no text wrap) */
.quest-step-img.qs-img-center { float: none; margin: 0.2rem auto 0.9rem; }
.quest-step-img.qs-img-above { float: none; margin: 0 0 0.9rem 0; }
.quest-step-img.qs-img-below { float: none; margin: 0.9rem 0 0 0; }
/* Beside-only: image and text in side-by-side columns; text never flows under the image. */
.quest-cols { display: flex; gap: 1.2rem; align-items: flex-start; }
.quest-cols.cols-right { flex-direction: row-reverse; }
.quest-cols > .quest-step-img { float: none; flex: 0 0 auto; margin: 0; }
.quest-cols-text { flex: 1 1 auto; min-width: 0; }
.quest-step-img.qs-size-small { width: 190px; max-width: 45%; }
.quest-step-img.qs-size-medium { width: 320px; max-width: 50%; }
.quest-step-img.qs-size-large { width: 470px; max-width: 60%; }
.quest-step-img.qs-size-original { max-width: 100%; }
@media (max-width: 575.98px) {
    /* Stack on narrow screens: image full-width above the text, no float. */
    .quest-step-img,
    .quest-step-img.qs-img-left,
    .quest-step-img.qs-img-right,
    .quest-step-img.qs-img-center,
    .quest-step-img.qs-img-above,
    .quest-step-img.qs-img-below {
        float: none; width: 100%; max-width: 100%; margin: 0 0 0.7rem 0;
    }
    /* Beside-only columns stack vertically on phones. */
    .quest-cols { flex-direction: column; }
    .quest-cols > .quest-step-img { width: 100%; max-width: 100%; }
}
/* Quest builder: each walkthrough step is a collapsible card (one open at a time). */
.qb-step-card { border: 1px solid var(--panel-edge); border-radius: 6px; margin-bottom: 0.5rem; overflow: hidden; }
.qb-step-header {
    display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem;
    cursor: pointer; user-select: none; background: rgba(255, 255, 255, 0.02);
}
.qb-step-header:hover { background: rgba(212, 175, 55, 0.06); }
.qb-step-label { font-weight: 600; color: var(--gold-2); }
.qb-step-caret { color: var(--panel-edge-light); transition: transform .15s; }
.qb-step-card.open .qb-step-caret { transform: rotate(180deg); }
.qb-step-header .qb-del { flex: 0 0 auto; }
.qb-step-content { display: none; padding: 0.75rem; border-top: 1px solid var(--panel-edge); }
.qb-step-card.open .qb-step-content { display: block; }

/* Quest builder: per-step image column. Fixed-size box (admin preview only — does not
   affect the public page); text column gets the remaining ~3/4. The size <select> below
   sets the public display size. */
.qb-step-img { flex: 0 0 auto; }
.qb-img-controls { display: flex; gap: 0.35rem; width: 200px; margin-top: 0.4rem; }
.qb-img-controls .form-select { flex: 1 1 0; min-width: 0; }
.qb-img-box { position: relative; width: 200px; height: 150px; }
.qb-img-placeholder {
    width: 100%; height: 100%; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 0.3rem;
    border: 2px dashed var(--panel-edge-light); border-radius: 6px;
    color: var(--panel-edge-light); cursor: pointer;
    background: rgba(255, 255, 255, 0.02); transition: border-color .15s, color .15s;
}
.qb-img-placeholder:hover { border-color: var(--gold); color: var(--gold); }
.qb-img-placeholder .bi { font-size: 1.7rem; line-height: 1; }
.qb-img-placeholder span { font-size: 0.78rem; }
.qb-img-pic {
    width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 6px;
    border: 1px solid var(--panel-edge); background: var(--panel-edge-light);
}
.qb-img-x {
    position: absolute; top: 6px; right: 6px; width: 24px; height: 24px;
    display: inline-flex; align-items: center; justify-content: center;
    border: none; border-radius: 50%; cursor: pointer; padding: 0;
    background: rgba(0, 0, 0, 0.6); color: #fff; font-size: 1.05rem; line-height: 1;
}
.qb-img-x:hover { background: rgba(180, 0, 0, 0.85); }
.qb-img-box:not(.has-img) .qb-img-pic,
.qb-img-box:not(.has-img) .qb-img-x { display: none; }
.qb-img-box.has-img .qb-img-placeholder { display: none; }
.quest-rewards { list-style: none; padding-left: 0; }
.quest-rewards > li { padding-left: 1.4rem; position: relative; margin-bottom: 0.3rem; }
.quest-rewards > li::before { content: '\2666'; position: absolute; left: 0; color: var(--gold); }
.quest-builder .qb-section { border-top: 1px solid var(--panel-edge); padding-top: 0.8rem; }

/* permissions table column headers — distinct from the card title and rows */
.perm-group .perm-thead th {
    text-transform: uppercase; font-family: 'Cinzel', serif; font-size: 0.68rem; letter-spacing: 0.07em;
    color: var(--gold-2); background: rgba(212, 175, 55, 0.06);
    border-bottom: 2px solid var(--panel-edge-light); padding: 0.5rem 0.5rem;
}

/* permissions group cards — CSS-columns masonry so cards don't each span full width */
.perm-masonry { column-gap: 1rem; }
.perm-masonry .perm-group { break-inside: avoid; -webkit-column-break-inside: avoid; display: inline-block; width: 100%; }
@media (min-width: 1200px) { .perm-masonry { column-count: 2; } }

/* skill icons */
.skill-icon { width: 22px; height: 22px; object-fit: contain; flex-shrink: 0; }
.skill-icon-lg { width: 28px; height: 28px; object-fit: contain; }
.skill-icon-overall { color: var(--gold); font-size: 1.1rem; width: 22px; text-align: center; flex-shrink: 0; }
.skill-cell { display: inline-flex; align-items: center; gap: 0.55rem; }
.hs-name { color: var(--bs-body-color); font-weight: 600; }
.hs-name:hover { color: var(--gold-2); }

/* hiscores rank medals (top 3) */
.hs-medal {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 50%;
    font-family: 'Cinzel', serif; font-weight: 700; font-size: 0.85rem; border: 1px solid var(--panel-edge);
}
.hs-medal-1 { background: linear-gradient(160deg, #f7e08a, #caa12f); color: #3a2c05; border-color: #caa12f; box-shadow: 0 0 8px rgba(212, 175, 55, 0.4); }
.hs-medal-2 { background: linear-gradient(160deg, #e6e6ea, #a7adb6); color: #26282c; border-color: #a7adb6; }
.hs-medal-3 { background: linear-gradient(160deg, #e3a16a, #aa6a37); color: #2e1a0c; border-color: #aa6a37; }

/* player summary stat tiles */
.hs-stat {
    height: 100%; text-align: center; padding: 0.9rem 0.5rem;
    border: 1px solid var(--panel-edge); border-radius: 0.5rem; background: rgba(0, 0, 0, 0.18);
}
.hs-stat-lead { border-color: var(--gold); box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.3) inset; }
.hs-stat-label { font-family: 'Cinzel', serif; text-transform: uppercase; font-size: 0.7rem; letter-spacing: 0.06em; color: var(--gold); }
.hs-stat-value { font-family: 'Cinzel', serif; font-size: 1.6rem; color: var(--gold-2); line-height: 1.15; }
.vs-pill {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 50%; font-family: 'Cinzel', serif; text-transform: uppercase;
    color: var(--gold-2); background: rgba(18, 14, 8, 0.6); border: 1px solid var(--gold);
}

/* player skill grid (RS-style stat tiles) */
.skill-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(82px, 1fr)); gap: 0.5rem; }
.skill-tile {
    display: flex; align-items: center; justify-content: center; gap: 0.4rem;
    padding: 0.5rem 0.4rem; border: 1px solid var(--panel-edge); border-radius: 0.4rem;
    background: linear-gradient(180deg, rgba(212, 175, 55, 0.05), rgba(0, 0, 0, 0.15)); cursor: default;
}
.skill-tile:hover { border-color: var(--panel-edge-light); }
.skill-tile-icon { width: 24px; height: 24px; object-fit: contain; flex-shrink: 0; }
.skill-tile-level { font-family: 'Cinzel', serif; font-weight: 700; color: var(--gold-2); font-size: 1.05rem; }

/* clan motif */
.motif-flag {
    width: 90px; height: 110px; border-radius: 0.3rem; border: 2px solid var(--panel-edge-light);
    display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}
.motif-initial { font-family: 'Cinzel', serif; font-size: 2.6rem; font-weight: 700; color: rgba(255, 255, 255, 0.85); text-shadow: 0 2px 6px #000; }
.clan-motto { font-style: italic; font-size: 1.2rem; color: var(--gold-2); }
.swatch { width: 22px; height: 22px; border-radius: 0.25rem; border: 1px solid var(--panel-edge-light); display: inline-block; }

/* forum post */
.forum-post-head { background: rgba(0, 0, 0, 0.25); border-bottom: 1px solid var(--bs-border-color); }
.forum-post-author { font-family: 'Cinzel', serif; color: var(--gold-2); font-weight: 700; }

/* admin */
.stat-num { font-family: 'Cinzel', serif; font-size: 1.9rem; color: var(--gold); display: block; line-height: 1.1; }
.stat-label { color: var(--bs-tertiary-color); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; }

/* admin shell: sidebar + content */
.admin-layout { display: flex; align-items: flex-start; gap: 0; }
.admin-sidebar {
    flex-shrink: 0; width: 230px; align-self: stretch;
    background: linear-gradient(180deg, #1a1c22, #0f1014);
    border-right: 1px solid var(--panel-edge);
}
.admin-content { flex: 1 1 auto; min-width: 0; }
/* admin pages use `.container` (constrained to Bootstrap widths) so content doesn't stretch full-width */
.admin-content > .container { padding-left: 1.5rem; padding-right: 1.5rem; }
/* the page heading band spans full width, but its text sits in a centered container */
.admin-page-head > .container { padding-left: 1.5rem; padding-right: 1.5rem; }

.admin-sidebar-nav { position: sticky; top: 4.5rem; display: flex; flex-direction: column; padding: 1rem 0.75rem; }
.admin-group-label {
    font-family: 'Cinzel', serif; text-transform: uppercase; font-size: 0.68rem; letter-spacing: 0.08em;
    color: var(--bs-tertiary-color); margin: 1.1rem 0.6rem 0.35rem;
}
.admin-link {
    display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;
    font-family: 'Cinzel', serif; font-size: 0.86rem; color: var(--bs-secondary-color);
    padding: 0.5rem 0.7rem; border-radius: 0.35rem; border-left: 2px solid transparent;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.admin-link:hover { background: rgba(212, 175, 55, 0.08); color: var(--gold-2); }
.admin-link.active {
    background: rgba(212, 175, 55, 0.14); color: var(--gold); border-left-color: var(--gold);
}

/* nested sub-nav (e.g. Permissions → Website / Game) */
.admin-subnav { display: flex; flex-direction: column; margin: 0.1rem 0 0.2rem 0.55rem; border-left: 1px solid var(--panel-edge); }
.admin-sublink {
    display: flex; align-items: center; gap: 0.4rem;
    font-family: 'Cinzel', serif; font-size: 0.8rem; color: var(--bs-secondary-color);
    padding: 0.34rem 0.7rem 0.34rem 0.85rem; margin-left: -1px;
    border-left: 2px solid transparent; border-radius: 0 0.3rem 0.3rem 0;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.admin-sublink:hover { background: rgba(212, 175, 55, 0.08); color: var(--gold-2); }
.admin-sublink.active { background: rgba(212, 175, 55, 0.12); color: var(--gold); border-left-color: var(--gold); }

@media (max-width: 991.98px) {
    .admin-layout { flex-direction: column; }
    .admin-sidebar { width: 100%; align-self: auto; border-right: 0; border-bottom: 1px solid var(--panel-edge); }
    .admin-sidebar-nav {
        position: static; flex-direction: row; flex-wrap: nowrap; overflow-x: auto;
        gap: 0.35rem; padding: 0.6rem 0.75rem;
    }
    .admin-group-label { display: none; }
    .admin-link { border-left: 0; border-bottom: 2px solid transparent; white-space: nowrap; padding: 0.4rem 0.7rem; }
    .admin-link.active { border-left: 0; border-bottom-color: var(--gold); }
    .admin-subnav { flex-direction: row; margin: 0; border-left: 0; gap: 0.35rem; }
    .admin-sublink { border-left: 0; border-radius: 0.35rem; border-bottom: 2px solid transparent; white-space: nowrap; padding: 0.4rem 0.7rem; }
    .admin-sublink.active { border-left: 0; border-bottom-color: var(--gold); }
    .admin-content > .container { padding-left: var(--bs-gutter-x, 1.5rem); padding-right: var(--bs-gutter-x, 1.5rem); }
}

/* misc */
.info-list dt { color: var(--bs-tertiary-color); font-family: 'Cinzel', serif; font-size: 0.8rem; font-weight: normal; }
.text-closed { color: #e07b6f; }

/* admin forum accordion */
.accordion {
    --bs-accordion-bg: #16171c;
    --bs-accordion-color: var(--bs-body-color);
    --bs-accordion-border-color: var(--panel-edge);
    --bs-accordion-btn-color: var(--gold-2);
    --bs-accordion-btn-bg: #1f2128;
    --bs-accordion-active-bg: rgba(212, 175, 55, 0.12);
    --bs-accordion-active-color: var(--gold);
    --bs-accordion-btn-focus-border-color: var(--gold);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.2);
}
.accordion-button { font-family: 'Cinzel', serif; letter-spacing: 0.02em; }
.accordion-button:not(.collapsed) { box-shadow: inset 0 -1px 0 var(--panel-edge); }
.subforum-edit { border-left: 2px solid var(--panel-edge-light); }

/* home hero carousel */
.hero-carousel { border-bottom: 2px solid var(--gold); background: #120e08; }
.hero-carousel .carousel-item {
    position: relative; min-height: 460px;
    background-size: cover; background-position: center;
    background-color: #1a140b;
    background-image: radial-gradient(circle at 50% 30%, #3a2d18, #120e08 70%);
}
.hero-slide-overlay {
    position: absolute; inset: 0; display: flex; align-items: center; text-align: center;
    /* extra bottom shade so the overlapping panel reads cleanly against the slide */
    background: linear-gradient(180deg, rgba(15, 13, 10, 0.35), rgba(15, 13, 10, 0.85));
    padding-bottom: 2.5rem;
}
/* side chevrons replace the indicator dots as the slide switcher */
.hero-chevron { width: auto; opacity: 1; z-index: 5; }
.hero-chevron span[aria-hidden] {
    display: flex; align-items: center; justify-content: center;
    width: 46px; height: 46px; margin: 0 0.9rem; border-radius: 50%;
    background: rgba(18, 14, 8, 0.55); border: 1px solid var(--gold);
    color: var(--gold-2); font-size: 1.4rem; transition: background 0.15s, color 0.15s;
}
.hero-chevron:hover span[aria-hidden] { background: var(--gold); color: #1a1404; }
.slide-thumb {
    display: inline-block; width: 84px; height: 47px; border-radius: 0.25rem;
    background-size: cover; background-position: center; border: 1px solid var(--panel-edge);
}
@media (max-width: 768px) {
    .hero-carousel .carousel-item { min-height: 340px; }
    .hero-chevron span[aria-hidden] { width: 38px; height: 38px; margin: 0 0.35rem; font-size: 1.15rem; }
}

/* home panel — overlaps the carousel above, runs flush into the footer below */
.home-panel-section {
    position: relative; z-index: 10;
    margin-top: -2.75rem;   /* lift over the carousel's lower edge */
    margin-bottom: -3.5rem; /* cancel main's pb (.5rem) + footer's mt-5 (3rem) → flush */
}
.home-panel {
    overflow: hidden;
    box-shadow: 0 -10px 34px rgba(0, 0, 0, 0.5);
}
.home-col-inner { padding: 1.5rem; }
.home-col-title {
    font-family: 'Cinzel', serif; color: var(--gold); font-size: 1.15rem; letter-spacing: 0.03em;
    margin-bottom: 1rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--panel-edge-light);
}
.home-play-col { background: rgba(0, 0, 0, 0.22); }
@media (min-width: 992px) {
    .home-col-inner { padding: 1.75rem 2rem; }
    .home-play-col { border-left: 1px solid var(--panel-edge); }
}
/* Play Now sits in its own bordered section (also the divider above the news when stacked) */
.home-play-box { padding-bottom: 1.5rem; border-bottom: 1px solid var(--panel-edge); }
.home-play-btn {
    font-size: 1.2rem; padding-top: 0.95rem; padding-bottom: 0.95rem; letter-spacing: 0.08em;
}

/* featured news block (home) */
.featured-news {
    display: block; text-decoration: none; overflow: hidden;
    border: 1px solid var(--panel-edge-light); border-radius: 0.5rem;
    background: rgba(212, 175, 55, 0.05); margin-bottom: 1.5rem; transition: border-color 0.15s;
}
.featured-news:hover { border-color: var(--gold); }
.featured-news:hover .featured-news-title { color: var(--gold); }
.featured-news-img {
    height: 190px; background-size: cover; background-position: center; background-color: #1a140b;
    background-image: radial-gradient(circle at 40% 30%, #3a2d18, #140f08 75%);
    display: flex; align-items: center; justify-content: center; color: var(--panel-edge-light); font-size: 2.2rem;
}
.featured-news-body { display: block; padding: 1rem 1.15rem 1.15rem; }
.featured-news-title {
    display: block; font-family: 'Cinzel', serif; font-size: 1.3rem; line-height: 1.2;
    color: var(--gold-2); margin: 0.45rem 0 0.4rem; transition: color 0.15s;
}
.featured-news-excerpt {
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    color: var(--bs-secondary-color); margin: 0;
}

/* news list with thumbnail on the left */
.home-news-item {
    display: flex; gap: 1rem; align-items: center; padding: 0.85rem 0;
    text-decoration: none; border-bottom: 1px solid var(--bs-border-color);
}
.home-news-item:last-child { border-bottom: 0; }
.home-news-item:hover .home-news-title { color: var(--gold-2); }
.home-news-thumb {
    flex-shrink: 0; width: 112px; height: 74px; border-radius: 0.35rem;
    background-size: cover; background-position: center; background-color: #1a140b;
    background-image: radial-gradient(circle at 35% 30%, #3a2d18, #140f08 75%);
    border: 1px solid var(--panel-edge);
    display: flex; align-items: center; justify-content: center;
    color: var(--panel-edge-light); font-size: 1.4rem;
}
.home-news-body { display: flex; flex-direction: column; min-width: 0; }
.home-news-meta { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.3rem; }
.home-news-date { font-size: 0.75rem; color: var(--bs-tertiary-color); font-style: italic; }
.home-news-title { font-family: 'Cinzel', serif; color: var(--bs-body-color); font-weight: 600; line-height: 1.25; }
.home-news-excerpt {
    color: var(--bs-secondary-color); font-size: 0.9rem; margin-top: 0.2rem;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
@media (max-width: 420px) { .home-news-thumb { display: none; } }

/* forum thread list (category page) */
.forum-thread-list td { padding-top: 0.85rem; padding-bottom: 0.85rem; }
.forum-thread-list thead th:nth-child(2),
.forum-thread-list tbody td:nth-child(2) { width: 150px; }
.forum-thread-list thead th:nth-child(3),
.forum-thread-list tbody td:nth-child(3) { width: 230px; }
.thread-title { font-family: 'Cinzel', serif; font-size: 1.02rem; }
.forum-avatar {
    flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: radial-gradient(circle at 30% 25%, #3a2d18, #1a140b);
    border: 1px solid var(--panel-edge-light); color: var(--gold-2);
    font-family: 'Cinzel', serif; font-weight: 700; font-size: 1rem;
}

/* forum post (thread view) */
.forum-post .forum-profile {
    background: rgba(0, 0, 0, 0.22);
    border-right: 1px solid var(--bs-border-color);
}
.forum-avatar-lg { width: 56px; height: 56px; font-size: 1.5rem; }
.forum-post-content { line-height: 1.6; }
.forum-post-content p:last-child { margin-bottom: 0; }
.forum-post-content blockquote { border-left: 3px solid var(--panel-edge-light); padding-left: 0.75rem; color: var(--bs-secondary-color); }
.forum-post-content ul, .forum-post-content ol { padding-left: 1.4rem; }
.forum-post-content a { text-decoration: underline; }
.post-deleted { opacity: 0.9; border-color: rgba(178, 58, 46, 0.6); }
@media (max-width: 767.98px) {
    .forum-post .forum-profile { border-right: 0; border-bottom: 1px solid var(--bs-border-color); }
}

/* quote block */
.forum-quote {
    border-left: 3px solid var(--gold); background: rgba(212, 175, 55, 0.06);
    padding: 0.6rem 0.85rem; border-radius: 0 0.3rem 0.3rem 0;
}
.forum-quote-author { font-family: 'Cinzel', serif; font-size: 0.8rem; color: var(--gold-2); margin-bottom: 0.25rem; }
.forum-quote-body { color: var(--bs-secondary-color); }
.forum-quote-body p:last-child { margin-bottom: 0; }

/* rich-text editor */
.rt-editor .rt-toolbar { margin-bottom: 0.4rem; }
.rt-editor .rt-surface {
    min-height: 160px; max-height: 480px; overflow-y: auto; height: auto; background: #101116;
}
.rt-editor .rt-surface:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.2); }
.rt-editor .rt-surface blockquote { border-left: 3px solid var(--panel-edge-light); padding-left: 0.75rem; color: var(--bs-secondary-color); }
.rt-editor .rt-surface:empty::before { content: 'Write your message…'; color: var(--bs-tertiary-color); }

/* two-column split panel (settings, etc.) */
.split-card { overflow: hidden; }
.split-col { padding: 1.5rem; }
.split-col.alt { background: rgba(0, 0, 0, 0.18); }
.split-col-title {
    font-family: 'Cinzel', serif; color: var(--gold); font-size: 1.15rem; letter-spacing: 0.03em;
    margin-bottom: 1rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--panel-edge-light);
}
@media (min-width: 992px) {
    .split-col { padding: 1.75rem 2rem; }
    .split-col.alt { border-left: 1px solid var(--panel-edge); }
}
@media (max-width: 991.98px) {
    .split-col.alt { border-top: 1px solid var(--panel-edge); }
}

/* nav-tabs theming */
.nav-tabs {
    --bs-nav-tabs-border-color: var(--panel-edge);
    --bs-nav-tabs-link-hover-border-color: transparent transparent var(--gold);
    --bs-nav-tabs-link-active-color: var(--gold);
    --bs-nav-tabs-link-active-bg: transparent;
    --bs-nav-tabs-link-active-border-color: var(--panel-edge-light) var(--panel-edge-light) transparent;
}
.nav-tabs .nav-link { color: var(--bs-secondary-color); font-family: 'Cinzel', serif; font-size: 0.9rem; }
.nav-tabs .nav-link:hover { color: var(--gold-2); }

/* nav-pills — themed gold instead of the default Bootstrap blue */
.nav-pills {
    --bs-nav-pills-link-active-bg: rgba(212, 175, 55, 0.16);
    --bs-nav-pills-link-active-color: var(--gold);
    --bs-nav-pills-border-radius: 0.4rem;
    gap: 0.3rem;
}
.nav-pills .nav-link {
    font-family: 'Cinzel', serif; font-size: 0.84rem; color: var(--bs-secondary-color);
    border: 1px solid transparent;
}
.nav-pills .nav-link:hover { color: var(--gold-2); background: rgba(212, 175, 55, 0.06); }
.nav-pills .nav-link.active { border-color: var(--panel-edge-light); }

/* profile icon + colour pickers */
.avatar-picker, .color-picker { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.avatar-picker input, .color-picker input { position: absolute; opacity: 0; pointer-events: none; }
.avatar-opt {
    width: 46px; height: 46px; border-radius: 50%; cursor: pointer;
    display: flex; align-items: center; justify-content: center; font-size: 1.3rem;
    font-family: 'Cinzel', serif; font-weight: 700;
    background: radial-gradient(circle at 30% 25%, #2a2113, #15100a);
    border: 1px solid var(--panel-edge); color: var(--gold-2);
    transition: border-color 0.15s, transform 0.1s;
}
.avatar-opt:hover { transform: translateY(-1px); border-color: var(--panel-edge-light); }
.avatar-picker input:checked + .avatar-opt { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.35); }
.color-opt {
    width: 28px; height: 28px; border-radius: 50%; cursor: pointer;
    border: 2px solid transparent; box-shadow: 0 0 0 1px var(--panel-edge); transition: transform 0.1s;
}
.color-opt:hover { transform: translateY(-1px); }
.color-picker input:checked + .color-opt { border-color: #fff; box-shadow: 0 0 0 2px var(--gold); }

/* message-log subject toggle: a link, not an uppercase Cinzel button */
.msg-subject { text-transform: none; letter-spacing: normal; font-family: var(--bs-body-font-family); font-size: 1rem; vertical-align: baseline; }

/* infraction history rows (admin account page + player status page) */
.infraction-row { padding: 0.85rem 0; border-bottom: 1px solid var(--bs-border-color); }
.infraction-row:first-of-type { padding-top: 0.35rem; }
.infraction-row:last-child { border-bottom: 0; padding-bottom: 0; }

/* news block embedded in a forum post (auto-created news discussion threads) */
.news-embed {
    display: flex; gap: 1rem; align-items: stretch; overflow: hidden;
    border: 1px solid var(--panel-edge-light); border-radius: 0.5rem;
    background: rgba(212, 175, 55, 0.05); margin-bottom: 1rem;
}
.news-embed-thumb {
    flex-shrink: 0; width: 170px; display: block; text-decoration: none;
    background-size: cover; background-position: center; background-color: #1a140b;
}
.news-embed-body { padding: 0.85rem 1rem; min-width: 0; }
.news-embed-cat {
    display: inline-block; font-family: 'Cinzel', serif; text-transform: uppercase; font-size: 0.68rem;
    letter-spacing: 0.06em; color: #1a1404; background: var(--gold); padding: 0.1rem 0.5rem;
    border-radius: 0.2rem; margin-bottom: 0.4rem;
}
.news-embed-title {
    display: block; text-decoration: none; font-family: 'Cinzel', serif; font-size: 1.15rem;
    line-height: 1.2; color: var(--gold-2); margin-bottom: 0.35rem;
}
.news-embed-title:hover { color: var(--gold); }
.news-embed-excerpt { color: var(--bs-secondary-color); margin-bottom: 0.45rem; }
.news-embed-link { font-family: 'Cinzel', serif; font-size: 0.8rem; }
@media (max-width: 575.98px) {
    .news-embed { display: block; }
    .news-embed-thumb { width: 100%; height: 150px; }
}

/* forum post signature */
.forum-signature {
    margin-top: 1rem; padding-top: 0.7rem; border-top: 1px solid var(--bs-border-color);
    font-size: 0.85rem; color: var(--bs-secondary-color);
}
.forum-signature p:last-child { margin-bottom: 0; }
.forum-signature a { color: var(--gold-2); }