:root{
  --brand:#1a6fc4;
  --brand-light:#e8f2fb;
  --green:#198754;
  --orange:#d97706;
  --red:#dc2626;
  --gray-100:#f5f7fb;
  --gray-200:#e5e7eb;
  --gray-400:#9ca3af;
  --gray-600:#4b5563;
  --gray-800:#1f2937;
}
body{
  background:#f0f4f9;
  color:var(--gray-800);
}
.site-header{
  background:linear-gradient(135deg,#1a3c6e 0%, #1a6fc4 100%);
  color:#fff;
}
.progress-labels{
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:11px;
  opacity:.9;
  flex-wrap:wrap;
}
.progress{
  height:4px;
  background:rgba(255,255,255,.25);
  border-radius:999px;
  overflow:hidden;
  margin-top:8px;
}
.progress-bar{
  background:#fff;
}
.header-badge{
  width:56px;
  height:56px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.18);
  border:2px solid rgba(255,255,255,.25);
  font-size:28px;
  flex-shrink:0;
}
.type-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.type-card{
  border:1.5px solid var(--gray-200);
  border-radius:16px;
  padding:14px 12px;
  text-align:center;
  cursor:pointer;
  user-select:none;
  background:#fff;
  min-height:88px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
}
.type-card.selected{
  border-color:var(--brand);
  background:var(--brand-light);
}
.type-card .icon{font-size:24px;line-height:1}
.type-card .label{font-size:12px;color:var(--gray-600);font-weight:600}
.section-title{font-size:1.1rem;font-weight:700;margin-bottom:.25rem}
.section-sub{color:var(--gray-600);font-size:.9rem;line-height:1.6;margin-bottom:1rem}
.form-label{font-weight:600;color:var(--gray-600);font-size:.92rem}
.form-control, .form-select{
  background:#f8fafc;
  border:1.5px solid var(--gray-200);
  border-radius:12px;
}
.form-control:focus, .form-select:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 .25rem rgba(26,111,196,.15);
}
.file-box{
  border:2px dashed #cbd5e1;
  border-radius:12px;
  background:#f8fafc;
  padding:16px;
  text-align:center;
}
.picked{
  margin-top:8px;
  font-size:.82rem;
  color:var(--green);
  font-weight:600;
  word-break:break-word;
}
.btn{
  border-radius:12px;
  font-weight:700;
}
.btn-primary{
  background:var(--brand);
  border-color:var(--brand);
}
.btn-primary:hover{
  background:#1459a8;
  border-color:#1459a8;
}
.save-bar{
  margin-top:12px;
  padding:8px 12px;
  background:#e6f6ed;
  color:var(--green);
  border-radius:10px;
  font-size:.82rem;
}
.summary{
  background:#f8fafc;
  border-radius:12px;
  padding:12px;
}
.summary-row{
  display:flex;
  gap:10px;
  padding:7px 0;
  border-bottom:1px solid var(--gray-200);
}
.summary-row:last-child{border-bottom:none}
.summary-key{min-width:120px;color:var(--gray-400);font-size:.85rem}
.summary-val{font-weight:600;word-break:break-word;flex:1}
.success-wrap{text-align:center;padding:18px 10px}
.success-wrap .tick{font-size:56px}
.success-wrap h2{margin-top:8px;font-size:1.5rem;color:var(--green)}
.ref-box{
  margin:16px auto;
  max-width:420px;
  border-radius:16px;
  background:var(--brand-light);
  color:var(--brand);
  padding:14px;
  font-weight:800;
  letter-spacing:.5px;
  word-break:break-word;
}
.request-list{
  display:grid;
  gap:14px;
}
.request-card{
  background:#fff;
  border-radius:18px;
  box-shadow:0 4px 18px rgba(0,0,0,.08);
  padding:14px;
}
.badge-soft{
  display:inline-block;
  padding:5px 10px;
  border-radius:999px;
  background:#e8f2fb;
  color:var(--brand);
  font-size:.75rem;
  font-weight:700;
}
.status-new{background:#fef3c7;color:#92400e}
.status-in-progress{background:#dbeafe;color:#1d4ed8}
.status-completed{background:#dcfce7;color:#166534}
.status-rejected{background:#fee2e2;color:#991b1b}
.meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:10px;
}
.file-list{padding-left:18px}
.file-list a{word-break:break-all}
.admin-body{
  min-height:100vh;
}
.admin-topbar{
  background:#fff;
  border-bottom:1px solid #e5e7eb;
}
pre.data{
  white-space:pre-wrap;
  background:#f8fafc;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:12px;
  margin:0;
}
.committee-member-card{
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
@media (max-width: 575px){
  .type-grid{grid-template-columns:1fr 1fr}
  .summary-row{flex-direction:column;gap:2px}
  .summary-key{min-width:0}
}