/* Signed-in pages. All colours come from /assets/site.css. */
html:has(.workspace){scroll-behavior:auto}
::selection{background:var(--copper-tint)}
.account{max-width:520px;padding-top:56px;padding-bottom:88px}
.account h1{font-size:clamp(34px,5vw,52px)}
.account .lede{margin-bottom:28px}
.account .btn{width:100%}
.account #change-email{margin-top:12px}
.account .lede{overflow-wrap:anywhere}
.or{display:flex;align-items:center;gap:12px;color:var(--pencil);font-size:14px;margin:26px 0}
.or::before,.or::after{content:"";flex:1;border-top:1px solid var(--rule)}
.field{display:grid;gap:8px;margin-bottom:14px}
.field label{font-weight:650;font-size:15px}
.field input,.field textarea{font:inherit;font-size:17px;padding:12px;border:1px solid var(--field-rule);border-radius:var(--radius);background:var(--white);color:var(--ink);caret-color:var(--copper);min-height:48px;width:100%;min-width:0}
.field textarea{resize:vertical}
.status{min-height:1.5em;margin:16px 0 0}
.status:empty{min-height:0;margin:0}
.error,.status.error{color:var(--copper-deep);font-weight:600;font-size:14.5px}
.error:empty{display:none}
.facts-list{list-style:none;padding:0;margin:0 0 28px;border-top:1px solid var(--rule)}
.facts-list li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule)}
.facts-list span:first-child{color:var(--pencil)}

/* Workspace shell: both task links stay visible, including at 320px. */
.app-nav{display:grid;grid-template-columns:auto auto 1fr;gap:24px;align-items:center;min-height:76px;border-bottom:1px solid var(--rule)}
.workspace .skip-link{min-height:44px}
.app-nav .brand{min-height:44px}
.app-nav nav{display:flex;gap:22px;font-size:15.5px;font-weight:600;line-height:1.25}
.app-nav nav a{display:flex;align-items:center;min-height:44px;text-decoration:none}
.app-nav nav a:hover,.app-nav nav a[aria-current=page]{text-decoration:underline;text-underline-offset:5px}
.app-company{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:14px;color:var(--pencil);min-width:0}
.app-company span{overflow-wrap:anywhere}
.app-company span:not(:empty)::after{content:" ·"}
.app-company .linkbtn{min-height:44px;font:600 14px Archivo,system-ui,sans-serif;white-space:nowrap}
.read-only{font-size:14.5px;color:var(--pencil);padding-top:12px}
.app-legal{display:flex;justify-content:space-between;align-items:center;gap:20px;color:var(--pencil);font-size:14px}
.app-legal a{display:inline-flex;align-items:center;min-height:44px}
.workspace footer{padding:12px 0;margin-top:0}
.app{max-width:680px;padding:36px 20px 56px;overflow-wrap:anywhere}
.app h1{font-size:32px;font-weight:720;line-height:1.15}
.app h2{font-size:22px}
.app .lede{font-size:17px;max-width:none;color:var(--pencil);margin-bottom:24px}
.app .btn{box-shadow:none;color:var(--white)}
.app .btn.dark:hover{background:var(--graphite)}
.app .btn.ghost,.app .btn.act{color:var(--ink);background:var(--white);border:1px solid var(--ink);box-shadow:none}
.app .btn.act{min-height:44px;font-size:15px;padding:10px 12px}
.app .btn.ghost:hover,.app .btn.act:hover,.app .btn.act[aria-pressed=true]{background:var(--ink);color:var(--white)}
.app .btn:disabled{cursor:default;color:var(--pencil);background:var(--paper);border:1px solid var(--field-rule)}
.app .textlink,.app .crumbs a{display:inline-flex;align-items:center;min-height:44px}
.app .empty{background:var(--white);border-color:var(--field-rule);padding:20px}
.app .empty p:empty{display:none}
.app .empty p{margin:0 0 8px}
.app .hint{font-size:14px}
.app time,.app .num,.request-status,.last-outcome,.wrong-label,.checked{font-variant-numeric:tabular-nums}

/* One ruled worklist, with a separate source link above the heading's cover. */
.call-list{list-style:none;padding:0;margin:24px 0 0}
.app .call-row{grid-template-columns:minmax(0,1fr) 56px;gap:16px;padding:20px}
.app .call-row:hover{background:var(--white)}
.call-body{min-width:0;display:grid;gap:8px}
.app .call-row h2{font-size:20px;font-weight:680;line-height:1.3;margin:0}
.row-link{display:flex;align-items:center;min-height:44px;text-decoration:none}
.row-link::after{content:"";position:absolute;inset:0}
.row-link:visited{color:var(--pencil)}
.row-link:hover{text-decoration:underline}
.row-link:focus-visible::after{outline:3px solid var(--copper);outline-offset:2px;border-radius:var(--radius)}
.app .call-row .reach,.app .call-row .fit{font-size:17px;color:var(--ink)}
.app .call-row .row-meta,.source-line{font-size:14.5px;color:var(--pencil);margin:0 0 16px}
.app .call-row .source-line,.app .call-row .row-meta{margin:0}
.source-line a,.see-people{position:relative;z-index:1}
.app .source-line a{font-size:inherit;color:inherit}
.app .call-row .notice{margin:0;font-size:15px}
.app .call-row .num{font-size:24px;font-weight:740;text-align:center;border-left:1px solid var(--rule-soft);padding-left:12px}
.app .call-row .num small{font-size:15.5px;font-weight:400;line-height:1.3}
.see-people{justify-self:start;font-size:15px}

/* Person as the hero; every action keeps its target size. */
.app .person-card{background:var(--white);padding:20px;margin:20px 0;border:1px solid var(--rule);border-radius:var(--radius)}
.app .person-name{font-size:17.5px;font-weight:680;margin:0 0 4px;line-height:1.3}
.person-role{font-size:15px;color:var(--pencil);margin:0 0 12px}
.number-row{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;margin-bottom:12px}
.person-number{font-size:24px;font-weight:740;color:var(--ink);font-variant-numeric:tabular-nums;min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.trust{font-size:14.5px;color:var(--pencil)}
.evidence{font-size:15px;border-left:2px solid var(--rule);padding-left:12px;margin:12px 0 18px}
.evidence p{margin:0}
.checked{color:var(--pencil);margin-top:4px!important}
.person-actions{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px}
.person-actions .btn{min-width:0}
.app .call-action{background:var(--ink)}
.app .call-action:hover{background:var(--graphite)}
.app .call-action.first-call{background:var(--copper)}
.app .call-action.first-call:hover{background:var(--copper-deep)}
.person-actions.no-call{grid-template-columns:1fr 1fr}
.after-call{margin-top:8px}
.after-call>summary{display:list-item;padding-block:12px;line-height:20px;cursor:pointer;font-size:13.5px;color:var(--pencil)}
.after-call[open]>.outcomes{margin-top:4px}
.outcomes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.last-outcome,.wrong-label{font-size:14.5px;color:var(--pencil);margin:12px 0 0}
.wrong-label{margin-bottom:4px}
.wrong-number .person-number{color:var(--pencil);text-decoration:line-through}
.action-feedback{display:block;font-size:14.5px;color:var(--pencil);margin-top:8px}
.action-feedback:empty,.last-outcome:empty{display:none}
.utility-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:16px 0;border-block:1px solid var(--rule);font-size:15px;color:var(--pencil)}
.utility-row p{flex:1 1 300px;margin:0}
.utility-actions{display:flex;gap:8px}
.utility-row .action-feedback{flex-basis:100%}
.how-known{margin:16px 0;color:var(--pencil);font-size:15px}
.how-known summary{min-height:44px;cursor:pointer;padding:10px 0;font-weight:600;color:var(--ink)}
.how-known .source-line{margin:0}
.how-known ul{padding-left:20px;margin:8px 0}
.project-note{font-size:14.5px}

/* Requests keep the server's order and due time; there is no client deadline rule. */
.app fieldset{border:0;padding:0;margin:0;min-width:0}
.promise{font-size:14.5px;color:var(--pencil);margin:12px 0 32px}
.request-row{border-top:1px solid var(--rule);padding:20px 0}
.request-row h3{font-size:17.5px;line-height:1.35}
.request-status{font-size:14.5px;color:var(--pencil);margin:6px 0 12px}
.resolution{font-size:15px}
.request-row .person-card{margin:16px 0 0}
@media (max-width:759px){
  .app-nav{grid-template-columns:auto 1fr;gap:0 24px;padding-top:8px;padding-bottom:8px}
  .app-company{grid-column:1/-1;justify-content:flex-start}
}
@media (max-width:759px){
  .app{padding:24px 16px 40px}
  .app h1{font-size:28px}
  .app-nav{padding:8px 16px;gap:0 12px}
  .app-nav .brand{font-size:15px;font-stretch:90%}
  .app-nav nav{gap:12px;justify-content:flex-end}
  .app-nav nav a{flex:0 1 auto}
  .app-company{font-size:14px}
  .app .call-row{padding:16px 12px;gap:8px}
  .app .person-card{padding:16px}
  .person-actions{grid-template-columns:1fr 1fr}
  .call-action{grid-column:1/-1}
  .outcomes{grid-template-columns:repeat(2,minmax(0,1fr))}
  #request-contact{width:100%}
}
/* A desktop can't dial: Copy leads there. A phone-width screen always leads with Call. */
@media (min-width:760px) and (hover:hover) and (pointer:fine){
  .app .person-actions .copy-action{order:-1;min-height:48px;background:var(--ink);color:var(--white)}
  .app .person-actions .call-action{min-height:44px;background:var(--white);color:var(--ink);border:1px solid var(--ink);font-size:15px;padding:10px 12px}
  .app .person-actions .call-action:hover{background:var(--ink);color:var(--white)}
  .app .person-actions .copy-action:hover{background:var(--graphite)}
}

/* Jobs: one dense row per jobsite; a wide list reads as a table. The whole
   row is the link (row-link cover), so reactions sit above that cover. */
.app.wide{max-width:1120px}
.app .lane>h2{font-size:20px;margin:24px 0 0}
.lane>summary{min-height:44px;padding:10px 0;box-sizing:border-box;margin-top:20px;font-size:18px;font-weight:700;cursor:pointer}
.job-list{list-style:none;padding:0;margin:8px 0 20px;border-top:1px solid var(--rule);container-type:inline-size}
.job-row{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"addr value" "meta meta" "what react";column-gap:12px;padding:0 0 10px;border-bottom:1px solid var(--rule)}
.job-row:hover{background:var(--white)}
.app .job-address{grid-area:addr;font-size:17px;line-height:1.25;margin:0;min-width:0}
.job-value{grid-area:value;align-self:center;justify-self:end;margin:0;font-size:17px;font-weight:720;font-variant-numeric:tabular-nums}
.job-meta{grid-area:meta;display:flex;margin:0;min-width:0;overflow:hidden;white-space:nowrap;font-size:14px;line-height:1.4;color:var(--pencil)}
.job-meta span{flex:none}
.job-meta .sep{white-space:pre}
.job-meta .job-gc{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--ink);font-weight:600}
.job-meta .job-gc.none{color:var(--pencil);font-weight:400}
.job-what{grid-area:what;margin:2px 0 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;line-height:1.4;color:var(--pencil)}
.job-row .reactions{grid-area:react;position:relative;z-index:1}
@container (min-width:880px){
  .job-row{grid-template-columns:minmax(0,2fr) 6rem minmax(0,.9fr) minmax(0,1.4fr) 11.5rem;grid-template-areas:"addr value city gc when" "what what what what react";column-gap:16px;padding:0 8px 8px}
  .job-meta{display:contents}
  .job-meta span{align-self:center;overflow:hidden;text-overflow:ellipsis}
  .job-meta .sep{display:none}
  .job-meta .job-city{grid-area:city}
  .job-meta .job-gc{grid-area:gc}
  .job-meta .job-when{grid-area:when}
  .job-value{text-align:right}
}

/* Job page: address, size and contractor first; permit facts fold away. */
.job-size{margin:4px 0;font-size:22px;font-weight:740;font-variant-numeric:tabular-nums}
.app .job-summary{margin:0 0 8px;font-size:16px;color:var(--pencil);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.job-company{margin:0;font-weight:600}
.job-stage{margin:0 0 8px;font-size:15px;color:var(--pencil)}
.permit-details{margin:28px 0;border-top:1px solid var(--rule)}
.permit-details>summary{min-height:44px;padding:10px 0;box-sizing:border-box;font-weight:600;cursor:pointer}
.permit-details .facts-list{margin:8px 0 16px}
.permit-description{font-size:15px;color:var(--pencil)}
.app .permit-details h3{font-size:16px;margin:16px 0 4px}
.site-permits{list-style:none;padding:0;margin:0 0 12px;font-size:15px;color:var(--pencil)}
.people-list .person-card{margin:18px 0}
.person-role:empty{display:none}
#contacts-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end;margin-bottom:8px}
#contacts-search .field{margin:0}
#contacts-search .btn{min-height:48px}
.company-group{margin-top:28px}
.app .company-head{position:sticky;top:0;z-index:1;display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0;padding:12px 0 8px;background:var(--paper);border-bottom:1px solid var(--rule);font-size:20px;line-height:1.25}
.group-count{flex:none;font-size:14.5px;font-weight:600;color:var(--pencil);font-variant-numeric:tabular-nums}
.company-group .person-card{margin:12px 0}
.job-request{margin:28px 0}
@media(max-width:759px){.app-nav nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;gap:24px}.app-company{grid-row:3}.app-nav{grid-template-columns:1fr}}
