/* VEYDRIS · Rahmen v2 (2026-10-19): Seitenleiste + Kopfzeile
   Seitenleiste: 88px Leiste mit klaren Icons + Beschriftung, Untermenü als Flyout beim Drüberfahren.
   Kopfzeile: drei feste Zonen – Held links, Ziel mittig, Status/Währungen/Aktionen rechts.
   Eigene Kaskaden-Ebene, damit die älteren !important-Regeln nicht mehr greifen. */
@layer pv {
  body.vey-renewal {
    --sh-rail: 92px; --sh-gold: #f3d58e; --sh-gold-dim: rgba(232, 196, 128, .5); --sh-line: rgba(232, 196, 128, .14);
    --sh-text: #efe7d6; --sh-muted: #a59c8b; --sh-font: var(--vm-font, Manrope, system-ui, sans-serif); --sh-display: var(--vm-display, Cinzel, Georgia, serif);
  }

  @media (min-width: 761px) {
    /* ================= SEITENLEISTE ================= */
    html body.vey-renewal .app-shell { grid-template-columns: var(--sh-rail) minmax(0, 1fr) !important; }
    html body.vey-renewal .app-shell > aside.sidebar,
    html body.vey-renewal .app-shell > aside.sidebar:hover,
    html body.vey-renewal .app-shell > aside.sidebar:focus-within {
      position: fixed !important; inset: 0 auto 0 0 !important; z-index: 80 !important; width: var(--sh-rail) !important; height: 100dvh !important;
      display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; padding: 12px 0 10px !important; margin: 0 !important;
      overflow: visible !important; border-radius: 0 !important; transform: none !important; transition: none !important;
      background: linear-gradient(180deg, #17151f 0%, #100f16 100%) !important; border: 0 !important; border-right: 1px solid var(--sh-line) !important; backdrop-filter: none !important; clip-path: none !important;
      box-shadow: 8px 0 30px -18px #000 !important;
    }
    html body.vey-renewal .app-shell > aside.sidebar::before, html body.vey-renewal .app-shell > aside.sidebar::after { content: none !important; display: none !important; }

    /* Wappen oben */
    html body.vey-renewal .sidebar .brand { display: grid !important; justify-items: center !important; gap: 0 !important; padding: 0 0 12px !important; margin: 0 12px 8px !important; border-bottom: 1px solid var(--sh-line) !important; background: none !important; }
    html body.vey-renewal .sidebar .brand-mark { display: block !important; width: 38px !important; height: 46px !important; background: none !important; border: 0 !important; box-shadow: none !important; }
    html body.vey-renewal .sidebar .brand-mark img { width: 38px !important; height: 46px !important; object-fit: contain !important; filter: drop-shadow(0 0 10px rgba(243, 213, 142, .35)) !important; }
    html body.vey-renewal .sidebar .brand > span:last-child { display: none !important; }
    /* Profil-Kachel entfällt: der Held steht in der Kopfzeile */
    html body.vey-renewal .sidebar .profile.shell-profile-link { display: none !important; }

    /* Navigation */
    html body.vey-renewal .sidebar #nav { display: flex !important; flex-direction: column !important; gap: 2px !important; padding: 0 !important; margin: 0 !important; overflow: visible !important; flex: 1 1 auto !important; }
    html body.vey-renewal .sidebar #nav .nav-group { position: relative !important; display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; clip-path: none !important; transform: none !important; overflow: visible !important; contain: none !important; box-shadow: none !important; }
    html body.vey-renewal .sidebar #nav .nav-group::after { content: none !important; display: none !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-item {
      position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 5px !important;
      min-height: 76px !important; height: auto !important; padding: 8px 2px !important; margin: 0 6px !important; border-radius: 14px !important; cursor: pointer !important; list-style: none !important;
      background: none !important; border: 0 !important; box-shadow: none !important; grid-template-columns: none !important; overflow: visible !important; transition: background .15s !important;
    }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-item::-webkit-details-marker { display: none !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-item::before {
      content: "" !important; display: block !important; width: 36px !important; height: 36px !important; position: static !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; transform: none !important; opacity: .82 !important;
      background: center / contain no-repeat !important; filter: saturate(.85) !important; transition: transform .18s ease, opacity .18s, filter .18s !important;
    }
    html body.vey-renewal .sidebar #nav .nav-group[data-group="camp"] > .nav-item::before { background-image: url("./assets/ui/nav-v1/citadel.svg") !important; }
    html body.vey-renewal .sidebar #nav .nav-group[data-group="missions"] > .nav-item::before { background-image: url("./assets/ui/nav-v1/adventure.svg") !important; }
    html body.vey-renewal .sidebar #nav .nav-group[data-group="character"] > .nav-item::before { background-image: url("./assets/ui/nav-v1/hero.svg") !important; }
    html body.vey-renewal .sidebar #nav .nav-group[data-group="forge"] > .nav-item::before { background-image: url("./assets/ui/nav-v1/forge.svg") !important; }
    html body.vey-renewal .sidebar #nav .nav-group[data-group="social"] > .nav-item::before { background-image: url("./assets/ui/nav-v1/social.svg") !important; }
    html body.vey-renewal .sidebar #nav .nav-group[data-group="chronicle"] > .nav-item::before { background-image: url("./assets/ui/nav-v1/chronicle.svg") !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-item::after { content: none !important; display: none !important; }
    html body.vey-renewal .sidebar #nav .nav-item > :is(.nav-relic, small, i) { display: none !important; }
    html body.vey-renewal .sidebar #nav .nav-item > b {
      display: block !important; opacity: 1 !important; position: static !important; max-width: 100% !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
      font: 700 10px/1.1 var(--sh-font) !important; letter-spacing: .05em !important; text-transform: uppercase !important; color: var(--sh-muted) !important; text-shadow: none !important; transition: color .15s !important;
    }
    html body.vey-renewal .sidebar #nav .nav-group:hover > .nav-item { background: rgba(255, 255, 255, .04) !important; }
    html body.vey-renewal .sidebar #nav .nav-group:hover > .nav-item::before { opacity: 1 !important; filter: none !important; transform: translateY(-1px) scale(1.06) !important; }
    html body.vey-renewal .sidebar #nav .nav-group:hover > .nav-item > b { color: var(--sh-text) !important; }
    /* aktive Rubrik: Leuchten + Goldkante */
    html body.vey-renewal .sidebar #nav .nav-group.active-group > .nav-item { background: radial-gradient(circle at 50% 36%, rgba(243, 213, 142, .22), transparent 62%) !important; }
    html body.vey-renewal .sidebar #nav .nav-group.active-group > .nav-item::before { opacity: 1 !important; filter: drop-shadow(0 0 10px rgba(243, 213, 142, .55)) !important; }
    html body.vey-renewal .sidebar #nav .nav-group.active-group > .nav-item > b { color: var(--sh-gold) !important; }
    html body.vey-renewal .sidebar #nav .nav-group.active-group::before { content: "" !important; position: absolute !important; left: 0 !important; top: 16px !important; bottom: 16px !important; width: 3px !important; border-radius: 0 3px 3px 0 !important; background: linear-gradient(180deg, #fff0c4, #c99a4a) !important; box-shadow: 0 0 10px rgba(243, 213, 142, .6) !important; }

    /* Untermenü als Flyout rechts neben der Leiste */
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links {
      position: absolute !important; left: calc(100% + 2px) !important; top: 0 !important; z-index: 90 !important; display: grid !important; gap: 2px !important; min-width: 220px !important; margin: 0 !important; padding: 44px 8px 8px !important;
      border-radius: 0 16px 16px 0 !important; background: linear-gradient(180deg, #1c1a25, #121118) !important; border: 1px solid var(--sh-line) !important; border-left: 0 !important;
      box-shadow: 18px 10px 40px -12px rgba(0, 0, 0, .85) !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transform: translateX(-6px) !important; transition: opacity .14s, transform .14s, visibility 0s .14s !important;
    }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links::before {
      content: attr(data-flyout-title) !important; position: absolute !important; left: 16px !important; top: 14px !important; display: block !important; width: auto !important; height: auto !important; bottom: auto !important; right: auto !important; border: 0 !important; background: none !important; box-shadow: none !important; transform: none !important; opacity: 1 !important;
      font: 600 15px/1.2 var(--sh-display) !important; color: var(--sh-gold) !important; letter-spacing: .04em !important;
    }
    html body.vey-renewal .sidebar #nav .nav-group:is(.is-flyout, :focus-within) > .nav-group-links { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; transition: opacity .14s, transform .14s, visibility 0s !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links > button {
      display: flex !important; align-items: center !important; gap: 10px !important; min-height: 36px !important; padding: 6px 12px !important; margin: 0 !important; border-radius: 10px !important; cursor: pointer !important; text-align: left !important; white-space: nowrap !important;
      font: 600 13px/1.2 var(--sh-font) !important; letter-spacing: 0 !important; text-transform: none !important; color: #cfc6b3 !important; background: none !important; border: 0 !important; box-shadow: none !important;
    }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links > button::before { content: "" !important; display: block !important; position: static !important; inset: auto !important; transform: none !important; flex: 0 0 5px !important; width: 5px !important; height: 5px !important; border: 0 !important; border-radius: 50% !important; background: rgba(232, 196, 128, .35) !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links > button::after, html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links::after { content: none !important; display: none !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links > button { border-left: 0 !important; width: auto !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links > button:hover { color: var(--sh-text) !important; background: rgba(232, 196, 128, .08) !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links > button:is(.active, [aria-current="page"]) { color: var(--sh-gold) !important; background: rgba(232, 196, 128, .1) !important; }
    html body.vey-renewal .sidebar #nav .nav-group > .nav-group-links > button:is(.active, [aria-current="page"])::before { background: var(--sh-gold) !important; box-shadow: 0 0 8px var(--sh-gold) !important; }

    /* unten: Spieler online */
    html body.vey-renewal .sidebar-bottom { display: grid !important; justify-items: center !important; gap: 4px !important; margin: 8px 10px 0 !important; padding: 10px 4px 2px !important; border: 0 !important; border-top: 1px solid var(--sh-line) !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; white-space: normal !important; overflow: visible !important; }
    html body.vey-renewal .sidebar-bottom .online-dot { display: block !important; width: 8px !important; height: 8px !important; border-radius: 50% !important; background: #6cf0a9 !important; box-shadow: 0 0 0 3px rgba(108, 240, 169, .15), 0 0 10px #6cf0a9 !important; }
    html body.vey-renewal .sidebar-bottom #onlineCount { display: block !important; opacity: 1 !important; font: 600 10px/1.25 var(--sh-font) !important; letter-spacing: .02em !important; color: var(--sh-muted) !important; text-align: center !important; }

    /* ================= KOPFZEILE ================= */
    html body.vey-renewal .topbar {
      display: flex !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important;
      min-height: 58px !important; height: 58px !important; padding: 0 18px !important; margin: 0 !important; position: sticky !important; top: 0 !important; z-index: 60 !important;
      background: linear-gradient(180deg, rgba(23, 21, 31, .97), rgba(16, 15, 22, .95)) !important; border-bottom: 1px solid var(--sh-line) !important; backdrop-filter: blur(10px) !important;
    }
    html body.vey-renewal .topbar > * { margin: 0 !important; }
    html body.vey-renewal .topbar > .menu-button, html body.vey-renewal .topbar > .crumb, html body.vey-renewal .topbar > .header-mission[hidden] { display: none !important; }
    /* links: Held */
    html body.vey-renewal .topbar > .global-hero { order: 1 !important; flex: 0 0 auto !important; height: 42px !important; min-height: 0 !important; }
    /* Mitte: Ziel – nimmt den freien Platz und steht mittig */
    html body.vey-renewal .topbar > #currentObjective { order: 2 !important; flex: 1 1 auto !important; max-width: 520px !important; margin: 0 auto !important; height: 40px !important; }
    html body.vey-renewal .topbar > #currentObjective:empty { display: block !important; visibility: hidden !important; }
    html body.vey-renewal .topbar > .header-mission:not([hidden]) { order: 3 !important; flex: 0 0 auto !important; }
    /* rechts: Status, Währungen, Aktionen */
    html body.vey-renewal .topbar > .resources { order: 4 !important; flex: 0 0 auto !important; margin-left: auto !important; align-self: center !important; display: flex !important; align-items: center !important; gap: 6px !important; height: 42px !important; min-height: 42px !important; max-height: 42px !important; overflow: visible !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; }
    html body.vey-renewal .topbar > #journeyTravel { order: 6 !important; }
    html body.vey-renewal .topbar > .experience-guide-link { order: 5 !important; }
    html body.vey-renewal .topbar .header-status { display: flex !important; align-items: center !important; gap: 6px !important; padding: 0 10px 0 0 !important; margin: 0 4px 0 0 !important; border: 0 !important; border-right: 1px solid var(--sh-line) !important; background: none !important; }

    /* Reittier/Begleiter: runde Medaillons statt Kästchen */
    html body.vey-renewal .topbar .hs-chip { width: 38px !important; height: 38px !important; border-radius: 50% !important; padding: 0 !important; background: radial-gradient(circle at 50% 60%, rgba(243, 213, 142, .18), rgba(20, 18, 26, .9) 72%) !important; border: 1.5px solid rgba(232, 196, 128, .45) !important; box-shadow: 0 4px 10px -4px #000 !important; overflow: hidden !important; }
    html body.vey-renewal .topbar .hs-chip i { width: 34px !important; height: 34px !important; background-size: 118% !important; background-position: center 40% !important; }
    html body.vey-renewal .topbar .hs-chip:hover { border-color: var(--sh-gold) !important; transform: translateY(-1px) !important; }
    html body.vey-renewal .topbar .hs-chip.is-empty { background: none !important; border: 1.5px dashed rgba(255, 255, 255, .2) !important; box-shadow: none !important; }
    html body.vey-renewal .topbar .hs-chip.is-elixir { border-color: rgba(108, 240, 169, .55) !important; }

    /* Währungen: schlanke Kapseln */
    html body.vey-renewal .topbar .resource { height: 34px !important; padding: 0 12px 0 5px !important; gap: 6px !important; border-radius: 99px !important; background: rgba(255, 255, 255, .035) !important; border: 1px solid rgba(255, 255, 255, .07) !important; }
    html body.vey-renewal .topbar .resource .resource-art { width: 25px !important; height: 25px !important; flex-basis: 25px !important; }

    /* Aktions-Icons: ohne Kästchen, runder Hover */
    html body.vey-renewal .topbar :is(.notification-button, .settings, .experience-guide-link, #journeyTravel) {
      width: 38px !important; height: 38px !important; min-width: 38px !important; border-radius: 50% !important; background: none !important; border: 1px solid transparent !important; box-shadow: none !important;
    }
    html body.vey-renewal .topbar :is(.notification-button, .settings, .experience-guide-link, #journeyTravel):hover { background: rgba(232, 196, 128, .1) !important; border-color: rgba(232, 196, 128, .3) !important; transform: none !important; }
    html body.vey-renewal .topbar :is(.notification-button, .settings, .experience-guide-link, #journeyTravel)::before { width: 23px !important; height: 23px !important; }
    html body.vey-renewal .topbar .notification-button { margin-left: 4px !important; }
    html body.vey-renewal .topbar .notification-button > #notificationBadge { top: 1px !important; right: 1px !important; }
  }

  /* kleine Laptops: Ziel schmaler, Währungs-Abstände enger */
  @media (min-width: 761px) and (max-width: 1280px) {
    html body.vey-renewal .topbar { gap: 8px !important; padding: 0 12px !important; }
    html body.vey-renewal .topbar > #currentObjective { max-width: 360px !important; }
    html body.vey-renewal .topbar .resource { padding-right: 9px !important; }
    html body.vey-renewal .topbar > .global-hero .global-hero__identity em { display: none !important; }
  }
  @media (min-width: 761px) {
    html body.vey-renewal .sidebar #nav .nav-group > .nav-item > b { margin: 0 !important; padding: 0 !important; width: 100% !important; text-align: center !important; grid-column: auto !important; justify-self: center !important; }
  }

  /* ================= HANDY: untere Leiste + Kopfzeile ================= */
  html body.vey-renewal #mobileDock [data-shell-view="camp"] { --dock-relic: url("./assets/ui/nav-v1/citadel.svg") !important; }
  html body.vey-renewal #mobileDock [data-shell-view="missions"] { --dock-relic: url("./assets/ui/nav-v1/adventure.svg") !important; }
  html body.vey-renewal #mobileDock [data-shell-view="character"] { --dock-relic: url("./assets/ui/nav-v1/hero.svg") !important; }
  html body.vey-renewal #mobileDock #mobileMore { --dock-relic: url("./assets/ui/nav-v1/menu.svg") !important; }
  html body.vey-renewal #mobileDock > button > span { width: 28px !important; height: 28px !important; background: var(--dock-relic) center / contain no-repeat !important; opacity: .8 !important; }
  html body.vey-renewal #mobileDock > button.active > span { opacity: 1 !important; }
  @media (max-width: 760px) {
    html body.vey-renewal .topbar .hs-chip { width: 34px !important; height: 34px !important; border-radius: 50% !important; padding: 0 !important; background: radial-gradient(circle at 50% 60%, rgba(243, 213, 142, .18), rgba(20, 18, 26, .9) 72%) !important; border: 1.5px solid rgba(232, 196, 128, .45) !important; overflow: hidden !important; }
    html body.vey-renewal .topbar .hs-chip i { width: 30px !important; height: 30px !important; background-size: 118% !important; }
    html body.vey-renewal .topbar :is(.notification-button, .settings, .experience-guide-link, #journeyTravel) { border-radius: 50% !important; background: none !important; border-color: transparent !important; }
    html body.vey-renewal .topbar .resource { background: rgba(255, 255, 255, .035) !important; border-color: rgba(255, 255, 255, .07) !important; }
  }

  /* ================= Korrekturen 19.10. ================= */
  /* Wappen: nur das Emblem, auch bei Fokus/Hover nie Text oder Kasten */
  html body.vey-renewal .sidebar .brand { outline: none !important; box-shadow: none !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; overflow: hidden !important; height: auto !important; width: auto !important; min-height: 0 !important; background: none !important; }
  html body.vey-renewal .sidebar .brand > :not(.brand-mark), html body.vey-renewal .sidebar .brand :is(b, small) { display: none !important; }
  html body.vey-renewal .sidebar .brand:focus-visible .brand-mark { outline: 2px solid rgba(243, 213, 142, .7) !important; outline-offset: 4px !important; border-radius: 8px !important; }

  /* Held-Chip: Porträt | Name + Klasse | Kampfkraft, EP-Leiste als feine Linie unten */
  @media (min-width: 761px) {
    html body.vey-renewal .topbar > .global-hero { position: relative !important; display: grid !important; grid-template-columns: 34px minmax(0, auto) auto !important; align-items: center !important; column-gap: 10px !important; height: 44px !important; min-height: 0 !important; padding: 0 14px 0 4px !important; overflow: hidden !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 { display: grid !important; grid-template-rows: auto auto !important; gap: 1px !important; align-content: center !important; min-width: 0 !important; position: static !important; }
    html body.vey-renewal .topbar .global-hero__identity > :is(small, .global-hero__xptext) { display: none !important; }
    html body.vey-renewal .topbar .global-hero__identity b { display: block !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; max-width: 160px !important; line-height: 1.2 !important; margin: 0 !important; }
    html body.vey-renewal .topbar .global-hero__identity em { display: block !important; white-space: nowrap !important; line-height: 1.2 !important; margin: 0 !important; }
    html body.vey-renewal .topbar .global-hero__xp { position: absolute !important; left: 46px !important; right: 14px !important; bottom: 5px !important; height: 2px !important; margin: 0 !important; }
    html body.vey-renewal .topbar .global-hero__power { padding-left: 12px !important; height: 26px !important; align-self: center !important; }
  }

  /* Posteingang: Icon in der Kopfzeile */
  html body.vey-renewal .topbar #heroMail { position: relative !important; inset: auto !important; display: grid !important; place-items: center !important; width: 38px !important; height: 38px !important; min-width: 38px !important; padding: 0 !important; margin: 0 !important; border-radius: 50% !important; cursor: pointer !important; background: none !important; border: 1px solid transparent !important; box-shadow: none !important; transform: none !important; }
  html body.vey-renewal .topbar #heroMail[hidden] { display: none !important; }
  html body.vey-renewal .topbar #heroMail:hover { background: rgba(232, 196, 128, .1) !important; border-color: rgba(232, 196, 128, .3) !important; }
  html body.vey-renewal .topbar #heroMail > span { display: block !important; width: 23px !important; height: 23px !important; font-size: 0 !important; color: transparent !important; background: url("./assets/ui/header-v1/mail.svg") center / contain no-repeat !important; }
  html body.vey-renewal .topbar #heroMail > b { position: absolute !important; top: 1px !important; right: 1px !important; display: none !important; place-items: center !important; min-width: 17px !important; height: 17px !important; padding: 0 4px !important; border-radius: 99px !important; font: 800 10px/1 var(--sh-font) !important; color: #1a0d0a !important; background: #ff8a6a !important; border: 2px solid #15131c !important; }
  html body.vey-renewal .topbar #heroMail.has-unread > b { display: grid !important; }
  html body.vey-renewal > #heroMail { display: none !important; }
  @media (max-width: 760px) { html body.vey-renewal .topbar #heroMail { width: 32px !important; height: 32px !important; min-width: 32px !important; } }

  /* Citadel: rechte Spalte schneidet nie ab – das Stadtbild gibt Platz ab */
  @media (min-width: 1025px) and (min-height: 600px) {
    html body.vey-renewal #view .citadel-scene :is(.journey-next, .campaign-brief, .journey-play) { overflow: visible !important; min-height: min-content !important; }
    html body.vey-renewal #view .citadel-scene .journey-loop { display: none !important; }
    html body.vey-renewal #view .citadel-scene .journey-next h2 { display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
    html body.vey-renewal #view .citadel-scene .journey-hero { min-height: 160px !important; }
    html body.vey-renewal #view .citadel-scene .journey-play .button:disabled { display: none !important; }
    html body.vey-renewal #view .citadel-scene .journey-play:has(.button:disabled) .button:not(.primary):not(:disabled) { grid-column: 1 / -1 !important; }
  }

  /* Kopfzeile darf nie überlaufen: Held fix, Ziel schrumpft, Missions-Chip kompakt */
  @media (min-width: 761px) {
    html body.vey-renewal .topbar { overflow: hidden !important; }
    html body.vey-renewal .topbar > .global-hero { flex: 0 1 auto !important; min-width: 210px !important; max-width: 340px !important; }
    html body.vey-renewal .topbar > #currentObjective { flex: 1 1 200px !important; min-width: 160px !important; }
    html body.vey-renewal .topbar > .header-mission:not([hidden]) { flex: 0 1 auto !important; min-width: 0 !important; max-width: 190px !important; height: 40px !important; display: flex !important; align-items: center !important; gap: 8px !important; padding: 0 12px 0 6px !important; border-radius: 12px !important; background: rgba(108, 240, 169, .07) !important; border: 1px solid rgba(108, 240, 169, .3) !important; overflow: hidden !important; }
    html body.vey-renewal .topbar > .header-mission:not([hidden]) > span:last-child { display: grid !important; min-width: 0 !important; }
    html body.vey-renewal .topbar > .header-mission small { font: 700 9px/1.2 var(--sh-font) !important; letter-spacing: .1em !important; color: #6cf0a9 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
    html body.vey-renewal .topbar > .header-mission b { font: 700 11.5px/1.2 var(--sh-font) !important; color: var(--sh-text) !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
    html body.vey-renewal .topbar > .resources { flex: 0 0 auto !important; }
  }
  @media (min-width: 761px) and (max-width: 1500px) {
    html body.vey-renewal .topbar .header-status { display: none !important; }
  }
}