#modal.appearance-modal{background:#000b;backdrop-filter:none;padding:12px;font-family:'Courier New',monospace}
#modal.appearance-modal .panel{width:100%;max-width:920px;max-height:calc(100% - 16px);padding:14px;background:#100c12;border:3px double #623640;box-shadow:0 8px 30px #000}
#modal.appearance-modal .panel-top,#modal.appearance-modal h2{display:none}
.appearance-wardrobe{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,5fr) minmax(0,2fr);gap:8px;align-items:start}
.appearance-categories{display:flex;flex-direction:column;gap:5px;min-width:0;align-self:stretch;background:#08080b;border:1px solid #392b36}
.appearance-categories button{font-size:clamp(9px,1.55vw,13px);line-height:1.35;padding:7px 3px;text-align:left;overflow-wrap:anywhere;border:1px solid transparent;color:#b5a1af;min-height:30px}
.appearance-categories button[aria-selected=true]{background:#2c1923;border-color:#6b3c50;color:#ead9e4}
.appearance-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;min-width:0;max-height:55dvh;overflow:auto;padding:1px}
.appearance-cell{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;padding:0;border:1px solid #392b36;background:#09090d;min-width:0}
.appearance-cell:disabled{opacity:1;cursor:default;background:#0e0c11;border-color:#29212b}
.appearance-cell[aria-pressed=true]{border-color:#b5819d;background:#352338;box-shadow:inset 0 0 0 1px #76536c}
.appearance-cell canvas{display:block;width:100%;height:100%;image-rendering:pixelated;pointer-events:none}
.appearance-family-mark{position:absolute;right:4px;bottom:4px;width:8px;height:7px;background:#392b36;border:1px solid #ad899b;pointer-events:none}
.appearance-family-mark:before{content:'';position:absolute;width:6px;height:5px;right:2px;bottom:2px;border:1px solid #ad899b;background:#21131d}
.appearance-preview-panel{display:grid;place-items:center;align-self:stretch;min-width:0;background:#08080b;border:1px solid #392b36}
.appearance-preview{width:100%;max-width:144px;height:auto;image-rendering:pixelated}
.appearance-footer{display:flex;justify-content:space-between;gap:12px;margin-top:14px}
.appearance-footer .quiet-button{padding:10px 14px;border-color:#623640;background:#21131d;font:12px 'Courier New',monospace;text-align:center}
.appearance-offer{display:flex;justify-content:center}
.appearance-offer .appearance-preview-panel{width:144px;height:184px;border:0;background:none}
#modal.appearance-offer-modal .panel{width:min(320px,100%)}
@media(max-width:500px){#modal.appearance-modal{padding:5px}#modal.appearance-modal .panel{padding:8px}.appearance-wardrobe{gap:4px}.appearance-grid{gap:2px}.appearance-categories button{font-size:9px;padding:6px 2px}.appearance-footer{margin-top:10px}.appearance-footer .quiet-button{font-size:11px;padding:9px 12px}}
@media(max-height:420px){#modal.appearance-modal .panel{padding:8px}.appearance-categories{gap:1px}.appearance-categories button{min-height:24px;padding:4px 2px}.appearance-preview{max-height:180px;width:auto;max-width:100%}.appearance-footer{margin-top:8px}}