:root{font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;color:#263343;background:#f6f7f9;font-synthesis:none;--accent:#c84436;--muted:#7a8693;--border:#e3e7ed}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default}[hidden]{display:none!important}
.project-dialog{width:min(440px,calc(100vw - 32px));padding:24px;border:1px solid var(--border);border-radius:14px;color:inherit}.project-dialog::backdrop{background:#1d2b3e66}.project-dialog h2{margin:0 0 18px;font-size:20px}.project-dialog label{display:block;margin:12px 0 8px}.project-dialog input{width:100%;min-height:44px;border:1px solid var(--border);border-radius:8px;padding:10px}.project-dialog p{font-size:14px;line-height:1.7;overflow-wrap:anywhere}.project-dialog [data-project-error]{color:var(--accent)}.project-dialog [data-project-error]:empty{display:none}.project-dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.project-dialog-actions .button{min-height:44px}@media(max-width:600px){.project-toolbar .project-choice{flex:1 1 calc(100% - 150px)}}
.topbar{height:86px;background:#fff;border-bottom:1px solid var(--border);padding:0 max(32px,calc((100vw - 1240px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:42px;height:42px;color:var(--accent)}.brand strong{display:block;font-size:19px;letter-spacing:2px}.brand div>span{display:block;font-size:12px;color:var(--muted);margin-top:3px;letter-spacing:1px}.version{color:var(--muted);font-size:12px}.version span{margin-left:10px;padding:5px 8px;background:#f5f6f8;border-radius:5px}
.workspace{max-width:1240px;padding:30px 32px 24px;margin:0 auto}.steps{padding:0;margin:0 0 35px;display:flex;list-style:none;border:1px solid var(--border);border-radius:12px;background:#fff;overflow:hidden}.steps li{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;height:63px;font-size:14px;color:#8b95a1;position:relative}.steps li+li:before{content:"";position:absolute;left:0;height:22px;width:1px;background:var(--border)}.step-number{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#f0f2f5;font-size:12px}.steps .current{color:var(--accent);font-weight:700;background:#fff9f6}.current .step-number{background:var(--accent);color:white}
.eyebrow{font-size:11px;letter-spacing:2px;color:var(--accent);font-weight:700}h1{font-size:29px;letter-spacing:-.5px;margin:10px 0 12px;font-weight:700}.page-heading p{font-size:14px;color:#7a8693;line-height:1.8;margin:0}.page-heading{margin-bottom:28px}.main-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:stretch}.selection-panel,.preview-panel{background:white;border:1px solid var(--border);border-radius:14px;padding:23px}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px}.panel-heading h2{font-size:15px;font-weight:700;margin:0}.panel-heading>span{font-size:12px;color:#8b95a1}.shape-options{border:0;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}.shape-card{display:block;position:relative;cursor:pointer;border:1.5px solid #e2e7ed;border-radius:10px;padding:18px 18px 16px;background:#fcfdfe;transition:background .15s,border-color .15s,box-shadow .15s}.shape-card:hover{border-color:#acb7c3;background:#f8fafc}.shape-card.selected{border-color:var(--accent);background:#fff8f5;box-shadow:0 0 0 1px var(--accent)}.shape-card:has(input:focus-visible){outline:3px solid #5b95cc;outline-offset:4px}.shape-card input{position:absolute;right:16px;top:16px;width:16px;height:16px;margin:0;accent-color:var(--accent)}.shape-card svg{height:86px;display:block;width:100%;margin:8px 0 15px;color:#697e93}.shape-card.selected svg{color:var(--accent)}.shape-card .card-name{display:block;font-size:15px;font-weight:700;margin-bottom:6px}.shape-card .card-description{display:block;font-size:12px;color:#8a94a0;line-height:1.5}.card-outline{fill:currentColor;fill-opacity:.065;stroke:currentColor;stroke-width:6;stroke-linejoin:miter}.selection-hint{margin:18px 0 0;font-size:12px;line-height:1.8;color:#818c98;display:flex;align-items:flex-start;gap:8px}.hint-dot{width:5px;height:5px;flex:none;background:#a9b3bd;border-radius:50%;margin-top:8px}
.view-label{background:#f1f4f7;padding:5px 8px;border-radius:5px}.preview-canvas{position:relative;min-height:322px;border:1px solid #e7ebf0;border-radius:9px;background-color:#f9fbfd;background-image:linear-gradient(#e9edf2 1px,transparent 1px),linear-gradient(90deg,#e9edf2 1px,transparent 1px);background-size:20px 20px;display:flex;align-items:center;justify-content:center}.preview-canvas>svg{width:100%;height:320px}.room-fill{fill:#e8eef4;stroke:none}.room-boundary{stroke:#344f67;stroke-width:7;fill:none;stroke-linejoin:miter}.vertex{fill:#fff;stroke:#344f67;stroke-width:1.7}.room-caption{fill:#6b7d8d;font-size:13px;letter-spacing:1px}.view-indicator{position:absolute;top:13px;left:14px;font-size:10px;letter-spacing:1px;color:#91a0ad;display:flex;align-items:center;gap:6px}.view-indicator span{width:5px;height:5px;border-radius:50%;background:#a3afbb}.empty-preview{display:flex;flex-direction:column;align-items:center;color:#93a3b3}.empty-preview svg{width:76px;height:76px;margin-bottom:15px;opacity:.7}.empty-preview strong{font-size:14px;font-weight:500;margin-bottom:7px}.empty-preview>span{font-size:12px;color:#a1acb6}.preview-description{margin-top:18px;min-height:60px}.preview-description strong{font-size:14px}.preview-description p{font-size:12px;color:#87929e;line-height:1.8;margin:7px 0 0}
.actionbar{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid var(--border);background:white;border-radius:12px;margin-top:22px;padding:20px 23px}.save-info{display:flex;align-items:center;gap:11px}.save-dot{width:7px;height:7px;border-radius:50%;background:#b1bac4;flex:none}.save-dot.saved{background:#729284}.save-dot.failed{background:#c97945}.save-info strong{font-size:13px;font-weight:600}.save-info p{font-size:11px;color:#87929e;margin:6px 0 0;line-height:1.5}.actions{display:flex;gap:10px}.button{height:44px;border-radius:7px;padding:0 19px;font-size:13px;border:1px solid transparent;font-weight:600;white-space:nowrap}.button:focus-visible{outline:3px solid #5b95cc;outline-offset:3px}.primary{background:var(--accent);color:#fff;min-width:144px}.primary:not(:disabled):hover{background:#b3372b}.primary span{margin-left:12px;font-size:17px;font-weight:400}.primary:disabled{background:#e8d7d3;color:#fff}.secondary{background:white;border-color:#dde3e9;color:#697786}.secondary:not(:disabled):hover{background:#f6f8fa}.secondary:disabled{color:#b9c0c8;border-color:#edf0f3}.confirmation{display:flex;gap:11px;align-items:center;margin-top:20px;padding:16px 18px;background:#edf5f1;border:1px solid #d7e6df;border-radius:10px;color:#486858}.confirmation-icon{background:#6e9380;color:white;width:23px;height:23px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;flex:none}.confirmation strong{font-size:13px}.confirmation p{font-size:12px;line-height:1.5;margin:5px 0 0;color:#718578}.page-note{text-align:center;font-size:11px;color:#a2abb6;margin:17px 0 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1500px){.workspace{padding-top:40px}.page-heading{margin-bottom:35px}.preview-canvas{min-height:354px}.shape-card{padding-top:24px;padding-bottom:23px}}
@media(max-width:900px){.main-grid{grid-template-columns:1fr}.preview-canvas{min-height:290px}.preview-canvas>svg{height:290px}.selection-hint{margin-top:16px}.shape-card svg{height:90px}.steps{margin-bottom:28px}.preview-description{min-height:0}.workspace{padding:25px 24px}.topbar{padding:0 24px}}
@media(max-width:560px){.topbar{height:74px;padding:0 18px}.brand-mark{width:36px;height:36px}.brand strong{font-size:17px}.brand div>span{font-size:10px}.version{font-size:10px}.version span{display:none}.workspace{padding:21px 16px}.steps li{height:56px;flex-direction:column;gap:4px;font-size:10px}.step-number{height:20px;width:20px;font-size:10px}.steps li+li:before{height:30px}.page-heading{margin-bottom:22px}h1{font-size:24px}.page-heading p{font-size:12px}.selection-panel,.preview-panel{padding:18px}.shape-options{gap:11px}.shape-card{padding:15px 12px 13px}.shape-card input{right:12px;top:12px}.shape-card svg{height:78px;margin-top:8px}.shape-card .card-name{font-size:13px}.shape-card .card-description{font-size:10px}.actionbar{flex-direction:column;align-items:stretch;padding:18px;gap:16px}.actions .button{flex:1;padding:0 12px}.preview-canvas>svg{height:280px}.preview-canvas{min-height:280px}.selection-hint{font-size:11px}}

.project-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}.project-toolbar label{display:flex;align-items:center;gap:8px;font-size:12px;color:#627d8d}.project-toolbar select{min-height:44px;max-width:280px;border:1px solid var(--border);border-radius:8px;padding:0 10px;background:white;color:#426176;font:inherit;font-size:14px}#project-status{font-size:12px;color:#667f8e;line-height:1.6}@media(max-width:600px){.project-toolbar{gap:8px}.project-toolbar label{flex:1;min-width:0}.project-toolbar label span{display:none}.project-toolbar select{width:100%;min-width:0}.project-toolbar .button{padding:0 12px;min-height:44px}#project-status{flex-basis:100%}}
