/* Valicia's shared material palette. Keep geometry and gameplay states in their component
   sheets; this finishing layer unifies the ledger, HUD and the collectible cards. */
:root {
  --ledger-ground: #120d1f;
  --ledger-raised: #2a2140;
  --ledger-edge: #8e7953;
  --ledger-rule: rgba(218,188,127,.25);
  --ledger-light: #f6e6be;
  --ledger-muted: #b9b0cc;
  --ledger-surface: radial-gradient(ellipse at 0% 0%, #3a2c58, transparent 65%),
    linear-gradient(135deg, #1d1630, #110c1c 80%);
  --ledger-shadow: inset 0 1px 0 rgba(255,235,201,.16),
    inset 0 0 0 4px rgba(9,8,17,.35), 0 12px 32px rgba(0,0,0,.4);
}

.rpg-ui, .hud-hotbar, .hud-quests {
  --chrome: var(--ledger-ground);
  --gold: #c7ac7c;
  --gold-hi: var(--ledger-light);
  --glass-stroke: #5a4f72;
  --glass-stroke-hi: #b8a18b;
  --ink-mute: var(--ledger-muted);
  --gold-glow: rgba(210,183,137,.18);
}

/* Opaque book covers with an inset brass rule. The rule is a background, so it never
   scrolls away or intercepts a click. No continually animated decoration on the HUD. */
.rpg-panel, .v-page {
  background:
    linear-gradient(var(--ledger-rule), var(--ledger-rule)) 6px 6px / calc(100% - 12px) 1px no-repeat,
    linear-gradient(var(--ledger-rule), var(--ledger-rule)) 6px calc(100% - 7px) / calc(100% - 12px) 1px no-repeat,
    var(--ledger-surface);
  border-color: var(--ledger-edge);
  box-shadow: var(--ledger-shadow), 0 0 0 1px #0c0b13;
  border-radius: 14px;
}
.rpg-panel { box-shadow: var(--ledger-shadow), 0 24px 90px rgba(0,0,0,.6); }
.rpg-backdrop { background: radial-gradient(ellipse at center, rgba(23,19,38,.48), rgba(7,8,15,.82)); }
.rpg-panel-title { color: var(--ledger-light); font-weight: 600; letter-spacing: .025em;
  text-shadow: 0 2px 10px rgba(0,0,0,.4); }
.rpg-panel-sub, .rpg-panel-note { color: var(--ledger-muted); }
.rpg-group-title { color: var(--ledger-light); letter-spacing: .14em; }
.rpg-close { border-radius: 8px; border-color: var(--ledger-rule);
  background: #191722; color: var(--ledger-muted); transition: color .15s, background .15s, border-color .15s; }
.rpg-close:hover { background: #3d2430; }
.rpg-tabs { gap: 5px; border-color: var(--ledger-rule); }
.rpg-tab { border-radius: 6px 6px 0 0; padding: 8px 13px 10px; color: var(--ledger-muted);
  transition: color .15s, background .15s; }
.rpg-tab:hover { background: rgba(210,183,137,.06); }
.rpg-tab.is-active { background: linear-gradient(180deg, rgba(210,183,137,.12), rgba(210,183,137,.025)); }
.rpg-tab.is-active::after { background: linear-gradient(90deg, transparent, var(--gold-hi), transparent); }

/* Recesses share the cover's hue; occupied equipment retains its rarity rim. */
.rpg-cell, .rpg-slot, .v-slot {
  background: radial-gradient(ellipse at 50% 20%, #3b3548, #211c2a 80%);
  box-shadow: inset 0 2px 6px #08060e80, inset 0 -1px 0 #ead4b01a;
  border-radius: 8px;
}
.rpg-cell:not([data-rarity]), .rpg-slot:not([data-rarity]) { border-color: #6a5e72; }
.rpg-cell:hover, .rpg-slot:hover { box-shadow: inset 0 1px 0 #f2dfb833, 0 0 10px #d2b78920; }
.rpg-doll-stage { background: radial-gradient(ellipse at 50% 70%, #403649, #1d1a27 75%); border-color: var(--ledger-rule); }
.rpg-panel--inv .rpg-doll-tools { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.rpg-panel--inv .rpg-doll-tools .rpg-slot { width: 100%; min-width: 0; }
.rpg-headline-fig { background: linear-gradient(145deg, #393042, #201a2c);
  border: 1px solid var(--ledger-rule); box-shadow: inset 0 1px 0 #fff1; }
.rpg-node { background: radial-gradient(ellipse at 40% 20%, #4a4059, #241d30 75%);
  box-shadow: inset 0 0 0 3px #19131f, inset 0 1px 0 #fff3, 0 4px 9px #0004; }
.rpg-node--ability { border-radius: 13px; }
.rpg-ability { gap: 9px; padding: 8px 4px; border-radius: 10px; }
.rpg-ability:hover { background: rgba(210,183,137,.06); }
.rpg-ability-name { color: #ddd3e4; font-size: 12px; }
.rpg-skill-head { border-color: var(--ledger-rule); color: var(--ledger-light); padding-bottom: 8px; }
.rpg-panel--skill .rpg-skill-body { min-height: 32vh; }
.rpg-quest, .rpg-setting { background: rgba(10,8,18,.18); border: 1px solid var(--ledger-rule); border-radius: 9px; }
.rpg-quest { padding: 13px 15px; }
.rpg-quest-name { font-size: 18px; }
.rpg-setting { padding: 14px; }

/* Shared controls, with intentional exceptions for destructive actions and rarity colors. */
.rpg-ui :where(input:not([type="checkbox"]):not([type="range"]), select, textarea) {
  color: var(--ink); background-color: #15131f; border-color: var(--ledger-rule);
  border-radius: 6px; box-shadow: inset 0 2px 5px rgba(0,0,0,.18);
}
.rpg-ui :where(input, textarea)::placeholder { color: #a49bad; }
.rpg-ui :where(button, input, select, textarea, [tabindex="0"]):focus-visible,
.hud-slot:focus-visible, .hud-hotbar-step:focus-visible {
  outline: 2px solid var(--ledger-light); outline-offset: 3px;
}
.rpg-vend-btn, .rpg-social-btn, .rpg-respec, .rpg-stat-reset, .rpg-bestiary-reset {
  border-radius: 6px; transition: border-color .15s, background .15s, color .15s;
}
.rpg-vend-btn:not(.is-primary):not(.is-danger) { background: #272232; }
.rpg-ui :where(button:disabled) { cursor: default; }
.rpg-panel, .rpg-panel :where(div, ul), .rpg-chat-log {
  scrollbar-width: thin; scrollbar-color: #796a62 #16141e;
}

/* The same material, in a quieter weight for peripheral HUD furniture. */
.rpg-status, .hud-quests.v-page, .hud-hotbar.v-page, .rpg-chat {
  background: var(--ledger-surface); border: 1px solid var(--ledger-edge);
  box-shadow: var(--ledger-shadow); border-radius: 10px;
}
.rpg-status { padding: 13px; }
.rpg-ident .name { color: var(--ledger-light); font-size: 22px; }
.rpg-status .lvl { color: var(--ledger-muted); letter-spacing: .12em; font-size: 10px; }
.rpg-portrait { background: radial-gradient(circle at 45% 30%, #655976, #242030 75%); }
.rpg-portrait-ring { border-color: var(--gold); box-shadow: inset 0 0 0 2px #17131f, 0 0 0 2px #534456; }
.rpg-hprow, .rpg-sprow, .rpg-xpbar, .rpg-wxpbar {
  border-color: #665969; background: #0e0d15; box-shadow: inset 0 2px 4px #0008;
}
.rpg-hprow .fill, .rpg-sprow .fill, .rpg-xpbar .fill, .rpg-wxpbar .fill {
  box-shadow: inset 0 1px 0 #ffffff40, inset 0 -2px 3px #0004;
}
.hud-quests-title { color: var(--ledger-light); border-color: var(--ledger-rule); }
.hud-quest-line { color: #d0c8dc; line-height: 1.5; }
.hud-minimap-ring { border-color: var(--gold); box-shadow: 0 0 0 3px #1b1725, 0 5px 18px #0007, inset 0 0 12px #0005; }
.hud-minimap-n { background: #272131; color: var(--ledger-light); }
.hud-minimap-under { text-shadow: 0 2px 3px #080710; }
.hud-hotbar.v-page { border-radius: 11px; }
.hud-slot { background: radial-gradient(ellipse at 50% 15%, #454052, #211c2b 75%);
  border-color: #87745b; box-shadow: inset 0 1px 0 #e6d0a92e, inset 0 0 0 2px #15121c, 0 3px 5px #0005;
  transition: border-color .15s, box-shadow .15s; }
.hud-slot:hover { border-color: var(--ledger-light); box-shadow: inset 0 0 0 2px #15121c, 0 0 12px #d2b78935; }
.hud-slot-key { color: var(--ledger-light); font-size: 10px; text-shadow: 0 1px 3px #000; }
.hud-hotbar-step { border-color: var(--ledger-rule); background: #272131; color: var(--ledger-light); }
.rpg-actionbar .rpg-btn-glyph { background: radial-gradient(ellipse at top, #484054, #231e2b 80%);
  border-color: #9a8261; box-shadow: inset 0 1px 0 #fff2, inset 0 0 0 3px #211b2a, 0 3px 8px #0005; }
.rpg-actionbar .rpg-btn:hover .rpg-btn-glyph { border-color: var(--ledger-light); }
.rpg-chat-head { padding: 7px 8px; border-bottom: 1px solid var(--ledger-rule); }
.rpg-chat-tab { border-radius: 5px; color: var(--ledger-muted); }
.rpg-chat-tab.is-active { background: #453a4b; border-color: #9a8261; color: var(--ledger-light); }
.rpg-chat-entry { border-color: var(--ledger-rule); }
.rpg-chat-log { line-height: 1.55; }

/* Collection: restrained library chrome around the richer elemental card. Retain the
   four-by-four geometry and fixed-height card agreed for the collection. */
.rpg-bestiary-titlerow { padding-bottom: 10px; border-bottom: 1px solid var(--ledger-rule); }
.rpg-bestiary-titlerow .rpg-panel-title { font-size: 32px; }
.rpg-bestiary-titlerow .rpg-bestiary-summary { color: #d5c6ad; font-style: normal;
  font: 500 11px var(--font-mono); padding: 5px 9px; border: 1px solid var(--ledger-rule); border-radius: 5px; }
.rpg-bestiary-controls { padding: 8px 0 2px; gap: 9px; }
.rpg-bestiary-sort { color: var(--ledger-muted); }
.rpg-bestiary-cols { column-gap: 20px; }
.rpg-bestiary-tile { border: 1px solid #6b5b7155; border-radius: 8px;
  background: linear-gradient(160deg, #343042, #211c2d) !important;
  box-shadow: 0 3px 8px #0004; }
.rpg-bestiary-tile:hover { box-shadow: 0 0 0 1px #d2b789a0, 0 5px 12px #0006; }
.rpg-bestiary-tile.is-selected { box-shadow: 0 0 0 2px var(--gold-hi), 0 4px 16px #d2b78924 !important; }
.rpg-bestiary-tile .rpg-bestiary-name { color: #f0e5d4; font-weight: 700; }
.rpg-bestiary-tile.is-unknown .rpg-bestiary-name { color: var(--ledger-muted); font-weight: 400; }
.rpg-bestiary-lvl { border: 1px solid #fff1; background: #15121dc9; }
.bcard { box-shadow: 0 16px 28px #0008, 0 0 0 1px #08060e, 0 0 22px var(--el-glow); }
.bcard-inner { background: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--el) 15%, #292333), #18141f 75%); }
.bcard-row-k { letter-spacing: .11em; }
.bcard-row-v { color: #f0e5d4; }
.bcard-art.rpg-bestiary-art { box-shadow: 0 0 0 1px var(--gold2), 0 2px 8px #0007 !important; }

/* Square cells preserve the painting's proportions inside any portrait aperture. The
   existing per-creature SVG remains underneath as a network-failure fallback. */
.mcard-scene { position: absolute; width: 100%; aspect-ratio: 1; left: 0; top: 50%;
  transform: translateY(-50%); background-size: 400% 300%; background-repeat: no-repeat; }
.mcard-bg.has-scene::after { background: linear-gradient(180deg, #10101a10, transparent 45%, #100b1b55),
  radial-gradient(ellipse 38% 8% at 50% 85%, #0007, transparent 75%); }

@media (max-width: 860px) {
  .rpg-panel--bestiary { overflow-y: auto; }
  .rpg-bestiary-cols { grid-template-columns: minmax(0, 1fr); grid-template-rows: 270px auto;
    height: auto; gap: 16px; }
  .rpg-bestiary-detail { min-height: 510px; }
  .bcard { max-height: none; }
}
@media (max-width: 700px) {
  .rpg-bestiary-controls { flex-wrap: wrap; }
  .rpg-bestiary-controls .rpg-bestiary-search { flex-basis: 100%; }
  .rpg-bestiary-titlerow { flex-wrap: wrap; gap: 5px 12px; padding-right: 25px; }
  .rpg-bestiary-cols { column-gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .rpg-tab, .rpg-close, .hud-slot, .rpg-bestiary-tile { transition: none; }
  .rpg-bestiary-tile:hover, .rpg-bestiary-tile.is-selected { transform: none; }
}

/* FIELD JOURNAL COMPOSITION — illustrated woodland materials and readable hierarchy. */
.rpg-ui { font-family: var(--font-banner); font-size: 14px; --ink-soft: #d8d0e6; }
.rpg-panel { padding: 28px; border-radius: 16px; z-index: 30;
  background: url('../../art/ui/journal-botanical.svg') right 6px bottom 6px / 150px auto no-repeat,
    linear-gradient(var(--ledger-rule), var(--ledger-rule)) 8px 8px / calc(100% - 16px) 1px no-repeat,
    var(--ledger-surface); }
.rpg-panel-title { font-size: 32px; line-height: 1.15; margin-bottom: 18px; }
.rpg-close { background: #150f22; border-color: #c5ad7333; color: #c6bfd6; }
.rpg-tabs { gap: 5px; padding: 4px; border: 1px solid #c4b17b26; border-radius: 9px; background: #0e0a1866; }
.rpg-tab { flex: 1; padding: 8px 12px; border-radius: 5px; font: 700 11px var(--font-banner); }
.rpg-tab.is-active { background: linear-gradient(135deg, #e6ce98, #bda068); color: #221833; box-shadow: inset 0 1px 0 #fff6; }
.rpg-tab.is-active::after { content: none; }
.rpg-ui :where(input:not([type="checkbox"]):not([type="range"]), select, textarea) { background-color: #120e1c; border-color: #8a7aa855; font-family: var(--font-banner); }
.rpg-ui :where(input, textarea)::placeholder { color: #a49bb8; }
.rpg-panel, .rpg-panel :where(div, ul), .rpg-chat-log { scrollbar-color: #8a7aa8 #120e1c; }
.rpg-cell, .rpg-slot, .v-slot { background: radial-gradient(ellipse at 45% 20%, #352c4a, #1a1428 85%); box-shadow: inset 0 2px 5px #0a061280, inset 0 -1px 0 #e8d3a626; }
.rpg-cell:not([data-rarity]), .rpg-slot:not([data-rarity]) { border-color: #6a5e82; }
.rpg-doll-stage { background: radial-gradient(ellipse at 50% 65%, #3e3452, #171223 80%); }
.rpg-headline-fig { padding: 16px 10px; background: linear-gradient(135deg, #3a2f52, #1c1629); }
.rpg-headline-fig b { color: #f4e2b9; font-size: 30px; }
.rpg-node { background: radial-gradient(ellipse at 35% 20%, #4d4068, #201a30 80%); box-shadow: inset 0 0 0 3px #16111f, inset 0 1px 0 #fff3, 0 4px 9px #0004; }
.rpg-ability-name { color: #e2dcec; font-size: 13px; }
.rpg-quest, .rpg-setting { background: #0d091633; border-color: #a898cc26; border-radius: 10px; }
.rpg-quest-name { font-size: 19px; color: #f0dfb7; }
.rpg-quest-obj { color: #cfc7de; line-height: 1.5; }
.rpg-vend-btn:not(.is-primary):not(.is-danger) { background: #2e2444; }

/* Peripheral HUD: resource bands and a quieter, continuous command rail. */
.rpg-status, .hud-quests.v-page, .hud-hotbar.v-page, .rpg-chat { border-color: #ab936655; box-shadow: inset 0 1px 0 #fff0c921, 0 5px 20px #0a061455; border-radius: 12px; }
/* Width stays 02-quest-log's 306px: the buff strip is positioned from it. */
.rpg-status { padding: 14px; gap: 14px; }
.rpg-ident { margin-bottom: 10px; gap: 5px; }
.rpg-ident .name { font-size: 24px; color: #f1e2c0; }
.rpg-status .lvl { color: #b9b0cc; font-size: 10px; letter-spacing: .14em; }
.rpg-portrait { background: radial-gradient(circle at 40% 25%, #8574b0, #261d3c 75%); }
.rpg-portrait-ring { border-color: #c8ae77; box-shadow: inset 0 0 0 2px #1a1428, 0 0 0 2px #5e4f86; }
.rpg-hprow, .rpg-sprow, .rpg-xpbar, .rpg-wxpbar { border-radius: 4px; border-color: #6f638866; background: #0b0814; }
.rpg-hprow .fill, .rpg-sprow .fill, .rpg-xpbar .fill, .rpg-wxpbar .fill { border-radius: 3px; }
.rpg-hprow .fill { background: linear-gradient(90deg, #9c3c41, #f08074); }
.rpg-sprow .fill { background: linear-gradient(90deg, #275c89, #71b8d9); }
.rpg-bar-tag { color: #b9b0cc; font-size: 10px; }
.hud-quests.v-page { padding: 12px 14px; background: linear-gradient(140deg, #231b38ef, #150f24ef); }
.hud-quest-line { color: #d6cfe4; font-family: var(--font-banner); }
.hud-quests .v-page__corners { display: none; }
.hud-minimap-ring { border-radius: 12px; border-color: #c0a976; box-shadow: 0 0 0 4px #1a1428, 0 0 0 5px #c6ac6544, 0 8px 20px #0005; }
.hud-minimap-disc { border-radius: 10px; }
.hud-minimap-n, .hud-minimap-btn, .v-round { background: #2b2240; color: #f4dfb0; }
.hud-minimap-place { font-size: 15px; color: #fff0c9; }
.hud-hotbar-row { gap: 12px; bottom: 18px; }
.hud-hotbar-steps { margin-left: 0; }
.hud-hotbar-barno { background: #2e2444; box-shadow: inset 0 1px 0 #e6d6a83b; }
.hud-hotbar.v-page { padding: 9px; border-color: #b8a16b88; background: linear-gradient(180deg, #2a2140f5, #140f22f5); }
.hud-hotbar-gem, .hud-hotbar-crest, .hud-hotbar .v-page__corners { display: none; }
.hud-slot { width: 48px; height: 48px; border-radius: 9px; border-width: 1px; background: radial-gradient(ellipse at top, #433a5a, #1a1428 85%); border-color: #9b8a7280; box-shadow: inset 0 1px 0 #f4e0b22b, 0 2px 3px #0004; }
.hud-slot-key { left: 3px; top: 2px; min-width: 12px; text-align: center; border-radius: 3px; background: #110c1cb0; color: #f3dfb7; }
.hud-hotbar-step { background: #1d1630; border-color: #c4aa6944; color: #eadab5; border-radius: 5px; }
.rpg-chat { background: linear-gradient(145deg, #231b38eb, #140f22ee); }
.rpg-chat-tab { padding: 6px 8px; color: #b9b0cc; font-size: 10px; }
.rpg-chat-tab.is-active { background: #a08c5840; color: #f3dfb4; border-color: #c1a97377; }
.rpg-chat-log { font: 13px/1.5 var(--font-banner); padding: 8px 10px; }
.rpg-chat-entry { padding: 8px; border-color: #a898cc25; }
.rpg-chat-input { padding: 7px 9px; }

/* THE TOP NAV KEEPS ITS LAYOUT (owner, 2026-09-25): the same row of round buttons and the Menu
   toggle, only in the purple finish, with the line icons drawn in brass on each disc. */
.rpg-actionbar .rpg-btn-glyph { color: #e2c890; }
.rpg-actionbar .rpg-btn-glyph svg { width: 20px; height: 20px; }
.rpg-actionbar .rpg-btn:hover .rpg-btn-glyph, .rpg-actionbar .rpg-btn.is-active .rpg-btn-glyph { color: #f9dda0; }
.rpg-account-menu { background: #1d1630; border-color: #c9af7088; }

/* An illustrated collection, with more room for the habitat and a clear stat hierarchy. */
.rpg-panel--bestiary { width: min(1080px, 96vw); }
.rpg-bestiary-titlerow { padding: 0 40px 15px 0; gap: 16px; }
.rpg-bestiary-titlerow .rpg-panel-title { font-size: 34px; }
.rpg-bestiary-titlerow .rpg-bestiary-summary { color: #c3b8d8; font: 500 12px var(--font-banner); border: none; padding: 0; }
.rpg-bestiary-controls { gap: 10px; padding: 7px 0 4px; }
.rpg-bestiary-search { font-size: 14px; }
.rpg-bestiary-sort { font-family: var(--font-banner); color: #b9b0cc; }
.rpg-bestiary-sort-sel option, .rpg-bestiary-elem-sel option { background: #1d1630; color: #eee5cc; }
.rpg-bestiary-dir, .rpg-bestiary-reset { background-color: #1a1428; border-color: #8a7aa866; }
.rpg-bestiary-cols { grid-template-columns: minmax(0, 1fr) 390px; column-gap: 22px; height: min(528px, calc(100vh - 368px)); }
.rpg-bestiary-grid { grid-auto-rows: 120px; gap: 10px; }
.rpg-bestiary-tile { min-height: 120px; border-color: #8a7aa850; background: linear-gradient(150deg, #2e2644, #171223) !important; box-shadow: 0 3px 6px #0003; }
.rpg-bestiary-tile .rpg-bestiary-art { height: 84px; min-height: 84px; }
.rpg-bestiary-tile .rpg-bestiary-name { color: #eee3c7; font: 600 12px/1.2 var(--font-banner); letter-spacing: -.005em; padding: 6px 30px 0 7px; }
.rpg-bestiary-tile .rpg-bestiary-count { padding-bottom: 7px; color: #b3aac6; font-size: 10px; }
.rpg-bestiary-tile.is-selected { box-shadow: 0 0 0 2px #ebce91, 0 0 18px #e3c27a24 !important; }
.rpg-bestiary-tile.is-unknown .rpg-bestiary-name { color: #a79fbc; }
.rpg-bestiary-lvl { background: #130e1fc9; border-color: #dec48a30; color: #f0dca9; }
.mcard-bg { background: radial-gradient(ellipse at 70% 0%, color-mix(in srgb, var(--mc-mid) 45%, #2e2644), transparent 75%), #171223; }
.mcard-bg[data-element="unknown"] { background: radial-gradient(ellipse at 50% 40%, #5a5478, #2a2540 90%); }
.bcard { height: 510px; }  /* = four 120px rows + three 10px gaps, so it spans the rows exactly */
.bcard-inner { gap: 6px; padding: 6px; background: linear-gradient(140deg, #221a33, #120e1c 75%); box-shadow: inset 0 0 0 1px #f2d89a60; }
.bcard-art.rpg-bestiary-art { height: auto; flex: 1 1 auto; min-height: 150px; box-shadow: 0 0 0 1px #d9b878 !important; }
.bcard-sprite { bottom: 33px; height: calc((100% - 34px) * var(--scale, 1)); }
.bcard-nameplate { left: 8%; right: 8%; bottom: 5px; padding: 6px 12px; background: linear-gradient(135deg, #2e2440f5, #171223f5); }
.bcard-name.rpg-bestiary-detail-name { font-size: 21px; font-weight: 600; }
.bcard-lv { background: radial-gradient(circle at 35% 25%, #3e3256, #120d1c 80%); }
.bcard-stat { padding: 6px 3px; border-radius: 5px; }
.bcard-stat-txt b { font-size: 22px; font-weight: 700; }
.bcard-stat-txt small { font-size: 8px; }
.bcard-type.rpg-bestiary-tags { padding-top: 5px; padding-bottom: 5px; background: linear-gradient(90deg, #2e2644, #1a1426); }
.bcard-info { flex: none; min-height: 96px; max-height: 125px; overflow-y: auto;
  background: #120e1c88; padding: 8px 10px; gap: 7px; box-shadow: inset 0 0 0 1px #dbc18c33; }
.bcard-row { grid-template-columns: 58px minmax(0, 1fr); }
.bcard-row-k { font: 700 9px/1.3 var(--font-banner); color: #c8b587; letter-spacing: .11em; }
.bcard-row-v, .bcard-row-v .rpg-zone-link { color: #e6e0ee; font: 500 13px/1.35 var(--font-banner); }
.bcard-drop.rpg-bestiary-drop { height: 40px; background: linear-gradient(135deg, #2e2644, #171223); }
.bcard-drop.is-empty { background: #17122333; }
.bcard-foot { color: #d8c08c; font-size: 8px; letter-spacing: .1em; padding: 5px 8px 2px; }
.bcard-stats, .bcard-type, .bcard-drops, .bcard-foot { flex-shrink: 0; }
.rpg-tip, .rpg-itemcard, .rpg-trade-window, .rpg-party-win, .rpg-chat-menu,
.rpg-account-menu, .rpg-split { background: var(--ledger-surface); border-color: #b59e6f88; color: #eee6cd; }
.rpg-tip { font: 13px/1.5 var(--font-banner); box-shadow: 0 5px 18px #0005; }
.mcard-bg.has-scene::after { background: linear-gradient(180deg, transparent 60%, #1a122840), radial-gradient(ellipse 35% 7% at 50% 85%, #140d2066, transparent 75%); }
@media (max-width: 860px) {
  .rpg-bestiary-cols { grid-template-columns: minmax(0, 1fr); grid-template-rows: 280px auto; height: auto; gap: 16px; }
  .rpg-bestiary-detail { min-height: 555px; }
}
@media (max-width: 700px) { .rpg-panel { padding: 22px; } }
.rpg-bestiary-summary { position: relative; padding-bottom: 7px !important; }
.rpg-bestiary-summary::after { content: ''; position: absolute; height: 2px; left: 0; right: 0; bottom: 0; border-radius: 2px; background: linear-gradient(90deg, #d8c189 var(--recorded, 0%), #4a3f6655 var(--recorded, 0%)); }

/* EVERY PANEL FITS BETWEEN THE NAV AND THE HOTBAR. Panels are centred in the viewport, so a panel
   taller than (viewport - 2 x 95px) ran under the top nav's labels and behind the hotbar (the
   Masteries tree lost its last row at 1600 x 900). Taller content scrolls inside the panel. The
   bestiary is sized to fit this band at 1600 x 900 with its four rows and card intact. */
.rpg-panel { max-height: calc(100vh - 190px); }