.rooted-discovery-layer {
  --rooted-discovery-cream: #fff8e9;
  --rooted-discovery-green: #0b4b3b;
  --rooted-discovery-deep: #062f28;
  --rooted-discovery-gold: #e6bc4b;
  position: absolute;
  z-index: 95;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.rooted-discovery-reveal > [hidden] {
  display: none !important;
}

.rooted-discovery-layer[hidden],
.rooted-discovery-reveal[hidden] {
  display: none !important;
}

.rooted-discovery-live-status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.rooted-discovery-reaction {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: none;
}

.rooted-discovery-layer[data-phase="excited"] .rooted-discovery-reaction,
.rooted-discovery-layer[data-phase="pickup"] .rooted-discovery-reaction,
.rooted-discovery-layer[data-phase="charge-1"] .rooted-discovery-reaction,
.rooted-discovery-layer[data-phase="charge-2"] .rooted-discovery-reaction,
.rooted-discovery-layer[data-phase="charge-3"] .rooted-discovery-reaction {
  opacity: 1;
}

.rooted-discovery-charge-character {
  position: absolute;
  z-index: 1;
  left: var(--rooted-discovery-anchor-x);
  top: var(--rooted-discovery-anchor-y);
  width: auto;
  height: var(--rooted-discovery-avatar-height, 132px);
  max-height: none;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 6px 8px rgb(3 40 31 / 30%));
  opacity: 0;
  transform: translate(-50%, var(--rooted-discovery-charge-foot-y, -100%));
  transform-origin: center bottom;
}

.rooted-discovery-layer[data-phase="charge-1"] .rooted-discovery-charge-character,
.rooted-discovery-layer[data-phase="charge-2"] .rooted-discovery-charge-character,
.rooted-discovery-layer[data-phase="charge-3"] .rooted-discovery-charge-character {
  opacity: 1;
  transform: translate(-50%, var(--rooted-discovery-charge-foot-y, -100%));
  transition: none;
}

.rooted-discovery-layer[data-phase="charge-1"] .rooted-discovery-charge-character {
  filter:
    drop-shadow(0 6px 8px rgb(3 40 31 / 30%))
    drop-shadow(0 0 4px rgb(255 224 108 / 32%));
}

.rooted-discovery-layer[data-phase="charge-2"] .rooted-discovery-charge-character {
  filter:
    drop-shadow(0 6px 8px rgb(3 40 31 / 30%))
    drop-shadow(0 0 8px rgb(255 219 83 / 55%));
}

.rooted-discovery-layer[data-phase="charge-3"] .rooted-discovery-charge-character {
  filter:
    drop-shadow(0 6px 8px rgb(3 40 31 / 30%))
    drop-shadow(0 0 13px rgb(255 224 91 / 82%));
}

.rooted-discovery-pod-magic {
  position: absolute;
  left: var(--rooted-discovery-anchor-x);
  top: calc(var(--rooted-discovery-anchor-y) - var(--rooted-discovery-hand-offset, 90px));
  pointer-events: none;
}

.rooted-discovery-pod-magic {
  z-index: 0;
  width: var(--rooted-discovery-pod-bloom-size, 112px);
  height: var(--rooted-discovery-pod-bloom-size, 112px);
  border-radius: 50%;
  background: radial-gradient(circle, rgb(255 255 216 / 98%) 0 5%, rgb(255 221 96 / 76%) 18%, rgb(255 190 45 / 26%) 43%, transparent 70%);
  box-shadow: 0 0 30px rgb(255 215 79 / 38%);
  opacity: 0;
  transform: translate(-50%, -50%) scale(.18);
}

.rooted-discovery-pod-magic::before,
.rooted-discovery-pod-magic::after {
  position: absolute;
  content: "";
  inset: 18%;
  border: 2px solid rgb(255 236 145 / 88%);
  border-radius: 50%;
}

.rooted-discovery-pod-magic::after {
  inset: 4%;
  border-color: rgb(255 207 64 / 56%);
}

.rooted-discovery-layer[data-phase="charge-1"] .rooted-discovery-pod-magic {
  opacity: .38;
  transform: translate(-50%, -50%) scale(.36);
}

.rooted-discovery-layer[data-phase="charge-2"] .rooted-discovery-pod-magic {
  opacity: .72;
  transform: translate(-50%, -50%) scale(.7);
}

.rooted-discovery-layer[data-phase="charge-3"] .rooted-discovery-pod-magic {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
  animation: rooted-discovery-pod-bloom 1.05s ease-out forwards;
}

.rooted-discovery-surprise {
  position: absolute;
  left: var(--rooted-discovery-anchor-x);
  top: calc(
    var(--rooted-discovery-anchor-y)
    - var(--rooted-discovery-live-avatar-height, 112px)
    - var(--rooted-discovery-alert-size, 38px)
    - 20px
  );
  display: grid;
  width: var(--rooted-discovery-alert-size, 38px);
  height: var(--rooted-discovery-alert-size, 38px);
  place-items: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: var(--rooted-discovery-alert-icon-size, 20px);
  font-weight: 900;
  line-height: 1;
  color: #694200;
  background: #f5cd54;
  border: 2px solid #fff4c4;
  border-radius: 50%;
  box-shadow: 0 0 0 9px rgb(245 205 84 / 20%), 0 12px 28px rgb(72 43 2 / 25%);
  opacity: 0;
  transform: translate(-50%, 12px) scale(.35) rotate(-10deg);
}

.rooted-discovery-layer[data-phase="excited"] .rooted-discovery-surprise {
  opacity: 1;
  transform: translate(-50%, 0) scale(1) rotate(0);
  transition: opacity 150ms ease, transform 420ms cubic-bezier(.2, .9, .25, 1.35);
}

.rooted-discovery-reaction-glow {
  position: absolute;
  z-index: 0;
  left: var(--rooted-discovery-anchor-x);
  top: calc(var(--rooted-discovery-anchor-y) - 5px);
  width: var(--rooted-discovery-glow-size, 112px);
  height: var(--rooted-discovery-glow-height, 38px);
  background:
    radial-gradient(ellipse at center, rgb(255 249 191 / 96%) 0 8%, rgb(255 216 73 / 78%) 21%, rgb(241 166 30 / 34%) 48%, transparent 74%),
    radial-gradient(ellipse at center, rgb(255 208 75 / 62%), transparent 68%);
  border-radius: 50%;
  box-shadow: 0 0 18px 5px rgb(255 205 61 / 28%);
  filter: drop-shadow(0 0 13px rgb(255 219 91 / 90%));
  opacity: 0;
  transform: translate(-50%, -50%) scale(.35);
  transform-origin: center;
}

.rooted-discovery-reaction-glow::before,
.rooted-discovery-reaction-glow::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

.rooted-discovery-reaction-glow::before {
  inset: -25% -10%;
  border: 2px solid rgb(255 225 110 / 74%);
  border-radius: 50%;
  opacity: 0;
  transform: scale(.45);
}

.rooted-discovery-reaction-glow::after {
  left: 50%;
  bottom: 42%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fff6ad;
  box-shadow:
    -31px 4px 0 -1px #ffd75b,
    27px 8px 0 -1px #ffe88f,
    -17px -5px 0 -2px #fff8bd,
    16px -2px 0 -2px #ffc83d,
    39px 1px 0 -2px #fff2a2;
  filter: drop-shadow(0 0 5px #ffd759);
  opacity: 0;
  transform: translate(-50%, 6px) scale(.65);
}

.rooted-discovery-layer[data-phase="excited"] .rooted-discovery-reaction-glow {
  opacity: .58;
  transform: translate(-50%, -50%) scale(.7);
  transition: opacity 180ms ease, transform 360ms ease-out;
  animation: rooted-discovery-ground-glimmer .7s ease-in-out infinite alternate;
}

.rooted-discovery-layer[data-phase="pickup"] .rooted-discovery-reaction-glow {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
  transition: opacity 160ms ease, transform 320ms ease-out;
  animation: rooted-discovery-ground-glimmer .55s ease-in-out infinite alternate;
}

.rooted-discovery-layer[data-phase="pickup"] .rooted-discovery-reaction-glow::before {
  animation: rooted-discovery-ground-ring 1.05s ease-out infinite;
}

.rooted-discovery-layer[data-phase="pickup"] .rooted-discovery-reaction-glow::after {
  animation: rooted-discovery-ground-sparks .82s ease-out infinite;
}

.rooted-discovery-layer[data-phase="charge-1"] .rooted-discovery-reaction-glow {
  opacity: .62;
  transform: translate(-50%, -50%) scale(.76);
  transition: opacity 220ms ease, transform 360ms ease;
  animation: rooted-discovery-ground-glimmer .78s ease-in-out infinite alternate;
}

.rooted-discovery-layer[data-phase="charge-2"] .rooted-discovery-reaction-glow {
  opacity: .84;
  transform: translate(-50%, -50%) scale(.96);
  transition: opacity 220ms ease, transform 360ms ease;
  animation: rooted-discovery-ground-glimmer .66s ease-in-out infinite alternate;
}

.rooted-discovery-layer[data-phase="charge-3"] .rooted-discovery-reaction-glow {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.16);
  transition: opacity 220ms ease, transform 360ms ease;
  animation: rooted-discovery-ground-glimmer .52s ease-in-out infinite alternate;
}

.rooted-discovery-layer[data-phase="charge-1"] .rooted-discovery-reaction-glow::before {
  opacity: .38;
  animation: rooted-discovery-ground-ring 1.2s ease-out infinite;
}

.rooted-discovery-layer[data-phase="charge-2"] .rooted-discovery-reaction-glow::before {
  opacity: .68;
  animation: rooted-discovery-ground-ring .95s ease-out infinite;
}

.rooted-discovery-layer[data-phase="charge-3"] .rooted-discovery-reaction-glow::before {
  opacity: 1;
  animation: rooted-discovery-ground-ring .72s ease-out infinite;
}

.rooted-discovery-layer[data-phase="charge-1"] .rooted-discovery-reaction-glow::after {
  opacity: .32;
  animation: rooted-discovery-ground-sparks 1.05s ease-out infinite;
}

.rooted-discovery-layer[data-phase="charge-2"] .rooted-discovery-reaction-glow::after {
  opacity: .66;
  animation: rooted-discovery-ground-sparks .82s ease-out infinite;
}

.rooted-discovery-layer[data-phase="charge-3"] .rooted-discovery-reaction-glow::after {
  opacity: 1;
  animation: rooted-discovery-ground-sparks .62s ease-out infinite;
}

.rooted-discovery-reveal {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: flex;
  align-items: center;
  flex-direction: column;
  overflow-y: auto;
  padding: clamp(24px, 5vh, 58px) 22px max(22px, env(safe-area-inset-bottom));
  color: var(--rooted-discovery-cream);
  background: linear-gradient(rgb(2 35 28 / 82%), rgb(2 35 28 / 91%));
  backdrop-filter: blur(3px) saturate(.88);
  -webkit-backdrop-filter: blur(3px) saturate(.88);
  text-align: center;
  pointer-events: auto;
  opacity: 0;
  transform: translateY(16px);
}

.rooted-discovery-layer[data-phase="reveal"] .rooted-discovery-reveal {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 240ms ease, transform 360ms cubic-bezier(.2, .8, .2, 1);
}

.rooted-discovery-crest {
  width: 50px;
  height: 50px;
  padding: 8px;
  object-fit: contain;
  border: 1px solid rgb(240 201 89 / 80%);
  border-radius: 50%;
  box-shadow: 0 0 0 8px rgb(240 201 89 / 9%);
}

.rooted-discovery-eyebrow {
  margin: 13px 0 0;
  color: #f2cc67;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.rooted-discovery-reveal h2 {
  max-width: 420px;
  margin: 5px 0 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(30px, 4.2vw, 46px);
  line-height: .96;
}

.rooted-discovery-item-image {
  width: min(300px, 64vw);
  height: min(30vh, 280px);
  margin: 4px 0 0;
  object-fit: contain;
  filter: drop-shadow(0 0 22px rgb(242 192 65 / 68%));
  animation: rooted-discovery-item-float 3.2s ease-in-out infinite;
}

.rooted-discovery-rarity {
  padding: 5px 12px;
  color: #f2cf74;
  border: 1px solid rgb(242 207 116 / 75%);
  border-radius: 18px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.rooted-discovery-reveal h3 {
  margin: 7px 0 6px;
  color: #f4d06e;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1;
}

.rooted-discovery-benefit,
.rooted-discovery-journal-confirmation,
.rooted-discovery-primary,
.rooted-discovery-secondary,
.rooted-discovery-link {
  width: min(100%, 340px);
}

.rooted-discovery-benefit {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin: 0 0 8px;
  background: rgb(255 250 233 / 8%);
  border: 1px solid rgb(255 250 233 / 18%);
  border-radius: 15px;
}

.rooted-discovery-benefit strong {
  color: #b4dc80;
}

.rooted-discovery-journal-confirmation {
  display: grid;
  grid-template-columns: 30px 1fr;
  align-items: center;
  gap: 9px;
  padding: 9px 12px;
  color: #eff8dd;
  background: rgb(164 211 119 / 10%);
  border: 1px solid rgb(180 220 128 / 36%);
  border-radius: 14px;
  text-align: left;
}

.rooted-discovery-journal-confirmation > i {
  color: #c5e296;
  font-size: 27px;
}

.rooted-discovery-journal-confirmation span {
  display: flex;
  flex-direction: column;
}

.rooted-discovery-journal-confirmation strong {
  font-size: 11px;
}

.rooted-discovery-journal-confirmation small {
  color: rgb(239 248 221 / 68%);
  font-size: 9px;
}

.rooted-discovery-primary,
.rooted-discovery-secondary,
.rooted-discovery-link {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 7px;
  border-radius: 14px;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.rooted-discovery-primary {
  color: #fff8e9;
  background: #0e5a46;
  border: 1px solid #e2b941;
}

.rooted-discovery-secondary {
  color: #0b4b3b;
  background: #fffaf0;
  border: 1px solid #e7d5a6;
}

.rooted-discovery-link {
  min-height: 34px;
  color: #f5deb0;
  background: transparent;
  border: 0;
  text-decoration: underline;
  text-underline-offset: 4px;
}

@keyframes rooted-discovery-ground-glimmer {
  from { filter: drop-shadow(0 0 9px rgb(255 209 84 / 72%)); }
  to { filter: drop-shadow(0 0 23px rgb(255 232 124 / 100%)); }
}

@keyframes rooted-discovery-ground-ring {
  0% { opacity: .78; transform: scale(.42); }
  78%, 100% { opacity: 0; transform: scale(1.12); }
}

@keyframes rooted-discovery-ground-sparks {
  0% { opacity: 0; transform: translate(-50%, 8px) scale(.55); }
  18% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -34px) scale(1.08); }
}

@keyframes rooted-discovery-pod-bloom {
  0% { opacity: .72; transform: translate(-50%, -50%) scale(.72); }
  52% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.42); }
}

@keyframes rooted-discovery-item-float {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-8px) rotate(1deg); }
}

@media (max-width: 700px) {
  .rooted-discovery-reveal {
    padding-top: max(20px, env(safe-area-inset-top));
  }

  .rooted-discovery-item-image {
    height: min(28vh, 248px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rooted-discovery-layer *,
  .rooted-discovery-layer *::before,
  .rooted-discovery-layer *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

.root-game-stage:has(.root-game-window:not([hidden])) .rooted-discovery-layer {
  display: none !important;
}

.rooted-discovery-active-boost,
.root-game-progress-copy .rooted-discovery-active-boost {
  position: absolute;
  z-index: 120;
  top: 94px;
  right: 18px;
  display: grid;
  min-width: 254px;
  max-width: min(340px, calc(100% - 32px));
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  color: #fff9df;
  background: linear-gradient(135deg, rgb(7 62 48 / 96%), rgb(18 87 60 / 96%));
  border: 1px solid #e5bd4d;
  border-radius: 18px;
  box-shadow: 0 12px 28px rgb(1 32 25 / 25%), 0 0 22px rgb(242 192 61 / 16%);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.rooted-discovery-active-boost[hidden] {
  display: none !important;
}

.root-game-stage:has(.root-game-window:not([hidden])) .rooted-discovery-active-boost {
  display: none !important;
}

.rooted-discovery-active-boost:hover,
.rooted-discovery-active-boost:focus-visible {
  background: linear-gradient(135deg, #073e30, #176d4c);
  outline: 3px solid rgb(238 198 76 / 36%);
  outline-offset: 2px;
}

.rooted-discovery-active-boost img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  filter: drop-shadow(0 0 12px rgb(255 213 87 / 66%));
}

.rooted-discovery-active-boost span {
  display: grid;
  min-width: 0;
}

.rooted-discovery-active-boost small {
  color: #f3cf6a;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.rooted-discovery-active-boost strong {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 18px;
  line-height: 1;
}

.rooted-discovery-active-boost em {
  margin-top: 3px;
  color: #cde6d6;
  font-size: 10px;
  font-style: normal;
}

.rooted-discovery-active-boost time {
  min-width: 54px;
  padding: 8px 7px;
  color: #173c31;
  background: #f5d877;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}

@media (min-width: 761px) {
  [data-root-garden-v2][data-rooted-discovery-active-boost] .root-garden-rig-qa-trigger {
    top: max(172px, calc(156px + env(safe-area-inset-top)));
  }

  [data-root-garden-v2][data-rooted-discovery-active-boost] .root-garden-rig-qa-lab {
    top: max(218px, calc(202px + env(safe-area-inset-top)));
    max-height: calc(100% - 236px - env(safe-area-inset-bottom));
  }
}

.rooted-discovery-journal {
  display: grid;
  gap: 12px;
  color: #123e33;
}

.root-game-progress-tabs {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

[data-root-garden-v2][data-game-window-open="progress"] .root-game-tool-dock {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.root-game-root-stats {
  display: grid;
  gap: 16px;
  padding: 4px 2px 12px;
  color: #173f32;
}

.root-game-root-stats > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.9fr);
  align-items: stretch;
  gap: 16px;
}

.root-game-root-stats > header > div:first-child {
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 8px 4px;
}

.root-game-root-stats > header > div:first-child > span {
  color: #9a6422;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.root-game-root-stats h3 {
  margin: 0;
  color: #123f32;
  font: 700 clamp(28px, 3vw, 38px)/1 Georgia, "Times New Roman", serif;
}

.root-game-root-stats > header p,
.root-game-root-stats-grid article > p,
.root-game-root-stats-note {
  margin: 0;
  color: #5d7064;
  font-size: 11px;
  line-height: 1.45;
}

.root-game-root-stats-equipped {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(38, 86, 61, 0.2);
  border-radius: 16px;
  padding: 12px;
  background: linear-gradient(145deg, rgba(238, 244, 226, 0.94), rgba(255, 248, 226, 0.96));
}

.root-game-root-stats-equipped-art {
  display: grid;
  width: 66px;
  height: 66px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(184, 137, 45, 0.28);
  border-radius: 50%;
  background: radial-gradient(circle, #fff8d8, #e6edd8);
  color: #9f731f;
  font-size: 28px;
}

.root-game-root-stats-equipped-art img {
  width: 78px;
  height: 78px;
  object-fit: contain;
}

.root-game-root-stats-equipped.is-equipped .root-game-root-stats-equipped-art > i {
  display: none;
}

.root-game-root-stats-equipped > span:last-child {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.root-game-root-stats-equipped small,
.root-game-root-stats-equipped em {
  color: #627267;
  font-size: 9px;
  font-style: normal;
}

.root-game-root-stats-equipped small {
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.root-game-root-stats-equipped strong {
  color: #153f32;
  font: 700 18px/1.05 Georgia, "Times New Roman", serif;
}

.root-game-root-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.root-game-root-stats-grid article {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(36, 84, 60, 0.18);
  border-radius: 14px;
  padding: 14px;
  background: rgba(255, 253, 246, 0.88);
  box-shadow: 0 8px 20px rgba(24, 63, 45, 0.05);
}

.root-game-root-stats-grid article.is-active {
  border-color: rgba(192, 143, 42, 0.5);
  background: linear-gradient(145deg, #fff8dc, #edf4df);
  box-shadow: 0 10px 24px rgba(149, 105, 24, 0.12);
}

.root-game-root-stats-grid article > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.root-game-root-stats-grid article > header span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #1a4a3a;
  font-size: 13px;
  font-weight: 900;
}

.root-game-root-stats-grid article > header span i {
  color: #9d7428;
  font-size: 20px;
}

.root-game-root-stats-grid article > header strong {
  color: #1d5d43;
  font: 700 22px/1 Georgia, "Times New Roman", serif;
}

.root-game-root-stat-meter {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(23, 63, 50, 0.12);
}

.root-game-root-stat-meter > i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #4f8d58, #e3b845);
  box-shadow: 0 0 10px rgba(218, 172, 55, 0.38);
  transition: width 420ms ease;
}

.root-game-root-stats-grid article > small {
  color: #738076;
  font-size: 9px;
  font-weight: 800;
}

.root-game-root-stats-grid article.is-active > small {
  color: #8d6721;
}

.root-game-root-stats-note {
  display: flex;
  align-items: center;
  gap: 7px;
  border-radius: 10px;
  padding: 10px 12px;
  background: rgba(229, 237, 218, 0.72);
}

.root-game-root-stats-note i {
  flex: 0 0 auto;
  color: #447353;
  font-size: 17px;
}

.rooted-discovery-journal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: clamp(15px, 2vw, 20px);
  background: linear-gradient(135deg, #fffaf0, #f7eed7);
  border: 1px solid rgb(183 147 58 / 34%);
  border-radius: 18px;
}

.rooted-discovery-journal-header span,
.rooted-discovery-journal-card-top span {
  color: #8c6512;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.rooted-discovery-journal-header h3 {
  margin: 4px 0;
  color: #073c31;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1;
}

.rooted-discovery-journal-header p {
  max-width: 620px;
  margin: 0;
}

.rooted-discovery-journal-header > strong {
  flex: 0 0 auto;
  padding: 8px 12px;
  color: #fff9e9;
  background: #0d5946;
  border-radius: 999px;
  font-size: 12px;
}

.rooted-discovery-journal-odds {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  color: #315548;
  background: rgb(246 235 202 / 48%);
  border: 1px solid rgb(183 147 58 / 24%);
  border-radius: 14px;
  font-size: 11px;
}

.rooted-discovery-journal-odds > span:first-child,
.rooted-discovery-journal-rarity-key {
  display: flex;
  align-items: center;
  gap: 7px;
}

.rooted-discovery-journal-odds i {
  color: #9c7015;
  font-size: 17px;
}

.rooted-discovery-journal-odds b {
  color: #0d5946;
}

.rooted-discovery-journal-rarity-key {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.rooted-discovery-journal-rarity-key small {
  padding: 4px 7px;
  background: #fffaf0;
  border: 1px solid rgb(18 75 60 / 12%);
  border-radius: 999px;
  font-size: 9px;
  font-weight: 800;
}

.rooted-discovery-journal-rarity-key small[data-rarity="rare"],
.rooted-discovery-journal-rarity-key small[data-rarity="legendary"] {
  color: #8c6512;
  border-color: rgb(209 138 18 / 38%);
}

.rooted-discovery-journal-rarity-key small[data-rarity="epic"] {
  color: #69428b;
  border-color: rgb(120 80 154 / 32%);
}

.rooted-discovery-journal-filters {
  display: flex;
  overflow-x: auto;
  gap: 7px;
  padding: 7px;
  background: rgb(255 250 240 / 72%);
  border: 1px solid rgb(18 75 60 / 16%);
  border-radius: 16px;
  scrollbar-width: thin;
}

.rooted-discovery-journal-filter,
.root-game-progress-copy .rooted-discovery-journal-filter {
  display: flex;
  min-width: 112px;
  flex: 1 0 112px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 8px;
  color: #52685d;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 11px;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.rooted-discovery-journal-filter i {
  flex: 0 0 auto;
  font-size: 18px;
}

.rooted-discovery-journal-filter small {
  display: grid;
  min-width: 21px;
  height: 21px;
  place-items: center;
  color: #53685d;
  background: rgb(18 75 60 / 8%);
  border-radius: 999px;
  font-size: 10px;
}

.rooted-discovery-journal-filter:hover,
.rooted-discovery-journal-filter:focus-visible,
.root-game-progress-copy .rooted-discovery-journal-filter:hover,
.root-game-progress-copy .rooted-discovery-journal-filter:focus-visible {
  color: #0b4b3b;
  background: #fffaf0;
  border-color: rgb(183 147 58 / 35%);
  outline: 2px solid transparent;
}

.rooted-discovery-journal-filter.is-active,
.root-game-progress-copy .rooted-discovery-journal-filter.is-active {
  color: #fffaf0;
  background: #0d5946;
  border-color: #dcb84c;
  box-shadow: 0 5px 13px rgb(13 89 70 / 15%);
}

.rooted-discovery-journal-filter.is-active small {
  color: #0d5946;
  background: #f3df9f;
}

.rooted-discovery-journal-empty {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 16px;
  min-height: 112px;
  padding: 18px;
  background: rgb(255 250 240 / 70%);
  border: 1px dashed rgb(20 82 65 / 34%);
  border-radius: 16px;
}

.rooted-discovery-journal-empty > i {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  color: #8d650d;
  background: #f3df9f;
  border-radius: 50%;
  font-size: 24px;
}

.rooted-discovery-journal-empty p {
  margin: 5px 0 0;
}

.rooted-discovery-journal-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
  gap: 12px;
}

.rooted-discovery-journal-card {
  overflow: hidden;
  background: #fffaf0;
  border: 1px solid rgb(183 147 58 / 34%);
  border-radius: 17px;
  box-shadow: 0 9px 22px rgb(47 60 38 / 7%);
}

.rooted-discovery-journal-card.is-equipped {
  border-color: rgb(38 117 86 / 50%);
  box-shadow: 0 9px 22px rgb(24 88 65 / 10%);
}

.rooted-discovery-journal-card.is-boost-active {
  border-color: rgb(202 142 27 / 62%);
  box-shadow: 0 9px 25px rgb(202 142 27 / 15%);
}

.rooted-discovery-journal-card[data-rarity="uncommon"] {
  border-color: rgb(63 122 92 / 42%);
}

.rooted-discovery-journal-card[data-rarity="rare"] {
  border-color: rgb(176 123 20 / 48%);
}

.rooted-discovery-journal-card[data-rarity="epic"] {
  border-color: rgb(120 80 154 / 48%);
  box-shadow: 0 9px 24px rgb(98 57 133 / 10%);
}

.rooted-discovery-journal-card[data-rarity="legendary"] {
  border-color: rgb(209 138 18 / 72%);
  box-shadow: 0 10px 27px rgb(209 138 18 / 17%);
}

.rooted-discovery-journal-summary,
.root-game-progress-copy .rooted-discovery-journal-summary {
  display: grid;
  width: 100%;
  grid-template-columns: 82px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 0 13px;
  padding: 11px;
  color: inherit;
  background: transparent;
  border: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.rooted-discovery-journal-summary:hover,
.rooted-discovery-journal-summary:focus-visible,
.root-game-progress-copy .rooted-discovery-journal-summary:hover,
.root-game-progress-copy .rooted-discovery-journal-summary:focus-visible {
  background: rgb(246 235 202 / 33%);
  outline: 3px solid rgb(220 184 76 / 33%);
  outline-offset: -3px;
}

.rooted-discovery-journal-art {
  position: relative;
  display: grid;
  width: 82px;
  height: 82px;
  grid-row: 1 / span 2;
  place-items: center;
  overflow: hidden;
  background: radial-gradient(circle, rgb(248 211 101 / 52%), transparent 55%), linear-gradient(160deg, #123f33, #062b25);
  border-radius: 12px;
}

.rooted-discovery-journal-art::after {
  position: absolute;
  width: 70%;
  height: 45%;
  background: radial-gradient(ellipse, rgb(251 210 83 / 50%), transparent 68%);
  content: "";
  filter: blur(8px);
}

.rooted-discovery-journal-art img {
  position: relative;
  z-index: 1;
  width: 88%;
  height: 76px;
  object-fit: contain;
  filter: drop-shadow(0 0 17px rgb(246 200 72 / 63%));
}

.rooted-discovery-journal-compact-copy {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  flex-direction: column;
}

.rooted-discovery-journal-card-top {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.rooted-discovery-journal-card-top small,
.rooted-discovery-journal-source {
  color: #6e7e74;
  font-size: 10px;
}

.rooted-discovery-journal-quantity {
  display: inline-grid;
  min-width: 25px;
  height: 21px;
  margin-right: 7px;
  place-items: center;
  color: #fffaf0;
  background: #0d5946;
  border-radius: 999px;
  font-size: 10px;
}

.rooted-discovery-journal-quantity.is-empty {
  color: #6d756d;
  background: #e8e6da;
}

.rooted-discovery-journal-compact-copy > strong {
  display: block;
  max-width: 100%;
  margin: 5px 0 4px;
  overflow: hidden;
  color: #073c31;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 19px;
  line-height: .98;
  text-overflow: ellipsis;
}

.rooted-discovery-journal-benefit {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #385c28;
  font-size: 12px;
}

.rooted-discovery-journal-benefit b {
  color: #0d5946;
}

.rooted-discovery-journal-status {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  align-self: end;
  gap: 5px;
  color: #587067;
  font-size: 10px;
  font-weight: 800;
}

.rooted-discovery-journal-status i {
  font-size: 15px;
}

.rooted-discovery-journal-card.is-equipped .rooted-discovery-journal-status {
  color: #0d694e;
}

.rooted-discovery-journal-details {
  display: grid;
  gap: 7px;
  padding: 0 13px 13px;
  border-top: 1px solid rgb(18 75 60 / 12%);
}

.rooted-discovery-journal-details[hidden] {
  display: none !important;
}

.rooted-discovery-journal-details p {
  margin: 11px 0 0;
  font-size: 13px;
  line-height: 1.4;
}

.rooted-discovery-journal-implementation {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  padding: 8px 10px;
  color: #52685d;
  background: rgb(18 75 60 / 6%);
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.35;
}

.rooted-discovery-journal-item-odds {
  color: #8c6512;
  font-size: 10px;
  font-weight: 800;
}

.rooted-discovery-journal-implementation i {
  flex: 0 0 auto;
  color: #a47516;
  font-size: 15px;
}

.rooted-discovery-journal-equip,
.root-game-progress-copy .rooted-discovery-journal-equip {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 4px;
  color: #fff9e9;
  background: #0d5946;
  border: 1px solid #dcb84c;
  border-radius: 13px;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.rooted-discovery-journal-equip:hover,
.rooted-discovery-journal-equip:focus-visible,
.root-game-progress-copy .rooted-discovery-journal-equip:hover,
.root-game-progress-copy .rooted-discovery-journal-equip:focus-visible {
  background: #0a493a;
  outline: 3px solid rgb(220 184 76 / 33%);
  outline-offset: 2px;
}

.rooted-discovery-journal-card.is-equipped .rooted-discovery-journal-equip,
.root-game-progress-copy .rooted-discovery-journal-card.is-equipped .rooted-discovery-journal-equip {
  color: #174f40;
  background: #f5ead0;
  border-color: #d4b65c;
}

.rooted-discovery-journal-equip:disabled,
.root-game-progress-copy .rooted-discovery-journal-equip:disabled {
  color: #1c503f;
  background: #e6eedb;
  border-color: #bdd0b4;
  cursor: wait;
}

.rooted-discovery-journal-consume,
.root-game-progress-copy .rooted-discovery-journal-consume {
  display: grid;
  width: 100%;
  min-height: 48px;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 4px;
  padding: 9px 13px;
  color: #fff9e9;
  background: linear-gradient(135deg, #955217, #bd7622);
  border: 1px solid #e8c55d;
  border-radius: 13px;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.rooted-discovery-journal-consume small {
  justify-self: end;
  color: #ffe6a1;
  font-size: 10px;
}

.rooted-discovery-journal-consume:hover,
.rooted-discovery-journal-consume:focus-visible {
  background: linear-gradient(135deg, #7e4212, #a9621c);
  outline: 3px solid rgb(220 184 76 / 33%);
  outline-offset: 2px;
}

.rooted-discovery-journal-consume:disabled {
  color: #315548;
  background: #edf0df;
  border-color: #bccdaf;
  cursor: default;
}

.rooted-discovery-journal-consume:disabled small {
  color: #607469;
}

@media (max-width: 680px) {
  .root-game-root-stats > header,
  .root-game-root-stats-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .root-game-root-stats-equipped {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  .root-game-root-stats-equipped-art {
    width: 54px;
    height: 54px;
  }

  .rooted-discovery-active-boost {
    top: 132px;
    right: 8px;
    min-width: 0;
    max-width: calc(100% - 16px);
    grid-template-columns: 42px minmax(0, 1fr) auto;
    padding: 7px 8px;
    border-radius: 15px;
  }

  .rooted-discovery-active-boost img {
    width: 42px;
    height: 42px;
  }

  .rooted-discovery-active-boost strong {
    font-size: 16px;
  }

  .rooted-discovery-active-boost time {
    min-width: 50px;
    padding: 7px 6px;
  }

  .root-game-progress-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .root-game-progress-tabs button {
    gap: 3px;
    padding-inline: 2px;
    font-size: 10px;
  }

  .root-game-progress-tabs button i {
    font-size: 17px;
  }

  .rooted-discovery-journal-header {
    display: grid;
    grid-template-columns: 1fr auto;
    padding: 14px;
  }

  .rooted-discovery-journal-header p {
    grid-column: 1 / -1;
    font-size: 12px;
  }

  .rooted-discovery-journal-odds {
    align-items: flex-start;
    flex-direction: column;
  }

  .rooted-discovery-journal-rarity-key {
    justify-content: flex-start;
  }

  .rooted-discovery-journal-filter {
    min-width: 108px;
    flex-basis: 108px;
    min-height: 42px;
    font-size: 11px;
  }

  .rooted-discovery-journal-list {
    grid-template-columns: 1fr;
  }

  .rooted-discovery-journal-summary {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .rooted-discovery-journal-art {
    width: 72px;
    height: 72px;
  }

  .rooted-discovery-journal-art img {
    height: 67px;
  }
}

@media (min-width: 681px) and (max-height: 680px) {
  .root-game-root-stats {
    gap: 9px;
    padding-block: 0 7px;
  }

  .root-game-root-stats > header {
    grid-template-columns: minmax(0, 0.9fr) minmax(270px, 1.1fr);
    gap: 9px;
  }

  .root-game-root-stats > header > div:first-child {
    padding-block: 3px;
  }

  .root-game-root-stats h3 {
    font-size: 27px;
  }

  .root-game-root-stats-equipped {
    grid-template-columns: 50px minmax(0, 1fr);
    gap: 8px;
    padding: 7px 9px;
  }

  .root-game-root-stats-equipped-art {
    width: 46px;
    height: 46px;
  }

  .root-game-root-stats-equipped strong {
    font-size: 15px;
  }

  .root-game-root-stats-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }

  .root-game-root-stats-grid article {
    gap: 6px;
    padding: 9px;
  }

  .root-game-root-stats-grid article > header span {
    gap: 4px;
    font-size: 11px;
  }

  .root-game-root-stats-grid article > header strong {
    font-size: 17px;
  }

  .root-game-root-stats-grid article > p {
    font-size: 9px;
  }

  .root-game-root-stats-note {
    padding-block: 6px;
    font-size: 9px;
  }
}