.vlab[data-v-c6390af3]{color:var(--textPrimary);display:flex;flex-direction:column;height:100%;overflow:hidden}.vlab__top[data-v-c6390af3]{display:flex;flex-direction:column;flex-shrink:0;gap:.75rem;padding:1rem 1rem 0}.vlab__controls[data-v-c6390af3]{display:flex;flex:1;flex-direction:column;gap:.75rem;min-height:0;overflow-y:auto;padding:.75rem 1rem 1rem}.vlab__header h2[data-v-c6390af3]{font-size:1.125rem;font-weight:600;margin:0}.vlab__subtitle[data-v-c6390af3]{color:var(--textMuted);font-size:.75rem;margin:.25rem 0 0}.vlab__variant-bar[data-v-c6390af3]{background:var(--surfaceAlt);border-radius:var(--border-radius-md);gap:.5rem;padding:.5rem .75rem}.nav-btn[data-v-c6390af3],.vlab__variant-bar[data-v-c6390af3]{align-items:center;display:flex}.nav-btn[data-v-c6390af3]{background:var(--surface);border:1px solid var(--borderDefault);border-radius:var(--border-radius-sm);color:var(--textPrimary);cursor:pointer;font-size:.75rem;height:24px;justify-content:center;width:24px}.variant-name[data-v-c6390af3]{font-size:.8rem;font-weight:500;min-width:60px;text-align:center}.variant-chips[data-v-c6390af3]{display:flex;gap:.25rem;margin-left:auto}.chip[data-v-c6390af3]{border-radius:3px;color:#fff;font-size:.575rem;font-weight:600;padding:.1rem .35rem;text-shadow:0 1px 2px rgba(0,0,0,.4)}.vlab__preview[data-v-c6390af3]{align-items:stretch;background:var(--surface);border:1px dashed var(--borderDefault);border-radius:var(--border-radius-lg);display:flex;flex-shrink:0;min-height:200px;padding:1rem}.mock-panel[data-v-c6390af3]{background:var(--panel-surface,var(--surface));border:1px solid var(--borderDefault);border-radius:var(--border-radius-md);color:var(--panel-text,var(--textPrimary));display:flex;flex:1;flex-direction:column;overflow:hidden;padding:.75rem;position:relative}.mock-panel__fill[data-v-c6390af3]{border-radius:inherit;inset:0;pointer-events:none;position:absolute;z-index:0}.mock-panel--calm .mock-panel__fill[data-v-c6390af3]:after{background:var(--panel-surface);border-radius:inherit;content:"";inset:0;opacity:var(--panel-calm-overlay-alpha,.6);position:absolute}.mock-panel__header[data-v-c6390af3]{z-index:1}.mock-panel__content[data-v-c6390af3]{position:relative;z-index:1}.mock-panel--expressive .mock-panel__content[data-v-c6390af3]{z-index:auto}.mock-panel__header[data-v-c6390af3]{align-items:center;display:flex;gap:.5rem;padding-bottom:.5rem;position:relative}.mock-panel__title[data-v-c6390af3]{flex:1;font-size:.875rem;font-weight:600}.mock-panel__actions[data-v-c6390af3]{display:flex;gap:.375rem}.mock-panel__header-trim[data-v-c6390af3]{bottom:0;left:0;position:absolute;right:0}.mock-panel__content[data-v-c6390af3]{display:flex;flex:1;flex-direction:column;gap:.625rem}.mock-card[data-v-c6390af3]{border:1px solid var(--borderDefault);border-radius:var(--border-radius-sm);padding:.625rem}.mock-card h4[data-v-c6390af3]{font-size:.75rem;font-weight:600;margin:0 0 .25rem}.mock-card p[data-v-c6390af3]{font-size:.7rem;line-height:1.4;margin:0;opacity:.7}.mock-well[data-v-c6390af3]{border:1px solid var(--borderDefault);border-radius:var(--border-radius-sm);font-size:.7rem;opacity:.6;padding:.5rem .625rem}.mock-list[data-v-c6390af3]{display:flex;flex-direction:column;gap:.3rem}.mock-list-item[data-v-c6390af3]{align-items:center;display:flex;font-size:.7rem;gap:.5rem}.mock-list-dot[data-v-c6390af3]{border-radius:50%;flex-shrink:0;height:7px;width:7px}.mock-tags[data-v-c6390af3]{display:flex;flex-wrap:wrap;gap:.3rem}.mock-tag[data-v-c6390af3]{border:1px solid;border-radius:999px;font-size:.6rem;font-weight:500;padding:.15rem .45rem}.mock-button-row[data-v-c6390af3]{display:flex;gap:.375rem;margin-top:.25rem}.corner-accent[data-v-c6390af3]{border-radius:2px;opacity:.7;position:absolute}.corner-accent.top-left[data-v-c6390af3]{border-radius:var(--border-radius-md) 0 4px 0;left:0;top:0}.corner-accent.top-right[data-v-c6390af3]{border-radius:0 var(--border-radius-md) 0 4px;right:0;top:0}.corner-accent.bottom-left[data-v-c6390af3]{border-radius:0 4px 0 var(--border-radius-md);bottom:0;left:0}.corner-accent.bottom-right[data-v-c6390af3]{border-radius:4px 0 var(--border-radius-md) 0;bottom:0;right:0}.vlab__section[data-v-c6390af3]{background:var(--surfaceAlt);border-radius:var(--border-radius-md);flex-shrink:0;overflow:hidden}.section-header[data-v-c6390af3]{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:.5rem .75rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.section-header[data-v-c6390af3]:hover{background:color-mix(in oklch,var(--surfaceAlt) 80%,var(--surface) 20%)}.section-header h3[data-v-c6390af3]{font-size:.8rem;font-weight:600;margin:0}.toggle-icon[data-v-c6390af3]{color:var(--textMuted);font-size:.9rem;font-weight:600}.section-body[data-v-c6390af3]{display:flex;flex-direction:column;gap:.625rem;padding:0 .75rem .75rem}.source-picker[data-v-c6390af3]{display:flex;flex-wrap:wrap;gap:.25rem}.source-btn[data-v-c6390af3]{align-items:center;background:var(--surface);border:1.5px solid var(--borderDefault);border-radius:var(--border-radius-sm);color:var(--textMuted);cursor:pointer;display:flex;font-size:.575rem;font-weight:600;gap:.25rem;padding:.2rem .4rem;transition:border-color .1s}.source-btn[data-v-c6390af3]:hover{border-color:var(--textMuted)}.source-btn.active[data-v-c6390af3]{border-color:var(--accentFill);box-shadow:0 0 0 1px var(--accentFill)}.source-swatch[data-v-c6390af3]{border:1px solid rgba(0,0,0,.1);border-radius:3px;flex-shrink:0;height:14px;width:14px}.source-swatch--custom[data-v-c6390af3]{border-radius:50%}.source-btn--custom[data-v-c6390af3]{cursor:pointer}.hidden-color-input[data-v-c6390af3]{height:0;opacity:0;pointer-events:none;position:absolute;width:0}.tone-badge[data-v-c6390af3]{align-self:flex-start;border-radius:3px;font-size:.55rem;font-weight:600;padding:.1rem .3rem;text-transform:uppercase}.tone-badge.light[data-v-c6390af3]{background:#f0f0f0;color:#333}.tone-badge.dark[data-v-c6390af3]{background:#333;color:#f0f0f0}.mode-toggle[data-v-c6390af3]{display:flex;gap:.25rem}.mode-btn[data-v-c6390af3]{background:var(--surface);border:1px solid var(--borderDefault);border-radius:var(--border-radius-sm);color:var(--textMuted);cursor:pointer;font-size:.575rem;padding:.2rem .5rem}.mode-btn.active[data-v-c6390af3]{background:var(--accentFill);border-color:var(--accentFill);color:#fff}.mode-hint[data-v-c6390af3]{color:var(--textMuted);font-size:.55rem;font-style:italic;opacity:.7}.clear-all-btn[data-v-c6390af3],.reset-btn[data-v-c6390af3]{background:var(--surface);border:1px solid var(--borderDefault);border-radius:3px;color:var(--textMuted);cursor:pointer;font-size:.6rem;padding:.15rem .4rem}.clear-all-btn[data-v-c6390af3]:hover,.reset-btn[data-v-c6390af3]:hover{border-color:var(--textMuted);color:var(--textPrimary)}.clear-all-btn[data-v-c6390af3]{align-self:flex-start}.surface-strip[data-v-c6390af3]{display:flex;gap:.375rem}.surface-swatch[data-v-c6390af3]{align-items:center;display:flex;flex:1;flex-direction:column;gap:.2rem}.surface-swatch.overridden .swatch-label[data-v-c6390af3]{color:var(--textPrimary);font-weight:700}.swatch-color-row[data-v-c6390af3]{align-items:center;display:flex;gap:.15rem}.swatch-input[data-v-c6390af3]{border:1px solid var(--borderDefault);border-radius:3px;cursor:pointer;height:28px;min-width:36px;padding:0;width:100%}.swatch-reset[data-v-c6390af3]{align-items:center;background:var(--surface);border:none;border-radius:50%;color:var(--textMuted);cursor:pointer;display:flex;font-size:.6rem;height:16px;justify-content:center;padding:0;width:16px}.swatch-label[data-v-c6390af3]{color:var(--textMuted);font-size:.575rem;font-weight:500}.swatch-hex[data-v-c6390af3]{color:var(--textMuted);font-family:var(--font-mono,monospace);font-size:.5rem;opacity:.7}.trim-controls[data-v-c6390af3]{gap:.5rem}.ctrl-group[data-v-c6390af3],.trim-controls[data-v-c6390af3]{display:flex;flex-direction:column}.ctrl-group[data-v-c6390af3]{gap:.2rem}.ctrl-group label[data-v-c6390af3]{color:var(--textMuted);font-size:.65rem;font-weight:600}.ctrl-row[data-v-c6390af3]{display:flex;flex-wrap:wrap;gap:.75rem}.ctrl-group--inline[data-v-c6390af3]{flex:1;min-width:100px}.placement-grid[data-v-c6390af3]{display:flex;flex-wrap:wrap;gap:.25rem}.placement-btn[data-v-c6390af3]{background:var(--surface);border:1px solid var(--borderDefault);border-radius:var(--border-radius-sm);color:var(--textMuted);cursor:pointer;font-size:.575rem;padding:.2rem .35rem}.placement-btn.active[data-v-c6390af3]{background:var(--accentFill);border-color:var(--accentFill);color:#fff}.color-legend[data-v-c6390af3]{display:flex;flex-wrap:wrap;gap:.625rem}.legend-item[data-v-c6390af3]{align-items:center;display:flex;font-size:.65rem;gap:.3rem}.legend-swatch[data-v-c6390af3]{border-radius:3px;flex-shrink:0;height:12px;width:12px}.generator-sliders[data-v-c6390af3]{display:flex;flex-direction:column;gap:.375rem}.slider-group[data-v-c6390af3]{align-items:center;display:flex;gap:.5rem}.slider-group label[data-v-c6390af3]{color:var(--textMuted);font-size:.65rem;font-weight:600;min-width:90px}.slider-group input[type=range][data-v-c6390af3]{flex:1}.slider-hint[data-v-c6390af3]{color:var(--textMuted);font-size:.55rem;opacity:.6;white-space:nowrap}.preset-row[data-v-c6390af3]{display:flex;gap:.375rem}.preset-btn[data-v-c6390af3]{background:var(--surface);border:1px solid var(--borderDefault);border-radius:var(--border-radius-sm);color:var(--textMuted);cursor:pointer;font-size:.6rem;padding:.2rem .5rem}.preset-btn.active[data-v-c6390af3]{background:var(--accentFill);border-color:var(--accentFill);color:#fff}.button-grid[data-v-c6390af3]{display:grid;gap:.625rem;grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}.button-demo[data-v-c6390af3]{align-items:center;display:flex;flex-direction:column;gap:.3rem}.demo-btn[data-v-c6390af3]{border:none;border-radius:var(--border-radius-sm);cursor:pointer;font-size:.7rem;font-weight:600;padding:.425rem .875rem;transition:filter .1s,transform .1s;white-space:nowrap}.demo-btn[data-v-c6390af3]:hover{filter:brightness(1.1);transform:translateY(-1px)}.demo-btn[data-v-c6390af3]:active{filter:brightness(.95);transform:translateY(0)}.demo-btn-sm[data-v-c6390af3]{font-size:.625rem;padding:.275rem .55rem}.button-meta[data-v-c6390af3]{align-items:center;display:flex;flex-direction:column;gap:.1rem}.button-meta code[data-v-c6390af3]{color:var(--textMuted);font-family:var(--font-mono,monospace);font-size:.55rem}.button-desc[data-v-c6390af3]{color:var(--textMuted);font-size:.5rem;opacity:.7}.toolbar-demo[data-v-c6390af3]{align-items:center;background:var(--panel-surface,var(--surface));border:1px solid var(--borderDefault);border-radius:var(--border-radius-md);display:flex;gap:.4rem;padding:.5rem .625rem}.toolbar-label[data-v-c6390af3]{color:var(--textMuted);font-size:.6rem;font-weight:600;margin-right:.2rem;white-space:nowrap}.mock-panel--expressive .mock-button-row[data-v-c6390af3],.mock-panel--expressive .mock-list[data-v-c6390af3],.mock-panel--expressive .mock-tags[data-v-c6390af3],.mock-panel--expressive .mock-well[data-v-c6390af3]{background:transparent;border:none;border-radius:var(--border-radius-sm);color:var(--island-text,inherit);padding:.5rem;position:relative}.mock-panel--expressive .mock-card[data-v-c6390af3]{background:transparent;border:none;border-radius:var(--border-radius-sm);color:var(--island-text,inherit);padding:.625rem;position:relative}.mock-panel--expressive .mock-panel__header[data-v-c6390af3]{background:transparent;border-radius:var(--border-radius-sm);color:var(--island-text,inherit);margin:-.375rem -.375rem 0;padding:.5rem;position:relative}.mock-panel--expressive .mock-button-row[data-v-c6390af3]:before,.mock-panel--expressive .mock-list[data-v-c6390af3]:before,.mock-panel--expressive .mock-panel__header[data-v-c6390af3]:before,.mock-panel--expressive .mock-tags[data-v-c6390af3]:before,.mock-panel--expressive .mock-well[data-v-c6390af3]:before{background:oklch(from var(--island-fill) l c h/var(--island-opacity,.92));border-radius:inherit;content:"";inset:0;mix-blend-mode:var(--island-blend,normal);position:absolute;z-index:0}.mock-panel--expressive .mock-card[data-v-c6390af3]:before{background:oklch(from var(--island-elevated,var(--island-fill)) l c h/var(--island-opacity,.92));border-radius:inherit;content:"";inset:0;mix-blend-mode:var(--island-blend,normal);position:absolute;z-index:0}.mock-panel--expressive .mock-button-row[data-v-c6390af3]>*,.mock-panel--expressive .mock-card[data-v-c6390af3]>*,.mock-panel--expressive .mock-list[data-v-c6390af3]>*,.mock-panel--expressive .mock-panel__header[data-v-c6390af3]>*,.mock-panel--expressive .mock-tags[data-v-c6390af3]>*,.mock-panel--expressive .mock-well[data-v-c6390af3]>*{position:relative;z-index:1}.mock-panel--expressive .mock-panel__fill[data-v-c6390af3]{filter:blur(var(--island-blur,4px))}.mock-panel--calm[data-v-c6390af3]:after,.mock-panel--expressive[data-v-c6390af3]:after{bottom:4px;font-size:.5rem;font-weight:600;letter-spacing:.5px;opacity:.4;position:absolute;right:6px;text-transform:uppercase}.mock-panel--expressive[data-v-c6390af3]:after{content:"expressive"}.mock-panel--calm[data-v-c6390af3]:after{content:"calm"}.fill-presets[data-v-c6390af3]{display:flex;flex-wrap:wrap;gap:.25rem}.fill-preset-btn[data-v-c6390af3]{background:var(--surface);border:1px solid var(--borderDefault);border-radius:var(--border-radius-sm);color:var(--textMuted);cursor:pointer;font-size:.6rem;padding:.2rem .5rem;transition:border-color .1s}.fill-preset-btn[data-v-c6390af3]:hover{border-color:var(--textMuted)}.fill-preset-btn.active[data-v-c6390af3]{background:var(--accentFill);border-color:var(--accentFill);color:#fff}.fill-hint[data-v-c6390af3]{font-size:.55rem;font-style:italic;line-height:1.4;opacity:.7}.fill-hint[data-v-c6390af3],.fill-info[data-v-c6390af3]{color:var(--textMuted)}.fill-info[data-v-c6390af3]{align-items:center;display:flex;font-size:.575rem;gap:.5rem}.fill-layer-count[data-v-c6390af3]{font-weight:600}.fill-mode-tip[data-v-c6390af3]{font-style:italic;opacity:.7}.css-output summary[data-v-c6390af3]{color:var(--textMuted);cursor:pointer;font-size:.7rem;font-weight:500}.css-output pre[data-v-c6390af3]{background:var(--surface);border-radius:var(--border-radius-sm);font-size:.6rem;line-height:1.5;margin:.375rem 0 0;overflow-x:auto;padding:.625rem}