.zc{--zc-bg:var(--bg-elev,#111);--zc-line:var(--line,#ffffff14);--zc-line-strong:var(--line-strong,#ffffff2e);--zc-ink:var(--ink,#f4f1ea);--zc-dim:var(--ink-dim,#f4f1ea9e);--zc-mute:var(--ink-mute,#f4f1ea6b);--zc-amber:var(--amber,#d9a574);--zc-mono:var(--mono,"JetBrains Mono", ui-monospace, monospace);--zc-ease:var(--ease,cubic-bezier(.22, .61, .36, 1));border:1px solid var(--zc-line);background:var(--zc-bg);color:var(--zc-ink);grid-template-columns:1fr 300px;gap:0;display:grid;overflow:hidden}.zc--boot{place-items:center;min-height:420px;display:grid}.zc-stage{aspect-ratio:4/3;background:radial-gradient(ellipse 70% 55% at 50% 42%, #ffffff0b, transparent 70%), var(--bg,#0a0a0a);min-width:0;position:relative}.zc-stage canvas{touch-action:none;display:block;width:100%!important;height:100%!important}.zc-hint{font-family:var(--zc-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--zc-mute);pointer-events:none;-webkit-user-select:none;user-select:none;opacity:0;transition:opacity .8s var(--zc-ease) .5s, transform .8s var(--zc-ease) .5s;font-size:.625rem;position:absolute;bottom:.875rem;left:1rem;transform:translateY(6px)}.zc-hint--in{opacity:1;transform:none}.zc-loader{background:var(--bg,#0a0a0a);z-index:2;transition:opacity .6s var(--zc-ease);place-items:center;display:grid;position:absolute;inset:0}.zc-loader--out{opacity:0;pointer-events:none}.zc-loader__inner{flex-direction:column;align-items:center;gap:.9rem;display:flex}.zc-loader__label{font-family:var(--zc-mono);letter-spacing:.42em;text-indent:.42em;text-transform:uppercase;color:var(--zc-dim);font-size:.6875rem}.zc-loader__track{background:var(--zc-line-strong);width:132px;height:1px;position:relative;overflow:hidden}.zc-loader__bar{background:var(--zc-amber);transform-origin:0;transition:transform .35s var(--zc-ease);position:absolute;inset:0;transform:scaleX(0)}.zc-loader__pct{font-family:var(--zc-mono);letter-spacing:.14em;color:var(--zc-mute);font-variant-numeric:tabular-nums;font-size:.625rem}.zc-side{display:contents}.zc-side .zc-controls{opacity:0;transition:opacity .7s var(--zc-ease), transform .7s var(--zc-ease);transform:translateY(10px)}.zc-side--in .zc-controls{opacity:1;transform:none}.zc-side--in .zc-group{animation:zc-rise .6s var(--zc-ease) both;animation-delay:calc(.14s + var(--i,0) * 90ms)}@keyframes zc-rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.zc-controls{border-left:1px solid var(--zc-line);flex-direction:column;gap:1.1rem;max-height:100%;padding:1.5rem 1.25rem;display:flex;overflow-y:auto}.zc-group__head{border-bottom:1px solid var(--zc-line);justify-content:space-between;align-items:baseline;gap:.75rem;margin-bottom:.75rem;padding-bottom:.5rem;display:flex}.zc-label{font-family:var(--zc-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--zc-mute);font-size:.625rem}.zc-value{font-family:var(--zc-mono);color:var(--zc-dim);animation:zc-fade .45s var(--zc-ease) both;font-size:.6875rem}@keyframes zc-fade{0%{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}.zc-swatches{flex-wrap:wrap;gap:.5rem;display:flex}.zc-swatch{border:1px solid var(--zc-line-strong);background:var(--sw);cursor:pointer;width:24px;height:24px;transition:transform .25s var(--zc-ease), box-shadow .25s var(--zc-ease);border-radius:50%;padding:0;position:relative}.zc-swatch:hover{transform:scale(1.08)}.zc-swatch:focus-visible{outline:1px solid var(--zc-amber);outline-offset:3px}.zc-swatch--on{box-shadow:0 0 0 1px var(--bg,#0a0a0a), 0 0 0 2px var(--zc-amber)}.zc-swatch--orig{background:0 0;border-style:dashed}.zc-swatch--orig:after{content:"";border-top:1px solid var(--zc-mute);transform-origin:50%;position:absolute;inset:5px;transform:rotate(-45deg)}.zc-reset{border:1px solid var(--zc-line);color:var(--zc-mute);font-family:var(--zc-mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:color .25s var(--zc-ease), border-color .25s var(--zc-ease);background:0 0;align-self:flex-start;margin-top:auto;padding:.55rem .9rem;font-size:.625rem}.zc-reset:hover{color:var(--zc-ink);border-color:var(--zc-line-strong)}.zc-mats{flex-direction:column;gap:.35rem;margin:0;padding:0;list-style:none;display:flex}.zc-mats li{align-items:center;gap:.6rem;display:flex}.zc-mats input[type=color]{border:1px solid var(--zc-line-strong);cursor:pointer;background:0 0;flex:none;width:24px;height:24px;padding:0}.zc-mats code{font-family:var(--zc-mono);color:var(--zc-dim);font-size:.6875rem}.zc-tags{gap:.25rem;margin-left:auto;display:flex}.zc-tags em{font-style:normal;font-family:var(--zc-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--zc-amber);border:1px solid var(--zc-line);padding:1px 4px;font-size:.5rem}@media (prefers-reduced-motion:reduce){.zc-hint,.zc-side .zc-controls,.zc-loader,.zc-loader__bar{transition-duration:.01ms}.zc-side--in .zc-group,.zc-value{animation:none}.zc-swatch:hover{transform:none}}@media (width<=860px){.zc{grid-template-columns:1fr}.zc-stage{aspect-ratio:1}.zc-controls{border-left:0;border-top:1px solid var(--zc-line);flex-flow:wrap;gap:1.25rem 2rem;padding:1.25rem}.zc-reset{margin-top:0}}
/*$vite$:1*/