.oig-auth-shell{
  --bg:#020202;
  --panel:rgba(14,16,15,.86);
  --border:rgba(255,255,255,.08);
  --text:#f5f5f5;
  --good:#d8ffd2;
  --bad:#ffd7d7;
  width:100%;
  min-height:760px;
  padding-bottom:clamp(360px, 34vh, 640px);
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 28%, rgba(255,255,255,.05), transparent 28%),
    radial-gradient(circle at 72% 22%, rgba(255,255,255,.035), transparent 34%),
    linear-gradient(180deg, #050505 0%, #030303 100%);
  font-family:Arial, Helvetica, sans-serif;
  color:var(--text);
  box-sizing:border-box;
  isolation:isolate;
}

.oig-auth-shell *,
.oig-auth-shell *:before,
.oig-auth-shell *:after{
  box-sizing:border-box;
}

.oig-auth-shell .oig-bg-grid{
  display:none;
}

.oig-auth-shell .oig-glow{
  display:none;
}

.oig-auth-shell .oig-wrap{
  position:relative;
  z-index:2;
  width:100%;
  min-height:760px;
  display:grid;
  grid-template-columns:minmax(360px, 1.05fr) minmax(380px, .95fr);
  gap:28px;
  align-items:center;
  padding:38px;
}

.oig-auth-shell .oig-left,
.oig-auth-shell .oig-right{
  position:relative;
  border:1px solid var(--border);
  border-radius:28px;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(18,20,19,.82), rgba(8,9,9,.90));
  box-shadow:
    0 24px 70px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.04);
}

.oig-auth-shell .oig-left:before,
.oig-auth-shell .oig-right:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(135deg, rgba(255,255,255,.04), transparent 20%, transparent 80%, rgba(255,255,255,.02));
}

.oig-auth-shell .oig-left{
  min-height:620px;
  display:flex;
  align-items:center;
  padding:54px 46px;
}

.oig-auth-shell .oig-right{
  padding:24px;
}

.oig-auth-shell .oig-kicker{
  font-family:"Courier New", Courier, monospace;
  color:rgba(255,255,255,.42);
  font-size:12px;
  letter-spacing:3px;
  text-transform:uppercase;
  margin-bottom:18px;
  text-shadow:
    0 1px 0 rgba(255,255,255,.04),
    0 0 8px rgba(255,255,255,.03);
}

.oig-auth-shell .oig-hero-title{
  font-family:"Courier New", Courier, monospace;
  color:#fff;
  font-size:clamp(36px, 5vw, 74px);
  line-height:.95;
  letter-spacing:2.8px;
  text-transform:uppercase;
  margin:0 0 20px 0;
  min-height:96px;
  text-shadow:
    0 1px 0 rgba(255,255,255,.06),
    0 2px 0 rgba(255,255,255,.04),
    0 0 10px rgba(255,255,255,.04);
}

.oig-auth-shell .oig-hero-text{
  font-family:"Courier New", Courier, monospace;
  color:rgba(255,255,255,.80);
  font-size:15px;
  line-height:1.9;
  letter-spacing:1.05px;
  text-transform:uppercase;
  max-width:620px;
  text-shadow:
    0 1px 0 rgba(255,255,255,.04),
    0 0 10px rgba(255,255,255,.025);
}

.oig-auth-shell .oig-tabs{
  display:flex;
  gap:10px;
  margin-bottom:18px;
}

.oig-auth-shell .oig-tabs-hidden{
  display:none;
}

.oig-auth-shell .oig-tab{
  appearance:none;
  border:none;
  cursor:pointer;
  padding:14px 16px;
  border-radius:16px;
  font-family:"Courier New", Courier, monospace;
  font-size:12px;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
  color:rgba(255,255,255,.88);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.09);
  transition:transform .25s ease, filter .25s ease;
  box-shadow:0 10px 22px rgba(0,0,0,.18);
}

.oig-auth-shell .oig-tab:hover{
  transform:translateY(-2px);
  filter:brightness(1.05);
}

.oig-auth-shell .oig-tab.active{
  color:#000;
  background:linear-gradient(180deg, #ffffff 0%, #d8dcd6 100%);
  box-shadow:
    0 14px 24px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.55);
}

.oig-auth-shell .oig-message{
  display:none;
  margin-bottom:16px;
  border-radius:16px;
  padding:14px 16px;
  font-family:"Courier New", Courier, monospace;
  font-size:12px;
  line-height:1.75;
  letter-spacing:1.1px;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.09);
}

.oig-auth-shell .oig-message.show{
  display:block;
}

.oig-auth-shell .oig-message.good{
  background:rgba(45,82,44,.38);
  color:var(--good);
  border-color:rgba(158,220,151,.16);
}

.oig-auth-shell .oig-message.bad{
  background:rgba(88,34,34,.38);
  color:var(--bad);
  border-color:rgba(255,161,161,.16);
}

.oig-auth-shell .oig-panel{
  display:none;
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  padding:24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.026), rgba(255,255,255,.012));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 18px 40px rgba(0,0,0,.18);
}

.oig-auth-shell .oig-panel.active,
.oig-auth-shell .oig-session.show{
  display:block;
}

.oig-auth-shell .oig-panel-title,
.oig-auth-shell .oig-session-title{
  font-family:"Courier New", Courier, monospace;
  color:#fff;
  font-size:30px;
  line-height:1.03;
  letter-spacing:2px;
  text-transform:uppercase;
  margin:0 0 12px 0;
  min-height:36px;
}

.oig-auth-shell .oig-panel-text,
.oig-auth-shell .oig-session-text{
  font-family:"Courier New", Courier, monospace;
  color:rgba(255,255,255,.74);
  font-size:13px;
  line-height:1.85;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:18px;
}

.oig-auth-shell .oig-form{
  display:grid;
  gap:14px;
}

.oig-auth-shell .oig-field{
  display:grid;
  gap:8px;
}

.oig-auth-shell .oig-field label,
.oig-auth-shell .oig-captcha-label{
  font-family:"Courier New", Courier, monospace;
  color:rgba(255,255,255,.52);
  font-size:11px;
  letter-spacing:2.2px;
  text-transform:uppercase;
}

.oig-auth-shell .oig-input{
  width:100%;
  border:none;
  outline:none;
  border-radius:16px;
  padding:16px;
  color:#fff;
  background:
    linear-gradient(180deg, rgba(18,20,19,.96), rgba(8,9,9,.98));
  border:1px solid rgba(255,255,255,.09);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 12px 22px rgba(0,0,0,.18);
  font-family:"Courier New", Courier, monospace;
  font-size:14px;
  letter-spacing:1px;
}

.oig-auth-shell .oig-input:focus{
  border-color:rgba(255,255,255,.20);
  box-shadow:
    0 0 0 3px rgba(255,255,255,.05),
    inset 0 1px 0 rgba(255,255,255,.04),
    0 12px 24px rgba(0,0,0,.20);
}

.oig-auth-shell .oig-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.oig-auth-shell .oig-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:6px;
}

.oig-auth-shell .oig-btn,
.oig-auth-shell a.oig-btn{
  appearance:none;
  border:none;
  cursor:pointer;
  padding:15px 18px;
  border-radius:16px;
  font-family:"Courier New", Courier, monospace;
  font-size:12px;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
  transition:transform .25s ease, filter .25s ease;
  box-shadow:
    0 16px 24px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.08);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.oig-auth-shell .oig-btn:hover,
.oig-auth-shell a.oig-btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.04);
}

.oig-auth-shell .oig-btn-primary,
.oig-auth-shell a.oig-btn-primary{
  color:#000;
  background:linear-gradient(180deg, #ffffff 0%, #d6dbd4 100%);
}

.oig-auth-shell .oig-btn-secondary,
.oig-auth-shell a.oig-btn-secondary{
  color:#fff;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.10);
}

.oig-auth-shell .oig-captcha-shell{
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  padding:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.01));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 12px 22px rgba(0,0,0,.14);
  overflow:hidden;
}

.oig-auth-shell .oig-captcha-label{
  display:block;
  margin-bottom:10px;
}

.oig-auth-shell .oig-captcha-box{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}

.oig-auth-shell .oig-link-row{
  margin-top:4px;
}

.oig-auth-shell .oig-link{
  padding:0;
  border:none;
  background:none;
  color:rgba(255,255,255,.70);
  font-family:"Courier New", Courier, monospace;
  font-size:12px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}

.oig-auth-shell .char{
  display:inline-block;
  transform-origin:center center;
  will-change:transform, opacity, filter;
}

.oig-auth-shell .char.space{
  width:.42em;
}

.oig-auth-shell .char.reveal{
  animation:oigReveal .52s cubic-bezier(.2,.85,.18,1) forwards;
}

@keyframes oigReveal{
  0%{
    opacity:0;
    transform:translateY(8px) rotateY(90deg) scale(.92);
    filter:blur(6px);
  }
  35%{
    opacity:.82;
    transform:translateY(-1px) rotateY(-24deg) scale(1.03);
    filter:blur(1.8px);
  }
  65%{
    opacity:1;
    transform:translateY(0) rotateY(12deg) scale(1.01);
    filter:blur(.6px);
  }
  100%{
    opacity:1;
    transform:translateY(0) rotateY(0deg) scale(1);
    filter:blur(0);
  }
}

@media (max-width:1020px){
  .oig-auth-shell .oig-wrap{
    grid-template-columns:1fr;
    padding:20px;
  }

  .oig-auth-shell .oig-left{
    min-height:unset;
    padding:34px 24px;
  }

  .oig-auth-shell .oig-hero-title{
    font-size:42px;
    min-height:70px;
  }
}

@media (max-width:640px){
  .oig-auth-shell .oig-wrap{
    padding:14px;
    gap:16px;
  }

  .oig-auth-shell .oig-left,
  .oig-auth-shell .oig-right{
    border-radius:22px;
  }

  .oig-auth-shell .oig-row{
    grid-template-columns:1fr;
  }

  .oig-auth-shell .oig-hero-title{
    font-size:34px;
    min-height:62px;
  }

  .oig-auth-shell .oig-panel-title,
  .oig-auth-shell .oig-session-title{
    font-size:24px;
  }

  .oig-auth-shell .oig-captcha-box{
    transform:scale(.92);
    transform-origin:left top;
    min-height:72px;
  }
}


@media (max-width: 900px){
  .oig-auth-shell{
    padding-bottom:220px;
  }
}