@charset "UTF-8";

/* Wood and paper are sliced separately from the action emblems. Source frames
   include transparent margins: the old 7px borders compressed their leaves and
   bolts almost out of view. These corner scales are approximately uniform. */
:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .mother-panel,
:is(.mother-camp, .mother-tap) .mother-upgrade-split,
.game-shell[data-page="adventure"] :is(.mother-party-panel, .mother-reward-panel, .mother-growth-panel),
.game-shell[data-page] .mother-secondary-content .feature-button {
  border: solid transparent;
  border-width: 18px 22px !important;
  border-image: url(../assets/ui/ui-upgrade-recipe-frame.png) 160 130 160 130 fill stretch !important;
  padding: 3px 5px 5px !important;
  border-radius: 0;
  background: none;
  box-shadow: 0 3px 0 #182d1c, 0 5px 9px #12251c55;
}

/* Compact rails still keep readable wooden corners, without putting a second
   full frame around nested payment previews. */
.game-shell[data-page="trip"] .mother-trip-status,
.game-shell[data-page="adventure"] .mother-advanced.dispatch-options,
:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip) .mother-upgrade-inventory,
.mother-offline-modal .mother-offline-inventory {
  border: solid transparent;
  border-width: 13px 16px !important;
  border-image: url(../assets/ui/ui-upgrade-recipe-frame.png) 160 130 160 130 fill stretch !important;
  padding: 2px 5px !important;
  border-radius: 0;
  background: none;
  box-shadow: 0 2px 0 #1a2d1f;
}

.mother-offline-modal .mother-offline-upgrade .mother-upgrade-split {
  border: 0 !important;
  border-image: none !important;
  padding: 0 !important;
  background: none;
  box-shadow: none;
}

.game-shell[data-page="adventure"] .route-showcase-card {
  border-width: 16px 16px 17px !important;
  border-image: url(../assets/ui/ui-upgrade-recipe-frame.png) 160 130 160 130 fill stretch !important;
  box-shadow: 0 3px #17301d;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) :is(.mother-payment, .mother-next-shortfall),
.game-shell[data-page="adventure"] .mother-growth-cost,
.game-shell[data-page="tap"] .mother-tap-metrics {
  border-top-color: #a77d43;
  border-bottom-color: #a77d43;
  background-image: linear-gradient(90deg, #85512455, #c4975555 60%, transparent);
  background-size: 100% 2px;
  background-position: left top;
  background-repeat: no-repeat;
}

:is(.mother-camp, .mother-tap, .mother-offline-modal) .mother-next-upgrade {
  padding-left: 7px;
  border-left: 3px double #a17741;
}

.game-shell[data-page="growth"] .mother-growth-board.is-animal .mother-animal-next,
.mother-offline-modal .mother-offline-expeditions {
  border-left: 3px double #a17741;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .mother-panel > :is(h2, h3),
.game-shell[data-page="adventure"] :is(.mother-party-panel, .mother-reward-panel, .mother-growth-panel) :is(h2, h3) {
  color: #4b2d16;
  text-shadow: 0 1px #fff9e1;
}

/* Only frame rails stretch. The circular hammer/paw/basket is rendered once in
   ::before at its native aspect ratio and clipped to the emblem region. */
:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .button,
.game-shell[data-page="adventure"] :is(.mother-growth-train, .mother-departure, .mother-adjust-party).button,
.game-shell[data-page="growth"] .mother-growth-board.is-next .mother-board-content > .text-button,
.game-shell[data-page="tap"] .mother-tap-button {
  --rich-button-art: url(../assets/ui/button-upgrade-green-hammer.png);
  --rich-button-face: #658b28;
  --rich-button-light: #a3bd46;
  --rich-button-dark: #36571d;
  --rich-button-ink: #fff5d1;
  --rich-emblem-width: 36px;
  position: relative;
  isolation: isolate;
  min-height: 48px;
  min-width: 44px;
  padding: 3px 8px 3px 31px !important;
  border: solid transparent;
  border-width: 9px 12px !important;
  border-image: url(../assets/ui/ui-upgrade-recipe-frame.png) 160 130 160 130 stretch !important;
  border-radius: 0;
  background:
    repeating-linear-gradient(145deg, transparent 0 15px, #e9ed8a18 16px 18px, transparent 19px 29px),
    linear-gradient(175deg, var(--rich-button-light), var(--rich-button-face) 45%, var(--rich-button-dark)) !important;
  background-origin: padding-box;
  background-clip: padding-box !important;
  color: var(--rich-button-ink);
  box-shadow: inset 0 2px #fff8ca66, inset 0 -2px #1f351a77, 0 3px 0 #172b1d;
  text-shadow: 0 1px #283b18;
  text-decoration: none;
  line-height: 1.25;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .button::before,
.game-shell[data-page="adventure"] :is(.mother-growth-train, .mother-departure, .mother-adjust-party).button::before,
.game-shell[data-page="growth"] .mother-growth-board.is-next .mother-board-content > .text-button::before,
.game-shell[data-page="tap"] .mother-tap-button::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 50%;
  left: -10px;
  width: var(--rich-emblem-width);
  height: 44px;
  margin: 0;
  transform: translateY(-50%);
  background: var(--rich-button-art) -9px center / 115px auto no-repeat;
  filter: drop-shadow(0 2px 1px #30241188);
  pointer-events: none;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) :is(.button.gold, .button.art-depart, .mother-offline-claim),
.game-shell[data-page="camp"] .mother-camp-departure > .button,
.game-shell[data-page="adventure"] .mother-departure.button,
.game-shell[data-page="growth"] .mother-growth-board.is-next .mother-board-content > .text-button,
.game-shell[data-page="trip"] .mother-trip-actions [data-action="return-trip"],
.game-shell[data-page="tap"] .mother-tap-button {
  --rich-button-art: url(../assets/ui/button-depart-gold-footprints.png);
  --rich-button-face: #edb84f;
  --rich-button-light: #ffe094;
  --rich-button-dark: #c58630;
  --rich-button-ink: #553216;
  text-shadow: 0 1px #fff3ba;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .button.art-confirm {
  --rich-button-art: url(../assets/ui/button-claim-basket.png);
  --rich-button-face: #d9ab62;
  --rich-button-light: #f3d69c;
  --rich-button-dark: #a87237;
  --rich-button-ink: #50331b;
  text-shadow: 0 1px #fff0bc;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .button.secondary,
.game-shell[data-page="adventure"] .mother-adjust-party.button {
  --rich-button-art: url(../assets/ui/button-secondary-wood-plank.png);
  --rich-button-face: #936033;
  --rich-button-light: #c58b48;
  --rich-button-dark: #614121;
  --rich-button-ink: #fff0cb;
  padding-left: 8px !important;
  text-shadow: 0 1px #4c2b17;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .button.secondary::before,
.game-shell[data-page="adventure"] .mother-adjust-party.button::before {
  content: none;
}

/* Inline recipe actions have no room for a large badge. The intact badge stays
   on the larger action below; compact controls keep the same carved material. */
.game-shell[data-page="growth"] .mother-growth-board.is-current .mother-board-content > .button,
.game-shell[data-page="trip"] .mother-trip-objective .button {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.game-shell[data-page="growth"] .mother-growth-board.is-current .mother-board-content > .button::before,
.game-shell[data-page="trip"] .mother-trip-objective .button::before {
  content: none;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .button-label,
.game-shell[data-page="adventure"] :is(.mother-growth-train, .mother-departure, .mother-adjust-party) .button-label {
  position: relative;
  z-index: 1;
}

:is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .button:disabled {
  opacity: .72;
  filter: saturate(.45);
  box-shadow: inset 0 2px #fff2c455, 0 2px #273322;
}

@media (max-width: 370px) {
  :is(.mother-camp, .mother-tap, .mother-growth, .mother-trip, .mother-offline-modal) .mother-panel,
  :is(.mother-camp, .mother-tap) .mother-upgrade-split,
  .game-shell[data-page="adventure"] :is(.mother-party-panel, .mother-reward-panel, .mother-growth-panel) {
    border-width: 16px 19px !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
  }
}

