@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--color-background-primary:#fff;--color-background-secondary:#f5f3f0;--color-background-tertiary:#eceae6;--color-text-primary:#1a1a1a;--color-text-secondary:#555;--color-text-tertiary:#999;--color-border-secondary:#d4d4d4;--color-border-tertiary:#e5e5e5;--color-accent:#019aff;--color-premium:#e94560;--card-bg:#eceae6;--card-bg-hover:#e3e0db;--panel-bg:#f5f3f0}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,system-ui,-apple-system,sans-serif}.hide-scrollbar{scrollbar-width:none}.hide-scrollbar::-webkit-scrollbar{display:none}.avatar-builder-root{background:0 0;height:100vh;font-family:Inter,system-ui,-apple-system,sans-serif;display:flex;position:relative;overflow:hidden}.avatar-preview-panel{border-right:.5px solid var(--color-border-tertiary);background:0 0;flex-direction:column;flex-shrink:0;align-items:center;width:300px;padding:32px 32px 28px;display:flex;position:sticky;top:0}.avatar-right-panel{background:var(--panel-bg);flex-direction:column;flex:1;min-width:0;display:flex}.avatar-category-grid,.avatar-admin-grid{grid-template-columns:repeat(5,1fr);gap:12px;display:grid}.grid-cell{flex-direction:column;gap:5px;min-width:0;display:flex}.grid-cell__name{color:var(--color-text-secondary);text-align:center;white-space:nowrap;text-overflow:ellipsis;padding:0 2px;font-size:11px;font-weight:600;line-height:1.2;overflow:hidden}.grid-section{letter-spacing:.4px;text-transform:uppercase;color:var(--color-text-tertiary);margin:20px 4px 10px;font-size:12px;font-weight:800}@media (width<=1024px){.avatar-preview-panel{width:240px;padding:24px 20px 20px}.avatar-category-grid,.avatar-admin-grid{grid-template-columns:repeat(6,1fr)}}@media (width<=768px){.avatar-builder-root{flex-direction:column;height:100vh}.avatar-preview-panel{border-right:none;border-bottom:.5px solid var(--color-border-tertiary);flex-direction:column;flex-shrink:0;align-items:center;gap:10px;width:100%;padding:14px 16px 12px;position:relative}.avatar-preview-panel .avatar-renderer-wrap{flex-shrink:0;width:150px}.avatar-preview-panel .avatar-controls{flex-direction:column;gap:10px;width:100%;display:flex}.avatar-preview-panel .avatar-icon-row{margin-bottom:0}.avatar-preview-panel .avatar-icon-row__group{flex:1;justify-content:space-around;gap:0;width:100%}.avatar-right-panel{flex:1;min-height:0;overflow:hidden}.avatar-category-grid,.avatar-admin-grid{grid-template-columns:repeat(4,1fr)}.category-tabs{position:relative}.category-tabs:after{content:"";background:linear-gradient(to right, transparent, var(--color-background-primary));pointer-events:none;z-index:2;width:30px;position:absolute;top:0;bottom:0;right:0}}.avatar-renderer-svg{height:auto}@media (width<=768px){.avatar-renderer-svg{width:100px!important;height:auto!important}}@media (width<=480px){.avatar-renderer-svg{width:80px!important;height:auto!important}.avatar-category-grid,.avatar-admin-grid{grid-template-columns:repeat(3,1fr);gap:4px}.avatar-preview-panel{gap:12px;padding:10px 12px}}.ninja-icon-btn{cursor:pointer;width:34px;height:34px;color:var(--color-text-tertiary);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;padding:0;transition:background .18s,color .18s,transform .18s cubic-bezier(.34,1.56,.64,1);display:inline-flex}.ninja-icon-btn:hover:not(:disabled){color:var(--color-text-primary);background:#0000000f;transform:translateY(-1px)scale(1.08)}.ninja-icon-btn:active:not(:disabled){transition-duration:80ms;transform:translateY(0)scale(.92)}.ninja-icon-btn:disabled{cursor:not-allowed;color:var(--color-border-tertiary);opacity:.5}.ninja-icon-btn--active{animation:.34s cubic-bezier(.34,1.56,.64,1) ninja-heart-pop}@keyframes ninja-heart-pop{0%{transform:scale(.6)}60%{transform:scale(1.25)}to{transform:scale(1)}}.avatar-icon-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;width:100%;margin-bottom:14px;display:flex}.avatar-icon-row__group{align-items:center;gap:2px;display:flex}.ninja-save-btn{background:var(--color-accent);color:#fff;cursor:pointer;border:none;border-radius:999px;width:100%;padding:14px 0;font-family:inherit;font-size:15px;font-weight:600;transition:background .2s,transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .2s;position:relative;overflow:hidden;box-shadow:0 1px 2px #019aff2e}.ninja-save-btn:hover:not(:disabled){background:#0084e0;transform:translateY(-1px);box-shadow:0 4px 14px #019aff47}.ninja-save-btn:active:not(:disabled){transform:translateY(0)scale(.98)}.ninja-save-btn:disabled{cursor:not-allowed}.ninja-save-btn--saving{background:#0084e0}.ninja-save-btn--saved{background:#16a34a;animation:.42s cubic-bezier(.34,1.56,.64,1) ninja-save-pop;box-shadow:0 4px 14px #16a34a52}.ninja-save-btn--error{background:#dc2626;animation:.4s ninja-save-shake;box-shadow:0 4px 14px #dc262652}.ninja-save-btn--error:hover:not(:disabled){background:#c01f1f;box-shadow:0 4px 14px #dc262666}.ninja-save-btn__label{justify-content:center;align-items:center;gap:8px;display:inline-flex}.ninja-save-btn__spinner{animation:.9s linear infinite ninja-spin}.ninja-save-btn__check,.ninja-save-btn__error{animation:.32s cubic-bezier(.34,1.56,.64,1) ninja-check-pop}@keyframes ninja-save-shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}@keyframes ninja-save-pop{0%{transform:scale(1)}40%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes ninja-check-pop{0%{opacity:0;transform:scale(0)rotate(-15deg)}60%{opacity:1;transform:scale(1.2)rotate(0)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes ninja-spin{to{transform:rotate(360deg)}}.ninja-save-burst{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.ninja-spark{--angle:calc(var(--i) * 36deg);background:#ffd93d;border-radius:50%;width:8px;height:8px;animation:.9s ease-out forwards ninja-spark;position:absolute;top:50%;left:50%;box-shadow:0 0 6px #ffd93dcc}@keyframes ninja-spark{0%{transform:translate(-50%, -50%) rotate(var(--angle)) translateX(0) scale(.4);opacity:0}20%{opacity:1}to{transform:translate(-50%, -50%) rotate(var(--angle)) translateX(130px) scale(0);opacity:0}}.ninja-toast{white-space:nowrap;color:#fff;pointer-events:none;background:#111;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;animation:.25s ease-out ninja-toast-in,.25s ease-in 1.95s forwards ninja-toast-out;position:absolute;bottom:-42px;left:50%;transform:translate(-50%);box-shadow:0 6px 16px #0000002e}.ninja-toast--success{background:#16a34a}.ninja-toast--error{background:#dc2626}@keyframes ninja-toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@keyframes ninja-toast-out{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-8px)}}.avatar-controls{position:relative}.ninja-side-panel-overlay{z-index:1100;background:#0000002e;justify-content:flex-end;animation:.18s ease-out ninja-overlay-fade;display:flex;position:absolute;inset:0}@keyframes ninja-overlay-fade{0%{background:0 0}to{background:#0000002e}}.ninja-side-panel{background:#fff;flex-direction:column;height:100%;animation:.22s cubic-bezier(.16,1,.3,1) ninja-side-in;display:flex;box-shadow:-8px 0 24px #0000001f}@keyframes ninja-side-in{0%{transform:translate(100%)}to{transform:translate(0)}}.ninja-side-panel__header{border-bottom:1px solid #f0f0f0;flex-shrink:0;justify-content:space-between;align-items:center;padding:18px 20px 14px;display:flex}.ninja-side-panel__title{color:var(--color-text-primary);font-size:17px;font-weight:700}.ninja-side-panel__close{background:var(--color-background-secondary);cursor:pointer;width:32px;height:32px;color:var(--color-text-primary);border:none;border-radius:50%;justify-content:center;align-items:center;transition:background .12s;display:flex}.ninja-side-panel__close:hover{background:var(--color-background-tertiary)}.ninja-side-panel__body{flex:1;padding:14px 16px 20px;overflow-y:auto}.ninja-pastlook{background:var(--color-background-secondary);border-radius:10px;align-items:center;gap:10px;margin-bottom:8px;padding:8px 10px;transition:background .12s;display:flex}.ninja-pastlook:hover{background:var(--color-background-tertiary)}.ninja-pastlook--pinned{background:#019aff14;border:1px solid #019aff40;margin-bottom:14px}.ninja-pastlook--pinned:hover{background:#019aff1f}.ninja-pastlook__load{cursor:pointer;text-align:left;background:0 0;border:none;flex-direction:column;flex:1;align-items:flex-start;gap:2px;min-width:0;padding:0;font-family:inherit;display:flex}.ninja-pastlook__name{color:var(--color-text-primary);background:0 0;border:1px solid #0000;border-radius:6px;width:100%;padding:2px 4px;font-family:inherit;font-size:14px;font-weight:600;transition:border-color .12s,background .12s}.ninja-pastlook__name:focus{border-color:var(--color-accent);background:#fff;outline:none}.ninja-pastlook__time{color:var(--color-text-tertiary);padding-left:4px;font-size:11px}.ninja-pastlook__delete{cursor:pointer;width:28px;height:28px;color:var(--color-text-tertiary);background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;transition:background .12s,color .12s;display:flex}.ninja-pastlook__delete:hover{color:#dc2626;background:#dc26261a}.ninja-closet-grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.ninja-closet-item{background:var(--color-background-secondary);border-radius:12px;position:relative;overflow:hidden}.ninja-closet-item__load{cursor:pointer;background:0 0;border:none;width:100%;padding:6px;display:block}.ninja-closet-item:hover{background:var(--color-background-tertiary)}.ninja-closet-item__remove{color:#fff;cursor:pointer;opacity:0;background:#1111118c;border:none;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;transition:opacity .12s;display:flex;position:absolute;top:4px;right:4px}.ninja-closet-item:hover .ninja-closet-item__remove{opacity:1}.avatar-renderer-wrap{position:relative}.avatar-history-controls{z-index:2;gap:2px;display:flex;position:absolute;top:-4px;right:-4px}.avatar-history-controls .ninja-icon-btn{background:#ffffffeb;width:28px;height:28px;box-shadow:0 1px 3px #00000014}.avatar-history-controls .ninja-icon-btn:hover:not(:disabled){background:#fff}
