@keyframes ex-hop{0%{transform:translateY(0)scale(1)}30%{transform:translateY(-16px)scale(.97,1.04)}62%{transform:translateY(0)scale(1.05,.95)}to{transform:none}}@keyframes ex-pop{0%{opacity:0;transform:translateY(6px)scale(.97)}to{opacity:1;transform:none}}.explorer-creator{text-align:left;grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);align-items:stretch;gap:22px;display:grid}.explorer-stage{isolation:isolate;border-radius:26px;min-height:400px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 3px #ffffff80,0 10px 30px #1d4a5a26}.explorer-stage-3d{z-index:1;cursor:grab;touch-action:pan-y;background:linear-gradient(#8fd3f0,#d9f3f4 62%,#3fb3c8 62%);position:absolute;inset:0}.explorer-stage-3d:active{cursor:grabbing}.explorer-stage-canvas{width:100%;height:100%;display:block}.explorer-picture{object-fit:contain;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.explorer-picture.is-loading{background:radial-gradient(circle at 50% 40%,#ffffff60,#0000 60%)}.explorer-sign{z-index:3;color:#fff8ec;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px #8b5a2b;background:#c88b52;border:3px solid #8b5a2b;border-radius:10px;max-width:calc(100% - 40px);padding:7px 18px 8px;font:700 17px/1.2 Outfit,sans-serif;position:absolute;bottom:16px;left:50%;overflow:hidden;transform:translate(-50%)rotate(-2deg);box-shadow:0 4px #8b5a2b,inset 0 2px #e0aa73}.explorer-sign.is-empty{color:#fbe3c5;font-weight:600}.explorer-shuffle{z-index:3;color:#23525d;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#fff9;border:3px solid #fff;border-radius:999px;align-items:center;gap:7px;min-height:38px;padding:7px 14px;font:700 13px Outfit,sans-serif;display:flex;position:absolute;top:14px;left:14px;box-shadow:0 3px #ffffffa0}.explorer-shuffle:hover{background:#fffd}.explorer-shuffle:active{box-shadow:none;transform:translateY(2px)}.explorer-shuffle:hover svg{animation:.5s ease-out ex-hop}.explorer-wardrobe{flex-direction:column;gap:14px;min-width:0;display:flex}.explorer-wardrobe fieldset{border:0;min-width:0;margin:0;padding:0}.explorer-tabs [role=tablist]{grid-template-columns:repeat(5,1fr);gap:7px;display:grid}.explorer-tabs button{border:2px solid var(--line);background:var(--surface);color:var(--muted);box-shadow:0 3px 0 var(--line);cursor:pointer;border-radius:16px;flex-direction:column;align-items:center;gap:4px;padding:9px 4px 8px;font:600 13px Outfit,sans-serif;transition:transform .12s;display:flex}.explorer-tabs button:hover{color:var(--ink);transform:translateY(-1px)}.explorer-tabs button[aria-selected=true]{background:var(--purple);border-color:var(--purple);color:var(--cream);box-shadow:0 3px 0 color-mix(in srgb,var(--purple) 60%,#000)}.explorer-drawer{box-sizing:border-box;background:var(--surface-soft);border-radius:20px;flex-direction:column;gap:16px;height:272px;animation:.22s ease-out ex-pop;overflow:auto;padding:16px!important;display:flex!important}.explorer-drawer legend{float:left;width:100%;color:var(--ink);margin:0 0 10px;padding:0;font:650 14px Outfit,sans-serif}.explorer-swatches{clear:both;flex-wrap:wrap;gap:10px;display:flex}.explorer-swatches button{border:3px solid var(--surface);background:var(--swatch);width:40px;height:40px;box-shadow:0 0 0 1px var(--line),0 3px 6px #24203a1a;cursor:pointer;border-radius:50%;padding:0;transition:transform .12s;position:relative}.explorer-swatches button:hover{transform:scale(1.08)}.explorer-swatches button[aria-pressed=true]{box-shadow:0 0 0 3px var(--purple),0 3px 8px #24203a2a;transform:scale(1.1)}.explorer-tiles>div{clear:both;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px;display:grid}.explorer-tiles button{border:2px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;border-radius:16px;flex-direction:column;align-items:center;gap:3px;padding:6px 4px 8px;font:600 12.5px Outfit,sans-serif;transition:transform .12s;display:flex}.explorer-tiles button .explorer-picture{width:62px;height:60px;overflow:hidden}.explorer-tiles.is-colours>div{grid-template-columns:repeat(auto-fill,minmax(60px,1fr))}.explorer-tiles.is-colours button{padding:6px 2px}.explorer-tiles button:hover{transform:translateY(-2px)}.explorer-tiles button[aria-pressed=true]{border-color:var(--purple);background:color-mix(in srgb,var(--purple) 12%,var(--surface));box-shadow:0 3px 0 var(--purple)}.explorer-wardrobe button:focus-visible{outline:3px solid var(--purple);outline-offset:2px}.explorer-shuffle:focus-visible{outline:3px solid var(--purple);outline-offset:2px}@media (max-width:700px){.explorer-creator{grid-template-columns:1fr;gap:14px}.explorer-stage{min-height:250px}.explorer-sign{padding:5px 14px 6px;font-size:14px;bottom:8px}.explorer-shuffle{min-height:34px;padding:5px 11px;font-size:13px;top:10px;left:10px}.explorer-tabs [role=tablist]{gap:5px}.explorer-tabs button{border-radius:13px;padding:7px 2px 6px;font-size:12px}.explorer-drawer{height:auto;min-height:0;padding:13px!important}.explorer-swatches{gap:9px}.explorer-swatches button{width:36px;height:36px}.explorer-tiles>div{grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:6px}.explorer-tiles button .explorer-picture{width:48px;height:46px}}
