:root{
  --radius:1rem;
  --bg:#070918;
  --foreground:#f8fafc;
  --muted:#a5adbf;
  --muted-soft:#7d879c;
  --glass:rgba(255,255,255,.065);
  --glass-strong:rgba(255,255,255,.105);
  --glass-border:rgba(255,255,255,.18);
  --glass-highlight:rgba(255,255,255,.34);
  --primary:#20d4ec;
  --accent:#d070d7;
  --aurora-1:#20bced;
  --aurora-2:#cf65db;
  --aurora-3:#18c985;
  --danger:#ff4d62;
  --shadow-glass:
    0 28px 90px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(0,0,0,.26);
}

*{
  box-sizing:border-box;
}

html,
body{
  min-height:100%;
}

body{
  margin:0;
  min-height:100vh;
  overflow-x:hidden;
  color:var(--foreground);
  font-family:"Space Grotesk", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background-color:#050714;
  background-image:
    radial-gradient(ellipse 80% 60% at 18% 8%, rgba(105,64,180,.35), transparent 60%),
    radial-gradient(ellipse 70% 50% at 88% 92%, rgba(22,166,190,.30), transparent 60%),
    radial-gradient(ellipse 60% 40% at 48% 52%, rgba(178,46,154,.22), transparent 70%),
    linear-gradient(135deg,#15123d 0%,#070918 42%,#020713 100%);
  background-attachment:fixed;
}

button,
input,
textarea{
  font:inherit;
}

button{
  cursor:pointer;
}

a{
  color:inherit;
}

[hidden]{
  display:none !important;
}

h1,
h2,
h3,
p{
  margin:0;
}

p{
  color:var(--muted);
  line-height:1.55;
}

.gm-shell{
  min-height:100vh;
}

.starfield{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:
    radial-gradient(1px 1px at 9% 22%, rgba(255,255,255,.9), transparent),
    radial-gradient(1px 1px at 26% 82%, rgba(255,255,255,.82), transparent),
    radial-gradient(1.4px 1.4px at 54% 38%, rgba(255,255,255,.76), transparent),
    radial-gradient(1px 1px at 72% 66%, rgba(255,255,255,.72), transparent),
    radial-gradient(1px 1px at 90% 18%, rgba(255,255,255,.68), transparent),
    radial-gradient(1px 1px at 42% 92%, rgba(255,255,255,.74), transparent),
    radial-gradient(1.4px 1.4px at 65% 12%, rgba(255,255,255,.76), transparent),
    radial-gradient(1px 1px at 8% 58%, rgba(255,255,255,.66), transparent),
    radial-gradient(1px 1px at 96% 47%, rgba(255,255,255,.72), transparent);
  opacity:.48;
  animation:twinkle 6s ease-in-out infinite alternate;
}

@keyframes twinkle{
  from{ opacity:.32; }
  to{ opacity:.72; }
}

.login-view,
.hub-view{
  position:relative;
  z-index:1;
}

.login-view{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:34px;
}

.login-card-pro,
.profile-editor,
.profile-menu,
.top-profile-card{
  background:
    radial-gradient(circle at 0 0, rgba(255,255,255,.12), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(21,206,224,.12), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.105), rgba(255,255,255,.040));
  border:1px solid var(--glass-border);
  box-shadow:var(--shadow-glass);
  backdrop-filter:blur(28px) saturate(170%);
  -webkit-backdrop-filter:blur(28px) saturate(170%);
  overflow:hidden;
  position:relative;
}

.login-card-pro::before,
.profile-editor::before,
.profile-menu::before,
.top-profile-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,.18), transparent 38%, transparent 62%, rgba(255,255,255,.08));
}

.login-card-pro{
  width:min(560px, 100%);
  display:grid;
  gap:26px;
  padding:50px 52px;
  border-radius:30px;
}

.login-logo{
  justify-self:center;
  width:82px;
  height:82px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:
    radial-gradient(circle at 34% 32%, #302253, #080416 62%, #000 100%);
  box-shadow:
    0 0 42px rgba(32,188,237,.65),
    inset 0 0 22px rgba(0,0,0,.88);
  position:relative;
  z-index:1;
}

.login-logo span{
  color:#fff;
  font-size:27px;
  font-weight:700;
  letter-spacing:.08em;
  text-shadow:0 0 14px rgba(32,212,236,.95);
}

.login-card-head{
  position:relative;
  z-index:1;
  text-align:center;
}

.login-card-head h1{
  font-size:clamp(2.2rem, 4vw, 3.1rem);
  line-height:1;
  letter-spacing:-.055em;
  font-weight:700;
}

.login-card-head p{
  margin-top:8px;
  font-size:1rem;
}

.gm-field{
  display:grid;
  gap:9px;
  position:relative;
  z-index:1;
}

.gm-field span{
  color:rgba(214,219,236,.72);
  font-size:.84rem;
  font-weight:700;
}

.gm-field input,
.gm-field textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.18);
  outline:none;
  color:#fff;
  background:rgba(255,255,255,.070);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 16px 34px rgba(0,0,0,.13);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease, transform .18s ease;
}

.gm-field input{
  height:58px;
  padding:0 18px;
  border-radius:18px;
  font-weight:650;
}

.gm-field textarea{
  min-height:112px;
  padding:16px 18px;
  resize:vertical;
  border-radius:18px;
}

.gm-field input::placeholder,
.gm-field textarea::placeholder{
  color:rgba(198,205,224,.54);
}

.gm-field input:hover,
.gm-field textarea:hover{
  background:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.26);
}

.gm-field input:focus,
.gm-field textarea:focus{
  transform:translateY(-1px);
  border-color:rgba(32,212,236,.62);
  box-shadow:
    0 0 0 3px rgba(32,212,236,.18),
    0 18px 42px rgba(32,212,236,.10);
}

.gm-field input:disabled{
  opacity:.62;
  cursor:not-allowed;
}

.gm-primary-btn,
.gm-secondary-btn{
  min-height:58px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,.30);
  border-radius:19px;
  color:#101427;
  background:linear-gradient(135deg, rgba(24,194,216,.98), rgba(203,111,212,.96));
  box-shadow:
    0 16px 38px rgba(32,212,236,.30),
    inset 0 1px 0 rgba(255,255,255,.42);
  font-weight:700;
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease;
  position:relative;
  z-index:1;
}

.gm-primary-btn:hover,
.gm-secondary-btn:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
  box-shadow:
    0 22px 50px rgba(32,212,236,.38),
    inset 0 1px 0 rgba(255,255,255,.48);
}

.form-error{
  min-height:19px;
  color:#fecaca;
  font-size:.86rem;
  font-weight:700;
  text-align:center;
  position:relative;
  z-index:1;
}

/* Паинел принсипал */

.hub-view{
  min-height:100vh;
  padding:28px 38px 34px;
}

.hub-topbar{
  position:relative;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

.hub-brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
  padding:0;
  border:0;
  color:inherit;
  background:transparent;
  text-align:left;
}

.hub-logo{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  font-weight:700;
  letter-spacing:.08em;
  background:
    radial-gradient(circle at 34% 32%, #302253, #080416 62%, #000 100%);
  box-shadow:
    0 0 30px rgba(32,188,237,.70),
    inset 0 0 16px rgba(0,0,0,.88);
  text-shadow:0 0 10px rgba(32,212,236,.95);
}

.hub-brand h1{
  font-size:1.05rem;
  line-height:1.05;
  font-weight:700;
  letter-spacing:-.025em;
}

.hub-brand p{
  margin-top:2px;
  font-size:.85rem;
}

.profile-wrap{
  position:relative;
  display:flex;
  justify-content:flex-end;
}

.top-profile-card{
  min-width:300px;
  height:68px;
  display:flex;
  align-items:center;
  gap:13px;
  padding:8px 18px 8px 8px;
  border-radius:999px;
  border-color:rgba(255,255,255,.22);
  color:#fff;
}

.top-profile-card img,
#profile-avatar-fallback{
  width:52px;
  height:52px;
  flex:0 0 52px;
  border-radius:50%;
}

.top-profile-card img{
  object-fit:cover;
  border:2px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.12);
}

#profile-avatar-fallback{
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:700;
  background:linear-gradient(135deg, var(--aurora-1), var(--aurora-2));
}

.profile-card-copy{
  min-width:0;
  flex:1;
  position:relative;
  z-index:1;
}

.profile-card-copy strong,
.profile-card-copy small{
  display:block;
  text-align:left;
  line-height:1.12;
}

.profile-card-copy strong{
  max-width:170px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:1rem;
  font-weight:700;
}

.profile-card-copy small{
  margin-top:3px;
  max-width:170px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:var(--muted);
  font-size:.82rem;
}

.profile-chevron{
  position:relative;
  z-index:1;
  color:rgba(255,255,255,.72);
  font-size:1.25rem;
  transform:translateY(-2px);
}

.profile-menu{
  position:absolute;
  top:78px;
  right:0;
  width:330px;
  z-index:50;
  padding:12px;
  border-radius:30px;
}

.profile-menu-item{
  width:100%;
  min-height:58px;
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 14px;
  border:0;
  border-radius:18px;
  color:#f6f7ff;
  background:transparent;
  text-align:left;
  font-size:1.05rem;
  font-weight:700;
  transition:background .18s ease, transform .18s ease;
  position:relative;
  z-index:1;
}

.profile-menu-item span{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.09);
  font-size:1rem;
}

.profile-menu-item:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.09);
}

.profile-menu-item.is-danger{
  color:#ff4d62;
}

.profile-menu-line{
  position:relative;
  z-index:1;
  height:1px;
  margin:8px 0;
  background:rgba(255,255,255,.16);
}

.hub-page{
  display:none;
}

.hub-page.is-active{
  display:block;
}

/* Витрине орбитал */

.solar-wrap{
  min-height:calc(100vh - 118px);
  display:grid;
  grid-template-rows:1fr auto;
  place-items:center;
  padding:10px 0 18px;
}

.solar{
  --size:min(72vmin, 680px);
  width:var(--size);
  height:var(--size);
  position:relative;
  display:grid;
  place-items:center;
}

.blackhole{
  position:absolute;
  width:25%;
  height:25%;
  border-radius:50%;
  display:grid;
  place-items:center;
  z-index:4;
  background:
    radial-gradient(circle at 34% 34%, rgba(193,162,222,.86), rgba(22,192,196,.88) 54%, rgba(2,8,18,.96) 55%, #02020a 100%);
  box-shadow:
    0 0 70px 16px rgba(31,212,226,.38),
    0 0 130px 34px rgba(207,101,219,.25),
    inset 0 0 42px rgba(0,0,0,.82);
  animation:pulseCore 4s ease-in-out infinite;
}

.blackhole::before{
  content:"";
  position:absolute;
  inset:-34%;
  border-radius:50%;
  background:conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(32,212,236,.86) 74deg,
    rgba(207,101,219,.82) 186deg,
    rgba(32,212,236,.76) 302deg,
    transparent 360deg
  );
  filter:blur(16px);
  animation:spinRaw 8s linear infinite;
  z-index:-1;
}

.blackhole::after{
  content:"";
  position:absolute;
  inset:10%;
  border-radius:50%;
  box-shadow:
    inset 16px 12px 26px rgba(0,0,0,.68),
    16px 18px 24px rgba(0,0,0,.50);
  pointer-events:none;
}

.blackhole-label{
  color:white;
  font-size:clamp(2.8rem, 7vmin, 4.8rem);
  font-weight:700;
  letter-spacing:.04em;
  text-shadow:
    0 0 14px rgba(255,255,255,.95),
    0 0 32px rgba(32,212,236,.85);
  z-index:2;
}

.orbit{
  position:absolute;
  top:50%;
  left:50%;
  border-radius:50%;
  border:1px dashed rgba(255,255,255,.12);
  animation:orbitRotate linear infinite;
  --start-angle:-138deg;
}

.orbit-1{
  width:46%;
  height:46%;
  animation-duration:18s;
  --start-angle:-154deg;
}

.orbit-2{
  width:66%;
  height:66%;
  animation-duration:26s;
  animation-direction:reverse;
  --start-angle:-128deg;
}

.orbit-3{
  width:86%;
  height:86%;
  animation-duration:36s;
  --start-angle:92deg;
}

.orbit-4{
  width:102%;
  height:102%;
  animation-duration:44s;
  --start-angle:22deg;
}

.orbit-5{
  width:118%;
  height:118%;
  animation-duration:52s;
  animation-direction:reverse;
  --start-angle:-72deg;
}

.planet{
  position:absolute;
  top:50%;
  left:100%;
  width:68px;
  height:68px;
  transform:translate(-50%, -50%);
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.34);
  color:white;
  text-decoration:none;
  text-align:center;
  font-size:.77rem;
  line-height:1.03;
  font-weight:700;
  background:var(--planet-color, var(--aurora-1));
  box-shadow:
    0 0 34px var(--planet-color, var(--aurora-1)),
    inset -7px -9px 16px rgba(0,0,0,.42),
    inset 5px 7px 12px rgba(255,255,255,.24);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;
  animation:planetCounter linear infinite;
  animation-duration:inherit;
}

.planet:hover{
  transform:translate(-50%, -50%) scale(1.14);
  filter:brightness(1.08);
  box-shadow:
    0 0 46px var(--planet-color, var(--aurora-1)),
    0 0 80px rgba(255,255,255,.10),
    inset -7px -9px 16px rgba(0,0,0,.42),
    inset 5px 7px 12px rgba(255,255,255,.28);
}

.solar-help{
  max-width:620px;
  margin-top:8px;
  color:rgba(189,197,215,.78);
  text-align:center;
  font-size:1rem;
}

@keyframes orbitRotate{
  from{
    transform:translate(-50%, -50%) rotate(var(--start-angle));
  }
  to{
    transform:translate(-50%, -50%) rotate(calc(var(--start-angle) + 360deg));
  }
}

@keyframes planetCounter{
  from{ rotate:0deg; }
  to{ rotate:-360deg; }
}

@keyframes pulseCore{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.04); }
}

@keyframes spinRaw{
  to{ transform:rotate(360deg); }
}

/* Перфил */

.profile-page{
  width:min(980px, 100%);
  margin:0 auto;
  padding:28px 0 60px;
}

.back-link{
  display:inline-flex;
  align-items:center;
  margin-bottom:22px;
  padding:0;
  border:0;
  color:rgba(189,197,215,.85);
  background:transparent;
  font-size:1rem;
  font-weight:600;
  transition:color .18s ease, transform .18s ease;
}

.back-link:hover{
  color:#fff;
  transform:translateX(-2px);
}

.profile-editor{
  display:grid;
  gap:28px;
  padding:54px;
  border-radius:30px;
}

.profile-editor-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  position:relative;
  z-index:1;
}

.profile-editor-head h2{
  font-size:2.1rem;
  line-height:1.05;
  letter-spacing:-.055em;
}

.profile-editor-head p{
  margin-top:8px;
  font-size:1.03rem;
}

.profile-lock-badge{
  height:max-content;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 13px;
  border-radius:999px;
  color:#dbeafe;
  background:rgba(59,130,246,.14);
  border:1px solid rgba(96,165,250,.25);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  position:relative;
  z-index:1;
}

.profile-lock-badge.is-locked{
  color:#fecaca;
  background:rgba(239,68,68,.12);
  border-color:rgba(248,113,113,.26);
}

.profile-photo-row{
  display:flex;
  align-items:center;
  gap:26px;
  position:relative;
  z-index:1;
}

.profile-avatar-xl{
  width:108px;
  height:108px;
  flex:0 0 108px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:50%;
  border:3px solid rgba(255,255,255,.45);
  background:rgba(255,255,255,.12);
  box-shadow:0 18px 42px rgba(0,0,0,.22);
}

.profile-avatar-xl img,
.profile-avatar-xl span{
  width:100%;
  height:100%;
  border-radius:50%;
}

.profile-avatar-xl img{
  object-fit:cover;
}

.profile-avatar-xl span{
  display:grid;
  place-items:center;
  color:#fff;
  font-size:2rem;
  font-weight:700;
  background:linear-gradient(135deg, var(--aurora-1), var(--aurora-2));
}

.profile-photo-action{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 25px;
  border-radius:999px;
  color:#f6f7ff;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.055);
  font-weight:700;
  cursor:pointer;
  transition:background .18s ease, transform .18s ease;
}

.profile-photo-action:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.09);
}

.profile-photo-row p{
  margin-top:12px;
  font-size:.88rem;
}

.profile-fields{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:22px;
  position:relative;
  z-index:1;
}

.profile-wide{
  grid-column:1 / -1;
}

.profile-extra-details{
  position:relative;
  z-index:1;
  padding:16px 0 0;
  border-top:1px solid rgba(255,255,255,.10);
}

.profile-extra-details summary{
  width:max-content;
  margin-bottom:18px;
  color:rgba(255,255,255,.84);
  font-weight:700;
  cursor:pointer;
}

.profile-savebar{
  display:flex;
  align-items:center;
  gap:16px;
  position:relative;
  z-index:1;
}

.profile-savebar .gm-primary-btn{
  min-width:230px;
}

.profile-saved-msg{
  color:#86efac;
  font-weight:700;
}

#profile-avatar-img[hidden],
#profile-avatar-fallback[hidden],
#profile-preview-img[hidden],
#profile-preview-fallback[hidden]{
  display:none !important;
}

/* Эстадос */

body.is-login .login-view{
  display:grid;
}

body.is-login .hub-view{
  display:none !important;
}

body.is-hub .login-view{
  display:none !important;
}

body.is-hub .hub-view{
  display:block;
}

@media(max-width:980px){
  .hub-view{
    padding:22px;
  }

  .hub-topbar{
    align-items:flex-start;
    flex-direction:column;
  }

  .profile-wrap,
  .top-profile-card{
    width:100%;
  }

  .profile-menu{
    left:0;
    right:auto;
    width:min(330px, 100%);
  }

  .solar{
    --size:min(86vmin, 620px);
  }

  .profile-editor{
    padding:34px;
  }

  .profile-fields{
    grid-template-columns:1fr;
  }
}

@media(max-width:680px){
  .login-view{
    padding:18px;
  }

  .login-card-pro{
    padding:34px 24px;
    border-radius:26px;
  }

  .login-logo{
    width:70px;
    height:70px;
  }

  .hub-view{
    padding:18px;
  }

  .top-profile-card{
    min-width:0;
  }

  .profile-card-copy strong,
  .profile-card-copy small{
    max-width:100%;
  }

  .solar-wrap{
    min-height:calc(100vh - 150px);
  }

  .planet{
    width:58px;
    height:58px;
    font-size:.68rem;
  }

  .blackhole-label{
    font-size:2.4rem;
  }

  .solar-help{
    font-size:.9rem;
  }

  .profile-editor{
    padding:28px 22px;
  }

  .profile-editor-head,
  .profile-photo-row,
  .profile-savebar{
    align-items:flex-start;
    flex-direction:column;
  }

  .profile-savebar .gm-primary-btn{
    width:100%;
    min-width:0;
  }
}

/* Конфигурасао дас орбитас */
.solar{
  --size:min(70vmin, 620px);
  overflow:visible;
}

.blackhole{
  width:26%;
  height:26%;
}

.orbit{
  pointer-events:none;
  overflow:visible;
  z-index:2;
  animation:gmOrbitClean var(--orbit-speed, 24s) linear var(--orbit-phase-delay, 0s) infinite !important;
  animation-direction:normal !important;
}

.orbit-1{
  width:56%;
  height:56%;
  --start-angle:-18deg;
  --label-start:18deg;
  --orbit-speed:22s;
}

.orbit-2{
  width:76%;
  height:76%;
  --start-angle:-138deg;
  --label-start:138deg;
  --orbit-speed:30s;
}

.orbit-3{
  width:96%;
  height:96%;
  --start-angle:136deg;
  --label-start:-136deg;
  --orbit-speed:38s;
}

.orbit-4{
  width:110%;
  height:110%;
  --start-angle:48deg;
  --label-start:-48deg;
  --orbit-speed:46s;
}

.orbit-5{
  width:124%;
  height:124%;
  --start-angle:-72deg;
  --label-start:72deg;
  --orbit-speed:54s;
}

.planet{
  pointer-events:auto;
  width:86px;
  height:86px;
  transform:translate(-50%, -50%) !important;
  animation:none !important;
  overflow:hidden;
  font-size:0 !important;
}

.planet:hover{
  transform:translate(-50%, -50%) scale(1.12) !important;
}

.planet-label{
  position:relative;
  z-index:5;
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  padding:10px;
  color:#fff;
  font-size:.9rem;
  line-height:1.02;
  font-weight:900;
  text-align:center;
  text-transform:uppercase;
  letter-spacing:-.035em;
  white-space:normal;
  pointer-events:none;
  text-shadow:
    0 1px 2px rgba(0,0,0,.95),
    0 0 8px rgba(255,255,255,.90),
    0 0 18px var(--planet-color);
  -webkit-text-stroke:.35px rgba(0,0,0,.35);
  transform:rotate(var(--label-start));
  animation:gmLabelClean var(--orbit-speed, 24s) linear var(--orbit-phase-delay, 0s) infinite;
}

.planet[data-app-id="ativos"] .planet-label{
  font-size:.78rem;
  line-height:1.05;
  padding:9px;
}

.planet[data-app-id="chamados"] .planet-label{
  font-size:.74rem;
  letter-spacing:-.045em;
}

.planet[data-app-id="estoque"] .planet-label{
  font-size:.82rem;
}

@keyframes gmOrbitClean{
  from{
    transform:translate(-50%, -50%) rotate(var(--start-angle));
  }

  to{
    transform:translate(-50%, -50%) rotate(calc(var(--start-angle) + 360deg));
  }
}

@keyframes gmLabelClean{
  from{
    transform:rotate(var(--label-start));
  }

  to{
    transform:rotate(calc(var(--label-start) - 360deg));
  }
}
/* Планетас рапидос пара асесо фасил */
.quick-apps{
  position:fixed;
  right:34px;
  top:50%;
  z-index:18;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:center;
  gap:10px;
  width:178px;
  padding:12px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at 0 0, rgba(255,255,255,.10), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.030));
  box-shadow:
    0 20px 58px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter:blur(22px) saturate(160%);
  transform:translateY(-42%);
}

.quick-apps::before{
  content:"Acessos rápidos";
  display:block;
  margin:0 4px 4px;
  color:rgba(226,232,240,.70);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.quick-planet{
  min-height:46px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 10px 6px 6px;
  border-radius:999px;
  color:#fff;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.055);
  box-shadow:none;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
}

.quick-planet::before{
  content:"";
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:50%;
  background:var(--planet-color, var(--aurora-1));
  box-shadow:
    0 0 18px var(--planet-color, var(--aurora-1)),
    inset -5px -6px 10px rgba(0,0,0,.38),
    inset 4px 5px 8px rgba(255,255,255,.25);
}

.quick-planet:hover{
  transform:translateX(-3px);
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.24);
  filter:none;
  box-shadow:none;
}

.quick-planet-label{
  min-width:0;
  color:#fff;
  font-size:.78rem;
  line-height:1.05;
  font-weight:900;
  text-align:left;
  text-transform:uppercase;
  letter-spacing:-.025em;
  text-shadow:
    0 1px 2px rgba(0,0,0,.95),
    0 0 8px rgba(255,255,255,.34);
  -webkit-text-stroke:0;
}

.quick-planet[data-app-id="ativos"] .quick-planet-label{
  font-size:.70rem;
  line-height:1.04;
}

.quick-planet[data-app-id="chamados"] .quick-planet-label{
  font-size:.73rem;
}

.quick-planet[data-app-id="estoque"] .quick-planet-label{
  font-size:.76rem;
}

@media(max-width:1100px){
  .quick-apps{
    position:static;
    width:auto;
    max-width:620px;
    flex-direction:row;
    flex-wrap:wrap;
    margin-top:18px;
    padding:10px;
    transform:none;
  }

  .quick-apps::before{
    width:100%;
    text-align:center;
  }

  .quick-planet{
    flex:1 1 160px;
  }
}

@media(max-width:680px){
  .quick-apps{
    gap:8px;
    margin-top:14px;
  }

  .quick-planet{
    min-height:42px;
  }

  .quick-planet::before{
    width:30px;
    height:30px;
    flex-basis:30px;
  }

  .quick-planet-label{
    font-size:.68rem;
  }

  .quick-planet[data-app-id="ativos"] .quick-planet-label{
    font-size:.62rem;
  }
}

/* Фундо атрас до логотипо GM */
.hub-logo{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at center, rgba(0,0,0,.18), rgba(0,0,0,.56)),
    linear-gradient(135deg, rgba(32,212,236,.30), rgba(207,101,219,.24));
}

.hub-logo::before{
  content:"";
  position:absolute;
  inset:3px;
  z-index:-1;
  border-radius:50%;
  background:url("/favicon.ico") center / cover no-repeat;
  opacity:.72;
  filter:saturate(1.18) brightness(.95);
}

.hub-logo::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:50%;
  background:
    radial-gradient(circle at center, rgba(0,0,0,.05), rgba(0,0,0,.48)),
    radial-gradient(circle at 50% 50%, rgba(32,212,236,.18), transparent 68%);
}

/* цвета под логотип компании */
.planet[data-app-id="ativos"] .planet-label,
.quick-planet[data-app-id="ativos"] .quick-planet-label{
  color:#fff;
  text-shadow:
    0 1px 2px rgba(0,0,0,.95),
    0 0 8px rgba(255,255,255,.70),
    0 0 18px rgba(197,139,35,.75);
}
/* Планета GM Костура */

.planet[data-app-id="costura"],
.planet[data-app-id="gm-costura"]{
  background:
    radial-gradient(circle at 32% 28%, rgba(255,255,255,.36), transparent 24%),
    radial-gradient(circle at 58% 64%, rgba(12,62,54,.42), transparent 46%),
    linear-gradient(145deg, #48b99d, #2f9b83 48%, #176456);
  box-shadow:
    0 0 34px rgba(47,155,131,.88),
    0 0 64px rgba(47,155,131,.26),
    inset -8px -10px 18px rgba(0,0,0,.42),
    inset 6px 7px 13px rgba(255,255,255,.25);
}

/* Линии нити */

/* Внутренние линии планет */

.planet::before,
.planet::after{
  content:"";
  position:absolute;
  left:7px;
  right:7px;
  top:50%;
  height:28px;
  margin-top:-14px;
  z-index:2;
  border:1px solid rgba(255,255,255,.25);
  border-radius:50%;
  pointer-events:none;
  box-shadow:
    0 0 8px rgba(255,255,255,.12),
    inset 0 0 5px rgba(255,255,255,.08);
}

.planet::before{
  transform:rotate(30deg);
}

.planet::after{
  transform:rotate(-32deg);
}

/* Название планеты */

.planet[data-app-id="costura"] .planet-label,
.planet[data-app-id="gm-costura"] .planet-label{
  font-size:.76rem;
  line-height:1.02;
  padding:10px;
  text-shadow:
    0 1px 2px rgba(0,0,0,.96),
    0 0 8px rgba(255,255,255,.76),
    0 0 18px rgba(47,155,131,.88);
}

/* Быстрый доступ */

.quick-planet[data-app-id="costura"] .quick-planet-label,
.quick-planet[data-app-id="gm-costura"] .quick-planet-label{
  font-size:.72rem;
}

.quick-planet[data-app-id="costura"]::before,
.quick-planet[data-app-id="gm-costura"]::before{
  background:
    radial-gradient(circle at 32% 28%, rgba(255,255,255,.34), transparent 24%),
    linear-gradient(145deg, #48b99d, #2f9b83 52%, #176456);
}

/* Identidade solar e estrelas adaptada do componente enviado */
.gm-orbit-starfield{
  position:absolute;
  inset:-9%;
  z-index:1;
  overflow:visible;
  pointer-events:none;
}

.gm-orbit-star{
  --star-size:12px;
  position:absolute;
  width:var(--star-size);
  height:var(--star-size);
  opacity:.22;
  filter:drop-shadow(0 0 7px rgba(255,255,255,.88));
  animation:gmStarTwinkle var(--star-speed, 3s) ease-in-out infinite;
}

.gm-orbit-star::before,
.gm-orbit-star::after{
  content:"";
  position:absolute;
  inset:0;
  margin:auto;
  border-radius:999px;
  background:linear-gradient(180deg, #ffffff, #b9ecff 62%, rgba(96,165,250,.15));
  box-shadow:0 0 8px rgba(255,255,255,.92), 0 0 18px rgba(56,189,248,.42);
}

.gm-orbit-star::before{
  width:3px;
  height:100%;
}

.gm-orbit-star::after{
  width:100%;
  height:3px;
}

.gm-orbit-star-1{ left:5%; top:20%; --star-size:11px; --star-speed:3s; }
.gm-orbit-star-2{ left:17%; top:74%; --star-size:8px; --star-speed:2.2s; animation-delay:-.7s; }
.gm-orbit-star-3{ left:82%; top:23%; --star-size:14px; --star-speed:4s; animation-delay:-1.6s; }
.gm-orbit-star-4{ left:68%; top:88%; --star-size:10px; --star-speed:3.2s; animation-delay:-2s; }
.gm-orbit-star-5{ left:31%; top:5%; --star-size:7px; --star-speed:1.8s; animation-delay:-.4s; }
.gm-orbit-star-6{ left:93%; top:62%; --star-size:9px; --star-speed:4.3s; animation-delay:-2.7s; }
.gm-orbit-star-7{ left:48%; top:96%; --star-size:12px; --star-speed:2.6s; animation-delay:-1.1s; }

.planet{
  background:
    radial-gradient(circle at 29% 24%, rgba(255,255,255,.56), transparent 16%),
    radial-gradient(circle at 68% 72%, rgba(0,0,0,.42), transparent 44%),
    radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--planet-color) 86%, white 14%), var(--planet-color) 58%, color-mix(in srgb, var(--planet-color) 72%, black 28%)) !important;
  box-shadow:
    0 0 30px color-mix(in srgb, var(--planet-color) 76%, transparent),
    0 0 58px color-mix(in srgb, var(--planet-color) 30%, transparent),
    inset -9px -11px 20px rgba(0,0,0,.44),
    inset 7px 8px 15px rgba(255,255,255,.22) !important;
}

.planet::before{
  inset:-20% !important;
  left:-20% !important;
  right:-20% !important;
  top:-20% !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  z-index:1 !important;
  border:0 !important;
  border-radius:50% !important;
  background:conic-gradient(from 0deg, transparent 0 25%, rgba(255,255,255,.22) 33%, transparent 42% 72%, rgba(255,255,255,.12) 80%, transparent 88%) !important;
  box-shadow:none !important;
  animation:gmPlanetAuraSpin 8s linear infinite;
}

.planet::after{
  inset:5px !important;
  left:5px !important;
  right:5px !important;
  top:5px !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  z-index:2 !important;
  border:1px solid rgba(255,255,255,.13) !important;
  border-radius:50% !important;
  background:
    radial-gradient(circle at 22% 62%, rgba(255,255,255,.30) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 31%, rgba(255,255,255,.24) 0 1px, transparent 2px),
    radial-gradient(circle at 65% 76%, rgba(255,255,255,.17) 0 1px, transparent 2px) !important;
  box-shadow:inset 0 0 13px rgba(255,255,255,.06) !important;
  animation:gmPlanetSurfacePulse 4.6s ease-in-out infinite;
}

.planet:hover{
  filter:brightness(1.12) saturate(1.08) !important;
}

.quick-planet::before{
  background:
    radial-gradient(circle at 29% 24%, rgba(255,255,255,.52), transparent 17%),
    radial-gradient(circle at 70% 72%, rgba(0,0,0,.40), transparent 45%),
    var(--planet-color) !important;
  animation:gmPlanetSurfacePulse 4.6s ease-in-out infinite;
}

@keyframes gmStarTwinkle{
  0%,100%{ opacity:.12; transform:scale(.72) rotate(0deg); }
  50%{ opacity:1; transform:scale(1.18) rotate(45deg); }
}

@keyframes gmPlanetAuraSpin{
  to{ transform:rotate(360deg); }
}

@keyframes gmPlanetSurfacePulse{
  0%,100%{ opacity:.72; filter:brightness(.96); }
  50%{ opacity:1; filter:brightness(1.16); }
}

@media(max-width:680px){
  .gm-orbit-starfield{ inset:-3%; }
  .gm-orbit-star-1,
  .gm-orbit-star-4,
  .gm-orbit-star-6{ display:none; }
}

/* Easter egg: Convergencia GM */
.gm-eclipse-layer{
  position:absolute;
  inset:-14%;
  z-index:3;
  overflow:visible;
  pointer-events:none;
}

.gm-eclipse-lens,
.gm-eclipse-beam,
.gm-eclipse-waves,
.gm-eclipse-particles,
.gm-eclipse-message{
  position:absolute;
  left:50%;
  top:50%;
  pointer-events:none;
}

.gm-eclipse-waves{
  width:1px;
  height:1px;
}

.gm-eclipse-waves i{
  position:absolute;
  left:0;
  top:0;
  width:23vmin;
  height:23vmin;
  translate:-50% -50%;
  scale:.2;
  border:1px solid rgba(116,225,255,.78);
  border-radius:50%;
  opacity:0;
  box-shadow:
    0 0 12px rgba(255,255,255,.48),
    inset 0 0 18px rgba(96,86,255,.34),
    0 0 34px rgba(53,203,255,.3);
}

.gm-eclipse-lens{
  width:31%;
  aspect-ratio:1;
  translate:-50% -50%;
  scale:.35;
  border-radius:50%;
  opacity:0;
  background:
    radial-gradient(circle, transparent 43%, rgba(255,255,255,.96) 45%, rgba(79,220,255,.74) 47%, rgba(118,75,255,.48) 53%, transparent 65%);
  box-shadow:
    0 0 24px rgba(255,255,255,.9),
    0 0 80px rgba(55,205,255,.68),
    0 0 150px rgba(111,65,255,.48);
  filter:blur(.2px);
}

.gm-eclipse-lens::before,
.gm-eclipse-lens::after{
  content:"";
  position:absolute;
  inset:-28%;
  border-radius:50%;
  border:1px solid rgba(102,225,255,.32);
  border-left-color:rgba(255,255,255,.94);
  border-right-color:rgba(137,83,255,.82);
  filter:drop-shadow(0 0 10px rgba(72,211,255,.72));
}

.gm-eclipse-lens::after{
  inset:-51%;
  opacity:.58;
  rotate:72deg;
  border-style:dashed;
}

.gm-eclipse-beam{
  width:132%;
  height:2px;
  translate:-50% -50%;
  rotate:-8deg;
  scale:.05 1;
  opacity:0;
  transform-origin:center;
  background:linear-gradient(90deg,
    transparent 0%,
    #c58b23 12%,
    #d97a1f 27%,
    #ffffff 46%,
    #ffffff 54%,
    #2f9b83 73%,
    #2448b8 88%,
    transparent 100%);
  box-shadow:0 0 7px #fff, 0 0 18px rgba(58,213,255,.9), 0 0 34px rgba(121,74,255,.72);
}

.gm-eclipse-particles{
  width:1px;
  height:1px;
}

.gm-eclipse-particles i{
  --particle-angle:calc(var(--particle-index) * 30deg);
  position:absolute;
  width:5px;
  height:5px;
  left:-2px;
  top:-2px;
  border-radius:50%;
  opacity:0;
  background:#fff;
  box-shadow:0 0 9px #fff, 0 0 18px #32d7ff;
  transform:rotate(var(--particle-angle)) translateX(28px) scale(.1);
}

.gm-eclipse-message{
  translate:-50% 0;
  width:max-content;
  margin-top:calc(var(--size, 620px) * .19);
  display:grid;
  gap:4px;
  text-align:center;
  opacity:0;
  transform:translateY(12px) scale(.96);
  color:#fff;
  text-shadow:0 0 12px rgba(255,255,255,.88), 0 0 28px rgba(59,211,255,.72);
}

.gm-eclipse-message strong{
  font-size:clamp(.8rem, 1.8vmin, 1.08rem);
  letter-spacing:.28em;
}

.gm-eclipse-message small{
  color:rgba(213,235,255,.88);
  font-size:clamp(.68rem, 1.45vmin, .88rem);
  letter-spacing:.07em;
}

body.gm-eclipse-active .quick-apps,
body.gm-eclipse-active .solar-help{
  opacity:.28;
  filter:blur(1.5px);
  transition:opacity 1.2s ease, filter 1.2s ease;
}

.quick-apps,
.solar-help{
  transition:opacity 1.8s cubic-bezier(.22,.8,.22,1), filter 1.8s ease !important;
}

.gm-blackout-overlay{
  position:fixed;
  inset:0;
  z-index:9998;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  background:#000;
  transition:opacity 1.45s cubic-bezier(.7,0,.25,1), visibility 0s linear 1.45s;
}

.gm-blackout-core,
.gm-blackout-flare{
  position:absolute;
  left:50%;
  top:50%;
  border-radius:50%;
  translate:-50% -50%;
  pointer-events:none;
}

.gm-blackout-core{
  width:18vmin;
  height:18vmin;
  opacity:0;
  background:#000;
  box-shadow:
    0 0 0 2px rgba(222,248,255,.9),
    0 0 35px 8px rgba(69,218,255,.8),
    0 0 100px 30px rgba(105,64,255,.62);
}

.gm-blackout-flare{
  width:1vmin;
  height:1vmin;
  opacity:0;
  background:#fff;
  box-shadow:0 0 45px 18px #fff, 0 0 130px 60px #57d9ff, 0 0 240px 100px #7456ff;
}

body.gm-blackhole-collapse .hub-view{
  pointer-events:none;
}

body.gm-blackhole-collapse .gm-gravity-victim{
  position:relative;
  z-index:4;
  transform-origin:center;
  animation:gmInterfaceSuction 3.75s cubic-bezier(.72,0,.92,.42) var(--gravity-delay, 0ms) forwards !important;
  will-change:transform, opacity, filter;
}

body.gm-blackhole-collapse .hub-view > .starfield{
  animation:gmBackgroundSuction 3.8s cubic-bezier(.72,0,.92,.42) forwards !important;
}

body.gm-blackout .gm-blackout-overlay{
  opacity:1;
  visibility:visible;
  transition:opacity .72s ease-in, visibility 0s;
}

body.gm-blackout .gm-blackout-core{
  animation:gmSingularitySeal 2.9s ease-in-out forwards;
}

body.gm-blackhole-rebirth .gm-blackout-overlay{
  opacity:1;
  visibility:visible;
  animation:gmBlackoutExplosion 8s cubic-bezier(.2,.72,.18,1) forwards;
}

body.gm-blackhole-rebirth .gm-blackout-flare{
  animation:gmRebirthFlare 3.7s cubic-bezier(.18,.78,.2,1) forwards;
}

body.gm-blackhole-rebirth .gm-gravity-victim{
  animation:gmInterfaceEjection 4.05s cubic-bezier(.12,.72,.18,1) var(--gravity-delay, 0ms) forwards !important;
}

body.gm-blackhole-rebirth .hub-view > .starfield{
  animation:gmBackgroundRebirth 4.1s ease-out forwards !important;
}

.solar .orbit,
.solar .blackhole,
.solar .gm-orbit-starfield{
  transition:opacity 1.65s cubic-bezier(.22,.8,.22,1), filter 1.65s ease;
}

.solar.is-eclipse-priming .orbit{
  will-change:transform;
}

.solar.is-converging .orbit{
  animation:gmOrbitConvergence 3.5s cubic-bezier(.7, 0, .16, 1) forwards !important;
}

.solar.is-converging .planet-label{
  animation:gmLabelConvergence 3.5s cubic-bezier(.7, 0, .16, 1) forwards !important;
}

.solar.is-converging .gm-orbit-star{
  animation:gmStarGravity 3.25s cubic-bezier(.7, 0, .16, 1) forwards !important;
}

.solar.is-totality .blackhole{
  z-index:7;
  animation:gmEclipseCore 7.45s ease-in-out forwards !important;
}

.solar.is-totality .blackhole::before{
  animation:gmEclipseCorona 2.1s linear infinite !important;
}

.solar.is-totality .blackhole::after{
  background:radial-gradient(circle, #000 0 58%, rgba(1,5,14,.98) 69%, transparent 72%);
  box-shadow:inset 0 0 24px #000, 0 0 24px rgba(0,0,0,.98);
}

.solar.is-totality .blackhole-label{
  opacity:.72;
  letter-spacing:.14em;
  text-shadow:0 0 11px #fff, 0 0 25px #42dcff, 0 0 46px #7354ff;
  transition:opacity 1.1s ease, letter-spacing 1.4s ease;
}

.solar.is-totality .gm-eclipse-lens{
  animation:gmLensTotality 7.25s cubic-bezier(.2,.8,.2,1) forwards;
}

.solar.is-totality .gm-eclipse-beam{
  animation:gmBeamIgnition 7.05s ease-in-out forwards;
}

.solar.is-totality .gm-eclipse-waves i{
  animation:gmGravityWave 3.1s ease-out infinite;
  animation-delay:calc((var(--wave-index) - 1) * 1s);
}

.solar.is-totality .gm-eclipse-particles i{
  animation:gmParticleOrbit 2.4s ease-in-out infinite;
  animation-delay:calc(var(--particle-index) * -90ms);
}

.solar.is-totality .gm-eclipse-message{
  animation:gmConvergenceMessage 6.55s ease-in-out .45s forwards;
}

.solar.is-totality .planet{
  filter:brightness(1.32) saturate(1.18);
  box-shadow:
    0 0 35px color-mix(in srgb, var(--planet-color) 88%, transparent),
    0 0 72px color-mix(in srgb, var(--planet-color) 48%, transparent),
    inset -9px -11px 20px rgba(0,0,0,.44),
    inset 7px 8px 15px rgba(255,255,255,.3) !important;
}

.solar.is-blackhole-collapse .orbit{
  animation:gmOrbitConsumed 3.72s cubic-bezier(.72,0,.92,.42) forwards !important;
}

.solar.is-blackhole-collapse .planet-label{
  animation:gmLabelConsumed 3.72s cubic-bezier(.72,0,.92,.42) forwards !important;
}

.solar.is-blackhole-collapse .gm-eclipse-message,
.solar.is-blackhole-collapse .gm-eclipse-beam{
  opacity:0 !important;
  transition:opacity 1.1s ease;
}

.solar.is-singularity .blackhole{
  animation:gmBlackHoleSeal 2.9s cubic-bezier(.75,0,.9,.42) forwards !important;
}

.solar.is-blackhole-rebirth .orbit{
  animation:gmOrbitReborn 4.1s cubic-bezier(.12,.72,.18,1) forwards !important;
}

.solar.is-blackhole-rebirth .planet-label{
  animation:gmLabelReborn 4.1s cubic-bezier(.12,.72,.18,1) forwards !important;
}

.solar.is-blackhole-rebirth .blackhole{
  animation:gmBlackHoleBurst 4.05s cubic-bezier(.1,.75,.18,1) forwards !important;
}

.solar.is-eclipse-release{
  animation:gmConvergenceRelease 2.15s ease-out forwards;
}

.solar.is-eclipse-release .gm-eclipse-layer{
  opacity:0;
  scale:1.06;
  transition:opacity 1.9s ease, scale 2.1s ease-out;
}

.solar.is-eclipse-resetting .orbit,
.solar.is-eclipse-resetting .blackhole,
.solar.is-eclipse-resetting .gm-orbit-starfield{
  opacity:0 !important;
  filter:blur(3px) brightness(1.8) !important;
}

@keyframes gmOrbitConvergence{
  from{ transform:var(--eclipse-from-transform); }
  to{ transform:var(--eclipse-target-transform); }
}

@keyframes gmInterfaceSuction{
  0%{ transform:translate(0,0) scale(1) rotate(0); opacity:1; filter:blur(0) brightness(1); }
  58%{ opacity:.88; filter:blur(.3px) brightness(1.15); }
  84%{ opacity:.42; }
  100%{ transform:translate(var(--gravity-x),var(--gravity-y)) scale(.015) rotate(var(--gravity-spin)); opacity:0; filter:blur(5px) brightness(2.2); }
}

@keyframes gmInterfaceEjection{
  0%{ transform:translate(var(--gravity-x),var(--gravity-y)) scale(.015) rotate(var(--gravity-spin)); opacity:0; filter:blur(6px) brightness(3); }
  22%{ opacity:.35; }
  68%{ transform:translate(0,0) scale(1.035) rotate(-1deg); opacity:1; filter:blur(0) brightness(1.35); }
  100%{ transform:translate(0,0) scale(1) rotate(0); opacity:1; filter:blur(0) brightness(1); }
}

@keyframes gmBackgroundSuction{
  0%{ transform:scale(1); opacity:1; filter:blur(0); }
  100%{ transform:scale(.02); opacity:0; filter:blur(8px); }
}

@keyframes gmBackgroundRebirth{
  0%{ transform:scale(.02); opacity:0; filter:blur(8px); }
  55%{ opacity:.75; }
  100%{ transform:scale(1); opacity:1; filter:blur(0); }
}

@keyframes gmOrbitConsumed{
  0%{ transform:var(--eclipse-target-transform); opacity:1; filter:blur(0); }
  100%{ transform:var(--eclipse-target-transform) scale(.001); opacity:0; filter:blur(7px) brightness(2.4); }
}

@keyframes gmLabelConsumed{
  0%{ transform:var(--eclipse-label-target); opacity:1; }
  100%{ transform:var(--eclipse-label-target) scale(.01) rotate(180deg); opacity:0; }
}

@keyframes gmOrbitReborn{
  0%{ transform:var(--eclipse-target-transform) scale(.001); opacity:0; filter:blur(7px) brightness(3); }
  58%{ transform:var(--eclipse-target-transform) scale(1.04); opacity:1; filter:blur(0) brightness(1.45); }
  100%{ transform:var(--eclipse-target-transform) scale(1); opacity:1; filter:blur(0) brightness(1); }
}

@keyframes gmLabelReborn{
  0%{ transform:var(--eclipse-label-target) scale(.01) rotate(-180deg); opacity:0; }
  55%{ opacity:1; }
  100%{ transform:var(--eclipse-label-target) scale(1) rotate(0); opacity:1; }
}

@keyframes gmBlackHoleSeal{
  0%{ transform:scale(.94); opacity:1; filter:brightness(.2); }
  72%{ transform:scale(.3); opacity:1; filter:brightness(.06); }
  100%{ transform:scale(.01); opacity:0; filter:brightness(0); }
}

@keyframes gmBlackHoleBurst{
  0%{ transform:scale(.01); opacity:0; filter:brightness(0); }
  16%{ transform:scale(.2); opacity:1; filter:brightness(4); }
  48%{ transform:scale(1.18); opacity:1; filter:brightness(2.1); }
  100%{ transform:scale(1); opacity:1; filter:brightness(1); }
}

@keyframes gmSingularitySeal{
  0%{ opacity:1; scale:1.4; }
  52%{ opacity:.9; scale:.7; }
  100%{ opacity:0; scale:.02; }
}

@keyframes gmBlackoutExplosion{
  0%,20%{ background:#000; opacity:1; backdrop-filter:blur(0); }
  26%{ background:#fff; opacity:1; }
  32%{ background:rgba(89,212,255,.92); opacity:.96; }
  45%{ background:rgba(39,19,91,.48); opacity:.62; backdrop-filter:blur(3px); }
  66%{ background:radial-gradient(circle at 50% 50%, rgba(72,198,255,.08), rgba(23,10,58,.26) 42%, rgba(2,5,14,.34)); opacity:.46; backdrop-filter:blur(1.5px); }
  84%{ background:radial-gradient(circle at 50% 50%, rgba(72,198,255,.04), rgba(5,9,22,.16) 55%, transparent); opacity:.24; backdrop-filter:blur(0); }
  100%{ background:transparent; opacity:0; visibility:hidden; backdrop-filter:blur(0); }
}

@keyframes gmRebirthFlare{
  0%,28%{ opacity:0; scale:.02; }
  43%{ opacity:1; scale:1; }
  66%{ opacity:.85; scale:24; }
  100%{ opacity:0; scale:58; }
}

@keyframes gmLabelConvergence{
  from{ transform:var(--eclipse-label-from); }
  to{ transform:var(--eclipse-label-target); }
}

@keyframes gmStarGravity{
  0%{ opacity:.45; transform:translate(0,0) scale(1) rotate(0); }
  72%{ opacity:1; }
  100%{ left:50%; top:50%; opacity:0; transform:translate(-50%,-50%) scale(.08) rotate(210deg); }
}

@keyframes gmEclipseCore{
  0%{ transform:scale(1); filter:brightness(1); }
  12%{ transform:scale(.88); filter:brightness(.65); }
  29%,78%{ transform:scale(.94); filter:brightness(.18) contrast(1.4); }
  100%{ transform:scale(1.08); filter:brightness(1.15); }
}

@keyframes gmEclipseCorona{
  to{ transform:rotate(360deg) scale(1.08); }
}

@keyframes gmLensTotality{
  0%{ opacity:0; scale:.35; rotate:-20deg; }
  18%{ opacity:1; scale:1.04; }
  76%{ opacity:.94; scale:1; rotate:18deg; }
  100%{ opacity:0; scale:1.42; rotate:28deg; }
}

@keyframes gmBeamIgnition{
  0%{ opacity:0; scale:.04 1; }
  14%{ opacity:1; scale:1 1; }
  36%,79%{ opacity:.94; scale:1 1; }
  100%{ opacity:0; scale:1.08 6; filter:blur(2px); }
}

@keyframes gmGravityWave{
  0%{ opacity:0; scale:.2; border-width:2px; }
  16%{ opacity:.78; }
  72%{ opacity:.18; }
  100%{ opacity:0; scale:4.2; border-width:.4px; }
}

@keyframes gmParticleOrbit{
  0%{ opacity:0; transform:rotate(var(--particle-angle)) translateX(25px) scale(.1); }
  30%{ opacity:1; }
  70%{ opacity:.9; }
  100%{ opacity:0; transform:rotate(calc(var(--particle-angle) + 210deg)) translateX(108px) scale(1.2); }
}

@keyframes gmConvergenceMessage{
  0%{ opacity:0; transform:translateY(12px) scale(.96); }
  14%,80%{ opacity:1; transform:translateY(0) scale(1); }
  100%{ opacity:0; transform:translateY(-7px) scale(1.02); }
}

@keyframes gmConvergenceRelease{
  0%{ filter:brightness(1); }
  34%{ filter:brightness(2.15) saturate(1.45); }
  68%{ filter:brightness(.72) saturate(.86); }
  100%{ filter:brightness(1); }
}

@media(max-width:680px){
  .gm-eclipse-layer{ inset:-4%; }
  .gm-eclipse-beam{ width:114%; }
  .gm-eclipse-message{ margin-top:calc(var(--size, 620px) * .15); }
}
