:root{--a:#1F4E79;--a2:#163a5b;--bg:#f4f6f9;--line:#d8dee6;--txt:#1d2733;--mut:#5d6b7a;--ok:#1e7b46;--warn:#9a5b00;--bad:#b42318}
*{box-sizing:border-box}
html{font-size:17px}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--txt);background:var(--bg);line-height:1.45}
a{color:var(--a)}
header.top{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;background:#fff;border-bottom:4px solid var(--a);padding:.55rem 1rem}
.brand img{height:46px;display:block}
header nav{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;margin-left:auto}
header nav a{text-decoration:none;font-weight:600}
.phone{font-weight:700;color:var(--a);text-decoration:none;white-space:nowrap}
main{max-width:1150px;margin:0 auto;padding:1rem}
footer{text-align:center;color:var(--mut);font-size:.85rem;padding:1.5rem 1rem;border-top:1px solid var(--line);margin-top:2rem}
h1{font-size:1.6rem;margin:.2rem 0}
h2{font-size:1.2rem;margin:0 0 .7rem;color:var(--a)}
h3{font-size:1rem;margin:1rem 0 .4rem}
.muted{color:var(--mut)}.small{font-size:.85rem}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:1rem 1.1rem;margin:0 0 1rem}
.narrow{max-width:460px;margin:2rem auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.grid2>.card{margin:0 0 0}
.grid2{margin-bottom:1rem}
.headrow{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:.8rem}
.crumbs{margin:.2rem 0}
.note{background:#e8f0f8;border-left:5px solid var(--a);padding:.6rem .8rem;border-radius:6px;margin-bottom:1rem}
.note.warn{background:#fff4e0;border-color:var(--warn)}
.btn{display:inline-block;background:var(--a);color:#fff;border:0;border-radius:8px;padding:.6rem 1rem;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;min-height:44px}
.btn:hover{background:var(--a2)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn.small{padding:.35rem .7rem;font-size:.88rem;min-height:36px}
.btn.ghost{background:#fff;color:var(--a);border:2px solid var(--a)}
.btn.danger{background:var(--bad)}
button.link{background:none;border:0;color:var(--a);font:inherit;font-weight:600;cursor:pointer;padding:0}
form.inline{display:inline}
.stack{display:grid;gap:.75rem}
.stack.two{grid-template-columns:1fr 1fr}
.stack.two .full,.stack.two button{grid-column:1/-1}
label{display:grid;gap:.25rem;font-weight:600;font-size:.92rem}
input,select,textarea{font:inherit;padding:.55rem .6rem;border:1px solid #b9c3cf;border-radius:7px;width:100%;background:#fff;min-height:44px}
input:focus,select:focus,textarea:focus{outline:3px solid #9cc0e3;border-color:var(--a)}
.search{display:flex;gap:.6rem;margin-bottom:.8rem}
.search input{flex:1}.search select{width:auto}
table.jobs{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
table.jobs th{background:var(--a);color:#fff;text-align:left;padding:.55rem .7rem;font-size:.88rem}
table.jobs td{padding:.6rem .7rem;border-top:1px solid var(--line);vertical-align:top}
table.jobs tbody tr{cursor:pointer}table.jobs tbody tr:hover{background:#eef4fa}
table.jobs a{text-decoration:none}
.status{display:inline-block;padding:.15rem .55rem;border-radius:99px;font-size:.82rem;font-weight:700;background:#e4e9ef;color:#344;white-space:nowrap}
.status.big{font-size:1rem;padding:.35rem .9rem}
.s-ready{background:#dcf2e4;color:var(--ok)}.s-ordered{background:#d9e8f6;color:var(--a)}
.s-running{background:#fff1c9;color:#7a5600}.s-needs-office-review{background:#ffe6c7;color:var(--warn)}
.s-error{background:#fde3e1;color:var(--bad)}.s-archived{background:#eee;color:#777}
.task{background:#fff;border:1px solid var(--line);border-left:5px solid var(--a);border-radius:8px;padding:.6rem .8rem;margin-bottom:1rem}
.task.t-running{border-left-color:#d9a400;background:#fffbea}.task.t-failed{border-left-color:var(--bad)}
.spin{display:inline-block;width:1em;height:1em;border:3px solid #d9a400;border-top-color:transparent;border-radius:50%;animation:sp 1s linear infinite;vertical-align:-2px}
@keyframes sp{to{transform:rotate(360deg)}}
ul.docs,ul.plain,ol.revs{list-style:none;margin:0;padding:0}
ul.docs li{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.5rem 0;border-top:1px solid var(--line)}
ul.docs li:first-child{border-top:0}
a.doc{display:grid;text-decoration:none;min-width:0}
a.doc b{overflow-wrap:anywhere}
.act{display:grid;gap:.4rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.act .btn{justify-self:start}
label.file input{padding:.4rem}
ol.revs li{padding:.6rem 0;border-top:1px solid var(--line)}
ol.revs li:first-child{border-top:0}
.files{display:flex;flex-wrap:wrap;gap:.35rem .9rem;margin-top:.25rem;font-size:.88rem}
.tag{font-size:.75rem;background:#e4e9ef;border-radius:99px;padding:.1rem .5rem;margin-left:.3rem}
.tag.gray{background:#eee;color:#888}
.userrow{display:flex;justify-content:space-between;gap:.6rem;align-items:center;padding:.6rem 0;border-top:1px solid var(--line);flex-wrap:wrap}
.userrow.off{opacity:.6}
.actions{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.row{display:flex;gap:.4rem;margin-top:.4rem}
details summary{list-style:none}details summary::-webkit-details-marker{display:none}
/* ---- phones ---- */
@media (max-width:760px){
  html{font-size:16px}
  .grid2,.stack.two{grid-template-columns:1fr}
  header.top{padding:.5rem .7rem;gap:.4rem .8rem}
  .brand img{height:38px}
  header nav{order:3;width:100%;margin-left:0;justify-content:space-between;gap:.6rem;font-size:.95rem}
  .phone{margin-left:auto}
  main{padding:.7rem}
  .search{flex-direction:column}.search select{width:100%}
  table.jobs thead{display:none}
  table.jobs,table.jobs tbody,table.jobs tr,table.jobs td{display:block;width:100%}
  table.jobs{border:0;background:none}
  table.jobs tr{background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:.7rem;padding:.4rem .2rem}
  table.jobs td{border:0;padding:.2rem .7rem}
  table.jobs td[data-l="Updated"],table.jobs td[data-l="Product"]{display:inline-block;width:auto;color:var(--mut)}
  ul.docs li{flex-wrap:wrap}
  .btn{width:100%;text-align:center}
  .btn.small{width:auto}
  .act .btn{justify-self:stretch}
}
/* ---- photo takeoff ---- */
.progress{margin:.4rem 0 .8rem;font-size:1.05rem}
ol.slots{list-style:none;padding:0;margin:0 0 1rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:.7rem}
li.slot{display:flex;gap:.7rem;background:#fff;border:1px solid var(--line);border-left:6px solid #c9d3de;border-radius:10px;padding:.6rem}
li.slot.done{border-left-color:var(--ok)}
.thumb{width:110px;height:82px;flex:none;border-radius:6px;background:#eef2f6;display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--mut);font-size:.8rem}
.thumb img{width:100%;height:100%;object-fit:cover}
.slotbody{min-width:0;display:grid;gap:.25rem}
label.camera{position:relative;overflow:hidden;justify-self:start;display:inline-flex;align-items:center}
label.camera input{position:absolute;inset:0;opacity:0;cursor:pointer;min-height:0}
.busy{display:none;color:var(--warn)}.htmx-request .busy{display:inline}
.tag.ok{background:#dcf2e4;color:var(--ok)}.tag.warn{background:#ffe6c7;color:var(--warn)}
.len{display:flex;gap:.5rem}.len label{flex:1}
.ptgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;margin-bottom:1rem}
.card.pt{margin:0}.card.pt img{width:100%;border-radius:6px;aspect-ratio:4/3;object-fit:cover;display:block;margin-bottom:.4rem}
.corners{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem}.corners img{width:100%;border-radius:6px}.corners a{text-decoration:none}
.marktool{background:#fff;border:1px solid var(--line);border-radius:10px;padding:.6rem;margin-bottom:1rem}
.toolbar{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-bottom:.5rem}
.prompt{font-weight:700;color:var(--a);margin:.2rem 0 .4rem}
.tbtn{font:inherit;font-weight:600;border:2px solid var(--a);background:#fff;color:var(--a);border-radius:99px;padding:.35rem .75rem;min-height:38px;cursor:pointer}
.tbtn.on{background:var(--a);color:#fff}
.canvaswrap{overflow:auto;max-height:78vh;border-radius:6px;background:#ddd;touch-action:pan-x pan-y}
canvas#cv{display:block;cursor:crosshair;touch-action:pan-x pan-y}
.counts{margin-top:.4rem}
@media (max-width:760px){ol.slots{grid-template-columns:1fr}.thumb{width:92px;height:70px}.tbtn{padding:.3rem .6rem;font-size:.9rem}}
/* photo takeoff v2 */
.marktool .repeat{display:inline-flex;align-items:center;gap:.3rem;margin-left:.2rem}
.marktool .repeat select{padding:.25rem .4rem;min-height:2.2rem}
.gablelist label.chk{display:flex;gap:.5rem;align-items:flex-start;margin:.35rem 0}
.gablelist input{width:1.2rem;height:1.2rem;flex:none;margin-top:.1rem}
/* ---- v3: one app ---- */
.counts-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem}
.count{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:10px;padding:.45rem .8rem;text-decoration:none;color:var(--txt);min-width:110px}
.count b{font-size:1.4rem;line-height:1.1}.count span{font-size:.8rem;color:var(--mut)}
.count.s-needs-office-review b{color:var(--warn)}.count.s-error b{color:var(--bad)}.count.s-ready b{color:var(--ok)}
ul.joblist{list-style:none;margin:0;padding:0}ul.joblist li{padding:.5rem 0;border-top:1px solid var(--line)}ul.joblist li:first-child{border-top:0}
ul.joblist a{text-decoration:none}
.methods{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-bottom:.8rem}
.mcard{display:flex;gap:.7rem;align-items:flex-start;border:2px solid var(--line);border-radius:10px;padding:.7rem;font-weight:400;cursor:pointer;background:#fff}
.mcard input{width:1.4rem;height:1.4rem;min-height:0;flex:none;margin-top:.15rem}
.mcard:has(input:checked){border-color:var(--a);background:#eef4fa}
.planup{max-width:520px}
.mtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:.7rem}
.mtile{border:1px solid var(--line);border-left:6px solid #c9d3de;border-radius:10px;padding:.6rem .7rem;display:grid;gap:.35rem;align-content:start}
.mtile.done{border-left-color:var(--ok)}
.mhead{display:flex;align-items:center;gap:.3rem;flex-wrap:wrap}
.mini{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.mini label.file{flex:1 1 100%}
.addm{margin-top:.7rem}.addm summary{cursor:pointer;color:var(--a)}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
table.cmp{border-collapse:collapse;width:100%;font-size:.92rem;background:#fff}
table.cmp caption{text-align:left;font-weight:700;color:var(--a);padding:.2rem 0 .4rem}
table.cmp th,table.cmp td{padding:.4rem .55rem;border-top:1px solid var(--line);text-align:right;vertical-align:top}
table.cmp thead th{background:#eef2f6;font-size:.82rem;border-top:0}
table.cmp tbody th,table.cmp td:first-child{text-align:left;font-weight:600}
table.cmp .hv{background:#e8f0f8;font-weight:700}
table.cmp td.low{background:#fff1d6;color:var(--warn)}
.low-ex{background:#fff1d6;color:var(--warn);padding:0 .3rem;border-radius:4px}
table.lines td{text-align:left}table.lines td.hv{text-align:right}
table.lines select{min-height:38px;padding:.3rem;width:auto}
table.lines tr.off td{opacity:.5}
.mcol .q{display:inline-block;margin:0 .6rem .1rem 0;white-space:nowrap;font-size:.86rem}
.mcol .q.pick{background:#dcf2e4;border-radius:5px;padding:0 .3rem}
.defaults{display:flex;flex-wrap:wrap;gap:1rem;margin:.4rem 0 .7rem}.defaults label{flex:0 1 320px}
.row.wrap{flex-wrap:wrap;margin-top:.8rem}
.grid2.flat{margin-bottom:0}
.warn-t{color:var(--warn);font-weight:600}.ok-t{color:var(--ok);font-weight:600}
.step1{border:3px solid var(--a)}.step1.done{border-color:var(--ok)}
.stepno{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--mut)}
.pill{display:inline-block;border-radius:99px;padding:.05rem .5rem;font-size:.75rem;margin-left:.3rem}
.pill.rec{background:var(--a);color:#fff}
form.skip{margin-top:.7rem}
.stack.three{grid-template-columns:1fr 1fr 1fr;margin:.6rem 0}
table.entry input,table.entry select{min-height:38px;padding:.3rem .4rem;min-width:70px}
table.entry td{text-align:left}
.help ol,.help ul{padding-left:1.3rem}.help li{margin:.25rem 0}
.toc{background:#fff;border:1px solid var(--line);border-radius:10px;padding:.5rem .8rem}
details.danger{border-color:#f0c4c0}details.danger summary{cursor:pointer;color:var(--bad)}
@media (max-width:760px){
  .methods{grid-template-columns:1fr}
  .stack.three{grid-template-columns:1fr 1fr}
  .mtiles{grid-template-columns:1fr}
  table.cmp{font-size:.85rem}
  .defaults label{flex:1 1 100%}
}

.mtile form.mini{display:flex;gap:.4rem;align-items:flex-end;flex-wrap:nowrap}
.mtile form.mini label.file{flex:1 1 auto;min-width:0}
.mtile ul.docs li .btn{white-space:nowrap}
@media (max-width:760px){.mtile form.mini{flex-wrap:wrap}}
table.lines thead th{text-align:left}table.lines thead th.hv{text-align:right}