:root{
  --bg:#071226;--panel:#0b1624;--muted:#8ea6c9;--text:#e9f0fb;
  --primary:#4cc38a;--accent:#84a9ff;--border:#1b2a44;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;
  background:radial-gradient(1000px 700px at 10% -10%,#13233b 0%,#071226 35%,#071226 100%);
  color:var(--text)
}

/* Top nav */
.nav{
  display:flex;justify-content:space-between;align-items:center;
  padding:12px 16px;border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.02)
}
.nav .brand{font-weight:800}
.nav a{color:var(--text);text-decoration:none;margin-left:14px;opacity:.95}
.nav a.active{color:var(--primary)}

/* Controls */
.btn{
  background:var(--primary);color:#04210b;border:none;
  padding:12px 14px;border-radius:12px;font-weight:800;
  cursor:pointer;box-shadow:0 8px 18px rgba(0,0,0,.35)
}
.btn.secondary{background:transparent;border:1px solid var(--border);color:var(--text)}
.btn.ghost{background:transparent;border:1px solid var(--border);color:var(--text)}

.input, select, textarea{
  background:#071828;border:1px solid var(--border);color:var(--text);
  padding:10px 12px;border-radius:10px;outline:none
}

.card{
  border:1px solid var(--border);border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01));
  box-shadow:0 12px 28px rgba(0,0,0,.35);padding:16px
}
.small{color:var(--muted);font-size:13px}
.foot{border-top:1px solid var(--border);padding:16px 24px;display:flex;justify-content:space-between;align-items:center;margin-top:20px}

.wrap{max-width:1100px;margin:20px auto;padding:14px}
.hdr{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.actions{display:flex;gap:10px;align-items:end;flex-wrap:wrap}
.actions > *{flex:0 0 auto}
.actions .btn, .actions .input{min-height:40px}

/* Small screens: stack controls nicely */
@media (max-width:640px){
  .actions{flex-direction:column; align-items:stretch}
  .actions .btn, .actions select{width:100%}
}

/* Table */
.table-wrap{margin-top:12px;overflow:auto}
.table{width:100%;border-collapse:separate;border-spacing:0 10px}
.table thead th{
  font-size:12px;color:var(--muted);text-transform:uppercase;
  padding:12px 14px;text-align:left
}
.table tbody td{
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.00));
  padding:12px 14px;border:1px solid var(--border)
}
.table tbody tr td:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px}
.table tbody tr td:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px}

.blur{filter:blur(6px);opacity:.95}

/* loader dots */
@keyframes dots { 0%{content:"."} 33%{content:".."} 66%{content:"..."} 100%{content:"."} }
.loading-dots::after{ content:"."; animation:dots 1.2s steps(3, end) infinite; }

/* a11y helper label */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0
}

/* Sticky mobile download bar (only small screens) */
.mobile-download{
  position:fixed; left:0; right:0; bottom:0;
  background:linear-gradient(180deg,rgba(7,18,38,.9),rgba(7,18,38,1));
  border-top:1px solid var(--border);
  padding:10px 14px;
  display:flex; gap:10px; justify-content:center;
  z-index:9999;
}
.mobile-download .btn{ width:100%; max-width:520px; }
@media (min-width:641px){
  .mobile-download{ display:none !important; } /* hidden on larger screens */
}

/* Hide the header Download button on small screens (always) */
@media (max-width:640px){
  #downloadPdfBtn { display: none !important; }
}