.page-header.svelte-1swhhho{margin-bottom:var(--space-2xl);padding-bottom:var(--space-xl);border-bottom:1px solid var(--color-border-default)}.page-title.svelte-1swhhho{font-size:var(--text-display);font-weight:var(--font-bold);color:var(--color-fg-primary);margin-bottom:var(--space-md);letter-spacing:var(--tracking-tight)}.page-description.svelte-1swhhho{font-size:var(--text-body-lg);color:var(--color-fg-secondary);line-height:var(--leading-relaxed);max-width:700px;margin:0}.section.svelte-1swhhho{margin-bottom:var(--space-2xl)}.section-title.svelte-1swhhho{font-size:var(--text-h2);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin-bottom:var(--space-sm)}.section-description.svelte-1swhhho{font-size:var(--text-body);color:var(--color-fg-secondary);margin-bottom:var(--space-lg);line-height:var(--leading-relaxed)}.problem-grid.svelte-1swhhho{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-md)}.problem-item.svelte-1swhhho{padding:var(--space-md);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-lg)}.problem-item.svelte-1swhhho h3:where(.svelte-1swhhho){font-size:var(--text-body);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin-bottom:var(--space-xs)}.problem-item.svelte-1swhhho p:where(.svelte-1swhhho){font-size:var(--text-body-sm);color:var(--color-fg-secondary);margin:0}.example-group.svelte-1swhhho{margin-bottom:var(--space-xl)}.example-title.svelte-1swhhho{font-size:var(--text-h3);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin-bottom:var(--space-xs)}.example-description.svelte-1swhhho{font-size:var(--text-body-sm);color:var(--color-fg-secondary);margin-bottom:var(--space-md)}.preview.svelte-1swhhho{padding:var(--space-xl);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);margin-bottom:var(--space-md)}.demo-form.svelte-1swhhho{max-width:400px}.demo-form-horizontal.svelte-1swhhho{max-width:100%;display:flex;gap:var(--space-md);flex-wrap:wrap}.demo-form-horizontal.svelte-1swhhho .demo-field:where(.svelte-1swhhho){flex:1;min-width:150px}.demo-field.svelte-1swhhho{display:flex;flex-direction:column;gap:var(--space-xs)}.demo-label.svelte-1swhhho{font-size:var(--text-body-sm);font-weight:var(--font-medium);color:var(--color-fg-secondary)}.demo-label-sm.svelte-1swhhho{font-size:var(--text-caption)}.demo-label-lg.svelte-1swhhho{font-size:var(--text-body)}.demo-required.svelte-1swhhho{color:var(--color-error);margin-left:2px}.demo-input.svelte-1swhhho{width:100%;padding:var(--space-sm) var(--space-md);background:var(--color-bg-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-md);color:var(--color-fg-primary);font-size:var(--text-body);font-family:inherit;transition:border-color var(--duration-micro) var(--ease-standard),box-shadow var(--duration-micro) var(--ease-standard);min-height:44px}.demo-input.svelte-1swhhho::-moz-placeholder{color:var(--color-fg-muted)}.demo-input.svelte-1swhhho::placeholder{color:var(--color-fg-muted)}.demo-input.svelte-1swhhho:hover:not(:focus){border-color:var(--color-border-emphasis)}.demo-input.svelte-1swhhho:focus{outline:none;border-color:var(--color-border-emphasis);box-shadow:0 0 0 3px var(--color-focus)}.demo-input-sm.svelte-1swhhho{padding:var(--space-xs) var(--space-sm);font-size:var(--text-body-sm);min-height:36px}.demo-input-lg.svelte-1swhhho{padding:var(--space-md) var(--space-lg);font-size:var(--text-body-lg);min-height:52px}.demo-input-error.svelte-1swhhho{border-color:var(--color-error)}.demo-input-error.svelte-1swhhho:focus{box-shadow:0 0 0 3px var(--color-error-muted)}.demo-textarea.svelte-1swhhho{resize:vertical;min-height:80px}.demo-description.svelte-1swhhho{font-size:var(--text-caption);color:var(--color-fg-muted);margin:0}.demo-error.svelte-1swhhho{font-size:var(--text-caption);color:var(--color-error);margin:0}.demo-checkbox-group.svelte-1swhhho{display:flex;flex-direction:column;gap:var(--space-sm)}.demo-checkbox.svelte-1swhhho{display:flex;align-items:center;gap:var(--space-sm);cursor:pointer}.demo-checkbox-input.svelte-1swhhho{position:absolute;opacity:0;width:0;height:0}.demo-checkbox-box.svelte-1swhhho{width:20px;height:20px;border:1px solid var(--color-border-default);border-radius:var(--radius-sm);background:var(--color-bg-elevated);transition:all var(--duration-micro) var(--ease-standard);display:flex;align-items:center;justify-content:center}.demo-checkbox-input.svelte-1swhhho:checked+.demo-checkbox-box:where(.svelte-1swhhho){background:var(--color-fg-primary);border-color:var(--color-fg-primary)}.demo-checkbox-input.svelte-1swhhho:checked+.demo-checkbox-box:where(.svelte-1swhhho):after{content:"";width:5px;height:10px;border:solid var(--color-bg-pure);border-width:0 2px 2px 0;transform:rotate(45deg);margin-bottom:2px}.demo-checkbox-input.svelte-1swhhho:focus-visible+.demo-checkbox-box:where(.svelte-1swhhho){box-shadow:0 0 0 3px var(--color-focus)}.demo-checkbox-input.svelte-1swhhho:disabled+.demo-checkbox-box:where(.svelte-1swhhho){opacity:.5}.demo-checkbox-input.svelte-1swhhho:disabled~.demo-checkbox-label:where(.svelte-1swhhho){opacity:.5}.demo-checkbox-label.svelte-1swhhho{font-size:var(--text-body-sm);color:var(--color-fg-secondary)}.demo-radio-group.svelte-1swhhho{border:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-sm)}.demo-legend.svelte-1swhhho{font-size:var(--text-body-sm);font-weight:var(--font-medium);color:var(--color-fg-secondary);margin-bottom:var(--space-sm)}.demo-radio.svelte-1swhhho{display:flex;align-items:flex-start;gap:var(--space-sm);cursor:pointer;padding:var(--space-sm);border:1px solid var(--color-border-default);border-radius:var(--radius-md);transition:border-color var(--duration-micro) var(--ease-standard)}.demo-radio.svelte-1swhhho:hover{border-color:var(--color-border-emphasis)}.demo-radio-input.svelte-1swhhho{position:absolute;opacity:0;width:0;height:0}.demo-radio-circle.svelte-1swhhho{width:20px;height:20px;border:1px solid var(--color-border-default);border-radius:var(--radius-full);background:var(--color-bg-elevated);transition:all var(--duration-micro) var(--ease-standard);flex-shrink:0;margin-top:2px}.demo-radio-input.svelte-1swhhho:checked+.demo-radio-circle:where(.svelte-1swhhho){border-color:var(--color-fg-primary);border-width:6px}.demo-radio-input.svelte-1swhhho:focus-visible+.demo-radio-circle:where(.svelte-1swhhho){box-shadow:0 0 0 3px var(--color-focus)}.demo-radio-content.svelte-1swhhho{display:flex;flex-direction:column}.demo-radio-label.svelte-1swhhho{font-size:var(--text-body-sm);font-weight:var(--font-medium);color:var(--color-fg-primary)}.demo-radio-description.svelte-1swhhho{font-size:var(--text-caption);color:var(--color-fg-muted)}.demo-switch-container.svelte-1swhhho{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.demo-switch-label.svelte-1swhhho{font-size:var(--text-body-sm);color:var(--color-fg-secondary)}.demo-switch.svelte-1swhhho{width:44px;height:24px;background:var(--color-bg-subtle);border:none;border-radius:var(--radius-full);cursor:pointer;position:relative;transition:background var(--duration-micro) var(--ease-standard)}.demo-switch-on.svelte-1swhhho{background:var(--color-fg-primary)}.demo-switch-thumb.svelte-1swhhho{position:absolute;top:2px;left:2px;width:20px;height:20px;background:var(--color-bg-pure);border-radius:var(--radius-full);transition:transform var(--duration-micro) var(--ease-standard);box-shadow:var(--shadow-sm)}.demo-switch-on.svelte-1swhhho .demo-switch-thumb:where(.svelte-1swhhho){transform:translate(20px)}.demo-form-layout.svelte-1swhhho{max-width:500px;display:flex;flex-direction:column;gap:var(--space-lg)}.demo-form-header.svelte-1swhhho{display:flex;flex-direction:column;gap:var(--space-xs)}.demo-form-title.svelte-1swhhho{font-size:var(--text-h3);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin:0}.demo-form-description.svelte-1swhhho{font-size:var(--text-body);color:var(--color-fg-secondary);margin:0}.demo-form-content.svelte-1swhhho{display:flex;flex-direction:column;gap:var(--space-md)}.demo-form-two-column.svelte-1swhhho{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md)}.demo-form-actions.svelte-1swhhho{display:flex;gap:var(--space-sm);justify-content:flex-end;padding-top:var(--space-md);border-top:1px solid var(--color-border-default)}.demo-btn.svelte-1swhhho{padding:var(--space-sm) var(--space-lg);font-size:var(--text-body);font-weight:var(--font-medium);border-radius:var(--radius-md);cursor:pointer;transition:all var(--duration-micro) var(--ease-standard);border:none}.demo-btn-primary.svelte-1swhhho{background:var(--color-fg-primary);color:var(--color-bg-pure)}.demo-btn-primary.svelte-1swhhho:hover{opacity:.9}.demo-btn-ghost.svelte-1swhhho{background:transparent;color:var(--color-fg-secondary)}.demo-btn-ghost.svelte-1swhhho:hover{background:var(--color-hover);color:var(--color-fg-primary)}.demo-steps.svelte-1swhhho{width:100%}.demo-steps-list.svelte-1swhhho{display:flex;list-style:none;margin:0;padding:0}.demo-step.svelte-1swhhho{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);position:relative}.demo-step.svelte-1swhhho:not(:last-child):after{content:"";position:absolute;top:12px;left:50%;width:100%;height:2px;background:var(--color-border-default)}.demo-step-complete.svelte-1swhhho:after{background:var(--color-fg-primary)}.demo-step-indicator.svelte-1swhhho{width:24px;height:24px;border-radius:var(--radius-full);background:var(--color-bg-subtle);border:2px solid var(--color-border-default);display:flex;align-items:center;justify-content:center;font-size:var(--text-caption);font-weight:var(--font-semibold);color:var(--color-fg-muted);position:relative;z-index:1}.demo-step-complete.svelte-1swhhho .demo-step-indicator:where(.svelte-1swhhho){background:var(--color-fg-primary);border-color:var(--color-fg-primary);color:var(--color-bg-pure)}.demo-step-current.svelte-1swhhho .demo-step-indicator:where(.svelte-1swhhho){border-color:var(--color-fg-primary);color:var(--color-fg-primary)}.demo-step-label.svelte-1swhhho{font-size:var(--text-caption);color:var(--color-fg-muted)}.demo-step-current.svelte-1swhhho .demo-step-label:where(.svelte-1swhhho){color:var(--color-fg-primary);font-weight:var(--font-medium)}.validation-grid.svelte-1swhhho{display:grid;gap:var(--space-lg)}.validation-item.svelte-1swhhho{padding:var(--space-lg);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-lg)}.validation-item.svelte-1swhhho h3:where(.svelte-1swhhho){font-size:var(--text-body);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin-bottom:var(--space-xs)}.validation-item.svelte-1swhhho p:where(.svelte-1swhhho){font-size:var(--text-body-sm);color:var(--color-fg-secondary);margin-bottom:var(--space-md)}.a11y-grid.svelte-1swhhho{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-md)}.a11y-item.svelte-1swhhho{padding:var(--space-md);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-lg)}.a11y-item.svelte-1swhhho h4:where(.svelte-1swhhho){font-size:var(--text-body);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin-bottom:var(--space-sm)}.a11y-item.svelte-1swhhho ul:where(.svelte-1swhhho){margin:0;padding-left:var(--space-md)}.a11y-item.svelte-1swhhho li:where(.svelte-1swhhho){font-size:var(--text-body-sm);color:var(--color-fg-secondary);margin-bottom:var(--space-xs)}.a11y-item.svelte-1swhhho code:where(.svelte-1swhhho){font-family:var(--font-mono);font-size:var(--text-caption);background:var(--color-bg-subtle);padding:2px 4px;border-radius:var(--radius-sm)}.token-table.svelte-1swhhho{background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);overflow:hidden}.token-row.svelte-1swhhho{display:grid;grid-template-columns:1fr 2fr;gap:var(--space-md);padding:var(--space-md);border-bottom:1px solid var(--color-border-default)}.token-row.svelte-1swhhho:last-child{border-bottom:none}.token-row.svelte-1swhhho code:where(.svelte-1swhhho){font-family:var(--font-mono);font-size:var(--text-body-sm);color:var(--color-fg-primary);font-weight:var(--font-medium)}.token-row.svelte-1swhhho span:where(.svelte-1swhhho){font-size:var(--text-body-sm);color:var(--color-fg-secondary)}.anti-patterns.svelte-1swhhho{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-md)}.anti-pattern.svelte-1swhhho{padding:var(--space-md);background:var(--color-bg-surface);border:1px solid var(--color-error-border);border-radius:var(--radius-lg)}.anti-pattern.svelte-1swhhho h4:where(.svelte-1swhhho){font-size:var(--text-body);font-weight:var(--font-semibold);color:var(--color-error);margin-bottom:var(--space-xs)}.anti-pattern.svelte-1swhhho p:where(.svelte-1swhhho){font-size:var(--text-body-sm);color:var(--color-fg-secondary);margin:0}@media(prefers-reduced-motion:reduce){.demo-input.svelte-1swhhho,.demo-checkbox-box.svelte-1swhhho,.demo-radio-circle.svelte-1swhhho,.demo-radio.svelte-1swhhho,.demo-switch.svelte-1swhhho,.demo-switch-thumb.svelte-1swhhho,.demo-btn.svelte-1swhhho{transition:none}}