/* Ivory Tower and Pirate Island hardmode guides and rankings
 * (templates/{ivory,pirate}-hardmode-{guide,leaderboard}.php).
 * Guides follow the L4 Justice Gauntlet guide; rankings follow the hardmode leaderboards. */

.dhm {
    --dhm-gold: #d5b681;
    --dhm-gold-deep: #a88b5d;
    --dhm-title: #f1e6d0;
    --dhm-ink: #c4c0b8;
    --dhm-muted: #8f897d;
    --dhm-line: rgba(185, 160, 116, 0.19);
    --dhm-line-soft: rgba(185, 160, 116, 0.12);
    --dhm-accent: 143, 85, 45;
    --dhm-danger: #dfaea3;
    width: min(1140px, calc(100% - 48px));
    margin-inline: auto;
    color: var(--dhm-ink);
}
.dhm--ivory { --dhm-accent: 110, 92, 160; }
.dhm--pirate { --dhm-accent: 38, 104, 120; }
body.reborn-site-theme:not(.reborn-home-theme) #site-page-content > .dhm { margin-top: 1.25rem !important; }
.dhm :is(h1, h2, h3) { margin: 0; font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.dhm :is(h1, h2, h3) em { color: var(--dhm-gold); font-style: italic; }
.dhm p { margin: 0; }
.dhm code {
    padding: 0.1rem 0.4rem;
    border: 1px solid var(--dhm-line-soft);
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.32);
    color: #eedcb1;
    font-size: 0.86em;
    white-space: nowrap;
}
.dhm-kicker {
    color: #c5a776;
    font: 600 0.75rem/1.4 Arial, Helvetica, sans-serif;
    letter-spacing: 0.24em;
    text-transform: uppercase;
}
.dhm-beta {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.12rem 0.45rem;
    border: 1px solid rgba(213, 182, 129, 0.4);
    border-radius: 3px;
    color: var(--dhm-gold);
    font-size: 0.62rem;
    letter-spacing: 0.18em;
    vertical-align: 0.1em;
}

/* Hero */
.dhm-hero {
    padding: 3.25rem 1.5rem 2.75rem;
    text-align: center;
    background:
        radial-gradient(ellipse at 50% 16%, rgba(var(--dhm-accent), 0.24), transparent 60%),
        radial-gradient(ellipse at 50% 100%, rgba(92, 40, 31, 0.12), transparent 64%);
    border-bottom: 1px solid var(--dhm-line);
}
.dhm-hero h1 {
    margin-top: 0.6rem;
    color: var(--dhm-title);
    font-size: clamp(42px, 6vw, 74px);
    line-height: 1.04;
    letter-spacing: -0.035em;
}
.dhm-hero .dhm-lede {
    max-width: 660px;
    margin: 1.1rem auto 0;
    color: #cfc8ba;
    font-size: 1.02rem;
    line-height: 1.65;
}
.dhm-status {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 1.2rem;
    padding: 0.45rem 0.9rem;
    border: 1px solid rgba(213, 182, 129, 0.3);
    border-radius: 3px;
    background: rgba(213, 182, 129, 0.07);
    color: #e9d6ac;
    font-size: 0.86rem;
}
.dhm-status::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #d5b681;
    box-shadow: 0 0 10px rgba(213, 182, 129, 0.7);
}
.dhm-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; margin-top: 1.75rem; }
.dhm-actions a {
    padding: 0.75rem 1.4rem;
    border: 1px solid rgba(185, 160, 116, 0.25);
    border-radius: 3px;
    color: #d6c4a3;
    font: 600 0.88rem/1.2 Arial, Helvetica, sans-serif;
    text-decoration: none;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.06), 0 5px 24px rgba(0, 0, 0, 0.2);
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.dhm-actions a:first-child { border-color: rgba(220, 193, 139, 0.58); background: linear-gradient(120deg, #574330, #262735); color: #f2e4c5; }
.dhm-actions a:hover { border-color: rgba(220, 193, 139, 0.8); color: #fff3d6; }

/* Quick facts */
.dhm-facts {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 1.75rem 0.5rem 1.55rem;
    border-bottom: 1px solid var(--dhm-line);
}
.dhm-facts::before {
    content: "✦";
    position: absolute;
    top: -9px;
    left: 50%;
    transform: translateX(-50%);
    padding: 0 11px;
    background: #141311;
    color: #c8a970;
    font-size: 14px;
    line-height: 18px;
    text-shadow: 0 0 14px rgba(213, 182, 129, 0.28);
}
.dhm-fact { min-height: 70px; padding: 0.45rem 1.25rem 0.75rem; border-left: 1px solid rgba(185, 160, 116, 0.16); }
.dhm-fact:nth-child(4n + 1) { border-left: 0; }
.dhm-fact:nth-child(n + 5) { padding-top: 1.1rem; border-top: 1px solid var(--dhm-line-soft); }
.dhm-fact dt { color: var(--dhm-gold-deep); font: 600 0.63rem/1.3 Arial, Helvetica, sans-serif; letter-spacing: 0.19em; text-transform: uppercase; }
.dhm-fact dd { margin: 0.35rem 0 0; color: #eadbc2; font: 400 1.06rem/1.3 Georgia, "Times New Roman", serif; }

/* Two panels: how it works, what hard mode changes */
.dhm-overview {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 3.5rem;
    padding: 4rem 2rem;
    border-bottom: 1px solid var(--dhm-line);
}
.dhm-panel { position: relative; min-width: 0; isolation: isolate; }
.dhm-panel::after { position: absolute; z-index: -1; top: -26px; right: 19px; font: italic 132px/0.8 Georgia, serif; pointer-events: none; }
.dhm-panel--steps::after { content: "I"; color: rgba(213, 182, 129, 0.075); }
.dhm-panel--threats::after { content: "II"; color: rgba(196, 80, 67, 0.075); }
.dhm .dhm-label { margin: 0; max-width: none; color: rgba(213, 182, 129, 0.8); font: 600 0.72rem/1.3 Arial, Helvetica, sans-serif; letter-spacing: 0.22em; text-transform: uppercase; }
.dhm .dhm-panel--threats .dhm-label { color: #b87468; }
.dhm-panel h2 { max-width: 470px; margin-top: 0.55rem; color: var(--dhm-title); font-size: clamp(29px, 2.7vw, 38px); line-height: 1.06; letter-spacing: -0.025em; }
.dhm-steps { margin: 1.5rem 0 0; padding: 0; list-style: none; counter-reset: dhm-step; }
.dhm-steps li { display: flex; gap: 0.85rem; padding: 0.85rem 0; border-top: 1px solid rgba(185, 160, 116, 0.13); counter-increment: dhm-step; font-size: 0.92rem; line-height: 1.6; }
.dhm-steps li:first-child { border-top: 0; }
.dhm-steps li::before { content: counter(dhm-step); flex: 0 0 1.75rem; color: #9e8353; font: italic 20px/1.3 Georgia, serif; }
.dhm-threats { margin-top: 1.5rem; }
.dhm-threat { padding: 0.85rem 0; border-top: 1px solid rgba(185, 85, 73, 0.18); }
.dhm-threat:first-child { border-top: 0; }
.dhm-threat .dhm-threat__title { color: var(--dhm-danger); font: 600 0.92rem/1.4 Arial, Helvetica, sans-serif; }
.dhm-threat p:not(.dhm-threat__title) { margin-top: 0.25rem; font-size: 0.9rem; line-height: 1.6; }

/* Floors */
.dhm-order { padding: 2.25rem 0 0.75rem; border-bottom: 1px solid var(--dhm-line); }
.dhm-order-header { padding: 0 1.15rem 1.4rem; border-bottom: 1px solid rgba(185, 160, 116, 0.16); }
.dhm-order-header h2 { margin-top: 0.5rem; color: var(--dhm-title); font-size: clamp(30px, 3vw, 39px); letter-spacing: -0.025em; }
.dhm-order-header p { max-width: 740px; margin-top: 0.75rem; color: #b8b0a2; font-size: 0.92rem; line-height: 1.65; }
.dhm-floors { display: grid; gap: 0.8rem; padding: 1.25rem 1.15rem 1.15rem; }
.dhm-floor {
    display: grid;
    grid-template-columns: 6.5rem minmax(0, 1fr);
    min-height: 140px;
    overflow: hidden;
    border-radius: 5px;
    background: linear-gradient(135deg, rgba(38, 35, 33, 0.88), rgba(18, 18, 19, 0.96));
    box-shadow: inset 0 1px rgba(213, 182, 129, 0.08), 0 16px 36px rgba(0, 0, 0, 0.18);
    transition: transform 0.2s, background 0.2s, box-shadow 0.2s;
}
.dhm-floor:hover { background: linear-gradient(135deg, rgba(57, 45, 35, 0.92), rgba(20, 19, 19, 0.96)); box-shadow: inset 0 1px rgba(213, 182, 129, 0.25), 0 20px 38px rgba(0, 0, 0, 0.24); transform: translateY(-2px); }
.dhm-floor__portrait {
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(ellipse at 50% 50%, rgba(var(--dhm-accent), 0.3), transparent 70%);
}
.dhm-floor__portrait img { max-width: 4.6rem; max-height: 5.4rem; object-fit: contain; image-rendering: auto; filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.45)); transition: transform 0.2s; }
.dhm-floor:hover .dhm-floor__portrait img { transform: scale(1.07); }
.dhm-floor__portrait img.is-scaled { image-rendering: pixelated; }
.dhm-floor__portrait--glyph { color: rgba(213, 182, 129, 0.55); font: italic 2.6rem/1 Georgia, serif; }
.dhm-floor__copy { min-width: 0; padding: 1.15rem 1.3rem 1.2rem 0.4rem; }
.dhm-floor__top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.8rem; }
.dhm-floor__step { color: #9e8353; font: italic 24px/1 Georgia, serif; }
.dhm-floor__goal { margin-left: auto; color: var(--dhm-muted); font: 600 0.63rem/1.3 Arial, Helvetica, sans-serif; letter-spacing: 0.16em; text-transform: uppercase; }
.dhm-floor h3 { margin-top: 0.4rem; color: var(--dhm-title); font-size: 1.4rem; line-height: 1.15; }
.dhm-floor__text { margin-top: 0.45rem !important; color: #aaa69c; font-size: 0.9rem; line-height: 1.6; }
.dhm-floor__boss { margin-top: 0.65rem !important; color: #d9cbb0; font-size: 0.86rem; }
.dhm-floor__boss span { color: var(--dhm-muted); font: 600 0.63rem/1 Arial, Helvetica, sans-serif; letter-spacing: 0.16em; text-transform: uppercase; margin-right: 0.45rem; }
.dhm-floor--finale { box-shadow: inset 0 1px rgba(213, 182, 129, 0.3), inset 3px 0 0 rgba(213, 182, 129, 0.55), 0 16px 36px rgba(0, 0, 0, 0.2); }

/* Choices (Pirate curses) */
.dhm-choices { padding: 2.75rem 1.15rem 2.5rem; border-bottom: 1px solid var(--dhm-line); }
.dhm-choices > h2 { margin-top: 0.5rem; color: var(--dhm-title); font-size: clamp(30px, 3vw, 39px); letter-spacing: -0.025em; }
.dhm-choices > p { max-width: 760px; margin-top: 0.75rem; color: #b8b0a2; font-size: 0.92rem; line-height: 1.65; }
.dhm-curses { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; margin-top: 1.4rem; }
.dhm-curse {
    padding: 1.15rem 1.2rem 1.25rem;
    border: 1px solid rgba(196, 80, 67, 0.22);
    border-radius: 5px;
    background: linear-gradient(145deg, rgba(42, 17, 17, 0.6), rgba(10, 8, 7, 0.92));
}
.dhm-curse h3 { color: #f0d6cd; font-size: 1.3rem; }
.dhm-curse p { margin-top: 0.45rem; color: #b9aea6; font-size: 0.9rem; line-height: 1.6; }
.dhm-curse code { display: inline-block; margin-top: 0.75rem; }
.dhm-note { margin-top: 1.1rem !important; padding: 0.8rem 1rem; border-left: 2px solid rgba(213, 182, 129, 0.5); background: rgba(213, 182, 129, 0.05); color: #cfc6b4; font-size: 0.9rem; line-height: 1.65; }
.dhm-note strong { color: #f0d9a0; font-weight: 600; }

/* Exchange table */
.dhm-exchange { width: 100%; margin-top: 0.9rem; border-collapse: collapse; font-size: 0.86rem; }
.dhm-exchange td { padding: 0.4rem 0; border-top: 1px solid var(--dhm-line-soft); }
.dhm-exchange td:last-child { text-align: right; color: #f0d9a0; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Rewards: how you earn them beside what they buy */
.dhm-split { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 2.5rem; margin-top: 1.4rem; }
.dhm-split .dhm-split__title { color: #e9d6ac; font: 600 0.72rem/1.3 Arial, Helvetica, sans-serif; letter-spacing: 0.2em; text-transform: uppercase; }
.dhm-rewards { margin: 0.6rem 0 0; padding: 0; list-style: none; }
.dhm-rewards li { padding: 0.65rem 0; border-top: 1px solid var(--dhm-line-soft); font-size: 0.9rem; line-height: 1.6; }
.dhm-rewards li:first-child { border-top: 0; }
.dhm-rewards strong { color: #f0d9a0; font-weight: 600; }
.dhm-fineprint { margin-top: 0.9rem !important; color: var(--dhm-muted); font-size: 0.84rem; line-height: 1.6; }

/* Closing panels */
.dhm-foot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 2.4rem; border-top: 1px solid var(--dhm-line); border-bottom: 1px solid var(--dhm-line); }
.dhm-foot > div { position: relative; overflow: hidden; padding: 1.9rem 1.75rem 2rem; border-left: 1px solid rgba(185, 160, 116, 0.16); }
.dhm-foot > div:first-child { border-left: 0; background: radial-gradient(ellipse at 10% 0%, rgba(116, 76, 34, 0.17), transparent 62%); }
.dhm-foot > div::after { position: absolute; top: 17px; right: 22px; color: rgba(213, 182, 129, 0.08); font: italic 76px/0.8 Georgia, serif; pointer-events: none; }
.dhm-foot > div:nth-child(1)::after { content: "I"; }
.dhm-foot > div:nth-child(2)::after { content: "II"; }
.dhm-foot > div:nth-child(3)::after { content: "III"; }
.dhm-foot--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dhm-foot h3 { position: relative; margin-top: 0.7rem; color: var(--dhm-title); font-size: 27px; line-height: 1.05; letter-spacing: -0.025em; }
.dhm-foot p { position: relative; margin-top: 0.75rem !important; font-size: 0.9rem; line-height: 1.65; }
.dhm .dhm-foot .dhm-label { color: #a98a57; }
.dhm-commands { margin: 0.85rem 0 0; padding: 0; list-style: none; display: grid; gap: 0.45rem; }
.dhm-commands li { display: grid; gap: 0.15rem; font-size: 0.86rem; line-height: 1.5; }
.dhm-commands li strong { color: #eedcb1; font-weight: 600; }
.dhm-commands li span { color: var(--dhm-muted); }
.dhm-crosslink { margin: 2rem 0 0.5rem !important; text-align: center; color: var(--dhm-muted); font-size: 0.9rem; }
.dhm-crosslink a { color: var(--dhm-gold); }

@media (max-width: 860px) {
    .dhm { width: calc(100% - 28px); }
    body.reborn-site-theme:not(.reborn-home-theme) #site-page-content > .dhm { margin-top: 0.8rem !important; }
    .dhm-hero { padding: 2.25rem 0.75rem 2rem; }
    .dhm-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-inline: 0; }
    .dhm-fact { padding: 0.65rem 0.85rem 0.8rem; }
    .dhm-fact:nth-child(4n + 1) { border-left: 1px solid rgba(185, 160, 116, 0.16); }
    .dhm-fact:nth-child(2n + 1) { border-left: 0; }
    .dhm-fact:nth-child(n + 3) { padding-top: 1rem; border-top: 1px solid var(--dhm-line-soft); }
    .dhm-fact dd { font-size: 0.95rem; }
    .dhm-overview { grid-template-columns: minmax(0, 1fr); gap: 2.4rem; padding: 2.6rem 0.75rem; }
    .dhm-panel--threats { padding-top: 2.1rem; border-top: 1px solid rgba(185, 160, 116, 0.16); }
    .dhm-order-header, .dhm-floors { padding-inline: 0.75rem; }
    .dhm-floor { grid-template-columns: 4.9rem minmax(0, 1fr); min-height: 120px; }
    .dhm-floor__portrait img { max-width: 3.8rem; max-height: 4.5rem; }
    .dhm-floor__copy { padding: 1rem 0.95rem 1rem 0.2rem; }
    .dhm-floor__goal { margin-left: 0; width: 100%; }
    .dhm-choices { padding-inline: 0.75rem; }
    .dhm-curses { grid-template-columns: minmax(0, 1fr); }
    .dhm-split { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
    .dhm-foot, .dhm-foot--two { grid-template-columns: minmax(0, 1fr); }
    .dhm-foot > div { padding: 1.5rem 1.25rem; border-left: 0; border-top: 1px solid rgba(185, 160, 116, 0.16); }
    .dhm-foot > div:first-child { border-top: 0; }
}

/* ---- Rankings ---------------------------------------------------------- */
.dhm-board { --dhm-gold: #d5b681; --dhm-muted: #8d9284; }
.dhm-board-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.5rem 1.4rem; }
.dhm-board-group { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; }
.dhm-board-group > span { margin-right: 0.15rem; color: #a7a596; font-size: 0.85rem; }
.dhm-chip {
    display: inline-flex;
    align-items: center;
    min-width: 2.1rem;
    justify-content: center;
    padding: 0.38rem 0.8rem;
    border: 1px solid rgba(181, 155, 97, 0.24);
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.25);
    color: #d8cfb9;
    font: 500 0.8rem/1.2 Arial, Helvetica, sans-serif;
    text-decoration: none;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.dhm-chip:hover { border-color: rgba(207, 183, 128, 0.55); color: #f3e2b5; }
.dhm-chip.is-active { border-color: rgba(222, 186, 108, 0.85); background: rgba(207, 160, 72, 0.16); color: #fbe7b7; box-shadow: 0 0 14px rgba(222, 170, 70, 0.14); }
.dhm-chip--classic.is-active { border-color: rgba(103, 178, 218, 0.85); background: rgba(56, 128, 170, 0.18); color: #cfeaf8; box-shadow: 0 0 14px rgba(70, 150, 200, 0.14); }
.dhm-board-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem 0.75rem; margin-top: 1.5rem; }
.dhm-board-head .dhm-board-title { color: #e5c88f; font: 400 0.95rem/1.3 Arial, Helvetica, sans-serif; letter-spacing: 0.08em; text-transform: uppercase; }
.dhm-board-head .dhm-board-tag { color: var(--dhm-muted); font: 600 0.68rem/1 Arial, Helvetica, sans-serif; letter-spacing: 0.18em; text-transform: uppercase; }
.dhm-board-head .dhm-board-state { margin-left: auto; color: var(--dhm-muted); font-size: 0.78rem; }
.dhm-board-head .dhm-board-state.is-open { color: #9fd3a8; }
.dhm-board-intro { margin-top: 0.4rem !important; color: #b8b6a8 !important; font-size: 0.9rem !important; }
.dhm-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; margin-top: 1.1rem; }
.dhm-tile { min-height: 4.6rem; padding: 0.55rem 0.75rem 0.6rem; border: 1px solid rgba(181, 155, 97, 0.2); border-radius: 4px; background: rgba(255, 244, 214, 0.03); }
.dhm-tile dt { color: var(--dhm-muted); font: 600 0.6rem/1.2 Arial, Helvetica, sans-serif; letter-spacing: 0.14em; text-transform: uppercase; }
.dhm-tile dd { margin: 0.55rem 0 0; color: #f3e4c3; font-size: 1.3rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.dhm-table-wrap { margin-top: 1rem; overflow-x: auto; border: 1px solid rgba(181, 155, 97, 0.2); border-radius: 4px; background: rgba(0, 0, 0, 0.2); }
.dhm-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; font-variant-numeric: tabular-nums; }
.dhm-table th { padding: 0.8rem 0.75rem !important; border-bottom: 1px solid rgba(181, 155, 97, 0.24); background: rgba(22, 21, 16, 0.9); text-align: left; text-transform: uppercase; white-space: nowrap; }
.dhm-table td { padding: 0.8rem 0.75rem; border-top: 1px solid rgba(181, 155, 97, 0.09); color: #d6d0bf; white-space: nowrap; }
.dhm-table tbody tr:nth-child(even) td { background: rgba(255, 244, 214, 0.02); }
.dhm-table tbody tr:hover td { background: rgba(207, 183, 128, 0.06); }
.dhm-table :is(th, td).is-num { text-align: right; }
.dhm-rank { color: #a7a596; }
.dhm-table tbody tr:nth-child(1) .dhm-rank { color: #f0cf76; font-weight: 700; }
.dhm-table tbody tr:nth-child(2) .dhm-rank { color: #d9dde3; font-weight: 700; }
.dhm-table tbody tr:nth-child(3) .dhm-rank { color: #d99a63; font-weight: 700; }
.dhm-name { color: #f3e4c3; font-weight: 600; }
.dhm-class { display: inline-block; margin-left: 0.5rem; padding: 0.15rem 0.45rem; border: 1px solid rgba(181, 155, 97, 0.26); border-radius: 3px; color: #bdb59f; font-size: 0.7rem; font-weight: 400; vertical-align: 0.08em; }
.dhm-floorcell { display: inline-flex; align-items: center; gap: 0.5rem; color: #f0d9a0; font-weight: 600; }
.dhm-pips { display: inline-flex; gap: 3px; }
.dhm-pips i { width: 7px; height: 7px; border-radius: 1px; background: rgba(181, 155, 97, 0.18); }
.dhm-pips i.is-on { background: linear-gradient(135deg, #f0d9a0, #b48d4c); }
.dhm-empty { margin-top: 1rem; padding: 2.5rem 1.5rem; border: 1px dashed rgba(181, 155, 97, 0.28); border-radius: 4px; text-align: center; background: radial-gradient(ellipse at 50% 0%, rgba(207, 183, 128, 0.07), transparent 70%); }
.dhm-empty strong { display: block; color: #ecdcb6; font: 400 1.35rem/1.3 Georgia, "Times New Roman", serif; }
.dhm-empty span { display: block; margin-top: 0.5rem; color: #a7a596; font-size: 0.9rem; }
.dhm-empty a { display: inline-block; margin-top: 1rem; color: var(--dhm-gold); font-size: 0.88rem; }
@media (max-width: 760px) {
    .dhm-board-bar { justify-content: flex-start; }
    .dhm-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dhm-board-head .dhm-board-state { margin-left: 0; width: 100%; }
}

/* ---- TOI Hardmode guide and Hardmode Blessings (templates/toi-hardmode-guide.php,
 * templates/hardmode-blessings.php). New classes only; the Ivory and Pirate rules above are unchanged. */
.dhm--toi { --dhm-accent: 150, 98, 38; }
.dhm--blessings { --dhm-accent: 64, 118, 98; }
.dhm--toi .dhm-hero .dhm-lede { max-width: 720px; }
.dhm-warn { color: #f2d2c2; font-weight: 600; }
.dhm-warn--strong { color: #fdc38d; font-weight: 700; }
.dhm-link { display: inline-block; margin-top: 0.9rem; color: var(--dhm-gold); font: 600 0.86rem/1.3 Arial, Helvetica, sans-serif; text-decoration: none; border-bottom: 1px solid rgba(213, 182, 129, 0.35); }
.dhm-link:hover { color: #fff3d6; border-bottom-color: rgba(213, 182, 129, 0.8); }
.dhm .dhm-floor__title { margin-top: 0.4rem; color: var(--dhm-title); font: 400 1.4rem/1.15 Georgia, "Times New Roman", serif; }
.dhm .dhm-floor__portrait--glyph.dhm-glyph--text { font-size: 1.6rem; letter-spacing: -0.02em; }
.dhm .dhm-foot__title { position: relative; margin-top: 0.7rem; color: var(--dhm-title); font: 400 27px/1.05 Georgia, "Times New Roman", serif; letter-spacing: -0.025em; }
.dhm :is(.dhm-foot__title, .dhm-glance__title, .dhm-rulecard__title, .dhm-callout__title) em { color: var(--dhm-gold); font-style: italic; }

/* Run-ending callout */
.dhm-callout {
    display: grid;
    grid-template-columns: 14rem minmax(0, 1fr);
    gap: 1.5rem;
    margin: 2.25rem 1.15rem 0;
    padding: 1.35rem 1.5rem;
    border: 1px solid rgba(196, 80, 67, 0.26);
    border-left: 3px solid rgba(223, 174, 163, 0.6);
    border-radius: 5px;
    background: linear-gradient(110deg, rgba(70, 24, 22, 0.32), rgba(14, 12, 11, 0.6) 70%);
}
.dhm .dhm-callout .dhm-label { color: #d79a8c; }
.dhm .dhm-callout__title { margin-top: 0.45rem; color: var(--dhm-title); font: 400 1.4rem/1.15 Georgia, "Times New Roman", serif; }
.dhm-callout__body p { color: #cfc6b4; font-size: 0.92rem; line-height: 1.7; }
.dhm-callout__body p + p { margin-top: 0.55rem; }

/* At a glance: three image cards */
.dhm-glance { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; padding: 2.25rem 1.15rem 2.5rem; border-bottom: 1px solid var(--dhm-line); }
.dhm-glance__card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 1.2rem 1.25rem 1.25rem;
    border-radius: 5px;
    background: linear-gradient(145deg, rgba(38, 35, 33, 0.88), rgba(18, 18, 19, 0.96));
    box-shadow: inset 0 1px rgba(213, 182, 129, 0.08), 0 16px 36px rgba(0, 0, 0, 0.18);
}
.dhm .dhm-glance__title { margin-top: 0.5rem; color: var(--dhm-title); font: 400 1.3rem/1.2 Georgia, "Times New Roman", serif; }
.dhm-glance__text { margin-top: 0.55rem !important; color: #aaa69c; font-size: 0.9rem; line-height: 1.65; }
.dhm-glance__media { margin-top: auto; padding-top: 1.1rem; }
.dhm-glance__media img { display: block; max-width: 100%; height: auto; margin: 0 auto; border: 1px solid var(--dhm-line-soft); border-radius: 4px; }

/* NPC panel */
.dhm-npc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: 2.5rem; align-items: start; margin-top: 1.4rem; }
.dhm-npc.is-noimg { grid-template-columns: minmax(0, 1fr); }
.dhm-npc__media { margin: 0; overflow: hidden; border: 1px solid var(--dhm-line); border-radius: 5px; background: rgba(0, 0, 0, 0.35); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.2); }
.dhm-npc__media img { display: block; width: 100%; height: auto; }
.dhm-npc .dhm-commands { margin-top: 0; }
.dhm-npc .dhm-note p + p { margin-top: 0.35rem; }

/* Drop tables with a tier preview */
.dhm-drops { margin-top: 1.4rem; scroll-margin-top: 6rem; }
.dhm-drops > summary {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--dhm-line);
    border-radius: 5px;
    background: rgba(213, 182, 129, 0.04);
    color: #e9d6ac;
    font: 600 0.72rem/1.3 Arial, Helvetica, sans-serif;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    cursor: pointer;
    list-style: none;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.dhm-drops > summary::-webkit-details-marker { display: none; }
.dhm-drops > summary::before { content: "▾"; color: var(--dhm-gold); font-size: 0.8rem; transition: transform 0.15s ease; }
.dhm-drops:not([open]) > summary::before { transform: rotate(-90deg); }
.dhm-drops > summary:hover { border-color: rgba(213, 182, 129, 0.4); background: rgba(213, 182, 129, 0.08); }
.dhm-drops__intro { margin-top: 0.8rem !important; color: var(--dhm-muted); font-size: 0.84rem; line-height: 1.6; }
.dhm-tierpick { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1.5rem; margin-top: 0.9rem; }
.dhm-tierpick__text { max-width: 560px; color: #b8b0a2; font-size: 0.88rem; line-height: 1.6; }
.dhm-tierpick__text strong, .dhm-drops__intro strong { color: #f0d9a0; font-weight: 600; }
.dhm-tierpick__buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; margin-left: auto; }
.dhm-tierpick__buttons > span { margin-right: 0.25rem; color: var(--dhm-muted); font: 600 0.63rem/1.3 Arial, Helvetica, sans-serif; letter-spacing: 0.16em; text-transform: uppercase; }
.dhm-tierpick__btn {
    min-width: 2.4rem;
    padding: 0.42rem 0.55rem;
    border: 1px solid rgba(181, 155, 97, 0.24);
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.25);
    color: #d8cfb9;
    font: 600 0.76rem/1.2 Arial, Helvetica, sans-serif;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.dhm-tierpick__btn:hover { border-color: rgba(207, 183, 128, 0.55); color: #f3e2b5; }
.dhm-tierpick__btn.is-active { border-color: rgba(222, 186, 108, 0.85); background: rgba(207, 160, 72, 0.16); color: #fbe7b7; box-shadow: 0 0 14px rgba(222, 170, 70, 0.14); }
.dhm .dhm-legend { display: flex; flex-wrap: wrap; gap: 0.35rem 1.2rem; margin-top: 0.9rem !important; color: var(--dhm-muted); font-size: 0.8rem; }
.dhm-legend span::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 0.45rem; border-radius: 2px; vertical-align: 0.05em; }
.dhm-legend .is-cost::before { background: #e7b3a8; }
.dhm-legend .is-gain::before { background: #9fd3a8; }
.dhm-legend .is-found::before { background: transparent; border: 1px solid rgba(159, 211, 168, 0.6); }

.dhm-tablewrap {
    margin-top: 1rem;
    overflow-x: auto;
    border: 1px solid rgba(181, 155, 97, 0.2);
    border-radius: 5px;
    background: #100f0d;
    scrollbar-width: thin;
    scrollbar-color: rgba(168, 139, 93, 0.7) rgba(12, 10, 8, 0.6);
}
.dhm-tablewrap > table { display: table !important; width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.dhm-grid th { padding: 0.75rem 0.55rem !important; border-bottom: 1px solid rgba(181, 155, 97, 0.24); background: #161510; text-align: left; text-transform: uppercase; white-space: nowrap; }
.dhm-grid td { padding: 0.6rem 0.55rem; border-top: 1px solid rgba(181, 155, 97, 0.09); color: #cfc8ba; white-space: nowrap; }
.dhm-grid tbody tr:nth-child(even) td { background: #141310; }
.dhm-grid tbody tr:hover td { background: #1d1b16; }
.dhm-grid :is(th, td):first-child { position: sticky; left: 0; z-index: 1; box-shadow: inset -1px 0 rgba(181, 155, 97, 0.16); }
.dhm-grid td:first-child { background: #100f0d; }
.dhm-drops-table { min-width: 900px; table-layout: fixed; font-size: 0.8rem; }
.dhm-drops-table td:first-child { white-space: normal; }
.dhm-drop { display: flex; align-items: center; gap: 0.6rem; min-width: 0; }
.dhm-drop img { flex: 0 0 auto; width: 26px; height: 26px; object-fit: contain; border: 1px solid var(--dhm-line-soft); border-radius: 3px; background: rgba(0, 0, 0, 0.4); }
.dhm-drop__name { color: #f0e2c4; font-size: 0.82rem; font-weight: 600; line-height: 1.35; }
.dhm-drop__name a { color: inherit; text-decoration: none; }
.dhm-drop__name a:hover { color: #fff3d6; text-decoration: underline; }
.dhm-drop__meta { color: var(--dhm-muted); font-size: 0.72rem; line-height: 1.35; }
.dhm-count { display: inline-block; margin-left: 0.3rem; padding: 0 0.35rem; border: 1px solid rgba(181, 155, 97, 0.18); border-radius: 3px; color: #77736d; font-size: 0.68rem; font-weight: 400; line-height: 1.45; vertical-align: 0.06em; }
.dhm-count.is-found { border-color: rgba(159, 211, 168, 0.32); color: #9fd3a8; }
.dhm-rarity--2 { color: #d9f99d !important; }
.dhm-rarity--3 { color: #bae6fd !important; }
.dhm-rarity--4 { color: #f5d0fe !important; }
.dhm-rarity--5 { color: #fed7aa !important; }
.dhm-grid tbody tr.is-legendary td { background: #1f150d; color: #fff1e0; }
.dhm-grid tbody tr.is-legendary td:first-child { box-shadow: inset 3px 0 0 rgba(251, 146, 60, 0.65), inset -1px 0 rgba(181, 155, 97, 0.16); }
.dhm .dhm-preview-note { margin-top: 1rem !important; color: var(--dhm-muted); font-size: 0.8rem; line-height: 1.6; }

/* Tier effects */
.dhm-tiers { min-width: 760px; font-size: 0.86rem; }
.dhm-tiers th { white-space: normal; vertical-align: bottom; }
.dhm-tiers td:first-child { color: #f0d9a0; font: italic 1.05rem/1 Georgia, "Times New Roman", serif; text-align: center; }
.dhm-tiers td.is-cost { color: #e7b3a8; }
.dhm-tiers td.is-gain { color: #9fd3a8; }

/* Rules */
.dhm-rules { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; margin-top: 1.4rem; }
.dhm-rulecard { min-width: 0; padding: 1.3rem 1.4rem 1.1rem; border: 1px solid var(--dhm-line-soft); border-radius: 5px; background: linear-gradient(145deg, rgba(38, 35, 33, 0.6), rgba(14, 14, 15, 0.9)); }
.dhm-rulecard--wide { grid-column: 1 / -1; }
.dhm .dhm-rulecard__title { margin-top: 0.45rem; color: var(--dhm-title); font: 400 1.35rem/1.15 Georgia, "Times New Roman", serif; }
.dhm-list { margin: 0.75rem 0 0; padding: 0; list-style: none; }
.dhm-list li { position: relative; padding: 0.55rem 0 0.55rem 1.15rem; border-top: 1px solid var(--dhm-line-soft); font-size: 0.9rem; line-height: 1.6; }
.dhm-list li:first-child { border-top: 0; }
.dhm-list li::before { content: ""; position: absolute; top: 1.12rem; left: 0.1rem; width: 5px; height: 5px; background: rgba(213, 182, 129, 0.65); transform: rotate(45deg); }
.dhm-list--cols { columns: 2; column-gap: 2.5rem; }
.dhm-list--cols li { break-inside: avoid; border-top: 0; border-bottom: 1px solid var(--dhm-line-soft); }

/* Blessings */
.dhm-hero__figure { position: relative; max-width: 580px; margin: 1.9rem auto 0; overflow: hidden; border: 1px solid rgba(213, 182, 129, 0.28); border-radius: 5px; box-shadow: 0 0 34px rgba(var(--dhm-accent), 0.3), 0 18px 40px rgba(0, 0, 0, 0.35); }
.dhm-hero__figure img { display: block; width: 100%; height: auto; }
.dhm-hero__figure::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, 0.32), transparent 45%); pointer-events: none; }
.dhm-blessings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; margin-top: 1.4rem; }
.dhm-bless {
    min-width: 0;
    padding: 1.1rem 1.25rem 1.15rem;
    border-radius: 5px;
    background: linear-gradient(135deg, rgba(38, 35, 33, 0.88), rgba(18, 18, 19, 0.96));
    box-shadow: inset 0 1px rgba(213, 182, 129, 0.08), 0 16px 36px rgba(0, 0, 0, 0.18);
}
.dhm-bless--class { box-shadow: inset 0 1px rgba(213, 182, 129, 0.3), inset 3px 0 0 rgba(213, 182, 129, 0.55), 0 16px 36px rgba(0, 0, 0, 0.2); }
.dhm-bless__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.3rem 1rem; }
.dhm-bless__name { color: var(--dhm-title); font: 400 1.25rem/1.2 Georgia, "Times New Roman", serif; }
.dhm-bless__chance { color: #9fd3a8; font: 600 1rem/1.2 Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; }
.dhm-bless__bar { height: 4px; margin-top: 0.6rem; overflow: hidden; border-radius: 2px; background: rgba(181, 155, 97, 0.14); }
.dhm-bless__bar i { display: block; height: 100%; background: linear-gradient(90deg, #5f9e7f, #d5b681); }
.dhm-bless__meta { margin-top: 0.75rem !important; color: var(--dhm-muted); font: 600 0.63rem/1.4 Arial, Helvetica, sans-serif; letter-spacing: 0.16em; text-transform: uppercase; }
.dhm-bless__meta strong { color: #d9cbb0; font-weight: 600; letter-spacing: 0.06em; }
.dhm-bless__effect { margin-top: 0.4rem !important; color: #eadbc2; font-size: 0.95rem; line-height: 1.55; }
.dhm-bless__notes { margin-top: 0.3rem !important; color: #aaa69c; font-size: 0.86rem; line-height: 1.6; }
.dhm-bless__notes a { color: var(--dhm-gold); }
.dhm-share { display: inline-block; margin-top: 1rem; padding: 0.35rem 0.75rem; border: 1px solid rgba(159, 211, 168, 0.3); border-radius: 3px; background: rgba(95, 158, 127, 0.1); color: #b9e2c4; font: 600 0.8rem/1.2 Arial, Helvetica, sans-serif; }
.dhm-classes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; margin-top: 1.4rem; }
.dhm-classcard { min-width: 0; padding: 1rem 1.1rem 1.1rem; border: 1px solid var(--dhm-line-soft); border-radius: 5px; background: linear-gradient(145deg, rgba(38, 35, 33, 0.6), rgba(14, 14, 15, 0.9)); }
.dhm-classcard__head { display: flex; align-items: center; gap: 0.65rem; }
.dhm-classcard__icon { flex: 0 0 auto; width: 2.4rem; height: 2.4rem; overflow: hidden; border: 1px solid rgba(213, 182, 129, 0.3); border-radius: 4px; background: rgba(0, 0, 0, 0.45); }
.dhm-classcard__icon img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dhm-classcard__name { flex: 1; min-width: 0; color: var(--dhm-title); font: 400 1.15rem/1.2 Georgia, "Times New Roman", serif; }
.dhm-classcard__count { color: var(--dhm-muted); font: 600 0.63rem/1 Arial, Helvetica, sans-serif; letter-spacing: 0.14em; text-transform: uppercase; white-space: nowrap; }
.dhm-spells { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.8rem; }
.dhm-spells span { padding: 0.2rem 0.5rem; border: 1px solid rgba(181, 155, 97, 0.2); border-radius: 3px; background: rgba(0, 0, 0, 0.3); color: #d6d0bf; font-size: 0.76rem; line-height: 1.4; }

@media (max-width: 860px) {
    .dhm-callout { grid-template-columns: minmax(0, 1fr); gap: 0.75rem; margin-inline: 0; padding: 1.15rem 1.1rem; }
    .dhm-glance { grid-template-columns: minmax(0, 1fr); padding-inline: 0.75rem; }
    .dhm-npc { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
    .dhm-tierpick__buttons { margin-left: 0; }
    .dhm-rules { grid-template-columns: minmax(0, 1fr); }
    .dhm-rulecard { padding: 1.15rem 1.05rem 1rem; }
    .dhm-list--cols { columns: 1; }
    .dhm-blessings { grid-template-columns: minmax(0, 1fr); }
    .dhm-classes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dhm-hero__figure { margin-top: 1.5rem; }
}
@media (max-width: 600px) {
    .dhm-classes { grid-template-columns: minmax(0, 1fr); }
    .dhm-drops-table { min-width: 800px; }
    .dhm-drops-table col:first-child { width: 9.5rem !important; }
    .dhm-drops-table col + col { width: auto !important; }
    .dhm-drop { gap: 0.45rem; }
    .dhm-drop img { width: 22px; height: 22px; }
    .dhm-drop__name { font-size: 0.78rem; }
    .dhm-grid th, .dhm-grid td { padding-inline: 0.45rem !important; }
}

/* ---- L4 Justices hard mode rankings (templates/l4-fuckyou-hardmode-leaderboard.php) ---- */
.dhm-chip small { margin-left: 0.4rem; color: #8d9284; font-size: 0.68rem; font-variant-numeric: tabular-nums; }
.dhm-chip.is-active small { color: #d9bd88; }
.dhm-chip.is-empty:not(.is-active) { color: #77736d; }
.dhm-l4 .dhm-board-bar { justify-content: space-between; }
.dhm-l4-boards { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.9fr); gap: 0 1.5rem; }
.dhm-l4 .dhm-table-wrap > table { display: table !important; }
.dhm-l4 .dhm-table td.is-wrap { min-width: 12rem; white-space: normal; }
.dhm-roster { color: #f3e4c3; font-weight: 600; line-height: 1.45; }
.dhm-sub { margin-top: 0.2rem; color: #8d9284; font-size: 0.75rem; }
.dhm-table td.dhm-time { color: #e5b1a5; font-weight: 700; }
.dhm-table td.dhm-clears { color: #ead19d; font: 400 1.15rem/1 Georgia, "Times New Roman", serif; }
.dhm-table td.dhm-date { color: #a7a596; font-size: 0.78rem; }
.dhm-l4-error { margin-top: 1rem; padding: 1rem 1.25rem; border: 1px solid rgba(196, 80, 67, 0.3); border-radius: 4px; background: rgba(70, 24, 22, 0.28); color: #e8bcb3; font-size: 0.9rem; }
@media (max-width: 960px) {
    .dhm-l4-boards { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .dhm-l4 .dhm-table td.is-wrap { min-width: 8.5rem; }
    .dhm-l4 .dhm-table :is(th, td) { padding-inline: 0.6rem !important; }
}