.token-swatch:where(.astro-awgp4hnv){flex-direction:column;min-width:72px;display:flex}.token-swatch__color:where(.astro-awgp4hnv){border:1px solid #0000000f;border-bottom:none;border-radius:8px 8px 0 0;align-items:flex-end;height:56px;padding:6px 8px;display:flex}:root[data-theme=dark] .token-swatch__color:where(.astro-awgp4hnv){border-color:#ffffff14}.token-swatch__shade:where(.astro-awgp4hnv){opacity:.8;font-size:11px;font-weight:600}.token-swatch__meta:where(.astro-awgp4hnv){background:var(--sl-color-gray-1);border:1px solid var(--sl-color-gray-2);border-top:none;border-radius:0 0 8px 8px;flex-direction:column;gap:2px;padding:6px 8px;display:flex}.token-swatch__hex:where(.astro-awgp4hnv){color:var(--sl-color-gray-5);font-size:11px;font-weight:500;background:0 0!important;border:none!important;padding:0!important}.token-swatch__var:where(.astro-awgp4hnv){color:var(--sl-color-gray-3);word-break:break-all;font-size:9px;background:0 0!important;border:none!important;padding:0!important}.spacing-scale:where(.astro-an5bec3u){flex-direction:column;gap:8px;display:flex}.spacing-row:where(.astro-an5bec3u){align-items:center;gap:12px;display:flex}.spacing-label:where(.astro-an5bec3u){flex-shrink:0;align-items:baseline;gap:6px;width:100px;display:flex}.spacing-name:where(.astro-an5bec3u){color:var(--sl-color-gray-5);font-size:13px;font-weight:600;background:0 0!important;border:none!important;padding:0!important}.spacing-value:where(.astro-an5bec3u){color:var(--sl-color-gray-3);font-size:12px}.spacing-bar-container:where(.astro-an5bec3u){flex:1;align-items:center;height:24px;display:flex}.spacing-bar:where(.astro-an5bec3u){background:var(--sl-color-accent);opacity:.7;border-radius:4px;min-width:4px;height:100%;transition:opacity .15s}.spacing-row:where(.astro-an5bec3u):hover .spacing-bar:where(.astro-an5bec3u){opacity:1}.spacing-var:where(.astro-an5bec3u){color:var(--sl-color-gray-3);flex-shrink:0;font-size:11px;background:0 0!important;border:none!important;padding:0!important}.typography-samples:where(.astro-5xrq5tyi){flex-direction:column;gap:8px;display:flex}.type-section-title:where(.astro-5xrq5tyi){color:var(--sl-color-gray-5);border-bottom:1px solid var(--sl-color-gray-2);margin:16px 0 8px;padding-bottom:6px;font-size:14px;font-weight:600}.type-section-title:where(.astro-5xrq5tyi):first-child{margin-top:0}.font-family-grid:where(.astro-5xrq5tyi){flex-direction:column;gap:12px;display:flex}.font-family-card:where(.astro-5xrq5tyi){background:var(--sl-color-gray-1);border:1px solid var(--sl-color-gray-2);border-radius:8px;padding:16px}.font-family-sample:where(.astro-5xrq5tyi){color:var(--sl-color-gray-5);margin-bottom:8px;font-size:16px;display:block}.font-family-meta:where(.astro-5xrq5tyi){align-items:baseline;gap:12px;display:flex}.font-family-name:where(.astro-5xrq5tyi){color:var(--sl-color-accent);font-size:13px;font-weight:600;background:0 0!important;border:none!important;padding:0!important}.font-family-var:where(.astro-5xrq5tyi){color:var(--sl-color-gray-3);font-size:11px;background:0 0!important;border:none!important;padding:0!important}.font-size-list:where(.astro-5xrq5tyi){flex-direction:column;gap:6px;display:flex}.font-size-row:where(.astro-5xrq5tyi){align-items:baseline;gap:12px;padding:4px 0;display:flex}.font-size-label:where(.astro-5xrq5tyi){flex-shrink:0;align-items:baseline;gap:6px;width:90px;display:flex}.fs-name:where(.astro-5xrq5tyi){color:var(--sl-color-gray-5);font-size:13px;font-weight:600;background:0 0!important;border:none!important;padding:0!important}.fs-value:where(.astro-5xrq5tyi){color:var(--sl-color-gray-3);font-size:11px}.font-size-sample:where(.astro-5xrq5tyi){color:var(--sl-color-gray-5);flex:1;line-height:1.3}.fs-var:where(.astro-5xrq5tyi){color:var(--sl-color-gray-3);flex-shrink:0;font-size:10px;background:0 0!important;border:none!important;padding:0!important}.font-weight-list:where(.astro-5xrq5tyi){flex-direction:column;gap:6px;display:flex}.font-weight-row:where(.astro-5xrq5tyi){align-items:baseline;gap:12px;padding:4px 0;display:flex}.fw-name:where(.astro-5xrq5tyi){width:80px;color:var(--sl-color-gray-5);flex-shrink:0;font-size:13px;font-weight:600;background:0 0!important;border:none!important;padding:0!important}.font-weight-sample:where(.astro-5xrq5tyi){color:var(--sl-color-gray-5);flex:1;font-size:16px}.fw-value:where(.astro-5xrq5tyi){color:var(--sl-color-gray-3);flex-shrink:0;font-size:12px}.line-height-list:where(.astro-5xrq5tyi){flex-direction:column;gap:12px;display:flex}.line-height-row:where(.astro-5xrq5tyi){align-items:start;gap:12px;display:flex}.lh-name:where(.astro-5xrq5tyi){width:70px;color:var(--sl-color-gray-5);flex-shrink:0;padding-top:2px;font-size:13px;font-weight:600;background:0 0!important;border:none!important;padding-left:0!important;padding-right:0!important}.line-height-sample:where(.astro-5xrq5tyi){color:var(--sl-color-gray-4);background:var(--sl-color-gray-1);border:1px solid var(--sl-color-gray-2);border-radius:6px;flex:1;padding:8px 12px;font-size:14px}.lh-value:where(.astro-5xrq5tyi){color:var(--sl-color-gray-3);flex-shrink:0;padding-top:10px;font-size:12px}.shadow-grid:where(.astro-zsucfu35){grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px;display:grid}.shadow-card:where(.astro-zsucfu35){flex-direction:column;gap:12px;display:flex}.shadow-preview:where(.astro-zsucfu35){background:var(--sl-color-white);border:1px solid var(--sl-color-gray-2);border-radius:12px;height:80px;transition:transform .15s}:root[data-theme=dark] .shadow-preview:where(.astro-zsucfu35){background:var(--sl-color-gray-1)}.shadow-card:where(.astro-zsucfu35):hover .shadow-preview:where(.astro-zsucfu35){transform:translateY(-2px)}.shadow-meta:where(.astro-zsucfu35){flex-direction:column;gap:2px;display:flex}.shadow-name:where(.astro-zsucfu35){color:var(--sl-color-gray-5);font-size:13px;font-weight:600;background:0 0!important;border:none!important;padding:0!important}.shadow-value:where(.astro-zsucfu35){color:var(--sl-color-gray-4);font-size:11px;background:0 0!important;border:none!important;padding:0!important}.shadow-var:where(.astro-zsucfu35){color:var(--sl-color-gray-3);font-size:10px;background:0 0!important;border:none!important;padding:0!important}