.avatar-portrait{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 62px;width:62px;height:76px;overflow:hidden;background:linear-gradient(145deg,#17283b,#121a2b);border:1px solid #789eff24;border-radius:12px;vertical-align:middle}.avatar-portrait::after{content:'';position:absolute;bottom:4px;width:32px;height:4px;border-radius:50%;background:#0005}.avatar-portrait canvas{width:64px;height:80px;max-width:none;image-rendering:pixelated;z-index:1;flex-shrink:0}.avatar-profile{width:108px;height:126px;flex-basis:108px;border-color:#a3beff45;background:linear-gradient(145deg,#263652,#1a2039);border-radius:18px}.avatar-profile canvas{width:96px;height:120px}.avatar-self{width:68px;height:84px;flex-basis:68px}.avatar-small{width:42px;height:52px;flex-basis:42px;border-radius:8px}.avatar-small canvas{width:44px;height:55px}.character-profile{grid-column:1/-1;display:flex;align-items:center;gap:25px;padding:25px 30px;background:radial-gradient(ellipse at 10% 0%,#637bea22,transparent 60%),linear-gradient(135deg,#111c32,#111725)!important;border-color:#819df537;position:relative}.character-profile-copy{flex:1;min-width:0}.character-profile-copy h2{font-size:25px;letter-spacing:-.7px;margin:9px 0}.character-profile-copy .muted{font-size:13px;line-height:1.8}.character-profile-controls{display:flex;flex-direction:column;gap:12px;align-items:center}.character-profile-controls>span{font-size:10px;color:#899aba}.character-select-button{white-space:nowrap}.nickname-avatar-row{display:flex;align-items:center;gap:13px}.nickname-avatar-row input{min-width:0;flex:1}.nickname-avatar-row .avatar-portrait{width:54px;height:64px;flex-basis:54px}.nickname-avatar-row canvas{width:52px;height:65px}.my-character-strip{display:flex;align-items:center;gap:17px;margin:22px 0;padding:14px 18px;border:1px solid #7c8cff30;border-radius:16px;background:linear-gradient(120deg,#19263c,#0d1628)}.my-character-copy{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}.my-character-copy strong{font-size:20px;overflow-wrap:anywhere}.my-character-copy .section-kicker{font-size:9px;letter-spacing:2px}.my-character-copy .muted{font-size:12px}.character-fixed-tag{font-size:9px;letter-spacing:1.5px;color:#8295bc}.player-avatar-identity{display:flex;align-items:center;gap:14px;min-width:0;flex:1}.player-name-copy{min-width:0;display:flex;flex-direction:column;gap:6px}.player-name-copy strong{overflow-wrap:anywhere}.player-item-dead .avatar-portrait,.final-player-card-dead .avatar-portrait{filter:grayscale(.8);opacity:.6}.vote-option .avatar-portrait{width:46px;height:56px;flex-basis:46px;border-radius:8px}.vote-option .avatar-portrait canvas{width:48px;height:60px}.vote-option>span:last-child{min-width:0;overflow-wrap:anywhere}.final-player-card>.avatar-portrait{margin-bottom:10px;width:80px;height:96px}.final-player-card>.avatar-portrait canvas{width:80px;height:100px}.character-dialog{padding:0;border:1px solid #839bd74d;border-radius:24px;background:#101a2c;color:#f3f6ff;max-width:800px;width:calc(100% - 32px);max-height:90dvh;box-shadow:0 24px 100px #000a;overflow:auto}.character-dialog::backdrop{background:#020615c9;backdrop-filter:blur(7px)}.character-dialog-sheet{padding:28px}.character-dialog-header{display:flex;gap:20px;justify-content:space-between;align-items:flex-start}.character-dialog-header h2{font-size:23px;letter-spacing:-.6px;margin:10px 0}.character-dialog-header .muted{font-size:12px;line-height:1.8}.character-dialog-close{display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;border:1px solid #93a7cf35;background:#1a2942;color:#c3cce2;font-size:25px;border-radius:10px;cursor:pointer}.character-choice-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:24px}.character-choice{position:relative;display:flex;align-items:center;flex-direction:column;gap:7px;padding:13px 8px 15px;border:1px solid #91a5d332;border-radius:14px;background:#152138;color:#e3eaff;cursor:pointer;min-width:0}.character-choice:hover{background:#1c2c47;border-color:#91a5d388}.character-choice[aria-pressed=true]{border-color:#98a9ff;box-shadow:0 0 0 2px #869bff3b;background:#233355}.character-choice-label{font-size:8px;letter-spacing:1.8px;color:#92a6d1}.character-choice strong{font-size:12px;white-space:normal;word-break:keep-all}.avatar-choice{border:0;background:radial-gradient(ellipse,#7995ac22,transparent 70%);border-radius:0;width:96px;height:114px}.avatar-choice canvas{width:96px;height:120px}.character-choice-check{display:none;position:absolute;top:8px;right:8px;background:#8a9ffe;color:#0e1732;border-radius:50%;width:17px;height:17px;font-size:11px;line-height:17px}.character-choice[aria-pressed=true] .character-choice-check{display:block}.character-dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:17px;border-top:1px solid #839bd733}.character-choice-summary{display:flex;align-items:center;gap:12px;font-size:13px}.character-picker-status{min-height:20px;font-size:12px;color:#ffcba0;margin:10px 0}.character-dialog button:focus-visible{outline:3px solid #f2c871;outline-offset:3px}
@media(max-width:700px){.character-profile{flex-wrap:wrap;gap:15px;padding:20px}.avatar-profile{width:82px;height:102px;flex-basis:82px}.avatar-profile canvas{width:80px;height:100px}.character-profile-copy h2{font-size:20px}.character-profile-copy .muted{font-size:11px}.character-profile-controls{width:100%;align-items:stretch;text-align:center}.character-profile-controls .button{width:100%}.my-character-strip{padding:12px;gap:10px;flex-wrap:wrap}.my-character-copy strong{font-size:17px}.my-character-copy .muted{font-size:10px}.my-character-strip .button{padding:10px 12px;font-size:12px}.character-fixed-tag{display:none}.character-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.character-dialog-sheet{padding:20px}.character-dialog-header h2{font-size:20px}.character-dialog-header .muted{font-size:11px}.character-dialog-footer{position:sticky;bottom:-20px;background:#101a2c;padding:14px 0 18px;gap:10px}.character-dialog-footer .button{font-size:12px;padding:12px}.character-choice-summary{font-size:11px;gap:7px}.player-avatar-identity{gap:10px}.character-dialog{max-height:92dvh}.player-name-copy .muted{font-size:11px}}

.avatar-result-row{display:flex;align-items:center;gap:12px}.avatar-result-row .avatar-portrait{flex-shrink:0}
.character-choice .avatar-choice{flex:0 0 auto;width:80px;height:94px}.character-choice .avatar-choice canvas{width:72px;height:90px}
.character-dialog-footer{z-index:2}.character-choice-summary{min-width:0}.character-choice-summary strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.character-dialog-footer .button{flex-shrink:0;width:auto}
@media(max-width:420px){.character-choice-summary .avatar-portrait{display:none}}

/* Integrated editor keeps its actions visible while only the wardrobe scrolls. */
.character-editor-dialog{max-width:1040px;max-height:94dvh;overflow:hidden;background:#0d1525}
.character-editor-dialog[open]{display:flex;flex-direction:column}
.character-editor-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;border-bottom:1px solid #293751;flex-shrink:0}
.character-editor-header h2{margin:0;font-size:22px;letter-spacing:-.5px}
.character-editor-scroll{overflow:auto;min-height:0;overscroll-behavior:contain}
.character-editor-body{border:0;margin:0;padding:24px;min-width:0}
.character-editor-dialog .character-editor{grid-template-columns:280px minmax(0,1fr);gap:20px}
.character-editor-dialog .character-editor .stage{height:300px}
.character-editor-dialog .character-editor [data-avatar]{width:224px;height:280px}
.character-editor-dialog .character-editor .preview-panel{top:0}
.character-editor-actions{flex-shrink:0;border-top:1px solid #293751;padding:14px 24px 20px;background:#101a2c}
.character-editor-actions .character-picker-status:empty{display:none}
.character-editor-actions .character-picker-status{margin:0 0 12px;min-height:0}
.character-editor-buttons{display:flex;justify-content:space-between;gap:14px}
.character-editor-buttons .button{width:auto;font-size:13px;padding:13px 20px}
@media(max-width:700px){
 .character-editor-dialog{width:calc(100% - 16px);max-height:96dvh;border-radius:18px}
 .character-editor-header{padding:14px 16px}.character-editor-header h2{font-size:19px}
 .character-editor-body{padding:12px}
 .character-editor-dialog .character-editor{grid-template-columns:1fr;gap:12px}
 .character-editor-dialog .character-editor .preview-panel{position:static}
 .character-editor-dialog .character-editor .stage{height:160px}
 .character-editor-dialog .character-editor [data-avatar]{width:120px;height:150px}
 .character-editor-actions{padding:12px 14px max(12px,env(safe-area-inset-bottom))}
 .character-editor-buttons{gap:8px}.character-editor-buttons .button{font-size:11px;padding:12px 9px}
}