#inventory-tab-avatar:not([hidden]){display:flex;overflow:hidden}.avatar-editor-panel{display:grid;flex:1;grid-template-columns:minmax(240px,5fr) minmax(280px,6fr);gap:18px;align-items:stretch;min-height:0}.avatar-editor-preview{position:relative;width:100%;height:100%;overflow:hidden;border:1px solid var(--village-glass-border);border-radius:12px;background:radial-gradient(90% 60% at 50% 88%,rgb(255 226 189 / 14%),transparent 70%),radial-gradient(120% 95% at 50% 18%,rgb(255 240 214 / 20%),transparent 68%),linear-gradient(180deg,#3b3550,#2a2739 58%,#221f2e)}.avatar-editor-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.avatar-editor-canvas:active{cursor:grabbing}.avatar-editor-controls{display:flex;flex-direction:column;gap:18px;min-height:0;padding:0 6px;overflow-y:auto;overflow-anchor:none}@media(max-width:700px){#inventory-tab-avatar:not([hidden]){display:block;overflow-y:auto}.avatar-editor-panel{display:flex;flex-direction:column;gap:16px;height:auto}.avatar-editor-preview{height:auto;aspect-ratio:4 / 3;max-height:300px}.avatar-editor-controls{padding-right:0;overflow-y:visible}}.avatar-editor-topbar{position:sticky;z-index:3;top:0;display:flex;flex:0 0 auto;flex-direction:column;gap:4px}.avatar-editor-views{display:flex;flex:0 0 auto;gap:6px;padding:4px;border:1px solid var(--village-glass-border);border-radius:999px;background:#100f10e0;backdrop-filter:blur(14px)}.avatar-editor-view{flex:1;height:32px;padding:0 14px;border:0;border-radius:999px;color:var(--ds-ink-2);background:transparent;font-size:.8rem;font-weight:900;letter-spacing:.02em;cursor:pointer;transition:background .12s ease,color .12s ease}.avatar-editor-view:hover{color:var(--ds-ink)}.avatar-editor-view:focus-visible{outline:3px solid var(--ds-purple);outline-offset:2px}.avatar-editor-view[aria-selected=true]{color:var(--ds-bg-fixed);background:linear-gradient(180deg,#fff,#e8e6f2);box-shadow:0 2px 8px #0000004d}.avatar-editor-section{display:flex;flex-direction:column;gap:10px}.avatar-editor-section h3{margin:0;color:var(--ds-purple);font-size:.7rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.avatar-option-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px}.avatar-option{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 12px;border:1px solid var(--village-glass-border);border-radius:10px;color:var(--ds-ink);background:var(--ds-ink-5);font-size:.8rem;font-weight:800;text-align:center;cursor:pointer;transition:border-color .14s ease,background .14s ease,transform .14s ease}.avatar-option:hover{border-color:var(--ds-purple);background:var(--village-glass-highlight);transform:translateY(-1px)}.avatar-option:focus-visible{outline:3px solid var(--ds-purple);outline-offset:2px}.avatar-option[aria-pressed=true]{border-color:var(--ds-purple);color:var(--ds-bg-fixed);background:var(--ds-ink)}.avatar-option-locked{opacity:.78}.avatar-lock{font-size:.72rem;line-height:1}.avatar-thumb-option{flex-direction:column;gap:6px;min-height:0;padding:7px 7px 9px;text-align:center}.avatar-thumb-face{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:9px;background:radial-gradient(120% 100% at 50% 18%,var(--ds-purple-soft),transparent 66%),var(--ds-bg-2)}.avatar-thumb-img{width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .18s ease}.avatar-thumb-img.is-loaded{opacity:1}.avatar-thumb-caption{max-width:100%;overflow:hidden;color:inherit;font-size:.72rem;font-weight:800;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}.avatar-thumb-none:before{content:"";width:46%;height:46%;border:2px dashed var(--village-glass-border-strong);border-radius:999px}.avatar-thumb-none:after{content:"";position:absolute;width:52%;height:2px;background:var(--village-glass-border-strong);transform:rotate(-45deg)}.avatar-thumb-option .avatar-lock{position:absolute;top:4px;right:4px;padding:2px 4px;border-radius:7px;background:var(--village-glass-strong)}.avatar-thumb-option[aria-pressed=true]{color:var(--ds-ink);background:var(--ds-purple-soft)}.avatar-thumb-option[aria-pressed=true] .avatar-thumb-face{box-shadow:inset 0 0 0 2px var(--ds-purple),0 0 0 1px var(--ds-purple)}.avatar-swatches{display:flex;flex-wrap:wrap;gap:8px}.avatar-swatch{width:30px;height:30px;padding:0;border:2px solid var(--village-glass-border);border-radius:999px;background:var(--swatch, #fff);cursor:pointer;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}.avatar-swatch:hover{transform:translateY(-1px) scale(1.05)}.avatar-swatch:focus-visible{outline:3px solid var(--ds-purple);outline-offset:2px}.avatar-swatch[aria-pressed=true]{border-color:var(--ds-purple);box-shadow:0 0 0 2px var(--village-glass-strong),0 0 0 4px var(--ds-ink)}.avatar-colorways{display:flex;flex-wrap:wrap;gap:6px}.avatar-colorways .avatar-swatch{width:22px;height:22px}.avatar-slider-row{display:grid;grid-template-columns:minmax(88px,auto) 1fr;align-items:center;gap:12px}.avatar-slider-label{color:var(--ds-ink-2);font-size:.78rem;font-weight:700}.avatar-slider-row input[type=range]{width:100%;accent-color:var(--ds-ink)}.avatar-editor-actionbar{display:flex;flex-direction:column;gap:10px;margin-top:4px}.avatar-editor-savestate{display:inline-flex;min-height:18px;align-items:center;align-self:flex-end;gap:6px;color:var(--ds-ink-3);font-size:.76rem;font-weight:800}.avatar-editor-savestate:not(:empty){padding:1px 10px;border-radius:999px;background:#100f10d1;backdrop-filter:blur(10px)}.avatar-editor-savestate:not(:empty):before{content:"";width:7px;height:7px;border-radius:999px;background:currentcolor}.avatar-editor-savestate.is-error{color:var(--ds-danger)}.avatar-editor-action:disabled{cursor:default;opacity:.55}.avatar-editor-action:disabled:hover{box-shadow:0 3px 10px #00000042;transform:none}.avatar-editor-actions{display:flex;gap:10px}.avatar-editor-action{flex:1;height:40px;border:1px solid transparent;border-bottom:3px solid rgb(0 0 0 / 30%);border-radius:999px;color:var(--ds-bg-fixed);background:linear-gradient(180deg,#fff,#e8e6f2);box-shadow:0 3px 10px #00000042;font-size:.86rem;font-weight:900;cursor:pointer;transition:transform 90ms ease,border-bottom-width 90ms ease,box-shadow 90ms ease}.avatar-editor-action:hover{box-shadow:0 5px 14px #0000004d}.avatar-editor-action:active{border-bottom-width:1px;transform:translateY(2px);box-shadow:0 1px 4px #00000038}.avatar-editor-action:focus-visible{outline:3px solid var(--ds-purple);outline-offset:2px}.avatar-editor-action-ghost{border-color:var(--village-glass-border);color:var(--ds-ink);background:linear-gradient(180deg,#ffffff1a,#ffffff05)}.avatar-editor-action-ghost:hover{background:linear-gradient(180deg,#ffffff29,#ffffff0d)}
