@charset "UTF-8";
/****************************************************************************
Copyright (C) 2025 Tejaswi R Seith (owner of AskMySatellite)

This code is proprietary and not open source. It may be used only as part
of the AskMySatellite application (askmysatellite.com). Unauthorized copying, modifying,
or distribution of this code is strictly prohibited.
****************************************************************************/
body {
  color: #17223B;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background: linear-gradient(rgba(0, 255, 255, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 0, 255, 0.08) 1px, transparent 1px), linear-gradient(180deg, #2D2A7B 0%, #3C1D87 100%);
  background-size: 40px 40px, 40px 40px, 100% 100%;
  color: #17223B;
}

#orbit-visualisation {
  position: relative;
  width: 100%;
  height: 100%;
}

.orbit-controls {
  position: absolute;
  top: 1rem;
  left: 1rem;
  background-color: rgba(20, 20, 30, 0.8);
  padding: 1rem 1.5rem;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  font-family: "Inter", sans-serif;
  font-size: 0.9rem;
  color: #eaeaff;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  z-index: 10;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}

.orbit-controls label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.orbit-controls input[type=range] {
  accent-color: #6c63ff;
  cursor: pointer;
}

#orbit-info {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: rgba(20, 20, 30, 0.8);
  padding: 1rem 1.5rem;
  border-radius: 12px;
  font-family: "Inter", sans-serif;
  font-size: 0.9rem;
  color: #eaeaff;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  z-index: 10;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  max-width: 220px;
}
#orbit-info .orbit-info-heading {
  color: #eaeaff;
  margin-top: 0;
  font-size: 1.05rem;
  text-align: center;
  border-bottom: 1px solid #eaeaff;
}
#orbit-info .orbit-info-text {
  color: #eaeaff;
  margin: 0.3rem 0;
  line-height: 1.3rem;
}
#orbit-info .orbit-info-text .orbit-info-span {
  color: #eaeaff;
}

#instruction-panel {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  background-color: rgba(20, 20, 30, 0.8);
  color: #ffffff;
  padding: 12px 16px;
  border-radius: 8px;
  font-family: Arial, sans-serif;
  font-size: 14px;
  max-width: 250px;
  z-index: 10;
}

.instruction-panel-heading {
  margin-top: 0;
  margin-bottom: 8px;
  font-size: 16px;
  text-align: left;
}

.instruction-panel-ul {
  padding-left: 20px;
  margin: 0;
}

.instruction-panel-li {
  color: #eaeaff;
  margin-bottom: 4px;
}
.instruction-panel-li:hover {
  color: #eaeaff;
}

.instruction-panel-warning {
  color: #ffcc00;
}

.new-update-info-text {
  color: #6b46c1;
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.2);
}

#loadingOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.85);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#loadingOverlay.hidden {
  display: none;
}

.overlay-content {
  text-align: center;
  font-size: 1.2rem;
  color: #333;
  padding: 20px 30px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.overlay-content .spinner {
  width: 36px;
  height: 36px;
  border: 4px solid #ccc;
  border-top: 4px solid #333;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 15px;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
section#title-section,
section#app-section,
section#summary-section,
section#breakdown-section,
section#readme-section {
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(23, 34, 59, 0.12);
  box-shadow: 0 8px 24px rgba(23, 34, 59, 0.14), 0 0 18px rgba(108, 99, 255, 0.08);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  color: #17223B;
}
section#title-section .logo-container,
section#title-section .about-app-container,
section#title-section .app-container,
section#title-section .summary-container,
section#title-section .readme-container,
section#app-section .logo-container,
section#app-section .about-app-container,
section#app-section .app-container,
section#app-section .summary-container,
section#app-section .readme-container,
section#summary-section .logo-container,
section#summary-section .about-app-container,
section#summary-section .app-container,
section#summary-section .summary-container,
section#summary-section .readme-container,
section#breakdown-section .logo-container,
section#breakdown-section .about-app-container,
section#breakdown-section .app-container,
section#breakdown-section .summary-container,
section#breakdown-section .readme-container,
section#readme-section .logo-container,
section#readme-section .about-app-container,
section#readme-section .app-container,
section#readme-section .summary-container,
section#readme-section .readme-container {
  background: transparent;
  color: #17223B;
}
section#title-section .readme-container,
section#app-section .readme-container,
section#summary-section .readme-container,
section#breakdown-section .readme-container,
section#readme-section .readme-container {
  font-size: 1.05em;
}
section#title-section #readme-content,
section#app-section #readme-content,
section#summary-section #readme-content,
section#breakdown-section #readme-content,
section#readme-section #readme-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
}
section#title-section #readme-content.show,
section#app-section #readme-content.show,
section#summary-section #readme-content.show,
section#breakdown-section #readme-content.show,
section#readme-section #readme-content.show {
  max-height: 1000px;
  padding-top: 10px;
}
section#title-section #toggle-readme-btn,
section#app-section #toggle-readme-btn,
section#summary-section #toggle-readme-btn,
section#breakdown-section #toggle-readme-btn,
section#readme-section #toggle-readme-btn {
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(23, 34, 59, 0.12);
  border-radius: 12px;
  padding: 6px 12px;
  cursor: pointer;
  color: #17223B;
  margin-bottom: 10px;
  font-weight: 500;
}
section#title-section #toggle-readme-btn:hover,
section#app-section #toggle-readme-btn:hover,
section#summary-section #toggle-readme-btn:hover,
section#breakdown-section #toggle-readme-btn:hover,
section#readme-section #toggle-readme-btn:hover {
  background: hsla(0, 0%, 108%, 0.94);
}
section#title-section .logo-img,
section#app-section .logo-img,
section#summary-section .logo-img,
section#breakdown-section .logo-img,
section#readme-section .logo-img {
  width: 100%;
}
section#title-section .divider-line,
section#app-section .divider-line,
section#summary-section .divider-line,
section#breakdown-section .divider-line,
section#readme-section .divider-line {
  width: 80%;
  /* shorter than full width */
  height: 2px;
  /* thickness */
  margin: 8px auto;
  /* space + center */
  background: linear-gradient(to right, transparent, #2D2A7B, transparent);
  border-radius: 2px;
  /* soft ends */
}
section#title-section .logo-subtitle,
section#app-section .logo-subtitle,
section#summary-section .logo-subtitle,
section#breakdown-section .logo-subtitle,
section#readme-section .logo-subtitle {
  font-family: "Orbitron", sans-serif;
  letter-spacing: 0.75px;
  padding-top: 10px;
  font-size: 0.9rem;
  transition: text-shadow 0.3s ease-in-out;
}
section#title-section .tle-breakdown-container,
section#app-section .tle-breakdown-container,
section#summary-section .tle-breakdown-container,
section#breakdown-section .tle-breakdown-container,
section#readme-section .tle-breakdown-container {
  margin-bottom: 14px;
  font-family: "Courier New", Courier, monospace;
  font-size: 13px;
  color: #17223B;
  line-height: 1.5;
}
section#title-section .tle-breakdown-container ul,
section#app-section .tle-breakdown-container ul,
section#summary-section .tle-breakdown-container ul,
section#breakdown-section .tle-breakdown-container ul,
section#readme-section .tle-breakdown-container ul {
  list-style: none;
  padding: 0;
}
section#title-section .tle-breakdown-container ul li,
section#app-section .tle-breakdown-container ul li,
section#summary-section .tle-breakdown-container ul li,
section#breakdown-section .tle-breakdown-container ul li,
section#readme-section .tle-breakdown-container ul li {
  margin: 3px 0;
  display: flex;
  justify-content: space-between;
}
section#title-section .tle-breakdown-container ul li strong,
section#app-section .tle-breakdown-container ul li strong,
section#summary-section .tle-breakdown-container ul li strong,
section#breakdown-section .tle-breakdown-container ul li strong,
section#readme-section .tle-breakdown-container ul li strong {
  flex: 1;
  color: #2D2A7B;
}
section#title-section .primary-elements-container,
section#title-section .derived-elements-container,
section#app-section .primary-elements-container,
section#app-section .derived-elements-container,
section#summary-section .primary-elements-container,
section#summary-section .derived-elements-container,
section#breakdown-section .primary-elements-container,
section#breakdown-section .derived-elements-container,
section#readme-section .primary-elements-container,
section#readme-section .derived-elements-container {
  background: #fff;
  border: 1px solid rgba(45, 42, 123, 0.18);
  border-radius: 12px;
  padding: 14px;
  margin: 10px;
  box-shadow: 0 0 6px rgba(45, 42, 123, 0.06);
  color: #17223B;
  transition: box-shadow 0.3s ease-in-out;
}
section#title-section .primary-elements-container:hover,
section#title-section .derived-elements-container:hover,
section#app-section .primary-elements-container:hover,
section#app-section .derived-elements-container:hover,
section#summary-section .primary-elements-container:hover,
section#summary-section .derived-elements-container:hover,
section#breakdown-section .primary-elements-container:hover,
section#breakdown-section .derived-elements-container:hover,
section#readme-section .primary-elements-container:hover,
section#readme-section .derived-elements-container:hover {
  box-shadow: 0 0 20px rgba(45, 42, 123, 0.2);
}
section#title-section .primary-elements-container::before,
section#title-section .derived-elements-container::before,
section#app-section .primary-elements-container::before,
section#app-section .derived-elements-container::before,
section#summary-section .primary-elements-container::before,
section#summary-section .derived-elements-container::before,
section#breakdown-section .primary-elements-container::before,
section#breakdown-section .derived-elements-container::before,
section#readme-section .primary-elements-container::before,
section#readme-section .derived-elements-container::before {
  content: attr(data-title);
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  color: #2D2A7B;
  margin-bottom: 8px;
  letter-spacing: 0.6px;
}

.app-btn {
  background: linear-gradient(160deg, rgb(74.9268292683, 36.2146341463, 168.5853658537) 0%, rgb(36.6545454545, 34.2109090909, 100.1890909091) 40%, rgb(87.987804878, 42.5274390244, 197.9725609756) 100%);
  color: #ffffff;
  border: 1px solid rgba(45, 42, 123, 0.25);
  border-radius: 12px;
  padding: 12px 20px;
  font-weight: 600;
  letter-spacing: 0.8px;
  font-size: 0.95rem;
  cursor: pointer;
  background-size: 200% 200%;
  transition: all 0.3s ease, background-position 0.2s ease;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12), inset 0 1px 3px rgba(255, 255, 255, 0.15), inset 0 -2px 4px rgba(0, 0, 0, 0.2);
}
.app-btn:hover {
  background-position: 100% 0%;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.18), 0 0 24px rgba(108, 99, 255, 0.22), inset 0 2px 6px rgba(255, 255, 255, 0.18);
}
.app-btn:active {
  transform: translateY(1px) scale(0.97);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.28), inset 0 -1px 3px rgba(255, 255, 255, 0.08);
}

.app-btn-visualisation {
  background: linear-gradient(135deg, #ff9800, #ff7300);
  border: none;
  color: white;
  font-weight: bold;
  box-shadow: 0 4px 12px rgba(255, 115, 0, 0.5);
  margin-bottom: 10px;
  margin-right: 20px;
}
.app-btn-visualisation:hover {
  box-shadow: 0 8px 24px rgba(255, 115, 0, 0.3), inset 0 2px 6px rgba(255, 255, 255, 0.15);
  transform: translateY(-2px);
}
.app-btn-visualisation::after {
  content: " ↗";
  font-size: 1em;
}

#home-btn {
  display: block;
  align-self: center;
  background-color: #3C1D87;
  border: none;
  border-radius: 12px;
  padding: 10px 28px;
  font-size: 1.1rem;
  font-weight: 600;
  text-align: center;
  letter-spacing: 1px;
  color: #fff;
  text-decoration: none;
  /* remove underline */
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease-in-out;
}
#home-btn:hover {
  background-position: 100% 0%;
  transform: translateY(-2px);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.18), 0 0 4px rgba(108, 99, 255, 0.22), inset 0 2px 6px rgba(255, 255, 255, 0.18);
}

.ai-status {
  color: #6b46c1;
  font-weight: 600;
  position: relative;
  display: inline-block;
  /*&::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 8px;
    border-radius: 50%;
    background: #16A34A;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.8), 0 0 12px rgba(22, 163, 74, 0.5);
    animation: dotPulse 1.8s infinite ease-in-out;
    vertical-align: middle;
  }*/
}

/*@keyframes pulseGlow {
  0%, 100% {
    text-shadow: 0 0 3px rgba(22, 163, 74, 0.4),
                 0 0 6px rgba(22, 163, 74, 0.2);
  }
  50% {
    text-shadow: 0 0 6px rgba(22, 163, 74, 0.7),
                 0 0 12px rgba(22, 163, 74, 0.5);
  }
}*/
/*@keyframes dotPulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.4);
    opacity: 0.7;
  }
}*/
.app-developer {
  text-decoration: none;
  font-weight: 500;
  color: #6b46c1;
  text-align: center;
  transition: all 0.3s ease-in-out;
}
.app-developer:hover {
  border-bottom: 1px solid #6b46c1;
  color: #6C63FF;
}

h1,
h2,
h3,
p strong {
  display: inline-block;
  font-weight: 700;
  font-size: 1.2rem;
  background: linear-gradient(120deg, #1F2937 0%, #334155 30%, #6C63FF 70%, #1F2937 100%);
  background-size: 200% auto;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: background 1s ease;
}

.console-label {
  font-weight: 600;
  color: #2D2A7B;
  text-shadow: 0 0 4px rgba(108, 99, 255, 0.25);
}

p,
li,
span {
  color: #475569;
  transition: color 0.25s ease;
}

li:hover {
  color: #17223B;
  text-shadow: 0 0 4px rgba(108, 99, 255, 0.25);
}

/*@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}*/
.tooltip-icon {
  display: inline-block;
  margin-left: 6px;
  background: #6b46c1;
  color: white;
  text-shadow: none;
  font-weight: bold;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 16px;
  font-size: 11px;
  cursor: pointer;
  position: relative;
}

.tooltip-content {
  visibility: hidden;
  opacity: 0;
  width: 240px;
  background: #fff;
  color: #333;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 8px;
  position: absolute;
  top: 22px;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: opacity 0.2s ease-in-out;
  z-index: 100;
}

.tooltip-icon:hover .tooltip-content {
  visibility: visible;
  opacity: 1;
}

input[type=text],
textarea {
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid rgba(23, 34, 59, 0.12);
  background: #ffffff;
  color: #17223B;
  font-size: 1rem;
  font-family: inherit;
  transition: all 0.25s ease;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
  resize: none;
}
input[type=text]::-moz-placeholder, textarea::-moz-placeholder {
  color: #6B7280;
  opacity: 0.9;
  font-style: italic;
}
input[type=text]::placeholder,
textarea::placeholder {
  color: #6B7280;
  opacity: 0.9;
  font-style: italic;
}
input[type=text]:focus,
textarea:focus {
  outline: none;
  border-color: rgb(59.9423076923, 48, 255);
  box-shadow: 0 0 0 4px rgba(108, 99, 255, 0.12), inset 0 0 6px rgba(0, 0, 0, 0.05);
  background: #ffffff;
}

.error-banner {
  position: fixed;
  top: 20px;
  right: 25px;
  z-index: 9999;
  background: rgba(185, 28, 28, 0.08);
  border: 1px solid rgba(185, 28, 28, 0.35);
  border-radius: 12px;
  padding: 12px 18px;
  color: #991B1B;
  font-weight: 600;
  font-size: 0.95rem;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  animation: fadeInSlide 0.4s ease-out;
}
.error-banner:hover {
  background: rgba(185, 28, 28, 0.12);
}

@keyframes fadeInSlide {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
body {
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: auto;
  min-height: 99vh;
  min-width: 99vw;
  font-family: "Courier New", Courier, monospace;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 0;
}

main {
  grid-row: 1/-1;
  grid-column: 1/-1;
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: 1fr 3fr;
  padding: 5px;
  align-items: start;
}
main section#left-section {
  grid-column: 1/2;
  margin: 0px 10px 10px 10px;
  align-self: self-start;
  display: grid;
  grid-template-rows: auto auto;
  gap: 20px;
}
main section#left-section section#title-section {
  grid-row: 1/2;
  height: 100%;
  letter-spacing: 0.5px;
  font-size: small;
  display: grid;
  grid-template-rows: 1fr auto;
}
main section#left-section section#title-section .logo-container {
  grid-row: 1/2;
  margin: 10px;
  display: flex;
  flex-direction: column;
  text-align: center;
}
main section#left-section section#title-section .about-app-container {
  grid-row: 3/4;
  margin: 10px;
  min-height: 0;
  overflow: auto;
}
main section#left-section section#title-section .about-app-container .console-box p {
  display: flex;
  justify-content: space-between;
}
main section#left-section section#readme-section {
  grid-row: 2/3;
  height: 100%;
  letter-spacing: 0.5px;
  font-size: small;
}
main section#left-section section#readme-section .readme-container {
  margin: 10px;
  display: flex;
  flex-direction: column;
  text-align: center;
}
main section#right-section {
  grid-column: 2/3;
  margin: 0px 10px 10px 10px;
  align-self: self-start;
  display: grid;
  gap: 10px;
  grid-template-rows: auto auto 1fr;
  grid-template-columns: 1fr;
}
main section#right-section section#app-section {
  grid-row: 1/2;
  grid-column: 1/-1;
  display: grid;
}
main section#right-section section#app-section .app-container {
  grid-row: 1/2;
  margin: 10px;
  padding-right: 8px;
  padding-left: 8px;
}
main section#right-section section#summary-section {
  grid-row: 2/3;
  grid-column: 1/-1;
  display: grid;
}
main section#right-section section#summary-section .summary-container {
  margin: 10px;
  overflow-y: auto;
  padding-right: 8px;
  padding-left: 8px;
}
main section#right-section section#breakdown-section {
  grid-row: 3/4;
  grid-column: 1/-1;
  display: grid;
}
main section#right-section section#breakdown-section .tle-breakdown-container {
  margin: 10px;
  overflow-y: auto;
  padding-right: 8px;
  padding-left: 8px;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
main section#right-section section#breakdown-section .tle-breakdown-container .primary-elements-container {
  grid-column: 1/2;
  margin: 10px 10px 10px 0;
}
main section#right-section section#breakdown-section .tle-breakdown-container .derived-elements-container {
  grid-column: 2/3;
  margin: 10px 0 10px 10px;
}

#app-wrapper {
  position: relative;
  z-index: 0;
}

#splash-screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: linear-gradient(180deg, #2D2A7B 0%, #3C1D87 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999999;
  transform-origin: top;
  transition: transform 1.5s cubic-bezier(0.77, 0, 0.175, 1);
  transform-style: preserve-3d;
  backface-visibility: hidden;
}
#splash-screen .splash-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: #fff;
  /* no animation here by default */
}
#splash-screen .splash-logo {
  max-width: 50%;
  margin-bottom: 20px;
  opacity: 0;
}
#splash-screen .splash-subtitle {
  font-size: 1.3rem;
  font-weight: 600;
  margin-bottom: 24px;
  background: linear-gradient(120deg, #c9d2de, #6C63FF, #00E5FF);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 0;
  /* hidden until animate */
}
#splash-screen .splash-console {
  font-family: "Courier New", monospace;
  font-size: 0.9rem;
  margin-bottom: 30px;
  text-align: left;
  display: inline-block;
}
#splash-screen .splash-console .splash-text {
  color: rgba(255, 255, 255, 0.8);
  display: block;
  overflow: hidden;
  border-right: 2px solid #6C63FF;
  white-space: nowrap;
  width: 0ch;
  opacity: 0;
  /* hidden until animate */
}
#splash-screen #enter-app-btn {
  background: linear-gradient(160deg, #6C63FF 0%, #2D2A7B 100%);
  border: none;
  border-radius: 14px;
  padding: 14px 28px;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 1px;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.2);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  opacity: 0;
}
#splash-screen #enter-app-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(0, 200, 255, 0.75);
}

/* 🔑 animations only run when .animate is present */
#splash-screen.animate .splash-logo {
  animation: fadeIn 1.5s ease forwards;
  animation-delay: 0.5s;
}
#splash-screen.animate .splash-subtitle {
  animation: fadeIn 2s ease forwards;
  animation-delay: 2s;
}
#splash-screen.animate .splash-console .splash-text {
  animation: typing 2s steps(40, end) forwards, blink 0.7s step-end infinite;
}
#splash-screen.animate .splash-console .splash-text:nth-child(1) {
  animation-delay: 4s, 6s;
}
#splash-screen.animate .splash-console .splash-text:nth-child(2) {
  animation-delay: 6s, 8s;
}
#splash-screen.animate .splash-console .splash-text:nth-child(3) {
  animation-delay: 8s, 10s;
}
#splash-screen.animate .splash-console .splash-text:nth-child(4) {
  animation-delay: 10s, 12s;
}
#splash-screen.animate #enter-app-btn {
  animation: fadeIn 1s ease forwards;
  animation-delay: 13s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 0.95;
  }
  50% {
    transform: scale(1.05);
    opacity: 1;
  }
}
@keyframes typing {
  from {
    width: 0ch;
    opacity: 1;
  }
  to {
    width: var(--chars, 40ch);
    opacity: 1;
  }
}
@keyframes blink {
  50% {
    border-color: transparent;
  }
}
#splash-screen.splash-hide {
  transform: rotateX(-100deg);
  -webkit-transform: rotateX(-100deg);
}

#app-main {
  position: relative;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.8s ease-in-out;
  /* Smooth fade-in for the main app panels after splash screen finishes, 
  ensures the app doesn’t “pop in” before the splash hides */
}

body.splash-done #app-main {
  opacity: 1;
}

body.no-splash #app-main {
  opacity: 1;
  transition: none;
}

/*section#title-section {
  position: relative;
  border-radius: 20px;
  overflow: hidden; // clip pseudo-element
  z-index: 0;

  > * {
    position: relative;
    z-index: 1; // content stays above the glow
  }

  &::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;

    background: linear-gradient(
      45deg, 
      rgba(108, 99, 255, 0.15) 0%,      // indigo
      rgba(150, 80, 255, 0.12) 35%,     // purple
      rgba(255, 50, 180, 0.10) 50%,     // subtle hot pink pop
      rgba(150, 80, 255, 0.12) 65%,     // purple again
      rgba(108, 99, 255, 0.15) 100%     // indigo
    );
    background-size: 150% 150%;
    opacity: 0;
    transition: opacity 1s ease;
    animation: neonDiagonal 3s linear infinite;
  }

  &:hover::before {
    opacity: 1;
  }
}

@keyframes neonDiagonal {
  0% { background-position: 0% 0%; }
  50% { background-position: 100% 100%; }
  100% { background-position: 0% 0%; }
}*/
.sample-tle-link,
.get-tles-link {
  font-size: 0.9em;
  text-decoration: none;
  color: #3C1D87;
  cursor: pointer;
  transition: color 0.25s ease-in-out;
}
.sample-tle-link:hover,
.get-tles-link:hover {
  color: #6C63FF;
  text-decoration: underline;
}

.sample-tle-link {
  margin-left: 20px;
}
.sample-tle-link::before {
  content: "⇢ ";
  font-weight: bold;
  color: #3C1D87;
}

.get-tles-link {
  margin-right: 20px;
}
.get-tles-link::after {
  content: " ↗";
  font-size: 1em;
}/*# sourceMappingURL=styles.css.map */