*{box-sizing:border-box}body{margin:0;background:#151b23;color:#e9eced;font:13px 'Segoe UI',Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit;background:#242d37;border:1px solid #38434e;border-radius:7px;padding:9px 12px;transition:background .12s}button:hover{background:#35424f}button:disabled{opacity:.35;cursor:default}input,select{background:#151c24;color:#edf2ed;border:1px solid #3b4550;border-radius:6px;width:100%;padding:8px;min-width:0}input:focus,select:focus{outline:1px solid #d6ef83;border-color:#d6ef83}input[type=number]{font-variant-numeric:tabular-nums}input[type=color]{padding:3px;width:33px;height:33px;flex-shrink:0;cursor:pointer}input[type=checkbox]{accent-color:#d6ef83;width:15px;height:15px}header{height:87px;display:flex;align-items:center;gap:17px;padding:0 25px;border-bottom:1px solid #343e49;background:#1b232d}a.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;font-size:18px;white-space:nowrap}.brand b{font-weight:400;color:#a9b4bf}.brand small{display:block;font-size:8px;letter-spacing:2.5px;color:#a0acb4;margin-top:5px}.logo{display:flex;align-items:center;justify-content:center;background:#d6ef83;color:#182126;font-size:32px;font-weight:800;width:41px;height:44px;border-radius:10px;letter-spacing:-10px;padding-right:8px}.logo span{font-size:17px;transform:translate(3px,-9px)}.tag{font-size:9px;font-weight:700;letter-spacing:1px;color:#b6c58f;padding:5px 7px;border:1px solid #48583b;border-radius:4px}.project-title{margin-left:auto;max-width:220px}.project-title input{background:transparent;border:0;padding:0;font-weight:600}.project-title span{display:block;font-size:10px;color:#8e9da9;margin-top:6px}nav{display:flex;gap:7px;margin-left:20px}.primary{background:#d6ef83;border-color:#d6ef83;color:#202822;font-weight:700}.primary:hover{background:#e5ffa1}.app{display:grid;grid-template-columns:251px minmax(350px,1fr) 292px;height:calc(100vh - 87px);min-height:610px}aside{background:#1b232d;overflow-y:auto}.left{border-right:1px solid #343e49;display:flex;flex-direction:column}.right{border-left:1px solid #343e49}section{padding:22px 19px;border-bottom:1px solid #343e49}.section-title{display:flex;align-items:center;gap:9px;color:#91a06c;font-size:11px;font-weight:600;margin-bottom:17px}.section-title h2{margin:0;color:#e8ebeb;font-size:13px;font-weight:600;letter-spacing:.2px}.section-title>span{margin-left:auto;font-size:10px;color:#a6b3be}label{display:block;color:#aebac4;font-size:11px;margin-top:13px}label>input,label>select{margin-top:6px}.row{display:flex;gap:8px}.row>label{flex:1;min-width:0}.divider{height:1px;background:#343e49;margin:21px 0}.check{display:flex;align-items:center;gap:8px;color:#e1e6e7}.check input{margin:0}.hint{color:#9caab6;font-size:11px;line-height:1.7;margin:12px 0 0}.wide{width:100%;display:flex;align-items:center;justify-content:space-between;margin-top:10px}.wide span{margin-right:auto;margin-left:11px}.shape-buttons{display:flex;gap:6px;margin-top:9px}.shape-buttons button{flex:1;padding:8px;font-size:19px;color:#c4d0db}.element{display:flex;align-items:center;gap:10px;border-radius:6px;padding:9px 8px;cursor:pointer;color:#adb9c5;margin:4px 0}.element.selected{background:#303e36;color:#d6ef83;outline:1px solid #596b46}.element .chip{width:8px;height:8px;border-radius:2px}.element small{margin-left:auto;font-size:9px}.left-foot{font-size:10px;color:#97a4af;padding:20px 17px;margin-top:auto;white-space:nowrap}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#d6ef83;margin-right:7px}main{display:flex;flex-direction:column;min-width:0;overflow:hidden}.workspace-bar{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid #343e49;background:#1b232d}.view-tabs{display:flex;gap:3px;background:#111820;padding:4px;border-radius:8px}.view-tabs button{background:transparent;border:0;color:#95a4b1;padding:7px 15px;font-size:11px}.view-tabs button.active{background:#36443d;color:#d6ef83}.history{display:flex;gap:4px}.history button{font-size:22px;border:0;background:none;padding:3px 7px;color:#aebbc7}#workspace{position:relative;flex:1;min-height:300px;background-color:#10171f;background-image:radial-gradient(#3b4652 1px,transparent 1px);background-size:19px 19px;overflow:hidden}canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none}canvas[hidden]{display:none}.canvas-label{position:absolute;top:23px;left:25px;z-index:2;font-size:9px;letter-spacing:1.2px;color:#a8b5c0;pointer-events:none}.canvas-label .live-dot{width:5px;height:5px}#emptyTip{position:absolute;bottom:55px;left:10px;right:10px;text-align:center;color:#8b9ba9;font-size:11px;pointer-events:none}.workspace-caption{display:flex;position:absolute;bottom:20px;left:25px;right:25px;justify-content:space-between;color:#acb9c5;font-size:10px;pointer-events:none}.bottom-panel{background:#1d2630;display:flex;gap:20px;align-items:center;padding:20px 25px;min-height:91px;border-top:1px solid #343e49}.bottom-panel b{font-size:12px;color:#d6ef83}.bottom-panel p{font-size:10px;line-height:1.6;color:#aab7c1;max-width:310px;margin:5px 0 0}#heightStack{display:flex;flex-direction:column-reverse;gap:3px;margin-left:auto;min-width:120px}#heightStack span{display:block;height:7px;border-radius:2px}#status{font-size:11px;color:#b3c7ad;padding:10px 25px;background:#17221c;line-height:1.6;max-height:115px;overflow:auto}#status.error{background:#30231d;color:#f3bc9d}.level{border:1px solid #3d4752;border-radius:8px;padding:12px;margin-bottom:9px;background:#202a34}.level.active{border-color:#9ab169;background:#29342f}.level-head{display:flex;align-items:center;gap:8px}.level-head input[type=text]{background:transparent;border:none;font-weight:600;padding:4px;font-size:12px}.level-head button{border:0;padding:3px 4px;background:transparent;color:#a8b3bc}.level-meta{display:flex;align-items:center;justify-content:space-between;margin-top:10px;font-size:10px;color:#aebbc5}.thickness{width:70px;padding:5px}.level-meta label{display:flex;align-items:center;gap:5px;margin:0}.subtle{background:none;justify-content:center;border-style:dashed;color:#c2d497}summary{cursor:pointer;font-weight:600;font-size:12px}.prop-actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}.prop-actions button{font-size:10px;flex:1;padding:8px}.danger{color:#ffad96}.empty-properties{font-size:12px;color:#a2b0bc;line-height:1.8;padding:8px 0}.support-note{font-size:10px;color:#c4d899;background:#303a29;border-radius:6px;padding:10px;margin-top:12px;line-height:1.7}#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);padding:13px 22px;background:#d6ef83;color:#1d2c24;border-radius:9px;box-shadow:0 8px 35px #0008;z-index:5;display:none;font-weight:600;max-width:80vw}#toast.visible{display:block}@media(max-width:1150px){.tag{display:none}.app{grid-template-columns:220px minmax(300px,1fr) 260px}header{padding:0 15px;gap:10px}.project-title{max-width:140px}nav{margin-left:0}nav button{padding:8px}.bottom-panel{padding:15px}.bottom-panel p{max-width:230px}}@media(max-width:850px){.app{grid-template-columns:200px minmax(300px,1fr) 250px;min-width:750px}header{min-width:750px}.project-title{display:none}nav{margin-left:auto}.brand{font-size:15px!important}section{padding:17px 13px}body{overflow-x:auto}}

.app{height:calc(100vh - 125px);grid-template-columns:270px minmax(350px,1fr) 292px}header{height:76px}.project-title{max-width:250px}.menubar{height:49px;display:flex;align-items:center;border-bottom:1px solid #343e49;background:#1b232d;padding:0 18px;gap:22px;position:relative;z-index:10}.menubar nav{display:flex;margin:0;gap:5px;height:100%;align-items:center}.menu{position:relative}.menu>summary{list-style:none;display:block;padding:9px 15px;border-radius:6px;font-size:13px;font-weight:500}.menu>summary::-webkit-details-marker{display:none}.menu[open]>summary,.menu>summary:hover{background:#354334;color:#d6ef83}.menu-popup{position:absolute;top:calc(100% + 5px);left:0;background:#242e38;border:1px solid #4b5863;border-radius:8px;box-shadow:0 14px 40px #0008;width:252px;padding:6px;max-height:75vh;overflow:auto}.menu-popup button{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;border:0;background:transparent;text-align:left;border-radius:4px;padding:11px 12px;font-size:12px}.menu-popup button:hover{background:#3a493b}.menu-popup button span{font-size:10px;color:#abb79e}.menu-popup hr{border:0;border-top:1px solid #46515b;margin:4px}.insert-popup{width:332px}.submenu>summary{padding:11px 12px;font-size:12px;border-radius:4px;font-weight:400}.submenu>summary:hover{background:#354334}.submenu>summary>span{float:right}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:8px 4px;border-bottom:1px solid #45515c}.gallery button{flex-direction:column;justify-content:center;gap:5px;padding:10px 4px;font-size:10px;min-height:66px;border:1px solid #414d57;background:#1b252e}.gallery canvas{position:static!important;inset:auto;width:34px;height:30px;pointer-events:none}.menu-history{margin-left:auto;display:flex;gap:3px}.menu-history button{border:0;background:transparent;font-size:24px;padding:0 9px}#menuHint{font-size:10px;color:#9eacb8}#propertiesTitle{font-size:14px}.empty-properties{padding:8px 0 18px;line-height:1.9}#properties .prop-actions{margin-top:15px}#properties .danger{width:100%;font-size:11px;padding:9px}.selection-level{display:flex;align-items:center;gap:7px;font-size:11px;color:#c6d59d;padding-bottom:8px}.selection-level .chip{width:10px;height:10px;display:block;border-radius:3px}.left{overflow-x:hidden}.left section:first-child{min-height:170px}.element{font-size:11px}.element>span:nth-child(2){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.element:focus-visible{outline:2px solid #d6ef83}.element small{white-space:nowrap}.workspace-bar{height:57px;flex-shrink:0}#fit{background:transparent;color:#b6c5b1;border-color:#425047;font-size:11px;padding:7px 10px}#workspace{min-height:270px}.canvas-label{top:19px}.canvas-label,#emptyTip,.workspace-caption{z-index:2}#editor.placing{cursor:crosshair}#editor.panning,#preview:active{cursor:grabbing}#orientation{position:absolute;top:8px;right:12px;width:116px;z-index:3;background:#142029a8;border-radius:12px;padding-bottom:6px}#orientation[hidden]{display:none}#viewCube{position:static;width:116px;height:116px;cursor:grab;display:block}.cube-views{display:flex;justify-content:center;gap:2px;flex-wrap:wrap;padding:0 8px}.cube-views button{font-size:9px;padding:3px 5px;border-color:#526458;background:#22312b;border-radius:3px}#cubeHome{display:block;margin:4px auto 0;padding:1px 10px;font-size:18px;border:0;background:transparent;color:#d6ef83}#insertPrompt{position:absolute;bottom:54px;left:50%;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:12px;background:#304235f2;color:#e2f0c3;border:1px solid #6c855b;box-shadow:0 8px 25px #0006;padding:10px 12px;border-radius:9px;max-width:90%;font-size:11px;white-space:nowrap}#insertPrompt[hidden]{display:none}#cancelInsert{font-size:10px;white-space:nowrap;padding:5px 8px;background:#233126;border-color:#678258}#emptyTip.inserting{visibility:hidden}.bottom-panel{min-height:80px;padding:14px 22px}.bottom-panel p{max-width:340px}#status{flex-shrink:0}.selection-fieldset{border:0;padding:0;margin:0}.left-foot{font-size:9px}.swatch{display:inline-block;width:10px;height:10px;border-radius:2px;vertical-align:middle}.hint.inline{margin-top:6px;font-size:10px}.menu-popup .gallery button[aria-pressed=true]{background:#465a3a}@media(max-width:1150px){.app{grid-template-columns:235px minmax(300px,1fr) 260px}.menubar{padding:0 12px}#menuHint{font-size:9px}.left-foot{padding:15px 12px;white-space:normal}}@media(max-width:850px){.app{grid-template-columns:220px minmax(300px,1fr) 245px;min-width:765px}.menubar{min-width:765px}header{min-width:765px}#menuHint{display:none}.bottom-panel p{max-width:220px}.project-title{display:block;margin-left:auto}}
.left{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.left>section,.left>.left-foot{flex:0 0 auto}
.left>section{min-width:0;height:auto;overflow:visible}
#properties{display:flow-root;line-height:1.55;min-width:0}
#properties>label,#properties .row>label{min-width:0;overflow-wrap:anywhere;line-height:1.5}
#properties .row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:start}
#properties .row>label{margin-top:13px}
#properties input,#properties select{display:block;width:100%;max-width:100%;min-height:34px;line-height:1.4}
#properties .check{display:flex;align-items:center;gap:8px;min-height:25px;flex-wrap:wrap}
#properties .check input{width:15px;min-height:15px;flex:0 0 15px;margin:0}
#properties .prop-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-items:stretch;margin-top:13px}
#properties .prop-actions:has([data-action="delete"]){grid-template-columns:repeat(2,minmax(0,1fr))}
#properties .prop-actions button,#properties .danger{width:auto;min-width:0;min-height:35px;white-space:normal;overflow-wrap:anywhere;line-height:1.4;padding:8px 5px;font-size:10px}
.selection-level{flex-wrap:wrap;line-height:1.6;overflow-wrap:anywhere}
.selection-level .chip{flex:0 0 10px}
.section-title{flex-wrap:wrap;line-height:1.5}
.level-color{width:33px;height:33px;min-width:33px;flex:0 0 33px;padding:0;border:2px solid #cbd5bd;border-radius:5px}
.level-color[aria-expanded="true"]{outline:2px solid #d6ef83;outline-offset:3px}
.level-head input[type="text"]{min-width:0;flex:1}
.level-meta{flex-wrap:wrap;gap:7px;line-height:1.5}
.palette-panel{margin-top:21px;padding-top:17px;border-top:1px solid #455347}
.palette-title{font-size:12px;font-weight:600;color:#e1e8dc;line-height:1.5}
.saved-colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(25px,1fr));gap:7px;margin-top:12px;padding:3px}
.palette-swatch{display:block;width:100%;aspect-ratio:1;max-height:34px;min-height:25px;padding:0;border-radius:4px;border:1px solid #748075}
.palette-swatch.selected{outline:2px solid #d6ef83;outline-offset:2px;border-color:#142016}
.palette-swatch:hover{transform:scale(1.08)}
#colorPickerPanel{padding:11px;background:#16221c;border:1px solid #667951;border-radius:8px;margin-bottom:17px}
#colorPickerPanel[hidden]{display:none}
.color-picker-title{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:#dce8c7;font-size:11px;line-height:1.5}
.color-picker-title>span{flex:1;min-width:0;overflow-wrap:anywhere}
#closeColorPicker{padding:0 5px;border:0;background:transparent;font-size:19px;line-height:1.4}
#colorField{position:static;display:block;inset:auto;width:100%;height:132px;border-radius:5px;cursor:crosshair;touch-action:none}
.hue-label{display:grid;gap:6px;font-size:10px;line-height:1.5}
#colorHue{appearance:none;-webkit-appearance:none;width:100%;height:13px;min-height:13px;padding:0;border:0;border-radius:10px;background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);cursor:pointer;margin-top:0}
#colorHue::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:18px;border-radius:5px;background:#fff;border:2px solid #31402a;box-shadow:0 0 0 1px #fff}
#colorHue::-moz-range-thumb{width:13px;height:17px;border-radius:4px;background:#fff;border:2px solid #31402a}
#saveColor{display:flex;justify-content:flex-start;gap:9px;white-space:normal;font-size:10px;line-height:1.5;padding:8px}
#currentColorChip{display:block;width:20px;height:20px;flex:0 0 20px;border:1px solid #b1bdac;border-radius:3px;margin:0}
#paletteTarget{line-height:1.6;overflow-wrap:anywhere}
#imageImportDialog{color:#e9eced;background:#1b252e;border:1px solid #586650;border-radius:15px;box-shadow:0 22px 90px #000b;padding:0;width:min(1040px,94vw);max-width:1040px;max-height:91vh;overflow:hidden}
#imageImportDialog::backdrop{background:#050c12b8;backdrop-filter:blur(3px)}
.image-modal-head{display:flex;align-items:center;gap:20px;padding:24px 26px 19px;border-bottom:1px solid #3b4853}
.image-modal-head h2{font-size:23px;font-weight:600;margin:7px 0;color:#e8efdd}
.image-eyebrow{font-size:9px;letter-spacing:1.5px;color:#b6c997}
.image-modal-head p{font-size:12px;line-height:1.7;color:#aebdc5;margin:0}
#closeImageImport{margin-left:auto;align-self:flex-start;font-size:25px;background:transparent;border:0;padding:1px 8px}
.image-modal-body{padding:20px 26px;max-height:calc(91vh - 205px);overflow-y:auto;overscroll-behavior:contain}
.image-prompt-box{padding:13px 16px;border:1px solid #50613d;border-radius:8px;background:#29342a;margin-bottom:19px}
.image-prompt-box summary{color:#d5e6b6;line-height:1.6}
#imagePromptText{width:100%;resize:vertical;min-height:170px;max-height:300px;display:block;margin:13px 0;padding:13px;font:11px/1.7 'Segoe UI',sans-serif;background:#152119;border:1px solid #647657;color:#e3edda;border-radius:6px}
#copyImagePrompt{font-size:11px;background:#3d5033;border-color:#71885b}
.image-chooser{display:flex;align-items:center;flex-wrap:wrap;gap:13px;margin-bottom:20px}
#imageFileName{color:#aebdc5;font-size:11px;overflow-wrap:anywhere}
.image-import-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:23px;align-items:start}
.image-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.image-previews figure{margin:0;min-width:0}
.image-previews figcaption{display:flex;gap:8px;flex-wrap:wrap;font-size:12px;color:#e1e8d8;margin-bottom:9px;line-height:1.5}
.image-previews figcaption span{font-size:9px;color:#94a7ae}
.image-checker{height:264px;min-height:180px;border:1px solid #52616a;border-radius:8px;display:flex;justify-content:center;align-items:center;padding:10px;background-color:#b3bab9;background-image:linear-gradient(45deg,#7b8688 25%,transparent 25%),linear-gradient(-45deg,#7b8688 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#7b8688 75%),linear-gradient(-45deg,transparent 75%,#7b8688 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}
.image-checker canvas{position:static;inset:auto;display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;image-rendering:pixelated}
.image-checker canvas[hidden]{display:none}
.image-checker canvas.pick-background{cursor:crosshair}
.image-import-info{margin-top:15px;padding:13px;border-radius:7px;background:#28392b;border:1px solid #546b42;color:#d5e3bb;font-size:11px;line-height:1.8;overflow-wrap:anywhere}
.image-import-info.warning{background:#44351e;border-color:#887044;color:#f0d5a6}
.image-settings{background:#162129;border:1px solid #3f5059;border-radius:9px;padding:0 15px 15px;min-width:0}
.image-settings label{line-height:1.6}
.image-settings .row{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.image-settings input,.image-settings select{min-width:0;line-height:1.5}
.image-advanced{margin-top:16px;padding:11px 0;border-top:1px solid #3d4c55;border-bottom:1px solid #3d4c55}
.image-advanced summary{font-size:11px;line-height:1.7}
.image-advanced .check{align-items:flex-start;line-height:1.6}
.image-advanced .check input{flex:0 0 15px;margin-top:2px}
.image-color-row{display:flex;gap:9px;align-items:center;border-top:1px solid #3a4a52;margin-top:12px;padding-top:12px;min-width:0}
.image-source-chip{width:29px;height:29px;flex:0 0 29px;border:1px solid #b7c4bb;border-radius:4px}
.image-color-row>span:nth-child(2){font-size:11px;line-height:1.6;min-width:0}
.image-color-row small{display:block;font-size:9px;color:#97aab3;white-space:normal}
.image-level-label{margin:0 0 0 auto;min-width:0;flex:1;max-width:140px;font-size:9px}
.image-level-label select{font-size:10px;padding:6px}
.image-modal-footer{display:flex;gap:10px;align-items:center;padding:16px 26px;border-top:1px solid #3d4b55;background:#1a262b}
.image-modal-footer>span{margin-right:auto;font-size:10px;line-height:1.6;color:#9eb0b8}
.image-modal-footer button{font-size:11px;white-space:nowrap}
.image-group-hint{margin-top:0;margin-bottom:14px;padding:9px;background:#293a2c;border-radius:6px;color:#c8d9ab}
@media(max-width:950px){.image-import-layout{grid-template-columns:minmax(0,1fr) 250px;gap:15px}.image-checker{height:215px}.image-modal-body{padding:16px}.image-modal-head{padding:20px}.image-modal-footer{padding:14px 18px}.image-previews{grid-template-columns:1fr}.image-checker{height:170px}}
@media(max-width:640px){.image-import-layout{grid-template-columns:1fr}.image-previews{grid-template-columns:repeat(2,minmax(0,1fr))}.image-modal-footer{flex-wrap:wrap}.image-modal-footer>span{width:100%}}
#imageImportDialog{height:min(850px,91vh)}
#imageImportDialog[open]{display:flex;flex-direction:column}
.image-modal-head,.image-modal-footer{flex:0 0 auto}
.image-modal-body{flex:1 1 auto;min-height:0;max-height:none}
#imagePromptFeedback{display:block;margin-top:10px;font-size:11px;line-height:1.7;color:#d6ef83}

#installDialog{width:min(520px,90vw);border:1px solid #3d4854;border-radius:16px;background:#1b242e;color:#eef2f5}#installDialog::backdrop{background:#0009}.install-content{padding:24px}.install-content p{line-height:1.6;color:#c2cbd4}.install-content h2{margin:0 0 16px}.install-content button{margin-top:12px}

.brand-mark{display:block;flex:0 0 46px;width:46px;height:46px;object-fit:contain;border-radius:11px}.brand{gap:11px}

/* Interface themes copied from the current CarruMate palette. */
:root[data-theme=dark]{color-scheme:dark;--bg:#161819;--panel:#1e2123;--line:#35383a;--muted:#a6acad;--accent:#caff5d;--ui-text:#f1f3ee;--ui-control:#15191a;--ui-button:#292d30;--ui-hover:#3a3f42;--ui-accent-text:#1b2513;--ui-well:#171b1d;--ui-dot:#3b4348;--ui-subtle:#252c26;--ui-invalid:#ffad96;}
:root[data-theme=light]{color-scheme:light;--bg:#f2f4f5;--panel:#ffffff;--line:#c9d0d5;--muted:#52616b;--accent:#174f85;--ui-text:#202c35;--ui-control:#f9fafb;--ui-button:#e7edf2;--ui-hover:#d7e2eb;--ui-accent-text:#ffffff;--ui-well:#e8edf1;--ui-dot:#c3cdd5;--ui-subtle:#eef2f5;--ui-invalid:#b52626;}
:root[data-theme=paper]{color-scheme:light;--bg:#eee7d8;--panel:#f8f1e3;--line:#cbbb9f;--muted:#6c5c45;--accent:#76502e;--ui-text:#382e22;--ui-control:#fff9ed;--ui-button:#e8ddc8;--ui-hover:#dcccaf;--ui-accent-text:#fffaf0;--ui-well:#e5dac4;--ui-dot:#c4b495;--ui-subtle:#f0e6d3;--ui-invalid:#a62e20;}
html[data-theme] body{background:var(--bg);color:var(--ui-text)}
html[data-theme] button{color:var(--ui-text);background-color:var(--ui-button);border-color:var(--line)}
html[data-theme] button:hover{background-color:var(--ui-hover)}
html[data-theme] button.primary,html[data-theme] #toast{background:var(--accent);border-color:var(--accent);color:var(--ui-accent-text)}
html[data-theme] input:not([type=range]):not([type=color]),html[data-theme] select,html[data-theme] textarea{background:var(--ui-control);color:var(--ui-text);border-color:var(--line)}
html[data-theme] input:focus,html[data-theme] select:focus{outline-color:var(--accent);border-color:var(--accent)}
html[data-theme] input[type=checkbox],html[data-theme] input[type=range]{accent-color:var(--accent)}
html[data-theme] header,html[data-theme] aside,html[data-theme] .menubar,html[data-theme] .workspace-bar,html[data-theme] .bottom-panel,html[data-theme] .menu-popup,html[data-theme] #imageImportDialog,html[data-theme] #installDialog,html[data-theme] .image-modal-footer{background:var(--panel);border-color:var(--line)}
html[data-theme] section,html[data-theme] .palette-panel,html[data-theme] .image-modal-head,html[data-theme] .image-advanced,html[data-theme] .image-color-row,html[data-theme] .menu-popup hr,html[data-theme] .gallery{border-color:var(--line)}
html[data-theme] .divider{background:var(--line)}
html[data-theme] .level,html[data-theme] .image-settings,html[data-theme] #colorPickerPanel{background:var(--ui-control);border-color:var(--line)}
html[data-theme] .level.active,html[data-theme] .element.selected,html[data-theme] .support-note,html[data-theme] .image-group-hint,html[data-theme] .image-prompt-box,html[data-theme] .image-import-info,html[data-theme] #status{background:var(--ui-subtle);border-color:var(--accent);color:var(--ui-text)}
html[data-theme] .level.active,html[data-theme] .element.selected{outline-color:var(--accent)}
html[data-theme] .view-tabs{background:var(--ui-well)}
html[data-theme] .view-tabs button,html[data-theme] .menu-popup button,html[data-theme] .level-head button,html[data-theme] .menu-history button,html[data-theme] #closeImageImport,html[data-theme] #closeColorPicker{background:transparent}
html[data-theme] .view-tabs button.active,html[data-theme] .menu-popup button:hover,html[data-theme] .menu[open]>summary,html[data-theme] .menu>summary:hover,html[data-theme] .submenu>summary:hover{background:var(--ui-hover);color:var(--accent)}
html[data-theme] .gallery button,html[data-theme] #copyImagePrompt,html[data-theme] #cancelInsert{background:var(--ui-button);border-color:var(--line);color:var(--ui-text)}
html[data-theme] .gallery button:hover{background:var(--ui-hover)}
html[data-theme] #workspace{background-color:var(--ui-well);background-image:radial-gradient(var(--ui-dot) 1px,transparent 1px)}
html[data-theme] #orientation{background:var(--panel);border:1px solid var(--line)}
html[data-theme] #insertPrompt{background:var(--panel);border-color:var(--accent);color:var(--ui-text)}
html[data-theme] .section-title h2,html[data-theme] .palette-title,html[data-theme] .image-modal-head h2,html[data-theme] .image-previews figcaption,html[data-theme] .color-picker-title,html[data-theme] .check{color:var(--ui-text)}
html[data-theme] label,html[data-theme] .hint,html[data-theme] .brand small,html[data-theme] .brand b,html[data-theme] .project-title span,html[data-theme] .element,html[data-theme] .element small,html[data-theme] .left-foot,html[data-theme] .canvas-label,html[data-theme] #emptyTip,html[data-theme] .workspace-caption,html[data-theme] .bottom-panel p,html[data-theme] .level-meta,html[data-theme] .section-title>span,html[data-theme] .menu-popup button span,html[data-theme] #menuHint,html[data-theme] .empty-properties,html[data-theme] .image-modal-head p,html[data-theme] #imageFileName,html[data-theme] .image-previews figcaption span,html[data-theme] .image-color-row small,html[data-theme] .image-modal-footer>span,html[data-theme] .install-content p{color:var(--muted)}
html[data-theme] .tag,html[data-theme] .section-title,html[data-theme] .bottom-panel b,html[data-theme] .selection-level,html[data-theme] #cubeHome,html[data-theme] .image-eyebrow,html[data-theme] #imagePromptFeedback,html[data-theme] .image-prompt-box summary{color:var(--accent)}
html[data-theme] .tag,html[data-theme] .palette-swatch.selected{border-color:var(--accent);outline-color:var(--accent)}
html[data-theme] .element:focus-visible{outline-color:var(--accent)}
html[data-theme] .live-dot{background:var(--accent)}
html[data-theme] #imagePromptText{background:var(--ui-control);border-color:var(--line);color:var(--ui-text)}
html[data-theme] #fit{background:var(--ui-button);color:var(--ui-text);border-color:var(--line)}
html[data-theme] .danger,html[data-theme] #status.error{color:var(--ui-invalid)}
html[data-theme] #status.error{background:var(--panel)}
html[data-theme=light] .image-import-info.warning,html[data-theme=paper] .image-import-info.warning{background:#fff1d1;color:#654414;border-color:#a77a2c}
.theme-setting{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0;padding:9px 12px;font-size:12px}
.theme-setting select{width:115px;margin:0;padding:6px;font-size:12px}

html[data-theme] #imageImportDialog,html[data-theme] #installDialog{color:var(--ui-text)}
html[data-theme] .element.selected{color:var(--accent)}

/* Layer-centered workspace */
.app{grid-template-columns:330px minmax(340px,1fr);min-width:690px}
header,.menubar{min-width:690px}
.left .layers-section{padding:18px 14px;min-height:0}
.left>section{padding:16px 14px}.left section:first-child{min-height:0}
.layer{padding:0;overflow:hidden;border:1px solid var(--line);border-radius:8px;margin-bottom:9px;background:var(--ui-control)}.layer.active{border-color:var(--accent)}.layer>summary{display:flex;align-items:center;gap:9px;padding:14px 10px;list-style:none;font-size:12px}
.layer>summary::-webkit-details-marker,.fold>summary::-webkit-details-marker{display:none}
.layer>summary::after,.fold>summary::after{content:'+';margin-left:auto;font-size:18px;font-weight:400;line-height:1}
.layer[open]>summary::after,.fold[open]>summary::after{content:'−'}
.layer>summary>span:nth-child(2){flex:1;min-width:0;overflow-wrap:anywhere}.layer>summary small{font-size:10px;color:var(--muted)}
.chip{width:15px;height:15px;border-radius:4px;display:inline-block;flex-shrink:0}
.layer-body{padding:0 12px 12px;border-top:1px solid var(--line)}
.layer-body .row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:8px}
.layer-body label{min-width:0}.layer-range{font-size:10px;color:var(--muted);margin:10px 0}
.layer-color-button{justify-content:flex-start;gap:9px;margin:12px 0}.layer-color-button .chip{margin:0;width:21px;height:21px}
.fold{margin-top:8px;border-top:1px solid var(--line)}.fold>summary{list-style:none;display:flex;align-items:center;padding:12px 0;font-size:12px;font-weight:500}
.layer-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding-bottom:10px}
.layer-gallery button{padding:9px 6px;font-size:11px;min-width:0;overflow-wrap:anywhere}
.layer-body .element{width:100%;text-align:left;min-width:0}.layer-body .element .chip{margin:0}
.layer-body .element span:nth-child(2){flex:1}.layer-body .element.selected{border-color:var(--accent)}
.attachment{padding-bottom:12px}.palette-panel{margin-top:0}.palette-panel>.palette-title{display:none}
#inspector[hidden]{display:none}#inspector{border-top:1px solid var(--line)}
@media(max-width:850px){.app{grid-template-columns:290px minmax(340px,1fr);min-width:630px}header,.menubar{min-width:630px}}

/* Desktop editing workspace, v0.8 */
body{min-width:1000px;overflow-x:auto}.topbar{height:58px;min-width:1000px;display:flex;flex-wrap:nowrap;gap:10px;padding:0 14px;position:relative;z-index:10}
.topbar .brand{font-size:14px;gap:8px}.topbar .brand-mark{width:34px;height:34px;border-radius:8px}.topbar nav{margin:0;height:auto;flex-shrink:0}.topbar .menu>summary{font-size:24px;line-height:1;padding:7px 10px}
.topbar .view-controls{display:flex;align-items:center;gap:10px;margin-left:24px}.topbar .view-tabs button{font-size:12px;padding:7px 12px;white-space:nowrap}.topbar #fit{white-space:nowrap}
.topbar .menu-history{margin-left:auto;gap:3px}.topbar .menu-history button{font-size:23px;padding:4px 7px}.topbar .project-title{margin:0 0 0 8px;max-width:190px;width:190px;flex-shrink:0;display:block}.topbar .project-title input{font-size:12px;padding:8px;border:1px solid var(--line);border-radius:6px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.app{height:calc(100vh - 58px);min-height:540px;grid-template-columns:330px minmax(670px,1fr);min-width:1000px}.app main{min-height:0}
.layer>summary{gap:6px;padding:12px 9px}.layer>summary>span:nth-child(2){overflow:visible}.layer>summary .layer-name{display:flex;align-items:center;gap:2px;min-width:0;flex:1;font-size:12px;overflow-wrap:anywhere}
.layer-thickness{display:flex;align-items:center;gap:1px;white-space:nowrap;font-size:10px;color:var(--muted);flex-shrink:0}.layer>summary .header-pencil{padding:2px 3px;border:0;background:transparent;font-size:15px;color:var(--muted);line-height:1;flex-shrink:0}.layer>summary .header-pencil:hover{color:var(--accent);background:var(--ui-hover)}
.layer>summary .layer-swatch{width:23px;height:23px;border:1px solid var(--line);border-radius:5px;flex-shrink:0;padding:0}.layer [data-header-edit]{padding:4px;margin:0;max-width:140px;font-size:11px;height:28px}.layer [data-header-edit=thickness]{width:66px}.layer-range{margin-top:10px}
.shape-picker{margin:0 0 8px}.shape-picker>summary{font-size:11px;padding:9px;border:1px solid var(--line);border-radius:6px;font-weight:400;background:var(--ui-button)}.shape-picker .layer-gallery{margin-top:8px;max-height:260px;overflow:auto;padding:3px}
.object-properties{padding:10px 0 12px;border-top:1px solid var(--line);line-height:1.5}.editing-label{color:var(--muted);font-size:10px}.object-properties label{margin-top:10px}.object-properties .row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.object-properties .check{display:flex}.object-properties .check input{width:15px}.object-properties .prop-actions button{font-size:10px}
#layerColorDialog{padding:18px;width:290px;max-width:none;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ui-text)}#layerColorDialog::backdrop{background:#0006}#layerColorDialog #colorField{position:static;width:100%;height:132px;margin-top:14px}.color-picker-title{display:flex;align-items:center;justify-content:space-between;gap:8px}#layerColorDialog #savedColors{margin-top:12px}#layerColorDialog .hint{font-size:10px}
#rulers{z-index:5;pointer-events:none}#guideSnap{position:absolute;left:0;top:0;width:24px;height:24px;padding:0;z-index:6;font-size:19px;border-radius:0;border:0;background:var(--panel);color:var(--muted)}#guideSnap[aria-pressed=true]{color:var(--accent)}#guideSnap[hidden]{display:none}
#workspace .canvas-label{top:40px;left:40px}#inlineText{position:absolute;z-index:7;inset:auto;box-sizing:border-box;max-width:none;min-width:0;text-align:center;line-height:1.1;padding:4px 8px;background:var(--panel);color:var(--ui-text);border:2px solid var(--accent);border-radius:4px;transform-origin:center;outline:none}#inlineText[hidden]{display:none}
.bottom-panel{min-height:64px;padding:10px 22px}.bottom-panel p{max-width:480px}.workspace-caption{left:40px}

.layer>summary .header-trash{display:inline-flex;align-items:center;justify-content:center;padding:3px;border:0;background:transparent;color:var(--muted);flex-shrink:0;border-radius:4px}.layer>summary .header-trash:hover{color:var(--ui-invalid);background:var(--ui-hover)}.header-trash svg{pointer-events:none}.attachment-selected{border-color:var(--accent)!important;color:var(--accent)!important}

/* Reserved advertising rail: independent of the editor, without ad scripts. */
.app{grid-template-columns:330px minmax(480px,1fr) 186px}
.ad-rail{min-width:0;min-height:0;padding:18px 12px 12px;border-left:1px solid var(--line);overflow-y:auto;display:flex;flex-direction:column;align-items:center;gap:12px}
.ad-rail h2{font-size:9px;font-weight:400;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin:0}
.advertising-slot{width:160px;max-width:100%;height:clamp(250px,calc(100vh - 146px),600px);flex-shrink:0;border:1px dashed var(--line);border-radius:6px;background:var(--ui-well)}
#infoDialog{width:min(740px,calc(100vw - 80px));max-height:calc(100vh - 60px);padding:0;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ui-text)}#infoDialog::backdrop{background:#0008}
.info-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 24px;border-bottom:1px solid var(--line)}.info-heading h2{font-size:18px;margin:0}.info-heading button{padding:3px 10px;font-size:24px;line-height:1;border:0;background:transparent;color:var(--muted)}
.info-content{padding:6px 24px 22px;max-height:calc(100vh - 220px);overflow-y:auto;line-height:1.75;font-size:13px}.info-content h3{margin:22px 0 8px;font-size:14px;color:var(--accent)}.info-content ol{padding-left:20px}.info-content li{padding:5px 0 8px}.info-content p{margin:12px 0}.info-content a{color:var(--accent);text-underline-offset:3px}.info-date{color:var(--muted);font-size:11px}.info-contact-link{display:inline-block;border:1px solid var(--line);padding:9px 13px;border-radius:6px}
.info-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 24px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}

/* One shared toolbar, with explicit disclosure buttons on layer rows. */
.topbar .project-title{margin-left:auto}
.layers-heading{gap:8px;margin-bottom:14px;align-items:center}
.layers-toolbar{display:flex;align-items:center;gap:4px;margin-left:auto;flex-shrink:0}
.layers-toolbar button{width:28px;height:28px;padding:4px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--ui-button);color:var(--ui-text);border-radius:5px}
.layers-toolbar button:hover{background:var(--ui-hover)}
.layers-toolbar #deleteLevel:hover{color:var(--ui-invalid)}
.layers-toolbar svg{pointer-events:none}
.layers-heading>span{margin-left:2px;white-space:nowrap}
.layer>summary::after{display:none}
.layer>summary .layer-toggle{width:24px;height:24px;padding:0;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:19px;line-height:1;border:0;background:transparent;color:var(--muted)}
.layer>summary .layer-toggle:hover{background:var(--ui-hover);color:var(--accent)}