:root{--dock-expanded-height:164px;color:#303034;font-synthesis:none;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}button,input{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.35;cursor:default}[hidden]{display:none!important}button:focus-visible,#viewport:focus-visible,.upload:focus-within{outline-offset:3px;outline:2px solid #888}#app{width:100%;height:100vh;background:#fff;height:100dvh;position:relative;overflow:hidden}#viewport{touch-action:none;outline:none;width:100%;height:100%;position:absolute;inset:0}#viewport canvas{touch-action:none;width:100%;height:100%;display:block}.topbar{z-index:3;top:calc(env(safe-area-inset-top,0px) + 12px);left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute}.topbar>*{pointer-events:auto;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffffc7;border:0;border-radius:999px;min-height:44px;box-shadow:0 3px 20px #0000000c}.upload{letter-spacing:.04em;align-items:center;padding:0 18px;font-size:13px;display:flex;position:relative;overflow:hidden}.upload input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}#reset{place-items:center;width:44px;height:44px;padding:11px;display:grid}#reset svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}#empty{pointer-events:none;color:#a0a0a3;letter-spacing:.05em;place-items:center;font-size:14px;display:grid;position:absolute;inset:0}#busy{z-index:4;pointer-events:none;background:#ffffffeb;border-radius:99px;padding:12px 18px;font-size:13px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 5px 25px #0000000c}#message{z-index:4;top:calc(env(safe-area-inset-top,0px) + 68px);left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));color:#736549;overflow-wrap:anywhere;background:#fffffff2;border-radius:14px;max-height:30dvh;margin:0;padding:10px 14px;font-size:12px;line-height:1.6;position:absolute;overflow:auto;box-shadow:0 4px 18px #0000000a}#message.error{color:#a83c35}#material-dock{z-index:3;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);isolation:isolate;background:#ffffffc7;border-radius:26px;max-width:620px;margin-inline:auto;padding:0 6px 8px;position:absolute;box-shadow:0 8px 36px #00000014}#materials-toggle{touch-action:manipulation;background:0 0;border:0;border-radius:24px;justify-content:center;align-items:center;width:64px;height:44px;margin:0 auto;display:flex}#materials-toggle span{background:#bdbdc1;border-radius:3px;width:34px;height:4px;display:block}#material-dock.collapsed{width:64px;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;padding:0}#swatches{overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;touch-action:pan-x;scrollbar-width:none;gap:6px;padding:0 6px 4px;display:flex;overflow-x:auto}#swatches::-webkit-scrollbar{display:none}.swatch{scroll-snap-align:center;white-space:normal;text-align:center;touch-action:pan-x;background:0 0;border:0;border-radius:16px;flex-direction:column;flex:0 0 72px;justify-content:flex-start;align-items:center;gap:5px;height:108px;min-height:108px;padding:4px 2px 6px;font-size:10px;line-height:1.4;display:flex}.swatch canvas{pointer-events:none;border-radius:50%;width:64px;height:64px;display:block}.swatch[aria-pressed=true] canvas{outline-offset:2px;outline:1px solid #a1a1a5}.swatch[aria-pressed=true]{color:#111}.swatch:active{background:#00000004}#material-preview-status{color:#777;margin:0;padding:4px 10px;font-size:11px}@media (prefers-reduced-motion:no-preference){.swatch{transition:background .15s,color .15s}#materials-toggle span{transition:background .15s}}@media (max-height:450px){:root{--dock-expanded-height:138px}#material-dock{bottom:calc(env(safe-area-inset-bottom,0px) + 6px);border-radius:22px;padding-bottom:2px}#materials-toggle{height:44px}.swatch{height:90px;min-height:90px;padding-top:2px}.swatch canvas{width:48px;height:48px}#swatches{padding-bottom:2px}}
