:root{--dark:#243633;--paper:#f8f6f2;--line:#dedfd9;--text:#22312f;--muted:#677471;--accent:#b7935c;--white:#fff;--red:#bd3949;--orange:#e8ae71;--blue:#8da7c0;--shop:#829c85;--done:#a19eab;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--text);font-size:15px}*{box-sizing:border-box}body{margin:0;background:var(--paper)}button,input,select,textarea{font:inherit}button{cursor:pointer}h1,h2,h3,p{margin-top:0}h1{font:500 clamp(1.8rem,3.2vw,2.65rem)/1.1 Georgia,serif;letter-spacing:-.025em;margin-bottom:9px}h2{font:500 1.4rem Georgia,serif}h3{font-size:1rem;margin:20px 0 13px}p{line-height:1.55}.muted,.subtle{color:var(--muted)}.subtle{margin:0;font-size:.92rem}.eyebrow{font-size:.66rem;font-weight:800;letter-spacing:.16em;color:var(--accent);margin-bottom:8px}.smallprint{font-size:.8rem;margin-top:18px}.hidden{display:none!important}.button{border:1px solid var(--dark);background:var(--dark);color:#fff;min-height:39px;border-radius:7px;padding:9px 16px;font-size:.88rem;font-weight:650;white-space:nowrap}.button:hover{filter:brightness(1.12)}.button:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #c9a96e;outline-offset:2px}.button.primary{background:#a77d48;border-color:#a77d48}.button.secondary{background:transparent;color:var(--dark);border-color:#cbd0cd}.button.slim{padding:7px 12px;min-height:35px;font-size:.78rem}.button.full{width:100%}.icon-button{font-size:2rem;line-height:1;border:0;background:transparent;color:var(--muted)}input,select,textarea{border:1px solid #cad0c9;background:#fff;color:var(--text);border-radius:6px;padding:9px 10px;min-height:39px;width:100%;max-width:100%}textarea{resize:vertical}label{display:flex;flex-direction:column;gap:7px;font-size:.8rem;font-weight:700}code{font-family:ui-monospace,monospace}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--dark);color:#fff;padding:12px clamp(17px,3vw,46px)}.brand{display:flex;align-items:center;gap:14px}.brand strong{font:500 1.37rem Georgia,serif}.brand .eyebrow{margin-bottom:3px;color:#ceb58d}.brand-icon{display:grid;place-items:center;border:2px solid #c4a47a;color:#f4dfbb;border-radius:8px;width:60px;height:60px;font:500 1.35rem Georgia,serif;letter-spacing:-.25em;padding-right:.25em}.brand-icon span{font-style:italic}.brand-icon.small{width:46px;height:46px}.preview-pill{font:750 .56rem ui-sans-serif,system-ui,sans-serif;letter-spacing:.14em;color:#edd4ab;border:1px solid #967952;border-radius:3px;padding:3px 5px;margin-left:4px;vertical-align:middle}.topright{display:flex;align-items:center;gap:17px;font-size:.79rem}.topright .muted{color:#d8e0d9}nav{background:#fff;border-bottom:1px solid var(--line);padding:0 clamp(12px,3vw,46px);display:flex;overflow:auto;gap:24px}nav button{background:none;border:0;border-bottom:3px solid transparent;white-space:nowrap;padding:16px 2px 13px;font-weight:700;font-size:.81rem;color:#53625f}nav button.active{color:#1f3631;border-color:#b18b56}main{max-width:1700px;margin:auto;padding:35px clamp(14px,3vw,46px) 70px}.section-title{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:21px}.section-title h1{margin-bottom:8px}.stats{display:grid;grid-template-columns:repeat(5,minmax(100px,1fr));gap:11px;margin:23px 0}.stat{border:1px solid var(--line);background:#fff;padding:15px 17px;border-radius:9px}.stat .big{font:500 1.75rem Georgia,serif}.stat .small{font-size:.71rem;color:var(--muted);margin-top:3px}.stat.warn{border-color:#e7c3bd}.stat.warn .big{color:var(--red)}.tools{display:flex;flex-wrap:wrap;align-items:end;gap:9px;margin:16px 0 17px}.tools select{max-width:210px;width:auto;min-width:135px}.tools input[type=date]{max-width:180px}.search-box{flex:1;min-width:210px;display:flex;flex-direction:row;align-items:center;gap:7px;border:1px solid #cad0c9;border-radius:6px;background:#fff;padding-left:11px}.search-box span{font-size:1.25rem;color:#7a8580}.search-box input{border:0;outline:0;min-width:0;flex:1}.board-wrap{overflow-x:auto;overscroll-behavior-x:contain}.board{display:grid;grid-template-columns:repeat(4,minmax(240px,1fr));gap:14px;min-width:990px}.lane{background:#eeeee9;min-height:360px;padding:9px;border:1px solid #e1e3dc;border-radius:11px}.lane-head{display:flex;align-items:center;gap:9px;padding:10px 6px 15px;border-bottom:2px solid #c8cdc6;margin-bottom:10px;font-size:.85rem}.lane-head .lane-count{margin-left:auto;color:#788782;font-size:.75rem;background:#fff;border-radius:30px;padding:4px 9px}.lane-dot{width:11px;height:11px;border-radius:3px}.lane.orange .lane-dot{background:var(--orange)}.lane.blue .lane-dot{background:var(--blue)}.lane.workshop .lane-dot{background:var(--shop)}.lane.completion .lane-dot{background:var(--done)}.lane.dragover{outline:2px dashed #a47c47;outline-offset:-6px;background:#ede8db}.card{background:#fff;border:1px solid #e5e5e1;border-left:3px solid #aeb7aa;border-radius:7px;padding:12px 12px 11px;margin-bottom:8px;cursor:pointer;box-shadow:0 1px 2px #22322c09;transition:transform .1s,box-shadow .1s}.card:hover{box-shadow:0 4px 12px #22322c13;transform:translateY(-1px)}.card[draggable=true]{cursor:grab}.card:focus-visible{outline:3px solid #b18b56}.card.late{border-left-color:var(--red)}.card-top{display:flex;justify-content:space-between;gap:7px;align-items:center}.card .order-number{font-size:.7rem;font-weight:800;letter-spacing:.07em;color:#697570}.card .customer{font:500 1.15rem Georgia,serif;margin:8px 0 4px;overflow-wrap:anywhere}.card-meta{display:flex;flex-wrap:wrap;gap:5px 13px;color:#63716b;font-size:.74rem}.card-meta .overdue{color:var(--red);font-weight:800}.chips{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 2px}.chip{border:1px solid #0002;border-radius:4px;padding:3px 6px;font-size:.66rem;font-weight:800;display:inline-flex;gap:5px;align-items:center;background:#f8f8f8}.chip-dot{width:8px;height:8px;display:inline-block;border-radius:2px}.card-footer{display:flex;justify-content:space-between;align-items:center;font-size:.71rem;color:#65716b;margin-top:11px;padding-top:8px;border-top:1px solid #eef0eb}.progress{width:65px;height:5px;border-radius:4px;background:#e5e7e2;overflow:hidden}.progress span{height:100%;display:block;background:#6b917e}.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:9px;background:#fff}table{border-collapse:collapse;width:100%;font-size:.82rem}th,td{text-align:left;padding:11px 12px;border-bottom:1px solid #e5e7e2;vertical-align:middle}th{font-size:.71rem;text-transform:uppercase;letter-spacing:.06em;background:#eef0eb}tr.clickable:hover{background:#f8f6ef;cursor:pointer}tr:last-child td{border-bottom:0}.panel{background:#fff;padding:21px;border:1px solid var(--line);border-radius:9px;margin:18px 0}.panel label{margin-bottom:12px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}.span-all{grid-column:1/-1}.form-grid .button{justify-self:start;align-self:end}.admin-panels{display:grid;grid-template-columns:repeat(3,minmax(230px,1fr));gap:18px}.admin-panels .panel{margin:0}.clock-actions{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}.info-banner{padding:14px;background:#ebf1ed;border-left:3px solid #6f9380;border-radius:5px;margin:20px 0;font-weight:650}#order-dialog{padding:0;width:min(800px,calc(100vw - 24px));max-height:min(92vh,920px);border:0;border-radius:12px;box-shadow:0 18px 100px #10191566;color:var(--text)}#order-dialog::backdrop{background:#17211dc0}.modal-head,.modal-footer{padding:18px 22px;display:flex;justify-content:space-between;align-items:center;gap:14px;border-bottom:1px solid var(--line)}.modal-head h2{margin:0;font-size:1.55rem}.modal-footer{border-top:1px solid var(--line);border-bottom:0;background:#fff}.modal-scroll{padding:16px 22px 25px;overflow:auto;max-height:calc(92vh - 150px)}.flag-choices{display:flex;gap:8px;flex-wrap:wrap}.flag-choice{display:flex;flex-direction:row;align-items:center;gap:7px;border:1px solid #d3d8d0;border-radius:6px;padding:8px 10px;font-size:.79rem;font-weight:700;cursor:pointer}.flag-choice input{min-height:0;width:16px;height:16px;accent-color:#526c61}.piece-heading{display:flex;justify-content:space-between;align-items:center}.piece-item{display:grid;grid-template-columns:1.6fr 1fr 1.6fr auto;gap:7px;align-items:start;border:1px solid #e4e6e0;border-radius:7px;padding:8px;margin:8px 0}.piece-item input,.piece-item select{min-width:0}.piece-item button{align-self:center}.audit-row{font-size:.74rem;color:#60716c;padding:8px 0;border-bottom:1px solid #e8eae5}.error{color:#aa2637;font-size:.83rem}.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(150deg,#21352e,#435a4f)}.login-card{background:#fff;width:min(430px,100%);padding:35px;border-radius:13px;box-shadow:0 20px 90px #0003}.login-card .brand-icon{background:#263a34;margin-bottom:20px}.login-card h1{font-size:2.25rem}.login-card label{margin:19px 0}.login-card .button{margin-top:11px}#toast{position:fixed;bottom:18px;right:18px;z-index:100;background:#263b34;color:#fff;border-radius:8px;padding:12px 19px;max-width:min(420px,90vw);font-size:.86rem;box-shadow:0 8px 35px #0003;display:none}#toast.visible{display:block}.empty{background:#fff;border:1px dashed #b9c1b9;border-radius:8px;padding:20px;color:var(--muted);font-size:.86rem}.danger{color:var(--red)}
@media(max-width:850px){.admin-panels{grid-template-columns:1fr}.stats{grid-template-columns:repeat(3,minmax(90px,1fr))}.topbar{padding:12px 16px}main{padding:24px 14px 70px}.section-title{align-items:start}.form-grid{grid-template-columns:1fr 1fr}.board{grid-template-columns:repeat(4,255px);min-width:1070px}nav{gap:20px}#user-display{display:none}}
@media(max-width:550px){.section-title{flex-direction:column}.stats{grid-template-columns:repeat(2,minmax(100px,1fr))}.stats .stat:last-child{grid-column:1/-1}.tools>*{flex:1}.tools select{max-width:none}.brand-icon.small{display:none}.brand strong{font-size:1.15rem}.topright .button{font-size:.72rem}.form-grid{grid-template-columns:1fr}.piece-item{grid-template-columns:1fr 1fr}.piece-item input:first-child{grid-column:1/-1}.piece-item .piece-note{grid-column:1/-1}.modal-scroll{padding:14px 14px}.modal-head,.modal-footer{padding:15px}.login-card{padding:25px}}

/* v0.2 — production-density pass: information in compact rows, details inside the order */
main {padding-top:16px;max-width:2000px}
.section-title {margin-bottom:6px;align-items:center}
#board-view .section-title h1{font-size:1.5rem;margin:0}
#board-view .section-title .subtle{display:none}
.compact-stats {display:flex;flex-wrap:wrap;gap:5px 18px;margin:9px 0 8px}
.compact-stats>span{font-size:.76rem;color:#51645c}
.compact-stats strong{font-size:.95rem;color:#182e27;margin-right:4px}
#board-view .tools{margin:8px 0;gap:6px}
#board-view .tools select,#board-view .tools input{min-height:34px;padding:6px 8px;font-size:.78rem}
.board {grid-template-columns:repeat(var(--lane-count,4),minmax(245px,1fr));gap:7px;min-width:max(950px, calc(var(--lane-count,4)*245px));}
.lane{padding:4px;border-radius:6px;min-height:300px}
.lane-head{padding:7px 5px;margin-bottom:4px;border-bottom:1px solid #c8cdc6;gap:7px}
.lane .lane-body{height:min(69vh,790px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding-right:2px}
.lane-dot{background:var(--lane-color)}
.card.compact-card {display:grid;grid-template-columns: minmax(48px,.73fr) minmax(60px,1.42fr) 39px 26px 36px;gap:5px;align-items:center;margin:0 0 3px;padding:6px 6px;min-height:35px;border-radius:4px;box-shadow:none;border-left-width:2px}
.compact-card .order-number {font-size:.67rem;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-card .customer{font-family:inherit;font-size:.72rem;font-weight:690;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-card .due,.compact-card .piece-count{font-size:.67rem;color:#64726e;font-variant-numeric:tabular-nums;white-space:nowrap}
.compact-card .due.overdue{color:#b52f37;font-weight:800}
.flag-square {display:inline-block;width:9px;height:9px;border-radius:2px;flex:none;border:1px solid #0002}
.indicator-stack{display:flex;gap:2px;flex-wrap:wrap;justify-content:flex-end;max-width:39px}
.indicator-stack .issue-dot{background:#d4a22d;border:1px solid #8f6a15}
.mobile-stages{display:none}
#order-dialog{width:min(850px,calc(100vw - 14px));max-height:95vh}
#order-dialog .modal-scroll{max-height:calc(95vh - 130px)}
#order-dialog .modal-footer{position:sticky;bottom:0;z-index:2}
#order-dialog h3{font-size:1rem;margin:18px 0 8px}
.indicator-edit{flex:1 1 210px;max-width:100%;border:1px solid #e2e5df;padding:6px;border-radius:7px}
.indicator-edit .flag-choice{border:0;padding:4px;min-height:32px}
.indicator-edit textarea{font-weight:400;font-size:.76rem;margin-top:5px}
.piece-item{display:block;border:1px solid #d9ded7;border-radius:8px;padding:0;margin:7px 0}
.piece-item summary{display:flex;align-items:center;gap:9px;cursor:pointer;min-height:43px;padding:8px 12px;list-style:none;background:#f5f6f2;border-radius:7px;font-size:.82rem}
.piece-item summary::before{content:'▸';font-size:.8rem;color:#65726b}
.piece-item[open] summary::before{content:'▾'}
.piece-pill{font-size:.7rem;background:#e0e9e6;border-radius:4px;padding:3px 6px;white-space:nowrap;margin-left:auto}
.piece-warning{font-size:.68rem;color:#926315;font-weight:700}
.piece-body{padding:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.issue-section{border-top:1px solid #e1e6dc;padding-top:9px}
.issue-row{border:1px solid #e2d9bd;border-left:3px solid #d7a247;background:#fffaf0;padding:10px;margin:7px 0;border-radius:5px}
.issue-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.issue-grid label{min-width:0}
.issue-grid input,.issue-grid select,.piece-body input,.piece-body select,.piece-body textarea{min-height:36px}
#order-notes-panel{border-top:1px solid #dadfd8;margin-top:18px}
.production-note{padding:9px 11px;background:#f5f5f0;border-radius:6px;margin:7px 0;font-size:.82rem}
.production-note p{white-space:pre-wrap;margin:4px 0}
.production-note small{color:#67776e}
.note-compose{display:flex;gap:8px;align-items:end}
.note-compose textarea{flex:1}
.admin-row-title{font-size:.75rem;font-weight:800;color:#66746b}
.stage-row,.indicator-row{border-bottom:1px solid #e1e7e1;padding:12px 0;display:grid;gap:7px}
.inline-fields{display:flex;align-items:end;gap:8px}
.inline-fields label{flex:1}
.inline-fields input[type=checkbox]{width:22px;height:22px;min-height:22px}
.inline-fields input[type=color]{height:37px;padding:3px}
.management-grid{margin-top:18px}
.update-preview{max-height:200px;overflow:auto;font-size:.75rem;overflow-wrap:anywhere}
.update-preview ul{padding-left:19px}.update-actions{display:flex;gap:10px;flex-wrap:wrap;margin:9px 0}
button:disabled{opacity:.45;cursor:not-allowed}
@media(min-width:1200px){#board-view .section-title{margin-bottom:2px}.lane .lane-body{height:calc(100vh - 295px);min-height:340px}}
@media(max-width:850px){.board{grid-template-columns:repeat(var(--lane-count,4),minmax(235px,1fr));min-width:max(950px, calc(var(--lane-count,4)*235px))}.stats{display:flex}}
@media(max-width:650px){
 #board-view .section-title{flex-direction:row;align-items:center}
 #board-view .section-title .eyebrow{display:none}
 #board-view .section-title h1{font-size:1.18rem}
 #new-order{font-size:.75rem;padding:7px 9px}
 #board-view .tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 #board-view .tools>.search-box{grid-column:1/-1;min-width:0}
 .compact-stats{gap:4px 12px}
 .mobile-stages{display:flex;overflow:auto;gap:4px;padding:5px 0 9px}
 .mobile-stages button{background:#fff;border:1px solid #c7cfc8;border-radius:6px;padding:10px 9px;font-size:.7rem;font-weight:750;min-width:fit-content;white-space:nowrap;display:flex;gap:5px;align-items:center}
 .mobile-stages button.active{background:#111111;color:#ffffff;border-color:#111111}
 .mobile-stages button.active .mobile-dot{width:10px;height:10px;flex:0 0 10px;border:1px solid #ffffff8c}
 .mobile-stages small{font-size:.65rem;opacity:.8}
 .mobile-dot{width:7px;height:7px;border-radius:2px}
 .board{display:block;min-width:0}
 .board .lane{display:none;padding:5px}
 .board .lane.mobile-current{display:block;min-height:0}
 .lane .lane-body{height:calc(100dvh - 355px);min-height:270px;overflow-y:auto}
 .compact-card{min-height:45px!important;padding:8px!important;grid-template-columns:minmax(57px,.8fr) minmax(90px,1.5fr) 40px 27px 43px!important}
 .compact-card .customer{font-size:.8rem}
 .compact-card .order-number{font-size:.71rem}
 #order-dialog{width:100vw;max-width:100vw;max-height:100dvh;height:100dvh;border-radius:0;margin:0;position:fixed;inset:0}
 #order-dialog .modal-head{padding:12px 14px}
 #order-dialog .modal-scroll{max-height:calc(100dvh - 120px)}
 #order-dialog .modal-footer{padding:10px 14px}
 .piece-body,.issue-grid{grid-template-columns:1fr}
 .note-compose{flex-direction:column;align-items:stretch}
 .indicator-edit{flex:1 1 100%}
}

.demo-banner{background:#9e6828;color:white;padding:8px 12px;text-align:center;font-size:.75rem;font-weight:700}.demo-banner button{background:#fff;color:#253b32;border:0;border-radius:4px;padding:5px 10px;cursor:pointer;margin-left:12px}


/* Image & Frame Workshop v0.3 - branded, compact visual pass.
   Production stages and all permissions remain authoritative in v0.2. */
:root {
  --dark:#101010;
  --paper:#f8f7f4;
  --line:#dedbd3;
  --text:#1a1a1a;
  --muted:#67645e;
  --accent:#c7952e;
  --red:#b33840;
}
body{background:var(--paper);}
h1,h2{color:#151515;}
.eyebrow{color:#936a22;letter-spacing:.125em;}
.button{border-radius:5px;}
.button.primary{background:#b5842c;border-color:#b5842c;color:#fff;}
.button.primary:hover{background:#976b21;border-color:#976b21;filter:none;}
.button.secondary{border-color:#cfc9bd;background:#fff;color:#222;}
.button.secondary:hover{background:#f9f3e8;filter:none;}
.button:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.card:focus-visible{outline:3px solid #d6a648;outline-offset:2px;}
input,select,textarea,.search-box{border-color:#cfcac1;}
.topbar{background:#111;color:#fff;border-bottom:3px solid #c99a32;padding-top:9px;padding-bottom:9px;min-height:78px;}
.topbar .brand{gap:16px;min-width:0;}
.header-wordmark{display:flex;align-items:center;justify-content:center;background:#fff;border-radius:3px;padding:5px 8px;flex:none;min-width:0;}
.header-wordmark img{display:block;width:185px;height:auto;max-height:55px;object-fit:contain;}
.workshop-brand-title{min-width:0;}
.workshop-brand-title .eyebrow{color:#deb667;font-size:.62rem;letter-spacing:.11em;margin-bottom:2px;}
.workshop-brand-title strong{font-family:inherit;font-weight:750;letter-spacing:.015em;font-size:1.17rem;color:#fff;}
.preview-pill{border-color:#b68731;color:#f5de9f;background:#ffffff10;font-family:inherit;}
.topright .muted{color:#f0ece4;}
.topright .button.secondary{background:transparent;color:#fff;border-color:#786f5e;}
.topright .button.secondary:hover{background:#2b2926;}
nav{background:#fff;box-shadow:0 2px 6px #00000007;gap:23px;}
nav button{color:#5b5751;border-bottom-width:3px;}
nav button.active{color:#171717;border-color:#c5942d;}
main{padding-top:17px;}
.section-title h1{letter-spacing:-.02em;}
#board-view .section-title .eyebrow{margin-bottom:5px;}
#board-view .section-title h1{font-family:inherit;font-size:1.47rem;font-weight:770;letter-spacing:-.025em;}
.compact-stats{gap:5px 17px;margin:11px 0;}
.compact-stats>span{color:#5a5750;font-size:.77rem;}
.compact-stats strong{font-weight:850;color:#201b13;}
.lane{background:#f0eee9;border:1px solid #dedad0;border-radius:7px;}
.lane-head{border-bottom-color:#d4d0c7;color:#292724;font-size:.81rem;padding:8px 6px 10px;}
.lane-head strong{font-weight:800;}
.lane-count{color:#514b41!important;background:#fffcf5!important;font-weight:750;}
.lane-dot{border-radius:2px;}
.card.compact-card{
  grid-template-columns:minmax(48px,.73fr) minmax(62px,1.43fr) 35px 28px 34px;
  gap:4px 5px;
  padding:7px 7px;
  min-height:37px;
  margin:0 0 4px;
  background:#fff;
  border-color:#e3e0d8;
  border-left:3px solid var(--lane-color,#baa471);
  border-radius:5px;
}
.card.compact-card.late{border-left-color:var(--red);}
.compact-card .order-number{font-size:.69rem;color:#544e44;font-weight:800;}
.compact-card .customer{color:#191919;font-size:.75rem;font-weight:770;}
.compact-card .due,.compact-card .piece-count{font-size:.68rem;color:#686258;}
.compact-card .due.overdue{color:#b02e38;}
.compact-card .indicator-stack{max-width:40px;justify-content:flex-end;}
.compact-card .flag-square{width:10px;height:10px;border:1px solid #00000020;border-radius:2px;}
.card.compact-card.has-material-issue{border-bottom-color:#dac28b;}
.material-alert{
  grid-column:1/-1;
  display:flex;
  gap:5px;
  align-items:center;
  width:100%;
  color:#6f4b11;
  background:#fff5db;
  border:1px solid #e8d3a4;
  border-radius:3px;
  font-size:.66rem;
  font-weight:750;
  padding:3px 6px;
  line-height:1.15;
  min-height:19px;
}
.material-alert-icon{
  font-size:.62rem;
  font-weight:900;
  border-radius:50%;
  background:#c7972b;
  color:#fff;
  width:13px;
  height:13px;
  display:inline-grid;
  place-items:center;
}
.material-alert b{
  margin-left:auto;
  min-width:16px;
  padding:1px 3px;
  background:#f0dfb6;
  color:#563b12;
  border-radius:3px;
  text-align:center;
  font-size:.63rem;
}
.piece-warning{color:#7b511a;background:#fff1d0;border-radius:3px;padding:2px 6px;}
.info-banner{background:#f5f0e6;border-left-color:#b98b33;color:#29241b;}
#updater-state{background:#e9f0eb;border-left-color:#56846e;}
.flag-choice input{accent-color:#b78a2c;}
.panel{border-color:#dedbd4;box-shadow:0 1px 3px #00000005;}
.panel h2{font-size:1.34rem;}
.stage-row,.indicator-row{border-bottom-color:#e6e2db;}
.workshop-footer{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:7px 16px;
  margin:27px 0 0;
  padding:15px 2px 0;
  border-top:1px solid #e4dfd7;
  color:#7a7060;
  font-size:.63rem;
  letter-spacing:.085em;
  font-weight:760;
}
.workshop-footer span:first-child{color:#3c3427;letter-spacing:.11em;}
.workshop-footer em{font-style:normal;color:#ab7d23;margin-left:3px;}
.login-shell{background:radial-gradient(circle at 17% 12%,#5b492a 0%,transparent 42%),linear-gradient(138deg,#161616,#38342e);padding:22px;}
.login-card{border-top:5px solid #c79629;box-shadow:0 24px 90px #0006;max-width:470px;padding:31px;}
.login-wordmark{background:#fff;border-radius:4px;padding:1px 0 13px;margin-bottom:11px;border-bottom:1px solid #e7e1d6;}
.login-wordmark img{display:block;width:100%;max-width:400px;max-height:120px;object-fit:contain;margin:auto;}
.login-card .eyebrow{font-size:.65rem;color:#916b2d;}
.login-card h1{font-family:inherit;font-size:1.78rem;font-weight:790;line-height:1.16;}
.login-card p.muted{font-size:.9rem;}
.login-card .button.primary{background:#b5852a;}
#toast{background:#1d1b17;}
@media(max-width:850px){
  .header-wordmark img{width:160px;}
  .topbar{min-height:70px;}
}
@media(max-width:650px){
  .header-wordmark{padding:4px 5px;}
  .header-wordmark img{width:126px;}
  .workshop-brand-title .eyebrow{font-size:.52rem;letter-spacing:.07em;}
  .workshop-brand-title strong{font-size:.94rem;}
  .preview-pill{font-size:.46rem;padding:2px 4px;}
  .topbar .brand{gap:9px;}
  .topbar{padding:9px 10px;}
  #logout{padding:6px 8px;min-height:33px;}
  .compact-card{grid-template-columns:minmax(57px,.8fr) minmax(90px,1.5fr) 40px 27px 42px!important;}
  .compact-card .customer{font-size:.79rem;}
  .material-alert{font-size:.7rem;padding:4px 7px;}
  .workshop-footer{font-size:.59rem;}
  .login-card{padding:25px 22px;}
}
@media(max-width:390px){
 .header-wordmark img{width:106px;}
 .workshop-brand-title .eyebrow{display:none;}
 .topbar .brand{gap:6px;}
 .workshop-brand-title strong{font-size:.87rem;}
 .preview-pill{display:none;}
}
/* v0.4 CSS pending */

/* Workshop v0.4 board: per-column type chips, saved ordering, assignment, preview */
.board{grid-template-columns:repeat(var(--lane-count,4),minmax(230px,1fr));min-width:max(0px,calc(var(--lane-count,4)*244px));gap:9px}
.lane{min-width:0}
.lane-head{margin-bottom:5px}
.lane-type-filters{display:flex;gap:4px;flex-wrap:wrap;align-content:flex-start;padding:1px 3px 8px;min-height:32px}
.lane-type-filters button{display:inline-flex;align-items:center;gap:4px;min-height:22px;font-size:.62rem;font-weight:760;white-space:nowrap;background:#fff;color:#393a37;border:1px solid #cfcac0;border-radius:5px;padding:3px 6px}
.lane-type-filters button.selected{outline:2px solid var(--type-color,var(--lane-color,#687e75));outline-offset:0;background:color-mix(in srgb,var(--type-color,var(--lane-color,#687e75)) 9%,#fff)}
.type-chip-dot{width:8px;height:8px;background:var(--type-color);border-radius:2px;flex:none}
.card.compact-card{display:block!important;padding:0!important;min-height:0;border-left:1px solid #d6d4cb;margin-bottom:5px;overflow:hidden;touch-action:pan-y}
.card.compact-card:hover{transform:none;box-shadow:0 3px 10px #00000018}
.order-type-band{font-size:.64rem;letter-spacing:.025em;line-height:1.35;font-weight:850;color:#fff;text-shadow:0 1px 2px #0009;background:var(--type-color,#596a62);padding:3px 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-content{display:grid;grid-template-columns:minmax(38px,.69fr) minmax(52px,1.5fr) 36px 30px 29px 32px;gap:4px;align-items:center;padding:6px}
.compact-content .order-number,.compact-content .customer,.compact-content .due,.compact-content .piece-count{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compact-content .indicator-stack{justify-content:flex-end;max-width:32px;min-width:0}
.quick-assign{border:0;background:transparent;padding:0;min-height:28px;display:grid;place-items:center;width:28px;cursor:pointer;border-radius:50%}
.employee-badge,.unassigned-badge{width:25px;height:25px;display:grid;place-items:center;border-radius:50%;font-size:.63rem;font-weight:800;background:var(--badge-color,#64777a);color:#fff;text-shadow:0 1px #0005;box-shadow:0 0 0 1px #0002}
.unassigned-badge{background:#eeece8;color:#57524a;text-shadow:none;border:1px dashed #99938a}
.compact-card .material-alert{margin:0 4px 4px;font-size:.66rem;padding:3px 6px;line-height:1.2}
.order-preview[hidden]{display:none!important}
.order-preview{position:fixed;z-index:80;width:min(430px,calc(100vw - 16px));max-height:calc(100dvh - 16px);display:flex;flex-direction:column;background:#fffefb;color:#262620;border:1px solid #b5aa98;border-radius:9px;box-shadow:0 14px 55px #0004;overflow:hidden;font-size:.76rem;line-height:1.4}
.peek-header{background:var(--type-color,#596a62);color:#fff;text-shadow:0 1px #0006;font-weight:800;font-size:.78rem;padding:8px 11px;display:flex;justify-content:space-between;gap:8px;align-items:center;flex:none}
.peek-header button{border:0;color:#fff;background:transparent;font-weight:900;font-size:1.1rem}
.peek-scroll{overflow:auto;padding:11px 12px;overscroll-behavior:contain;min-height:0}
.peek-scroll h3{font-size:1.04rem;font-weight:850;margin:0 0 9px;color:#222}
.peek-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 8px;padding:8px;background:#f7f3eb;border-radius:5px}
.peek-section{border-top:1px solid #e3ded3;margin-top:10px;padding-top:7px}
.peek-section h4{font-size:.71rem;letter-spacing:.05em;margin:0 0 5px;text-transform:uppercase;color:#7a5b25}
.peek-section p{margin:3px 0 5px;white-space:pre-wrap;overflow-wrap:anywhere}
.peek-line{margin:5px 0;overflow-wrap:anywhere}
.peek-line i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px}
.peek-piece{padding:5px 0;border-bottom:1px solid #eeeae0}
.peek-piece small{color:#746d62}
.peek-issue{margin:5px 0;padding:7px;background:#fff0d9;border-left:3px solid #bd8c32}
.peek-issue strong,.peek-issue small{display:block}
.peek-note{margin-bottom:6px}
.peek-actions{flex:none;border-top:1px solid #e3ded3;padding:8px;display:flex;align-items:end;gap:6px;flex-wrap:wrap;background:#faf8f3}
.peek-actions label{flex:1 1 125px;font-size:.68rem;gap:3px;margin:0}
.peek-actions select{min-height:30px;padding:4px 5px}
.peek-actions .button{min-height:31px;padding:5px 8px}
.quick-dialog{border:1px solid #c7bca8;border-radius:10px;box-shadow:0 20px 70px #0006;width:min(370px,calc(100vw - 20px));padding:19px}
.quick-dialog::backdrop{background:#0005}
.quick-dialog h3{margin:0 0 15px}
.quick-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.type-admin-row,.badge-admin-row{border-bottom:1px solid #e9e3d8;padding:10px 0;display:grid;grid-template-columns:1.5fr .8fr .65fr auto auto;gap:8px;align-items:end}
.badge-admin-row{grid-template-columns:1.5fr .8fr .8fr auto}
.type-admin-row label,.badge-admin-row label{font-size:.66rem;margin:0!important}
.type-admin-row input,.badge-admin-row input{min-height:32px;padding:5px}
.type-admin-row [type=checkbox]{width:19px;height:19px;min-height:19px}
.type-admin-row [type=color],.badge-admin-row [type=color]{padding:3px}
.type-add-form{padding-top:10px}
.remove-issue{margin-top:7px}
@media(max-width:850px){.board{min-width:max(0px,calc(var(--lane-count,4)*245px))}}
@media(max-width:650px){
 .board{display:block;min-width:0}
 .compact-content{grid-template-columns:minmax(52px,.65fr) minmax(88px,1.5fr) 41px 32px 31px 32px;gap:4px;padding:7px}
 .card.compact-card{display:block!important;padding:0!important;min-height:0!important}
 .compact-card .customer{font-size:.8rem}
 .type-admin-row,.badge-admin-row{grid-template-columns:1fr 1fr;gap:8px}
 .type-admin-row button,.badge-admin-row button{justify-self:start}
 .order-preview.mobile-preview{left:8px!important;right:8px!important;top:auto!important;bottom:8px!important;width:auto!important;max-height:calc(100dvh - 16px)}
 .peek-scroll{font-size:.81rem}
}


/* Keep all six tile cells legible in narrow desktop lanes and phones. */
@media(min-width:651px){.compact-content{grid-template-columns:minmax(35px,.7fr) minmax(44px,1.45fr) 34px 24px 26px 27px;gap:3px;padding:5px}}
@media(max-width:650px){.compact-content{grid-template-columns:minmax(40px,.7fr) minmax(60px,1.5fr) 37px 23px 28px 29px;gap:4px;padding:7px 5px}}


.touch-ghost{position:fixed!important;pointer-events:none!important;z-index:120;opacity:.93;box-shadow:0 12px 36px #0005!important;transform:none!important;touch-action:none}
.touch-source{opacity:.38}

/* v0.4.1 viewport-bounded preview with internal scrolling */
.order-preview{max-height:calc(100dvh - 16px);min-height:0}
.peek-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
@media(max-height:520px){.peek-actions{max-height:38dvh;overflow-y:auto;flex-shrink:1}}
/* v0.4.1 collapsible independent admin sections */
#admin-view .admin-panels{align-items:start}
.admin-collapsible{min-width:0;align-self:start;background:#fff;border:1px solid #dedbd4;border-radius:7px;box-shadow:0 1px 3px #00000005}
.admin-collapsible>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;padding:15px 17px;font-size:.88rem;font-weight:800;color:#231e16;user-select:none}
.admin-collapsible>summary::-webkit-details-marker{display:none}
.admin-collapsible>summary::after{content:'+';font-size:1.2rem;color:#976b21}
.admin-collapsible[open]>summary::after{content:'-'}
.admin-collapsible>summary:hover{background:#fbf6eb}
.admin-collapsible>summary:focus-visible{outline:3px solid #c7952e;outline-offset:2px}
.admin-collapsible>.panel{margin:0;border:0;border-top:1px solid #e7e1d6;border-radius:0;box-shadow:none}
.admin-collapsible>.panel>h2:first-child{display:none}

/* Image & Frame Workshop v0.5.0: pay-period management and review. */
.payroll-review-panel{margin:10px 0 15px}
.payroll-range{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.payroll-range label{flex:0 1 190px;min-width:135px;margin:0}
.payroll-range label select,.payroll-range label input{min-height:36px}
.payroll-range>button{min-height:36px}
.payroll-status{border-left:3px solid #b28a42;background:#faf4e7;font-size:.78rem;padding:9px 11px;margin:13px 0}
.payroll-totals{display:grid;grid-template-columns:repeat(7,minmax(95px,1fr));gap:7px}
.payroll-total{border:1px solid #e0ded9;background:#fff;padding:10px 9px;border-radius:5px;display:flex;flex-direction:column;gap:5px;min-width:0}
.payroll-total strong{font-size:1.25rem;line-height:1;color:#1c211b;font-variant-numeric:tabular-nums}
.payroll-total span{font-size:.72rem;color:#575b53}
.payroll-total:last-child{border-color:#c1a068;background:#f9f3e6}
.payroll-manager-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px;border-top:1px solid #e8e3d9;padding-top:12px}
.payroll-warning{margin:9px 0 0;padding:11px;border-left:4px solid #bb343e;background:#faeeee;color:#8b2530;font-weight:700}
.payroll-warning[hidden]{display:none}
.payroll-tables{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
.payroll-tables>.panel{margin:0;min-width:0}
.payroll-tables h2,#clock-view h2{font-size:1.15rem;font-family:inherit;font-weight:800;margin-bottom:11px}
.payroll-tables th,.payroll-tables td{padding:8px 9px}
.payroll-tables .table-wrap{max-height:50vh;overflow:auto}
.payroll-row-buttons{display:flex;gap:4px}
.payroll-row-buttons button{min-height:30px;padding:4px 7px}
.payroll-voided{opacity:.65;text-decoration:line-through}
.payroll-leave-notice{margin:12px 0 0;padding:10px;background:#f8f3e5;border:1px solid #e8dbbd;font-size:.76rem}
.payroll-leave-notice ul{padding-left:18px;margin:5px 0}
.payroll-dialog{width:min(430px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow-y:auto}
.payroll-dialog label{margin-top:12px}
.payroll-dialog select,.payroll-dialog input{min-height:37px}
@media(max-width:1100px){.payroll-totals{grid-template-columns:repeat(4,minmax(90px,1fr))}.payroll-tables{grid-template-columns:1fr}}
@media(max-width:650px){.payroll-range{display:grid;grid-template-columns:1fr 1fr}.payroll-range label{min-width:0}.payroll-range>button{grid-column:1/-1}.payroll-totals{grid-template-columns:repeat(2,minmax(95px,1fr))}.payroll-total strong{font-size:1.2rem}.payroll-tables .table-wrap{max-height:none}.payroll-row-buttons{flex-wrap:wrap}}

.payroll-saved-total{font-size:.77rem;margin-top:5px;color:#554b35}
.payroll-history-detail{font-size:.71rem;color:#716655;margin-top:5px}

/* Workshop v0.5.1: unified moveable, expandable manager layout. */
#admin-sort-grid{display:grid;grid-template-columns:repeat(3,minmax(240px,1fr));gap:14px;align-items:start;margin-top:12px}
#admin-sort-grid>.admin-collapsible{min-width:0;align-self:start}
#admin-sort-grid>.admin-collapsible>summary{gap:8px;padding:11px 13px;min-height:52px}
#admin-sort-grid>.admin-collapsible>summary>span:first-child{flex:1}
.admin-order-controls{display:inline-flex;align-items:center;gap:4px;margin-left:auto}
.admin-drag-handle{display:grid;place-items:center;min-width:28px;min-height:31px;border-radius:5px;border:1px solid #d9d2c7;background:#f7f3eb;color:#796a4c;cursor:grab;font-weight:900;letter-spacing:1px;user-select:none}
.admin-drag-handle:active{cursor:grabbing}
.admin-order-button{font-weight:750;min-width:28px;height:31px;border:1px solid #e3d8c8;border-radius:5px;background:#fff;color:#67553b}
.admin-order-button:hover,.admin-drag-handle:hover{background:#f0e6d4}
.admin-collapsible.admin-dragging{opacity:.45}
.admin-collapsible.admin-drop-target{outline:3px dashed #b99559;outline-offset:3px}
#admin-sort-grid .admin-collapsible>.panel{max-height:min(70dvh,690px);overflow-y:auto;overscroll-behavior:contain}
#admin-sort-grid .admin-collapsible[open]>.panel{scrollbar-width:thin}
.admin-backup-inventory{padding:12px;margin:13px 0;border:1px solid #ded7c9;border-radius:7px;background:#faf8f2}
.admin-backup-inventory h3{margin:0 0 5px;font-size:.94rem}
.admin-backup-inventory .muted{font-size:.75rem}
.backup-list{display:flex;flex-direction:column;gap:5px;max-height:210px;overflow:auto}
.backup-row{background:#fff;border:1px solid #e7dfd2;border-radius:5px;font-size:.75rem}
.backup-row summary{cursor:pointer;padding:8px;display:flex;justify-content:space-between;gap:5px;flex-wrap:wrap}
.backup-row summary span{font-weight:650}
.backup-row summary small{color:#746e64}
.backup-row>div,.backup-row>code{display:block;margin:5px 9px;overflow-wrap:anywhere;word-break:break-word}
.backup-row>code{font-size:.7rem;color:#655b52}
.payroll-picker-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.payroll-dialog .payroll-picker-row label{margin:8px 0}
.payroll-total strong{font-variant-numeric:tabular-nums}
@media(max-width:1100px){#admin-sort-grid{grid-template-columns:repeat(2,minmax(240px,1fr))}}
@media(max-width:700px){#admin-sort-grid{grid-template-columns:1fr}#admin-sort-grid .admin-collapsible>.panel{max-height:75dvh}.admin-drag-handle{display:none}}
@media(max-width:410px){.payroll-picker-row{grid-template-columns:1fr}}

/* v0.5.3: three independent top-to-bottom Administration stacks. */
.admin-sort-grid{display:grid;grid-template-columns:repeat(3,minmax(225px,1fr));gap:14px;align-items:start;margin-top:12px}
.admin-sort-column{display:flex;flex-direction:column;gap:12px;min-width:0;min-height:100px;border:1px dashed transparent;border-radius:7px;padding:0 1px 5px}
.admin-sort-column>.admin-collapsible{width:100%;min-width:0;align-self:stretch}
.admin-sort-column.admin-drop-target{border-color:#b58b4e;background:#faf6ed}
.admin-sort-column>.admin-collapsible.admin-drop-target{outline:2px dashed #b58b4e;outline-offset:3px}
.admin-sort-column>.admin-collapsible>summary{display:flex;align-items:center;gap:7px;padding:12px;min-height:53px}
.admin-summary-label{flex:1;min-width:0;overflow-wrap:anywhere}
.admin-sort-column>.admin-collapsible>.panel{margin:0;max-height:min(70dvh,680px);overflow:auto;overscroll-behavior:contain}
.admin-order-controls{display:flex;align-items:center;gap:2px;flex:0 0 auto;margin-left:auto}
.admin-order-button{height:27px;min-width:23px;padding:0 2px;border:1px solid #ddd4c7;background:#fff;color:#5e5038;border-radius:4px;font-size:13px;line-height:1;cursor:pointer}
.admin-order-button:hover,.admin-order-button:focus-visible{background:#f3e7d3}
.admin-drag-handle{min-width:23px;min-height:27px;cursor:grab;display:grid;place-items:center;letter-spacing:1px;background:#f7f3ed;border:1px solid #ddd4c7;border-radius:4px}
.admin-account-row{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:10px 2px;border-bottom:1px solid #ece7df}
.admin-account-row>div{min-width:0;flex:1}
.admin-account-row strong{display:block;font-size:.83rem}
.admin-account-row small{display:block;color:#686259;font-size:.72rem;overflow-wrap:anywhere}
.admin-account-row button{flex:none}
.payroll-print-link{display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap;margin:3px 0}
@media(max-width:1000px){.admin-sort-grid{grid-template-columns:repeat(2,minmax(220px,1fr))}}
@media(max-width:690px){.admin-sort-grid{grid-template-columns:minmax(0,1fr)}.admin-drag-handle{display:none}.admin-order-button{min-width:32px;min-height:31px}}

/* v0.5.4 manager account editor */
.admin-account-row .account-actions{display:flex;flex-wrap:wrap;gap:5px;align-items:center;justify-content:flex-end}
.account-edit-dialog{width:min(470px,calc(100vw - 24px));max-height:calc(100dvh - 22px);overflow:auto}
.account-edit-dialog label{display:block;margin:11px 0}
.account-edit-dialog input,.account-edit-dialog select,.account-edit-dialog textarea{width:100%}
.account-edit-dialog .quick-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}
@media(max-width:520px){.admin-account-row{align-items:flex-start}.admin-account-row .account-actions{justify-content:flex-end}}

/* Image & Frame Workshop v0.5.5 password reset dialog. */
.account-reset-dialog{width:min(450px,calc(100vw - 24px));max-height:calc(100dvh - 20px);overflow:auto}
.account-reset-dialog label{display:block;margin:12px 0}
.account-reset-dialog input,.account-reset-dialog textarea{width:100%}
.account-reset-dialog .quick-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:15px;flex-wrap:wrap}

/* v0.5.6: signed-in identity must be obvious during payroll. */
.clock-self-banner{border-left:4px solid #a47e3d;background:#f8f2e5;color:#302b24;border-radius:5px;padding:12px 14px;font-size:.88rem;font-weight:800;overflow-wrap:anywhere;margin:12px 0 6px}
.clock-review-label{flex:1 1 100%;font-size:.78rem;font-weight:700;color:#4a594f;margin:3px 0 0}
@media(max-width:650px){
 .order-preview.mobile-preview{position:fixed!important;top:max(8px,env(safe-area-inset-top,0px))!important;bottom:max(8px,env(safe-area-inset-bottom,0px))!important;left:8px!important;right:8px!important;width:auto!important;height:auto!important;max-height:none!important;margin:0!important;border-radius:12px!important;display:flex!important;flex-direction:column!important;z-index:110!important;overflow:hidden!important}
 .order-preview.mobile-preview .peek-header{order:0;flex:none;min-height:44px}
 .order-preview.mobile-preview .peek-actions{order:1;flex:0 0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:end;padding:11px;max-height:unset!important;overflow:visible!important;border-bottom:1px solid #d7cfc0;border-top:0}
 .order-preview.mobile-preview .peek-actions label{grid-column:1/-1;width:100%;margin:0}
 .order-preview.mobile-preview .peek-actions select{width:100%;min-width:0;min-height:46px;font-size:16px;padding:8px 10px}
 .order-preview.mobile-preview .peek-actions button{width:100%;white-space:normal;min-height:45px;padding:9px 7px}
 .order-preview.mobile-preview .peek-scroll{order:2;flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-bottom:max(18px,env(safe-area-inset-bottom,0px))}
}


/* v0.5.6: mobile order editor pinned safely inside the visible screen. */
@media(max-width:650px){
 #order-dialog[open]{position:fixed!important;inset:max(8px,env(safe-area-inset-top,0px)) 8px max(8px,env(safe-area-inset-bottom,0px)) 8px!important;margin:auto!important;width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;height:auto!important;max-height:none!important;border-radius:12px!important;padding:0!important;overflow:hidden!important}
 #order-dialog[open]>form{display:flex!important;flex-direction:column!important;height:100%!important;min-height:0!important;max-height:100%!important;overflow:hidden}
 #order-dialog .modal-head{flex:0 0 auto;padding:10px 12px!important}
 #order-dialog .modal-head h2{font-size:1.18rem}
 #order-dialog .modal-scroll{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
 #order-dialog .modal-footer{flex:0 0 auto!important;position:relative!important;padding:9px 12px max(9px,env(safe-area-inset-bottom,0px))!important;gap:8px;min-width:0}
 #order-dialog .modal-footer .button{white-space:normal;min-height:43px}
 #order-dialog .modal-footer #save-status{font-size:.72rem;min-width:0}
}
@media(min-width:651px) and (pointer:coarse){
 .order-preview.mobile-preview{top:12px!important;bottom:12px!important;left:12px!important;right:12px!important;width:auto!important;max-height:none!important}
 .order-preview.mobile-preview .peek-header{order:0}
 .order-preview.mobile-preview .peek-actions{order:1}
 .order-preview.mobile-preview .peek-scroll{order:2;flex:1;min-height:0}
}


.clock-self-banner.test-account{border-left-color:#b43738;background:#fff0ed;color:#7a2225}
@media(max-width:650px){
 #clock-view .clock-actions{gap:7px;margin:12px 0}
 #clock-view .clock-actions .button{flex:1 1 calc(50% - 7px);min-width:0;white-space:normal}
 #clock-view .payroll-range{gap:8px}
}


body.board-dragging .order-preview{
 visibility:hidden!important;opacity:0!important;
 pointer-events:none!important
}
body.board-dragging .card:hover{transform:none;box-shadow:none}
body.board-dragging .lane-body{overscroll-behavior-y:contain}
body.board-dragging #toast{pointer-events:none}
.sync-status{display:inline-flex;align-items:center;gap:5px;font-size:.69rem;
 font-weight:750;color:#d9eadc;white-space:nowrap}
.sync-status:before{content:'';display:inline-block;width:7px;height:7px;
 background:#74ce93;border-radius:50%}
.sync-status.disconnected{color:#f3d4b7}
.sync-status.disconnected:before{background:#e2ad59}
/* v0.5.8 mobile layout normalization - no native date icon collisions. */
@media(max-width:850px){
 .view,.panel,.payroll-review-panel,.payroll-tables,.payroll-tables>section,
 .form-grid,.admin-sort-grid,.admin-sort-column,.tools,.board-wrap{min-width:0;max-width:100%}
 .payroll-tables>.panel{min-width:0}
 .payroll-review-panel{overflow:visible}
 .table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
 .form-grid>label,.piece-body>label,.payroll-picker-row>label,
 .issue-grid>label{min-width:0}
 .form-grid input,.form-grid select,.form-grid textarea,
 .payroll-picker-row input,.payroll-picker-row select{min-width:0}
}
@media(max-width:650px){
 .payroll-range{
  display:flex!important;flex-direction:column!important;
  align-items:stretch!important;gap:11px!important;
  width:100%;min-width:0
 }
 .payroll-range>label,.payroll-range>label#clock-employee-label{
  flex:0 0 auto!important;display:flex;flex-direction:column;
  width:100%!important;min-width:0!important;max-width:100%!important;
  margin:0!important;gap:5px
 }
 .payroll-range>label.hidden{display:none!important}
 .payroll-range input[type=date],.payroll-range select{
  display:block;width:100%!important;max-width:100%!important;
  min-width:0!important;min-height:46px;
  padding:9px 11px!important;font-size:16px!important;
  box-sizing:border-box
 }
 .payroll-range>button{
  flex:none!important;grid-column:auto!important;
  width:100%;min-width:0;min-height:45px
 }
 .payroll-range .clock-review-label{width:100%;min-width:0;margin:0}
 .payroll-review-panel{padding:14px}
 .payroll-manager-actions{display:flex;flex-wrap:wrap;gap:7px}
 .payroll-manager-actions>.button{flex:1 1 150px;min-width:0;white-space:normal;min-height:44px}
 .payroll-picker-row{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
 .payroll-picker-row select,.payroll-picker-row input{min-width:0;max-width:100%;font-size:16px}
 #board-view .tools{grid-template-columns:repeat(2,minmax(0,1fr))}
 #board-view .tools select,#board-view .tools input{min-width:0;width:100%;max-width:100%;font-size:16px}
 .form-grid,.issue-grid{grid-template-columns:minmax(0,1fr)}
 .inline-fields{flex-wrap:wrap;min-width:0}
 .inline-fields>label{flex:1 1 140px;min-width:0}
 .admin-account-row{min-width:0;flex-wrap:wrap}
 .admin-account-row>.account-actions{flex:1 1 auto;justify-content:flex-start}
 .topright{gap:8px}
 .sync-status{font-size:.65rem}
 }
@media(max-width:360px){
 main{padding-left:10px;padding-right:10px}
 .panel{padding:12px}
 .topbar{padding-left:10px;padding-right:10px}
 .brand{gap:6px}
 .sync-status{font-size:.6rem}
}


/* Workshop v0.5.8: never let a floating preview steal drag/drop. */
.board-reordering ~ .order-preview{pointer-events:none!important}
body:has(#board-list.board-reordering) .order-preview{display:none!important;pointer-events:none!important}
.lane-body{scroll-padding-top:10px}
.clock-view .payroll-range{min-width:0}
@media(max-width:760px){
 #clock-view .payroll-range{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;align-items:stretch!important}
 #clock-view .payroll-range label{display:flex!important;flex-direction:column!important;min-width:0!important;width:100%!important;gap:5px!important}
 #clock-view .payroll-range input[type=date]{box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;min-height:46px!important;font-size:16px!important;padding:8px!important}
 #clock-view .payroll-range button{width:100%!important;min-height:44px!important}
 .payroll-picker-row{grid-template-columns:minmax(0,1fr)!important}
}


/* Image & Frame Workshop v0.5.9: staff time is intentionally read only. */
#clock-view.staff-clock .manager-time-only{display:none!important}
#clock-view.staff-clock .manager-only{display:none!important}
#clock-view.staff-clock .section-title .eyebrow{font-size:.7rem}
#staff-clock-content{width:100%;max-width:800px;margin:10px auto 0}
.staff-today-panel{padding:16px 18px;margin-bottom:14px}
.staff-panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.staff-panel-heading h2{margin:0 0 4px;font-size:1.3rem}
.staff-panel-heading p{margin:0}
.staff-current-status{padding:9px 13px;border-radius:7px;background:#e8f0e7;color:#2f5640;font-size:.95rem;font-weight:800}
.staff-event-list{display:flex;flex-direction:column;gap:0}
.staff-event{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 2px;border-bottom:1px solid #e9e4da;font-size:.86rem}
.staff-event:last-child{border-bottom:0}
.staff-event>span{color:#625f56;font-variant-numeric:tabular-nums;text-align:right}
.staff-history-panel{padding:0;margin-bottom:14px;overflow:hidden}
.staff-history-panel>summary{padding:15px 17px;cursor:pointer;font-weight:850;font-size:1rem;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.staff-history-subtitle{font-size:.72rem;font-weight:550;color:#726c60;margin-left:auto}
.staff-history-body{padding:0 17px 15px}
.staff-history-body>.muted{font-size:.8rem}
.staff-day{border-bottom:1px solid #e7e1d5}
.staff-day>summary{padding:12px 4px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.85rem}
.staff-day>summary strong{font-variant-numeric:tabular-nums;white-space:nowrap}
.staff-day-details{padding:0 8px 12px;font-size:.78rem;line-height:1.5;overflow-wrap:anywhere}
.staff-day-details p{margin:5px 0 10px}
.staff-day-details ul{margin:5px 0 9px;padding-left:20px}
.staff-history-navigation{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding-top:15px}
.staff-history-navigation .button{min-height:40px}
.staff-history-navigation #staff-history-range{font-size:.75rem;text-align:center}
@media(max-width:700px){
 #staff-clock-content{width:100%}
 .staff-today-panel{padding:12px;margin-bottom:10px}
 .staff-panel-heading{align-items:stretch;gap:7px}
 .staff-panel-heading>div{width:100%}
 .staff-current-status{width:100%;text-align:center}
 .staff-event{font-size:.8rem;gap:7px}
 .staff-history-body{padding:0 10px 12px}
 .staff-history-panel>summary{padding:13px 11px}
 .staff-history-navigation{display:grid;grid-template-columns:1fr 1fr}
 .staff-history-navigation #staff-history-range{grid-column:1/-1;grid-row:1}
 .staff-history-navigation button{width:100%;min-width:0;font-size:.78rem}
 #clock-view.staff-clock .clock-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:12px 0}
 #clock-view.staff-clock .clock-actions .button{min-height:49px;white-space:normal;padding:10px 7px}
}


/* Image & Frame Workshop v0.6.0: related color through each production lane */
.board .lane{background:color-mix(in srgb,var(--lane-color) 9%,#f8f7f4);border-color:color-mix(in srgb,var(--lane-color) 18%,#dfded7)}
.board .lane-head{background:color-mix(in srgb,var(--lane-color) 16%,#ffffff);border-bottom:2px solid var(--lane-color);border-radius:7px 7px 3px 3px;padding:11px 9px;margin-bottom:7px}
.board .lane-body{background:color-mix(in srgb,var(--lane-color) 4%,#ffffff);border-radius:8px;padding:6px 4px 7px;min-width:0}
.board .lane .card{background:#fff}
.board .lane.dragover{background:color-mix(in srgb,var(--lane-color) 11%,#f8f7f4);outline:1px solid color-mix(in srgb,var(--lane-color) 42%,#d5d7d1);outline-offset:-1px}
.leave-hours-hint{display:block;color:#80704f;font-size:.73rem;font-weight:500;margin-top:3px}
.leave-type-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;border-bottom:1px solid #e7e2da;padding:9px 0}
.leave-type-row strong{flex:1 1 120px;min-width:0;font-size:.86rem;overflow-wrap:anywhere}
.leave-type-row small{font-size:.75rem;color:#6c6257}
.leave-types-add{margin-top:16px;padding-top:12px;border-top:1px solid #ded8cc}
.leave-types-add label{margin-bottom:10px}
.leave-review-note{margin-top:6px;color:#59431e;font-weight:650}
.leave-review-actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
@media(max-width:700px){
 .leave-type-row{align-items:flex-start}
 #leave-form{grid-template-columns:minmax(0,1fr)}
 #leave-form>label{min-width:0}
 #leave-form input[type=date],#leave-form input[type=number],#leave-form select{min-width:0;max-width:100%}
 .board .lane-head{padding:9px 8px}
}


.leave-review-dialog{border:1px solid #d7c8b1;border-radius:12px;padding:20px;width:min(480px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow:auto;color:#27332d;background:#fff;box-shadow:0 20px 80px #0004}
.leave-review-dialog::backdrop{background:#182620ad}
.leave-review-dialog h2{font-size:1.5rem;margin-bottom:10px}
.leave-review-dialog .leave-review-context{display:flex;flex-direction:column;gap:3px;padding:11px 13px;background:#f8f2e9;border-radius:7px;font-size:.85rem;margin-bottom:16px}
.leave-review-dialog .leave-review-context span{font-size:.77rem;color:#605444}
.leave-review-dialog textarea{min-height:100px;resize:vertical}
.leave-review-footer{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:17px}
@media(max-width:650px){
 .leave-review-dialog{padding:17px 13px;max-width:calc(100vw - 16px)}
 .leave-review-footer .button{flex:1;min-width:0;white-space:normal}
 #leave-list th,#leave-list td{padding:9px 8px}
}


/* Workshop v0.6.1 - completion and pickup must not look overdue. */
.stage-due-option{display:flex!important;align-items:center;gap:9px;min-width:0;font-size:.83rem;font-weight:750;color:#4c594c;padding:8px 10px;background:#f4f1e9;border:1px solid #dfd6c5;border-radius:7px}
.stage-due-option input[type=checkbox]{flex:none;width:18px;height:18px;accent-color:#a47d45;margin:0}
.stage-due-option:has(input:disabled){opacity:.75;background:#edeae3}
.compact-card .due.due-closed{background:#ecefe9;color:#566459;border-color:#cad3c9;font-weight:500}
@media(max-width:700px){.stage-row .stage-due-option,#stage-form .stage-due-option{display:flex!important;width:100%;margin:5px 0;padding:11px 10px}.stage-due-option input[type=checkbox]{min-width:20px;min-height:20px}}


/* Image & Frame Workshop v0.6.3 - lifecycle separate from production stages */
.order-admin-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 16px;border-bottom:1px solid #e7e0d5;background:#faf8f4;flex:0 0 auto}
.order-admin-actions .button{min-height:39px;font-size:.77rem}
.order-delete-button{color:#933d3d;background:transparent;border:1px solid #cda8a8}
.order-delete-button:hover,.order-delete-button:focus-visible{background:#fae9e8;border-color:#b16f6f}
.order-remove-dialog{background:#fff;color:#29342d;border:1px solid #e3d9ca;border-radius:12px;width:min(470px,calc(100vw - 20px));max-height:calc(100dvh - 24px);overflow-y:auto;padding:20px;box-shadow:0 24px 80px #0005}
.order-remove-dialog::backdrop{background:#111c15aa}
.order-remove-dialog h2{margin:0 0 8px;font-size:1.3rem}
.order-remove-dialog p{font-size:.85rem;line-height:1.45}
.order-remove-dialog label{display:block;margin-top:12px;font-size:.83rem;font-weight:700}
.order-remove-dialog textarea{margin-top:7px;width:100%;min-height:104px;resize:vertical;font-size:16px}
.order-remove-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:15px;flex-wrap:wrap}
.order-remove-actions .danger{background:#8d3333;color:#fff;border:1px solid #8d3333}
.order-remove-actions .danger:hover{background:#702424}
.deleted-row-reason{font-size:.75rem;line-height:1.35;color:#6d574a;margin-bottom:6px;max-width:220px;overflow-wrap:anywhere}
@media(max-width:650px){
 .order-admin-actions{padding:7px 10px;gap:6px}
 .order-admin-actions .button{flex:1 1 43%;min-width:0;white-space:normal;font-size:.76rem;min-height:44px}
 .order-remove-dialog{padding:15px 12px}
 .order-remove-actions{display:grid;grid-template-columns:1fr 1fr}
 .order-remove-actions .button{white-space:normal;min-height:44px}
 #column-filter{max-width:100%;min-width:0}
}


/* Workshop v0.6.5 mobile swipe and compact toolbar */
#board-view .tools{display:grid;grid-template-columns:minmax(170px,1fr) 160px 90px;gap:6px;align-items:center;position:relative}
#board-view .tools>.search-box{min-width:0;max-width:none}
#board-view .tools>select{min-width:0;width:100%;max-width:none}
#board-view .board-filter-toggle{height:36px;min-height:36px;padding:6px 9px;border:1px solid #aab5ac;border-radius:6px;background:#fff;color:#263c32;font-size:.78rem;font-weight:750;white-space:nowrap}
#board-view .board-filter-toggle.has-active{border-color:#405c4a;background:#edf3ed}
#board-view .board-extra-filters{display:none;position:absolute;right:0;top:calc(100% + 4px);z-index:40;width:min(410px,calc(100vw - 28px));padding:11px;background:white;border:1px solid #d3dcd3;border-radius:9px;box-shadow:0 12px 32px #14251d29;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#board-view .board-extra-filters.open{display:grid}
#board-view .board-extra-filters select{width:100%;max-width:100%;min-width:0;min-height:38px;padding:6px;font-size:.81rem}
.mobile-lane-progress{display:none}
@media(max-width:650px){
 #board-view .tools{display:grid!important;grid-template-columns:minmax(0,1fr) 94px 79px!important;gap:5px;align-items:center}
 #board-view .tools>.search-box{grid-column:auto!important;min-width:0;width:100%;max-width:none}
 #board-view .tools #due-filter{min-width:0;max-width:100%;font-size:.72rem!important;padding:6px 2px!important}
 #board-view .board-filter-toggle{min-width:0;padding:5px 3px;font-size:.72rem}
 #board-view .board-extra-filters{width:min(410px,calc(100vw - 28px))}
 #board-view .compact-stats{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;scrollbar-width:none;white-space:nowrap;padding-bottom:2px}
 #board-view .compact-stats::-webkit-scrollbar{display:none}
 #board-view .board-wrap{width:100%;max-width:100%;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none}
 #board-view .board-wrap::-webkit-scrollbar{display:none}
 #board-view .board{display:flex!important;width:100%!important;min-width:0!important;gap:0!important}
 #board-view .board .lane,#board-view .board .lane.mobile-current{display:block!important;flex:0 0 100%;width:100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always;padding:5px;min-height:0}
 #board-view .card.compact-card{touch-action:auto}
 #board-view .mobile-lane-progress{display:inline-block;font-size:.64rem;color:#65756d;white-space:nowrap;padding-right:4px}
 #board-view .lane .lane-body{height:calc(100dvh - 310px);min-height:245px}
}


/* Workshop v0.6.6 — compact clear filters; consistent drag target across web/app. */
#board-view .tools.filters-active{grid-template-columns:minmax(170px,1fr) 160px 90px 48px}
#board-view .board-clear-filters{min-width:0;min-height:34px;height:36px;padding:5px 4px;border:1px solid #aab5ac;border-radius:6px;background:#fff;color:#35483d;font-size:.74rem;font-weight:750}
#board-view .board-clear-filters:hover{background:#eff4ef}
#board-view .board-clear-filters[hidden]{display:none!important}
.board .lane{position:relative}
.board .board-insert-line{position:absolute;z-index:7;left:11px;right:11px;height:2px;border-radius:2px;pointer-events:none;background:color-mix(in srgb,var(--lane-color) 76%,#526b60);box-shadow:0 0 0 1px #ffffffbb}
.board .board-insert-line::before{content:"";position:absolute;left:0;top:-2px;width:6px;height:6px;border-radius:50%;background:inherit}
.touch-edge-hint{position:fixed;top:46%;z-index:130;pointer-events:none;opacity:.92;background:#fcfdfceb;border:1px solid #aabbb0;border-radius:7px;padding:9px 6px;max-width:128px;color:#304b3a;writing-mode:vertical-rl;font-size:.68rem;font-weight:750;box-shadow:0 2px 9px #00000018}
.touch-edge-hint.left{left:max(4px,env(safe-area-inset-left,0px));transform:rotate(180deg)}
.touch-edge-hint.right{right:max(4px,env(safe-area-inset-right,0px))}
@media(max-width:650px){
 #board-view .tools.filters-active{grid-template-columns:minmax(0,1fr) 77px 64px 41px!important;gap:4px!important}
 #board-view .board-clear-filters{font-size:.67rem;padding:5px 2px}
 #board-view .board-wrap.board-reordering{scroll-snap-type:none!important;scroll-behavior:auto!important}
}

/* Per-column completion gate, v0.6.7 */
.stage-piece-option{border-color:#cbd8d0;background:#f2f6f2;color:#314b3b}.stage-piece-option input[type=checkbox]{accent-color:#345e48}

/* v0.6.8 pickup lifecycle, desktop/mobile/PWA */
.pickup-readonly{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#edf3ef;border-bottom:1px solid #cdd9ce;padding:10px 15px}
.pickup-readonly.hidden{display:none}
.pickup-readonly>span{display:flex;flex-direction:column;gap:2px;font-size:.84rem;color:#294636}
.pickup-readonly small{font-size:.72rem;color:#586d60}
.pickup-locked .modal-scroll{background:#fafbf9}
.pickup-locked .modal-scroll :disabled{opacity:.85;cursor:default}
.pickup-history-link{border:1px solid #ccd8ce;color:#395646;background:#fff;border-radius:6px;padding:5px 7px;font-size:.67rem;font-weight:700;white-space:nowrap}
.pickup-history-panel{background:#fff;border:1px solid #deded6;border-radius:9px;padding:12px;max-width:100%;overflow:hidden}
.pickup-history-title{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 3px 15px}
.pickup-history-title h2{margin:0;font-size:1.19rem}
.pickup-history-title p{font-size:.76rem;color:#64736a;margin:3px 0 0}
.pickup-history-title>span{white-space:nowrap;color:#54695a;font-weight:700;font-size:.79rem}
.pickup-pagination{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:13px 2px 0;font-size:.78rem;color:#64736a}
.pickup-history-panel .table-wrap{overflow-x:auto;max-width:100%}
.pickup-history-panel td,.pickup-history-panel th{font-size:.78rem}
@media(max-width:650px){
 .pickup-readonly{padding:9px 11px;gap:7px}
 .pickup-readonly .button{font-size:.71rem;white-space:normal;flex:none;max-width:145px}
 .pickup-history-panel{padding:8px 5px}
 .pickup-history-title{padding:7px 6px 10px}
 .pickup-history-title p{max-width:225px}
 .pickup-history-panel .table-wrap{width:100%}
 .pickup-pagination{font-size:.72rem}
 .pickup-history-link{padding:4px 5px;font-size:.66rem}
}


/* v0.6.9 — unmistakable way out of Picked Up History on desktop and mobile */
.pickup-history-back{display:inline-flex;align-items:center;justify-content:center;min-height:39px;margin:0 0 12px;padding:8px 11px;border-radius:7px;border:1px solid #a4b7a9;background:#edf3ee;color:#294837;font-size:.79rem;font-weight:750;cursor:pointer}
.pickup-history-back:hover,.pickup-history-back:focus-visible{background:#e0ebe2;outline-offset:2px}
@media(max-width:650px){.pickup-history-back{min-height:44px;font-size:.79rem;padding:9px 10px;margin-bottom:11px}}

/* Image & Frame Workshop v0.7.0: private paper-order scan, within New Work Order. */
.scan-paper-workorder{border-top:1px solid #d5e0d6;border-bottom:1px solid #d5e0d6;background:#f4f7f3;padding:12px 15px}
.scan-paper-workorder.hidden,.scan-processing.hidden,.scan-review.hidden{display:none!important}
.scan-entry{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.scan-entry>.button{min-height:42px}
.scan-entry>span{font-size:.7rem;color:#617668;flex:1 1 170px}
.scan-processing{font-size:.82rem;color:#2d5741;margin:10px 0 2px;line-height:1.5}
.scan-review{border:1px solid #b6cabd;background:#fff;border-radius:9px;margin-top:10px;padding:12px}
.scan-review h3{margin:0 0 3px;font-size:1rem}
.scan-explanation{font-size:.75rem;color:#53675a;margin:0 0 10px}
.scan-review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.scan-review-grid label{display:flex;flex-direction:column;gap:4px;font-size:.73rem;font-weight:650;color:#3b5143;min-width:0}
.scan-review-grid input{height:40px;min-width:0;max-width:100%;padding:6px 8px;border:1px solid #bac9be;border-radius:6px;background:#fff;font-size:16px}
.scan-review-notice{font-size:.76rem;color:#765121;margin:8px 0}
.scan-raw-details{font-size:.7rem;margin:7px 0}
.scan-raw-details pre{white-space:pre-wrap;max-height:130px;overflow:auto;font-size:.67rem;color:#59685e}
.scan-review-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}
@media(max-width:650px){.scan-paper-workorder{padding:10px 11px}.scan-entry>.button{min-height:44px}.scan-review-grid{grid-template-columns:1fr 1fr;gap:7px}.scan-review{padding:9px}.scan-review-actions .button{min-height:44px}}

.paper-work-date{display:block;color:#597363;font-size:.61rem;font-weight:600;margin-top:1px;white-space:nowrap}

/* v0.7.1 — AI scanner connection controls; manager view only */
#vision-admin-panel{display:flex;flex-direction:column;gap:8px}
#vision-admin-panel h2{margin-bottom:0}
#vision-admin-status{margin:5px 0;font-size:.81rem;font-weight:650;color:#395847}
#vision-admin-status.error{color:#9b3940}
#vision-admin-form{display:flex;align-items:flex-end;gap:9px;flex-wrap:wrap}
#vision-admin-form label{display:flex;flex:1 1 210px;min-width:180px;flex-direction:column;gap:5px}
#vision-admin-key{height:42px;max-width:100%}
#vision-admin-form button{min-height:42px}
@media(max-width:650px){#vision-admin-form{flex-direction:column;align-items:stretch}#vision-admin-form label{flex:unset;width:100%}#vision-admin-form button{min-height:44px}}

#paper-date-label{display:none!important}

/* v0.7.5 — persistent scanner operation message */
.scan-review-notice{min-height:1.5em;font-weight:600;line-height:1.5}


/* v0.7.7 — iPhone Safari must not magnify editor fields below 16px.
   Keep phone editing usable without blocking normal pinch zoom. */
@media (max-width:650px) {
  #order-dialog input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
  #order-dialog select,
  #order-dialog textarea {
    font-size:16px!important;
    line-height:1.35;
  }
  #order-dialog .modal-footer {
    z-index:6!important;
    background:#fff;
  }
  #order-dialog .modal-footer button[type="submit"]{
    min-height:46px;
  }
  /* When the virtual keyboard takes part of Safari's visual viewport,
     keep the whole modal, including Save, inside the remaining screen. */
  #order-dialog[open].ifws-keyboard-visible{
    top:var(--ifws-editor-vv-top,8px)!important;
    bottom:auto!important;
    height:var(--ifws-editor-vv-height,calc(100dvh - 16px))!important;
    max-height:var(--ifws-editor-vv-height,calc(100dvh - 16px))!important;
    margin:0!important;
  }
}


/* v0.7.8 — per-column due-date display; original drag positions are never rewritten. */
.board .lane-head .lane-sort{display:inline-flex;flex-direction:row;align-items:center;gap:4px;margin:0 0 0 auto;min-width:0;font-size:.68rem;white-space:nowrap;color:#425649;font-weight:700}
.board .lane-head .lane-sort select{appearance:auto;width:auto;min-width:0;max-width:113px;min-height:31px;padding:4px 5px;font-size:.78rem;font-weight:650;background:#fff;color:#304435;border:1px solid #aab9ad;border-radius:6px;flex:none}
@media(max-width:650px){
 .board .lane-head{gap:5px;flex-wrap:nowrap}
 .board .lane-head .lane-sort span{display:none}
 .board .lane-head .lane-sort select{font-size:16px;max-width:119px;min-height:37px;padding:5px 4px}
 .board .lane-head .mobile-lane-progress{flex:none}
}
/* All touch devices: prevent the editor sliding laterally; retain vertical pan and pinch. */
@media(hover:none) and (pointer:coarse){
 html:has(#order-dialog[open]),body:has(#order-dialog[open]){overflow-x:clip;overscroll-behavior-x:none}
 #order-dialog[open],#order-dialog[open]>form,#order-dialog .modal-scroll{
  overflow-x:hidden!important;overscroll-behavior-x:none!important;max-width:100%;
  touch-action:pan-y pinch-zoom;
 }
 #order-dialog[open] .form-grid,#order-dialog[open] .form-grid>label,
 #order-dialog[open] .piece-body,#order-dialog[open] .issue-grid{
  min-width:0;max-width:100%;overflow-wrap:anywhere;
 }
}


/* v0.7.9 — compact PWA install help and optional on-device email reminder. */
.login-card .login-remember-email{
 display:flex;flex-direction:row;align-items:center;gap:9px;
 margin:6px 0 9px;font-size:.8rem;font-weight:600;color:#40564a;
}
.login-card .login-remember-email input[type=checkbox]{
 flex:none;width:17px;height:17px;min-height:17px;margin:0;
 accent-color:#416b55;
}
.login-install{margin-top:14px;padding-top:12px;border-top:1px solid #e6e8e3;
 color:#4a5e51;font-size:.77rem;line-height:1.45}
.login-install strong{display:block;margin-bottom:5px;color:#2e4537;font-size:.81rem}
.login-install p{margin:3px 0;line-height:1.45;overflow-wrap:anywhere}
.login-install b{font-weight:750}
.login-install small{display:block;margin-top:8px;font-size:.74rem;color:#68796c}
@media(max-width:650px){
 #login-email,#login-password{font-size:16px;min-height:44px}
 .login-card{padding:clamp(18px,5vw,31px)}
 .login-shell{padding:13px}
}


/* v0.7.12: restored successful piece editor and preview treatment */
/* Each real piece has a visible beginning and a contained editing area. */
#order-dialog #pieces-list{counter-reset:ifw-piece}
#order-dialog .piece-item{
 counter-increment:ifw-piece;margin:10px 0;
 background:#fffefb;border:1px solid #cedbd0;border-radius:9px;
 overflow:hidden;box-shadow:0 1px 3px #22362b0c;
}
#order-dialog .piece-item:nth-child(even){
 background:#fbfaf6;border-color:#d5ddd5;
}
#order-dialog .piece-item>summary{
 display:flex;align-items:center;flex-wrap:wrap;gap:8px;
 padding:10px 12px;min-height:55px;list-style:none;
 background:#f2f6f2;color:#293c31;
 border-left:3px solid #c0d0c3;
}
#order-dialog .piece-item:nth-child(even)>summary{
 background:#f7f5ef;border-left-color:#d1d7cc;
}
#order-dialog .piece-item>summary::-webkit-details-marker{display:none}
#order-dialog .piece-item>summary::before{
 content:'▸';color:#587060;line-height:1;flex:none;font-size:.88rem;
}
#order-dialog .piece-item[open]>summary::before{content:'▾'}
#order-dialog .piece-item>summary>strong{
 display:flex;align-items:center;gap:9px;flex:1 1 145px;min-width:0;
 color:#2b4034;font-size:.92rem;font-weight:790;line-height:1.25;
 overflow-wrap:anywhere;
}
#order-dialog .piece-item>summary>strong::before{
 content:counter(ifw-piece,decimal-leading-zero);
 display:inline-grid;place-items:center;flex:none;
 width:28px;height:28px;border:1px solid #d5ded5;
 border-radius:6px;background:#fff;
 color:#465e4f;font-size:.74rem;font-weight:850;
 font-variant-numeric:tabular-nums;
}
#order-dialog .piece-item .piece-pill{
 margin:0;padding:6px 9px;min-width:0;max-width:100%;
 border:1px solid #d6e1d7;border-radius:6px;
 background:#fffefc;color:#385544;
 font-size:.76rem;font-weight:760;line-height:1.2;
 white-space:normal;overflow-wrap:anywhere;
}
#order-dialog .piece-item .piece-warning{
 margin-left:0;font-size:.7rem;white-space:nowrap;
 border:1px solid #ead8b2;
}
#order-dialog .piece-item[open]>summary{
 border-bottom:1px solid #dce5dd;
}
#order-dialog .piece-item .piece-body{
 background:transparent;padding:12px;gap:11px;
}
#order-dialog .piece-item .piece-body label{
 font-size:.79rem;font-weight:720;color:#405447;
}
#order-dialog .piece-item .issue-section{
 border-top:1px solid #e0e7e0;margin-top:3px;padding-top:11px;
}

/* Preview: each piece gets its own identifiable, gently tinted row. */
.order-preview .peek-section:has(.peek-piece){counter-reset:ifw-peek-piece}
.order-preview .peek-piece{
 counter-increment:ifw-peek-piece;
 display:flex;align-items:flex-start;gap:9px;
 padding:9px 10px;margin:6px 0;border:1px solid #dce5dc;
 border-radius:7px;background:#f5f8f5;
}
.order-preview .peek-piece:nth-of-type(even){
 border-color:#e4e1da;background:#faf8f2;
}
.order-preview .peek-piece::before{
 content:counter(ifw-peek-piece,decimal-leading-zero);
 display:inline-grid;place-items:center;flex:none;
 width:25px;height:25px;border:1px solid #d6e0d7;
 border-radius:5px;background:#fff;
 color:#40594a;font-size:.7rem;font-weight:850;
 font-variant-numeric:tabular-nums;
}
.order-preview .peek-piece>b{
 color:#293e32;font-size:.8rem;font-weight:800;
 overflow-wrap:anywhere;flex:1 1 45%;
}
.order-preview .peek-piece>small{
 display:inline-block;max-width:100%;
 border:1px solid #d7e2d7;border-radius:5px;
 background:#fff;color:#4d6756;
 font-weight:740;font-size:.73rem;line-height:1.2;
 padding:5px 7px;overflow-wrap:anywhere;
}
.order-preview .peek-piece>p{flex-basis:100%}
@media(max-width:650px){
 #order-dialog .piece-item{margin:9px 0}
 #order-dialog .piece-item>summary{padding:9px 10px;gap:6px}
 #order-dialog .piece-item>summary>strong{flex-basis:125px}
 #order-dialog .piece-item .piece-body{padding:10px}
 #board-view .compact-card .piece-count{font-size:.76rem;min-height:25px}
 .order-preview .peek-piece{flex-wrap:wrap;gap:7px}
 .order-preview .peek-piece>b{flex-basis:calc(100% - 40px)}
 .order-preview .peek-piece>small{margin-left:34px}
}



/* v0.7.10 visual QA: preview pieces stack name, stage and notes cleanly. */
.order-preview .peek-piece{
 display:grid;
 grid-template-columns:25px minmax(0,1fr);
 grid-template-rows:repeat(3,auto);
 align-items:start;column-gap:9px;row-gap:4px;
}
.order-preview .peek-piece::before{grid-column:1;grid-row:1/span 3}
.order-preview .peek-piece>b{
 display:block;grid-column:2;grid-row:1;
 min-width:0;font-size:.82rem;line-height:1.3;
 overflow-wrap:anywhere;white-space:normal;
}
.order-preview .peek-piece>small{
 display:inline-block;grid-column:2;grid-row:2;
 min-width:0;justify-self:start;
 max-width:100%;width:fit-content;
 white-space:normal;overflow-wrap:anywhere;
}
.order-preview .peek-piece>p{
 grid-column:2;grid-row:3;
 min-width:0;flex-basis:auto;
 font-size:.75rem;line-height:1.4;
 white-space:pre-wrap;overflow-wrap:anywhere;margin:0;
}
@media(max-width:650px){
 .order-preview .peek-piece{display:grid;grid-template-columns:25px minmax(0,1fr);gap:4px 9px}
 .order-preview .peek-piece>b{grid-column:2;grid-row:1}
 .order-preview .peek-piece>small{grid-column:2;grid-row:2;margin:0}
}


/* v0.7.12 -- polished closed tiles: a single aligned data row,
   with text-labeled micro-indicators underneath only when needed.
   NO manager-owned stage, type, flag or employee colors are overridden. */
#board-view .card.compact-card{
 margin-bottom:6px;border-radius:6px;border:1px solid #dbe0d9;
 box-shadow:0 1px 2px #23342b0a;
 overflow:hidden;
}
#board-view .card.compact-card .compact-content{
 display:grid;
 grid-template-columns:minmax(46px,auto) minmax(55px,1fr) 39px 36px 36px;
 grid-template-rows:auto;
 align-items:center;
 column-gap:6px;
 min-height:43px;
 padding:7px 8px;
 background:#fffefa;
}
#board-view .compact-card .order-number{
 grid-column:1;grid-row:1;
 min-width:0;white-space:nowrap;
 font-size:.72rem;font-weight:850;color:#293b31;
}
#board-view .compact-card .customer{
 grid-column:2;grid-row:1;
 display:-webkit-box;-webkit-box-orient:vertical;
 -webkit-line-clamp:2;
 min-width:0;max-height:2.55em;
 overflow:hidden;text-overflow:ellipsis;
 white-space:normal!important;overflow-wrap:anywhere;
 line-height:1.24;font-size:.77rem;font-weight:770;color:#23372c;
}
#board-view .compact-card .due{
 grid-column:3;grid-row:1;
 display:inline-flex;align-items:center;justify-content:center;
 min-height:22px;max-width:100%;padding:3px 2px;
 border-radius:4px;border:1px solid #e5dfd2;
 background:#faf7f0;color:#5d5546;
 font-size:.66rem;font-weight:730;white-space:nowrap;
 font-variant-numeric:tabular-nums;
}
#board-view .compact-card .due.overdue{
 color:#a72b37;background:#faeceb;border-color:#e5bab9;font-weight:850;
}
#board-view .compact-card .due.due-closed{
 color:#5c6b61;background:#edf2ed;border-color:#d5dfd5;
}
#board-view .compact-card .piece-count{
 grid-column:4;grid-row:1;
 display:inline-flex;align-items:center;justify-content:center;
 min-height:22px;padding:3px 2px;min-width:0;
 border:1px solid #d7e1d8;border-radius:4px;
 background:#eef3ef;color:#315342;
 font-size:.73rem;font-weight:850;font-variant-numeric:tabular-nums;
 white-space:nowrap;
}
#board-view .compact-card .quick-assign{
 grid-column:5;grid-row:1;
 display:grid;place-items:center;
 min-width:36px;width:36px;min-height:36px;height:36px;
 margin:0;
}
#board-view .compact-card .quick-assign .employee-badge,
#board-view .compact-card .quick-assign .unassigned-badge{
 flex:none;width:27px;height:27px;font-size:.65rem;
}
/* Indicators are below the row -- never squeezed between employee and customer. */
#board-view .tile-indicators{
 display:flex;flex-wrap:wrap;gap:4px 6px;
 padding:0 8px 6px;
 background:#fffefa;
}
#board-view .tile-indicator{
 display:inline-flex;align-items:center;gap:5px;
 max-width:100%;min-width:0;padding:3px 6px 3px 4px;
 border:1px solid #e0e5dd;border-radius:4px;
 background:#f5f7f3;color:#3b5142;
 font-size:.66rem;line-height:1.25;font-weight:720;
 overflow-wrap:anywhere;white-space:normal;
}
#board-view .tile-indicator::before{
 content:'';align-self:stretch;min-height:12px;width:4px;
 flex:none;border-radius:2px;
 background:var(--indicator-color,#82958b);
}
#board-view .compact-card .material-alert{
 margin:0 5px 5px;background:#fff8ed;border-color:#ebddc4;
 font-size:.67rem;
}
@media(max-width:650px){
 #board-view .card.compact-card .compact-content{
  grid-template-columns:minmax(47px,auto) minmax(52px,1fr) 39px 36px 44px;
  grid-template-rows:auto!important;
  column-gap:5px;min-height:51px;padding:5px 7px;
 }
 #board-view .compact-card .order-number{font-size:.76rem}
 #board-view .compact-card .customer{font-size:.81rem}
 #board-view .compact-card .due{font-size:.7rem;min-height:23px}
 #board-view .compact-card .piece-count{font-size:.76rem;min-height:23px}
 #board-view .compact-card .quick-assign{
  min-width:44px;width:44px;min-height:44px;height:44px;
  touch-action:manipulation;
 }
 #board-view .compact-card .quick-assign .employee-badge,
 #board-view .compact-card .quick-assign .unassigned-badge{
  width:31px;height:31px;font-size:.72rem;
 }
 #board-view .tile-indicators{padding:0 7px 6px;gap:4px}
 #board-view .tile-indicator{font-size:.69rem;padding:4px 6px 4px 4px}
}
@media(max-width:355px){
 #board-view .card.compact-card .compact-content{
  grid-template-columns:minmax(43px,auto) minmax(42px,1fr) 37px 32px 44px;
  column-gap:4px;padding-left:6px;padding-right:6px;
 }
 #board-view .compact-card .customer{font-size:.77rem}
 #board-view .compact-card .piece-count{font-size:.7rem}
}



/* v0.7.13 — picture-piece rows belong to one compact preview list,
   not separate large cards. Leaves the work-order editor and custom colors alone. */
.order-preview .peek-section:has(.peek-piece){
 counter-reset:ifw-peek-piece;
}
.order-preview .peek-piece,
.order-preview .peek-piece:nth-child(even),
.order-preview .peek-piece:nth-of-type(even){
 display:grid;
 grid-template-columns:22px minmax(0,1fr) fit-content(125px);
 grid-template-rows:auto auto;
 align-items:start;
 column-gap:8px;
 row-gap:3px;
 margin:0;
 padding:8px 2px;
 min-height:38px;
 border:0;
 border-bottom:1px solid #e3e8e1;
 border-radius:0;
 background:transparent;
 box-shadow:none;
}
.order-preview .peek-piece:last-child{border-bottom:0}
.order-preview .peek-piece::before{
 content:counter(ifw-peek-piece,decimal-leading-zero);
 display:grid;place-items:center;
 grid-column:1;grid-row:1;
 width:21px;height:21px;
 background:#f2f5f0;
 border:1px solid #dbe4db;border-radius:4px;
 font-size:.67rem;font-weight:780;color:#526658;
 line-height:1;font-variant-numeric:tabular-nums;
}
.order-preview .peek-piece>b{
 grid-column:2;grid-row:1;
 min-width:0;
 font-size:.82rem;line-height:1.32;
 font-weight:780;color:#293f32;
 white-space:normal;overflow-wrap:anywhere;
}
.order-preview .peek-piece>small{
 grid-column:3;grid-row:1;
 display:inline-block;justify-self:end;align-self:start;
 min-width:0;max-width:125px;width:auto;
 margin:0;padding:3px 6px;
 background:#f5f7f3;border:1px solid #dce4db;
 border-radius:4px;
 color:#49604f;font-size:.69rem;
 font-weight:680;line-height:1.25;
 white-space:normal;text-align:center;
 overflow-wrap:break-word;
}
.order-preview .peek-piece>p{
 grid-column:2/4;grid-row:2;
 min-width:0;margin:0;padding:0;
 background:transparent;
 font-size:.72rem;line-height:1.38;
 color:#69786c;white-space:pre-wrap;overflow-wrap:anywhere;
}
@media(max-width:650px){
 .order-preview .peek-piece,
 .order-preview .peek-piece:nth-of-type(even){
  display:grid;
  grid-template-columns:22px minmax(0,1fr) fit-content(112px);
  grid-template-rows:auto auto;
  column-gap:7px;row-gap:2px;padding:8px 2px;
 }
 .order-preview .peek-piece>b{grid-column:2;grid-row:1;font-size:.82rem}
 .order-preview .peek-piece>small{
  grid-column:3;grid-row:1;max-width:112px;
  font-size:.69rem;margin:0;
 }
 .order-preview .peek-piece>p{grid-column:2/4;grid-row:2}
}


/* v0.7.14 — keep the material issue count next to its label,
   not pushed out to the far edge of a compact work-order tile. */
#board-view .compact-card .material-alert{
 display:inline-flex;
 align-items:center;
 justify-content:flex-start;
 gap:7px;
 width:max-content;
 max-width:calc(100% - 12px);
 min-width:0;
 margin:0 0 6px 6px;
 padding:4px 8px;
 border-radius:5px;
 white-space:normal;
}
#board-view .compact-card .material-alert b{
 margin-left:0;
 flex:none;
}


/* v0.7.15 Samsung One UI / Android: use Workshop's held-touch tile dragging,
   never Android native HTML drag, text drag, or long-press context-menu. */
@media (hover:none) and (pointer:coarse){
 #board-view .card.compact-card,
 #board-view .card.compact-card .compact-content,
 #board-view .card.compact-card .order-type-band,
 #board-view .card.compact-card .tile-indicators,
 #board-view .card.compact-card .material-alert{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  -webkit-user-drag:none;
 }
 #board-view .card.compact-card{cursor:grab}
 body.board-dragging #board-view .card.compact-card.touch-source{cursor:grabbing}
}


/* v0.7.16 — same no-focus-zoom mobile field treatment as the Work Order
   editor (v0.7.7), now across all Administration panels, including dynamic
   manager forms. Does not change accordion/tile sizing, desktop inputs or
   pinch-to-zoom. Keep checkbox/radio/color/file controls native. */
@media (max-width:650px) {
  #admin-view input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
  #admin-view select,
  #admin-view textarea {
    font-size:16px!important;
    line-height:1.35;
    scroll-margin-block:14px 28px;
  }
}

/* v0.7.17: full-page creation, same form for AI prefill and manual entry. */
#order-dialog.ifws-new-workorder[open]{inset:0!important;width:100vw!important;max-width:100vw!important;height:100dvh!important;max-height:100dvh!important;margin:0!important;border-radius:0!important}
#order-dialog.ifws-new-workorder[open]>form{display:flex;flex-direction:column;height:100%;max-height:100%;min-height:0}
#order-dialog.ifws-new-workorder .modal-scroll{flex:1;min-height:0;max-height:none;overflow-y:auto}
#order-dialog.ifws-new-workorder .form-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
#order-dialog.ifws-new-workorder .modal-head{padding:15px 22px}
#order-dialog.ifws-new-workorder .modal-scroll{padding:18px clamp(14px,4vw,60px) 25px}
#order-dialog.ifws-new-workorder .modal-footer{flex:none}
#order-dialog .workorder-images{border-top:1px solid #dbe3d9;margin-top:15px;padding-top:12px}
#order-dialog .workorder-images h3{margin:0 0 4px}
.image-reference-list{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0}
.image-reference-item{width:135px;min-width:0;display:grid;gap:5px;position:relative}
.image-reference-item img{display:block;width:100%;height:118px;object-fit:contain;background:#f5f6f2;border:1px solid #d7e2d8;border-radius:7px;cursor:zoom-in}
.image-reference-item .image-kind{font-size:.74rem;color:#526255;overflow-wrap:anywhere}
.image-reference-item button{font-size:.68rem;min-height:30px;padding:5px}
#workorder-image-viewer{border:none;border-radius:0;padding:0;margin:0;inset:0;width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;background:#151a17;color:#fff}
#workorder-image-viewer::backdrop{background:#111d}
.image-viewer-head{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:10px 18px;min-height:60px}
.image-viewer-body{width:100%;height:calc(100dvh - 60px);overflow:auto;touch-action:pan-x pan-y pinch-zoom;display:flex;align-items:flex-start;justify-content:safe center}
.image-viewer-body img{max-width:100%;width:auto;height:auto;max-height:calc(100dvh - 70px);object-fit:contain;cursor:zoom-in}
.image-viewer-body img.zoomed{max-width:none;max-height:none;cursor:zoom-out}
#board-view .compact-card .company-contact{display:block;color:#718077;font-size:.67rem;font-weight:500;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#board-view .compact-card .customer.company-tile{max-height:3.4em;-webkit-line-clamp:3}
#board-view .compact-card .image-indicator{margin-left:3px;opacity:.7;font-size:.69rem}
@media(max-width:750px){
 #order-dialog.ifws-new-workorder .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 #order-dialog.ifws-new-workorder .modal-head{padding:10px 14px}
 #order-dialog.ifws-new-workorder .modal-scroll{padding:13px 12px}
}
@media(max-width:480px){#order-dialog.ifws-new-workorder .form-grid{grid-template-columns:1fr}}


/* v0.7.20 — compact one-line lane headings. A 5-column desktop board
   typically gives each lane ~300px; do NOT wrap that layout. Only move the
   sorter down if an individual lane really is too narrow. */
.board .lane{container-type:inline-size;container-name:ifws-lane}
.board .lane-head{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:5px;
  min-width:0;
  padding:8px 6px 10px;
}
.board .lane-head>.lane-dot{width:9px;height:9px;flex:none}
.board .lane-head>strong{
  flex:1 1 auto;
  min-width:0;
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
  font-size:.77rem;
  line-height:1.25;
  letter-spacing:-.01em;
}
.board .lane-head>.lane-count{
  flex:none;
  margin:0;
  padding:3px 7px;
  line-height:1.25;
}
.board .lane-head>.lane-sort{
  display:inline-flex;
  flex:none;
  flex-direction:row;
  align-items:center;
  margin:0;
  gap:3px;
  white-space:nowrap;
  font-size:.63rem;
}
.board .lane-head>.lane-sort select{
  flex:none;
  width:81px;
  max-width:81px;
  min-width:0;
  min-height:29px;
  height:29px;
  padding:3px 2px 3px 5px;
  font-size:.72rem;
  font-weight:650;
}
/* At the narrow end of a 6-column board, drop the word "Order" first. */
@container ifws-lane (max-width:280px){
  .board .lane-head .lane-sort>span{display:none}
}
/* Actual compression: wrap only when the lane itself cannot accommodate
   a legible title, count and sorter side-by-side. */
@container ifws-lane (max-width:259px){
  .board .lane-head{
    display:grid;
    grid-template-columns:9px minmax(0,1fr) auto;
    grid-template-rows:auto auto;
    align-items:center;
    gap:5px 6px;
  }
  .board .lane-head>.lane-dot{grid-column:1;grid-row:1}
  .board .lane-head>strong{grid-column:2;grid-row:1;white-space:normal;overflow:visible}
  .board .lane-head>.lane-count{grid-column:3;grid-row:1}
  .board .lane-head>.lane-sort{grid-column:2 / -1;grid-row:2;justify-self:end}
  .board .lane-head>.mobile-lane-progress{grid-column:3;grid-row:2;justify-self:start}
}
@media(max-width:650px){
  /* Keep the native 16px mobile select text so Safari won't zoom fields. */
  .board .lane-head>.lane-sort select{
    width:88px;max-width:88px;min-height:35px;height:35px;
    font-size:16px;padding:4px 1px 4px 4px;
  }
  .board .lane-head>.mobile-lane-progress{flex:none}
}

/* Keep the Picked Up history shortcut with the lane filters, not on the sort dropdown. */
.board .lane-type-filters .pickup-history-link{
  margin-left:auto;
  align-self:center;
  background:#fff;
  color:#395646;
  border:1px solid #aebfb1;
  font-size:.66rem;
  font-weight:750;
  padding:3px 6px;
  white-space:nowrap;
}

/* v0.7.21 — date-sort action and automatically collapsed project stacks. */
.board .lane-head>.lane-date-sort{margin-left:auto;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap;background:#fff;color:#395443;border:1px solid #b7c0b5;border-radius:6px;font-size:.65rem;font-weight:760;min-height:27px;padding:4px 7px;cursor:pointer}
.board .lane-head>.lane-date-sort:focus-visible,.order-group-toggle:focus-visible,.order-group-grip:focus-visible{outline:2px solid #2b6050;outline-offset:2px}
.board .lane-head>.lane-date-sort:disabled{opacity:.5}
.board .board-unit{min-width:0;margin-bottom:8px}
.board .board-single>.card{margin-bottom:0}
.board .order-group{border:1px solid #c6cdc7;background:#f9faf7;border-radius:7px;overflow:hidden;box-shadow:0 1px 3px #22322c0e}
.board .order-group-head{display:flex;align-items:stretch;gap:0;min-width:0}
.board .order-group-toggle{min-width:0;flex:1;display:flex;align-items:center;gap:7px;border:0;background:transparent;text-align:left;color:#243d32;cursor:pointer;padding:9px 7px 7px;font:inherit}
.board .order-group-chevron{font-size:1rem;color:#557468;flex:none}
.board .order-group-label{min-width:0;flex:1;display:flex;flex-direction:column;gap:1px;line-height:1.17}
.board .order-group-label strong{font-size:.8rem;overflow-wrap:anywhere}
.board .order-group-label small,.board .order-group-contact{font-size:.67rem;color:#58665f;font-weight:500}
.board .order-group-count{flex:none;min-width:21px;display:inline-flex;justify-content:center;align-items:center;background:#e9eee8;border:1px solid #d4ded3;color:#355040;font-size:.68rem;font-weight:800;border-radius:15px;padding:3px 5px}
.board .order-group-grip{flex:none;padding:0 8px;min-width:25px;display:flex;justify-content:center;align-items:center;cursor:grab;color:#627a6b;font-size:1.15rem;border-left:1px solid #e3e8e1;touch-action:pan-y;user-select:none}
.board .order-group-colors{display:flex;gap:3px;padding:0 8px 8px 26px;flex-wrap:wrap}
.board .order-group-colors span{height:4px;flex:1 1 12px;max-width:36px;background:var(--group-type);border-radius:3px}
.board .order-group-contents{border-top:1px solid #e0e6db;padding:6px;background:#eff2eb}
.board .order-group-contents[hidden]{display:none!important}
.board .order-group-contents .card:last-child{margin-bottom:0}
.board .order-group-contents .compact-card{margin-bottom:6px}
@container ifws-lane (max-width:259px){.board .lane-head>.lane-date-sort{grid-column:2/-1;grid-row:2;justify-self:end}}
@media(max-width:650px){.board .lane-head>.lane-date-sort{min-height:34px;padding:6px 9px;font-size:.75rem}}

/* v0.7.23 — let wheel/touch scrolling continue into the page when a lane ends.
   Keep overscroll contained only during an actual board drag (above). */
#board-view .board-wrap{overscroll-behavior-y:auto}
#board-view .lane .lane-body{overscroll-behavior-y:auto}
body.board-dragging #board-view .lane .lane-body{overscroll-behavior-y:contain}

/* v0.7.24 — restore the original restrained tile/column palette.
   Only quiet neutral borders distinguish cards and expanded group boundaries. */
#board-view .board .lane .card.compact-card{
 border-color:#c7ccca;
}
#board-view .board .lane .order-group{
 background:#f9faf7;
 border:1px solid #bfc5c2;
 box-shadow:0 1px 3px #22322c0e;
}
#board-view .board .lane .order-group-contents{
 background:#eff2eb;
 border-top:1px solid #cbd1ce;
 padding:8px;
}
#board-view .board .lane .order-group-head{background:transparent}

/* v0.7.23 mobile group drag: keep a generous, clearly defined touch target
   INSET from the swipe-navigation edge. The group still expands via the
   separate large title button; this handle only reprioritizes the group. */
@media(max-width:650px){
 #board-view .board .order-group-head{padding-right:48px;align-items:center}
 #board-view .board .order-group-toggle{min-height:53px;padding-right:4px}
 #board-view .board .order-group-grip{
  align-self:center;flex:0 0 42px;min-width:42px;min-height:44px;
  margin:4px 0 4px 5px;padding:0;
  border:1px solid #ccd2ce;
  border-radius:7px;background:#f7f8f7;
  font-size:1.25rem;touch-action:none;
  -webkit-touch-callout:none;-webkit-user-select:none;user-select:none;
 }
}

/* v0.7.25 — desktop fixed-width board; never compress work-order tiles when
   more columns are added. Keep phone swipe one full-width column per view. */
@media (min-width:651px){
 #board-view .board-wrap{max-width:100%;width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#aeb8b1 transparent}
 #board-view .board{display:grid;grid-template-columns:repeat(var(--lane-count,5),340px);gap:14px;width:max-content;min-width:0}
 #board-view .board>.lane{width:340px;min-width:340px;max-width:340px;container-type:inline-size}
 #board-view .lane-head{flex-wrap:nowrap}
 #board-view .lane-head>strong{flex:1 1 auto;min-width:0}
 #board-scroll-controls{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin:-7px 1px 7px}
 #board-scroll-controls[hidden]{display:none!important}
 #board-scroll-controls button{border:1px solid #c9d0cb;background:#fff;border-radius:6px;min-width:31px;min-height:28px;color:#3e5647;font-size:1.05rem;line-height:1}
 #board-scroll-controls button:disabled{opacity:.3}
 #board-scroll-controls>span{font-size:.69rem;color:#63736b;margin-right:3px}
}
@media (max-width:650px){#board-scroll-controls{display:none!important}}
/* v0.7.25 — the lane is allowed to pass remaining wheel travel to page;
   native touch-scroll chaining is maintained outside active drags. */
#board-view .lane .lane-body{overscroll-behavior-y:auto}

/* v0.7.26: mouse drag-to-pan only on empty desktop board space. */
@media (min-width:651px){
 #board-view .board-wrap:not(.board-reordering) .board,
 #board-view .board-wrap:not(.board-reordering) .lane-body{cursor:grab}
 #board-view .board-wrap.board-panning,
 #board-view .board-wrap.board-panning .board,
 #board-view .board-wrap.board-panning .lane-body{cursor:grabbing!important;user-select:none!important;scroll-behavior:auto!important}
 #board-view .board-wrap .card{cursor:grab}
}