:root{
  --brand:#0f5132;
  --brand-dark:#0a3d25;
  --brand-light:#e8f5ee;
  --done:#198754;
  --pending:#6c757d;
  --warning:#ffc107;
  --broken:#dc3545;
  --engineering:#0d6efd;
  --bg:#f4f6f5;
  --card:#ffffff;
  --text:#212529;
  --radius:14px;
}
*{box-sizing:border-box;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  padding-bottom:76px;
}
a{text-decoration:none;}

/* Top bar */
.topbar{
  background:var(--brand);
  color:#fff;
  padding:14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky; top:0; z-index:50;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.topbar .brand{font-weight:700;font-size:1rem;display:flex;align-items:center;gap:8px;}
.topbar .user-chip{font-size:.8rem;background:rgba(255,255,255,.15);padding:6px 10px;border-radius:20px;}

.container-app{max-width:960px;margin:0 auto;padding:16px;}

/* Cards */
.card-app{
  background:var(--card);
  border-radius:var(--radius);
  box-shadow:0 1px 4px rgba(0,0,0,.06);
  padding:18px;
  margin-bottom:16px;
  border:1px solid #eef0ef;
}
.stat-card{
  background:var(--card);
  border-radius:var(--radius);
  padding:16px;
  text-align:center;
  border:1px solid #eef0ef;
}
.stat-card .num{font-size:1.6rem;font-weight:700;color:var(--brand);}
.stat-card .lbl{font-size:.78rem;color:#6c757d;}

/* Big mobile buttons */
.btn-big{
  display:block;
  width:100%;
  padding:16px;
  border-radius:var(--radius);
  border:none;
  font-size:1.05rem;
  font-weight:600;
  text-align:center;
  cursor:pointer;
}
.btn-primary-app{background:var(--brand);color:#fff;}
.btn-primary-app:active{background:var(--brand-dark);}
.btn-outline-app{background:#fff;border:2px solid var(--brand);color:var(--brand);}

/* Badges - color rules per spec */
.badge-app{display:inline-block;padding:4px 10px;border-radius:20px;font-size:.75rem;font-weight:600;}
.badge-done{background:#d1f2e0;color:var(--done);}
.badge-pending{background:#e9ecef;color:var(--pending);}
.badge-warning{background:#fff3cd;color:#916f00;}
.badge-broken{background:#f8d7da;color:var(--broken);}
.badge-engineering{background:#cfe2ff;color:var(--engineering);}
.badge-neutral{background:#e9ecef;color:#495057;}

/* Checklist item row */
.item-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px;
  border-radius:12px;
  background:#fff;
  border:1px solid #eef0ef;
  margin-bottom:10px;
}
.item-row.done{border-left:5px solid var(--done);}
.item-row.pending{border-left:5px solid var(--pending);}

.toggle-group{display:flex;gap:8px;}
.toggle-btn{
  border-radius:10px;
  padding:8px 14px;
  border:2px solid #dee2e6;
  background:#fff;
  font-size:.85rem;
  font-weight:600;
  cursor:pointer;
}
.toggle-btn.selected-done{background:var(--done);border-color:var(--done);color:#fff;}
.toggle-btn.selected-pending{background:var(--pending);border-color:var(--pending);color:#fff;}

/* Bottom nav (mobile) */
.bottom-nav{
  position:fixed;bottom:0;left:0;right:0;
  background:#fff;
  border-top:1px solid #e5e5e5;
  display:flex;
  justify-content:space-around;
  padding:8px 0 calc(8px + env(safe-area-inset-bottom));
  z-index:50;
}
.bottom-nav a{
  display:flex;flex-direction:column;align-items:center;gap:2px;
  color:#6c757d;font-size:.7rem;
  padding:4px 8px;
}
.bottom-nav a.active{color:var(--brand);font-weight:700;}
.bottom-nav svg{width:22px;height:22px;}

/* Forms */
.form-app label{font-weight:600;font-size:.85rem;margin-bottom:4px;display:block;}
.form-app .form-control, .form-app select, .form-app textarea{
  width:100%;padding:10px 12px;border-radius:10px;border:1px solid #ced4da;
  margin-bottom:14px;font-size:.95rem;
}
.form-app .form-control:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-light);}

/* Table (desktop dashboards) */
.table-app{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;}
.table-app th, .table-app td{padding:10px 12px;text-align:left;font-size:.85rem;border-bottom:1px solid #f0f0f0;}
.table-app th{background:var(--brand-light);color:var(--brand-dark);}
.table-responsive-app{overflow-x:auto;border-radius:var(--radius);border:1px solid #eef0ef;}

/* Empty state */
.empty-state{text-align:center;padding:40px 20px;color:#6c757d;}
.empty-state svg{width:64px;height:64px;opacity:.4;margin-bottom:10px;}

/* Scanner */
#scanner-box{border-radius:var(--radius);overflow:hidden;border:2px dashed var(--brand);}

.alert-app{padding:12px 16px;border-radius:10px;margin-bottom:14px;font-size:.88rem;}
.alert-success{background:#d1f2e0;color:var(--done);}
.alert-danger{background:#f8d7da;color:var(--broken);}
.alert-warning{background:#fff3cd;color:#916f00;}

.filter-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.filter-bar select, .filter-bar input{
  padding:8px 10px;border-radius:8px;border:1px solid #ced4da;font-size:.82rem;
}

.pagination-app{display:flex;gap:6px;justify-content:center;margin-top:16px;flex-wrap:wrap;}
.pagination-app a, .pagination-app span{
  padding:6px 12px;border-radius:8px;background:#fff;border:1px solid #dee2e6;font-size:.82rem;color:#333;
}
.pagination-app a.active{background:var(--brand);color:#fff;border-color:var(--brand);}

.login-wrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,var(--brand) 0%,var(--brand-dark) 100%);
  padding:20px;
}
.login-card{background:#fff;border-radius:20px;padding:32px 26px;max-width:380px;width:100%;text-align:center;box-shadow:0 10px 40px rgba(0,0,0,.25);}
.login-card h1{font-size:1.15rem;margin-bottom:6px;color:var(--brand-dark);}
.login-card p{color:#6c757d;font-size:.85rem;margin-bottom:24px;}
.btn-google{
  display:flex;align-items:center;justify-content:center;gap:10px;
  border:1px solid #dadce0;background:#fff;padding:12px;border-radius:10px;
  font-weight:600;color:#3c4043;width:100%;cursor:pointer;
}