html,body{background-color:var(--color-gray-1000)}body{place-items:center;min-height:100dvh;margin:0;padding-bottom:4dvh;display:grid}main{grid-template-columns:repeat(2,minmax(332px,1fr));align-items:start;gap:5dvw;display:grid}.logo-demo{border-radius:var(--radii-lg);flex-direction:column;grid-column:1/-1;align-items:center;gap:24px;margin-bottom:24px;padding:32px;display:flex}.logo-controls{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.logo-controls button{border-radius:var(--radii-md);background:var(--color-gray-800);color:var(--color-gray-100);font-family:var(--font-family);cursor:pointer;border:none;padding:10px 20px;font-size:13px;font-weight:500;transition:background-color .15s,transform .15s}.logo-controls button:hover{background:var(--color-gray-700)}.logo-controls button:active{transform:scale(.97)}.standalone-demo{border-radius:var(--radii-lg);grid-column:1/-1}.standalone-demo h2{font-family:var(--font-family);color:var(--color-gray-400);margin:0 0 16px;font-size:14px;font-weight:500}.standalone-demo ease-state{gap:12px;max-width:300px;display:grid}