*{box-sizing:border-box;margin:0}html,body,#root{height:100%}body{color:#0b2545;background:#f1f5f9;font-family:Noto Sans TC,-apple-system,PingFang TC,sans-serif}.app{flex-direction:column;height:100vh;display:flex}.topbar{color:#fff;background:#0b2545;flex-wrap:wrap;align-items:center;gap:10px;padding:8px 14px;display:flex}.brand{letter-spacing:.5px;font-size:15px;font-weight:700}.proj-name{border:none;border-radius:6px;width:180px;padding:6px 10px;font-size:14px}.topbar select{border:none;border-radius:6px;padding:6px;font-size:13px}.spacer{flex:1}.save-state{opacity:.8;font-size:12px}button{cursor:pointer;color:#0b2545;background:#e2e8f0;border:none;border-radius:6px;padding:7px 12px;font-size:13px}button.primary{color:#fff;background:#0abab5;font-weight:700}button:disabled{opacity:.5;cursor:default}button.danger{color:#fff;background:#dc2626}.floorbar{align-items:center;gap:6px;display:flex}.floor-tab{color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;background:#ffffff26;border-radius:6px;padding:5px 10px;font-size:13px}.floor-tab.active{background:#0abab5;font-weight:700}.floor-x{opacity:.6;margin-left:6px}.floor-x:hover{opacity:1}.floor-add{color:#fff;background:0 0;border:1px dashed #ffffff80}.main{flex:1;min-height:0;display:flex}.toolbar{background:#fff;border-right:1px solid #e2e8f0;flex-direction:column;align-items:center;gap:2px;width:76px;padding:8px 4px;display:flex;overflow-y:auto}.tool-group{border-bottom:1px solid #f1f5f9;flex-direction:column;align-items:center;gap:2px;width:100%;padding:4px 0 6px;display:flex}.tool-group:last-child{border-bottom:none}.tool-group-label{color:#94a3b8;letter-spacing:2px;text-align:center;width:100%;font-size:10px}.line-kind-select{border:1px solid #0abab5;border-radius:5px;width:66px;padding:2px;font-size:11px}.tool-btn{background:0 0;border-radius:8px;flex-direction:column;align-items:center;gap:3px;width:64px;padding:6px 2px;display:flex}.tool-btn:hover{background:#f1f5f9}.tool-btn.active{background:#ccfbf1;outline:2px solid #0abab5}.tool-badge{color:#fff;border-radius:7px;justify-content:center;align-items:center;width:30px;height:30px;font-weight:700;display:flex}.tool-label{font-size:11px}.canvas-wrap{background:#e2e8f0;flex:1;position:relative;overflow:hidden}.canvas-wrap.placing{cursor:crosshair}.canvas-empty{color:#64748b;flex:1;justify-content:center;align-items:center;font-size:15px;display:flex}.canvas-hint{color:#fff;pointer-events:none;white-space:nowrap;background:#0b2545cc;border-radius:20px;padding:4px 12px;font-size:12px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.side{background:#fff;border-left:1px solid #e2e8f0;flex-direction:column;gap:14px;width:250px;padding:10px;display:flex;overflow-y:auto}.panel-title{margin-bottom:8px;font-size:13px;font-weight:700}.stats table{border-collapse:collapse;width:100%;font-size:12px}.stats th,.stats td{text-align:center;border-bottom:1px solid #f1f5f9;padding:4px 6px}.stats td:first-child{text-align:left}.stats .total{color:#0abab5;font-weight:700}.tv-sizes{color:#64748b;margin-top:6px;font-size:11px}.props{border-bottom:2px solid #f1f5f9;flex-direction:column;gap:8px;padding-bottom:12px;display:flex}.props label{color:#334155;flex-direction:column;gap:3px;font-size:12px;display:flex}.props label.row{flex-direction:row;align-items:center;gap:6px}.props input,.props select,.props textarea{border:1px solid #cbd5e1;border-radius:6px;padding:5px 8px;font-family:inherit;font-size:13px}.props-actions{gap:8px;display:flex}.color-row{gap:6px;padding:4px 0;display:flex}.color-dot{cursor:pointer;border:2px solid #0000;border-radius:50%;width:22px;height:22px}.color-dot.on{border-color:#7c4dff}.line-swatch{vertical-align:middle;border-radius:2px;width:14px;height:4px;margin-right:4px;display:inline-block}