*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#F7F6F2;color:#1a1a1a;font-size:15px}
#root{max-width:min(96vw,2200px);margin:0 auto;padding:1.5rem 2rem}
.layout{display:grid;grid-template-columns:2fr 2fr minmax(280px,1fr);gap:16px;align-items:start}
.main-content{min-width:0}
.picker-sidebar{min-width:0;position:sticky;top:16px}.alert-sidebar{min-width:0;position:sticky;top:16px}
.alert-sidebar-inner{background:#fff;border:1px solid #E0DED8;border-radius:12px;overflow:hidden}
.alert-sidebar-header{background:#C0392B;color:#fff;padding:10px 14px;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:space-between}
.alert-sidebar-body{overflow-y:auto;max-height:min(46vh,520px)}.dragging{opacity:0.4!important}.drag-over{border:2px dashed #C0392B!important;background:#FADBD8!important}
.alert-item{padding:10px 14px;border-bottom:1px solid #F1EFE8;font-size:12px}
.alert-item:last-child{border-bottom:none}
.alert-item.shortage{background:#fff;border-left:3px solid #FAC775}
.alert-item.info{background:#F0F7FF;border-left:3px solid #B5D4F4}
button{font-family:inherit;cursor:pointer}
input,textarea,select{font-family:inherit;font-size:15px;border:1px solid #ccc;border-radius:6px;padding:8px 11px;outline:none;background:#fff;width:100%}
input:focus,textarea:focus,select:focus{border-color:#C0392B;box-shadow:0 0 0 2px rgba(192,57,43,.15)}
.btn{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;padding:9px 16px;border-radius:8px;border:none;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn:disabled{opacity:.5;cursor:not-allowed}
.bp{background:#C0392B;color:#fff}.bs{background:#F1EFE8;color:#444;border:1px solid #D3D1C7}.bg{background:transparent;color:#555;border:1px solid #ccc}.bd{background:#922B21;color:#fff}
.badge{display:inline-flex;align-items:center;font-size:12px;font-weight:500;padding:3px 10px;border-radius:20px;white-space:nowrap}
.card{background:#fff;border:1px solid #E0DED8;border-radius:12px;overflow:hidden}
.tabs{display:flex;border-bottom:2px solid #E0DED8;margin-bottom:20px;overflow-x:visible;flex-wrap:wrap}
.tab{flex-shrink:0;padding:12px 20px;font-size:15px;background:transparent;border:none;border-bottom:3px solid transparent;color:#888;cursor:pointer;margin-bottom:-2px;white-space:nowrap}
.tab.on{color:#C0392B;font-weight:600;border-bottom-color:#C0392B}
.spin{width:20px;height:20px;border:2px solid #FADBD8;border-top-color:#C0392B;border-radius:50%;animation:sp .7s linear infinite;flex-shrink:0;display:inline-block}
@keyframes sp{to{transform:rotate(360deg)}}
.ticket{background:#fff;border:1px solid #E0DED8;border-radius:10px;margin-bottom:10px}
.thead{display:flex;align-items:center;gap:12px;padding:14px 18px;cursor:pointer;flex-wrap:wrap}
.tbody{border-top:1px solid #F1EFE8;padding:14px 18px;display:none}
.irow{padding:12px 14px;border:1px solid #E0DED8;border-radius:8px;margin-bottom:6px;background:#FAFAF8}
.irow.done{background:#EAF3DE;border-color:#C0DD97}
.pbar{height:6px;background:#F1EFE8;border-radius:3px;overflow:hidden;flex:1;min-width:60px}
.pfill{height:100%;border-radius:3px;transition:width .3s}
.empty{text-align:center;padding:60px 20px;color:#888}
.empty .ei{font-size:44px;margin-bottom:10px}
.empty .et{font-size:17px;font-weight:500;color:#444;margin-bottom:6px}
.mo{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:200;display:flex;align-items:center;justify-content:center;padding:16px}
.md{background:#fff;border-radius:14px;padding:24px;width:100%;max-width:540px;max-height:88vh;overflow-y:auto;display:flex;flex-direction:column;gap:14px}
.mdtitle{font-size:18px;font-weight:600;display:flex;align-items:center;justify-content:space-between}
.xbtn{background:none;border:none;font-size:26px;color:#888;cursor:pointer;line-height:1;padding:0}
.fl{display:flex;flex-direction:column;gap:5px}
.fl label{font-size:12px;font-weight:500;color:#555}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ss{background:#fff;border:1px solid #E0DED8;border-radius:10px;padding:16px;margin-bottom:12px}
.ss h3{font-size:14px;font-weight:600;color:#C0392B;border-bottom:1px solid #F1EFE8;padding-bottom:8px;margin-bottom:12px}
/* EX-7-STRUCT (v5.0.0): admin sub-tab strip — lives inside vAdmin only */
.subtabs{display:flex;border-bottom:1px solid #E0DED8;margin-bottom:20px;flex-wrap:wrap;gap:0}
.subtab{flex-shrink:0;padding:8px 14px;font-size:13px;background:transparent;border:none;border-bottom:2px solid transparent;color:#888;cursor:pointer;margin-bottom:-1px;white-space:nowrap}
.subtab.on{color:#444;font-weight:600;border-bottom-color:#444}
.subtab:hover:not(.on){color:#555;border-bottom-color:#ccc}
/* EX-7-STRUCT (v5.0.0): admin full-width shell — replaces .layout grid when ST.view==='admin' */
.admin-fullwidth{width:100%}
/* Login */
.lwrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#F7F6F2;padding:1rem}
.lcard{background:#fff;border-radius:16px;padding:36px 32px;width:100%;max-width:400px;border:1px solid #E0DED8;box-shadow:0 4px 24px rgba(0,0,0,.08)}
.pkey{padding:16px;font-size:20px;font-weight:500;background:#F7F6F2;border:1px solid #E0DED8;border-radius:10px;text-align:center;cursor:pointer;width:100%}
.pkey:hover{background:#F1EFE8}.pkey:active{background:#FADBD8}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}

/* ── View-header strip (session 7, 2026-05-24) ────────────────
   Used by picker sidebar, alerts/notes sidebar, and the six
   main-content view headers (Upload, Staging, Active,
   Pulled/Verify, Ready DDMS, On Hold). The red underline is
   the visual anchor; .view-sub is the optional gray
   description line below the bar. */
.view-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:6px; font-size:12px; font-weight:600; color:#888;
  text-transform:uppercase; letter-spacing:1px;
  margin-bottom:8px; padding-bottom:6px;
  border-bottom:2px solid #C0392B;
}
.view-sub{
  font-size:13px; color:#888; margin:-2px 0 14px 0;
}
