/* Pet window: same wooden sign and green leafy frame as the shop. */
#pet-dialog{--pet-ink:#4a3526;--pet-muted:#8b7358;--pet-green:#2f5b3e;--pet-gold:#d8ae5f;box-sizing:border-box;width:min(880px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 16px);margin:auto;padding:52px 0 0;overflow:visible;color:var(--pet-ink);border:0;background:transparent;font:14px/1.5 'Nunito Sans','Noto Sans Thai',Tahoma,sans-serif}
#pet-dialog[open]{display:block}
#pet-dialog::backdrop{background:radial-gradient(circle at 50% 40%,#16241a70,#070b08c9);backdrop-filter:blur(3px)}
#pet-dialog *,#pet-dialog *::before,#pet-dialog *::after{box-sizing:border-box}
:where(#pet-dialog) :where(button,input){font:inherit;color:inherit}
:where(#pet-dialog) button{cursor:pointer}
#pet-dialog button:disabled{cursor:default}
#pet-dialog :focus-visible{outline:3px solid #f0c75e;outline-offset:2px}
.pet-frame{position:relative;display:flex;flex-direction:column;max-height:calc(100dvh - 68px);padding:10px 12px 12px;border-radius:24px;background:linear-gradient(180deg,#3d6d4a,#2f5b3e 30%,#29523a);box-shadow:0 0 0 2px #1a3323,inset 0 1px #6f9e76,0 28px 90px #050806e0}
.pet-frame::before{content:'';position:absolute;inset:5px;border:2px solid #c9a55a;border-radius:20px;pointer-events:none}
.pet-header{position:relative;min-height:44px}
.pet-sign{position:absolute;z-index:2;left:50%;top:-46px;display:flex;flex-direction:column;align-items:center;justify-content:center;width:250px;height:82px;transform:translateX(-50%);border:3px solid var(--pet-gold);border-radius:22px;background:repeating-linear-gradient(0deg,#ffffff07 0 3px,transparent 3px 8px),linear-gradient(#80552f,#5d3a20 68%,#4a2d18);color:#fff1d2;box-shadow:inset 0 0 0 3px #5d3b22,inset 0 0 0 5px #c49a5588,0 5px 0 #34200f,0 12px 20px #0008}
.pet-sign h2{margin:0;font-size:30px;font-weight:900;line-height:1.1;text-shadow:0 2px 0 #34200f}
.pet-sign small{font-size:11px;letter-spacing:.2em;color:#ebd09a}
#pet-close{position:absolute;z-index:3;top:-4px;right:2px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:3px solid #e9dcc0;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fffdf6,#ece2cc);color:#3b3024;font-size:28px;line-height:1;box-shadow:0 3px 0 #1a3323,0 4px 10px #0006}
.pet-body{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:16px;min-height:0;overflow:auto;padding:16px;border:2px solid #b8955e;border-radius:16px;background:radial-gradient(90% 60% at 50% 0,#fffaf0,transparent 70%),#f5e9d2;box-shadow:inset 0 0 0 2px #fff6e499}
.pet-loading{grid-column:1/-1;margin:0;padding:60px 20px;text-align:center;color:var(--pet-muted);font-size:15px}
.pet-art{display:grid;place-items:center;flex:none}
.pet-art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 3px #5a3d2640)}
/* Adoption */
.pet-intro{grid-column:1/-1;text-align:center}
.pet-intro h3{margin:4px 0 2px;font-size:24px;font-weight:900}
.pet-intro p{margin:0 auto;max-width:560px;color:#6d5a47}
.pet-choices{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pet-choice{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 12px 16px;border:2px solid #e0c9a3;border-radius:16px;background:linear-gradient(#fffdf7,#f8ecd5);box-shadow:0 3px 0 #dfc59c;text-align:center;transition:transform .12s,border-color .12s}
.pet-choice:hover:not(:disabled){transform:translateY(-2px);border-color:#d3a970}
.pet-choice[aria-checked=true]{border-color:#e2a93a;background:linear-gradient(#fffaf0,#fcecc4);box-shadow:0 0 0 3px #f6d57c,0 3px 0 #d6a64a}
.pet-choice .pet-art{width:120px;height:120px}
.pet-choice-copy strong{display:block;font-size:17px;font-weight:900}
.pet-choice-copy small{display:block;margin-top:2px;color:#6d5a47;font-size:12.5px;line-height:1.55}
.pet-adopt,.pet-rename{display:flex;align-items:center;gap:10px}
.pet-adopt{grid-column:1/-1;justify-content:center;flex-wrap:wrap}
.pet-adopt label,.pet-rename label{font-weight:800}
#pet-name,#pet-rename-input{width:min(240px,100%);min-height:44px;margin:0;padding:0 14px;border:1px solid #d6bd93;border-radius:12px;background:#fffbf3;color:var(--pet-ink);font-size:15px;box-shadow:inset 0 1px 3px #b8946b33}
.pet-primary{min-height:50px;padding:8px 26px;border:2px solid var(--pet-gold);border-radius:16px;background:linear-gradient(#468257,#2c5a3b 60%,#244c31);color:#fff6df;font-size:18px;font-weight:900;text-shadow:0 2px 0 #183221;box-shadow:inset 0 1px #7fb08a,0 4px 0 #183221}
.pet-primary:hover:not(:disabled){filter:brightness(1.08)}
.pet-primary:disabled,.pet-secondary:disabled{border-color:#cbb99b;background:#ddd0bb;color:#8b7a6a;text-shadow:none;box-shadow:none}
.pet-secondary{min-height:44px;padding:0 16px;border:1px solid #cfae79;border-radius:12px;background:#fff7e8;color:#6b4f35;font-weight:800}
.pet-secondary:hover:not(:disabled){background:#fdf0da}
/* Owned pet */
.pet-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px;border:2px solid #d4b47e;border-radius:16px;background:linear-gradient(#f4e4c5,#ead6b1);text-align:center}
.pet-art-large{width:190px;height:190px;border-radius:50%;background:radial-gradient(circle at 50% 60%,#fff8e6,#f3e0bb 62%,transparent 72%)}
.pet-art-large.is-out img{animation:pet-hop 1.6s ease-in-out infinite}
.pet-card h3{margin:0;font-size:26px;font-weight:900;overflow-wrap:anywhere}
.pet-species{margin:-4px 0 0;padding:1px 14px;border:1px solid #d0b88f;border-radius:999px;background:#f8efdc;color:#6d5540;font-size:12.5px;font-weight:700}
.pet-level{display:flex;align-items:baseline;justify-content:space-between;gap:10px;width:100%;margin-top:6px}
.pet-level strong{font-size:20px;font-weight:900;color:var(--pet-green)}
.pet-level span{color:var(--pet-muted);font-size:12.5px}
.pet-xp{width:100%;height:12px;overflow:hidden;border:1px solid #c9a86f;border-radius:999px;background:#fbf3e3}
.pet-xp i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8ec46a,#4f8a3a)}
.pet-actions{display:flex;flex-direction:column;gap:12px;min-width:0}
.pet-status{align-self:flex-start;margin:0;padding:4px 14px;border-radius:999px;background:#ece2cf;color:#6d5540;font-weight:800}
.pet-status.is-out{background:#dcebc9;color:#3f6128}
.pet-status::before{content:'';display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:currentColor;vertical-align:middle}
.pet-rename{flex-wrap:wrap}
.pet-rename label{flex-basis:100%}
.pet-about{padding:12px 14px;border:1px solid #e3cfa9;border-radius:12px;background:#fffbf2}
.pet-about p{margin:0;color:#6d5a47;line-height:1.7}
.pet-about .pet-note{margin-top:8px;padding-top:8px;border-top:1px dashed #e0c9a3;font-size:13px;color:var(--pet-muted)}
#pet-result{min-height:0;margin:10px 4px 0;color:#fff6df;font-weight:800;text-align:center}
#pet-result:empty{display:none}
#pet-result[data-tone=ok]{color:#d8f5c0}
#pet-result[data-tone=error]{color:#ffd2c2}
#pet-result[data-tone=info]{color:#ebdcbc;font-weight:600}
/* Tabs: mounts, carriers, companions */
.pet-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 10px}
.pet-tabs button{min-height:48px;padding:6px 10px;border:2px solid #dcc39b;border-radius:14px 14px 8px 8px;background:linear-gradient(#fbf1dd,#f1e1c3);color:#6b4f35;font-size:17px;font-weight:900}
.pet-tabs button:hover:not(:disabled):not([aria-pressed=true]){background:#fff6e4}
.pet-tabs button[aria-pressed=true]{border-color:#1f3d2a;background:linear-gradient(#3d7450,#2a5538);color:#fff6df;box-shadow:inset 0 1px #6fa37d,0 3px 0 #1a3323}
.pet-choices-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pet-choice .pet-art-side{width:170px;height:142px}
.pet-choice-copy em{display:block;margin-top:6px;color:#2f5b3e;font-size:13px;font-style:normal;font-weight:900}
.pet-art-large.pet-art-side{width:240px;height:200px;border-radius:24px}
.pet-stat{margin:0;padding:3px 14px;border-radius:999px;background:#dcebc9;color:#2f5b3e;font-weight:900}
/* Delivery */
.pet-cargo{display:flex;flex-direction:column;gap:6px}
.pet-cargo-row{display:grid;grid-template-columns:44px minmax(0,1fr) 38px 38px 38px auto;align-items:center;gap:8px;padding:6px 8px;border:1px solid #e3cfa9;border-radius:12px;background:#fffbf2}
.pet-cargo-art{display:grid;place-items:center;width:44px;height:44px;border-radius:10px;background:radial-gradient(circle at 50% 40%,#fbf3e4,#e3cfb2)}
.pet-cargo-art img{width:86%;height:86%;object-fit:contain}
.pet-cargo-info{min-width:0}.pet-cargo-info strong{display:block;font-size:15px}.pet-cargo-info small{display:block;color:var(--pet-muted);font-size:12px;line-height:1.4}
.pet-step{width:38px;height:36px;padding:0;border:1px solid #1f3d2a;border-radius:9px;background:linear-gradient(#3d7450,#2a5538);color:#fff;font-size:20px;font-weight:900;line-height:1}
.pet-step:disabled{opacity:.35}
.pet-cargo-row output{font-size:17px;font-weight:900;text-align:center}
.pet-all{min-height:36px;padding:0 10px;font-size:12.5px}
.pet-all:disabled{opacity:.45}
.pet-cargo-summary{display:flex;flex-direction:column;gap:4px}.pet-cargo-summary p{margin:0;color:#6d5a47;font-weight:700;text-align:right}
.pet-trip{height:16px}.pet-trip i{background:linear-gradient(90deg,#e7b75a,#c98a2b)}
.pet-trip-left{margin:0;font-weight:900;color:#6b4f35}
.pet-last{margin:0}
@keyframes pet-hop{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
/* Item 105: the companion's abilities (help fight / pick up) and the player's own on/off switches. */
.pet-abilities{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border:2px solid #d9c094;border-radius:14px;background:#fff8ea}
.pet-abilities h4{margin:0;font-size:15px;font-weight:900;color:var(--pet-green)}
.pet-ability{margin:0;font-weight:800;color:#4a3526;overflow-wrap:anywhere}
.pet-abilities .pet-note{margin:0}
.pet-ability-off{color:#8b7358;font-weight:700}
.pet-switches{display:flex;flex-wrap:wrap;gap:8px 16px}
.pet-switch{display:inline-flex;align-items:center;gap:8px;min-height:40px;font-weight:800;cursor:pointer}
.pet-switch input{width:22px;height:22px;margin:0;accent-color:var(--pet-green);cursor:pointer}
.pet-switch input:disabled,.pet-switch input:disabled+span{cursor:default;opacity:.5}
@media(max-width:700px){
 #pet-dialog{width:calc(100vw - 10px);padding-top:40px}
 .pet-sign{top:-38px;width:190px;height:64px}.pet-sign h2{font-size:23px}.pet-sign small{display:none}
 #pet-close{width:38px;height:38px;font-size:24px}
 .pet-body{grid-template-columns:1fr;padding:10px;gap:10px}
 .pet-choices{grid-template-columns:1fr;gap:8px}.pet-choice{flex-direction:row;text-align:left;padding:10px}.pet-choice .pet-art{width:72px;height:72px}
 .pet-art-large{width:130px;height:130px}.pet-card{padding:12px}
 .pet-tabs{gap:5px}.pet-tabs button{min-height:42px;font-size:14px;padding:4px}
 .pet-choices-2{grid-template-columns:1fr}.pet-choice .pet-art-side{width:96px;height:80px}.pet-art-large.pet-art-side{width:180px;height:150px}
 .pet-cargo-row{grid-template-columns:36px minmax(0,1fr) 34px 30px 34px;gap:5px}.pet-cargo-art{width:36px;height:36px}.pet-all{grid-column:2/-1}.pet-step{width:34px}
 .pet-adopt{flex-direction:column;align-items:stretch}#pet-name{width:100%}
}
@media(prefers-reduced-motion:reduce){#pet-dialog *{animation:none!important;transition:none!important}}