.callout{border-radius:var(--radius);grid-template-columns:max-content 1fr;align-items:start;gap:20px;margin:28px 0;padding:22px 26px;display:grid}.callout--tip{border-inline-start:3px solid var(--color-sage);background:#5a6b541a}.callout--warn{border-inline-start:3px solid var(--color-rust);background:#b8451e14}.callout--note{border-inline-start:3px solid var(--color-ochre);background:#a078401a}.callout__label{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;min-width:80px;padding-top:4px;font-size:11px;font-weight:600}.callout--tip .callout__label{color:var(--color-sage)}.callout--warn .callout__label{color:var(--color-rust)}.callout--note .callout__label{color:var(--color-ochre)}.callout__body p{color:var(--color-ink-2);max-width:58ch;font-size:16px;line-height:1.6}.callout__body em{color:inherit;font-style:italic}.callout__body strong{color:var(--color-ink);font-weight:600}.callout__body code{font-family:var(--font-mono);background:#1f1b160f;border-radius:3px;padding:2px 6px;font-size:13px}@media (max-width:480px){.callout{grid-template-columns:1fr;gap:8px;margin:20px 0;padding:16px 18px}.callout__label{min-width:0;padding-top:0}.callout__body p{font-size:15px}}