/* v1.1 design study: actual HWP artwork, quiet black surfaces, precise orange accents. */
html { background: #000; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-text-size-adjust:100%; }
body:not([data-experience="homeowner"]) > .app-shell { display:none; }
body[data-experience="choose"] { background:#000; color:#fff; }
body[data-experience="plumber"] { background:#eeefef; }
body[data-experience="homeowner"] { background:#f4f4f2; }
button, a, input, select, textarea { -webkit-tap-highlight-color:transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:3px solid #fc6f13; outline-offset:4px; }
.nx-eyebrow { font-size:10px; line-height:1.5; font-weight:700; letter-spacing:.15em; color:#bb4700; margin:0 0 10px; }
@keyframes nx-enter { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
.mode-switch { position:fixed; z-index:105; right:16px; bottom:calc(86px + env(safe-area-inset-bottom, 0px)); padding:10px 14px; min-height:44px; border:1px solid #dededb; border-radius:40px; background:#fff; box-shadow:0 3px 14px #00000014; font-size:11px; color:#333; cursor:pointer; }
.pro-shell { max-width:680px; min-height:100svh; margin:auto; background:#f7f7f4; }
.pro-brand { display:flex; align-items:center; justify-content:space-between; padding:calc(17px + env(safe-area-inset-top, 0px)) 24px 15px; background:#000; }
.pro-brand img { width:105px; height:56px; object-fit:contain; }
.pro-mode-link { color:#d1d1d1; font-size:11px; padding:12px 0 12px 10px; }
.prototype-banner { padding:7px 12px; background:#f4eadf; font-size:10px; color:#684523; text-align:center; }
.pro-hero { padding:27px 24px 0; background:#101111; color:#bebebe; }
.pro-hero .nx-eyebrow { color:#ff9c59; font-size:9px; }
.pro-hero h1 { color:#fff; font-size:34px; font-weight:620; line-height:1.06; letter-spacing:-.045em; margin:0 0 12px; }
.pro-hero > p:last-of-type { font-size:12px; line-height:1.6; margin-bottom:27px; }
.pro-stats { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #ffffff21; padding:17px 0 20px; }
.pro-stats > div { display:flex; flex-direction:column; padding-left:16px; border-left:1px solid #ffffff16; }
.pro-stats > div:first-child { padding-left:0; border-left:0; }
.pro-stats strong { color:#fff; font-size:27px; letter-spacing:-.04em; font-weight:550; }
.pro-stats span { font-size:10px; color:#aaa; margin-top:1px; }
.pro-content { padding:24px 20px 34px; }
.pro-section-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:4px 0 18px; }
.pro-section-heading h2 { font-size:22px; letter-spacing:-.04em; font-weight:650; margin:0; }
.pro-section-heading .nx-eyebrow { font-size:8px; margin:0 0 5px; letter-spacing:.12em; color:#70706c; }
.nx-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:11px; padding:13px 16px; min-height:44px; font-size:12px; font-weight:650; line-height:1.35; cursor:pointer; }
.nx-button svg { width:17px; height:17px; stroke-width:1.8; flex-shrink:0; }
.nx-primary { background:#fc6f13; color:#16100b; }
.nx-primary:hover:not(:disabled) { background:#ff842e; }
.nx-secondary { background:#fff; color:#252525; border:1px solid #dcdcd7; }
.nx-dark { background:#202121; color:#fff; }
.nx-text { background:none; color:#913500; padding:10px 0 10px 7px; }
.nx-button:disabled { background:#e8e8e5; color:#666; border-color:#dcdcd7; cursor:not-allowed; }
.pro-empty { background:#fff; border:1px solid #e8e8e1; border-radius:19px; text-align:center; padding:32px 18px; }
.pro-empty > svg { width:44px; height:44px; color:#bd591c; margin:0 auto 18px; stroke-width:1.2; }
.pro-empty h3 { font-size:18px; letter-spacing:-.025em; font-weight:650; margin-bottom:9px; }
.pro-empty p { color:#777; line-height:1.65; font-size:12px; margin-bottom:20px; }
.pro-empty.compact { padding:24px 16px; }
.connection-card { display:flex; gap:14px; padding:22px 2px 0; }
.connection-card > span { color:#575955; }
.connection-card > span svg { width:24px; height:24px; stroke-width:1.5; }
.connection-card h3 { font-size:13px; margin:0 0 5px; font-weight:650; }
.connection-card p { font-size:11px; color:#737570; line-height:1.7; margin:0 0 10px; }
.nx-tag { display:inline-block; font-size:8px; color:#6b6862; font-weight:600; letter-spacing:.065em; background:#eeeae3; padding:6px 8px; border-radius:5px; }
.pro-footer { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 12px; padding:0 20px calc(24px + env(safe-area-inset-bottom, 0px)); font-size:10px; color:#797973; }
.pro-footer span { width:100%; text-align:center; }
.pro-footer a { padding:5px 0; }
.pro-back { display:inline-flex; align-items:center; gap:5px; min-height:44px; color:#686b65; font-size:12px; margin:-12px 0 10px; }
.pro-back svg { width:15px; height:15px; }
.detail-heading { margin:0 0 26px; }
.detail-heading h1 { font-size:32px; line-height:1.12; font-weight:650; letter-spacing:-.04em; overflow-wrap:anywhere; }
.detail-heading > p:not(.nx-eyebrow) { color:#70736c; font-size:13px; line-height:1.6; margin:0 0 7px; }
.detail-heading .contact-line { overflow-wrap:anywhere; font-size:12px !important; }
.detail-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:19px; }
.pro-search { display:flex; gap:10px; align-items:center; padding:0 14px; height:49px; margin-bottom:16px; border:1px solid #ddddd6; border-radius:12px; background:#fff; }
.pro-search svg { width:18px; height:18px; color:#85857d; }
.pro-search input { width:100%; min-width:0; font-size:12px; height:40px; border:0; background:transparent; }
.customer-card { display:flex; align-items:center; gap:13px; padding:17px 14px; margin:0 0 12px; border:1px solid #e4e4dc; border-radius:15px; background:#fff; }
.customer-avatar { width:42px; height:42px; border-radius:12px; background:#f6eee5; color:#794720; display:grid; place-items:center; font-size:13px; flex-shrink:0; }
.customer-copy { min-width:0; flex:1; }
.customer-copy strong { display:block; color:#1a1b19; font-size:14px; font-weight:650; overflow-wrap:anywhere; }
.customer-copy small { display:block; color:#797c73; font-size:11px; margin:4px 0 8px; overflow-wrap:anywhere; }
.customer-copy > span { font-size:9px; color:#6a6c66; }
.customer-copy b { margin:0 7px; font-weight:400; color:#bbb; }
.customer-card > svg { width:15px; height:15px; color:#74786c; flex-shrink:0; }
.private-note { border:1px solid #e5dfd5; border-radius:12px; padding:14px; background:#f8f2e9; font-size:12px; margin:0 0 23px; }
.private-note strong { font-size:10px; letter-spacing:.025em; }
.private-note p { margin:8px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; color:#746959; }
.count-pill { display:inline-block; background:#e6e7df; color:#686d60; border-radius:6px; padding:3px 7px; font-size:11px; vertical-align:middle; }
.unit-card { display:flex; gap:13px; align-items:flex-start; background:#fff; border:1px solid #e2e3dc; border-radius:17px; padding:20px 15px; margin-bottom:14px; }
.unit-icon { background:#f2f3ee; border-radius:12px; width:45px; height:58px; display:grid; place-items:center; flex-shrink:0; }
.unit-icon svg { width:27px; height:34px; stroke-width:1.25; color:#757e6a; }
.unit-card > div { min-width:0; flex:1; }
.unit-card .nx-eyebrow { font-size:8px; }
.unit-card h3 { font-size:16px; letter-spacing:-.02em; margin:5px 0 7px; overflow-wrap:anywhere; }
.unit-card p { margin:0 0 3px; color:#777b70; font-size:11px; overflow-wrap:anywhere; }
.unit-card small { font-size:10px; color:#777b70; overflow-wrap:anywhere; }
.unit-card > svg { width:15px; height:15px; color:#7b7d76; flex-shrink:0; }
.unit-date { display:flex; align-items:center; gap:5px; color:#7e4825; font-size:9px; border-top:1px solid #edeee8; padding-top:10px; margin-top:12px; }
.unit-date svg { width:13px; height:13px; }
.equipment-facts { display:grid; grid-template-columns:1fr 1fr; background:#fff; border:1px solid #e2e3dc; border-radius:16px; margin-bottom:12px; padding:5px 18px; }
.equipment-facts > div { padding:15px 8px 15px 0; }
.equipment-facts dt { font-size:10px; color:#72786a; margin-bottom:5px; }
.equipment-facts dd { margin:0; color:#24271f; font-size:12px; overflow-wrap:anywhere; }
.nx-fine { color:#717669; font-size:10px; line-height:1.7; margin:12px 0 22px; }
.service-timeline { list-style:none; padding:0; margin:0; }
.service-timeline li { display:flex; gap:16px; border-bottom:1px solid #ddd; padding:16px 0; }
.service-timeline li > span { display:grid; place-items:center; width:34px; height:34px; background:#f7e8d9; border-radius:50%; color:#9e551e; flex-shrink:0; }
.service-timeline svg { width:18px; height:18px; }
.service-timeline small { color:#707969; font-size:10px; }
.service-timeline h3 { font-size:14px; margin:5px 0 7px; }
.service-timeline p { color:#676d62; font-size:12px; white-space:pre-wrap; overflow-wrap:anywhere; }
.pro-form { display:grid; gap:17px; }
.pro-form > label { display:block; color:#565d4e; font-size:12px; font-weight:600; }
.pro-form input,.pro-form select,.pro-form textarea { display:block; width:100%; margin:7px 0 0; padding:13px 14px; border:1px solid #d7d9d0; border-radius:10px; background:#fff; color:#21251c; font-size:16px; min-height:47px; }
.pro-form textarea { resize:vertical; }
.pro-form .nx-fine { margin:0; }
.required-mark { color:#a6480d; }
.nx-alert { border:1px solid #daa790; padding:12px; border-radius:9px; background:#fff1e9; color:#8d3b17; font-size:12px; }
.nx-success { padding:12px; border-radius:9px; background:#eaf2e3; color:#3e5d2c; font-size:12px; }
.invite-sheet { background:#fff; border:1px solid #e6e4dd; border-top:3px solid #fc6f13; border-radius:16px; padding:25px 21px; }
.invite-sheet > svg { display:block; width:31px; height:31px; margin-bottom:17px; color:#ab4c15; stroke-width:1.3; }
.invite-sheet h2 { font-size:25px; line-height:1.15; margin:18px 0 14px; letter-spacing:-.04em; }
.invite-sheet > p { font-size:12px; line-height:1.7; color:#74796d; }
.invite-sheet dl { border-top:1px solid #e5e7df; border-bottom:1px solid #e5e7df; margin:23px 0; padding:15px 0; }
.invite-sheet dl > div { margin:10px 0; }
.invite-sheet dt { font-size:10px; color:#798070; }
.invite-sheet dd { margin:3px 0 0; font-size:12px; overflow-wrap:anywhere; }
.invite-sheet .nx-button { width:100%; font-size:11px; }
body[data-experience="homeowner"] .app-header { border-bottom:1px solid #333; background:#000; }
body[data-experience="homeowner"] .home-hero { padding-top:33px; }
body[data-experience="homeowner"] .home-hero h1 { font-weight:650; letter-spacing:-.045em; }
body[data-experience="homeowner"] .home-hero .eyebrow,
body[data-experience="homeowner"] .page-heading .eyebrow { color:#a64203; }
body[data-experience="homeowner"] .bottom-nav { border-top-color:#e5e5df; }
@media(max-width:359px) {
  .pro-content { padding-left:16px; padding-right:16px; }
  .pro-section-heading h2 { font-size:20px; }
  .pro-section-heading .nx-button { padding:11px 10px; font-size:10px; }
}
/* Readable small-screen type, comfortable touch targets, and flexible content.
   Keep the preview warnings prominent; these screens do not send invitations. */
.nx-eyebrow { font-size:11px; letter-spacing:.12em; color:#a23c00; overflow-wrap:anywhere; }
.pro-footer a { display:inline-flex; align-items:center; min-height:44px; padding:8px 0; }
.mode-switch { right:max(16px,calc((100vw - 648px)/2)); font-size:12px; }
.pro-shell { min-height:100vh; min-height:100svh; display:flex; flex-direction:column; }
.pro-mode-link { display:inline-flex; align-items:center; min-height:44px; color:#dedede; font-size:12px; padding:10px 0 10px 10px; }
.prototype-banner { padding:10px 16px; font-size:12px; line-height:1.5; }
.pro-hero .nx-eyebrow { font-size:11px; }
.pro-hero > p:last-of-type { font-size:14px; margin-bottom:24px; }
.pro-stats span { font-size:12px; color:#b8b8b8; margin-top:3px; }
.pro-content { flex:1; min-width:0; }
.pro-section-heading { flex-wrap:wrap; gap:12px; }
.pro-section-heading .nx-eyebrow { font-size:10px; letter-spacing:.1em; color:#62625e; }
.nx-button { max-width:100%; min-width:0; min-height:46px; font-size:14px; text-align:center; }
.pro-empty p { color:#666; font-size:14px; }
.connection-card > div { min-width:0; }
.connection-card h3 { font-size:15px; margin-bottom:6px; }
.connection-card p { font-size:13px; color:#62655e; line-height:1.65; }
.nx-tag { max-width:100%; font-size:10px; line-height:1.5; color:#615d55; letter-spacing:.045em; }
.pro-footer { gap:0 12px; padding-bottom:calc(20px + env(safe-area-inset-bottom, 0px)); font-size:12px; color:#64645e; }
.pro-back { gap:7px; padding-right:12px; color:#5f625c; font-size:14px; }
.detail-heading > p:not(.nx-eyebrow) { color:#62655e; font-size:14px; overflow-wrap:anywhere; }
.detail-heading .contact-line { font-size:14px !important; }
.pro-search svg { flex-shrink:0; color:#6b6b63; }
.pro-search input { font-size:16px; height:44px; color:#242424; }
.pro-search input::placeholder { color:#696c63; opacity:1; }
.pro-search:focus-within { outline:2px solid #a64203; outline-offset:3px; }
.pro-search input:focus-visible { outline:none; }
.customer-copy strong { font-size:16px; }
.customer-copy small { color:#666a5f; font-size:13px; line-height:1.5; }
.customer-copy > span { font-size:12px; color:#62655c; }
.private-note { padding:16px; font-size:14px; line-height:1.6; }
.private-note strong { font-size:12px; letter-spacing:.015em; }
.private-note p { color:#665b4b; }
.unit-card .nx-eyebrow { font-size:10px; }
.unit-card h3 { font-size:17px; line-height:1.3; }
.unit-card p { margin-bottom:4px; color:#62685a; font-size:13px; }
.unit-card small { font-size:12px; color:#62685a; }
.unit-date { gap:6px; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.unit-date svg { width:15px; height:15px; flex-shrink:0; }
.equipment-facts { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 12px; }
.equipment-facts dt { font-size:12px; color:#626957; }
.equipment-facts dd { font-size:14px; }
.nx-fine { color:#626957; font-size:12px; line-height:1.65; }
.service-timeline li > div { min-width:0; }
.service-timeline small { color:#5e6757; font-size:12px; }
.service-timeline h3 { font-size:16px; overflow-wrap:anywhere; }
.service-timeline p { color:#5e6558; font-size:14px; line-height:1.6; }
.pro-form > label { min-width:0; color:#454d3d; font-size:14px; }
.pro-form input[type="date"] { min-width:0; width:100%; max-width:100%; box-sizing:border-box; -webkit-appearance:none; appearance:none; }
.pro-form input[type="date"]::-webkit-date-and-time-value { text-align:left; }
#welcomeTitle:focus,.pro-content h1[tabindex="-1"]:focus,.pro-content h2[tabindex="-1"]:focus { outline:none; }
.pro-form .optional { color:#626957; font-size:12px; font-weight:400; }
.nx-alert,.nx-success { padding:14px; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.nx-success { border:1px solid #cbd9be; }
.invite-sheet > p { font-size:14px; color:#626957; }
.invite-sheet dt { font-size:12px; color:#626957; }
.invite-sheet dd { margin-top:4px; font-size:14px; }
.invite-sheet .nx-button { font-size:13px; }
.experience-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:3px 18px; border-bottom:1px solid #e2e2dd; background:#f7f7f4; }
.experience-toolbar > span { font-size:10px; font-weight:600; letter-spacing:.07em; color:#62625e; }
.experience-toolbar .mode-switch { position:static; min-height:44px; margin:0; padding:10px 0 10px 10px; border:0; border-radius:0; background:transparent; box-shadow:none; color:#4e504b; }
#pro-main:focus,#main-content:focus { outline:none; }
body[data-experience="homeowner"] main { padding-bottom:calc(100px + env(safe-area-inset-bottom, 0px)); }
body[data-experience="homeowner"] .icon-button { width:44px; height:44px; }
body[data-experience="homeowner"] :is(form,fieldset,label,.field-row) { min-width:0; }
body[data-experience="homeowner"] :is(input,select,textarea) { min-width:0; max-width:100%; box-sizing:border-box; }
body[data-experience="homeowner"] input:is([type="date"],[type="month"]) { width:100%; -webkit-appearance:none; appearance:none; }
body[data-experience="homeowner"] input:is([type="date"],[type="month"])::-webkit-date-and-time-value { text-align:left; }
body[data-experience="homeowner"] .choice-chips label { position:relative; }
body[data-experience="homeowner"] .choice-chips input { width:1px; height:1px; min-height:0; margin:0; top:0; left:0; }
body[data-experience="homeowner"] .choice-chips label:has(input:focus-visible) span { outline:3px solid #a64203; outline-offset:3px; }
body[data-experience="plumber"] :is(button,a,input,select,textarea):focus-visible,
body[data-experience="homeowner"] :is(button,a,input,select,textarea):focus-visible { outline-color:#a64203; }
body[data-experience="plumber"] .pro-mode-link:focus-visible,
body[data-experience="homeowner"] .app-header :is(button,a):focus-visible { outline-color:#fc6f13; }
@media(hover:hover) and (pointer:fine) {
  .customer-card:hover,.unit-card:hover { border-color:#b6b6ad; box-shadow:0 4px 16px #11111107; }
  .pro-footer a:hover,.pro-mode-link:hover { text-decoration:underline; text-underline-offset:4px; }
}
@media(max-width:359px) {
  .pro-brand,.pro-hero { padding-left:18px; padding-right:18px; }
  .pro-hero h1 { font-size:32px; }
  .pro-section-heading .nx-button { padding:11px 12px; font-size:14px; }
  .customer-card,.unit-card { gap:10px; padding-left:12px; padding-right:12px; }
  .equipment-facts { gap:0 8px; padding:4px 12px; }
  .invite-sheet { padding:22px 16px; }
}
/* Account-first opening: original artwork, no illustration or role selector. */
.account-gateway { max-width:440px; min-height:100vh; min-height:100svh; margin:0 auto; padding:calc(40px + env(safe-area-inset-top, 0px)) 28px calc(32px + env(safe-area-inset-bottom, 0px)); display:flex; flex-direction:column; justify-content:center; }
.account-gateway-brand { margin-top:auto; text-align:center; }
.account-gateway-brand img { width:216px; height:auto; margin:0 auto; object-fit:contain; }
.account-gateway-brand p { margin:24px 0 0; font-size:14px; line-height:1.6; font-weight:500; letter-spacing:.065em; color:#bcbcbc; }
.account-gateway-actions { display:grid; gap:12px; margin:clamp(52px,10vh,84px) 0 auto; }
.account-gateway-actions button { display:flex; align-items:center; justify-content:center; min-height:54px; width:100%; padding:14px 18px; border-radius:12px; font-size:16px; line-height:1.4; font-weight:600; cursor:pointer; }
.gateway-signin { border:1px solid #fc6f13; background:#fc6f13; color:#15100a; }
.gateway-signup { border:1px solid #707070; background:transparent; color:#fff; }
.account-gateway-actions .gateway-guest { min-height:48px; margin-top:4px; border:0; background:transparent; color:#bcbcbc; font-size:14px; font-weight:400; }
.account-gateway-actions button:active { transform:scale(.99); }
.account-gateway-actions .gateway-restoring { display:grid; justify-items:center; gap:10px; padding:8px 0 4px; text-align:center; color:#d6d6d6; }
.account-gateway-actions .gateway-restoring p { margin:0; font-size:14px; line-height:1.5; }
.account-gateway-actions .gateway-restoring-title { color:#fff; font-size:17px !important; font-weight:600; }
.account-gateway-actions .gateway-spinner { width:32px; height:32px; border:3px solid #ffffff2e; border-top-color:#f26f21; border-radius:50%; animation:gatewaySpin .9s linear infinite; }
@keyframes gatewaySpin { to { transform:rotate(360deg); } }
.gateway-account-notice { margin:4px 0 0; font-size:13px; line-height:1.65; text-align:center; color:#ddd; overflow-wrap:anywhere; }
.gateway-account-name { margin:0 0 6px; color:#fff; font-size:20px; font-weight:600; line-height:1.4; text-align:center; overflow-wrap:anywhere; }
.gateway-account-type { margin:0 0 12px; color:#bcbcbc; font-size:13px; text-align:center; }
.gateway-sample-notice { margin:4px 0 0; padding-top:16px; border-top:1px solid #333; color:#bcbcbc; font-size:13px; line-height:1.6; text-align:center; overflow-wrap:anywhere; }
.account-dialog { position:fixed; inset:0; width:min(400px,calc(100vw - 40px)); height:max-content; max-height:calc(100vh - 56px); max-height:calc(100svh - 56px); margin:auto; padding:72px 28px 28px; overflow-y:auto; background:#151515; color:#f7f7f5; border:1px solid #555; border-radius:20px; box-shadow:0 20px 60px #0008; }
.account-dialog::backdrop { background:#000b; }
.account-dialog h2 { color:#fff; font-size:25px; font-weight:650; line-height:1.2; letter-spacing:-.03em; margin:0 0 14px; }
.account-dialog p { color:#ccc; font-size:15px; line-height:1.65; margin:0 0 24px; }
.account-dialog-close,.account-guest-action { display:flex; align-items:center; justify-content:center; min-height:48px; width:100%; padding:12px 14px; font-size:15px; font-weight:600; line-height:1.4; border-radius:10px; cursor:pointer; }
.account-dialog-close { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:48px; height:48px; padding:0; border:0; background:transparent; color:#ddd; font-size:28px; font-weight:400; line-height:1; }
.account-guest-action { margin-top:10px; border:0; background:#fc6f13; color:#15100a; }
.account-dialog :is(button,a,input,select,textarea):focus-visible { outline:3px solid #fc6f13; outline-offset:4px; }
.account-contact-summary { padding:16px; margin:0 0 18px; border:1px solid #dddcd5; border-radius:12px; background:#f6f6f2; color:#24271f; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.account-contact-summary p { margin:0 0 6px; }
.account-contact-summary .text-button { display:inline-flex; align-items:center; min-height:44px; padding:8px 0; border:0; background:transparent; color:#964009; font-size:14px; font-weight:600; cursor:pointer; }
@media(max-height:650px) {
  .account-gateway { padding-top:calc(24px + env(safe-area-inset-top, 0px)); padding-bottom:calc(20px + env(safe-area-inset-bottom, 0px)); }
  .account-gateway-brand img { width:180px; }
  .account-gateway-actions { margin-top:36px; }
}
@media(max-width:359px) {
  .account-gateway { padding-left:22px; padding-right:22px; }
  .account-gateway-brand img { width:190px; }
  .account-dialog { padding:68px 22px 22px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
/* Connected plumber forms and scoped invitation controls. */
.pro-content .nx-danger { border-width:1px; border-style:solid; min-height:46px; }
.pro-content .nx-danger:not(:disabled) { color:#8c291f; background:#fff8f6; border-color:#cb9e97; }
.pro-content .detail-heading > .nx-danger { margin:10px 0 0 8px; }
.pro-content .service-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:12px; }
.pro-invite-form { margin-bottom:32px; }
.pro-invite-form > p { margin:0; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.pro-invite-form fieldset { border:1px solid #cecec3; border-radius:12px; padding:8px 14px; min-width:0; }
.pro-invite-form legend { padding:0 6px; font-size:14px; font-weight:600; }
.pro-invite-form .pro-check { display:flex; align-items:flex-start; gap:12px; min-height:48px; padding:12px 0; font-size:14px; line-height:1.6; cursor:pointer; }
.pro-invite-form .pro-check input { flex:0 0 22px; width:22px; height:22px; min-height:22px; margin:1px 0 0; accent-color:#a64203; }
.pro-check > span { min-width:0; overflow-wrap:anywhere; }
.pro-check small { display:block; color:#626957; font-size:12px; }
.pro-invite-option { display:grid; gap:10px; min-width:0; padding:16px; border:1px solid #dfe2d8; border-radius:12px; background:#fafaf6; }
.pro-invite-option h3, .pro-tool-card .pro-invite-form h3 { margin:0; font-size:17px; line-height:1.3; }
.pro-invite-option p { margin:0; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.pro-invite-option .pro-check { padding:4px 0; }
.pro-tool-card .pro-invite-form { margin:18px 0 0; padding-top:16px; border-top:1px solid #dfe2d8; }
.pro-access-status > h2 { font-size:20px; margin:24px 0 12px; }
.pro-access-list { list-style:none; padding:0; margin:0; }
.pro-access-list li { padding:18px 0; border-bottom:1px solid #d9d9cf; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.pro-access-list p { margin:8px 0; }
.pro-access-status > [role="status"] { font-size:14px; color:#626957; }
@media(max-width:359px) { .pro-content .detail-heading > .nx-danger { margin-left:0; } }
/* Invitation links open a consent step, separate from the minimal opening. */
.invitation-reception { width:min(540px,100%); margin:auto; padding:calc(26px + env(safe-area-inset-top,0px)) 18px calc(28px + env(safe-area-inset-bottom,0px)); }
.invitation-reception > img { display:block; width:100px; height:auto; margin:0 auto 24px; }
.invitation-card { padding:24px; border-radius:18px; background:#f7f7f2; color:#24271f; }
.invitation-card h1 { margin:0 0 16px; font-size:27px; line-height:1.15; letter-spacing:-.035em; }
.invitation-card h1:focus { outline:none; }
.invitation-card p { font-size:14px; line-height:1.65; margin:0 0 18px; overflow-wrap:anywhere; }
.invitation-card .nx-button { display:flex; width:100%; margin:12px 0 0; min-height:48px; }
.invitation-card :is(button,input):focus-visible { outline:3px solid #a64203; outline-offset:3px; }
.invitation-equipment { list-style:none; margin:0 0 20px; padding:0; }
.invitation-equipment li { padding:14px 0; border-top:1px solid #d6d6cb; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.invitation-equipment span { display:block; color:#626957; font-size:13px; }
.invitation-consent { display:flex; align-items:flex-start; gap:12px; padding:12px 0; font-size:14px; line-height:1.6; cursor:pointer; }
.invitation-consent input { width:22px; height:22px; flex:0 0 22px; margin:2px 0 0; accent-color:#a64203; }
@media(max-width:359px) { .invitation-card { padding:20px; } .invitation-card h1 { font-size:25px; } }
/* Keep equipment metadata readable on compact iPhones and with long values. */
.equipment-facts { column-gap:24px; }
.equipment-facts > div { min-width:0; padding-right:0; }
.equipment-facts dt { line-height:1.45; }
.equipment-facts dd { line-height:1.5; overflow-wrap:anywhere; }
@media(max-width:390px) {
  .equipment-facts { grid-template-columns:minmax(0,1fr); column-gap:0; padding:2px 16px; }
  .equipment-facts > div { padding:13px 0; }
  .equipment-facts > div + div { border-top:1px solid #e2e3dc; }
}
/* Contractor resources and session-only business drafts. */
.pro-workspace-nav,.pro-tool-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; }
.pro-workspace-nav { padding:8px 16px; background:#171817; color:#eee; border-top:1px solid #303130; }
.pro-workspace-nav a,.pro-tool-tabs a { display:inline-flex; align-items:center; justify-content:center; min-width:0; min-height:46px; padding:10px 8px; font-size:14px; line-height:1.4; text-align:center; border-radius:9px; }
.pro-workspace-nav a:hover { color:#ffad76; }
.pro-workspace-nav [aria-current="page"] { background:#2b2c2b; color:#ffad76; box-shadow:inset 0 -2px #fc6f13; }
.pro-tool-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); margin:20px 0; padding:4px; border:1px solid #d8dad2; border-radius:12px; background:#eeefe9; }
.pro-tool-tabs a { color:#5f6657; }
.pro-tool-tabs [aria-current="page"] { background:#252724; color:white; }
.pro-tool-card { margin:18px 0; padding:22px 18px; border:1px solid #dfe2d8; border-radius:16px; background:#fff; min-width:0; }
.pro-tool-card h2 { margin:14px 0 12px; font-size:23px; line-height:1.25; letter-spacing:-.025em; }
.pro-tool-card h3 { margin:18px 0 8px; font-size:16px; }
.pro-tool-card h2,.pro-tool-card h3 { overflow-wrap:anywhere; }
.pro-tool-card > :first-child { margin-top:0; }
.pro-tool-card > :last-child { margin-bottom:0; }
.pro-tool-card p,.pro-tool-card li { font-size:14px; line-height:1.65; color:#52594a; overflow-wrap:anywhere; }
.pro-tool-card li { margin:10px 0; }
.pro-tool-card ol,.pro-tool-card ul { padding-left:22px; }
.pro-tool-card summary { min-height:44px; padding:10px 0; font-weight:600; cursor:pointer; }
.pro-draft-notice { border:1px solid #d8c6a8; background:#fff4df; border-radius:12px; padding:16px; font-size:14px; color:#634514; }
.pro-draft-notice p { margin:7px 0 0; line-height:1.6; }
.pro-automation-notice { margin-bottom:22px; }
.pro-form .pro-plan-service-preview { margin:0; }
.pro-plan-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 20px; padding:16px 0; margin:18px 0; border-block:1px solid #e2e4dc; }
.pro-plan-facts > div { min-width:0; }
.pro-plan-facts dt { margin-bottom:4px; color:#626957; font-size:12px; line-height:1.5; }
.pro-plan-facts dd { margin:0; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
.pro-preserve-lines { white-space:pre-wrap; }
.pro-quote-line,.pro-address-group,.pro-address-group > fieldset { display:grid; gap:14px; min-width:0; padding:16px; margin:0; border:1px solid #d9dbd3; border-radius:12px; }
.pro-quote-line legend,.pro-address-group legend { padding:0 6px; font-size:14px; font-weight:600; }
.pro-quote-line[hidden],.pro-quote-add[hidden] { display:none; }
.pro-quote-remove { justify-self:end; min-height:44px; }
.pro-quote-add { justify-self:start; min-height:44px; }
.pro-quote-line label,.pro-address-group label { display:block; font-size:14px; color:#454d3d; font-weight:600; }
.pro-quote-table { overflow-x:auto; margin:16px 0; }
.pro-quote-table table { width:100%; border-collapse:collapse; font-size:12px; }
.pro-quote-table caption { text-align:left; font-weight:600; padding:10px 0; }
.pro-quote-table th,.pro-quote-table td { padding:10px 8px; text-align:left; border-bottom:1px solid #e2e4dc; vertical-align:top; overflow-wrap:anywhere; }
.pro-quote-table th:first-child { min-width:85px; }
.pro-quote-table td { min-width:50px; }
/* Money stays on one line at phone width ("$1,520.00", not "$1520.0 / 0 USD"). */
.pro-quote-table td.pro-quote-money { white-space:nowrap; overflow-wrap:normal; text-align:right; }
.pro-quote-table td.pro-quote-qty { min-width:0; width:1%; text-align:center; }
.pro-quote-table thead th:not(:first-child) { white-space:nowrap; overflow-wrap:normal; }
.pro-quote-table thead th:nth-child(2) { text-align:center; }
.pro-quote-table thead th:nth-child(3),.pro-quote-table thead th:nth-child(4) { text-align:right; }
.pro-form .pro-check { display:flex; align-items:flex-start; gap:12px; line-height:1.6; font-weight:400; }
.pro-form .pro-check input { flex:0 0 22px; width:22px; height:22px; min-height:22px; margin:2px 0; accent-color:#a64203; }
.pro-retained-address p,.pro-address-preview { font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.pro-address-preview { padding:14px; background:#f1f1e9; border-radius:10px; }
.pro-address-preview p { margin:7px 0 0; }
.pro-address-group > fieldset[hidden] { display:none; }
@media(max-width:430px) {
  .pro-tool-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pro-plan-facts { grid-template-columns:minmax(0,1fr); }
  .pro-section-heading .nx-button,.pro-tool-card > .nx-button { width:100%; }
  .detail-actions > .nx-button { flex:1 1 100%; }
}
@media(max-width:390px) { .pro-workspace-nav { padding:8px 10px; } .pro-workspace-nav a { padding:10px 4px; font-size:13px; } .pro-tool-card,.pro-address-group { padding:16px 14px; } }
/* Sell ScaleShot (release 1.2): link sharing and rewards cards. */
.scaleshot-field { display:block; margin:16px 0 0; font-size:14px; font-weight:650; color:#252525; }
.scaleshot-field input { display:block; width:100%; max-width:100%; box-sizing:border-box; margin:7px 0 0; padding:12px 14px; min-height:47px; border:1px solid #d7d9d0; border-radius:10px; background:#fafaf6; color:#21251c; font-size:16px; }
.scaleshot-actions { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:8px; margin:14px 0 0; }
.scaleshot-actions .nx-button { width:100%; min-height:46px; text-decoration:none; }
.scaleshot-card > .nx-button { min-height:46px; margin:14px 0 0; }
.scaleshot-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:16px 0; }
.scaleshot-stats div { min-width:0; padding:12px 10px; border:1px solid #dfe2d8; border-radius:12px; background:#fafaf6; }
.scaleshot-stats dt { font-size:12px; color:#626957; }
.scaleshot-stats dd { margin:4px 0 0; font-size:19px; font-weight:700; line-height:1.25; color:#252525; overflow-wrap:anywhere; }
.scaleshot-code { margin:16px 0; padding:16px; border:1px dashed #a64203; border-radius:12px; background:#fff4ec; }
.scaleshot-code h3 { margin:0 0 6px; }
.scaleshot-code-value { margin:0 0 6px; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:22px; font-weight:700; letter-spacing:.06em; color:#252525; overflow-wrap:anywhere; }
.scaleshot-sales { list-style:none; margin:0; padding:0; }
.scaleshot-sales li { display:grid; gap:2px; margin:0; padding:12px 0; border-bottom:1px solid #dfe2d8; }
.scaleshot-sales span { font-size:13px; color:#626957; }
.scaleshot-rules { padding-left:20px; }
@media(max-width:390px) { .scaleshot-stats { grid-template-columns:minmax(0,1fr); } }
/* Release 1.5: Tools for the Hot Water Pros team (Housecall Pro, Carefree Plans, invites). */
.team-tools { display:grid; gap:14px; margin-top:8px; }
.team-tools .pro-tool-card { margin:0; }
.team-tool-card { display:grid; gap:10px; align-content:start; }
.team-tool-card h2 { margin:0; }
.team-tool-card p { margin:0; }
.team-tool-card .nx-button { justify-self:start; }
.team-tool-icon { display:inline-grid; place-items:center; width:42px; height:42px; border-radius:12px; background:#fff1e8; color:#f26f21; }
.team-tool-icon svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.pro-tool-card .team-plan-list { list-style:none; margin:2px 0; padding:0; display:grid; gap:6px; }
.pro-tool-card .team-plan-list li { margin:0; align-items:center; display:flex; justify-content:space-between; gap:12px; padding:9px 12px; border-radius:10px; background:#f6f4f1; font-size:14px; }
@media(min-width:720px) { .team-tools { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Release 1.5: one shared customer list for the Hot Water Pros team */
.pro-shared-note { margin:-6px 0 14px !important; }
.pro-added-by { color:#62655e; font-size:13px; }