:root{font-family:Arial,Helvetica,sans-serif;color:#363833;background:#efede7;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,canvas:focus-visible{outline:2px solid #827356;outline-offset:5px}#app{min-height:100svh;display:flex;flex-direction:column}header{position:absolute;z-index:2;top:48px;left:4.6vw;pointer-events:none}.wordmark{font-size:24px;letter-spacing:.25em}h1{font-size:13px;font-weight:400;letter-spacing:.16em;margin:22px 0 0;color:#777970}main{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:35px;padding-right:6vw;flex:1;min-height:650px;height:calc(100svh - 58px)}#stage{position:relative;min-width:0;height:100%;min-height:580px}canvas{width:100%;height:100%;display:block;touch-action:none}#loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:12px;letter-spacing:.06em;background:#efede7ed;padding:15px 22px;border-radius:3px;pointer-events:none}#loading[hidden]{display:none}.gesture{position:absolute;bottom:35px;left:0;width:100%;text-align:center;font-size:11px;letter-spacing:.05em;color:#828479;pointer-events:none}.gesture span{padding:0 12px}aside{align-self:center;padding:50px 0 0}fieldset{margin:0 0 36px;padding:0;border:0}legend{font-size:11px;letter-spacing:.15em;color:#83857b;margin-bottom:17px}button{border:0;background:none;text-align:left}.products{display:grid;grid-template-columns:1fr 1fr;gap:8px}.products button{font-size:10px;letter-spacing:.07em;padding:13px 7px;border:1px solid #d8d8cf;text-align:center;border-radius:2px;transition:background .18s}.products button[aria-pressed=true]{background:#e1e0d6;border-color:#96998a}.finishes{display:flex;flex-direction:column;gap:4px}.finishes button{display:flex;align-items:center;gap:13px;padding:12px 0;font-size:12px;opacity:.65}.finishes button[aria-pressed=true]{opacity:1}.finishes i{width:19px;height:19px;background:var(--swatch);border-radius:50%;display:block;outline:1px solid transparent;outline-offset:4px}.finishes button[aria-pressed=true] i{outline-color:#96998a}#reset{display:flex;justify-content:space-between;width:100%;font-size:11px;border-top:1px solid #d6d7ce;padding:21px 0;letter-spacing:.04em}#reset span{font-size:19px;line-height:12px}footer{height:58px;font-size:9px;letter-spacing:.04em;color:#93968a;display:flex;justify-content:center;align-items:center;gap:9px}button:hover{color:#121810}.products button:hover{background:#e5e4db}@media(max-width:700px){header{position:relative;top:auto;left:auto;padding:25px 25px 0}.wordmark{font-size:20px}h1{margin:13px 0 0;font-size:10px}main{display:flex;flex-direction:column;gap:0;padding:0;height:auto;min-height:0}#stage{height:49svh;min-height:300px}.gesture{bottom:5px;font-size:9px}aside{width:100%;padding:14px 25px 0;align-self:stretch}fieldset{margin-bottom:20px}legend{font-size:10px;margin-bottom:11px}.products{grid-template-columns:repeat(4,1fr);gap:5px}.products button{font-size:8px;padding:12px 2px;letter-spacing:0}.finishes{flex-direction:row;justify-content:space-between;gap:5px}.finishes button{flex-direction:column;gap:12px;font-size:9px;text-align:center;padding:7px 2px}.finishes i{width:16px;height:16px}#reset{padding:17px 0}footer{height:42px;font-size:8px;flex-wrap:wrap;padding:0 16px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}#app{height:100svh}main{min-height:0;height:auto}#stage{min-height:0}footer{flex-shrink:0}@media(max-width:700px){#app{height:auto}main{flex:none}#stage{min-height:300px}}:root{color:#e6e1d7;background:#161918}.wordmark{color:#efe9dc}h1{color:#aaa99f}legend{color:#a1a59e}.gesture{color:#90968e}#loading{background:#242826ed;color:#e6e1d7}.products button{border-color:#484e48;color:#c9cec5}.products button[aria-pressed=true]{background:#3a3b32;border-color:#8f8268;color:#e3d6b9}.products button:hover{background:#30372f}button:hover{color:#f3ecdc}.finishes button{color:#d2d4ca}.finishes button[aria-pressed=true] i{outline-color:#b3a17b}#reset{border-color:#3d443e;color:#a7afa3}footer{color:#848e81}button:focus-visible,canvas:focus-visible{outline-color:#c1af88}