/* Approved pet panel: warm brown/gold, reusable live text and controls. */
#game .utility-controls > #petButton {
  position: absolute;
  right: calc(100% + 8 * var(--ui-unit, 1px));
  bottom: 0;
}
#petButton svg, #petSkillButton svg { fill: currentColor; stroke: none; }
#game .utility-controls > #petSkillButton {
  position: absolute;
  right: calc(100% + 8 * var(--ui-unit, 1px));
  bottom: calc(50 * var(--ui-unit, 1px));
  border-radius: 50%;
  background: rgba(57, 43, 25, .72);
  color: #f8e4b1;
}
#petSkillButton[hidden], .nx198-pet-modal[hidden], .nx198-pet-submodal[hidden] { display: none !important; }
#petSkillButton.is-active { border-color: #f0d28b; box-shadow: 0 0 10px rgba(247, 223, 150, .35); }
#petSkillButton.is-cooling svg { opacity: .35; }
#petSkillButton output { position: absolute; font-size: calc(17 * var(--ui-unit, 1px)); color: white; font-weight: 700; }
#petSkillButton small { position: absolute; left: 50%; top: 100%; transform: translateX(-50%); white-space: nowrap; font-size: calc(9 * var(--ui-unit, 1px)); color: #fff3bd; }
.nx198-pet-modal { position: absolute; z-index: 125; inset: 0; display: grid; place-items: center; padding: clamp(8px, 2vh, 20px); background: rgba(12, 10, 6, .36); pointer-events: auto; box-sizing: border-box; }
.nx198-pet-modal *, .nx198-pet-stats * { box-sizing: border-box; }
.nx198-pet-panel { width: min(920px, 94%); max-height: 94%; display: flex; flex-direction: column; color: #f5e7c4; border: 1px solid #d2ad65; border-radius: 15px; padding: clamp(12px, 2vh, 22px); background: linear-gradient(125deg, rgba(45, 34, 22, .96), rgba(25, 21, 17, .95)); box-shadow: inset 0 0 0 4px #382b1c, inset 0 0 0 5px #8d7040, 0 12px 40px #0008; }
.nx198-pet-panel > header, .nx198-pet-submodal header { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-shrink: 0; border-bottom: 1px solid #84653b; padding-bottom: 9px; }
.nx198-pet-panel h2 { margin: 0; color: #ffe5a2; font: 700 clamp(16px, 3vh, 28px) Georgia, serif; letter-spacing: .06em; }
.nx198-pet-panel button, .nx198-pet-submodal button { color: #ffedc3; cursor: pointer; touch-action: manipulation; font: inherit; border: 1px solid #b68c4d; border-radius: 8px; padding: 9px 13px; background: linear-gradient(#876130, #50371b); box-shadow: inset 0 0 0 2px #ffffff08; }
.nx198-pet-panel button:hover:not(:disabled), .nx198-pet-submodal button:hover:not(:disabled) { border-color: #ffe7a7; background: linear-gradient(#99743e, #634726); }
.nx198-pet-panel button:focus-visible, .nx198-pet-submodal button:focus-visible, .nx198-pet-modal input:focus-visible, .nx198-pet-modal select:focus-visible { outline: 2px solid #fff1c3; outline-offset: 2px; }
.nx198-pet-panel button:disabled, .nx198-pet-submodal button:disabled { cursor: default; opacity: .42; }
.nx198-pet-panel .nx198-pet-close, .nx198-pet-submodal header button { font-size: 27px; line-height: 1; padding: 0 6px; background: none; box-shadow: none; border: 0; }
.nx198-pet-tabs { display: flex; gap: 8px; padding: 8px 0; }
.nx198-pet-tabs button { padding: 6px 17px; font-size: 13px; background: #302316; color: #c4ae85; }
.nx198-pet-tabs button.is-active { color: #fff0c3; border-color: #e2bd77; background: #735028; }
.nx198-pet-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #a88148 #2d241b; }
.nx198-pet-main { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 16px; align-items: center; }
.nx198-pet-art { height: clamp(175px, 42vh, 380px); min-height: 0; display: grid; place-items: center; background: radial-gradient(ellipse at center, #d7be7840, transparent 62%); }
.nx198-pet-art > img { max-width: 100%; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 5px 14px #e7da9e28); }
.nx198-pet-details { min-width: 0; border: 1px solid #715737; border-radius: 12px; padding: clamp(10px, 1.8vh, 17px); background: #201a1452; }
.nx198-pet-details h3 { margin: 0 0 8px; font: 700 clamp(19px, 3.3vh, 32px) Georgia, serif; }
.nx198-rank { display: inline-block; font: 700 .72em Georgia, serif; padding: 2px 8px; border: 1px solid #c29c59; border-radius: 4px; color: #f4e5ae; vertical-align: middle; }
.nx198-rank.R { background: #475148; }
.nx198-rank.SR { background: #5e366d; color: #efd0ff; }
.nx198-rank.SSR { background: #8b6224; color: #ffe6a0; }
.nx198-pet-level { font-size: 16px; margin: 6px 0; }
.nx198-pet-exp { position: relative; height: 22px; overflow: hidden; border: 1px solid #8f764e; border-radius: 7px; background: #1c1812; }
.nx198-pet-exp i { display: block; height: 100%; background: linear-gradient(90deg, #66815b, #a9c38c); }
.nx198-pet-exp span { position: absolute; inset: 0; text-align: right; padding: 1px 8px; font-size: 12px; line-height: 18px; text-shadow: 0 1px 3px #000; }
.nx198-pet-details > small { display: block; color: #c9b796; font-size: 11px; margin-top: 5px; }
.nx198-pet-details dl { display: grid; gap: 6px; margin: 12px 0; }
.nx198-pet-details dl div { display: flex; justify-content: space-between; align-items: center; gap: 10px; border: 1px solid #725635; border-radius: 6px; padding: 8px 10px; background: linear-gradient(90deg, #70523430, #120e0b30); font-size: clamp(12px, 1.9vh, 16px); }
.nx198-pet-details dd { margin: 0; white-space: nowrap; color: #ffe6ac; }
.nx198-pet-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.nx198-pet-actions button { padding: 9px 4px; font-size: clamp(11px, 1.8vh, 15px); }
.nx198-pet-actions [data-pet-action="follow"] { background: linear-gradient(#52604b, #2b3528); }
.nx198-pet-roster { display: flex; overflow-x: auto; gap: 8px; padding: 10px 1px 4px; scrollbar-width: thin; }
.nx198-pet-panel .nx198-pet-choice { flex: 0 0 162px; display: flex; align-items: center; gap: 6px; text-align: left; padding: 4px 8px; background: #2a2117; font-size: 12px; }
.nx198-pet-choice img { width: 36px; height: 54px; object-fit: contain; }
.nx198-pet-choice small { display: block; font-size: 10px; color: #cbb890; margin-top: 4px; }
.nx198-pet-panel .nx198-pet-choice.is-selected { border-color: #ffe5a2; background: #75523065; }
.nx198-pet-message { min-height: 17px; margin: 5px 0 1px; font-size: 12px; color: #e5cf9c; }
.nx198-pet-message.is-error { color: #ffb098; }
.nx198-pet-wallet { border-top: 1px solid #84653b; padding-top: 7px; font-size: 12px; color: #c9b796; }
.nx198-pet-empty, .nx198-pet-eggs { text-align: center; padding: 24px; }
.nx198-pet-empty svg { width: 65px; height: 65px; fill: #b69455; }
.nx198-pet-empty p, .nx198-pet-eggs p { color: #d3c1a0; }
.nx198-pet-merge h3 { margin: 14px 0; }
.nx198-pet-merge-pair { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.nx198-pet-merge-pair label { display: grid; gap: 8px; }
.nx198-pet-merge-pair select, .nx198-pet-modal input { width: 100%; min-width: 0; border: 1px solid #b59360; border-radius: 6px; color: #ffedc7; background: #2d2217; padding: 9px; font: inherit; }
.nx198-pet-merge > p { color: #d7bd8a; font-size: 13px; }
.nx198-pet-shop { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 15px 0 0; }
.nx198-pet-shop article { border: 1px solid #715735; border-radius: 9px; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 12px; background: #33251880; }
.nx198-pet-shop article img { width: 100%; height: clamp(110px, 22vh, 220px); object-fit: contain; }
.nx198-pet-shop h3 { margin: 10px 0 4px; font-size: 16px; }
.nx198-pet-shop p { margin: 5px 0; font-size: 12px; color: #d3bb8e; }
.nx198-pet-shop strong { margin-top: auto; padding: 7px 0; font-size: 13px; }
.nx198-pet-shop button { margin-top: 7px; font-size: 13px; width: 100%; }
.nx198-shop-symbol { display: grid; place-items: center; font: 90px Georgia, serif; color: #b9c798; height: clamp(110px, 22vh, 220px); }
.nx198-shop-egg { display: block; width: 74px; height: 94px; margin: auto; border-radius: 52% 52% 47% 47% / 65% 65% 40% 40%; border: 2px solid #d3ba7c; background: radial-gradient(ellipse at 32% 25%, #fffcde, #b2bb95 53%, #586b65); box-shadow: inset -9px -8px 14px #233c3738, 0 0 16px #d8dd9d20; }
.nx198-pet-shop-note { color: #c9b796; font-size: 12px; }
.nx198-pet-submodal { position: absolute; z-index: 1; inset: 0; display: grid; place-items: center; background: #0b0809a8; padding: 15px; }
.nx198-pet-submodal article { max-width: 430px; width: 95%; max-height: 95%; overflow-y: auto; padding: 20px; color: #f7e5bd; background: linear-gradient(125deg, #483420, #211a15); border: 1px solid #d1ae6b; border-radius: 12px; box-shadow: 0 15px 50px #0009; }
.nx198-pet-submodal h3 { margin: 0; font-size: 17px; }
.nx198-pet-submodal p { font-size: 14px; line-height: 1.55; }
.nx198-pet-quantity-label { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 12px; padding: 20px 0 10px; }
.nx198-pet-quantity-actions { display: flex; justify-content: flex-end; gap: 8px; }
.nx198-pet-food-label { display: grid; gap: 7px; font-size: 13px; }
.nx198-pet-food-label select { width: 100%; min-width: 0; padding: 10px; border: 1px solid #b59360; border-radius: 6px; color: #ffedc7; background: #2d2217; font: inherit; }
.nx198-pet-confirm-actions { display: flex; justify-content: flex-end; gap: 9px; }
.nx198-pet-panel .nx198-pet-retry { align-self: flex-start; margin: 3px 0 7px; padding: 5px 12px; font-size: 12px; }
.nx198-pet-retry[hidden] { display: none !important; }
.nx198-pet-stats { border: 1px solid #997340; border-radius: 9px; padding: 9px 11px; margin-top: 12px; background: #312416; }
.nx198-pet-stats h3 { color: #f5d693; font-size: 13px; margin: 0 0 8px; }
.nx198-pet-stats h4 { margin: 10px 0 5px; color: #d8ba80; font-size: 12px; }
.nx198-pet-stats p { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin: 7px 0; font-size: 12px; }
.nx198-pet-stats small { color: #c8b595; line-height: 1.5; display: block; font-size: 10px; }
@media (max-height: 460px) { .nx198-pet-panel { width: min(870px, 96%); padding: 11px; } .nx198-pet-art { height: 205px; } .nx198-pet-details dl { margin: 8px 0; gap: 4px; } .nx198-pet-details dl div { padding: 5px 8px; } .nx198-pet-roster { padding-top: 6px; } .nx198-pet-shop article { padding: 8px; } }
@media (max-width: 540px) and (orientation: portrait) { .nx198-pet-main { grid-template-columns: 1fr; } .nx198-pet-art { height: 220px; } .nx198-pet-shop { grid-template-columns: 1fr; } .nx198-pet-merge-pair { grid-template-columns: 1fr; } }

/* Boss Bang retains automatic combat; the approved pet buff is its one new input. */
#game.is-guild-boss-active .controls { z-index: 251; }
.is-guild-boss-active #petSkillButton { visibility: visible !important; pointer-events: auto !important; }
