/* Protagonistas: galeria e crônicas */
.protagonist-intro-actions { justify-content:center; }
.protagonist-groups { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin:0 auto 26px; }
.protagonist-groups a { display:flex; align-items:center; gap:10px; padding:11px 16px; border:1px solid var(--line); border-radius:4px; font:13px var(--sans); }
.protagonist-groups a:hover, .protagonist-groups a[aria-current] { border-color:var(--gold); color:var(--gold); background:color-mix(in srgb,var(--gold) 7%,transparent); }
.protagonist-groups a span { color:var(--muted); font-size:10px; }
.protagonist-group-management { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:25px 0; }
.protagonist-group-management .appearance-section { margin:0; min-width:0; }
.protagonist-group-management h2 { overflow-wrap:anywhere; }
.protagonist-assignment { display:flex; justify-content:space-between; gap:24px; align-items:center; }
.protagonist-assignment h3 { font:25px var(--serif); margin:0 0 12px; overflow-wrap:anywhere; }
.protagonist-assignment form { min-width:220px; }
.protagonist-assignment label { display:block; margin-bottom:8px; font-size:12px; }
.protagonist-assignment select { width:100%; padding:10px; }
.protagonist-group-form textarea { width:100%; padding:12px; }
.protagonist-group-form input[type="checkbox"] { width:auto; }
@media(max-width:1100px) { .protagonist-group-management { grid-template-columns:minmax(0,1fr); } }
@media(max-width:650px) { .protagonist-groups { justify-content:flex-start; } .protagonist-groups a { flex:1 1 auto; justify-content:center; font-size:12px; } .protagonist-assignment { align-items:stretch; flex-direction:column; } .protagonist-assignment form { min-width:0; } }
.category-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.category-card-protagonists { grid-column:span 2; display:flex; flex-direction:column; justify-content:center; padding-inline-start:78px; min-height:130px; }
.category-card-protagonists .category-icon { position:absolute; inset-inline-start:24px; top:42px; width:34px; height:34px; }
.category-card-protagonists .category-name { font-size:24px; }
.category-card-protagonists::after { content:'✧'; position:absolute; inset-inline-end:30px; top:28px; font:64px/1 var(--serif); color:color-mix(in srgb,var(--gold) 12%,transparent); }
.protagonists-intro { position:relative; text-align:center; padding:32px 20px 30px; }
.protagonists-intro::before { content:''; position:absolute; pointer-events:none; inset:0; background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--gold) 9%,transparent),transparent 65%); }
.protagonists-seal { position:relative; display:grid; place-items:center; margin:0 auto 23px; width:70px; height:70px; color:var(--gold); border:1px solid color-mix(in srgb,var(--gold) 40%,transparent); border-radius:50%; box-shadow:0 0 0 7px color-mix(in srgb,var(--gold) 4%,transparent); }
.protagonists-seal .category-icon { width:32px; height:32px; }
.protagonists-intro h1 { position:relative; font:clamp(44px,5.5vw,78px)/1.1 var(--serif); margin:16px 0; letter-spacing:-1px; }
.protagonists-intro > p:not(.eyebrow) { position:relative; color:var(--muted); font:19px/1.8 var(--serif); }
.protagonists-divider { display:flex; align-items:center; justify-content:center; gap:18px; color:var(--gold); margin:25px auto; }
.protagonists-divider span { height:1px; width:90px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.protagonists-search { max-width:680px; margin:0 auto 32px; }
.protagonist-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
.protagonist-card { position:relative; min-width:0; display:flex; flex-direction:column; background:var(--panel); color:var(--panel-text); border:1px solid color-mix(in srgb,var(--gold) 30%,transparent); border-radius:5px; overflow:hidden; transition:transform .2s,border-color .2s,box-shadow .2s; }
.protagonist-card:hover, .protagonist-card:focus-visible { transform:translateY(-4px); border-color:var(--gold); box-shadow:0 16px 40px #00000022; }
.protagonist-card-art { position:relative; aspect-ratio:4/4.6; overflow:hidden; }
.protagonist-card .entry-art { height:100%; border:0; }
.protagonist-card .entry-art img { object-position:center 20%; }
.protagonist-card-art::after { content:''; position:absolute; inset:12px; border:1px solid #ffffff30; pointer-events:none; }
.protagonist-card-number { position:absolute; top:22px; inset-inline-start:24px; color:#fff; font:15px var(--serif); text-shadow:0 1px 8px #000; }
.protagonist-card-mark { position:absolute; bottom:0; left:50%; transform:translate(-50%,50%); z-index:1; display:grid; place-items:center; width:34px; height:34px; border:1px solid color-mix(in srgb,var(--gold) 45%,transparent); background:var(--panel); color:var(--panel-gold); rotate:45deg; }
.protagonist-card-copy { padding:30px 23px 22px; flex:1; display:flex; flex-direction:column; }
.protagonist-card-copy > .eyebrow { color:var(--panel-gold); font-size:8px; }
.protagonist-card h2 { font:clamp(25px,2.4vw,35px)/1.2 var(--serif); margin:10px 0; overflow-wrap:anywhere; }
.protagonist-card-subtitle { color:var(--panel-gold-light); font:italic 15px/1.6 var(--serif); margin:0 0 12px; overflow-wrap:anywhere; }
.protagonist-card-summary { color:var(--panel-muted); font:13px/1.8 var(--sans); margin:0 0 23px; overflow-wrap:anywhere; }
.protagonist-card-link { display:flex; justify-content:space-between; gap:12px; margin-top:auto; border-top:1px solid var(--panel-line); padding-top:16px; color:var(--panel-gold); font:10px/1.5 var(--sans); letter-spacing:.5px; }
.protagonist-record-card { border-color:color-mix(in srgb,var(--gold) 60%,transparent); }
.protagonist-hero { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(220px,320px) minmax(0,1fr); gap:42px; align-items:center; overflow:hidden; padding:38px; border:1px solid color-mix(in srgb,var(--gold) 35%,transparent); border-radius:5px; background:var(--panel); color:var(--panel-text); }
.protagonist-hero::after { content:''; position:absolute; inset:12px; pointer-events:none; z-index:-1; border:1px solid color-mix(in srgb,var(--gold) 13%,transparent); }
.protagonist-ambient { position:absolute; z-index:-2; inset:0; width:100%; height:100%; object-fit:cover; opacity:.065; filter:blur(10px); }
.protagonist-portrait { position:relative; padding:9px; border:1px solid color-mix(in srgb,var(--gold) 45%,transparent); background:color-mix(in srgb,var(--gold) 4%,transparent); }
.protagonist-portrait .entry-art { height:auto; aspect-ratio:3/4; border:0; }
.protagonist-portrait img { object-position:center 20%; }
.protagonist-portrait-corner { position:absolute; bottom:-12px; left:50%; transform:translateX(-50%); background:var(--panel); color:var(--panel-gold); padding:0 12px; font-size:22px; }
.protagonist-identity { min-width:0; padding:20px 0; }
.protagonist-identity > .eyebrow { color:var(--panel-gold); }
.protagonist-identity h1 { font:clamp(38px,4.5vw,66px)/1.1 var(--serif); margin:17px 0; overflow-wrap:anywhere; }
.protagonist-alias { color:var(--panel-gold-light); font:italic 22px/1.5 var(--serif); overflow-wrap:anywhere; }
.protagonist-title-rule { width:75px; height:1px; background:var(--panel-gold); margin:24px 0; }
.protagonist-identity .detail-summary { color:var(--panel-muted); font-size:16px; margin:0 0 25px; white-space:pre-wrap; }
.protagonist-bond-chip { display:inline-block; margin:12px 0 0 10px; color:var(--panel-gold); font:11px/1.5 var(--sans); }
.protagonist-emblem { position:relative; grid-column:2; justify-self:end; max-width:160px; margin:-20px 0 0; }
.protagonist-emblem > div { padding:7px; border:1px solid color-mix(in srgb,var(--gold) 30%,transparent); border-radius:4px; background:color-mix(in srgb,var(--gold) 4%,transparent); }
.protagonist-emblem img { display:block; width:140px; height:130px; object-fit:contain; }
.protagonist-emblem figcaption { font:italic 12px/1.6 var(--serif); color:var(--panel-muted); text-align:center; margin-top:8px; overflow-wrap:anywhere; }
.protagonist-fragments { margin:38px 0 0; }
.protagonist-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 24px; margin:18px 0 0; }
.protagonist-facts > div { border-top:1px solid var(--line); padding:18px 0; min-width:0; }
.protagonist-facts dt { color:var(--gold); font:9px/1.6 var(--sans); text-transform:uppercase; letter-spacing:1.5px; }
.protagonist-facts dd { margin:8px 0 0; font:18px/1.7 var(--serif); overflow-wrap:anywhere; }
.protagonist-story { border-top:1px solid var(--line); margin-top:30px; padding-top:30px; }
.protagonist-story .prose { max-width:760px; margin:0 auto; }
/* Trilha universal de vínculo */
.bond-section { margin:42px 0 0; padding:30px; border:1px solid color-mix(in srgb,var(--gold) 25%,transparent); border-radius:4px; background:var(--panel); color:var(--panel-text); }
.bond-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.bond-heading .eyebrow { color:var(--panel-gold); }
.bond-heading h2 { font:32px/1.25 var(--serif); margin:9px 0; overflow-wrap:anywhere; }
.bond-current-title { color:var(--panel-muted); font:italic 17px/1.6 var(--serif); margin:0; }
.bond-level { flex:0 0 100px; text-align:center; }
.bond-level strong { color:var(--panel-gold); font:60px/1 var(--serif); }
.bond-level > span { display:block; color:var(--panel-muted); font:8px/1.8 var(--sans); letter-spacing:1px; margin-top:8px; }
.bond-progress { height:3px; margin:28px 0; background:var(--panel-line); }
.bond-progress > span { display:block; height:100%; background:var(--panel-gold); }
.bond-stages { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.bond-stage { display:flex; align-items:flex-start; gap:13px; padding:14px; border:1px solid var(--panel-line); border-radius:4px; min-width:0; }
.bond-stage-number { display:grid; place-items:center; flex:0 0 28px; width:28px; height:28px; border:1px solid var(--panel-line); border-radius:50%; font:13px var(--serif); color:var(--panel-muted); }
.bond-stage > div { min-width:0; }
.bond-stage h3 { font:16px/1.5 var(--serif); margin:2px 0 0; overflow-wrap:anywhere; }
.bond-stage p { color:var(--panel-muted); font:12px/1.8 var(--sans); white-space:pre-wrap; margin:10px 0 0; overflow-wrap:anywhere; }
.bond-stage.is-reached .bond-stage-number { border-color:var(--panel-gold); color:var(--panel-gold); }
.bond-stage.is-current { border-color:var(--panel-gold); background:color-mix(in srgb,var(--panel-gold) 5%,transparent); }
.bond-stage.is-unknown h3 { color:var(--panel-muted); font-style:italic; }
.bond-stage-current { display:block; color:var(--panel-gold); font:8px/1.5 var(--sans); letter-spacing:1px; }
.bond-editor { max-width:1100px; }
.bond-editor label { display:block; margin:18px 0 8px; }
.bond-editor input:not([type="checkbox"]), .bond-editor select, .bond-editor textarea { width:100%; padding:11px; }
.bond-editor input[type="checkbox"] { width:auto; }
.bond-editor-stages { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.bond-editor-stages fieldset { min-width:0; border:1px solid var(--line); padding:20px; }
.bond-editor-stages legend { color:var(--gold); padding:0 8px; font:19px var(--serif); }
.bond-editor .errorlist { color:var(--gold-light); font:13px/1.8 var(--sans); }
@media(min-width:1650px) { .protagonist-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; } .protagonist-card-art { aspect-ratio:4/4; } }
@media(max-width:1200px) { .protagonist-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); } .protagonist-hero { grid-template-columns:240px minmax(0,1fr); padding:28px; gap:28px; } .bond-stages { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:1000px) { .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .protagonist-hero { grid-template-columns:190px minmax(0,1fr); gap:24px; padding:26px; } .protagonist-identity h1 { font-size:40px; } }
@media(max-width:650px) { .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .category-card-protagonists { grid-column:span 2; } .protagonists-intro { padding:25px 0 20px; } .protagonists-intro > p:not(.eyebrow) { font-size:17px; } .protagonist-gallery { grid-template-columns:minmax(0,1fr); max-width:460px; margin:auto; } .protagonist-card-art { aspect-ratio:4/4; } .protagonist-card h2 { font-size:32px; } .protagonist-hero { grid-template-columns:minmax(0,1fr); padding:25px; gap:18px; } .protagonist-portrait { width:min(100%,260px); justify-self:center; } .protagonist-identity { text-align:center; padding:12px 0; } .protagonist-identity h1 { font-size:42px; } .protagonist-title-rule { margin:22px auto; } .protagonist-emblem { grid-column:1; justify-self:end; margin:0; } .protagonist-facts { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; } .protagonist-facts dd { font-size:16px; } .bond-section { padding:22px 17px; } .bond-heading h2 { font-size:26px; } .bond-level { flex-basis:70px; } .bond-level strong { font-size:48px; } .bond-stages { grid-template-columns:minmax(0,1fr); gap:12px; } .bond-editor-stages { grid-template-columns:minmax(0,1fr); } }
@media(prefers-reduced-motion:reduce) { .protagonist-card { transition:none; } .protagonist-card:hover { transform:none; } }

.protagonist-emblem .record-extra-image { width:160px; max-width:100%; margin:0; }
.protagonist-emblem .extra-image-frame { padding:7px; }
.protagonist-emblem .extra-image-frame img { width:100%; height:130px; object-fit:contain; }
@media(min-width:1250px) { .protagonist-hero.has-emblem { grid-template-columns:minmax(200px,280px) minmax(0,1fr) 150px; gap:28px; } .protagonist-hero.has-emblem .protagonist-emblem { grid-column:3; grid-row:1; align-self:start; margin:0; } }