*{box-sizing:border-box}body{margin:0;background:#f7f8fa;color:#111827;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input{font:inherit}.workspace{display:flex;flex-direction:column}.top-bar{height:64px;padding:0 16px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;grid-gap:16px;gap:16px;background:#ffffff;border-bottom:1px solid #e5e7eb}.top-bar-left,.top-bar-right{display:flex;align-items:center;gap:8px}.top-bar-right{justify-content:flex-end}.project-name-input{width:240px;height:36px;border:1px solid transparent;background:transparent;font-size:16px;font-weight:600;padding:0 8px;border-radius:8px}.project-name-input:focus{border-color:#14b8a6;background:#ffffff;outline:none}.mode-toggle{display:flex;gap:8px;padding:4px;background:#f3f4f6;border-radius:10px}.ghost-button,.mode-button,.primary-button,.secondary-button{height:34px;padding:0 14px;border-radius:8px;border:1px solid transparent;cursor:pointer}.mode-button{background:transparent;color:#374151}.mode-button.active{background:#ffffff;color:#0f766e;border-color:#ccfbf1;box-shadow:0 1px 2px rgba(0,0,0,.05)}.ghost-button{background:transparent;color:#4b5563}.ghost-button:hover{background:#f3f4f6}.primary-button{background:#0f766e;color:#ffffff}.secondary-button{background:#ffffff;color:#0f766e;border-color:#99f6e4}.secondary-button:disabled{color:#9ca3af;border-color:#e5e7eb;cursor:not-allowed}.zoom-label{font-size:13px;color:#6b7280;min-width:44px;text-align:center}.workspace-body{flex:1 1;display:grid;grid-template-columns:minmax(0,1fr) 360px;min-height:0}.canvas-shell{padding:16px;min-width:0;display:flex;flex-direction:column}.canvas-placeholder{min-height:320px;max-height:480px;display:flex;align-items:center;justify-content:center;background:#f9fafb;border:2px dashed #d1d5db;border-radius:12px;text-align:center}.canvas-placeholder h2{margin:0 0 8px;font-size:18px}.canvas-placeholder p{margin:0 0 16px;color:#6b7280;font-size:14px}.right-panel{padding:16px;background:#ffffff;border-left:1px solid #e5e7eb;overflow-y:auto}.panel-section{padding:16px;border:1px solid #e5e7eb;border-radius:14px;margin-bottom:16px}.panel-section h3{margin:0 0 16px;font-size:15px}.metric-row{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid #f3f4f6;font-size:14px}.metric-row:last-child{border-bottom:none}.muted{color:#6b7280;font-size:14px;line-height:1.4}.field-label{display:block;margin:0 0 6px;color:#374151;font-size:12px;font-weight:600}.inline-field{display:grid;grid-template-columns:1fr 88px;grid-gap:8px;gap:8px;margin-bottom:12px}.select-input,.text-input{height:36px;width:100%;border:1px solid #d1d5db;border-radius:8px;background:#ffffff;color:#111827;padding:0 10px}.select-input:focus,.text-input:focus{border-color:#14b8a6;outline:none}.full-width{width:100%}.hidden-file-input{display:none}.plan-viewer{height:100%;min-height:calc(100vh - 96px);flex-direction:column;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden}.plan-toolbar,.plan-viewer{display:flex;background:#ffffff}.plan-toolbar{height:48px;padding:0 12px;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #e5e7eb}.plan-file-name{overflow:hidden;color:#374151;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.plan-image,.plan-object{flex:1 1;width:100%;min-height:0;object-fit:contain;background:#f9fafb}.plan-image{padding:24px}.canvas-loading-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.2);z-index:10}.spinner{background:white;padding:16px 24px;border-radius:8px;font-size:14px;box-shadow:0 4px 6px rgba(0,0,0,.1)}.surface-breakdown{display:flex;flex-direction:column;gap:4px}.surface-row{display:flex;justify-content:space-between;font-size:12px;padding:6px 0}.surface-label{text-transform:capitalize;color:#374151}.surface-area{font-weight:600;color:#0f766e}.ai-suggestions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.ai-suggestion-chip{padding:6px 10px;font-size:12px;background:#ecfdf5;color:#0f766e;border:1px solid #a7f3d0;border-radius:6px;cursor:pointer;transition:all .2s}.ai-suggestion-chip:hover{background:#d1fae5;border-color:#6ee7b7}h4{margin:0;font-size:13px;font-weight:600;color:#374151}