.modal.avatar-creation-modal:has([data-avatar-creation]){width:min(1080px,calc(100vw - 40px));max-width:1080px}
.avatar-creation-layout{display:grid;grid-template-columns:minmax(260px,1fr) minmax(350px,1.3fr);gap:32px;align-items:start}
.avatar-creation-layout [data-portrait-panel]{min-width:0}
.avatar-creation-layout h3{margin:0 0 8px;font-size:20px}
.avatar-proposals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.avatar-proposal{position:relative;display:block;cursor:pointer;border:2px solid transparent;border-radius:12px;overflow:hidden;background:#ededeb}
.avatar-proposal.is-selected{border-color:var(--accent,#0c8077);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent,#0c8077) 20%,transparent)}
.avatar-proposal:focus-within{outline:3px solid var(--accent,#0c8077);outline-offset:3px}
.avatar-proposal input{position:absolute;top:12px;left:12px;z-index:1;width:20px;height:20px;accent-color:var(--accent,#0c8077)}
.avatar-proposal img{display:block;width:100%;aspect-ratio:1;object-fit:contain}
.avatar-proposal span{display:block;font-size:13px;font-weight:600;padding:10px 12px;color:#1c2927}
.avatar-proposal-placeholder{aspect-ratio:1;border-radius:12px;background:#e9eceb;display:grid;place-items:center}
.avatar-proposal-placeholder span{width:28px;height:28px;border:3px solid #c5cfcb;border-top-color:#357c71;border-radius:50%;animation:portrait-wait 1s linear infinite}
.avatar-refinement{display:grid;gap:10px;padding-top:12px;border-top:1px solid #d9e0dd}
.avatar-refinement label{font-size:14px;font-weight:600}
.avatar-refinement button{white-space:normal;text-align:left}
@keyframes portrait-wait{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.avatar-proposal-placeholder span{animation:none}}
@media(max-width:700px){.modal.avatar-creation-modal:has([data-avatar-creation]){width:calc(100vw - 24px)}.avatar-creation-layout{grid-template-columns:1fr;gap:24px}.avatar-creation-layout [data-portrait-panel]{position:static}.avatar-proposal span{font-size:12px;padding:8px}.avatar-creation-modal .modal-footer{flex-wrap:wrap}}

.modal.avatar-creation-modal:has([data-avatar-creation]){display:flex;flex-direction:column;max-height:calc(100dvh - 36px);overflow:hidden}
.avatar-creation-modal:has([data-avatar-creation]) .modal-header,.avatar-creation-modal:has([data-avatar-creation]) .modal-footer{flex-shrink:0}
.avatar-creation-modal:has([data-avatar-creation]) .modal-body{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.avatar-creation-modal:has([data-avatar-creation]) .modal-footer{position:relative;background:var(--paper);align-items:center;z-index:2}
.avatar-background-hint{margin:0 0 20px;padding:11px 14px;border-left:3px solid var(--action);background:var(--accent-soft);font-size:13px;line-height:1.5}
.avatar-form-heading{font-size:15px!important;margin:0!important}
.avatar-form-optional{border-top:1px solid var(--line);padding-top:18px;margin-top:5px!important}
.avatar-launch-feedback{margin-right:auto;max-width:520px;min-width:0}
.avatar-launch-feedback p{margin:0;font-size:12px;line-height:1.45}
.avatar-creation-feedback{color:var(--danger);font-weight:600}
.avatar-minimize{flex-shrink:0}
.avatar-creation-progress{text-align:center;padding:22px 16px}
.avatar-creation-progress h3{font-size:20px;margin:18px 0 8px}
.avatar-creation-progress p{max-width:560px;margin:10px auto}
.avatar-progress-marker{width:44px;height:44px;border:4px solid var(--action-line);border-top-color:var(--action);border-radius:50%;animation:portrait-wait 1s linear infinite;margin:auto}
.avatar-progress-marker.is-done,.avatar-progress-marker.is-failed{animation:none;border:0;display:grid;place-items:center;font-size:24px;font-weight:700;background:var(--green-soft);color:var(--green)}
.avatar-progress-marker.is-failed{color:var(--danger);background:#fff0ee}
.avatar-creation-tracker{position:fixed;bottom:max(20px,env(safe-area-inset-bottom));right:20px;z-index:65;display:grid;gap:10px;width:min(340px,calc(100vw - 32px))}
.avatar-creation-tracker[hidden]{display:none}
.avatar-task{position:relative;border:1px solid var(--line-strong);border-left:3px solid var(--action);border-radius:12px;background:var(--surface);box-shadow:var(--shadow)}
.avatar-task-open{display:flex;align-items:flex-start;gap:13px;text-align:left;width:100%;padding:16px;border:0;border-radius:10px;background:transparent;cursor:pointer}
.avatar-task-open:focus-visible{outline:3px solid var(--action);outline-offset:3px}
.avatar-task-open:hover{background:var(--surface-soft)}
.avatar-task-copy{display:grid;gap:3px;min-width:0}
.avatar-task-copy strong{font-size:14px;overflow-wrap:anywhere}.avatar-task-copy span{font-size:13px;color:var(--ink)}
.avatar-task-copy small{font-size:12px;color:var(--muted);line-height:1.4}.avatar-task-copy em{font-style:normal;color:var(--action);font-size:12px;font-weight:600;margin-top:6px}
.avatar-task-marker{flex-shrink:0;width:21px;height:21px;margin-top:2px;border:2px solid var(--action-line);border-top-color:var(--action);border-radius:50%;animation:portrait-wait 1s linear infinite}
.avatar-task.is-ready,.avatar-task.is-done{border-left-color:var(--green)}
.avatar-task.is-ready .avatar-task-marker,.avatar-task.is-done .avatar-task-marker,.avatar-task.is-failed .avatar-task-marker{animation:none;border:0;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:14px;font-weight:700}
.avatar-task.is-failed{border-left-color:var(--danger)}.avatar-task.is-failed .avatar-task-marker{background:#fff0ee;color:var(--danger)}
.avatar-task:has(.avatar-task-dismiss) .avatar-task-open{padding-right:37px}
.avatar-task-dismiss{position:absolute;top:8px;right:8px;border:0;border-radius:5px;background:transparent;color:var(--muted);font-size:20px;cursor:pointer}
.has-avatar-tracker .toast-region{bottom:220px}
@media(min-width:901px){.avatar-creation-modal:has([data-avatar-creation]) .modal-body{display:flex;flex-direction:column;overflow:hidden}.avatar-creation-modal [data-avatar-creation]{min-height:0;display:flex;flex-direction:column}.avatar-creation-layout{min-height:0;align-items:stretch}.avatar-creation-layout>form,.avatar-creation-layout>[data-portrait-panel]{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:2px 5px 18px 0}.avatar-background-hint{flex-shrink:0}}
@media(max-width:700px){.avatar-creation-modal:has([data-avatar-creation]) .modal-footer{flex-wrap:wrap}.avatar-launch-feedback{flex-basis:100%;max-width:none}.avatar-creation-tracker{right:16px;bottom:max(16px,env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.avatar-task-marker,.avatar-progress-marker{animation:none}}
