/* Host adapter: Claude's gallery, canonical two-role selection and native dialogs. */
.hero-gallery-dialog { width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;color:#f4f6fb;background:#08152e;overflow:hidden; }
.hero-gallery-dialog::backdrop,.hero-history::backdrop { background:#030918c9;backdrop-filter:blur(8px); }
.hero-gallery-dialog .ph-root { position:absolute; }
.hero-gallery-dialog .ph-title { font-size:.78rem;line-height:1.5;font-weight:600;letter-spacing:.22em; }
.hero-gallery-dialog .ph-slogan { font:700 1.15rem/1.25 system-ui; }
.ph-team-bar { position:sticky;top:0;z-index:5;max-width:1360px;margin:0 auto 18px;padding:12px 16px;border:1px solid #36517d;border-radius:18px;background:#0b1c3ff5;box-shadow:0 8px 25px #0005; }
.ph-team-intro { display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 14px;margin-bottom:10px; }
.ph-team-intro strong { color:#ffd24b;font-size:1.1rem; }
.ph-team-intro span { color:#b6c3dd;font-size:.8rem; }
.ph-team-slots { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.ph-team-slots button { display:grid;gap:3px;text-align:left;border:1px solid #36517d;border-radius:10px;padding:8px 12px;background:#08152e; }
.ph-team-slots button[aria-pressed=true] { border-color:#ffd24b;box-shadow:inset 0 0 0 1px #ffd24b; }
.ph-team-slots small { font-size:.65rem;letter-spacing:.1em;color:#b6c3dd; }
.ph-team-actions { display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px; }
.ph-team-actions button { border:1px solid #49648e;background:#12284b;border-radius:9px;padding:8px 12px;font-size:.8rem;min-height:40px; }
.ph-team-actions .ph-team-save { color:#09142b;background:#ffd24b;border-color:#ffd24b;font-weight:800; }
.ph-team-actions .hero-notice { flex:1;min-width:180px;margin:0;color:#b6c3dd;font-size:.78rem; }
.ph-root button:disabled { cursor:default;opacity:.55; }
.ph-d blockquote small { display:block;color:var(--hc);font-style:normal;letter-spacing:.08em;font-size:.65rem;text-transform:uppercase;margin-bottom:4px; }
.ph-canonical { padding:12px 14px;border:1px solid var(--ph-line);border-radius:14px;background:#050c1e73;font-size:.82rem; }
.ph-canonical summary { cursor:pointer;font-weight:750;line-height:1.5; }
.ph-canonical article { padding:12px 0;border-top:1px solid var(--ph-line);margin-top:10px; }
.ph-canonical h4 { margin:4px 0;font-size:1rem; }
.ph-canonical small { color:var(--hc); }
.ph-canonical p { color:var(--ph-soft);line-height:1.5; }
.ph-canonical strong { font-size:.75rem;color:var(--hc); }
.ph-attribute { display:grid;grid-template-columns:1fr auto;gap:4px;margin:12px 0; }
.ph-attribute meter { grid-column:1/-1;width:100%;height:10px;accent-color:var(--hc); }
.ph-source { margin:0;font-size:.75rem; }.ph-source a { color:#a4caff; }
.hero-history { width:min(620px,calc(100vw - 32px));max-height:80dvh;border:1px solid #49648e;border-radius:20px;padding:24px;color:#f4f6fb;background:#0b1c3f;font:15px/1.6 system-ui; }
.hero-history header { display:flex;align-items:flex-start;gap:16px; }.hero-history h2 { font-size:1.2rem;margin:0;flex:1; }
.hero-history button { background:#152e58;border:1px solid #49648e;color:white;border-radius:10px;min-width:44px;min-height:44px;font-size:1.5rem;cursor:pointer; }
.hero-history li { margin:8px 0; }.hero-history p { color:#b6c3dd; }
@media(min-width:900px) { .hero-gallery-dialog .ph-root { display:flex;flex-direction:column;overflow:clip; }.hero-gallery-dialog .ph-top,.hero-gallery-dialog .ph-team-bar { width:100%;flex:none; }.hero-gallery-dialog .ph-team-bar { position:static;margin-bottom:10px; }.hero-gallery-dialog .ph-main { flex:1;min-height:0;width:100%;overflow:clip;align-items:stretch; }.hero-gallery-dialog .ph-roster { overflow-y:auto;padding:6px;scrollbar-width:thin; }.hero-gallery-dialog .ph-detail { position:static;max-height:none; }.hero-gallery-dialog .ph-foot { display:none; } }
@media(min-width:1181px) { .hero-gallery-dialog .ph-main { grid-template-columns:minmax(0,1fr) 420px;gap:22px; }.hero-gallery-dialog .ph-grid { grid-template-columns:repeat(3,minmax(0,1fr));gap:16px; }.hero-gallery-dialog .ph-card__art { height:220px; } }
@media(max-width:899px) { .ph-team-bar { padding:10px;margin-bottom:14px; }.ph-team-intro span { font-size:.72rem; }.ph-team-actions .hero-notice { flex-basis:100%;min-width:0; }.ph-team-slots strong { font-size:.86rem; }.ph-team-actions button { flex:1;padding:8px;font-size:.74rem; }.hero-gallery-dialog .ph-title { display:none; }.hero-gallery-dialog .ph-slogan { display:none; }.hero-gallery-dialog .ph-top { padding-top:12px; } }

/* Hero spotlight: close-up selected hero with persistent references */
@media(min-width:900px){
 .hero-gallery-dialog .ph-main{grid-template-columns:minmax(172px,220px) minmax(0,1fr);gap:18px}
 .hero-gallery-dialog .ph-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .hero-gallery-dialog .ph-roster{padding:5px;min-width:0}
 .hero-gallery-dialog .ph-hint{font-size:.74rem}
 .hero-gallery-dialog .ph-card{border-radius:12px}
 .hero-gallery-dialog .ph-card__art{height:95px}
 .hero-gallery-dialog .ph-card__ico{width:24px;height:24px;top:5px;left:5px}
 .hero-gallery-dialog .ph-card__ico svg{width:14px;height:14px}
 .hero-gallery-dialog .ph-card__lv{font-size:.62rem;top:6px;right:5px;padding:2px 4px}
 .hero-gallery-dialog .ph-card__info{padding:3px 6px 7px;gap:3px;margin:0}
 .hero-gallery-dialog .ph-card__row{gap:3px}
 .hero-gallery-dialog .ph-card__ring,.hero-gallery-dialog .ph-card__desc,.hero-gallery-dialog .ph-card__spec{display:none}
 .hero-gallery-dialog .ph-card__name{font-size:.73rem;line-height:1.2}
 .hero-gallery-dialog .ph-card__role{font-size:.58rem;letter-spacing:0}
 .hero-gallery-dialog .ph-card__mine{font-size:.57rem;left:4px;bottom:4px;padding:2px 4px}
 .hero-gallery-dialog .ph-detail{width:100%}
 .hero-gallery-dialog .ph-d__hero{grid-template-columns:minmax(0,1.18fr) minmax(175px,.82fr);min-height:410px}
 .hero-gallery-dialog .ph-d__fig{min-height:390px}
 .hero-gallery-dialog .ph-d__fig img{object-fit:cover;object-position:center 9%;transform:translateY(var(--cy,0)) scale(calc(var(--z,1)*1.38))}
 .hero-gallery-dialog .ph-d__txt{justify-content:end;padding:0 10px 14px}
 .hero-gallery-dialog .ph-d__txt h2{font-size:clamp(1.6rem,2.5vw,2.3rem)}
 .hero-gallery-dialog .ph-mobile-thumbs{display:none}
}
@media(min-width:1100px){
 .hero-gallery-dialog .ph-main{grid-template-columns:220px minmax(0,1fr)}
}
@media(max-width:899px){
 .hero-gallery-dialog .ph-mobile-thumbs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;padding:5px 0;position:sticky;top:0;z-index:4;background:#0d2250}
 .hero-gallery-dialog .ph-switch-thumb{border:2px solid #486184;background:#102449;border-radius:9px;min-width:0;height:66px;padding:3px;display:grid;place-items:center}
 .hero-gallery-dialog .ph-switch-thumb img{max-height:56px;max-width:100%;object-fit:contain}
 .hero-gallery-dialog .ph-switch-thumb.is-current{border-color:var(--hc);box-shadow:0 0 11px color-mix(in srgb,var(--hc) 55%,transparent)}
 .hero-gallery-dialog .ph-d__hero{grid-template-columns:minmax(0,1fr);gap:10px}
 .hero-gallery-dialog .ph-d__fig{min-height:clamp(270px,48dvh,455px)}
 .hero-gallery-dialog .ph-d__fig img{object-position:50% 8%;transform:translateY(var(--cy,0)) scale(calc(var(--z,1)*1.36))}
}

/* QA refinement for the neon host: keep three rows inside ordinary laptop heights. */
@media(min-width:900px){
 .hero-gallery-dialog .ph-root.neon-gallery .ph-card{--card-height:clamp(125px,calc((100dvh - 365px)/3),198px)}
 .hero-gallery-dialog .ph-root.neon-gallery .ph-d__fig img{width:120%}
}
@media(max-width:899px){
 .hero-gallery-dialog .ph-root.neon-gallery .ph-d__fig img{width:110%}
}