:root{
  --green:#0f3d2e; --green-2:#165a43; --accent:#1f8a5b;
  --gap:#fff3b0; --gap-border:#e9d36a;
  --line:#e3e6e3; --ink:#1c241f; --muted:#6b766f; --bg:#f4f6f4;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg)}
body{display:flex;flex-direction:column}

.topbar{display:flex;align-items:center;gap:16px;padding:8px 14px;background:var(--green);color:#fff;flex-wrap:wrap}
.brand{font-weight:700;font-size:18px;display:flex;align-items:center;gap:8px}
.brand .logo{font-size:20px}
.brand .sub{font-weight:400;opacity:.7;font-size:13px;border-left:1px solid rgba(255,255,255,.3);padding-left:8px}
.toolbar{display:flex;align-items:center;gap:8px;flex:1;flex-wrap:wrap}
.toolbar .spacer{flex:1}
.toolbar button{background:var(--green-2);color:#fff;border:1px solid rgba(255,255,255,.18);padding:6px 12px;border-radius:7px;cursor:pointer;font-size:13px}
.toolbar button:hover{background:var(--accent)}
.toolbar button.danger{background:#7a2230}
.toolbar button.danger:hover{background:#a12b3d}

.groupbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 8px 0;padding:8px 12px;background:#eef3ef;border:1.5px dashed #b9c8bf;border-radius:8px;min-height:40px;transition:background .1s,border-color .1s}
.groupbar-label{font-size:13px;color:var(--muted);font-weight:600}
.groupbar-chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{background:#fff;color:var(--green);border:1px solid #cdddd3;border-radius:14px;padding:3px 10px;font-size:12px;display:flex;align-items:center;gap:6px}
.chip button{background:none;border:none;color:var(--green);cursor:pointer;font-size:13px;line-height:1;padding:0}
.chip{cursor:grab}
.chip .grip{opacity:.5;cursor:grab}
.chip.chip-over{outline:2px dashed var(--accent);outline-offset:1px}
.group-add{background:var(--green-2);color:#fff;border:none;border-radius:6px;padding:5px 8px;font-size:12px;cursor:pointer}
.groupbar.drophint{border-color:var(--accent);background:#dbefe2;border-style:solid}
/* draggable header grip — drag up into the group bar */
.ghandle{display:inline-block;margin-right:6px;opacity:.6;cursor:grab;font-size:13px;color:#fff}
.ghandle:hover{opacity:1}
.ghandle:active{cursor:grabbing}
/* buildup qty derived from Net Hours (rather than typed) */
.tabulator-cell.derived{color:var(--accent);font-style:italic}

#grid{flex:1;min-height:0;margin:8px}
#grid.hidden{display:none}
.statusbar{padding:4px 14px;font-size:12px;color:var(--muted);background:#fff;border-top:1px solid var(--line)}

/* Grid / Report mode toggle */
.modeseg{display:flex;border:1px solid rgba(255,255,255,.28);border-radius:8px;overflow:hidden}
.modeseg button{background:transparent;color:#cfe6da;border:none;border-radius:0;padding:6px 14px;cursor:pointer;font-weight:600;font-size:13px}
.modeseg button:hover{background:rgba(255,255,255,.12)}
.modeseg button.active{background:#fff;color:var(--green)}
#view-select{background:var(--green-2);color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:7px;padding:6px 8px;font-size:13px;max-width:200px}
.toolbar button.icon{padding:6px 9px}
.g-only.hidden{display:none}

/* Review mode: sheet picker bar + docket photo pane below the grid */
.reviewbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 8px 0;padding:8px 12px;background:#eef3ef;border:1px solid var(--line);border-radius:8px}
.reviewbar.hidden,.r-only.hidden{display:none}
.rb-label{font-size:13px;color:var(--muted);font-weight:700}
.rb-count{font-size:12px;color:var(--muted)}
.reviewbar select{flex:0 1 380px;max-width:60vw;padding:6px 8px;border:1px solid var(--line);border-radius:6px;font-size:13px;background:#fff}
.reviewbar button,.reviewbar .rev-open{background:var(--green-2);color:#fff;border:none;border-radius:6px;padding:6px 11px;font-size:13px;cursor:pointer;text-decoration:none;line-height:1.4}
.reviewbar button:hover,.reviewbar .rev-open:hover{background:var(--accent)}
.review-photo{height:44vh;min-height:200px;margin:8px;background:#11150f;border:1px solid var(--line);border-radius:8px;overflow:auto;display:flex;align-items:center;justify-content:center;position:relative}
.review-photo.hidden{display:none}
.review-photo .rp-empty{color:#8aa093;font-size:14px;padding:20px;text-align:center}
.review-photo img{max-width:100%;max-height:calc(44vh - 18px);display:block;margin:auto;transition:transform .15s ease}
.review-photo img.rot90{transform:rotate(90deg)}
.review-photo img.rot180{transform:rotate(180deg)}
.review-photo img.rot270{transform:rotate(270deg)}
.review-photo img.hidden{display:none}

/* Report / pivot view */
.report{flex:1;min-height:0;overflow:auto;margin:8px;display:flex;flex-direction:column;gap:10px}
.report.hidden{display:none}
.rep-controls{display:flex;gap:22px;flex-wrap:wrap;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.rep-block{display:flex;flex-direction:column;gap:7px}
.rep-label{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.rep-chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center;min-height:26px}
.rep-chips .chip{cursor:default}
.rep-chips .chip .lvl{background:var(--accent);color:#fff;border-radius:50%;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}
.rep-block select{border:1px solid var(--line);border-radius:7px;padding:7px 9px;font-size:13px;background:#fff}
.rep-shared{position:sticky;top:0;z-index:2}
.rep-shared button,.rep-bc button.rep-rmpivot{background:var(--green-2);color:#fff;border:1px solid rgba(0,0,0,.08);padding:7px 12px;border-radius:7px;cursor:pointer;font-size:13px}
.rep-shared button:hover{background:var(--accent)}
.rep-bc{padding:10px 12px;background:#f3f7f4;border-style:dashed}
.rep-bc .rep-rmpivot{background:#7a2230}
.rep-bc .rep-rmpivot:hover{background:#a12b3d}
.rep-pivot{margin-bottom:18px}
.rep-table{overflow:auto;margin-top:8px}
.rep-empty{color:var(--muted);padding:24px;text-align:center}
table.pivot{border-collapse:collapse;font-size:13px;background:#fff;min-width:100%}
table.pivot th,table.pivot td{border:1px solid #e3e6e3;padding:6px 11px;text-align:left;white-space:nowrap}
table.pivot thead th{background:var(--green);color:#fff;position:sticky;top:0;z-index:1}
table.pivot td.num,table.pivot th.num{text-align:right;font-variant-numeric:tabular-nums}
table.pivot td.tot,table.pivot th.tot{font-weight:700;background:#eef6f1}
table.pivot tbody tr:hover td{background:#f6faf7}
table.pivot tr.subtot td{background:#eef3ef;font-weight:600}
table.pivot tr.subtot td.tot{background:#e2ece6}
table.pivot tr.grand td{background:#d7e7dd;font-weight:800;position:sticky;bottom:0}
/* anchored (frozen) row-label columns + fixed-width day columns */
table.pivot td.pfrozen,table.pivot th.pfrozen{position:sticky;z-index:1;background:#fff;box-shadow:inset -1px 0 0 #e3e6e3}
table.pivot thead th.pfrozen{background:var(--green);z-index:3}
table.pivot tr.subtot td.pfrozen{background:#eef3ef}
table.pivot tr.grand td.pfrozen{background:#d7e7dd;z-index:2}
table.pivot tbody tr:hover td.pfrozen{background:#f6faf7}
table.pivot td.pspacer,table.pivot th.pspacer{padding:0}
table.pivot td.pday,table.pivot th.pday{min-width:96px;max-width:96px;width:96px}
table.pivot thead th.pday{text-align:center;white-space:normal;line-height:1.2;vertical-align:middle;padding:5px 6px}
table.pivot th.pday .dh-dow{display:block;font-weight:400;opacity:.85;font-size:11px}
table.pivot th.pday .dh-date{display:block;font-weight:700}

/* yellow gap highlight */
.tabulator-cell.gap{background:var(--gap)!important;box-shadow:inset 0 0 0 1px var(--gap-border)}
/* money + computed columns */
.tabulator-cell.money{font-variant-numeric:tabular-nums;text-align:right}
.tabulator-cell.total{font-weight:700;background:#eef6f1}
.tabulator-cell.inactive{color:#b7bfb9}
.tabulator .tabulator-header{background:var(--green);color:#fff}
.tabulator .tabulator-col{background:var(--green)}
.tabulator .tabulator-col-title{color:#fff}
.tabulator-row.tabulator-group{background:#dfeae3;font-weight:600}
/* verified + locked rows */
.tabulator-row.locked-row{background:#eef3ef}
.tabulator-row.locked-row .tabulator-cell{color:#5d6b62}
.tabulator-row.locked-row .tabulator-cell.gap{background:#eef3ef!important;box-shadow:none}
.tabulator-row.locked-row .tabulator-cell.total{background:#e3eee8}
.sheetlink{color:var(--accent);cursor:default}
.sheetlink.pending{color:#7a8a80;border-bottom:1px dotted #b7c3bb}
.tabulator-cell a{color:#0b62c4;text-decoration:none}
.tabulator-cell a:hover{text-decoration:underline}

/* settings drawer */
.drawer.hidden{display:none}
.drawer{position:fixed;inset:0;z-index:50}
.drawer-scrim{position:absolute;inset:0;background:rgba(0,0,0,.35)}
.drawer-panel{position:absolute;right:0;top:0;bottom:0;width:min(460px,92vw);background:#fff;box-shadow:-4px 0 24px rgba(0,0,0,.2);padding:16px;overflow:auto;z-index:1}
.drawer-head{display:flex;justify-content:space-between;align-items:center}
.drawer-head h2{margin:0}
.icon{background:none;border:none;font-size:18px;cursor:pointer}
.hint{color:var(--muted);font-size:12px;margin:6px 0 12px}
.col-list{display:flex;flex-direction:column;gap:4px}
.col-row{display:grid;grid-template-columns:18px 1fr 70px auto;gap:8px;align-items:center;padding:6px;border:1px solid var(--line);border-radius:7px}
.col-row input[type=text]{width:100%;border:1px solid var(--line);border-radius:5px;padding:4px}
.col-row .rate{width:64px;border:1px solid var(--line);border-radius:5px;padding:4px}
.col-row .del{background:#7a2230;color:#fff;border:none;border-radius:5px;padding:3px 7px;cursor:pointer}
.col-row .del:disabled{background:#ccc;cursor:not-allowed}
.col-row .kindtag{font-size:10px;color:var(--muted);text-transform:uppercase}
.add-col{margin-top:18px;border-top:1px solid var(--line);padding-top:12px}
.add-col-row{display:flex;gap:6px;flex-wrap:wrap}
.add-col-row input,.add-col-row select{border:1px solid var(--line);border-radius:6px;padding:6px}
.add-col-row button{background:var(--accent);color:#fff;border:none;border-radius:6px;padding:6px 12px;cursor:pointer}
.hidden{display:none}

/* header badges + cell-type tints */
.hbadge{display:inline-block;font-size:10px;font-weight:800;margin-right:5px;padding:1px 5px;border-radius:6px;vertical-align:middle}
.hbadge.hcalc{background:#cfe3d6;color:#0f3d2e}
.hbadge.hlist{background:#d4e6f5;color:#13507f}
.tabulator-cell.calccell{background:#f2f7f3}
.tabulator-cell.pending{background:#ffe7bf!important;box-shadow:inset 0 0 0 1px #e3a93f}
/* Excel-style drag fill handle */
.fill-handle{position:fixed;width:12px;height:12px;background:var(--accent);border:1.5px solid #fff;border-radius:2px;cursor:ns-resize;z-index:45;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.fill-handle.hidden{display:none}
.tabulator-cell.fill-prev{box-shadow:inset 0 0 0 2px var(--accent)!important;background:#e3f1e9!important}

/* settings: column cards */
.col-card{border:1px solid var(--line);border-radius:8px;margin-bottom:6px;overflow:hidden}
.cc-head{display:flex;align-items:center;gap:8px;padding:6px 8px}
.cc-head .cc-label{flex:1;min-width:0;border:1px solid var(--line);border-radius:5px;padding:4px}
.cc-head .rate{width:58px;border:1px solid var(--line);border-radius:5px;padding:4px}
.badge2{font-size:10px;font-weight:800;padding:2px 7px;border-radius:10px;text-transform:uppercase;white-space:nowrap}
.b-data{background:#edf0ee;color:#5d6b62}
.b-list{background:#d4e6f5;color:#13507f}
.b-calc{background:#cfe3d6;color:#0f3d2e}
.b-lock,.b-link{background:#eee;color:#777}
.cc-list{background:#fff;border:1px solid var(--accent);color:var(--green);border-radius:6px;padding:3px 8px;font-size:12px;cursor:pointer;white-space:nowrap}
.cc-exp{background:none;border:none;font-size:16px;cursor:pointer;color:var(--muted)}
.col-card.open{border-color:var(--accent);box-shadow:0 1px 6px rgba(31,138,91,.12)}
.cc-action{background:#fff;border:1px solid var(--accent);color:var(--green);border-radius:7px;padding:5px 10px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap}
.cc-action:hover{background:#eef6f1}
.cc-action.ghost{border-color:var(--line);color:var(--muted);font-weight:500}
/* expanded detail = clearly nested sub-panel, indented under its column */
.cc-detail{margin:0 10px 12px 34px;padding:12px 14px;background:#eef4f0;border:1px solid #d3e1d8;border-left:3px solid var(--accent);border-radius:0 10px 10px 0}
.cc-detail.hidden{display:none}
.cc-formula{font-size:13px}
.cc-hint{font-size:11px;color:var(--muted);margin:10px 2px 0;line-height:1.5}
.vpanel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.vpanel-title{font-weight:700;font-size:12px;color:var(--green);text-transform:uppercase;letter-spacing:.03em}
.vpanel-count{font-weight:500;font-size:11px;color:var(--muted);text-transform:none;letter-spacing:0;margin-left:8px}
.vpanel-off{background:none;border:none;color:#b2566a;font-size:11px;cursor:pointer;text-decoration:underline}
.vlist{display:flex;flex-direction:column;gap:6px}
.vrow{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 8px}
.vrow.pendingrow{background:#fff6e8;border-color:#e8c98a}
.vrow.dragging{opacity:.4}
.vgrip{color:#b7c3bb;cursor:grab;font-size:13px;flex:none}
.vgrip:active{cursor:grabbing}
.vval{flex:1;min-width:0;border:1px solid transparent;background:transparent;border-radius:5px;padding:5px 6px;font-size:14px;color:var(--ink)}
.vval:hover{background:#f4f6f4}
.vval:focus{border-color:var(--accent);background:#fff;outline:none}
.pendtag{font-size:10px;font-weight:700;background:#e3a93f;color:#fff;border-radius:8px;padding:1px 7px;white-space:nowrap;flex:none}
.vdel{background:none;border:none;color:#b2566a;cursor:pointer;font-size:14px;opacity:.55;flex:none}
.vdel:hover{opacity:1}
.vpin{background:var(--green-2);color:#fff;border:none;border-radius:6px;padding:3px 9px;cursor:pointer;font-size:11px;flex:none}
.role2{font-size:11px;color:var(--muted);width:64px;flex:none;text-transform:capitalize}
.vadd{display:flex;gap:8px;margin-top:10px}
.vadd input{flex:1;min-width:0;border:1px solid var(--line);border-radius:8px;padding:8px}
.vadd button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:8px 14px;cursor:pointer;font-weight:600;white-space:nowrap}
.pend-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#e3a93f;vertical-align:middle}
/* toggle switch — column visibility, value on/off, driver active */
.sw{position:relative;display:inline-block;width:34px;height:20px;flex:none}
.sw input{opacity:0;width:0;height:0}
.sw .sw-t{position:absolute;inset:0;background:#c8d2cc;border-radius:20px;transition:.15s;cursor:pointer}
.sw .sw-t:before{content:"";position:absolute;width:16px;height:16px;left:2px;top:2px;background:#fff;border-radius:50%;transition:.15s}
.sw input:checked + .sw-t{background:var(--accent)}
.sw input:checked + .sw-t:before{transform:translateX(14px)}

/* formula editor */
.fx{display:flex;flex-direction:column;gap:6px}
.fx-input{width:100%;border:1px solid var(--line);border-radius:6px;padding:8px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;resize:vertical}
.fx-row{display:flex;align-items:center;gap:10px}
.fx-save{background:var(--accent);color:#fff;border:none;border-radius:6px;padding:6px 12px;cursor:pointer}
.fx-msg{font-size:12px}
.fx-help{font-size:11px;color:var(--muted)}
.fx-help code{background:#eef3ef;padding:1px 4px;border-radius:4px}
.fx-fields{display:inline-flex;flex-wrap:wrap;gap:4px}
.fx-chip{background:#eef3ef;border:1px solid #cdddd3;border-radius:10px;padding:1px 7px;font-size:11px;cursor:pointer;font-family:ui-monospace,monospace}
.fx-chip:hover{background:#dbe9e0}

/* point-and-tap formula builder */
.fxb-disp{min-height:44px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:9px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fxb-empty{color:#9aa6a0;font-size:13px}
.fxchip{font-size:13px;padding:3px 9px;border-radius:8px;font-weight:600;white-space:nowrap}
.fxc-field{background:#dceee3;color:#0f3d2e}
.fxc-num{background:#dbe9f6;color:#13507f}
.fxc-op{background:#ece7d6;color:#7a5d1f;font-weight:800}
.fxc-fn{background:#e9ddf2;color:#5b2b86}
.fxc-paren,.fxc-comma{background:#eef0ee;color:#5d6b62}
.fxb-prev{font-size:13px;color:var(--green);margin:8px 2px;min-height:18px}
.fxb-bad{color:#b08328}
.fxb-eg{color:var(--muted);font-weight:400;font-size:11px}
.fxb-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}
.fxb-field{flex:1;min-width:150px;border:1px solid var(--line);border-radius:8px;padding:9px;font-size:14px}
.fxb-ops button,.fxb-fns button{min-width:40px;border:1px solid var(--line);background:#fff;border-radius:8px;padding:9px 11px;cursor:pointer;font-size:14px;font-weight:600}
.fxb-ops button:active,.fxb-fns button:active{background:#eef3ef}
.fxb-num{width:90px;border:1px solid var(--line);border-radius:8px;padding:9px}
.fxb-numadd,.fxb-back,.fxb-clear{border:1px solid var(--line);background:#fff;border-radius:8px;padding:9px 11px;cursor:pointer}
.fxb-sp{flex:1}
.fxb-save{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:9px 18px;cursor:pointer;font-weight:600}