:root{--bg:#031b29;--bg2:#06283a;--panel:#0b2b3e;--panel2:#143c53;--line:#2f6582;--text:#f5fbff;--muted:#a8c9df;--accent:#14a9ff;--accent2:#078df6;--input:#163a50;--shadow:0 16px 42px rgba(0,0,0,.34);--r:14px;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#00111b;color:var(--text)}body{display:flex;justify-content:center;align-items:flex-start}.app-shell{width:min(100%,430px);min-height:100vh;background:radial-gradient(circle at 50% 0,#0b3146 0,#041e2d 42%,#02141f 100%);position:relative;overflow:hidden;box-shadow:var(--shadow)}.screen{display:none;min-height:100vh;padding-bottom:74px}.screen--active{display:block}.login-screen{padding-bottom:20px;background:linear-gradient(180deg,#061b29,#031622)}.login-hero{height:47vh;max-height:430px;min-height:330px;overflow:hidden}.login-hero img{width:100%;height:100%;object-fit:cover}.login-card{margin:-12px 24px 0;padding:20px;border:1px solid #2f6887;border-radius:18px;background:linear-gradient(180deg,rgba(8,38,55,.96),rgba(3,28,42,.98));box-shadow:0 14px 28px rgba(0,0,0,.3)}.field-label{display:block;font-size:13px;color:#d9edf9;margin:9px 0 7px}.automatic-shift-note{float:right;color:#42c7ff;font-size:10px;font-weight:600}.input-wrap{display:flex;align-items:center;gap:8px;border:1px solid #5581a0;background:#12344a;border-radius:9px;padding:0 10px;height:46px}.input-wrap input,.input-wrap select{flex:1;border:0;background:transparent;color:#f7fcff;outline:none;font:inherit;min-width:0}.input-wrap select{appearance:none}#shiftSelect[readonly]{color:#7ed5ff;font-weight:700;cursor:default}.operator-select-wrap{position:relative;padding-right:8px}.operator-select-wrap select{width:100%;height:100%;cursor:pointer;appearance:auto;-webkit-appearance:menulist;background:transparent;color:#f7fcff;padding:0 6px}.operator-select-wrap select option{background:#12344a;color:#f7fcff}.operator-select-wrap .icon{pointer-events:none}.icon{color:#eaf7ff}.chev{color:#c9eaff;font-size:20px}.icon-btn{border:0;background:transparent;color:#b8d7ea;font-size:18px}.primary-btn,.secondary-btn{border:0;border-radius:9px;min-height:48px;padding:0 16px;color:white;font-weight:700;letter-spacing:.2px;cursor:pointer}.primary-btn{background:linear-gradient(180deg,#18b3ff,#078cf6);box-shadow:0 7px 18px rgba(0,149,255,.22)}.secondary-btn{background:#0b3e5e;border:1px solid #2e789c}.primary-btn:disabled,.secondary-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.lab-field input:disabled{opacity:.55;cursor:not-allowed}.login-card .primary-btn{width:100%;margin-top:20px}.error-text{color:#ff9b9b;min-height:18px;margin:9px 0 0;font-size:13px}.success-text{color:#82f5c7;min-height:20px;font-size:13px;margin-top:10px}.login-footer{text-align:center;letter-spacing:4px;font-size:13px;color:#c5dded;margin-top:28px}.login-footer strong{font-size:13px}.login-footer small{display:block;letter-spacing:0;margin-top:18px;color:#83a6bd}.topbar{height:98px;border-bottom:1px solid #2d6a87;display:grid;grid-template-columns:48px 1fr auto;align-items:center;padding:14px 16px 9px;background:linear-gradient(180deg,#031d2c,#021723)}.menu-btn{border:0;background:transparent;color:#1ab5ff;font-size:29px;padding:0;cursor:pointer}.screen-logout{display:none;border:0;background:transparent;color:#8edaff;padding:6px 0;font-size:10px;text-decoration:underline;cursor:pointer}.brand{text-align:center;font-size:28px;letter-spacing:4px;font-weight:700;line-height:1}.brand span{display:block;color:#4bd0ff;font-size:10px;letter-spacing:3px;margin-top:7px}.user-chip{text-align:right;font-size:12px;color:#d9edf9;line-height:1.25}.user-chip strong,.user-chip span{display:block}.user-chip span{color:#38bcff}.user-chip button{border:0;background:transparent;color:#8edaff;padding:3px 0 0;font-size:10px;text-decoration:underline}.mini-mark{font-size:21px;text-align:center}.mini-mark span{display:block;font-size:8px}.screen-content{padding:14px 14px 28px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid-2>div>input,.history-filters input:not(.input-wrap input){width:100%;height:44px;border:1px solid #56809a;border-radius:7px;background:#163a50;color:#fff;padding:0 10px}.weight-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.metric-card{border:1px solid #3a7899;background:linear-gradient(180deg,#0a2e43,#082638);border-radius:14px;padding:12px}.metric-title{display:flex;align-items:center;gap:10px;min-height:50px;font-size:14px}.bag-icon{font-size:28px}.metric-input{display:flex;align-items:center;background:#49647a;border:1px solid #7091a7;border-radius:6px;height:44px;padding:0 8px}.metric-input input{width:100%;border:0;background:transparent;color:#fff;font-size:18px;font-weight:600;outline:none}.metric-input span{font-size:12px;color:#cbe0ec}.hour-section{border-top:1px solid #1e7299;margin:20px -14px 0;padding:15px 14px 0}.section-row{display:flex;justify-content:space-between;align-items:center;font-size:13px}.section-row span{color:#39bdff}.hour-buttons{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;margin-top:10px}.hour-btn{height:60px;border:1px solid #5a7790;border-radius:7px;background:#0b2637;color:white;font-size:16px}.hour-btn.selected{border-color:#12b6ff;background:linear-gradient(180deg,#0b83c8,#07518e);box-shadow:0 0 12px rgba(18,182,255,.65)}.hour-btn small{display:block;font-size:12px;color:#8ad8ff;margin-bottom:5px}.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.photo-card{position:relative;font-size:12px;color:#bce5fb;cursor:pointer}.photo-card img{width:100%;height:160px;object-fit:cover;border:1px solid #6c8290;border-radius:10px;margin-top:8px;display:block}.photo-card input{display:none}.photo-card b{position:absolute;right:8px;top:38px;background:#0a3651;border-radius:8px;padding:8px}.action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.screen-title{display:flex;gap:12px;align-items:center;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid #29566d;font-size:20px}.info-banner{border:1px solid #077bc0;border-radius:7px;padding:14px;background:#073d65;color:#aee1ff;font-size:12px;line-height:1.5}.lab-target{margin-top:10px;padding:10px 12px;border-left:3px solid #16b4ff;background:rgba(8,61,89,.55);color:#c9eaff;font-size:12px;line-height:1.4;border-radius:4px}.lab-target strong{color:#fff}.lab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 10px;margin-top:24px}.lab-field label{display:block;font-size:12px;margin-bottom:6px}.lab-field input{width:100%;height:39px;border-radius:5px;border:1px solid #7790a2;background:#4d667a;color:#fff;padding:0 9px;font-size:15px}.big-gap{width:100%;margin-top:30px}.history-filters{border:1px solid #3b7593;border-radius:9px;padding:10px;margin-bottom:10px}.history-filters .input-wrap{margin-top:9px;height:42px}.table-head,.history-row{display:grid;grid-template-columns:1.1fr 1.5fr .55fr 1.15fr 20px;gap:6px;align-items:center}.table-head{font-size:11px;color:#cfe8f7;padding:0 6px 6px}.history-list{border:1px solid #1d4054}.history-row{min-height:42px;padding:6px;background:#0c2a3c;border-bottom:1px solid #24475b;font-size:11px;cursor:pointer}.history-row:nth-child(even){background:#0a2536}.history-row:last-child{border-bottom:0}.history-row span:last-child{font-size:24px;color:#bbdef0}.export-btn{width:100%;margin-top:24px}.user-table{border:1px solid #2d607a;border-radius:7px;overflow:hidden}.user-row{display:grid;grid-template-columns:1.15fr 1fr .75fr 88px;min-height:54px;align-items:center;background:#08283a;border-bottom:1px solid #254b61;font-size:12px}.user-row:last-child{border-bottom:0}.user-row>span{padding:0 8px;border-right:1px solid #254b61;height:100%;display:flex;align-items:center}.user-row.head{min-height:40px;background:transparent;color:#c6e6f8}.user-actions{display:flex;align-items:center;justify-content:center;gap:5px;height:100%}.edit-user,.delete-user{width:36px;height:36px;border-radius:6px;font-size:17px;cursor:pointer}.edit-user{border:1px solid #0a83c7;background:#075a8e;color:#5cd2ff}.delete-user{border:1px solid #a84755;background:#6d2430;color:#ffd9df}.return-list-btn{width:100%;margin:-4px 0 14px;min-height:42px}
.detail-actions{display:grid;grid-template-columns:1fr;gap:10px;margin:-4px 0 14px}
.detail-actions .return-list-btn{margin:0}
@media (min-width:768px){
  .detail-actions{grid-template-columns:1fr 1fr}
  body[data-role="Operator"] .detail-actions{grid-template-columns:1fr}
}.detail-table{border-top:1px solid #244b60}.detail-row{display:grid;grid-template-columns:1.1fr 1.4fr;min-height:30px;border-bottom:1px solid #244b60;font-size:12px;align-items:center}.detail-row span:first-child{color:#a7d2e8}.screen-content h2{font-size:14px;margin:14px 0 8px}.detail-lab{display:grid;grid-template-columns:1fr 1fr;border:1px solid #23495d}.detail-lab .detail-row{grid-template-columns:1fr 1fr;padding:0 8px}.detail-photos img{width:100%;height:160px;object-fit:cover;border-radius:10px;border:1px solid #6f8797}.bottom-nav{position:absolute;bottom:0;left:0;right:0;height:74px;border-top:1px solid #29617e;background:#031d2b;display:grid;grid-template-columns:repeat(4,1fr);align-items:center}.nav-btn{border:0;background:transparent;color:#b3d3e8;font-size:11px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer}.nav-btn .nav-icon{font-size:22px}.nav-btn.active{color:#18b7ff}.modal{position:fixed;inset:0;background:rgba(0,7,12,.78);display:none;align-items:center;justify-content:center;padding:20px;z-index:20}.modal.show{display:flex}.modal-card{width:min(100%,380px);background:#08283a;border:1px solid #377795;border-radius:14px;padding:18px;box-shadow:var(--shadow)}.modal-card input,.modal-card select{width:100%;height:44px;border:1px solid #56809a;background:#15384d;border-radius:7px;color:#fff;padding:0 10px}.modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}@media(max-width:360px){.brand{font-size:22px}.user-chip{font-size:10px}.screen-content{padding-left:10px;padding-right:10px}.hour-buttons{gap:2px}.hour-btn{font-size:13px}.photo-card img,.detail-photos img{height:140px}}
.server-status{margin-top:12px;text-align:center;font-size:11px}.shared-banner{margin:0 0 12px;border:1px solid #1e6e8f;border-radius:8px;padding:8px 10px;background:rgba(3,62,91,.48);color:#aee1ff;font-size:11px}.shared-banner span{color:#69f0b8}.install-btn{display:block;margin:14px auto 0;border:1px solid #2e789c;border-radius:8px;background:#0b3e5e;color:#dff6ff;padding:9px 14px;font-size:11px;font-weight:700;letter-spacing:.5px}.install-btn[hidden]{display:none}.pin-help{font-size:11px;color:#9ec8dc;margin-top:7px}.toast-container{z-index:1100;width:min(100%,430px);pointer-events:none}.toast{margin-inline:auto;max-width:calc(100% - 24px);pointer-events:auto}
@media(min-width:431px){body{padding:18px 0}.app-shell{border-radius:18px;min-height:calc(100vh - 36px)}}

.identity-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.identity-grid .serial-field{grid-column:1/-1}.identity-grid select{appearance:auto;-webkit-appearance:menulist;width:100%}.metric-title label{margin:0}.metric-input:has(input[aria-invalid="true"]){border-color:#ff7f8e;box-shadow:0 0 0 2px rgba(255,77,100,.2)}
.photo-card{cursor:default}.photo-card input{display:none}.photo-trigger{position:relative;width:100%;height:160px;margin-top:8px;padding:0;overflow:hidden;border:1px solid #4f7b95;border-radius:10px;background:#08283a;color:#d8effb;cursor:pointer}.photo-trigger:hover,.photo-trigger:focus-visible{border-color:#16b4ff;box-shadow:0 0 0 3px rgba(22,180,255,.2);outline:0}.photo-trigger img{width:100%;height:100%;margin:0;border:0;border-radius:0;object-fit:cover}.photo-trigger img[hidden],.photo-empty[hidden]{display:none!important}.photo-empty{display:flex;height:100%;align-items:center;justify-content:center;flex-direction:column;gap:8px;background:linear-gradient(180deg,#0b3349,#072436)}.photo-empty strong{font-size:30px}.photo-empty span{font-size:12px;font-weight:700}.photo-trigger b{position:absolute;right:8px;bottom:8px;top:auto;padding:7px 9px;border-radius:7px;background:rgba(3,35,53,.9);color:#bdeaff;font-size:10px;letter-spacing:.5px}.detail-photos>div{min-width:0}.detail-photos img{display:block}.detail-photos img[hidden]{display:none!important}.detail-photo-empty{height:120px;display:flex;align-items:center;justify-content:center;padding:12px;border:1px dashed #527389;border-radius:10px;color:#9fc2d7;text-align:center;font-size:11px;background:#072334}.detail-photo-empty[hidden]{display:none!important}
@media(max-width:360px){.photo-trigger{height:140px}}

/* Sprint 5 mobile and device-state refinements */
.connection-banner{position:fixed;z-index:1090;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 24px),406px);margin:0;padding:10px 12px;border-width:1px;box-shadow:0 8px 24px rgba(0,0,0,.34);font-size:12px;line-height:1.35;text-align:center}
.screen{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
.topbar{height:calc(98px + env(safe-area-inset-top));padding-top:calc(14px + env(safe-area-inset-top))}
.bottom-nav{height:calc(74px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
.nav-btn,.menu-btn,.icon-btn{min-width:44px;min-height:44px}
.user-chip button{min-height:32px;padding:4px 0}
.history-row{width:100%;border-left:0;border-right:0;color:inherit;text-align:left}
.user-row{grid-template-columns:1.15fr 1fr .75fr 98px}
.edit-user,.delete-user{width:44px;height:44px}
.modal-card{max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(74,205,255,.8);outline-offset:2px}
@media(max-width:340px){.screen-content{padding-left:8px;padding-right:8px}.identity-grid{gap:6px}.weight-grid,.photo-grid,.action-row{gap:8px}.metric-card{padding:9px}.brand{font-size:20px;letter-spacing:3px}.user-row{font-size:10px;grid-template-columns:1.1fr .85fr .55fr 94px}.user-row>span{padding:0 4px}.edit-user,.delete-user{width:42px;height:44px}.table-head,.history-row{gap:3px}.table-head{font-size:9px}.history-row{font-size:10px}}

.lab-section-heading{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-size:13px;color:#f7fcff}
.lab-section-heading span{color:#73d5ff;font-size:11px}
.lab-replicates{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}
.lab-replicate-btn{min-height:42px;border:1px solid #4d7790;border-radius:7px;background:#0a2b3e;color:#b9d9eb;font-weight:700}
.lab-replicate-btn.active{border-color:#16b4ff;background:#075a8e;color:#fff;box-shadow:0 0 0 2px rgba(22,180,255,.18)}
.lab-grid{grid-template-columns:repeat(2,1fr);gap:12px 10px;margin-top:14px}
.lab-field input{height:42px;background:#243f52}
.lab-field input:focus,.lab-final-input:focus,.lab-override textarea:focus{border-color:#16b4ff;box-shadow:0 0 0 2px rgba(22,180,255,.2);outline:0}
.lab-results-title{margin-top:24px;padding-top:16px;border-top:1px solid #29566d}
.lab-result-head,.lab-result-row{display:grid;grid-template-columns:1.05fr .7fr .8fr .9fr;gap:7px;align-items:center}
.lab-result-head{margin-top:10px;padding:0 7px 6px;color:#9fc8dc;font-size:10px;text-transform:uppercase;letter-spacing:.5px}
.lab-results{border:1px solid #315f78;border-radius:8px;overflow:hidden}
.lab-result-row{min-height:48px;padding:5px 7px;border-bottom:1px solid #244b60;background:#08283a;font-size:12px}
.lab-result-row:last-child{border-bottom:0}
.lab-average{color:#73d5ff;font-variant-numeric:tabular-nums}
.lab-final-input{width:100%;height:35px;border:1px solid #607f94;border-radius:5px;background:#314f63;color:#fff;padding:0 7px;font-size:13px}
.lab-final-input:disabled{border-color:transparent;background:transparent;color:#fff;opacity:1;padding:0}
.lab-override{margin-top:14px}
.lab-override label{display:block;margin-bottom:7px;font-size:12px}
.lab-override textarea{width:100%;resize:vertical;border:1px solid #728b9c;border-radius:7px;background:#17384d;color:#fff;padding:9px;font:inherit;font-size:13px}
.lab-action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.history-row{width:100%;border:0;color:var(--text);font-family:inherit;text-align:left}
.history-row:focus-visible{outline:2px solid #16b4ff;outline-offset:-2px}
.detail-lab-scroll{max-width:100%;border:1px solid #315f78;border-radius:8px;overflow:hidden}
.detail-lab-table{min-width:0}
.detail-lab-head,.detail-lab-record{display:grid;grid-template-columns:1.25fr repeat(6,.7fr);gap:3px;align-items:center}
.detail-lab-head{min-height:34px;padding:5px 8px;background:#061f2f;color:#9fc8dc;font-size:10px;text-transform:uppercase;letter-spacing:.4px}
#detailLab{display:block;border:0}
.detail-lab-record{min-height:40px;padding:5px 8px;border-top:1px solid #244b60;background:#08283a;font-size:10px;font-variant-numeric:tabular-nums}
.detail-lab-record strong{font-size:11px}
.detail-lab-record .average{color:#73d5ff}
.detail-lab-record .missing{color:#779aae}
.user-row .user-actions{padding:0 5px}
.user-row button:disabled{opacity:.35;cursor:not-allowed}

/* Operational sampling, custody and laboratory traceability */
.operational-section{margin-top:18px;padding:14px;border:1px solid #376f8b;border-radius:12px;background:#08283a}
.operational-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}
.operational-heading output{color:#6ed6ff;font-size:11px;font-variant-numeric:tabular-nums;text-align:right}
.trace-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.trace-grid input,.trace-grid select,.lab-metadata input,.lab-metadata select{width:100%;height:42px;border:1px solid #56809a;border-radius:7px;background:#163a50;color:#fff;padding:0 10px}
.trace-grid input[readonly]{color:#87d9ff;background:#0a3046}
.label-confirmation-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.label-confirmation-grid label,.preparation-grid label{display:flex;align-items:center;gap:9px;min-height:44px;margin:0;padding:8px 10px;border:1px solid #315f78;border-radius:7px;background:#0a3046;color:#d7edf8;font-size:11px;cursor:pointer}
.label-confirmation-grid input,.preparation-grid input{width:18px;height:18px;flex:0 0 18px;margin:0;accent-color:#14a9ff}
.increment-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.increment-grid label{display:block;color:#b7d9ea;font-size:10px}
.increment-grid span{display:block;margin-bottom:5px;text-align:center}
.increment-grid input{width:100%;height:40px;border:1px solid #587d94;border-radius:6px;background:#203e52;color:#fff;padding:0 7px;text-align:center;font-variant-numeric:tabular-nums}
.increment-grid input[aria-invalid="true"],#sealNumber[aria-invalid="true"],#storageLocation[aria-invalid="true"]{border-color:#ff7f8e;box-shadow:0 0 0 2px rgba(255,77,100,.2)}
.lab-metadata{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.lab-metadata>div:last-child{grid-column:auto}
.lab-metadata output{display:flex;align-items:center;min-height:42px;padding:0 10px;border:1px solid #315f78;border-radius:7px;background:#0a3046;color:#87d9ff;font-size:12px}
.preparation-section{margin-top:16px;padding:0 0 4px;border-top:1px solid #24566f}
.preparation-section .lab-section-heading output{color:#6ed6ff;font-size:11px}
.preparation-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}
.preparation-grid label:last-child{grid-column:1/-1}
.preparation-grid input:disabled,.label-confirmation-grid input:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:340px){.operational-section{padding:10px}.trace-grid,.label-confirmation-grid,.preparation-grid{grid-template-columns:1fr}.preparation-grid label:last-child{grid-column:auto}.increment-grid{gap:5px}.lab-result-head,.lab-result-row{gap:4px;font-size:9px}.lab-final-input{padding:0 4px;font-size:11px}}

/* Responsive expansion: retain the phone-first flow, then use the available workspace. */
@media(min-width:600px){
  body{padding:16px}
  .app-shell{width:min(100%,920px);min-height:calc(100vh - 32px);border-radius:18px}
  .screen{min-height:calc(100vh - 32px)}
  .screen-content{width:100%;max-width:860px;margin:0 auto;padding:24px 28px 32px}
  .topbar{padding-inline:28px}
  .identity-grid{grid-template-columns:minmax(260px,1.4fr) 1fr 1fr}
  .identity-grid .serial-field{grid-column:auto}
  .weight-grid{gap:16px}
  .trace-grid{gap:16px}
  .increment-grid{grid-template-columns:repeat(6,1fr)}
  .lab-metadata{grid-template-columns:repeat(2,1fr)}
  .lab-metadata>div:last-child{grid-column:auto}
  .preparation-grid{grid-template-columns:repeat(5,1fr)}
  .preparation-grid label:last-child{grid-column:auto}
  .lab-grid{grid-template-columns:repeat(5,1fr)}
  .photo-trigger,.photo-card img{height:220px}
  .table-head,.history-row{grid-template-columns:1.1fr 1.7fr .55fr 1.2fr 28px;font-size:13px}
  .table-head{font-size:12px}
  .history-row{min-height:50px;padding-inline:12px}
  .user-row{grid-template-columns:1.6fr 1.1fr .65fr 128px;font-size:14px}
  .detail-row{grid-template-columns:220px 1fr;font-size:13px}
  .detail-lab-head,.detail-lab-record{font-size:12px}
  .detail-lab-record strong{font-size:13px}
  .toast-container{width:min(calc(100% - 32px),560px)}
}

@media(min-width:992px){
  body{padding:18px}
  .app-shell{width:min(100%,1440px);min-height:calc(100vh - 36px)}
  .screen{min-height:calc(100vh - 36px);padding-bottom:0}
  .screen.screen--active:not(.login-screen){display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-rows:98px minmax(calc(100vh - 134px),auto)}
  .screen:not(.login-screen) .topbar{grid-column:1/-1;grid-row:1;position:sticky;top:0;z-index:5;height:98px;padding:14px 32px 9px}
  .screen:not(.login-screen) .screen-content{grid-column:2;grid-row:2;max-width:1344px;margin:0 auto;padding:28px 32px 40px}
  .screen:not(.login-screen) .bottom-nav{grid-column:1;grid-row:2;position:sticky;inset:auto;top:98px;align-self:start;width:96px;height:calc(100vh - 134px);min-height:480px;padding:18px 8px;border-top:0;border-right:1px solid #29617e;display:flex;flex-direction:column;justify-content:flex-start;gap:10px}
  .screen:not(.login-screen) .nav-btn{width:100%;min-height:72px;border-radius:10px;font-size:12px}
  .screen:not(.login-screen) .nav-btn:hover,.screen:not(.login-screen) .nav-btn:focus-visible{background:#082f44}
  .screen:not(.login-screen) .nav-btn.active{background:rgba(20,169,255,.12)}
  .login-screen.screen--active{display:grid;grid-template-columns:minmax(440px,1.15fr) minmax(400px,.85fr);grid-template-rows:1fr auto;min-height:calc(100vh - 36px);padding:0}
  .login-hero{grid-column:1;grid-row:1/3;height:auto;min-height:calc(100vh - 36px);max-height:none}
  .login-card{grid-column:2;grid-row:1;align-self:end;width:calc(100% - 80px);max-width:500px;margin:48px auto 18px;padding:28px}
  .login-footer{grid-column:2;grid-row:2;margin:0;padding:12px 36px 36px}
  #homeScreen .screen-content{display:grid;grid-template-columns:minmax(520px,1.25fr) minmax(330px,.75fr);grid-template-rows:auto auto auto auto auto;gap:0 24px;align-content:start}
  #homeScreen .identity-grid{grid-column:1/-1;grid-row:1}
  #homeScreen .weight-grid{grid-column:1;grid-row:2}
  #homeScreen .operational-section{grid-column:1;grid-row:3}
  #homeScreen .hour-section{grid-column:1;grid-row:4;margin-right:0}
  #homeScreen .photo-grid{grid-column:2;grid-row:2/4;align-self:start;margin-top:20px}
  #homeScreen .action-row{grid-column:2;grid-row:4;align-self:end}
  #homeScreen #saveMessage{grid-column:1/-1;grid-row:5}
  #labScreen .screen-content{max-width:1280px}
  #labScreen .lab-grid{grid-template-columns:repeat(5,1fr);gap:16px}
  #labScreen .lab-result-row{min-height:52px;font-size:14px}
  #historyScreen .screen-content,#usersScreen .screen-content,#detailsScreen .screen-content{max-width:1240px}
  .photo-trigger,.photo-card img{height:250px}
  .detail-photos img{height:260px}
  .connection-banner{bottom:22px;width:min(calc(100% - 48px),620px)}
}

@media(min-width:1500px){
  .app-shell{width:min(calc(100% - 48px),1520px)}
  #homeScreen .screen-content{grid-template-columns:minmax(650px,1.35fr) minmax(420px,.65fr)}
}

/* Flow alignment: keep navigation visible and separate capture from traceability. */
.flow-context{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border-left:3px solid #16b4ff;background:rgba(8,61,89,.55);color:#c9eaff;font-size:12px;border-radius:4px}
.flow-context strong{color:#fff}.flow-context span{text-align:right}

@media(max-width:991.98px){
  .screen{padding-bottom:92px}
  .bottom-nav{position:fixed;bottom:0;left:50%;right:auto;width:min(100%,430px);transform:translateX(-50%);z-index:15;box-shadow:0 -8px 24px rgba(0,0,0,.28)}
}

@media(max-width:599.98px){
  #homeScreen .topbar{height:88px;padding-top:10px;padding-bottom:7px}
  #homeScreen .screen-content{padding-top:10px;padding-bottom:16px}
  #homeScreen .field-label{margin:6px 0 5px}
  #homeScreen .input-wrap{height:44px}
  #homeScreen .weight-grid{margin-top:12px}
  #homeScreen .metric-card{padding:9px 12px}
  #homeScreen .metric-title{min-height:38px}
  #homeScreen .metric-input{height:42px}
  #homeScreen .hour-section{margin-top:14px;padding-top:11px}
  #homeScreen .hour-buttons{margin-top:7px}
  #homeScreen .hour-btn{height:52px}
  #homeScreen .photo-grid{margin-top:12px}
  #homeScreen .photo-trigger{height:120px;margin-top:6px}
  #homeScreen .photo-empty{gap:4px}
  #homeScreen .photo-empty strong{font-size:24px}
  #homeScreen .action-row{margin-top:12px}
}

@media(min-width:600px) and (max-width:991.98px){
  .bottom-nav{width:min(calc(100% - 32px),920px)}
}

@media(min-width:992px){
  #homeScreen .hour-section{grid-column:1;grid-row:3;margin-right:0}
  #homeScreen .photo-grid{grid-column:2;grid-row:2/4}
  #homeScreen .action-row{grid-column:2;grid-row:4}
  #homeScreen #homeMessage{grid-column:1/-1;grid-row:5}
  #traceabilityScreen .screen-content{max-width:1000px}
}

/* Desktop workflow navigation: expose each operational flow without changing the compact mobile navigation. */
.desktop-workflow-nav,.nav-section-label,.nav-desktop-label{display:none}
.nav-btn[data-target="homeScreen"]{order:1}
.nav-btn[data-target="historyScreen"]{order:2}
.nav-sync{order:3}
.manager-nav{order:4}body:not([data-role="Manager"]) .manager-nav{display:none!important}
body[data-role="Operator"] #homeScreen .action-row{grid-template-columns:1fr}
body[data-role="Operator"] .lab-authorized-only{display:none!important}

@media(min-width:992px){
  .screen.screen--active:not(.login-screen){grid-template-columns:230px minmax(0,1fr)}
  .screen:not(.login-screen) .bottom-nav{width:230px;min-height:540px;padding:22px 14px;align-items:stretch;gap:6px;overflow-y:auto}
  .screen:not(.login-screen) .nav-section-label{display:flex;flex-direction:column;gap:3px;padding:0 10px 8px;color:#69d2ff;font-size:10px;letter-spacing:1.7px;order:1}
  .screen:not(.login-screen) .nav-section-label span{color:#7397aa;font-size:10px;letter-spacing:.2px;text-transform:none}
  .screen:not(.login-screen) .nav-tools-label{margin-top:10px;padding-top:13px;border-top:1px solid rgba(71,123,150,.42);order:7}
  .screen:not(.login-screen) .desktop-workflow-nav{display:flex}
  .screen:not(.login-screen) .nav-mobile-label,.screen:not(.login-screen) .nav-icon{display:none}
  .screen:not(.login-screen) .nav-desktop-label{display:block}
  .screen:not(.login-screen) .nav-btn{width:100%;min-height:62px;padding:10px;border-left:3px solid transparent;border-radius:8px;flex-direction:row;justify-content:flex-start;align-items:center;gap:11px;text-align:left;font-size:12px}
  .screen:not(.login-screen) .nav-copy{display:flex;min-width:0;flex-direction:column;gap:3px;line-height:1.2}
  .screen:not(.login-screen) .nav-copy strong{color:#e9f7ff;font-size:12px;font-weight:700}
  .screen:not(.login-screen) .nav-copy small{color:#82a9bd;font-size:10px;line-height:1.25}
  .screen:not(.login-screen) .nav-btn[data-target="homeScreen"]{order:2}
  .screen:not(.login-screen) .nav-btn[data-action="traceability"]{order:3}
  .screen:not(.login-screen) .nav-btn[data-action="lab"]{order:4}
  .screen:not(.login-screen) .nav-btn[data-target="historyScreen"]{order:5}
  .screen:not(.login-screen) .manager-nav{order:6}
  .screen:not(.login-screen) .nav-sync{order:8}
  body:not([data-role="Manager"]) .screen:not(.login-screen) .manager-nav{display:none}
  .screen:not(.login-screen) .nav-btn.active{border-left-color:#18b7ff;background:rgba(20,169,255,.13);box-shadow:inset 0 0 0 1px rgba(20,169,255,.12)}
  .screen:not(.login-screen) .nav-btn.active .nav-copy strong{color:#49c8ff}
  #homeScreen .screen-content{display:block;max-width:920px}
}

@media(min-width:1200px){
  #homeScreen .screen-content{display:grid;grid-template-columns:minmax(500px,1.25fr) minmax(300px,.75fr);grid-template-rows:auto auto auto auto;gap:0 24px;align-content:start;max-width:1210px}
  #homeScreen .identity-grid{grid-column:1/-1;grid-row:1}
  #homeScreen .weight-grid{grid-column:1;grid-row:2}
  #homeScreen .hour-section{grid-column:1;grid-row:3;margin-right:0}
  #homeScreen .photo-grid{grid-column:2;grid-row:2/4;align-self:start;margin-top:20px}
  #homeScreen .action-row{grid-column:2;grid-row:4;align-self:end}
  #homeScreen #homeMessage{grid-column:1/-1;grid-row:5}
}

/* Home capture save is the primary completion action shown in the supplied mobile workflow. */
.capture-save-row{margin-top:18px}
.capture-save-row .primary-btn{width:100%}
.lab-entry-row{display:grid;margin-top:10px}
.quick-lookup-row{margin-top:10px}
.quick-lookup-row .secondary-btn{width:100%}
.history-filters .input-wrap{margin-top:0}
.history-filter-toggle{width:100%;min-height:42px;margin-top:9px}
.history-date-drawer{padding-top:2px}
.history-date-drawer .field-label{margin-top:9px}
#homeScreen .home-panel--evidence .action-row{margin-top:10px}

@media(min-width:992px){
  #homeScreen .home-panel--evidence .capture-save-row{margin-top:14px}
  #homeScreen .home-panel--evidence .action-row{grid-template-columns:1fr;margin-top:10px}
}

/* Desktop Home refinement: compact operational panels with mobile markup preserved. */
.desktop-home-heading,.home-panel-title{display:none}
.home-panel{display:contents}

@media(min-width:992px){
  .screen:not(.login-screen) .nav-section-label{padding:0 12px 10px}
  .screen:not(.login-screen) .nav-btn{min-height:58px;padding:10px 12px;gap:0}
  .screen:not(.login-screen) .nav-copy{width:100%}
  .screen:not(.login-screen) .nav-btn.active .nav-copy strong{color:#49c8ff}
  .screen:not(.login-screen) .nav-logout{order:9;margin-top:2px;border:1px solid rgba(188,84,96,.42);border-left-width:3px}
  .screen:not(.login-screen) .nav-logout .nav-copy strong{color:#ffd2d7}
  .screen:not(.login-screen) .nav-logout:hover,.screen:not(.login-screen) .nav-logout:focus-visible{background:rgba(126,40,52,.22);border-color:#bf5966}
  .user-chip #changeUserBtn{min-height:30px;margin-top:5px;padding:3px 10px;border:1px solid #367a9c;border-radius:6px;color:#9ddfff;font-size:9px;font-weight:700;letter-spacing:.5px;text-decoration:none}
  .user-chip #changeUserBtn:hover,.user-chip #changeUserBtn:focus-visible{background:#0b3e5e;color:#fff}
  #homeScreen .screen-content{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto;gap:16px;max-width:980px;padding-top:24px}
  #homeScreen .desktop-home-heading{display:flex;grid-column:1/-1;align-items:center;min-height:38px;padding-bottom:12px;border-bottom:1px solid #29566d}
  #homeScreen .desktop-home-heading h1{margin:0;color:#f5fbff;font-size:23px;font-weight:650;letter-spacing:.2px}
  #homeScreen .home-panel{display:block;min-width:0;padding:18px;border:1px solid #2d607a;border-radius:12px;background:rgba(8,40,58,.78);box-shadow:0 10px 26px rgba(0,0,0,.13)}
  #homeScreen .home-panel-title{display:block;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid rgba(75,123,148,.44);color:#eaf7ff;font-size:13px;font-weight:700;letter-spacing:.2px}
  #homeScreen .home-panel .identity-grid{grid-template-columns:minmax(260px,1.35fr) minmax(150px,.8fr) minmax(160px,.85fr);gap:12px}
  #homeScreen .home-panel .field-label{margin-top:0}
  #homeScreen .home-panel .weight-grid{gap:12px;margin-top:16px}
  #homeScreen .home-panel .metric-card{padding:11px 12px;background:#0a2e43;border-color:#356d88}
  #homeScreen .home-panel .metric-title{min-height:42px}
  #homeScreen .home-panel .metric-input{height:46px;background:#3e5a70}
  #homeScreen .home-panel .hour-section{margin:16px 0 0;padding:14px 0 0}
  #homeScreen .home-panel .hour-buttons{gap:6px}
  #homeScreen .home-panel .hour-btn{height:54px}
  #homeScreen .home-panel--evidence .photo-grid{gap:12px;margin-top:0}
  #homeScreen .home-panel--evidence .photo-trigger{height:190px}
  #homeScreen .home-panel--evidence .action-row{grid-template-columns:1fr;margin-top:14px}
  #homeScreen .home-panel--evidence #openTraceabilityBtn{order:1}
  #homeScreen .home-panel--evidence #openLabBtn{order:2}
  #homeScreen #homeMessage{grid-column:1/-1;grid-row:auto;margin-top:0!important}
}

@media(min-width:1200px){
  #homeScreen .screen-content{grid-template-columns:minmax(0,1.4fr) minmax(310px,.7fr);grid-template-rows:auto auto auto;gap:16px 18px;max-width:1220px}
  #homeScreen .desktop-home-heading{grid-column:1/-1;grid-row:1}
  #homeScreen .home-panel--capture{grid-column:1;grid-row:2}
  #homeScreen .home-panel--evidence{grid-column:2;grid-row:2}
  #homeScreen #homeMessage{grid-column:1/-1;grid-row:3}
  #homeScreen .home-panel--capture .identity-grid{grid-template-columns:minmax(210px,1.3fr) minmax(135px,.8fr) minmax(145px,.85fr)}
}

@media(max-width:991px){
  .app-shell{overflow:clip}
  .screen:not(.login-screen) .topbar{position:sticky;top:0;z-index:14;box-shadow:0 8px 18px rgba(0,0,0,.2)}
  .topbar .screen-logout{display:inline-flex;align-items:center;justify-content:center;min-width:58px;min-height:44px;padding:6px 8px;border:1px solid rgba(86,170,211,.55);border-radius:7px;color:#b9e8ff;font-size:10px;font-weight:700;letter-spacing:.35px;line-height:1;white-space:nowrap;text-decoration:none}
  .topbar .screen-logout:hover,.topbar .screen-logout:focus-visible{background:#0b3e5e;color:#fff;border-color:#5cc9ff}
  .user-chip .screen-logout{margin-left:auto}
}