.toon-avatar{--skin:#f2cbb7;--hair:#25212b;--eye:#3a251e;--lip:#c95570;--cheek:.24;position:relative;isolation:isolate;overflow:hidden;width:100%;aspect-ratio:4/5;border-radius:.45rem;background:radial-gradient(circle at 26% 20%,#fffaf6 0 8%,transparent 34%),linear-gradient(145deg,#ede6df,#d8ccca 58%,#bfb3b5);container-type:inline-size}
.toon-avatar *{box-sizing:border-box}.toon-hair-back{position:absolute;z-index:1;left:14%;top:7%;width:72%;height:69%;border-radius:48% 48% 34% 34%;background:linear-gradient(112deg,color-mix(in srgb,var(--hair) 82%,#000),var(--hair) 48%,color-mix(in srgb,var(--hair) 82%,#fff));box-shadow:inset 7px 5px #ffffff15,0 10px 24px #2b18252b}
.toon-body{position:absolute;z-index:2;left:11%;bottom:-7%;width:78%;height:38%;border-radius:45% 45% 10% 10%;background:linear-gradient(135deg,#8f4055,#573943);box-shadow:inset 0 9px #ffffff10}
.toon-neck{position:absolute;z-index:3;left:43%;top:64%;width:14%;height:17%;border:1.5px solid #5a4447;background:var(--skin)}
.toon-ear{position:absolute;z-index:3;top:37%;width:11%;height:17%;border:1.5px solid #5a4447;border-radius:50%;background:var(--skin)}.toon-ear--left{left:16%}.toon-ear--right{right:16%}
.toon-face{position:absolute;z-index:4;left:22%;top:18%;width:56%;height:53%;border:1.35px solid #59484a;border-radius:48% 48% 44% 44%/40% 40% 60% 60%;background:radial-gradient(circle at 25% 67%,rgba(210,92,112,var(--cheek)) 0 7%,transparent 17%),radial-gradient(circle at 75% 67%,rgba(210,92,112,var(--cheek)) 0 7%,transparent 17%),linear-gradient(120deg,color-mix(in srgb,var(--skin) 96%,#fff),var(--skin));box-shadow:inset 5px 4px #ffffff20,0 6px 14px #5c354521}
.toon-avatar[data-face=round] .toon-face{left:20%;top:20%;width:60%;height:49%;border-radius:50%}
.toon-avatar[data-face=heart] .toon-face{left:21%;top:18%;width:58%;height:54%;border-radius:50% 50% 43% 43%/38% 38% 68% 68%;transform:scaleX(.96);transform-origin:center top}
.toon-avatar[data-face=sharp] .toon-face{left:23%;top:18%;width:54%;height:55%;border-radius:43% 43% 37% 37%/35% 35% 74% 74%;transform:scaleX(.93);transform-origin:center top}
.toon-brow{position:absolute;top:24%;width:23%;height:8%;border-top:clamp(1.5px,1.25cqw,3px) solid color-mix(in srgb,var(--hair) 78%,#2b1720);border-radius:50%}.toon-brow--left{left:17%;transform:rotate(-4deg)}.toon-brow--right{right:17%;transform:rotate(4deg)}
.toon-avatar[data-brows=straight] .toon-brow{border-radius:0;transform:none}.toon-avatar[data-brows=arch] .toon-brow{top:21%;height:13%;border-radius:50%}.toon-avatar[data-brows=soft] .toon-brow{opacity:.65;border-top-width:4px}
.toon-eye{position:absolute;top:35%;width:23%;height:16%;overflow:hidden;border:clamp(1.5px,1.1cqw,2.5px) solid #35262d;border-radius:60% 35% 62% 38%;background:#fffdfc;box-shadow:0 1px 0 #ffffff80}.toon-eye--left{left:16%}.toon-eye--right{right:16%;transform:scaleX(-1)}.toon-eye i{position:absolute;left:36%;top:14%;width:36%;aspect-ratio:1;border:clamp(2px,1.55cqw,4px) solid var(--eye);border-radius:50%;background:#17121a;box-shadow:inset 1.5px 1.5px #fff}
.toon-avatar[data-eyes=round] .toon-eye{top:33%;height:19%;border-radius:50%}.toon-avatar[data-eyes=droop] .toon-eye{top:36%;transform:rotate(5deg)}.toon-avatar[data-eyes=droop] .toon-eye--right{transform:scaleX(-1) rotate(5deg)}
.toon-avatar[data-eyes=sharp] .toon-eye{top:36%;height:12%;border-radius:70% 10% 70% 10%;transform:rotate(-4deg)}.toon-avatar[data-eyes=sharp] .toon-eye--right{transform:scaleX(-1) rotate(-4deg)}
.toon-avatar[data-eyes=smile] .toon-eye{top:37%;height:9%;border:0;border-top:4px solid #311f28;border-radius:50%;background:transparent}.toon-avatar[data-eyes=smile] .toon-eye i{display:none}
.toon-avatar[data-eyes=bold] .toon-eye{top:31%;height:22%;border-width:3px}.toon-avatar[data-eyes=bold] .toon-eye i{left:31%;width:44%}
.toon-nose{position:absolute;z-index:2;left:47%;top:53%;width:8%;height:9%;border-left:2px solid #6b3a3e;border-bottom:2px solid #6b3a3e;border-radius:0 0 0 70%;transform:rotate(-8deg)}
.toon-avatar[data-nose=dot] .toon-nose{left:49%;top:57%;width:5%;height:3%;border:0;border-radius:50%;background:#5f3436}.toon-avatar[data-nose=short] .toon-nose{top:54%;height:6%}.toon-avatar[data-nose=defined] .toon-nose{top:50%;height:13%;border-width:3px}.toon-avatar[data-nose=slim] .toon-nose{left:49%;width:5%;height:11%}
.toon-mouth{position:absolute;left:36%;top:70%;width:28%;height:10%;border-bottom:4px solid var(--lip);border-radius:0 0 50% 50%}
.toon-avatar[data-mouth=soft] .toon-mouth{left:39%;width:22%;height:6%;border-bottom-width:3px}.toon-avatar[data-mouth=full] .toon-mouth{top:68%;height:13%;border:3px solid #6f2940;border-radius:50%;background:var(--lip)}
.toon-avatar[data-mouth=cool] .toon-mouth{top:73%;height:1%;border-bottom-width:3px;border-radius:0}.toon-avatar[data-mouth=open] .toon-mouth{top:68%;height:15%;border:3px solid #64253d;border-radius:50%;background:linear-gradient(#5a2335 55%,#f2a1a8 56%)}.toon-avatar[data-mouth=cat] .toon-mouth{left:40%;top:70%;width:20%;height:9%;border-bottom:3px solid var(--lip);border-radius:0 0 50% 50%;transform:rotate(-2deg)}
.toon-hair-front{position:absolute;z-index:5;left:19%;top:8%;width:62%;height:27%;border-radius:52% 48% 30% 26%/61% 58% 27% 24%;background:linear-gradient(112deg,color-mix(in srgb,var(--hair) 84%,#000),var(--hair) 54%,color-mix(in srgb,var(--hair) 88%,#fff));box-shadow:inset 6px 5px #ffffff14,0 2px 0 #00000012}
.toon-fringe{position:absolute;z-index:2;top:45%;width:25%;height:45%;border-right:clamp(1px,.75cqw,2px) solid color-mix(in srgb,var(--hair) 72%,#fff);border-radius:0 0 62% 0;background:transparent;opacity:.32;transform-origin:50% 0}
.toon-fringe--left{left:16%;transform:rotate(10deg)}
.toon-fringe--center{left:38%;height:52%;transform:rotate(1deg)}
.toon-fringe--right{right:16%;transform:rotate(-8deg)}
.toon-hair-side{position:absolute;z-index:1;top:58%;width:16%;height:205%;border-radius:28% 32% 72% 68%/12% 15% 88% 85%;background:linear-gradient(100deg,color-mix(in srgb,var(--hair) 88%,#000),var(--hair));transform-origin:50% 0}
.toon-hair-side--left{left:-3%;transform:rotate(3deg)}.toon-hair-side--right{right:-3%;transform:rotate(-3deg) scaleX(-1)}
.toon-avatar[data-hair=long] .toon-hair-back{left:11%;width:78%;height:82%;border-radius:48% 48% 18% 18%}.toon-avatar[data-hair=long] .toon-hair-side{height:220%}
.toon-avatar[data-hair=wave] .toon-hair-back{left:8%;width:84%;height:82%;border-radius:48% 48% 32% 32%/42% 42% 28% 28%;box-shadow:inset 7px 5px #ffffff15,-5px 8px 0 color-mix(in srgb,var(--hair) 92%,#fff),5px 10px 0 color-mix(in srgb,var(--hair) 90%,#000)}.toon-avatar[data-hair=wave] .toon-hair-side{width:19%;height:205%;border-radius:35% 25% 65% 45%/12% 18% 82% 88%}.toon-avatar[data-hair=wave] .toon-hair-side--left{left:-6%;transform:rotate(8deg)}.toon-avatar[data-hair=wave] .toon-hair-side--right{right:-6%;transform:rotate(-8deg) scaleX(-1)}
.toon-avatar[data-hair=bob] .toon-hair-back{left:12%;width:76%;height:63%;border-radius:50% 50% 27% 27%}.toon-avatar[data-hair=bob] .toon-hair-front{height:27%;border-radius:54% 50% 34% 31%}.toon-avatar[data-hair=bob] .toon-hair-side{top:60%;width:20%;height:142%;border-radius:24% 28% 42% 55%/12% 16% 84% 88%}
.toon-avatar[data-hair=short] .toon-hair-back{left:18%;top:10%;width:64%;height:42%;border-radius:52% 52% 35% 35%}.toon-avatar[data-hair=short] .toon-hair-front{left:22%;top:10%;width:56%;height:23%;border-radius:55% 50% 35% 30%}.toon-avatar[data-hair=short] .toon-hair-side{top:61%;width:13%;height:65%;border-radius:20% 24% 65% 55%}.toon-avatar[data-hair=short] .toon-fringe--center{height:40%}
.toon-avatar[data-hair=pony] .toon-hair-back::after{content:"";position:absolute;right:-22%;top:27%;width:34%;height:72%;border-radius:30% 62% 58% 42%/12% 38% 72% 88%;background:linear-gradient(110deg,var(--hair),color-mix(in srgb,var(--hair) 78%,#000));transform:rotate(-13deg)}.toon-avatar[data-hair=pony] .toon-hair-back{height:61%}.toon-avatar[data-hair=pony] .toon-hair-side{height:95%}
.toon-avatar[data-hair=hime] .toon-hair-back{left:11%;width:78%;height:82%;border-radius:48% 48% 8% 8%}.toon-avatar[data-hair=hime] .toon-hair-front{height:28%;border-radius:50% 50% 7% 7%}.toon-avatar[data-hair=hime] .toon-fringe{top:48%;height:38%;border-radius:0;opacity:.24}.toon-avatar[data-hair=hime] .toon-hair-side{top:56%;width:23%;height:190%;border-radius:10% 10% 8% 8%}.toon-avatar[data-hair=hime] .toon-hair-side--left{left:-7%;transform:none}.toon-avatar[data-hair=hime] .toon-hair-side--right{right:-7%;transform:scaleX(-1)}
.toon-avatar[data-hair=wolf] .toon-hair-back{left:13%;width:74%;height:69%;border-radius:48% 48% 32% 32%/42% 42% 28% 28%;transform:scaleX(.96) rotate(-1deg);box-shadow:inset 7px 5px #ffffff15,-6px 12px 0 color-mix(in srgb,var(--hair) 91%,#fff),6px 14px 0 color-mix(in srgb,var(--hair) 89%,#000)}.toon-avatar[data-hair=wolf] .toon-hair-side{top:56%;width:18%;height:150%;border-radius:20% 35% 78% 30%/12% 16% 84% 88%}.toon-avatar[data-hair=wolf] .toon-hair-side--left{left:-5%;transform:rotate(11deg)}.toon-avatar[data-hair=wolf] .toon-hair-side--right{right:-5%;transform:rotate(-11deg) scaleX(-1)}
.toon-avatar[data-hair=bun] .toon-hair-back::after{content:"";position:absolute;left:34%;top:-23%;width:32%;aspect-ratio:1;border:2px solid color-mix(in srgb,var(--hair) 76%,#000);border-radius:46% 54% 50% 50%;background:radial-gradient(circle at 37% 30%,color-mix(in srgb,var(--hair) 82%,#fff),var(--hair) 48%,color-mix(in srgb,var(--hair) 83%,#000));box-shadow:inset 4px 4px #ffffff13}.toon-avatar[data-hair=bun] .toon-hair-back{height:61%}.toon-avatar[data-hair=bun] .toon-hair-side{height:92%}
.toon-avatar[data-hair=twin] .toon-hair-back{height:59%}.toon-avatar[data-hair=twin] .toon-hair-back::before,.toon-avatar[data-hair=twin] .toon-hair-back::after{content:"";position:absolute;top:31%;width:34%;height:82%;border-radius:34% 58% 64% 36%/12% 35% 77% 88%;background:linear-gradient(110deg,var(--hair),color-mix(in srgb,var(--hair) 80%,#000))}.toon-avatar[data-hair=twin] .toon-hair-back::before{left:-24%;transform:rotate(11deg)}.toon-avatar[data-hair=twin] .toon-hair-back::after{right:-24%;transform:rotate(-11deg) scaleX(-1)}.toon-avatar[data-hair=twin] .toon-hair-side{height:88%}
.toon-avatar[data-hair=medium] .toon-hair-back{left:12%;width:76%;height:72%;border-radius:50% 50% 22% 22%}.toon-avatar[data-hair=medium] .toon-hair-side{height:170%}
.toon-avatar[data-type=ga] .toon-body{background:linear-gradient(135deg,#c58b3d,#8e3657)}.toon-avatar[data-type=on] .toon-body{background:linear-gradient(135deg,#724050,#3e2a32)}.toon-avatar[data-type=im] .toon-body{background:linear-gradient(135deg,#c57a8f,#71618e)}.toon-avatar[data-type=hi] .toon-body{background:linear-gradient(135deg,#966c57,#5a3541)}.toon-avatar[data-type=mo] .toon-body{background:linear-gradient(135deg,#5e5879,#2b2d43)}.toon-avatar[data-type=cool] .toon-body{background:linear-gradient(135deg,#66727e,#343940)}.toon-avatar[data-type=heal] .toon-body{background:linear-gradient(135deg,#679385,#6b566c)}
.toon-avatar--preview{max-width:24rem;margin:auto;border:0;box-shadow:0 1.5rem 3.5rem #50313924}.toon-avatar--card{border-radius:0;aspect-ratio:1.08/1}.toon-avatar--option{width:4.1rem;min-width:4.1rem;border-radius:.25rem;box-shadow:none}
.avatar-preview{min-height:0!important;background:transparent!important;overflow:visible!important}.avatar-preview::before,.avatar-preview::after{display:none}.avatar-preview>img,.avatar-mood{display:none!important}
.avatar-editor{display:grid;gap:1rem}.avatar-toolbar{display:flex;justify-content:space-between;gap:.6rem;align-items:center}.avatar-toolbar p{margin:0;color:var(--muted);font-size:.7rem}.avatar-toolbar-actions{display:flex;gap:.4rem}.avatar-toolbar button{min-height:2.75rem;border:1px solid var(--control-line);border-radius:999px;padding:.52rem .72rem;color:var(--ink);background:#fff;font-size:.7rem;font-weight:850;cursor:pointer}
.feature-tabs{display:flex;gap:.4rem;overflow:auto;padding:0 0 .35rem;scrollbar-width:thin}.feature-tab{flex:0 0 auto;min-height:2.75rem;border:1px solid var(--control-line);border-radius:999px;padding:.62rem .78rem;color:var(--muted);background:#f5f0ea;font-size:.72rem;font-weight:850;cursor:pointer}.feature-tab[aria-selected=true]{border-color:var(--wine);color:#fff;background:var(--wine)}
.feature-heading{display:flex;justify-content:space-between;gap:1rem;align-items:baseline}.feature-heading h2{margin:.25rem 0;font-size:1rem}.feature-heading span{color:var(--muted);font-size:.68rem}
.feature-help{margin:-.55rem 0 0;color:var(--muted);font-size:.68rem;line-height:1.6}
.feature-options{display:grid;grid-template-columns:repeat(auto-fill,minmax(6.3rem,1fr));gap:.5rem;max-height:29rem;overflow:auto;padding:.15rem}.feature-option{display:grid;min-height:2.75rem;justify-items:center;gap:.4rem;border:1px solid var(--control-line);border-radius:.35rem;padding:.5rem .3rem;color:var(--ink);background:#faf7f3;font-size:.68rem;font-weight:850;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}.feature-option:hover{border-color:#75685f;transform:translateY(-1px)}.feature-option[aria-pressed=true]{border-color:var(--wine);color:var(--wine);background:#fff7f8;box-shadow:inset 0 0 0 1px #7d23382b}.feature-option--color{min-height:5.6rem;align-content:center}.feature-swatch{width:2.5rem;aspect-ratio:1;border:2px solid #fff;border-radius:50%;background:var(--swatch);box-shadow:0 .2rem .6rem #3d252b2e}
.avatar-summary-visible{margin:0;border-left:2px solid var(--gold);padding:.65rem .8rem;color:var(--muted);background:#f7f1eb;font-size:.7rem;line-height:1.6}
.profile-visual{background:#e1d7d3}.profile-visual::before,.profile-visual::after,.profile-visual>img,.profile-visual-copy{display:none!important}.profile-visual>.toon-avatar{display:block}
.link-only-note{margin:.8rem 0;color:var(--muted);font-size:.72rem;line-height:1.65}
@media(max-width:760px){.builder{gap:1rem}.toon-avatar--preview{max-width:18rem}.feature-options{grid-template-columns:repeat(3,1fr);max-height:none}.toon-avatar--option{width:3.6rem;min-width:3.6rem}.avatar-toolbar{align-items:flex-start;flex-direction:column}}

/* Brows stay readable at option, preview and result-card sizes. */
.toon-brow{top:23%;width:24%;height:9%;border-top-width:clamp(2px,1.8cqw,4px)}.toon-brow--left{left:16%;transform:rotate(-7deg)}.toon-brow--right{right:16%;transform:rotate(7deg)}
.toon-avatar[data-brows=straight] .toon-brow{top:25%;height:2%;border-radius:0;transform:none}.toon-avatar[data-brows=arch] .toon-brow{top:18%;height:17%;border-radius:52%}.toon-avatar[data-brows=arch] .toon-brow--left{transform:rotate(-10deg)}.toon-avatar[data-brows=arch] .toon-brow--right{transform:rotate(10deg)}.toon-avatar[data-brows=soft] .toon-brow{top:24%;width:21%;opacity:.62;border-top-width:clamp(3px,2.2cqw,5px);border-radius:55%}
.avatar-toolbar button{color:var(--ink);background:#2d2027}.feature-tab{color:var(--muted);background:#2a1d24}.feature-tab[aria-selected=true]{border-color:#ff2e72;background:linear-gradient(135deg,#ec0050,#a9003a)}
.feature-option{color:var(--ink);background:#241a1f}.feature-option:hover{border-color:#d45c83}.feature-option[aria-pressed=true]{border-color:#ff2e72;color:#ff8eb3;background:#3a1d29;box-shadow:inset 0 0 0 1px #ff2e7240}.feature-swatch{box-shadow:0 .2rem .6rem #0006}
.avatar-summary-visible{background:#2d221d}
