/* Shared TSH design primitives. Presentation only; no visibility or workflow changes. */
:root{--hub-ink:#172b50;--hub-muted:#42516b;--hub-border:#a0acc0;--hub-surface:#fff;--hub-radius:12px;--hub-space:8px;--hub-panel-space:12px;--hub-touch:44px}
html body{color:var(--hub-ink)}
html body :where(main,.screen,.card,.panel,.account-shell,.account-view,.records,.biz-box,form,fieldset,dialog){box-sizing:border-box;min-width:0}
html body :where(.card,.panel,.records,.biz-box,.support-card,.directory-card,.state-card){border:1px solid var(--hub-border);border-radius:var(--hub-radius);padding:var(--hub-panel-space);margin-block:var(--hub-space);margin-inline:auto;max-width:100%;overflow-wrap:anywhere}
html body :where(h1,h2,h3,legend){text-align:center;overflow-wrap:anywhere}
html body :where(p,label,legend,summary,.muted,.small){overflow-wrap:anywhere}
html body :where(form){max-width:100%;margin-inline:auto}
html body :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]),select,textarea){box-sizing:border-box;min-width:0;max-width:100%;min-height:var(--hub-touch);border:1px solid var(--hub-border);border-radius:8px;padding:8px 10px;color:var(--hub-ink);background:var(--hub-surface);font-family:inherit;font-size:16px;line-height:1.4}
html body :where(input,textarea)::placeholder{color:#56647a;opacity:1}
html body :where(button,.button,.biz-button){box-sizing:border-box;max-width:100%;min-width:0;min-height:var(--hub-touch);border-radius:8px;font-family:inherit;font-weight:650;line-height:1.35;white-space:normal;overflow-wrap:anywhere;text-align:center}
html body :where(.button.secondary,button.secondary,.button.quiet,.biz-button:not(.biz-primary)){color:var(--hub-ink);border:1px solid var(--hub-border)}
html body :where(.actions,.hub-action-row,.product-actions,.property-contact-actions,.address-actions,.password-actions,.hub-password-actions,.pm-pair,.address-list-toolbar){gap:var(--hub-space);align-items:stretch;justify-content:center;max-width:100%;margin-inline:auto}
html body :where(.actions,.hub-action-row,.product-actions,.property-contact-actions,.address-actions,.password-actions,.hub-password-actions,.pm-pair,.address-list-toolbar)>:where(button,.button){align-self:stretch;display:flex;align-items:center;justify-content:center;margin-block:0}
html body :where(dialog){border:1px solid var(--hub-border);border-radius:var(--hub-radius);padding:16px;color:var(--hub-ink);background:var(--hub-surface);margin:auto;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;overflow-wrap:anywhere;text-align:center}
html body :where(dialog)::backdrop{background:#172b5066}
html body :where(dialog)>:where(button,.button){margin:4px;min-height:var(--hub-touch)}
html body :where(.language-menu,.biz-menu-panel,.hub-menu>nav){box-sizing:border-box;max-width:calc(100vw - 24px);max-height:65dvh;overflow-y:auto;overflow-x:hidden;border:1px solid var(--hub-border);border-radius:var(--hub-radius);padding:6px;background:var(--hub-surface);color:var(--hub-ink)}
html body :where(.language-menu,.biz-menu-panel,.hub-menu>nav)>button{width:100%;min-height:var(--hub-touch);white-space:normal;text-align:center}
html body :where(button,summary,a,input,select,textarea):focus-visible{outline:3px solid #245ab0;outline-offset:2px}
html body :where(.account-grid,.biz-tiles,.cx-actions,.community-grid,.grid){gap:var(--hub-space);min-width:0;align-items:stretch}
html body :where(.account-grid,.biz-tiles,.cx-actions,.community-grid)>:where(button,.button,.account-tile){min-width:0;max-width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;border-color:var(--hub-border)}
html body :where(.muted,.biz-muted,.small){color:var(--hub-muted);line-height:1.4}

/* Platform-wide action alignment: shared by every account and standalone page. */
html body main :is(.hub-action-row,.actions,.product-actions,.property-contact-actions,.address-actions,.area-toolbar,.service-notification-controls,.password-actions,.hub-password-actions){
  display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;
  gap:8px;width:100%;box-sizing:border-box;margin:8px auto;
}
html body main :is(.hub-action-row,.actions,.product-actions,.property-contact-actions,.address-actions,.area-toolbar,.service-notification-controls,.password-actions,.hub-password-actions)>:is(button,a.button,.biz-button){
  display:flex;align-items:center;justify-content:center;flex:1 1 96px;
  min-width:0;min-height:44px;max-width:100%;box-sizing:border-box;
  margin:0;padding:8px;font-size:14px;line-height:1.25;
  text-align:center;white-space:normal;text-wrap:balance;overflow-wrap:anywhere;
}
/* The support toolbar has one, two or three controls according to staff role. */
html body main .hub-action-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);max-width:640px}
html body main .hub-action-row>*{width:100%}
html body main :is(.service-history-tabs,.service-history-toolbar,.new-service-actions,.payment-qr-tabs,.address-list-toolbar){
  gap:8px;align-items:stretch;margin-inline:auto;width:100%;box-sizing:border-box;
}
html body main :is(.service-history-tabs,.service-history-toolbar,.new-service-actions,.payment-qr-tabs,.address-list-toolbar)>:is(button,a.button){
  min-width:0;min-height:44px;margin:0;text-align:center;white-space:normal;text-wrap:balance;
}
html body main #section-navigation{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
html body main #section-navigation>button{width:100%;min-width:0;margin:0}
html body main #workspace{text-align:center}
html body main #workspace :is(input,select,textarea){min-width:0;max-width:100%;box-sizing:border-box}
/* Grid styling must never reveal controls hidden by role or navigation. */
html body [hidden]{display:none!important}

/* Brand support: equal brand and contact buttons on both account surfaces. */
.technical-dialog .support-brand-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0;width:100%}
.technical-dialog .support-brand-row>*{display:flex;justify-content:center;align-items:center;box-sizing:border-box;min-width:0;min-height:48px;margin:0;padding:10px;border:1px solid #d3dbea;border-radius:10px;background:white;color:#172b70;font:inherit;text-align:center;text-decoration:none}
.technical-dialog summary,#workspace details>summary{min-height:44px;padding:12px;box-sizing:border-box;text-align:center;cursor:pointer;font-size:13px}
#workspace .hub-action-row [aria-pressed=true]{background:#172b70;color:white}

.technical-dialog .support-contact-actions{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Visual-only alignment. Preserve role visibility, control order and page behavior. */
html body main :is(.panel,.account-shell,.account-view,.records,.directory-card,.biz-box,#pm-dashboard){box-sizing:border-box;min-width:0;max-width:100%;margin-inline:auto}
html body main :is(.property-fold,.property-contact-details,.pm-pair,.address-list-toolbar){min-width:0;box-sizing:border-box;max-width:100%}
html body main .property-connect-tenant{display:flex;align-items:center;justify-content:center;width:min(100%,320px);min-height:44px;margin:8px auto;padding:8px 12px;white-space:normal;text-align:center}
html body main .pm-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px auto;width:100%}
html body main .pm-pair>.button{box-sizing:border-box;width:100%;min-width:0;min-height:44px;margin:0;white-space:normal;overflow-wrap:anywhere}
html body :is(#personal-navigation,.cx-nav){box-sizing:border-box;width:100%;padding-inline:clamp(8px,3vw,24px);gap:6px}
html body :is(#personal-navigation,.cx-nav) button,
html body.personal-portal>.topbar>:is(.language,#warranty-bell),
html body.personal-portal>.topbar #customer-menu>summary,
html body #customer-home .cx-header :is(#language-toggle,#warranty-bell,#customer-communities-nav,#customer-menu>summary,#cx-invite-slot>button),
html body main .biz-account-controls>button,
html body main .biz-language-slot .language,
html body main .account-navigation>.button{
 box-sizing:border-box;min-width:0;min-height:44px;border:1px solid #8c9ab0;color:#172b50;background:#fff;font-size:12px;font-weight:650;line-height:1.3;white-space:normal;overflow-wrap:anywhere;text-align:center;
}
html body :is(#personal-navigation,.cx-nav) button[aria-current]{color:#172b70;background:#edf1fa;border-color:#172b70}
html body :is(.topbar,.cx-header,.cx-nav,.biz-account-controls,.account-navigation) svg{color:inherit;flex-shrink:0}
html body :is(button,summary,a):focus-visible{outline:3px solid #245ab0;outline-offset:2px}
html body main :is(.actions,.property-contact-actions,.address-actions){gap:8px;margin-block:8px;justify-content:center}
html body main :is(input,select,textarea){box-sizing:border-box;min-width:0;max-width:100%}
@media(max-width:390px){html body :is(#personal-navigation,.cx-nav){gap:4px;padding-inline:6px}html body :is(#personal-navigation,.cx-nav) button{padding:6px 3px}}
/* Never reveal controls concealed by authentication, permissions or navigation. */
html body [hidden]{display:none!important}

/* Unified navigation components: buttons and disclosure summaries share geometry.
   Specificity deliberately covers legacy IDs without changing their visibility. */
:root{--hub-nav-ink:#172b50;--hub-nav-border:#8c9ab0;--hub-control-gap:6px}
html body :is(#personal-navigation,.cx-nav,.biz-account-controls){align-items:stretch;grid-auto-rows:1fr;gap:var(--hub-control-gap)}
html body.personal-portal:not(.cx-dashboard)>.topbar{align-items:stretch;grid-auto-rows:1fr;gap:var(--hub-control-gap)}
html body :is(#personal-navigation,.cx-nav)>:is(button,#personal-menu-slot),
html body #personal-menu-slot #customer-menu{min-width:0;width:100%;height:100%;margin:0}
html body :is(#personal-navigation,.cx-nav)>button,
html body #personal-menu-slot #customer-menu>summary,
html body.personal-portal>.topbar>:is(.language,#warranty-bell,#customer-communities-nav),
html body #customer-home .cx-header :is(#language-toggle,#warranty-bell,#customer-communities-nav,#customer-menu>summary,#cx-invite-slot>button),
html body main .biz-account-controls>:is(button,details)>summary,
html body main .biz-account-controls>button,
html body main .biz-language-slot .language{
 display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;
 width:100%;height:100%;min-height:56px;min-width:0;gap:4px;margin:0;padding:6px 4px;
 border:1px solid var(--hub-nav-border);border-radius:8px;background:#fff;color:var(--hub-nav-ink);
 font-family:inherit;font-size:12px;font-weight:650;line-height:1.3;text-align:center;white-space:normal;overflow-wrap:anywhere;
}
html body :is(#personal-navigation,.cx-header,.topbar) :is(button,summary)>svg{width:20px;height:20px;color:inherit;flex-shrink:0}
html body :is(#personal-navigation,.cx-header,.topbar) :is(button,summary)>span{min-width:0;max-width:100%;min-height:0;text-wrap:balance}
html body #personal-menu-slot #customer-menu[open]>summary{background:#edf1fa;border-color:#172b70;color:#172b70}
/* Single property actions span the existing grid; paired controls stay equal. */
html body main #ca-list .records>.property-connect-tenant{grid-column:1 / -1;justify-self:center;max-width:320px;width:100%;margin:8px auto;min-height:44px}
html body main :is(.address-list-toolbar,.pm-pair,.property-contact-actions,.address-actions){box-sizing:border-box;width:100%;min-width:0;gap:8px;align-items:stretch;justify-content:center;margin-inline:auto}
html body main :is(.address-list-toolbar,.pm-pair,.property-contact-actions,.address-actions)>button{min-width:0;min-height:44px;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere;text-align:center;margin:0}
html body main :is(.screen,.panel,.account-shell,.account-view,.records,.biz-box){min-width:0;box-sizing:border-box;max-width:100%}
html body main :is(.panel,.account-shell,.records,.biz-box){margin-inline:auto}
html body [hidden]{display:none!important}

/* Upper navigation fills available columns without empty named grid areas.
   Dropdowns remain positioned overlays and hidden controls remain hidden. */
html body.personal-portal:not(.cx-dashboard)>.topbar{grid-template-areas:none;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);align-items:stretch;gap:6px}
html body.personal-portal>.topbar>:is(button,details){grid-area:auto;min-width:0;margin:0}
html body #customer-home .cx-header{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:6px;padding:8px}
html body #customer-home .cx-header .cx-brand{grid-column:1/-1;justify-content:center;margin:0}
html body #customer-home .cx-header>div:empty{display:none}
html body #customer-home .cx-header>div:has(>button){align-self:stretch;min-width:0}
html body #customer-home .cx-header :is(#language-toggle,#warranty-bell,#customer-communities-nav,#cx-invite-slot>button),
html body.personal-portal>.topbar>:is(.language,#warranty-bell,#customer-communities-nav),
html body main .biz-account-controls>:is(button,details)>summary,
html body main .biz-account-controls>button,
html body main #home-tools>:is(button,.button),
html body main #navigation>button,
html body main #section-navigation>button{
 box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:4px;width:100%;height:100%;min-height:56px;margin:0;padding:6px;
 border:1px solid var(--hub-border);border-radius:8px;font-size:13px;font-weight:650;line-height:1.35;white-space:normal;overflow-wrap:anywhere;color:var(--hub-ink);background:#fff;
}
html body main :is(#navigation,#section-navigation)>button[aria-current=page]{background:#172b70;color:#fff}
html body main :is(#home-tools,#navigation,#section-navigation,.biz-account-controls){align-items:stretch;grid-auto-rows:1fr;gap:8px}
html body main #ca-list .records>:is(.property-edit-action,.property-delete-action){min-height:44px;width:100%;margin:0}
html body main #ca-list .records>.property-connect-tenant{grid-column:1/-1;justify-self:center;align-self:center;margin:8px auto;width:100%;max-width:320px}
@media(max-width:600px){:root{--hub-panel-space:10px}html body :where(.community-grid){grid-template-columns:repeat(2,minmax(0,1fr))}html body :where(dialog){padding:12px}}
html body [hidden]{display:none!important}

/* Registration address fields must not inherit checkbox-sized fieldset inputs. */
html body main fieldset.signup-address{width:100%;min-width:0;margin-inline:0;box-sizing:border-box}
html body main fieldset.signup-address>label{display:block;width:100%;text-align:left}
html body main fieldset.signup-address>input{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;min-height:44px;margin-inline:0;font-size:16px}

html body main article.property-job{padding:10px 0;border-top:1px solid var(--hub-border);text-align:center}
html body main article.property-job>strong{display:block;margin-bottom:6px}
html body main article.property-job button{min-height:44px;margin:4px;max-width:100%}

html body main article.property-job>.property-job-entry{display:block;width:100%;margin:0;padding:12px;font-weight:650;text-align:center}
html body dialog.property-job-dialog{width:min(560px,calc(100vw - 24px));max-height:85dvh;overflow:auto;padding:18px;box-sizing:border-box;text-align:center}
.property-job-fields{margin:0;text-align:left;overflow-wrap:anywhere}.property-job-fields dt{font-weight:700;margin-top:12px}.property-job-fields dd{margin:4px 0;white-space:pre-wrap}.property-job-photo{display:block;width:100%;height:auto;margin:10px 0}

/* Dashboard controls stay on the dashboard; inner pages begin with their content. */
html body.personal-inner-page>.topbar{display:none!important}
html body.personal-inner-page>main{padding-top:10px}
html body main #ca-list.property-detail .records>.property-product-action{grid-column:1/-1;justify-self:center;width:min(100%,280px);margin-inline:auto}

/* Compact, balanced directory choices. */
html body main #find-business{padding-top:4px;margin-top:0;align-self:start}
html body main #find-business>h1{font-size:24px;margin:4px 0;text-align:center}
html body main #find-business :is(#directory-address-fold,.inline-services){margin-top:8px;padding:8px}
html body main #find-business :is(h2,#service-heading){font-size:20px;margin:6px 0;text-align:center}
html body main #find-business .category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:6px}
html body main #find-business .category-grid>button{width:100%;min-height:44px;padding:6px;font-size:13px;line-height:1.2;text-align:center}
html body main #find-business .category-grid>button:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc((100% - 6px)/2)}
html body main #find-business .hub-pager{margin:6px auto;justify-content:center}
#community-language-choice{width:min(90vw,400px);box-sizing:border-box;border:1px solid #cbd6e8;border-radius:18px;padding:20px;text-align:center;color:#172d71}
#community-language-choice h2{font-size:20px;margin:0 0 16px}
.community-language-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#community-language-choice::backdrop{background:#10205055}

/* Shared visible choices: equal columns and centered selections on every portal. */
html body .hub-address-chooser.inline-addresses .hub-address-options,html body .hub-visible-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin:8px auto;max-height:none;overflow:visible;padding:0}
html body .hub-address-chooser.inline-addresses .hub-address-option,html body .hub-visible-choices>button{box-sizing:border-box;min-width:0;width:100%;min-height:48px;padding:10px 8px;border:1px solid #cbd2dd;border-radius:12px;background:#fff;color:#172d71;font:inherit;font-size:14px;line-height:1.35;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere}
html body :is(.inline-addresses .hub-address-options,.hub-visible-choices)>button:last-child:nth-child(odd){grid-column:1/-1;width:calc((100% - 8px)/2);justify-self:center}
html body :is(.inline-addresses .hub-address-options,.hub-visible-choices)>button:only-child{width:100%}
html body .hub-address-chooser .hub-address-options>button.hub-address-option[aria-pressed=true],html body .hub-visible-choices>button[aria-pressed=true]{background:#e8efff;border:2px solid #18337e;font-weight:700}
html body select.hub-choice-source{display:none!important}
html body main #service-address-step{width:min(100%,600px);margin-inline:auto}
html body main #service-address-step>.panel{width:100%;box-sizing:border-box;margin-inline:auto}
html body main #service-address-step .address-actions{display:flex;justify-content:center}

html body .hub-visible-choices[hidden]{display:none!important}

/* Responsive shell shared by every page and writing direction.
   Use logical edges: physical right anchoring put the RTL menu off-screen. */
html{width:100%;max-width:100%}
html body{width:100%;max-width:100%;min-width:0;margin:0}
html body>main,html body.personal-portal>main,html body.cx-dashboard>main{
 width:100%;min-width:0;margin-inline:auto;align-self:center;
}
html body>.topbar,html body #personal-navigation{min-width:0;max-width:min(100%,960px);margin-inline:auto;align-self:center}
html body main :is(.screen,.account-shell,.account-view,.biz-shell,.biz-body,.cx-shell,.cx-content){min-width:0;max-width:100%;box-sizing:border-box}
html body main>.screen{width:100%;margin-inline:auto;align-self:center}
html body main :is(.cx-shell,.account-shell,.biz-shell){margin-inline:auto}
html body main :is(.account-grid,.biz-tiles,.cx-actions,.category-grid,.community-grid,.grid)>*{min-width:0;max-width:100%}
html body :is(.cx-brand,.biz-language-slot){margin-inline:0}
html body #personal-menu-slot #customer-menu>nav{
 left:auto;right:auto;inset-inline-start:auto;inset-inline-end:0;
 width:min(280px,calc(100vw - 24px));max-width:calc(100vw - 24px);
}
html body :is(.hub-menu>nav,.biz-menu-panel)>:is(button,a.button){
 display:flex;align-items:center;justify-content:center;width:100%;min-width:0;
 min-height:44px;margin:0;text-align:center;white-space:normal;overflow-wrap:anywhere;
}
html body #biz-account-menu .biz-menu-panel{
 left:auto;right:auto;inset-inline-start:0;inset-inline-end:auto;max-width:calc(100vw - 24px);
}
html body .biz-language-slot{text-align:center}
html body main :is(img,video,canvas){max-width:100%;height:auto}
html body main :is(input[type=email],input[type=tel],input[type=url],input[autocomplete=current-password],input[autocomplete=new-password]){direction:ltr;text-align:start}
html body main :is(fieldset,.cr-form,.biz-form,.profile-form){min-width:0;max-width:100%;box-sizing:border-box}
html body main :is(label,legend){text-align:center}
html body :is(.hub-menu>nav,.biz-menu-panel){overscroll-behavior:contain}
@media(max-width:600px){
 html body>main,html body.personal-portal>main{padding-inline:10px}
 html body.personal-portal.cx-dashboard>main{padding-inline:0}
 html body #personal-menu-slot #customer-menu>nav{
  position:fixed;left:auto;right:auto;inset-inline:12px;
  top:auto;bottom:calc(var(--personal-nav-height,68px) + 8px);
  width:min(320px,calc(100vw - 24px));margin-inline:auto;
  max-height:calc(100dvh - var(--personal-nav-height,68px) - 32px);
 }
 html body #biz-account-menu .biz-menu-panel{width:min(280px,calc(100vw - 24px))}
 html body main :is(.account-shell,.panel,.records,.biz-box){padding:10px}
 html body main :is(.cx-actions,.account-grid,.biz-tiles){gap:8px}
}
/* Presentation must never override permission or route visibility. */
html body [hidden]{display:none!important}

/* One address style on property, service, product and tenant screens. */
html body .hub-address-display,html body main #directory-address-detail{
 display:block;white-space:pre-line;text-align:center;direction:ltr;
 font-family:inherit;font-size:16px;font-weight:400;line-height:1.5;
 letter-spacing:normal;overflow-wrap:anywhere;max-width:100%;margin:12px auto;
}
html body :is(.hub-address-option,.hub-address-trigger).hub-address-display{
 display:flex;align-items:center;justify-content:center;margin:0;padding:10px 8px;
}
html body .hub-address-option.hub-address-display[aria-pressed=true]{font-weight:700}

/* Property selection and service selection are separate directory steps. */
html body main #directory-property-step{width:min(100%,600px);margin:12px auto;gap:10px}
html body main #directory-property-heading{margin:0;font-size:20px;text-align:center}
html body main #directory-property-continue{width:min(100%,320px);justify-self:center;margin:0}
html body main #directory-service-step{width:100%;min-width:0;margin-inline:auto;text-align:center}
html body main #directory-back-to-property{display:flex;width:min(100%,320px);margin:8px auto}
html body [hidden]{display:none!important}

/* Compact category page: previous community stays selected in application state. */
html body main #find-business>button[data-go="customer-communities"]{display:none!important}
html body main #directory-service-step{position:relative;padding-top:0}
html body main #directory-back-to-property{position:absolute;inset-inline-start:0;top:0;display:flex;align-items:center;justify-content:center;width:44px;min-height:44px;height:44px;margin:0;padding:0;border:0;background:transparent;font-size:26px}
html[dir=rtl] #directory-back-to-property span{transform:scaleX(-1)}
html body main #category-choice-heading{display:flex;align-items:center;justify-content:center;min-height:44px;padding-inline:48px;margin:0 0 8px;font-size:22px}
html body main #find-business #directory-categories{display:flex;gap:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;width:100%;margin:0;padding:0}
html body main #find-business #directory-categories::-webkit-scrollbar{display:none}
html body main #find-business #directory-categories>.hub-category-page{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;flex:0 0 100%;width:100%;min-width:100%;max-width:100%;grid-auto-rows:1fr;align-content:start;scroll-snap-align:start;scroll-snap-stop:always}
html body main #find-business #directory-categories .hub-category-page>button{box-sizing:border-box;width:100%;min-width:0;height:auto;min-height:52px;margin:0;padding:7px;font-size:14px;line-height:1.25;white-space:normal;text-align:center;overflow-wrap:normal;word-break:normal;hyphens:none}
html body main #find-business #directory-categories .hub-category-page>button:last-child:nth-child(odd){grid-column:1/-1;width:calc((100% - 6px)/2);justify-self:center}
html body main .category-page-dots{display:flex;align-items:center;justify-content:center;gap:4px;height:28px;margin:0}
html body main .category-page-dots>button{display:flex;align-items:center;justify-content:center;width:28px;min-height:28px;height:28px;margin:0;padding:0;border:0;background:transparent;font-size:24px;color:#9ba8c2}
html body main .category-page-dots>button[aria-current=true]{color:#172d79}
html body main #find-business #directory-categories[hidden],html body main .category-page-dots[hidden]{display:none!important}

html body main #directory-service-step:has(#category-choice-heading[hidden])>#directory-back-to-property{display:none}

.property-job-fields .job-address-map{color:#172d71;text-decoration:underline;text-underline-offset:3px;font-weight:600;overflow-wrap:anywhere;display:inline-block;padding:6px 0}
.property-job-fields .job-address-map:focus-visible{outline:2px solid #172d71;outline-offset:3px;border-radius:3px}

/* Clearly identify tappable job contact and model links. */
html body dialog.property-job-dialog .property-job-fields :is(.job-address-map,.property-contact-link,.job-model-chatgpt){color:#0000ee;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
html body dialog.property-job-dialog .job-model-chatgpt:focus-visible{outline:2px solid #172d71;outline-offset:3px;border-radius:3px}