/* Shared Battle Pet primitives. */
.pet-card{margin-top:8px;border:1px solid var(--line);background:var(--surface);padding:10px}
.pet-art{display:grid;aspect-ratio:1;place-items:center;border:1px dashed var(--line);background:var(--surface-raised);color:var(--active-faction);text-align:center;font-size:10px;font-weight:800;text-transform:uppercase}
.pet-art .team-insignia{width:54px;height:54px;max-width:54px;max-height:54px;flex-basis:54px}
.pet-name{margin:0 0 4px;font-size:20px}
.hp-head{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:10px;font-size:11px;font-weight:800;text-transform:uppercase}
.hp-bar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;margin-top:5px}
.hp-cell{height:18px;border:1px solid var(--line);background:#2a2e35}
.hp-cell.is-full{background:var(--active-faction);box-shadow:0 0 8px color-mix(in srgb,var(--active-faction) 45%,transparent)}
.pet-down{margin-top:7px;border:1px dashed var(--line);background:var(--surface-raised);padding:7px;color:var(--muted);font-size:11px;font-weight:800;text-align:center;text-transform:uppercase}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}
.stat-card{border:1px solid var(--line);background:var(--surface);padding:8px}
.stat-top{display:flex;justify-content:space-between;gap:8px;align-items:center}
.stat-top strong{font-size:12px;text-transform:uppercase}
.stat-value{font-size:20px;font-weight:900;line-height:1}
.stat-meter{display:grid;grid-template-columns:repeat(10,1fr);gap:2px;margin-top:6px}
.stat-tick{height:5px;background:#2a2e35}
.stat-tick.on{background:var(--active-faction);box-shadow:0 0 8px color-mix(in srgb,var(--active-faction) 45%,transparent)}

body[data-page="pet"] .pet-shell{padding-top:6px}
body[data-page="pet"] [data-pet-root]{display:block}
.compact-achievement-sentinel{display:none!important}
.compact-pet,.pet-detail-view{display:grid;gap:8px}
.compact-pet-card{margin-top:0!important;padding:10px!important}
.compact-pet-card.is-detail{margin:0!important}
.compact-pet-identity{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;align-items:center}
.compact-pet-art{aspect-ratio:1}
.compact-pet-art .team-insignia{width:50px;height:50px}
.compact-pet-copy{min-width:0}
.compact-pet-copy .pet-name{margin:0 0 7px;font-size:22px;line-height:1.05}
.compact-pet-copy .hp-head{margin-top:7px}
.compact-pet-copy .pet-down{margin-top:7px}
.pet-level-row{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;font-weight:900;letter-spacing:.03em;text-transform:uppercase}
.pet-level-row strong{color:var(--active-faction);font-size:12px}
.pet-xp-track{height:5px;margin-top:4px;border:1px solid var(--line);background:var(--surface-raised);overflow:hidden}
.pet-xp-track span{display:block;height:100%;background:var(--active-faction);box-shadow:0 0 8px color-mix(in srgb,var(--active-faction) 45%,transparent)}
.compact-stat-grid{margin-top:0!important}
.compact-stat-card{padding:8px!important;box-shadow:none!important}
.compact-stat-card .stat-top strong{font-size:11px}
.compact-stat-card .stat-value{font-size:18px}
.compact-stat-card .stat-meter{margin-top:6px}

/* Same visual grammar as the Hunt / Snipe / Duel launcher bars. */
.pet-launchers{display:grid;gap:6px;margin-top:2px}
.pet-launcher{
  display:grid;
  grid-template-columns:minmax(0,1fr) 24px;
  min-height:56px;
  align-items:center;
  border:1px solid color-mix(in srgb,var(--active-faction) 76%,var(--line));
  background:color-mix(in srgb,var(--active-faction) 7%,#171411);
  padding:8px 14px;
  color:var(--active-faction);
  text-decoration:none;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--active-faction) 10%,transparent),0 0 14px color-mix(in srgb,var(--active-faction) 8%,transparent)
}
.pet-launcher>span:first-child{display:grid;gap:3px;min-width:0}
.pet-launcher strong{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:16px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 0 6px color-mix(in srgb,var(--active-faction) 36%,transparent)}
.pet-launcher small{overflow:hidden;color:color-mix(in srgb,var(--active-faction) 62%,var(--muted));font-size:9px;font-weight:850;text-overflow:ellipsis;white-space:nowrap}
.pet-launcher .chev{justify-self:end;color:var(--muted);font-size:25px;line-height:1}
.pet-launcher:active{transform:translateY(1px);background:color-mix(in srgb,var(--active-faction) 14%,#171411)}

.pet-detail-header{display:grid;grid-template-columns:38px minmax(0,1fr);gap:9px;align-items:center;margin:0 0 2px}
.pet-back{display:grid;width:38px;height:38px;place-items:center;border:1px solid var(--line);background:var(--surface);color:var(--active-faction);font-size:27px;line-height:1;text-decoration:none}
.pet-detail-header .label{display:block;margin-bottom:2px}
.pet-detail-header h1{margin:0;color:var(--ink);font-size:23px;line-height:1}
.pet-detail-header p{margin:4px 0 0;color:var(--muted);font-size:10px}
.pet-screen-card{border:1px solid var(--line);background:var(--surface);padding:10px;box-shadow:0 10px 28px rgb(0 0 0 / 18%)}
.pet-screen-heading{display:grid;gap:3px;margin-bottom:9px}
.pet-screen-heading strong{font-size:12px}

/* Initiate Battle is a fitted two-card viewport: live scanner above, battle ID below. */
body[data-page="pet"][data-pet-view="battle"]{overflow:hidden;overscroll-behavior:none}
body[data-page="pet"][data-pet-view="battle"] .pet-shell{
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:8px;
  height:calc(100dvh - var(--devbar-h) - var(--now-playing-h,56px) - var(--primary-nav-h,52px) - env(safe-area-inset-bottom));
  min-height:0;
  padding:6px 10px;
  overflow:hidden;
}
body[data-page="pet"][data-pet-view="battle"] [data-pet-root]{height:100%;min-height:0}
.battle-init-view{height:100%;min-height:0;grid-template-rows:minmax(0,4fr) minmax(0,5fr);gap:8px}
.battle-scanner-card,.battle-code-card{min-height:0;margin:0;overflow:hidden}
.battle-scanner-card{display:grid;padding:10px}
.pet-scanner-frame{
  --scanner-target:clamp(146px,23dvh,184px);
  position:relative;
  display:grid;
  width:88%;
  height:100%;
  min-height:0;
  place-items:center;
  justify-self:center;
  border:1px solid color-mix(in srgb,var(--active-faction) 62%,var(--line));
  background:radial-gradient(circle at center,color-mix(in srgb,var(--active-faction) 8%,#090b0e),#090b0e 68%);
  overflow:hidden;
}
.pet-scanner-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .16s ease}
.pet-scanner-frame.is-camera-live .pet-scanner-video{opacity:.78}
.pet-scanner-frame::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 0 46%,rgb(0 0 0 / 16%) 82%);pointer-events:none}
.pet-scanner-frame small{position:relative;z-index:4;color:color-mix(in srgb,var(--active-faction) 68%,#d9d5cf);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:9px;font-weight:900;letter-spacing:.08em;text-shadow:0 1px 3px #000;text-transform:uppercase}
.pet-scanner-frame small[data-status="error"]{color:#e1c4b5}
.pet-scanner-frame small[data-status="warning"]{color:#d8c7a3}
.scanner-line{display:none}
.scanner-corner{position:absolute;z-index:3;width:28px;height:28px;border-color:#e9ecec;filter:drop-shadow(0 0 2px rgb(0 0 0 / 80%))}
.scanner-corner.tl{top:calc(50% - var(--scanner-target)/2);left:calc(50% - var(--scanner-target)/2);border-top:2px solid;border-left:2px solid}
.scanner-corner.tr{top:calc(50% - var(--scanner-target)/2);right:calc(50% - var(--scanner-target)/2);border-top:2px solid;border-right:2px solid}
.scanner-corner.bl{bottom:calc(50% - var(--scanner-target)/2);left:calc(50% - var(--scanner-target)/2);border-bottom:2px solid;border-left:2px solid}
.scanner-corner.br{right:calc(50% - var(--scanner-target)/2);bottom:calc(50% - var(--scanner-target)/2);border-right:2px solid;border-bottom:2px solid}
.pet-scanner-canvas{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}

.pet-code-card{text-align:center}
.battle-code-card{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:10px;padding:10px}
.battle-id-stack{display:grid;min-height:0;place-items:center;align-content:center;gap:7px}
.pet-qr-shell{display:block;margin:0 auto;padding:9px;background:#f2eee6;box-shadow:0 0 15px rgb(0 0 0 / 22%)}
.pet-qr-output{display:grid;width:clamp(146px,23dvh,184px);aspect-ratio:1;place-items:center;overflow:hidden;background:#f2eee6}
.pet-qr-output canvas,.pet-qr-output img{width:100%!important;height:100%!important;object-fit:contain;image-rendering:pixelated}
.pet-qr-grid{display:grid;width:100%;height:100%;grid-template-columns:repeat(21,1fr);grid-template-rows:repeat(21,1fr);background:#f2eee6}
.pet-qr-grid i{display:block;background:transparent}
.pet-qr-grid i.on{background:#111}
.pet-battle-code{display:block;color:var(--active-faction);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px;letter-spacing:.065em;line-height:1.1;text-shadow:0 0 6px color-mix(in srgb,var(--active-faction) 28%,transparent);word-break:break-word}
.compact-battle-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:stretch}
.compact-battle-form input{min-width:0;min-height:44px;border:1px solid var(--line);background:var(--surface-raised);color:var(--ink);padding:8px 10px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px;font-weight:800;letter-spacing:.03em;text-transform:uppercase}
.compact-battle-form input::placeholder{color:var(--muted);opacity:.72}
.compact-battle-form .button{min-width:70px;min-height:44px;padding-inline:13px}

.battle-room-handoff{height:100%;min-height:0;place-items:center}
.battle-room-card{width:100%;text-align:center}
.battle-room-card .label{margin-bottom:8px}
.battle-room-card p{margin:9px 0 0;color:var(--muted);font-size:11px}
.compact-empty{padding:16px 10px;border:1px dashed var(--line);background:var(--surface-raised);color:var(--muted);text-align:center;font-size:11px}

.badge-section{display:grid;gap:2px}
.achievement-list{display:grid;gap:0}
.achievement-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;border-top:1px solid var(--soft);padding:9px 0}
.achievement-row:first-child{border-top:0}
.achievement-copy{display:grid;gap:3px;min-width:0}
.achievement-copy strong{font-size:13px}
.achievement-copy span{color:var(--muted);font-size:10px}
.achievement-row.is-ready .achievement-copy strong{color:var(--ink)}
.achievement-row.is-locked{opacity:.62}
.achievement-lock,.badge-shared{font-size:10px;font-weight:900;text-transform:uppercase}
.achievement-lock{color:var(--muted)}
.badge-shared{color:var(--active-faction)}
.badge-selfie{min-height:34px;padding:6px 10px}

.care-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.pet-care-button{display:grid;gap:5px;min-height:86px;place-content:center;border:1px solid color-mix(in srgb,var(--active-faction) 55%,var(--line));background:color-mix(in srgb,var(--active-faction) 6%,var(--surface-raised));color:var(--ink);font:inherit;text-align:center}
.pet-care-button strong{color:var(--active-faction);font-size:14px;text-transform:uppercase}
.pet-care-button span{color:var(--muted);font-size:9px}
.care-note{margin:9px 0 0;color:var(--muted);font-size:10px;text-align:center}

/* Overview uses the full space above the bottom navigation. Art flexes; stats and launchers stay low. */
body[data-page="pet"]:not([data-pet-view]){overflow:hidden;overscroll-behavior:none}
body[data-page="pet"]:not([data-pet-view]) .pet-shell{
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:8px;
  height:calc(100dvh - 90px - env(safe-area-inset-bottom));
  min-height:0;
  padding:6px 10px;
  overflow:hidden;
}
body[data-page="pet"]:not([data-pet-view]) [data-pet-root]{height:100%;min-height:0}
body[data-page="pet"]:not([data-pet-view]) .compact-pet{
  height:100%;
  min-height:0;
  grid-template-rows:minmax(0,1fr) auto auto;
  align-content:stretch;
}
body[data-page="pet"]:not([data-pet-view]) .compact-pet-card:not(.is-detail){display:grid;height:100%;min-height:0}
body[data-page="pet"]:not([data-pet-view]) .compact-pet-identity{
  height:100%;
  min-height:0;
  grid-template-columns:1fr;
  grid-template-rows:minmax(0,1fr) auto;
  align-items:stretch;
}
body[data-page="pet"]:not([data-pet-view]) .compact-pet-art{
  min-height:0;
  aspect-ratio:auto;
  align-content:center;
  gap:8px;
}
body[data-page="pet"]:not([data-pet-view]) .compact-pet-art .team-insignia{
  width:clamp(78px,14dvh,112px);
  height:clamp(78px,14dvh,112px);
  max-width:112px;
  max-height:112px;
  flex-basis:auto;
}
body[data-page="pet"]:not([data-pet-view]) .compact-pet-copy{padding-top:8px}
body[data-page="pet"]:not([data-pet-view]) .compact-stat-grid{grid-template-columns:1fr 1fr}

/* Keep the pet overview launchers proportioned and positioned like Hunt / Snipe / Duel. */
.pet-launchers{margin-top:0}
.pet-launcher{height:clamp(48px,8.2dvh,60px);min-height:0;padding:7px 14px}
.pet-launcher>span:first-child{display:block;width:min(58%,150px);justify-self:center;text-align:center}
.pet-launcher strong{display:block;font-size:16px;line-height:1}
.pet-launcher small{display:none}
.pet-launcher:nth-child(2){order:3}
.pet-launcher:nth-child(3){order:2}

@media(max-width:360px){
  .compact-pet-identity{grid-template-columns:78px minmax(0,1fr)}
  .pet-launcher{min-height:52px;padding-inline:11px}
  .pet-launcher{height:clamp(46px,7.7dvh,55px);min-height:0;padding:6px 11px}
  .pet-launcher strong{font-size:14px}
  .pet-qr-output{width:clamp(132px,21dvh,158px)}
  .compact-battle-form .button{min-width:64px;padding-inline:10px}
  .care-action-grid{gap:5px}
  body[data-page="pet"]:not([data-pet-view]) .compact-pet-identity{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  body[data-page="pet"]:not([data-pet-view]) .compact-pet-art .team-insignia{width:clamp(68px,12dvh,96px);height:clamp(68px,12dvh,96px);max-width:96px;max-height:96px}
}