.hcc{max-width:1180px;margin:24px auto;padding:0 12px;font-family:inherit;color:inherit}
.hcc *{box-sizing:border-box}
.hcc [hidden]{display:none!important}
.hcc-panel{border:1px solid color-mix(in srgb,currentColor 18%,transparent);border-radius:16px;padding:16px;background:color-mix(in srgb,currentColor 4%,transparent)}
.hcc-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px}
.hcc-header h2,.hcc-panel h3{margin:0 0 6px}.hcc-header p,.hcc-panel p{margin:0;opacity:.82}
.hcc-side-tabs{display:flex;gap:6px;flex:0 0 auto}
.hcc-side-tab,.hcc-btn,.hcc-tool,.hcc-layer-row,.hcc-asset-choice,.hcc-modal-close{font:inherit;color:inherit;border:1px solid color-mix(in srgb,currentColor 24%,transparent);background:transparent;cursor:pointer}
.hcc-side-tab{padding:9px 16px;border-radius:999px;font-weight:700}.hcc-side-tab.is-active{background:color-mix(in srgb,currentColor 8%,transparent);color:inherit;outline:2px solid color-mix(in srgb,currentColor 30%,transparent)}
.hcc-workspace{display:grid;grid-template-columns:250px minmax(320px,1fr) 280px;gap:16px;align-items:start}
.hcc-tools,.hcc-inspector{position:sticky;top:16px}
.hcc-tool-grid{display:grid;grid-template-columns:1fr;gap:8px;margin-top:12px}.hcc-tool{padding:10px 12px;border-radius:10px;text-align:left;font-weight:650}
.hcc-tool:hover,.hcc-btn:hover,.hcc-layer-row:hover,.hcc-asset-choice:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
.hcc-layers-heading{margin-top:20px!important}.hcc-layer-list{display:grid;gap:6px;margin-top:10px}.hcc-layer-row{display:grid;grid-template-columns:72px 1fr;gap:8px;padding:8px 10px;border-radius:9px;text-align:left;align-items:center}.hcc-layer-row.is-selected{outline:2px solid currentColor}.hcc-layer-type{font-size:11px;text-transform:uppercase;opacity:.6}.hcc-layer-empty{opacity:.55;padding:10px}.hcc-help{font-size:12px;margin-top:10px!important}
.hcc-stage-wrap{display:flex;flex-direction:column;align-items:center;min-width:0}.hcc-stage-shell{width:min(100%,520px);padding:12px;border-radius:18px;background:#18222b;box-shadow:0 10px 30px rgba(0,0,0,.18)}.hcc-stage{display:block;width:100%;height:auto;border-radius:12px;background:#fff;touch-action:none}.hcc-stage-note{font-size:12px;text-align:center;max-width:520px;margin-top:10px!important}
.hcc-field{display:grid;gap:6px;margin-bottom:12px}.hcc-field>span{font-size:12px;font-weight:700;opacity:.8}.hcc-field input[type=text],.hcc-field textarea,.hcc-field select,.hcc-field input[type=url]{width:100%;padding:9px 10px;border-radius:8px;border:1px solid color-mix(in srgb,currentColor 25%,transparent);background:transparent!important;color:inherit!important;font:inherit}.hcc-field select option{background:var(--hcc-theme-bg);color:var(--hcc-theme-fg)}.hcc-field input[type=range]{width:100%}.hcc-field input[type=color]{width:100%;height:38px;padding:2px;border-radius:8px;border:1px solid color-mix(in srgb,currentColor 25%,transparent);background:transparent}.hcc-check{display:flex;gap:8px;align-items:center;margin:8px 0 14px}.hcc-empty-inspector{opacity:.65}.hcc-inspector-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.hcc-btn{padding:9px 12px;border-radius:10px;font-weight:700}.hcc-danger{border-color:#b42318;color:#b42318}.hcc-primary{background:transparent;color:inherit;border-color:color-mix(in srgb,currentColor 30%,transparent);padding:12px 18px}.hcc-primary:hover{background:color-mix(in srgb,currentColor 8%,transparent)}.hcc-primary:disabled{opacity:.55;cursor:wait}
.hcc-export{display:grid;grid-template-columns:1fr 250px auto;gap:16px;align-items:end;margin-top:16px}.hcc-back-mode{margin:0}.hcc-status{grid-column:1/-1;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,currentColor 6%,transparent)}.hcc-status.is-error{color:#b42318;border:1px solid #b42318}.hcc-status.is-success{color:#18794e;border:1px solid #18794e}
.hcc-modal-backdrop{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.58);display:flex;align-items:center;justify-content:center;padding:18px}.hcc-modal-backdrop[hidden]{display:none}.hcc-modal{width:min(820px,100%);max-height:82vh;overflow:auto;background:var(--hcc-theme-bg);color:var(--hcc-theme-fg);border-radius:16px;border:1px solid color-mix(in srgb,currentColor 22%,transparent);box-shadow:0 20px 60px rgba(0,0,0,.35)}.hcc-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid color-mix(in srgb,currentColor 16%,transparent)}.hcc-modal-head h3{margin:0}.hcc-modal-close{width:36px;height:36px;border-radius:999px;font-size:22px;line-height:1}.hcc-asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;padding:16px}.hcc-asset-choice{padding:10px;border-radius:12px;display:grid;gap:8px;text-align:center}.hcc-asset-preview{aspect-ratio:63/88;border-radius:10px;background:color-mix(in srgb,currentColor 6%,transparent);display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:34px;color:#53616b}.hcc-asset-preview img{width:100%;height:100%;object-fit:contain}
@media(max-width:900px){.hcc-workspace{grid-template-columns:1fr}.hcc-tools,.hcc-inspector{position:static}.hcc-stage-wrap{order:-1}.hcc-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hcc-layer-list{grid-template-columns:repeat(2,minmax(0,1fr))}.hcc-export{grid-template-columns:1fr 1fr}.hcc-export>div:first-child{grid-column:1/-1}}
@media(max-width:600px){.hcc{padding:0 8px}.hcc-header{align-items:flex-start;flex-direction:column}.hcc-side-tabs{width:100%}.hcc-side-tab{flex:1}.hcc-tool-grid,.hcc-layer-list{grid-template-columns:1fr}.hcc-export{grid-template-columns:1fr}.hcc-export>div:first-child{grid-column:auto}.hcc-primary{width:100%}.hcc-inspector-actions{grid-template-columns:1fr 1fr}.hcc-stage-shell{padding:8px}}
.hcc-color-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.hcc-color-row input[type=color]{margin:0}.hcc-gradient-button{white-space:nowrap}.hcc-gradient-button.is-active{background:color-mix(in srgb,currentColor 10%,transparent);outline:2px solid color-mix(in srgb,currentColor 28%,transparent)}
.hcc-gradient-modal{width:min(560px,100%)}.hcc-gradient-editor{padding:16px}.hcc-gradient-preview{height:86px;border-radius:12px;border:1px solid color-mix(in srgb,currentColor 24%,transparent);margin-bottom:16px}.hcc-gradient-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:8px}.hcc-gradient-editor .hcc-field strong{font-weight:700;opacity:1}
@media(max-width:600px){.hcc-color-row{grid-template-columns:1fr}.hcc-gradient-button{width:100%}.hcc-gradient-actions{display:grid;grid-template-columns:1fr}.hcc-gradient-actions .hcc-btn{width:100%}}
.hcc-accountbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.hcc-account-state{display:flex;align-items:baseline;gap:10px;min-width:0}.hcc-account-state strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:520px}.hcc-account-state span{font-size:12px;opacity:.72}.hcc-account-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.hcc-account-actions .hcc-btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.hcc-account-modal{width:min(520px,100%)}.hcc-account-modal-body{padding:16px}.hcc-account-modal-body p{margin:0 0 12px}.hcc-account-modal-body input[type=text]{width:100%;padding:10px 11px;border-radius:9px;border:1px solid color-mix(in srgb,currentColor 25%,transparent);background:transparent;color:inherit;font:inherit}.hcc-account-modal-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;padding:0 16px 16px}.hcc-account-modal-actions .hcc-btn{min-width:110px}
@media(max-width:600px){.hcc-accountbar{align-items:stretch;flex-direction:column}.hcc-account-state{justify-content:space-between}.hcc-account-actions{display:grid;grid-template-columns:1fr}.hcc-account-actions .hcc-btn{width:100%}.hcc-account-modal-actions{display:grid;grid-template-columns:1fr}.hcc-account-modal-actions .hcc-btn{width:100%}}
