
:root{
  --bg:#090705;
  --paper:#120d0b;
  --panel:#1a1310;
  --line:rgba(232,214,196,.1);
  --ink:#efe2d4;
  --muted:#b59f8b;
  --accent:#9f7a54;
  --ok:#2cbc65;
  --off:#ea5745;
  --call:#3985ff;
  --warn:#f19626;
  --shadow:0 28px 70px rgba(0,0,0,.36);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
.dashboard-shell{min-height:100vh;padding:18px 18px 110px}
.access-shell{min-height:100vh;padding:28px 18px 120px;display:grid;place-items:center}
.topbar{
  display:flex;justify-content:space-between;gap:18px;align-items:flex-start;
  position:sticky;top:12px;z-index:40;padding:20px 22px;border-radius:28px;
  background:rgba(18,13,11,.92);backdrop-filter:blur(14px);border:1px solid var(--line);box-shadow:var(--shadow)
}
.brand strong{display:block;font:400 34px/1 Georgia,'Times New Roman',serif}
.brand span{display:block;margin-top:6px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.top-actions,.card-actions,.button-row,.toggle-row,.access-actions{display:flex;gap:10px;flex-wrap:wrap}
.menu-wrap{position:relative}
.menu-toggle{
  width:52px;height:52px;border-radius:50%;border:1px solid rgba(239,226,212,.14);background:rgba(23,16,12,.88);
  color:var(--ink);font-size:26px;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer
}
.menu-panel{
  position:absolute;right:0;top:64px;z-index:95;min-width:240px;padding:14px;border-radius:24px;background:rgba(18,13,11,.98);
  border:1px solid var(--line);box-shadow:var(--shadow);display:grid;gap:10px
}
.menu-panel[hidden]{display:none}
.btn,.nav-chip,.cta{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 16px;border-radius:999px;border:1px solid rgba(239,226,212,.14);
  background:rgba(23,16,12,.78);color:var(--ink);font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;transition:.18s ease;cursor:pointer
}
.btn:hover,.nav-chip:hover,.cta:hover,.btn:focus-visible,.nav-chip:focus-visible,.cta:focus-visible,.menu-toggle:hover,.menu-toggle:focus-visible{
  outline:none;transform:translateY(-1px);background:var(--accent);color:#fff;border-color:var(--accent)
}
.layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:20px}
.sidebar,.panel,.hero-panel,.list-card,.summary-card,.access-card,.access-side{
  background:var(--paper);border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow)
}
.sidebar,.panel,.hero-panel,.access-card,.access-side{padding:24px}
.sidebar h2,.panel h2,.hero-panel h1,.summary-card strong,.section-title,.access-card h1,.access-side h2{
  margin:0 0 14px;font:400 34px/1 Georgia,'Times New Roman',serif
}
.hero-panel h1,.access-card h1,.access-side h2{font-size:48px}
.sidebar p,.panel p,.helper,.summary-card span,.list-card span{color:var(--muted);line-height:1.65}
.side-links,.access-list{display:grid;gap:10px}
.side-links a,.access-list article{
  padding:14px 16px;border-radius:18px;background:var(--panel);border:1px solid rgba(239,226,212,.08);font-weight:700
}
.main-stack{display:grid;gap:20px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.summary-card{padding:18px}
.summary-card strong{display:block;font-size:38px;margin-bottom:8px}
.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.module-card,.list-card{
  padding:20px;border-radius:26px;background:var(--panel);border:1px solid rgba(239,226,212,.08)
}
.module-card h3,.list-card strong{margin:0 0 10px;font:400 28px/1 Georgia,'Times New Roman',serif}
.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.field-grid.single{grid-template-columns:1fr}
label{display:grid;gap:8px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:700}
input,select,textarea{
  width:100%;padding:14px 16px;border-radius:18px;border:1px solid rgba(239,226,212,.14);background:#17110e;color:var(--ink)
}
textarea{min-height:110px;resize:vertical}
.list-grid{display:grid;gap:12px;margin-top:16px}
.list-card a{font-weight:700;text-decoration:underline}
.table-shell{overflow-x:hidden}
.schedule-table{width:100%;border-collapse:separate;border-spacing:10px;margin-top:14px;table-layout:fixed}
.schedule-table th,.schedule-table td{vertical-align:top}
.schedule-table th{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:0 4px 8px}
.employee-name{padding:14px 12px;border-radius:20px;background:var(--panel);font-weight:700;border:1px solid rgba(239,226,212,.08)}
.day-cell{padding:10px;border-radius:20px;background:var(--panel);border:1px solid rgba(239,226,212,.08);min-height:108px}
.state-btn{
  width:100%;border:0;border-radius:999px;padding:10px 12px;color:#fff;font-size:11px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;cursor:pointer
}
.state-off{background:var(--off)}
.state-on{background:var(--ok)}
.state-call{background:var(--call)}
.shift-note{display:block;margin-top:10px;font-size:12px;line-height:1.45;color:var(--ink)}
.kpi-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpi{padding:16px;border-radius:20px;background:var(--panel);border:1px solid rgba(239,226,212,.08)}
.kpi strong{display:block;font-size:30px;margin-bottom:6px;font-family:Georgia,'Times New Roman',serif}
.action-pill{
  padding:12px 14px;border-radius:999px;border:1px solid rgba(241,150,38,.42);background:#f19626;color:#120d0b;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase
}
.action-pill:hover,.action-pill:focus-visible{outline:none;background:#ffad4b;color:#120d0b;border-color:#ffad4b}
.detail-grid{display:grid;grid-template-columns:1fr .95fr;gap:18px}
.invoice-sheet{background:#fff;color:#16110f;border-radius:26px;padding:28px;border:1px solid #ddd0c1}
.invoice-sheet header{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;border-bottom:1px solid #ddd0c1;padding-bottom:12px;margin-bottom:18px}
.invoice-sheet table{width:100%;border-collapse:collapse}
.invoice-sheet th,.invoice-sheet td{text-align:left;padding:10px 0;border-bottom:1px solid #ddd0c1}
.access-grid{width:min(1180px,100%);display:grid;grid-template-columns:1.05fr .95fr;gap:20px}
.access-side{background:linear-gradient(180deg,rgba(159,122,84,.18),rgba(18,13,11,.96))}
.access-kicker{display:block;margin-bottom:14px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.map-panel{
  position:relative;min-height:420px;border-radius:28px;overflow:hidden;
  background:#e6e1d8;border:1px solid rgba(239,226,212,.08)
}
.map-panel iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;filter:saturate(.88) contrast(.96)
}
.tracking-overlay{
  position:absolute;inset:0;pointer-events:none
}
.map-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.14) 1px, transparent 1px);
  background-size:58px 58px;
  opacity:.03
}
.map-road{
  position:absolute;background:rgba(246,243,238,.86);border:1px solid rgba(100,92,82,.12);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)
}
.map-road.major{height:18px;border-radius:999px}
.map-road.minor{height:10px;border-radius:999px;opacity:.88}
.map-zone{
  position:absolute;padding:8px 10px;border-radius:12px;background:rgba(18,13,11,.78);
  color:#f6efe8;font-size:10px;letter-spacing:.16em;text-transform:uppercase;border:1px solid rgba(239,226,212,.16)
}
.map-water{
  position:absolute;border-radius:24px;background:linear-gradient(180deg,rgba(109,167,214,.58),rgba(70,129,179,.76));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)
}
.map-dot{position:absolute;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:8px}
.map-dot span{width:18px;height:18px;border-radius:50%;background:var(--call);box-shadow:0 0 0 8px rgba(57,133,255,.18)}
.map-dot strong{padding:8px 10px;border-radius:999px;background:rgba(18,13,11,.92);border:1px solid var(--line);font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.floating-stack{position:fixed;right:20px;bottom:20px;z-index:70;display:grid;gap:10px;justify-items:end}
.back-link{
  display:inline-flex;align-items:center;justify-content:center;padding:14px 18px;border-radius:999px;border:0;
  background:linear-gradient(180deg,#67d889,#1ea95c);color:#0b2a17;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 26px 40px rgba(17,73,40,.25)
}
[data-toast]{position:fixed;left:18px;bottom:18px;z-index:70;padding:14px 18px;border-radius:18px;background:rgba(20,14,11,.96);border:1px solid var(--line);box-shadow:var(--shadow)}
@media (max-width:1180px){
  .layout,.hero-grid,.detail-grid,.summary-grid,.module-grid,.kpi-row,.field-grid,.access-grid{grid-template-columns:1fr}
}
