.xhs-maker{flex-direction:column;gap:1.5rem;font-family:DM Sans,Noto Sans SC,system-ui,sans-serif;display:flex}.xhs-grid{grid-template-columns:1fr 1fr;align-items:start;gap:2rem;display:grid}@media (max-width:900px){.xhs-grid{grid-template-columns:1fr}}.xhs-panel{background:#fafafa;border:1px solid #e4e4e7;border-radius:1rem;flex-direction:column;gap:.85rem;padding:1.25rem;display:flex}.dark .xhs-panel{background:#18181b;border-color:#27272a}.xhs-section-label{letter-spacing:.08em;text-transform:uppercase;color:#71717a;margin:.5rem 0 0;font-size:.7rem;font-weight:700}.xhs-layouts{grid-template-columns:repeat(3,1fr);gap:.55rem;max-height:42rem;padding-right:.15rem;display:grid;overflow-y:auto}@media (max-width:520px){.xhs-layouts{grid-template-columns:repeat(2,1fr)}}.xhs-layout{text-align:left;cursor:pointer;background:#fff;border:2px solid #e4e4e7;border-radius:.65rem;flex-direction:column;align-items:stretch;gap:.35rem;padding:.65rem;transition:border-color .15s,transform .15s;display:flex}.dark .xhs-layout{background:#09090b;border-color:#3f3f46}.xhs-layout.sel{border-color:#ff4c32;transform:translateY(-1px);box-shadow:0 6px 16px #00000014}.xhs-layout-swatch{border:1px solid #0000000f;border-radius:.35rem;height:2.5rem}.xhs-layout strong{font-size:.8rem;font-weight:700}.xhs-layout span:last-child{color:#71717a;font-size:.68rem;line-height:1.35}.xhs-field{color:#3f3f46;flex-direction:column;gap:.35rem;font-size:.8rem;font-weight:600;display:flex}.dark .xhs-field{color:#a1a1aa}.xhs-field input,.xhs-field textarea{font:inherit;color:#18181b;resize:vertical;background:#fff;border:1px solid #d4d4d8;border-radius:.5rem;padding:.65rem .75rem;font-weight:500}.dark .xhs-field input,.dark .xhs-field textarea{color:#f4f4f5;background:#09090b;border-color:#3f3f46}.xhs-field input:focus,.xhs-field textarea:focus{outline-offset:1px;outline:2px solid #ff4c32}.xhs-row{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.xhs-swatches{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.xhs-swatches .swatch{cursor:pointer;border:2px solid #d4d4d8;border-radius:999px;width:2.25rem;height:2.25rem;padding:0}.xhs-swatches .swatch.sel{outline-offset:1px;border-color:#ff4c32;outline:2px solid #ff4c32}.xhs-swatches input[type=color]{cursor:pointer;background:0 0;border:1px solid #d4d4d8;border-radius:.4rem;width:2.5rem;height:2.25rem;padding:0}.xhs-download{color:#fff;cursor:pointer;background:#18181b;border:none;border-radius:.65rem;margin-top:.5rem;padding:.9rem 1.1rem;font-size:.95rem;font-weight:800}.xhs-download:hover{opacity:.92}.dark .xhs-download{color:#18181b;background:#f4f4f5}.xhs-hint{color:#a1a1aa;margin:0;font-size:.75rem;font-weight:500;line-height:1.5}.xhs-preview{flex-direction:column;align-items:center;gap:.75rem;display:flex;position:sticky;top:1rem}.xhs-frame{aspect-ratio:3/4;background:#fff;border:1px solid #e4e4e7;border-radius:.75rem;width:min(100%,360px);overflow:hidden;box-shadow:0 18px 40px #0000001f}.dark .xhs-frame{border-color:#27272a}.xhs-frame canvas{width:100%;height:100%;display:block}.xhs-preview-meta{color:#71717a;align-items:center;gap:.4rem;margin:0;font-size:.8rem;display:flex}.xhs-preview-meta .dot{background:#22c55e;border-radius:50%;width:.45rem;height:.45rem;box-shadow:0 0 0 3px #22c55e33}.xhs-field select,.xhs-field input[type=file]{width:100%;font:inherit;color:inherit;background:#fff;border:1px solid #d4d4d8;border-radius:.5rem;padding:.5rem .65rem}.dark .xhs-field select,.dark .xhs-field input[type=file]{background:#18181b;border-color:#3f3f46}.xhs-layout-thumb{aspect-ratio:3/4;object-fit:cover;background:#f4f4f5;border:1px solid #0000000f;border-radius:.4rem;width:100%;display:block}.xhs-layout-swatch{display:none}.xhs-advanced{border:1px dashed #d4d4d8;border-radius:.5rem;padding:.65rem .75rem;font-size:.8rem}.dark .xhs-advanced{border-color:#3f3f46}.xhs-advanced summary{cursor:pointer;color:#71717a;font-weight:600}.xhs-advanced-row{flex-wrap:wrap;gap:.75rem;margin-top:.65rem;display:flex}.xhs-advanced-row input[type=color]{cursor:pointer;background:0 0;border:1px solid #d4d4d8;border-radius:.4rem;width:2.5rem;height:2.25rem;padding:0}.xhs-draw-error{color:#dc2626;margin:0;font-size:.8rem;font-weight:600}.xhs-preview .xhs-download{width:min(100%,360px)}.xhs-download-panel{display:none}@media (max-width:900px){.xhs-download-panel{display:block}.xhs-preview{position:static}}@media (min-width:901px){.xhs-preview{align-self:start;position:sticky;top:1rem}}