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