.login-wrap.hidden{display:none!important}
    .login-wrap{
      min-height:100vh!important;
      display:grid!important;
      place-items:center!important;
      padding:30px!important;
      position:relative!important;
      overflow:hidden!important;
      background:
        radial-gradient(circle at 10% 12%,rgba(65,174,194,.24),transparent 28%),
        radial-gradient(circle at 88% 86%,rgba(229,181,67,.20),transparent 26%),
        linear-gradient(135deg,#081f35 0%,#0c3c5f 38%,#176d86 72%,#3b9fa9 100%)!important;
    }
    .login-wrap:before{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      background:
        linear-gradient(150deg,transparent 0 58%,rgba(5,36,58,.15) 58% 67%,transparent 67%),
        linear-gradient(27deg,transparent 0 68%,rgba(255,255,255,.045) 68% 69%,transparent 69%);
      opacity:.9;
    }
    .login-wrap:after{
      content:"";
      position:absolute;
      left:-8%;
      right:-6%;
      bottom:-1px;
      height:35%;
      pointer-events:none;
      background:
        linear-gradient(151deg,transparent 0 21%,rgba(4,28,48,.34) 21% 35%,transparent 35% 43%,rgba(4,31,50,.30) 43% 58%,transparent 58% 66%,rgba(4,25,43,.26) 66% 82%,transparent 82%);
      clip-path:polygon(0 100%,0 73%,8% 61%,15% 77%,24% 39%,34% 69%,44% 27%,55% 71%,66% 45%,76% 74%,86% 34%,94% 63%,100% 51%,100% 100%);
    }

    .login-modern-shell{
      width:min(1060px,96vw);
      min-height:640px;
      display:grid;
      grid-template-columns:minmax(0,1.05fr) minmax(410px,.95fr);
      position:relative;
      z-index:2;
      border:1px solid rgba(255,255,255,.24);
      border-radius:30px;
      overflow:hidden;
      box-shadow:0 38px 110px rgba(1,18,31,.40);
      background:rgba(255,255,255,.98);
      backdrop-filter:blur(18px);
    }

    .login-story{
      position:relative;
      overflow:hidden;
      padding:42px 42px 38px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      color:#fff;
      background:
        radial-gradient(circle at 76% 12%,rgba(71,190,206,.28),transparent 28%),
        radial-gradient(circle at 13% 88%,rgba(225,176,58,.18),transparent 30%),
        linear-gradient(145deg,#082a46 0%,#0d4a70 55%,#116c83 100%);
      isolation:isolate;
    }
    .login-story:before{
      content:"✝";
      position:absolute;
      right:38px;
      top:58px;
      z-index:-1;
      font:700 155px/1 Georgia,serif;
      color:rgba(255,255,255,.07);
      text-shadow:0 0 40px rgba(255,255,255,.03);
    }
    .login-story:after{
      content:"";
      position:absolute;
      z-index:-1;
      left:-5%;
      right:-8%;
      bottom:0;
      height:34%;
      background:rgba(2,25,43,.50);
      clip-path:polygon(0 100%,0 75%,10% 60%,19% 79%,28% 34%,38% 71%,48% 24%,59% 72%,69% 45%,78% 75%,88% 35%,96% 66%,100% 55%,100% 100%);
      box-shadow:inset 0 -38px 80px rgba(0,0,0,.18);
    }

    .login-story-brand{
      display:flex;
      align-items:center;
      gap:14px;
      position:relative;
      z-index:2;
    }
    .login-story-logo{
      width:68px;
      height:68px;
      object-fit:contain;
      border-radius:50%;
      background:#fff;
      padding:4px;
      box-shadow:0 10px 28px rgba(0,0,0,.20);
      border:1px solid rgba(255,255,255,.60);
    }
    .login-story-brand h1{
      margin:0;
      color:#fff;
      font-size:18px;
      line-height:1.18;
      letter-spacing:-.02em;
    }
    .login-story-brand small{
      display:block;
      margin-top:5px;
      color:#cfe8f2;
      font-size:10px;
      text-transform:uppercase;
      letter-spacing:.095em;
      font-weight:800;
    }

    .login-story-copy{
      position:relative;
      z-index:2;
      max-width:470px;
      padding:35px 0 72px;
    }
    .login-story-kicker{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:15px;
      padding:7px 11px;
      border:1px solid rgba(255,255,255,.19);
      border-radius:999px;
      background:rgba(255,255,255,.08);
      color:#e6f5fb;
      font-size:9.5px;
      font-weight:850;
      text-transform:uppercase;
      letter-spacing:.08em;
    }
    .login-story-kicker i{
      width:7px;
      height:7px;
      border-radius:50%;
      background:#edc75e;
      box-shadow:0 0 0 4px rgba(237,199,94,.12);
    }
    .login-story-copy h2{
      margin:0;
      max-width:430px;
      color:#fff;
      font:700 40px/1.06 Georgia,"Times New Roman",serif;
      letter-spacing:-.035em;
    }
    .login-story-copy p{
      margin:16px 0 0;
      max-width:440px;
      color:#d5e9f2;
      font-size:13px;
      line-height:1.65;
    }
    .login-story-features{
      display:flex;
      gap:8px;
      flex-wrap:wrap;
      margin-top:22px;
    }
    .login-story-feature{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:8px 10px;
      border:1px solid rgba(255,255,255,.15);
      border-radius:10px;
      background:rgba(255,255,255,.07);
      color:#e9f5fa;
      font-size:10px;
      font-weight:700;
    }
    .login-story-feature span{
      color:#f1c85b;
      font-weight:900;
    }

    .login-story-bottom{
      position:relative;
      z-index:2;
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:16px;
      color:#bbd5e1;
    }
    .login-story-verse{
      max-width:350px;
      font:italic 12px/1.45 Georgia,serif;
    }
    .login-story-verse strong{
      display:block;
      margin-top:4px;
      color:#f6df9c;
      font-size:9.5px;
      font-style:normal;
    }
    .login-story-mark{
      font-size:9px;
      text-transform:uppercase;
      letter-spacing:.10em;
      font-weight:800;
      color:#a9c8d6;
      white-space:nowrap;
    }

    .login-modern-form{
      position:relative;
      display:flex;
      flex-direction:column;
      justify-content:center;
      padding:46px 48px 38px;
      background:
        radial-gradient(circle at 92% 5%,rgba(41,139,171,.07),transparent 26%),
        linear-gradient(180deg,#ffffff,#fbfdff);
    }
    .login-modern-form .login-theme{
      position:absolute;
      top:20px;
      right:22px;
      width:38px;
      height:38px;
      display:grid;
      place-items:center;
      border:1px solid #d8e3eb;
      border-radius:11px;
      background:#fff;
      color:#36566d;
      font-size:17px;
      cursor:pointer;
      box-shadow:0 4px 13px rgba(35,73,103,.06);
    }
    .login-modern-welcome{
      margin-bottom:22px;
    }
    .login-modern-welcome .eyebrow{
      margin-bottom:7px;
      color:#1878a5;
      font-size:9.5px;
      font-weight:900;
      text-transform:uppercase;
      letter-spacing:.10em;
    }
    .login-modern-welcome h2{
      margin:0;
      color:#142940;
      font-size:30px;
      line-height:1.1;
      letter-spacing:-.04em;
    }
    .login-modern-welcome p{
      margin:8px 0 0;
      color:#718395;
      font-size:12px;
      line-height:1.55;
    }

    .login-modern-form .tabs{
      display:grid!important;
      grid-template-columns:1fr 1fr;
      gap:4px!important;
      margin:0 0 20px!important;
      padding:4px!important;
      border:1px solid #e2eaf0;
      border-radius:12px!important;
      background:#f3f7fa!important;
    }
    .login-modern-form .tab{
      min-height:38px;
      border-radius:9px!important;
      font-size:11px;
      font-weight:850!important;
      color:#61768a!important;
    }
    .login-modern-form .tab.active{
      background:#fff!important;
      color:#125f90!important;
      box-shadow:0 4px 12px rgba(35,73,103,.08)!important;
    }
    .login-modern-form .field{
      margin:0 0 14px!important;
      gap:7px!important;
    }
    .login-modern-form .field label{
      color:#3c5369!important;
      font-size:9.5px!important;
      font-weight:900!important;
      letter-spacing:.07em!important;
    }
    .login-modern-form .field input{
      width:100%;
      height:48px!important;
      border:1px solid #cfdae3!important;
      border-radius:11px!important;
      padding:0 14px!important;
      background:#fff!important;
      color:#1e3449!important;
      font-size:13px;
      box-shadow:inset 0 1px 2px rgba(15,40,60,.025)!important;
    }
    .login-modern-form .field input:focus{
      border-color:#5ba3c3!important;
      box-shadow:0 0 0 4px rgba(44,142,180,.10)!important;
    }
    .login-password-wrap{
      position:relative;
    }
    .login-password-wrap input{
      padding-right:48px!important;
    }
    .login-password-toggle{
      position:absolute;
      right:7px;
      bottom:7px;
      width:34px;
      height:34px;
      display:grid;
      place-items:center;
      border:0;
      border-radius:9px;
      background:transparent;
      color:#6d8191;
      font-size:15px;
      cursor:pointer;
    }
    .login-password-toggle:hover{
      background:#eef5f8;
      color:#1c6f98;
    }
    .login-modern-form #authSubmit{
      width:100%!important;
      min-height:48px!important;
      margin-top:4px!important;
      border-radius:11px!important;
      background:linear-gradient(135deg,#0c4f7e 0%,#0b78a5 58%,#2e9eaa 100%)!important;
      box-shadow:0 10px 24px rgba(17,105,148,.22)!important;
      font-size:12px;
      letter-spacing:.01em;
    }
    .login-modern-form #authSubmit:hover{
      transform:translateY(-1px);
      box-shadow:0 14px 30px rgba(17,105,148,.28)!important;
    }
    .login-access-note{
      display:flex;
      gap:9px;
      align-items:flex-start;
      margin-top:16px;
      padding:11px 12px;
      border:1px solid #e1e8ed;
      border-radius:11px;
      background:#f8fbfd;
      color:#718494;
      font-size:9.5px;
      line-height:1.45;
    }
    .login-access-note i{
      width:20px;
      height:20px;
      flex:0 0 20px;
      display:grid;
      place-items:center;
      border-radius:50%;
      background:#e7f2f7;
      color:#287b9e;
      font-style:normal;
      font-weight:900;
      font-size:10px;
    }
    .login-form-footer{
      margin-top:21px;
      padding-top:16px;
      border-top:1px solid #e8edf2;
      text-align:center;
      color:#8695a2;
      font-size:9px;
      letter-spacing:.025em;
    }
    .login-form-footer strong{
      color:#597185;
      font-weight:800;
    }

    /* override older login refresh */
    .login-modern-shell .login{
      width:auto!important;
      max-width:none!important;
      padding:0!important;
      margin:0!important;
      border:0!important;
      border-radius:0!important;
      box-shadow:none!important;
      background:transparent!important;
      overflow:visible!important;
      backdrop-filter:none!important;
    }
    .login-modern-shell .login:before,
    .login-modern-shell .login:after{display:none!important}
    .login-modern-shell .login > .brand{display:none!important}

    html[data-theme="dark"] .login-modern-shell{
      border-color:#284052;
      background:#0d1c28;
    }
    html[data-theme="dark"] .login-modern-form{
      background:
        radial-gradient(circle at 92% 5%,rgba(49,154,192,.07),transparent 26%),
        linear-gradient(180deg,#0d1c28,#0a1722);
    }
    html[data-theme="dark"] .login-modern-welcome h2{color:#edf5fb}
    html[data-theme="dark"] .login-modern-welcome p{color:#92a7b8}
    html[data-theme="dark"] .login-modern-form .tabs{
      background:#122533!important;
      border-color:#284052!important;
    }
    html[data-theme="dark"] .login-modern-form .tab{color:#8da4b6!important}
    html[data-theme="dark"] .login-modern-form .tab.active{
      background:#193245!important;
      color:#bce5f7!important;
      box-shadow:none!important;
    }
    html[data-theme="dark"] .login-modern-form .field label{color:#a0b5c5!important}
    html[data-theme="dark"] .login-modern-form .field input{
      background:#0b1b27!important;
      color:#eef5fb!important;
      border-color:#30485a!important;
    }
    html[data-theme="dark"] .login-modern-form .login-theme{
      background:#122736;
      border-color:#2b4557;
      color:#efc967;
    }
    html[data-theme="dark"] .login-access-note{
      background:#102331;
      border-color:#284153;
      color:#91a7b8;
    }
    html[data-theme="dark"] .login-access-note i{
      background:#173448;
      color:#8fd2ed;
    }
    html[data-theme="dark"] .login-form-footer{
      border-color:#223747;
      color:#71899c;
    }
    html[data-theme="dark"] .login-form-footer strong{color:#a6bbca}

    @media(max-width:860px){
      .login-wrap{padding:18px!important}
      .login-modern-shell{
        width:min(580px,96vw);
        min-height:auto;
        grid-template-columns:1fr;
        border-radius:24px;
      }
      .login-story{
        min-height:260px;
        padding:28px 28px 26px;
      }
      .login-story-copy{
        padding:25px 0 35px;
      }
      .login-story-copy h2{font-size:30px}
      .login-story-copy p{max-width:100%}
      .login-story-bottom{display:none}
      .login-story:before{font-size:110px;right:20px;top:40px}
      .login-modern-form{padding:34px 30px 30px}
    }
    @media(max-width:520px){
      .login-wrap{padding:0!important;align-items:stretch!important}
      .login-modern-shell{
        width:100vw;
        min-height:100vh;
        border-radius:0;
        border:0;
      }
      .login-story{
        min-height:220px;
        padding:24px 22px 20px;
      }
      .login-story-logo{width:54px;height:54px}
      .login-story-brand h1{font-size:15px}
      .login-story-copy{padding:24px 0 18px}
      .login-story-copy h2{font-size:27px}
      .login-story-copy p{font-size:11.5px}
      .login-story-features{display:none}
      .login-modern-form{padding:30px 22px 28px}
      .login-modern-form .login-theme{top:16px;right:16px}
      .login-modern-welcome h2{font-size:26px}
    }