:root{--vis-bg:#0a0a0a;--vis-bg-subtle:#111;--vis-surface:#1a1a1a;--vis-surface-hover:#242424;--vis-surface-active:#2e2e2e;--vis-border:#ffffff14;--vis-border-strong:#ffffff29;--vis-text:#fff;--vis-text-muted:#b0b0b0;--vis-text-dim:#737373;--vis-accent:#f97316;--vis-accent-hover:#ea680c;--vis-accent-text:#000;--vis-radius-sm:8px;--vis-radius-md:12px;--vis-radius-lg:16px;--vis-radius-xl:20px;--vis-transition:.16s ease;--vis-font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--vis-font-heading:var(--font-heading,var(--vis-font))}:root[data-vis-theme=light]{--vis-bg:#f5f5f5;--vis-bg-subtle:#eee;--vis-surface:#fff;--vis-surface-hover:#f8f8f8;--vis-surface-active:#efefef;--vis-border:#00000014;--vis-border-strong:#00000029;--vis-text:#111;--vis-text-muted:#555;--vis-text-dim:#888;--vis-accent:#e86000;--vis-accent-hover:#c95500;--vis-accent-text:#fff}*,:before,:after{box-sizing:border-box;margin:0}html{height:100%}body{min-height:100dvh;font-family:var(--vis-font);color:var(--vis-text);background:var(--vis-bg);-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.5}img{max-width:100%;display:block}button,input{font:inherit}button{cursor:pointer}.vis-sr-only{clip:rect(0,0,0,0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.vis-kicker{letter-spacing:.18em;text-transform:uppercase;color:var(--vis-accent);margin-bottom:4px;font-size:.7rem;font-weight:700;display:block}.vis-hint{color:var(--vis-text-dim);margin-top:8px;font-size:.8rem}.vis-empty{text-align:center;color:var(--vis-text-dim);grid-column:1/-1;padding:32px 16px}.vis-error{border-radius:var(--vis-radius-md);color:#f08080;background:#dc3c3c1f;margin-top:12px;padding:12px 16px;font-size:.88rem}.vis-remaining{text-align:center;color:var(--vis-text-dim);margin-top:12px;font-size:.8rem}.vis-btn{border:1px solid var(--vis-border-strong);background:var(--vis-surface);min-height:44px;color:var(--vis-text);transition:all var(--vis-transition);border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 20px;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex}.vis-btn:hover:not(:disabled){background:var(--vis-surface-hover)}.vis-btn:disabled{opacity:.4;cursor:not-allowed}.vis-btn-sm{min-height:34px;padding:0 14px;font-size:.8rem}.vis-btn-lg{min-height:52px;padding:0 32px;font-size:1rem}.vis-btn-generate{border-color:var(--vis-accent);background:var(--vis-accent);color:var(--vis-accent-text)}.vis-btn-generate:hover:not(:disabled){background:var(--vis-accent-hover)}.vis-btn-generate:disabled{background:var(--vis-surface);border-color:var(--vis-border);color:var(--vis-text-dim)}.vis-btn-secondary{border-color:var(--vis-border-strong);color:var(--vis-text-muted);background:0 0}.vis-btn-secondary:hover:not(:disabled){background:var(--vis-surface);color:var(--vis-text)}.vis-spinner{border:3px solid var(--vis-border);border-top-color:var(--vis-accent);border-radius:50%;width:28px;height:28px;animation:.7s linear infinite vis-spin}@keyframes vis-spin{to{transform:rotate(360deg)}}.vis-skeleton{background:linear-gradient(90deg, var(--vis-surface) 25%, var(--vis-surface-hover) 50%, var(--vis-surface) 75%);border-radius:var(--vis-radius-md);background-size:200% 100%;min-height:80px;animation:1.5s ease-in-out infinite vis-shimmer}@keyframes vis-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.vis{flex-direction:column;gap:16px;max-width:1200px;min-height:100dvh;margin:0 auto;padding:16px;display:flex}.vis-header{align-items:center;gap:16px;padding:12px 0;display:flex}.vis-logo{flex-shrink:0;width:clamp(100px,16vw,180px)}.vis-header-copy{flex:1}.vis-title{font:600 clamp(1.3rem, 3vw, 2rem)/1.05 var(--vis-font-heading);letter-spacing:-.04em}.vis-subtitle{color:var(--vis-text-muted);margin-top:2px;font-size:.88rem}.vis-theme-toggle{border:1px solid var(--vis-border-strong);background:var(--vis-surface);width:36px;height:36px;color:var(--vis-text);cursor:pointer;transition:background var(--vis-transition), border-color var(--vis-transition);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;display:flex}.vis-theme-toggle:hover{background:var(--vis-surface-hover)}.vis-stepper{gap:4px;padding-bottom:8px;display:flex;position:relative}.vis-stepper-track{background:var(--vis-surface);border-radius:2px;height:3px;position:absolute;bottom:0;left:0;right:0}.vis-stepper-fill{background:var(--vis-accent);border-radius:2px;height:100%;transition:width .4s}.vis-step{border-radius:var(--vis-radius-md);color:var(--vis-text-dim);text-align:left;transition:all var(--vis-transition);background:0 0;border:1px solid #0000;flex:1;align-items:center;gap:10px;padding:12px 16px;font-size:.88rem;font-weight:500;display:flex}.vis-step:hover:not(:disabled){background:var(--vis-surface)}.vis-step:disabled{cursor:default;opacity:.35}.vis-step.is-active{background:var(--vis-surface);border-color:var(--vis-border-strong);color:var(--vis-text)}.vis-step.is-done{color:var(--vis-text-muted)}.vis-step-num{background:var(--vis-surface);border-radius:50%;flex-shrink:0;place-items:center;width:28px;height:28px;font-size:.78rem;font-weight:700;display:grid}.vis-step.is-active .vis-step-num{background:var(--vis-accent);color:var(--vis-accent-text)}.vis-step.is-done .vis-step-num{color:var(--vis-accent);background:#f973162e}.vis-step-label{font-weight:600}.vis-step-selection{color:var(--vis-text-dim);white-space:nowrap;text-overflow:ellipsis;max-width:120px;font-weight:400;display:none;overflow:hidden}@media (width>=640px){.vis-step-selection{display:block}}.vis-main{flex:1;grid-template-columns:1fr;gap:16px;min-height:0;display:grid}@media (width>=900px){.vis-main{grid-template-columns:1fr 240px}}.vis-stage{min-height:0}.vis-sidebar{display:none}@media (width>=900px){.vis-sidebar{flex-direction:column;align-self:start;gap:16px;display:flex;position:sticky;top:16px}}.vis-sidebar-section{border-radius:var(--vis-radius-lg);background:var(--vis-surface);border:1px solid var(--vis-border);padding:14px}.vis-sidebar-label{letter-spacing:.16em;text-transform:uppercase;color:var(--vis-text-dim);margin-bottom:10px;font-size:.68rem;font-weight:700;display:block}.vis-sidebar-thumb-wrap{cursor:pointer;flex-direction:column;gap:6px;display:flex}.vis-sidebar-thumb{aspect-ratio:4/3;object-fit:cover;border-radius:var(--vis-radius-sm);width:100%}.vis-sidebar-thumb-swatch{aspect-ratio:1;object-fit:contain;background:var(--vis-bg);padding:8px}.vis-sidebar-name{font-size:.85rem;font-weight:600}.vis-sidebar-meta{color:var(--vis-text-dim);font-size:.78rem}.vis-sidebar-empty{border:1.5px dashed var(--vis-border-strong);border-radius:var(--vis-radius-sm);width:100%;min-height:60px;color:var(--vis-text-dim);cursor:pointer;transition:all var(--vis-transition);background:0 0;place-items:center;font-size:.85rem;display:grid}.vis-sidebar-empty:hover{border-color:var(--vis-accent);color:var(--vis-text)}.vis-sidebar-generate{width:100%}.vis-sidebar-remaining{text-align:center;color:var(--vis-text-dim);font-size:.75rem}.vis-panel-header{margin-bottom:16px}.vis-panel-title{font:600 clamp(1.4rem, 2.5vw, 1.8rem)/1.1 var(--vis-font-heading);letter-spacing:-.03em}.vis-panel-sub{color:var(--vis-text-muted);margin-top:4px;font-size:.88rem}.vis-source-tabs{gap:6px;margin-bottom:16px;display:flex}.vis-tab{border:1px solid var(--vis-border);min-height:40px;color:var(--vis-text-muted);transition:all var(--vis-transition);background:0 0;border-radius:999px;flex:1;justify-content:center;align-items:center;padding:0 12px;font-size:.85rem;font-weight:600;display:flex}.vis-tab:hover{background:var(--vis-surface)}.vis-tab.is-active{background:var(--vis-surface);border-color:var(--vis-border-strong);color:var(--vis-text)}.vis-presets-toolbar{justify-content:flex-end;margin-bottom:12px;display:flex}.vis-preset-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;display:grid}.vis-preset-card{border-radius:var(--vis-radius-lg);background:var(--vis-surface);color:var(--vis-text);cursor:pointer;transition:all var(--vis-transition);border:2px solid #0000;flex-direction:column;display:flex;overflow:hidden}.vis-preset-card:hover{border-color:var(--vis-border-strong);transform:translateY(-2px)}.vis-preset-card.is-selected{border-color:var(--vis-accent)}.vis-preset-img{aspect-ratio:4/3;object-fit:cover;width:100%}.vis-preset-name{white-space:nowrap;text-overflow:ellipsis;padding:8px 10px;font-size:.82rem;font-weight:600;overflow:hidden}.vis-upload-zone{border:2px dashed var(--vis-border-strong);border-radius:var(--vis-radius-xl);background:var(--vis-surface);transition:all var(--vis-transition);overflow:hidden}.vis-upload-zone.is-dragging{border-color:var(--vis-accent);background:#f973160f}.vis-upload-empty{cursor:pointer;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:48px 24px;display:flex}.vis-upload-icon{color:var(--vis-text-dim)}.vis-upload-heading{font-weight:600}.vis-upload-sub{color:var(--vis-text-muted);font-size:.85rem}.vis-upload-hint{color:var(--vis-text-dim);font-size:.78rem}.vis-upload-preview{align-items:center;gap:16px;padding:16px;display:flex}.vis-upload-thumb{aspect-ratio:4/3;object-fit:cover;border-radius:var(--vis-radius-sm);width:120px}.vis-upload-info{flex-direction:column;gap:8px;min-width:0;display:flex}.vis-upload-name{white-space:nowrap;text-overflow:ellipsis;font-size:.88rem;font-weight:600;overflow:hidden}.vis-camera{flex-direction:column;gap:12px;display:flex}.vis-camera-frame{border-radius:var(--vis-radius-lg);aspect-ratio:4/3;background:#000;position:relative;overflow:hidden}.vis-camera-video{object-fit:cover;width:100%;height:100%}.vis-camera-overlay{color:var(--vis-text);text-align:center;background:#000000b3;place-content:center;place-items:center;gap:12px;padding:16px;display:grid;position:absolute;inset:0}.vis-camera-actions{justify-content:center;display:flex}.vis-camera-result{flex-direction:column;align-items:center;gap:12px;display:flex}.vis-camera-captured{border-radius:var(--vis-radius-lg);width:100%;max-width:400px}.vis-finish-toolbar{flex-direction:column;gap:12px;margin-bottom:16px;display:flex}.vis-search-input{border:1px solid var(--vis-border);background:var(--vis-surface);width:100%;min-height:44px;color:var(--vis-text);transition:border-color var(--vis-transition);border-radius:999px;padding:0 16px;font-size:.9rem}.vis-search-input::placeholder{color:var(--vis-text-dim)}.vis-search-input:focus{border-color:var(--vis-accent);outline:none}.vis-family-chips{flex-wrap:wrap;gap:6px;display:flex}.vis-chip{border:1px solid var(--vis-border);min-height:34px;color:var(--vis-text-muted);cursor:pointer;transition:all var(--vis-transition);background:0 0;border-radius:999px;padding:0 14px;font-size:.8rem;font-weight:600}.vis-chip:hover{background:var(--vis-surface)}.vis-chip.is-active{background:var(--vis-text);border-color:var(--vis-text);color:var(--vis-bg)}.vis-color-grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:8px;display:grid}.vis-color-card{border-radius:var(--vis-radius-md);background:var(--vis-surface);color:var(--vis-text);cursor:pointer;text-align:left;transition:all var(--vis-transition);border:2px solid #0000;flex-direction:column;display:flex;overflow:hidden}.vis-color-card:hover{border-color:var(--vis-border-strong)}.vis-color-card.is-selected{border-color:var(--vis-accent)}.vis-color-swatch{aspect-ratio:1;background:var(--vis-bg);overflow:hidden}.vis-color-swatch img{object-fit:contain;width:100%;height:100%}.vis-color-info{flex-direction:column;gap:2px;padding:8px 10px;display:flex}.vis-color-family{letter-spacing:.14em;text-transform:uppercase;color:var(--vis-text-dim);font-size:.65rem;font-weight:700}.vis-color-name{font-size:.82rem;font-weight:600}.vis-color-type{color:var(--vis-text-dim);font-size:.75rem}.vis-preview{flex-direction:column;gap:16px;display:flex}.vis-preview-actions{flex-wrap:wrap;gap:10px;display:flex}.vis-result-frame{aspect-ratio:1;border-radius:var(--vis-radius-xl);background:var(--vis-surface);border:1px solid var(--vis-border);width:100%;max-width:640px;margin:0 auto;position:relative;overflow:hidden}.vis-result-image{object-fit:contain;width:100%;height:100%}.vis-result-loading{text-align:center;place-content:center;place-items:center;gap:12px;display:grid;position:absolute;inset:0}.vis-result-loading-text{font-weight:600}.vis-result-loading-sub{color:var(--vis-text-dim);font-size:.82rem}.vis-result-placeholder{text-align:center;height:100%;color:var(--vis-text-dim);flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex}.vis-result-placeholder-preview{width:100%;height:70%;position:relative}.vis-result-placeholder-car{object-fit:contain;opacity:.5;filter:grayscale(.5);width:100%;height:100%}.vis-result-placeholder-swatch{border-radius:var(--vis-radius-sm);border:2px solid var(--vis-border-strong);background:var(--vis-bg);width:56px;height:56px;position:absolute;bottom:8px;right:8px;overflow:hidden}.vis-result-placeholder-swatch img{object-fit:contain;width:100%;height:100%}.vis-gate{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#000000b3;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.vis-gate-card{border-radius:var(--vis-radius-xl);background:var(--vis-surface);border:1px solid var(--vis-border-strong);flex-direction:column;gap:16px;width:min(480px,100vw - 32px);padding:28px;display:flex}.vis-gate-logo{width:min(240px,60%)}.vis-gate-title{font:600 1.5rem/1.1 var(--vis-font-heading);letter-spacing:-.03em}.vis-gate-copy{color:var(--vis-text-muted);flex-direction:column;gap:8px;font-size:.9rem;line-height:1.55;display:flex}@media (width<=599px){.vis-header{flex-direction:column;align-items:flex-start}.vis-step-label{font-size:.78rem}.vis-preset-grid,.vis-color-grid{grid-template-columns:repeat(2,1fr)}.vis-result-frame{aspect-ratio:auto;min-height:300px}}@media (width>=600px) and (width<=899px){.vis-preset-grid,.vis-color-grid{grid-template-columns:repeat(3,1fr)}}