@font-face{font-family:IBM Plex Sans;src:url(/fonts/IBMPlexSans-Regular.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:IBM Plex Sans;src:url(/fonts/IBMPlexSans-Medium.woff2)format("woff2");font-weight:500;font-style:normal;font-display:swap}*,:before,:after{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}body{color:#2a2926;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#efece6;font-family:IBM Plex Sans,Segoe UI,sans-serif}button{font:inherit}.page{box-sizing:border-box;color:#2a2926;background:radial-gradient(80% 55% at 50% 18%,#f7f4ef 0%,#0000 55%),linear-gradient(#efece6 0%,#ddd7cd 100%);flex-direction:column;min-height:100svh;padding:1.25rem 1.5rem 1.75rem;display:flex;position:relative}.demo-label{letter-spacing:.14em;text-transform:uppercase;color:#6a665f;margin:0;font-family:IBM Plex Sans,Segoe UI,sans-serif;font-size:.75rem;font-weight:500;position:absolute;top:1.25rem;left:1.5rem}.stage{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1.25rem;width:min(100%,720px);margin:0 auto;padding-top:2rem;display:flex}.viewer{aspect-ratio:1;border-radius:2px;width:100%;max-height:min(68svh,560px);overflow:hidden}.viewer-canvas{touch-action:none;display:block;width:100%!important;height:100%!important}.swatch-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem 1rem;width:100%;padding:.25rem 0 0;display:flex}.swatch-item{align-items:center;gap:.55rem;display:inline-flex}.swatch{cursor:pointer;appearance:none;border:1px solid #2a29262e;border-radius:2px;width:1.75rem;height:1.75rem;padding:0;transition:outline-color .16s,transform .16s}.swatch:hover{transform:translateY(-1px)}.swatch.is-active{outline-offset:2px;outline:2px solid #2a2926}.swatch-name{letter-spacing:.02em;color:#2a2926;white-space:nowrap;font-family:IBM Plex Sans,Segoe UI,sans-serif;font-size:.875rem;font-weight:500}@media (width<=640px){.page{padding:1rem 1rem 1.25rem}.demo-label{top:1rem;left:1rem}.stage{gap:1rem;padding-top:1.75rem}.viewer{max-height:min(58svh,420px)}}