/* pet-card-page (2026-10-24): pet.html pet as an 8-bit trading card. Pixel art, site fonts. */
.pcard-wrap{display:flex;justify-content:center;margin:4px 0 14px}
.pcard{--edge:#9aa3ad;--edge2:#5d6670;position:relative;width:100%;max-width:440px;box-sizing:border-box;padding:10px;border-radius:18px;
  background:var(--edge);box-shadow:0 0 0 3px #000,0 6px 0 3px rgba(0,0,0,.45),inset 0 0 0 3px var(--edge2);image-rendering:pixelated}
.pcard[data-tier="1"]{--edge:#5fd068;--edge2:#2f7a36}
.pcard[data-tier="2"]{--edge:#4fa3ff;--edge2:#1f5fa8}
.pcard[data-tier="3"]{--edge:#ffd166;--edge2:#b8862a}
.pcard.pc-myth{background:linear-gradient(135deg,#ff5d8f,#ffd166,#7dff9c,#4fa3ff,#b47dff,#ff5d8f);background-size:300% 300%;animation:pcFoil 6s linear infinite}
@keyframes pcFoil{0%{background-position:0 50%}100%{background-position:300% 50%}}
@media (prefers-reduced-motion:reduce){.pcard.pc-myth{animation:none}}
.pcard.pc-dead{filter:grayscale(.85)}
.pc-inner,.pc-back{background:#14161c;border-radius:10px;box-shadow:inset 0 0 0 2px #000;padding:10px 12px}
.pc-banner{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#000;border:2px solid var(--edge2);border-radius:6px;padding:6px 10px}
.pc-banner h1#title{margin:0;font-size:clamp(15px,4.2vw,22px);line-height:1.15;overflow-wrap:anywhere}
.pc-num{font-weight:bold;color:var(--edge);white-space:nowrap}
.pc-myth .pc-num{color:#ffd166}
.pc-type{display:flex;justify-content:space-between;font-size:12px;text-transform:uppercase;letter-spacing:1px;margin:6px 2px;opacity:.85}
.pc-art{position:relative;display:flex;justify-content:center;background:repeating-conic-gradient(#20242c 0 25%,#191c23 0 50%) 0 0/16px 16px;border:3px solid #000;
  box-shadow:inset 0 0 0 2px var(--edge2);border-radius:4px;padding:10px 0;margin-bottom:8px}
.pc-art canvas#cv{display:block;width:320px;height:320px;max-width:calc(100% - 8px);height:auto;aspect-ratio:1}
.pcard #chips{margin:6px 0;font-size:13px}
.pcard .statbox{margin:6px 0;border:2px solid var(--edge2);border-radius:6px}
.pc-actrow{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0 4px}
.pc-act{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1px;padding:8px 4px;border:2px solid #000;border-radius:6px;background:#232733;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.4),0 0 0 2px var(--edge2);text-decoration:none;color:inherit}
.pc-act:hover,.pc-act:focus-visible{background:#2e3444;outline:none;box-shadow:inset 0 -3px 0 rgba(0,0,0,.4),0 0 0 2px var(--edge)}
.pc-ico{font-size:20px}.pc-act small{font-size:11px;opacity:.75}
.pc-note,.pc-none{margin:4px 0}
.pc-quests{margin-top:8px;border-top:2px dashed var(--edge2);padding-top:6px}
.pc-qh{margin:2px 0 6px;font-size:15px}
.pc-soon,.pc-noq{font-size:13px;opacity:.85;margin:4px 0}
.pc-away{display:flex;flex-direction:column;gap:2px;padding:8px;border:2px solid #ffd166;border-radius:6px;background:#2a2412;font-size:13px}
.pc-qlist{display:flex;flex-direction:column;gap:5px}
.pc-q{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;column-gap:8px;align-items:center;padding:6px 8px;background:#1d2029;border:2px solid #000;border-radius:6px}
.pc-q .pc-mb{grid-row:1/3;font-size:10px;padding:2px 4px;background:linear-gradient(90deg,#ff5d8f,#ffd166,#4fa3ff);color:#000;font-weight:bold;border-radius:3px}
.pc-q b{font-size:13px}.pc-q small{grid-column:2;font-size:11px;opacity:.75}
.pc-q .pc-qgo{grid-column:3;grid-row:1/3;padding:4px 10px}
.pc-foot{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:8px;font-size:11px;opacity:.8}
.pc-flipbtn{font-size:11px;padding:2px 6px}
.pc-back{position:absolute;inset:10px;display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(45deg,#1b1e26 0 8px,#14161c 8px 16px)}
.pc-back[hidden]{display:none}
.pc-back-in{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:16px;border:3px solid var(--edge);border-radius:10px;background:#0d0f14}
.pc-back-in img{image-rendering:pixelated}
.pc-bar{display:block;height:12px;border:2px solid #000;background:#000;margin:4px 0}.pc-bar i{display:block;height:100%;background:repeating-linear-gradient(90deg,#ffd166 0 6px,#e0a93a 6px 12px)}
.pc-tokbox{margin-top:8px;border-top:2px dashed var(--edge2);padding-top:6px}.pc-tokbox[hidden]{display:none}
.pc-tok{font-size:13px}.pc-tok p{margin:4px 0}.pc-tokgo{margin:4px 0}
.pc-tsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;list-style:none;padding:0;margin:4px 0 6px;font-size:10px;text-transform:uppercase;letter-spacing:.5px;text-align:center}
.pc-tsteps li{padding:4px 2px;border:2px solid #000;border-radius:4px;background:#1d2029;opacity:.6}
.pc-tsteps li.done{background:#2f7a36;opacity:1}.pc-tsteps li.now{background:#2a2412;box-shadow:0 0 0 2px #ffd166;opacity:1}
.pc-tok-tied{padding:8px;border:2px solid #4fd18b;border-radius:6px;background:#132a1c}
.pc-tokmsg:empty{display:none}