:root {
    --whdg-bg: #0d0f12;
    --whdg-surface: #15181d;
    --whdg-surface-2: #1b1f25;
    --whdg-border: #2b3139;
    --whdg-border-strong: #3a424d;
    --whdg-text: #eef1f5;
    --whdg-muted: #9da7b5;
    --whdg-accent: #e7b64c;
    --whdg-danger: #e56b5f;
    --whdg-good: #64c28b;
    --whdg-link: #f1c96e;
}

body.whdg-page { background: var(--whdg-bg); color: var(--whdg-text); }
.whdg-page.footer-sliding #Footer { position: static !important; z-index: 1 !important; }
.whdg-page.footer-sliding #Wrapper { margin-bottom: 0 !important; }
.whdg-page *, .whdg-page *::before, .whdg-page *::after { box-sizing: border-box; }
.whdg-page a { color: var(--whdg-link); }
.whdg-shell { width: min(1480px, calc(100% - 32px)); margin: 0 auto; padding: 34px 0 64px; color: var(--whdg-text); font-size: 16px; line-height: 1.62; }
.whdg-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 22px; align-items: start; }
.whdg-sidebar { position: sticky; top: 88px; max-height: calc(100vh - 106px); overflow: auto; scrollbar-width: thin; }
.whdg-sidebar__mobile { border: 1px solid var(--whdg-border); background: var(--whdg-surface); }
.whdg-sidebar__mobile > summary { display: none; }
.whdg-sidebar__inside { padding: 15px; }
.whdg-sidebar__label, .whdg-kicker { margin: 0 0 5px; color: var(--whdg-accent); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.whdg-sidebar h2 { margin: 0 0 12px; color: var(--whdg-text); font-size: 17px; line-height: 1.25; }
.whdg-dungeon-nav { display: grid; gap: 3px; }
.whdg-dungeon-nav a { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 9px; align-items: center; min-height: 42px; padding: 5px 7px; border: 1px solid transparent; color: #cbd2dc; font-size: 13px; font-weight: 700; line-height: 1.22; text-decoration: none; }
.whdg-dungeon-nav a:hover, .whdg-dungeon-nav a:focus-visible { border-color: var(--whdg-border-strong); background: var(--whdg-surface-2); color: #fff; }
.whdg-dungeon-nav a[aria-current="page"] { border-color: #6d562a; background: #221d13; color: var(--whdg-accent); }
.whdg-dungeon-nav img { width: 32px; height: 32px; border: 1px solid var(--whdg-border-strong); object-fit: cover; }
.whdg-nav-name { min-width: 0; color: #fff; }
.whdg-nav-name small { display: block; margin-top: 2px; overflow: hidden; color: var(--whdg-muted); font-size: 10px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.whdg-archive-link { display: block; margin: 13px 0 15px; padding: 8px 10px; border: 1px solid var(--whdg-border-strong); color: var(--whdg-text) !important; font-size: 13px; font-weight: 800; text-align: center; text-decoration: none; }
.whdg-season-archive { padding-top: 13px; border-top: 1px solid var(--whdg-border); }
.whdg-season-archive details { border-top: 1px solid #23282f; }
.whdg-season-archive summary { padding: 8px 2px; cursor: pointer; color: #dfe4ea; font-size: 13px; font-weight: 750; }
.whdg-season-archive details div { display: grid; padding: 0 0 8px 10px; }
.whdg-season-archive details a { padding: 4px 0; color: var(--whdg-muted); font-size: 12px; text-decoration: none; }
.whdg-season-archive details a span { margin-left: 5px; color: var(--whdg-good); }

.whdg-guide { min-width: 0; }
.whdg-hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr); min-height: 275px; border: 1px solid var(--whdg-border-strong); background: var(--whdg-surface); }
.whdg-hero__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(22px, 4vw, 48px); }
.whdg-hero__eyebrow { display: flex; gap: 10px; align-items: center; margin-bottom: 15px; color: var(--whdg-accent); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.whdg-hero__eyebrow img { width: 40px; height: 40px; border: 1px solid #6d562a; object-fit: cover; }
.whdg-hero h1 { margin: 0; color: #fff; font-size: clamp(29px, 4.2vw, 52px); line-height: 1.04; letter-spacing: -.035em; }
.whdg-hero__subtitle { margin: 9px 0 0; color: var(--whdg-muted); font-size: 15px; }
.whdg-hero__intro, .whdg-hero__intro p { margin: 15px 0 0; color: #c7ced7; font-size: 15px; line-height: 1.55; }
.whdg-hero__media { min-height: 230px; margin: 0; border-left: 1px solid var(--whdg-border-strong); background: #090b0d; }
.whdg-hero__media img { display: block; width: 100%; height: 100%; min-height: 275px; object-fit: cover; opacity: .84; }
.whdg-facts { display: grid; grid-template-columns: 1.8fr repeat(4, 1fr); border: solid var(--whdg-border); border-width: 0 1px 1px; background: var(--whdg-surface-2); }
.whdg-facts div { min-width: 0; padding: 11px 14px; border-right: 1px solid var(--whdg-border); }
.whdg-facts div:last-child { border-right: 0; }
.whdg-facts span { display: block; margin-bottom: 2px; color: var(--whdg-muted); font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.whdg-facts strong { display: block; overflow: hidden; color: var(--whdg-text); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.whdg-toc { position: sticky; top: 0; z-index: 10; display: flex; gap: 4px; margin: 14px 0 0; padding: 7px; overflow-x: auto; border: 1px solid var(--whdg-border); background: #111419; }
.whdg-toc a { flex: 0 0 auto; padding: 7px 10px; border: 1px solid transparent; color: var(--whdg-muted); font-size: 12px; font-weight: 800; text-decoration: none; }
.whdg-toc a:hover, .whdg-toc a:focus-visible, .whdg-toc a[aria-current] { border-color: var(--whdg-border-strong); background: var(--whdg-surface-2); color: #fff; }
.whdg-content { margin-top: 14px; }
.whdg-section { scroll-margin-top: 68px; margin: 0 0 14px; padding: clamp(18px, 3vw, 30px); border: 1px solid var(--whdg-border); background: var(--whdg-surface); }
.whdg-section > h2 { margin: 0 0 18px; padding-left: 12px; border-left: 3px solid var(--whdg-accent); color: #fff; font-size: clamp(21px, 2.5vw, 29px); line-height: 1.18; }
.whdg-section h3 { color: #fff; }
.whdg-section p { color: #c8cfd8; }
.whdg-callout { padding: 14px 16px; border: 1px solid #594827; background: #211c13; }
.whdg-callout p { margin: 0; color: #efe3c7; }
.whdg-callout--notice { border-color: #513d3a; background: #211716; }
.whdg-waypoints { margin: 14px 0 0; padding: 12px 14px; border: 1px solid var(--whdg-border); background: #0f1216; color: #d7dee7; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; white-space: pre-line; }
.whdg-ability-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.whdg-ability-grid article { padding: 14px; border: 1px solid var(--whdg-border); background: var(--whdg-surface-2); }
.whdg-ability-grid h3 { margin: 0 0 10px; font-size: 15px; }
.whdg-ability-grid ul { margin: 0; padding: 0; list-style: none; }
.whdg-ability-grid li { padding: 8px 0; border-top: 1px solid #292f37; color: var(--whdg-muted); font-size: 13px; }
.whdg-ability-grid li:first-child { border-top: 0; padding-top: 0; }
.whdg-ability-grid strong { display: block; color: var(--whdg-text); }
.whdg-tabs { min-width: 0; }
.whdg-tabs__nav { display: flex; gap: 0; overflow-x: auto; border: 1px solid var(--whdg-border); background: #101318; }
.whdg-tabs__nav button { display: inline-flex; flex: 0 0 auto; gap: 7px; align-items: center; min-height: 42px; margin: 0 !important; padding: 9px 13px !important; border: 0 !important; border-right: 1px solid var(--whdg-border) !important; border-radius: 0 !important; box-shadow: none !important; background: #101318 !important; color: var(--whdg-muted) !important; font: inherit; font-size: 12px !important; font-weight: 800 !important; line-height: 1.2 !important; text-transform: none !important; cursor: pointer; }
.whdg-tabs__nav button:hover, .whdg-tabs__nav button:focus-visible { background: #1b2027 !important; color: #fff !important; }
.whdg-tabs__nav button[aria-selected="true"] { box-shadow: inset 0 -2px 0 var(--whdg-accent) !important; background: var(--whdg-surface-2) !important; color: #fff !important; }
.whdg-tabs__nav button span { color: var(--whdg-accent); }
.whdg-tabs__panel[hidden] { display: none !important; }
.whdg-boss-switcher__nav button { min-width: 145px; }
.whdg-boss-switcher__nav img { width: 30px; height: 30px; border: 1px solid var(--whdg-border-strong); object-fit: contain; }
.whdg-boss-switcher__panel > .whdg-boss { margin-top: 0; border-top: 0; }
.whdg-boss { margin-top: 10px; padding: 18px; border: 1px solid var(--whdg-border); background: var(--whdg-surface-2); }
.whdg-boss__head { display: flex; gap: 13px; align-items: center; }
.whdg-boss__head img { width: 64px; height: 64px; border: 1px solid var(--whdg-border-strong); background: #0c0e11; object-fit: contain; }
.whdg-boss__head h3 { margin: 0; font-size: 20px; }
.whdg-boss__summary { margin: 9px 0 0; }
.whdg-boss__focus { margin: 13px 0 !important; padding: 9px 12px; border-left: 3px solid var(--whdg-danger); background: #201716; color: #f0d5d1 !important; font-weight: 750; }
.whdg-journal-overview { margin-top: 12px; padding: 12px 14px; border: 1px solid var(--whdg-border); background: #12151a; }
.whdg-journal-overview h4, .whdg-role-grid h4 { margin: 0 0 6px; color: #fff; font-size: 13px; }
.whdg-journal-overview p, .whdg-role-grid p { margin: 0; font-size: 13px; }
.whdg-role-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 7px; }
.whdg-role-grid article { padding: 11px 12px; border: 1px solid var(--whdg-border); background: #12151a; }
.whdg-boss-tabs { margin-top: 14px; }
.whdg-boss-tabs > .whdg-tabs__panel { padding: 12px; border: solid var(--whdg-border); border-width: 0 1px 1px; background: #15191e; }
.whdg-journal-abilities { border: 1px solid var(--whdg-border); background: #101318; }
.whdg-journal-abilities ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; border-top: 1px solid var(--whdg-border); list-style: none; }
.whdg-journal-abilities li { padding: 11px 13px; border-right: 1px solid var(--whdg-border); border-bottom: 1px solid var(--whdg-border); }
.whdg-journal-abilities li:nth-child(2n) { border-right: 0; }
.whdg-journal-abilities h4 { margin: 0; font-size: 13px; }
.whdg-journal-abilities p { margin: 5px 0 0; color: #bfc7d1; font-size: 12px; line-height: 1.5; }
.whdg-wowhead-link { color: var(--whdg-link) !important; text-decoration: none !important; }
.whdg-wowhead-link:hover, .whdg-wowhead-link:focus-visible { color: #fff !important; text-decoration: underline !important; }
.whdg-mechanics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 0; padding: 0; list-style: none; }
.whdg-mechanics li { padding: 10px 12px; border: 1px solid var(--whdg-border); background: #12151a; }
.whdg-mechanics strong, .whdg-mechanics span { display: block; }
.whdg-mechanics strong { color: var(--whdg-accent); font-size: 13px; }
.whdg-mechanics span { margin-top: 3px; color: #c5ccd5; font-size: 13px; }
.whdg-tips { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; counter-reset: tip; }
.whdg-tips li { position: relative; padding: 10px 12px 10px 45px; border: 1px solid var(--whdg-border); background: var(--whdg-surface-2); color: #ccd3dc; counter-increment: tip; }
.whdg-tips li::before { position: absolute; top: 9px; left: 11px; width: 23px; height: 23px; border: 1px solid #6d562a; color: var(--whdg-accent); content: counter(tip); font-size: 11px; font-weight: 800; line-height: 21px; text-align: center; }
.whdg-quick-overview > strong { display: block; margin-bottom: 5px; color: var(--whdg-accent); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.whdg-quick-overview > p { margin: 0; }
.whdg-tip-scope { display: inline-block; min-width: 76px; margin-right: 9px; padding: 3px 6px; border: 1px solid #6d562a; color: var(--whdg-accent); font-size: 9px; font-weight: 800; letter-spacing: .04em; line-height: 1.3; text-align: center; text-transform: uppercase; vertical-align: 1px; }
.whdg-loot-tools { display: flex; gap: 8px; margin-bottom: 10px; }
.whdg-loot-tools input, .whdg-loot-tools select, .whdg-search input { min-height: 38px; border: 1px solid var(--whdg-border-strong); border-radius: 0; outline: 0; background: #0f1216; color: var(--whdg-text); }
.whdg-loot-tools input { flex: 1; min-width: 120px; padding: 7px 10px; }
.whdg-loot-tools select { width: min(230px, 40%); padding: 7px 30px 7px 10px; }
.whdg-table-wrap { overflow-x: auto; border: 1px solid var(--whdg-border); }
.whdg-loot { width: 100%; margin: 0; border: 0 !important; border-collapse: collapse; color: var(--whdg-text); font-size: 13px; }
.whdg-loot th, .whdg-loot td { padding: 9px 11px; border: 0 !important; border-bottom: 1px solid var(--whdg-border) !important; text-align: left; }
.whdg-loot th { background: #0f1216; color: var(--whdg-muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.whdg-loot tr:last-child td { border-bottom: 0 !important; }
.whdg-loot tbody tr:hover { background: #20252c; }
.whdg-loot td:first-child { color: #d9a9ff; font-weight: 700; }
.whdg-reward-grid { display: grid; gap: 9px; }
.whdg-reward-grid--feature { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.whdg-reward-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.whdg-reward-tabs > .whdg-tabs__panel { padding-top: 10px; }
.whdg-reward-grid article { overflow: hidden; border: 1px solid var(--whdg-border); background: var(--whdg-surface-2); }
.whdg-reward-image { height: 150px; margin: 0; border-bottom: 1px solid var(--whdg-border); background: #0d1014; }
.whdg-reward-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.whdg-reward-copy { padding: 14px; }
.whdg-reward-grid h3 { margin: 0; font-size: 15px; }
.whdg-reward-grid p:last-child { margin: 7px 0 0; font-size: 13px; }
.whdg-reward-grid a { text-decoration: none; }
.whdg-reward-grid--compact article { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 82px; }
.whdg-reward-grid--compact article.whdg-reward-card--with-image { grid-template-columns: 62px minmax(0, 1fr); }
.whdg-reward-grid--compact .whdg-reward-image { width: 52px; height: 52px; margin: 14px 0 14px 10px; align-self: start; border: 1px solid var(--whdg-border); }
.whdg-reward-grid--compact .whdg-reward-copy { min-width: 0; padding: 11px 12px; }
.whdg-reward-grid--compact .whdg-kicker { margin: 0 0 4px; font-size: 9px; }
.whdg-reward-grid--compact h3 { overflow-wrap: anywhere; font-size: 13px; line-height: 1.35; }
.whdg-reward-grid--compact p:last-child { margin-top: 5px; color: var(--whdg-muted); font-size: 11px; line-height: 1.4; }
.whdg-guide__footer { display: flex; justify-content: space-between; gap: 20px; padding: 12px 14px; border: 1px solid var(--whdg-border); background: #111419; color: var(--whdg-muted); font-size: 12px; }

.whdg-archive { width: min(1320px, calc(100% - 32px)); }
.whdg-archive__header { max-width: 780px; padding: 16px 0 30px; }
.whdg-archive__header h1 { margin: 0; color: #fff; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -.04em; }
.whdg-archive__header > p:not(.whdg-kicker) { color: #bac3ce; }
.whdg-search { display: block; max-width: 480px; margin-top: 20px; }
.whdg-search span { display: block; margin-bottom: 5px; color: var(--whdg-muted); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.whdg-search input { width: 100%; padding: 8px 11px; }
.whdg-season-block--current { padding: 22px; border: 1px solid #5d4b2a; background: var(--whdg-surface); }
.whdg-season-heading { display: flex; justify-content: space-between; gap: 20px; align-items: end; margin-bottom: 15px; }
.whdg-season-heading h2 { margin: 0; color: #fff; font-size: clamp(23px, 3vw, 34px); }
.whdg-season-heading > span { color: var(--whdg-muted); font-size: 12px; }
.whdg-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.whdg-card { overflow: hidden; border: 1px solid var(--whdg-border); background: var(--whdg-surface-2); }
.whdg-card[hidden] { display: none; }
.whdg-card__media { display: block; height: 130px; background: #090b0d; }
.whdg-card__media img { width: 100%; height: 100%; object-fit: cover; opacity: .82; transition: opacity .18s ease; }
.whdg-card:hover .whdg-card__media img { opacity: 1; }
.whdg-card__body { position: relative; z-index: 2; padding: 12px; background: var(--whdg-surface-2); }
.whdg-card__title { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 9px; align-items: center; }
.whdg-card__title img { width: 36px; height: 36px; border: 1px solid var(--whdg-border-strong); }
.whdg-card__title h3 { margin: 0; font-size: 15px; line-height: 1.2; }
.whdg-card__title h3 a { color: #fff !important; opacity: 1 !important; text-decoration: none; }
.whdg-card__title p { margin: 3px 0 0; overflow: hidden; color: #b8c2cf !important; opacity: 1 !important; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.whdg-card__meta { display: flex; gap: 12px; margin-top: 11px; padding-top: 8px; border-top: 1px solid var(--whdg-border); color: var(--whdg-muted); font-size: 11px; }
.whdg-past-seasons { margin-top: 38px; }
.whdg-expansion { margin-top: 22px; }
.whdg-expansion > h3 { margin: 0 0 9px; color: var(--whdg-accent); font-size: 20px; }
.whdg-season-block:not(.whdg-season-block--current) { margin-bottom: 8px; border: 1px solid var(--whdg-border); background: var(--whdg-surface); }
.whdg-season-block:not(.whdg-season-block--current) > summary { display: flex; justify-content: space-between; gap: 15px; padding: 12px 15px; cursor: pointer; color: #fff; font-weight: 800; }
.whdg-season-block:not(.whdg-season-block--current) > summary small { color: var(--whdg-muted); font-weight: 500; }
.whdg-season-block:not(.whdg-season-block--current) > .whdg-card-grid { padding: 12px; border-top: 1px solid var(--whdg-border); }
.whdg-empty { padding: 14px; border: 1px dashed var(--whdg-border-strong); color: var(--whdg-muted); }

@media (max-width: 1120px) {
    .whdg-layout { grid-template-columns: 220px minmax(0, 1fr); }
    .whdg-hero { grid-template-columns: 1fr 300px; }
    .whdg-facts { grid-template-columns: repeat(3, 1fr); }
    .whdg-facts div { border-bottom: 1px solid var(--whdg-border); }
    .whdg-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
    .whdg-shell { width: min(100% - 20px, 760px); padding-top: 18px; }
    .whdg-layout { display: block; }
    .whdg-sidebar { position: static; max-height: none; margin-bottom: 10px; overflow: visible; }
    .whdg-sidebar__mobile > summary { display: block; padding: 11px 13px; cursor: pointer; color: #fff; font-weight: 800; }
    .whdg-sidebar__mobile:not([open]) .whdg-sidebar__inside { display: none; }
    .whdg-dungeon-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .whdg-hero { grid-template-columns: 1fr; }
    .whdg-hero__media { order: -1; min-height: 210px; border: 0; border-bottom: 1px solid var(--whdg-border-strong); }
    .whdg-hero__media img { min-height: 210px; max-height: 260px; }
    .whdg-hero__copy { padding: 24px; }
    .whdg-ability-grid, .whdg-reward-grid--feature, .whdg-role-grid { grid-template-columns: 1fr; }
    .whdg-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .whdg-boss-switcher__nav button { min-width: 132px; }
}

@media (max-width: 560px) {
    .whdg-shell, .whdg-archive { width: calc(100% - 12px); }
    .whdg-dungeon-nav { grid-template-columns: 1fr; }
    .whdg-hero h1 { font-size: 31px; }
    .whdg-facts { grid-template-columns: repeat(2, 1fr); }
    .whdg-facts div { border-right: 1px solid var(--whdg-border); }
    .whdg-facts div:nth-child(2n) { border-right: 0; }
    .whdg-section { padding: 16px; }
    .whdg-mechanics { grid-template-columns: 1fr; }
    .whdg-journal-abilities ul { grid-template-columns: 1fr; }
    .whdg-journal-abilities li { border-right: 0; }
    .whdg-loot-tools { display: grid; }
    .whdg-loot-tools select { width: 100%; }
    .whdg-card-grid { grid-template-columns: 1fr; }
    .whdg-reward-grid--compact { grid-template-columns: 1fr; }
    .whdg-tabs__nav button { padding: 8px 10px !important; }
    .whdg-card__media { height: 155px; }
    .whdg-guide__footer { display: grid; }
}

@media (prefers-reduced-motion: reduce) {
    .whdg-page *, .whdg-page *::before, .whdg-page *::after { scroll-behavior: auto !important; transition: none !important; }
}
