/* Framing only changes the image inside established profile/combat frames. */
/* Reserve the frame from the first HTML paint; reveal only the prepared crop. */
img[data-avatar-pending]:not([data-avatar-ready]),img[data-avatar-pending]:not([data-avatar-ready])~soul-halo-anchor{visibility:hidden!important}
img[data-avatar-mode]{position:absolute!important;inset:auto!important;left:var(--avatar-left,0px)!important;top:var(--avatar-top,0px)!important;width:var(--avatar-width,100%)!important;height:var(--avatar-height,100%)!important;max-width:none!important;max-height:none!important;transform:none!important}
avatar-frame{display:none!important}
@media(min-width:1101px){.arena.large-battle .fighter:not(.is-me) .portrait-button{--avatar-view:team}}
.avatar-image-editor .ae-content{padding:14px 12px 10px;color:var(--theme-ink,#173f4d)}
.ae-upload-heading h2{font-size:1.35rem;letter-spacing:-.4px;margin:7px 0 8px}.ae-upload-heading .eyebrow{font-size:.6rem;letter-spacing:.16em;color:var(--theme-accent,#0a939c)}
.ae-upload-heading p{font-size:.81rem;line-height:1.6;color:var(--theme-muted,#537583);margin:0}
.ae-upload-bar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:20px 0 28px;padding-bottom:22px;border-bottom:1px solid var(--theme-line,#bedddd)}
.ae-file-button{position:relative;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;padding:11px 17px;border-radius:11px;background:var(--theme-soft,#e8f6f3);border:1px solid var(--theme-accent,#139ca5);font-size:.8rem;font-weight:700;min-height:42px;box-sizing:border-box;cursor:pointer}
.ae-file-button input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0;padding:0}.ae-file-button:focus-within{outline:2px solid var(--theme-accent,#139ca5);outline-offset:3px}.ae-file-button:has(input:disabled:not([data-ui-pending="true"])){opacity:.5;cursor:wait}.ae-file-button:has(input[data-ui-pending="true"]:disabled){cursor:progress}
.ae-file-name{font-size:.74rem;color:var(--theme-muted,#537583);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:250px}
.ae-save-status{display:inline-grid;place-items:center;flex:0 0 42px;width:42px;height:42px;color:var(--theme-accent,#139ca5);border-radius:50%;position:relative}
.ae-save-status svg{display:block;width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.avatar-image-editor[data-save-success=true] .ae-save-status svg,.ae-save-floating svg{opacity:1}
.ae-save-ring{stroke-width:1.7;opacity:.75}.ae-save-check{stroke-width:3}
.ae-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.ae-save-floating{position:fixed;z-index:80;width:48px;height:48px;background:var(--theme-surface,#fff);box-shadow:0 3px 16px #0002;pointer-events:none}
@media(prefers-reduced-motion:no-preference){
 .ae-save-status.is-animating{animation:ae-save-glow 1.1s ease-out both}
 .ae-save-status.is-animating .ae-save-ring{stroke-dasharray:1;animation:ae-save-draw .4s ease-out both;transform:rotate(-90deg);transform-origin:center}
 .ae-save-status.is-animating .ae-save-check{stroke-dasharray:1;animation:ae-save-draw .36s .26s ease-out both}
}
@keyframes ae-save-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes ae-save-glow{0%{box-shadow:0 0 0 0 transparent}45%{box-shadow:0 0 0 7px color-mix(in srgb,var(--theme-accent,#139ca5) 18%,transparent)}100%{box-shadow:0 0 0 12px transparent}}
.ae-fieldset{border:0;margin:0;padding:0;min-width:0}.ae-fieldset:disabled{opacity:.65}
.avatar-studio{display:grid;grid-template-columns:minmax(240px,.82fr) minmax(0,1.18fr);gap:clamp(20px,3vw,42px);align-items:start;max-width:1240px;margin:0 auto;overflow-anchor:none}
.avatar-studio section{min-width:0}.avatar-studio h3{display:flex;gap:11px;align-items:center;font-size:.97rem;margin:0 0 9px;letter-spacing:-.1px}.ae-step{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--theme-line,#bedddd);color:var(--theme-accent,#139ca5);font-size:.59rem;letter-spacing:.03em;flex-shrink:0}
.ae-intro{font-size:.76rem!important;line-height:1.6;color:var(--theme-muted,#537583);margin:0 0 16px!important}
.ae-source-stage{display:flex;justify-content:center;align-items:center;min-height:160px;padding:16px;border-radius:16px;background:var(--theme-soft,#eaf4f1);border:1px solid var(--theme-line,#bedddd);margin-bottom:20px}
.ae-source-surface{position:relative;line-height:0;touch-action:none;cursor:crosshair;max-width:100%;user-select:none}
.ae-source-surface img{display:block;max-width:100%;max-height:380px;width:auto;height:auto;border-radius:9px;box-shadow:0 6px 24px #0002;pointer-events:none}
.ae-marker{position:absolute;left:50%;top:40%;width:28px;height:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 2px #173f4da6,0 0 0 6px #4edbd044;transform:translate(-50%,-50%);pointer-events:none;background:#173f4d22}
.ae-marker:before,.ae-marker:after{content:"";position:absolute;background:#fff;box-shadow:0 0 2px #173f4d}.ae-marker:before{height:2px;width:10px;left:7px;top:11px}.ae-marker:after{width:2px;height:10px;left:11px;top:7px}
.ae-slider{display:block;margin:0 0 12px;font-size:.76rem}.ae-slider>span{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:5px}.ae-slider output{font-variant-numeric:tabular-nums;color:var(--theme-accent,#078e98);font-weight:700;white-space:nowrap}
.avatar-studio input[type=range]{appearance:none;-webkit-appearance:none;display:block;width:100%;height:28px;margin:0;padding:0;border:0;cursor:pointer;background:transparent;accent-color:var(--theme-accent,#139ca5)}
.avatar-studio input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:6px;background:linear-gradient(to right,var(--theme-accent,#139ca5) var(--range-fill,50%),var(--theme-line,#bedddd) var(--range-fill,50%))}
.avatar-studio input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:17px;height:17px;margin-top:-6px;border:3px solid var(--theme-surface,#fff);border-radius:50%;background:var(--theme-accent,#139ca5);box-shadow:0 1px 5px #0003}
.avatar-studio input[type=range]::-moz-range-track{height:5px;border-radius:6px;background:var(--theme-line,#bedddd)}.avatar-studio input[type=range]::-moz-range-progress{height:5px;background:var(--theme-accent,#139ca5)}.avatar-studio input[type=range]::-moz-range-thumb{width:12px;height:12px;border:3px solid var(--theme-surface,#fff);border-radius:50%;background:var(--theme-accent,#139ca5)}
.avatar-studio :is(button,select,input):focus-visible{outline:2px solid var(--theme-accent,#139ca5);outline-offset:4px}.avatar-studio :is(input,button,select):disabled{cursor:default}
.ae-hint{font-size:.72rem!important;line-height:1.65;color:var(--theme-muted,#537583);margin:8px 0 18px!important}.ae-limit{margin-top:16px!important;border-left:2px solid var(--theme-line,#bedddd);padding-left:12px}
.avatar-studio .ae-fine{margin:18px 0 0;padding:0;border:1px solid var(--theme-line,#bedddd);border-radius:12px;background:var(--theme-surface,#fff);overflow:hidden}
.avatar-studio .ae-fine summary{font-size:.78rem;padding:14px;cursor:pointer;font-weight:650}.ae-fine summary span{font-size:.62rem;margin-left:6px;color:var(--theme-muted,#537583);font-weight:400}.ae-fine-body{padding:0 16px 16px}.ae-fine-body .bio-secondary{width:100%;font-size:.72rem}.ae-following{font-size:.69rem!important;color:var(--theme-accent,#139ca5);margin:12px 0 20px!important}
.ae-text-button{border:0;background:none;color:var(--theme-accent,#139ca5);padding:7px 3px;font:inherit;font-size:.74rem;cursor:pointer;min-height:36px;text-underline-offset:4px}.ae-text-button:hover:not(:disabled){text-decoration:underline}.ae-text-button:disabled{opacity:.5}.ae-reset{margin-top:8px}
.ae-top-previews,.ae-combat-previews{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}.ae-combat-previews{margin-top:14px}
.ae-preview{min-width:0;padding:14px;border:1px solid var(--theme-line,#bedddd);border-radius:14px;background:var(--theme-surface,#fff)}
.ae-preview-title{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:12px;font-size:.77rem}.ae-preview-title strong{line-height:1.4}.ae-preview-title button{font-size:.66rem;white-space:nowrap}.ae-preview-title button[aria-pressed=true]{text-decoration:underline}
.ae-crop{position:relative;overflow:hidden;isolation:isolate;touch-action:none;cursor:grab;background:var(--theme-soft,#e4f1ef);border-radius:10px;user-select:none}.ae-crop:active{cursor:grabbing}.ae-crop img{position:absolute;left:var(--avatar-left,0);top:var(--avatar-top,0);width:var(--avatar-width,100%);height:var(--avatar-height,100%);max-width:none;max-height:none;pointer-events:none;object-fit:cover}
.ae-profile-stage{display:flex;justify-content:center;align-items:center;min-height:240px}.ae-crop-profile{aspect-ratio:2/3;width:auto;height:240px;max-width:100%}
.ae-avatar-stage{min-height:240px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:22px}.ae-crop-avatar{width:88px;height:88px;border-radius:50%;box-shadow:0 0 0 3px var(--theme-line,#bedddd),0 8px 20px #0002}.ae-tiny-avatar{display:flex;align-items:center;gap:10px}.ae-tiny-avatar .ae-crop-avatar{width:28px;height:28px;box-shadow:none}.ae-tiny-avatar small{font-size:.65rem}
.ae-crop-battle{width:100%;aspect-ratio:var(--combat-portrait-ratio,1.45)}.ae-crop-team{width:100%;aspect-ratio:var(--combat-team-portrait-ratio,2.4)}
.ae-card-shade{position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#0c293ae6);pointer-events:none}.ae-card-name{position:absolute;bottom:10px;left:10px;right:10px;color:#fff;font-size:.75rem;font-weight:700;text-shadow:0 1px 3px #0008;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}
.ae-preview p,.ae-preview>small{display:block;color:var(--theme-muted,#537583);font-size:.66rem!important;line-height:1.6;margin:12px 0 0}.ae-preview>small{color:var(--theme-accent,#139ca5);margin-top:9px;font-size:.62rem!important}
.ae-select{display:grid;gap:5px;font-size:.65rem;color:var(--theme-muted,#537583)}.ae-preview .ae-select{margin-top:13px}.ae-select select{box-sizing:border-box;max-width:100%;width:100%;min-height:38px;padding:7px 28px 7px 10px;border:1px solid var(--theme-line,#bedddd);border-radius:8px;font:inherit;font-size:.72rem;color:var(--theme-ink,#173f4d);background:var(--theme-surface,#fff);cursor:pointer}
.ae-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px solid var(--theme-line,#bedddd)}.ae-footer>small{font-size:.73rem;line-height:1.6;color:var(--theme-muted,#537583)}.ae-footer>div{display:flex;gap:10px;flex-wrap:wrap}.ae-content>.bio-notice,.ae-content>.bio-error{margin:18px 0 0}
.ae-legacy{padding:12px 15px;border-left:2px solid var(--theme-accent,#139ca5);background:var(--theme-soft,#eaf4f1);font-size:.76rem;line-height:1.65}
@media(max-width:1200px){.avatar-studio{grid-template-columns:minmax(220px,.9fr) minmax(0,1.1fr);gap:20px}.ae-top-previews,.ae-combat-previews{grid-template-columns:1fr}.ae-avatar-stage{min-height:116px;flex-direction:row}.ae-profile-stage{min-height:210px}.ae-crop-profile{height:210px}.ae-preview{padding:12px}}
@media(max-width:700px){.avatar-image-editor .ae-content{padding:12px 0 4px}.avatar-studio{grid-template-columns:1fr;gap:26px}.ae-source-surface img{max-height:340px}.ae-upload-heading h2{font-size:1.18rem}.ae-upload-bar{gap:8px}.ae-file-name{width:100%;max-width:100%}.ae-footer>div{width:100%}.ae-footer button{flex:1}.ae-top-previews{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ae-avatar-stage{min-height:210px;flex-direction:column}.ae-preview-title{align-items:flex-start;flex-direction:column;gap:0}.ae-combat-previews{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ae-profile-stage{min-height:180px}.ae-crop-profile{height:180px}.ae-avatar-stage{min-height:180px}.ae-preview{padding:10px}.ae-card-name{font-size:.63rem;bottom:7px;left:7px}.ae-tiny-avatar{flex-direction:column}}
@media(prefers-reduced-motion:no-preference){.ae-file-button,.ae-text-button{transition:background .15s,color .15s}}
.ae-crop-avatar{background:#173b46}
/* Constrain previews proportionally, even in the narrowest two-column layout. */
.ae-crop-profile{width:100%;height:auto;max-width:calc(var(--ae-profile-ratio,.6666667)*240px)}
@media(min-width:701px) and (max-width:1200px){.ae-crop-profile{max-width:calc(var(--ae-profile-ratio,.6666667)*210px)}}
@media(max-width:700px){.ae-crop-profile{max-width:calc(var(--ae-profile-ratio,.6666667)*180px)}}
