@import url('/assets/brand/brand-tokens.css');
*{box-sizing:border-box}body{margin:0;background:var(--brand-ivory);color:var(--ink);font:16px/1.7 var(--sans)}main{max-width:800px;margin:auto;padding:clamp(24px,6vw,64px)}small{letter-spacing:.2em;color:var(--brand-wine)}h1{font:clamp(36px,7vw,58px)/1.1 var(--serif);margin:20px 0}h2{font:28px var(--serif)}section{background:#fff;border:1px solid #e4cfd8;padding:24px;border-radius:18px;margin:24px 0}a{color:var(--brand-wine);text-underline-offset:3px}.download{display:inline-block;background:var(--brand-wine);color:white;padding:12px 20px;border-radius:999px;text-decoration:none}li{padding:7px 0}code{font-size:.9em;overflow-wrap:anywhere}p{margin:14px 0}.note{font-size:14px;color:#705765}

.brand-header { display: flex; align-items: center; gap: .65rem; margin-bottom: 2rem; }
.brand-header .brand-symbol { width: 2.5rem; height: 2.5rem; }
.brand-header .brand-wordmark { width: 10rem; height: auto; }
h1, h2 { color: var(--brand-wine); font-weight: 500; }
a { overflow-wrap: anywhere; }
a:focus-visible { outline: 2px solid var(--brand-wine); outline-offset: 4px; }
.download { min-height: 44px; text-align: center; }
@media(max-width:479px) { main { padding: 24px 16px; } section { padding: 20px 16px; } ol { padding-left: 1.3rem; } .download { width: 100%; } }