/* Viridian Hollow Tooltip Standard. The values below are the unchanged
   canonical Essence Valley Resin / Amber tooltip visual language. */
.tier-popover{
  position:absolute;
  box-sizing:border-box;
  bottom: calc(100% + 12px);
  left:50%;
  --popover-shift:0px;
  transform: translateX(-50%) translateX(var(--popover-shift)) translateY(4px);
  width:max-content;
  max-width:var(--vh-tooltip-max-width-local, var(--vh-tooltip-max-width, min(320px, calc(100vw - 24px))));
  background: #0e1c14;
  background: rgba(14,28,20,var(--vh-tooltip-background-opacity-local, var(--vh-tooltip-background-opacity)));
  border: 1px solid var(--gold);
  border: 1px solid rgba(217,194,122,var(--vh-tooltip-border-opacity-local, var(--vh-tooltip-border-opacity)));
  border-radius: 8px;
  padding: 8px 12px;
  padding: var(--vh-tooltip-padding-y-local, var(--vh-tooltip-padding-y)) var(--vh-tooltip-padding-x-local, var(--vh-tooltip-padding-x));
  font-family: var(--vh-font-body, 'Trebuchet MS', sans-serif);
  font-size: 0.68rem;
  font-size: var(--vh-tooltip-font-size-local, var(--vh-tooltip-font-size));
  white-space:normal;
  opacity: 0;
  pointer-events:none;
  transition: opacity var(--vh-tooltip-fade), transform var(--vh-tooltip-fade);
  box-shadow: 0 8px 18px rgba(0,0,0,0.5);
  box-shadow: var(--vh-shadow-panel);
  z-index: 1100;
  filter:none;
  overflow-wrap:anywhere;
  word-break:normal;
}
.tier-popover.is-managed-tooltip{
  position:fixed;
  z-index:1200;
  max-width:calc(100vw - 24px);
  white-space:normal;
  background:rgba(14,28,20,.98);
  border:1px solid var(--gold);
  box-shadow:0 8px 18px rgba(0,0,0,.62), 0 0 0 1px rgba(217,194,122,.12);
  pointer-events:none;
  transform:none !important;
}
.tier-popover.vh-tooltip--floating{
  position:fixed;
  inset:auto;
  z-index:1700;
  display:block;
  width:min(270px, calc(100vw - 24px));
  max-width:calc(100vw - 24px);
  max-height:none;
  overflow:visible;
  opacity:var(--vh-tooltip-open-opacity-local, var(--vh-tooltip-open-opacity));
  visibility:visible;
  pointer-events:none !important;
  transform:none !important;
  background:rgba(14,28,20,.985);
  box-shadow:0 12px 30px rgba(0,0,0,.72), 0 0 0 1px rgba(217,194,122,.12);
}
.tier-popover.vh-tooltip--floating::after{
  top:100%;
  bottom:auto;
  left:var(--vh-tooltip-arrow-left, 50%);
  border-top-color:var(--gold);
  border-bottom-color:transparent;
}
.tier-popover.vh-tooltip--floating.vh-tooltip--floating-below::after{
  top:auto;
  bottom:100%;
  border-top-color:transparent;
  border-bottom-color:var(--gold);
}
.tier-popover.vh-tooltip--pinned{
  position:fixed;
  inset:auto;
  z-index:1800;
  display:block;
  width:min(300px, calc(100vw - 24px));
  max-width:calc(100vw - 24px);
  max-height:calc(100dvh - 24px);
  overflow:auto;
  opacity:1;
  visibility:visible;
  pointer-events:auto !important;
  transform:none !important;
  background:rgba(14,28,20,.985);
  box-shadow:0 12px 30px rgba(0,0,0,.72), 0 0 0 1px rgba(217,194,122,.12);
}
.tier-popover.vh-tooltip--pinned::after{ display:none; }
#mobile-tooltip-overlay{
  position:fixed;
  inset:0;
  z-index:1200;
  pointer-events:none;
}
#mobile-tooltip-overlay .tier-popover.is-mobile-overlay-tooltip{
  position:fixed;
  display:block;
  width:max-content;
  max-width:min(320px, calc(100vw - 24px));
  margin:0;
  opacity:1;
  transform:none !important;
  background:rgba(14,28,20,.98);
  border:1px solid var(--gold);
  box-shadow:0 10px 26px rgba(0,0,0,.7), 0 0 0 1px rgba(217,194,122,.14);
  pointer-events:auto;
}
#mobile-tooltip-overlay .tier-popover.is-mobile-overlay-tooltip::after{ display:none; }
#mobile-tooltip-overlay .tier-popover.is-mobile-bottom-sheet{
  width:auto;
  max-width:none;
  max-height:calc(100dvh - 24px);
  overflow:auto;
}
.is-touch-tooltip-open .tier-popover{ opacity:1; transform:none; }
.is-long-pressing{ box-shadow:0 0 12px rgba(217,194,122,.34); }
@media (prefers-reduced-motion: reduce){ .is-long-pressing{ box-shadow:none; } }

.tier-popover::after{
  content:'';
  position:absolute;
  top:100%;
  left:calc(50% - var(--popover-shift));
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: var(--gold);
}
.vh-tooltip-host{ position:relative; }
@media (hover:hover) and (pointer:fine){
  .tier-tile-wrap:hover,
  .tier-tile-wrap:focus-within,
  .craft-icon-frame-wrap:hover,
  .craft-icon-frame-wrap:focus-within,
  .brewing-upgrade-wrap:hover,
  .brewing-upgrade-wrap:focus-within,
  .module-equip-slot-wrap:hover,
  .module-equip-slot-wrap:focus-within,
  .workshop-requirement:hover,
  .workshop-requirement:focus-within,
  .vh-tooltip-host:hover,
  .vh-tooltip-host:focus-within{ z-index:100; }
  .tier-popover{ pointer-events:none !important; }
  .tier-tile-wrap:hover .tier-popover,
  .tier-tile-wrap:focus-within .tier-popover,
  .craft-icon-frame-wrap:hover > .tier-popover,
  .craft-icon-frame-wrap:focus-within > .tier-popover,
  .brewing-upgrade-wrap:hover .tier-popover,
  .brewing-upgrade-wrap:focus-within .tier-popover,
  .module-equip-slot-wrap:hover .tier-popover,
  .module-equip-slot-wrap:focus-within .tier-popover,
  .vault-item--info:hover .tier-popover,
  .vault-item--info:focus .tier-popover,
  .vault-item--info:focus-within .tier-popover,
  .tool-shop-item-info:hover .tier-popover,
  .tool-shop-item-info:focus-visible .tier-popover,
  .vh-tooltip-host:hover > .tier-popover,
  .vh-tooltip-host:focus-within > .tier-popover{
    opacity: var(--vh-tooltip-open-opacity-local, var(--vh-tooltip-open-opacity));
    transform: translateX(-50%) translateX(var(--popover-shift)) translateY(0);
  }
}
html.vh-touch-input .tier-tile-wrap:hover .tier-popover,
html.vh-touch-input .craft-icon-frame-wrap:hover .tier-popover,
html.vh-touch-input .brewing-upgrade-wrap:hover .tier-popover,
html.vh-touch-input .module-equip-slot-wrap:hover .tier-popover,
html.vh-touch-input .tool-shop-item-info:hover .tier-popover,
html.vh-touch-input .container-slot:hover .tier-popover,
html.vh-touch-input .station-recipe-selector:hover .tier-popover,
html.vh-touch-input .station-recipe-selector:focus-visible .tier-popover,
html.vh-touch-input .vh-tooltip-host:hover > .tier-popover{
  opacity:0;
  transform:translateX(-50%) translateX(var(--popover-shift)) translateY(4px);
}
html.vh-touch-input .is-touch-tooltip-open .tier-popover{ opacity:var(--vh-tooltip-open-opacity-local, var(--vh-tooltip-open-opacity)) !important; transform:none !important; }
@media (hover:hover) and (pointer:fine){
  .craft-icon-frame-wrap:has(.brewing-upgrade-wrap:hover) > .tier-popover,
  .craft-icon-frame-wrap:has(.brewing-upgrade-wrap:focus-within) > .tier-popover{
    opacity:0;
    transform:translateX(-50%) translateX(var(--popover-shift)) translateY(4px);
  }
}
.tier-popover--below{ top: calc(100% + 12px); bottom:auto; }
.tier-popover--below::after{ top:auto; bottom:100%; border-top-color:transparent; border-bottom-color:var(--gold); }
.tier-popover--viewport-below{ top:calc(100% + 12px); bottom:auto; }
.tier-popover--viewport-below::after{ top:auto; bottom:100%; border-top-color:transparent; border-bottom-color:var(--gold); }
.tier-popover-name{ min-width:0; color:var(--ink); font-size:.78rem; font-weight:800; letter-spacing:.075em; line-height:1.15; overflow-wrap:anywhere; text-transform:uppercase; }
.tier-popover-divider{ height:1px; margin:7px 0; background:linear-gradient(90deg, transparent, rgba(217,194,122,.72) 16%, rgba(217,194,122,.72) 84%, transparent); }
.tier-popover-mult{ min-width:0; color:var(--popover-accent, var(--main, var(--ink))); line-height:1.35; overflow-wrap:anywhere; }
.tier-popover-name + .tier-popover-mult::before{ content:''; display:block; height:1px; margin:7px 0; background:linear-gradient(90deg, transparent, rgba(217,194,122,.72) 16%, rgba(217,194,122,.72) 84%, transparent); }
.tier-popover-note{ color:var(--gold); }
.tier-popover-section-label{ margin:7px 0 4px; color:rgba(233,242,234,.62); font-size:.57rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.tier-popover-cost{ display:flex; min-width:0; flex-wrap:wrap; align-items:center; gap:5px; color:var(--gold); line-height:1.3; overflow-wrap:anywhere; }
.tier-popover-cost img{ width: 13px; height: 13px; object-fit: contain; }
.tier-popover-requirements{ display:flex; flex-direction:column; gap:4px; color:var(--gold); }
.tier-popover-requirement{ display:flex; align-items:center; gap:5px; line-height:1.25; }
.tier-popover-requirement img{ width:13px; height:13px; object-fit:contain; }
.tier-popover-meta{ min-width:0; color:rgba(233,242,234,.72); font-size:.62rem; line-height:1.45; overflow-wrap:anywhere; }
.vault-resource-exact{ color:var(--ink); font-size:.72rem; font-variant-numeric:tabular-nums; font-weight:800; letter-spacing:.035em; }
.vault-resource-rate{ color:var(--gold); font-size:.72rem; font-variant-numeric:tabular-nums; font-weight:800; letter-spacing:.035em; }

/* Canonical Essence Valley Resin / Amber production content shell. */
.production-tooltip { width: min(270px, calc(100vw - 28px)); white-space: normal; text-align: left; }
.production-tooltip-heading, .vh-tooltip__heading { display: grid; grid-template-columns: 52px minmax(0, 1fr); align-items: center; gap: 10px; }
.production-tooltip-heading > div, .vh-tooltip__heading > div { min-width:0; }
.production-tooltip-heading > img, .vh-tooltip__heading > img { width: 50px !important; height: 50px !important; object-fit: contain; margin: 0 !important; filter: drop-shadow(0 4px 6px rgba(0,0,0,.6)); }
.production-tooltip-kind, .vh-tooltip__subtitle { margin-top: 3px; color: rgba(211, 224, 207, .48); font-size: .49rem; font-weight: 800; letter-spacing: .12em; }
.production-tooltip-description, .vh-tooltip__description { color: rgba(226, 234, 222, .76); line-height: 1.45; }
.production-tooltip-facts { display: grid; gap: 5px; margin-top: 8px; }
.production-tooltip-facts span { display: grid; min-width:0; grid-template-columns: 82px minmax(0, 1fr); gap: 7px; color: #dbe6d7; font-size: .59rem; line-height: 1.3; overflow-wrap:anywhere; }
.production-tooltip-facts b { color: rgba(217, 194, 122, .62); font-size: .48rem; letter-spacing: .07em; }
.production-tooltip-value { margin-top: 0; }
.production-tooltip-value img { width: 15px !important; height: 15px !important; object-fit: contain; }
.production-tooltip-value-reward { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.vh-tooltip { width: min(270px, calc(100vw - 28px)); white-space: normal; text-align: left; }
.vh-tooltip__footer { margin-top: 8px; }
.ingredient-accent-vitality .tier-popover-name, .vh-tooltip--verdant .tier-popover-name { color:var(--c-green); }
.ingredient-accent-health .tier-popover-name, .vh-tooltip--crimson .tier-popover-name { color:var(--c-red); }
.ingredient-accent-mana .tier-popover-name, .vh-tooltip--azure .tier-popover-name { color:var(--c-blue); }
.ingredient-accent-magic .tier-popover-name, .vh-tooltip--violet .tier-popover-name { color:#d99aff; }
.vh-tooltip--gold .tier-popover-name, .vh-tooltip--special .tier-popover-name { color:var(--gold); }