:root{
  --b:#00B2FF;
  --bl:#7BE8FF;
  --bd:#003B73;
  --bg0:#05070A;
  --bg1:#0A1622;
  --bg2:#0F2233;
  --w:#FFFFFF;
  --w90:rgba(255,255,255,.90);
  --w75:rgba(255,255,255,.75);
  --w50:rgba(255,255,255,.50);
  --bdr:rgba(0,178,255,.13);
  --bdrm:rgba(0,178,255,.28);
  --bdrb:rgba(0,178,255,.55);
  --glow:0 0 12px rgba(0,178,255,.6),0 0 30px rgba(0,178,255,.35);
  --gbox:0 0 20px rgba(0,178,255,.18),0 0 60px rgba(0,178,255,.07);
  --shadow-xl:0 24px 60px rgba(0,0,0,.35);
  --blur:blur(14px);
  --good:#49d996;
  --warn:#ffc45c;
  --bad:#ff6b75;
  --radius:18px;
}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg0);color:var(--w);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
body{
  background:
    radial-gradient(circle at 12% 0%,rgba(0,178,255,.14),transparent 34%),
    radial-gradient(circle at 92% 18%,rgba(0,59,115,.22),transparent 32%),
    linear-gradient(180deg,var(--bg0) 0%,#07111A 48%,var(--bg0) 100%);
  background-attachment:fixed;
}
button,input,textarea,select{font:inherit}
button{-webkit-tap-highlight-color:transparent}

.shell{max-width:1080px;margin:0 auto;min-height:100vh;padding:18px 16px 96px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px;padding:4px 2px}
.brand{font-weight:900;letter-spacing:-.035em;font-size:22px;color:var(--w)}
.brand span{color:var(--b);text-shadow:var(--glow)}
.small{font-size:13px;color:var(--w50)}
.muted{color:var(--w50)}

.btn{
  border:1px solid rgba(123,232,255,.28);
  border-radius:13px;
  padding:12px 16px;
  background:linear-gradient(180deg,#0bc0ff 0%,var(--b) 100%);
  color:#00111B;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,178,255,.20),inset 0 1px rgba(255,255,255,.28);
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,filter .16s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 30px rgba(0,178,255,.28),var(--glow)}
.btn:active{transform:translateY(0);filter:brightness(.95)}
.btn.secondary{background:rgba(15,34,51,.72);color:var(--w90);border:1px solid var(--bdrm);box-shadow:none;backdrop-filter:var(--blur)}
.btn.secondary:hover{border-color:var(--bdrb);box-shadow:var(--gbox)}
.btn.danger{background:rgba(94,23,33,.48);color:#ffbdc3;border-color:rgba(255,107,117,.28);box-shadow:none}
.btn.block{width:100%}

.grid{display:grid;gap:14px}
.grid.stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(15,34,51,.82),rgba(10,22,34,.84));
  border:1px solid var(--bdrm);
  border-radius:var(--radius);
  padding:16px;
  box-shadow:var(--gbox),var(--shadow-xl);
  backdrop-filter:var(--blur);
}
.card:before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(123,232,255,.45),transparent);pointer-events:none}
.stat strong{font-size:29px;display:block;margin-top:4px;color:var(--w);letter-spacing:-.035em}

.section-title{display:flex;align-items:center;justify-content:space-between;margin:25px 0 10px;gap:12px}
.section-title h2{font-size:18px;margin:0;color:var(--w90);letter-spacing:-.02em}
.list{display:grid;gap:10px}
.job{
  display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;
  border-color:var(--bdr);
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.job:hover{border-color:var(--bdrb);transform:translateY(-1px);box-shadow:var(--gbox)}
.job h3{margin:0 0 6px;font-size:16px;color:var(--w90)}
.job-meta{display:flex;flex-wrap:wrap;gap:7px;color:var(--w50);font-size:13px}

.pill{display:inline-flex;align-items:center;border-radius:999px;padding:6px 9px;font-size:12px;font-weight:800;background:rgba(0,178,255,.10);border:1px solid var(--bdr);color:var(--bl)}
.pill.good{background:rgba(73,217,150,.10);border-color:rgba(73,217,150,.24);color:#8ff2bd}
.pill.warn{background:rgba(255,196,92,.10);border-color:rgba(255,196,92,.24);color:#ffd98f}
.pill.bad{background:rgba(255,107,117,.10);border-color:rgba(255,107,117,.24);color:#ffb1b7}

.nav{
  position:fixed;left:50%;transform:translateX(-50%);bottom:12px;width:min(680px,calc(100% - 24px));
  display:grid;grid-template-columns:repeat(4,1fr);
  background:rgba(5,12,18,.86);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border:1px solid var(--bdrm);border-radius:19px;padding:7px;z-index:50;
  box-shadow:0 18px 50px rgba(0,0,0,.42),var(--gbox);
}
.nav button{border:0;background:none;color:var(--w50);padding:10px 6px;border-radius:12px;font-size:12px;font-weight:800;cursor:pointer}
.nav button.active{background:linear-gradient(180deg,rgba(0,178,255,.16),rgba(0,178,255,.08));color:var(--bl);box-shadow:inset 0 0 0 1px var(--bdrm),0 0 20px rgba(0,178,255,.08)}

.form{display:grid;gap:12px}
.field{display:grid;gap:6px}
.field label{font-size:13px;color:var(--w75);font-weight:800}
.field input,.field textarea,.field select,.search{
  width:100%;border:1px solid var(--bdrm);border-radius:12px;padding:12px;
  background:rgba(5,13,20,.78);color:var(--w90);outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.field input::placeholder,.field textarea::placeholder,.search::placeholder{color:rgba(255,255,255,.32)}
.field input:focus,.field textarea:focus,.field select:focus,.search:focus{border-color:var(--bdrb);box-shadow:0 0 0 3px rgba(0,178,255,.09),0 0 22px rgba(0,178,255,.08);background:rgba(7,20,30,.92)}
.field textarea{min-height:92px;resize:vertical}
.field select option{background:var(--bg1);color:var(--w)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.login{min-height:90vh;display:grid;place-items:center;padding:24px 0}
.loginbox{width:min(430px,100%)}
.loginbox.card{padding:24px;background:linear-gradient(180deg,rgba(15,34,51,.86),rgba(5,12,18,.92));border-color:var(--bdrm)}
.loginbox .hero{font-size:36px;font-weight:950;letter-spacing:-.055em;margin:0 0 8px;color:var(--w)}
.loginbox .hero span{color:var(--b);text-shadow:var(--glow)}

.photos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.photo{aspect-ratio:1;border-radius:12px;overflow:hidden;border:1px solid var(--bdrm);background:var(--bg2);box-shadow:0 8px 22px rgba(0,0,0,.22)}
.photo img{width:100%;height:100%;object-fit:cover}
.empty{padding:28px;text-align:center;color:var(--w50)}

.detail-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.detail-head h1{font-size:24px;margin:0 0 6px;color:var(--w);letter-spacing:-.035em}
.kv{display:grid;grid-template-columns:120px 1fr;gap:10px;font-size:14px;padding:10px 0;border-bottom:1px solid var(--bdr)}
.kv:last-child{border-bottom:0}
.kv span:first-child{color:var(--w50)}
.actions{display:grid;gap:10px;margin-top:14px}

.toast{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:100;background:rgba(10,22,34,.96);color:var(--w90);padding:10px 14px;border:1px solid var(--bdrb);border-radius:999px;font-weight:800;box-shadow:var(--glow),var(--shadow-xl);backdrop-filter:var(--blur)}
.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,rgba(0,178,255,.18),rgba(0,59,115,.18));border:1px solid var(--bdrb);font-weight:900;color:var(--bl);box-shadow:0 0 18px rgba(0,178,255,.10)}
.toolbar{display:flex;gap:8px;flex-wrap:wrap}
.search{flex:1;min-width:180px}
.notice{border-left:3px solid var(--b);padding:12px 14px;background:rgba(0,178,255,.07);border-top:1px solid var(--bdr);border-right:1px solid var(--bdr);border-bottom:1px solid var(--bdr);border-radius:12px;color:var(--w75);font-size:13px;box-shadow:0 0 24px rgba(0,178,255,.05)}
.hr{height:1px;background:linear-gradient(90deg,transparent,var(--bdrm),transparent);margin:14px 0}

a{color:var(--bl)}
::selection{background:rgba(0,178,255,.28);color:var(--w)}

@media(max-width:700px){
  .grid.stats{grid-template-columns:1fr 1fr}
  .row{grid-template-columns:1fr}
  .job{grid-template-columns:1fr}
  .shell{padding:14px 12px 92px}
  .photos{grid-template-columns:repeat(2,1fr)}
  .kv{grid-template-columns:95px 1fr}
  .topbar{align-items:flex-start}
  .hide-mobile{display:none}
  .loginbox.card{padding:20px}
  .loginbox .hero{font-size:32px}
  .card{border-radius:16px}
}

@media(max-width:420px){
  .grid.stats{gap:10px}
  .stat strong{font-size:25px}
  .nav{bottom:8px;width:calc(100% - 16px)}
  .nav button{font-size:11px;padding:9px 4px}
}

.compact-form{margin-top:10px}
.credential-box{margin-top:14px;padding:14px;border:1px solid var(--bdrm);border-radius:14px;background:linear-gradient(180deg,rgba(0,178,255,.10),rgba(0,59,115,.12));box-shadow:var(--gbox)}
.credential-box strong{display:block;font-size:1.05rem;margin:2px 0 10px}
.credential-row{display:grid;grid-template-columns:145px 1fr;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--bdr)}
.credential-row code{display:block;overflow-wrap:anywhere;color:var(--bl);background:rgba(0,0,0,.22);padding:7px 9px;border-radius:9px}
@media(max-width:640px){.credential-row{grid-template-columns:1fr;gap:4px}}


/* V4 operations controls */
.filter-select{flex:0 0 170px;min-width:150px}
.section-title.tight{margin:0 0 12px}
.admin-panel{border-color:var(--bdrb)}
.admin-controls-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}
.grow{flex:1;min-width:220px}
.assignment-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.employee-card{display:flex;align-items:center;justify-content:space-between;gap:14px}
.employee-main{display:flex;align-items:center;gap:12px;min-width:0}
.employee-main h3{margin:0 0 5px}
.employee-actions{display:flex;gap:8px;flex-wrap:wrap}
.account-card{margin-top:14px}
.account-card h3{margin-top:4px}
.password-button-field{justify-content:end}
button:disabled{opacity:.55;cursor:not-allowed;transform:none!important;box-shadow:none!important}

@media(max-width:700px){
  .admin-controls-row{display:grid;grid-template-columns:1fr}
  .assignment-actions{display:grid;grid-template-columns:1fr 1fr}
  .assignment-actions .btn:last-child:nth-child(odd){grid-column:1/-1}
  .employee-card{align-items:flex-start;flex-direction:column}
  .employee-actions{width:100%}
  .employee-actions .btn{width:100%}
  .filter-select{flex:1 1 100%;min-width:100%}
}


/* V5.1 employee self-dispatch + clear photo delete control */
.photo{position:relative;overflow:hidden;aspect-ratio:auto;display:flex;flex-direction:column}
.photo img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.photo-delete{position:static;width:100%;height:auto;border:0;border-top:1px solid rgba(255,255,255,.10);border-radius:0;background:rgba(5,7,10,.94);color:#ffb0b0;font-size:13px;font-weight:800;line-height:1.2;padding:11px 10px;cursor:pointer;letter-spacing:.01em}
.photo-delete:hover{background:rgba(255,80,80,.10);color:#fff;border-top-color:rgba(255,120,120,.35);box-shadow:none}
@media(max-width:720px){.photo-delete{height:auto;font-size:14px;padding:12px 10px}}

/* V6 Elite Ops */
.nav.admin-nav{grid-template-columns:repeat(5,1fr)}
.dispatch-board{display:grid;grid-template-columns:repeat(4,minmax(250px,1fr));gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity}
.dispatch-col{min-height:380px;background:rgba(5,13,20,.48);border:1px solid var(--bdr);border-radius:16px;padding:10px;scroll-snap-align:start}
.dispatch-head{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 10px;font-size:13px;font-weight:900;color:var(--w75);text-transform:uppercase;letter-spacing:.04em}
.dispatch-head b{display:grid;place-items:center;min-width:26px;height:26px;border-radius:999px;background:rgba(0,178,255,.10);border:1px solid var(--bdrm);color:var(--bl)}
.dispatch-list{display:grid;gap:8px}.dispatch-list .job{padding:12px;display:grid;grid-template-columns:1fr}.dispatch-list .job .pill{justify-self:start}.dispatch-empty{padding:28px 10px;text-align:center;color:var(--w50);font-size:13px}
.dispatch-col.unassigned{border-color:rgba(255,107,117,.18)}.dispatch-col.progress{border-color:rgba(255,196,92,.18)}.dispatch-col.complete{border-color:rgba(73,217,150,.18)}
.ops-section{margin-top:14px}.evidence-section{margin-top:18px}.photo-empty{grid-column:1/-1}.job-summary{border-color:var(--bdrb)}
.checklist{display:grid;gap:8px}.check-row{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid var(--bdr);border-radius:12px;background:rgba(5,13,20,.46);cursor:pointer}.check-row input{width:18px;height:18px;accent-color:var(--b)}.check-row.done{border-color:rgba(73,217,150,.22);background:rgba(73,217,150,.06)}.check-row.done span{text-decoration:line-through;color:var(--w50)}
.issue-list{display:grid;gap:8px}.issue-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px;border:1px solid rgba(255,196,92,.20);border-radius:12px;background:rgba(255,196,92,.05)}.issue-row.resolved{border-color:rgba(73,217,150,.18);background:rgba(73,217,150,.04)}.issue-row p{margin:4px 0 6px;color:var(--w75)}.btn.mini{padding:8px 10px;font-size:12px}
.timeline{display:grid;gap:0}.timeline-row{display:grid;grid-template-columns:18px 1fr;gap:8px;position:relative;padding:9px 0}.timeline-row:not(:last-child):before{content:"";position:absolute;left:6px;top:22px;bottom:-4px;width:1px;background:var(--bdrm)}.timeline-dot{width:12px;height:12px;border-radius:50%;background:var(--b);box-shadow:0 0 14px rgba(0,178,255,.4);margin-top:3px}.timeline-row b{font-size:13px;color:var(--w75)}
.client-card{display:grid;gap:12px}.client-top,.client-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.client-top h3{margin:0 0 6px}.fleet-assets{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}.fleet-unit{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--bdr);border-radius:11px;background:rgba(5,13,20,.42)}.fleet-unit b{font-size:13px}.fleet-unit span{font-size:12px;color:var(--w50)}
@media(max-width:900px){.dispatch-board{grid-template-columns:repeat(4,280px)}.dispatch-col{min-height:300px}}
@media(max-width:700px){.nav.admin-nav{grid-template-columns:repeat(5,1fr)}.nav.admin-nav button{font-size:10px}.client-top,.client-footer{align-items:flex-start;flex-direction:column}.client-footer .btn{width:100%}.issue-row{flex-direction:column}.dispatch-board{margin-left:-2px;margin-right:-2px}}


/* V6.1 dashboard polish */
.dashboard-hero{
  display:grid;
  grid-template-columns:1.25fr .95fr;
  gap:18px;
  padding:22px;
  border-color:var(--bdrb);
  background:
    radial-gradient(circle at right top, rgba(0,178,255,.14), transparent 34%),
    linear-gradient(180deg, rgba(15,34,51,.94), rgba(6,13,20,.98));
}
.hero-copy h1{margin:0 0 10px;font-size:30px;line-height:1;letter-spacing:-.045em;color:var(--w)}
.hero-copy p{margin:0;color:var(--w75);max-width:620px;line-height:1.5}
.eyebrow{display:inline-block;margin-bottom:10px;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--bl)}
.hero-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.hero-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-content:start}
.mini-stat{
  padding:16px 16px 14px;
  border-radius:16px;
  border:1px solid var(--bdrm);
  background:rgba(7,17,26,.78);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.mini-stat span{display:block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--w50);margin-bottom:6px}
.mini-stat strong{font-size:34px;line-height:1;color:var(--w);letter-spacing:-.05em}
.dashboard-title{margin-top:18px}
.dashboard-tools{justify-content:flex-end}
.dispatch-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;overflow:visible;padding-bottom:0;scroll-snap-type:none}
.dispatch-col{
  min-height:340px;
  padding:12px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(8,19,29,.72),rgba(5,13,20,.56));
  box-shadow:var(--shadow-xl), inset 0 1px 0 rgba(255,255,255,.02);
}
.dispatch-head{padding:4px 4px 12px;align-items:flex-start}
.dispatch-head>div{display:grid;gap:4px}
.dispatch-head span{font-size:14px;color:var(--w90)}
.dispatch-head small{font-size:12px;line-height:1.35;color:var(--w50)}
.dispatch-head b{min-width:32px;height:32px;font-size:13px}
.dispatch-list{gap:10px}
.dispatch-list .job{
  padding:14px;
  border-radius:14px;
  background:rgba(6,15,23,.72);
  border-color:rgba(255,255,255,.06);
}
.dispatch-list .job h3{font-size:15px;line-height:1.25}
.dispatch-list .job .job-meta{row-gap:6px}
.dispatch-empty{
  min-height:150px;
  display:grid;
  place-items:center;
  border:1px dashed var(--bdr);
  border-radius:14px;
  background:rgba(255,255,255,.02);
}
.dispatch-col.unassigned{background:linear-gradient(180deg,rgba(46,15,20,.42),rgba(10,18,26,.74));border-color:rgba(255,107,117,.22)}
.dispatch-col.unassigned .dispatch-head b{background:rgba(255,107,117,.12);border-color:rgba(255,107,117,.26);color:#ffb5bb}
.dispatch-col.assigned{background:linear-gradient(180deg,rgba(9,22,34,.8),rgba(10,18,26,.74));}
.dispatch-col.assigned .dispatch-head b{background:rgba(0,178,255,.12)}
.dispatch-col.progress{background:linear-gradient(180deg,rgba(45,30,6,.36),rgba(10,18,26,.74));border-color:rgba(255,196,92,.24)}
.dispatch-col.progress .dispatch-head b{background:rgba(255,196,92,.12);border-color:rgba(255,196,92,.28);color:#ffd98f}
.dispatch-col.complete{background:linear-gradient(180deg,rgba(10,37,26,.36),rgba(10,18,26,.74));border-color:rgba(73,217,150,.22)}
.dispatch-col.complete .dispatch-head b{background:rgba(73,217,150,.12);border-color:rgba(73,217,150,.28);color:#8ff2bd}

@media(max-width:900px){
  .dashboard-hero{grid-template-columns:1fr}
  .hero-copy h1{font-size:26px}
  .dispatch-board{grid-template-columns:1fr}
}
@media(max-width:640px){
  .dashboard-hero{padding:18px}
  .hero-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mini-stat strong{font-size:28px}
}


/* V6.2.1 mobile authentication hardening */
.login-error{
  margin-top:14px;
  padding:11px 12px;
  border-radius:12px;
  border:1px solid rgba(255,107,117,.28);
  background:rgba(255,107,117,.08);
  color:#ffc0c5;
  font-size:13px;
  line-height:1.4;
}
.password-wrap{position:relative}
.password-wrap input{padding-right:76px!important}
.password-toggle{
  position:absolute;right:7px;top:50%;transform:translateY(-50%);
  border:0;border-radius:9px;padding:7px 10px;
  background:rgba(0,178,255,.10);color:var(--bl);
  font-weight:900;font-size:12px;cursor:pointer;
}
.login-help{margin-top:14px;color:var(--w50);font-size:12px;line-height:1.5}
.loginbox .btn.block + .btn.block{margin-top:2px}
@media(max-width:700px){
  .login{min-height:100svh;padding:16px 0}
  .loginbox{width:100%}
  .loginbox.card,.loginbox .card{padding:22px 18px}
  .field input{font-size:16px} /* prevents iOS zoom */
  .btn.block{min-height:48px}
}


/* V6.2.2 startup stability */
.boot-card{text-align:center;padding:30px!important}
.boot-spinner{
  width:34px;height:34px;margin:18px auto 14px;border-radius:50%;
  border:3px solid rgba(255,255,255,.12);border-top-color:var(--b);
  animation:lmspin .8s linear infinite;
}
@keyframes lmspin{to{transform:rotate(360deg)}}