*{box-sizing:border-box}html{min-height:100%;background:#07111f}body{margin:0;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#e8eef8;background:radial-gradient(circle at 15% 15%,rgba(67,95,190,.2),transparent 32%),radial-gradient(circle at 90% 80%,rgba(21,151,185,.14),transparent 30%),#07111f}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:32px 18px;position:relative;overflow:hidden}.ambient{position:absolute;border-radius:999px;filter:blur(2px);opacity:.35;animation:float 9s ease-in-out infinite}.ambient-one{width:340px;height:340px;background:#274b9a;top:-150px;left:-120px}.ambient-two{width:280px;height:280px;background:#0d7991;right:-100px;bottom:-110px;animation-delay:-3s}@keyframes float{50%{transform:translate(25px,18px) scale(1.05)}}.auth-card{width:min(1080px,100%);display:grid;grid-template-columns:1fr 470px;border:1px solid rgba(255,255,255,.1);border-radius:28px;overflow:hidden;background:rgba(9,21,37,.88);backdrop-filter:blur(22px);box-shadow:0 30px 100px rgba(0,0,0,.4);position:relative;z-index:1}.auth-brand{padding:62px 54px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,rgba(30,57,112,.32),rgba(8,20,36,.1))}.brand-link{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font-weight:800;font-size:20px}.brand-link img{width:44px;height:44px;border-radius:12px;object-fit:cover}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:800;color:#70a5ff;margin:40px 0 14px}.auth-brand h1{font-size:clamp(38px,5vw,62px);line-height:1.02;margin:0;letter-spacing:-.045em}.auth-brand h1 span{color:#74a6ff}.hero-copy{color:#9eb0c8;max-width:430px;font-size:16px;line-height:1.7;margin:22px 0}.trust-row{display:flex;gap:18px;flex-wrap:wrap;color:#b8c6d8;font-size:13px}.auth-panel{background:rgba(4,12,22,.58);padding:34px}.mode-switch{display:grid;grid-template-columns:1fr 1fr;background:#0c1a2b;padding:4px;border-radius:13px;margin-bottom:25px}.mode-btn{border:0;background:transparent;color:#91a2b8;padding:11px;border-radius:10px;font-weight:700;cursor:pointer}.mode-btn.active{background:#193565;color:#fff;box-shadow:0 5px 18px rgba(0,0,0,.2)}.form-heading h2,.status-view h2{margin:0;font-size:27px}.form-heading p,.status-view p{color:#8fa1b8;margin:7px 0 22px;font-size:14px}.field{display:block;margin:15px 0}.field>span{display:flex;gap:5px;align-items:center;font-size:13px;font-weight:700;margin-bottom:7px}.field b{color:#ff8290}.field em{font-style:normal;font-weight:500;color:#73849b;margin-left:auto;font-size:11px}.field input,.field select{width:100%;border:1px solid #263951;background:#091726;color:#eef5ff;border-radius:11px;padding:12px 13px;outline:0;font:inherit;transition:.2s}.field input::placeholder{color:#5f7187}.field input:focus,.field select:focus{border-color:#4f86e9;box-shadow:0 0 0 3px rgba(79,134,233,.13)}.field input.invalid{border-color:#e36b78}.field-error{display:block;color:#ff8793;font-size:11px;min-height:15px;margin-top:4px}.password-wrap{position:relative}.password-wrap input{padding-right:58px}.eye-btn{position:absolute;right:8px;top:7px;height:34px;border:0;background:transparent;color:#82a8e8;font-size:11px;font-weight:800;cursor:pointer}.form-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:7px 0 18px}.check{display:flex;align-items:flex-start;gap:7px;color:#8294aa;font-size:12px;line-height:1.4}.check input{accent-color:#4c82e5;margin-top:2px}.text-btn{border:0;background:none;color:#78a5ed;font-weight:700;font-size:12px;cursor:pointer;padding:0}.terms{margin:5px 0 8px}.primary-btn,.secondary-btn{width:100%;border-radius:11px;padding:12px 16px;font:inherit;font-weight:800;cursor:pointer;transition:.2s}.primary-btn{border:1px solid #4c82e5;background:linear-gradient(135deg,#3973d2,#285bb1);color:#fff;box-shadow:0 10px 24px rgba(31,91,180,.25)}.primary-btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.08)}.primary-btn:disabled,.secondary-btn:disabled{opacity:.65;cursor:not-allowed}.secondary-btn{border:1px solid #2b405c;background:#102238;color:#cfe0f5}.secondary-btn:hover{background:#152b47}.secondary-btn.full{margin-top:10px}.compact{width:auto;padding:9px 15px}.message{border-radius:10px;padding:10px 12px;font-size:12px;line-height:1.45;margin-bottom:15px}.message.error{background:rgba(191,59,76,.13);border:1px solid rgba(226,103,119,.3);color:#ff9ba5}.message.success{background:rgba(49,158,112,.13);border:1px solid rgba(83,194,147,.28);color:#8ce0bc}.hidden{display:none!important}.spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;vertical-align:-2px;margin-left:8px;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.strength{margin-top:6px}.strength-track{height:4px;background:#152438;border-radius:99px;overflow:hidden}.strength-track i{display:block;height:100%;width:0;background:#4c82e5;transition:width .2s}.strength span{font-size:10px;color:#74869d}.status-view{text-align:center;padding:22px 6px 10px}.status-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;margin:0 auto 17px;background:#142e53;color:#79a9ff;font-size:25px}.status-view .secondary-btn{margin-top:12px}.legal{font-size:10px;line-height:1.5;color:#596d85;text-align:center;margin:20px 0 0}.dash-nav{height:72px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.08);background:#081524}.dashboard{max-width:1100px;margin:auto;padding:40px 20px}.welcome-card,.coming-card,.stat-card{border:1px solid rgba(255,255,255,.09);background:rgba(10,25,42,.75);border-radius:20px;padding:28px}.welcome-card{display:flex;justify-content:space-between;align-items:center;gap:20px}.welcome-card h1{margin:0;font-size:clamp(28px,4vw,44px)}.welcome-card h1 span{color:#75a7ff}.muted{color:#8396ad}.dash-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.stat-card span{font-size:22px}.stat-card h3{font-size:14px;color:#aab9cb;margin:12px 0 5px}.stat-card strong{font-size:25px;display:block}.stat-card p{font-size:11px;color:#667b93;margin:6px 0 0}.coming-card{margin-top:18px}.coming-card h2{margin-top:0}@media(max-width:850px){.auth-card{grid-template-columns:1fr}.auth-brand{padding:35px}.auth-brand .eyebrow{margin-top:28px}.dash-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.auth-shell{padding:12px}.auth-card{border-radius:20px}.auth-brand{padding:28px 22px}.auth-brand h1{font-size:38px}.auth-panel{padding:22px 18px}.trust-row{display:none}.welcome-card{align-items:flex-start;flex-direction:column}.dash-grid{grid-template-columns:1fr}.dash-nav{padding:0 18px}.brand-link span{font-size:16px}}

/* =========================================================
   LIGHT / DARK THEME SUPPORT
   ========================================================= */
:root{color-scheme:dark}

html[data-theme="light"]{
  color-scheme:light;
}

html[data-theme="light"] body{
  background:#f7f8fc;
}

html[data-theme="light"] .auth-card,
html[data-theme="light"] .auth-panel,
html[data-theme="light"] .field input,
html[data-theme="light"] .field select,
html[data-theme="light"] .dashboard-page .welcome-card,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .coming-card{
  /* Keep the existing auth design as the light-compatible baseline. */
}

.auth-theme-toggle{
  position:fixed;
  top:18px;
  right:20px;
  z-index:100;
  border:1px solid rgba(123,131,255,.35);
  background:rgba(16,24,43,.88);
  color:#f1f5ff;
  border-radius:10px;
  padding:9px 13px;
  font:inherit;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  backdrop-filter:blur(12px);
  box-shadow:0 8px 25px rgba(0,0,0,.18);
}

.auth-theme-toggle:hover{
  border-color:#7b83ff;
}

html[data-theme="light"] .auth-theme-toggle{
  background:#fff;
  color:#121827;
  border-color:#d9def0;
  box-shadow:0 8px 25px rgba(16,24,40,.12);
}

@media(max-width:650px){
  .auth-theme-toggle{
    top:10px;
    right:10px;
    padding:8px 10px;
    font-size:12px;
  }
}

/* Light-mode auth/dashboard palette */
html[data-theme="light"] body{
  color:#121827;
  background:radial-gradient(circle at 15% 15%,rgba(91,92,226,.10),transparent 32%),radial-gradient(circle at 90% 80%,rgba(21,151,185,.08),transparent 30%),#f7f8fc;
}

html[data-theme="light"] .auth-card{
  border-color:#dfe4ee;
  background:rgba(255,255,255,.94);
  box-shadow:0 30px 80px rgba(16,24,40,.12);
}

html[data-theme="light"] .auth-brand{
  background:linear-gradient(145deg,#eef2ff,#f8fbff);
}

html[data-theme="light"] .brand-link{color:#121827}
html[data-theme="light"] .auth-brand h1{color:#121827}
html[data-theme="light"] .auth-brand h1 span{color:#5b78df}
html[data-theme="light"] .hero-copy{color:#667085}
html[data-theme="light"] .trust-row{color:#667085}

html[data-theme="light"] .auth-panel{
  background:#fff;
}

html[data-theme="light"] .mode-switch{
  background:#eef1f7;
}

html[data-theme="light"] .mode-btn{color:#667085}
html[data-theme="light"] .mode-btn.active{
  background:#fff;
  color:#27304a;
  box-shadow:0 4px 14px rgba(16,24,40,.10);
}

html[data-theme="light"] .form-heading h2,
html[data-theme="light"] .status-view h2{color:#121827}
html[data-theme="light"] .form-heading p,
html[data-theme="light"] .status-view p{color:#667085}
html[data-theme="light"] .field>span{color:#344054}

html[data-theme="light"] .field input,
html[data-theme="light"] .field select{
  border-color:#d9dee8;
  background:#fff;
  color:#121827;
}

html[data-theme="light"] .field input::placeholder{color:#98a2b3}
html[data-theme="light"] .check{color:#667085}
html[data-theme="light"] .legal{color:#98a2b3}
html[data-theme="light"] .secondary-btn{
  border-color:#d9dee8;
  background:#f8fafc;
  color:#344054;
}
html[data-theme="light"] .secondary-btn:hover{background:#eef2f7}
html[data-theme="light"] .strength-track{background:#e5e7eb}
html[data-theme="light"] .status-icon{background:#eef2ff;color:#5267d9}

html[data-theme="light"] .dash-nav{
  border-color:#e5e7eb;
  background:#fff;
}

html[data-theme="light"] .dash-nav .brand-link{color:#121827}
html[data-theme="light"] .welcome-card,
html[data-theme="light"] .coming-card,
html[data-theme="light"] .stat-card{
  border-color:#e5e7eb;
  background:#fff;
  box-shadow:0 8px 25px rgba(16,24,40,.05);
}
html[data-theme="light"] .welcome-card h1{color:#121827}
html[data-theme="light"] .stat-card h3{color:#475467}
html[data-theme="light"] .stat-card p{color:#98a2b3}
html[data-theme="light"] .muted{color:#667085}
