.edition{font-size:12px!important;background:#e9edde;border-radius:20px;padding:6px 10px;color:#687a5e!important;white-space:nowrap}.race-grid{grid-template-columns:repeat(2,1fr)}.race-card canvas{height:112px;width:100%;object-fit:contain}.face-options canvas{width:100%;height:auto;display:block}.face-options{grid-template-columns:repeat(4,1fr)}#outlines{grid-template-columns:repeat(3,1fr)}.accessory-options{flex-wrap:wrap}.accessory-options button{min-width:85px}.costume-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.costume-grid button{border:1px solid var(--line);border-radius:12px;background:white;padding:12px}.costume-grid button[aria-pressed=true]{outline:2px solid #829477;background:#edf1e7}.costume-grid canvas{width:100%;display:block}.hair-card{font-size:11px}.hair-card small{display:block;color:#95877c;font-size:9px}.hair-card canvas{height:auto;aspect-ratio:1}.share-panel button:disabled{opacity:.5}.saved-item{display:flex;gap:8px;padding:8px 0}.saved-item button{border:1px solid var(--line);border-radius:8px;background:white;padding:9px}.saved-item button:first-child{flex:1;text-align:left}#skin-colors .swatch{font-size:11px}.share-panel .share-x{border:0}.hair-search{margin-bottom:16px}@media(max-width:760px){.race-grid{grid-template-columns:repeat(2,1fr)}.face-options{grid-template-columns:repeat(4,1fr)}.edit-tabs button{padding:12px 5px;font-size:11px}.race-card canvas{height:100px}} 
.segments:has([data-mouth]){flex-wrap:wrap}.segments [data-mouth]{flex:1 0 28%;}

/* Keep the character visible while choosing parts, including narrow app panels. */
.save-tools{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.save-tools>summary{cursor:pointer;font-size:13px;font-weight:bold;color:#51664e;padding:10px 4px}
.hair-card{position:relative;font-size:12px;color:#51463e}
.hair-card[aria-pressed=true]::after{content:'✓';position:absolute;right:6px;top:6px;background:#627b56;color:#fff;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:14px}
.list-hint{font-size:11px;color:#71665c;margin:8px 0}
#hairstyles{max-height:440px;overflow-y:auto;overscroll-behavior:contain;padding:4px;scrollbar-gutter:stable}
.edit-tabs{position:sticky;top:0;z-index:4;background:#f7f4ef;padding-top:8px}
.edit-tabs button{min-height:44px;color:#62584f}
.edit-tabs button[aria-selected=true]{background:#e6eddf;border-radius:9px 9px 0 0;font-weight:bold}
.palette-note,.race-description,.hint{color:#786d62}
.editor{min-width:0}.hair-search input{min-width:0;width:100%}
@media(min-width:761px){.save-tools:not([open]) .icon-check{display:none}.preview-panel{top:12px}.race-card canvas{height:64px}}
@media(max-width:760px){
 header{padding:12px 14px}.brand{font-size:12px}.edition{font-size:10px!important;padding:4px 6px}
 main{padding:14px 12px 32px}h1{font-size:20px;margin:6px 0}.eyebrow{display:none}.lead{margin-bottom:12px}
 .layout{display:block}.preview-panel{position:sticky;top:0;z-index:6;max-width:none;display:grid;grid-template-columns:128px minmax(0,1fr);gap:6px 12px;padding:10px;border-radius:12px;box-shadow:0 4px 12px #50464012}
 .preview-head{grid-column:2;margin:0;align-self:start;font-size:9px}.artboard{grid-column:1;grid-row:1 / 5;width:128px;height:128px}
 .preview-caption{grid-column:2;display:block;margin:0;font-size:12px}.preview-caption small{display:block;margin-top:5px;color:#71665c}
 .edit-actions{grid-column:2;gap:4px;margin:0;flex-wrap:wrap}.edit-actions button{padding:7px;font-size:11px;min-height:32px}
 .preview-panel>.hint{display:none}.save-tools{grid-column:2;margin:0;padding:0;border:0}.save-tools>summary{padding:5px 0;font-size:12px}
 .save-tools[open]{grid-column:1 / -1;max-height:40vh;overflow:auto;padding:8px;border-top:1px solid var(--line)}
 .save-tools .icon-check{display:none}.settings-line{margin:10px 0}.share-panel{margin-top:10px}
 .editor{margin-top:18px}.editor>h2{display:none}.race-grid{gap:8px}.race-card{padding:10px!important;min-height:42px}.race-card canvas{display:none}
 .race-description{margin:8px 0 12px;font-size:10px;min-height:0}.mode-row{margin-bottom:8px;gap:8px}.mode-row .mode{width:180px}.mode-row small{font-size:9px}
 .edit-tabs{top:var(--preview-height,150px);margin-bottom:14px}.edit-tabs button{padding:10px 8px;font-size:12px;flex:1}
 #hairstyles{max-height:350px;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 .face-options{gap:7px}.hair-card{font-size:10px;padding:5px}.hair-card[aria-pressed=true]::after{width:18px;height:18px;font-size:12px;right:3px;top:3px}
 .swatches{grid-template-columns:repeat(5,minmax(0,1fr))}.swatch{font-size:10px}.segments button{min-height:42px}
}
@media(max-width:380px){.preview-panel{grid-template-columns:105px minmax(0,1fr);gap:5px 8px}.artboard{width:105px;height:105px}.edit-tabs{top:var(--preview-height,155px)}.face-options{grid-template-columns:repeat(4,minmax(0,1fr))}}

.blog-ad{margin:32px auto;max-width:780px;text-align:center;min-height:100px}.blog-ad[hidden]{display:none}.blog-ad>p{font-size:11px;color:#8a8178}.blog-card{display:block;margin:24px auto;padding:18px;text-align:center;border:1px solid #ded8cc;border-radius:14px;color:#685847;text-decoration:none;background:#fff}
