/* VEYDRIS Modern 2026 – final presentation layer.
   Loaded after every other stylesheet. One palette, one type scale, one surface language.
   Only presentation: no layout logic that scripts depend on is removed. */

/* ---------- Typography: one sans for UI, Cinzel for display ---------- */
@font-face { font-family: "DM Mono"; src: url("./assets/fonts/manrope-600.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("./assets/fonts/manrope-700.woff2") format("woff2"); font-weight: 500 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("./assets/fonts/cinzel-600-700.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("./assets/fonts/cinzel-600-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --vm-bg: #07080d;
  --vm-bg-2: #0d0f17;
  --vm-surface: linear-gradient(180deg, rgba(24, 26, 38, .82), rgba(12, 13, 20, .9));
  --vm-surface-flat: rgba(16, 18, 27, .88);
  --vm-surface-hi: rgba(255, 255, 255, .035);
  --vm-line: rgba(226, 190, 122, .14);
  --vm-line-strong: rgba(232, 196, 128, .42);
  --vm-gold: #e3bd74;
  --vm-gold-hi: #f8e2ad;
  --vm-gold-lo: #9c7a3e;
  --vm-text: #efe9dc;
  --vm-muted: #a7a194;
  --vm-arcane: #9a86ff;
  --vm-soul: #6fd6e0;
  --vm-radius: 16px;
  --vm-radius-sm: 10px;
  --vm-shadow: 0 18px 40px -18px rgba(0, 0, 0, .85), 0 2px 0 rgba(255, 255, 255, .02) inset;
  --vm-glow: 0 0 0 1px rgba(232, 196, 128, .5), 0 0 22px -4px rgba(232, 196, 128, .45);
  --vm-font: "Manrope", system-ui, sans-serif;
  --vm-display: "Cinzel", Georgia, serif;
  --font-mono: "Manrope", system-ui, sans-serif;
}

body.vey-renewal {
  font-family: var(--vm-font) !important;
  color: var(--vm-text);
  background:
    radial-gradient(1200px 600px at 78% -10%, rgba(120, 96, 220, .14), transparent 60%),
    radial-gradient(900px 500px at 10% 110%, rgba(200, 140, 60, .10), transparent 60%),
    var(--vm-bg) !important;
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}

/* Kickers / eyebrows / tags: readable sans instead of spaced mono */
body.vey-renewal :is(.eyebrow, .tag, .profile-kicker, .location-hero .eyebrow, .section-head small, .collection-card-status) {
  font-family: var(--vm-font) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
  color: var(--vm-gold) !important;
  opacity: .92;
}

/* Display headings: Cinzel with a forged-gold gradient */
body.vey-renewal #view :is(h1, h2) {
  font-family: var(--vm-display) !important;
  font-variant: normal !important;
  letter-spacing: .02em !important;
  background: linear-gradient(180deg, var(--vm-gold-hi) 10%, var(--vm-gold) 60%, #b8904c 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .55));
}
body.vey-renewal #view h1 { font-size: clamp(26px, 2.5vw, 38px) !important; line-height: 1.12 !important; }
body.vey-renewal #view h2 { font-size: clamp(19px, 1.6vw, 26px) !important; line-height: 1.18 !important; }
body.vey-renewal #view h3 {
  font-family: var(--vm-font) !important;
  font-weight: 800 !important;
  font-size: 16px !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  font-variant: normal !important;
  color: var(--vm-text) !important;
}
body.vey-renewal #view p { color: var(--vm-muted); line-height: 1.6; }

/* ---------- Shell ---------- */
body.vey-renewal .app-shell > main { background: transparent !important; }
body.vey-renewal .sidebar {
  background: linear-gradient(180deg, rgba(14, 15, 23, .96), rgba(8, 9, 14, .98)) !important;
  border-right: 1px solid var(--vm-line) !important;
  box-shadow: 8px 0 30px -12px rgba(0, 0, 0, .8) !important;
}
body.vey-renewal .sidebar .nav-item {
  border-radius: 12px !important;
  font-family: var(--vm-font) !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  transition: background .18s ease, box-shadow .18s ease;
}
body.vey-renewal .sidebar .nav-item:hover { background: rgba(232, 196, 128, .06) !important; }
body.vey-renewal .sidebar .nav-group.active-group > .nav-item,
body.vey-renewal .sidebar .nav-group[open] > .nav-item {
  background: linear-gradient(90deg, rgba(232, 196, 128, .14), rgba(232, 196, 128, .02)) !important;
  box-shadow: inset 2px 0 0 var(--vm-gold) !important;
}
body.vey-renewal .sidebar .nav-group-links :is(a, button) {
  font-family: var(--vm-font) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  border-radius: 8px !important;
}

body.vey-renewal .topbar {
  background: linear-gradient(180deg, rgba(10, 11, 17, .92), rgba(10, 11, 17, .6)) !important;
  backdrop-filter: blur(14px) saturate(1.2);
  border-bottom: 1px solid var(--vm-line) !important;
}
body.vey-renewal .topbar .resource {
  font-family: var(--vm-font) !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
  color: var(--vm-text) !important;
}

/* Objective strip: slimmer, clearly a call-to-action */
body.vey-renewal #currentObjective {
  background: linear-gradient(90deg, rgba(232, 196, 128, .10), rgba(154, 134, 255, .06) 60%, rgba(0, 0, 0, 0)) !important;
  border: 1px solid var(--vm-line) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
body.vey-renewal #currentObjective .objective-command {
  border-radius: 10px !important;
  background: linear-gradient(180deg, #f1d491, #c29447) !important;
  color: #1b1408 !important;
  border: 1px solid #f7e2ae !important;
  font-family: var(--vm-font) !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  box-shadow: 0 6px 18px -8px rgba(232, 196, 128, .8) !important;
}

/* Section tabs: segmented pills */
body.vey-renewal #sectionNavigation {
  gap: 6px !important;
  padding: 4px !important;
  background: rgba(255, 255, 255, .025) !important;
  border: 1px solid var(--vm-line) !important;
  border-radius: 999px !important;
  width: max-content;
  max-width: 100%;
}
body.vey-renewal #sectionNavigation > button {
  border-radius: 999px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--vm-muted) !important;
  font-family: var(--vm-font) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  padding: 8px 16px !important;
  box-shadow: none !important;
}
body.vey-renewal #sectionNavigation > button::before { display: none !important; }
body.vey-renewal #sectionNavigation > button:hover { color: var(--vm-text) !important; background: rgba(255, 255, 255, .04) !important; }
body.vey-renewal #sectionNavigation > button.active {
  color: #1b1408 !important;
  background: linear-gradient(180deg, #f1d491, #c9a058) !important;
  box-shadow: 0 4px 14px -6px rgba(232, 196, 128, .9) !important;
}

/* Active bonuses: compact chip line instead of a full-width box */
body.vey-renewal #view > details.active-benefits {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 10px !important;
}
body.vey-renewal #view > details.active-benefits > summary {
  display: inline-flex !important;
  width: auto !important;
  gap: 10px;
  align-items: center;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  background: rgba(154, 134, 255, .08) !important;
  border: 1px solid rgba(154, 134, 255, .22) !important;
  font-family: var(--vm-font) !important;
  font-size: 12px !important;
  letter-spacing: .04em !important;
}

/* ---------- Surfaces ---------- */
body.vey-renewal #view :is(.card, .view-title, .location-hero, .market-hero, .armory-command__hero, .stable-collection, .active-collection-showcase) {
  border-radius: var(--vm-radius) !important;
  border: 1px solid var(--vm-line) !important;
  box-shadow: var(--vm-shadow) !important;
}
body.vey-renewal #view .card:not([style*="--collection-art"]) {
  background: var(--vm-surface) !important;
}
body.vey-renewal #view .card { transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
body.vey-renewal #view .card:hover { border-color: rgba(232, 196, 128, .3) !important; }

/* ---------- Buttons (generic; forged artwork buttons keep their art) ---------- */
body.vey-renewal #view .button:not(.veydris-cta):not([class*="forged"]) {
  border-radius: 10px !important;
  font-family: var(--vm-font) !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  letter-spacing: .06em !important;
  min-height: 42px;
  transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
}
body.vey-renewal #view .button.primary:not(.veydris-cta) {
  background: linear-gradient(180deg, #f3d694, #c89a4f) !important;
  color: #1b1408 !important;
  border: 1px solid #f8e3b0 !important;
  box-shadow: 0 8px 20px -10px rgba(232, 196, 128, .9), inset 0 1px 0 rgba(255, 255, 255, .5) !important;
  text-shadow: none !important;
}
body.vey-renewal #view :is(.button.ghost, .button.metal, .button.secondary) {
  background: rgba(255, 255, 255, .04) !important;
  color: var(--vm-text) !important;
  border: 1px solid var(--vm-line-strong) !important;
  box-shadow: none !important;
}
body.vey-renewal #view .button:not(:disabled):hover { filter: brightness(1.08); transform: translateY(-1px); }
body.vey-renewal #view .button:disabled { opacity: .45 !important; filter: grayscale(.4); }

body.vey-renewal :focus-visible { outline: 2px solid var(--vm-gold-hi) !important; outline-offset: 2px !important; }

/* ---------- Item slots: rarity glow + transparent art on a soft pedestal ---------- */
body.vey-renewal .item-slot {
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 50% 60%, color-mix(in srgb, var(--rarity-color, #8a8175) 28%, transparent), transparent 70%),
    linear-gradient(180deg, #171923, #0c0d13) !important;
  border: 1px solid color-mix(in srgb, var(--rarity-color, #8a8175) 55%, transparent) !important;
  box-shadow: inset 0 0 18px -6px color-mix(in srgb, var(--rarity-color, #8a8175) 60%, transparent), 0 6px 16px -10px #000 !important;
}
body.vey-renewal .item-slot img { object-fit: contain !important; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .6)); }
body.vey-renewal .item-slot:hover { box-shadow: inset 0 0 22px -4px color-mix(in srgb, var(--rarity-color, #8a8175) 75%, transparent), 0 0 0 1px var(--rarity-color, #8a8175) !important; }
body.vey-renewal .item-slot.item-slot-empty { background: rgba(255, 255, 255, .02) !important; border-style: dashed !important; }
body.vey-renewal .equipment-slot > small {
  font-family: var(--vm-font) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: .06em !important;
  color: var(--vm-muted) !important;
}

/* ---------- Mount & companion cards ---------- */
body.vey-renewal #view .mount-card.collection-entity-card {
  padding: 0 !important;
  overflow: hidden;
  display: flex !important;
  flex-direction: column;
  min-height: 0 !important;
  height: auto !important;
}
body.vey-renewal #view .mount-grid .mount-card button.collection-art.mount-icon {
  width: 100% !important;
  height: 220px !important;
  min-height: 220px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background:
    var(--collection-art) center 70% / auto 92% no-repeat,
    radial-gradient(ellipse 60% 42% at 50% 86%, rgba(0, 0, 0, .55), transparent 70%),
    radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--vm-mount-tint, #e3bd74) 26%, transparent), transparent 66%),
    linear-gradient(180deg, #1a1c28, #0b0c12) !important;
  box-shadow: inset 0 -1px 0 var(--vm-line) !important;
}
body.vey-renewal #view .mount-card .collection-card-copy,
body.vey-renewal #view .mount-card .collection-card-footer { padding: 14px 16px !important; }
body.vey-renewal #view .mount-card .collection-card-copy { flex: 1; gap: 8px !important; height: auto !important; align-content: start !important; grid-template-rows: none !important; }
body.vey-renewal #view .mount-card .collection-card-copy > p { display: none !important; }
body.vey-renewal #view .mount-card .collection-card-footer { border-top: 1px solid var(--vm-line) !important; gap: 8px !important; }
body.vey-renewal #view .mount-card .collection-card-footer .button { min-height: 40px !important; height: auto !important; }
body.vey-renewal #view .mount-grid .mount-card.locked-mount button.collection-art.mount-icon { filter: saturate(.55) brightness(.75); }
body.vey-renewal #view .mount-card.active-mount { border-color: var(--vm-gold) !important; box-shadow: var(--vm-glow), var(--vm-shadow) !important; }
body.vey-renewal #view .mount-card[data-mount-acquisition="drop-only"] { --vm-mount-tint: #9a86ff; }
body.vey-renewal #view .mount-card[data-mount-acquisition="arena"] { --vm-mount-tint: #e0605a; }
body.vey-renewal .collection-card-grid { gap: 16px !important; }
body.vey-renewal .mount-grid.collection-card-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important; }

body.vey-renewal .active-collection-portrait.collection-art {
  border-radius: 18px !important;
  background:
    var(--collection-art) center / contain no-repeat,
    radial-gradient(circle at 50% 50%, rgba(232, 196, 128, .22), transparent 68%),
    linear-gradient(180deg, #1a1c28, #0b0c12) !important;
  border: 1px solid var(--vm-line-strong) !important;
}

/* Bonus pills */
body.vey-renewal .collection-bonus-list > span {
  border-radius: 999px !important;
  background: rgba(111, 214, 224, .1) !important;
  border: 1px solid rgba(111, 214, 224, .28) !important;
  color: #bfeff3 !important;
  font-family: var(--vm-font) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
  padding: 3px 10px !important;
}

/* Form controls: modern + iOS-safe */
body.vey-renewal #view :is(select, input[type="text"], input[type="search"], input[type="number"]) {
  font-family: var(--vm-font) !important;
  font-size: 16px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid var(--vm-line-strong) !important;
  color: var(--vm-text) !important;
}

/* Scrollbars */
body.vey-renewal * { scrollbar-width: thin; scrollbar-color: rgba(232, 196, 128, .35) transparent; }

@media (max-width: 760px) {
  body.vey-renewal #view h1 { font-size: 26px !important; }
  body.vey-renewal #sectionNavigation { border-radius: 14px !important; width: 100%; }
  body.vey-renewal #view .mount-grid .mount-card button.collection-art.mount-icon { height: 190px !important; min-height: 190px !important; }
  body.vey-renewal .mount-grid.collection-card-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
}
@media (max-width: 420px) {
  body.vey-renewal .mount-grid.collection-card-grid { grid-template-columns: 1fr !important; }
}
@media (prefers-reduced-motion: reduce) {
  body.vey-renewal #view .button:hover { transform: none; }
}

/* View entrance: transform-only so views that re-render while polling never stick at opacity 0 */
@keyframes vm-enter { from { transform: translateY(6px); } to { transform: none; } }
body.vey-renewal #view.view-enter > * { animation: vm-enter 260ms cubic-bezier(.2,.8,.25,1) both !important; opacity: 1 !important; }

/* Sidebar / main background */
html body.vey-renewal .app-shell > aside.sidebar,
html body.vey-renewal[data-view] .app-shell > aside.sidebar {
  background: linear-gradient(180deg, #0f1019, #08090e 80%) !important;
  border-right: 1px solid var(--vm-line) !important;
}
html body.vey-renewal .app-shell > main,
html body.vey-renewal[data-view] .app-shell > main {
  background:
    radial-gradient(1100px 520px at 85% -8%, rgba(120, 96, 220, .12), transparent 60%),
    radial-gradient(800px 480px at 0% 100%, rgba(200, 140, 60, .07), transparent 60%),
    #090a10 !important;
}

/* ---------- Inner tab bars: same segmented language as the section tabs ---------- */
body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px !important;
  padding: 5px !important;
  background: rgba(255, 255, 255, .025) !important;
  border: 1px solid var(--vm-line) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) > button {
  flex: 1 1 auto;
  min-height: 38px !important;
  height: auto !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--vm-muted) !important;
  font-family: var(--vm-font) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: .03em !important;
  text-transform: none !important;
  text-shadow: none !important;
}
body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) > button::before,
body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) > button::after { display: none !important; }
body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) > button:hover { color: var(--vm-text) !important; background: rgba(255, 255, 255, .04) !important; }
body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) > button:is(.active, [aria-selected="true"], [aria-pressed="true"]) {
  color: var(--vm-gold-hi) !important;
  background: linear-gradient(180deg, rgba(232, 196, 128, .18), rgba(232, 196, 128, .06)) !important;
  border-color: rgba(232, 196, 128, .45) !important;
}

/* Stat chips / readouts: one look */
body.vey-renewal #view :is(.stat-chip, .hero-stat, .location-stat) {
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .03) !important;
  border: 1px solid var(--vm-line) !important;
}

/* Long headings in narrow columns must not break mid-word */
body.vey-renewal #view :is(h1, h2) { overflow-wrap: normal !important; word-break: normal !important; hyphens: manual; }

/* Progress bars: gold-to-arcane fill */
body.vey-renewal #view progress { accent-color: var(--vm-gold); }

/* Toasts */
body.vey-renewal .toast {
  border-radius: 12px !important;
  background: rgba(16, 18, 27, .95) !important;
  border: 1px solid var(--vm-line-strong) !important;
  backdrop-filter: blur(10px);
  font-family: var(--vm-font) !important;
}

/* ---------- Landing / oath gateway ---------- */
body.vey-renewal #authLayer .landing-class-role { bottom: calc(5% + 58px) !important; }
@media (max-height: 980px) and (min-width: 761px) {
  /* Trait tags collided with the CONTINUE forge button on laptop heights */
  body.vey-renewal #authLayer .landing-class-copy > footer { display: none !important; }
}
body.vey-renewal #authLayer .button.ghost {
  border-radius: 999px !important;
  background: rgba(10, 11, 17, .55) !important;
  border: 1px solid var(--vm-line-strong) !important;
  color: var(--vm-gold-hi) !important;
  font-family: var(--vm-font) !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  backdrop-filter: blur(8px);
  padding: 0 16px !important;
}
body.vey-renewal #authLayer .button.ghost:hover { background: rgba(232, 196, 128, .12) !important; }

/* Active-bonus chip: one tidy line on phones */
body.vey-renewal #view > details.active-benefits.active-benefits { border: 0 !important; background: none !important; box-shadow: none !important; }
body.vey-renewal #view > details.active-benefits.active-benefits::before,
body.vey-renewal #view > details.active-benefits.active-benefits::after { display: none !important; }
body.vey-renewal #view > details.active-benefits > summary { white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
body.vey-renewal #view > details.active-benefits > summary > * { white-space: nowrap; }
body.vey-renewal #view > details.active-benefits > summary { flex-direction: row !important; flex-wrap: nowrap !important; display: inline-flex !important; height: auto !important; min-height: 0 !important; }
body.vey-renewal #view > details.active-benefits > summary > * { display: inline !important; margin: 0 !important; padding: 0 !important; }

@media (max-width: 760px) {
  body.vey-renewal #view h1 { font-size: 22px !important; }
  body.vey-renewal #view .companion-card { grid-template-columns: 1fr !important; justify-items: center; text-align: center; }
  body.vey-renewal #view .companion-card > :first-child { margin-inline: auto; }
}

/* Undiscovered uniques: transparent art renders as a clean shadow silhouette */
body.vey-renewal #view .unique-journal-card.missing {
  background: radial-gradient(circle at 50% 40%, rgba(154, 134, 255, .10), transparent 65%), rgba(14, 15, 22, .9) !important;
  border: 1px dashed rgba(232, 196, 128, .2) !important;
}
body.vey-renewal #view .unique-journal-art.silhouette img { filter: brightness(0) drop-shadow(0 0 10px rgba(154, 134, 255, .55)) !important; opacity: .85 !important; }
body.vey-renewal #view .unique-journal-art.silhouette { background: none !important; }

/* Combat action deck: label column wide enough for "AKTIONSVERLAUF" */
body.vey-renewal #view .combat-action-deck > header { min-width: 150px !important; }
body.vey-renewal #view .combat-action-deck > header > span { white-space: nowrap; letter-spacing: .08em !important; }

/* Header: currencies float top-right without an empty full-width frame */
body.vey-renewal .topbar .resources { border: 0 !important; background: none !important; box-shadow: none !important; }
body.vey-renewal .topbar .resources::before, body.vey-renewal .topbar .resources::after { display: none !important; }
body.vey-renewal .topbar .resource {
  padding: 4px 12px 4px 8px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid var(--vm-line) !important;
}
body.vey-renewal .topbar #journeyTravel {
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid var(--vm-line-strong) !important;
  box-shadow: none !important;
  min-height: 40px !important;
  height: 40px !important;
  padding: 0 12px !important;
}
body.vey-renewal .topbar #journeyTravel:hover { background: rgba(232, 196, 128, .1) !important; }

/* =====================================================================
   VEYDRIS Modern · Stufe 2 – Navigation, Leisten, Blöcke, mobiles Dock
   ===================================================================== */
:root {
  --vm2-glass: rgba(14, 15, 23, .72);
  --vm2-edge: linear-gradient(150deg, rgba(248, 226, 173, .55), rgba(255, 255, 255, .05) 34%, rgba(255, 255, 255, .03) 66%, rgba(154, 134, 255, .45));
  --vm2-radius: 20px;
}

/* ---------- Seitenleiste ---------- */
html body.vey-renewal .app-shell > aside.sidebar {
  padding: 22px 14px 14px !important;
  gap: 14px !important;
  background:
    radial-gradient(420px 260px at 0% 0%, rgba(232, 196, 128, .09), transparent 70%),
    radial-gradient(380px 300px at 100% 100%, rgba(154, 134, 255, .08), transparent 70%),
    linear-gradient(180deg, #0e0f18, #07080d) !important;
}
html body.vey-renewal .sidebar .brand {
  padding: 4px 8px 16px !important;
  border-bottom: 1px solid var(--vm-line) !important;
  margin-bottom: 2px !important;
}
html body.vey-renewal .sidebar .brand b { font-family: var(--vm-display) !important; letter-spacing: .16em !important; color: var(--vm-gold-hi) !important; }
html body.vey-renewal .sidebar .brand small { font-family: var(--vm-font) !important; letter-spacing: .22em !important; color: var(--vm-muted) !important; }

/* Heldenkarte */
html body.vey-renewal .sidebar .profile.shell-profile-link {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  border: 1px solid transparent !important;
  background:
    linear-gradient(135deg, rgba(232, 196, 128, .14), rgba(20, 22, 32, .92) 55%) padding-box,
    var(--vm2-edge) border-box !important;
  box-shadow: 0 12px 28px -18px #000 !important;
  transition: transform .18s ease, box-shadow .18s ease;
}
html body.vey-renewal .sidebar .profile.shell-profile-link:hover { transform: translateY(-1px); box-shadow: 0 16px 30px -16px rgba(232, 196, 128, .35) !important; }
html body.vey-renewal .sidebar .profile .avatar {
  width: 46px !important; height: 46px !important; min-width: 46px !important;
  border-radius: 14px !important;
  background-size: cover !important; background-position: center 20% !important;
  box-shadow: 0 0 0 2px #0b0c12, 0 0 0 3px var(--vm-gold), 0 6px 16px -6px rgba(232, 196, 128, .6) !important;
  border: 0 !important;
}
html body.vey-renewal .sidebar .profile-kicker { font-size: 10px !important; }
html body.vey-renewal .sidebar #playerName { font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 15px !important; color: var(--vm-text) !important; letter-spacing: 0 !important; }
html body.vey-renewal .sidebar #playerLevel { font-family: var(--vm-font) !important; font-size: 12px !important; color: var(--vm-muted) !important; letter-spacing: 0 !important; white-space: nowrap; }

/* Hauptpunkte */
html body.vey-renewal #nav { gap: 4px !important; padding-right: 2px !important; }
html body.vey-renewal #nav .nav-group { border: 0 !important; background: none !important; box-shadow: none !important; margin: 0 !important; }
html body.vey-renewal #nav .nav-group::before, html body.vey-renewal #nav .nav-group::after { display: none !important; }
html body.vey-renewal #nav .nav-item {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) 18px !important;
  grid-template-rows: auto auto !important;
  column-gap: 12px !important;
  row-gap: 1px !important;
  align-items: center !important;
  min-height: 58px !important;
  height: auto !important;
  padding: 9px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 14px !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer;
  overflow: hidden;
}
html body.vey-renewal #nav .nav-item::before, html body.vey-renewal #nav .nav-item::after { display: none !important; }
html body.vey-renewal #nav .nav-item:hover { background: rgba(255, 255, 255, .04) !important; border-color: var(--vm-line) !important; }
html body.vey-renewal #nav .nav-relic {
  grid-row: 1 / span 2 !important;
  width: 38px !important; height: 38px !important;
  display: grid !important; place-items: center !important;
  border-radius: 12px !important;
  background: radial-gradient(circle at 50% 35%, rgba(232, 196, 128, .16), rgba(255, 255, 255, .03) 70%) !important;
  border: 1px solid var(--vm-line) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}
html body.vey-renewal #nav .nav-relic img { width: 28px !important; height: 28px !important; object-fit: contain !important; }
html body.vey-renewal #nav .nav-item > b {
  grid-column: 2 !important; grid-row: 1 !important; align-self: end !important;
  font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 14px !important;
  letter-spacing: .01em !important; text-transform: none !important; color: var(--vm-text) !important;
}
html body.vey-renewal #nav .nav-item > small {
  display: block !important;
  grid-column: 2 !important; grid-row: 2 !important; align-self: start !important;
  font-family: var(--vm-font) !important; font-weight: 600 !important; font-size: 11px !important;
  letter-spacing: 0 !important; text-transform: none !important; color: var(--vm-muted) !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html body.vey-renewal #nav .nav-item > i {
  grid-column: 3 !important; grid-row: 1 / span 2 !important;
  width: 18px !important; height: 18px !important; padding: 0 !important;
  display: grid !important; place-items: center !important;
  border: 0 !important; background: none !important;
  color: var(--vm-muted) !important; font-style: normal !important;
  transition: transform .2s ease;
}
html body.vey-renewal #nav .nav-group[open] > .nav-item > i { transform: rotate(180deg); color: var(--vm-gold) !important; }
/* Aktiver Bereich: Ortsbild als Kulisse + Leuchtkante */
html body.vey-renewal #nav .nav-group.active-group > .nav-item {
  border: 1px solid transparent !important;
  background:
    linear-gradient(90deg, rgba(16, 17, 26, .55), rgba(16, 17, 26, .92) 70%) padding-box,
    var(--nav-art) center / cover padding-box,
    var(--vm2-edge) border-box !important;
  box-shadow: 0 10px 26px -16px rgba(232, 196, 128, .55), inset 3px 0 0 var(--vm-gold) !important;
}
html body.vey-renewal #nav .nav-group.active-group > .nav-item .nav-relic {
  background: radial-gradient(circle at 50% 35%, rgba(248, 226, 173, .35), rgba(232, 196, 128, .08) 70%) !important;
  border-color: rgba(248, 226, 173, .5) !important;
  box-shadow: 0 0 18px -4px rgba(232, 196, 128, .7) !important;
}
html body.vey-renewal #nav .nav-group.active-group > .nav-item > b { color: var(--vm-gold-hi) !important; }
html body.vey-renewal #nav .nav-group:not(.active-group)[open] > .nav-item { background: rgba(255, 255, 255, .03) !important; }

/* Unterpunkte */
html body.vey-renewal #nav .nav-group-links {
  display: grid !important;
  gap: 2px !important;
  margin: 4px 0 8px 29px !important;
  padding: 2px 0 2px 12px !important;
  border-left: 1px solid rgba(232, 196, 128, .18) !important;
  background: none !important;
}
html body.vey-renewal #nav .nav-group-links::before { display: none !important; }
html body.vey-renewal #nav .nav-group-links button {
  position: relative;
  text-align: left !important;
  min-height: 34px !important;
  padding: 7px 10px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--vm-muted) !important;
  font-family: var(--vm-font) !important;
  font-size: 13px !important; font-weight: 600 !important;
  letter-spacing: 0 !important; text-transform: none !important;
}
html body.vey-renewal #nav .nav-group-links button::before {
  content: "" !important; display: block !important;
  position: absolute; left: -16px; top: 50%; width: 7px; height: 7px; margin-top: -3.5px;
  border-radius: 50%; background: #0b0c12; border: 1px solid rgba(232, 196, 128, .3);
}
html body.vey-renewal #nav .nav-group-links button::after { display: none !important; }
html body.vey-renewal #nav .nav-group-links button:hover { color: var(--vm-text) !important; background: rgba(255, 255, 255, .04) !important; }
html body.vey-renewal #nav .nav-group-links button.active {
  color: var(--vm-gold-hi) !important;
  background: linear-gradient(90deg, rgba(232, 196, 128, .16), rgba(232, 196, 128, .02)) !important;
}
html body.vey-renewal #nav .nav-group-links button.active::before { background: var(--vm-gold); border-color: var(--vm-gold-hi); box-shadow: 0 0 10px var(--vm-gold); }

html body.vey-renewal .sidebar-bottom {
  margin-top: auto !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  border: 1px solid var(--vm-line) !important;
  background: rgba(255, 255, 255, .02) !important;
  font-family: var(--vm-font) !important;
}
html body.vey-renewal .sidebar-bottom #onlineCount { font-size: 12px !important; color: var(--vm-muted) !important; letter-spacing: 0 !important; }
html body.vey-renewal .sidebar-bottom .online-dot { box-shadow: 0 0 0 3px rgba(108, 240, 169, .15), 0 0 10px #6cf0a9 !important; }

/* ---------- Kopfzeile: eine Glas-Leiste ---------- */
@media (min-width: 761px) {
  html body.vey-renewal .topbar {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    height: auto !important;
    min-height: 72px !important;
    padding: 12px 28px !important;
    position: sticky !important; top: 0; z-index: 30;
    background: rgba(9, 10, 16, .72) !important;
    backdrop-filter: blur(18px) saturate(1.3);
    -webkit-backdrop-filter: blur(18px) saturate(1.3);
  }
  html body.vey-renewal .topbar > .global-hero { order: 1; }
  html body.vey-renewal .topbar > #journeyTravel { order: 2; margin-left: auto !important; }
  html body.vey-renewal .topbar > .resources {
    order: 3; width: auto !important; position: static !important;
    padding: 0 !important; margin: 0 !important; gap: 8px !important; align-items: center !important;
  }
  html body.vey-renewal .topbar > .experience-guide-link { order: 4; }
  html body.vey-renewal .topbar > #menuButton, html body.vey-renewal .topbar > .crumb { display: none !important; }
}
html body.vey-renewal .topbar .global-hero {
  gap: 12px !important;
  padding: 6px 16px 6px 6px !important;
  height: auto !important;
  border-radius: 16px !important;
  border: 1px solid var(--vm-line) !important;
  background: rgba(255, 255, 255, .03) !important;
  width: auto !important;
  align-items: center !important;
}
html body.vey-renewal .topbar .global-hero:hover { border-color: var(--vm-line-strong) !important; background: rgba(232, 196, 128, .06) !important; }
html body.vey-renewal .topbar .global-hero__portrait {
  width: 44px !important; height: 44px !important; min-width: 44px !important;
  border-radius: 12px !important; background-size: cover !important; background-position: center 20% !important;
  box-shadow: 0 0 0 2px #0b0c12, 0 0 0 3px rgba(232, 196, 128, .7) !important; border: 0 !important;
}
html body.vey-renewal .topbar .global-hero__portrait::before, html body.vey-renewal .topbar .global-hero__portrait::after { display: none !important; }
html body.vey-renewal .topbar .global-hero__identity { gap: 2px !important; }
html body.vey-renewal .topbar .global-hero__identity small { font-size: 10px !important; letter-spacing: .12em !important; color: var(--vm-gold) !important; }
html body.vey-renewal .topbar .global-hero__identity b { font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 15px !important; letter-spacing: 0 !important; color: var(--vm-text) !important; }
html body.vey-renewal .topbar .global-hero__identity em { font-style: normal !important; font-size: 12px !important; color: var(--vm-muted) !important; letter-spacing: 0 !important; }
html body.vey-renewal .topbar .global-hero__xp { height: 4px !important; border-radius: 99px !important; background: rgba(255, 255, 255, .08) !important; overflow: hidden; }
html body.vey-renewal .topbar .global-hero__xp > span { background: linear-gradient(90deg, var(--vm-gold), #f8e2ad) !important; border-radius: 99px !important; }
html body.vey-renewal .topbar .global-hero__power {
  display: grid !important; grid-template-columns: auto auto !important; column-gap: 8px !important; align-items: center !important;
  padding: 6px 12px !important; margin-left: 8px !important;
  border-left: 1px solid var(--vm-line) !important; border-radius: 0 !important; background: none !important;
}
html body.vey-renewal .topbar .global-hero__power > i { grid-row: 1 / span 2; }
html body.vey-renewal .topbar .global-hero__power small { font-size: 10px !important; letter-spacing: .14em !important; color: var(--vm-muted) !important; }
html body.vey-renewal .topbar .global-hero__power b {
  font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 20px !important; letter-spacing: -.01em !important;
  background: linear-gradient(180deg, #fff3d0, var(--vm-gold)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
/* Schnellreise als Suchfeld */
html body.vey-renewal .topbar #journeyTravel { justify-content: flex-start !important; gap: 10px !important;
  color: var(--vm-muted) !important; font-family: var(--vm-font) !important;
}
html body.vey-renewal .topbar #journeyTravel b { font-family: var(--vm-font) !important; font-weight: 600 !important; font-size: 13px !important; letter-spacing: 0 !important; color: var(--vm-muted) !important; flex: 1; text-align: left; }
html body.vey-renewal .topbar #journeyTravel kbd {
  font-family: var(--vm-font) !important; font-size: 11px !important; padding: 2px 7px !important;
  border-radius: 6px !important; border: 1px solid var(--vm-line-strong) !important; background: rgba(255, 255, 255, .05) !important; color: var(--vm-gold) !important;
}
html body.vey-renewal .topbar :is(#notificationButton, #accountButton, .experience-guide-link) {
  border-radius: 12px !important; transition: transform .15s ease, filter .15s ease;
}
html body.vey-renewal .topbar :is(#notificationButton, #accountButton, .experience-guide-link):hover { transform: translateY(-1px); filter: brightness(1.2); }

/* ---------- Ziel-Leiste: Auftragskarte mit Fortschritt ---------- */
html body.vey-renewal #currentObjective {
  display: flex !important; align-items: center !important; gap: 16px !important;
  min-height: 0 !important; height: auto !important;
  padding: 12px 14px 12px 12px !important;
  border: 1px solid transparent !important;
  border-radius: 18px !important;
  background:
    linear-gradient(90deg, rgba(18, 19, 29, .82), rgba(18, 19, 29, .96) 45%) padding-box,
    var(--objective-art, none) left center / 45% auto no-repeat padding-box,
    var(--vm2-edge) border-box !important;
  box-shadow: 0 16px 36px -24px #000 !important;
}
html body.vey-renewal #currentObjective::before, html body.vey-renewal #currentObjective::after { display: none !important; }
html body.vey-renewal #currentObjective .objective-copy { display: flex !important; align-items: center !important; gap: 14px !important; flex: 1; min-width: 0; }
html body.vey-renewal #currentObjective .objective-sigil {
  width: 52px !important; height: 52px !important; min-width: 52px !important;
  border-radius: 14px !important; overflow: hidden !important;
  box-shadow: 0 0 0 1px var(--vm-line-strong), 0 0 20px -6px rgba(232, 196, 128, .6) !important;
}
html body.vey-renewal #currentObjective .objective-sigil img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
html body.vey-renewal #currentObjective .objective-copy > div { display: grid !important; gap: 3px !important; min-width: 0; }
html body.vey-renewal #currentObjective .objective-copy small { font-family: var(--vm-font) !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: .14em !important; color: var(--vm-gold) !important; }
html body.vey-renewal #currentObjective .objective-copy b { font-family: var(--vm-font) !important; font-size: 16px !important; font-weight: 800 !important; color: var(--vm-text) !important; letter-spacing: 0 !important; }
html body.vey-renewal #currentObjective .objective-copy > div > span { display: block !important; font-size: 12px !important; color: var(--vm-muted) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html body.vey-renewal #currentObjective .objective-progress-row { display: flex !important; align-items: center !important; gap: 10px !important; max-width: 360px; }
html body.vey-renewal #currentObjective .objective-progress { flex: 1; height: 5px !important; border-radius: 99px !important; background: rgba(255, 255, 255, .08) !important; overflow: hidden; border: 0 !important; }
html body.vey-renewal #currentObjective .objective-progress > i { display: block; height: 100%; background: linear-gradient(90deg, var(--vm-gold), #f8e2ad) !important; border-radius: 99px; box-shadow: 0 0 10px var(--vm-gold); min-width: 4px; }
html body.vey-renewal #currentObjective .objective-progress-row em { font-style: normal !important; font-size: 11px !important; font-weight: 800 !important; color: var(--vm-gold) !important; }
html body.vey-renewal #currentObjective .objective-command { display: grid !important; gap: 0 !important; padding: 8px 18px !important; min-height: 44px !important; }
html body.vey-renewal #currentObjective .objective-command small { font-size: 9px !important; letter-spacing: .14em !important; opacity: .7; }

/* ---------- Blöcke: Verlaufsrahmen, Tiefe, Hover ---------- */
body.vey-renewal #view .card:not([style*="--collection-art"]),
body.vey-renewal #view :is(.view-title, .stable-collection, .active-collection-showcase, .equipped-panel) {
  border: 1px solid transparent !important;
  border-radius: var(--vm2-radius) !important;
  background:
    linear-gradient(180deg, rgba(24, 26, 38, .9), rgba(11, 12, 19, .95)) padding-box,
    linear-gradient(160deg, rgba(232, 196, 128, .32), rgba(255, 255, 255, .04) 38%, rgba(255, 255, 255, .02) 70%, rgba(154, 134, 255, .22)) border-box !important;
  box-shadow: 0 24px 48px -30px #000, inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}
body.vey-renewal #view .card { transition: transform .2s ease, box-shadow .2s ease !important; }
@media (hover: hover) {
  body.vey-renewal #view .card:hover { transform: translateY(-2px); box-shadow: 0 30px 56px -30px rgba(0, 0, 0, .9), 0 0 0 1px rgba(232, 196, 128, .25) !important; }
}
/* Banner-Blöcke mit Ortsbild: kräftigere Kulisse, größere Überschrift */
body.vey-renewal #view :is(.location-hero, .market-hero, .armory-command__hero) {
  border-radius: 24px !important;
  min-height: 150px !important;
  overflow: hidden !important;
  box-shadow: 0 30px 60px -36px #000, inset 0 0 0 1px rgba(232, 196, 128, .22) !important;
}
body.vey-renewal #view :is(.location-hero, .market-hero, .armory-command__hero) :is(h1, h2) { font-size: clamp(28px, 3vw, 42px) !important; }

/* Seitenkopf (Titel + Untertitel) */
body.vey-renewal #view .view-title h1, body.vey-renewal #view .location-heading h1 { position: relative; padding-bottom: 10px; }
body.vey-renewal #view .view-title h1::after, body.vey-renewal #view .location-heading h1::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 64px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, var(--vm-gold), transparent);
}

/* Section-Reiter größer und klarer */
body.vey-renewal #sectionNavigation { padding: 5px !important; background: rgba(9, 10, 16, .6) !important; backdrop-filter: blur(10px); }
body.vey-renewal #sectionNavigation > button { padding: 9px 18px !important; font-size: 13.5px !important; }

/* ---------- Mobil ---------- */
@media (max-width: 760px) {
  html body.vey-renewal .topbar {
    background: rgba(9, 10, 16, .78) !important;
    backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3);
  }
  html body.vey-renewal .topbar .global-hero { padding: 4px 12px 4px 4px !important; }
  html body.vey-renewal .topbar .global-hero__portrait { width: 36px !important; height: 36px !important; min-width: 36px !important; border-radius: 10px !important; }
  html body.vey-renewal #currentObjective { padding: 10px !important; border-radius: 16px !important; gap: 10px !important; }
  html body.vey-renewal #currentObjective .objective-sigil { width: 40px !important; height: 40px !important; min-width: 40px !important; border-radius: 12px !important; }
  html body.vey-renewal #currentObjective .objective-copy b { font-size: 14px !important; }
  html body.vey-renewal #currentObjective .objective-copy > div > span, html body.vey-renewal #currentObjective .objective-progress-row { display: none !important; }
  html body.vey-renewal #currentObjective .objective-command { padding: 6px 12px !important; min-height: 40px !important; }
  html body.vey-renewal #currentObjective .objective-command small { display: none !important; }

  /* Schwebendes Glas-Dock */
  html body.vey-renewal[data-view] #mobileDock#mobileDock, html body.vey-renewal #mobileDock#mobileDock {
    left: 10px !important; right: 10px !important; width: auto !important;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    height: 64px !important; padding: 6px !important; gap: 4px !important;
    border-radius: 22px !important;
    border: 1px solid transparent !important;
    background:
      linear-gradient(180deg, rgba(20, 21, 32, .86), rgba(10, 11, 17, .92)) padding-box,
      var(--vm2-edge) border-box !important;
    backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4);
    box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .9) !important;
  }
  html body.vey-renewal #mobileDock::before, html body.vey-renewal #mobileDock::after { display: none !important; }
  html body.vey-renewal #mobileDock > button {
    border-radius: 16px !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
    font-family: var(--vm-font) !important; font-weight: 700 !important; font-size: 10.5px !important;
    letter-spacing: .04em !important; text-transform: none !important; color: var(--vm-muted) !important;
    height: 100% !important; min-height: 0 !important; transition: background .2s ease, color .2s ease;
  }
  html body.vey-renewal #mobileDock > button.active {
    color: var(--vm-gold-hi) !important;
    background: radial-gradient(circle at 50% 30%, rgba(232, 196, 128, .28), rgba(232, 196, 128, .06) 70%) !important;
    box-shadow: inset 0 0 0 1px rgba(232, 196, 128, .35) !important;
  }
  html body.vey-renewal #mobileDock > button.active > span { filter: drop-shadow(0 0 8px rgba(232, 196, 128, .8)); }
  html body.vey-renewal #view { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; }

  /* Mobiles Menü (Seitenleiste als Schublade) */
  html body.vey-renewal .app-shell > aside.sidebar { border-radius: 0 24px 24px 0 !important; }
}

/* Stufe 2 · Korrekturen Kopfzeile / Dock / Sidebar-Fuß */
@media (min-width: 761px) {
  html body.vey-renewal .topbar #journeyTravel { min-width: 230px !important; }
  html body.vey-renewal .topbar .global-hero { height: auto !important; min-height: 58px !important; overflow: visible !important; }
  html body.vey-renewal .topbar .global-hero__identity { height: auto !important; justify-content: center !important; min-width: 120px; }
  html body.vey-renewal .topbar .global-hero__identity small, html body.vey-renewal .topbar .global-hero__xptext { display: none !important; }
  html body.vey-renewal .topbar .global-hero__power {
    display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: center !important;
    height: auto !important; min-height: 0 !important; overflow: visible !important; gap: 0 !important; padding: 2px 4px 2px 16px !important;
  }
  html body.vey-renewal .topbar .global-hero__power > i { display: none !important; }
}
html body.vey-renewal .sidebar-bottom { display: flex !important; align-items: center !important; gap: 8px !important; }
html body.vey-renewal .sidebar-bottom::before { position: static !important; display: none !important; }
@media (max-width: 760px) {
  html body.vey-renewal .topbar .global-hero__power b { font-size: 15px !important; }
  html body.vey-renewal .topbar .global-hero__power small { display: none !important; }
  html body.vey-renewal .topbar .global-hero__identity small, html body.vey-renewal .topbar .global-hero__identity em, html body.vey-renewal .topbar .global-hero__xptext, html body.vey-renewal .topbar .global-hero__xp { display: none !important; }
  html body.vey-renewal .topbar #journeyTravel { width: 40px !important; min-width: 40px !important; padding: 0 !important; justify-content: center !important; }
  html body.vey-renewal .topbar #journeyTravel :is(b, kbd) { display: none !important; }
  html body.vey-renewal[data-view] #mobileDock#mobileDock, html body.vey-renewal #mobileDock#mobileDock { inset: auto 10px calc(10px + env(safe-area-inset-bottom, 0px)) 10px !important; width: auto !important; }
}
html body.vey-renewal #nav { overflow-y: auto !important; overflow-x: hidden !important; flex: 1 1 auto !important; min-height: 0 !important; }
html body.vey-renewal #nav > .nav-group { flex-shrink: 0 !important; overflow: visible !important; height: auto !important; }
html body.vey-renewal #currentObjective .objective-copy small { display: block !important; }
body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) > button { letter-spacing: .06em !important; font-size: 12px !important; }

@media (max-width: 760px) {
  body.vey-renewal #authLayer .button.ghost { padding: 0 10px !important; min-height: 32px !important; height: 32px !important; font-size: 11px !important; }
}
@media (max-width: 760px) {
  body.vey-renewal #authLayer .landing-brand small { white-space: nowrap !important; font-size: 9px !important; letter-spacing: .16em !important; }
  body.vey-renewal #authLayer .landing-brand em { display: none !important; }
}

/* ---------- Mobiles Menü-Sheet: Kacheln mit Spielgrafik ---------- */
body.vey-renewal #morePanel button[data-shell-view="missions"] { --vm-tile: url("./assets/navigation/relics-v2/ui/adventure-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="rifts"] { --vm-tile: url("./assets/items/gear-v3/icons/relic-rune-t5.webp"); }
body.vey-renewal #morePanel button[data-shell-view="guild"] { --vm-tile: url("./assets/navigation/relics-v2/ui/social-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="raids"] { --vm-tile: url("./assets/items/gear-v3/icons/plate-helmet-t5.webp"); }
body.vey-renewal #morePanel button[data-shell-view="character"] { --vm-tile: url("./assets/navigation/relics-v2/ui/hero-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="inventory"] { --vm-tile: url("./assets/items/gear-v3/icons/plate-chest-t3.webp"); }
body.vey-renewal #morePanel button[data-shell-view="storage"] { --vm-tile: url("./assets/items/gear-v3/icons/leather-belt-t3.webp"); }
body.vey-renewal #morePanel button[data-shell-view="forge"] { --vm-tile: url("./assets/navigation/relics-v2/ui/forge-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="merchant"] { --vm-tile: url("./assets/items/icons-v3/market-elixir.webp"); }
body.vey-renewal #morePanel button[data-shell-view="classes"] { --vm-tile: url("./assets/items/field-arsenal/icons-v3/rune-knight-0.webp"); }
body.vey-renewal #morePanel button[data-shell-view="builds"] { --vm-tile: url("./assets/items/gear-v3/icons/cloth-helmet-t4.webp"); }
body.vey-renewal #morePanel button[data-shell-view="mounts"] { --vm-tile: url("./assets/mounts-v6/icons/moon-stag.webp"); }
body.vey-renewal #morePanel button[data-shell-view="companions"] { --vm-tile: url("./assets/companions-v6/icons/moon-wolf.webp"); }
body.vey-renewal #morePanel button[data-shell-view="collections"] { --vm-tile: url("./assets/items/gear-v3/icons/jewel-ring-t5.webp"); }
body.vey-renewal #morePanel button[data-shell-view="bestiary"] { --vm-tile: url("./assets/navigation/relics-v2/ui/chronicle-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="achievements"] { --vm-tile: url("./assets/items/gear-v3/icons/jewel-amulet-t5.webp"); }
body.vey-renewal #morePanel button[data-shell-view="chronicle"] { --vm-tile: url("./assets/navigation/relics-v2/ui/chronicle-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="liveops"] { --vm-tile: url("./assets/navigation/relics-v2/ui/citadel-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="ascension"] { --vm-tile: url("./assets/items/gear-v3/icons/relic-rune-t4.webp"); }
body.vey-renewal #morePanel button[data-shell-view="camp"] { --vm-tile: url("./assets/navigation/relics-v2/ui/citadel-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="codex"] { --vm-tile: url("./assets/items/gear-v3/icons/jewel-amulet-t3.webp"); }
body.vey-renewal #morePanel button[data-shell-view="community"] { --vm-tile: url("./assets/navigation/relics-v2/ui/social-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="arena"] { --vm-tile: url("./assets/items/field-arsenal/icons-v3/stormforged-1.webp"); }
body.vey-renewal #morePanel button[data-shell-view="market"] { --vm-tile: url("./assets/items/icons-v3/market-elixir.webp"); }
body.vey-renewal #morePanel button[data-shell-view="talents"] { --vm-tile: url("./assets/items/gear-v3/icons/relic-rune-t3.webp"); }
body.vey-renewal #morePanel button[data-shell-view="skills"] { --vm-tile: url("./assets/items/field-arsenal/icons-v3/starcaller-2.webp"); }
body.vey-renewal #morePanel button[data-shell-view="profile"] { --vm-tile: url("./assets/navigation/relics-v2/ui/hero-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="adventure"] { --vm-tile: url("./assets/navigation/relics-v2/ui/adventure-relic.webp"); }
body.vey-renewal #morePanel button[data-shell-view="dungeons"] { --vm-tile: url("./assets/navigation/relics-v2/ui/adventure-relic.webp"); }
body.vey-renewal #morePanel {
  border-radius: 26px 26px 0 0 !important;
  border: 1px solid transparent !important;
  background:
    radial-gradient(500px 260px at 0% 0%, rgba(232, 196, 128, .12), transparent 70%),
    linear-gradient(180deg, rgba(18, 19, 29, .97), rgba(8, 9, 14, .99)) padding-box,
    var(--vm2-edge) border-box !important;
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 -24px 60px -20px #000 !important;
  padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
}
body.vey-renewal #morePanel > header { background: none !important; border: 0 !important; padding: 18px 18px 8px !important; }
body.vey-renewal #morePanel > header small { font-family: var(--vm-font) !important; font-size: 10px !important; letter-spacing: .18em !important; color: var(--vm-gold) !important; }
body.vey-renewal #morePanel > header h2 { font-family: var(--vm-display) !important; font-size: 24px !important; color: var(--vm-gold-hi) !important; -webkit-text-fill-color: currentColor; background: none !important; }
body.vey-renewal #morePanel .vey-sheet-close {
  width: 40px !important; height: 40px !important; min-height: 40px !important; border-radius: 50% !important;
  background: rgba(255, 255, 255, .05) !important; border: 1px solid var(--vm-line-strong) !important; color: var(--vm-gold-hi) !important; font-size: 20px !important;
}
body.vey-renewal #morePanel section { padding: 6px 16px 10px !important; border: 0 !important; background: none !important; }
body.vey-renewal #morePanel section h3 {
  font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 11px !important;
  letter-spacing: .16em !important; text-transform: uppercase !important; color: var(--vm-gold) !important;
  margin: 8px 2px 10px !important; display: flex; align-items: center; gap: 10px;
}
body.vey-renewal #morePanel section h3::before { display: none !important; }
body.vey-renewal #morePanel section h3::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, rgba(232, 196, 128, .3), transparent); }
body.vey-renewal #morePanel section > div { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
body.vey-renewal #morePanel section > div > button {
  display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-end !important;
  gap: 6px !important; min-height: 92px !important; height: auto !important; padding: 10px 6px 10px !important;
  border-radius: 16px !important; border: 1px solid var(--vm-line) !important;
  background:
    var(--vm-tile, url("./assets/navigation/relics-v2/ui/citadel-relic.webp")) center 10px / 44px 44px no-repeat,
    radial-gradient(circle at 50% 28%, rgba(232, 196, 128, .14), transparent 60%),
    linear-gradient(180deg, rgba(28, 30, 44, .9), rgba(14, 15, 22, .95)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
  font-family: var(--vm-font) !important; font-weight: 700 !important; font-size: 12px !important;
  letter-spacing: 0 !important; text-transform: none !important; color: var(--vm-text) !important; text-align: center !important;
  line-height: 1.2 !important;
}
body.vey-renewal #morePanel section > div > button::before, body.vey-renewal #morePanel section > div > button::after { display: none !important; }
body.vey-renewal #morePanel section > div > button:is(.active, [aria-current="page"]) {
  border-color: rgba(232, 196, 128, .55) !important; color: var(--vm-gold-hi) !important;
  box-shadow: 0 0 0 1px rgba(232, 196, 128, .3), 0 10px 22px -12px rgba(232, 196, 128, .6) !important;
}
body.vey-renewal #morePanel section > div > button:active { transform: scale(.97); }
@media (max-width: 760px) {
  body.vey-renewal #view .collection-heading { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; }
  body.vey-renewal #view .collection-heading h1 { white-space: normal !important; }
}

/* =====================================================================
   KAMPF · Arena-Inszenierung (Stufe 3)
   ===================================================================== */
html body.vey-renewal[data-view="combat"] #currentObjective,
html body.vey-renewal[data-view="combat"] #view > details.active-benefits { display: none !important; }

/* Werkzeugleiste kompakt */
html body.vey-renewal #view .combat-toolbar {
  border-radius: 18px !important; padding: 10px 14px !important;
  background: rgba(12, 13, 20, .75) !important; border: 1px solid var(--vm-line) !important;
  backdrop-filter: blur(10px);
}
html body.vey-renewal #view .combat-current-status { font-family: var(--vm-font) !important; font-size: 14px !important; font-weight: 700 !important; color: var(--vm-text) !important; }
html body.vey-renewal #view .combat-speed-buttons button { border-radius: 10px !important; min-width: 40px !important; font-family: var(--vm-font) !important; font-weight: 800 !important; }

/* Bühne */
html body.vey-renewal #view .combat-stage {
  min-height: clamp(520px, 66vh, 780px) !important;
  height: auto !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  isolation: isolate;
  border: 1px solid rgba(232, 196, 128, .25) !important;
  box-shadow: 0 40px 80px -40px #000, inset 0 0 120px rgba(0, 0, 0, .55) !important;
}
html body.vey-renewal #view .combat-stage::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background:
    radial-gradient(ellipse 70% 30% at 50% 92%, rgba(232, 196, 128, .16), transparent 70%),
    radial-gradient(ellipse 120% 90% at 50% 40%, transparent 55%, rgba(0, 0, 0, .65) 100%);
}
html body.vey-renewal #view .combat-stage .combat-backdrop { filter: brightness(.85) saturate(1.15) !important; }
html body.vey-renewal #view .combat-stage__top { position: absolute !important; top: 16px; left: 0; right: 0; justify-content: center !important; z-index: 6; }
html body.vey-renewal #view .combat-stage__top [data-combat-round] {
  font-family: var(--vm-display) !important; font-size: 15px !important; letter-spacing: .2em !important;
  padding: 8px 20px !important; border-radius: 999px !important;
  background: rgba(8, 9, 14, .7) !important; border: 1px solid rgba(232, 196, 128, .45) !important; color: var(--vm-gold-hi) !important;
  box-shadow: 0 8px 24px -10px #000 !important;
}

/* Kämpfer groß, unten verankert */
html body.vey-renewal #view .combat-stage .combatants {
  position: absolute !important; inset: 64px 4% 118px 4% !important; height: auto !important;
  display: grid !important; grid-template-columns: 1fr 90px 1fr !important; align-items: end !important; z-index: 3;
}
html body.vey-renewal #view .combat-stage .combatant { height: 100% !important; min-height: 0 !important; position: relative !important; }
html body.vey-renewal #view .combat-stage .combatant-art {
  position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important;
  background-repeat: no-repeat !important; background-position: center bottom !important; background-size: contain !important;
  border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  transform-origin: 50% 100%;
  filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .75)) drop-shadow(0 0 1px rgba(255, 255, 255, .2));
  animation: vm-breathe 3.2s ease-in-out infinite !important;
}
html body.vey-renewal #view .combat-stage .enemy-art { animation-delay: -1.4s !important; }
html body.vey-renewal #view .combat-stage:not(.vm-enemy-cutout) .enemy-art {
  -webkit-mask-image: radial-gradient(ellipse 58% 62% at 50% 52%, #000 48%, transparent 78%);
  mask-image: radial-gradient(ellipse 58% 62% at 50% 52%, #000 48%, transparent 78%);
  background-size: cover !important; background-position: center 30% !important;
}
html body.vey-renewal #view .combat-stage.vm-enemy-cutout .enemy-art { transform: scaleX(1); }
html body.vey-renewal #view .combat-stage .combatant::after {
  content: ""; position: absolute; left: 15%; right: 15%; bottom: -10px; height: 26px; border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, .7), transparent 70%); z-index: -1;
}
html body.vey-renewal #view .combat-stage .combatant-aura {
  position: absolute !important; inset: 20% 10% 0 10% !important; border-radius: 50% !important;
  background: radial-gradient(circle at 50% 70%, color-mix(in srgb, var(--hero-accent, #e3bd74) 35%, transparent), transparent 65%) !important;
  filter: blur(14px); opacity: .7;
}
html body.vey-renewal #view .combat-stage .enemy-combatant .combatant-aura { background: radial-gradient(circle at 50% 70%, rgba(220, 70, 70, .35), transparent 65%) !important; }
html body.vey-renewal #view .combat-stage .combat-nameplate,
html body.vey-renewal #view .combat-stage .combat-equipment { display: none !important; }
html body.vey-renewal #view .combat-stage .combat-impact {
  align-self: center !important; font-family: var(--vm-display) !important; font-size: 40px !important;
  color: rgba(248, 226, 173, .85) !important; text-shadow: 0 0 24px rgba(232, 196, 128, .8) !important; background: none !important; border: 0 !important;
}

/* Angriff: Ausfallschritt + Treffer */
html body.vey-renewal #view .combat-stage.hero-strike .hero-combatant { animation: vm-lunge-right calc(420ms / var(--combat-speed, 1)) cubic-bezier(.2, .9, .3, 1) both; }
html body.vey-renewal #view .combat-stage.enemy-strike .enemy-combatant { animation: vm-lunge-left calc(420ms / var(--combat-speed, 1)) cubic-bezier(.2, .9, .3, 1) both; }
html body.vey-renewal #view .combat-stage.hero-strike .enemy-art { animation: vm-hit-right calc(380ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; }
html body.vey-renewal #view .combat-stage.enemy-strike .hero-art { animation: vm-hit-left calc(380ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; }
html body.vey-renewal #view .combat-stage.heal-impact .hero-art { filter: drop-shadow(0 0 22px rgba(108, 240, 169, .8)) !important; }
html body.vey-renewal #view .combat-stage.block-impact .hero-art { filter: drop-shadow(0 0 26px rgba(111, 214, 224, .9)) !important; }

/* Krit-Blitz */
html body.vey-renewal #view .combat-stage.critical-impact::before {
  content: ""; position: absolute; inset: 0; z-index: 5; pointer-events: none;
  background: radial-gradient(circle at 70% 45%, rgba(255, 220, 140, .55), transparent 55%);
  animation: vm-flash calc(380ms / var(--combat-speed, 1)) ease-out both;
}
html body.vey-renewal #view .combat-stage.enemy-strike.critical-impact::before { background: radial-gradient(circle at 30% 45%, rgba(255, 90, 90, .5), transparent 55%); }
html body.vey-renewal #view .combat-stage.vm-shake-small .combatants { animation: vm-shake-s 300ms linear both; }
html body.vey-renewal #view .combat-stage.vm-shake-big .combatants, html body.vey-renewal #view .combat-stage.vm-shake-big .combat-backdrop { animation: vm-shake-b 460ms linear both; }

/* Schadenszahlen */
html body.vey-renewal #view .combat-damage-layer { z-index: 7 !important; pointer-events: none; }
html body.vey-renewal #view .combat-damage-layer .floating-damage {
  position: absolute !important; top: 30% !important; transform: translateX(-50%);
  font-family: var(--vm-display) !important; font-weight: 700 !important; font-size: clamp(42px, 4.6vw, 70px) !important;
  line-height: 1 !important; letter-spacing: .01em !important; white-space: nowrap; text-align: center;
  color: #fff !important; background: none !important; border: 0 !important; padding: 0 !important;
  -webkit-text-stroke: 2px rgba(0, 0, 0, .65);
  text-shadow: 0 4px 0 rgba(0, 0, 0, .6), 0 0 24px rgba(0, 0, 0, .9) !important;
  animation: vm-damage-pop calc(900ms / var(--combat-speed, 1)) cubic-bezier(.2, 1.4, .4, 1) both !important;
}
html body.vey-renewal #view .combat-damage-layer .floating-damage.player { left: 74% !important; right: auto !important; }
html body.vey-renewal #view .combat-damage-layer .floating-damage.enemy { left: 26% !important; right: auto !important; color: #ff8b8b !important; }
html body.vey-renewal #view .combat-damage-layer .floating-damage.critical {
  font-size: clamp(60px, 6.4vw, 100px) !important;
  background: linear-gradient(180deg, #fff6d6 10%, #ffd36b 50%, #e08a1e 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 2px rgba(60, 30, 0, .7);
  filter: drop-shadow(0 0 22px rgba(255, 190, 80, .8));
  animation: vm-crit-pop calc(1000ms / var(--combat-speed, 1)) cubic-bezier(.2, 1.6, .4, 1) both !important;
}
html body.vey-renewal #view .combat-damage-layer .floating-damage small {
  display: block !important; font-family: var(--vm-font) !important; font-weight: 900 !important;
  font-size: .3em !important; letter-spacing: .3em !important; -webkit-text-stroke: 0; color: var(--vm-gold-hi) !important; -webkit-text-fill-color: var(--vm-gold-hi);
  margin-bottom: 4px;
}
html body.vey-renewal #view .combat-damage-layer .floating-damage.heal { color: #8dffbe !important; }
html body.vey-renewal #view .combat-damage-layer .floating-damage.heal.player-heal { left: 26% !important; }
html body.vey-renewal #view .combat-damage-layer .floating-damage.block { color: #9fe8f0 !important; font-size: clamp(34px, 3.4vw, 52px) !important; }
html body.vey-renewal #view .combat-damage-layer .floating-damage.dodge { color: #e8ecff !important; font-style: italic; font-size: clamp(30px, 3vw, 46px) !important; left: 26% !important; }
html body.vey-renewal #view .combat-damage-layer .floating-reduction {
  position: absolute !important; left: 26% !important; top: 52% !important; transform: translateX(-50%);
  font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 14px !important; color: #9fe8f0 !important;
  background: rgba(8, 9, 14, .7) !important; padding: 4px 10px !important; border-radius: 999px !important; border: 1px solid rgba(111, 214, 224, .4) !important;
}
/* Sieg / Niederlage */
html body.vey-renewal #view .combat-damage-layer .combat-outcome-title {
  position: absolute !important; inset: 0 !important; display: grid !important; place-content: center !important; text-align: center;
  font-family: var(--vm-display) !important; font-size: clamp(64px, 9vw, 140px) !important; font-weight: 700 !important; letter-spacing: .12em !important;
  background: radial-gradient(ellipse 60% 40% at 50% 50%, rgba(0, 0, 0, .55), transparent 75%) !important; border: 0 !important;
  color: #ffe7a6 !important; text-shadow: 0 0 40px rgba(255, 200, 90, .9), 0 6px 0 rgba(0, 0, 0, .6) !important;
  animation: vm-outcome 900ms cubic-bezier(.2, 1.3, .4, 1) both !important;
}
html body.vey-renewal #view .combat-stage.combat-defeat .combat-outcome-title { color: #ff9a9a !important; text-shadow: 0 0 40px rgba(220, 40, 40, .8), 0 6px 0 #000 !important; }
html body.vey-renewal #view .combat-damage-layer .combat-outcome-title small { font-size: .22em !important; letter-spacing: .3em !important; color: var(--vm-text) !important; }

/* Lebensbalken */
html body.vey-renewal #view .combat-stage .combat-vitals {
  position: absolute !important; left: 4% !important; right: 4% !important; bottom: 22px !important; z-index: 6;
  grid-template-columns: 1fr 1fr !important; gap: 8% !important;
}
html body.vey-renewal #view .combat-stage .combat-vital {
  padding: 10px 14px !important; border-radius: 16px !important;
  background: rgba(8, 9, 14, .72) !important; border: 1px solid var(--vm-line) !important; backdrop-filter: blur(8px);
}
html body.vey-renewal #view .combat-stage .combat-vital > b { display: flex !important; justify-content: space-between; align-items: baseline; gap: 8px; }
html body.vey-renewal #view .combat-stage .combat-vital > b > span { font-family: var(--vm-display) !important; font-size: 16px !important; color: var(--vm-gold-hi) !important; }
html body.vey-renewal #view .combat-stage .combat-vital > b > small { font-family: var(--vm-font) !important; font-size: 11px !important; color: var(--vm-muted) !important; }
html body.vey-renewal #view .combat-stage .combat-hp {
  position: relative !important; height: 14px !important; margin: 7px 0 5px !important; border-radius: 999px !important;
  background: rgba(255, 255, 255, .07) !important; overflow: hidden !important; border: 1px solid rgba(0, 0, 0, .6) !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, .6) !important;
}
html body.vey-renewal #view .combat-stage .combat-hp > span {
  position: absolute !important; inset: 0 auto 0 0 !important; height: 100% !important; border-radius: 999px !important;
  background: rgba(255, 240, 200, .55) !important; transition: width .9s ease .25s !important; z-index: 1;
}
html body.vey-renewal #view .combat-stage .combat-hp > i {
  position: absolute !important; inset: 0 auto 0 0 !important; height: 100% !important; border-radius: 999px !important; z-index: 2;
  background: linear-gradient(180deg, #7ff0c8, #2fb98a 60%, #1d8a67) !important;
  box-shadow: 0 0 12px rgba(80, 230, 170, .6) !important; transition: width .22s ease !important;
}
html body.vey-renewal #view .combat-stage .combat-hp.enemy > i {
  background: linear-gradient(180deg, #ff8a7a, #d33b3b 60%, #8e1f24) !important; box-shadow: 0 0 12px rgba(230, 70, 70, .6) !important;
}
html body.vey-renewal #view .combat-stage .combat-vital em { font-style: normal !important; font-family: var(--vm-font) !important; font-size: 12px !important; font-weight: 700 !important; color: var(--vm-text) !important; }

/* Fähigkeits-Banner oben mittig statt über dem Gegner */
html body.vey-renewal #view .combat-stage .skill-banner {
  top: 62px !important; left: 50% !important; right: auto !important; transform: translateX(-50%) !important;
  width: auto !important; max-width: 70% !important; height: auto !important; z-index: 6;
  padding: 8px 18px 8px 8px !important; border-radius: 999px !important;
  background: rgba(8, 9, 14, .8) !important; border: 1px solid rgba(232, 196, 128, .45) !important;
  box-shadow: 0 12px 30px -12px #000 !important; animation: vm-banner calc(380ms / var(--combat-speed, 1)) ease-out both;
}
html body.vey-renewal #view .combat-stage .skill-banner small { font-family: var(--vm-font) !important; font-size: 10px !important; letter-spacing: .16em !important; color: var(--vm-gold) !important; }
html body.vey-renewal #view .combat-stage .skill-banner b { font-family: var(--vm-display) !important; font-size: 18px !important; color: var(--vm-gold-hi) !important; }
html body.vey-renewal #view .combat-stage .skill-banner.tone-enemy b, html body.vey-renewal #view .combat-stage .skill-banner[class*="enemy"] b { color: #ffb1a8 !important; }

/* Funken, Kombo */
html body.vey-renewal #view .vm-sparks { position: absolute; top: 44%; width: 0; height: 0; z-index: 7; pointer-events: none; }
html body.vey-renewal #view .vm-sparks.on-enemy { left: 74%; }
html body.vey-renewal #view .vm-sparks.on-hero { left: 26%; }
html body.vey-renewal #view .vm-sparks i {
  position: absolute; width: var(--size); height: var(--size); border-radius: 50%;
  background: #fff; box-shadow: 0 0 10px 2px currentColor; color: #ffe2a0;
  animation: vm-spark 700ms cubic-bezier(.1, .7, .3, 1) both;
}
html body.vey-renewal #view .vm-sparks.tone-gold i { background: #fff3c4; color: #ffb52e; }
html body.vey-renewal #view .vm-sparks.tone-blood i { background: #ffd0d0; color: #ff3b3b; }
html body.vey-renewal #view .vm-sparks.tone-heal i { background: #d8ffe9; color: #3dffa0; }
html body.vey-renewal #view .vm-sparks.tone-ward i { background: #e0fbff; color: #45d8f0; }
html body.vey-renewal #view .vm-combo {
  position: absolute; right: 5%; top: 16px; z-index: 6; display: grid; justify-items: end; line-height: 1;
  animation: vm-banner 300ms ease-out both;
}
html body.vey-renewal #view .vm-combo b { font-family: var(--vm-display); font-size: 40px; color: #ffe7a6; text-shadow: 0 0 18px rgba(255, 190, 80, .8), 0 3px 0 #000; }
html body.vey-renewal #view .vm-combo small { font-family: var(--vm-font); font-weight: 900; font-size: 11px; letter-spacing: .3em; color: var(--vm-gold); }

@keyframes vm-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.018, 1.012); } }
@keyframes vm-lunge-right { 0% { transform: none; } 35% { transform: translateX(9%) scale(1.03); } 100% { transform: none; } }
@keyframes vm-lunge-left { 0% { transform: none; } 35% { transform: translateX(-9%) scale(1.03); } 100% { transform: none; } }
@keyframes vm-hit-right { 0% { filter: brightness(1); transform: none; } 25% { filter: brightness(1.7) saturate(.8); transform: translateX(4%) rotate(1.5deg); } 100% { filter: brightness(1); transform: none; } }
@keyframes vm-hit-left { 0% { filter: brightness(1); transform: none; } 25% { filter: brightness(2.2) sepia(.6) hue-rotate(-30deg); transform: translateX(-4%) rotate(-1.5deg); } 100% { filter: brightness(1); transform: none; } }
@keyframes vm-flash { 0% { opacity: 0; } 15% { opacity: 1; } 100% { opacity: 0; } }
@keyframes vm-shake-s { 0%, 100% { transform: none; } 20% { transform: translate(-4px, 2px); } 40% { transform: translate(4px, -2px); } 60% { transform: translate(-3px, 1px); } 80% { transform: translate(2px, 0); } }
@keyframes vm-shake-b { 0%, 100% { transform: none; } 10% { transform: translate(-10px, 4px) rotate(-.4deg); } 25% { transform: translate(9px, -5px) rotate(.4deg); } 40% { transform: translate(-7px, 3px); } 60% { transform: translate(5px, -2px); } 80% { transform: translate(-2px, 1px); } }
@keyframes vm-damage-pop { 0% { opacity: 0; transform: translate(-50%, 20px) scale(.4); } 18% { opacity: 1; transform: translate(-50%, -6px) scale(1.18); } 30% { transform: translate(-50%, -10px) scale(1); } 80% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -70px) scale(.95); } }
@keyframes vm-crit-pop { 0% { opacity: 0; transform: translate(-50%, 10px) scale(.3) rotate(-8deg); } 16% { opacity: 1; transform: translate(-50%, -10px) scale(1.4) rotate(3deg); } 30% { transform: translate(-50%, -14px) scale(1) rotate(0); } 82% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -90px) scale(1); } }
@keyframes vm-outcome { 0% { opacity: 0; transform: scale(2.2); letter-spacing: .5em; } 60% { opacity: 1; transform: scale(.96); } 100% { transform: scale(1); } }
@keyframes vm-dissolve { 0% { opacity: 1; filter: brightness(1); } 30% { filter: brightness(2.5) saturate(0); } 100% { opacity: 0; filter: brightness(3) blur(6px); transform: translateY(-20px) scale(1.05); } }
@keyframes vm-banner { from { opacity: 0; transform: translate(-50%, -10px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes vm-spark { 0% { opacity: 1; transform: translate(0, 0) scale(1.2); } 100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.2); } }

@media (prefers-reduced-motion: reduce) {
  html body.vey-renewal #view .combat-stage .combatant-art,
  html body.vey-renewal #view .combat-stage .combatant { animation: none !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage { min-height: 520px !important; border-radius: 20px !important; }
  html body.vey-renewal #view .combat-stage .combatants { inset: 70px 2% 150px 2% !important; grid-template-columns: 1fr 30px 1fr !important; }
  html body.vey-renewal #view .combat-stage .combat-impact { font-size: 22px !important; }
  html body.vey-renewal #view .combat-stage .combat-vitals { grid-template-columns: 1fr !important; gap: 6px !important; bottom: 12px !important; left: 3% !important; right: 3% !important; }
  html body.vey-renewal #view .combat-stage .combat-vital { padding: 7px 10px !important; }
  html body.vey-renewal #view .combat-stage .combat-hp { height: 10px !important; margin: 4px 0 2px !important; }
  html body.vey-renewal #view .combat-stage .skill-banner { max-width: 92% !important; top: 58px !important; }
  html body.vey-renewal #view .combat-stage .skill-banner b { font-size: 14px !important; }
  html body.vey-renewal #view .vm-combo b { font-size: 28px; }
}
/* Kampf passt in den Bildschirm: Bühne = Restfläche, Aktionsverlauf als schmale Leiste */
@media (min-width: 761px) {
  html body.vey-renewal #view .combat-stage { min-height: 460px !important; height: max(460px, calc(100dvh - 390px)) !important; }
}
html body.vey-renewal #view .combat-toolbar .combat-action-deck { min-height: 0 !important; max-height: 50px !important; padding: 4px !important; overflow: hidden !important; }
html body.vey-renewal #view .combat-toolbar .combat-action-deck > header small { display: none !important; }
html body.vey-renewal #view .combat-toolbar .combat-action-deck .combat-action { min-height: 40px !important; padding: 4px 8px !important; border-radius: 10px !important; }
html body.vey-renewal #view .combat-result-grid { z-index: 8; }
/* Kämpfer größer, Szene heller */
html body.vey-renewal #view .combat-stage .combatants { inset: 40px 6% 104px 6% !important; }
html body.vey-renewal #view .combat-stage .combatant-art { inset: -6% -14% 0 -14% !important; width: auto !important; height: auto !important; background-size: auto 100% !important; }
html body.vey-renewal #view .combat-stage.vm-enemy-cutout .enemy-art { background-size: auto 96% !important; filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .75)) brightness(1.12) contrast(1.05) !important; }
html body.vey-renewal #view .combat-stage .hero-art { filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .75)) brightness(1.1) !important; }
html body.vey-renewal #view .combat-stage .combat-backdrop { filter: brightness(1.05) saturate(1.2) !important; }
html body.vey-renewal #view .combat-stage::after {
  background:
    radial-gradient(ellipse 70% 26% at 50% 94%, rgba(232, 196, 128, .18), transparent 70%),
    radial-gradient(ellipse 130% 100% at 50% 40%, transparent 62%, rgba(0, 0, 0, .55) 100%) !important;
}
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage .combatants { inset: 70px 0 150px 0 !important; }
  html body.vey-renewal #view .combat-stage .combatant-art { inset: 0 -20% 0 -20% !important; }
}
/* Dauerhaftes Ergebnis-Banner + Zerfall des Gegners */
html body.vey-renewal #view .combat-stage.vm-finished .combat-impact { font-size: 0 !important; }
html body.vey-renewal #view .combat-stage.vm-finished .combat-impact::after {
  font-family: var(--vm-display); font-size: clamp(44px, 5.4vw, 84px); letter-spacing: .14em; display: block;
  animation: vm-outcome 900ms cubic-bezier(.2, 1.3, .4, 1) both;
}
html body.vey-renewal #view .combat-stage.vm-victory .combat-impact::after { content: "VICTORY"; color: #ffe7a6; text-shadow: 0 0 40px rgba(255, 200, 90, .9), 0 5px 0 rgba(0, 0, 0, .6); }
html body.vey-renewal #view .combat-stage.vm-defeat .combat-impact::after { content: "DEFEAT"; font-size: clamp(30px, 3.4vw, 54px); color: #ff9a9a; text-shadow: 0 0 36px rgba(220, 40, 40, .8), 0 5px 0 #000; }
html body.vey-renewal #view .combat-stage.vm-victory .enemy-art { animation: vm-dissolve 1.6s ease-in both !important; }
html body.vey-renewal #view .combat-stage.vm-victory .hero-art { filter: drop-shadow(0 0 28px rgba(255, 210, 120, .55)) brightness(1.15) !important; }
html body.vey-renewal #view .combat-stage.vm-defeat .hero-art { filter: grayscale(.85) brightness(.55) drop-shadow(0 18px 24px #000) !important; transform: rotate(-4deg) translateY(4%); }
html body.vey-renewal #view .combat-stage.vm-defeat .enemy-art { filter: drop-shadow(0 0 30px rgba(220, 50, 50, .6)) brightness(1.15) !important; }
html body.vey-renewal #view .combat-stage.vm-finished:not(.vm-victory):not(.vm-defeat) .hero-art { filter: none; }
html body.vey-renewal #view .combat-screen.combat-outcome .combat-impact,
html body.vey-renewal #view .combat-screen.boss-death-moment .combat-impact { opacity: 0 !important; }
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage { min-height: 560px !important; height: 560px !important; }
  html body.vey-renewal #view .combat-stage .combatants { inset: 58px 0 122px 0 !important; }
  html body.vey-renewal #view .combat-stage .combat-vitals { gap: 5px !important; bottom: 10px !important; }
  html body.vey-renewal #view .combat-stage .combat-vital { padding: 6px 10px !important; border-radius: 12px !important; display: grid !important; grid-template-columns: 1fr auto; column-gap: 8px; align-items: center; }
  html body.vey-renewal #view .combat-stage .combat-vital > b { grid-column: 1; }
  html body.vey-renewal #view .combat-stage .combat-vital > b > span { font-size: 13px !important; }
  html body.vey-renewal #view .combat-stage .combat-vital > b > small { display: none !important; }
  html body.vey-renewal #view .combat-stage .combat-vital em { grid-column: 2; grid-row: 1; font-size: 11px !important; }
  html body.vey-renewal #view .combat-stage .combat-hp { grid-column: 1 / -1; height: 9px !important; margin: 3px 0 0 !important; }
  html body.vey-renewal #view .combat-stage .combat-status-row { display: none !important; }
  html body.vey-renewal #view .combat-damage-layer .floating-damage { top: 26% !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage .combat-vital { min-height: 0 !important; height: auto !important; }
  html body.vey-renewal #view .combat-stage .combat-vital > * { margin-top: 0 !important; margin-bottom: 0 !important; }
  html body.vey-renewal #view .combat-damage-layer .floating-damage { top: 44% !important; }
  html body.vey-renewal #view .combat-stage__top [data-combat-round] { font-size: 12px !important; padding: 6px 14px !important; }
  html body.vey-renewal #view .combat-stage .skill-banner { top: 52px !important; }
}

/* =====================================================================
   ANMELDUNG / REGISTRIERUNG
   ===================================================================== */
html body.vey-renewal #authLayer.signup-mode,
html body.vey-renewal #authLayer.login-mode {
  min-height: 100dvh !important;
  background:
    radial-gradient(900px 600px at 25% 60%, rgba(232, 196, 128, .12), transparent 65%),
    linear-gradient(100deg, rgba(8, 9, 14, .35), rgba(8, 9, 14, .78) 55%, rgba(8, 9, 14, .92)),
    url("./assets/landing-v2/eternal-citadel-gateway-4k.webp") center / cover no-repeat !important;
}
html body.vey-renewal #authLayer :is(input[type="text"], input[type="email"], input[type="password"], input:not([type])) {
  font-family: var(--vm-font) !important; font-size: 16px !important;
  min-height: 48px !important; height: 48px !important; padding: 0 14px !important;
  border-radius: 12px !important; border: 1px solid rgba(232, 196, 128, .22) !important;
  background: rgba(6, 7, 11, .7) !important; color: var(--vm-text) !important; box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
html body.vey-renewal #authLayer input:focus { border-color: var(--vm-gold) !important; box-shadow: 0 0 0 3px rgba(232, 196, 128, .18) !important; outline: none !important; }
html body.vey-renewal #authLayer label > span, html body.vey-renewal #authLayer #authIdentityLabel, html body.vey-renewal #authLayer #authPasswordLabel {
  font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 11px !important; letter-spacing: .12em !important;
  text-transform: uppercase !important; color: var(--vm-gold) !important;
}
html body.vey-renewal #authLayer .auth-card h1 { font-family: var(--vm-display) !important; color: var(--vm-gold-hi) !important; }
html body.vey-renewal #authLayer .auth-switch, html body.vey-renewal #authLayer .auth-back { font-family: var(--vm-font) !important; color: var(--vm-gold-hi) !important; }

@media (min-width: 1000px) {
  html body.vey-renewal #authLayer.signup-mode { display: flex !important; align-items: center !important; justify-content: flex-end !important; padding: 20px 6vw !important; overflow-y: auto !important; }
  html body.vey-renewal #authLayer.signup-mode #authForm.auth-card {
    width: min(580px, 46vw) !important; max-width: none !important; margin: 0 !important;
    max-height: calc(100dvh - 40px); overflow-y: auto; position: relative; z-index: 2;
    padding: 30px 32px !important; border-radius: 24px !important;
    border: 1px solid transparent !important;
    background:
      linear-gradient(180deg, rgba(18, 19, 29, .94), rgba(9, 10, 16, .96)) padding-box,
      var(--vm2-edge) border-box !important;
    box-shadow: 0 40px 90px -30px #000 !important;
  }
  html body.vey-renewal #authLayer.signup-mode #authForm :is(.auth-hero-name, .auth-invite, .auth-email, .auth-password) { width: auto !important; }
  /* Der gewählte Held groß links */
  html body.vey-renewal #authLayer.signup-mode #authClassConfirm > i {
    position: fixed !important; left: 3vw; bottom: 0; top: auto !important;
    width: 46vw !important; height: 94dvh !important; z-index: 1; pointer-events: none;
    background-size: 0 0, contain !important; background-position: center, center bottom !important; background-repeat: no-repeat !important;
    border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
    filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .8)) drop-shadow(0 0 60px rgba(232, 196, 128, .18));
    animation: vm-breathe 4s ease-in-out infinite;
  }
  html body.vey-renewal #authLayer.signup-mode #authClassConfirm { padding-left: 16px !important; grid-template-columns: 1fr auto !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #authLayer.signup-mode, html body.vey-renewal #authLayer.login-mode { padding: 0 !important; display: block !important; }
  html body.vey-renewal #authLayer.signup-mode #authForm.auth-card,
  html body.vey-renewal #authLayer.login-mode #authForm.auth-card {
    width: 100% !important; max-width: none !important; min-height: 100dvh !important; margin: 0 !important;
    border-radius: 0 !important; border: 0 !important; padding: 28px 18px 40px !important;
    background: linear-gradient(180deg, rgba(10, 11, 17, .55), rgba(10, 11, 17, .92) 30%, rgba(8, 9, 14, .97)) !important;
  }
  html body.vey-renewal #authLayer.signup-mode #authClassConfirm > i { width: 74px !important; height: 92px !important; background-size: 0 0, cover !important; background-position: center, center 15% !important; border-radius: 14px !important; }
}
@media (min-width: 1000px) {
  html body.vey-renewal #authLayer.signup-mode #authForm.auth-card { transform: none !important; animation: none !important; margin-left: auto !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #authLayer.signup-mode #authForm.auth-card,
  html body.vey-renewal #authLayer.login-mode #authForm.auth-card { background: linear-gradient(180deg, rgba(10, 11, 17, .35), rgba(10, 11, 17, .8) 35%, rgba(10, 11, 17, .88)) !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #authLayer #authForm.auth-card.signup { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; align-content: start; }
  html body.vey-renewal #authLayer #authForm.auth-card.signup > *:not(.experience-honeypot) { grid-column: 1 / -1 !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
  html body.vey-renewal #authLayer #authClassConfirm { display: grid !important; grid-template-columns: 64px 1fr auto !important; gap: 12px !important; align-items: center !important; padding: 10px !important; border-radius: 16px !important; }
  html body.vey-renewal #authLayer.signup-mode #authClassConfirm > i { position: static !important; width: 64px !important; height: 80px !important; }
  html body.vey-renewal #authLayer #authClassConfirm > span { min-width: 0; }
  html body.vey-renewal #authLayer #authRegisterProgress { display: none !important; }
  html body.vey-renewal #authLayer #authForm.auth-card h1 { font-size: 28px !important; line-height: 1.1 !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #authLayer #authForm.auth-card.signup { grid-template-rows: none !important; grid-auto-rows: auto !important; grid-template-areas: none !important; }
  html body.vey-renewal #authLayer #authForm.auth-card.signup > *:not(.experience-honeypot) { grid-row: auto !important; grid-area: auto !important; position: relative !important; inset: auto !important; }
  html body.vey-renewal #authLayer #authClassConfirm { height: auto !important; min-height: 0 !important; }
  html body.vey-renewal #authLayer #authForm.auth-card.signup > label { gap: 6px !important; }
}

/* =====================================================================
   STARTWAFFEN-AUSWAHL
   ===================================================================== */
html body.vey-renewal #view .starter-forge {
  border-radius: 24px !important; padding: 26px !important; border: 1px solid transparent !important;
  background:
    radial-gradient(700px 300px at 50% 0%, rgba(232, 196, 128, .12), transparent 70%),
    linear-gradient(180deg, rgba(18, 19, 29, .94), rgba(9, 10, 16, .96)) padding-box,
    var(--vm2-edge) border-box !important;
}
html body.vey-renewal #view .starter-forge > header { text-align: center; max-width: 760px; margin: 0 auto 22px !important; }
html body.vey-renewal #view .starter-forge > header h2 { font-size: clamp(26px, 3vw, 40px) !important; }
html body.vey-renewal #view .starter-forge-grid { gap: 14px !important; }
html body.vey-renewal #view .starter-weapon {
  padding: 18px 14px 16px !important; border-radius: 20px !important;
  border: 1px solid color-mix(in srgb, var(--relic-color) 40%, rgba(255, 255, 255, .06)) !important;
  background:
    radial-gradient(circle at 50% 14%, color-mix(in srgb, var(--relic-color) 16%, transparent), transparent 34%),
    linear-gradient(180deg, rgba(22, 24, 35, .96), rgba(10, 11, 17, .98)) !important;
  box-shadow: 0 20px 40px -26px #000, inset 0 1px 0 rgba(255, 255, 255, .05) !important;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
html body.vey-renewal #view .starter-weapon:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--relic-color) 80%, white 10%) !important;
  box-shadow: 0 30px 50px -26px #000, 0 0 30px -8px color-mix(in srgb, var(--relic-color) 70%, transparent) !important;
}
html body.vey-renewal #view .starter-weapon .item-slot { width: 112px !important; height: 112px !important; border-radius: 22px !important; }
html body.vey-renewal #view .starter-weapon .item-slot img { width: 92px !important; height: 92px !important; }
html body.vey-renewal #view .starter-weapon > small { font-family: var(--vm-font) !important; font-weight: 800 !important; font-size: 10.5px !important; letter-spacing: .1em !important; text-align: center; }
html body.vey-renewal #view .starter-weapon h3 { font-family: var(--vm-display) !important; font-size: 16px !important; line-height: 1.25 !important; color: var(--vm-text) !important; min-height: 40px !important; }
html body.vey-renewal #view .starter-weapon .starter-roll {
  display: grid !important; justify-items: center; gap: 0 !important; margin: 6px 0 10px !important;
  padding: 8px 18px !important; border-radius: 14px !important; background: rgba(255, 255, 255, .04) !important; border: 1px solid var(--vm-line) !important;
}
html body.vey-renewal #view .starter-weapon .starter-roll b { font-family: var(--vm-display) !important; font-size: 26px !important; color: var(--vm-gold-hi) !important; }
html body.vey-renewal #view .starter-weapon .starter-roll span { font-size: 9.5px !important; letter-spacing: .16em !important; color: var(--vm-muted) !important; }
html body.vey-renewal #view .starter-weapon ul { font-family: var(--vm-font) !important; font-size: 12.5px !important; color: var(--vm-muted) !important; }
html body.vey-renewal #view .starter-weapon ul li { padding: 3px 0 !important; border-bottom: 1px solid rgba(255, 255, 255, .04); }
html body.vey-renewal #view .starter-weapon ul li.implicit { color: var(--vm-gold-hi) !important; }
html body.vey-renewal #view .starter-weapon .button {
  width: 100%; margin-top: 12px !important; background: linear-gradient(180deg, #f3d694, #c89a4f) !important; color: #1b1408 !important; border: 1px solid #f8e3b0 !important;
}
@media (max-width: 760px) {
  html body.vey-renewal #view .starter-forge { padding: 16px !important; }
  html body.vey-renewal #view .starter-forge-grid { grid-template-columns: 1fr 1fr !important; }
}

/* =====================================================================
   MISSIONEN · drei Routen als Spielkarten
   ===================================================================== */
html body.vey-renewal #view .adventure-region-artwork { filter: brightness(1.25) saturate(1.15) !important; }
html body.vey-renewal #view .expedition-duration-grid { gap: 16px !important; }
html body.vey-renewal #view .expedition-duration {
  --tier: #c9a46a;
  position: relative; overflow: hidden !important;
  min-height: 320px !important; padding: 18px !important; border-radius: 22px !important;
  border: 1px solid color-mix(in srgb, var(--tier) 45%, transparent) !important;
  box-shadow: 0 24px 50px -30px #000, inset 0 1px 0 rgba(255, 255, 255, .06) !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
  text-align: left;
}
html body.vey-renewal #view .expedition-duration:nth-child(1) { --tier: #d59a5c; }
html body.vey-renewal #view .expedition-duration:nth-child(2) { --tier: #a995ff; }
html body.vey-renewal #view .expedition-duration:nth-child(3) { --tier: #f2cf7c; }
html body.vey-renewal #view .expedition-duration {
  background-image:
    linear-gradient(180deg, rgba(8, 9, 14, 0) 0%, rgba(8, 9, 14, .25) 38%, rgba(8, 9, 14, .92) 74%),
    radial-gradient(circle at 80% 0%, color-mix(in srgb, var(--tier) 30%, transparent), transparent 55%),
    var(--route-art, none) !important;
  background-size: 100% 100%, 100% 100%, cover !important; background-position: center, center, center 35% !important; background-repeat: no-repeat !important;
}
html body.vey-renewal #view .expedition-duration:hover {
  transform: translateY(-5px);
  border-color: var(--tier) !important;
  box-shadow: 0 34px 60px -30px #000, 0 0 34px -10px var(--tier) !important;
}
html body.vey-renewal #view .expedition-duration-rune {
  position: absolute !important; top: 14px; right: 16px; left: auto !important;
  width: 40px !important; height: 40px !important; display: grid !important; place-items: center !important;
  border-radius: 12px !important; font-family: var(--vm-display) !important; font-style: normal !important; font-size: 18px !important;
  color: #120d06 !important; background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 70%, white 30%), var(--tier)) !important;
  box-shadow: 0 6px 18px -6px var(--tier) !important; border: 0 !important;
}
html body.vey-renewal #view .expedition-duration > span { display: grid !important; gap: 6px !important; align-content: end !important; height: 100%; }
html body.vey-renewal #view .expedition-duration > span > small {
  font-family: var(--vm-display) !important; font-size: 20px !important; letter-spacing: .04em !important; color: #fff6dd !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .8);
}
html body.vey-renewal #view .expedition-duration .mission-route-description { font-family: var(--vm-font) !important; font-size: 13px !important; color: rgba(239, 233, 220, .82) !important; }
html body.vey-renewal #view .expedition-duration > span > b {
  display: flex !important; align-items: baseline; gap: 10px;
  font-family: var(--vm-display) !important; font-size: 46px !important; line-height: 1 !important; color: #fff !important;
  text-shadow: 0 0 24px color-mix(in srgb, var(--tier) 60%, transparent), 0 3px 0 rgba(0, 0, 0, .5);
}
html body.vey-renewal #view .expedition-duration > span > b em {
  font-family: var(--vm-font) !important; font-style: normal !important; font-size: 11px !important; font-weight: 800 !important;
  padding: 3px 8px; border-radius: 999px; background: rgba(111, 214, 224, .14); border: 1px solid rgba(111, 214, 224, .35); color: #bff3f7 !important; text-shadow: none;
}
html body.vey-renewal #view .expedition-duration > span > u {
  text-decoration: none !important; font-family: var(--vm-font) !important; font-weight: 700 !important; font-size: 11px !important;
  letter-spacing: .08em !important; color: var(--vm-muted) !important;
}
html body.vey-renewal #view .expedition-duration > strong {
  display: flex !important; justify-content: center !important; align-items: center !important; gap: 10px !important;
  margin-top: 14px !important; min-height: 46px !important; border-radius: 14px !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 75%, white 25%), var(--tier)) !important; background-size: 100% 100% !important;
  color: #120d06 !important; font-family: var(--vm-font) !important; font-weight: 900 !important; font-size: 14px !important; letter-spacing: .14em !important;
  border: 0 !important; box-shadow: 0 10px 24px -10px var(--tier) !important;
}
html body.vey-renewal #view .expedition-duration > strong::before, html body.vey-renewal #view .expedition-duration > strong::after { display: none !important; }
html body.vey-renewal #view .expedition-duration > strong span { color: #120d06 !important; }
html body.vey-renewal #view .journey-mode .button.selected { background: linear-gradient(180deg, #f3d694, #c89a4f) !important; color: #1b1408 !important; border-color: #f8e3b0 !important; }

/* Laufende Reise: kräftiger Fortschritt, lesbare Werte */
html body.vey-renewal #view .expedition-journey.embedded > header > span small { font-size: 10.5px !important; letter-spacing: .12em !important; color: var(--vm-gold) !important; }
html body.vey-renewal #view .expedition-journey.embedded > header > span b { font-family: var(--vm-display) !important; font-size: 17px !important; color: var(--vm-text) !important; }
html body.vey-renewal #view .expedition-journey .journey-axis { gap: 12px !important; align-items: center !important; }
html body.vey-renewal #view .expedition-journey .journey-track {
  height: 14px !important; border-radius: 999px !important; overflow: visible !important; position: relative;
  background: rgba(255, 255, 255, .06) !important; border: 1px solid rgba(0, 0, 0, .6) !important; box-shadow: inset 0 2px 5px rgba(0, 0, 0, .6) !important;
}
html body.vey-renewal #view .expedition-journey .journey-track > i[data-expedition-track] {
  height: 100% !important; border-radius: 999px !important;
  background: linear-gradient(90deg, #8a6a32, #e3bd74 60%, #fff0c2) !important;
  box-shadow: 0 0 16px rgba(232, 196, 128, .7) !important;
  background-size: 200% 100% !important; animation: vm-progress-sheen 2.4s linear infinite;
}
html body.vey-renewal #view .expedition-clock b { font-size: 34px !important; color: var(--vm-gold-hi) !important; text-shadow: 0 0 22px rgba(232, 196, 128, .45); }
@keyframes vm-progress-sheen { from { background-position: 0 0; } to { background-position: -200% 0; } }

/* Klassenwahl: Emblem-Kacheln mit Klassenfarbe und Namen */
html body.vey-renewal #authLayer .landing-class-nav { gap: 8px !important; }
html body.vey-renewal #authLayer .landing-class-nav > button {
  display: grid !important; justify-items: center !important; gap: 6px !important;
  width: 66px !important; height: auto !important; min-height: 0 !important; padding: 0 !important;
  background: none !important; border: 0 !important; box-shadow: none !important; clip-path: none !important;
  cursor: pointer; transition: transform .18s ease;
}
html body.vey-renewal #authLayer .landing-class-nav > button::before, html body.vey-renewal #authLayer .landing-class-nav > button::after { display: none !important; }
html body.vey-renewal #authLayer .landing-class-nav > button > i {
  display: block !important; width: 52px !important; height: 52px !important; border-radius: 16px !important;
  background: var(--landing-emblem-art) center / 78% no-repeat, radial-gradient(circle at 50% 35%, color-mix(in srgb, var(--landing-dot-accent) 22%, transparent), rgba(10, 11, 17, .85) 70%) !important;
  border: 1px solid rgba(255, 255, 255, .1) !important; clip-path: none !important;
  filter: saturate(.6) brightness(.8); transition: filter .18s ease, box-shadow .18s ease, border-color .18s ease;
}
html body.vey-renewal #authLayer .landing-class-nav > button > span {
  position: static !important; width: auto !important; height: auto !important; clip: auto !important; overflow: visible !important;
  font-family: var(--vm-font) !important; font-weight: 700 !important; font-size: 10px !important; letter-spacing: .04em !important;
  color: var(--vm-muted) !important; white-space: nowrap; opacity: .85;
}
html body.vey-renewal #authLayer .landing-class-nav > button:hover { transform: translateY(-2px); }
html body.vey-renewal #authLayer .landing-class-nav > button:hover > i { filter: none; }
html body.vey-renewal #authLayer .landing-class-nav > button.active > i {
  filter: none; border-color: var(--landing-dot-accent) !important;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .6), 0 0 22px -2px var(--landing-dot-accent) !important;
}
html body.vey-renewal #authLayer .landing-class-nav > button.active > span { color: #fff !important; opacity: 1; }
@media (max-width: 760px) {
  html body.vey-renewal #authLayer .landing-class-nav { gap: 4px !important; }
  html body.vey-renewal #authLayer .landing-class-nav > button { width: 42px !important; }
  html body.vey-renewal #authLayer .landing-class-nav > button > i { width: 40px !important; height: 40px !important; border-radius: 12px !important; }
  html body.vey-renewal #authLayer .landing-class-nav > button > span { display: none !important; }
}

/* Gefährten im Kampf: fliegende schweben über dem Helden, Bodentiere stehen daneben */
html body.vey-renewal #view .combat-stage .combat-companion {
  position: absolute; z-index: 2; pointer-events: none; --pet-glow: rgba(232, 196, 128, .55);
}
html body.vey-renewal #view .combat-stage .combat-companion .combat-companion-art {
  position: absolute; inset: 0; display: block; background: var(--companion-art) center bottom / contain no-repeat;
  filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .7)) drop-shadow(0 0 14px var(--pet-glow));
}
html body.vey-renewal #view .combat-stage .combat-companion small {
  position: absolute; left: 50%; bottom: -18px; transform: translateX(-50%); white-space: nowrap;
  font: 600 11px/1 var(--vm-display, serif); letter-spacing: .08em; color: rgba(248, 226, 173, .8); text-shadow: 0 1px 3px #000;
}
html body.vey-renewal #view .combat-stage .combat-companion.companion-ground { right: -14%; bottom: 0; width: 40%; height: 36%; }
html body.vey-renewal #view .combat-stage .combat-companion.companion-ground .combat-companion-art { animation: vm-breathe 2.6s ease-in-out infinite; transform-origin: 50% 100%; }
html body.vey-renewal #view .combat-stage .combat-companion.companion-flying { right: -6%; top: -4%; width: 36%; height: 32%; }
html body.vey-renewal #view .combat-stage .combat-companion.companion-flying .combat-companion-art { animation: vm-pet-hover 3.4s ease-in-out infinite; }
html body.vey-renewal #view .combat-stage .combat-companion.companion-flying small { bottom: -12px; }
html body.vey-renewal #view .combat-stage .companion-el-feuer { --pet-glow: rgba(255, 128, 48, .7); }
html body.vey-renewal #view .combat-stage .companion-el-mond { --pet-glow: rgba(170, 200, 255, .65); }
html body.vey-renewal #view .combat-stage .companion-el-arkan { --pet-glow: rgba(110, 170, 255, .7); }
html body.vey-renewal #view .combat-stage .companion-el-natur { --pet-glow: rgba(120, 220, 130, .6); }
html body.vey-renewal #view .combat-stage .companion-el-leere { --pet-glow: rgba(176, 100, 255, .75); }
html body.vey-renewal #view .combat-stage .companion-el-astral { --pet-glow: rgba(140, 220, 255, .7); }
html body.vey-renewal #view .combat-stage .companion-el-erde { --pet-glow: rgba(214, 170, 90, .6); }
html body.vey-renewal #view .combat-stage .companion-el-schatten { --pet-glow: rgba(150, 110, 200, .65); }
html body.vey-renewal #view .combat-stage .combat-companion.vm-pet-strike { animation: vm-pet-strike calc(520ms / var(--combat-speed, 1)) cubic-bezier(.2, .9, .3, 1) both; }
html body.vey-renewal #view .combat-stage .combat-companion.vm-pet-strike .combat-companion-art { filter: drop-shadow(0 0 22px var(--pet-glow)) drop-shadow(0 0 8px var(--pet-glow)) brightness(1.25); }
html body.vey-renewal #view .combat-log .companion-log { color: #f0cf86; font-weight: 700; }
@keyframes vm-pet-hover { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-12px) rotate(2deg); } }
@keyframes vm-pet-strike { 0% { transform: translateX(0); } 45% { transform: translateX(110%) scale(1.08); } 100% { transform: translateX(0); } }
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage .combat-companion.companion-ground { right: -18%; width: 46%; height: 34%; }
  html body.vey-renewal #view .combat-stage .combat-companion.companion-flying { right: -12%; width: 42%; height: 30%; }
  html body.vey-renewal #view .combat-stage .combat-companion small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html body.vey-renewal #view .combat-stage .combat-companion .combat-companion-art,
  html body.vey-renewal #view .combat-stage .combat-companion.vm-pet-strike { animation: none !important; }
}
/* Gefährten-Mods */
html body.vey-renewal .companion-mods { display: grid; gap: 4px; margin-top: 8px; }
html body.vey-renewal .companion-mods > small { font-size: 10px; letter-spacing: .12em; color: rgba(248, 226, 173, .65); }
html body.vey-renewal .companion-mods > em { font-size: 11px; font-style: normal; color: rgba(230, 220, 200, .55); }
html body.vey-renewal .companion-mod { display: flex; gap: 8px; align-items: baseline; font-size: 13px; color: #e9e1cf; }
html body.vey-renewal .companion-mod b { min-width: 64px; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
html body.vey-renewal .companion-mod.mod-tier-plain b { color: #b9b2a2; }
html body.vey-renewal .companion-mod.mod-tier-magic b { color: #6fa8ff; }
html body.vey-renewal .companion-mod.mod-tier-rare b { color: #f2d36b; }
html body.vey-renewal .companion-mod.mod-tier-epic b { color: #c27dff; }
html body.vey-renewal .companion-mod.mod-tier-legendary b { color: #ff9a3c; text-shadow: 0 0 8px rgba(255, 154, 60, .5); }
html body.vey-renewal .companion-mod-hint { font-size: 12px; color: rgba(230, 220, 200, .6); margin: 6px 0 0; }
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage .combat-companion.companion-flying { right: -30%; top: -14%; }
}
html body.vey-renewal #view .combat-stage:has(.combat-companion.vm-pet-strike) .enemy-art { animation: vm-hit-right calc(380ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; }
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage .combat-companion.companion-flying { right: 0; top: 4%; width: 52%; height: 24%; z-index: 4; }
  html body.vey-renewal #view .combat-stage .combat-companion.companion-ground { right: -6%; z-index: 4; }
}
@media (max-width: 760px) {
  html body.vey-renewal #view .combat-stage .combat-companion.companion-flying { top: 30%; right: -8%; width: 44%; height: 22%; }
}

/* Skill-Icons: einheitlicher Juwelen-Rahmen statt rohem Quadrat */
body.vey-renewal img[src*="assets/skills/"] {
  border-radius: 14px !important;
  box-shadow: 0 0 0 1px rgba(232, 196, 128, .55), 0 0 0 3px rgba(8, 9, 14, .9), 0 6px 16px -6px rgba(0, 0, 0, .8), 0 0 18px -6px rgba(232, 196, 128, .45) !important;
}
/* Haustiere im Kampf: Element-Fähigkeiten */
html body.vey-renewal .companion-ability { margin: 0 0 4px; font-size: 12.5px; color: #e9e1cf; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
html body.vey-renewal .companion-ability b { color: #f0cf86; font-family: var(--vm-display, serif); letter-spacing: .04em; }
html body.vey-renewal #view .combat-stage[class*="vm-petfx-"] .combatant-art { transition: filter .2s; }
html body.vey-renewal #view .combat-stage.vm-petfx-burn .enemy-art { animation: vm-petfx-glow calc(900ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; --petfx: rgba(255, 110, 30, .95); }
html body.vey-renewal #view .combat-stage.vm-petfx-runebolt .enemy-art,
html body.vey-renewal #view .combat-stage.vm-petfx-starfall .enemy-art { animation: vm-petfx-glow calc(800ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; --petfx: rgba(130, 200, 255, .95); }
html body.vey-renewal #view .combat-stage.vm-petfx-drain .enemy-art { animation: vm-petfx-glow calc(800ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; --petfx: rgba(170, 90, 255, .95); }
html body.vey-renewal #view .combat-stage.vm-petfx-moonheal .hero-art,
html body.vey-renewal #view .combat-stage.vm-petfx-bloom .hero-art { animation: vm-petfx-glow calc(900ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; --petfx: rgba(120, 240, 170, .9); }
html body.vey-renewal #view .combat-stage.vm-petfx-stoneward .hero-art { animation: vm-petfx-glow calc(900ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; --petfx: rgba(230, 180, 90, .95); }
html body.vey-renewal #view .combat-stage.vm-petfx-veil .enemy-art { animation: vm-petfx-glow calc(900ms / var(--combat-speed, 1)) ease-out both, vm-breathe 3.2s ease-in-out infinite !important; --petfx: rgba(120, 80, 170, .95); }
@keyframes vm-petfx-glow {
  0% { filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .75)); }
  35% { filter: drop-shadow(0 0 28px var(--petfx)) drop-shadow(0 0 10px var(--petfx)) brightness(1.2); }
  100% { filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .75)); }
}
@media (prefers-reduced-motion: reduce) {
  html body.vey-renewal #view .combat-stage[class*="vm-petfx-"] .combatant-art { animation: none !important; }
}
/* Haustiere im Kampf: freigestellte Bestiarium-Vorschaubilder (enemies-v3/thumbs) */
html body.vey-renewal #view .bestiary-art[style*="enemies-v3/thumbs"] {
  background-size: cover, contain !important; background-position: center, center bottom !important; background-repeat: no-repeat !important;
  background-color: #10131f !important;
  box-shadow: inset 0 -40px 60px -30px rgba(0, 0, 0, .8), inset 0 0 80px rgba(120, 90, 160, .18);
}

/* =====================================================================
   EHRENHALLE · Halle der Legenden
   ===================================================================== */
html body.vey-renewal #view .hof-screen { display: grid; gap: 18px; }
html body.vey-renewal #view .hof-hero {
  display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap;
  padding: 30px 32px; border-radius: 24px; min-height: 180px;
  background:
    linear-gradient(90deg, rgba(9, 10, 16, .92), rgba(9, 10, 16, .55) 60%, rgba(9, 10, 16, .2)),
    url("./assets/locations/arena.webp") center 40% / cover no-repeat;
  box-shadow: 0 30px 60px -36px #000, inset 0 0 0 1px rgba(232, 196, 128, .25);
}
html body.vey-renewal #view .hof-hero h1 { font-size: clamp(32px, 4vw, 52px) !important; margin: 4px 0 8px; }
html body.vey-renewal #view .hof-hero p { max-width: 620px; color: rgba(239, 233, 220, .82); }
html body.vey-renewal #view .hof-me {
  display: grid; justify-items: end; gap: 2px; padding: 14px 20px; border-radius: 18px;
  background: rgba(8, 9, 14, .7); border: 1px solid rgba(232, 196, 128, .45); backdrop-filter: blur(8px);
}
html body.vey-renewal #view .hof-me small { font-size: 10px; letter-spacing: .16em; color: var(--vm-gold); font-weight: 800; }
html body.vey-renewal #view .hof-me b { font-family: var(--vm-display); font-size: 40px; color: var(--vm-gold-hi); line-height: 1; }
html body.vey-renewal #view .hof-me span { font-size: 13px; color: var(--vm-text); font-weight: 700; }
html body.vey-renewal #view .hof-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 5px; border-radius: 16px; background: rgba(255, 255, 255, .025); border: 1px solid var(--vm-line); }
html body.vey-renewal #view .hof-tabs button {
  flex: 1 1 auto; min-height: 40px; border-radius: 12px; border: 1px solid transparent; background: transparent; cursor: pointer;
  color: var(--vm-muted); font-family: var(--vm-font); font-weight: 800; font-size: 13px;
}
html body.vey-renewal #view .hof-tabs button:hover { color: var(--vm-text); background: rgba(255, 255, 255, .04); }
html body.vey-renewal #view .hof-tabs button.active { color: #1b1408; background: linear-gradient(180deg, #f3d694, #c89a4f); border-color: #f8e3b0; }

/* Podest */
html body.vey-renewal #view .hof-podium { display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 14px; align-items: end; }
html body.vey-renewal #view .hof-podium-hero {
  --medal: #c9cdd6; position: relative; display: grid; justify-items: center; gap: 4px; padding: 0 12px 18px; cursor: pointer;
  border-radius: 22px; border: 1px solid color-mix(in srgb, var(--medal) 45%, transparent);
  background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--medal) 20%, transparent), transparent 60%), linear-gradient(180deg, rgba(22, 24, 35, .95), rgba(10, 11, 17, .98));
  box-shadow: 0 24px 50px -30px #000; color: var(--vm-text); font-family: var(--vm-font); transition: transform .2s ease, box-shadow .2s ease;
}
html body.vey-renewal #view .hof-podium-hero:hover { transform: translateY(-4px); box-shadow: 0 30px 56px -30px #000, 0 0 30px -10px var(--medal); }
html body.vey-renewal #view .hof-podium-hero.place-1 { --medal: #f2cf7c; }
html body.vey-renewal #view .hof-podium-hero.place-3 { --medal: #d08a52; }
html body.vey-renewal #view .hof-podium-art { width: 100%; height: 170px; background: var(--hof-art, none) center bottom / contain no-repeat; filter: drop-shadow(0 14px 18px rgba(0, 0, 0, .7)); }
html body.vey-renewal #view .hof-podium-hero.place-1 .hof-podium-art { height: 220px; }
html body.vey-renewal #view .hof-podium-rank {
  width: 44px; height: 44px; margin-top: -24px; display: grid; place-items: center; border-radius: 50%;
  font-family: var(--vm-display); font-size: 22px; color: #120d06;
  background: linear-gradient(180deg, color-mix(in srgb, var(--medal) 60%, white 40%), var(--medal)); box-shadow: 0 0 22px -4px var(--medal), 0 0 0 3px #0b0c12;
}
html body.vey-renewal #view .hof-podium-hero b { font-family: var(--vm-display); font-size: 18px; color: #fff6dd; }
html body.vey-renewal #view .hof-podium-hero small { font-size: 12px; color: var(--vm-muted); }
html body.vey-renewal #view .hof-podium-hero em { font-style: normal; font-weight: 900; font-size: 16px; color: var(--medal); }
html body.vey-renewal #view .hof-podium-hero.is-empty { opacity: .45; cursor: default; }

/* Liste */
html body.vey-renewal #view .hof-board > header { display: flex; justify-content: space-between; align-items: baseline; padding: 18px 20px 6px; }
html body.vey-renewal #view .hof-board > header small { font-weight: 800; letter-spacing: .14em; color: var(--vm-muted); font-size: 11px; }
html body.vey-renewal #view .hof-list { list-style: none; margin: 0; padding: 6px 12px 14px; display: grid; gap: 6px; }
html body.vey-renewal #view .hof-list-me { border-top: 1px dashed rgba(232, 196, 128, .3); padding-top: 12px; }
html body.vey-renewal #view .hof-row {
  width: 100%; display: grid; grid-template-columns: 46px 44px minmax(0, 1fr) auto auto; gap: 14px; align-items: center; text-align: left; cursor: pointer;
  padding: 8px 14px; border-radius: 14px; border: 1px solid transparent; background: rgba(255, 255, 255, .025);
  color: var(--vm-text); font-family: var(--vm-font); transition: background .15s ease, border-color .15s ease;
}
html body.vey-renewal #view .hof-row:hover { background: rgba(232, 196, 128, .06); border-color: var(--vm-line); }
html body.vey-renewal #view .hof-row.is-me { border-color: rgba(232, 196, 128, .55); background: linear-gradient(90deg, rgba(232, 196, 128, .14), rgba(232, 196, 128, .03)); }
html body.vey-renewal #view .hof-rank { font-family: var(--vm-display); font-size: 20px; color: var(--vm-muted); text-align: center; }
html body.vey-renewal #view .hof-row.top-1 .hof-rank { color: #f2cf7c; }
html body.vey-renewal #view .hof-row.top-2 .hof-rank { color: #d5d9e2; }
html body.vey-renewal #view .hof-row.top-3 .hof-rank { color: #d08a52; }
html body.vey-renewal #view .hof-portrait { width: 44px; height: 44px; border-radius: 12px; background: var(--hof-art, none) center 18% / cover no-repeat, #141622; box-shadow: 0 0 0 1px var(--vm-line-strong); }
html body.vey-renewal #view .hof-name { display: grid; min-width: 0; }
html body.vey-renewal #view .hof-name b { font-size: 15px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html body.vey-renewal #view .hof-name small { font-size: 12px; color: var(--vm-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html body.vey-renewal #view .hof-level { display: grid; justify-items: end; font-size: 13px; font-weight: 700; color: var(--vm-text); }
html body.vey-renewal #view .hof-level em { font-style: normal; font-size: 11px; color: var(--vm-arcane); }
html body.vey-renewal #view .hof-value { display: grid; justify-items: end; min-width: 90px; }
html body.vey-renewal #view .hof-value b { font-family: var(--vm-display); font-size: 18px; color: var(--vm-gold-hi); }
html body.vey-renewal #view .hof-value small { font-size: 10px; letter-spacing: .12em; color: var(--vm-muted); font-weight: 800; }
html body.vey-renewal #view .hof-empty { padding: 20px; text-align: center; color: var(--vm-muted); }

/* Regeln */
html body.vey-renewal #view .hof-rules { padding: 20px 22px !important; }
html body.vey-renewal #view .hof-rule-steps { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
html body.vey-renewal #view .hof-rule-steps li { display: grid; gap: 4px; padding: 12px 14px; border-radius: 14px; background: rgba(255, 255, 255, .03); border: 1px solid var(--vm-line); }
html body.vey-renewal #view .hof-rule-steps b { color: var(--vm-gold-hi); font-size: 14px; }
html body.vey-renewal #view .hof-rule-steps span { font-size: 12.5px; color: var(--vm-muted); line-height: 1.5; }
html body.vey-renewal #view .hof-rules h3 { margin: 16px 0 8px; }
html body.vey-renewal #view .hof-breakdown { display: flex; flex-wrap: wrap; gap: 8px; }
html body.vey-renewal #view .hof-breakdown span { display: grid; padding: 8px 12px; border-radius: 12px; background: rgba(154, 134, 255, .08); border: 1px solid rgba(154, 134, 255, .22); }
html body.vey-renewal #view .hof-breakdown small { font-size: 10px; letter-spacing: .1em; color: var(--vm-muted); font-weight: 800; text-transform: uppercase; }
html body.vey-renewal #view .hof-breakdown b { font-size: 15px; color: var(--vm-text); }

@media (max-width: 760px) {
  html body.vey-renewal #view .hof-hero { padding: 20px; min-height: 0; }
  html body.vey-renewal #view .hof-podium { gap: 6px; }
  html body.vey-renewal #view .hof-podium-art { height: 100px; }
  html body.vey-renewal #view .hof-podium-hero.place-1 .hof-podium-art { height: 130px; }
  html body.vey-renewal #view .hof-podium-hero { padding: 0 6px 12px; border-radius: 16px; }
  html body.vey-renewal #view .hof-podium-hero b { font-size: 13px; }
  html body.vey-renewal #view .hof-podium-hero small { display: none; }
  html body.vey-renewal #view .hof-row { grid-template-columns: 30px 36px minmax(0, 1fr) auto; gap: 8px; padding: 8px; }
  html body.vey-renewal #view .hof-row .hof-level { display: none; }
  html body.vey-renewal #view .hof-portrait { width: 36px; height: 36px; }
  html body.vey-renewal #view .hof-rule-steps { grid-template-columns: 1fr 1fr; }
}

/* Anmelde-Ebene: versteckt bleibt versteckt (Fix für die Rückkehr zum Formular nach der Registrierung) */
html body.vey-renewal #authLayer.hidden, html body.vey-renewal #authLayer.hidden.signup-mode, html body.vey-renewal #authLayer.hidden.login-mode { display: none !important; }

/* =====================================================================
   STUFE 4 · Rahmen schlank, Hauptfläche groß (Spielfläche wie bei großen Browsergames)
   ===================================================================== */
@media (min-width: 761px) {
  html body.vey-renewal .app-shell { grid-template-columns: 204px minmax(0, 1fr) !important; }
  html body.vey-renewal .app-shell > aside.sidebar { width: 204px !important; padding: 14px 10px 10px !important; gap: 8px !important; }
  html body.vey-renewal .sidebar .brand { padding: 2px 6px 10px !important; }
  html body.vey-renewal .sidebar .brand b { font-size: 17px !important; }
  html body.vey-renewal .sidebar .brand small { font-size: 8.5px !important; }
  html body.vey-renewal .sidebar .brand-mark, html body.vey-renewal .sidebar .brand-mark img { width: 30px !important; height: 36px !important; }
  html body.vey-renewal .sidebar .profile.shell-profile-link { padding: 8px !important; gap: 10px !important; border-radius: 14px !important; }
  html body.vey-renewal .sidebar .profile .avatar { width: 38px !important; height: 38px !important; min-width: 38px !important; }
  html body.vey-renewal .sidebar #playerName { font-size: 13.5px !important; }
  html body.vey-renewal .sidebar #playerLevel { font-size: 11px !important; }
  html body.vey-renewal #nav .nav-item { min-height: 46px !important; padding: 5px 8px !important; grid-template-columns: 32px minmax(0, 1fr) 16px !important; column-gap: 10px !important; }
  html body.vey-renewal #nav .nav-relic { width: 32px !important; height: 32px !important; border-radius: 10px !important; }
  html body.vey-renewal #nav .nav-relic img { width: 24px !important; height: 24px !important; }
  html body.vey-renewal #nav .nav-item > b { font-size: 13px !important; }
  html body.vey-renewal #nav .nav-item > small { font-size: 10px !important; }
  html body.vey-renewal #nav .nav-group-links { margin: 2px 0 6px 24px !important; }
  html body.vey-renewal #nav .nav-group-links button { min-height: 28px !important; padding: 4px 8px !important; font-size: 12px !important; }
  html body.vey-renewal .sidebar-bottom { padding: 6px 10px !important; }

  html body.vey-renewal .topbar { min-height: 60px !important; padding: 7px 22px !important; gap: 10px !important; }
  html body.vey-renewal .topbar .global-hero { min-height: 46px !important; padding: 3px 12px 3px 3px !important; gap: 10px !important; border-radius: 13px !important; }
  html body.vey-renewal .topbar .global-hero__portrait { width: 38px !important; height: 38px !important; min-width: 38px !important; border-radius: 10px !important; }
  html body.vey-renewal .topbar .global-hero__identity b { font-size: 13.5px !important; }
  html body.vey-renewal .topbar .global-hero__identity em { font-size: 11px !important; }
  html body.vey-renewal .topbar .global-hero__power b { font-size: 17px !important; }
  html body.vey-renewal .topbar #journeyTravel { min-width: 190px !important; min-height: 36px !important; height: 36px !important; }
  html body.vey-renewal .topbar .resource { padding: 3px 10px 3px 6px !important; font-size: 13px !important; }

  html body.vey-renewal #currentObjective { margin: 8px 22px 0 !important; padding: 7px 10px 7px 8px !important; gap: 12px !important; border-radius: 14px !important; }
  html body.vey-renewal #currentObjective .objective-sigil { width: 38px !important; height: 38px !important; min-width: 38px !important; border-radius: 11px !important; }
  html body.vey-renewal #currentObjective .objective-copy b { font-size: 14px !important; }
  html body.vey-renewal #currentObjective .objective-copy > div > span { font-size: 11.5px !important; }
  html body.vey-renewal #currentObjective .objective-progress-row { max-width: 260px; }
  html body.vey-renewal #currentObjective .objective-command { min-height: 36px !important; padding: 5px 14px !important; }
  html body.vey-renewal #currentObjective .objective-command small { display: none !important; }
  html body.vey-renewal #sectionNavigation { margin: 8px 22px 0 !important; padding: 4px !important; }
  html body.vey-renewal #sectionNavigation > button { padding: 7px 15px !important; font-size: 13px !important; }
  html body.vey-renewal #view { padding: 14px 22px 40px !important; }
  html body.vey-renewal #view > details.active-benefits { margin-bottom: 8px !important; }
  html body.vey-renewal #view > details.active-benefits > summary { padding: 4px 12px !important; font-size: 11px !important; }

  /* Hauptfläche: größere Grundschrift, mehr Luft, größere Bedienelemente */
  html body.vey-renewal #view { --read-body: 15px; --read-small: 12.5px; --read-label: 12px; --read-control: 15px; font-size: 15px !important; }
  html body.vey-renewal #view p, html body.vey-renewal #view li, html body.vey-renewal #view td, html body.vey-renewal #view label { font-size: 15px; }
  html body.vey-renewal #view h1 { font-size: clamp(30px, 2.9vw, 44px) !important; }
  html body.vey-renewal #view h2 { font-size: clamp(22px, 1.9vw, 30px) !important; }
  html body.vey-renewal #view h3 { font-size: 17.5px !important; }
  html body.vey-renewal #view :is(.eyebrow, .tag, .collection-card-status) { font-size: 11.5px !important; }
  html body.vey-renewal #view .button:not(.veydris-cta):not([class*="forged"]) { min-height: 46px; font-size: 14px !important; padding-inline: 20px; }
  html body.vey-renewal #view .item-slot { width: 100px !important; height: 100px !important; }
  html body.vey-renewal #view .item-slot img { width: 86px !important; height: 86px !important; }
  html body.vey-renewal #view .equipment-slot > small { font-size: 12px !important; }
  html body.vey-renewal #view .equipment-summary { gap: 12px !important; }
  html body.vey-renewal #view :is(.card, .view-title) { padding: clamp(18px, 1.6vw, 26px) !important; }
  html body.vey-renewal #view .collection-card-grid { gap: 18px !important; }
  html body.vey-renewal #view .mount-grid.collection-card-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important; }
  html body.vey-renewal #view .collection-bonus-list > span { font-size: 13px !important; padding: 4px 12px !important; }
  html body.vey-renewal #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs) > button { min-height: 44px !important; font-size: 13.5px !important; }
  html body.vey-renewal #view .expedition-duration > span > b { font-size: 52px !important; }
  html body.vey-renewal #view .expedition-duration { min-height: 340px !important; }
  html body.vey-renewal #view .starter-weapon .item-slot { width: 120px !important; height: 120px !important; }
  html body.vey-renewal #view .starter-weapon .item-slot img { width: 100px !important; height: 100px !important; }
  html body.vey-renewal #view .combat-stage { height: max(520px, calc(100dvh - 340px)) !important; }
}
@media (min-width: 1600px) {
  html body.vey-renewal #view { padding-inline: 32px !important; }
  html body.vey-renewal #view > * { max-width: 1480px; margin-inline: auto; }
}

/* Begleiter-Fokuskarte: Bild groß, Werte als Kacheln */
html body.vey-renewal #view .companion-focus-card { grid-template-columns: minmax(260px, 34%) minmax(0, 1fr) !important; gap: 22px !important; align-items: start !important; }
html body.vey-renewal #view .companion-focus-card .companion-icon.collection-art {
  width: 100% !important; height: auto !important; aspect-ratio: 4 / 5; min-height: 320px !important; border-radius: 20px !important; border: 1px solid var(--vm-line) !important;
  background: var(--collection-art) center 85% / auto 96% no-repeat, radial-gradient(ellipse 60% 40% at 50% 90%, rgba(0,0,0,.6), transparent 70%), radial-gradient(circle at 50% 40%, rgba(154,134,255,.22), transparent 65%), linear-gradient(180deg, #1a1c28, #0b0c12) !important;
}
html body.vey-renewal #view .companion-focus-card h3 { font-family: var(--vm-display) !important; font-size: 26px !important; }
html body.vey-renewal #view .companion-focus-card .collection-level-track { padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.03); border: 1px solid var(--vm-line); }
html body.vey-renewal #view .companion-focus-card .collection-level-track i { height: 8px !important; border-radius: 99px !important; background: rgba(255,255,255,.08) !important; }
html body.vey-renewal #view .companion-focus-card .collection-level-track u { background: linear-gradient(90deg, var(--vm-arcane), #c9b8ff) !important; box-shadow: 0 0 10px var(--vm-arcane); }
@media (min-width: 761px) {
  /* Heldenpuppe behält ihre Slot-Größe, nur Inventar/Startwaffen werden größer */
  html body.vey-renewal #view .hero-gear-slot-wrap .item-slot { width: 54px !important; height: 54px !important; }
  html body.vey-renewal #view .hero-gear-slot-wrap .item-slot img { width: 46px !important; height: 46px !important; }
}
/* Heldenkopf (Armory) darf nicht abschneiden */
html body.vey-renewal #view .character-profile-header { height: auto !important; min-height: 0 !important; overflow: visible !important; align-items: center !important; }
html body.vey-renewal #view .character-profile-name { height: auto !important; }
html body.vey-renewal #view .character-profile-header h1 { font-size: clamp(26px, 2.4vw, 36px) !important; }

/* =====================================================================
   STUFE 5 · Schlanker Rahmen: Icon-Leiste links, flacher Header, Mitte = Spielfläche
   ===================================================================== */
html body.vey-renewal .header-status:empty { display: none !important; }
html body.vey-renewal .topbar .header-status { display: flex !important; align-items: center; gap: 6px; padding: 0 8px 0 0; margin: 0 2px 0 0; border-right: 1px solid var(--vm-line); background: none !important; border-top: 0 !important; border-left: 0 !important; border-bottom: 0 !important; box-shadow: none !important; }
html body.vey-renewal .topbar .hs-chip {
  position: relative; width: 36px; height: 36px; padding: 0 !important; border-radius: 11px !important; cursor: pointer;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)) !important; border: 1px solid var(--vm-line) !important; display: grid; place-items: center; min-height: 0 !important;
}
html body.vey-renewal .topbar .hs-chip i { width: 28px; height: 28px; background: var(--hs-art) center / contain no-repeat; display: block; font-style: normal; }
html body.vey-renewal .topbar .hs-chip.is-empty { border-style: dashed !important; opacity: .65; }
html body.vey-renewal .topbar .hs-chip.is-empty i { background: none; color: var(--vm-muted); font-size: 18px; line-height: 28px; text-align: center; }
html body.vey-renewal .topbar .hs-chip.is-elixir { border-color: rgba(108, 240, 169, .45) !important; box-shadow: 0 0 12px -4px rgba(108, 240, 169, .6); }
html body.vey-renewal .topbar .hs-chip:hover, html body.vey-renewal .topbar .hs-chip:focus-visible { border-color: var(--vm-gold) !important; transform: translateY(-1px); }

@media (min-width: 761px) {
  /* ---- Linke Leiste: 68px Icons, klappt beim Überfahren als Overlay auf ---- */
  html body.vey-renewal .app-shell { grid-template-columns: 68px minmax(0, 1fr) !important; }
  html body.vey-renewal .app-shell > main { grid-column: 2 !important; min-width: 0; }
  html body.vey-renewal .app-shell > aside.sidebar {
    position: fixed !important; z-index: 70; inset: 0 auto 0 0 !important; width: 68px !important; height: 100dvh !important; padding: 10px 8px !important; overflow: hidden auto !important;
    transition: width .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s; border-radius: 0 !important; scrollbar-width: none;
  }
  html body.vey-renewal .app-shell > aside.sidebar:hover, html body.vey-renewal .app-shell > aside.sidebar:focus-within {
    width: 236px !important; box-shadow: 18px 0 50px -18px rgba(0, 0, 0, .85), 1px 0 0 var(--vm-line);
  }
  html body.vey-renewal .sidebar .brand { padding: 2px 4px 8px !important; justify-content: flex-start; overflow: hidden; white-space: nowrap; }
  html body.vey-renewal .sidebar .brand-mark, html body.vey-renewal .sidebar .brand-mark img { width: 34px !important; height: 40px !important; flex: 0 0 auto; }
  html body.vey-renewal .sidebar .profile.shell-profile-link { padding: 5px !important; overflow: hidden; }
  html body.vey-renewal .sidebar .profile-copy, html body.vey-renewal .sidebar .brand > span:last-child { opacity: 0; transition: opacity .15s; white-space: nowrap; }
  html body.vey-renewal .app-shell > aside.sidebar:hover .profile-copy, html body.vey-renewal .app-shell > aside.sidebar:focus-within .profile-copy,
  html body.vey-renewal .app-shell > aside.sidebar:hover .brand > span:last-child, html body.vey-renewal .app-shell > aside.sidebar:focus-within .brand > span:last-child { opacity: 1; transition-delay: .08s; }
  html body.vey-renewal #nav .nav-item { grid-template-columns: 36px minmax(0, 1fr) 14px !important; min-height: 48px !important; padding: 5px !important; overflow: hidden; }
  html body.vey-renewal #nav .nav-item > b, html body.vey-renewal #nav .nav-item > small, html body.vey-renewal #nav .nav-item > i { opacity: 0; white-space: nowrap; transition: opacity .15s; }
  html body.vey-renewal .app-shell > aside.sidebar:hover #nav .nav-item > :is(b, small, i), html body.vey-renewal .app-shell > aside.sidebar:focus-within #nav .nav-item > :is(b, small, i) { opacity: 1; transition-delay: .08s; }
  html body.vey-renewal #nav .nav-relic { width: 36px !important; height: 36px !important; }
  html body.vey-renewal #nav .nav-relic img { width: 28px !important; height: 28px !important; }
  html body.vey-renewal #nav .nav-group-links { display: none !important; }
  html body.vey-renewal .app-shell > aside.sidebar:hover #nav .nav-group[open] .nav-group-links, html body.vey-renewal .app-shell > aside.sidebar:focus-within #nav .nav-group[open] .nav-group-links { display: grid !important; }
  html body.vey-renewal .sidebar-bottom { padding: 8px !important; overflow: hidden; white-space: nowrap; }
  html body.vey-renewal .sidebar-bottom #onlineCount { opacity: 0; transition: opacity .15s; }
  html body.vey-renewal .app-shell > aside.sidebar:hover .sidebar-bottom #onlineCount { opacity: 1; }

  /* ---- Header: eine flache Zeile ---- */
  html body.vey-renewal .topbar { min-height: 50px !important; padding: 5px 16px !important; gap: 8px !important; }
  html body.vey-renewal .topbar .global-hero { min-height: 40px !important; padding: 2px 10px 2px 2px !important; gap: 8px !important; }
  html body.vey-renewal .topbar .global-hero__portrait { width: 34px !important; height: 34px !important; min-width: 34px !important; }
  html body.vey-renewal .topbar .global-hero__identity small, html body.vey-renewal .topbar .global-hero__xptext { display: none !important; }
  html body.vey-renewal .topbar .global-hero__identity b { font-size: 13px !important; line-height: 1.15; }
  html body.vey-renewal .topbar .global-hero__identity em { font-size: 10.5px !important; }
  html body.vey-renewal .topbar .global-hero__power small { display: none !important; }
  html body.vey-renewal .topbar .global-hero__power b { font-size: 15px !important; }
  html body.vey-renewal .topbar .crumb { font-size: 12px !important; opacity: .8; }
  html body.vey-renewal .topbar #journeyTravel { min-width: 36px !important; width: 36px !important; padding: 0 !important; justify-content: center; }
  html body.vey-renewal .topbar #journeyTravel :is(b, kbd) { display: none !important; }
  html body.vey-renewal .topbar .resource { padding: 2px 9px 2px 5px !important; font-size: 13px !important; min-height: 34px; }
  html body.vey-renewal .topbar :is(.notification-button, .settings) { width: 36px !important; height: 36px !important; min-height: 0 !important; }

  /* ---- Zielleiste: eine Zeile ---- */
  html body.vey-renewal #currentObjective { margin: 6px 16px 0 !important; padding: 4px 8px !important; gap: 10px !important; border-radius: 12px !important; min-height: 0 !important; }
  html body.vey-renewal #currentObjective .objective-sigil { width: 26px !important; height: 26px !important; min-width: 26px !important; border-radius: 8px !important; }
  html body.vey-renewal #currentObjective .objective-copy { display: flex !important; align-items: center; gap: 12px; }
  html body.vey-renewal #currentObjective .objective-copy b { font-size: 13px !important; }
  html body.vey-renewal #currentObjective .objective-copy > div > span { display: none !important; }
  html body.vey-renewal #currentObjective .objective-progress-row { max-width: 180px; }
  html body.vey-renewal #currentObjective .objective-command { min-height: 28px !important; padding: 3px 12px !important; font-size: 11.5px !important; }
  html body.vey-renewal #sectionNavigation { margin: 6px 16px 0 !important; padding: 3px !important; }
  html body.vey-renewal #sectionNavigation > button { padding: 5px 13px !important; font-size: 12.5px !important; min-height: 0 !important; }
  html body.vey-renewal #contextResources:empty { display: none !important; }

  /* ---- Mitte: kompakter, mehr Inhalt auf einen Blick ---- */
  html body.vey-renewal #view { padding: 10px 16px 32px !important; --read-body: 14px; --read-small: 12px; --read-label: 11.5px; --read-control: 14px; font-size: 14px !important; }
  html body.vey-renewal #view p, html body.vey-renewal #view li, html body.vey-renewal #view td, html body.vey-renewal #view label { font-size: 14px; }
  html body.vey-renewal #view h1 { font-size: clamp(24px, 2.2vw, 34px) !important; }
  html body.vey-renewal #view h2 { font-size: clamp(18px, 1.5vw, 24px) !important; }
  html body.vey-renewal #view h3 { font-size: 15.5px !important; }
  html body.vey-renewal #view .button:not(.veydris-cta):not([class*="forged"]) { min-height: 40px; font-size: 13px !important; padding-inline: 16px; }
  html body.vey-renewal #view :is(.card, .view-title) { padding: clamp(12px, 1.1vw, 18px) !important; }
  html body.vey-renewal #view .collection-card-grid { gap: 12px !important; }
  html body.vey-renewal #view .mount-grid.collection-card-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important; }
  html body.vey-renewal #view .item-slot { width: 78px !important; height: 78px !important; }
  html body.vey-renewal #view .item-slot img { width: 66px !important; height: 66px !important; }
  html body.vey-renewal #view .expedition-duration { min-height: 240px !important; }
  html body.vey-renewal #view .expedition-duration > span > b { font-size: 42px !important; }
  html body.vey-renewal #view .starter-weapon .item-slot { width: 96px !important; height: 96px !important; }
  html body.vey-renewal #view .starter-weapon .item-slot img { width: 82px !important; height: 82px !important; }
  html body.vey-renewal #view .combat-stage { height: max(480px, calc(100dvh - 190px)) !important; }
}
@media (min-width: 1600px) {
  html body.vey-renewal #view { padding-inline: 24px !important; }
  html body.vey-renewal #view > * { max-width: 1680px; }
}
@media (min-width: 761px) {
  html body.vey-renewal #currentObjective .objective-copy > div:not(.objective-sigil) { display: flex !important; align-items: center; gap: 12px; flex-wrap: nowrap; min-width: 0; }
  html body.vey-renewal #currentObjective .objective-copy small { white-space: nowrap; }
  html body.vey-renewal #currentObjective .objective-progress-row { display: flex !important; align-items: center; gap: 8px; margin: 0 !important; min-width: 160px; }
  html body.vey-renewal #currentObjective .objective-sigil img { display: none; }
}
@media (min-width: 761px) {
  html body.vey-renewal #currentObjective .objective-copy > div:not(.objective-sigil) { flex-direction: row !important; }
  html body.vey-renewal #view label.elixir-strength { display: flex !important; align-items: center; gap: 12px; margin: 4px 0 !important; }
  html body.vey-renewal #view label.elixir-strength select { min-height: 36px !important; height: 36px !important; width: auto !important; min-width: 120px; padding: 0 12px !important; }
}
@media (min-width:761px){html body.vey-renewal #currentObjective .objective-copy b{white-space:nowrap}}

/* =====================================================================
   STUFE 6 · Ziel als Chip im Header, neue Header-Icons, noch flacher
   ===================================================================== */
html body.vey-renewal .topbar #currentObjective {
  order: 3; flex: 1 1 260px; max-width: 460px; min-width: 0; margin: 0 !important; padding: 3px 4px 3px 10px !important; min-height: 36px !important; height: 38px;
  display: flex !important; align-items: center; gap: 8px !important; border-radius: 11px !important; border: 1px solid rgba(232, 196, 128, .28) !important;
  background: linear-gradient(90deg, rgba(232, 196, 128, .12), rgba(232, 196, 128, .03)) !important; box-shadow: none !important; overflow: hidden; cursor: default;
}
html body.vey-renewal .topbar #currentObjective::before, html body.vey-renewal .topbar #currentObjective::after { display: none !important; }
html body.vey-renewal .topbar #currentObjective .objective-copy { flex: 1 1 auto; min-width: 0; display: flex !important; align-items: center; gap: 8px; }
html body.vey-renewal .topbar #currentObjective .objective-sigil, html body.vey-renewal .topbar #currentObjective .objective-copy small, html body.vey-renewal .topbar #currentObjective .objective-copy > div > span { display: none !important; }
html body.vey-renewal .topbar #currentObjective .objective-copy::before { content: "◎"; color: var(--vm-gold-hi); font-size: 15px; flex: 0 0 auto; }
html body.vey-renewal .topbar #currentObjective .objective-copy > div:not(.objective-sigil) { display: flex !important; flex-direction: row !important; align-items: center; gap: 10px; min-width: 0; flex: 1; }
html body.vey-renewal .topbar #currentObjective .objective-copy b { font-size: 12.5px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; font-weight: 700; }
html body.vey-renewal .topbar #currentObjective .objective-progress-row { min-width: 0 !important; flex: 0 0 auto; display: flex !important; align-items: center; gap: 6px; margin: 0 !important; }
html body.vey-renewal .topbar #currentObjective .objective-progress { width: 44px !important; height: 5px !important; }
html body.vey-renewal .topbar #currentObjective .objective-progress-row em { font-size: 11px !important; font-style: normal; color: var(--vm-muted); }
html body.vey-renewal .topbar #currentObjective .objective-command { flex: 0 0 auto; min-height: 28px !important; height: 28px; padding: 0 12px !important; font-size: 11px !important; border-radius: 8px !important; }
html body.vey-renewal .topbar #currentObjective .objective-command small { display: none !important; }
html body.vey-renewal .topbar #currentObjective.is-complete { border-color: rgba(108, 240, 169, .5) !important; }
html body.vey-renewal .topbar .crumb { display: none !important; }
@media (min-width: 1500px) { html body.vey-renewal .topbar .crumb { display: block !important; order: 2; } }

/* neue Header-Icons als Linien-Symbole */
html body.vey-renewal .topbar :is(.notification-button, .settings) {
  border-radius: 11px !important; background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)) !important; border: 1px solid var(--vm-line) !important; display: grid !important; place-items: center; position: relative;
}
html body.vey-renewal .topbar :is(.notification-sigil, .settings-sigil) {
  width: 20px !important; height: 20px !important; background: var(--vm-gold-hi) !important; border: 0 !important; box-shadow: none !important; filter: none !important;
  -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}
html body.vey-renewal .topbar .notification-sigil { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9a6 6 0 0 1 12 0c0 6 2 7 2 8H4c0-1 2-2 2-8z'/%3E%3Cpath d='M10 20a2 2 0 0 0 4 0'/%3E%3C/svg%3E"); }
html body.vey-renewal .topbar .settings-sigil { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M2 12h3M19 12h3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M19.1 4.9L17 7M7 17l-2.1 2.1'/%3E%3C/svg%3E"); }
html body.vey-renewal .topbar #notificationBadge { position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; font-size: 10px; line-height: 16px; border-radius: 99px; padding: 0 4px; }
html body.vey-renewal .topbar #journeyTravel { order: 6; }
html body.vey-renewal .topbar .resource .resource-art { width: 20px !important; height: 20px !important; }
html body.vey-renewal .topbar { min-height: 46px !important; padding: 4px 14px !important; }
html body.vey-renewal .topbar .global-hero { min-height: 36px !important; }
html body.vey-renewal .topbar .global-hero__portrait { width: 30px !important; height: 30px !important; min-width: 30px !important; }

/* Öffentliche Rüstkammer: saubere, gleichmäßige Slot-Kacheln (Label oben, Item mittig, Rang unten) */
html body.vey-renewal #view .veydris-public-armory .public-gear-column { display: flex !important; flex-direction: column !important; gap: 5px !important; justify-content: center; width: 124px !important; min-width: 124px !important; padding: 8px !important; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot,
html body.vey-renewal #view .veydris-public-armory .public-gear-column.right .public-equipment-slot {
  all: unset !important; box-sizing: border-box !important; position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 4px !important;
  width: 100% !important; height: 80px !important; flex: 0 0 80px !important; padding: 2px 4px !important; gap: 2px !important; text-align: center !important; overflow: hidden !important;
  border-radius: 14px !important; border: 1px solid var(--vm-line) !important; background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)) !important;
}
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot > small { all: unset !important; display: block !important; width: 100% !important; font: 600 10px/12px var(--vm-font) !important; letter-spacing: .04em !important; text-align: center !important; color: var(--vm-muted) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot { position: relative !important; inset: auto !important; flex: 0 0 44px !important; width: 44px !important; height: 44px !important; max-width: none !important; margin: 0 !important; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot img { width: 38px !important; height: 38px !important; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot > span, html body.vey-renewal #view .veydris-public-armory .public-gear-column.right .public-equipment-slot > span {
  all: unset !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; width: 100% !important; height: 12px !important; font: 600 10px/12px var(--vm-font) !important; letter-spacing: .06em !important; color: var(--vm-muted) !important;
}
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot > span b { font-size: 11px !important; color: var(--vm-gold-hi) !important; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot > span i { display: block !important; width: 28px !important; height: 4px !important; border-radius: 9px; background: rgba(255,255,255,.12); overflow: hidden; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot > span i u { display: block; height: 100%; width: var(--profile-rank, 0%); background: var(--vm-gold-hi); }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot.is-empty { border-style: dashed !important; opacity: .85; }

@media (min-width: 761px) {
  html body.vey-renewal .topbar { flex-wrap: nowrap !important; }
  html body.vey-renewal .topbar #currentObjective { flex-wrap: nowrap !important; flex-direction: row !important; height: 38px !important; max-height: 38px; }
  html body.vey-renewal .topbar #currentObjective > * { flex-wrap: nowrap !important; }
  html body.vey-renewal .topbar #currentObjective .objective-command { margin: 0 !important; white-space: nowrap; width: auto !important; }
  html body.vey-renewal .topbar #currentObjective .objective-command span { white-space: nowrap; font-size: 11px !important; }
  html body.vey-renewal .topbar > * { flex-shrink: 0; }
  html body.vey-renewal .topbar > #currentObjective { flex-shrink: 1; }
  html body.vey-renewal .topbar .resources { margin-left: auto; }
}
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot > :not(img) { display: none !important; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot { flex: 0 0 50px !important; width: 50px !important; height: 50px !important; display: grid !important; place-items: center; padding: 0 !important; }
html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot img { width: 44px !important; height: 44px !important; }
@media (min-width: 761px) {
  html body.vey-renewal .topbar #currentObjective { flex: 1 1 340px; max-width: 520px; }
  html body.vey-renewal .topbar #currentObjective .objective-copy b { min-width: 110px; flex: 1 1 110px; }
  html body.vey-renewal .topbar #currentObjective .objective-copy > div:not(.objective-sigil) { overflow: hidden; }
}
@media (min-width: 761px) {
  html body.vey-renewal header.topbar aside#currentObjective .objective-copy > div > b { display: block !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; max-width: 260px; line-height: 1.2 !important; }
  html body.vey-renewal header.topbar aside#currentObjective .objective-progress-row { width: 70px !important; }
  html body.vey-renewal header.topbar aside#currentObjective .objective-progress { flex: 1 1 auto; width: auto !important; }
  html body.vey-renewal header.topbar aside#currentObjective .objective-command span { display: block !important; max-width: 150px; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width:760px){html body.vey-renewal .topbar #currentObjective{display:none!important}}

/* Tab rows inside a screen scroll with their content. The old sticky
   position let cards slide visibly underneath the translucent tab bar
   (e.g. Storage on mobile). */
body.vey-renewal #view .community-tabs { position: static !important; }

/* Phones: companion focus card and active-mount showcase stack vertically
   instead of squeezing the text column to a few letters. */
@media (max-width: 760px) {
  html body.vey-renewal #view .companion-focus-card { grid-template-columns: minmax(0, 1fr) !important; gap: 14px !important; }
  html body.vey-renewal #view .companion-focus-card .companion-icon.collection-art { min-height: 0 !important; max-height: 340px; aspect-ratio: 1 / 1; }
  html body.vey-renewal #view .companion-focus-card > * { grid-column: 1 / -1 !important; min-width: 0; }
  html body.vey-renewal #view .companion-focus-card .collection-card-footer { flex-wrap: wrap; gap: 10px; }
  html body.vey-renewal #view .companion-focus-card .collection-card-status { width: auto !important; writing-mode: horizontal-tb !important; }
  html body.vey-renewal #view .active-collection-showcase > div:not(.collection-art) { display: block !important; min-width: 0; }
  html body.vey-renewal #view .active-collection-showcase h2 { overflow-wrap: anywhere; }
}

/* Welcome back: a real dialog that stays until the player presses OK. */
.returning-summary { pointer-events: auto !important; animation: vm-returning-in .35s ease-out both !important; }
.returning-summary > div { pointer-events: auto !important; }
.returning-summary [data-returning-ok] { min-width: 120px; margin-left: 10px; }
@keyframes vm-returning-in { from { opacity: 0; } to { opacity: 1; } }

/* Modifier roll strength: colour shows where the roll landed in its own range
   (green weak → blue → yellow middle → orange → red top roll). */
[data-roll-tier="1"] { --roll-color: #5fd27a; }
[data-roll-tier="2"] { --roll-color: #5aa9ff; }
[data-roll-tier="3"] { --roll-color: #f1d44c; }
[data-roll-tier="4"] { --roll-color: #ff9a3d; }
[data-roll-tier="5"] { --roll-color: #ff4f4f; }
body.vey-renewal li[data-roll-tier],
body.vey-renewal .forge-affix-choice[data-roll-tier] {
  position: relative;
  border-left: 3px solid var(--roll-color) !important;
  padding-left: 10px !important;
  background-image: linear-gradient(90deg, color-mix(in srgb, var(--roll-color) 16%, transparent) var(--roll), transparent var(--roll)) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 2px !important;
  background-position: left bottom !important;
}
body.vey-renewal li[data-roll-tier] > b,
body.vey-renewal li[data-roll-tier] > span:only-child,
body.vey-renewal .starter-weapon li[data-roll-tier],
body.vey-renewal .forge-affix-choice[data-roll-tier] > b { color: var(--roll-color) !important; }
body.vey-renewal li[data-roll-tier] {
  background-image: linear-gradient(90deg, var(--roll-color) var(--roll), rgba(255,255,255,.07) var(--roll)) !important;
  background-size: 100% 2px !important;
}
.roll-legend { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0 10px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #b9b6ae; }
.roll-legend span { display: inline-flex; align-items: center; gap: 4px; }
.roll-legend span::before { content: ""; width: 9px; height: 9px; border-radius: 2px; background: var(--roll-color); box-shadow: 0 0 6px var(--roll-color); }

/* ─────────────────────────────────────────────────────────────────────────
   Forged controls (18.10.): every functional button uses the gold/teal
   crystal plates. Assets in assets/ui/controls/*-v3.webp are 9-slice plates:
   ornamented caps stay crisp, only the calm centre strip stretches.
   ───────────────────────────────────────────────────────────────────────── */
:root {
  --vm-plate-primary: url("./assets/ui/controls/primary-plate-v3.webp");
  --vm-plate: url("./assets/ui/controls/button-plate-v3.webp");
}
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.primary, .button.veydris-cta):not(.journey-hero__action),
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.metal, .button.ghost, .button.craft, .button.apex, .button.salvage) {
  border-style: solid !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  clip-path: none !important;
  min-height: 46px;
  color: #ffe9b8 !important;
  font-family: Cinzel, Georgia, serif !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-shadow: 0 1px 2px #000, 0 0 10px rgba(0, 0, 0, .6) !important;
  outline: none !important;
  transition: filter .18s ease, transform .18s ease !important;
}
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.primary, .button.veydris-cta):not(.journey-hero__action) {
  min-height: 52px !important;
  border-width: 0 46px 0 54px !important;
  border-image: var(--vm-plate-primary) 0 149 0 175 fill / 0 46px 0 54px stretch !important;
  padding: 12px 4px !important;
}
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.metal, .button.ghost, .button.craft, .button.apex, .button.salvage) {
  border-width: 0 30px !important;
  border-image: var(--vm-plate) 0 136 fill / 0 30px stretch !important;
  padding: 10px 6px !important;
  color: #f1e3c0 !important;
}
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.primary, .button.veydris-cta, .button.metal, .button.ghost, .button.craft, .button.apex, .button.salvage)::before,
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.primary, .button.veydris-cta, .button.metal, .button.ghost, .button.craft, .button.apex, .button.salvage)::after { display: none !important; }
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.primary, .button.veydris-cta, .button.metal, .button.ghost, .button.craft, .button.apex, .button.salvage):is(:hover, :focus-visible):not(:disabled) {
  filter: brightness(1.18) saturate(1.1) drop-shadow(0 0 10px rgba(110, 230, 220, .28));
  color: #fff6dc !important;
}
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.primary, .button.veydris-cta, .button.metal, .button.ghost, .button.craft, .button.apex, .button.salvage):active:not(:disabled) { transform: translateY(1px); filter: brightness(.95); }
html body.vey-renewal:not(#vm-none) :is(#view, .returning-summary, #phase5Feedback, .game-tooltip, #accountLayer, #recoveryLayer, .objective-bar, .loot-celebration) :is(.button.primary, .button.veydris-cta, .button.metal, .button.ghost, .button.craft, .button.apex, .button.salvage):disabled {
  filter: grayscale(.85) brightness(.62) !important;
  color: #b9b4a6 !important;
  cursor: not-allowed;
}
/* Salvage keeps a warning tint on the shared plate. */
html body.vey-renewal:not(#vm-none) #view .button.salvage:not(:disabled) { filter: hue-rotate(-150deg) saturate(1.2) brightness(.95); color: #ffd8c8 !important; }

/* Tab rows: inactive tabs are quiet text, the active tab sits on the plate. */
html body.vey-renewal:not(#vm-none) #view :is(.community-tabs, .adventure-tabs, .market-tabs, .inventory-tabs, .inventory-utility-tabs, .experience-tabs, .forge-filters) > button:is(.active, [aria-selected="true"], [aria-pressed="true"]) {
  border-style: solid !important;
  border-color: transparent !important;
  border-width: 0 26px !important;
  border-image: var(--vm-plate) 0 136 fill / 0 26px stretch !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: #ffeab8 !important;
  text-shadow: 0 1px 2px #000 !important;
}

/* Previous / Next: crystal medallions instead of hollow diamonds. */
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune) > i {
  width: 46px !important;
  height: 46px !important;
  flex: 0 0 46px;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("./assets/ui/controls/arrow-next-v3.webp") center / contain no-repeat !important;
  box-shadow: none !important;
  transform: none !important;
  clip-path: none !important;
  transition: filter .18s ease, transform .18s ease;
}
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune).previous > i { background-image: url("./assets/ui/controls/arrow-prev-v3.webp") !important; }
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune) > i::before,
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune) > i::after { display: none !important; }
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune):is(:hover, :focus-visible) > i { filter: brightness(1.2) drop-shadow(0 0 10px rgba(110, 230, 220, .45)); transform: scale(1.06) !important; }
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune):disabled > i { filter: grayscale(.9) brightness(.55); }

/* Plain list pagination (community, market) gets the same medallions. */
html body.vey-renewal:not(#vm-none) #view :is([data-community-page], [data-action="marketPage"]) { display: inline-flex !important; align-items: center; gap: 8px; }
html body.vey-renewal:not(#vm-none) #view :is([data-community-page="prev"], [data-action="marketPage"]:first-child)::before,
html body.vey-renewal:not(#vm-none) #view :is([data-community-page="next"], [data-action="marketPage"]:last-child)::after {
  content: "" !important; display: inline-block !important; width: 30px; height: 30px; flex: 0 0 30px;
  background: url("./assets/ui/controls/arrow-next-v3.webp") center / contain no-repeat;
}
html body.vey-renewal:not(#vm-none) #view :is([data-community-page="prev"], [data-action="marketPage"]:first-child)::before { background-image: url("./assets/ui/controls/arrow-prev-v3.webp"); }

/* Filter chip rows: only the selected chip is forged, the rest stay quiet. */
html body.vey-renewal:not(#vm-none) #view .forge-filters > .button.ghost {
  border-image: none !important; border: 1px solid rgba(214, 186, 120, .22) !important; border-radius: 10px !important;
  background: rgba(255, 255, 255, .03) !important; color: #cfc6b0 !important;
}

/* Focus navigator cards: no boxed chevrons, just label + medallion. */
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune) > i { display: inline-block !important; vertical-align: middle; }
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune)::before,
html body.vey-renewal:not(#vm-none) #view :is(.adventure-rune, .focus-rune, .mission-rune)::after { display: none !important; content: none !important; }
html body.vey-renewal:not(#vm-none) #view .focus-rune { display: inline-flex !important; align-items: center; gap: 10px; background: rgba(255,255,255,.025) !important; border: 1px solid rgba(214,186,120,.18) !important; }
html body.vey-renewal:not(#vm-none) #view .focus-rune.next { justify-content: flex-end; }

/* ─────────────────────────────────────────────────────────────────────────
   Item slots (18.10.): one ornate gold frame, transparent inside, rarity as a
   soft glow behind the item instead of stacked boxes, brackets and dashes.
   ───────────────────────────────────────────────────────────────────────── */
html body.vey-renewal:not(#vm-none) .item-slot {
  --slot-glow: var(--loot-beam, #9b8f78);
  position: relative;
  border: 12px solid transparent !important;
  border-image: url("./assets/ui/controls/item-frame-v3.webp") 40 / 12px stretch !important;
  border-radius: 0 !important;
  background: radial-gradient(circle at 50% 56%, color-mix(in srgb, var(--slot-glow) 30%, transparent) 0, color-mix(in srgb, var(--slot-glow) 8%, transparent) 46%, transparent 70%) !important;
  box-shadow: none !important;
  outline: none !important;
  clip-path: none !important;
  overflow: visible !important;
  transition: filter .18s ease, transform .18s ease !important;
}
html body.vey-renewal:not(#vm-none) .item-slot::before,
html body.vey-renewal:not(#vm-none) .item-slot::after { display: none !important; }
html body.vey-renewal:not(#vm-none) .item-slot > img {
  border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important;
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .65)) drop-shadow(0 0 10px color-mix(in srgb, var(--slot-glow) 35%, transparent));
}
html body.vey-renewal:not(#vm-none) .item-slot:is(:hover, :focus-visible) { filter: brightness(1.15) drop-shadow(0 0 10px color-mix(in srgb, var(--slot-glow) 55%, transparent)); transform: translateY(-1px); }
/* Empty and locked slots: a faint frame and the slot silhouette only. */
html body.vey-renewal:not(#vm-none) .item-slot.item-slot-empty,
html body.vey-renewal:not(#vm-none) .item-slot.capacity-slot-locked { background: none !important; opacity: .5; }
html body.vey-renewal:not(#vm-none) .item-slot.item-slot-empty > :is(img, span) { opacity: .45; border: 0 !important; background: none !important; }
html body.vey-renewal:not(#vm-none) .item-slot.capacity-slot-locked { opacity: .32; }
/* Badges: small and quiet, no boxes. */
html body.vey-renewal:not(#vm-none) .item-slot .item-slot-rank {
  right: 2px !important; bottom: 2px !important; padding: 0 3px !important; border: 0 !important; border-radius: 3px !important;
  background: rgba(8, 9, 14, .78) !important; color: #ffe2a0 !important; font-size: 10px !important; box-shadow: none !important;
}
html body.vey-renewal:not(#vm-none) .equipment-slot .item-slot .item-slot-equipped { display: none !important; }
html body.vey-renewal:not(#vm-none) .item-slot .item-slot-equipped {
  left: 2px !important; bottom: 2px !important; width: 14px !important; height: 14px !important; min-width: 0 !important; padding: 0 !important;
  border: 0 !important; border-radius: 50% !important; background: #6fd6c9 !important; color: #08201e !important; font-size: 8px !important; line-height: 14px !important; text-align: center;
}
html body.vey-renewal:not(#vm-none) .item-slot .item-slot-marker.class-lock {
  border: 0 !important; background: none !important; box-shadow: none !important; color: #e8c36e !important; font-size: 11px !important; top: 1px !important; right: 2px !important; opacity: .85;
}
/* The equipment card around each paper-doll slot: label + slot, no extra box. */
html body.vey-renewal:not(#vm-none) #view .equipment-slot { background: none !important; border: 0 !important; box-shadow: none !important; }
html body.vey-renewal:not(#vm-none) .item-slot > img {
  position: absolute !important; inset: -4px !important; width: calc(100% + 8px) !important; height: calc(100% + 8px) !important;
  max-width: none !important; margin: 0 !important; object-fit: contain !important; transform: none !important;
}
html body.vey-renewal:not(#vm-none) .item-slot.rarity-ungewöhnlich { --slot-glow: #55d692; }
html body.vey-renewal:not(#vm-none) .item-slot.rarity-magisch { --slot-glow: #54a9ff; }
html body.vey-renewal:not(#vm-none) .item-slot.rarity-selten { --slot-glow: #f1bd4f; }
html body.vey-renewal:not(#vm-none) .item-slot.rarity-episch { --slot-glow: #a867ff; }
html body.vey-renewal:not(#vm-none) .item-slot.rarity-legendär { --slot-glow: #ff8a38; }
html body.vey-renewal:not(#vm-none) .item-slot.rarity-mythisch { --slot-glow: #ff477e; }
html body.vey-renewal:not(#vm-none) .item-slot.rarity-ewig { --slot-glow: #95f5ff; }

/* Item details (tap / click): large item preview and roomy forged actions. */
html body.vey-renewal:not(#vm-none) .game-tooltip:is(.is-pinned, .is-bottom-sheet) .game-tooltip-item > header { align-items: center; gap: 16px; }
html body.vey-renewal:not(#vm-none) .game-tooltip:is(.is-pinned, .is-bottom-sheet) .game-tooltip-item > header > img {
  width: 132px !important; height: 132px !important; flex: 0 0 132px; object-fit: contain; padding: 10px;
  border: 12px solid transparent; border-image: url("./assets/ui/controls/item-frame-v3.webp") 40 / 12px stretch;
  background: radial-gradient(circle at 50% 56%, rgba(214, 186, 120, .22), transparent 70%);
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .7));
}
html body.vey-renewal:not(#vm-none) .game-tooltip .game-tooltip-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; }
html body.vey-renewal:not(#vm-none) .game-tooltip .game-tooltip-actions :is(.button, button) {
  min-height: 40px !important; width: 100%; white-space: nowrap; overflow: visible;
  border-width: 0 20px !important; border-image-width: 0 20px !important;
  font-size: 10px !important; letter-spacing: .05em !important; padding: 8px 2px !important;
}
html body.vey-renewal:not(#vm-none) .game-tooltip footer { flex-direction: column; align-items: stretch !important; gap: 8px; }
html body.vey-renewal:not(#vm-none) .game-tooltip:is(.is-pinned, .is-bottom-sheet) .game-tooltip-item > header { display: grid !important; grid-template-columns: 132px minmax(0, 1fr) !important; }
html body.vey-renewal:not(#vm-none) .game-tooltip:is(.is-pinned, .is-bottom-sheet) .game-tooltip-item > header > div { min-width: 0; }
@media (max-width: 420px) {
  html body.vey-renewal:not(#vm-none) .game-tooltip:is(.is-pinned, .is-bottom-sheet) .game-tooltip-item > header { grid-template-columns: 104px minmax(0, 1fr) !important; }
  html body.vey-renewal:not(#vm-none) .game-tooltip:is(.is-pinned, .is-bottom-sheet) .game-tooltip-item > header > img { width: 104px !important; height: 104px !important; flex-basis: 104px; }
}

/* Header objective: compact forged plate that fits the top bar. */
html body.vey-renewal:not(#vm-none) .objective-bar .button.veydris-cta.objective-command {
  min-height: 34px !important; height: 34px; border-width: 0 34px 0 40px !important; border-image-width: 0 34px 0 40px !important;
  padding: 0 2px !important; font-size: 10px !important; letter-spacing: .06em !important; white-space: nowrap;
}
html body.vey-renewal:not(#vm-none) #view .focus-view-all {
  border: 0 solid transparent !important; border-width: 0 22px !important; border-image: var(--vm-plate) 0 136 fill / 0 22px stretch !important;
  background: none !important; border-radius: 0 !important; color: #f1e3c0 !important; font-family: Cinzel, Georgia, serif !important; font-size: 11px !important; letter-spacing: .06em;
}
html body.vey-renewal:not(#vm-none) .objective-bar .button.veydris-cta.objective-command { white-space: nowrap !important; min-width: max-content !important; flex: 0 0 auto !important; }
html body.vey-renewal:not(#vm-none) li[data-roll-tier] { padding-left: 10px !important; }
html body.vey-renewal:not(#vm-none) #view .starter-weapon ul li[data-roll-tier] { padding: 3px 0 4px 10px !important; }
.returning-summary { background: radial-gradient(circle, rgba(10, 11, 18, .78), rgba(3, 4, 8, .92)) !important; backdrop-filter: blur(3px); }
.returning-summary > div { background: linear-gradient(180deg, rgba(16, 18, 28, .98), rgba(9, 10, 16, .98)) !important; }

/* ─────────────────────────────────────────────────────────────────────────
   Mission board (18.10.): one large artwork per offer, details inside,
   medallions left/right to switch between 1 min … 60 min offers.
   ───────────────────────────────────────────────────────────────────────── */
html body.vey-renewal #view .mission-board { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; margin: 18px 0; }
html body.vey-renewal #view .mission-board__card {
  position: relative; min-height: 420px; display: flex; align-items: stretch; overflow: hidden;
  border: 1px solid rgba(214, 186, 120, .35); border-radius: 18px;
  background: linear-gradient(90deg, rgba(6, 7, 12, .94) 0%, rgba(6, 7, 12, .78) 38%, rgba(6, 7, 12, .1) 70%), var(--mission-art) center / cover no-repeat, #0b0c12;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(255, 255, 255, .03);
}
html body.vey-renewal #view .mission-board__card::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 85% 110%, rgba(110, 230, 220, .14), transparent 55%); }
html body.vey-renewal #view .mission-board__copy { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 12px; max-width: 520px; padding: clamp(22px, 3vw, 40px); }
html body.vey-renewal #view .mission-board__copy .eyebrow { color: #7fe3d7 !important; letter-spacing: .16em; font-size: 11px; }
html body.vey-renewal #view .mission-board__copy h2 { margin: 0; font: 700 clamp(28px, 3.2vw, 44px)/1.08 Cinzel, Georgia, serif; color: #f6dfa6; text-shadow: 0 3px 14px #000; }
html body.vey-renewal #view .mission-board__copy > p { margin: 0; color: #d9d2c2; font-size: 15px; line-height: 1.55; }
html body.vey-renewal #view .mission-board__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 4px 0 0; }
html body.vey-renewal #view .mission-board__stats > div { padding: 10px 12px; border: 1px solid rgba(214, 186, 120, .2); border-radius: 12px; background: rgba(8, 9, 14, .6); backdrop-filter: blur(4px); }
html body.vey-renewal #view .mission-board__stats dt { color: #a9a294; font-size: 10px; letter-spacing: .14em; }
html body.vey-renewal #view .mission-board__stats dd { margin: 4px 0 0; color: #fff1cc; font: 700 18px/1.2 Cinzel, Georgia, serif; }
html body.vey-renewal #view .mission-board__stats dd small { color: #7fe3d7; font: 600 11px/1 Manrope, sans-serif; margin-left: 4px; }
html body.vey-renewal #view .mission-board__finds { display: flex; gap: 8px; align-items: center; color: #f1d27a !important; font-size: 13px !important; letter-spacing: .04em; }
html body.vey-renewal #view .mission-board__finds::before { content: "◆"; color: #7fe3d7; }
html body.vey-renewal #view .mission-board__copy .button.primary { align-self: flex-start; min-width: 260px; margin-top: 6px; font-size: 13px !important; }
html body.vey-renewal #view .mission-rune { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 0; border: 0; background: none; color: #d8cdb2; font: 600 11px/1 Cinzel, Georgia, serif; letter-spacing: .1em; cursor: pointer; }
html body.vey-renewal #view .mission-rune > i { width: 58px !important; height: 58px !important; flex-basis: 58px !important; }
html body.vey-renewal #view .mission-board__pips { grid-column: 1 / -1; display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
html body.vey-renewal #view .mission-board__pips button { min-width: 64px; padding: 7px 10px; border: 1px solid rgba(214, 186, 120, .25); border-radius: 999px; background: rgba(255, 255, 255, .03); color: #cfc6b0; font: 600 11px/1 Cinzel, Georgia, serif; letter-spacing: .08em; cursor: pointer; }
html body.vey-renewal #view .mission-board__pips button small { display: block; margin-top: 3px; color: #8f8878; font: 500 9px/1 Manrope, sans-serif; letter-spacing: .06em; }
html body.vey-renewal #view .mission-board__pips button[aria-pressed="true"] { border-color: #e7c579; background: linear-gradient(180deg, rgba(231, 197, 121, .2), rgba(231, 197, 121, .05)); color: #ffe9b6; box-shadow: 0 0 14px rgba(231, 197, 121, .25); }
html body.vey-renewal #view .mission-board__pips button:disabled { opacity: .4; cursor: not-allowed; }
@media (max-width: 760px) {
  html body.vey-renewal #view .mission-board { grid-template-columns: 1fr 1fr; gap: 10px; }
  html body.vey-renewal #view .mission-board__card { grid-column: 1 / -1; grid-row: 1; min-height: 520px; align-items: flex-end;
    background: linear-gradient(0deg, rgba(6, 7, 12, .96) 0%, rgba(6, 7, 12, .82) 55%, rgba(6, 7, 12, .1) 85%), var(--mission-art) center top / cover no-repeat, #0b0c12; }
  html body.vey-renewal #view .mission-board__copy { padding: 20px; }
  html body.vey-renewal #view .mission-rune.previous { grid-row: 2; justify-self: start; flex-direction: row; }
  html body.vey-renewal #view .mission-rune.next { grid-row: 2; justify-self: end; flex-direction: row-reverse; }
  html body.vey-renewal #view .mission-board__copy .button.primary { align-self: stretch; min-width: 0; }
}

/* ─────────────────────────────────────────────────────────────────────────
   Compact collections (18.10.): small cards, details open in the popup (×).
   ───────────────────────────────────────────────────────────────────────── */
html body.vey-renewal:not(#vm-none) #view :is(.mount-grid, :has(> .mount-card)) { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important; gap: 12px !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card { min-height: 0 !important; padding: 10px !important; gap: 6px !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-art { height: 132px !important; min-height: 0 !important; aspect-ratio: auto !important; background-size: contain !important; background-position: center bottom !important; cursor: zoom-in; }
html body.vey-renewal:not(#vm-none) #view .mount-card :is(.collection-farm-guide, .collection-comparison, .collection-card-copy > p) { display: none !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-bonus-list > span:nth-child(n + 3) { display: none !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card h3 { font-size: 15px !important; margin: 2px 0 !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .tag { font-size: 9px !important; white-space: normal !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-card-footer { gap: 6px !important; padding-top: 6px !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-card-footer :is(.button, button) {
  width: 100%; min-height: 36px !important; font-size: 9.5px !important; letter-spacing: .04em !important; white-space: nowrap;
  border-width: 0 20px 0 22px !important; border-image-width: 0 20px 0 22px !important; padding: 6px 2px !important;
}

/* Companion focus card: one compact row instead of a full screen. */
html body.vey-renewal:not(#vm-none) #view .companion-focus-card { grid-template-columns: 210px minmax(0, 1fr) !important; gap: 18px !important; padding: 14px !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-card .companion-icon.collection-art { min-height: 0 !important; height: 230px !important; aspect-ratio: auto !important; cursor: zoom-in; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-card :is(.companion-mods, .collection-farm-guide) { display: none !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-card h3 { font-size: 22px !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important; gap: 12px !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all > .companion-focus-card { grid-template-columns: 1fr !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .companion-icon.collection-art { height: 150px !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .companion-focus-card :is(.collection-level-track, .collection-card-copy > p) { display: none !important; }
@media (max-width: 760px) {
  html body.vey-renewal:not(#vm-none) #view .companion-focus-card { grid-template-columns: 120px minmax(0, 1fr) !important; }
  html body.vey-renewal:not(#vm-none) #view .companion-focus-card .companion-icon.collection-art { height: 150px !important; max-height: none; aspect-ratio: auto !important; }
  html body.vey-renewal:not(#vm-none) #view .companion-focus-card > * { grid-column: auto !important; }
  html body.vey-renewal:not(#vm-none) #view .companion-focus-card .collection-card-footer { grid-column: 1 / -1 !important; }
  html body.vey-renewal:not(#vm-none) #view :is(.mount-grid, :has(> .mount-card)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* Popup preview: the full creature art, large and transparent. */
html body.vey-renewal .game-tooltip .game-tooltip-collection > img.collection-preview { width: 100% !important; height: 220px !important; max-width: none !important; object-fit: contain; border: 0 !important; background: radial-gradient(ellipse at 50% 80%, rgba(214, 186, 120, .18), transparent 65%) !important; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .7)); margin-bottom: 8px; }
.tooltip-speed-example { margin: 8px 0; padding: 8px 10px; border: 1px solid rgba(127, 227, 215, .25); border-radius: 10px; background: rgba(127, 227, 215, .06); }
.tooltip-speed-example small { display: block; color: #7fe3d7; font-size: 9px; letter-spacing: .14em; }
.tooltip-speed-example b { color: #fff0c7; font-size: 13px; }
.tooltip-companion-mod { color: #9fd3ff !important; }

/* Journey: the hero walks the road as a free-standing figure, no box. */
html body.vey-renewal .journey-hero-token {
  width: 78px !important; height: 118px !important; bottom: 6px !important;
  border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  background: var(--traveler-portrait) center bottom / contain no-repeat !important;
  filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .75)) drop-shadow(0 0 14px rgba(231, 197, 121, .25));
}
html body.vey-renewal .journey-hero-token::after {
  content: "" !important; left: 50% !important; bottom: -4px !important; width: 64px; height: 12px; transform: translateX(-50%);
  border-radius: 50%; background: radial-gradient(ellipse, rgba(127, 227, 215, .45), transparent 70%);
}
html body.vey-renewal .journey-vignette.has-mount .journey-hero-token::before {
  content: ""; position: absolute; left: 30px; bottom: 0; width: 130px; height: 104px; z-index: -1;
  background: var(--traveler-mount) center bottom / contain no-repeat;
}

/* Calmer type scale: page titles were up to 52px. */
html body.vey-renewal:not(#vm-none) #view h1 { font-size: clamp(24px, 2.3vw, 34px) !important; line-height: 1.12 !important; }
html body.vey-renewal:not(#vm-none) #view h2 { font-size: min(1em + 12px, 30px); }
html body.vey-renewal:not(#vm-none) #view :is(.inventory-hero, .armory-command) h2,
html body.vey-renewal:not(#vm-none) #view .starter-forge > header h2 { font-size: clamp(22px, 2vw, 30px) !important; }
html body.vey-renewal:not(#vm-none) #view .mount-grid { grid-auto-rows: auto !important; align-items: start !important; }
html body.vey-renewal:not(#vm-none) #view .mount-grid > .mount-card { height: auto !important; min-height: 0 !important; max-height: none !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-card-footer :is(.button, button) * { white-space: nowrap !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-art { height: 112px !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-bonus-list > span { font-size: 11px !important; padding: 3px 8px !important; min-height: 0 !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-bonus-list { gap: 4px !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-card-status { font-size: 9px !important; margin: 0 !important; }
@media (max-width: 760px) {
  html body.vey-renewal:not(#vm-none) #view .mount-card .collection-card-details { display: block !important; }
  html body.vey-renewal:not(#vm-none) #view .mount-card .collection-bonus-list { display: flex !important; flex-wrap: wrap; }
}

/* ─────────────────────────────────────────────────────────────────────────
   Collection cards v2 (18.10.): rarity-driven frame, gem badge, level seal,
   headline stat + value rows. The old tag line and chips are replaced.
   ───────────────────────────────────────────────────────────────────────── */
[data-rarity="common"] { --rc: #b9b3a5; }
[data-rarity="uncommon"] { --rc: #5fd27a; }
[data-rarity="rare"] { --rc: #4fa3ff; }
[data-rarity="epic"] { --rc: #b06cff; }
[data-rarity="legendary"] { --rc: #ff9a3c; }
[data-rarity="mythic"] { --rc: #ff4f7b; }
[data-rarity="eternal"] { --rc: #5ff0e0; }
[data-rarity="arena"] { --rc: #ff5a4a; }
html body.vey-renewal:not(#vm-none) #view :is(.mount-card, .companion-card, .elixir-card)[data-rarity] {
  --rc-soft: color-mix(in srgb, var(--rc) 22%, transparent);
  position: relative; overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--rc) 45%, #2a2c38) !important; border-radius: 14px !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--rc) 9%, #11131c) 0%, #0c0d14 62%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 26px rgba(0,0,0,.45) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
html body.vey-renewal:not(#vm-none) #view :is(.mount-card, .companion-card, .elixir-card)[data-rarity]::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, transparent, var(--rc), transparent); opacity: .9; }
html body.vey-renewal:not(#vm-none) #view :is(.mount-card, .companion-card, .elixir-card)[data-rarity]:hover { transform: translateY(-2px); border-color: var(--rc) !important; box-shadow: 0 14px 34px rgba(0,0,0,.55), 0 0 22px var(--rc-soft) !important; }
html body.vey-renewal:not(#vm-none) #view :is(.mount-card, .companion-card, .elixir-card)[data-rarity] .collection-art {
  position: relative; border: 0 !important; border-radius: 10px !important;
  background: var(--collection-art) center 88% / contain no-repeat, radial-gradient(ellipse 70% 55% at 50% 72%, var(--rc-soft), transparent 70%), linear-gradient(180deg, rgba(255,255,255,.02), transparent) !important;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.6));
}
html body.vey-renewal:not(#vm-none) #view :is(.mount-card.locked-mount, .companion-card.locked-companion) .collection-art { filter: grayscale(.55) brightness(.75) drop-shadow(0 6px 10px rgba(0,0,0,.6)); }
.collection-level-badge { position: absolute; top: 6px; right: 6px; padding: 2px 7px; border: 1px solid rgba(231,197,121,.45); border-radius: 999px; background: rgba(8,9,14,.82); color: #f1d38a; font: 700 9.5px/1.4 Cinzel, Georgia, serif; letter-spacing: .06em; }
.collection-card-kicker { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 2px; }
.collection-rarity-gem { display: inline-flex; align-items: center; gap: 5px; color: var(--rc, #d8cdb2); font: 700 10px/1 Cinzel, Georgia, serif; letter-spacing: .1em; text-transform: uppercase; }
.collection-rarity-gem::before { content: ""; width: 8px; height: 8px; transform: rotate(45deg); background: var(--rc, #d8cdb2); box-shadow: 0 0 8px var(--rc, #d8cdb2); }
.collection-kind { color: #8f8a7e; font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; }
html body.vey-renewal:not(#vm-none) #view :is(.mount-card, .companion-card) h3 { font-family: Cinzel, Georgia, serif !important; color: #f4e6c4 !important; font-size: 15px !important; }
html body.vey-renewal:not(#vm-none) #view .mount-card .collection-bonus-list { display: none !important; }
.collection-stat-block { display: grid; gap: 6px; margin-top: 4px; }
.collection-headline-stat { display: flex; align-items: baseline; gap: 8px; padding: 6px 10px; border-radius: 10px; background: linear-gradient(90deg, rgba(127,227,215,.12), transparent); border-left: 2px solid #7fe3d7; }
.collection-headline-stat b { color: #bff5ee; font: 700 22px/1 Cinzel, Georgia, serif; text-shadow: 0 0 12px rgba(127,227,215,.35); }
.collection-headline-stat span { color: #7fbdb5; font-size: 9.5px; letter-spacing: .14em; }
.collection-stat-rows { display: grid; gap: 3px; margin: 0; padding: 0 2px; list-style: none; }
.collection-stat-rows li { display: flex; gap: 8px; align-items: baseline; font-size: 12px; color: #b7b0a2; }
.collection-stat-rows li b { min-width: 42px; color: #f1d27a; font-weight: 700; }
html body.vey-renewal:not(#vm-none) #view .mount-card.active-mount { box-shadow: 0 0 0 2px #e7c579, 0 0 26px rgba(231,197,121,.3) !important; }
@media (max-width: 760px) { .collection-headline-stat b { font-size: 19px; } .collection-stat-rows li { font-size: 11px; } }
.collection-headline-stat { white-space: nowrap; }
.collection-headline-stat b { font-size: 20px; }
.collection-kind { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 55%; font-size: 8.5px; text-align: right; }
html body.vey-renewal:not(#vm-none) #view .mount-grid { align-items: stretch !important; }
html body.vey-renewal:not(#vm-none) #view .mount-grid > .mount-card { display: flex !important; flex-direction: column !important; }
html body.vey-renewal:not(#vm-none) #view .mount-grid > .mount-card > .collection-card-footer { margin-top: auto !important; }
html body.vey-renewal:not(#vm-none) #view .companion-card[data-rarity] > .collection-card-copy > .tag { display: none !important; }
html body.vey-renewal:not(#vm-none) #view .companion-card .collection-art { position: relative; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all > .companion-card { display: flex !important; flex-direction: column !important; gap: 8px !important; padding: 10px !important; min-height: 0 !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all > .companion-card > * { grid-column: auto !important; width: 100% !important; max-width: none !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .companion-icon.collection-art { width: 100% !important; height: 150px !important; flex: 0 0 150px; background: var(--collection-art) center 90% / contain no-repeat, radial-gradient(ellipse 70% 55% at 50% 72%, var(--rc-soft, rgba(214,186,120,.18)), transparent 70%) !important; }
html body.vey-renewal:not(#vm-none) #view .companion-card :is(.collection-comparison, .companion-mods, .collection-farm-guide) { display: none !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .collection-card-copy > p { white-space: normal !important; font-size: 11px !important; color: #9b968b !important; }
html body.vey-renewal:not(#vm-none) #view .companion-card .collection-bonus-list { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; }
html body.vey-renewal:not(#vm-none) #view .companion-card .collection-bonus-list > span { white-space: normal !important; font-size: 11px !important; padding: 3px 8px !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .collection-card-footer { margin-top: auto !important; flex-wrap: wrap; gap: 6px; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .collection-card-footer :is(.button, button) { flex: 1 1 100%; min-height: 36px !important; font-size: 9.5px !important; border-width: 0 20px 0 22px !important; border-image-width: 0 20px 0 22px !important; white-space: nowrap; }
.collection-level-badge { writing-mode: horizontal-tb !important; white-space: nowrap; z-index: 2; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .collection-card-footer { display: grid !important; grid-template-columns: 1fr !important; }
html body.vey-renewal:not(#vm-none) #view .companion-focus-grid.vey-view-all .collection-card-footer > .collection-card-status { margin: 0 !important; }

/* Return screen: keep / sell per item. */
html body.vey-renewal #view .loot-sell-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 10px 0 12px; padding: 10px 12px; border: 1px solid rgba(214,186,120,.2); border-radius: 12px; background: rgba(255,255,255,.025); }
html body.vey-renewal #view .loot-sell-tools > span { flex: 1 1 260px; color: #cfc6b0; font-size: 12px; }
html body.vey-renewal #view .expedition-loot-slot.equipment { display: flex; flex-direction: column; align-items: center; gap: 6px; }
html body.vey-renewal #view .loot-keep-toggle { min-width: 74px; padding: 4px 8px; border: 1px solid rgba(95,210,122,.55); border-radius: 999px; background: rgba(95,210,122,.12); color: #9ff0b4; font: 700 9.5px/1.2 Cinzel, Georgia, serif; letter-spacing: .08em; cursor: pointer; white-space: nowrap; }
html body.vey-renewal #view .loot-keep-toggle[aria-pressed="true"] { border-color: rgba(255,90,74,.65); background: rgba(255,90,74,.15); color: #ffb3a8; }
html body.vey-renewal #view .expedition-loot-slot.marked-sell .item-slot { filter: grayscale(.7) brightness(.7); }
html body.vey-renewal #view .expedition-salvage-summary { margin: 12px 0; padding: 10px 14px; border-left: 2px solid #f1d27a; border-radius: 8px; background: rgba(241,210,122,.07); color: #f1d27a; }

/* Merchant offers in the shared card language. */
html body.vey-renewal:not(#vm-none) #view .rotating-stock { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important; gap: 12px !important; }
html body.vey-renewal:not(#vm-none) #view .elixir-card[data-rarity] { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important; padding: 14px !important; min-height: 0 !important; text-align: left !important; }
html body.vey-renewal:not(#vm-none) #view .elixir-card > .item-slot { align-self: center; width: 104px !important; height: 104px !important; }
html body.vey-renewal:not(#vm-none) #view .elixir-card > .elixir-art { align-self: center; width: 96px !important; height: 96px !important; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0,0,0,.6)); }
html body.vey-renewal:not(#vm-none) #view .elixir-card h3 { margin: 0 !important; font: 700 14px/1.25 Cinzel, Georgia, serif !important; color: #f4e6c4 !important; min-height: 2.5em; }
html body.vey-renewal:not(#vm-none) #view .elixir-card .elixir-hint { margin: 0 !important; color: #8f8a7e !important; font-size: 11px !important; }
html body.vey-renewal:not(#vm-none) #view .elixir-card > .button { margin-top: auto; width: 100%; min-height: 40px !important; font-size: 11px !important; }
html body.vey-renewal:not(#vm-none) #view .elixir-card > .button + .button { margin-top: 0; }
html body.vey-renewal:not(#vm-none) #view .elixir-card.sold { opacity: .55; filter: grayscale(.6); }

/* Bestiary: tall portrait pages with the creature large, info below. */
html body.vey-renewal:not(#vm-none) #view .bestiary-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important; gap: 10px !important; }
html body.vey-renewal:not(#vm-none) #view .beast-page { display: flex !important; flex-direction: column !important; padding: 0 !important; min-height: 0 !important; overflow: hidden; border: 1px solid rgba(214,186,120,.22) !important; border-radius: 12px !important; background: linear-gradient(180deg, #151722, #0b0c13) !important; transition: transform .18s ease, border-color .18s ease; }
html body.vey-renewal:not(#vm-none) #view .beast-page:hover { transform: translateY(-2px); border-color: rgba(231,197,121,.6) !important; }
html body.vey-renewal:not(#vm-none) #view .beast-page .bestiary-art { width: 100% !important; height: 130px !important; flex: 0 0 130px; background-size: cover !important; background-position: center 30% !important; }
html body.vey-renewal:not(#vm-none) #view .beast-page .bestiary-copy { width: 100% !important; padding: 8px 10px 10px !important; text-align: left; }
html body.vey-renewal:not(#vm-none) #view .beast-page.undiscovered .bestiary-art { filter: brightness(.25) contrast(1.2); }
html body.vey-renewal:not(#vm-none) #view .beast-page.bestiary-boss { border-color: rgba(255,90,74,.5) !important; box-shadow: inset 0 2px 0 rgba(255,90,74,.7); }

/* Achievements: plaques with a clear state colour. */
html body.vey-renewal:not(#vm-none) #view .legend-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important; gap: 12px !important; }
html body.vey-renewal:not(#vm-none) #view .legend-plaque { grid-column: auto !important; display: grid !important; grid-template-columns: 64px minmax(0, 1fr) !important; gap: 12px !important; align-items: center; padding: 14px !important; border-radius: 14px !important; border: 1px solid rgba(214,186,120,.22) !important; background: linear-gradient(135deg, #151722, #0c0d14) !important; }
html body.vey-renewal:not(#vm-none) #view .legend-plaque > .button { grid-column: 1 / -1; min-height: 40px !important; font-size: 11px !important; }
html body.vey-renewal:not(#vm-none) #view .legend-plaque .legend-icon { width: 64px !important; height: 64px !important; }
html body.vey-renewal:not(#vm-none) #view .legend-plaque.ready { border-color: rgba(231,197,121,.7) !important; box-shadow: 0 0 20px rgba(231,197,121,.18); }
html body.vey-renewal:not(#vm-none) #view .legend-plaque.unlocked { border-color: rgba(127,227,215,.5) !important; }
html body.vey-renewal:not(#vm-none) #view .legend-plaque.locked { opacity: .72; }
html body.vey-renewal:not(#vm-none) #view .legend-plaque.locked .legend-icon { filter: grayscale(.8) brightness(.6); }
html body.vey-renewal:not(#vm-none) #view .beast-page { grid-column: auto !important; grid-row: auto !important; width: auto !important; }

/* Inventory: one heading (the arsenal hero), no duplicated sub-navigation. */
html body.vey-renewal:not(#vm-none)[data-view="inventory"] #view .content > .view-title,
html body.vey-renewal:not(#vm-none)[data-view="storage"] #view .content > .view-title { display: none !important; }
html body.vey-renewal:not(#vm-none) #view .armory-command > .inventory-tabs { display: none !important; }
html body.vey-renewal:not(#vm-none) #view .armory-command__hero { padding: 16px 20px !important; min-height: 0 !important; }
html body.vey-renewal:not(#vm-none) #view .armory-command > .button.metal { width: auto !important; align-self: flex-end; margin-left: auto; display: block; min-width: 240px; }
html body.vey-renewal:not(#vm-none) #view .inventory-trade-hint { padding: 8px 12px !important; font-size: 12px !important; }

/* Forge: pick the item first, then work on it in three columns. */
html body.vey-renewal:not(#vm-none) #view .forge-workbench { display: flex !important; flex-direction: column !important; gap: 12px !important; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench > .forge-master { order: 0; padding: 14px 18px !important; min-height: 0 !important; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench > .forge-filters { order: 1; margin: 0 !important; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench > .forge-picker { order: 2; display: flex !important; flex-wrap: wrap; gap: 8px !important; padding: 10px !important; border: 1px solid rgba(214,186,120,.18); border-radius: 12px; background: rgba(255,255,255,.02); }
html body.vey-renewal:not(#vm-none) #view .forge-workbench > .forge-anvil { order: 3; padding: 14px !important; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench .anvil-item { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1fr) !important; gap: 12px !important; align-items: start; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench .anvil-item > :is(header, footer) { grid-column: 1 / -1 !important; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench .anvil-item > section { grid-column: auto !important; width: auto !important; margin: 0 !important; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench .forge-action-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 6px !important; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench .forge-action-grid .button { min-height: 38px !important; font-size: 10px !important; white-space: nowrap; }
html body.vey-renewal:not(#vm-none) #view .forge-workbench .forge-change-preview > div { display: none !important; }
@media (max-width: 1000px) {
  html body.vey-renewal:not(#vm-none) #view .forge-workbench .anvil-item { grid-template-columns: 1fr !important; }
}
html body.vey-renewal:not(#vm-none) #view .item-mastery :is(.button, button) { position: static !important; display: block !important; width: 100% !important; margin: 8px 0 0 !important; min-height: 38px !important; font-size: 10px !important; transform: none !important; }
html body.vey-renewal:not(#vm-none) #view .item-mastery > * { position: relative; }

/* ─── Live events ─────────────────────────────────────────────────────── */
html body.vey-renewal #view .live-event-banner { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; margin: 0 0 14px; padding: 12px; border: 1px solid rgba(231,197,121,.45); border-radius: 16px;
  background: radial-gradient(ellipse at 0% 0%, rgba(231,197,121,.18), transparent 55%), radial-gradient(ellipse at 100% 100%, rgba(127,227,215,.14), transparent 55%), linear-gradient(135deg, #171827, #0c0d14);
  box-shadow: 0 10px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05); }
.live-event-banner__pulse { align-self: center; padding: 6px 12px; border-radius: 999px; background: linear-gradient(90deg, #e7c579, #ffdf9a); color: #1b1408; font: 800 10px/1 Cinzel, Georgia, serif; letter-spacing: .14em; animation: vm-event-pulse 2.2s ease-in-out infinite; }
@keyframes vm-event-pulse { 50% { box-shadow: 0 0 18px rgba(231,197,121,.65); } }
html body.vey-renewal #view .live-event { flex: 1 1 260px; display: grid; gap: 6px; padding: 10px 12px; border-radius: 12px; background: rgba(8,9,14,.55); border: 1px solid rgba(214,186,120,.18); }
html body.vey-renewal #view .live-event header { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
html body.vey-renewal #view .live-event header b { color: #f6dfa6; font: 700 15px/1.2 Cinzel, Georgia, serif; }
html body.vey-renewal #view .live-event header small { color: #7fe3d7; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
html body.vey-renewal #view .live-event p { margin: 0; color: #b9b2a3; font-size: 12px; }
html body.vey-renewal #view .live-event div { display: flex; flex-wrap: wrap; gap: 5px; }
html body.vey-renewal #view .live-event div span { padding: 3px 8px; border-radius: 999px; background: rgba(127,227,215,.1); border: 1px solid rgba(127,227,215,.3); color: #bff5ee; font-size: 11px; font-weight: 700; }

/* ─── Loot celebration ────────────────────────────────────────────────── */
.loot-celebration { position: fixed; inset: 0; z-index: 140; display: grid; place-items: center; padding: 20px; background: radial-gradient(circle at 50% 40%, rgba(40,32,18,.55), rgba(3,4,8,.92)); backdrop-filter: blur(4px); animation: vm-returning-in .3s ease-out both; }
.loot-celebration > section { width: min(760px, 100%); max-height: calc(100dvh - 40px); overflow: auto; padding: 26px; border: 1px solid rgba(231,197,121,.5); border-radius: 20px; background: linear-gradient(180deg, #171827, #0b0c13); text-align: center; box-shadow: 0 30px 80px rgba(0,0,0,.7); }
.loot-celebration.is-epic > section { border-color: #ffb84d; box-shadow: 0 0 60px rgba(255,170,60,.35), 0 30px 80px rgba(0,0,0,.7); }
.loot-celebration .eyebrow { color: #7fe3d7; letter-spacing: .2em; font-size: 11px; }
.loot-celebration.is-epic .eyebrow { color: #ffcf7a; }
.loot-celebration h2 { margin: 6px 0 18px; color: #f6dfa6; font: 700 28px/1.1 Cinzel, Georgia, serif; }
.loot-celebration__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.loot-celebration figure { margin: 0; display: grid; justify-items: center; gap: 8px; padding: 12px 8px; border: 1px solid color-mix(in srgb, var(--rc, #b9b3a5) 45%, transparent); border-radius: 14px; background: radial-gradient(ellipse at 50% 30%, color-mix(in srgb, var(--rc, #b9b3a5) 20%, transparent), transparent 70%), rgba(255,255,255,.02); opacity: 0; animation: vm-loot-pop .45s ease-out forwards; }
.loot-celebration figure:nth-child(2) { animation-delay: .12s; } .loot-celebration figure:nth-child(3) { animation-delay: .24s; } .loot-celebration figure:nth-child(4) { animation-delay: .36s; } .loot-celebration figure:nth-child(5) { animation-delay: .48s; } .loot-celebration figure:nth-child(n+6) { animation-delay: .6s; }
@keyframes vm-loot-pop { from { opacity: 0; transform: translateY(14px) scale(.9); } to { opacity: 1; transform: none; } }
.loot-celebration figure.creature img { width: 120px; height: 100px; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0,0,0,.7)); }
.loot-celebration figure .item-slot { width: 84px !important; height: 84px !important; }
.loot-celebration figcaption small { display: block; color: var(--rc, #cfc6b0); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.loot-celebration figcaption b { color: #f4e6c4; font: 700 12px/1.3 Cinzel, Georgia, serif; }
.loot-celebration__gold { margin: 16px 0 0; color: #f1d27a; font: 700 18px/1 Cinzel, Georgia, serif; }
.loot-celebration .button.primary { margin-top: 18px; min-width: 220px; }
[data-rarity="magic"] { --rc: #54a9ff; }

/* =====================================================================
   STUFE 6 · Handy: schlanker Header, Profil-Kopf, Lager-Knopf
   ===================================================================== */
@media (max-width: 760px) {
  html body.vey-renewal .topbar { padding: 6px 10px 4px !important; gap: 6px !important; min-height: 0 !important; }
  html body.vey-renewal .topbar .resources { height: auto !important; min-height: 34px; align-items: center !important; padding: 0 !important; gap: 6px !important; overflow: visible !important; }
  html body.vey-renewal .topbar .resources > * { max-height: 34px; }
  html body.vey-renewal .topbar .resource { min-height: 32px !important; height: 32px !important; }
  html body.vey-renewal .topbar .global-hero { min-height: 40px !important; height: 40px !important; }
  html body.vey-renewal .topbar :is(.menu-button, #journeyTravel, .experience-guide-link) { width: 36px !important; height: 36px !important; min-height: 0 !important; }
  html body.vey-renewal #view .public-profile-header { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; padding: 12px !important; height: auto !important; }
  html body.vey-renewal #view .public-profile-header .profile-back { position: static !important; justify-self: start; width: auto !important; min-width: 0 !important; height: 36px !important; min-height: 36px !important; padding: 0 16px !important; font-size: 12px !important; transform: none !important; }
  html body.vey-renewal #view .public-profile-header .profile-edit { position: static !important; justify-self: stretch; height: 40px !important; min-height: 40px !important; }
  html body.vey-renewal #view .public-profile-identity p { white-space: normal !important; font-size: 12px !important; }
  html body.vey-renewal #view .storage-header .button, html body.vey-renewal #view [data-action="expandStorage"] { min-width: 0 !important; width: auto !important; padding: 0 14px !important; font-size: 12px !important; }
}
/* Capacity-Kopf: Knopf nicht abschneiden */
html body.vey-renewal #view .capacity-head .button { width: auto !important; min-width: 0 !important; white-space: nowrap !important; letter-spacing: .04em !important; padding-inline: 34px !important; overflow: visible !important; flex: 0 0 auto; }
html body.vey-renewal #view .capacity-head { gap: 12px; flex-wrap: wrap; }
/* Live-Events: schlankes Banner statt großer Karten */
html body.vey-renewal #view .live-event-banner { display: flex !important; flex-wrap: wrap; gap: 8px !important; padding: 8px 10px !important; margin: 0 0 10px !important; border-radius: 14px !important; align-items: stretch; }
html body.vey-renewal #view .live-event-banner__pulse { align-self: center; font-size: 10px !important; padding: 3px 10px !important; }
html body.vey-renewal #view .live-event-banner .live-event { flex: 1 1 260px; padding: 8px 12px !important; border-radius: 12px !important; }
html body.vey-renewal #view .live-event-banner .live-event > header { display: flex; justify-content: space-between; gap: 8px; margin: 0 !important; }
html body.vey-renewal #view .live-event-banner .live-event > header b { font-size: 13px !important; }
html body.vey-renewal #view .live-event-banner .live-event > p { display: none !important; }
html body.vey-renewal #view .live-event-banner .live-event > div { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
html body.vey-renewal #view .live-event-banner .live-event > div > span { font-size: 10.5px !important; padding: 2px 8px !important; }

/* =====================================================================
   Öffentliche Profilseite kompakt: Held + Slots eng gruppiert, ein Rahmen pro Slot
   ===================================================================== */
@media (min-width: 761px) {
  html body.vey-renewal #view .public-armory-layout { align-items: start !important; }
  html body.vey-renewal #view .veydris-public-armory .public-paperdoll { display: grid !important; grid-template-columns: 128px minmax(0, 460px) 128px !important; justify-content: center !important; align-items: center !important; gap: 14px !important; min-height: 0 !important; padding: 8px 0 !important; }
  html body.vey-renewal #view .veydris-public-armory .public-gear-column { width: 128px !important; min-width: 0 !important; padding: 0 !important; gap: 4px !important; align-self: center; }
  html body.vey-renewal #view .veydris-public-armory .public-profile-hero { min-height: 0 !important; height: min(640px, calc(100dvh - 330px)) !important; }
  /* Slot: kein äußerer Kasten mehr – nur der Item-Rahmen, Name lesbar darüber */
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot,
  html body.vey-renewal #view .veydris-public-armory .public-gear-column.right .public-equipment-slot {
    height: 92px !important; flex: 0 0 92px !important; padding: 0 !important; gap: 3px !important; justify-content: flex-start !important; border: 0 !important; background: none !important; overflow: visible !important;
  }
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot > small { height: 14px !important; font-size: 10.5px !important; line-height: 14px !important; color: var(--vm-text) !important; opacity: .85; }
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot { flex: 0 0 58px !important; width: 58px !important; height: 58px !important; margin: 0 auto !important; }
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot img { width: 46px !important; height: 46px !important; position: static !important; transform: none !important; margin: auto !important; }
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot > span { height: 14px !important; margin-top: 1px; }
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot.is-empty .item-slot { opacity: .6; }

  /* Rechte Spalte: dicht, gleichmäßig, nichts abgeschnitten */
  html body.vey-renewal #view .public-armory-dossier { align-content: start !important; gap: 10px !important; }
  html body.vey-renewal #view .public-armory-dossier > .profile-panel { height: auto !important; min-height: 0 !important; flex: none !important; }
  html body.vey-renewal #view .public-armory-dossier .profile-skill-row { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)) !important; gap: 8px !important; }
  html body.vey-renewal #view .public-armory-dossier .profile-skill { width: auto !important; min-width: 0 !important; height: auto !important; padding: 8px !important; }
  html body.vey-renewal #view .public-armory-dossier .profile-skill :is(small, span, b) { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; line-height: 1.2 !important; font-size: 11px !important; }
  html body.vey-renewal #view .public-armory-dossier .profile-bonds { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; align-items: stretch; }
  html body.vey-renewal #view .public-armory-dossier .profile-bonds > article { min-height: 78px !important; height: auto !important; display: flex !important; align-items: center; gap: 10px; padding: 8px 10px !important; }
  html body.vey-renewal #view .public-armory-dossier .profile-bonds > article span { min-width: 0; white-space: normal !important; }
  html body.vey-renewal #view .public-armory-dossier .prestige-numbers { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 6px !important; }
  html body.vey-renewal #view .public-armory-dossier .prestige-numbers > span { padding: 6px 4px !important; text-align: center; }
  html body.vey-renewal #view .public-armory-dossier .prestige-numbers :is(small, em) { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; font-size: 9px !important; letter-spacing: 0 !important; line-height: 1.15 !important; display: block; }
  html body.vey-renewal #view .public-armory-dossier .raid-prestige { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 6px !important; }
  html body.vey-renewal #view .public-armory-dossier .raid-prestige > span { padding: 6px 8px !important; white-space: normal !important; }

  /* Untere Leiste: gleich große Kacheln, Text bricht um statt abzuschneiden */
  html body.vey-renewal #view .profile-gear-summary { display: grid !important; grid-template-columns: 1.3fr 1.3fr repeat(4, 1fr) 1.4fr !important; gap: 6px !important; }
  html body.vey-renewal #view .profile-gear-summary > span { min-width: 0 !important; padding: 6px 10px !important; display: grid !important; grid-template-columns: 1fr auto; align-items: center; row-gap: 3px; }
  html body.vey-renewal #view .profile-gear-summary > span > small { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; font-size: 9.5px !important; letter-spacing: .03em !important; line-height: 1.15; }
  html body.vey-renewal #view .profile-gear-summary > span > b { font-size: 13px !important; white-space: nowrap; }
  html body.vey-renewal #view .profile-gear-summary > span > i { grid-column: 1 / -1; }

  /* Kopf: Zurück links, Name Mitte, Werte + Bearbeiten rechts */
  html body.vey-renewal #view .public-profile-header { display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto auto !important; align-items: center !important; gap: 14px !important; padding: 10px 16px !important; height: auto !important; }
  html body.vey-renewal #view .public-profile-header .profile-back, html body.vey-renewal #view .public-profile-header .profile-edit { position: static !important; width: auto !important; min-width: 0 !important; height: 40px !important; min-height: 40px !important; padding: 0 22px !important; transform: none !important; white-space: nowrap; }
  html body.vey-renewal #view .public-profile-identity { display: contents !important; }
  html body.vey-renewal #view .public-profile-identity > :is(.eyebrow, h1, p) { grid-column: 2; margin: 0 !important; }
  html body.vey-renewal #view .public-profile-identity > div { grid-column: 3; grid-row: 1 / span 3; display: flex !important; gap: 6px; }
  html body.vey-renewal #view .public-profile-header .profile-edit { grid-column: 4; grid-row: 1 / span 3; }
  html body.vey-renewal #view .public-profile-header .profile-back { grid-column: 1; grid-row: 1 / span 3; }
}
@media (min-width: 1100px) {
  html body.vey-renewal #view .public-armory-layout { grid-template-columns: minmax(0, 780px) minmax(340px, 480px) !important; justify-content: center !important; gap: 14px !important; }
}
@media (min-width: 761px) {
  html body.vey-renewal #view .public-armory-dossier { align-self: start !important; height: auto !important; }
  html body.vey-renewal #view .public-armory-dossier > * { align-self: start !important; }
  html body.vey-renewal #view .public-armory-dossier .prestige-numbers { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  html body.vey-renewal #view .public-armory-dossier .prestige-numbers :is(small, em) { font-size: 9.5px !important; word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; }
  html body.vey-renewal #view .veydris-public-armory .public-paperdoll { grid-template-columns: 128px minmax(0, 1fr) 128px !important; }
}
@media (min-width: 1100px) {
  html body.vey-renewal #view .public-profile.veydris-public-armory { max-width: 1320px !important; margin-inline: auto !important; }
  html body.vey-renewal #view .public-armory-layout { grid-template-columns: minmax(0, 1fr) 380px !important; }
}
@media (min-width: 761px) {
  html body.vey-renewal #view .public-armory-dossier > .profile-panel, html body.vey-renewal #view .public-armory-dossier > details { max-height: none !important; overflow: visible !important; position: relative !important; }
  html body.vey-renewal #view .public-armory-dossier { display: grid !important; grid-auto-rows: max-content !important; }
  html body.vey-renewal #view .profile-gear-summary { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
  html body.vey-renewal #view .profile-gear-summary > span > b { white-space: normal !important; font-size: 12px !important; text-align: right; }
  html body.vey-renewal #view .profile-gear-summary > span { padding: 6px 8px !important; }
}
@media (min-width: 761px) {
  html body.vey-renewal #view .public-armory-dossier > .profile-panel { display: block !important; height: auto !important; contain: none !important; padding: 14px 16px !important; }
  html body.vey-renewal #view .public-armory-dossier > .profile-panel > h3 { margin: 12px 0 8px !important; }
  html body.vey-renewal #view .public-armory-dossier > .profile-panel > .profile-bonds { margin-top: 12px !important; }
  html body.vey-renewal #view .public-armory-dossier > .profile-panel > .prestige-numbers { margin-bottom: 8px; }
}
@media (min-width: 761px) {
  html body.vey-renewal #view .public-armory-dossier > * { margin: 0 !important; transform: none !important; top: auto !important; inset: auto !important; position: static !important; }
  html body.vey-renewal #view .public-armory-dossier { gap: 12px !important; }
  html body.vey-renewal #view .profile-gear-summary > span.mastery-summary { grid-template-columns: 1fr !important; justify-items: start; }
  html body.vey-renewal #view .profile-gear-summary > span.mastery-summary > b { text-align: left !important; white-space: nowrap !important; font-size: 11px !important; }
}
@media (min-width:761px){html body.vey-renewal #view .public-armory-dossier{grid-template-rows:none!important;grid-auto-rows:max-content!important}}
@media (min-width: 761px) and (max-height: 980px) {
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot, html body.vey-renewal #view .veydris-public-armory .public-gear-column.right .public-equipment-slot { height: 82px !important; flex: 0 0 82px !important; }
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot { flex: 0 0 50px !important; width: 50px !important; height: 50px !important; }
  html body.vey-renewal #view .veydris-public-armory .public-equipment-slot .item-slot img { width: 40px !important; height: 40px !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #view .public-profile-header .profile-back, html body.vey-renewal #view .public-profile-header .profile-edit { width: 100% !important; justify-self: stretch !important; white-space: nowrap !important; padding: 0 30px !important; height: 40px !important; min-height: 40px !important; letter-spacing: .06em !important; }
  html body.vey-renewal #view .public-profile-header { padding: 10px !important; }
}
@media (max-width: 760px) {
  html body.vey-renewal #view .public-profile-header { grid-template-columns: minmax(0, 1fr) !important; grid-auto-flow: row !important; }
  html body.vey-renewal #view .public-profile-header > * { grid-column: 1 / -1 !important; grid-row: auto !important; width: 100% !important; max-width: none !important; position: static !important; }
  html body.vey-renewal #view .public-profile-header .profile-back { order: 0; } html body.vey-renewal #view .public-profile-header .public-profile-identity { order: 1; } html body.vey-renewal #view .public-profile-header .profile-edit { order: 2; }
  html body.vey-renewal #view .public-profile-identity { display: block !important; }
  html body.vey-renewal #view .public-profile-identity > div { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; }
}
@media (max-width: 760px) {
  html body.vey-renewal #view .public-profile-header { grid-template-rows: none !important; grid-auto-rows: max-content !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; }
  html body.vey-renewal #view .public-profile-header .profile-back { font-size: 12px !important; color: #f6ecd2 !important; text-indent: 0 !important; line-height: 40px !important; }
  html body.vey-renewal #view .public-profile-header .profile-back * { font-size: 12px !important; }
}

/* Laptop widths: the objective bar shrinks so the whole top bar stays visible. */
@media (min-width: 761px) and (max-width: 1500px) {
  html body.vey-renewal .topbar > .objective-bar { flex: 1 1 auto !important; min-width: 0 !important; width: auto !important; max-width: none !important; }
  html body.vey-renewal .topbar > .objective-bar * { min-width: 0; }
  html body.vey-renewal .topbar > .objective-bar :is(b, strong, span, small) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html body.vey-renewal .topbar > .global-hero { flex: 0 1 300px !important; min-width: 0 !important; }
  html body.vey-renewal .topbar > .resources { flex: 0 1 auto !important; min-width: 0 !important; }
}