:root{--navy:#0f3d5e;--blue:#1f6fb2;--green:#2e8b57;--bg:#f3f5f8;--card:#fff;--text:#1b2733;--muted:#66788a;--line:#e1e6ec;--radius:14px}
*{box-sizing:border-box}
body{margin:0;font:16px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text)}
.top{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top));background:var(--navy);color:#fff;position:sticky;top:0;z-index:5}
.brand{display:flex;gap:10px;align-items:center}.brand small{display:block;opacity:.8;font-size:13px}
.bolt{font-size:26px;background:#f5b700;border-radius:10px;width:40px;height:40px;display:grid;place-items:center}
.demo{background:#fff4cc;color:#6b5200;text-align:center;font-weight:600;font-size:14px;padding:6px;border-bottom:1px solid #f0dc8a}
main{max-width:900px;margin:0 auto;padding:16px}
.card{background:var(--card);border-radius:var(--radius);box-shadow:0 1px 3px rgba(0,0,0,.08);padding:18px;margin-bottom:14px}
h1{font-size:22px;margin:4px 0 14px}h2{font-size:15px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 10px}
input[type=password],input[type=search],input[type=text]{width:100%;font-size:18px;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;background:#fff;outline:none}
input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(31,111,178,.15)}
button,.btn{font:inherit;border:0;border-radius:12px;padding:12px 16px;background:var(--blue);color:#fff;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}
button.ghost{background:transparent;border:1.5px solid rgba(255,255,255,.5);padding:8px 12px}
.btn.sm{padding:8px 12px;font-size:14px}.btn.light{background:#e8f0f8;color:var(--blue)}
.big{width:100%;font-size:20px;padding:20px;background:var(--green);border-radius:16px;margin-top:4px}
.err{color:#b3261e;margin-top:10px;min-height:1em}
.login{max-width:420px;margin:8vh auto}.login button{width:100%;margin-top:12px;font-size:18px;padding:14px}
.results{list-style:none;margin:12px 0 0;padding:0}
.results li a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:16px;background:#fff;border-radius:12px;margin-bottom:8px;text-decoration:none;color:inherit;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.results li a:active{background:#eef4fa}
.rname{font-weight:600;font-size:17px}
.tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px}.tag{font-size:12px;padding:2px 8px;border-radius:99px;background:#e8f0f8;color:var(--blue)}
.tag.cust{background:#e5f4ec;color:var(--green)}.tag.lead{background:#f7ecff;color:#7a3db8}
.chev{color:var(--muted);font-size:22px}
.back{color:#fff;opacity:.9}
.crumb{display:inline-block;margin-bottom:6px;color:var(--blue);text-decoration:none;font-weight:600}
.tech{display:flex;gap:8px;align-items:center;margin-top:12px;font-size:14px;color:var(--muted)}.tech input{font-size:16px;padding:10px 12px}
.prog{margin-top:12px}.bar{height:10px;background:#e7ecf1;border-radius:99px;overflow:hidden}.bar>i{display:block;height:100%;width:0;background:var(--green);transition:width .2s}
.ok{color:var(--green);font-weight:600;margin-top:8px}
.file{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.file:first-of-type{border-top:0}
.thumb{width:56px;height:56px;border-radius:10px;background:#eef2f6;flex:none;display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--muted);overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover}
.finfo{flex:1;min-width:0}.fname{font-weight:600;word-break:break-word}.fmeta{font-size:13px;color:var(--muted)}
.factions{display:flex;gap:6px;flex:none}
.empty{color:var(--muted);font-size:14px}
.sub{font-size:13px;color:var(--muted);margin:-6px 0 8px;word-break:break-all}
@media (max-width:560px){main{padding:12px}.factions{flex-direction:column}.file{align-items:flex-start}.card{padding:14px}}
/* PDF viewer */
body.viewer{background:#525659}
.vbar{gap:8px}.vtitle{flex:1;min-width:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zoom{display:flex;gap:6px}.zoom button{min-width:48px;min-height:44px;font-size:22px;padding:4px 10px}
.vmsg{color:#eee;text-align:center;font-size:13px;padding:6px}
.pages{padding:8px;overflow:auto}.pages canvas{display:block;margin:0 auto 10px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.4);max-width:none}
.vfoot{display:flex;gap:8px;justify-content:center;padding:12px 12px max(12px,env(safe-area-inset-bottom))}
/* pinned docs, roles, queue */
.pin{border-left:5px solid #f5b700}.pin h2{color:var(--navy)}
.role{font-size:12px;background:rgba(255,255,255,.18);border-radius:99px;padding:2px 8px;margin-left:6px}
.queue{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:20;background:#b85c00;color:#fff;border-radius:16px;padding:16px;font-size:17px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.queue.busy{background:var(--blue)}.queue.fail{background:#b3261e}
.dock{position:sticky;bottom:0;padding:10px 0 max(10px,env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg) 30%);z-index:4}
.dock .big{min-height:64px;box-shadow:0 4px 14px rgba(46,139,87,.35)}
.btn.sm{min-height:44px;min-width:64px}
.results li a{min-height:64px}
body.hasq main{padding-bottom:96px}
@media (max-width:560px){.factions{flex-direction:column}}
.role:empty{display:none}
body.hasq .dock{bottom:72px}
[hidden]{display:none!important}
.btn.send{background:#f5b700;color:#1b2733}
.cstat{margin-top:4px}.cstat:empty{display:none}
.badge{display:inline-block;font-size:12px;font-weight:700;padding:2px 8px;border-radius:99px;background:#e8f0f8;color:var(--blue)}
.badge.draft{background:#eef0f3;color:#55606c}.badge.sent{background:#e8f0f8;color:var(--blue)}.badge.seen{background:#fff4cc;color:#6b5200}.badge.done{background:#e5f4ec;color:var(--green)}.badge.bad{background:#fde8e6;color:#b3261e}
body.modal{overflow:hidden}
.modalbg{position:fixed;inset:0;background:rgba(15,30,45,.55);z-index:50;display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:24px 12px}
.dlg{width:100%;max-width:560px;margin:0}
.dlg h1{margin-top:0}
.dsec{display:block;margin:12px 0}.dl{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:4px}
.dlg input[type=text]{font-size:16px;padding:11px 13px}
.chk{display:flex;gap:8px;align-items:flex-start;margin:6px 0;font-size:15px}.chk input{width:20px;height:20px;flex:none;margin-top:1px}.chk.dis{color:var(--muted)}
.who{margin:4px 0 6px;font-size:15px}
.mode{border-radius:10px;padding:10px 12px;font-size:14px;margin:6px 0}.mode.test{background:#fff4cc;color:#5a4500}.mode.live{background:#e5f4ec;color:#1d5e3a}.mode.warn{background:#fde8e6;color:#8a1f17}
.sum{font-size:14px;background:#f3f5f8;border-radius:10px;padding:10px 12px;margin-top:8px}
.dbtns{display:flex;gap:10px;justify-content:flex-end;margin-top:14px}.dbtns .btn{min-height:48px}.btn.go{background:var(--green)}.btn:disabled{opacity:.55;cursor:default}
@media (max-width:560px){.modalbg{padding:10px 8px}.dbtns{flex-direction:column-reverse}.dbtns .btn{width:100%}}
.linkbtn{background:none;border:0;padding:0 4px;color:#b3261e;font-size:13px;font-weight:600;text-decoration:underline;min-height:0}
/* proposal builder (office only) */
.newprop{display:flex;justify-content:flex-end;margin-bottom:10px}
.jhead{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.jhead h1{margin-bottom:8px}
.jlink{color:var(--green);font-weight:600}
.pbhead{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.pbhead h1{margin-bottom:8px}
.ptabs{display:flex;gap:6px;margin:0 0 12px}.ptab{flex:1;background:#e1e8ef;color:var(--navy);border-radius:12px 12px 0 0;min-height:48px}.ptab.on{background:var(--navy);color:#fff}
main:has(.ptabs){max-width:1240px}
.pgrid{display:grid;grid-template-columns:minmax(300px,380px) 1fr;gap:14px;align-items:start}
@media (max-width:900px){.pgrid{grid-template-columns:1fr}}
.pform{position:sticky;top:80px}@media (max-width:900px){.pform{position:static}}
.f{display:block;margin:0 0 12px}.f>span{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:4px}
.f input[type=text],.f input[type=tel],.f input[type=email],.f input[type=number],.f input[type=date],.f select,.f textarea,.dlg textarea{width:100%;font:inherit;font-size:16px;padding:11px 13px;border:1.5px solid var(--line);border-radius:10px;background:#fff}
.opts{display:flex;flex-wrap:wrap;gap:6px 14px}.opts.col{flex-direction:column}.opts label{display:flex;gap:6px;align-items:center;min-height:36px;font-size:15px}.opts input{width:20px;height:20px}
.btn.wide{width:100%;min-height:52px;font-size:17px;margin-top:4px}
.pout .ph{text-align:center;color:#999;margin:60px 0;text-transform:none;letter-spacing:0;font-size:18px}
.pout{padding:10px;background:#f8faf7}.pout .pp{padding:14px}
.pacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.pacts .btn{flex:1 1 220px;min-height:50px}
.agrid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.agrid .full{grid-column:1/-1}@media (max-width:640px){.agrid{grid-template-columns:1fr}}
.aform h2{margin-top:14px}.sched{font-size:14px;background:#f3f5f8;border-radius:10px;padding:10px 12px;line-height:1.6}
.dbtns.left{justify-content:flex-start}
.aout{padding:0;overflow:hidden}.docwrap{overflow-x:auto;background:#fff;border-bottom:1px solid var(--line)}.aout .pacts{padding:0 14px 14px}
@media (max-width:640px){.docwrap .doc{padding:.2in;font-size:10.5pt}}
.def{display:block;font-size:12px;color:var(--muted);margin-top:3px}.def.chg{color:#b85c00;font-weight:600}
.sset{align-items:flex-start}.sset .def{display:inline}
.linkbtn.blue{color:var(--blue)}
.card,#pOut,#aOut{scroll-margin-top:84px}
.f>span.def{text-transform:none;letter-spacing:0;font-weight:400;font-size:12px;margin:3px 0 0}.f>span.def.chg{color:#b85c00;font-weight:600}
/* nearest job */
.near h2{margin-bottom:6px}.nearwhy{margin-bottom:4px}
.dist{flex:none;font-weight:700;color:var(--navy);font-size:15px;white-space:nowrap}
.nearbar{background:#e5f4ec;color:#1d5e3a;border-radius:12px;padding:12px 14px;margin:0 0 12px;font-size:15px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;justify-content:space-between}
.nearbar>div:first-child{flex:1 1 220px}.nearbar .linkbtn{font-size:15px;min-height:44px}
#alts{flex-basis:100%}#alts .results{margin-top:4px}
.nidx{text-align:center;margin:-4px 0 14px}
.savest{font-size:14px;color:#1d5e3a;margin-top:8px;min-height:1.2em}.savest.bad{color:#8a1f17}.aout .savest{padding:0 14px 12px}
/* file date: right-side label on every file row */
.factions{align-items:center}
.fdate{min-width:96px;text-align:right;font-size:13px;font-weight:600;color:#33475b;background:#eef2f6;border-radius:8px;padding:6px 8px;white-space:nowrap}
@media (max-width:560px){.factions{align-items:stretch}.fdate{min-width:0;text-align:center;font-size:12px;padding:4px 6px}}
/* ---- phone layout (v5): compact top bar that scrolls away with the page, so it never covers search, results, buttons or fields ----
   iOS installed app (status bar "black-translucent") draws the page under the status bar: a thin navy strip covers just that inset. */
.top{position:relative;z-index:5;padding:6px 12px;padding-top:max(6px,calc(env(safe-area-inset-top,0px) + 2px));padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
.top.vbar{position:sticky;top:0} /* PDF viewer keeps its zoom bar; it covers no form */
body::before{content:"";position:fixed;top:0;left:0;right:0;height:env(safe-area-inset-top,0px);background:var(--navy);z-index:60;pointer-events:none}
.brand{gap:8px;min-width:0}.brand strong{font-size:16px;line-height:1.2;display:block}.brand small{font-size:12px}
.bolt{font-size:20px;width:34px;height:34px;border-radius:9px;flex:none}
button.ghost{min-height:44px;padding:6px 14px;font-size:15px}
.demo{font-size:13px;padding:4px 8px}
main{padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
.pform{top:calc(12px + env(safe-area-inset-top,0px))}
.card,#pOut,#aOut{scroll-margin-top:calc(12px + env(safe-area-inset-top,0px))}
input,select{scroll-margin-top:calc(16px + env(safe-area-inset-top,0px));scroll-margin-bottom:96px}
/* tap targets >= 44px */
.crumb{display:inline-flex;align-items:center;min-height:44px;margin-bottom:0;padding-right:12px}
.tech input,.dlg input[type=text],.f input,.f select{min-height:44px}
.opts label{min-height:44px}
.chk{min-height:44px;align-items:center;margin:2px 0}
.linkbtn{min-height:44px;display:inline-flex;align-items:center}
/* dialogs start below the status bar / notch and end above the home bar */
.modalbg{padding-top:max(24px,calc(env(safe-area-inset-top,0px) + 10px));padding-bottom:max(24px,calc(env(safe-area-inset-bottom,0px) + 10px))}
@media (max-width:560px){.modalbg{padding-top:max(10px,calc(env(safe-area-inset-top,0px) + 8px));padding-bottom:max(10px,calc(env(safe-area-inset-bottom,0px) + 8px))}}

/* signed customers (GreenLead or completed DocuSign): green check + green name + green edge. Unsigned rows stay plain. */
.sgn{display:inline-flex;align-items:center;justify-content:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--green);color:#fff;font-size:14px;font-weight:800;line-height:1;margin-right:8px;vertical-align:-3px}
.results li.is-signed a{box-shadow:inset 4px 0 0 var(--green),0 1px 2px rgba(0,0,0,.06)}
.results li.is-signed .rname{color:#1f6b43}
.card.is-signed{border-left:5px solid var(--green)}
.card.is-signed h1{color:#1f6b43}
.jhead h1 .sgn{width:26px;height:26px;font-size:16px;vertical-align:-4px}
.sstat{color:#1f6b43;font-weight:700;font-size:14px;margin:2px 0 4px}
.slegend{color:var(--muted);font-size:13px;margin:8px 0 0;display:flex;align-items:center}.slegend .sgn{width:18px;height:18px;font-size:11px;margin-right:6px}

/* on-screen keyboard (v7): while a text field is focused, leave room to scroll it (and search results) above the keyboard,
   and keep the fixed photo-queue bar from floating over the rows */
body.kb main{padding-bottom:75vh}
body.kb .queue{display:none}
#q{scroll-margin-top:calc(8px + env(safe-area-inset-top,0px))}
/* keyboard up on search: tighter rows (still >= 44px tap targets) so more matches fit between the box and the keyboard */
body.kb #scard .slegend{display:none}
body.kb #scard .results{margin-top:8px}
body.kb #scard .results li a{padding:10px 14px;min-height:52px;margin-bottom:6px}
body.kb #scard .tags{margin-top:2px}

/* ---- v9: search always pinned to the top of the screen (phone + desktop) ----
   The bar is its own card, position:sticky directly under the status-bar/notch inset (the navy body::before strip only
   paints that inset, so it never overlaps the bar). It sits above all page content (z 40) but below dialogs (z 50, which
   are opened on purpose) and the inset strip (z 60). --vvtop follows iOS visual-viewport panning while the keyboard is up.
   The top bar (.top) scrolls away; nothing else on the search screen is sticky/fixed at the top. */
.sbar{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--vvtop,0px));z-index:40}
#sbar{margin-bottom:10px;padding:12px 14px;box-shadow:0 2px 10px rgba(15,61,94,.16)}
#sbar .jhead{align-items:center;margin-bottom:8px}#sbar h1{margin:0;font-size:20px}
.sbtns{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
#scard{padding-top:12px}#scard .slegend{margin-top:0}#scard .results{margin-top:8px}
#scard,#near,.nidx{scroll-margin-top:150px}
/* job page: the "Search" link is pinned the same way */
.crumbbar{background:var(--bg);margin:0 -12px 6px;padding:2px 12px;box-shadow:0 1px 0 var(--line)}
.crumbbar .crumb{font-size:17px;min-height:44px}
@media (max-width:560px){#sbar{padding:10px 12px}#sbar h1{font-size:18px}.sbtns .btn.sm{padding:8px 10px;font-size:14px}}
body.kb #sbar{margin-bottom:6px}
/* pages with the pinned Search link: anything we scroll/focus into view, and the sticky proposal form, lands below it */
.pform{top:calc(env(safe-area-inset-top,0px) + 62px)}
.card,#pOut,#aOut{scroll-margin-top:calc(env(safe-area-inset-top,0px) + 62px)}
input,select,textarea{scroll-margin-top:calc(env(safe-area-inset-top,0px) + 62px)}
#q{scroll-margin-top:calc(8px + env(safe-area-inset-top,0px))}
/* keyboard up on a phone: only the box stays in the pinned bar (title + Near me/New proposal come back when the keyboard closes),
   so as many matches as possible fit between the box and the keyboard */
body.kb #sbar .jhead{display:none}
body.kb #sbar{padding:8px 10px}
body.kb #scard{padding:8px 10px}
/* ---- v12: office tabs (admin only): Search | New lead | New proposal. Plain links above the page; techs never see them ---- */
.atabs{display:flex;gap:4px;max-width:868px;margin:12px auto 0;padding:4px;background:#e1e8ef;border-radius:12px;box-sizing:border-box}
@media (max-width:900px){.atabs{margin:10px max(12px,env(safe-area-inset-right,0px)) 0 max(12px,env(safe-area-inset-left,0px))}}
body:has(.atabs:not([hidden])) main{padding-top:10px}
.atabs[hidden]{display:none}
.atab{flex:1;display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:9px;color:var(--navy);font-weight:600;font-size:15px;text-decoration:none;text-align:center;white-space:nowrap}
.atab.on{background:#fff;color:var(--navy);box-shadow:0 1px 3px rgba(0,0,0,.12)}
@media (max-width:380px){.atab{font-size:14px}}
#lform .lsub{margin:-6px 0 14px}#lform .err{min-height:0;margin:2px 0 8px;color:#b3261e}#lform .err a{color:var(--blue);font-weight:600}

/* v13: website (Wix) leads */
.tag.web{background:#fff3e0;color:#9a5300}.tag.spam{background:#eceff1;color:#607080}
.webl dl.wl{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;margin:6px 0 0;font-size:14px}
.webl dt{color:#607080}.webl dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
