/* Homepage redesign. Scoped to keep the platform's existing theme intact. */
body:has(#landing-screen.active) {
  padding-top: 0;
  color: #f5f3ee;
  background: #030b08;
}
body:has(#landing-screen.active) #footer-root { display: block; }
#landing-screen {
  --landing-peach: #ffe1bb;
  --landing-green: #00dab1;
  min-height: 100svh;
  padding: 48px max(40px, calc((100vw - 1184px) / 2)) 56px;
  text-align: left;
  justify-content: flex-start;
  overflow: hidden;
  isolation: isolate;
  background: radial-gradient(ellipse at 85% 25%, #082a1e66, transparent 65%), #030b08;
}
#landing-screen::before {
  z-index: 1;
  background-image:
    radial-gradient(ellipse at 50% 45%, transparent 35%, #030b085c 72%, #030b08e6 100%),
    linear-gradient(#31846026 1px, transparent 1px),
    linear-gradient(90deg, #31846026 1px, transparent 1px),
    linear-gradient(90deg, #030b08 2%, #030b08d9 28%, #030b0830 80%),
    linear-gradient(0deg, #030b08 1%, transparent 45%);
  background-size:
    100% 100%,
    clamp(64px, 8vw, 120px) clamp(64px, 8vw, 120px),
    clamp(64px, 8vw, 120px) clamp(64px, 8vw, 120px),
    100% 100%, 100% 100%;
  mask-image: none;
  -webkit-mask-image: none;
}
#landing-screen .landing-content { width: 100%; max-width: 1184px; align-items: flex-start; text-align: left; margin: 0; z-index: 2; }
#landing-screen .landing-header { display: flex; align-items: center; justify-content: space-between; width: 100%; }
#landing-screen .landing-brand {
  display: block;
  width: 280px;
  max-width: 100%;
  height: auto;
  margin-left: 0;
  filter: none;
}
#landing-screen .landing-menu-toggle {
  display: grid; place-items: center; width: 64px; height: 64px;
  border: 1px solid #b3bcb57d; border-radius: 50%; background: #07110c40;
  color: #f5f3ee; cursor: pointer; transition: background .2s, border-color .2s;
}
#landing-screen .landing-menu-toggle svg { width: 34px; height: 34px; }
#landing-screen .landing-menu-toggle:hover { background: #ffffff12; border-color: var(--landing-peach); }
#landing-screen .landing-hero { margin-top: 84px; width: 100%; }
#landing-title, #landing-title span {
  font-family: 'Times New Roman', Times, serif;
  font-weight: 400;
  font-size: clamp(68px, 7.4vw, 100px);
  line-height: .99;
  letter-spacing: -3px;
}
#landing-title span { display: block; }
#landing-title span:first-child { color: #fff; }
#landing-title span:last-child {
  width: fit-content;
  max-width: 100%;
  color: var(--landing-peach);
  background: linear-gradient(110deg, #ffe1bb 5%, #ffe1bb 25%, #fff 45%, #fff1df 60%, #ffe1bb 85%);
  background-size: 260% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: landing-title-shimmer 7s ease-in-out infinite alternate;
}
@keyframes landing-title-shimmer {
  from { background-position: 0% 50%; }
  to { background-position: 100% 50%; }
}
@media (prefers-reduced-motion: reduce) {
  #landing-title span:last-child { animation: none; }
}
#landing-screen .landing-description { margin-top: 32px; color: #a7aaaf; font-size: 25px; line-height: 1.4; font-weight: 400; letter-spacing: -.4px; }
#landing-screen .btn-explore {
  width: 470px; max-width: 100%; min-height: 74px; margin-top: 40px;
  padding: 18px 28px; border: 1px solid #ffe9cc; border-radius: 100px;
  background: linear-gradient(110deg, #ffe8cd, #fbd5a8); color: #0b100d;
  font-size: 24px; font-weight: 500; letter-spacing: -.5px; box-shadow: none;
  transform: scale(1); transition: transform .25s ease, box-shadow .25s ease;
  overflow: hidden;
  display: flex; justify-content: center; position: relative;
}
#landing-screen .btn-explore svg { position: absolute; right: 26px; width: 30px; height: 30px; }
#landing-screen .btn-explore:hover {
  background: linear-gradient(110deg, #ffe8cd, #fbd5a8); color: #0b100d;
  transform: scale(1.025); box-shadow: inset 0 0 0 100px #ffffff30, 0 0 0 1px #ffe1bb80, 0 8px 32px #ffe1bb30;
}
#landing-screen .btn-explore::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(105deg, transparent 30%, #ffffff70 50%, transparent 70%);
  transform: translateX(-120%); pointer-events: none;
}
#landing-screen .btn-explore:hover::before { animation: landing-button-shine .7s ease-out forwards; }
#landing-screen .btn-explore:hover svg { transform: translateX(4px); }
@keyframes landing-button-shine { to { transform: translateX(120%); } }
#landing-screen :is(a, button):focus-visible { outline: 2px solid var(--landing-peach); outline-offset: 6px; }
#landing-screen .landing-stats-bar {
  width: 100%; max-width: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px; margin-top: 42px; padding: 0; background: none; border: none; border-radius: 0;
  box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
}
#landing-screen .landing-stat-item {
  min-height: 230px; padding: 24px 26px; border: 1px solid #b8c5b92e; border-radius: 16px;
  background: linear-gradient(125deg, #fff4df0d, transparent 35%, transparent 70%, #fbd9b005),
    linear-gradient(145deg, #18271fbd, #0d1a13d6 75%);
  box-shadow: inset 0 1px 0 #fff1dc33, inset 1px 0 0 #ffffff0d, inset 0 -1px 0 #fbd9b00b, 0 8px 24px #00000014;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  transform: none;
  transition: border-color .25s ease, box-shadow .25s ease;
}
#landing-screen .landing-stat-item:hover {
  transform: none;
  border-color: #fbd9b066;
  box-shadow: inset 0 1px 0 #fff1dc52, inset 1px 0 0 #ffffff14, inset 0 -1px 0 #fbd9b012, 0 10px 28px #00000024;
}
#landing-screen .landing-stat-icon {
  width: 42px; height: 42px; flex-shrink: 0; display: grid; place-items: center; color: var(--landing-peach);
  border: 1px solid #fbd9b01f; border-radius: 10px; background: linear-gradient(135deg, #fff1dc0d, #fbd9b003);
  box-shadow: inset 0 1px 0 #fff1dc17; margin-bottom: 20px;
}
#landing-screen .landing-stat-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

#landing-screen .stat-label { color: #aab5ac; text-transform: none; font-size: 18px; font-weight: 400; line-height: 1.18; min-height: 2.8em; letter-spacing: 0; margin-bottom: 12px; }
#landing-screen .stat-val { color: #f7f7f5; font-size: clamp(25px, 2.6vw, 36px); font-weight: 400; font-variant-numeric: tabular-nums; letter-spacing: -.6px; line-height: 1.15; min-height: 1.2em; gap: 10px; overflow-wrap: anywhere; }
#landing-screen .landing-stat-unit { font-size: 18px; color: #929f95; margin-top: 12px; }
#landing-screen .pnl-positive { color: var(--landing-green) !important; }
#landing-screen .pnl-negative { color: #ff897c !important; }
#landing-screen #land-status { font-size: 21px; margin-top: 0; letter-spacing: -.4px; min-height: 33.6px; }
#landing-screen .status-dot { width: 8px; height: 8px; flex-shrink: 0; filter: none; opacity: 1; }
#landing-screen .status-dot.online { background: var(--landing-green); box-shadow: none; }
#landing-screen #land-status:has(.online) { color: #f7f7f5; }
#landing-screen .landing-api-name { color: #929f95; font-size: 12px; margin-top: 12px; }
#landing-screen .landing-api .glass-select-trigger:hover { background: transparent; }
#landing-screen .landing-api:focus-within { outline-color: var(--landing-peach); }
#landing-screen .menu-chart-background { opacity: .95; filter: blur(1.2px); mask-image: none; -webkit-mask-image: none; }
body:has(#landing-screen.active) .sidebar-menu { background: #0c1b16ed; color: #f5f3ee; border-color: #729f9170; }
body:has(#landing-screen.active) .sidebar-link { color: #f5f3ee; }
body:has(#landing-screen.active) .sidebar-group-label { color: #a7aaaf; }
body:has(#landing-screen.active) .sidebar-link.active { background: #ffe1bb; color: #07110c; }
body:has(#landing-screen.active) .sidebar-heading .menu-toggle { color: #f5f3ee; background: #ffffff12; }
body:has(#landing-screen.active) .sidebar-tools { background: #ffffff08; border-color: #729f9130; }
@media (max-width: 1000px) {
  #landing-screen { padding: 7vw 6.7vw 6.7vw; }
  #landing-screen .landing-brand { width: 41vw; margin-left: 0; }
  #landing-screen .landing-menu-toggle { width: 9.5vw; height: 9.5vw; }
  #landing-screen .landing-menu-toggle svg { width: 5.2vw; height: 5.2vw; }
  #landing-screen .landing-hero { margin-top: 12.8vw; }
  #landing-title, #landing-title span { font-size: 11.5vw; line-height: 1; letter-spacing: -.45vw; }
  #landing-screen .landing-description { font-size: 4vw; margin-top: 4.5vw; line-height: 1.3; letter-spacing: -.09vw; }
  #landing-screen .btn-explore { width: 77%; min-height: 10.5vw; margin-top: 6.7vw; padding: 2.5vw 3vw; font-size: 4vw; }
  #landing-screen .btn-explore svg { right: 3.6vw; width: 4.4vw; height: 4.4vw; }
  #landing-screen .landing-stats-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 6vw; gap: 2.2vw; }
  #landing-screen .landing-stat-item { min-height: 32vw; padding: 3.4vw 3.9vw 2.7vw; border-radius: 2.5vw; }
  #landing-screen .landing-stat-icon { width: 8.6vw; height: 8.6vw; border-radius: 2vw; margin-bottom: 1.8vw; }
  #landing-screen .landing-stat-icon svg { width: 4.8vw; height: 4.8vw; }
  #landing-screen .stat-label { font-size: 3vw; letter-spacing: -.06vw; margin-bottom: 2.5vw; }
  #landing-screen .stat-val { font-size: 5.2vw; letter-spacing: -.12vw; }
  #landing-screen .landing-stat-unit,   #landing-screen #land-status { font-size: 3.1vw; gap: 1.4vw; margin-top: .6vw; }
  #landing-screen #land-status { margin-top: 0; }
  #landing-screen .status-dot { width: 2.1vw; height: 2.1vw; }
  #landing-screen .landing-api-name { font-size: max(10px, 1.7vw); margin-top: 1.4vw; }
}
@media (prefers-reduced-motion: reduce) {
  #landing-screen .landing-stat-item:hover, #landing-screen .btn-explore:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  #landing-screen .btn-explore:hover::before { animation: none; }
  #landing-screen .btn-explore:hover svg { transform: none; }
}

