.roof-public{box-sizing:border-box;--roof-teal:#087e85;--roof-ink:#14383e;--roof-muted:#526c70;--roof-line:#d6e3e3;min-height:100svh;color:var(--roof-ink);background:#f4f8f8;padding:0 24px 24px;font-family:Arial,Helvetica,sans-serif}.roof-public *{box-sizing:border-box}.roof-public button,.roof-public select{font-family:inherit}.roof-public button{cursor:pointer}.roof-public button:disabled{cursor:default;opacity:.45}.roof-public :focus-visible{outline-offset:4px;outline:3px solid #07858c}.roof-public svg{flex-shrink:0}.roof-public-header{z-index:10;border-bottom:1px solid var(--roof-line);background:#f4f8f8;justify-content:space-between;align-items:center;gap:16px;max-width:940px;margin:0 auto;padding:12px 0;display:flex;position:sticky;top:0}.roof-wordmark{align-items:center;gap:9px;display:flex}.roof-wordmark>b{background:var(--roof-teal);color:#fff;border-radius:10px;place-items:center;width:39px;height:39px;font-size:25px;display:grid}.roof-wordmark>span{letter-spacing:.1em;font-size:17px;font-weight:800;line-height:1.4}.roof-wordmark small{letter-spacing:.12em;color:var(--roof-muted);font-size:8px;display:block}.roof-button,.roof-outline,.roof-text-button{border-radius:10px;justify-content:center;align-items:center;gap:7px;min-height:48px;padding:11px 17px;font-size:15px;font-weight:700;line-height:1.3;text-decoration:none;display:inline-flex}.roof-button{background:var(--roof-teal);color:#fff;border:1px solid var(--roof-teal)}.roof-button:hover:not(:disabled){background:#06666c}.roof-save-top{min-width:112px;font-size:17px}.roof-outline{color:var(--roof-ink);background:#fff;border:1px solid #b8d0d2}.roof-outline:hover:not(:disabled){border-color:var(--roof-teal);background:#edf7f7}.roof-text-button{color:var(--roof-teal);background:0 0;border:1px solid #0000;padding:10px;font-size:14px}.roof-text-button:hover:not(:disabled){background:#e9f3f3}.roof-remove{color:#8e3e43}.roof-public-intro,.roof-workspace,.roof-public-card,.roof-error,.roof-demo-notice{max-width:940px;margin-left:auto;margin-right:auto}.roof-public-intro{padding:23px 0 19px}.roof-public-intro h1{letter-spacing:-.035em;margin:0 0 7px;font-size:clamp(25px,3.5vw,34px);font-weight:750;line-height:1.2}.roof-public-intro p{color:var(--roof-muted);margin:0;font-size:16px;line-height:1.5}.roof-property{flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:12px;font-size:12px;line-height:1.5;display:flex}.roof-property strong{overflow-wrap:anywhere;font-weight:600}.roof-property>span{color:var(--roof-muted)}.roof-kicker{letter-spacing:.1em;color:var(--roof-teal);margin:10px 0;font-size:11px;font-weight:700;display:block}.roof-workspace{border:1px solid var(--roof-line);background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 5px 24px #14383e05}.roof-canvas-status{min-height:52px;color:var(--roof-ink);border-bottom:1px solid var(--roof-line);justify-content:space-between;align-items:center;gap:8px;padding:7px 16px;font-size:14px;display:flex}.roof-canvas-status>span{align-items:center;gap:9px;font-weight:600;display:flex}.roof-canvas-status small{color:var(--roof-muted);font-size:12px}.roof-canvas-status .roof-text-button{min-height:44px;padding:7px 10px}.roof-awaiting-tap{color:#07686f;background:#eef8f8}.roof-tiny-x{color:#bd2c35;background:#fff;border:1px solid #d6e5e5;border-radius:7px;flex-shrink:0;place-items:center;width:26px;height:26px;font-size:25px;font-weight:600;line-height:1;display:grid}.roof-image{background:#e9eff0;position:relative}.roof-viewport{--roof-photo-height:clamp(270px,55svh,590px);touch-action:auto;scrollbar-width:thin;scrollbar-color:#9fb7b9 #e9eff0;position:relative;overflow:auto}.roof-canvas{place-items:center;padding:12px;display:grid;position:relative}.roof-stage{-webkit-user-select:none;user-select:none;touch-action:auto;flex-shrink:0;position:relative}.roof-stage img{pointer-events:none;border-radius:5px;width:100%;height:auto;display:block}.roof-stage-edit{cursor:grab}.roof-stage-add{cursor:crosshair}.roof-x{touch-action:none;z-index:2;background:0 0;border:0;border-radius:50%;width:48px;height:48px;padding:0;position:absolute;transform:translate(-50%,-50%);box-shadow:0 3px 10px #0004;cursor:grab!important}.roof-x svg{width:100%;height:100%;display:block}.roof-x:active{cursor:grabbing!important}.roof-x-active{outline:3px solid var(--roof-teal);outline-offset:3px;z-index:3}.roof-x-number{background:var(--roof-ink);color:#fff;border:2px solid #fff;border-radius:12px;place-items:center;min-width:22px;height:22px;padding:0 4px;font-size:11px;font-weight:700;display:grid;position:absolute;top:-6px;right:-6px}.roof-zoom-tools{background:#fff;border:1px solid #c7d6d8;border-radius:11px;display:flex;position:absolute;bottom:14px;right:14px;overflow:hidden;box-shadow:0 3px 12px #14383e15}.roof-zoom-tools button{min-width:48px;height:48px;color:var(--roof-ink);background:#fff;border:0;place-items:center;display:grid}.roof-zoom-tools button+button{border-left:1px solid #dae4e5}.roof-zoom-tools button:hover:not(:disabled){background:#edf5f5}.roof-zoom-tools button:focus-visible{outline-offset:-4px}.roof-photo-loading,.roof-photo-error{text-align:center;color:var(--roof-muted);background:#e9eff0;flex-direction:column;justify-content:center;align-items:center;padding:24px;font-size:15px;display:flex;position:absolute;inset:0}.roof-photo-error p{max-width:340px;line-height:1.5}.roof-bottom-controls{border-top:1px solid var(--roof-line);padding:14px 16px 15px}.roof-mark-actions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.roof-help{color:var(--roof-muted);margin:10px 0 0;font-size:13px;line-height:1.5}.roof-google-terms{color:var(--roof-muted);background:#fff;margin:0;padding:10px 12px;font-size:10px;line-height:1.5}.roof-google-terms a{color:inherit}.roof-image:has(.roof-google-terms) .roof-zoom-tools{top:12px;bottom:auto}.roof-intro-saved{grid-template-columns:auto 1fr;gap:0 12px;display:grid}.roof-success-icon{color:#216b4a;background:#dcf1e6;border-radius:50%;place-items:center;width:46px;height:46px;display:grid}.roof-intro-saved .roof-property{grid-column:1/-1}.roof-error{color:#943633;background:#fff0ed;border:1px solid #f0c6c1;border-radius:10px;padding:14px 16px;font-size:15px;line-height:1.5}.roof-public-card{border:1px solid var(--roof-line);background:#fff;border-radius:14px;margin-top:24px;padding:24px}.roof-public-card h1{font-size:24px;line-height:1.4}.roof-demo-notice{color:#765a29;margin-top:12px;margin-bottom:-6px;font-size:12px}.roof-public-footer{text-align:center;color:var(--roof-muted);padding:22px 0 0;font-size:11px}.roof-public-footer label{align-items:center;gap:10px;font-size:12px;display:inline-flex}.roof-public-footer select{min-height:44px;color:var(--roof-ink);background:0 0;border:1px solid #cbdadb;border-radius:8px;padding:8px 10px;font-size:14px}.roof-public-footer p{margin:14px 0 0}@media (max-width:600px){.roof-public{padding:0 12px 20px}.roof-public-header{padding:10px 0}.roof-wordmark>b{width:34px;height:34px;font-size:23px}.roof-wordmark>span{font-size:15px}.roof-wordmark small{font-size:7px}.roof-save-top{min-width:96px}.roof-public-intro{padding:19px 2px 16px}.roof-public-intro p{font-size:15px}.roof-property{gap:3px 10px;margin-top:9px;font-size:11px}.roof-workspace{border-radius:12px}.roof-canvas-status{min-height:49px;padding:8px 12px;font-size:13px}.roof-canvas-status small{display:none}.roof-canvas-status .roof-text-button{font-size:13px}.roof-viewport{--roof-photo-height:clamp(270px,49svh,500px)}.roof-zoom-tools{bottom:10px;right:10px}.roof-bottom-controls{padding:12px}.roof-mark-actions{gap:4px}.roof-mark-actions .roof-outline{padding:10px 12px;font-size:14px}.roof-mark-actions .roof-text-button{padding:10px 5px;font-size:13px}.roof-help{font-size:12px}.roof-public-footer{padding-top:18px}.roof-public-footer select{font-size:16px}.roof-intro-saved{padding-left:0;padding-right:0}.roof-intro-saved h1{font-size:25px}.roof-success-icon{width:39px;height:39px}}@media (prefers-reduced-motion:no-preference){.roof-button,.roof-outline{transition:background-color .15s}.roof-x-active{transition:box-shadow .15s}}