@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');

:root{font-family:'DM Sans',Segoe UI,sans-serif;color:#20353c;background:#f2f5f5;font-synthesis:none;--ink:#20353c;--muted:#74848a;--line:#e3e9e9;--teal:#137b79;--teal-dark:#123b42;--orange:#ce8d4b;--soft:#f4f7f6}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #58b7b4;outline-offset:3px}[hidden]{display:none!important}
.app-header{height:86px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;gap:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-family:Manrope,Segoe UI,sans-serif;font-size:19px;font-weight:500;letter-spacing:-.7px}.brand strong{font-weight:800}.brand small{display:block;font-family:'DM Sans',sans-serif;font-size:8px;font-weight:650;letter-spacing:2.4px;color:#8a989c;margin-top:4px}.brand-icon{height:43px;width:43px;border-radius:12px;display:grid;place-items:center;background:var(--teal-dark)}.brand-icon svg{height:28px;width:28px;fill:none;stroke:#e6f7ef;stroke-width:1.8;stroke-linecap:round}.header-project{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}.saved-dot,.status-pip{width:6px;height:6px;border-radius:100%;background:#4a9986}.header-actions{display:flex;gap:10px}
.button{border:1px solid var(--line);background:white;border-radius:7px;padding:10px 15px;font-size:12px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:background .18s,box-shadow .18s;color:var(--ink)}.button:hover{background:#eff5f2}.button.primary{background:var(--teal-dark);border-color:var(--teal-dark);color:#fff}.button.primary:hover{background:#20525a}.button.primary span{font-size:18px;line-height:10px}.button.quiet{background:transparent}.button.quiet:hover{background:#eaf0ee}.button.wide{width:100%}.icon-button{display:grid;place-items:center;width:35px;height:35px;border-radius:7px;background:transparent;border:1px solid var(--line);color:#75868a}.icon-button:hover{background:white}.icon-button svg,.fit-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.app-shell{display:grid;grid-template-columns:332px minmax(0,1fr);min-height:calc(100dvh - 86px)}
.sidebar{background:white;border-right:1px solid var(--line);display:flex;flex-direction:column;height:calc(100dvh - 86px);position:sticky;top:0}.sidebar-intro{padding:28px 26px 22px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:1.8px;color:#7f9394}.sidebar h1{font-family:Manrope,Segoe UI,sans-serif;font-size:25px;line-height:1.35;letter-spacing:-1px;font-weight:750;margin:11px 0 12px}.sidebar-intro p{font-size:12px;line-height:1.75;color:var(--muted);margin:0;max-width:260px}
.step-tabs{display:flex;padding:0 19px;border-bottom:1px solid var(--line);gap:5px}.step-tabs button{position:relative;padding:13px 7px 15px;border:0;background:transparent;color:#879699;font-size:11px;font-weight:600;white-space:nowrap;flex:1}.step-tabs button span{display:block;font-size:9px;color:#a5b0b1;margin-bottom:5px;letter-spacing:1px}.step-tabs button[aria-selected=true]{color:var(--teal)}.step-tabs button[aria-selected=true] span{color:var(--teal)}.step-tabs button[aria-selected=true]:after{content:'';position:absolute;bottom:-1px;height:3px;background:var(--teal);left:8px;right:8px;border-radius:2px 2px 0 0}
.sidebar-scroll{overflow-y:auto;flex:1;scrollbar-width:thin;scrollbar-color:#cfdbd7 transparent}.step-panel{padding:25px 26px 30px}.section-heading{display:flex;align-items:center;gap:8px}.section-heading h2{font-family:Manrope,sans-serif;margin:0;font-size:14px;font-weight:750;letter-spacing:-.3px}.zone-dot{display:inline-block;width:7px;height:7px;border-radius:2px;flex-shrink:0}.wash-dot{background:#268e88}.room-dot{background:#d4a06a}.unit-tag{margin-left:auto;font-size:8px;letter-spacing:1px;background:#f2f5f4;color:#879593;padding:4px 6px;border-radius:3px}.section-copy{color:var(--muted);font-size:11px;line-height:1.7;margin:10px 0 19px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}label{display:block;font-size:10px;font-weight:550;color:#60747b;line-height:1.5}.input-unit{display:flex;align-items:center;margin-top:7px;border:1px solid #dae3e1;border-radius:6px;background:#fff;overflow:hidden;height:40px;transition:border-color .15s}.input-unit:focus-within{border-color:var(--teal);box-shadow:0 0 0 2px #137b7910}.input-unit input{border:0!important;background:transparent;min-width:0;width:100%;padding:9px 11px;font-size:13px;font-weight:600;color:var(--ink);outline:none!important;box-shadow:none!important}.input-unit span{font-size:10px;color:#8b9a9d;padding:0 11px 0 2px}input[aria-invalid=true]{background:#fff2ec}.full-field{margin-top:15px}.area-card{display:flex;align-items:center;justify-content:space-between;padding:13px 12px;margin-top:16px;border-radius:6px;background:#edf5f1;color:#617c72;font-size:10px}.area-card strong{color:#2c6b5c;font-size:15px;font-family:Manrope,sans-serif}.area-card small{font-size:9px;font-weight:500}.area-card.room-area{background:#f9f3eb;color:#8f7d64}.room-area strong{color:#a0733f}.section-divider{height:1px;background:var(--line);margin:27px 0}.hint{font-size:10px;line-height:1.75;color:#8a999d;margin:13px 0 0}.next-step{margin-top:24px;width:100%;color:var(--teal);border-color:#d7e6df;background:#f6faf7;justify-content:space-between}.sidebar-footer{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding:15px 20px;color:#82938f;font-size:9px;flex-shrink:0}.sidebar-footer .status-pip{width:5px;height:5px}
select{display:block;width:100%;padding:10px 26px 10px 10px;border:1px solid #dae3e1;border-radius:6px;font-size:11px;color:var(--ink);margin-top:7px;background:white;min-height:40px}.sequence-item{display:flex;align-items:center;gap:10px;margin-top:16px}.sequence-number{display:grid;place-items:center;border:1px solid #c9ded6;color:var(--teal);background:#f2f8f4;font-size:10px;border-radius:50%;width:23px;height:23px;flex-shrink:0}.sequence-item label{flex:1;min-width:0}.indent-field{margin-left:33px}.spacing-connector{display:flex;gap:21px;margin:19px 0 18px 11px}.spacing-connector>span{border-left:1px dashed #bdd2ca;position:relative}.spacing-connector>span:before,.spacing-connector>span:after{content:'';position:absolute;width:5px;height:5px;background:#a8c5b9;border-radius:50%;left:-3px}.spacing-connector>span:before{top:0}.spacing-connector>span:after{bottom:0}.spacing-connector label{flex:1}.pump-title{display:flex;gap:10px;margin:20px 0}.pump-title strong{font-size:11px;font-weight:650;display:block}.pump-title small{font-size:9px;color:#87948e;display:block;margin-top:3px}.small-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:5px;background:#f7efe4;color:#ad834e;font-size:12px;font-weight:700}
.model-card{padding:15px 0;border-bottom:1px solid var(--line)}.model-card:first-child{padding-top:0}.model-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.model-top strong{display:block;font-size:11px;font-weight:650}.model-top small{display:block;font-size:9px;color:var(--muted);margin-top:4px}.model-state{font-size:8px;padding:4px 6px;background:#f1f4f3;color:#839491;border-radius:4px;white-space:nowrap}.model-state.ready{background:#e9f4ec;color:#297052}.model-state.failed{background:#fff0e6;color:#ad682e}.model-size{font-size:10px;margin:13px 0 6px;color:#556c70;font-variant-numeric:tabular-nums;line-height:1.7}.model-meta{font-size:9px;line-height:1.6;color:#95a19e}.model-actions{display:flex;align-items:center;gap:8px;margin:10px 0}.model-actions .button{padding:7px 9px;font-size:9px}.model-actions .text-button{font-size:9px}.model-calibration summary{font-size:10px;color:#6b817b;cursor:pointer;padding-top:3px}.calibration-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.calibration-grid label{font-size:9px}.calibration-grid select{font-size:10px;padding:7px 4px;min-height:33px}.calibration-grid .heading-field{grid-column:1/-1}.model-note{background:#f1f5f2;border-radius:6px;padding:12px;margin-top:22px}.model-note strong{font-size:10px;font-weight:600}.model-note p{font-size:10px;line-height:1.7;color:#738b7f;margin:6px 0 0}#retry-models{margin-top:16px}
.project-type-card{padding:16px;background:#edf6f2;border:1px solid #d7e8df;border-radius:8px;margin-bottom:25px}.project-type-card>label{font-family:Manrope,sans-serif;font-size:13px;font-weight:750;color:var(--teal-dark)}.project-type-card select{font-size:12px;font-weight:600;border-color:#bdd7cb}.project-type-card .hint{color:#6d887a;margin-top:10px}.equipment-selection-note{font-size:10px;line-height:1.7;color:#82958c;margin:14px 0}.sequence-item{min-width:0}.sequence-remove,.equipment-remove{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid #e1e8e3;background:#fff;color:#87978e;border-radius:5px;min-width:26px;min-height:28px;padding:4px 7px;font-size:10px;line-height:1.25}.sequence-remove:hover,.equipment-remove:hover{background:#fff3ec;border-color:#eed8c7;color:#aa6c42}.sequence-item>.sequence-remove,.sequence-item>.equipment-remove{margin-top:20px}.sequence-actions{margin:16px 0 0 33px}.sequence-actions .button{width:100%;font-size:10px}.room-equipment-card{border:1px solid #eadfce;border-radius:7px;padding:13px;background:#fffcf8;margin:14px 0}.room-equipment-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:13px}.room-equipment-name{min-width:0;font-size:11px;font-weight:650;line-height:1.6;color:var(--ink);overflow-wrap:anywhere}.room-equipment-heading strong{display:block;font-size:11px;font-weight:650;line-height:1.6;overflow-wrap:anywhere}.room-equipment-heading small{display:block;font-size:9px;color:#94836c;line-height:1.6;margin-top:3px}.room-equipment-heading .equipment-remove{background:#fffaf4}.room-equipment-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.room-equipment-fields .full-field{grid-column:1/-1;margin-top:0}.room-equipment-card .field-grid{gap:10px}.room-equipment-card .full-field{margin-top:12px}.room-equipment-add{display:flex;align-items:flex-end;gap:8px;margin-top:16px}.room-equipment-add label{flex:1;min-width:0}.room-equipment-add .button{height:40px;padding:9px 12px;font-size:11px;color:var(--teal);border-color:#d7e6df;background:#f6faf7}.model-library-tools{display:grid;gap:12px}.model-library-tools input[type=search]{display:block;width:100%;min-width:0;margin-top:7px;border:1px solid #dae3e1;border-radius:6px;background:white;padding:11px 10px;min-height:40px;font-size:11px;color:var(--ink);appearance:none}.model-library-tools input[type=search]::placeholder{color:#94a49b}.model-library-tools select{margin-top:7px}.model-top>div{min-width:0}.model-top strong{overflow-wrap:anywhere}.model-top small{line-height:1.6}.model-card .model-actions{flex-wrap:wrap}.model-state.loading{background:#edf4f9;color:#5d7f94}.model-state.idle{background:#f1f4f3;color:#839491}.model-empty{font-size:11px;line-height:1.8;color:#82958c;padding:18px 0}.layout-metrics small{overflow-wrap:anywhere}
.workspace{padding:29px 30px 24px;display:flex;flex-direction:column;min-width:0;gap:0;height:calc(100dvh - 86px);min-height:650px}.workspace-heading{display:flex;justify-content:space-between;align-items:center;padding:0 0 23px;gap:20px}.workspace-heading .eyebrow{font-size:8px;letter-spacing:1.7px}.workspace-heading input{display:block;font-family:Manrope,sans-serif;font-size:23px;font-weight:750;letter-spacing:-.8px;margin:8px 0 0;padding:0;border:0;background:transparent;color:var(--ink);width:min(600px,100%);max-width:100%;text-overflow:ellipsis}.workspace-heading>div{min-width:0;flex:1}.workspace-heading p{font-size:10px;color:#8c9b9e;margin:7px 0 0}.workspace-heading .icon-button{align-self:flex-start;margin-top:20px}.viewer-toolbar{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--line);border-bottom:0;border-radius:9px 9px 0 0;padding:11px 14px;gap:10px;min-height:56px}.view-buttons,.zone-buttons{display:flex;align-items:center;gap:3px}.view-buttons{padding:3px;background:#f0f4f2;border-radius:5px}.view-buttons button,.zone-buttons button{border:0;background:transparent;padding:7px 10px;border-radius:4px;font-size:9px;color:#80928c;white-space:nowrap}.view-buttons button.active{background:white;color:#254e46;box-shadow:0 1px 4px #233e3610}.zone-buttons button.active{color:#226f60;background:#f0f6f2}.fit-button{padding:6px 9px;font-size:9px;gap:6px;white-space:nowrap}
.viewport{position:relative;flex:1;min-height:300px;background:radial-gradient(ellipse at 50% 38%,#fcfefc 0,#f2f6f3 60%,#e9f0ed 100%);overflow:hidden;border:1px solid var(--line);border-top-color:#eff2f0}#three-host{position:absolute;inset:0}#three-host canvas{display:block;width:100%;height:100%;touch-action:none}.viewport-labels{position:absolute;top:18px;left:19px;display:flex;gap:15px;pointer-events:none}.viewport-labels>span{font-size:9px;color:#79928a;display:flex;gap:6px;align-items:center;background:#ffffffbc;padding:6px 8px;border-radius:4px}.viewport-labels .zone-dot{width:5px;height:5px}.model-loading{position:absolute;top:18px;right:18px;display:flex;align-items:center;gap:7px;font-size:10px;color:#789086;background:#ffffffc9;padding:7px 10px;border-radius:5px;max-width:50%;line-height:1.6}.spinner{width:11px;height:11px;border:1.5px solid #d7e5de;border-top-color:#2e7e68;border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.empty-notice,.viewer-failure{position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);max-width:345px;width:calc(100% - 50px);text-align:center;padding:23px 25px;background:#ffffffed;box-shadow:0 8px 40px #234e3f0e;border:1px solid #e1ebe3;border-radius:10px}.empty-notice strong,.viewer-failure strong{display:block;font-family:Manrope,sans-serif;font-size:15px;letter-spacing:-.3px}.empty-notice p,.viewer-failure p{font-size:11px;line-height:1.8;color:#7c9187;margin:10px 0 17px}.empty-notice .button,.viewer-failure .button{font-size:10px}.notice-icon{margin:0 auto 14px;display:grid;place-items:center;height:35px;width:35px;background:#edf5ef;color:#4a8c72;font-size:24px;border-radius:8px}.viewer-failure{z-index:5}.camera-help{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:8px;color:#88a092;background:#f9fcf9d9;border:1px solid #e2ebe5;padding:7px 10px;border-radius:20px;pointer-events:none}.mouse-mark{width:7px;height:10px;border:1px solid currentColor;border-radius:4px;position:relative}.mouse-mark:after{content:'';position:absolute;left:2px;top:1px;height:3px;border-left:1px solid currentColor}.north-mark{position:absolute;right:18px;bottom:17px;display:flex;flex-direction:column;align-items:center;gap:0;color:#9aafa4;pointer-events:none}.north-mark span{font-size:6px;letter-spacing:1px}.north-mark svg{height:36px;width:22px;fill:none;stroke:currentColor;stroke-width:1.2}
.layout-metrics{display:grid;grid-template-columns:1.05fr 1.05fr 1.2fr .8fr;background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 0 9px 9px;padding:18px 0;flex-shrink:0}.layout-metrics>div{padding:0 20px;border-right:1px solid #edf1ee;min-width:0}.layout-metrics>div:last-child{border-right:0}.metric-label{font-size:7px;font-weight:650;letter-spacing:1px;display:block;color:#8a9e94}.layout-metrics strong{font-family:Manrope,sans-serif;font-size:19px;letter-spacing:-.7px;display:block;margin-top:7px;white-space:nowrap}.layout-metrics small{font-size:8px;display:block;color:#92a297;margin-top:6px;line-height:1.5}.layout-metrics strong span{color:#b3c0b8;font-size:14px}.layout-notes{display:flex;gap:10px;align-items:flex-start;padding:17px 2px 0;color:#77918a;flex-shrink:0}.note-symbol{width:15px;height:15px;border:1px solid #aac4b4;border-radius:50%;display:grid;place-items:center;font-size:9px;flex-shrink:0}.layout-notes>div{flex:1;min-width:0}.layout-notes strong{font-size:10px;font-weight:600;display:block;color:#6b867c;margin-top:1px}.layout-notes p{font-size:9px;line-height:1.65;margin:4px 0 0}.layout-notes ul{padding-left:14px;margin:7px 0 0;font-size:10px;line-height:1.8}.layout-notes.warning .note-symbol{border-color:#d8a365;color:#bc7837}.layout-notes.warning strong,.layout-notes.warning li{color:#a57137}.text-button{padding:0;border:0;background:none;color:#547e6d;font-size:9px;font-weight:600;white-space:nowrap}.text-button:hover{text-decoration:underline}.layout-notes .text-button{margin-top:1px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:13px 20px;background:#173f42;color:white;font-size:12px;line-height:1.5;border-radius:8px;box-shadow:0 5px 30px #173f4220;max-width:calc(100% - 30px);z-index:10}
@media(min-width:1700px){.app-shell{grid-template-columns:370px 1fr}.sidebar-intro,.step-panel{padding-left:32px;padding-right:32px}.workspace{padding:36px 45px 30px}.sidebar h1{font-size:28px}.viewport{min-height:450px}}
@media(max-width:1150px){.header-project{display:none}.workspace{padding:24px 18px 20px}.app-shell{grid-template-columns:300px minmax(0,1fr)}.sidebar-intro,.step-panel{padding-left:21px;padding-right:21px}.sidebar h1{font-size:23px}.zone-buttons button{font-size:8px;padding:7px 6px}.viewer-toolbar{padding:9px 10px;gap:6px}.fit-button{font-size:0;padding:7px}.fit-button svg{width:15px;height:15px}.layout-metrics>div{padding:0 12px}.layout-metrics strong{font-size:16px}.metric-label{font-size:6px;letter-spacing:.6px}.layout-notes .text-button{display:none}}
@media(max-width:850px){.app-header{height:72px;padding:0 18px;gap:10px}.brand{font-size:16px;gap:9px}.brand-icon{width:36px;height:36px;border-radius:9px}.brand small{font-size:6px;letter-spacing:2px}.header-actions{gap:6px}.header-actions .button{font-size:10px;padding:8px 10px}.app-shell{grid-template-columns:270px minmax(0,1fr);min-height:calc(100dvh - 72px)}.sidebar{height:calc(100dvh - 72px)}.workspace{height:calc(100dvh - 72px);padding:20px 12px 15px;min-height:650px}.sidebar-intro{padding:22px 18px 18px}.sidebar h1{font-size:21px}.sidebar-intro p{font-size:10px}.step-panel{padding:20px 18px}.step-tabs{padding:0 10px}.step-tabs button{font-size:10px;padding-left:4px;padding-right:4px}.zone-buttons{display:none}.workspace-heading input{font-size:19px}.layout-metrics{grid-template-columns:1fr 1fr;row-gap:16px}.layout-metrics>div:nth-child(2){border:0}.viewport-labels{gap:7px;left:10px}.viewport-labels>span{font-size:8px;padding:4px 6px}.camera-help{font-size:7px;padding:6px 8px}.north-mark{display:none}}
@media(max-width:640px){.app-header{position:sticky;top:0;z-index:20}.brand{font-size:14px}.brand small{letter-spacing:1.5px}.header-actions .button{padding:8px;font-size:9px}.app-shell{display:flex;flex-direction:column}.sidebar{position:static;width:100%;height:auto;border-right:0;border-bottom:1px solid var(--line)}.sidebar-intro{padding:20px 20px 14px}.sidebar h1{font-size:21px;margin:7px 0}.sidebar h1 br{display:none}.sidebar-intro p{font-size:11px;max-width:none}.eyebrow{font-size:8px}.step-tabs{padding:0 14px}.step-tabs button{padding:10px 6px;font-size:11px}.step-tabs button span{display:inline;margin-right:6px}.sidebar-scroll{overflow:visible}.step-panel{padding:20px}.section-copy{font-size:11px;margin-bottom:15px}.section-divider{margin:20px 0}.field-grid{gap:14px}.area-card{margin-top:12px}.sidebar-footer{display:none}.workspace{height:auto;min-height:0;padding:22px 12px 20px;display:flex}.workspace-heading{padding:0 5px 20px}.workspace-heading input{font-size:22px}.viewport{height:480px;min-height:480px;flex:auto}.viewer-toolbar{min-height:52px;padding:9px 12px}.zone-buttons{display:flex}.zone-buttons button{padding:7px 5px;font-size:8px}.fit-button{display:none}.view-buttons button{font-size:9px;padding:7px}.layout-metrics{padding:17px 0}.layout-metrics strong{font-size:18px}.layout-metrics small{font-size:9px}.metric-label{font-size:7px}.layout-notes{padding:16px 5px}.layout-notes p{font-size:10px}.layout-notes strong{font-size:11px}.camera-help{font-size:7px}.model-card .calibration-grid{grid-template-columns:1fr 1fr 1fr}.calibration-grid .heading-field{grid-column:auto}.model-actions .button{font-size:10px}}
@media(max-width:640px){.project-type-card{padding:16px;margin-bottom:22px}.project-type-card>label{font-size:14px}.project-type-card select{font-size:13px}.room-equipment-card{padding:14px}.room-equipment-heading strong,.room-equipment-name{font-size:12px}.room-equipment-fields{gap:14px}.model-library-tools{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:12px}.model-library-tools input[type=search],.model-library-tools select{font-size:11px}.sequence-remove,.equipment-remove{min-width:30px;min-height:30px}.equipment-selection-note{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition:none!important}}
@media print{.app-header,.sidebar,.viewer-toolbar,.camera-help,.north-mark,.icon-button,.layout-notes .text-button{display:none!important}.app-shell{display:block}.workspace{height:auto;padding:0}.viewport{height:600px}.layout-metrics{break-inside:avoid}.workspace-heading input{width:100%}}

