.portrait-views,.portrait-motions{display:flex;justify-content:center;gap:8px;margin:0 0 14px;flex-wrap:wrap}
.portrait-views button,.portrait-motions button{min-height:40px;padding:7px 13px;border:1px solid #8a9475;background:#faf7ed;color:#354f47;border-radius:2px;font:inherit;font-size:13px;cursor:pointer}
.portrait-views button[aria-pressed=true],.portrait-motions button[aria-pressed=true]{background:#466556;border-color:#354f47;color:#faf7ed}
.character-dialog button:focus-visible{outline:3px solid #ad7149;outline-offset:3px}
@media(min-width:900px) and (min-height:601px){
 .character-dialog[open]{width:900px;max-width:94vw;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:0 26px;padding:25px}
 .portrait-heading{grid-column:1/-1;margin-bottom:8px}
 .character-dialog .portrait-canvas,.character-dialog:has(.portrait-wardrobe:not([hidden])) .portrait-canvas{grid-column:1;grid-row:2/8;height:min(510px,58dvh);min-height:330px;align-self:center}
 .portrait-caption{grid-column:1;grid-row:8;align-self:start;margin:10px 0}
 .portrait-turns,.portrait-views,.portrait-motions,.portrait-wardrobe,.portrait-people{grid-column:2;align-self:start}
 .portrait-turns{grid-row:2;margin-top:12px}.portrait-views{grid-row:3}.portrait-motions{grid-row:4}.portrait-wardrobe{grid-row:5}.portrait-people{grid-row:6/9}
 .portrait-people{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.portrait-people button{width:100%}
 .portrait-note{grid-column:1/-1;margin-top:12px}
}
@media(max-width:899px){.portrait-turns{margin-bottom:14px}.portrait-views,.portrait-motions{gap:7px}.portrait-motions button{flex:1;padding:7px 5px}}
@media(min-width:681px) and (max-height:520px){.portrait-views,.portrait-motions,.portrait-wardrobe{grid-column:2}.portrait-people{grid-row:auto}.portrait-canvas{position:sticky;top:0}}