:root{
  --dash-bg:#f5f7fb;
  --dash-surface:#ffffff;
  --dash-surface-2:#f8fafc;
  --dash-border:#e7ecf3;
  --dash-text:#0f172a;
  --dash-muted:#64748b;
  --dash-primary:#2563eb;
  --dash-primary-2:#1d4ed8;
  --dash-dark:#0b1220;
  --dash-success:#16a34a;
  --dash-warning:#d97706;
  --dash-danger:#dc2626;
  --dash-shadow:0 24px 50px rgba(15,23,42,.08);
  --dash-shadow-sm:0 10px 30px rgba(15,23,42,.06);
  --dash-radius:22px;
}
body{
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at top left, rgba(37,99,235,.06), transparent 28%),
    radial-gradient(circle at top right, rgba(14,165,233,.06), transparent 22%),
    linear-gradient(180deg,#f8fbff 0%,#f4f7fb 100%);
  color:var(--dash-text);
}
.topbar{
  background:rgba(11,18,32,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 40px rgba(2,6,23,.22);
  padding:14px 0;
}
.topbar::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(96,165,250,.7),transparent);
}
.brand img{
  width:54px;height:54px;border-radius:16px;padding:6px;background:linear-gradient(180deg,#fff,#f3f7ff);box-shadow:0 10px 24px rgba(37,99,235,.18);
}
.brand h2{font-size:1.15rem;font-weight:800;letter-spacing:-.02em}
.brand small{font-size:.82rem;color:#c8d4e6}
.nav-links a,.nav-links button{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  transition:.2s ease;
}
.nav-links a:hover,.nav-links button:hover{transform:translateY(-1px);background:rgba(255,255,255,.12)}
.dashboard{padding:28px 0 44px}
.stats{
  gap:18px;
  margin-bottom:18px;
}
.stat,.card,.hero-card,.simple-auth-card{
  border:1px solid var(--dash-border);
  border-radius:var(--dash-radius);
  box-shadow:var(--dash-shadow-sm);
}
.stat{
  position:relative;
  overflow:hidden;
  padding:20px 18px;
  background:linear-gradient(180deg,#fff 0%,#f8fbff 100%);
}
.stat::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:linear-gradient(180deg,var(--dash-primary),#06b6d4);
}
.stat span{font-size:.82rem;font-weight:600;color:var(--dash-muted);text-transform:uppercase;letter-spacing:.04em}
.stat strong{font-size:2rem;line-height:1.1;letter-spacing:-.04em;color:var(--dash-text)}
.stats .stat small{font-size:.78rem}
.dashboard-shell{display:grid;grid-template-columns:290px minmax(0,1fr);gap:22px;align-items:start}
.sidebar-nav{
  position:sticky;top:92px;
  background:linear-gradient(180deg,#0f172a 0%,#131d36 100%);
  border:1px solid rgba(255,255,255,.06);
  border-radius:26px;
  box-shadow:0 24px 50px rgba(2,6,23,.18);
  padding:18px;
}
.sidebar-nav .tabs{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;overflow:visible}
.tab-btn{
  width:100%;text-align:left;padding:13px 16px;border-radius:16px;background:rgba(255,255,255,.04);color:#d9e5f7;border:1px solid rgba(255,255,255,.05);font-weight:700;
}
.tab-btn:hover{background:rgba(255,255,255,.09);transform:translateX(2px)}
.tab-btn.active{background:linear-gradient(135deg,var(--dash-primary),#0ea5e9);color:#fff;box-shadow:0 14px 30px rgba(37,99,235,.3)}
.dashboard-content{min-width:0}
.card{
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);
  padding:22px;
}
.card h3,.card h4{margin-top:0;color:var(--dash-text);letter-spacing:-.02em}
.section-header{margin-bottom:16px}
.section-header h3{margin-bottom:4px}
.table-wrap{
  border-radius:18px;
  border:1px solid var(--dash-border);
  background:#fff;
}
th{
  background:#f8fafc;
  color:#475569;
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
tr:hover td{background:#fbfdff}
input,select,textarea{
  min-height:46px;
  border-radius:14px;
  border:1px solid #dbe4ee;
  background:#fff;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.03);
}
input:focus,select:focus,textarea:focus{
  outline:0;border-color:#93c5fd;box-shadow:0 0 0 4px rgba(59,130,246,.12)
}
button,.button-link{
  border-radius:14px;
  background:linear-gradient(135deg,var(--dash-primary),var(--dash-primary-2));
  box-shadow:0 12px 24px rgba(37,99,235,.22);
  transition:.18s ease;
}
button:hover,.button-link:hover{transform:translateY(-1px)}
button.secondary,.button-link.secondary{background:#eef4ff;color:var(--dash-primary);box-shadow:none}
button.ghost{background:#fff;box-shadow:none}
.notice,.message.info{background:#eff6ff;border:1px solid #cfe0ff;color:#1d4ed8}
.message.success{background:#effdf4;border:1px solid #c9f2d4;color:#166534}
.message.error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c}
.kv{gap:12px 18px}
.kv div:nth-child(odd){font-weight:700;color:#64748b}
.badge{font-weight:800;border-radius:999px;padding:6px 12px}
.profile-photo-card,.meta-card,.admin-hub-button,.quick-access-card{
  border-radius:18px;border:1px solid var(--dash-border);background:#fff;box-shadow:var(--dash-shadow-sm)
}
.admin-hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.admin-hub-button{padding:18px;text-align:left;background:linear-gradient(180deg,#fff,#f9fbff)}
.admin-hub-title{display:block;font-weight:800;font-size:1rem;color:#0f172a;margin-bottom:4px}
.admin-hub-copy{display:block;color:#64748b;font-size:.9rem}
.simple-auth-page{
  position:relative;
  min-height:100vh;
  background:
    radial-gradient(circle at 0% 0%, rgba(37,99,235,.16), transparent 24%),
    radial-gradient(circle at 100% 0%, rgba(14,165,233,.16), transparent 20%),
    linear-gradient(180deg,#f8fbff,#f4f7fb);
}
.simple-auth-card{
  width:min(1100px,calc(100% - 32px));
  display:grid;
  grid-template-columns:minmax(280px,380px) minmax(0,1fr);
  gap:0;
  padding:0;
  text-align:left;
  overflow:hidden;
}
.simple-auth-card::before{
  content:"";
  grid-column:1;
  grid-row:1;
  background:linear-gradient(160deg,#0f172a 0%,#1d4ed8 58%,#22c55e 130%);
}
.simple-auth-card > *{position:relative;z-index:1}
.simple-auth-card > img,
.simple-auth-card > .eyebrow,
.simple-auth-card > h1,
.simple-auth-card > p,
.simple-auth-card > form,
.simple-auth-card > #verifyResult{grid-column:2}
.simple-auth-logo{width:110px;margin:38px auto 0 38px;grid-column:1;grid-row:1;filter:drop-shadow(0 14px 24px rgba(0,0,0,.15))}
.simple-auth-card h1{grid-column:2;margin:38px 38px 8px;font-size:2rem;letter-spacing:-.04em}
.simple-auth-copy,.simple-auth-card .eyebrow{grid-column:2;margin-left:38px;margin-right:38px}
.simple-auth-copy{margin-bottom:22px;font-size:1rem;line-height:1.7}
.simple-auth-card .eyebrow{margin-top:38px;margin-bottom:10px;color:var(--dash-primary);font-weight:800}
.simple-form{grid-column:2;padding:0 38px 38px}
.simple-auth-links,.simple-auth-actions{justify-content:flex-start}
.register-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
#verifyResult{margin:0 38px 38px}
.simple-auth-card::after{
  content:"Repair My Phone Today\A Staff Portal";
  white-space:pre;
  grid-column:1;grid-row:1;
  align-self:end;
  padding:0 38px 38px;
  color:#fff;
  font-size:2rem;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-.04em;
}
.simple-auth-card.register-card::after{content:"Repair My Phone Today\A New account request"}
#verifyResult.card{box-shadow:none}
.menu-toggle{display:none}
@media (max-width:1200px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1024px){.dashboard-shell{grid-template-columns:1fr}.sidebar-nav{position:relative;top:0}.sidebar-nav .tabs{flex-direction:row;overflow:auto;padding-bottom:6px}.tab-btn{width:auto;white-space:nowrap}.menu-toggle{display:inline-flex}}
@media (max-width:760px){
  .simple-auth-card{grid-template-columns:1fr}
  .simple-auth-card::before,.simple-auth-card::after,.simple-auth-logo{grid-column:1;grid-row:auto}
  .simple-auth-card::before{height:180px}
  .simple-auth-logo{margin:30px auto 0}
  .simple-auth-card::after{padding:0 24px 24px;font-size:1.5rem;align-self:end}
  .simple-auth-card > .eyebrow,.simple-auth-card > h1,.simple-auth-card > p,.simple-auth-card > form,.simple-auth-card > #verifyResult{grid-column:1}
  .simple-auth-card h1,.simple-auth-copy,.simple-auth-card .eyebrow,.simple-form,#verifyResult{margin-left:24px !important;margin-right:24px !important;padding-left:0;padding-right:0}
  .simple-auth-card h1{margin-top:24px}
  .register-form-grid,.form-grid,.grid-2,.admin-hub-grid{grid-template-columns:1fr}
}


.admin-hub-button[href="pdf-editor.html"] {
  min-height: 140px;
}

.admin-hub-button[href="pdf-editor.html"] .admin-hub-title {
  font-size: 1.05rem;
}

.apps-grid{grid-template-columns:minmax(260px,360px)}
.app-card{position:relative;overflow:hidden;display:grid;gap:12px;align-content:start}
.app-card::before{content:"";position:absolute;inset:auto -40px -40px auto;width:140px;height:140px;border-radius:50%;background:rgba(36,99,235,.08)}
.app-card-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:28px;background:linear-gradient(135deg,#2563eb,#60a5fa);color:#fff;box-shadow:0 14px 26px rgba(37,99,235,.24)}
.app-card-tag{display:inline-flex;align-items:center;justify-content:center;width:max-content;padding:8px 14px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:12px;font-weight:700}
.pdf-editor-app{min-height:200px}
.pdf-editor-app .admin-hub-title{font-size:1.1rem}