/* ==========================================================================
   Lord of Destruction home — the encampment.
   Composition only; the materials (stone, parchment, iron buttons, the
   character sheet) come from sanctuary.css and the IDs read by home.js and
   sanctuary-ladder.js stay exactly where they were.
   ========================================================================== */

.landing-main { width: auto; padding-top: 0; }
.landing-page .page-main { padding-top: 0; }

/* Hero: the Dark Wanderer on the right, the call to arms on the left. */
.landing-hero { position: relative; isolation: isolate; min-height: min(88vh, 860px); padding-bottom: 90px; overflow: hidden; }
.landing-hero-art { position: absolute; inset: 0; z-index: -3; }
.landing-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: 72% 30%; filter: saturate(.9) contrast(1.08) brightness(.86); }
.landing-hero-image { position: absolute; inset: 0; z-index: -3; opacity: 0; background: url("/assets/pandemonium-fortress.png") center 30% / cover no-repeat; filter: saturate(.75) brightness(.6); }
.operator-hero-enabled .landing-hero-image { opacity: 1; background-image: url("/operator-assets/fan/portal-hero.webp"), url("/operator-assets/fan/portal-hero.png"), url("/assets/pandemonium-fortress.png"); }
.operator-hero-enabled .landing-hero-art { display: none; }
.landing-hero-shade {
  position: absolute; inset: 0; z-index: -2;
  background:
    linear-gradient(90deg, rgba(6, 4, 4, .96) 0%, rgba(6, 4, 4, .84) 34%, rgba(6, 4, 4, .35) 58%, rgba(6, 4, 4, .1) 100%),
    linear-gradient(180deg, rgba(6, 4, 4, .55), transparent 22%, transparent 55%, var(--void) 100%);
}
.landing-hero .embers { z-index: -1; }
.landing-hero .hero-grain { z-index: -1; }
.landing-hero-inner { position: relative; z-index: 1; padding-top: clamp(60px, 9vw, 130px); }
.landing-hero-copy { max-width: 780px; }
.landing-kicker { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; color: var(--ember); font: 600 10px/1.3 var(--label); letter-spacing: .3em; text-transform: uppercase; text-shadow: 0 0 12px rgba(176, 132, 60, .5); }
.landing-kicker span { color: var(--gold-bright); }
.landing-hero h1 { margin: 0 0 22px; font-size: clamp(46px, 6.4vw, 92px); line-height: .94; color: var(--gold-pale); text-shadow: 0 2px 0 #2b2720, 0 0 40px rgba(176, 132, 60, .3), 0 6px 24px rgba(0, 0, 0, .95); }
.landing-hero h1 em { display: block; font-style: normal; font-size: .62em; letter-spacing: .06em; color: var(--gold-bright); text-shadow: 0 2px 0 #2b2720, 0 0 26px rgba(176, 132, 60, .45), 0 6px 24px rgba(0, 0, 0, .95); }
.landing-lead { max-width: 560px; margin: 0 0 28px; color: #d8cbae; font-size: 18px; line-height: 1.7; text-shadow: 0 1px 2px #000; }
.landing-season-countdown { display: inline-flex; align-items: center; gap: 14px; margin: 0 0 22px; padding: 10px 16px; border: 1px solid var(--line-strong); background: rgba(8, 8, 8, .85); color: var(--bone); box-shadow: var(--inset); }
.landing-season-countdown span { color: var(--ember); font: 600 9px/1 var(--label); letter-spacing: .22em; }
.landing-season-countdown strong { font: 400 15px/1 var(--display); color: var(--gold-pale); }
.landing-season-countdown b { font: 400 15px/1 var(--display); color: var(--poison); font-variant-numeric: tabular-nums; }
.landing-hero-cta { display: flex; flex-wrap: wrap; gap: 14px; }
.landing-note { margin: 22px 0 0; color: var(--dim); font: 600 9px/1.6 var(--label); letter-spacing: .2em; text-transform: uppercase; }
.landing-note span { color: var(--ember); margin: 0 6px; }

/* HUD belt with the live numbers. */
.landing-dashboard {
  position: relative; z-index: 2; display: grid; grid-template-columns: 1.3fr repeat(4, 1fr); gap: 2px; margin-top: 54px; padding: 10px;
  border: 1px solid rgba(199, 154, 60, .4); border-radius: 3px;
  background: linear-gradient(rgba(29, 27, 26, .97), rgba(14, 10, 9, .99)), var(--stone-tile) center / 480px;
  box-shadow: var(--inset), inset 0 0 0 2px rgba(0, 0, 0, .6), inset 0 0 50px rgba(0, 0, 0, .6), 0 30px 60px rgba(0, 0, 0, .7), 0 0 0 1px #060606;
}
.landing-dashboard::before { content: ""; position: absolute; inset: 4px; border: 1px solid rgba(233, 197, 106, .16); pointer-events: none; }
.landing-dashboard-item { position: relative; display: grid; align-content: center; gap: 7px; min-height: 84px; padding: 14px 18px; color: var(--bone); background: linear-gradient(#0b0a0a, #131211); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .8), inset 0 2px 8px rgba(0, 0, 0, .9), inset 0 0 0 2px rgba(199, 154, 60, .08); }
.landing-dashboard-item small { color: var(--dim); font: 600 8px/1.3 var(--label); letter-spacing: .22em; text-transform: uppercase; }
.landing-dashboard-item strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gold-pale); font: 400 24px/1.1 var(--display); letter-spacing: .03em; }
.landing-dashboard-season strong { color: var(--poison); text-shadow: 0 0 12px rgba(95, 242, 90, .45); font-size: 20px; white-space: normal; }
.landing-dashboard-leader { transition: box-shadow .2s, color .2s; }
.landing-dashboard-leader strong { color: var(--bone-bright); }
.landing-dashboard-leader .landing-leader-level { color: var(--gold-bright); }
.landing-dashboard-leader:hover { box-shadow: inset 0 0 0 1px var(--gold), inset 0 0 24px rgba(139, 0, 0, .5); }
.landing-dashboard-leader:hover strong { color: var(--gold-pale); text-shadow: 0 0 12px rgba(176, 132, 60, .7); }
.landing-dashboard-leader:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: -3px; }

/* Body grid. */
.landing-body { position: relative; z-index: 1; padding-top: 36px; }
.landing-sheet { margin-bottom: 40px; }
.landing-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(320px, .9fr); gap: 26px; align-items: start; }
.landing-main-col, .landing-side-col { min-width: 0; }
.landing-live-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.landing-standings-table table { font-size: 15px; }
.landing-standings-table th:first-child, .landing-standings-table td:first-child { width: 48px; }
.landing-standings-table td, .landing-standings-table th { padding: 12px 12px; }
.landing-live-list { display: grid; gap: 3px; }
.landing-live-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 12px; border: 1px solid rgba(199, 154, 60, .1); background: rgba(0, 0, 0, .28); color: var(--bone); transition: border-color .2s, background .2s; }
.landing-live-row > span { display: grid; gap: 4px; min-width: 0; }
.landing-live-row strong { font: 400 16px/1.2 var(--display); letter-spacing: .03em; color: var(--bone-bright); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.landing-live-row small { color: var(--dim); font: 600 9px/1.3 var(--label); letter-spacing: .1em; text-transform: uppercase; }
.landing-live-row b { flex: none; color: var(--gold-bright); font: 600 9px/1 var(--label); letter-spacing: .16em; }
a.landing-live-row:hover { border-color: var(--gold); background: linear-gradient(90deg, rgba(139, 0, 0, .25), rgba(0, 0, 0, .3)); color: var(--bone); }
.landing-game-access { padding: 5px 8px; border: 1px solid currentColor; border-radius: 2px; }
.landing-game-access.open { color: var(--poison); text-shadow: 0 0 8px rgba(95, 242, 90, .5); }
.landing-game-access.private { color: #f0565f; }
.landing-game-access.unknown { color: var(--dim); }
.landing-online-mark { color: var(--poison); text-shadow: 0 0 8px rgba(95, 242, 90, .5); }
.landing-live-empty { padding: 18px 12px; color: var(--dim); font-style: italic; text-align: center; }
.landing-live-row .quality-unique { color: var(--gold-bright) !important; }
.landing-live-row .quality-set { color: #49c864 !important; }
.landing-live-row .quality-rune { color: var(--ember) !important; }

/* Terror zone card: the one panel that is allowed to burn. */
.landing-desecration-card { padding: 24px 24px 22px; border-color: rgba(220, 20, 60, .35); background: radial-gradient(ellipse at 100% 0, rgba(139, 0, 0, .45), transparent 55%), linear-gradient(rgba(26, 16, 14, .94), rgba(12, 8, 8, .98)), var(--stone-tile) center / 480px; }
.landing-desecration-card::before { border-color: rgba(220, 20, 60, .2); }
.landing-desecration-card[data-state="active"] { box-shadow: var(--inset), inset 0 0 70px rgba(139, 0, 0, .35), 0 0 40px rgba(139, 0, 0, .3), 0 24px 60px rgba(0, 0, 0, .55); animation: desecration-breathe 5s ease-in-out infinite; }
@keyframes desecration-breathe { 0%, 100% { border-color: rgba(220, 20, 60, .35); } 50% { border-color: rgba(176, 132, 60, .7); } }
.landing-desecration-card[data-state="inactive"], .landing-desecration-card[data-state="error"] { border-color: var(--line-strong); background: linear-gradient(rgba(22, 21, 20, .9), rgba(10, 10, 10, .96)), var(--stone-tile) center / 480px; }
.landing-desecration-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.landing-desecration-head .eyebrow { margin: 0; color: var(--crimson); }
#homeDesecrationStatus:not(:empty) { margin-right: 8px; color: var(--poison); }
.landing-desecration-card h2 { margin: 0 0 8px; font-size: 32px; line-height: 1.05; color: var(--gold-pale); text-shadow: 0 0 22px rgba(176, 132, 60, .45); }
.landing-desecration-window { margin: 0 0 16px; color: var(--ash); font-size: 13px; line-height: 1.6; }
.landing-desecration-clock { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid rgba(220, 20, 60, .3); background: rgba(0, 0, 0, .4); box-shadow: inset 0 2px 10px rgba(0, 0, 0, .8); }
.landing-desecration-clock span { color: var(--dim); font: 600 8px/1.3 var(--label); letter-spacing: .22em; }
.landing-desecration-clock strong { color: var(--ember); font: 400 30px/1 var(--display); font-variant-numeric: tabular-nums; text-shadow: 0 0 16px rgba(176, 132, 60, .8); }
.landing-desecration-effects { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 12px; }
.landing-desecration-effects span { padding: 6px 10px; border: 1px solid rgba(95, 242, 90, .25); background: rgba(0, 0, 0, .35); font: 400 12px/1 var(--display); letter-spacing: .1em; }
.landing-desecration-next { margin: 0 0 4px; color: var(--ash); font-size: 13px; }
.landing-finds .landing-live-row b { color: var(--gold-bright); }

/* Horadric stash: tools laid out as inventory slots. */
.landing-stash { margin-top: 30px; }
.landing-section-title { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin: 0 0 18px; }
.landing-section-title h2 { margin: 8px 0 0; font-size: clamp(28px, 3.4vw, 40px); color: var(--gold-pale); }
.landing-section-title p { max-width: 520px; margin: 0; color: var(--ash); line-height: 1.6; text-align: right; }
.landing-section-title .text-link { margin: 0 0 6px; white-space: nowrap; }
.stash-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 12px;
  border: 1px solid rgba(199, 154, 60, .4); border-radius: 3px;
  background:
    repeating-linear-gradient(90deg, rgba(233, 197, 106, .06) 0 1px, transparent 1px 36px),
    repeating-linear-gradient(0deg, rgba(233, 197, 106, .06) 0 1px, transparent 1px 36px),
    linear-gradient(rgba(14, 12, 18, .97), rgba(8, 7, 11, .99)), var(--stone-tile) center / 480px;
  box-shadow: var(--inset), inset 0 0 0 2px rgba(0, 0, 0, .7), inset 0 0 60px rgba(0, 0, 0, .7), 0 30px 60px rgba(0, 0, 0, .6);
}
.stash-slot {
  position: relative; display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start; min-height: 128px; padding: 16px;
  border: 1px solid rgba(199, 154, 60, .18); background: linear-gradient(rgba(20, 16, 20, .9), rgba(9, 8, 11, .95)); color: var(--bone);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .8), inset 0 0 24px rgba(0, 0, 0, .7); transition: border-color .2s, box-shadow .2s, transform .15s;
}
.stash-slot:hover { border-color: var(--gold); color: var(--bone); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .8), inset 0 0 30px rgba(139, 0, 0, .35), 0 0 22px rgba(176, 132, 60, .25); transform: translateY(-2px); }
.stash-slot-rune { display: grid; place-items: center; width: 56px; height: 56px; border: 1px solid rgba(199, 154, 60, .3); background: radial-gradient(circle at 50% 40%, #1d1a2a, #0a0910 75%); box-shadow: inset 0 0 14px rgba(0, 0, 0, .9); }
.stash-slot-rune img { width: 28px; height: 28px; filter: drop-shadow(0 0 8px rgba(176, 132, 60, .6)); }
.stash-slot-copy { display: grid; gap: 6px; min-width: 0; }
.stash-slot-copy small { color: var(--ember); font: 600 8px/1.3 var(--label); letter-spacing: .24em; }
.stash-slot-copy strong { font: 400 20px/1.15 var(--display); color: var(--gold-pale); }
.stash-slot-copy em { font-style: normal; color: var(--ash); font-size: 13px; line-height: 1.55; }

/* Chronicle: the quest log. */
.landing-chronicle { margin-top: 44px; }
.landing-news-stream { display: grid; gap: 0; }
.landing-news-card { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 26px; padding: 22px 0; border-bottom: 1px dashed rgba(66, 58, 49, .45); }
.landing-news-card:last-child { border-bottom: 0; }
.landing-news-date { display: grid; gap: 8px; align-content: start; }
.landing-news-date time { color: #433c34; font: 600 10px/1.4 var(--label); letter-spacing: .12em; text-transform: uppercase; }
.landing-news-date span { justify-self: start; padding: 4px 8px; border-radius: 2px; background: #8b0000; color: #f6d7a4; font: 600 8px/1 var(--label); letter-spacing: .2em; text-transform: uppercase; box-shadow: inset 0 -2px 4px rgba(0, 0, 0, .4); }
.landing-news-card h3 { margin: 0 0 8px; font-size: 24px; line-height: 1.15; color: #2a241f; }
.landing-news-card p { margin: 0 0 10px; color: #2f2a25; line-height: 1.65; }
.landing-news-card a { color: #7a0e16; font: 400 12px/1.2 var(--display); letter-spacing: .14em; text-transform: uppercase; }
.landing-news-card a:hover { color: #b3121f; }
.landing-news-card .skeleton { grid-column: span 2; min-height: 60px; background: linear-gradient(100deg, rgba(66, 58, 49, .15) 25%, rgba(66, 58, 49, .3) 39%, rgba(66, 58, 49, .15) 53%); background-size: 300% 100%; }

/* The quest: how to get in. */
.landing-quest { display: grid; grid-template-columns: minmax(0, 1fr); margin-top: 60px; }
.landing-quest-copy h2 { margin: 10px 0 14px; font-size: clamp(32px, 4vw, 48px); }
.landing-quest-copy > p { max-width: 760px; font-size: 16px; }
.landing-quest-steps { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 22px 0 26px; padding: 0; list-style: none; }
.landing-quest-steps li { display: flex; align-items: center; gap: 10px; color: #2a241f; font: 400 16px/1.2 var(--display); letter-spacing: .04em; }
.landing-quest-steps b { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #e0313f, #a30e1a 40%, #5f0409 100%); color: #f6d7a4; font: 400 12px/1 var(--display); box-shadow: 0 3px 8px rgba(0, 0, 0, .45), inset 0 -2px 5px rgba(0, 0, 0, .5); }
.landing-quest-copy small { display: block; margin-top: 18px; font: 600 9px/1.6 var(--label); letter-spacing: .14em; text-transform: uppercase; }

/* Codex: the comparison table folded under a stone bar. */
.landing-codex { margin-top: 36px; padding: 0; }
.landing-codex > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 18px; padding: 20px 26px; }
.landing-codex > summary::-webkit-details-marker { display: none; }
.landing-codex > summary .eyebrow { margin: 0; }
.landing-codex > summary strong { flex: 1; font: 400 22px/1.2 var(--display); color: var(--gold-pale); }
.landing-codex > summary b { color: var(--gold-bright); font: 400 26px/1 var(--display); transition: transform .2s; }
.landing-codex[open] > summary b { transform: rotate(45deg); }
.landing-codex > summary:hover strong { text-shadow: 0 0 12px rgba(176, 132, 60, .6); }
.landing-codex > :not(summary) { padding: 0 26px 26px; }

@media (max-width: 1180px) {
  .landing-dashboard { grid-template-columns: repeat(3, 1fr); }
  .landing-dashboard-season { grid-column: span 3; }
  .landing-grid { grid-template-columns: 1fr; }
  .stash-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .landing-hero { min-height: 0; padding-bottom: 60px; }
  .landing-hero-art img { object-position: 78% 20%; opacity: .7; }
  .landing-hero-shade { background: linear-gradient(180deg, rgba(6, 4, 4, .9) 0%, rgba(6, 4, 4, .75) 45%, var(--void) 100%); }
  .landing-hero-inner { padding-top: 50px; }
  .landing-hero h1 { font-size: clamp(42px, 13vw, 64px); }
  .landing-lead { font-size: 16px; }
  .landing-hero-cta .d2-button { flex: 1 1 100%; }
  .landing-dashboard { grid-template-columns: 1fr 1fr; margin-top: 36px; padding: 8px; }
  .landing-dashboard-season { grid-column: span 2; }
  .landing-dashboard-item { min-height: 70px; padding: 12px 14px; }
  .landing-dashboard-item strong { font-size: 20px; }
  .landing-live-grid { grid-template-columns: 1fr; }
  .landing-section-title { flex-direction: column; align-items: flex-start; }
  .landing-section-title p { text-align: left; }
  .stash-grid { grid-template-columns: 1fr; padding: 8px; }
  .landing-news-card { grid-template-columns: 1fr; gap: 10px; }
  .landing-news-date { grid-auto-flow: column; justify-content: start; align-items: center; gap: 12px; }
  .landing-quest-steps { flex-direction: column; }
  .landing-codex > summary { flex-wrap: wrap; padding: 16px 18px; }
  .landing-codex > summary strong { flex-basis: 100%; order: 3; font-size: 18px; }
  .landing-codex > :not(summary) { padding: 0 14px 18px; }
}

/* Tools laid out as real items in stash cells (28 px per cell, native size). */
.stash-slot-item {
  --cell: 34px; display: grid; place-items: center; width: calc(var(--cell) * 2 + 8px); height: calc(var(--cell) * 3 + 8px); flex: none;
  border: 1px solid rgba(199, 154, 60, .3);
  background:
    repeating-linear-gradient(90deg, rgba(233, 197, 106, .08) 0 1px, transparent 1px var(--cell)),
    repeating-linear-gradient(0deg, rgba(233, 197, 106, .08) 0 1px, transparent 1px var(--cell)),
    radial-gradient(circle at 50% 40%, #16131f, #08070b 75%);
  background-position: 4px 4px, 4px 4px, 0 0;
  box-shadow: inset 0 0 14px rgba(0, 0, 0, .9);
}
/* D2R HD inventory art at its cell footprint (34 px per cell). */
.stash-slot-item[data-cells="1x1"] img, .stash-slot-item[data-cells="1x2"] img, .stash-slot-item[data-cells="1x3"] img { width: var(--cell); }
.stash-slot-item[data-cells="2x2"] img { width: calc(var(--cell) * 2); }
.stash-slot-item img { display: block; filter: drop-shadow(0 0 8px rgba(0, 0, 0, .9)); }
.stash-slot:hover .stash-slot-item { border-color: var(--gold); box-shadow: inset 0 0 14px rgba(0, 0, 0, .9), inset 0 0 0 999px rgba(65, 105, 225, .08); }

/* Recent finds carry the item's own icon, as in the stash. */
.landing-find-row { gap: 12px; }
.landing-find-icon { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border: 1px solid rgba(199, 154, 60, .2); background: radial-gradient(circle at 50% 40%, #16131f, #08070b 75%); box-shadow: inset 0 0 10px rgba(0, 0, 0, .9); }
.landing-find-icon img { max-width: 32px; max-height: 32px; }
.landing-find-icon.empty::after { content: "✦"; color: var(--gold); font-size: 12px; }
.landing-find-row > span { flex: 1; }

/* Round 7 — grim palette on the LoD home. */
.landing-hero-shade { background: linear-gradient(90deg, rgba(5, 5, 5, .97) 0%, rgba(5, 5, 5, .86) 34%, rgba(5, 5, 5, .4) 58%, rgba(5, 5, 5, .15) 100%), linear-gradient(180deg, rgba(5, 5, 5, .6), transparent 22%, transparent 55%, var(--void) 100%); }
.landing-hero-art img { filter: saturate(.7) contrast(1.05) brightness(.72); }
.landing-hero h1 { color: #ddd1b8; text-shadow: 0 2px 0 #000, 0 6px 24px rgba(0, 0, 0, .95); }
.landing-hero h1 em { color: #c2a464; text-shadow: 0 2px 0 #000, 0 6px 24px rgba(0, 0, 0, .95); }
.landing-kicker { color: #a08a5c; text-shadow: none; }
.landing-kicker span { color: #8a7f6b; }
.landing-lead { color: #c2b9a6; }
.landing-dashboard { background: linear-gradient(rgba(12, 12, 12, .97), rgba(6, 6, 6, .99)) padding-box; }
.landing-dashboard-item { background: linear-gradient(#0b0b0b, #121212); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .8), inset 0 2px 8px rgba(0, 0, 0, .9); }
.landing-dashboard-season strong { color: #d9c79c; text-shadow: none; }
.landing-dashboard-item strong { color: #ddd1b8; }
.landing-dashboard-leader:hover { box-shadow: inset 0 0 0 1px #6f675a, inset 0 0 24px rgba(110, 11, 11, .35); }
.landing-desecration-card { background: radial-gradient(ellipse at 100% 0, rgba(110, 11, 11, .28), transparent 55%), linear-gradient(rgba(14, 12, 12, .95), rgba(8, 7, 7, .98)) padding-box; }
.landing-desecration-card[data-state="active"] { animation: none; box-shadow: 0 0 34px rgba(110, 11, 11, .25), 0 24px 60px rgba(0, 0, 0, .6); }
.landing-desecration-card h2 { color: #ddd1b8; text-shadow: 0 0 18px rgba(110, 11, 11, .6); }
.landing-desecration-head .eyebrow { color: #b0393f; }
.landing-desecration-clock { border-color: rgba(110, 11, 11, .4); }
.landing-desecration-clock strong { color: #d34a4a; text-shadow: 0 0 12px rgba(160, 20, 20, .55); }
.landing-desecration-effects span { border-color: rgba(138, 138, 255, .22); }
.landing-game-access.open, .landing-online-mark { color: #6db36d; text-shadow: none; }
.stash-grid { background: repeating-linear-gradient(90deg, rgba(201, 168, 95, .06) 0 1px, transparent 1px 36px), repeating-linear-gradient(0deg, rgba(201, 168, 95, .06) 0 1px, transparent 1px 36px), linear-gradient(rgba(10, 10, 10, .97), rgba(5, 5, 5, .99)); border: 22px solid transparent; border-image: url("/assets/sanctuary/d2r/panel-frame.webp") 30 / 22px stretch; background-clip: padding-box; box-shadow: 0 26px 60px rgba(0, 0, 0, .65); }
.stash-slot { background: linear-gradient(rgba(16, 16, 16, .92), rgba(8, 8, 8, .96)); }
.stash-slot:hover { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .8), inset 0 0 30px rgba(110, 11, 11, .3), 0 0 18px rgba(176, 132, 60, .15); }
.stash-slot-item, .landing-find-icon { background-color: #0a0a0a; background-image: repeating-linear-gradient(90deg, rgba(201, 168, 95, .07) 0 1px, transparent 1px var(--cell, 34px)), repeating-linear-gradient(0deg, rgba(201, 168, 95, .07) 0 1px, transparent 1px var(--cell, 34px)), radial-gradient(circle at 50% 40%, #151515, #070707 75%); }
.landing-find-icon { background-image: radial-gradient(circle at 50% 40%, #151515, #070707 75%); }
/* The chronicle sits on the same dark parchment as the quest scroll. */
.landing-news-card { border-bottom-color: rgba(201, 168, 95, .14); }
.landing-news-date time { color: #9a917f; }
.landing-news-date span { background: #4a0909; color: #e6d6ad; }
.landing-news-card h3 { color: #ddd1b8; }
.landing-news-card p { color: #c2b9a6; }
.landing-news-card a { color: #d1b06b; }
.landing-news-card a:hover { color: #efe0b8; }
.landing-news-card .skeleton { background: linear-gradient(100deg, rgba(255, 255, 255, .03) 25%, rgba(255, 255, 255, .07) 39%, rgba(255, 255, 255, .03) 53%); background-size: 300% 100%; }
.landing-quest-steps li { color: #ddd1b8; }
.landing-quest-copy small { color: #9a917f; }
.landing-codex > summary strong { color: #ddd1b8; }
/* Leaders: on one line in the 24 px display font, "ArThOOr-SorC · 87" needed
   274 px in a 226 px cell, so the level was the first thing cut. The name
   takes the cell (20 px), the level is a small label under it. */
.landing-dashboard-leader strong { white-space: normal; font-size: 20px; }
.landing-dashboard-leader .landing-leader-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.landing-dashboard-leader .landing-leader-level { display: block; margin-top: 6px; color: var(--gold); font: 600 9px/1.3 var(--label); letter-spacing: .2em; text-transform: uppercase; }
/* The gap between the live bar and the realm sheet was 126 px (90 px under
   the hero + 36 px above the sheet), and up to 141 px where the hero's
   minimum height (88vh) outgrew its content: the spare height collected
   under the bar. The hero is a column now; the copy is centred in the spare
   height and the bar sits 24 px from the hero's bottom at any height. */
.landing-hero { display: flex; flex-direction: column; padding-bottom: 24px; }
.landing-hero > .shell:not(:last-child) { margin-block: auto; }