*{box-sizing:border-box}:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif;color:#252a30;background:#f7f8fa;font-synthesis:none;letter-spacing:0;--line:#e1e4e8;--muted:#858b93;--accent:#137d76;--preview-height:52svh}body{margin:0}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.35}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,#stage:focus-visible{outline:2px solid #178a83;outline-offset:3px}button{border:0;background:none}a{color:inherit;text-decoration:none}svg{width:18px;height:18px;stroke-width:1.65;flex-shrink:0}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}.app-header{height:68px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 32px;background:#fcfcfd}.brand{font-size:25px;font-weight:750;display:flex;align-items:center;gap:16px}.brand>span{font-weight:300;color:#adb5bc}.brand small{font-size:13px;font-weight:500}.header-actions{display:flex;align-items:center;gap:8px}#draft-status{font-size:11px;color:var(--muted);margin-right:12px}.icon{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:5px;flex-shrink:0}.icon:hover{background:#e3e7ea}.icon[aria-pressed=true]{color:#076f68;background:#dceee9}.divider{width:1px;height:18px;background:#d0d6db;margin:0 5px}main{display:grid;grid-template-columns:minmax(0,1fr) 360px;max-width:1920px;margin:auto}.workspace{min-width:0;height:calc(100dvh - 108px);min-height:520px;background:#eef0f2;display:flex;flex-direction:column;position:relative}.workspace-heading{display:flex;justify-content:space-between;align-items:center;padding:25px 32px 0;gap:16px;flex-shrink:0;z-index:1}.eyebrow{font-size:10px;color:#818b94}h1{font-size:21px;font-weight:550;margin:6px 0 0;line-height:1.4}.live-status{font-size:11px;color:#697a78;display:flex;align-items:center;white-space:nowrap}.live-status:before{content:"";width:5px;height:5px;margin-right:7px;background:#24998b;border-radius:50%}#stage{flex:1;min-height:0;position:relative;touch-action:none;cursor:grab;outline-offset:-5px;overflow:hidden}#stage:active{cursor:grabbing}#stage canvas{display:block;width:100%;height:100%}#loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;color:#7d898f;font-size:13px}.stage-bottom{height:70px;display:flex;justify-content:center;align-items:center;position:relative;padding:0 26px;flex-shrink:0}.toolbar{display:flex;align-items:center;gap:4px;background:#f7f8fa;border:1px solid #dce1e5;padding:5px 7px;border-radius:7px;box-shadow:0 3px 10px #20303805}#side{position:absolute;left:32px;font-size:11px;color:#858f97}#zoom-label{font-size:11px;font-variant-numeric:tabular-nums;width:40px;text-align:center}aside{height:calc(100dvh - 108px);min-height:520px;display:flex;flex-direction:column;border-left:1px solid var(--line);background:#fcfcfd;min-width:0}.panel-top{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 14px;gap:10px;flex-shrink:0}h2{margin:0;font-size:14px;font-weight:600}.panel-top select{width:112px;font-size:11px;background:#f4f5f7;min-height:30px;padding:4px 8px}.tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line);padding:0 22px;flex-shrink:0}.tabs button{height:44px;font-size:12px;color:#8b9097;border-bottom:2px solid transparent;border-radius:0}.tabs button[aria-selected=true]{color:#197e77;border-bottom-color:#197e77;font-weight:600}.panel-scroll{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#d8dde1 transparent}.section{padding:22px 24px;border-bottom:1px solid #eceef1}.section:last-child{border-bottom:0}h3{font-size:11px;font-weight:600;margin:0 0 16px;color:#69747d}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-title h3{margin:0}.section-title>span{font-size:9px;color:#9a9fa6}.finish-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 8px}.finish-option{min-width:0;padding:0;text-align:center;border-radius:5px}.finish-sample{height:65px;position:relative;overflow:hidden;border:2px solid transparent;border-radius:5px;display:block;isolation:isolate;box-shadow:inset 0 0 0 1px #0000000d}.finish-option[aria-pressed=true] .finish-sample{border-color:#137d76;box-shadow:0 0 0 2px #fcfcfd inset}.finish-option:hover .finish-sample{filter:brightness(1.08)}.finish-option .label{display:block;font-size:10px;margin-top:7px;color:#6e7780}.finish-option[aria-pressed=true] .label{color:#126f68;font-weight:600}.finish-sample:after{content:"";position:absolute;top:-50%;right:-50%;bottom:-50%;left:-50%;background:linear-gradient(115deg,transparent 35%,#ffffffb5 48%,transparent 60%);transform:translate(-20%);transition:transform .55s}.finish-option:hover .finish-sample:after{transform:translate(20%)}.finish-sample.prism{background:repeating-linear-gradient(125deg,#a8d9dc,#e4d7df,#c2e1a4,#9fccde 60%)}.finish-sample.pearl{background:repeating-radial-gradient(ellipse at 25% 10%,#dce5e9 0,#f1dcd8 6px,#d6d6e8,#d5e7df 22px)}.finish-sample.crystal{background:conic-gradient(from 30deg at 28% 63%,#7faccb,#f2e5e9,#b5a9d2,#cee4e1,#7faccb)}.finish-sample.galaxy{background:radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 70% 60%,#c4e2f1 0 1px,transparent 1.5px),linear-gradient(135deg,#30484f,#8d86ac,#435e6b);background-size:15px 19px,23px 27px,auto}.finish-sample.gold{background:repeating-conic-gradient(#d1b577,#d1b577 25%,#b18d4f 0%,#b18d4f 50%) 0 0/12px 12px}.finish-sample.silver{background:repeating-linear-gradient(100deg,#b5c0c9 0,#b5c0c9 1px,#e0e7eb 1px,#e0e7eb 2px,#c7d0d6 2px,#c7d0d6 4px)}.range-field{margin-top:17px}.range-field:first-child{margin-top:0}.range-label{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin-bottom:9px;color:#626d77}.range-label output{font-size:10px;color:#8d959d;font-variant-numeric:tabular-nums}input[type=range]{display:block;-moz-appearance:none;appearance:none;-webkit-appearance:none;width:100%;height:18px;background:transparent;margin:0;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,#3d8f88 var(--fill,50%),#e4e8eb var(--fill,50%));border-radius:2px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;background:#fff;border:2px solid #30847e;border-radius:50%;margin-top:-4.5px;box-shadow:0 1px 3px #183c3a16}input[type=range]::-moz-range-track{height:3px;background:#dbe2e4}input[type=range]::-moz-range-progress{height:3px;background:#3d8f88}input[type=range]::-moz-range-thumb{width:9px;height:9px;background:#fff;border:2px solid #30847e;border-radius:50%}.toggle,.field-row{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:11px;color:#626d77;min-height:35px}.toggle input,.compact-toggle input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:28px;height:16px;border-radius:10px;background:#dce1e5;position:relative;margin:0;cursor:pointer}.toggle input:before,.compact-toggle input:before{content:"";position:absolute;top:3px;left:3px;width:10px;height:10px;border-radius:50%;background:#fff;transition:transform .15s}.toggle input:checked,.compact-toggle input:checked{background:#288c82}.toggle input:checked:before,.compact-toggle input:checked:before{transform:translate(12px)}select{border:1px solid #dfe4e7;border-radius:4px;min-height:31px;padding:4px 8px;background:#fff;font-size:11px;max-width:100%}.field-row select{width:125px}.background-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px 9px}.background-option{padding:0;min-width:0}.background-option img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block;border-radius:5px;border:2px solid transparent}.background-option[aria-pressed=true] img{border-color:#147e76;box-shadow:0 0 0 2px #fff}.background-option span{font-size:10px;display:block;margin-top:7px;color:#758089}.background-option[aria-pressed=true] span{color:#137d76;font-weight:600}.upload{display:flex;align-items:center;gap:9px;width:100%;border:1px dashed #cdd5da;border-radius:5px;padding:12px;margin-top:17px;font-size:11px;color:#5f7479}.upload span{flex:1;text-align:left}.upload svg{width:16px;height:16px}.upload:hover{background:#f0f5f4}.text-fields{display:flex;flex-direction:column;gap:8px}.text-fields label{font-size:11px;color:#68737c;margin-top:7px}.text-fields input,.text-fields textarea{width:100%;min-width:0;font-size:12px;padding:10px;border:1px solid #dfe4e7;border-radius:4px;background:#fff;line-height:1.5}.text-fields textarea{resize:vertical;min-height:82px}.frame-swatches{display:flex;gap:13px}.frame-swatches button{width:28px;height:28px;border-radius:50%;background:var(--swatch);border:3px solid #fff;outline:1px solid #d9dfe3}.frame-swatches button[aria-pressed=true]{outline:2px solid #17887d}.export-bar{border-top:1px solid var(--line);padding:18px 24px;display:flex;gap:10px;flex-shrink:0;background:#fcfcfd}.export-bar select{width:128px;font-size:10px}.primary{background:#237f77;color:#fff;min-height:37px;padding:9px 13px;border-radius:5px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;flex:1;white-space:nowrap}.primary:hover{background:#196e67}.primary svg{width:15px;height:15px}footer{height:40px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;color:#9aa2aa;font-size:9px}.footer-dot{display:inline-block;width:4px;height:4px;background:#42a99a;border-radius:50%;margin:1px 8px}#notice{position:fixed;bottom:20px;left:24px;background:#fff;border:1px solid #d6e1df;border-left:3px solid #218a7d;box-shadow:0 4px 20px #223d3a12;max-width:min(390px,calc(100vw - 32px));padding:12px 16px;font-size:12px;line-height:1.7;margin:0;border-radius:4px;z-index:20}#notice:empty{display:none}.immersive .app-header,.immersive aside,.immersive footer{display:none}.immersive main{display:block;max-width:none}.immersive .workspace{height:100dvh;min-height:0}.immersive .workspace-heading{padding-top:20px}.immersive .stage-bottom{padding-bottom:env(safe-area-inset-bottom)}@media(min-width:1600px){main{grid-template-columns:minmax(0,1fr) 390px}.section{padding-right:28px;padding-left:28px}.finish-sample{height:73px}}@media(max-width:1000px)and (min-width:701px){main{grid-template-columns:minmax(0,1fr) 320px}.section,.panel-top{padding:19px}.export-bar{padding:16px}.zoom-control{display:none}#side{left:20px}.workspace-heading{padding-left:22px;padding-right:22px}.live-status{font-size:10px}.toolbar{gap:1px}}@media(max-width:700px){.app-header{height:54px;padding:0 17px}.brand{font-size:23px;gap:10px}.brand small{font-size:11px}.header-actions{gap:2px}#draft-status{font-size:9px;margin-right:5px}.source-link{display:none}.icon{width:34px;height:34px}main{display:flex;flex-direction:column}.workspace{height:var(--preview-height);min-height:310px;max-height:510px;position:sticky;top:0;z-index:3;border-bottom:1px solid #dce1e5}.workspace-heading{padding:12px 18px 0;align-items:flex-start}.eyebrow{font-size:8px}h1{font-size:16px;margin-top:3px}.live-status{font-size:9px;margin-top:8px}.stage-bottom{height:56px;padding:0 12px}.toolbar{gap:3px;padding:3px 6px;border-radius:5px}.zoom-control{display:none}.divider{margin:0 3px}#side{font-size:9px;left:16px}aside{height:auto;min-height:0;border-left:0}.panel-top{padding:16px 20px 8px}.tabs{padding:0 20px;position:sticky;top:clamp(310px,var(--preview-height),510px);z-index:2;background:#fcfcfd}.panel-scroll{overflow:visible}.section{padding:21px 22px}.finish-grid{gap:14px 11px}.finish-sample{height:66px}.finish-option .label,.background-option span{font-size:11px}.range-label,.toggle,.field-row{font-size:12px}.range-label{margin-bottom:10px}.range-field{margin-top:20px}input[type=range]{height:24px}input[type=range]::-webkit-slider-thumb{width:16px;height:16px;margin-top:-6.5px}.export-bar{padding:16px 22px;position:sticky;bottom:0;z-index:2;box-shadow:0 -4px 15px #273c3804;padding-bottom:max(16px,env(safe-area-inset-bottom))}.export-bar select{width:140px;font-size:11px}.primary{font-size:12px;min-height:40px}footer{padding:0 20px;font-size:8px}footer>span:last-child{display:none}#notice{left:16px;bottom:80px}.immersive .workspace{max-height:none}.immersive .tabs{position:static}.background-grid{gap:15px 12px}.background-option img{max-height:155px}.text-fields input,.text-fields textarea{font-size:16px}}@media(max-width:360px){.brand small{display:none}.toolbar{gap:0}.toolbar .icon{width:32px}#side{left:10px;font-size:8px}.header-actions #draft-status{margin-right:2px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}.workspace{background:#e0e1e1}@media(max-width:700px){.export-bar{position:static;box-shadow:none}}