.band-section{scroll-margin-top:100px}
.band-intro{max-width:740px}
.band-intro h2{margin-bottom:16px}
.band-hint{color:#d5b775;font-style:italic}
.band-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 22px;margin-top:42px;padding:20px 0}
.band-member{appearance:none;display:flex;flex-direction:column;align-items:center;position:relative;min-width:0;width:100%;padding:16px 10px 22px;border:0;border-bottom:1px solid #8a673b;background:radial-gradient(ellipse at 50% 65%,#54332255,transparent 70%);color:#f1e5ce;font:inherit;cursor:pointer;text-align:center;isolation:isolate}
.band-member--wide{grid-column:span 2}
.band-portrait{display:flex;align-items:flex-end;justify-content:center;width:100%;height:310px;margin-bottom:24px}
.band-portrait img{display:block;width:100%;height:100%;object-fit:contain;transform-origin:center bottom;transition:transform .25s ease,filter .25s ease;filter:drop-shadow(0 12px 12px #0008)}
.band-member:focus-visible{outline:2px solid #edc46d;outline-offset:7px}
.band-member:focus-visible img{transform:scale(1.08);filter:drop-shadow(0 0 14px #c99d4d55)}
@media(hover:hover){.band-member:hover img{transform:scale(1.08);filter:drop-shadow(0 0 14px #c99d4d55)}.band-member:hover{z-index:2}}
.band-name{font-family:var(--display,Georgia,serif);font-size:1.25rem;line-height:1.3;color:#e5c377}
.band-role{font-size:.85rem;color:#ded0bf;margin:8px 0 12px}
.band-read{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:#cba967}
.band-missing{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;height:100%;width:100%;color:#d3ae69;background:radial-gradient(ellipse,#54332266,transparent 70%)}
.band-missing b{font:5rem Georgia,serif}.band-missing small{font-size:.85rem;font-style:italic}
.band-dialog{box-sizing:border-box;width:min(1040px,calc(100% - 32px));max-height:90vh;max-height:90dvh;padding:0;border:1px solid #c99d4d;background:#f0e7d2;color:#2e211b;box-shadow:0 30px 100px #000b;overscroll-behavior:contain}
.band-dialog::backdrop{background:#070609df;backdrop-filter:blur(5px)}
.band-dialog-close{position:sticky;top:0;z-index:3;display:block;margin:0 0 0 auto;padding:12px 20px;background:#26171c;color:#f2d38c;border:0;font:inherit;cursor:pointer;min-height:44px}
.band-dialog-close:focus-visible{outline:3px solid #916124;outline-offset:-4px}
.band-story-layout{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,2fr);gap:32px;padding:16px 40px 40px;align-items:start}
.band-story-portrait{width:100%;max-height:440px;object-fit:contain;position:sticky;top:60px}
.band-story-copy h2{font-family:var(--display,Georgia,serif);color:#5d2227;font-size:clamp(1.7rem,3vw,2.6rem);line-height:1.1;margin:12px 0 24px}
.band-story-copy p{font-family:Georgia,serif;font-size:1.05rem;line-height:1.75;margin:0 0 20px}
.band-story-copy .band-story-role{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:#684722}
.band-story-layout--text{grid-template-columns:1fr;max-width:780px;margin:auto}
html.band-story-open{overflow:hidden}
.kinship-section .band-hint{margin-top:8px}
.kinship-grid{margin-top:24px}
.kinship-member .band-portrait{height:340px}
.kinship-employee{min-height:1.2em;margin-top:11px;color:#f1cf78;font-family:var(--display,Georgia,serif);font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:0;transform:translateY(5px);transition:opacity .2s ease,transform .2s ease;text-shadow:0 0 12px #d7a94d99}
.kinship-member:focus-visible .kinship-employee{opacity:1;transform:translateY(0)}
@media(hover:hover){.kinship-member:hover .kinship-employee{opacity:1;transform:translateY(0)}}
@media(max-width:800px){.band-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.band-portrait{height:280px}.band-story-layout{grid-template-columns:1fr;padding:12px 24px 28px}.band-story-portrait{position:static;height:240px}.band-dialog{max-height:94dvh}}
@media(max-width:800px){.kinship-member .band-portrait{height:300px}}
@media(max-width:440px){.band-grid{gap:24px 12px}.band-portrait{height:215px}.kinship-member .band-portrait{height:235px}.band-name{font-size:1.05rem}.band-role{font-size:.75rem}.band-member--wide .band-portrait{height:270px}.kinship-employee{font-size:.66rem;letter-spacing:.06em}}
@media(prefers-reduced-motion:reduce){.band-portrait img{transition:none}}
