:root{color:#eef0f4;background:#0d0f14;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--app-bg: #0d0f14;--surface: #14171d;--surface-raised: #1a1e26;--surface-hover: #222730;--surface-selected: #272a3c;--border: rgb(255 255 255 / 8%);--border-strong: rgb(255 255 255 / 13%);--text: #f2f4f7;--text-secondary: #a4abb7;--text-muted: #747c89;--brand: #6f78ff;--brand-hover: #7e86ff;--brand-soft: rgb(111 120 255 / 16%);--danger: #ff8692;--radius-sm: 7px;--radius-md: 10px;--radius-lg: 16px}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}button,select,input{font:inherit}button{color:inherit}button,select,input[type=range],input[type=checkbox]{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #8d94ff;outline-offset:2px}kbd{min-width:18px;padding:2px 5px;border:1px solid rgb(255 255 255 / 10%);border-radius:4px;background:#ffffff0d;color:#888f9c;font-family:inherit;font-size:10px;font-weight:500;line-height:1;text-align:center}#app{display:grid;grid-template-rows:64px minmax(0,1fr) 32px;background:var(--app-bg)}.topbar{position:relative;z-index:20;display:grid;grid-template-columns:210px minmax(0,1fr) 240px;align-items:center;gap:18px;padding:0 18px;border-bottom:1px solid var(--border);background:#12151bf5;box-shadow:0 1px #0000003d;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:11px;min-width:0;color:inherit;text-decoration:none}.brand-mark{position:relative;display:grid;width:34px;height:34px;flex:none;place-items:center;overflow:hidden;border:1px solid rgb(255 255 255 / 14%);border-radius:10px;background:linear-gradient(145deg,#7b84ff,#555ee8);color:#fff;font-size:11px;font-weight:700;letter-spacing:.04em;box-shadow:0 7px 20px #545fe747}.brand-mark:after{position:absolute;width:28px;height:28px;border:1px solid rgb(255 255 255 / 18%);border-radius:7px;content:"";transform:rotate(28deg) translate(13px,-12px)}.brand strong,.brand small{display:block}.brand strong{color:var(--text);font-size:14px;font-weight:600;letter-spacing:.01em}.brand small{margin-top:3px;color:#717987;font-size:10px;font-weight:500;letter-spacing:.08em}.toolbar{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}.tool-group{display:flex;gap:2px;padding:3px;border:1px solid var(--border);border-radius:9px;background:#0e1116}.toolbar-divider{width:1px;height:26px;margin:0 1px;background:var(--border)}.button,.tool-button,.mode-card,.view-grid button,.segmented button,.model-list-item,.model-copy-button,.model-actions button,.add-model-button,.light-preset-grid button,.viewport-actions button,.toast-action{border:1px solid transparent;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease}.button:active,.tool-button:active,.mode-card:active,.view-grid button:active,.model-actions button:active,.add-model-button:active,.viewport-actions button:active{transform:translateY(1px)}.button:disabled,.model-actions button:disabled,.model-copy-button:disabled,.add-model-button:disabled{cursor:not-allowed;opacity:.4}.button{min-height:36px;padding:0 15px;border-radius:9px;font-size:12px;font-weight:600}.button-large{min-height:42px;padding:0 20px}.button-primary{border-color:#ffffff14;background:var(--brand);color:#fff;box-shadow:0 6px 18px #515bdb38}.button-primary:hover:not(:disabled){background:var(--brand-hover);box-shadow:0 8px 22px #515bdb47}.button-secondary{border-color:var(--border-strong);background:#222630;color:#d8dce3}.button-secondary:hover:not(:disabled){background:#2a303a}.import-button{flex:none}.import-button>span{display:inline-block;margin-right:2px;font-size:16px;line-height:0;transform:translateY(1px)}.tool-button{display:flex;height:32px;align-items:center;gap:7px;padding:0 10px;border-radius:6px;background:transparent;color:#959ca8;font-size:11px;white-space:nowrap}.tool-button:hover{background:#1d222a;color:#fff}.tool-button.active{background:#282d37;color:#fff;box-shadow:inset 0 0 0 1px #ffffff0d}.tool-button.active kbd{border-color:#8b93ff3d;background:var(--brand-soft);color:#b8bdff}.reset-button{color:#89919e}.header-status{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0;overflow:hidden;color:#89919e;font-size:11px;white-space:nowrap}.header-status #modelSummary{overflow:hidden;text-overflow:ellipsis}.status-dot{width:6px;height:6px;flex:none;border-radius:50%;background:#5dd5a7;box-shadow:0 0 0 4px #5dd5a717}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 320px;min-height:0;overflow:hidden}.viewport{position:relative;min-width:0;min-height:0;overflow:hidden;background:#252a33}.composition-frame{position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #ffffff24,0 18px 56px #0000003d}#sceneCanvas{display:block;width:100%;height:100%;outline:none;cursor:grab}.viewport[data-tool=translate] #sceneCanvas,.viewport[data-tool=rotate] #sceneCanvas,.viewport[data-tool=scale] #sceneCanvas{cursor:default}.viewport.is-interacting #sceneCanvas{cursor:grabbing}.drop-hint{position:absolute;inset:0;z-index:2;display:grid;place-items:center;padding:28px;color:#252a33;pointer-events:none}.drop-hint[hidden]{display:none}.drop-card{display:flex;width:min(470px,100%);flex-direction:column;align-items:center;padding:30px 34px 25px;border:1px solid rgb(42 48 59 / 10%);border-radius:22px;background:#ffffffa8;text-align:center;box-shadow:0 28px 70px #2c33411f;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.drop-hint .eyebrow{color:#727a87;font-size:10px;font-weight:600;letter-spacing:.08em}.drop-hint h1{margin:15px 0 7px;color:#20242c;font-size:clamp(23px,3vw,29px);font-weight:650;letter-spacing:-.035em}.drop-hint p{max-width:340px;margin:0 0 21px;color:#656d79;font-size:13px;line-height:1.7}.drop-hint small{margin-top:12px;color:#858c97;font-size:11px;letter-spacing:.02em}.drop-hint .button{pointer-events:auto}.drop-icon{position:relative;display:grid;width:66px;height:66px;margin-top:19px;place-items:center;border:1px solid rgb(85 96 120 / 15%);border-radius:19px;background:#ffffffa8;box-shadow:0 14px 35px #2028371a;transform:rotate(8deg)}.drop-icon:before{position:absolute;inset:9px;border:1px solid rgb(111 120 255 / 28%);border-radius:12px;content:""}.drop-icon span{color:#5f68dc;font-size:15px;font-weight:700;transform:rotate(-8deg)}.workflow-steps{display:flex;width:100%;align-items:center;justify-content:center;gap:9px;margin-top:22px;padding-top:18px;border-top:1px solid rgb(33 39 50 / 8%);color:#747b87;font-size:11px}.workflow-steps span{display:flex;align-items:center;gap:6px;white-space:nowrap}.workflow-steps b{display:grid;width:20px;height:20px;place-items:center;border-radius:50%;background:#eef0f5;color:#646d7b;font-size:10px;font-weight:600}.workflow-steps i{width:16px;height:1px;background:#2d344124}.viewport-overlay{position:absolute;z-index:4;display:flex;align-items:center;gap:7px;color:#343944;font-size:11px;pointer-events:none}.viewport-overlay>span{min-height:28px;padding:6px 9px;border:1px solid rgb(31 37 48 / 9%);border-radius:7px;background:#ffffffc2;box-shadow:0 4px 14px #2b32400d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.viewport-top-left{top:15px;left:15px}.mode-indicator{display:flex;align-items:center;gap:7px}.mode-indicator>i{width:6px;height:6px;border-radius:50%;background:#6873f4;box-shadow:0 0 0 3px #6873f421}.selection-indicator strong{display:inline-block;max-width:170px;overflow:hidden;color:#4f58c8;font-weight:600;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap}.viewport-bottom-left{bottom:15px;left:15px}.viewport-bottom-left>span{color:#666e7a}.composition-frame[data-portrait=true] .viewport-bottom-left{display:none}.viewport-bottom-left kbd{border-color:#252b361c;background:#2b323f0f;color:#555d69}.viewport-actions{position:absolute;top:15px;right:15px;z-index:4}.viewport-actions button{height:30px;padding:0 9px;border-color:#1f25301a;border-radius:7px;background:#ffffffc7;color:#4f5662;font-size:11px;box-shadow:0 4px 14px #2b32400d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.viewport-actions button:hover{background:#fffffff0;color:#252a33}.viewport-actions kbd{border-color:#252b361c;background:#2b323f0f;color:#555d69}.drop-overlay{position:absolute;inset:14px;z-index:8;display:none;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:2px dashed #6974ff;border-radius:18px;background:#eff1fadb;color:#3e47bd;pointer-events:none;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.drop-overlay strong{font-size:17px;font-weight:600}.drop-overlay span{color:#7178a4;font-size:12px}.viewport.dragging .drop-overlay{display:flex}.busy-overlay{position:absolute;inset:0;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#12151bba;color:#f3f5f8;font-size:12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.busy-overlay[hidden]{display:none}.spinner{width:32px;height:32px;border:3px solid rgb(255 255 255 / 17%);border-top-color:#8f97ff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.control-panel{min-height:0;overflow-y:auto;border-left:1px solid var(--border);background:#12151b;scrollbar-width:thin;scrollbar-color:#343944 transparent}.panel-intro{position:sticky;top:0;z-index:3;padding:14px 17px 13px;border-bottom:1px solid var(--border);background:#12151bf0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.panel-intro strong,.panel-intro span{display:block}.panel-intro strong{color:var(--text);font-size:13px;font-weight:600}.panel-intro span{margin-top:3px;color:var(--text-muted);font-size:11px}.panel-section{padding:18px 17px;border-bottom:1px solid var(--border)}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.section-heading h2{margin:0;color:#e9ecf1;font-size:12px;font-weight:600;letter-spacing:.01em}.section-heading>span{color:#747c89;font-size:11px}.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.mode-card{display:flex;min-height:54px;align-items:center;gap:10px;padding:8px 10px;border-color:var(--border);border-radius:9px;background:#181b22;color:#b2b8c2;text-align:left}.mode-card:first-child{grid-column:1 / -1}.mode-card:hover{border-color:var(--border-strong);background:#1e222b}.mode-card.active{border-color:#7982ff99;background:var(--surface-selected);color:#fff;box-shadow:0 0 0 1px #6f78ff1a}.mode-swatch{width:29px;height:29px;flex:none;border:1px solid rgb(255 255 255 / 14%);border-radius:7px;box-shadow:inset 0 0 0 1px #00000012}.mode-text{display:grid;gap:2px;min-width:0}.mode-text strong{font-size:11px;font-weight:600}.mode-text small{color:#727b88;font-size:10px;white-space:nowrap}.mode-card.active .mode-text small{color:#a9aff2}.swatch-original{background:linear-gradient(135deg,#cd7655 0 50%,#5f8fb1 50%)}.swatch-blocks{background:conic-gradient(#ff7495,#ffd16a,#71d8b7,#7585ff,#ff7495)}.swatch-line{background:linear-gradient(35deg,transparent 44%,#252932 45% 51%,transparent 52%),#f4f4f2}.swatch-depth{background:linear-gradient(135deg,#fff,#090a0c)}.swatch-clay{background:linear-gradient(135deg,#fff,#a8aaae)}.segmented{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;border:1px solid rgb(255 255 255 / 4%);border-radius:9px;background:#0d1015}.segmented button{height:31px;border-radius:6px;background:transparent;color:#808896;font-size:11px}.segmented button:hover{color:#c8cdd5}.segmented button.active{background:#292e38;color:#fff;box-shadow:0 2px 7px #0000002e}.view-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:9px}.view-grid button{height:31px;border-color:var(--border);border-radius:var(--radius-sm);background:#191c23;color:#a7aeb9;font-size:11px}.view-grid button:hover{border-color:var(--border-strong);background:#242932;color:#fff}.scene-section{padding-bottom:16px}.add-model-button{width:100%;height:34px;margin-bottom:8px;border-color:#6f78ff42;border-style:dashed;border-radius:8px;background:#6f78ff0f;color:#aeb4ff;font-size:11px}.add-model-button:hover{border-color:#8089ff85;background:#6f78ff1f;color:#d4d7ff}.model-list{display:grid;max-height:172px;gap:5px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#3b404b transparent}.model-list-empty{margin:7px 0 9px;color:#6f7784;font-size:11px;text-align:center}.model-list-item{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;min-height:39px;padding:0 9px 0 7px;border-color:var(--border);border-radius:8px;background:#181b22;color:#b2b8c2;text-align:left}.model-list-row{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:5px}.model-copy-button{border-color:var(--border);border-radius:8px;background:#1c2028;color:#aeb4ff;font-size:10px}.model-copy-button:hover{border-color:#7982ff8f;background:var(--surface-selected);color:#fff}.model-list-item:hover{border-color:var(--border-strong);background:#20242c;color:#fff}.model-list-item.active{border-color:#7982ff8f;background:var(--surface-selected);color:#fff}.model-item-index{display:grid;width:22px;height:22px;place-items:center;border-radius:6px;background:#282d36;color:#8e96a2;font-size:10px}.model-list-item.active .model-item-index{background:#6f78ff36;color:#c3c7ff}.model-item-name{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.model-item-meta{color:#747c89;font-size:10px;white-space:nowrap}.model-list-item.active .model-item-meta{color:#a3a9ed}.model-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}.model-actions button{display:flex;height:32px;align-items:center;justify-content:space-between;gap:5px;padding:0 8px;border-color:var(--border);border-radius:7px;background:#1c2028;color:#aeb4be;font-size:10px}.model-actions button:hover:not(:disabled){border-color:var(--border-strong);background:#292e37;color:#fff}.origin-option{margin-bottom:8px}.model-actions .center-origin-button{grid-column:1 / -1;justify-content:center}.light-preset-heading{margin-bottom:8px}.light-preset-heading small{color:#777f8d;font-size:10px}.light-preset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.light-preset-grid button{min-height:30px;border-color:var(--border);border-radius:7px;background:#191c23;color:#a7aeb9;font-size:10px}.light-preset-grid button:hover{border-color:var(--border-strong);background:#242932;color:#fff}.light-preset-grid button.active{border-color:#7982ff8f;background:var(--surface-selected);color:#fff}#deleteModelButton:hover:not(:disabled){border-color:#ff869247;background:#ff6c7b1a;color:#ffb2ba}.control-row{display:flex;align-items:center;justify-content:space-between;margin:15px 0 8px;color:#b1b7c0;font-size:11px}.control-row:first-of-type{margin-top:0}.control-row output{color:#8d95a2;font-variant-numeric:tabular-nums}.compact-row{margin-bottom:0}input[type=range]{width:100%;height:4px;margin:0;border-radius:999px;accent-color:var(--brand)}.switch-row{min-height:30px}.switch-control{position:relative;display:inline-flex;width:34px;height:20px;flex:none}.switch-control input{position:absolute;width:1px;height:1px;opacity:0}.switch-control i{position:absolute;inset:0;border-radius:999px;background:#303641;transition:background .15s ease}.switch-control i:after{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#c6cad1;content:"";transition:transform .15s ease,background .15s ease}.switch-control input:checked+i{background:var(--brand)}.switch-control input:checked+i:after{background:#fff;transform:translate(14px)}.switch-control input:focus-visible+i{outline:2px solid #8d94ff;outline-offset:2px}.select-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}.select-row label span{display:block;margin-bottom:6px;color:#868e9b;font-size:11px}select{width:100%;height:34px;padding:0 9px;border:1px solid var(--border-strong);border-radius:8px;outline:none;background:#1b1f27;color:#d9dde4;font-size:11px}.full-width{width:100%;margin-top:8px}.export-section .button-primary{min-height:40px}.privacy-note{margin:12px 0 0;color:#6e7783;font-size:10px;line-height:1.5;text-align:center}.privacy-note span{margin-right:4px;color:#59c99f;font-size:7px;vertical-align:2px}.statusbar{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 15px;border-top:1px solid var(--border);background:#101319;color:#77808d;font-size:10px}.statusbar span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast-region{position:fixed;right:338px;bottom:48px;z-index:50;display:grid;gap:8px;width:min(360px,calc(100vw - 32px));pointer-events:none}.toast{display:flex;min-height:48px;align-items:center;justify-content:space-between;gap:14px;padding:10px 11px 10px 14px;border:1px solid rgb(255 255 255 / 12%);border-radius:11px;background:#1b1f27f5;color:#e6e9ee;font-size:11px;box-shadow:0 15px 38px #0000004d;pointer-events:auto;animation:toast-in .18s ease-out;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.toast[data-tone=error]{border-color:#ff869247}.toast-action{flex:none;padding:6px 9px;border-color:#858eff40;border-radius:6px;background:#6f78ff21;color:#c2c6ff;font-size:11px}.toast-action:hover{background:#6f78ff3b;color:#fff}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}@media(max-width:1080px){.topbar{grid-template-columns:180px minmax(0,1fr)}.header-status{display:none}.workspace{grid-template-columns:minmax(0,1fr) 300px}.tool-button{padding-inline:8px}.toast-region{right:318px}}@media(max-width:780px){#app{grid-template-rows:auto minmax(0,1fr) 30px}.topbar{grid-template-columns:1fr;gap:8px;padding:9px 12px 10px}.brand{justify-content:center}.toolbar{justify-content:flex-start;overflow-x:auto;padding:1px 1px 3px;scrollbar-width:none}.toolbar::-webkit-scrollbar{display:none}.workspace{grid-template-columns:minmax(0,1fr) 285px}.tool-button kbd,.toolbar-divider{display:none}.viewport-bottom-left>span:last-child{display:none}.toast-region{right:301px}}@media(max-width:680px){#app{grid-template-rows:auto minmax(0,1fr)}.brand{justify-content:flex-start}.workspace{display:grid;grid-template-columns:1fr;grid-template-rows:minmax(430px,58vh) auto;overflow-y:auto}.control-panel{overflow:visible;border-top:1px solid var(--border);border-left:none}.panel-intro{position:static}.drop-card{padding:24px 20px 21px}.workflow-steps{gap:6px}.workflow-steps i{width:8px}.viewport-bottom-left{display:none}.viewport-top-left{right:12px;left:12px;align-items:flex-start;flex-direction:column}.viewport-actions{top:auto;right:12px;bottom:12px}.statusbar{display:none}.toast-region{right:16px;bottom:16px}}@media(max-width:430px){.brand small,.reset-button{display:none}.drop-hint{padding:18px}.workflow-steps{align-items:flex-start}.workflow-steps span{flex-direction:column;gap:4px}.workflow-steps i{margin-top:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}