/* Shared UI density: 0.9 shrinks interface typography and controls by 10%. */
:root{--ui-density:.9}
:root{color-scheme:dark;--bg:#111619;--panel:#191f23;--line:#2c353a;--text:#e0e7e8;--muted:#91a0a7;--accent:#76d6c1;--orange:#f3b874}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:calc(13px * var(--ui-density, 1))/1.5 'Segoe UI','Microsoft YaHei',sans-serif}button,input,textarea{font:inherit}button{border:1px solid var(--line);color:var(--text);background:#232c31;border-radius:calc(6px * var(--ui-density, 1));padding:calc(7px * var(--ui-density, 1)) calc(11px * var(--ui-density, 1));cursor:pointer;white-space:nowrap}button:hover{background:#303c42;border-color:#55636b}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.primary{background:var(--accent);color:#102e29;border-color:var(--accent);font-weight:650}.primary:hover{background:#99e6d5;border-color:#99e6d5}.quiet{background:transparent}.header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--line);gap:18px;background:#171e22}.brand{display:flex;gap:12px;align-items:center;min-width:200px}.brand strong{font-size:calc(16px * var(--ui-density, 1));letter-spacing:calc(3.4px * var(--ui-density, 1));font-weight:600;text-transform:uppercase}.brand-ai{color:var(--accent);font-size:.74em;letter-spacing:.08em;margin-left:.5em;font-weight:600;vertical-align:.08em}.brand small{display:block;color:var(--muted);font-size:calc(11px * var(--ui-density, 1));margin-top:2px;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand-icon{font-size:calc(30px * var(--ui-density, 1));color:var(--accent)}.steps{display:flex;align-items:center;gap:14px;font-size:calc(12px * var(--ui-density, 1));color:#6c7b83;white-space:nowrap}.steps i{font-style:normal;color:#39474d}.steps .done{color:#b2c4c8}.steps .active{color:var(--accent)}.header-actions{display:flex;gap:12px;align-items:center}.header-actions #saveState{font-size:calc(11px * var(--ui-density, 1));color:var(--muted)}.header-actions b{padding-left:18px}.workspace{height:calc(100dvh - 78px);display:grid;grid-template-columns:250px minmax(280px,1fr) 270px}.left-panel,.right-panel{background:var(--panel);overflow:auto}.left-panel{display:flex;flex-direction:column;border-right:1px solid var(--line)}.panel-title{padding:22px 16px 12px}.panel-title h2,.inspector-heading h2{font-size:calc(14px * var(--ui-density, 1));margin:0;font-weight:600}.panel-title h2 span{color:var(--muted);margin-left:9px;font-size:calc(12px * var(--ui-density, 1))}.panel-title button{margin-top:16px;width:100%;text-align:center;background:#202a2f;color:#b0c5ca}.search-wrap{padding:0 16px 14px}input,textarea{background:#12191d;border:1px solid #354148;border-radius:calc(5px * var(--ui-density, 1));color:var(--text);padding:calc(8px * var(--ui-density, 1)) calc(10px * var(--ui-density, 1));width:100%;min-width:0}input::placeholder,textarea::placeholder{color:#677980}textarea{resize:vertical}input[type=checkbox]{width:auto;accent-color:var(--accent)}.filters{display:flex;padding:0 16px 12px;gap:4px;border-bottom:1px solid var(--line)}.filters button{border:0;background:transparent;padding:calc(6px * var(--ui-density, 1)) calc(9px * var(--ui-density, 1));color:var(--muted);font-size:calc(12px * var(--ui-density, 1))}.filters button.active{background:#294038;color:var(--accent)}.filters button span{font-size:calc(10px * var(--ui-density, 1));opacity:.8}.element-list{overflow:auto;flex:1;padding:8px 0}.layer{border:0;border-left:2px solid transparent;border-radius:0;background:transparent;display:flex;align-items:center;gap:calc(10px * var(--ui-density, 1));width:100%;text-align:left;padding:calc(10px * var(--ui-density, 1)) calc(16px * var(--ui-density, 1));min-height:calc(52px * var(--ui-density, 1));white-space:normal}.layer:hover{background:#222f34}.layer.selected{border-left-color:var(--accent);background:#243631}.layer .symbol{font-size:calc(18px * var(--ui-density, 1));width:calc(22px * var(--ui-density, 1));flex-shrink:0;color:var(--accent)}.layer.text .symbol{color:var(--orange)}.layer .layer-copy{flex:1;min-width:0}.layer strong{font-size:calc(12px * var(--ui-density, 1));font-weight:400;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer small{color:var(--muted);font-size:calc(10px * var(--ui-density, 1))}.layer .low{width:calc(5px * var(--ui-density, 1));height:calc(5px * var(--ui-density, 1));border-radius:50%;background:var(--orange)}.left-bottom{padding:12px;display:flex;justify-content:space-between;font-size:calc(10px * var(--ui-density, 1));color:var(--muted);border-top:1px solid var(--line)}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px}.dot.image{background:var(--accent)}.dot.text{background:var(--orange)}.canvas-panel{min-width:0;display:flex;flex-direction:column;overflow:hidden}.toolbar{height:59px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 16px;gap:12px;background:#1a2227}.tools,.zoom-tools{display:flex;gap:4px;align-items:center}.toolbar button{border:0;background:transparent;font-size:calc(15px * var(--ui-density, 1));padding:calc(7px * var(--ui-density, 1)) calc(9px * var(--ui-density, 1));color:#a8b7bc}.toolbar button span{font-size:calc(12px * var(--ui-density, 1));padding-left:calc(3px * var(--ui-density, 1))}.toolbar button.active{background:#2a413b;color:var(--accent)}.toolbar .zoom-tools button{font-size:calc(12px * var(--ui-density, 1))}.divider{border-left:1px solid var(--line);height:22px;margin:0 6px}.canvas-info{display:flex;align-items:center;padding:13px 20px;gap:12px;font-size:calc(11px * var(--ui-density, 1));color:#8f9da4}.canvas-info #aiState{margin-left:auto;color:#8eada3}.canvas-info #imageName{max-width:35%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewport{position:relative;overflow:auto;flex:1;background-color:#101619;background-image:radial-gradient(#334047 1px,transparent 1px);background-size:18px 18px;display:block;padding:36px;overscroll-behavior:contain;touch-action:none}.stage{position:relative;box-shadow:0 16px 60px #0006;line-height:0;user-select:none;margin:auto}.stage img{display:block;width:100%;height:100%;pointer-events:none}.stage svg{position:absolute;inset:0;width:100%;height:100%;touch-action:none;overflow:visible;cursor:crosshair}.stage svg.select-mode{cursor:default}.stage svg .box{stroke:#71dfc4;fill:#75dbba08;vector-effect:non-scaling-stroke;stroke-width:1}.stage svg .text-box{stroke:var(--orange);fill:#f3b87406}.stage svg .selected{stroke-width:2;fill:#75dbba16}.stage svg .handle{fill:white;stroke:#26473f;stroke-width:1;vector-effect:non-scaling-stroke}.loading{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);pointer-events:none}.canvas-footer{height:34px;padding:0 16px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:calc(10px * var(--ui-density, 1));color:#81919a;gap:12px}.right-panel{padding:21px 18px;border-left:1px solid var(--line)}.inspector-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px}.inspector-heading span{color:var(--muted);font-size:calc(10px * var(--ui-density, 1))}.empty-inspector{text-align:center;padding:75px 12px;color:var(--muted)}.empty-inspector>span{font-size:calc(38px * var(--ui-density, 1));color:#58767a}.empty-inspector h3{font-size:calc(14px * var(--ui-density, 1));font-weight:500;color:#b5c8cb}.empty-inspector p{font-size:calc(12px * var(--ui-density, 1))}.element-preview{height:125px;background:repeating-conic-gradient(#283238 0% 25%,#20292e 0% 50%) 50%/16px 16px;border:1px solid var(--line);border-radius:6px;margin-bottom:20px;display:flex;justify-content:center;align-items:center;overflow:hidden}.element-preview canvas{max-width:100%;max-height:100%;object-fit:contain}.field{display:block;margin-bottom:19px;font-size:calc(12px * var(--ui-density, 1));color:#aabac0}.field>input,.field>textarea{display:block;margin-top:8px}.field small{float:right;color:#74888f}.type-toggle{display:flex;margin-top:8px;gap:6px}.type-toggle button{width:50%;padding:calc(7px * var(--ui-density, 1))}.type-toggle button.active{color:var(--accent);border-color:#649e8e;background:#243d34}.coords{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:8px}.coords label{display:flex;align-items:center;background:#12191d;border:1px solid #354148;border-radius:5px;padding-left:9px;color:#7e9199;font-size:calc(10px * var(--ui-density, 1))}.coords input{border:0;background:transparent;padding:calc(8px * var(--ui-density, 1)) calc(6px * var(--ui-density, 1));font-size:calc(12px * var(--ui-density, 1))}.check{display:flex;align-items:center;gap:8px;margin-top:10px;color:#c2cecf}.inspector-actions{display:flex;justify-content:space-between;padding-top:6px}.danger{color:#e3a1a1;background:transparent}.tip{color:#72878e;font-size:calc(11px * var(--ui-density, 1));margin-top:22px;line-height:1.8}.toast{position:fixed;bottom:48px;left:50%;transform:translateX(-50%);background:#304e45;border:1px solid #6ea492;color:#dcf4ed;padding:12px 22px;border-radius:8px;box-shadow:0 5px 30px #0008;z-index:20;max-width:80vw}.toast[hidden]{display:none}dialog{color:var(--text);background:#1b2429;border:1px solid #40545a;border-radius:14px;padding:28px;max-width:520px;width:90vw;box-shadow:0 20px 100px #0009}dialog::backdrop{background:#071013bf;backdrop-filter:blur(4px)}.dialog-top h2{margin:8px 0 10px;font-size:calc(21px * var(--ui-density, 1))}.dialog-top p{color:#9fb0b7;font-size:calc(13px * var(--ui-density, 1))}.dialog-icon{font-size:calc(28px * var(--ui-density, 1));color:var(--accent)}.confirm-summary{display:flex;gap:calc(40px * var(--ui-density, 1));padding:calc(20px * var(--ui-density, 1)) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:22px}.confirm-summary strong{font-size:calc(26px * var(--ui-density, 1));font-weight:500;margin-right:8px;color:var(--accent)}.confirm-detail{padding:12px 0;color:#a5b8bd;font-size:calc(12px * var(--ui-density, 1))}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}#handoffText{margin-top:16px;font-size:calc(11px * var(--ui-density, 1))}button[hidden],div[hidden],label[hidden]{display:none}.list-empty{padding:30px 20px;color:var(--muted);font-size:calc(12px * var(--ui-density, 1))}@media(max-width:1200px){.workspace{grid-template-columns:215px minmax(280px,1fr) 235px}.header{padding:0 16px}.steps{display:none}.toolbar{padding:0 8px}.tools button span{display:none}.viewport{padding:24px}.canvas-info #aiState{display:none}}@media(max-width:850px){.workspace{grid-template-columns:175px minmax(200px,1fr) 210px}.header-actions #saveState{display:none}.brand{min-width:0}.brand strong{font-size:calc(14px * var(--ui-density, 1))}.header-actions{gap:6px}.header{gap:8px}.zoom-tools #zoomOut,.zoom-tools #zoomIn{display:none}.canvas-footer #canvasHint{display:none}}
/* Bottom log dock: one line collapsed, expandable above the workspace. */
.workspace{height:calc(100dvh - 110px)}
#reviewLogConsole{position:fixed;inset:auto 0 0;z-index:10000;width:100vw;color:var(--text);font:calc(12px * var(--ui-density, 1))/1.5 'Segoe UI','Microsoft YaHei',sans-serif;text-align:left}
.review-log-bar{display:flex;align-items:center;gap:12px;width:100%;height:32px;padding:0 14px;border:0;border-top:1px solid var(--line);border-radius:0;background:#1b252b;text-align:left;box-shadow:0 -2px 12px #0003}
.review-log-bar b{font-size:calc(11px * var(--ui-density, 1));color:var(--accent);flex-shrink:0}.review-log-latest{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#b8c8ce}.review-log-count{color:var(--muted);flex-shrink:0}.review-log-arrow{color:var(--accent)}
.review-log-bar[data-level=error] .review-log-latest{color:#ffb0a5}
#reviewLogPanel{position:absolute;bottom:32px;left:0;right:0;height:min(42dvh,400px);min-height:140px;background:#131c21;border-top:1px solid #455b64;box-shadow:0 -12px 40px #0006;display:flex;flex-direction:column}
#reviewLogPanel[hidden]{display:none}#reviewLogPanel header{display:flex;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid var(--line)}#reviewLogPanel header strong{color:var(--text);font-size:calc(13px * var(--ui-density, 1))}#reviewLogPanel header span{flex:1;color:var(--muted);font-size:calc(11px * var(--ui-density, 1))}#reviewLogPanel header button{padding:calc(4px * var(--ui-density, 1)) calc(10px * var(--ui-density, 1));font-size:calc(12px * var(--ui-density, 1))}
.review-log-list{overflow:auto;flex:1;padding:8px 14px;font:calc(12px * var(--ui-density, 1))/1.7 Consolas,'Microsoft YaHei',monospace;user-select:text}.review-log-entry{white-space:pre-wrap;overflow-wrap:anywhere;padding:5px 2px;border-bottom:1px solid #27353b;color:#c4d2d7}.review-log-entry[data-level=error]{color:#ffb0a5}.review-log-entry[data-level=warn]{color:var(--orange)}

.analysis-progress{margin:8px 12px;padding:12px 15px;border:1px solid #3b6470;border-radius:8px;background:#192b35;color:#d8e8ee;flex-shrink:0}.analysis-progress[hidden]{display:none}.analysis-progress header{display:flex;align-items:center;justify-content:space-between;gap:12px}.analysis-progress header button{padding:calc(4px * var(--ui-density, 1)) calc(8px * var(--ui-density, 1));font-size:calc(12px * var(--ui-density, 1))}.analysis-progress p{margin:6px 0;font-size:calc(12px * var(--ui-density, 1))}.analysis-progress progress{width:100%;height:6px;accent-color:#58d9c3}.analysis-progress small{color:#a8bdc9;line-height:1.5}.analysis-progress[data-state=failed]{border-color:#c57766}.analysis-progress[data-state=completed]{border-color:#4b9f85}
/* 「添加到画布」参考层：位于源图与框选 SVG 之上，可拖动、可选中、可显隐 */
#overlayLayers{position:absolute;inset:0;z-index:5;pointer-events:none}
#overlayLayers img{position:absolute;pointer-events:auto;cursor:move;outline:1px solid #76d6c166;box-shadow:0 4px 18px #0007}
#overlayLayers img.selected{outline:2px solid var(--accent);outline-offset:1px}
#overlayLayers img:hover{outline-color:var(--accent)}
.stage.cutout-stage #overlayLayers{display:none}
/* 锁定图层：框选不可点击，画布上无法选中/拖动 */
.stage svg .box.locked{pointer-events:none;stroke-dasharray:5 4;opacity:.55}
.stage svg .box.locked.selected{stroke-dasharray:5 4;opacity:.75}
#overlayLayers img.locked{pointer-events:none;outline-style:dashed;opacity:.92}