:root{--sac-radius:12px;--sac-spacing:18px;--sac-border:#d9e0e7;--sac-bg:#fff;--sac-text:#17212b;--sac-muted:#5d6b78;--sac-tone-success:#087a4b;--sac-tone-primary:#0b4a6f;--sac-tone-info:#2271b1;--sac-tone-warning:#b7791f;--sac-tone-neutral:#646970;--sac-tone-purple:#7b4b94}
.sac-component{--sac-tone:var(--sac-tone-neutral);margin-block:1.4rem;padding:var(--sac-spacing);border:1px solid var(--sac-border);border-inline-start:4px solid var(--sac-tone);border-radius:var(--sac-radius);background:var(--sac-bg);color:var(--sac-text);box-sizing:border-box}
.sac-tone--success{--sac-tone:var(--sac-tone-success)}.sac-tone--primary{--sac-tone:var(--sac-tone-primary)}.sac-tone--info{--sac-tone:var(--sac-tone-info)}.sac-tone--warning{--sac-tone:var(--sac-tone-warning)}.sac-tone--purple{--sac-tone:var(--sac-tone-purple)}
.sac-component__header{display:flex;align-items:center;gap:.6rem;margin-block-end:.65rem;color:var(--sac-tone)}
.sac-component__icon{display:inline-grid;place-items:center;inline-size:1.7rem;block-size:1.7rem;flex:0 0 1.7rem;border-radius:999px;background:color-mix(in srgb,var(--sac-tone) 12%,transparent);color:var(--sac-tone)}
.sac-component__icon svg{inline-size:1rem;block-size:1rem}.sac-component__title{margin:0!important;font:inherit;font-weight:750;color:inherit;line-height:1.4}.sac-component__body{line-height:1.8}.sac-component__body p{margin-block:.65rem 0!important;margin-inline:0!important}.sac-component__body>:first-child{margin-block-start:0}.sac-component__body>:last-child{margin-block-end:0}.sac-component__body ul,.sac-component__body ol{margin-block:.35rem 0;padding-inline-start:1.4rem}
.sac-style--soft{background:color-mix(in srgb,var(--sac-tone) 6%,#fff);border-color:color-mix(in srgb,var(--sac-tone) 25%,#e5e7eb)}.sac-style--minimal{background:transparent;border-block:0;border-inline-end:0;border-radius:0}.sac-style--bordered{background:transparent;border:2px solid color-mix(in srgb,var(--sac-tone) 35%,#d9e0e7)}
.sac-density--compact{--sac-spacing:12px}.sac-density--spacious{--sac-spacing:24px}
@media (prefers-color-scheme:dark){.sac-component{--sac-bg:#151b22;--sac-text:#e7edf3;--sac-border:#303b46}.sac-style--soft{background:color-mix(in srgb,var(--sac-tone) 10%,#151b22)}}