/* Native companion sheets share one component and the existing explicit save flow.
   Only one detailed sheet is open at a time; the collection stays compact. */
#hub .exp-companion-card{background:var(--surface)}
#hub [data-companion-sheet]{border-top:0}
#hub [data-companion-sheet]>summary{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;min-height:48px;font-size:12px;line-height:1.45;color:var(--text);font-weight:700}
#hub [data-companion-sheet]>summary span{transform:none}
#hub [data-companion-teaser]{display:grid;grid-template-rows:74px auto auto auto;align-content:center;justify-items:center;gap:7px;min-height:184px;padding:16px 12px;width:100%;box-sizing:border-box;border-radius:18px;text-align:center}
#hub [data-companion-teaser]>.companion-face{display:block;width:82px;height:74px;max-height:74px;animation:none}
#hub [data-companion-teaser]>b{font-size:17px;line-height:1.25;color:var(--text)}
#hub [data-companion-teaser]>.companion-trait{display:none}
#hub [data-companion-teaser]>.companion-role{font-size:11px;line-height:1.4;color:var(--sub)}
#hub [data-companion-teaser]>span{font-size:12px;line-height:1.4;color:var(--mint)}
#hub [data-companion-state=locked] [data-companion-teaser]>span{color:var(--sub)}
#hub .pilot-companion-disclosure{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:12px 14px;border-top:1px solid var(--club-line);font-size:12px;color:var(--mint);box-sizing:border-box}
#hub .pilot-companion-disclosure>span:last-child{margin-left:auto;font-size:19px}
#hub .pilot-companion-close-label{display:none}
#hub [data-companion-sheet][open]>summary .pilot-companion-open-label{display:none}
#hub [data-companion-sheet][open]>summary .pilot-companion-close-label{display:inline}
#hub [data-companion-sheet][open]>summary .pilot-companion-disclosure>span:last-child{transform:rotate(180deg)}
#hub .exp-companion-card:has([data-companion-sheet][open]){grid-column:1/-1;border-radius:24px;background:var(--surface)}
#hub [data-companion-sheet][open]>summary [data-companion-teaser]{display:none}
#hub [data-companion-sheet][open]>summary .pilot-companion-disclosure{padding:14px 20px;border-top:0;border-bottom:1px solid var(--club-line);color:var(--sub)}
#hub [data-companion-sheet]>summary:hover [data-companion-teaser]{background:color-mix(in srgb,var(--mint) 5%,transparent)}
#hub [data-companion-sheet]>summary:focus-visible{outline:3px solid var(--mint);outline-offset:-3px;border-radius:18px}
#hub .pilot-companion-sheet{display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);gap:18px 28px;padding:22px;align-items:center}
#hub .pilot-companion-illustration{--pilot-companion-art-height:270px;position:relative;display:block;width:100%;height:var(--pilot-companion-art-height);min-width:0;min-height:0;background:radial-gradient(ellipse 44% 5% at 50% 91%,color-mix(in srgb,var(--house-ink) 10%,transparent),transparent);overflow:hidden}
/* A square image cannot enlarge a grid track or crop its feet. The raster,
   canonical SVG and failed-image fallback occupy the same reserved box. */
#hub .pilot-companion-illustration>:is(picture,svg,.pilot-art-fallback){position:absolute;inset:0;display:block;width:100%;height:var(--pilot-companion-art-height);max-width:100%;max-height:100%;min-width:0;min-height:0;object-fit:contain;animation:none}
#hub .pilot-companion-illustration picture img,#hub .pilot-companion-illustration .pilot-art-fallback>svg{display:block;width:100%;height:var(--pilot-companion-art-height);max-width:100%;max-height:100%;min-height:0;object-fit:contain;object-position:center}
#hub .pilot-companion-illustration svg *{animation:none}
#hub [data-companion-state=locked] .pilot-companion-illustration>:is(picture,svg,.pilot-art-fallback){filter:saturate(.72);opacity:.8}
#hub .pilot-companion-copy{min-width:0}
#hub .pilot-companion-copy p{padding:0;margin:0;color:var(--sub);font-size:13px;line-height:1.65;overflow-wrap:anywhere}
#hub .pilot-companion-copy .pilot-companion-family{font-size:12px;margin-bottom:6px}
#hub .pilot-companion-copy h4{font-family:var(--house-title);font-size:34px;font-weight:900;letter-spacing:-.8px;line-height:1.1;color:var(--text);margin:0 0 8px}
#hub .pilot-companion-copy .pilot-companion-trait{font-family:var(--house-title);font-size:19px;font-weight:800;line-height:1.3;color:var(--text)}
#hub .pilot-companion-copy .pilot-companion-habit{margin:10px 0 15px;max-width:480px}
#hub .pilot-companion-copy .pilot-companion-status{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--mint);font-weight:800;margin-bottom:9px}
#hub [data-companion-state=locked] .pilot-companion-copy .pilot-companion-status{color:var(--text)}
#hub [data-companion-state=preview] .pilot-companion-copy .pilot-companion-status{color:var(--text);border-left:3px solid var(--orange);padding-left:10px}
#hub .pilot-companion-progress{margin-bottom:14px}
#hub .pilot-companion-progress>[role=progressbar]{height:7px;max-width:340px;margin:0 0 8px;border-radius:8px;overflow:hidden;background:color-mix(in srgb,var(--mint) 14%,var(--club-bg))}
#hub .pilot-companion-progress>[role=progressbar]>span{display:block;height:100%;background:var(--mint);border-radius:inherit}
#hub .pilot-companion-progress p{font-size:12px;margin-bottom:4px}
#hub .pilot-companion-copy .pilot-companion-acquired{font-size:12px;margin-bottom:14px}
#hub .pilot-companion-choose{min-height:52px;width:auto;max-width:100%;padding:13px 18px;text-align:center;white-space:normal;line-height:1.4;font-size:13px}
#hub .pilot-companion-choose:disabled{cursor:default;box-shadow:none;opacity:1;color:var(--sub)}
#hub .pilot-companion-copy .pilot-companion-save-note{font-size:12px;margin-top:12px;max-width:460px}
#hub .pilot-companion-biography{grid-column:1/-1;border-top:1px solid var(--club-line);padding-top:2px}
#hub .pilot-companion-biography>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:10px 0;list-style:none;cursor:pointer;font-size:13px;color:var(--mint);font-weight:700}
#hub .pilot-companion-biography>summary::-webkit-details-marker{display:none}
#hub .pilot-companion-biography>summary::marker{content:''}
#hub .pilot-companion-biography[open]>summary>span{transform:rotate(180deg)}
#hub .pilot-companion-biography p{padding:0;font-size:13px;line-height:1.8;max-width:680px}
#hub [data-companion-sheet]>summary:focus-visible,#hub .pilot-companion-biography>summary:focus-visible,#hub .pilot-companion-choose:focus-visible{outline:3px solid var(--mint);outline-offset:-3px;border-radius:12px}
/* An expanded card cannot span the middle of a five-column row without leaving
   holes. Only its own family becomes a compact native accordion. DOM, reading
   and keyboard order stay identical; other families retain their card grid. */
#hub .exp-family .exp-companion-grid:has([data-companion-sheet][open]){grid-template-columns:minmax(0,1fr)}
#hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open])>summary{display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,200px);align-items:stretch}
#hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) [data-companion-teaser]{grid-template-columns:64px minmax(0,1fr);grid-template-rows:repeat(3,auto);gap:2px 16px;justify-items:start;align-content:center;min-height:94px;padding:14px 18px;width:auto;text-align:left}
#hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) [data-companion-teaser]>:is(.maison-art,.companion-face){grid-column:1;grid-row:1/4;width:64px;height:64px;max-height:64px;padding:3px;align-self:center;border:1px solid var(--club-line);border-radius:50%;background:var(--house-soft);overflow:hidden}
#hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) [data-companion-teaser]>:is(b,.companion-role,span:last-child){grid-column:2}
#hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) .pilot-companion-disclosure{min-width:0;padding:12px 18px;border-top:0;border-left:1px solid var(--club-line)}
@media(max-width:700px){
 #hub .pilot-companion-sheet{grid-template-columns:minmax(0,1fr);padding:16px;gap:14px}
 #hub .pilot-companion-illustration{--pilot-companion-art-height:184px;max-width:220px;justify-self:center}
 #hub [data-companion-sheet][open]>summary .pilot-companion-disclosure{padding:12px 16px}
 #hub .pilot-companion-copy h4{font-size:29px}
 #hub .pilot-companion-copy .pilot-companion-trait{font-size:18px}
 #hub .pilot-companion-copy .pilot-companion-habit{margin:9px 0 13px}
 #hub .pilot-companion-choose{width:100%;min-height:52px;padding:12px;font-size:13px}
 #hub .pilot-companion-biography{grid-column:auto}
 #hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open])>summary{grid-template-columns:minmax(0,1fr) 44px}
 #hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) [data-companion-teaser]{grid-template-columns:56px minmax(0,1fr);gap:2px 12px;min-height:88px;padding:12px}
 #hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) [data-companion-teaser]>:is(.maison-art,.companion-face){width:56px;height:56px;max-height:56px}
 #hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) .pilot-companion-disclosure{padding:10px;justify-content:center}
 #hub .exp-companion-grid:has([data-companion-sheet][open]) [data-companion-sheet]:not([open]) .pilot-companion-open-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){#hub .pilot-companion-sheet *{animation:none!important;transition:none!important}}
:root[data-motion=reduced] #hub .pilot-companion-sheet *{animation:none!important;transition:none!important}
