.page-container.svelte-kx85w3{max-width:var(--lg-container-xl);margin:0 auto;padding:var(--lg-space-8)}.page-header.svelte-kx85w3{text-align:center;margin-bottom:var(--lg-space-12)}.page-header.svelte-kx85w3 h1:where(.svelte-kx85w3){font-size:var(--lg-text-5xl);font-weight:var(--lg-font-bold);color:var(--lg-text-primary);margin-bottom:var(--lg-space-4)}.subtitle.svelte-kx85w3{font-size:var(--lg-text-xl);color:var(--lg-text-secondary);max-width:600px;margin:0 auto;line-height:var(--lg-leading-relaxed)}.section.svelte-kx85w3{background:var(--lg-bg-primary);border-radius:var(--lg-radius-xl);padding:var(--lg-space-10);margin-bottom:var(--lg-space-8);border:2px solid var(--lg-border-light);box-shadow:var(--lg-shadow-sm)}.section.svelte-kx85w3 h2:where(.svelte-kx85w3){display:flex;align-items:center;gap:var(--lg-space-3);font-size:var(--lg-text-3xl);font-weight:var(--lg-font-semibold);color:var(--lg-text-primary);margin-bottom:var(--lg-space-4)}.section-description.svelte-kx85w3{color:var(--lg-text-secondary);line-height:var(--lg-leading-relaxed);margin-bottom:var(--lg-space-8);max-width:800px}.color-grid.svelte-kx85w3{display:grid;gap:var(--lg-space-8)}.color-group.svelte-kx85w3 h3:where(.svelte-kx85w3){font-size:var(--lg-text-lg);font-weight:var(--lg-font-semibold);margin-bottom:var(--lg-space-4);color:var(--lg-text-primary)}.color-swatches.svelte-kx85w3{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--lg-space-4)}.color-swatch.svelte-kx85w3{background:var(--lg-bg-secondary);border-radius:var(--lg-radius-lg);overflow:hidden;border:1px solid var(--lg-border-light);transition:transform var(--lg-transition-fast),box-shadow var(--lg-transition-fast)}.color-swatch.svelte-kx85w3:hover{transform:translateY(-2px);box-shadow:var(--lg-shadow-md)}.color-preview.svelte-kx85w3{height:var(--lg-space-20);background:var(--color)}.color-info.svelte-kx85w3{padding:var(--lg-space-4);display:flex;flex-direction:column;gap:var(--lg-space-1)}.color-name.svelte-kx85w3{font-weight:var(--lg-font-semibold);color:var(--lg-text-primary)}.color-value.svelte-kx85w3{font-family:var(--lg-font-mono);font-size:var(--lg-text-sm);color:var(--lg-text-muted)}.color-swatch.dark-preview.svelte-kx85w3 .color-info:where(.svelte-kx85w3){background:var(--lg-bg-primary)!important;border-color:var(--lg-border-secondary)!important}.color-swatch.dark-preview.svelte-kx85w3 .color-name:where(.svelte-kx85w3){color:var(--lg-text-primary)!important}.color-swatch.dark-preview.svelte-kx85w3 .color-value:where(.svelte-kx85w3){color:var(--lg-text-secondary)!important}.typography-examples.svelte-kx85w3{display:flex;flex-direction:column;gap:var(--lg-space-5)}.type-example.svelte-kx85w3{padding:var(--lg-space-5);background:var(--lg-bg-secondary);border-radius:var(--lg-radius-lg);border:1px solid var(--lg-border-light)}.type-example.svelte-kx85w3 code:where(.svelte-kx85w3){display:block;margin-top:var(--lg-space-3);font-size:var(--lg-text-sm);color:var(--lg-primary);background:var(--lg-bg-primary);padding:var(--lg-space-2) var(--lg-space-3);border-radius:var(--lg-radius-sm);border:1px solid var(--lg-border-light)}.type-h1.svelte-kx85w3{font-size:var(--lg-text-4xl);font-weight:var(--lg-font-bold);margin:0}.type-h2.svelte-kx85w3{font-size:var(--lg-text-3xl);font-weight:var(--lg-font-semibold);margin:0}.type-h3.svelte-kx85w3{font-size:var(--lg-text-2xl);font-weight:var(--lg-font-semibold);margin:0}.type-body.svelte-kx85w3{font-size:var(--lg-text-base);line-height:var(--lg-leading-relaxed);margin:0}.type-small.svelte-kx85w3{font-size:var(--lg-text-sm);color:var(--lg-text-muted);margin:0}.spacing-examples.svelte-kx85w3{display:flex;flex-wrap:wrap;gap:var(--lg-space-5);align-items:flex-end}.spacing-item.svelte-kx85w3{text-align:center}.spacing-box.svelte-kx85w3{background:var(--lg-primary);border-radius:var(--lg-radius-sm);margin-bottom:var(--lg-space-2)}.spacing-info.svelte-kx85w3{display:flex;flex-direction:column;gap:var(--lg-space-1)}.spacing-name.svelte-kx85w3{font-size:var(--lg-text-sm);font-weight:var(--lg-font-semibold);color:var(--lg-text-primary)}.spacing-value.svelte-kx85w3{font-size:var(--lg-text-xs);color:var(--lg-text-muted);font-family:var(--lg-font-mono)}.interactive-examples.svelte-kx85w3{display:flex;flex-wrap:wrap;gap:var(--lg-space-4);align-items:center}.example-button.svelte-kx85w3{padding:var(--lg-space-3) var(--lg-space-5);border:2px solid var(--lg-border-primary);background:var(--lg-bg-primary);border-radius:var(--lg-radius-md);font-weight:var(--lg-font-semibold);cursor:pointer;transition:var(--lg-transition-fast)}.example-button.svelte-kx85w3:hover{border-color:var(--lg-primary);background:var(--lg-accent-light);transform:translateY(-1px);box-shadow:var(--lg-shadow-md)}.example-button.svelte-kx85w3:active{transform:translateY(0)}.example-button--primary.svelte-kx85w3{background:var(--lg-primary);color:var(--lg-text-white);border-color:var(--lg-primary)}.example-button--primary.svelte-kx85w3:hover{background:var(--lg-primary-hover);border-color:var(--lg-primary-hover)}.example-button.svelte-kx85w3:disabled{opacity:.5;cursor:not-allowed}.example-button.svelte-kx85w3:disabled:hover{transform:none;box-shadow:none}.input-examples.svelte-kx85w3{display:flex;gap:var(--lg-space-4);flex-wrap:wrap}.example-input.svelte-kx85w3,.example-select.svelte-kx85w3{padding:var(--lg-space-3) var(--lg-space-4);border:2px solid var(--lg-border-primary);border-radius:var(--lg-radius-md);font-size:var(--lg-text-base);transition:var(--lg-transition-fast);min-width:200px}.example-input.svelte-kx85w3:focus,.example-select.svelte-kx85w3:focus{outline:none;border-color:var(--lg-primary);box-shadow:var(--lg-focus-ring)}.principles-grid.svelte-kx85w3{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--lg-space-5)}.principle-card.svelte-kx85w3{background:var(--lg-gradient-warm);padding:var(--lg-space-5);border-radius:var(--lg-radius-lg);border:1px solid var(--lg-border-light);transition:transform var(--lg-transition-fast),box-shadow var(--lg-transition-fast)}.principle-card.svelte-kx85w3:hover{transform:translateY(-4px);box-shadow:var(--lg-shadow-lg)}.principle-card.svelte-kx85w3 h3:where(.svelte-kx85w3){font-size:var(--lg-text-lg);font-weight:var(--lg-font-semibold);margin-bottom:var(--lg-space-2);color:var(--lg-text-primary)}.principle-card.svelte-kx85w3 p:where(.svelte-kx85w3){font-size:var(--lg-text-sm);color:var(--lg-text-secondary);line-height:var(--lg-leading-relaxed);margin:0}@media (max-width: 768px){.page-container.svelte-kx85w3{padding:var(--lg-space-4)}.page-header.svelte-kx85w3 h1:where(.svelte-kx85w3){font-size:var(--lg-text-3xl)}.section.svelte-kx85w3{padding:var(--lg-space-5)}.color-swatches.svelte-kx85w3{grid-template-columns:1fr}.spacing-examples.svelte-kx85w3{justify-content:space-between}.interactive-examples.svelte-kx85w3{flex-direction:column;align-items:stretch}.input-examples.svelte-kx85w3{flex-direction:column}.example-input.svelte-kx85w3,.example-select.svelte-kx85w3{width:100%}}.dark-mode-override .section.svelte-kx85w3{background:var(--lg-gray-800);border-color:var(--lg-gray-700)}.dark-mode-override .page-header.svelte-kx85w3 h1:where(.svelte-kx85w3){color:var(--lg-primary)}.dark-mode-override .subtitle.svelte-kx85w3,.dark-mode-override .section-description.svelte-kx85w3{color:var(--lg-gray-300)}.dark-mode-override .color-group.svelte-kx85w3 h3:where(.svelte-kx85w3){color:var(--lg-gray-100)}.dark-mode-override .color-swatch.svelte-kx85w3,.dark-mode-override .color-info.svelte-kx85w3{background:var(--lg-gray-800);border-color:var(--lg-gray-700)}.dark-mode-override .color-name.svelte-kx85w3{color:var(--lg-gray-100)}.dark-mode-override .color-value.svelte-kx85w3{color:var(--lg-gray-300)}.dark-mode-override .spacing-item.svelte-kx85w3{background:var(--lg-gray-800);border-color:var(--lg-gray-700)}.dark-mode-override .spacing-value.svelte-kx85w3{color:var(--lg-gray-300)}.dark-mode-override .example-input.svelte-kx85w3,.dark-mode-override .example-select.svelte-kx85w3{background:var(--lg-gray-800);border-color:var(--lg-border-secondary);color:var(--lg-gray-100)}.dark-mode-override .example-input.svelte-kx85w3:focus,.dark-mode-override .example-select.svelte-kx85w3:focus{border-color:var(--lg-primary);box-shadow:var(--lg-focus-ring)}.dark-mode-override .type-example.svelte-kx85w3{background:var(--lg-gray-800);border-color:var(--lg-gray-700)}.dark-mode-override .type-example.svelte-kx85w3 code:where(.svelte-kx85w3){background:var(--lg-bg-tertiary);border-color:var(--lg-border-secondary);color:var(--lg-accent)}.dark-mode-override .type-h1.svelte-kx85w3,.dark-mode-override .type-h2.svelte-kx85w3,.dark-mode-override .type-h3.svelte-kx85w3,.dark-mode-override .type-body.svelte-kx85w3{color:var(--lg-gray-100)}.dark-mode-override .type-small.svelte-kx85w3{color:var(--lg-text-light)}