/* Ironwood Remodeling: industrial job-site board. Charcoal rail, concrete paper, hi-vis orange. */
@font-face { font-family:"Barlow Condensed"; src:url("/shared/fonts/barlowcond-700.woff2") format("woff2"); font-weight:700; font-display:swap; }
@font-face { font-family:"Barlow Condensed"; src:url("/shared/fonts/barlowcond-600.woff2") format("woff2"); font-weight:600; font-display:swap; }
@font-face { font-family:"Inter"; src:url("/shared/fonts/inter-var.woff2") format("woff2"); font-weight:100 900; font-display:swap; }
:root {
  --char:#1b1f24; --char2:#262c33; --steel:#3a434d; --conc:#e9e7e1; --card:#fff; --line:#d6d2c8; --ink:#16191d; --muted:#545c66;
  --hv:#f26b1d; --hv-ink:#a8410a; --hv-soft:#fde6d6; --ok:#1d6b45; --ok-bg:#dff1e7; --warn:#7a4a00; --warn-bg:#fff0cc; --blue:#1f4d7a; --blue-bg:#e2edf8;
  --head:"Barlow Condensed","Arial Narrow",sans-serif; --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ai-bg:#f4f6f9; --ai-line:#cdd6e1; --ai-ink:#3c4fa8; --ai-r:4px;
  --m-accent:#1b1f24; --m-on-accent:#fff; --m-line:#d6d2c8; --m-soft:#f1efea; --m-sel:#fde6d6; --m-r:4px; --m-muted:#545c66; --m-ink:#16191d; --m-link:#a8410a;
}
body { font-family:var(--sans); color:var(--ink); background:var(--conc); font-size:15px; line-height:1.45;
  background-image:linear-gradient(rgba(27,31,36,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(27,31,36,.035) 1px,transparent 1px); background-size:24px 24px; }
a { color:var(--hv-ink); }
:focus-visible { outline:3px solid var(--hv); outline-offset:2px; }
.boot { padding:30vh 0; text-align:center; color:var(--muted); }
.muted { color:var(--muted); } .sm { font-size:13.5px; }

/* Shell: left rail on desktop, bottom bar on phones */
.app { display:block; }
.rail { position:fixed; z-index:40; left:0; right:0; bottom:0; display:grid; grid-template-columns:repeat(6,1fr); background:var(--char); border-top:3px solid var(--hv); padding-bottom:env(safe-area-inset-bottom); }
.rail-mark { display:none; }
.rail a { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:62px; color:#b9c1ca; text-decoration:none; font:600 11px/1 var(--sans); letter-spacing:.02em; }
.rail a svg { width:22px; height:22px; }
.rail a[aria-current="page"] { color:#fff; background:var(--char2); box-shadow:inset 0 3px 0 var(--hv); }
.rail a:focus-visible { outline-offset:-3px; }
.nb { position:absolute; top:7px; left:calc(50% + 6px); min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--hv); color:#1b1f24; font:800 11px/18px var(--sans); text-align:center; }
.body { padding-bottom:84px; }
.hdr { background:var(--char); color:#fff; }
.hdr-in { max-width:1240px; margin:0 auto; padding:12px 16px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.logo b { font:700 26px/1 var(--head); text-transform:uppercase; letter-spacing:.04em; }
.logo span { display:block; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:#b9c1ca; margin-top:3px; }
.logo::before { content:""; float:left; width:10px; height:30px; margin-right:10px; background:repeating-linear-gradient(-45deg,var(--hv) 0 6px,#1b1f24 6px 12px); }
.hdr-stats { display:flex; gap:6px 18px; flex-wrap:wrap; margin-left:auto; font-size:13px; color:#b9c1ca; }
.hdr-stats b { color:#fff; font:700 19px/1 var(--head); margin-right:3px; }
.main { max-width:1240px; margin:0 auto; padding:18px 14px 8px; outline:none; }
.foot-wrap { padding:0 14px 20px; }
@media (min-width:900px) {
  .rail { top:44px; right:auto; bottom:0; width:92px; grid-template-columns:1fr; grid-auto-rows:min-content; border-top:0; border-right:3px solid var(--hv); padding-top:8px; }
  .rail-mark { display:grid; place-items:center; height:56px; margin:0 14px 10px; font:700 24px/1 var(--head); color:#1b1f24; background:var(--hv); }
  .rail a { min-height:72px; font-size:12px; }
  .rail a[aria-current="page"] { box-shadow:inset 4px 0 0 var(--hv); }
  .nb { top:10px; }
  .body { margin-left:92px; padding-bottom:10px; }
  .main { padding:24px 28px 8px; }
  .foot-wrap { padding:0 28px 28px; }
  .hdr-in { padding:14px 28px; }
}

/* Headings */
.intro { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.kick { margin:0 0 2px; font:700 13px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--hv-ink); }
.intro h1 { margin:0; font:700 30px/1.02 var(--head); text-transform:uppercase; letter-spacing:.01em; max-width:22ch; }
@media (min-width:900px) { .intro h1 { font-size:38px; max-width:none; } }
.lede { margin:-6px 0 16px; color:var(--muted); max-width:70ch; }

/* Buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 16px; border:2px solid var(--char); background:#fff; color:var(--ink); border-radius:3px; font:700 14px var(--sans); text-decoration:none; }
.btn:hover { background:#f6f4ef; }
.btn.pri { background:var(--hv); border-color:var(--hv); color:#16191d; }
.btn.pri:hover { background:#ff7d2e; }
.btn.ghost { border-style:dashed; background:transparent; }
.pill { display:inline-flex; align-items:center; padding:3px 9px; border-radius:2px; font:700 11.5px/1.2 var(--sans); letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.st-new { background:var(--hv); color:#1b1f24; } .st-quoted { background:var(--blue-bg); color:var(--blue); } .st-scheduled { background:#ece4fb; color:#53358f; } .st-complete { background:var(--ok-bg); color:var(--ok); } .st-paid { background:#e3e5e8; color:#3a434d; }
.flag { display:inline-block; font:700 11px/1.3 var(--sans); padding:2px 6px; border-radius:2px; background:#fbe1dd; color:#9c2a1d; margin-right:6px; text-transform:uppercase; letter-spacing:.04em; }
.flag.m { background:var(--warn-bg); color:var(--warn); }
.card { background:var(--card); border:1px solid var(--line); border-radius:4px; padding:16px; margin-bottom:14px; }
.empty { color:var(--muted); padding:18px; }

/* Requests split */
.filters { display:flex; gap:6px; overflow-x:auto; padding-bottom:8px; margin-bottom:6px; scrollbar-width:none; }
.filters button { flex:none; min-height:36px; padding:0 12px; border:1.5px solid var(--line); background:#fff; border-radius:3px; font-weight:600; font-size:13.5px; }
.filters button span { color:var(--muted); margin-left:3px; }
.filters button[aria-pressed="true"] { background:var(--char); border-color:var(--char); color:#fff; }
.filters button[aria-pressed="true"] span { color:#f9b388; }
.reqs { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.req { display:grid; gap:4px; padding:12px 14px; background:#fff; border:1px solid var(--line); border-left:5px solid var(--line); border-radius:3px; text-decoration:none; color:inherit; }
.req:hover { border-left-color:var(--steel); }
.req.on { border-left-color:var(--hv); box-shadow:0 0 0 1px var(--hv) inset, 0 6px 18px rgba(27,31,36,.08); }
.req-top { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.req-top b { font-size:16px; }
.req-meta { color:var(--muted); font-size:13.5px; }
.req-bot { display:flex; align-items:center; flex-wrap:wrap; }
.req-est { margin-left:auto; font:700 19px/1 var(--head); letter-spacing:.02em; }
.detail { display:none; }
.split.has-detail .req-col { display:none; }
.split.has-detail .detail { display:block; }
.back { display:inline-block; margin-bottom:10px; font-weight:700; }
@media (min-width:1000px) {
  .split { display:grid; grid-template-columns:minmax(300px,380px) minmax(0,1fr); gap:20px; align-items:start; }
  .split .req-col, .split.has-detail .req-col { display:block; position:sticky; top:60px; }
  .split .detail { display:block; background:#fff; border:1px solid var(--line); border-top:5px solid var(--char); border-radius:3px; padding:20px 22px; }
  .back { display:none; }
}
.detail { background:#fff; border:1px solid var(--line); border-radius:3px; padding:16px; }
.d-head { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.d-head h2 { margin:0; font:700 30px/1 var(--head); text-transform:uppercase; }
.d-head p { margin:4px 0 0; color:var(--muted); font-size:14px; }
.facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin:14px 0; }
.facts div { background:#faf9f6; padding:9px 11px; }
.facts dt { font:700 11px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.facts dd { margin:4px 0 0; font-weight:600; }
@media (min-width:640px) { .facts { grid-template-columns:repeat(4,minmax(0,1fr)); } }
.said { margin:0 0 12px; padding:10px 14px; border-left:4px solid var(--hv); background:#faf9f6; font-size:15px; }
.thumbs { display:flex; gap:8px; margin-bottom:14px; align-items:center; }
.thumbs img { width:120px; height:90px; object-fit:cover; border:1px solid var(--line); border-radius:2px; }
.ai { margin-bottom:14px; } .ask { margin-top:8px !important; }
.est-card { border:2px solid var(--char); margin-top:4px; }
.est-h { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.est-h h3 { margin:0; font:700 22px/1 var(--head); text-transform:uppercase; }
.seg { display:inline-flex; border:2px solid var(--char); border-radius:3px; overflow:hidden; }
.seg button { border:0; background:#fff; padding:6px 14px; font-weight:700; font-size:13.5px; min-height:34px; }
.seg button[aria-checked="true"] { background:var(--char); color:#fff; }
.est { width:100%; border-collapse:collapse; font-size:14px; }
.est th { text-align:left; font:700 11px var(--sans); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); padding:6px 4px; border-bottom:2px solid var(--char); }
.est td { padding:8px 4px; border-bottom:1px solid var(--line); vertical-align:top; }
.est td small { display:block; color:var(--muted); font-size:12px; }
.est .num { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.est tfoot th, .est tfoot td { border-bottom:0; padding-top:10px; font-weight:700; font-size:14px; color:var(--ink); text-transform:none; letter-spacing:0; }
.est tr.miss td { background:#fffaf0; }
.qty { width:78px; padding:6px 8px; border:1.5px solid var(--line); border-radius:3px; font-variant-numeric:tabular-nums; }
.qty:focus { border-color:var(--hv); }
.est tr.miss .qty { border-color:#d9a400; border-style:dashed; }
.range { margin-top:12px; padding:12px 14px; background:var(--char); color:#fff; border-radius:3px; display:grid; gap:2px; }
.range span { font:700 11px var(--sans); letter-spacing:.12em; text-transform:uppercase; color:#f9b388; }
.range b { font:700 34px/1.05 var(--head); letter-spacing:.01em; }
.range small { color:#c9d0d7; font-size:12.5px; }
.actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:14px; }
.move { display:inline-flex; align-items:center; gap:6px; margin-left:auto; font-size:13.5px; font-weight:600; }
.move select { min-height:42px; border:2px solid var(--char); border-radius:3px; padding:0 8px; background:#fff; }
@media (max-width:520px) { .move { margin-left:0; } .actions .btn { flex:1 1 100%; } }

/* Sheets */
.lbl { display:block; font-weight:700; margin-bottom:6px; font-size:14px; }
.ta { width:100%; border:1.5px solid var(--line); border-radius:3px; padding:10px 12px; line-height:1.5; }
.fp { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.fp label { display:grid; gap:4px; font-size:13px; font-weight:700; }
.fp .full { grid-column:1/-1; }
.fp input, .fp select, .fp textarea { padding:9px 10px; border:1.5px solid var(--line); border-radius:3px; background:#faf9f6; font-weight:400; }
.drop { border:2px dashed var(--line); padding:18px; text-align:center; color:var(--muted); font-weight:600; }

/* Pipeline board */
.board { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(240px,82%); gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px; }
.col { scroll-snap-align:start; background:#f4f2ed; border:1px solid var(--line); border-top:5px solid var(--steel); border-radius:3px; padding:10px; min-height:220px; }
.col-new { border-top-color:var(--hv); } .col-quoted { border-top-color:var(--blue); } .col-scheduled { border-top-color:#6a48b5; } .col-complete { border-top-color:var(--ok); }
.col header { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:8px; }
.col h2 { margin:0; font:700 20px/1 var(--head); text-transform:uppercase; }
.col header span { font-size:12.5px; color:var(--muted); font-weight:600; }
.kcard { background:#fff; border:1px solid var(--line); border-radius:3px; padding:10px; margin-bottom:8px; }
.kcard a { display:grid; text-decoration:none; color:inherit; }
.kcard a span { font-size:13px; color:var(--muted); }
.kc-bot { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px; margin-top:8px; }
.kv { font:700 16px/1 var(--head); }
.adv { white-space:nowrap; margin-left:auto; border:1.5px solid var(--char); background:#fff; border-radius:3px; font-size:12px; font-weight:700; padding:4px 8px; min-height:30px; }
.adv:hover { background:var(--hv); border-color:var(--hv); }
.done { color:var(--ok); font-weight:700; font-size:13px; }
.col-empty { color:var(--muted); font-size:13px; text-align:center; padding:20px 0; }
@media (min-width:1100px) { .board { grid-auto-flow:row; grid-template-columns:repeat(5,minmax(0,1fr)); overflow:visible; } }

/* Schedule */
.wk-nav { display:flex; gap:6px; }
.wk-nav .btn { min-height:38px; padding:0 12px; white-space:nowrap; }
.legend { display:flex; flex-wrap:wrap; gap:14px; font-size:13px; margin-bottom:10px; color:var(--muted); }
.legend span::before { content:""; display:inline-block; width:12px; height:12px; margin-right:6px; vertical-align:-1px; border-radius:2px; }
.legend .k-job::before { background:var(--hv); } .legend .k-visit::before { background:var(--blue); } .legend .k-check::before { background:var(--ok); }
.week { display:grid; gap:8px; }
.day { background:#fff; border:1px solid var(--line); border-radius:3px; padding:10px; display:grid; gap:6px; align-content:start; }
.day.today { border:2px solid var(--char); }
.day h2 { display:flex; align-items:baseline; gap:8px; margin:0 0 2px; font:700 15px/1 var(--head); text-transform:uppercase; color:var(--muted); }
.day h2 b { font-size:26px; color:var(--ink); }
.day h2 em { font-style:normal; background:var(--hv); color:#1b1f24; padding:2px 6px; font-size:12px; }
.ev { display:grid; gap:2px; padding:8px 10px; border-radius:2px; text-decoration:none; color:var(--ink); border-left:5px solid; font-size:13.5px; }
.ev span { font-size:12px; color:var(--muted); }
.ev.k-job { background:var(--hv-soft); border-color:var(--hv); } .ev.k-visit { background:var(--blue-bg); border-color:var(--blue); } .ev.k-check { background:var(--ok-bg); border-color:var(--ok); }
.free { margin:0; color:#8b929a; font-size:13px; }
@media (min-width:900px) { .week { grid-template-columns:repeat(6,minmax(0,1fr)); } .day { min-height:300px; } }

/* Photos */
.gal { display:grid; gap:16px; }
@media (min-width:760px) { .gal { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.ba-card { margin:0; background:#fff; border:1px solid var(--line); border-radius:3px; overflow:hidden; }
.ba { position:relative; aspect-ratio:4/3; overflow:hidden; background:#ddd; }
.ba img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.ba-before { position:absolute; inset:0 auto 0 0; overflow:hidden; }
.ba-before img { width:auto; height:100%; aspect-ratio:4/3; max-width:none; }
.ba-line { position:absolute; top:0; bottom:0; width:3px; margin-left:-1.5px; background:var(--hv); }
.ba-l, .ba-r { position:absolute; top:10px; padding:3px 8px; background:rgba(27,31,36,.85); color:#fff; font:700 11px var(--sans); letter-spacing:.1em; text-transform:uppercase; }
.ba-l { left:10px; } .ba-r { right:10px; }
.ba-range { width:calc(100% - 24px); margin:10px 12px 0; accent-color:var(--hv); }
.ba-card figcaption { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 14px 14px; flex-wrap:wrap; }
.ba-card figcaption b { display:block; } .ba-card figcaption span { font-size:13px; color:var(--muted); }
.sw { display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:14px; cursor:pointer; }
.sw input { width:20px; height:20px; accent-color:var(--hv-ink); }

/* Rates */
.rates-grid { display:grid; gap:14px; }
@media (min-width:980px) { .rates-grid { grid-template-columns:minmax(0,1fr) 320px; align-items:start; } .side { position:sticky; top:60px; } }
.ch { margin:0 0 6px; font:700 20px/1 var(--head); text-transform:uppercase; }
.rate-row { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid #ece9e2; }
.rate-row:last-child { border-bottom:0; }
.rate-row label { font-weight:600; font-size:14px; }
.rate-row label small { display:block; font-weight:500; font-size:12px; color:var(--hv-ink); }
.money-in { display:flex; align-items:center; gap:4px; flex:none; }
.money-in input { width:92px; padding:7px 8px; border:1.5px solid var(--line); border-radius:3px; text-align:right; font-variant-numeric:tabular-nums; }
.money-in small { font-size:12px; color:var(--muted); min-width:64px; }
.live { background:var(--char); color:#fff; border-color:var(--char); }
.live .muted { color:#c9d0d7; }
.big { font:700 34px/1 var(--head); color:#fff; }

@media (min-width:1000px) { .filters { flex-wrap:wrap; overflow:visible; } }