@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;800&family=Inter:wght@400;600;700;800;900&display=swap');

:root{
  --ga-bg:#020817;
  --ga-panel:#061122;
  --ga-panel-2:#08182c;
  --ga-line:rgba(56,189,248,.34);
  --ga-text:#f8fbff;
  --ga-muted:#9fb4cc;
  --ga-cyan:#16d8ff;
  --ga-blue:#1477ff;
  --ga-ok:#22e86b;
  --ga-warn:#ffc400;
  --ga-bad:#ff2028;
}

html, body.ga-access-body,
body.login{
  min-height:100vh;
  margin:0;
  background:#020817 !important;
  color:var(--ga-text);
  font-family:Inter,system-ui,sans-serif;
  overflow:hidden;
}

.ga-auth-bg{
  position:fixed;
  inset:0;
  background:
    radial-gradient(circle at 16% 22%,rgba(20,119,255,.28),transparent 28%),
    radial-gradient(circle at 78% 14%,rgba(22,216,255,.15),transparent 26%),
    linear-gradient(180deg,#020817,#020611 74%,#030914);
  z-index:0;
}

.ga-auth-bg:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(56,189,248,.065) 1px,transparent 1px),
    linear-gradient(rgba(56,189,248,.055) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:radial-gradient(circle at center,#000 0 55%,transparent 82%);
}

.ga-auth-bg:after{
  content:"";
  position:absolute;
  top:-20%;
  bottom:-20%;
  width:14%;
  left:43%;
  background:linear-gradient(90deg,transparent,rgba(125,211,252,.28),transparent);
  filter:blur(10px);
  animation:gaScan 7s linear infinite;
  opacity:.75;
}

@keyframes gaScan{0%{transform:translateX(-70vw)}100%{transform:translateX(70vw)}}
@keyframes gaPulse{0%,100%{opacity:.72;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@keyframes gaRotate{to{transform:rotate(360deg)}}

body.login #container,
body.login #container > .main,
body.login #content,
body.login #content-main{
  min-height:100vh;
  width:100%;
  margin:0;
  padding:0;
  background:transparent !important;
  position:relative;
  z-index:1;
}

body.login #header,
body.login .breadcrumbs,
body.login #nav-sidebar,
body.login .toggle-nav-sidebar,
body.login .sidebar,
body.login #content-related,
body.login #content-title,
body.login .content-title,
body.login #content h1:first-child{
  display:none !important;
}

body.login #content{
  display:flex;
  align-items:center;
  justify-content:center;
}

.ga-shell{
  position:relative;
  z-index:1;
  min-height:100vh;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:48px 18px;
}

.ga-card{
  position:relative;
  width:100%;
  max-width:560px;
  overflow:hidden;
  border-radius:24px;
  border:1px solid var(--ga-line);
  background:linear-gradient(180deg,rgba(9,27,49,.96),rgba(4,15,29,.98));
  box-shadow:0 26px 70px rgba(0,0,0,.48),0 0 0 1px rgba(125,211,252,.06) inset;
  padding:34px;
}

.ga-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 0,rgba(22,216,255,.13),transparent 42%),
    linear-gradient(135deg,rgba(34,232,107,.06),transparent 34%,rgba(20,119,255,.06));
}

.ga-card>*{position:relative;z-index:1}

.ga-logo{
  text-align:center;
  margin-bottom:20px;
}

.ga-logo img{
  width:100%;
  max-width:420px;
  height:auto;
  filter:drop-shadow(0 0 20px rgba(20,119,255,.35));
}

.ga-badges{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
  margin:10px 0 20px;
}

.ga-badge{
  border:1px solid rgba(56,189,248,.28);
  background:rgba(4,18,34,.74);
  border-radius:999px;
  padding:7px 13px;
  font-weight:900;
  font-size:12px;
  color:#cfeeff;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.ga-badge.ok{color:var(--ga-ok);border-color:rgba(34,232,107,.34)}

.ga-title{
  font-family:Orbitron,Inter,sans-serif;
  text-align:center;
  margin:0;
  font-size:32px;
  letter-spacing:.02em;
  color:#fff;
}

.ga-subtitle{
  text-align:center;
  margin:14px auto 26px;
  color:#c8d9ed;
  line-height:1.45;
  max-width:520px;
}

.ga-form-row,
.ga-card .form-row{
  margin:0 0 15px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.ga-card label{
  display:block;
  margin-bottom:7px;
  color:#eaf2ff !important;
  font-weight:800 !important;
}

.ga-card input[type="text"],
.ga-card input[type="password"],
.ga-code-input{
  width:100%;
  height:50px;
  box-sizing:border-box;
  border-radius:12px !important;
  border:1px solid rgba(56,189,248,.50) !important;
  background:#f8fbff !important;
  color:#0f172a !important;
  font-size:16px;
  padding:10px 14px;
  outline:none;
  transition:.2s;
}

.ga-code-input{
  height:56px;
  font-size:28px;
  letter-spacing:12px;
  text-align:center;
  font-weight:900;
}

.ga-card input:focus{
  box-shadow:0 0 0 4px rgba(56,189,248,.18),0 0 20px rgba(56,189,248,.18) !important;
  border-color:#38bdf8 !important;
}

.ga-submit,
.ga-card .submit-row input,
.ga-button{
  display:block;
  width:100%;
  height:50px;
  box-sizing:border-box;
  border:0 !important;
  border-radius:12px !important;
  background:linear-gradient(90deg,#176fd6,#3ab7ff) !important;
  color:#fff !important;
  font-weight:900 !important;
  font-size:15px;
  cursor:pointer;
  text-align:center;
  text-decoration:none;
  line-height:50px;
  box-shadow:0 12px 26px rgba(20,119,255,.22),0 0 0 1px rgba(255,255,255,.07) inset;
}

.ga-button.secondary{
  margin-top:12px;
  background:linear-gradient(90deg,#1459af,#22c7f7) !important;
}

.ga-card .submit-row{
  margin-top:8px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.ga-status-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:22px;
}

.ga-status-card{
  border:1px solid rgba(56,189,248,.19);
  border-radius:14px;
  background:rgba(3,13,27,.68);
  padding:12px;
  text-align:center;
  min-height:72px;
}

.ga-status-card small{
  display:block;
  color:var(--ga-muted);
  text-transform:uppercase;
  font-weight:900;
  font-size:10px;
  letter-spacing:.09em;
}

.ga-status-card b{
  display:block;
  margin-top:8px;
  color:var(--ga-ok);
  font-size:16px;
}

.ga-footer{
  text-align:center;
  color:var(--ga-muted);
  margin-top:18px;
  font-size:12px;
  font-weight:700;
}

.ga-shield{
  width:126px;
  height:126px;
  margin:0 auto 16px;
  position:relative;
  display:grid;
  place-items:center;
}

.ga-shield:before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:conic-gradient(var(--ga-cyan),var(--ga-blue),var(--ga-ok),var(--ga-cyan));
  animation:gaRotate 7s linear infinite;
  filter:drop-shadow(0 0 18px rgba(22,216,255,.38));
}

.ga-shield:after{
  content:"";
  position:absolute;
  inset:9px;
  border-radius:50%;
  background:radial-gradient(circle,#0c2742,#03101f 68%);
  border:1px solid rgba(125,211,252,.25);
}

.ga-shield span{
  position:relative;
  z-index:1;
  font-size:42px;
  color:var(--ga-ok);
  animation:gaPulse 1.8s ease-in-out infinite;
}

.ga-countdown{
  height:10px;
  border-radius:999px;
  background:#0b2540;
  overflow:hidden;
  margin:16px 0 6px;
}

.ga-countdown span{
  display:block;
  height:100%;
  width:74%;
  background:linear-gradient(90deg,var(--ga-ok),var(--ga-cyan));
  border-radius:999px;
  animation:gaPulse 2s ease-in-out infinite;
}

.ga-link{
  display:block;
  color:#9bdcff;
  text-align:center;
  margin-top:14px;
  text-decoration:none;
}

.msg,
.errornote{
  padding:10px 12px !important;
  border-radius:10px !important;
  margin:10px 0 !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
}

.msg.error,
.errornote{
  background:rgba(248,113,113,.16) !important;
  border:1px solid rgba(248,113,113,.35) !important;
}

.msg.success{
  background:rgba(74,222,128,.14) !important;
  border:1px solid rgba(74,222,128,.32) !important;
}

@media(max-width:680px){
  html,body.ga-access-body,body.login{overflow:auto}
  .ga-shell{padding:24px 14px}
  .ga-card{padding:26px 20px;border-radius:18px}
  .ga-title{font-size:25px}
  .ga-logo img{max-width:300px}
  .ga-status-grid{grid-template-columns:1fr}
}