:root{
  --navy:#0A192F;
  --navy-2:#0F2340;
  --blue:#1E40AF;
  --blue-2:#2563EB;
  --cyan:#60A5FA;
  --cyan-bright:#93C5FD;
  --white:#FFFFFF;
  --ink:#0B1526;
  --slate:#5B6B85;
  --line:#E2E8F0;
  --danger:#DC2626;
  --danger-bg:#FEF2F2;
  --ok:#059669;
  --ok-bg:#ECFDF5;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:#F8FAFF;
  color:var(--ink);
  font-family:'Heebo','Rubik',sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
h1,h2,h3{ font-family:'Rubik','Heebo',sans-serif; font-weight:700; letter-spacing:-0.01em; margin:0; }
a{ color:inherit; }
.mono{ font-family:'JetBrains Mono',monospace; letter-spacing:.03em; direction:ltr; unicode-bidi:embed; display:inline-block; }

header.portal-header{
  background:var(--navy); color:#fff; padding:16px 28px;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
header.portal-header .brand{ font-family:'Rubik',sans-serif; font-weight:800; font-size:19px; letter-spacing:-0.02em; }
header.portal-header .brand span{ color:var(--cyan-bright); }
header.portal-header .who{ font-size:13.5px; color:#AFC0DA; display:flex; align-items:center; gap:14px; }
header.portal-header a.logout{
  color:#fff; text-decoration:none; border:1px solid rgba(255,255,255,.28);
  padding:7px 14px; border-radius:8px; font-size:13px; font-weight:600;
  transition:background .18s ease;
}
header.portal-header a.logout:hover{ background:rgba(255,255,255,.1); }

.page-wrap{ max-width:960px; margin:0 auto; padding:40px 24px 70px; }
.narrow{ max-width:420px; }

.center-screen{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(ellipse 120% 90% at 50% -10%, #12315c 0%, var(--navy) 55%), var(--navy);
  padding:24px;
}
.login-card{
  background:#fff; border-radius:18px; padding:38px 34px; width:100%; max-width:400px;
  box-shadow:0 30px 70px rgba(0,0,0,.35);
}
.login-card .brand-mark{
  font-family:'Rubik',sans-serif; font-weight:800; font-size:22px; color:var(--navy);
  margin-bottom:4px; text-align:center;
}
.login-card .brand-mark span{ color:var(--blue-2); }
.login-card .subtitle{ text-align:center; color:var(--slate); font-size:13.5px; margin-bottom:26px; }

label{ display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:6px; }
input[type=text], input[type=password], input[type=email], input[type=number]{
  width:100%; border:1.5px solid var(--line); border-radius:10px; padding:11px 13px;
  font-family:inherit; font-size:14.5px; background:#fff; color:var(--ink); margin-bottom:16px;
  transition:border-color .18s ease;
}
input:focus{ outline:none; border-color:var(--blue-2); }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--blue-2); color:#fff !important; border:none; border-radius:10px;
  padding:12px 20px; font-size:14.5px; font-weight:700; cursor:pointer; text-decoration:none;
  transition:background .18s ease;
}
.btn:hover{ background:var(--blue); }
.btn.block{ width:100%; }
.btn.ghost{
  background:transparent; color:var(--blue-2) !important; border:1.5px solid var(--blue-2);
}
.btn.ghost:hover{ background:#EFF4FF; }
.btn.danger{ background:var(--danger); }
.btn.danger:hover{ background:#B91C1C; }
.btn.small{ padding:7px 13px; font-size:13px; }

.alert{
  border-radius:10px; padding:12px 15px; font-size:14px; margin-bottom:18px;
}
.alert.error{ background:var(--danger-bg); color:var(--danger); border:1px solid #FCA5A5; }
.alert.ok{ background:var(--ok-bg); color:var(--ok); border:1px solid #86EFAC; }

.card{
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px 28px; margin-bottom:22px;
}
.card h2{ font-size:19px; margin-bottom:16px; }

table{ width:100%; border-collapse:collapse; }
th, td{ text-align:right; padding:11px 10px; border-bottom:1px solid var(--line); font-size:14px; }
th{ font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--slate); font-weight:600; }
tr:last-child td{ border-bottom:none; }

.file-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; }
.file-name{ font-weight:600; color:var(--ink); }
.file-meta{ font-size:12.5px; color:var(--slate); margin-top:2px; }
.file-icon{ width:34px; height:34px; border-radius:8px; background:#EFF4FF; display:flex; align-items:center; justify-content:center; color:var(--blue-2); flex:0 0 auto; }

.empty-state{ text-align:center; padding:50px 20px; color:var(--slate); }
.empty-state svg{ width:52px; height:52px; margin-bottom:16px; color:#B9C6DD; }

.back-link{ font-size:13.5px; color:var(--blue-2); text-decoration:none; display:inline-flex; align-items:center; gap:5px; margin-bottom:18px; }

.top-actions{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; margin-bottom:26px; }

.badge{
  display:inline-block; font-size:11px; font-weight:700; padding:3px 9px; border-radius:100px;
  background:#EFF4FF; color:var(--blue-2);
}
.badge.inactive{ background:#F1F5F9; color:var(--slate); }

.copy-box{
  background:var(--navy); color:#fff; border-radius:12px; padding:18px 20px; margin-top:8px;
}
.copy-box .row{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding:6px 0; font-size:14px; }
.copy-box .row b{ color:#93A5C4; font-weight:500; font-size:12.5px; }
.copy-box .row span{ font-family:'JetBrains Mono',monospace; direction:ltr; unicode-bidi:embed; color:var(--cyan-bright); font-size:15px; }