.typography-token-chip{display:inline-block;font-family:var(--ux4g-typography-fontFamily-mono, monospace);font-size:.75rem;color:var(--ux4g-text-primary, #4a2bc2);background-color:var(--ux4g-bg-primary-soft, #dcd4ff);padding:.25rem .625rem;border-radius:var(--ux4g-radius-m, 8px);white-space:nowrap}.typography-class-chip{display:inline-block;font-family:var(--ux4g-typography-fontFamily-mono, monospace);font-size:.75rem;color:var(--ux4g-text-primary, #4a2bc2);background-color:var(--ux4g-bg-primary-soft, #dcd4ff);padding:.125rem .375rem;border-radius:var(--ux4g-radius-s, 4px);align-self:flex-start}.typography-tag-chip{display:inline-block;font-family:var(--ux4g-typography-fontFamily-mono, monospace);font-size:.6875rem;color:var(--ux4g-text-neutral-tertiary, #737373);background-color:var(--ux4g-bg-neutral-subtle, #e5e5e5);padding:.125rem .375rem;border-radius:var(--ux4g-radius-s, 4px)}.typography-toggle-group{display:inline-flex;flex-shrink:0;border-radius:var(--ux4g-radius-full, 9999px);background-color:var(--ux4g-bg-neutral-subtle, #e5e5e5);padding:3px}.typography-toggle-btn{cursor:pointer;border-radius:var(--ux4g-radius-full, 9999px);padding:.25rem .75rem;font-size:.75rem;font-weight:var(--ux4g-fw-semibold, 600);border:none;background:transparent;color:var(--ux4g-text-neutral-secondary, #404040);transition:all var(--ux4g-transition-duration-fast, .15s) ease}.typography-toggle-btn:hover{color:var(--ux4g-text-neutral-primary, #171717)}.typography-toggle-btn.is-active{background-color:var(--ux4g-bg-neutral-elevated, #ffffff);color:var(--ux4g-text-primary, #4a2bc2);box-shadow:var(--ux4g-shadow-l1)}.typography-callout{border-radius:var(--ux4g-radius-xl, 16px);border:var(--ux4g-border-thin, 1px) solid var(--ux4g-border-color-neutral-subtle, #e5e5e5);background-color:var(--ux4g-bg-neutral, #fafafa);padding:var(--ux4g-space-8, 1.5rem);font-size:.875rem;color:var(--ux4g-text-neutral-secondary, #404040);box-shadow:var(--ux4g-shadow-l1)}.typography-code-block{border-radius:var(--ux4g-radius-xl, 16px);border:var(--ux4g-border-thin, 1px) solid var(--ux4g-border-color-neutral-subtle, #e5e5e5);background-color:var(--ux4g-bg-neutral, #fafafa);padding:var(--ux4g-space-8, 1.5rem);font-family:var(--ux4g-typography-fontFamily-mono, monospace);font-size:.875rem;box-shadow:var(--ux4g-shadow-l1)}.typography-hero-glow{position:absolute;width:15rem;height:15rem;border-radius:var(--ux4g-radius-full, 9999px);background:var(--ux4g-bg-primary-soft, #dcd4ff);filter:blur(50px);opacity:.5;pointer-events:none;z-index:0;transform:translate(15%,-10%)}.typography-illustration{position:relative;z-index:1;width:17rem;min-height:16.5rem;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:var(--ux4g-space-3, .45rem);border-radius:var(--ux4g-radius-2xl, 24px);background-color:var(--ux4g-bg-neutral-elevated, #ffffff);border:var(--ux4g-border-thin, 1px) solid var(--ux4g-border-color-neutral-subtle, #e5e5e5);padding:var(--ux4g-space-8, 1.75rem);box-shadow:var(--ux4g-shadow-l1)}.typography-bar{border-radius:var(--ux4g-radius-s, 4px);display:block}.typography-bar-h1{height:1.25rem;width:68%;background-color:var(--ux4g-text-neutral-primary, #171717)}.typography-bar-h2{height:.9rem;width:95%;background-color:var(--ux4g-text-neutral-secondary, #525252);margin-top:2px}.typography-bar-h3{height:.9rem;width:80%;background-color:var(--ux4g-text-neutral-secondary, #525252)}.typography-bar-body1{height:.65rem;width:60%;background-color:var(--ux4g-text-neutral-tertiary, #a1a1a1);margin-top:6px}.typography-bar-body2{height:.65rem;width:92%;background-color:var(--ux4g-text-neutral-tertiary, #a1a1a1)}.typography-bar-body3{height:.65rem;width:76%;background-color:var(--ux4g-text-neutral-tertiary, #a1a1a1)}.typography-bar-caption{height:.5rem;width:45%;background-color:var(--ux4g-bg-neutral-emphasis, #d9d9d9);margin-top:4px}.typography-link{font-size:var(--ux4g-fs-14, .875rem);font-weight:var(--ux4g-fw-medium, 500);color:var(--ux4g-text-primary, #4a2bc2);text-decoration:none;transition:color var(--ux4g-transition-duration-fast, .15s) ease}.typography-link:hover{text-decoration:underline;color:var(--ux4g-text-link-default-hover, #3d239f)}