*{box-sizing:border-box}body{margin:0;background:#f4f7fb;color:#15233b;font:15px/1.5 Inter,system-ui,Segoe UI,Arial,sans-serif}.top{height:76px;background:#fff;border-bottom:1px solid #e4eaf2;display:flex;align-items:center;justify-content:space-between;padding:0 28px}.brand{display:flex;gap:12px;align-items:center}.mark{display:grid;place-items:center;background:linear-gradient(135deg,#2358d6,#7c4be8);color:white;font-weight:900;border-radius:14px;width:44px;height:44px}.brand b{display:block;font-size:17px;letter-spacing:.3px}.brand small{color:#7a8799}.status{font-size:12px;color:#52647b;background:#f1f5fa;border-radius:24px;padding:8px 12px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#e4a02a;margin-right:7px}.shell{display:flex;min-height:calc(100vh - 76px)}.nav{width:240px;background:#fff;border-right:1px solid #e4eaf2;padding:22px 14px;display:flex;flex-direction:column;gap:6px}.navtitle,.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.5px;color:#8492a6;padding:0 12px 8px}.navitem{border:0;background:transparent;text-align:left;padding:12px 13px;border-radius:10px;color:#5b6a80;font-weight:650;cursor:pointer}.navitem:hover,.navitem.active{background:#edf2ff;color:#2857ca}.navfoot{margin-top:auto;font-size:11px;color:#9aa5b4;padding:16px 10px;line-height:1.8}.main{flex:1;padding:30px;max-width:1600px}.welcome{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.welcome h1{font-size:30px;margin:0 0 4px;letter-spacing:-.7px}.welcome p{color:#7c899b;margin:0}.eyebrow{padding:0;color:#5c70c8}.primary{border:0;background:#2859d7;color:white;padding:11px 17px;border-radius:10px;font-weight:750;cursor:pointer;box-shadow:0 5px 12px #2859d722}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.metrics article,.panel{background:#fff;border:1px solid #e5ebf3;border-radius:16px;box-shadow:0 3px 14px #1d35570a}.metrics article{padding:19px}.metrics span{display:block;color:#8492a5;font-size:12px;font-weight:700}.metrics strong{display:block;font-size:22px;margin:8px 0 3px}.metrics small{color:#9aa5b4;font-size:12px}.panel{padding:22px;margin-bottom:18px}.panelhead{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eef2f7;padding-bottom:16px;margin-bottom:18px}.panel h2{margin:0;font-size:18px}.panelhead p{margin:4px 0 0;color:#8492a5;font-size:13px}.tag{font-size:11px;background:#eef2ff;color:#4e61c3;border-radius:20px;padding:6px 10px;font-weight:800}.notice{background:#f3f7ff;border:1px solid #dfe8ff;border-radius:12px;padding:16px}.notice b{color:#2b55bf}.notice p{margin:5px 0 0;color:#6e7f99}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.tile{border:1px solid #edf1f6;border-radius:12px;padding:16px}.tile b{font-size:14px}.tile p{margin:5px 0 0;color:#8390a2;font-size:13px}.gates{padding:0;margin:0;list-style:none;display:grid;gap:12px}.gates li{display:flex;gap:12px;align-items:center;color:#5e6d81}.check{color:#23a477;font-weight:900}.pending{color:#c5ccd6;font-size:19px}.content table{width:100%;border-collapse:collapse}.content td,.content th{text-align:left;padding:12px;border-bottom:1px solid #edf1f6}.content th{color:#7e8ca0;font-size:12px}@media(max-width:900px){.nav{width:190px}.main{padding:20px}.metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.top{padding:0 14px}.shell{display:block}.nav{width:100%;flex-direction:row;overflow:auto;padding:10px}.navtitle,.navfoot{display:none}.navitem{white-space:nowrap;padding:10px}.main{padding:16px}.welcome h1{font-size:24px}.metrics{gap:10px}.metrics article{padding:14px}.metrics strong{font-size:18px}.tiles{grid-template-columns:1fr}.welcome{align-items:flex-start;gap:10px}.primary{padding:9px 12px}}
label{display:block;margin:10px 0;color:#52647b;font-size:13px;font-weight:650}input,select{display:block;width:100%;margin-top:5px;padding:10px;border:1px solid #dbe3ef;border-radius:8px;background:#fff;color:#15233b;font:inherit}button{cursor:pointer}.pref{display:flex;align-items:center;gap:8px;border-bottom:1px solid #edf1f6;padding:6px}.pref input{width:auto;margin:0}.notice.error{background:#fff4f2;border-color:#f2c8c2;color:#9e3022}

/* HRK INDIA - Colorful Dashboard UI Improvement */
:root {
  --hrk-primary: #4f46e5;
  --hrk-secondary: #7c3aed;
  --hrk-accent: #06b6d4;
  --hrk-surface: #ffffff;
  --hrk-background: #f1f5ff;
}

body {
  background: linear-gradient(135deg, #eef2ff 0%, #f0fdfa 50%, #fdf2f8 100%);
  color: #172554;
}

.shell {
  background: transparent;
}

.navitem {
  border-radius: 12px;
  margin: 4px 8px;
  padding: 12px 14px;
  transition: all 0.2s ease;
}

.navitem:hover {
  background: #e0e7ff;
  color: #4338ca;
  transform: translateX(3px);
}

.navitem.active {
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: white;
  box-shadow: 0 5px 15px #4f46e533;
}

.main {
  padding: 24px;
}

.welcome {
  background: linear-gradient(135deg, #4338ca, #7c3aed, #0891b2);
  color: white;
  border-radius: 22px;
  padding: 28px;
  box-shadow: 0 12px 30px #4338ca25;
}

.welcome h1 {
  color: white;
}

.welcome p {
  color: #e0e7ff;
}

.metrics {
  gap: 16px;
}

.metric {
  background: white;
  border: 1px solid #e0e7ff;
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 5px 18px #3341550b;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.metric:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 25px #4f46e51a;
}

.metric strong {
  color: #4f46e5;
  font-size: 26px;
}

.tiles {
  gap: 16px;
}

.tile {
  background: white;
  border: 1px solid #e0e7ff;
  border-radius: 18px;
  padding: 20px;
  box-shadow: 0 5px 18px #3341550b;
  transition: transform 0.2s ease;
}

.tile:hover {
  transform: translateY(-3px);
  border-color: #a5b4fc;
}

button.primary,
.primary {
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: white;
  border: 0;
  border-radius: 12px;
  padding: 11px 18px;
  font-weight: 700;
  box-shadow: 0 4px 12px #4f46e533;
}

button.primary:hover {
  filter: brightness(1.08);
}

input,
select,
textarea {
  border-radius: 10px;
  border: 1px solid #c7d2fe;
  padding: 11px;
}

.notice {
  border-radius: 14px;
}

@media (max-width: 768px) {
  .main {
    padding: 14px;
  }

  .welcome {
    padding: 20px;
    border-radius: 18px;
  }

  .metrics,
  .tiles {
    grid-template-columns: 1fr;
  }

  .metric,
  .tile {
    padding: 16px;
  }
}

/* HRK INDIA UI BULK FIX 1 */

:root {
  --hrk-primary: #5b35e8;
  --hrk-secondary: #0e9ec7;
  --hrk-bg: #f0f5ff;
  --hrk-card: #ffffff;
  --hrk-border: #e2e8f5;
  --hrk-text: #172554;
  --hrk-muted: #64748b;
}

body {
  background:
    radial-gradient(circle at top right, #e0f2fe, transparent 35%),
    linear-gradient(135deg, #f5f3ff, #eff6ff);
  color: var(--hrk-text);
}

.top {
  background: rgba(255,255,255,.96);
  box-shadow: 0 2px 14px rgba(79,70,229,.08);
}

.brand .mark {
  background: linear-gradient(135deg,#4f46e5,#06b6d4);
  box-shadow: 0 4px 12px #4f46e533;
}

.shell {
  gap: 18px;
}

.nav {
  background: rgba(255,255,255,.96);
  border-right: 1px solid var(--hrk-border);
}

.navitem {
  border-radius: 12px;
  transition: all .2s ease;
  margin-bottom: 4px;
}

.navitem:hover {
  background: #ede9fe;
  color: #5b35e8;
  transform: translateX(2px);
}

.navitem.active {
  background: linear-gradient(135deg,#6d3df0,#4f46e5);
  color: white;
  box-shadow: 0 5px 14px #5b35e833;
}

.main {
  padding: 24px;
  max-width: 1600px;
  margin: 0 auto;
}

.welcome {
  background: linear-gradient(120deg,#5b35e8,#7c3aed,#0891b2);
  color: white;
  border-radius: 20px;
  padding: 28px;
  box-shadow: 0 10px 24px #5b35e829;
}

.welcome h1 {
  color: white;
  font-size: clamp(22px,3vw,32px);
}

.welcome p {
  color: #f1f5ff;
}

.metrics {
  gap: 16px;
  margin-top: 18px;
}

.metric,
.tile,
.panel {
  background: rgba(255,255,255,.97);
  border: 1px solid var(--hrk-border);
  border-radius: 16px;
  box-shadow: 0 5px 18px rgba(30,64,175,.06);
  transition: transform .2s ease, box-shadow .2s ease;
}

.metric:hover,
.tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(79,70,229,.12);
}

.metric {
  padding: 20px;
}

.metric strong {
  color: var(--hrk-primary);
  font-size: 26px;
}

.tiles {
  gap: 16px;
}

.tile {
  padding: 20px;
}

.panel {
  padding: 22px;
  margin-top: 20px;
}

.panelhead {
  border-bottom: 1px solid var(--hrk-border);
  padding-bottom: 14px;
  margin-bottom: 16px;
}

button,
button.primary {
  cursor: pointer;
  transition: transform .15s ease, filter .15s ease;
}

button:hover {
  filter: brightness(1.04);
}

button:active {
  transform: scale(.97);
}

button.primary {
  background: linear-gradient(135deg,#5b35e8,#0e9ec7);
  color: white;
  border-radius: 12px;
  padding: 12px 18px;
  box-shadow: 0 4px 12px #4f46e533;
}

input,
select,
textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: white;
  color: #172554;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  padding: 12px;
}

input:focus,
select:focus,
textarea:focus {
  outline: 2px solid #a5b4fc;
  border-color: #6366f1;
}

.notice {
  border-radius: 14px;
  padding: 14px;
}

.gates {
  gap: 12px;
}

@media (max-width: 768px) {
  .top {
    height: auto;
    min-height: 64px;
    padding: 12px 16px;
    flex-wrap: wrap;
  }

  .shell {
    display: block;
    min-height: calc(100vh - 64px);
  }

  .nav {
    width: 100%;
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    white-space: nowrap;
    padding: 10px;
    gap: 8px;
    border-right: 0;
    border-bottom: 1px solid var(--hrk-border);
  }

  .navitem {
    flex: 0 0 auto;
    margin: 0;
    padding: 12px 16px;
  }

  .navfoot {
    display: none;
  }

  .main {
    padding: 14px;
  }

  .welcome {
    padding: 22px;
    border-radius: 18px;
  }

  .metrics,
  .tiles {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .metric,
  .tile {
    padding: 16px;
  }

  .panel {
    padding: 16px;
    margin-top: 14px;
  }

  .panelhead {
    flex-wrap: wrap;
    gap: 10px;
  }

  button {
    min-height: 42px;
  }
}

@media (max-width: 400px) {
  .main {
    padding: 10px;
  }

  .welcome {
    padding: 16px;
  }

  .metric strong {
    font-size: 22px;
  }
}

/* END HRK INDIA UI BULK FIX 1 */

/* HRK INDIA PREMIUM SINGLE-PAGE AUTHENTICATION */
.hrk-auth-shell{max-width:1120px;margin:0 auto;padding:28px 24px 42px;color:#14234a}
.hrk-auth-brand{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}
.hrk-logo{font-size:25px;font-weight:900;letter-spacing:-1px;color:#172653;text-decoration:none}
.hrk-logo span{color:#6550e8}
.hrk-secure,.hrk-eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:#6550e8}
.hrk-auth-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1.3fr .7fr;align-items:center;min-height:245px;padding:36px 44px;border-radius:26px;background:linear-gradient(120deg,#4225b9 0%,#6550e8 48%,#078eb6 100%);color:#fff;box-shadow:0 18px 45px #4331a52b}
.hrk-auth-hero h1{font-size:clamp(32px,5vw,48px);line-height:1.08;letter-spacing:-1.7px;margin:15px 0}
.hrk-auth-hero p{max-width:480px;line-height:1.7;color:#e9e9ff}
.hrk-trust{display:flex;gap:17px;flex-wrap:wrap;margin-top:22px;font-size:12px}
.hrk-hero-art{position:relative;height:180px;display:grid;place-items:center}
.hrk-orbit{position:absolute;border:1px solid #ffffff55;border-radius:50%;width:175px;height:175px}
.orbit-two{width:130px;height:130px;border-style:dashed}
.orbit-one{transform:rotate(35deg) scaleY(.55)}
.hrk-orbit-center{width:88px;height:88px;border-radius:24px;background:#ffffff20;backdrop-filter:blur(10px);display:grid;place-content:center;text-align:center;font-size:15px;letter-spacing:2px;box-shadow:0 10px 35px #15104c44}
.hrk-auth-card{max-width:570px;margin:28px auto 18px;background:#fff;border:1px solid #e3e8f5;border-radius:22px;padding:28px;box-shadow:0 15px 45px #263b7210}
.hrk-auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#f0f2fb;padding:5px;border-radius:13px;gap:5px}
.hrk-auth-tabs button{border:0;border-radius:10px;background:transparent;padding:13px;font-weight:750;color:#59617e;cursor:pointer}
.hrk-auth-tabs button.selected{background:#fff;color:#5541d5;box-shadow:0 3px 12px #263b7214}
.hrk-auth-heading{margin:25px 0 20px}
.hrk-auth-heading h2{font-size:25px;margin:0 0 7px;color:#182650}
.hrk-auth-heading p,.hrk-admin-content p{color:#78819b;font-size:13px;line-height:1.6}
.hrk-auth-card form label,.hrk-admin-content label{display:block;font-size:12px;font-weight:750;margin:15px 0 7px;color:#354263}
.hrk-auth-card form label span{font-weight:400;color:#8b93a8}
.hrk-auth-card input,.hrk-auth-card select,.hrk-admin-content input{width:100%;min-height:48px;padding:12px 14px;border:1px solid #dce2ef;border-radius:11px;background:#fbfcff;color:#182650;font:inherit;outline:none}
.hrk-auth-card input:focus,.hrk-auth-card select:focus,.hrk-admin-content input:focus{border-color:#6955e8;box-shadow:0 0 0 3px #6955e81c}
.hrk-btn{border:0;border-radius:11px;padding:13px 19px;margin-top:14px;background:linear-gradient(110deg,#6043e7,#079bc0);color:white;font-weight:800;cursor:pointer;box-shadow:0 6px 15px #5845ce28}
.hrk-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.hrk-btn-primary,.hrk-btn-secondary{width:100%;min-height:48px}
.hrk-verify-area{margin-top:20px;padding:17px;border:1px solid #dce2f5;border-radius:14px;background:#f7f8ff}
.hrk-verify-area p{font-size:12px;color:#5541d5}
.hrk-message{margin-top:19px;padding:13px 15px;background:#eff5ff;border:1px solid #dbe6ff;border-radius:11px;font-size:12px;color:#354b80}
.hrk-message.error{background:#fff1f1;border-color:#ffd1d1;color:#a62d38}
.hrk-auth-foot{display:flex;justify-content:space-between;gap:12px;margin-top:18px;font-size:11px;color:#858da2}
.hrk-home-link{color:#5845d4;font-weight:750;text-decoration:none}
.hrk-admin-card{max-width:570px;margin:16px auto;padding:18px 22px;border:1px solid #e2e6f1;border-radius:16px;background:#fff}
.hrk-admin-card summary{cursor:pointer;font-weight:800;color:#29365b}
.hrk-admin-content{padding-top:12px}
.hrk-auth-footer{text-align:center;color:#929ab0;font-size:11px;padding:22px}
.hidden{display:none!important}
@media(max-width:700px){
 .hrk-auth-shell{padding:15px 12px 30px}
 .hrk-auth-hero{grid-template-columns:1fr;min-height:0;padding:27px 23px;border-radius:19px}
 .hrk-hero-art{display:none}
 .hrk-trust{gap:9px;font-size:10px}
 .hrk-auth-card{margin:17px auto;padding:20px 17px;border-radius:17px}
 .hrk-auth-heading h2{font-size:22px}
 .hrk-auth-foot{flex-direction:column}
 .hrk-secure{font-size:8px;letter-spacing:1px}
}