main{max-width:60rem;font-family:var(--font-sans);color:var(--text-primary);background:var(--bg-surface);border-radius:8px;margin:2rem auto;padding:0 1rem;box-shadow:0 2px 4px #0000000d}main>*{padding:2rem 0}main h1{color:var(--text-primary);border-bottom:1px solid var(--border-primary);margin-bottom:1rem;padding-bottom:.5rem;font-size:2rem;font-weight:700}main h2{color:var(--text-primary);margin:1.5rem 0 .5rem;font-size:1.5rem;font-weight:600}main p,main .meta{color:var(--text-secondary);margin:1rem 0;line-height:1.6}main ul{margin:1rem 0;padding-left:1.5rem;list-style:none}main li{margin:.5rem 0;padding-left:1.5rem;position:relative}main li:before{content:"•";color:var(--text-accent);position:absolute;left:0}main footer{color:var(--text-secondary);text-align:center;margin-top:2rem;font-size:.9rem}.ds-color-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;margin:1.5rem 0;display:grid}.ds-color-item{border-radius:8px;flex-direction:column;justify-content:center;align-items:center;height:100px;padding:1rem;display:flex;box-shadow:0 2px 4px #0000001a}.ds-typography>*{margin:1rem 0}.ds-buttons{flex-wrap:wrap;gap:1rem;margin:1.5rem 0;display:flex}.ds-spacing{margin:1.5rem 0}.ds-space-item{background-color:var(--accent-blue-transparent);width:100%;margin:.5rem 0;position:relative}.ds-space-item span{font-size:var(--text-xs);position:absolute;left:0;transform:translateY(-100%)}.spinner{border:3px solid var(--border-primary);border-top-color:var(--text-accent);border-radius:50%;width:40px;height:40px;margin-bottom:1rem;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:768px){main{margin:1rem;padding:0 .5rem}main>*{padding:1rem 0}main h1{font-size:1.75rem}main h2{font-size:1.25rem}main h3{font-size:1.1rem}}