* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: auto;
}

body {
  background: var(--bg-base);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  -webkit-font-smoothing: antialiased;
  position: relative;
  overflow-x: hidden;
}

#cobrand {
  z-index: 50;
  -webkit-backdrop-filter: blur(14px);
  background: #0516239e;
  border-bottom: 1px solid #ffffff12;
  justify-content: center;
  align-items: center;
  height: 62px;
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.cobrand-inner {
  align-items: center;
  display: flex;
}

.brand-logo {
  width: auto;
  display: block;
}

.brand-d24 {
  height: 21px;
}

.brand-medio {
  height: 31px;
}

.brand-x {
  font-family: var(--font-display);
  color: #fff6;
  margin: 0 20px;
  font-size: 19px;
  font-weight: 300;
  line-height: 1;
}

#mapBtn {
  color: var(--text-primary);
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  letter-spacing: .02em;
  cursor: pointer;
  backdrop-filter: blur(8px);
  background: #ffffff0f;
  border: 1px solid #ffffff24;
  align-items: center;
  gap: 9px;
  padding: 9px 17px;
  font-size: 13px;
  font-weight: 600;
  transition: background .25s, border-color .25s;
  display: inline-flex;
  position: absolute;
  top: 50%;
  right: clamp(14px, 3vw, 32px);
  transform: translateY(-50%);
}

#mapBtn:hover {
  background: #5c78ff29;
  border-color: #8FD3F266;
}

#analysisBtn {
  z-index: 50;
  color: var(--text-primary);
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  letter-spacing: .02em;
  white-space: nowrap;
  backdrop-filter: blur(8px);
  background: #ffffff0f;
  border: 1px solid #ffffff24;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: background .25s, border-color .25s;
  display: inline-flex;
  position: fixed;
  top: 31px;
  right: clamp(216px, 20.8vw, 264px);
  transform: translateY(-50%);
}

#analysisBtn svg {
  fill: none;
  stroke: #7dd3fc;
  stroke-width: 1.9px;
  stroke-linecap: round;
  width: 14px;
  height: 14px;
}

#analysisBtn:hover {
  background: #5c78ff29;
  border-color: #8FD3F266;
}

@media (width <= 860px) {
  #analysisBtn {
    z-index: 47;
    background: #0e101eeb;
    min-height: 44px;
    padding: 11px 16px;
    top: auto;
    bottom: 72px;
    right: 12px;
    transform: none;
    box-shadow: 0 8px 28px #04040a8c;
  }
}

#mapBtn[aria-expanded="true"] {
  background: #5c78ff33;
  border-color: #8FD3F280;
}

.map-ico {
  opacity: .9;
  border: 1.5px solid;
  border-radius: 3px;
  width: 14px;
  height: 14px;
  position: relative;
}

.map-ico:after {
  content: "";
  opacity: .7;
  background: currentColor;
  width: 1.5px;
  position: absolute;
  top: 1px;
  bottom: 1px;
  left: 50%;
}

#mapnav {
  z-index: 46;
  border-radius: var(--radius-lg);
  backdrop-filter: blur(18px);
  width: min(366px, 92vw);
  max-height: 80vh;
  box-shadow: var(--shadow-panel);
  background: #0b0b16f0;
  border: 1px solid #ffffff1a;
  padding: 18px;
  position: fixed;
  top: 60px;
  right: clamp(10px, 3vw, 28px);
  overflow-y: auto;
}

#mapnav-scrim {
  z-index: 45;
  background: #04040a59;
  position: fixed;
  inset: 0;
}

.mapnav-title {
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 12px;
  font-size: 11px;
}

.mn-item {
  text-align: left;
  cursor: pointer;
  width: 100%;
  color: var(--text-secondary);
  font-family: var(--font-body);
  background: none;
  border: none;
  border-radius: 10px;
  align-items: center;
  gap: 11px;
  padding: 9px 10px;
  font-size: 14px;
  transition: background .2s, color .2s;
  display: flex;
}

.mn-item:hover {
  color: var(--text-primary);
  background: #ffffff0d;
}

.mn-item.current {
  color: var(--text-primary);
  background: #5c78ff29;
}

.mn-dot {
  border: 1.5px solid #8FD3F26b;
  border-radius: 50%;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
}

.mn-item.current .mn-dot {
  background: var(--figure-color);
  border-color: var(--figure-color);
  box-shadow: 0 0 10px #0092D5cc;
}

.mn-station {
  color: var(--text-primary);
  font-size: 15px;
  font-weight: 600;
}

.mn-channel {
  color: var(--text-accent);
  letter-spacing: .05em;
  text-transform: uppercase;
  margin: 12px 0 2px;
  padding-left: 10px;
  font-size: 12px;
  font-weight: 600;
}

.mn-leaf {
  padding-left: 30px;
  font-size: 13px;
}

.mn-sep {
  background: #ffffff12;
  height: 1px;
  margin: 10px 0;
}

.map-pin {
  pointer-events: none;
  transition: opacity .4s var(--ease-out);
  flex-direction: column;
  align-items: center;
  display: flex;
  position: absolute;
  transform: translate(-50%, -50%);
}

.map-pin .pin-dot {
  background: var(--bg-elevated);
  border: 2px solid #8FD3F299;
  border-radius: 50%;
  width: 15px;
  height: 15px;
  box-shadow: 0 0 18px #0092D58c;
}

.map-pin.lit .pin-dot {
  background: var(--figure-color);
  box-shadow: 0 0 26px #0092D5e6;
}

.map-pin .pin-label {
  letter-spacing: .07em;
  text-transform: uppercase;
  color: #F6F9FC9e;
  border-radius: var(--radius-pill);
  white-space: nowrap;
  background: #0516239e;
  margin-top: 8px;
  padding: 3px 9px;
  font-size: 11px;
  font-weight: 600;
}

#bg-map {
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(820px 660px at 15% 16%, #0092D514, #0000 60%), radial-gradient(760px 640px at 86% 78%, #B53ED014, #0000 60%), repeating-radial-gradient(circle at 18% 24%, #0000 0 34px, #5BB8E60a 34px 35px), repeating-radial-gradient(circle at 82% 70%, #0000 0 40px, #B53ED009 40px 41px);
  position: fixed;
  inset: 0;
  -webkit-mask-image: radial-gradient(98% 88% at 50% 44%, #000 48%, #0000 100%);
  mask-image: radial-gradient(98% 88% at 50% 44%, #000 48%, #0000 100%);
}

#bg-grid {
  z-index: 0;
  pointer-events: none;
  background-image: linear-gradient(to right,  var(--bg-grid) 1px, transparent 1px),
    linear-gradient(to bottom, var(--bg-grid) 1px, transparent 1px);
  background-size: 80px 80px;
  position: fixed;
  inset: 0;
  -webkit-mask-image: radial-gradient(80% 60% at 50% 40%, #000 35%, #0000 100%);
  mask-image: radial-gradient(80% 60% at 50% 40%, #000 35%, #0000 100%);
}

#stage {
  z-index: 1;
  pointer-events: none;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

#spine {
  position: absolute;
  top: 0;
  left: 0;
  overflow: visible;
}

#spine .path-base {
  fill: none;
  stroke: #8FD3F257;
  stroke-width: 4px;
  stroke-linecap: round;
  stroke-dasharray: 2 13;
}

#spine .path-trail {
  fill: none;
  stroke: url("#spineGrad");
  stroke-width: 7px;
  stroke-linecap: round;
  filter: drop-shadow(0 0 14px #0092D5bf);
}

.node {
  background: var(--bg-elevated);
  width: 16px;
  height: 16px;
  transition: transform .45s var(--ease-out), border-color .45s var(--ease-out),
              box-shadow .45s var(--ease-out), background .45s var(--ease-out);
  border: 2px solid #8FD3F24d;
  border-radius: 50%;
  margin: -8px 0 0 -8px;
  position: absolute;
}

.node.lit {
  background: var(--figure-color);
  border-color: #8FD3F2e6;
  transform: scale(1.65);
  box-shadow: 0 0 26px #0092D5d9;
}

#figure-layer {
  z-index: 5;
  pointer-events: none;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

#figure {
  will-change: transform, opacity;
  width: 1px;
  height: 1px;
  transition: opacity .45s var(--ease-inout);
  position: absolute;
  top: 0;
  left: 0;
}

.fig-avatar {
  width: 42px;
  height: 42px;
  animation: figbob 1.7s var(--ease-inout) infinite;
  border-radius: 50%;
  margin: -21px 0 0 -21px;
  position: absolute;
  top: 50%;
  left: 50%;
  box-shadow: 0 0 26px #0092D5d9, 0 0 58px #0092D566, 0 4px 14px #00000080;
}

.fig-avatar svg {
  width: 100%;
  height: 100%;
  display: block;
}

@keyframes figbob {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-3px);
  }
}

.fig-ring {
  border: 2px solid var(--pulse-color);
  width: 42px;
  height: 42px;
  animation: figpulse 1.6s var(--pulse-ease) infinite;
  border-radius: 50%;
  margin: -21px 0 0 -21px;
  position: absolute;
  top: 50%;
  left: 50%;
}

@keyframes figpulse {
  0% {
    opacity: .6;
    transform: scale(1);
  }

  70% {
    opacity: 0;
    transform: scale(3.4);
  }

  100% {
    opacity: 0;
    transform: scale(3.4);
  }
}

.fig-tail {
  filter: blur(2px);
  transform-origin: 100%;
  background: linear-gradient(to right, #8FD3F200 0%, #5BB8E673 70%, #8FD3F2cc 100%);
  border-radius: 7px;
  width: 70px;
  height: 13px;
  margin: -6.5px 0 0 -70px;
  position: absolute;
  top: 50%;
  left: 50%;
}

#track {
  z-index: 2;
  position: relative;
}

section.scene {
  align-items: center;
  min-height: 100vh;
  padding: 64px clamp(24px, 6vw, 96px);
  display: flex;
  position: relative;
}

#hero {
  text-align: center;
  z-index: 2;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 0 24px;
  display: flex;
  position: relative;
}

#hero .eyebrow {
  margin-bottom: 22px;
}

#hero h1 {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  font-size: var(--size-display);
  letter-spacing: var(--tracking-tight);
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  max-width: 16ch;
  line-height: 1.02;
}

#hero p {
  color: var(--text-secondary);
  font-size: var(--size-body);
  max-width: 46ch;
  margin-top: 24px;
}

.scroll-hint {
  color: var(--text-muted);
  font-size: var(--size-label);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 56px;
  display: flex;
}

.scroll-hint .chev {
  border-right: 2px solid var(--text-muted);
  border-bottom: 2px solid var(--text-muted);
  width: 18px;
  height: 18px;
  animation: bob 1.8s var(--ease-inout) infinite;
  transform: rotate(45deg);
}

@keyframes bob {
  0%, 100% {
    transform: translateY(0) rotate(45deg);
  }

  50% {
    transform: translateY(8px) rotate(45deg);
  }
}

.panel {
  background: var(--station-bg);
  border: 1px solid var(--station-border);
  border-radius: var(--station-radius);
  width: min(820px, 92vw);
  -webkit-backdrop-filter: blur(var(--station-blur));
  box-shadow: var(--shadow-panel);
  opacity: .42;
  transition: opacity .6s var(--ease-out), transform .6s var(--ease-out),
              border-color .6s var(--ease-out), box-shadow .6s var(--ease-out);
  padding: clamp(28px, 3.2vw, 48px);
  position: relative;
  transform: translateY(28px) scale(.985);
}

section.scene.active .panel {
  opacity: 1;
  border-color: var(--station-border-active);
  box-shadow: var(--glow-station);
  transform: none;
}

section.scene.left {
  justify-content: flex-start;
}

section.scene.right {
  justify-content: flex-end;
}

.panel .num {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  font-size: var(--station-number-size);
  letter-spacing: var(--tracking-tight);
  color: var(--station-number-color);
  transition: color .6s var(--ease-out);
  pointer-events: none;
  line-height: .8;
  position: absolute;
  top: clamp(-18px, -1.4vw, -10px);
  right: clamp(16px, 2vw, 28px);
}

section.scene.active .panel .num {
  color: var(--station-number-active);
}

.eyebrow {
  font-size: var(--size-label);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--text-accent);
  align-items: center;
  gap: 10px;
  font-weight: 600;
  display: inline-flex;
}

.eyebrow:before {
  content: "";
  background: var(--grad-path);
  border-radius: 2px;
  width: 26px;
  height: 2px;
}

.panel h2 {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  font-size: var(--size-title);
  letter-spacing: var(--tracking-tight);
  max-width: 18ch;
  margin: 16px 0 10px;
  line-height: 1.04;
}

.panel .lead {
  color: var(--text-secondary);
  font-size: var(--size-body);
  max-width: 52ch;
  line-height: 1.5;
}

.media-one {
  margin: 24px 0;
}

.media-one .slot {
  aspect-ratio: 16 / 9;
}

.slot {
  aspect-ratio: 16 / 10;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #0092D51a, #B53ED01a),
    var(--bg-surface);
  border: 1px solid #ffffff14;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.slot .ph-label {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--text-muted);
  border-radius: var(--radius-pill);
  z-index: 2;
  background: #0516238c;
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 600;
  position: absolute;
  top: 12px;
  left: 12px;
}

.slot.img .ph-icon {
  color: #8FD3F273;
  width: 46px;
  height: 46px;
}

.slot.img img, .slot.video video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.slot.video .play {
  backdrop-filter: blur(4px);
  z-index: 2;
  pointer-events: none;
  background: #05162373;
  border: 1px solid #ffffff40;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 52px;
  height: 52px;
  display: flex;
  position: absolute;
}

.slot.video .play:after {
  content: "";
  border-left: 14px solid var(--text-primary);
  border-top: 9px solid #0000;
  border-bottom: 9px solid #0000;
  margin-left: 4px;
}

.lists {
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  margin-top: 8px;
  display: grid;
}

.lists .col h3 {
  font-size: var(--size-label);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-bottom: 12px;
  font-weight: 600;
}

.lists .pros h3 {
  color: #5ee6a8;
}

.lists .cons h3 {
  color: #ff8a8a;
}

.lists ul {
  flex-direction: column;
  gap: 9px;
  list-style: none;
  display: flex;
}

.lists li {
  color: var(--text-secondary);
  padding-left: 26px;
  font-size: clamp(13px, 1.05vw, 15px);
  line-height: 1.4;
  position: relative;
}

.lists li:before {
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 17px;
  height: 17px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  position: absolute;
  top: 1px;
  left: 0;
}

.lists .pros li:before {
  content: "✓";
  color: #5ee6a8;
  background: #5ee6a824;
}

.lists .cons li:before {
  content: "✕";
  color: #ff8a8a;
  background: #ff8a8a24;
}

.beats {
  border-left: 2px solid #8FD3F233;
  flex-direction: column;
  gap: 16px;
  margin: 22px 0 4px;
  padding-left: 22px;
  display: flex;
}

.beat {
  opacity: .25;
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  transform: translateX(-8px);
}

.beat.reveal {
  opacity: 1;
  transform: none;
}

.beat .beat-dot {
  background: var(--bg-elevated);
  width: 11px;
  height: 11px;
  transition: background .5s var(--ease-out), box-shadow .5s var(--ease-out), border-color .5s;
  border: 2px solid #8FD3F24d;
  border-radius: 50%;
  margin-top: 4px;
  margin-left: -31px;
  position: absolute;
}

.beat.reveal .beat-dot {
  background: var(--figure-color);
  border-color: #8FD3F2e6;
  box-shadow: 0 0 16px #0092D5b3;
}

.beat .beat-title {
  font-family: var(--font-display);
  letter-spacing: var(--tracking-tight);
  margin-bottom: 3px;
  font-size: clamp(15px, 1.4vw, 19px);
  font-weight: 600;
}

.beat .beat-text {
  color: var(--text-secondary);
  max-width: 50ch;
  font-size: clamp(13px, 1.05vw, 15px);
  line-height: 1.45;
}

section.scene.atom {
  align-items: stretch;
  height: 100vh;
  min-height: 100vh;
  padding: 0;
  display: block;
}

.atom-sticky {
  background: radial-gradient(60% 55% at 38% 45%, #3E7DD029, transparent 70%),
    radial-gradient(ellipse at 50% 50%, #0b0b16 0%, var(--bg-base) 80%);
  align-items: center;
  height: 100vh;
  display: flex;
  position: relative;
  overflow: hidden;
}

.atom-sticky:before {
  content: "";
  background-image: linear-gradient(to right,  var(--bg-grid) 1px, transparent 1px),
    linear-gradient(to bottom, var(--bg-grid) 1px, transparent 1px);
  pointer-events: none;
  background-size: 80px 80px;
  position: absolute;
  inset: 0;
  -webkit-mask-image: radial-gradient(70% 60%, #000 30%, #0000 100%);
  mask-image: radial-gradient(70% 60%, #000 30%, #0000 100%);
}

.atom-num {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  font-size: var(--station-number-size);
  color: var(--station-number-active);
  opacity: .5;
  line-height: .8;
  position: absolute;
  top: clamp(18px, 4vh, 48px);
  left: clamp(24px, 5vw, 72px);
}

.atom-wrap {
  z-index: 1;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  align-items: center;
  gap: clamp(28px, 4.5vw, 76px);
  width: 100%;
  max-width: 1340px;
  margin: 0 auto;
  padding: 0 clamp(24px, 5vw, 80px);
  display: grid;
  position: relative;
}

.atom-left {
  flex-direction: column;
  gap: 16px;
  max-width: 460px;
  display: flex;
}

.atom-left .atom-eyebrow {
  margin-bottom: 0;
}

.atom-diagram {
  aspect-ratio: 1;
  transform-origin: center;
  will-change: transform;
  width: 100%;
  max-width: 380px;
  margin: 8px 0 0;
  position: relative;
}

.orbit-lines {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.orbit-lines .oline {
  stroke: #8FD3F22e;
  stroke-width: .6px;
  vector-effect: non-scaling-stroke;
  transition: stroke .5s var(--ease-out), stroke-width .5s var(--ease-out);
}

.orbit-lines .oline.active {
  stroke: #8FD3F2d9;
  stroke-width: 1.4px;
  filter: drop-shadow(0 0 6px #0092D5cc);
}

.orbit-ring {
  border: 1px dashed #8FD3F22e;
  border-radius: 50%;
  width: 76%;
  height: 76%;
  animation: 60s linear infinite orbitspin;
  position: absolute;
  top: 12%;
  left: 12%;
}

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

.atom-core {
  aspect-ratio: 1;
  text-align: center;
  width: 40%;
  transition: box-shadow .6s var(--ease-out), transform .6s var(--ease-out), border-color .6s;
  background: radial-gradient(circle at 40% 35%, #B53ED08c, #0092D559 60%, #080816d9 100%);
  border: 1px solid #8FD3F259;
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 60px #3E7DD080, inset 0 0 30px #0092D540;
}

.atom-core.live {
  animation: corepulse 2.6s var(--ease-inout) infinite;
  border-color: #8FD3F2b3;
}

@keyframes corepulse {
  0%, 100% {
    box-shadow: 0 0 70px #3E7DD08c, inset 0 0 34px #0092D54d;
  }

  50% {
    box-shadow: 0 0 120px #0092D5d9, inset 0 0 44px #0092D56b;
  }
}

.atom-core.complete {
  border-color: #8FD3F2f2;
  animation: none;
  transform: translate(-50%, -50%) scale(1.06);
  box-shadow: 0 0 130px #0092D5e6, inset 0 0 48px #0092D580;
}

.atom-core:after {
  content: "";
  opacity: 0;
  transition: opacity .6s var(--ease-out), transform .6s var(--ease-out);
  border: 1.5px solid #8FD3F280;
  border-radius: 50%;
  position: absolute;
  inset: -10%;
  transform: scale(.85);
}

.atom-core.complete:after {
  opacity: 1;
  transform: scale(1);
  box-shadow: 0 0 40px #0092D580;
}

.core-label {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  color: var(--text-primary);
  font-size: clamp(15px, 1.7vw, 22px);
}

.core-sub {
  color: var(--text-secondary);
  max-width: 13ch;
  font-size: clamp(9px, .9vw, 11px);
  line-height: 1.3;
}

.onode {
  aspect-ratio: 1;
  background: var(--bg-surface);
  width: clamp(52px, 5.5vw, 76px);
  color: var(--text-secondary);
  cursor: default;
  opacity: .5;
  transition: transform .5s var(--ease-out), opacity .5s var(--ease-out),
              border-color .5s var(--ease-out), box-shadow .5s var(--ease-out), background .5s;
  border: 1.5px solid #8FD3F247;
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  transform: translate(-50%, -50%);
}

.onode-key {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  color: var(--text-accent);
  font-size: clamp(20px, 2.2vw, 28px);
}

.onode-label {
  display: none;
}

.onode.visited {
  opacity: .82;
  border-color: #8FD3F280;
}

.onode.active {
  opacity: 1;
  background: linear-gradient(135deg, #0092D54d, #B53ED04d);
  border-color: #8FD3F2e6;
  transform: translate(-50%, -50%) scale(1.24);
  box-shadow: 0 0 48px #0092D599;
}

.onode.active .onode-key {
  color: #fff;
}

.onode.converged {
  opacity: 1;
  background: linear-gradient(135deg, #0092D538, #B53ED038);
  border-color: #8FD3F2cc;
  transform: translate(-50%, -50%) scale(1.08);
  box-shadow: 0 0 30px #0092D573;
}

.onode.converged .onode-key {
  color: #fff;
}

.atom-panel {
  position: relative;
}

.atom-eyebrow {
  margin-bottom: 14px;
}

.atom-h2 {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  font-size: clamp(22px, 2.6vw, 32px);
  line-height: 1.05;
}

.atom-lead {
  color: var(--text-secondary);
  font-size: var(--size-body);
  max-width: 38ch;
  line-height: 1.5;
}

.beat-stage {
  min-height: 62vh;
  position: relative;
}

.beat-card {
  opacity: 0;
  pointer-events: none;
  will-change: opacity, transform;
  flex-direction: column;
  justify-content: center;
  display: flex;
  position: absolute;
  inset: 0;
}

.beat-chan {
  font-size: var(--size-label);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--text-accent);
  margin-bottom: 16px;
  font-weight: 600;
  display: block;
}

.beat-title {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  font-size: clamp(30px, 3.6vw, 54px);
  line-height: 1;
}

.mcard .media-one {
  margin-top: 26px;
}

.mcard .media-one .slot {
  aspect-ratio: 16 / 9;
}

.beat-kicker {
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  align-items: center;
  gap: 14px;
  margin-bottom: 26px;
  font-size: clamp(13px, 1.1vw, 16px);
  font-weight: 600;
  display: inline-flex;
}

.beat-kicker:before {
  content: "";
  border-radius: 2px;
  width: 40px;
  height: 3px;
}

.beat-kicker.prob {
  color: #ffb05a;
}

.beat-kicker.prob:before {
  background: #ffb05a;
}

.beat-kicker.sol {
  color: #5ee6a8;
}

.beat-kicker.sol:before {
  background: linear-gradient(90deg, #5ee6a8, #3E7DD0);
}

.beat-list {
  flex-direction: column;
  gap: 20px;
  list-style: none;
  display: flex;
}

.beat-list li {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  padding-left: 50px;
  font-size: clamp(20px, 2.35vw, 34px);
  font-weight: 500;
  line-height: 1.18;
  position: relative;
}

.beat-list li:before {
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  position: absolute;
  top: .04em;
  left: 0;
}

.beat-list.prob li {
  color: #F6F9FCdb;
}

.beat-list.prob li:before {
  content: "!";
  color: #ffb05a;
  background: #ffb05a29;
}

.beat-list.sol li {
  color: var(--text-primary);
}

.beat-list.sol li:before {
  content: "✓";
  color: #5ee6a8;
  background: #5ee6a82e;
}

.fcard .beat-final-sub {
  color: var(--text-secondary);
  font-size: var(--size-body);
  max-width: 40ch;
  margin-top: 18px;
  line-height: 1.5;
}

.lens-toggle {
  z-index: 51;
  border-radius: var(--radius-pill);
  backdrop-filter: blur(8px);
  background: #141628d1;
  border: 1px solid #ffffff24;
  padding: 3px;
  display: inline-flex;
  position: fixed;
  top: 11px;
  left: clamp(14px, 3vw, 32px);
}

.lens-opt {
  z-index: 1;
  cursor: pointer;
  color: var(--text-secondary);
  font-family: var(--font-body);
  letter-spacing: .02em;
  border-radius: var(--radius-pill);
  white-space: nowrap;
  background: none;
  border: none;
  padding: 7px 16px;
  font-size: 12.5px;
  font-weight: 600;
  transition: color .25s;
  position: relative;
}

.lens-opt.active {
  color: #fff;
}

.lens-thumb {
  z-index: 0;
  border-radius: var(--radius-pill);
  background: var(--grad-signature);
  width: calc(50% - 3px);
  transition: transform .35s var(--ease-out);
  position: absolute;
  top: 3px;
  bottom: 3px;
  left: 3px;
  box-shadow: 0 4px 16px #3E7DD073;
}

body.lens-leader .lens-thumb {
  transform: translateX(100%);
}

body:not(.lens-leader) .beat-card.lens-leader, body.lens-leader .beat-card.lens-patient, body:not(.lens-leader) .lens-leader-only, body.lens-leader .lens-patient-only {
  display: none;
}

.minta-badge {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #ffffff80;
  border-radius: var(--radius-pill);
  background: #ffffff0f;
  border: 1px solid #ffffff1f;
  align-self: flex-start;
  align-items: center;
  gap: 7px;
  margin-top: 18px;
  padding: 5px 11px;
  font-size: 10px;
  font-weight: 600;
  display: inline-flex;
}

.minta-badge:before {
  content: "";
  background: #ffb05a;
  border-radius: 50%;
  width: 6px;
  height: 6px;
}

.chart-wrap {
  margin-top: 8px;
}

.chart-title {
  font-family: var(--font-display);
  letter-spacing: -.01em;
  color: var(--text-primary);
  margin-bottom: 18px;
  font-size: clamp(16px, 1.7vw, 22px);
  font-weight: 600;
}

.chart-bars {
  flex-direction: column;
  gap: 16px;
  display: flex;
}

.cbar {
  align-items: center;
  gap: 16px;
  display: flex;
}

.cbar-label {
  width: 36%;
  color: var(--text-secondary);
  font-size: 14px;
}

.cbar-track {
  background: #ffffff12;
  border-radius: 8px;
  flex: 1;
  height: 16px;
  overflow: hidden;
}

.cbar-fill {
  background: var(--grad-path);
  border-radius: 8px;
  height: 100%;
}

.cbar-fill.warn {
  background: linear-gradient(90deg, #ffb05a, #ff8a8a);
}

.cbar-val {
  text-align: right;
  width: 52px;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  font-size: 14px;
  font-weight: 700;
}

.chart-donut {
  flex-wrap: wrap;
  align-items: center;
  gap: 32px;
  display: flex;
}

.donut {
  border-radius: 50%;
  flex-shrink: 0;
  width: 168px;
  height: 168px;
  -webkit-mask: radial-gradient(farthest-side, #0000 56%, #000 57%);
  mask: radial-gradient(farthest-side, #0000 56%, #000 57%);
}

.donut-legend {
  flex-direction: column;
  gap: 12px;
  display: flex;
}

.dleg {
  color: var(--text-secondary);
  align-items: center;
  gap: 11px;
  font-size: 14px;
  display: flex;
}

.dleg .sw {
  border-radius: 4px;
  width: 13px;
  height: 13px;
}

.dleg b {
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

.trend-svg {
  width: 100%;
  height: 140px;
  display: block;
}

.chart-stat {
  flex-wrap: wrap;
  align-items: baseline;
  gap: 20px;
  display: flex;
}

.stat-big {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: -.04em;
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(44px, 6.5vw, 92px);
  line-height: 1;
}

.stat-delta {
  color: #5ee6a8;
  font-size: clamp(15px, 1.6vw, 22px);
  font-weight: 700;
}

.stat-sub {
  width: 100%;
  color: var(--text-secondary);
  max-width: 46ch;
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.5;
}

.lsum {
  grid-template-columns: 1fr 1fr;
  gap: 20px 28px;
  margin-top: 20px;
  display: grid;
}

.lsum-v {
  font-family: var(--font-display);
  letter-spacing: -.03em;
  font-size: clamp(26px, 3.2vw, 42px);
  font-weight: 800;
  line-height: 1;
}

.lsum-v.up {
  color: #5ee6a8;
}

.lsum-l {
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 6px;
  font-size: 12px;
}

.opt-panel .eyebrow {
  margin-bottom: 12px;
}

.opt-title {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  margin-bottom: 10px;
  font-size: clamp(26px, 3vw, 42px);
  line-height: 1.02;
}

.opt-lead {
  color: var(--text-secondary);
  font-size: var(--size-body);
  max-width: 56ch;
  line-height: 1.55;
}

.arc {
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 18px;
  margin: 26px 0 24px;
  display: grid;
}

.arc-col {
  border-radius: var(--radius-md);
  padding: 18px 20px;
}

.arc-col h4 {
  font-size: var(--size-label);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-bottom: 12px;
  font-weight: 600;
}

.arc-col ul {
  flex-direction: column;
  gap: 9px;
  list-style: none;
  display: flex;
}

.arc-col li {
  padding-left: 25px;
  font-size: clamp(13px, 1.05vw, 15px);
  line-height: 1.42;
  position: relative;
}

.arc-col li:before {
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 17px;
  height: 17px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  position: absolute;
  top: 1px;
  left: 0;
}

.arc-col.problem {
  background: #ffb05a0e;
  border: 1px solid #ffb05a33;
}

.arc-col.problem h4 {
  color: #ffb05a;
}

.arc-col.problem li {
  color: #F6F9FC85;
}

.arc-col.problem li:before {
  content: "!";
  color: #ffb05a;
  background: #ffb05a29;
}

.arc-col.solution {
  background: linear-gradient(135deg, #0092D51f, #B53ED01f);
  border: 1px solid #5ee6a84d;
  box-shadow: 0 0 34px #3E7DD024;
}

.arc-col.solution h4 {
  color: #5ee6a8;
}

.arc-col.solution li {
  color: var(--text-primary);
}

.arc-col.solution li:before {
  content: "✓";
  color: #5ee6a8;
  background: #5ee6a829;
}

.arc-arrow {
  color: #8FD3F28c;
  align-self: center;
  font-size: 26px;
  font-weight: 300;
  line-height: 1;
}

.opt-panel .media-one {
  margin: 4px 0 0;
}

.opt-panel .media-one .slot {
  aspect-ratio: 21 / 9;
}

.opt-progress {
  gap: 8px;
  margin-top: 22px;
  display: flex;
}

.opt-progress span {
  width: 30px;
  height: 4px;
  transition: background .4s var(--ease-out);
  background: #ffffff1f;
  border-radius: 2px;
}

.opt-progress span.on {
  background: var(--grad-path);
}

#outro {
  z-index: 2;
  height: 1px;
  min-height: 0;
  padding: 0;
  position: relative;
}

#outro h2 {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  font-size: var(--size-display);
  letter-spacing: var(--tracking-tight);
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  line-height: 1.02;
}

#outro .cta {
  border-radius: var(--radius-pill);
  background: var(--grad-signature);
  color: #fff;
  font-weight: 600;
  font-size: var(--size-body);
  letter-spacing: -.01em;
  align-items: center;
  gap: 12px;
  margin-top: 32px;
  padding: 18px 40px;
  display: inline-flex;
  box-shadow: 0 14px 44px #3E7DD073;
}

#hud {
  z-index: 30;
  border-radius: var(--radius-pill);
  backdrop-filter: blur(10px);
  letter-spacing: .04em;
  color: var(--text-secondary);
  background: #0B213099;
  border: 1px solid #ffffff1a;
  align-items: center;
  gap: 10px;
  padding: 9px 18px;
  font-size: 12px;
  display: flex;
  position: fixed;
  bottom: 22px;
  left: 50%;
  transform: translateX(-50%);
}

#hud b {
  color: var(--text-primary);
  font-weight: 600;
}

#hud .bar {
  background: #ffffff1a;
  border-radius: 2px;
  width: 120px;
  height: 4px;
  overflow: hidden;
}

#hud .bar span {
  background: var(--grad-path);
  width: 0%;
  height: 100%;
  display: block;
}

.home-sec {
  z-index: 3;
  text-align: center;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 96px clamp(24px, 6vw, 96px) 72px;
  display: flex;
  position: relative;
}

.reveal-up {
  opacity: 0;
  transition: opacity .7s var(--ease-out), transform .7s var(--ease-out);
  transform: translateY(34px);
}

.reveal-up.in {
  opacity: 1;
  transform: none;
}

#intro-hook .eyebrow, #intro-numbers .eyebrow {
  justify-content: center;
}

.hook-inner {
  max-width: 1000px;
}

.hook-title {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  margin: 22px 0 26px;
  font-size: clamp(40px, 7vw, 104px);
  line-height: .98;
}

.hook-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.hook-sub {
  color: var(--text-secondary);
  max-width: 60ch;
  margin: 0 auto;
  font-size: clamp(16px, 1.6vw, 22px);
  line-height: 1.55;
}

.num-inner {
  width: 100%;
  max-width: 1120px;
}

.home-h2 {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  margin: 14px 0 46px;
  font-size: clamp(30px, 4vw, 60px);
  line-height: 1.04;
}

.num-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  display: grid;
}

.num-v {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: -.04em;
  background: var(--grad-signature);
  color: #0000;
  font-variant-numeric: tabular-nums;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(34px, 4.4vw, 64px);
  line-height: 1;
}

.num-l {
  color: var(--text-secondary);
  margin-top: 12px;
  font-size: clamp(12px, 1vw, 15px);
}

.num-inner .minta-badge {
  margin-top: 34px;
}

.forg-toggle {
  border-radius: var(--radius-pill);
  background: #ffffff0d;
  border: 1px solid #ffffff1a;
  gap: 4px;
  margin: 4px auto 42px;
  padding: 5px;
  display: inline-flex;
  position: relative;
}

.forg-opt {
  z-index: 1;
  appearance: none;
  cursor: pointer;
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  color: var(--text-secondary);
  transition: color .3s var(--ease-out);
  white-space: nowrap;
  background: none;
  border: 0;
  padding: 10px 24px;
  font-size: clamp(13px, 1.1vw, 15px);
  font-weight: 600;
  position: relative;
}

.forg-opt.is-on {
  color: #fff;
}

.forg-thumb {
  z-index: 0;
  border-radius: var(--radius-pill);
  background: var(--grad-signature);
  width: calc(50% - 5px);
  transition: transform .4s var(--ease-out), background .4s var(--ease-out);
  position: absolute;
  top: 5px;
  bottom: 5px;
  left: 5px;
}

.forg-toggle.is-terelt .forg-thumb {
  background: linear-gradient(135deg, #ffc66e, #ff8a4c);
  transform: translateX(100%);
}

.forg-view {
  width: 100%;
}

.forg-kpis {
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(28px, 6vw, 96px);
  margin-bottom: 46px;
  display: flex;
}

.forg-kpi {
  text-align: center;
}

.fk-v {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(34px, 5vw, 68px);
  line-height: 1;
  display: block;
}

.forg-view[data-view="terelt"] .fk-v {
  background: linear-gradient(135deg, #ffc66e, #ff8a4c);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.fk-l {
  color: var(--text-secondary);
  margin-top: 10px;
  font-size: clamp(12px, 1vw, 15px);
  display: block;
}

.forg-charts {
  grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 5vw, 72px);
  display: grid;
}

.forg-chart {
  margin: 0;
}

.forg-chart figcaption {
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  margin-bottom: 24px;
  font-size: clamp(11px, .95vw, 13px);
}

.fbars {
  justify-content: space-between;
  align-items: flex-end;
  gap: clamp(8px, 1.4vw, 18px);
  display: flex;
}

.fbar {
  flex-direction: column;
  flex: 1;
  justify-content: flex-end;
  align-items: center;
  gap: 9px;
  display: flex;
}

.fbar-v {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  opacity: 0;
  transition: opacity .5s .3s var(--ease-out), transform .5s .3s var(--ease-out);
  white-space: nowrap;
  font-size: clamp(11px, .95vw, 13px);
  font-weight: 600;
  transform: translateY(6px);
}

.fbar.grown .fbar-v {
  opacity: 1;
  transform: none;
}

.fbar-fill {
  background: var(--grad-signature);
  width: 100%;
  max-width: 56px;
  height: 0;
  transition: height .85s var(--ease-out);
  border-radius: 8px 8px 3px 3px;
}

.forg-view[data-view="terelt"] .fbar-fill {
  background: linear-gradient(#ffc66e, #ff8a4c);
}

.fbar.grown .fbar-fill {
  height: var(--h);
}

.fbar.is-partial .fbar-fill {
  opacity: .5;
}

.fbar-y {
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  font-size: clamp(11px, 1vw, 14px);
}

.fbar.is-partial .fbar-y {
  color: var(--text-secondary);
}

.fbar.is-partial .fbar-y:after {
  content: "*";
  color: var(--text-muted);
}

.forg-stacked {
  width: 100%;
}

.forg-kpi--terelt .fk-v {
  background: linear-gradient(135deg, #ffc66e, #ff8a4c);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.forg-legend {
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  margin: 4px 0 34px;
  display: flex;
}

.fg-lg {
  color: var(--text-secondary);
  align-items: center;
  gap: 9px;
  font-size: clamp(12px, 1vw, 14px);
  display: inline-flex;
}

.fg-lg:before {
  content: "";
  border-radius: 4px;
  width: 13px;
  height: 13px;
}

.fg-lg--all:before {
  background: var(--grad-signature);
}

.fg-lg--ter:before {
  background: linear-gradient(135deg, #ffc66e, #ff8a4c);
}

.forg-chart--single {
  max-width: 880px;
  margin: 0 auto;
}

.fbars--stacked {
  align-items: flex-end;
  gap: clamp(12px, 3vw, 44px);
}

.fbars--stacked .fbar-fill {
  max-width: 88px;
  position: relative;
  overflow: hidden;
}

.seg-terelt {
  height: 0;
  transition: height .7s .38s var(--ease-out);
  background: linear-gradient(#ffc66e, #ff8a4c);
  border-radius: 0 0 3px 3px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.fbar.grown .seg-terelt {
  height: var(--ht);
}

.story-inner {
  text-align: left;
  width: 100%;
  max-width: 760px;
}

.story-inner .eyebrow, .story-inner .home-h2 {
  text-align: left;
}

.timeline {
  margin-top: 38px;
  padding-left: 34px;
  list-style: none;
  position: relative;
}

.timeline:before {
  content: "";
  opacity: .5;
  background: linear-gradient(#06f, #3E7DD0, #B53ED0);
  border-radius: 2px;
  width: 2px;
  position: absolute;
  top: 6px;
  bottom: 6px;
  left: 7px;
}

.tl-item {
  padding-bottom: 36px;
  position: relative;
}

.tl-item:last-child {
  padding-bottom: 0;
}

.tl-dot {
  background: var(--bg-elevated);
  border: 2px solid var(--figure-color);
  border-radius: 50%;
  width: 16px;
  height: 16px;
  position: absolute;
  top: 4px;
  left: -34px;
  box-shadow: 0 0 14px #0092D599;
}

.tl-year {
  font-family: var(--font-display);
  color: var(--text-accent);
  letter-spacing: -.02em;
  font-size: clamp(18px, 2vw, 26px);
  font-weight: 700;
}

.tl-body h3 {
  font-family: var(--font-display);
  margin: 4px 0;
  font-size: clamp(16px, 1.6vw, 21px);
  font-weight: 600;
}

.tl-body p {
  color: var(--text-secondary);
  font-size: clamp(13px, 1.1vw, 15px);
  line-height: 1.5;
}

#role-hub {
  z-index: 5;
}

.hub-inner {
  text-align: center;
  width: 100%;
  max-width: 1180px;
}

.hub-title {
  margin: 16px 0;
}

.hub-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.hub-sub {
  max-width: 62ch;
  color: var(--text-secondary);
  margin: 0 auto clamp(34px, 5vh, 60px);
  font-size: clamp(15px, 1.4vw, 19px);
  line-height: 1.55;
}

.hub-grid {
  text-align: left;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 1.6vw, 24px);
  display: grid;
}

.role-card {
  isolation: isolate;
  cursor: pointer;
  font: inherit;
  color: var(--text-primary);
  border: 1px solid var(--station-border);
  backdrop-filter: blur(8px);
  min-height: 0;
  transition: transform .42s var(--ease-out), border-color .42s var(--ease-out), box-shadow .42s var(--ease-out);
  background: linear-gradient(#12303Eb8, #0c0c18bd);
  border-radius: 20px;
  flex-direction: row;
  align-items: center;
  gap: clamp(16px, 1.5vw, 22px);
  padding: clamp(20px, 2vw, 28px);
  display: flex;
  position: relative;
}

.role-card:before {
  content: "";
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
  transition: opacity .42s var(--ease-out);
  background: radial-gradient(72% 84% at 50% 0, #0092D53d, #0000 70%);
  position: absolute;
  inset: -1px;
}

@media (hover: hover) {
  .role-card.ready:hover {
    border-color: #0092D599;
    transform: translateY(-6px);
    box-shadow: 0 18px 48px #00000080, 0 0 64px #0092D538;
  }

  .role-card.ready:hover:before {
    opacity: 1;
  }
}

.role-ico {
  color: #8FD3F2;
  width: 54px;
  height: 54px;
  transition: transform .42s var(--ease-out);
  background: #0092D51f;
  border: 1px solid #0092D547;
  border-radius: 15px;
  flex: none;
  place-items: center;
  display: grid;
}

.role-ico svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 29px;
  height: 29px;
}

.role-body {
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.role-name {
  font-family: var(--font-display);
  letter-spacing: var(--tracking-tight);
  font-size: clamp(19px, 1.6vw, 25px);
  font-weight: 700;
  line-height: 1.08;
}

.role-go {
  color: #8FD3F2;
  letter-spacing: .02em;
  transition: gap .34s var(--ease-out), color .34s var(--ease-out);
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
}

@media (hover: hover) {
  .role-card.ready:hover .role-ico {
    transform: translateY(-2px) scale(1.05);
  }

  .role-card.ready:hover .role-go {
    color: var(--text-primary);
    gap: 12px;
  }
}

.role-flag {
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
  background: var(--grad-signature);
  color: #fff;
  padding: 4px 10px;
  font-size: 10px;
  font-weight: 700;
  position: absolute;
  top: 14px;
  right: 14px;
  box-shadow: 0 4px 14px #3E7DD080;
}

.role-flag.soon {
  color: var(--text-muted);
  box-shadow: none;
  background: #94a3b829;
  border: 1px solid #94a3b838;
}

.role-card.featured {
  background: linear-gradient(#262152b8, #100e22c7);
  border-color: #0092D585;
}

.role-card.featured:before {
  opacity: .85;
}

.role-card.featured .role-ico {
  background: var(--grad-signature);
  color: #fff;
  border-color: #0000;
  box-shadow: 0 0 22px #0092D580;
}

.role-card.soon {
  cursor: default;
}

.role-card.soon .role-ico {
  color: var(--text-muted);
  background: #94a3b814;
  border-color: #94a3b82e;
}

.role-card.soon .role-name {
  opacity: .72;
}

.role-card.soon .role-go {
  color: var(--text-muted);
}

.role-card.launching {
  border-color: #0092D5;
  transform: scale(1.045);
  box-shadow: 0 0 0 2px #0092D5, 0 0 90px #0092D599;
}

@keyframes hub-nudge {
  0%, 100% {
    transform: translateX(0);
  }

  25% {
    transform: translateX(-5px);
  }

  75% {
    transform: translateX(5px);
  }
}

.role-card.nudge {
  animation: .4s hub-nudge;
}

.lx-stage {
  z-index: 9999;
  pointer-events: none;
  perspective: 1200px;
  position: fixed;
  inset: 0;
  overflow: hidden;
}

.lx-grp {
  width: 0;
  height: 0;
  position: fixed;
}

.lx-core {
  will-change: transform, opacity;
  background: radial-gradient(circle, #fff 0%, #8FD3F2 16%, #0092D5 40%, #B53ED0 66%, #14102eeb 86%, #060612 100%);
  border-radius: 50%;
  width: 220px;
  height: 220px;
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 0 90px #0092D5d9, 0 0 220px #B53ED099;
}

.lx-ring {
  will-change: transform, opacity;
  border: 2px solid #8FD3F2b3;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: inset 0 0 36px #0092D58c, 0 0 40px #B53ED073;
}

.lx-ring.r1 {
  width: 240px;
  height: 240px;
}

.lx-ring.r2 {
  border-color: #B53ED099;
  width: 330px;
  height: 330px;
}

.lx-ca {
  mix-blend-mode: screen;
  will-change: transform, opacity;
  border: 3px solid;
  border-radius: 50%;
  width: 250px;
  height: 250px;
  position: absolute;
  top: 0;
  left: 0;
}

.lx-ca.cy {
  border-color: #40e0ffbf;
}

.lx-ca.mg {
  border-color: #ff48d2b3;
}

.lx-streaks {
  width: 0;
  height: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.lx-streak {
  transform-origin: 0%;
  will-change: transform, opacity;
  background: linear-gradient(90deg, #8FD3F200 0%, #8FD3F2f2 42%, #B53ED0f2 72%, #B53ED000 100%);
  width: 62vmax;
  height: 2px;
  position: absolute;
  top: 0;
  left: 0;
}

.lx-veil {
  z-index: 10000;
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
  position: fixed;
  inset: 0;
}

.outro-actions {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 14px;
  display: flex;
}

.cta-ghost {
  font: inherit;
  cursor: pointer;
  border-radius: var(--radius-pill);
  border: 1px solid var(--station-border);
  color: var(--text-secondary);
  transition: border-color .3s var(--ease-out), color .3s var(--ease-out);
  background: none;
  padding: 16px 28px;
}

.cta-ghost:hover {
  color: var(--text-primary);
  border-color: #0092D5;
}

@media (width <= 880px) {
  .hub-grid {
    grid-template-columns: 1fr 1fr;
  }

  .role-card.featured {
    grid-column: 1 / -1;
  }
}

@media (width <= 520px) {
  .hub-grid {
    grid-template-columns: 1fr;
  }

  .role-card.featured {
    grid-column: auto;
  }
}

#intro-problem {
  z-index: 5;
  position: relative;
}

#intro-problem:before {
  content: "";
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(78% 56% at 50% 38%, #d8554d24, #0000 70%);
  position: absolute;
  inset: 0;
}

.problem-inner {
  text-align: left;
  width: 100%;
  max-width: 940px;
}

#intro-problem {
  padding-top: clamp(44px, 6.5vh, 60px);
  padding-bottom: clamp(36px, 5vh, 52px);
}

.problem-head {
  text-align: center;
  margin-bottom: clamp(20px, 3.4vh, 44px);
}

.problem-head .eyebrow {
  color: #f0897e;
  justify-content: center;
}

.problem-title {
  margin: 14px 0 18px;
}

.problem-list {
  flex-direction: column;
  gap: clamp(16px, 3vh, 40px);
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.problem-item {
  isolation: isolate;
  background: var(--pain-surface);
  border: 1px solid var(--pain-border);
  border-top: 1px solid var(--pain-edge);
  box-shadow: var(--pain-glow);
  opacity: 0;
  transition: opacity .8s var(--ease-out), transform .8s var(--ease-out);
  border-radius: 20px;
  align-items: flex-start;
  gap: clamp(18px, 2.4vw, 36px);
  padding: clamp(16px, 1.9vw, 24px) clamp(22px, 2.4vw, 38px) clamp(16px, 1.9vw, 24px) clamp(28px, 3vw, 46px);
  display: flex;
  position: relative;
  transform: translateY(42px) scale(.985);
}

.problem-item:before {
  content: "";
  z-index: -1;
  border-radius: inherit;
  background: var(--pain-backlight);
  opacity: 0;
  transition: opacity .8s var(--ease-out);
  position: absolute;
  inset: -1px;
}

.problem-item:after {
  content: "";
  opacity: 0;
  transform-origin: top;
  width: 3px;
  transition: opacity .6s var(--ease-out) .14s, transform .7s var(--ease-out) .14s;
  background: linear-gradient(#f0897e, #c9554d);
  border-radius: 3px;
  position: absolute;
  top: 14%;
  bottom: 14%;
  left: 0;
  transform: scaleY(0);
}

.problem-item.in {
  opacity: 1;
  transform: none;
}

.problem-item.in:before {
  opacity: 1;
}

.problem-item.in:after {
  opacity: 1;
  transform: scaleY(1);
}

.pi-num {
  font-family: var(--font-display);
  letter-spacing: -.04em;
  color: #0000;
  -webkit-text-stroke: 1.6px #e8736b99;
  flex: none;
  font-size: clamp(36px, 4.6vw, 66px);
  font-weight: 700;
  line-height: .86;
}

.pi-title {
  font-family: var(--font-display);
  color: #f8d6d1f7;
  margin: 2px 0 8px;
  font-size: clamp(20px, 2vw, 30px);
  font-weight: 700;
  line-height: 1.12;
}

.pi-detail {
  color: #e9bab5bd;
  max-width: 56ch;
  font-size: clamp(14px, 1.15vw, 17px);
  line-height: 1.5;
}

.problem-bridge {
  text-align: center;
  font-family: var(--font-display);
  letter-spacing: var(--tracking-tight);
  color: var(--text-primary);
  margin-top: clamp(22px, 4vh, 56px);
  font-size: clamp(26px, 3.4vw, 48px);
  font-weight: 700;
  line-height: 1.06;
}

.problem-bridge span {
  background: linear-gradient(100deg, #f0897e, #e8736b);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.bridge-cue {
  width: 16px;
  height: 16px;
  animation: bob 1.8s var(--ease-inout) infinite;
  border-bottom: 2px solid #e8736b99;
  border-right: 2px solid #e8736b99;
  margin: 24px auto 0;
  display: block;
  transform: rotate(45deg);
}

@media (width <= 620px) {
  .problem-item {
    align-items: flex-start;
    gap: 14px;
    padding: 20px 20px 20px 26px;
  }

  .pi-num {
    font-size: clamp(32px, 11vw, 44px);
  }
}

#portal {
  z-index: 4;
  height: 100vh;
  position: relative;
}

.portal-stage {
  background: radial-gradient(circle at 50% 50%, #0b0e22 0%, var(--bg-base) 72%);
  justify-content: center;
  align-items: center;
  height: 100vh;
  display: flex;
  position: relative;
  overflow: hidden;
}

.portal-rings {
  will-change: transform, opacity;
  background: repeating-radial-gradient(circle, #0000 0 36px, #0092D51f 36px 39px, #0000 39px 76px, #B53ED017 76px 79px);
  border-radius: 50%;
  width: 1200px;
  height: 1200px;
  margin: -600px 0 0 -600px;
  position: absolute;
  top: 50%;
  left: 50%;
}

.portal-core {
  will-change: transform, opacity;
  background: radial-gradient(circle, #fff 0%, #8FD3F2 42%, #B53ED000 74%);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  position: absolute;
  top: 50%;
  left: 50%;
  box-shadow: 0 0 60px 18px #B53ED080;
}

.portal-avatar {
  filter: drop-shadow(0 0 18px #0092D5cc);
  will-change: transform, opacity;
  width: 64px;
  height: 64px;
  margin: -32px 0 0 -32px;
  position: absolute;
  top: 50%;
  left: 50%;
}

.portal-avatar svg {
  width: 100%;
  height: 100%;
  display: block;
}

.portal-label {
  z-index: 2;
  text-align: center;
  will-change: opacity, transform;
  max-width: 600px;
  padding: 0 24px;
  position: relative;
}

.portal-label h2 {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  margin: 14px 0 16px;
  font-size: clamp(36px, 6vw, 84px);
  line-height: 1;
}

.portal-label p {
  color: var(--text-secondary);
  max-width: 46ch;
  margin: 0 auto;
  font-size: clamp(15px, 1.4vw, 19px);
}

.portal-flash {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  inset: 0;
}

#portal-flash-fixed {
  z-index: 60;
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
  background: radial-gradient(circle at 50% 44%, #eaebff 0%, #7c86f2 50%, #3a3f86 100%);
  position: fixed;
  inset: 0;
}

body.reduced #portal-flash-fixed {
  display: none;
}

#figure-layer, #route-rail, #hud {
  opacity: 0;
  transition: opacity .6s var(--ease-out);
}

body.in-journey #figure-layer, body.in-journey #route-rail, body.in-journey #hud {
  opacity: 1;
}

body.reduced .portal-rings, body.reduced .portal-core {
  opacity: .5;
}

#route-rail {
  z-index: 31;
  pointer-events: none;
  width: 2px;
  position: fixed;
  top: 96px;
  bottom: 86px;
  left: clamp(18px, 2.6vw, 38px);
}

.rail-track {
  background: repeating-linear-gradient(#8FD3F24d 0 3px, #0000 3px 9px);
  border-radius: 2px;
  width: 2px;
  position: absolute;
  inset: 0;
}

.rail-traveled {
  background: linear-gradient(#06f, #3E7DD0, #B53ED0);
  border-radius: 2px;
  width: 2px;
  height: 0;
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 0 9px #0092D5bf;
}

.rail-wp {
  align-items: center;
  gap: 10px;
  display: flex;
  position: absolute;
  left: 1px;
  transform: translate(-50%, -50%);
}

.rail-wp .wp-dot {
  background: var(--bg-elevated);
  border: 2px solid #8FD3F266;
  border-radius: 50%;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  transition: background .4s, box-shadow .4s, border-color .4s;
}

.rail-wp.done .wp-dot {
  background: var(--figure-color);
  border-color: var(--figure-color);
  box-shadow: 0 0 12px #0092D5cc;
}

.rail-wp .wp-label {
  letter-spacing: .04em;
  color: #F6F9FC80;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 600;
  transition: color .4s;
}

.rail-wp.current .wp-label {
  color: var(--text-primary);
}

.rail-marker {
  z-index: 2;
  position: absolute;
  top: 0;
  left: 1px;
  transform: translate(-50%, -50%);
}

.rail-marker:before {
  content: "";
  background: radial-gradient(circle at 38% 35%, #fff, var(--figure-color) 60%, #5b6cf0);
  border-radius: 50%;
  width: 14px;
  height: 14px;
  display: block;
  box-shadow: 0 0 16px #0092D5f2;
}

.rail-here {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
  background: var(--grad-signature);
  border-radius: var(--radius-pill);
  white-space: nowrap;
  padding: 3px 9px;
  font-size: 10px;
  font-weight: 700;
  position: absolute;
  top: 50%;
  left: 18px;
  transform: translateY(-50%);
  box-shadow: 0 4px 14px #3E7DD080;
}

.role-spine {
  z-index: 4;
  pointer-events: none;
  --rrf-a: 99,102,241;
  width: 120px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.role-spine svg {
  position: absolute;
  inset: 0;
  overflow: visible;
}

.rsp-base {
  fill: none;
  stroke: rgba(var(--rrf-a),.16);
  stroke-width: 2.5px;
}

.rsp-trail {
  fill: none;
  stroke: rgb(var(--rrf-a));
  stroke-width: 2.5px;
  stroke-linecap: round;
  filter: drop-shadow(0 0 8px rgba(var(--rrf-a),.8));
}

.role-spine .rrf-ico {
  z-index: 2;
  background: radial-gradient(circle at 38% 32%, color-mix(in srgb, rgb(var(--rrf-a)) 26%, #101226), #0a0c1c 78%);
  border: 1.6px solid rgb(var(--rrf-a));
  width: 44px;
  height: 44px;
  box-shadow: 0 0 20px rgba(var(--rrf-a),.85), 0 0 50px rgba(var(--rrf-a),.3), 0 4px 14px #00000080;
  border-radius: 50%;
  place-items: center;
  display: grid;
  position: absolute;
  top: 0;
  left: 60px;
  transform: translate(-50%, -50%);
}

.role-spine .rrf-ico svg {
  fill: none;
  stroke: #ebf0fff2;
  stroke-width: 1.8px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 22px;
  height: 22px;
  position: static;
}

.sec-portal {
  --spa: 99,102,241;
  text-align: center;
  z-index: 5;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-height: 100svh;
  display: flex;
  position: relative;
  overflow: hidden;
}

#sec-flash-fixed {
  z-index: 60;
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
  --sfa: 99,102,241;
  background: radial-gradient(circle at 50% 44%,
    #eaebff 0%,
    color-mix(in srgb, rgb(var(--sfa)) 52%, #7c86f2) 50%,
    color-mix(in srgb, rgb(var(--sfa)) 45%, #23264a) 100%);
  position: fixed;
  inset: 0;
}

body.reduced #sec-flash-fixed, body.mobile #sec-flash-fixed {
  display: none;
}

.sp-core {
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(circle, #fff 0%,
    color-mix(in srgb, rgb(var(--spa)) 45%, #cdd4ff) 42%, transparent 74%);
  width: 40px;
  height: 40px;
  box-shadow: 0 0 60px 18px rgba(var(--spa),.5);
  will-change: transform, opacity;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

body.reduced .sp-core, body.mobile .sp-core {
  display: none;
}

.sp-rings {
  pointer-events: none;
  background: repeating-radial-gradient(circle at center,
    transparent 0 36px, rgba(var(--spa),.12) 36px 39px,
    transparent 39px 76px, rgba(var(--spa),.09) 76px 79px);
  will-change: transform, opacity;
  border-radius: 50%;
  width: 1200px;
  height: 1200px;
  margin: -600px 0 0 -600px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.sp-label {
  z-index: 2;
  will-change: opacity, transform;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  display: flex;
  position: relative;
}

.sec-portal .eyebrow {
  justify-content: center;
  position: relative;
}

.sp-title {
  max-width: 16ch;
  font-family: var(--font-display);
  letter-spacing: -.02em;
  background: linear-gradient(100deg, #eaebff 10%, rgb(var(--spa)) 90%);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  margin: 0;
  font-size: clamp(44px, 6.8vw, 96px);
  font-weight: 800;
  line-height: 1.04;
  position: relative;
}

.sp-sub {
  max-width: 52ch;
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(14px, 1.35vw, 19px);
  position: relative;
}

body.reduced .sp-label {
  opacity: 1 !important;
  transform: none !important;
}

body.reduced .sp-rings {
  opacity: .35 !important;
  transform: translate(-50%, -50%) scale(1.1) !important;
}

@media (width <= 860px) {
  .sec-portal {
    min-height: 88svh;
  }
}

.k-dimmable {
  transition: opacity .25s var(--ease-out), filter .25s var(--ease-out),
  box-shadow .25s var(--ease-out), background .25s var(--ease-out);
  transition-delay: 0s;
}

body:not(.reduced) .k-dimmable:not(.k-lit) {
  opacity: .5;
  filter: saturate(.75);
}

.k-dimmable.k-lit {
  opacity: 1;
  box-shadow: 0 0 0 1px #94a3b82e, 0 0 44px #0092D529, 0 18px 44px #0006;
}

.mn-sub {
  opacity: .7;
  margin-top: 4px;
  font-size: 10px;
}

@media (width <= 860px) {
  .home-sec, #hero, section.scene {
    min-height: 100svh;
  }

  #route-rail, .role-spine {
    display: none;
  }

  body:not(.reduced) .k-dimmable:not(.k-lit) {
    opacity: 1;
    filter: none;
  }

  .num-grid {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }

  .num-v {
    font-size: clamp(28px, 6.5vw, 52px);
  }

  .forg-charts {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .fbars {
    height: auto;
  }

  .fbar-fill {
    max-width: 46px;
  }

  .lists {
    grid-template-columns: 1fr;
  }

  section.scene.left, section.scene.right {
    justify-content: center;
  }

  #stage, #figure-layer {
    display: none;
  }

  .panel {
    opacity: 1;
    transform: none;
  }

  .atom-wrap {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .atom-left {
    text-align: center;
    align-items: center;
    max-width: none;
  }

  .atom-left .atom-eyebrow, .atom-h2, .atom-lead {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }

  .atom-diagram {
    max-width: 230px;
    margin: 4px auto 0;
  }

  .atom-num {
    display: none;
  }

  .beat-list li {
    padding-left: 40px;
    font-size: clamp(17px, 4.6vw, 24px);
  }

  .opt-title {
    font-size: clamp(24px, 6vw, 34px);
  }

  .chart-donut {
    gap: 18px;
  }

  .donut {
    width: 128px;
    height: 128px;
  }

  .stat-big {
    font-size: clamp(40px, 13vw, 64px);
  }

  .cbar-label {
    width: 42%;
  }

  .timeline {
    padding-left: 28px;
  }

  .brand-d24 {
    height: 17px;
  }

  .brand-medio {
    height: 25px;
  }

  .brand-x {
    margin: 0 12px;
  }

  #mapBtn {
    min-height: 44px;
    padding: 11px 14px;
    right: 12px;
  }

  .map-ico {
    width: 13px;
    height: 13px;
  }

  .lens-toggle {
    z-index: 47;
    position: fixed;
    inset: auto auto 16px 50%;
    transform: translateX(-50%);
    box-shadow: 0 8px 28px #04040a8c;
  }

  .lens-opt {
    padding: 12px 22px;
    font-size: 13px;
  }
}

@media (width <= 520px) {
  .num-grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .hook-title {
    font-size: clamp(34px, 10vw, 56px);
  }

  .home-h2 {
    font-size: clamp(26px, 8vw, 40px);
  }

  .forg-opt {
    padding: 9px 15px;
    font-size: 13px;
  }

  .forg-kpis {
    gap: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .fig-ring, .scroll-hint .chev, .orbit-ring, .atom-core.live {
    animation: none;
  }

  .panel {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .fbar-fill, .fbar-v, .forg-thumb {
    transition: none;
  }
}

body.reduced #figure-layer, body.reduced #route-rail, body.reduced #stage, body.mobile #figure-layer, body.mobile #route-rail, body.mobile #stage {
  display: none;
}

body.reduced section.scene.atom, body.reduced .atom-sticky, body.mobile section.scene.atom, body.mobile .atom-sticky {
  height: auto;
  min-height: 0;
}

body.reduced .atom-sticky, body.mobile .atom-sticky {
  padding: 64px 0;
  display: block;
  overflow: visible;
}

body.reduced .beat-stage, body.mobile .beat-stage {
  flex-direction: column;
  gap: 48px;
  min-height: 0;
  display: flex;
  position: static;
}

body.reduced .beat-card, body.mobile .beat-card {
  opacity: 1;
  pointer-events: auto;
  position: static;
  inset: auto;
  transform: none;
}

body.reduced .atom-diagram, body.mobile .atom-diagram {
  transform: none !important;
}

body.reduced #portal {
  height: auto;
}

body.reduced .portal-stage {
  height: auto;
  min-height: 66svh;
  padding: 80px 0;
}

body.reduced .portal-core {
  display: none;
}

body.reduced .portal-rings {
  opacity: .35;
  transform: scale(1.1);
}

body.reduced .portal-label {
  opacity: 1;
  transform: none;
}

body.mobile #portal {
  height: 100svh;
}

body.mobile .portal-stage {
  height: 100svh;
  min-height: 0;
  padding: 0;
}

body.reduced .reveal-up {
  opacity: 1;
  transform: none;
}

#key-hint {
  z-index: 60;
  backdrop-filter: blur(8px);
  color: #cdd4f5;
  letter-spacing: .2px;
  opacity: 1;
  pointer-events: none;
  background: #0c1022b8;
  border: 1px solid #8FD3F240;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 7px 13px;
  font: 600 12px / 1 Lexend, sans-serif;
  transition: opacity .7s;
  display: flex;
  position: fixed;
  bottom: 88px;
  left: 50%;
  transform: translateX(-50%);
}

#key-hint.fade {
  opacity: 0;
}

#key-hint kbd {
  color: #e7ebff;
  background: #8FD3F229;
  border: 1px solid #8FD3F266;
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  font: 700 12px / 1 Lexend, sans-serif;
  display: inline-flex;
}

@media (width <= 860px) {
  #key-hint {
    display: none;
  }
}

.panel--v2 {
  width: min(720px, 92vw);
}

.beats-v2 {
  flex-direction: column;
  gap: 18px;
  margin-top: 22px;
  display: flex;
}

.beats-v2 .beat {
  opacity: 1;
  isolation: isolate;
  border-radius: var(--station-radius);
  padding: clamp(18px, 1.9vw, 26px);
  position: relative;
  transform: none;
}

.beat-head {
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  display: inline-flex;
}

.st-icon {
  flex: none;
  width: clamp(26px, 2.6vw, 34px);
  height: clamp(26px, 2.6vw, 34px);
}

.beat-tag {
  letter-spacing: .14em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
  padding: 4px 11px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}

.beats-v2 .beat-title {
  font-family: var(--font-display);
  letter-spacing: var(--tracking-tight);
  max-width: 32ch;
  margin: 0 0 12px;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
  line-height: 1.12;
}

.beat-bullets {
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.beat-bullet {
  padding-left: 20px;
  font-size: clamp(13px, 1.05vw, 15px);
  line-height: 1.45;
  position: relative;
}

.beat-bullet:before {
  content: "";
  border-radius: 2px;
  width: 9px;
  height: 2px;
  position: absolute;
  top: .62em;
  left: 0;
}

.beat--problem {
  background: var(--pain-surface);
  border: 1px solid var(--pain-border);
  border-top: 1px solid var(--pain-edge);
  box-shadow: var(--pain-glow);
  filter: var(--pain-filter);
}

.beat--problem:before {
  content: "";
  z-index: -1;
  background: var(--pain-backlight);
  opacity: .9;
  pointer-events: none;
  position: absolute;
  inset: -12% -8%;
}

.beat--problem .beat-title {
  color: var(--pain-text);
}

.beat--problem .beat-bullet {
  color: var(--pain-text-dim);
}

.beat--problem .beat-bullet:before {
  background: var(--pain-dash);
}

.beat--problem .st-icon {
  color: var(--pain-icon);
  filter: none;
}

.beat--problem .beat-tag {
  background: var(--pain-tag-bg);
  color: var(--pain-tag-text);
  border: 1px solid var(--pain-border);
}

.beat--solution {
  background: var(--sol-surface);
  border: 1px solid var(--sol-border);
  box-shadow: var(--sol-glow);
  filter: var(--sol-filter);
}

.beat--solution:before {
  content: "";
  background: var(--sol-backlight);
  z-index: -1;
  opacity: 0;
  transition: opacity var(--ignite-dur) var(--ignite-ease);
  pointer-events: none;
  position: absolute;
  inset: -12% -8%;
}

.beat--solution.is-active:before {
  opacity: 1;
}

.beat--solution .beat-title {
  color: var(--sol-text);
}

.beat--solution .beat-bullet {
  color: var(--text-secondary);
}

.beat--solution .beat-bullet:before {
  background: var(--sol-dash);
}

.beat--solution .st-icon {
  color: var(--sol-icon);
  filter: var(--sol-icon-glow);
}

.beat--solution .beat-tag {
  background: var(--sol-tag-bg);
  color: var(--sol-tag-text);
  border: 1px solid var(--sol-border);
}

@keyframes beat-ignite {
  0% {
    border-color: var(--pain-border);
    filter: var(--pain-filter);
    box-shadow: 0 0 0 1px #94a3b81f, 0 0 #0000;
  }

  55% {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--beat-accent) 40%, transparent),
                     0 0 88px color-mix(in srgb, var(--beat-accent) 42%, transparent),
                     0 24px 56px #0000008c;
    filter: saturate(1.15) brightness(1.06);
  }

  100% {
    box-shadow: var(--sol-glow);
    border-color: color-mix(in srgb, var(--beat-accent) 70%, transparent);
    filter: var(--sol-filter);
  }
}

.beat--solution.is-active {
  animation: beat-ignite var(--ignite-dur) var(--ignite-ease) both;
}

.scene.wow .beat--solution {
  --sol-glow: 0 0 0 1px color-mix(in srgb, var(--beat-accent) 34%, transparent),
              0 0 72px color-mix(in srgb, var(--beat-accent) 32%, transparent),
              0 0 120px color-mix(in srgb, var(--beat-accent) 24%, transparent),
              0 24px 56px #0000008c;
}

.metric-badge {
  align-items: baseline;
  gap: var(--space-sm);
  border-radius: var(--metric-radius);
  background: var(--metric-bg);
  border: 1px solid var(--metric-border);
  box-shadow: var(--metric-glow);
  flex-wrap: wrap;
  margin-top: 16px;
  padding: 10px 16px;
  display: inline-flex;
  position: relative;
}

.metric-num {
  font-family: var(--font-display);
  font-size: var(--metric-num-size);
  letter-spacing: var(--tracking-tight);
  background: var(--metric-grad);
  -webkit-text-fill-color: transparent;
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-weight: 700;
  line-height: 1;
}

.metric-label {
  font-size: var(--size-label);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--text-secondary);
  max-width: 24ch;
  font-weight: 600;
}

.metric-badge:after {
  content: "";
  background: var(--metric-grad);
  width: 0;
  height: 2px;
  transition: width var(--dur-slow) var(--ease-out);
  border-radius: 2px;
  position: absolute;
  bottom: 8px;
  left: 16px;
}

.beat--solution.is-active .metric-badge:after {
  width: calc(var(--metric-num-size) * .9);
}

.lens-toggle {
  display: none !important;
}

@media (width <= 860px) {
  .panel--v2 {
    width: 92vw;
  }

  .beats-v2 .beat {
    padding: 18px;
  }

  .metric-num {
    --metric-num-size: clamp(30px, 9vw, 44px);
  }

  .metric-badge {
    width: 100%;
  }
}

section.scene.station {
  --sp: 0;
  --ep: 0;
  min-height: 212vh;
  padding: 0;
  display: block;
}

.st-sticky {
  justify-content: center;
  align-items: center;
  height: 100vh;
  padding: clamp(20px, 4vh, 56px) clamp(24px, 6vw, 96px);
  display: flex;
  position: sticky;
  top: 0;
  overflow: clip;
}

.st-grid {
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.12fr);
  align-items: center;
  gap: clamp(28px, 5vw, 76px);
  width: min(1200px, 94vw);
  display: grid;
}

section.scene.right .st-copy {
  order: 2;
}

section.scene.right .st-visual {
  order: 1;
}

.st-copy {
  position: relative;
}

.st-num {
  font-family: var(--font-display);
  color: #0000;
  -webkit-text-stroke: 1.5px #8FD3F229;
  letter-spacing: -.04em;
  pointer-events: none;
  z-index: 0;
  opacity: calc(.35 + .65 * var(--ep));
  transform: translateY(calc((1 - var(--ep)) * 18px));
  font-size: clamp(72px, 11vw, 150px);
  font-weight: 700;
  line-height: .8;
  position: absolute;
  top: -42px;
  left: -8px;
}

.st-copy > .st-eyebrow, .st-copy > .st-title, .st-copy > .st-beats {
  z-index: 1;
  position: relative;
}

.st-eyebrow {
  color: var(--beat-accent-soft);
  font-size: var(--size-label);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  opacity: var(--ep);
  transform: translateY(calc((1 - var(--ep)) * 14px));
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  display: inline-flex;
}

.st-eyebrow:before {
  content: "";
  background: linear-gradient(90deg, var(--beat-accent), transparent);
  border-radius: 2px;
  width: 26px;
  height: 2px;
}

.st-title {
  font-family: var(--font-display);
  letter-spacing: var(--tracking-tight);
  color: var(--text-primary);
  opacity: var(--ep);
  transform: translateY(calc((1 - var(--ep)) * 22px));
  margin: 0 0 clamp(20px, 2.4vw, 34px);
  font-size: clamp(26px, 3.3vw, 48px);
  font-weight: 700;
  line-height: 1.06;
}

.st-beats {
  min-height: clamp(300px, 46vh, 470px);
  opacity: calc(.4 + .6 * var(--ep));
  align-content: center;
  margin-top: 0;
  display: grid;
}

.st-beats > .beat {
  grid-area: 1 / 1;
  align-self: center;
}

.st-beats .beat--problem {
  opacity: clamp(0, calc(1 - (var(--sp) - .34) * 3.8), 1);
  transform: translateY(calc(var(--sp) * -24px))
             scale(calc(1 - .04 * clamp(0, (var(--sp) - .34) * 3.8, 1)));
  filter: saturate(calc(1 - .45 * var(--sp)));
  pointer-events: none;
  transition: none;
}

.st-beats .beat--solution {
  opacity: clamp(0, calc((var(--sp) - .5) * 3.8), 1);
  transform: translateY(calc((1 - clamp(0, (var(--sp) - .5) * 3.8, 1)) * 28px))
             scale(calc(.97 + .03 * clamp(0, (var(--sp) - .5) * 3.8, 1)));
  transition: none;
  position: relative;
}

.st-beats .beat--solution:after {
  content: "";
  z-index: -1;
  border-radius: inherit;
  background: var(--sol-backlight);
  opacity: clamp(0, calc((var(--sp) - .5) * 3.2, 1));
  pointer-events: none;
  position: absolute;
  inset: -2px;
}

.st-beats .beat--solution .metric-badge {
  opacity: clamp(0, calc((var(--sp) - .7) * 4), 1);
  transform: translateY(calc((1 - clamp(0, (var(--sp) - .7) * 4, 1)) * 16px));
}

.st-copy .beats-v2 .beat {
  padding: clamp(24px, 2.7vw, 40px);
}

.st-copy .beats-v2 .beat-title {
  max-width: 24ch;
  margin-bottom: 18px;
  font-size: clamp(24px, 2.7vw, 38px);
  line-height: 1.1;
}

.st-copy .beats-v2 .beat-bullets {
  gap: 13px;
}

.st-copy .beats-v2 .beat-bullet {
  padding-left: 24px;
  font-size: clamp(15px, 1.25vw, 19px);
  line-height: 1.5;
}

.st-copy .beats-v2 .beat-bullet:before {
  width: 11px;
  top: .7em;
}

.st-copy .beats-v2 .beat-tag {
  padding: 5px 13px;
  font-size: 12px;
}

.st-copy .beats-v2 .st-icon {
  width: clamp(30px, 2.9vw, 38px);
  height: clamp(30px, 2.9vw, 38px);
}

.st-visual {
  aspect-ratio: 1 / .92;
  place-items: center;
  min-height: clamp(300px, 42vh, 460px);
  display: grid;
  position: relative;
}

.st-vis-glow {
  z-index: 0;
  background: radial-gradient(62% 60% at 50% 46%,
              color-mix(in srgb, var(--beat-accent) 26%, transparent) 0%, transparent 72%);
  opacity: calc(.15 + .85 * var(--sp));
  transform: scale(calc(.9 + .1 * var(--sp)));
  border-radius: 32px;
  position: absolute;
  inset: 4% 2%;
}

.st-visual:before {
  content: "";
  z-index: 0;
  opacity: calc(1 - var(--sp));
  pointer-events: none;
  background: radial-gradient(62% 60% at 50% 46%, #d8554d38 0%, #0000 72%);
  border-radius: 32px;
  position: absolute;
  inset: 4% 2%;
}

.mk-stage, .mk-leader {
  z-index: 1;
  place-items: center;
  width: 100%;
  height: 100%;
  display: grid;
  position: relative;
}

.mk-leader {
  padding: 8px;
}

.mk-leader .chart-wrap {
  background: var(--bg-surface);
  border: 1px solid var(--station-border);
  width: min(420px, 100%);
  box-shadow: var(--shadow-panel);
  border-radius: 20px;
  padding: 24px;
}

.mk-card {
  border: 1px solid color-mix(in srgb, var(--beat-accent) 30%, #ffffff14);
  box-shadow: var(--glow-station);
  backdrop-filter: blur(8px);
  background: linear-gradient(#12303Eeb, #0c0c18eb);
  border-radius: 20px;
  position: relative;
}

.phone {
  aspect-ratio: 9 / 18.5;
  border: 1.5px solid color-mix(in srgb, var(--beat-accent) 40%, #ffffff1f);
  width: clamp(168px, 21vw, 210px);
  box-shadow: var(--glow-station), inset 0 0 0 6px #00000059;
  opacity: calc(.55 + .45 * var(--ep));
  transform: translateY(calc((1 - var(--ep)) * 26px));
  background: linear-gradient(#14142a, #0a0a16);
  border-radius: 30px;
  flex-direction: column;
  gap: 10px;
  padding: 18px 14px;
  display: flex;
  position: relative;
}

.phone:before {
  content: "";
  background: #ffffff24;
  border-radius: 3px;
  width: 42px;
  height: 5px;
  position: absolute;
  top: 9px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-fogl2 {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.f2-fan {
  z-index: 2;
  justify-content: center;
  align-items: flex-start;
  gap: clamp(6px, .8vw, 12px);
  width: 100%;
  display: flex;
}

.f2-ch {
  text-align: center;
  white-space: nowrap;
  color: var(--text-primary);
  border: 1px solid rgba(var(--pv2),.32);
  transform: translateY(calc(var(--fy) + (1 - var(--ep)) * 16px));
  opacity: clamp(0, calc((var(--ep) - var(--th)) * 3), 1);
  background: #0e101eeb;
  border-radius: 12px;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 12px;
  font-size: 11.5px;
  font-weight: 600;
  display: flex;
  position: relative;
  box-shadow: 0 10px 26px #0000006b;
}

.f2-ch svg {
  fill: none;
  width: 20px;
  height: 20px;
  stroke: var(--pv2b);
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.f2-ch em {
  color: var(--text-muted);
  font-size: 9.5px;
  font-style: normal;
  font-weight: 500;
}

.f2-mini {
  z-index: 3;
  opacity: clamp(0, calc((var(--sp) - .62) * 4), 1);
  background: #1c1a3af7;
  border: 1px solid #8FD3F280;
  border-radius: 10px;
  flex-direction: column;
  gap: 1px;
  padding: 8px 12px;
  display: flex;
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) scale(.85);
  box-shadow: 0 10px 26px #00000080;
}

.f2-mini b {
  color: var(--text-primary);
  font-size: 11px;
}

.f2-mini em {
  color: var(--pv2b);
  font-size: 9.5px;
  font-style: normal;
}

.f2-beams {
  z-index: 1;
  width: min(90%, 480px);
  height: clamp(44px, 7vh, 76px);
  margin: -2px 0;
}

.f2-beam {
  fill: none;
  stroke: rgba(var(--pv2),.55);
  stroke-width: 1.6px;
  stroke-linecap: round;
  stroke-dasharray: 5 7;
  opacity: clamp(0, calc((var(--sp) - .12) * 2.6), 1);
}

.is-solve .f2-beam {
  animation: 1.4s linear infinite r2b-march;
}

.mk-fogl2 .mk-cal {
  z-index: 2;
  width: min(86%, 360px);
  opacity: calc(.25 + .75 * var(--sp));
  transform: scale(calc(.88 + .12 * var(--sp)));
  padding: 18px;
}

.cal-grid .cell.pick {
  background: rgba(var(--pv2),.28);
  border: 1px solid rgba(var(--pv2),.7);
  box-shadow: 0 0 calc(18px * var(--sp)) rgba(var(--pv2),.55);
  position: relative;
}

.cal-grid .cell.pick:after {
  content: "";
  border: 1.5px solid rgba(var(--pv2),.6);
  opacity: clamp(0, calc((var(--sp) - .45) * 3), 1);
  border-radius: 8px;
  position: absolute;
  inset: -5px;
}

.f2-confirm {
  color: var(--pv2b);
  background: rgba(var(--pv2),.09);
  border: 1px solid rgba(var(--pv2),.35);
  opacity: clamp(0, calc((var(--sp) - .72) * 4), 1);
  border-radius: 12px;
  align-items: center;
  gap: 9px;
  margin-top: 16px;
  padding: 10px 13px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.f2-confirm svg {
  fill: none;
  width: 15px;
  height: 15px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cal-head {
  color: var(--text-primary);
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
}

.cal-dot {
  background: var(--beat-accent);
  width: 8px;
  height: 8px;
  box-shadow: 0 0 12px var(--beat-accent);
  border-radius: 50%;
}

.cal-live {
  letter-spacing: .04em;
  color: var(--beat-accent-soft);
  text-transform: uppercase;
  margin-left: auto;
  font-size: 10px;
  font-weight: 600;
}

.cal-grid {
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  display: grid;
}

.cal-grid .cell {
  aspect-ratio: 1;
  opacity: clamp(0, calc(var(--sp) * 3 - var(--gi) * .12), 1);
  background: #ffffff0d;
  border-radius: 6px;
}

.cal-grid .cell.on {
  background: var(--metric-grad);
  box-shadow: 0 0 14px color-mix(in srgb, var(--beat-accent) 50%, transparent);
}

.ai-badge {
  background: var(--metric-bg);
  border: 1px solid var(--metric-border);
  color: var(--text-primary);
  opacity: calc(clamp(0, var(--sp) * 2 - 1, 1));
  border-radius: 12px;
  align-items: center;
  gap: 9px;
  margin-top: 16px;
  padding: 10px 13px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.ai-pulse {
  background: var(--pv2a);
  border-radius: 50%;
  width: 9px;
  height: 9px;
  position: relative;
}

.ai-pulse:after {
  content: "";
  border: 1.5px solid var(--pv2a);
  border-radius: 50%;
  animation: 1.8s ease-out infinite aip;
  position: absolute;
  inset: -5px;
}

@keyframes aip {
  0% {
    opacity: .8;
    transform: scale(.6);
  }

  100% {
    opacity: 0;
    transform: scale(1.7);
  }
}

.mk-precall {
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
  display: flex;
}

.phone-call {
  justify-content: flex-start;
  align-items: center;
  gap: 14px;
  padding-top: 30px;
}

.call-rings {
  width: 64px;
  height: 64px;
  margin: 10px auto 4px;
  position: relative;
}

.call-rings span {
  border: 2px solid var(--beat-accent);
  opacity: 0;
  border-radius: 50%;
  animation: 2.4s ease-out infinite callring;
  position: absolute;
  inset: 0;
}

.call-rings span:nth-child(2) {
  animation-delay: .8s;
}

.call-rings span:nth-child(3) {
  animation-delay: 1.6s;
}

@keyframes callring {
  0% {
    opacity: .7;
    transform: scale(.4);
  }

  100% {
    opacity: 0;
    transform: scale(1.6);
  }
}

.call-ava {
  background: var(--metric-grad);
  width: 30px;
  height: 30px;
  box-shadow: 0 0 18px var(--beat-accent);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.call-name {
  text-align: center;
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
}

.call-wave {
  justify-content: center;
  align-items: flex-end;
  gap: 4px;
  height: 28px;
  display: flex;
}

.call-wave i {
  background: var(--beat-accent-soft);
  width: 4px;
  height: calc(8px + (var(--wi) * 3px));
  animation: 1s ease-in-out infinite cwave;
  animation-delay: calc(var(--wi) * 80ms);
  border-radius: 2px;
}

@keyframes cwave {
  0%, 100% {
    transform: scaleY(.4);
  }

  50% {
    transform: scaleY(1.3);
  }
}

.call-fleet {
  text-align: center;
  width: min(86%, 330px);
  opacity: var(--ep);
}

.fleet-cap {
  color: var(--text-secondary);
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 600;
}

.fleet-grid {
  grid-template-columns: repeat(10, 1fr);
  gap: 6px;
  display: grid;
}

.fleet-grid .seat {
  aspect-ratio: 1;
  background: #94a3b82e;
  background: color-mix(in srgb, #5ee6a8 calc(clamp(0, var(--sp) * 60 - var(--si), 1) * 100%), #94a3b82e);
  box-shadow: 0 0 calc(clamp(0, var(--sp) * 60 - var(--si), 1) * 10px) #5ee6a899;
  border-radius: 50%;
}

.mk-precall .meter {
  width: min(86%, 330px);
}

.meter-top {
  color: var(--text-secondary);
  justify-content: space-between;
  margin-bottom: 7px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.meter-num {
  color: #5ee6a8;
  opacity: calc(clamp(0, var(--sp) * 2 - .8, 1));
}

.meter-track {
  background: #ff505033;
  border-radius: 5px;
  height: 9px;
  overflow: hidden;
}

.meter-fill {
  height: 100%;
  width: calc(100% - var(--sp) * 50%);
  background: linear-gradient(90deg, #ff6b6b, #ffb05a);
  border-radius: 5px;
  transition: none;
  display: block;
}

.mk-checkin {
  place-items: center;
  width: 100%;
  height: 100%;
  display: grid;
  position: relative;
}

.mk-checkin .crowd {
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  display: flex;
  position: absolute;
  inset: 6% 4% auto;
}

.mk-checkin .crowd .cd {
  width: 12px;
  height: 12px;
  opacity: clamp(0, calc(1 - var(--sp) * 24 + var(--di)), 1);
  transform: translateY(calc(var(--sp) * -10px));
  background: #94a3b866;
  border-radius: 50% / 60% 60% 40% 40%;
}

.phone-qr {
  z-index: 2;
  align-items: center;
  gap: 12px;
}

.phone-qr .qr {
  background: #fff;
  border-radius: 12px;
  width: 96px;
  height: 96px;
  margin: 16px auto 0;
  padding: 8px;
  position: relative;
  overflow: hidden;
}

.qr-grid {
  grid-template-columns: repeat(6, 1fr);
  gap: 2px;
  width: 100%;
  height: 100%;
  display: grid;
}

.qr-grid i {
  opacity: calc(.25 + .75 * var(--ep));
  background: #0a0a16;
  border-radius: 1px;
}

.qr-grid i:nth-child(3n), .qr-grid i:nth-child(5n) {
  background: none;
}

.qr-scan {
  background: var(--beat-accent);
  height: 3px;
  box-shadow: 0 0 14px var(--beat-accent);
  left: 8px;
  right: 8px;
  top: calc(8px + var(--sp) * 80px);
  opacity: calc(1 - var(--sp));
  border-radius: 2px;
  position: absolute;
}

.qr-label {
  text-align: center;
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 600;
}

.qr-done {
  width: 40px;
  height: 40px;
  opacity: calc(clamp(0, var(--sp) * 2.5 - 1.5, 1));
  transform: scale(calc(.4 + .6 * var(--sp)));
  background: #5ee6a8;
  border-radius: 50%;
  place-items: center;
  margin: 0 auto;
  display: grid;
}

.qr-done svg {
  fill: none;
  stroke: #06281c;
  stroke-width: 3px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 22px;
  height: 22px;
}

.mk-checkin .timer {
  text-align: right;
  opacity: calc(clamp(0, var(--sp) * 2 - .6, 1));
  transform: translateY(calc((1 - var(--sp)) * 14px));
  position: absolute;
  bottom: 7%;
  right: 6%;
}

.timer .t-num {
  font-family: var(--font-display);
  background: var(--metric-grad);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(34px, 5vw, 58px);
  font-weight: 700;
  line-height: 1;
}

.timer .t-unit {
  color: var(--text-secondary);
  margin-left: 4px;
  font-size: 14px;
}

.timer .t-sub {
  color: var(--beat-accent-soft);
  margin-top: 4px;
  font-size: 11px;
  display: block;
}

.mk-his {
  place-items: center;
  width: 100%;
  display: grid;
}

.his-card {
  width: min(94%, 400px);
  opacity: calc(.6 + .4 * var(--ep));
  transform: translateY(calc((1 - var(--ep)) * 22px));
  padding: 18px;
}

.his-head {
  color: var(--text-primary);
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
}

.his-mark {
  background: var(--beat-accent);
  width: 9px;
  height: 9px;
  box-shadow: 0 0 10px var(--beat-accent);
  border-radius: 2px;
}

.his-eeszt {
  color: #5ee6a8;
  opacity: calc(clamp(0, var(--sp) * 2 - 1, 1));
  margin-left: auto;
  font-size: 11px;
  font-weight: 600;
}

.his-body {
  background: #0000004d;
  border-radius: 12px;
  padding: 14px;
  position: relative;
}

.ecg {
  width: 100%;
  height: 56px;
  display: block;
}

.ecg-line {
  fill: none;
  stroke: #5ee6a8;
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 600;
  stroke-dashoffset: calc(600 - var(--sp) * 600);
  filter: drop-shadow(0 0 6px #5ee6a899);
}

.his-devs {
  gap: 8px;
  margin-top: 12px;
  display: flex;
}

.his-devs .dev {
  text-align: center;
  background: var(--metric-bg);
  border: 1px solid var(--metric-border);
  color: var(--text-primary);
  opacity: clamp(0, calc(var(--sp) * 5 - var(--vi)), 1);
  transform: translateY(calc((1 - clamp(0, var(--sp) * 5 - var(--vi), 1)) * 16px));
  border-radius: 9px;
  flex: 1;
  padding: 8px 4px;
  font-size: 11px;
  font-weight: 600;
}

.his-foot {
  color: var(--text-secondary);
  justify-content: space-between;
  align-items: center;
  margin-top: 14px;
  font-size: 11px;
  display: flex;
}

.his-foot .ok {
  color: var(--beat-accent-soft);
  opacity: calc(clamp(0, var(--sp) * 2 - 1, 1));
  font-weight: 600;
}

.mk-portal-doc {
  place-items: center;
  width: 100%;
  height: 100%;
  display: grid;
  position: relative;
}

.mk-portal-doc .docs {
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.mk-portal-doc .doc {
  background: var(--bg-elevated);
  border: 1px solid color-mix(in srgb, var(--beat-accent) 26%, #ffffff1a);
  color: var(--text-secondary);
  white-space: nowrap;
  opacity: calc(clamp(0, .4 + var(--ep) - var(--sp) * 1.1, 1));
  transform: scale(calc(1 - .55 * var(--sp)));
  border-radius: 10px;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  font-size: 11px;
  font-weight: 600;
  display: flex;
  position: absolute;
  box-shadow: 0 10px 24px #00000073;
}

.mk-portal-doc .doc i {
  background: linear-gradient(160deg, var(--beat-accent-soft), var(--beat-accent));
  border-radius: 2px;
  width: 14px;
  height: 17px;
}

.mk-portal-doc .doc.dk0 {
  left: 8%;
  top: calc(14% + var(--sp) * 33%);
}

.mk-portal-doc .doc.dk1 {
  right: 6%;
  top: calc(28% + var(--sp) * 20%);
}

.mk-portal-doc .doc.dk2 {
  left: 12%;
  top: calc(80% - var(--sp) * 30%);
}

.phone-portal {
  z-index: 2;
  gap: 9px;
}

.pp-head {
  text-align: center;
  color: var(--text-primary);
  margin-top: 14px;
  font-size: 12px;
  font-weight: 600;
}

.pp-rows {
  flex-direction: column;
  gap: 7px;
  display: flex;
}

.pp-row {
  background: var(--metric-bg);
  border: 1px solid var(--metric-border);
  height: 13px;
  opacity: clamp(0, calc(var(--sp) * 5 - var(--ri)), 1);
  transform: translateX(calc((1 - clamp(0, var(--sp) * 5 - var(--ri), 1)) * 14px));
  border-radius: 5px;
}

.pp-pay {
  margin-top: auto;
}

.pp-nav {
  text-align: center;
  background: var(--metric-grad);
  color: #06122a;
  opacity: calc(clamp(0, var(--sp) * 2 - 1, 1));
  border-radius: 9px;
  padding: 8px;
  font-size: 11px;
  font-weight: 700;
  display: block;
}

.pp-push {
  text-align: center;
  color: #5ee6a8;
  opacity: calc(clamp(0, var(--sp) * 2.5 - 1.6, 1));
  font-size: 10px;
  font-weight: 600;
}

.mk-followup {
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
  display: flex;
}

.phone-app {
  align-items: stretch;
  gap: 11px;
}

.app-head {
  color: var(--text-primary);
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.app-logo {
  background: var(--metric-grad);
  width: 16px;
  height: 16px;
  box-shadow: 0 0 10px var(--beat-accent);
  border-radius: 5px;
}

.stars {
  justify-content: center;
  gap: 4px;
  font-size: 18px;
  display: flex;
}

.stars .star {
  color: color-mix(in srgb, #ffc55a calc(clamp(0, var(--sp) * 6 - var(--xi), 1) * 100%), #94a3b84d);
  transform: scale(calc(.7 + .3 * clamp(0, var(--sp) * 6 - var(--xi), 1)));
  text-shadow: 0 0 calc(clamp(0, var(--sp) * 6 - var(--xi), 1) * 12px) #ffc55ab3;
}

.route {
  opacity: calc(clamp(0, var(--sp) * 2 - .8, 1));
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.route span {
  text-align: center;
  border-radius: 8px;
  padding: 6px 9px;
  font-size: 10px;
  font-weight: 600;
}

.route .r-pos {
  color: #5ee6a8;
  background: #5ee6a829;
  border: 1px solid #5ee6a84d;
}

.route .r-neg {
  color: var(--text-secondary);
  border: 1px solid var(--pain-border);
  background: #94a3b81f;
}

.app-push {
  text-align: center;
  color: var(--beat-accent-soft);
  opacity: calc(clamp(0, var(--sp) * 2.5 - 1.5, 1));
  font-size: 10px;
  font-weight: 600;
}

.mk-followup .waitlist {
  text-align: center;
  width: min(86%, 330px);
  opacity: var(--ep);
}

.wl-cap {
  color: var(--text-secondary);
  margin-bottom: 9px;
  font-size: 12px;
  font-weight: 600;
}

.wl-slots {
  justify-content: center;
  gap: 6px;
  display: flex;
}

.wl-slots .slot {
  background: #94a3b82e;
  background: color-mix(in srgb, var(--beat-accent) calc(clamp(0, var(--sp) * 6 - var(--li), 1) * 100%), #94a3b82e);
  height: 11px;
  box-shadow: 0 0 calc(clamp(0, var(--sp) * 6 - var(--li), 1) * 10px) color-mix(in srgb, var(--beat-accent) 60%, transparent);
  border-radius: 4px;
  flex: 1;
}

.wl-num {
  color: var(--beat-accent-soft);
  opacity: calc(clamp(0, var(--sp) * 2 - 1, 1));
  margin-top: 10px;
  font-size: 13px;
  font-weight: 700;
}

@media (width <= 860px) {
  section.scene.station {
    min-height: auto;
  }

  .st-sticky {
    height: auto;
    min-height: auto;
    padding: clamp(40px, 9vh, 80px) clamp(20px, 6vw, 40px);
    position: relative;
    overflow: visible;
  }

  .st-grid {
    grid-template-columns: 1fr;
    gap: 28px;
    width: 100%;
  }

  section.scene.right .st-copy, section.scene.right .st-visual {
    order: initial;
  }

  .st-visual {
    aspect-ratio: 1 / .78;
    order: -1;
    min-height: clamp(280px, 56vw, 380px);
  }

  .st-num {
    font-size: clamp(56px, 18vw, 96px);
    top: -30px;
  }

  .st-beats {
    flex-direction: column;
    gap: 16px;
    min-height: 0;
    display: flex;
  }

  .st-beats > .beat {
    grid-area: auto;
  }

  .st-beats .beat--problem, .st-beats .beat--solution {
    filter: none;
    opacity: 1 !important;
    transform: none !important;
  }

  .st-beats .beat--solution .metric-badge {
    opacity: 1 !important;
    transform: none !important;
  }
}

@media (width <= 480px) {
  .st-title {
    font-size: clamp(22px, 7vw, 30px);
  }

  .phone {
    width: clamp(150px, 46vw, 184px);
  }

  .mk-leader .chart-wrap {
    padding: 18px;
  }
}

.st-sticky {
  align-items: center;
  padding-top: clamp(76px, 10vh, 104px);
}

.st-eyebrow {
  margin-bottom: 12px;
}

.st-num {
  top: -30px;
}

.st-title {
  margin: 0 0 clamp(14px, 1.7vw, 22px);
  font-size: clamp(23px, 2.9vw, 40px);
}

.st-beats {
  gap: 12px;
  margin-top: 0;
}

.st-beats .beat {
  padding: clamp(14px, 1.5vw, 20px);
}

.st-beats .beat-head {
  margin-bottom: 9px;
}

.st-beats .beat-title {
  margin-bottom: 9px;
  font-size: clamp(16px, 1.5vw, 21px);
}

.st-beats .beat-bullets {
  gap: 6px;
}

.st-beats .beat--problem .beat-bullet {
  font-size: clamp(12px, 1vw, 13.5px);
}

.st-beats .beat .metric-badge {
  margin-top: 12px;
}

.st-visual {
  align-self: center;
}

.phone {
  justify-content: center;
  width: clamp(186px, 22vw, 226px);
}

.phone-qr {
  justify-content: center;
  gap: 18px;
}

.phone-qr .qr {
  margin: 0 auto;
}

.mk-fogl2 .mk-cal {
  width: min(92%, 384px);
}

.mk-fogl2 .f2-ch {
  padding: 8px 9px;
  font-size: 10.5px;
}

.mk-his .his-card {
  width: min(96%, 416px);
}

.phone {
  aspect-ratio: 9 / 15.5;
  width: clamp(176px, 20vw, 210px);
  padding: 16px 13px;
}

.mk-precall, .mk-followup {
  gap: 14px;
}

.phone-call {
  gap: 10px;
  padding-top: 12px;
}

.call-rings {
  margin: 4px auto 2px;
}

.phone-portal .pp-rows {
  gap: 8px;
}

.phone-portal .pp-row {
  height: 15px;
}

.phone-portal {
  gap: 11px;
}

.phone-app {
  gap: 13px;
}

.map-pin .pin-label {
  display: none;
}

.st-beats .beat--solution .beat-title {
  filter: drop-shadow(0 0 calc(var(--sp) * 14px) color-mix(in srgb, var(--beat-accent) calc(var(--sp) * 45%), transparent));
}

#cc-scene {
  z-index: 70;
  background: var(--bg-base);
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s var(--ease-out), visibility .5s var(--ease-out);
  justify-content: center;
  align-items: flex-start;
  padding: clamp(20px, 4vh, 56px) clamp(16px, 4vw, 64px) clamp(40px, 6vh, 80px);
  display: flex;
  position: fixed;
  inset: 0;
  overflow: hidden auto;
}

#cc-scene.is-open {
  opacity: 1;
  visibility: visible;
}

#cc-scene .cc-veil {
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(70% 55% at 50% -8%, #3E7DD033, #0000 70%), radial-gradient(60% 50% at 90% 110%, #B53ED029, #0000 70%), linear-gradient(#0a0a15 0%, #051623 100%);
  position: fixed;
  inset: 0;
}

.cc-wrap {
  width: 100%;
  max-width: 1160px;
}

#cc-scene .cc-wrap {
  opacity: 0;
  transition: transform .6s var(--ease-out) 60ms, opacity .6s var(--ease-out) 60ms;
  transform: translateY(26px);
}

#cc-scene.is-open .cc-wrap {
  opacity: 1;
  transform: none;
}

.cc-head {
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: clamp(20px, 3vh, 34px);
  display: flex;
}

.cc-head-copy {
  max-width: 64ch;
}

.cc-title {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  margin: 16px 0 14px;
  font-size: clamp(28px, 4vw, 54px);
  line-height: 1.02;
}

.cc-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.cc-sub {
  color: var(--text-secondary);
  max-width: 58ch;
  font-size: clamp(14px, 1.3vw, 18px);
  line-height: 1.55;
}

.cc-back {
  font: inherit;
  cursor: pointer;
  white-space: nowrap;
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  border: 1px solid var(--station-border);
  letter-spacing: .01em;
  transition: color .3s, border-color .3s, background .3s, transform .3s var(--ease-out);
  background: #ffffff0a;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
}

.cc-back:hover {
  color: var(--text-primary);
  background: #0092D51a;
  border-color: #0092D580;
  transform: translateX(-2px);
}

.cc-toggle {
  border-radius: var(--radius-pill);
  border: 1px solid var(--station-border);
  background: #ffffff0d;
  gap: 4px;
  margin: 0 auto clamp(18px, 3vh, 28px);
  padding: 5px;
  display: inline-flex;
  position: relative;
}

.cc-opt {
  z-index: 1;
  font: inherit;
  cursor: pointer;
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  transition: color .35s var(--ease-out);
  background: none;
  border: 0;
  padding: 9px 20px;
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 600;
  position: relative;
}

.cc-opt em {
  opacity: .62;
  font-style: normal;
  font-weight: 400;
}

.cc-opt.is-on {
  color: #fff;
}

.cc-thumb {
  z-index: 0;
  border-radius: var(--radius-pill);
  background: var(--grad-signature);
  width: calc(50% - 5px);
  transition: transform .42s var(--ease-out);
  position: absolute;
  top: 5px;
  bottom: 5px;
  left: 5px;
  transform: translateX(100%);
  box-shadow: 0 6px 20px #3E7DD073;
}

.cc-toggle[data-sys="old"] .cc-thumb {
  background: linear-gradient(135deg, #5b6472, #3a414e);
  transform: translateX(0);
  box-shadow: 0 6px 18px #0006;
}

.cc-screen {
  border: 1px solid var(--station-border);
  box-shadow: var(--shadow-panel), 0 0 80px #0092D51f;
  background: linear-gradient(#141426eb, #0c0c16f5);
  border-radius: 22px;
  min-height: 540px;
  position: relative;
  overflow: hidden;
}

.cc-screen[data-sys="old"] {
  box-shadow: var(--shadow-panel);
}

.cc-steps {
  flex-wrap: wrap;
  gap: clamp(8px, 1vw, 14px);
  margin-bottom: clamp(16px, 2vh, 24px);
  display: flex;
}

.cc-step {
  font: inherit;
  cursor: pointer;
  border-radius: var(--radius-pill);
  border: 1px solid var(--station-border);
  color: var(--text-secondary);
  background: #ffffff08;
  align-items: center;
  gap: 9px;
  padding: 8px 16px 8px 8px;
  font-size: clamp(12px, 1vw, 14px);
  font-weight: 600;
  transition: color .3s, border-color .3s, background .3s;
  display: inline-flex;
  position: relative;
}

.cc-step-n {
  width: 24px;
  height: 24px;
  font-family: var(--font-display);
  color: var(--text-muted);
  background: #ffffff0f;
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  transition: background .3s, color .3s;
  display: grid;
}

.cc-step.is-on {
  color: var(--text-primary);
  background: #0092D51f;
  border-color: #0092D585;
}

.cc-step.is-on .cc-step-n {
  color: #fff;
  background: var(--grad-signature);
  box-shadow: 0 3px 12px #3E7DD066;
}

.cc-step.is-done .cc-step-n {
  color: #8be0b0;
  background: #1f9d5729;
}

.cc-step:hover {
  color: var(--text-primary);
  border-color: #0092D566;
}

.cc-stage {
  min-height: 340px;
  position: relative;
}

.cc-panel {
  display: none;
}

.cc-panel.is-on {
  flex-direction: column;
  gap: clamp(12px, 1.4vw, 18px);
  display: flex;
}

.cc-step-note {
  text-align: center;
  max-width: 62ch;
  color: var(--text-secondary);
  opacity: 0;
  margin: 4px auto 0;
  font-size: clamp(13px, 1.15vw, 16px);
  line-height: 1.5;
  transform: translateY(12px);
}

.cc-step-note.in {
  opacity: 1;
  transition: opacity .45s var(--ease-out), transform .5s var(--ease-out);
  transform: none;
}

.cc-link {
  grid-template-columns: auto auto 1fr;
  align-items: center;
  gap: clamp(10px, 1.4vw, 20px);
  display: grid;
}

.cc-link-num {
  white-space: nowrap;
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.cc-link-num-l {
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
}

.cc-link-num b {
  font-family: var(--font-display);
  font-variant-numeric: tabular-nums;
  font-size: clamp(17px, 1.6vw, 22px);
  font-weight: 700;
}

.cc-link-line {
  color: var(--text-accent);
  align-items: center;
  gap: 5px;
  display: inline-flex;
  position: relative;
}

.cc-link-line i {
  background: #0092D5a6;
  border-radius: 2px;
  width: 9px;
  height: 2px;
  animation: 1.4s ease-in-out infinite ccLinkFlow;
}

.cc-link-line i:nth-child(2) {
  animation-delay: .18s;
}

.cc-link-line i:nth-child(3) {
  animation-delay: .36s;
}

.cc-link-line svg {
  width: 18px;
  height: 18px;
}

@keyframes ccLinkFlow {
  0%, 100% {
    opacity: .35;
  }

  50% {
    opacity: 1;
  }
}

body.reduced .cc-link-line i {
  animation: none;
}

.cc-duo {
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: clamp(12px, 1.4vw, 18px);
  display: grid;
}

.cc-act {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.cc-slots {
  flex-wrap: wrap;
  gap: clamp(10px, 1.2vw, 16px);
  margin: 4px 0 18px;
  display: flex;
}

.cc-slot {
  color: var(--text-primary);
  border: 1px solid var(--station-border);
  background: #ffffff0b;
  border-radius: 13px;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 11px 18px;
  font-size: clamp(13px, 1.15vw, 16px);
  font-weight: 600;
  display: inline-flex;
}

.cc-slot em {
  color: #ffd08a;
  font-size: 11px;
  font-style: normal;
  font-weight: 600;
}

.cc-slot.is-hot {
  background: #ffb05a17;
  border-color: #ffb05a70;
  box-shadow: 0 0 24px #ffb05a1f;
}

.cc-actbtn {
  border-radius: var(--radius-pill);
  color: #fff;
  background: var(--grad-signature);
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  font-size: clamp(13px, 1.15vw, 16px);
  font-weight: 700;
  display: inline-flex;
  box-shadow: 0 8px 26px #3E7DD06b;
}

.cc-callbar {
  background: linear-gradient(90deg, #0092D51a, #B53ED014);
  border-bottom: 1px solid #ffffff12;
  align-items: center;
  gap: 16px;
  padding: 18px clamp(16px, 2vw, 26px);
  display: flex;
}

.cc-screen[data-sys="old"] .cc-callbar {
  background: #ffffff05;
}

.cc-ring {
  color: #fff;
  background: var(--grad-signature);
  border-radius: 50%;
  flex: none;
  place-items: center;
  width: 46px;
  height: 46px;
  display: grid;
  position: relative;
  box-shadow: 0 0 0 1px #0092D566;
}

.cc-screen[data-sys="old"] .cc-ring {
  box-shadow: none;
  background: #3a414e;
}

.cc-ring svg {
  width: 22px;
  height: 22px;
}

.cc-ring i {
  animation: cc-ring-pulse 1.8s var(--ease-out) infinite;
  border: 1.5px solid #0092D580;
  border-radius: 50%;
  position: absolute;
  inset: 0;
}

.cc-ring i:nth-child(2) {
  animation-delay: .6s;
}

.cc-ring i:nth-child(3) {
  animation-delay: 1.2s;
}

.cc-screen[data-sys="old"] .cc-ring i {
  border-color: #ffffff2e;
}

@keyframes cc-ring-pulse {
  0% {
    opacity: .7;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(2.1);
  }
}

.cc-callmeta {
  flex-direction: column;
  gap: 3px;
  display: flex;
}

.cc-calllabel {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-accent);
  font-size: 11px;
  font-weight: 600;
}

.cc-callnum {
  font-family: var(--font-display);
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 700;
}

.cc-callid {
  margin-left: 8px;
  font-size: clamp(13px, 1.2vw, 16px);
}

.cc-callid-old {
  color: var(--text-muted);
}

.cc-callid-new {
  color: var(--text-primary);
}

.cc-callid-new b {
  color: var(--text-accent);
  font-weight: 600;
}

.cc-screen[data-sys="old"] .cc-callid-new, .cc-screen[data-sys="new"] .cc-callid-old {
  display: none;
}

.cc-callbtns {
  gap: 10px;
  margin-left: auto;
  display: inline-flex;
}

.cc-cbtn {
  color: #fff;
  border-radius: 50%;
  place-items: center;
  width: 38px;
  height: 38px;
  display: grid;
}

.cc-cbtn svg {
  width: 18px;
  height: 18px;
}

.cc-cbtn.rej {
  background: #c0392b;
  transform: rotate(135deg);
}

.cc-cbtn.acc {
  background: #1f9d57;
}

.cc-old, .cc-new {
  padding: clamp(18px, 2.4vw, 30px);
}

.cc-screen[data-sys="old"] .cc-new, .cc-screen[data-sys="new"] .cc-old {
  display: none;
}

.cc-empty {
  text-align: center;
  min-height: 380px;
  color: var(--text-muted);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  display: flex;
}

.cc-empty-ico {
  color: #ffffff38;
  width: 44px;
  height: 44px;
}

.cc-empty-h {
  font-family: var(--font-display);
  color: var(--text-secondary);
  margin-top: 4px;
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 600;
}

.cc-empty-p {
  max-width: 46ch;
  color: var(--text-muted);
  font-size: clamp(13px, 1.1vw, 15px);
  line-height: 1.55;
}

.cc-empty-rows {
  flex-direction: column;
  gap: 10px;
  width: min(420px, 80%);
  margin-top: 10px;
  display: flex;
}

.cc-empty-rows span {
  background: repeating-linear-gradient(90deg, #ffffff0d 0 10px, #0000 10px 20px);
  border-radius: 6px;
  height: 14px;
}

.cc-empty-rows span:nth-child(2) {
  width: 78%;
}

.cc-empty-rows span:nth-child(3) {
  width: 56%;
}

.cc-empty-tag {
  letter-spacing: .07em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
  color: #e8736beb;
  background: #e8736b1f;
  border: 1px solid #e8736b47;
  margin-top: 14px;
  padding: 5px 13px;
  font-size: 11px;
  font-weight: 700;
}

.cc-card {
  border: 1px solid var(--station-border);
  opacity: 0;
  background: linear-gradient(#ffffff0b, #ffffff05);
  border-radius: 16px;
  padding: clamp(15px, 1.5vw, 22px);
  position: relative;
  transform: translateY(18px) scale(.985);
}

.cc-card.in {
  opacity: 1;
  transition: opacity .5s var(--ease-out), transform .55s var(--ease-out);
  transform: none;
}

.cc-card .cc-clabel {
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--text-accent);
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
}

.cc-card .cc-clabel svg {
  width: 15px;
  height: 15px;
}

.cc-c-side {
  align-content: start;
  gap: clamp(12px, 1.2vw, 18px);
  display: grid;
}

.cc-id-row {
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  display: flex;
}

.cc-avatar {
  width: 60px;
  height: 60px;
  font-family: var(--font-display);
  color: #fff;
  background: var(--grad-signature);
  border-radius: 16px;
  flex: none;
  place-items: center;
  font-size: 22px;
  font-weight: 700;
  display: grid;
  box-shadow: 0 8px 24px #3E7DD066;
}

.cc-id-main {
  flex-direction: column;
  gap: 3px;
  display: flex;
}

.cc-id-name {
  font-family: var(--font-display);
  letter-spacing: -.01em;
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 700;
}

.cc-id-meta {
  color: var(--text-secondary);
  font-size: clamp(13px, 1.1vw, 15px);
}

.cc-id-meta b {
  color: var(--text-primary);
  font-weight: 600;
}

.cc-id-badges {
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
  display: flex;
}

.cc-pill {
  border-radius: var(--radius-pill);
  color: var(--text-primary);
  white-space: nowrap;
  background: #0092D524;
  border: 1px solid #0092D54d;
  padding: 6px 13px;
  font-size: 12px;
  font-weight: 600;
}

.cc-pill.gold {
  color: #ffe0a8;
  background: #ffb05a21;
  border-color: #ffb05a57;
}

.cc-c-reason {
  background: linear-gradient(135deg, #0092D521, #B53ED021);
  border-color: #0092D56b;
  box-shadow: 0 0 44px #0092D529;
}

.cc-ai-badge {
  color: #fff;
  background: var(--grad-signature);
  border-radius: var(--radius-pill);
  letter-spacing: .06em;
  padding: 3px 9px;
  font-size: 10px;
}

.cc-reason-txt {
  color: var(--text-primary);
  font-size: clamp(15px, 1.4vw, 19px);
  line-height: 1.5;
}

.cc-reason-txt b {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-weight: 700;
}

.cc-tl {
  margin: 0;
  padding-left: 22px;
  list-style: none;
  position: relative;
}

.cc-tl:before {
  content: "";
  opacity: .45;
  background: linear-gradient(#06f, #B53ED0);
  border-radius: 2px;
  width: 2px;
  position: absolute;
  top: 6px;
  bottom: 8px;
  left: 5px;
}

.cc-tl li {
  padding: 0 0 16px;
  position: relative;
}

.cc-tl li:last-child {
  padding-bottom: 0;
}

.cc-tl li:before {
  content: "";
  background: var(--bg-elevated);
  border: 2px solid var(--figure-color);
  border-radius: 50%;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 4px;
  left: -22px;
  box-shadow: 0 0 10px #0092D580;
}

.cc-tl-top {
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  display: flex;
}

.cc-tl-date {
  color: var(--text-accent);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 600;
}

.cc-tl-title {
  font-size: clamp(13px, 1.1vw, 15px);
  font-weight: 600;
}

.cc-tl-sub {
  color: var(--text-secondary);
  margin-top: 2px;
  font-size: 12px;
}

.cc-status {
  letter-spacing: .05em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
  color: #8be0b0;
  background: #1f9d5726;
  border: 1px solid #1f9d574d;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
}

.cc-rows {
  flex-direction: column;
  gap: 11px;
  display: flex;
}

.cc-rrow {
  align-items: center;
  gap: 11px;
  font-size: clamp(13px, 1.05vw, 15px);
  display: flex;
}

.cc-rrow svg {
  width: 17px;
  height: 17px;
  color: var(--text-accent);
  flex: none;
}

.cc-rrow .cc-rmain {
  color: var(--text-primary);
}

.cc-rrow .cc-rsub {
  color: var(--text-secondary);
  font-size: 12px;
}

.cc-rrow .cc-rtag {
  letter-spacing: .04em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
  white-space: nowrap;
  margin-left: auto;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
}

.cc-rtag.ok {
  color: #8be0b0;
  background: #1f9d5726;
  border: 1px solid #1f9d574d;
}

.cc-rtag.warn {
  color: #ffd08a;
  background: #ffb05a21;
  border: 1px solid #ffb05a52;
}

.cc-rtag.due {
  color: #8FD3F2;
  background: #0092D524;
  border: 1px solid #0092D54d;
}

.cc-stats {
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(12px, 1.2vw, 20px);
  display: grid;
}

.cc-stat {
  text-align: left;
}

.cc-stat-v {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  background: var(--grad-signature);
  color: #0000;
  font-variant-numeric: tabular-nums;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(22px, 2.6vw, 36px);
  font-weight: 700;
}

.cc-stat-l {
  color: var(--text-secondary);
  margin-top: 5px;
  font-size: clamp(11px, 1vw, 13px);
}

.cc-foot {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: clamp(16px, 2vw, 24px);
  display: flex;
}

.cc-replay {
  font: inherit;
  cursor: pointer;
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  border: 1px solid var(--station-border);
  background: #ffffff0a;
  align-items: center;
  gap: 8px;
  padding: 9px 17px;
  font-size: 13px;
  font-weight: 600;
  transition: color .3s, border-color .3s, background .3s;
  display: inline-flex;
}

.cc-replay:hover {
  color: var(--text-primary);
  background: #0092D51a;
  border-color: #0092D580;
}

.cc-foot .minta-badge {
  margin: 0;
}

.role-card[data-role="callcenter"].ready .role-ico {
  background: var(--grad-signature);
  color: #fff;
  border-color: #0000;
  box-shadow: 0 0 18px #0092D573;
}

@media (width <= 860px) {
  .cc-head {
    flex-direction: column;
  }

  .cc-back {
    order: -1;
    align-self: flex-start;
  }

  .cc-duo {
    grid-template-columns: 1fr;
  }

  .cc-id-badges {
    width: 100%;
    margin-left: 0;
  }

  .cc-stats {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .cc-callbtns {
    display: none;
  }

  .cc-screen, .cc-stage {
    min-height: 0;
  }
}

@media (width <= 600px) {
  .cc-callbar {
    flex-wrap: wrap;
    gap: 10px 12px;
  }

  .cc-callid {
    order: 5;
    width: 100%;
    margin-left: 0;
  }

  .cc-stats {
    grid-template-columns: 1fr 1fr;
  }

  .cc-link {
    grid-template-columns: 1fr;
  }

  .cc-link-line {
    justify-self: center;
    margin: -2px 0;
    transform: rotate(90deg);
  }

  .cc-step {
    padding: 7px 13px 7px 7px;
    font-size: 12px;
  }
}

body.reduced #cc-scene, body.reduced #cc-scene .cc-wrap {
  transition: none;
}

body.reduced .cc-card {
  opacity: 1;
  transition: none;
  transform: none;
}

body.reduced .cc-ring i {
  animation: none;
}

.highlight-sec {
  z-index: 12;
  background: radial-gradient(75% 60%, #3E7DD024, #0000 72%), linear-gradient(#051623 0%, #0b0b16 50%, #051623 100%);
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: clamp(64px, 10vh, 120px) clamp(20px, 4vw, 64px);
  display: flex;
  position: relative;
}

.hl-inner {
  flex-direction: column;
  align-items: center;
  gap: clamp(18px, 3vh, 32px);
  width: 100%;
  max-width: 1240px;
  display: flex;
}

.hl-eyebrow {
  justify-content: center;
}

.hl-frame {
  aspect-ratio: 16 / 9;
  border: 1px solid var(--station-border);
  width: 100%;
  box-shadow: var(--shadow-panel), 0 0 90px #0092D529;
  background: #05050b;
  border-radius: clamp(16px, 2vw, 26px);
  position: relative;
  overflow: hidden;
}

.hl-video {
  object-fit: cover;
  background: #05050b;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
}

.hl-glow {
  pointer-events: none;
  border-radius: inherit;
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 0 1px #ffffff0d, inset 0 0 120px #08081080;
}

.hl-scaffold {
  color: var(--text-secondary);
  background: radial-gradient(60% 60% at 50% 45%, #3E7DD02e, #0000 70%), repeating-linear-gradient(135deg, #ffffff05 0 14px, #0000 14px 28px), linear-gradient(#12122180, #0a0a14);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  display: none;
  position: absolute;
  inset: 0;
}

.highlight-sec.hl-pending .hl-scaffold {
  display: flex;
}

.hl-play {
  background: var(--grad-signature);
  border-radius: 50%;
  place-items: center;
  width: 76px;
  height: 76px;
  display: grid;
  position: relative;
  box-shadow: 0 0 40px #0092D573;
}

.hl-play:after {
  content: "";
  border-top: 15px solid #0000;
  border-bottom: 15px solid #0000;
  border-left: 24px solid #fff;
  width: 0;
  height: 0;
  margin-left: 6px;
}

.hl-scaffold-label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-accent);
  font-size: clamp(12px, 1.1vw, 14px);
  font-weight: 600;
}

@media (width <= 860px) {
  .highlight-sec {
    min-height: auto;
    padding: clamp(48px, 8vh, 80px) clamp(16px, 4vw, 40px);
  }

  .hl-play {
    width: 60px;
    height: 60px;
  }

  .hl-play:after {
    border-top-width: 12px;
    border-bottom-width: 12px;
    border-left-width: 19px;
  }
}

body.reduced .highlight-sec {
  z-index: 12;
}

body.hl-active #figure-layer, body.hl-active #route-rail, body.hl-active #hud, body.hl-active #key-hint, body.pn-active #stage, body.pn-active #figure-layer, body.pn-active #hud, body.pn-active #key-hint {
  pointer-events: none;
  transition: opacity .45s var(--ease-out);
  opacity: 0 !important;
}

#stage {
  transition: opacity .45s var(--ease-out);
}

#orvos-doku, #orvos-labor {
  z-index: 5;
  position: relative;
}

#orvos-doku:before, #orvos-labor:before {
  content: "";
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(72% 50% at 50% 24%, #3E7DD026, #0000 72%);
  position: absolute;
  inset: 0;
}

.od-inner {
  flex-direction: column;
  align-items: center;
  gap: clamp(40px, 6vh, 78px);
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
}

.od-back {
  font: inherit;
  cursor: pointer;
  white-space: nowrap;
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  border: 1px solid var(--station-border);
  letter-spacing: .01em;
  transition: color .3s, border-color .3s, background .3s, transform .3s var(--ease-out);
  background: #ffffff0a;
  flex: none;
  align-self: flex-start;
  align-items: center;
  gap: 8px;
  margin-bottom: clamp(-20px, -1vh, -8px);
  padding: 11px 18px;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
}

.od-back:hover {
  color: var(--text-primary);
  background: #0092D51a;
  border-color: #0092D580;
  transform: translateX(-2px);
}

.od-head {
  text-align: center;
  max-width: 820px;
}

#orvos-doku .eyebrow, #orvos-labor .eyebrow {
  justify-content: center;
}

.od-title {
  margin: 14px 0 16px;
}

.od-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.od-pain {
  color: #e9bab5d1;
  max-width: 54ch;
  margin: 0 auto;
  font-size: clamp(15px, 1.4vw, 19px);
  line-height: 1.5;
}

.od-pain b {
  color: var(--text-primary);
  font-weight: 700;
}

.od-flow {
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 1.8vw, 26px);
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  position: relative;
}

.od-flow:before {
  content: "";
  z-index: 0;
  background: linear-gradient(90deg, #0000, #0092D566, #0000);
  height: 1px;
  position: absolute;
  top: 50%;
  left: 14%;
  right: 14%;
}

.od-flow-step {
  z-index: 1;
  border-radius: var(--radius-pill);
  background: #0c0c18f0;
  border: 1px solid #0092D547;
  align-items: center;
  gap: 10px;
  padding: 9px 17px 9px 9px;
  display: inline-flex;
  position: relative;
}

.od-flow-n {
  width: 26px;
  height: 26px;
  font-family: var(--font-display);
  color: #fff;
  background: var(--grad-signature);
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  display: grid;
  box-shadow: 0 3px 12px #3E7DD066;
}

.od-flow-l {
  color: var(--text-secondary);
  white-space: nowrap;
  font-size: clamp(12px, 1vw, 14px);
  font-weight: 600;
}

.od-showcase {
  flex-direction: column;
  gap: clamp(52px, 8vh, 104px);
  width: 100%;
  display: flex;
}

.od-feat {
  text-align: left;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  align-items: center;
  gap: clamp(30px, 4vw, 66px);
  display: grid;
}

.od-feat--rev .od-shot {
  order: 2;
}

.od-shot {
  border: 1px solid var(--station-border);
  background: var(--bg-surface);
  transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
  border-radius: 16px;
  margin: 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 0 1px #0092D51a, 0 0 60px #0092D526, 0 30px 60px #0000008c;
}

.od-shot:hover {
  transform: translateY(-5px);
  box-shadow: 0 0 0 1px #0092D52e, 0 0 80px #0092D542, 0 40px 74px #0009;
}

.od-winbar {
  border-bottom: 1px solid var(--station-border);
  background: linear-gradient(#1e1e36f5, #121224f5);
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  display: flex;
}

.od-dots {
  gap: 6px;
  display: inline-flex;
}

.od-dots i {
  background: #ffffff29;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.od-win-title {
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 600;
}

.od-win-clock {
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  margin-left: auto;
  font-size: 12px;
}

.od-shot-img {
  background: #0A1D2A;
  display: block;
}

.od-shot-img img {
  width: 100%;
  height: auto;
  display: block;
}

.od-feat-txt {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.od-feat-head {
  align-items: center;
  gap: 15px;
  margin-bottom: 16px;
  display: flex;
}

.od-step {
  font-family: var(--font-display);
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(30px, 3.2vw, 46px);
  font-weight: 800;
  line-height: 1;
}

.od-b-ico {
  color: #8FD3F2;
  background: #0092D51f;
  border: 1px solid #0092D547;
  border-radius: 14px;
  flex: none;
  place-items: center;
  width: 50px;
  height: 50px;
  display: grid;
}

.od-b-ico svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 26px;
  height: 26px;
}

.od-b-title {
  font-family: var(--font-display);
  margin: 0 0 10px;
  font-size: clamp(19px, 1.7vw, 26px);
  font-weight: 700;
}

.od-narr {
  color: #e9bab5db;
  max-width: 40ch;
  margin: 0 0 18px;
  font-size: clamp(14px, 1.15vw, 17px);
  line-height: 1.5;
}

.od-b-list {
  flex-direction: column;
  gap: 11px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.od-b-list li {
  color: var(--text-secondary);
  padding-left: 24px;
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.45;
  position: relative;
}

.od-b-list li:before {
  content: "";
  border-bottom: 2px solid #0092D5;
  border-left: 2px solid #0092D5;
  border-radius: 1px;
  width: 11px;
  height: 6px;
  position: absolute;
  top: 7px;
  left: 0;
  transform: rotate(-45deg);
}

.od-close {
  text-align: center;
  max-width: 24ch;
  font-family: var(--font-display);
  margin: clamp(6px, 1.5vh, 20px) auto 0;
  font-size: clamp(21px, 2.3vw, 32px);
  font-weight: 700;
  line-height: 1.28;
}

.od-close .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.od-lab {
  flex-direction: column;
  gap: clamp(26px, 3.4vh, 44px);
  width: 100%;
  display: flex;
}

.od-lab-head {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  max-width: 720px;
  margin: 0 auto;
  display: flex;
}

.od-lab-head .od-b-ico, .od-lab-head .od-b-title {
  margin: 0;
}

.od-lab-head .od-narr {
  max-width: 52ch;
  margin: 0;
}

.od-lab-steps {
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2vw, 26px);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.od-lab-step {
  margin: 0;
}

.od-shot--sm {
  border-radius: 13px;
}

.od-shot--sm .od-winbar {
  padding: 9px 13px;
}

.od-shot--sm .od-win-title {
  color: #8FD3F2;
  font-size: 12px;
}

.od-lab-benefits {
  flex-flow: wrap;
  justify-content: center;
  gap: 12px clamp(20px, 3vw, 40px);
  max-width: 940px;
  margin: 2px auto 0;
}

.od-lab-benefits li {
  padding-left: 24px;
}

.od-back--end {
  align-self: center;
  margin: clamp(6px, 1.5vh, 18px) 0 0;
}

.vege-sec {
  z-index: 5;
  position: relative;
}

.vege-sec:before {
  content: "";
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(70% 48% at 50% 22%, #3E7DD024, #0000 72%);
  position: absolute;
  inset: 0;
}

.vg-inner {
  flex-direction: column;
  align-items: center;
  gap: clamp(30px, 5vh, 60px);
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
}

.vg-head {
  text-align: center;
  max-width: 860px;
}

.vege-sec .eyebrow {
  justify-content: center;
}

.vg-title {
  margin: 12px 0 0;
}

.vg-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.vg-lead {
  color: #e9bab5d6;
  text-align: center;
  max-width: 60ch;
  margin: 14px auto 0;
  font-size: clamp(15px, 1.4vw, 19px);
  line-height: 1.55;
}

.ea-grid {
  text-align: left;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(14px, 1.5vw, 22px);
  width: 100%;
  display: grid;
}

.ea-card {
  border: 1px solid var(--station-border);
  transition: transform .42s var(--ease-out), border-color .42s var(--ease-out), box-shadow .42s var(--ease-out);
  background: linear-gradient(#12303E9e, #0c0c18ad);
  border-radius: 18px;
  flex-direction: column;
  gap: 11px;
  padding: clamp(20px, 2vw, 28px);
  display: flex;
}

@media (hover: hover) {
  .ea-card:hover {
    border-color: #0092D573;
    transform: translateY(-4px);
    box-shadow: 0 16px 40px #0000006b, 0 0 44px #0092D524;
  }
}

.ea-card--feat {
  background: linear-gradient(#28245680, #100e22b8);
  border-color: #0092D56b;
  grid-column: span 1;
}

.ea-ico {
  color: #8FD3F2;
  background: #0092D51f;
  border: 1px solid #0092D547;
  border-radius: 13px;
  place-items: center;
  width: 48px;
  height: 48px;
  display: grid;
}

.ea-card--feat .ea-ico {
  background: var(--grad-signature);
  color: #fff;
  border-color: #0000;
  box-shadow: 0 8px 22px #3E7DD066;
}

.ea-ico svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 25px;
  height: 25px;
}

.ea-t {
  font-family: var(--font-display);
  font-size: clamp(16px, 1.3vw, 20px);
  font-weight: 700;
  line-height: 1.15;
}

.ea-d {
  color: var(--text-secondary);
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.5;
}

.ea-stats {
  flex-wrap: wrap;
  gap: 8px;
  margin-top: auto;
  padding-top: 4px;
  display: flex;
}

.ea-stat {
  color: var(--text-secondary);
  border-radius: var(--radius-pill);
  background: #0092D51a;
  border: 1px solid #0092D53d;
  padding: 6px 11px;
  font-size: 12px;
}

.ea-stat b {
  font-family: var(--font-display);
  color: var(--text-primary);
  background: var(--grad-signature);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  font-weight: 800;
}

@media (width <= 880px) {
  .ea-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (width <= 560px) {
  .ea-grid {
    grid-template-columns: 1fr;
    max-width: 460px;
    margin: 0 auto;
  }
}

.tl {
  flex-direction: column;
  gap: clamp(12px, 1.8vh, 22px);
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: flex;
  position: relative;
}

.tl:before {
  content: "";
  z-index: 0;
  background: linear-gradient(#0092D58c, #B53ED066);
  width: 2px;
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 20px;
}

.tl-item {
  z-index: 1;
  text-align: left;
  grid-template-columns: 40px 1fr;
  align-items: start;
  gap: 16px;
  display: grid;
  position: relative;
}

.tl-node {
  background: var(--grad-signature);
  border-radius: 50%;
  grid-column: 1;
  width: 15px;
  height: 15px;
  margin: 4px auto 0;
  box-shadow: 0 0 0 4px #0092D524;
}

.tl-item--par .tl-node {
  background: #0c0c18e6;
  border: 2px solid #0092D599;
  box-shadow: 0 0 0 4px #0092D514;
}

.tl-item--milestone .tl-node {
  background: linear-gradient(135deg, #f0897e, #e8736b);
  border-radius: 12px;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0 auto;
  display: grid;
  box-shadow: 0 0 0 5px #f06e6429, 0 8px 24px #e8736b6b;
}

.tl-item--milestone .tl-node svg {
  fill: none;
  stroke: #fff;
  stroke-width: 1.8px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 20px;
  height: 20px;
}

.tl-c {
  flex-direction: column;
  grid-column: 2;
  gap: 3px;
  padding-bottom: 4px;
  display: flex;
}

.tl-dur {
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: #8FD3F2;
  font-size: 11px;
  font-weight: 700;
}

.tl-dur em {
  text-transform: none;
  letter-spacing: 0;
  color: var(--text-muted);
  margin-left: 6px;
  font-style: normal;
  font-weight: 500;
}

.tl-dur--red {
  color: #f0897e;
}

.tl-l {
  color: var(--text-primary);
  font-size: clamp(15px, 1.3vw, 18px);
  font-weight: 600;
  line-height: 1.3;
}

.tl-item--milestone .tl-l {
  font-family: var(--font-display);
  background: linear-gradient(100deg, #f0897e, #e8736b);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(18px, 1.6vw, 23px);
  font-weight: 800;
}

.dr-grid {
  text-align: left;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(14px, 1.5vw, 22px);
  width: 100%;
  display: grid;
}

.ea-card--red {
  background: linear-gradient(#3a1e1e6b, #140c0c99);
  border-color: #e8736b66;
}

.ea-card--red .ea-ico {
  color: #fff;
  background: linear-gradient(135deg, #f0897e, #e8736b);
  border-color: #0000;
  box-shadow: 0 8px 22px #e8736b6b;
}

@media (width <= 900px) {
  .dr-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (width <= 520px) {
  .dr-grid {
    grid-template-columns: 1fr;
    max-width: 460px;
    margin: 0 auto;
  }
}

.ft-grid {
  text-align: left;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: clamp(18px, 2.2vw, 30px);
  width: 100%;
  max-width: 1060px;
  margin: 0 auto;
  display: grid;
}

.ft-panel {
  border: 1px solid var(--station-border);
  background: linear-gradient(#12303E99, #0c0c18a8);
  border-radius: 20px;
  padding: clamp(22px, 2.2vw, 32px);
}

.ft-panel--incl {
  background: linear-gradient(#1e1c4080, #0e0d1eb3);
  border-color: #0092D557;
}

.ft-h {
  font-family: var(--font-display);
  color: var(--text-secondary);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-bottom: 18px;
  font-size: clamp(15px, 1.2vw, 18px);
  font-weight: 700;
}

.ft-facts {
  flex-direction: column;
  gap: 13px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.ft-facts li {
  border-bottom: 1px solid #ffffff0f;
  align-items: baseline;
  gap: 12px;
  padding-bottom: 12px;
  display: flex;
}

.ft-facts li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.ft-facts b {
  min-width: 96px;
  font-family: var(--font-display);
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  flex: none;
  font-size: clamp(17px, 1.5vw, 22px);
  font-weight: 800;
}

.ft-facts span {
  color: var(--text-secondary);
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.35;
}

.ft-facts em {
  color: var(--text-muted);
  font-style: normal;
}

.ft-incl {
  flex-direction: column;
  gap: 13px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.ft-incl li {
  color: var(--text-primary);
  border-bottom: 1px solid #ffffff0f;
  padding-bottom: 12px;
  padding-left: 30px;
  font-size: clamp(13px, 1.05vw, 16px);
  line-height: 1.4;
  position: relative;
}

.ft-incl li:last-child, .ft-facts li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.ft-incl li:before {
  content: "";
  background: #0092D524;
  border: 1px solid #0092D566;
  border-radius: 50%;
  width: 19px;
  height: 19px;
  position: absolute;
  top: 1px;
  left: 0;
}

.ft-incl li:after {
  content: "";
  border-bottom: 2px solid #8FD3F2;
  border-left: 2px solid #8FD3F2;
  width: 7px;
  height: 4px;
  position: absolute;
  top: 6px;
  left: 6px;
  transform: rotate(-45deg);
}

@media (width <= 780px) {
  .ft-grid {
    grid-template-columns: 1fr;
    max-width: 560px;
    margin: 0 auto;
  }
}

.pr-total {
  background: linear-gradient(120deg, #2824568c, #100e22b8);
  border: 1px solid #0092D566;
  border-radius: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(20px, 2.4vw, 30px) clamp(24px, 3vw, 38px);
  display: flex;
}

.pr-total-v {
  font-family: var(--font-display);
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(34px, 4.4vw, 60px);
  font-weight: 800;
  line-height: 1;
  display: block;
}

.pr-total-v em {
  -webkit-text-fill-color: initial;
  color: var(--text-muted);
  margin-left: 8px;
  font-size: .34em;
  font-style: normal;
  font-weight: 600;
}

.pr-total-l {
  color: var(--text-secondary);
  margin-top: 6px;
  font-size: clamp(13px, 1.1vw, 16px);
  display: block;
}

.pr-total-side {
  align-items: center;
  gap: 16px;
  display: flex;
}

.pr-total-list {
  color: var(--text-muted);
  font-size: clamp(13px, 1.1vw, 16px);
}

.pr-total-list s {
  color: var(--text-secondary);
}

.pr-badge {
  font-family: var(--font-display);
  color: #fff;
  border-radius: var(--radius-pill);
  background: linear-gradient(135deg, #2ed592, #14b87a);
  padding: 8px 15px;
  font-size: clamp(16px, 1.5vw, 22px);
  font-weight: 800;
  box-shadow: 0 8px 22px #2ed59252;
}

.pr-chart {
  flex-direction: column;
  gap: clamp(8px, 1.2vh, 14px);
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  display: flex;
}

.pr-item {
  border: 1px solid #0000;
  border-radius: 14px;
  transition: border-color .3s, background .3s;
}

.pr-item.open {
  background: #0092D50f;
  border-color: #0092D557;
}

.pr-row {
  width: 100%;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 14px;
  grid-template-columns: 168px 1fr 128px 22px;
  align-items: center;
  gap: 16px;
  padding: 8px 12px;
  display: grid;
}

@media (hover: hover) {
  .pr-item:not(.open) .pr-row:hover {
    background: #ffffff0a;
  }

  .pr-row:hover .pr-chev {
    color: var(--text-primary);
  }
}

.pr-name {
  color: var(--text-primary);
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 600;
}

.pr-track {
  height: 30px;
  width: var(--wl);
  background: #ffffff0d;
  border: 1px solid #ffffff17;
  border-radius: 9px;
  position: relative;
}

.pr-fill {
  width: var(--w);
  background: var(--grad-signature);
  transform-origin: 0;
  transition: transform 1s var(--ease-out);
  border-radius: 8px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  transform: scaleX(0);
  box-shadow: 0 0 22px #0092D54d;
}

.pr-row.in .pr-fill, .in .pr-fill {
  transform: scaleX(1);
}

.pr-vals {
  text-align: right;
  white-space: nowrap;
  font-size: 13px;
}

.pr-vals b {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-weight: 800;
}

.pr-vals s {
  color: var(--text-muted);
  margin-left: 6px;
  font-size: 12px;
}

.pr-foot {
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 24px;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  display: flex;
}

.pr-legend {
  color: var(--text-secondary);
  align-items: center;
  gap: 8px;
  font-size: 13px;
  display: inline-flex;
}

.pr-lg-fill, .pr-lg-list {
  border-radius: 4px;
  width: 14px;
  height: 14px;
}

.pr-lg-fill {
  background: var(--grad-signature);
}

.pr-lg-list {
  background: #ffffff0f;
  border: 1px solid #ffffff24;
}

.pr-var {
  color: var(--text-secondary);
  margin-left: auto;
  font-size: 13px;
}

.pr-var b {
  color: var(--text-primary);
  font-weight: 700;
}

.pr-vat {
  color: #fbbf24;
  white-space: nowrap;
  font-size: clamp(11px, .95vw, 13px);
  font-weight: 700;
}

.pr-hint {
  color: var(--text-muted);
  font-size: 13px;
}

body.reduced .pr-fill {
  transition: none;
  transform: scaleX(1);
}

.pr-plans {
  border-radius: var(--radius-pill);
  background: #ffffff0b;
  border: 1px solid #ffffff1f;
  gap: 4px;
  padding: 5px;
  display: inline-flex;
  position: relative;
}

.pr-plan {
  z-index: 1;
  font: inherit;
  cursor: pointer;
  color: var(--text-secondary);
  text-align: center;
  border-radius: var(--radius-pill);
  white-space: nowrap;
  background: none;
  border: 0;
  flex: 1;
  padding: 10px 22px;
  font-size: clamp(13px, 1.1vw, 15px);
  font-weight: 600;
  transition: color .3s;
  position: relative;
}

.pr-plan em {
  opacity: .62;
  font-style: normal;
  font-weight: 400;
}

.pr-plan.is-on {
  color: #fff;
}

.pr-plans-thumb {
  z-index: 0;
  border-radius: var(--radius-pill);
  background: var(--grad-signature);
  width: calc(50% - 5px);
  transition: transform .38s var(--ease-out);
  position: absolute;
  top: 5px;
  bottom: 5px;
  left: 5px;
  box-shadow: 0 6px 18px #0092D559;
}

.pr-plans[data-plan="eves"] .pr-plans-thumb {
  transform: translateX(100%);
}

.pr-setup {
  text-align: center;
}

.pr-setup-v {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 800;
  display: block;
}

.pr-setup-l {
  color: var(--text-muted);
  margin-top: 4px;
  font-size: 12.5px;
  display: block;
}

.pr-chev {
  width: 22px;
  height: 22px;
  color: var(--text-muted);
  transition: transform .35s var(--ease-out), color .3s;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.pr-chev svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 16px;
  height: 16px;
}

.pr-item.open .pr-chev {
  color: var(--text-primary);
  transform: rotate(180deg);
}

.pr-detail {
  opacity: 0;
  transition: grid-template-rows .45s var(--ease-out), opacity .3s;
  grid-template-rows: 0fr;
  display: grid;
}

.pr-item.open .pr-detail {
  opacity: 1;
  grid-template-rows: 1fr;
}

.pr-detail-in {
  min-height: 0;
  overflow: hidden;
}

.pr-d-body {
  padding: 2px 14px 16px;
}

.pr-d-title {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 12px 0 2px;
  font-size: 11.5px;
  font-weight: 700;
  display: block;
}

.pr-mods, .pr-ents {
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.pr-mods li, .pr-ents li {
  color: var(--text-secondary);
  border-bottom: 1px dashed #ffffff14;
  align-items: baseline;
  gap: 10px;
  padding: 7px 0;
  font-size: 13.5px;
  display: flex;
}

.pr-mods li:last-child, .pr-ents li:last-child {
  border-bottom: 0;
}

.pr-mods li span, .pr-ents li span {
  flex: 1;
}

.pr-mods li b, .pr-ents li b {
  font-family: var(--font-display);
  color: var(--text-primary);
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
}

.pr-d-note {
  color: var(--text-muted);
  margin-top: 10px;
  font-size: 12px;
  display: block;
}

body.reduced .pr-detail {
  transition: none;
}

@media (width <= 620px) {
  .pr-row {
    grid-template-columns: 1fr 22px;
    grid-template-areas: "name chev"
                         "track track"
                         "vals vals";
    gap: 6px 10px;
  }

  .pr-name {
    grid-area: name;
  }

  .pr-track {
    grid-area: track;
    width: var(--wl) !important;
  }

  .pr-vals {
    text-align: left;
    grid-area: vals;
  }

  .pr-chev {
    grid-area: chev;
  }

  .pr-total-v {
    font-size: clamp(30px, 10vw, 44px);
  }

  .pr-setup {
    text-align: left;
  }

  .pr-plan {
    white-space: normal;
    padding: 10px 14px;
  }
}

.eyebrow--warn {
  color: #f0897e;
}

.vg-title .korall {
  background: linear-gradient(100deg, #f0897e, #e8736b);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.fr-scatter {
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(13px, 1.8vw, 24px);
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  display: flex;
}

.fr-chip {
  font-family: var(--font-display);
  color: var(--text-muted);
  transform: rotate(var(--r));
  opacity: .8;
  background: #ffffff08;
  border: 1px dashed #ffffff26;
  border-radius: 13px;
  padding: 13px 21px;
  font-size: clamp(13px, 1.2vw, 18px);
  font-weight: 600;
}

.hub2 {
  aspect-ratio: 1;
  width: 100%;
  max-width: min(470px, 56svh);
  margin: 0 auto;
  position: relative;
}

#vege-ossz2 .vg-inner {
  gap: clamp(12px, 2vh, 24px);
}

#vege-ossz2 .vg-head {
  margin-bottom: 0;
}

.hub2-lines {
  z-index: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  overflow: visible;
}

.hub2-lines line {
  stroke: #0092D580;
  stroke-width: 1.5px;
  vector-effect: non-scaling-stroke;
  opacity: 0;
  transition: opacity .7s var(--ease-out);
}

.hub2.in .hub2-lines line {
  opacity: 1;
}

.hub2-node {
  z-index: 1;
  white-space: nowrap;
  color: var(--text-primary);
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  background: #121226f0;
  border: 1px solid #0092D56b;
  border-radius: 11px;
  padding: 9px 15px;
  font-size: clamp(11px, 1vw, 14px);
  font-weight: 600;
  position: absolute;
  transform: translate(-50%, -50%) scale(.84);
  box-shadow: 0 6px 18px #0000006b;
}

.hub2.in .hub2-node {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.hub2-node:nth-of-type(2) {
  transition-delay: .28s;
}

.hub2-node:nth-of-type(3) {
  transition-delay: .34s;
}

.hub2-node:nth-of-type(4) {
  transition-delay: .4s;
}

.hub2-node:nth-of-type(5) {
  transition-delay: .46s;
}

.hub2-node:nth-of-type(6) {
  transition-delay: .52s;
}

.hub2-node:nth-of-type(7) {
  transition-delay: .58s;
}

.hub2-node:nth-of-type(8) {
  transition-delay: .64s;
}

.hub2-node:nth-of-type(9) {
  transition-delay: .7s;
}

.hub2-core {
  z-index: 2;
  aspect-ratio: 1;
  text-align: center;
  background: var(--grad-signature);
  color: #fff;
  border-radius: 50%;
  place-content: center;
  width: clamp(94px, 21%, 124px);
  display: grid;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 6px #0092D524, 0 0 46px #0092D580, 0 14px 40px #00000080;
}

.hub2-core b {
  font-family: var(--font-display);
  font-size: clamp(17px, 2vw, 22px);
  font-weight: 800;
  line-height: 1;
  display: block;
}

.hub2-core em {
  opacity: .85;
  letter-spacing: .03em;
  font-size: 11px;
  font-style: normal;
}

body.reduced .hub2-node {
  transition: none;
}

@media (width <= 480px) {
  .hub2 {
    max-width: 340px;
  }

  .hub2-node {
    padding: 7px 11px;
    font-size: 11px;
  }
}

.od-shot--wide {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}

.rx-groups {
  text-align: left;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(14px, 1.5vw, 22px);
  width: 100%;
  display: grid;
}

.rx-card {
  border: 1px solid var(--station-border);
  background: linear-gradient(#12303E99, #0c0c18a8);
  border-radius: 18px;
  flex-direction: column;
  padding: clamp(20px, 2vw, 28px);
  display: flex;
}

.rx-card .od-b-ico {
  margin-bottom: 14px;
}

.rx-card .od-b-title {
  margin-bottom: 12px;
}

@media (width <= 880px) {
  .rx-groups {
    grid-template-columns: 1fr;
    max-width: 560px;
    margin: 0 auto;
  }
}

.asz-beat {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(26px, 5vh, 54px);
  width: 100%;
  min-height: 92svh;
  display: flex;
}

.asz-title2 {
  margin: 0;
}

.fk-beat {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(26px, 5vh, 54px);
  width: 100%;
  min-height: 92svh;
  display: flex;
}

.fk-title2 {
  margin: 0;
}

#fsBtn {
  cursor: pointer;
  width: 38px;
  height: 38px;
  color: var(--text-secondary);
  z-index: 2;
  background: #ffffff0a;
  border: 1px solid #94a3b847;
  border-radius: 10px;
  place-items: center;
  transition: color .3s, border-color .3s;
  display: inline-grid;
  position: absolute;
  top: 50%;
  right: clamp(120px, 12vw, 156px);
  transform: translateY(-50%);
}

#fsBtn:hover {
  color: var(--text-primary);
  border-color: #94a3b880;
}

#fsBtn svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 17px;
  height: 17px;
}

#fsBtn.is-fs {
  color: #8FD3F2;
  border-color: #8FD3F280;
}

.asz-diagram {
  width: 100%;
  max-width: 720px;
  height: clamp(230px, 32vh, 300px);
  margin: 0 auto;
  position: relative;
}

.asz-lines {
  z-index: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  overflow: visible;
}

.asz-lines line {
  stroke: #0092D580;
  stroke-width: 1.5px;
  vector-effect: non-scaling-stroke;
  opacity: 0;
  transition: opacity .7s var(--ease-out);
}

.asz-diagram.in .asz-lines line {
  opacity: 1;
}

.asz-core {
  z-index: 2;
  text-align: center;
  white-space: nowrap;
  background: var(--grad-signature);
  color: #fff;
  border-radius: 16px;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 16px 20px;
  display: flex;
  position: absolute;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 5px #0092D524, 0 0 40px #0092D573, 0 12px 34px #00000080;
}

.asz-core-ico {
  place-items: center;
  width: 30px;
  height: 30px;
  display: grid;
}

.asz-core-ico svg {
  fill: none;
  stroke: #fff;
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 24px;
  height: 24px;
}

.asz-core b {
  font-family: var(--font-display);
  font-size: clamp(15px, 1.4vw, 18px);
  font-weight: 800;
}

.asz-core em {
  opacity: .9;
  font-size: 11px;
  font-style: normal;
}

.asz-doc {
  z-index: 1;
  white-space: nowrap;
  color: var(--text-primary);
  opacity: 0;
  transition: opacity .5s var(--ease-out) .3s, transform .5s var(--ease-out) .3s;
  background: #121226f0;
  border: 1px solid #0092D56b;
  border-radius: 11px;
  align-items: center;
  gap: 9px;
  padding: 10px 16px;
  font-size: clamp(12px, 1.05vw, 15px);
  font-weight: 600;
  display: inline-flex;
  position: absolute;
  transform: translate(-50%, -50%);
  box-shadow: 0 6px 18px #0006;
}

.asz-doc i {
  background: var(--grad-signature);
  border-radius: 50%;
  flex: none;
  width: 9px;
  height: 9px;
}

.asz-diagram.in .asz-doc {
  opacity: 1;
}

.asz-scope {
  white-space: nowrap;
  color: #8FD3F2;
  border-radius: var(--radius-pill);
  background: #0092D51a;
  border: 1px solid #0092D542;
  padding: 7px 15px;
  font-size: clamp(11px, 1vw, 13px);
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
}

.asz-points {
  text-align: left;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(13px, 1.4vw, 20px);
  width: 100%;
  display: grid;
}

.asz-pt {
  border: 1px solid var(--station-border);
  background: linear-gradient(#12303E94, #0c0c18a8);
  border-radius: 16px;
  padding: clamp(16px, 1.6vw, 22px);
}

.asz-pt-ico {
  color: #8FD3F2;
  background: #0092D51f;
  border: 1px solid #0092D547;
  border-radius: 12px;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: 12px;
  display: grid;
}

.asz-pt-ico svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 22px;
  height: 22px;
}

.asz-pt h3 {
  font-family: var(--font-display);
  margin-bottom: 7px;
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: 700;
}

.asz-pt p {
  color: var(--text-secondary);
  font-size: clamp(12px, .98vw, 14px);
  line-height: 1.45;
}

.asz-swap {
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: clamp(16px, 2vw, 30px);
  width: 100%;
  max-width: 1060px;
  margin: 0 auto;
  display: grid;
}

.asz-side {
  border: 1px solid var(--station-border);
  transition: opacity .3s var(--ease-out), border-color .3s, box-shadow .3s, transform .3s var(--ease-out);
  background: linear-gradient(#12303E94, #0c0c18a8);
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: clamp(20px, 2.2vw, 30px) clamp(16px, 1.8vw, 26px) clamp(16px, 1.8vw, 24px);
  display: flex;
  position: relative;
}

.asz-swap:has(.bx-on) .asz-side:not(.bx-on) {
  opacity: .38;
  transform: scale(.985);
}

.asz-side--ma.bx-on {
  border-color: #f8717180;
  box-shadow: 0 0 0 1px #f8717140, 0 18px 50px #f8717117;
}

.asz-side--uj.bx-on {
  border-color: #2ed59280;
  box-shadow: 0 0 0 1px #2ed59240, 0 18px 50px #2ed59217;
}

.asz-side-tag {
  letter-spacing: .5px;
  z-index: 3;
  border-radius: 999px;
  padding: 3px 14px;
  font-size: .72rem;
  font-weight: 800;
  position: absolute;
  top: -11px;
  left: 50%;
  transform: translateX(-50%);
}

.asz-side--ma .asz-side-tag {
  color: #fca5a5;
  background: #1a0f16;
  border: 1px solid #f8717180;
}

.asz-side--uj .asz-side-tag {
  color: #bbf7d0;
  background: #0a1a14;
  border: 1px solid #2ed59280;
}

.asz-fiok {
  color: var(--text-primary);
  text-align: center;
  background: #1e0e14d9;
  border: 1px solid #f8717173;
  border-radius: 14px;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px 22px;
  display: flex;
}

.asz-fiok-ico {
  color: #fca5a5;
  border: 1.6px solid #f8717199;
  border-radius: 50%;
  place-items: center;
  width: 30px;
  height: 30px;
  display: grid;
}

.asz-fiok-ico svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 19px;
  height: 19px;
}

.asz-fiok b {
  font-family: var(--font-display);
  font-size: clamp(14px, 1.2vw, 17px);
  font-weight: 800;
}

.asz-who {
  align-items: center;
  gap: 5px;
  display: inline-flex;
}

.asz-sil {
  background: #f871718c;
  border-radius: 50% 50% 4px 4px;
  width: 13px;
  height: 13px;
  animation: 2.7s ease-in-out infinite asz-sil;
}

.asz-sil:nth-child(2) {
  animation-delay: .9s;
}

.asz-sil:nth-child(3) {
  animation-delay: 1.8s;
}

@keyframes asz-sil {
  0%, 62%, 100% {
    opacity: .22;
  }

  22%, 40% {
    opacity: 1;
  }
}

.asz-who em {
  color: #fda4af;
  margin-left: 5px;
  font-size: 11px;
  font-style: normal;
}

.asz-fan {
  width: min(88%, 380px);
  height: 30px;
  overflow: visible;
}

.asz-fan line {
  stroke: #f871718c;
  stroke-width: 1.4px;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 4 4;
}

.asz-charts {
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  display: flex;
}

.asz-chart {
  color: #fecaca;
  background: #1c0e14cc;
  border: 1px solid #f8717166;
  border-radius: 9px;
  padding: 6px 11px;
  font-size: .72rem;
  font-weight: 600;
}

.asz-err {
  border-radius: var(--radius-pill);
  color: #fca5a5;
  background: #f8717114;
  border: 1px solid #f871716b;
  align-items: center;
  gap: 9px;
  padding: 7px 15px;
  font-size: clamp(11px, 1vw, 13px);
  font-weight: 600;
  display: inline-flex;
}

.asz-err b {
  color: #f87171;
  border: 1.6px solid #f87171b3;
  border-radius: 50%;
  place-items: center;
  width: 19px;
  height: 19px;
  font-size: 12px;
  display: grid;
}

.asz-side-note {
  color: var(--text-secondary);
  text-align: center;
  margin-top: auto;
  font-size: clamp(11px, .95vw, 13px);
}

.asz-side-note--uj {
  color: #86efac;
}

.asz-side--uj .asz-diagram {
  max-width: 100%;
  height: clamp(190px, 24vh, 240px);
}

.asz-side--uj .asz-doc {
  transition-delay: 0s;
}

@media (width <= 820px) {
  .asz-points {
    grid-template-columns: 1fr 1fr;
  }

  .asz-swap {
    grid-template-columns: 1fr;
    max-width: 480px;
  }
}

@media (width <= 480px) {
  .asz-points {
    grid-template-columns: 1fr;
    max-width: 420px;
    margin: 0 auto;
  }

  .asz-diagram {
    max-width: 360px;
  }

  .asz-doc {
    padding: 8px 12px;
  }

  .asz-core {
    padding: 12px 15px;
    left: 20% !important;
  }

  .asz-doc {
    left: 80% !important;
  }
}

#recepcio-doku .od-inner {
  gap: clamp(18px, 3vh, 34px);
}

.rec-open {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 18px;
  width: 100%;
  min-height: calc(100svh - 190px);
  display: flex;
  position: relative;
}

.rec-open:before {
  content: "";
  z-index: -1;
  pointer-events: none;
  background-image: radial-gradient(#94a3b821 1px, #0000 1.5px);
  background-size: 30px 30px;
  position: absolute;
  inset: -8% -14%;
  -webkit-mask-image: radial-gradient(58% 52%, #000 30%, #0000 78%);
  mask-image: radial-gradient(58% 52%, #000 30%, #0000 78%);
}

.rec-open:after {
  content: "";
  z-index: -2;
  pointer-events: none;
  background: radial-gradient(46% 38% at 50% 52%, #3E7DD029, #0000 74%);
  position: absolute;
  inset: 0;
}

.rec-open-title {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  color: var(--text-primary);
  max-width: 15ch;
  margin: 6px 0 0;
  font-size: clamp(40px, 6.4vw, 92px);
  font-weight: 800;
  line-height: 1.06;
}

.rec-open-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.rec-open-kek {
  opacity: 0;
  filter: blur(6px);
  transition: opacity .9s var(--ease-out) .55s,
  transform .9s var(--ease-out) .55s, filter .9s var(--ease-out) .55s;
  display: inline-block;
  transform: translateY(.32em);
}

.rec-open.in .rec-open-kek {
  opacity: 1;
  filter: none;
  transform: none;
}

.rec-open-sub {
  color: var(--text-muted);
  opacity: 0;
  transition: opacity .7s var(--ease-out) 1.35s, transform .7s var(--ease-out) 1.35s;
  align-items: baseline;
  gap: 12px;
  margin-top: 6px;
  font-size: clamp(14px, 1.3vw, 18px);
  display: inline-flex;
  transform: translateY(8px);
}

.rec-open.in .rec-open-sub {
  opacity: 1;
  transform: none;
}

.rec-open-sub i {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-style: normal;
  font-weight: 800;
}

.rec-open-sub b {
  color: var(--text-secondary);
  font-weight: 700;
}

body.reduced .rec-open-kek, body.reduced .rec-open-sub {
  opacity: 1;
  filter: none;
  transition: none;
  transform: none;
}

@media (width <= 620px) {
  .rec-open {
    min-height: calc(100svh - 240px);
  }
}

.rec-stage {
  text-align: left;
  width: 100%;
  max-width: 940px;
  transition: border-color .7s var(--ease-out), box-shadow .7s var(--ease-out);
  background: linear-gradient(#12303E99, #0c0c18a8);
  border: 1px solid #f0897e52;
  border-radius: 22px;
  margin: 0 auto;
  padding: clamp(16px, 1.8vw, 26px);
}

.rec-stage[data-view="next"] {
  border-color: #2ed59257;
  box-shadow: 0 0 0 1px #2ed5920f, 0 18px 44px #00000059;
}

.rec-sw {
  border-radius: var(--radius-pill);
  background: #ffffff0b;
  border: 1px solid #ffffff1f;
  gap: 4px;
  margin: 0 auto 14px;
  padding: 4px;
  display: inline-flex;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.rec-sw button {
  z-index: 1;
  min-width: 92px;
  font: inherit;
  cursor: pointer;
  color: var(--text-secondary);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: center;
  border-radius: var(--radius-pill);
  background: none;
  border: 0;
  flex: 1;
  padding: 8px 20px;
  font-size: 13px;
  font-weight: 700;
  transition: color .3s;
  position: relative;
}

.rec-sw button.is-on {
  color: #fff;
}

.rec-sw-thumb {
  z-index: 0;
  border-radius: var(--radius-pill);
  width: calc(50% - 4px);
  transition: transform .4s var(--ease-out), background .4s;
  background: linear-gradient(135deg, #f0897e, #e8736b);
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 4px;
  box-shadow: 0 6px 18px #f0897e4d;
}

.rec-stage[data-view="next"] .rec-sw-thumb {
  background: linear-gradient(135deg, #2ed592, #14b87a);
  transform: translateX(100%);
  box-shadow: 0 6px 18px #2ed5924d;
}

.rec-panes {
  display: grid;
}

.rec-pane {
  opacity: 0;
  pointer-events: none;
  transition: opacity .55s var(--ease-out), transform .55s var(--ease-out);
  grid-area: 1 / 1;
  grid-template-columns: minmax(280px, 380px) 1fr;
  align-items: center;
  gap: clamp(18px, 2.4vw, 34px);
  display: grid;
  transform: translateY(10px);
}

.rec-stage[data-view="now"] .rec-pane--now, .rec-stage[data-view="next"] .rec-pane--next {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.rec-tag {
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  letter-spacing: .14em;
  text-transform: uppercase;
  align-self: flex-start;
  padding: 4px 12px;
  font-size: 11px;
  font-weight: 800;
}

.rec-tag--now {
  color: #f0897e;
  background: #f0897e1a;
  border: 1px solid #f0897e52;
}

.rec-tag--next {
  color: #2ed592;
  background: #2ed5921a;
  border: 1px solid #2ed59257;
}

.rec-txt {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.rec-h {
  font-family: var(--font-display);
  color: var(--text-primary);
  margin: 0;
  font-size: clamp(17px, 1.6vw, 22px);
  font-weight: 800;
}

.rec-list {
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.rec-list li {
  color: var(--text-secondary);
  padding-left: 24px;
  font-size: clamp(13.5px, 1.15vw, 15.5px);
  line-height: 1.5;
  position: relative;
}

.rec-list li:before {
  content: "";
  border-radius: 50%;
  width: 9px;
  height: 9px;
  position: absolute;
  top: .52em;
  left: 2px;
}

.rec-pane--now .rec-list li:before {
  background: #f0897e38;
  border: 1.5px solid #f0897ebf;
}

.rec-pane--next .rec-list li:before {
  background: #2ed59238;
  border: 1.5px solid #2ed592cc;
}

.rec-scene {
  background: #ffffff06;
  border: 1px solid #ffffff12;
  border-radius: 14px;
  width: 100%;
  height: auto;
  display: block;
}

.rec-scene * {
  fill: none;
  stroke-width: 1.9px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rec-pane--now .rec-scene * {
  stroke: #f0897ed9;
}

.rec-pane--next .rec-scene * {
  stroke: #8FD3F2cc;
}

.rec-pane--next .rec-scene .rec-ok {
  stroke: #2ed592;
  stroke-width: 2.4px;
}

body.reduced .rec-pane {
  transition: none;
}

.r2b {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 22px;
  width: 100%;
  display: flex;
}

.r2b-beat1 {
  min-height: calc(88svh - 120px);
  margin-top: clamp(20px, 6vh, 60px);
}

.r2b-beat2, .r2b-beat3 {
  min-height: calc(86svh - 120px);
}

.r2b-num {
  font-family: var(--font-display);
  letter-spacing: -.03em;
  align-items: baseline;
  gap: clamp(18px, 3vw, 40px);
  font-size: clamp(88px, 15vw, 210px);
  font-weight: 800;
  line-height: 1;
  display: flex;
  position: relative;
}

.r2b-4 {
  color: var(--text-primary);
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .6s var(--ease-out);
  display: inline-block;
  transform: scale(.6);
}

.r2b-arr {
  background: var(--grad-signature);
  color: #0000;
  opacity: 0;
  transition: opacity .5s var(--ease-out) .9s, transform .5s var(--ease-out) .9s;
  -webkit-background-clip: text;
  background-clip: text;
  align-self: center;
  font-size: .5em;
  transform: translateX(-14px);
}

.r2b-1 {
  background: var(--grad-signature);
  color: #0000;
  opacity: 0;
  transition: opacity .55s var(--ease-out) 1.15s, transform .65s var(--ease-out) 1.15s;
  -webkit-background-clip: text;
  background-clip: text;
  display: inline-block;
  transform: scale(.5);
}

.r2b.go .r2b-4, .r2b.go .r2b-arr, .r2b.go .r2b-1 {
  opacity: 1;
  transform: none;
}

.r2b-sysnames {
  white-space: nowrap;
  font-family: var(--font-body, inherit);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-muted);
  opacity: 0;
  transition: opacity .7s var(--ease-out) .55s;
  font-size: clamp(10px, 1vw, 13px);
  font-weight: 600;
  position: absolute;
  bottom: -1.1em;
  left: 0;
}

.r2b.go .r2b-sysnames {
  opacity: .75;
}

.r2b-hook {
  color: var(--text-secondary);
  opacity: 0;
  transition: opacity .6s var(--ease-out) 1.6s, transform .6s var(--ease-out) 1.6s;
  margin: 26px 0 0;
  font-size: clamp(17px, 1.8vw, 24px);
  transform: translateY(8px);
}

.r2b-hook b {
  color: var(--text-primary);
}

.r2b.go .r2b-hook {
  opacity: 1;
  transform: none;
}

.r2b-pain {
  color: var(--text-secondary);
  opacity: 0;
  transition: opacity .6s var(--ease-out), transform .6s var(--ease-out);
  margin: 0;
  font-size: clamp(18px, 2vw, 28px);
  font-weight: 600;
  transform: translateY(8px);
}

.r2b-pain b {
  color: #f0897e;
  font-weight: 800;
}

.r2b.go .r2b-pain {
  opacity: 1;
  transform: none;
}

.r2b-chaos {
  width: 100%;
  max-width: 880px;
  height: clamp(260px, 38vh, 360px);
  position: relative;
}

.r2b-wires {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  overflow: visible;
}

.r2b-wires path {
  fill: none;
  stroke: #f0897ea6;
  stroke-width: 1.8px;
  stroke-dasharray: 7 7;
  stroke-linecap: round;
  opacity: 0;
  transition: opacity .6s var(--ease-out);
}

.r2b.go .r2b-wires path {
  opacity: 1;
}

.r2b.go .r2b-wires path:first-of-type {
  transition-delay: .5s;
}

.r2b.go .r2b-wires path:nth-of-type(2) {
  transition-delay: .65s;
}

.r2b.go .r2b-wires path:nth-of-type(3) {
  transition-delay: .8s;
}

.r2b.go .r2b-wires path:nth-of-type(4) {
  transition-delay: .95s;
}

@keyframes r2b-march {
  to {
    stroke-dashoffset: -28px;
  }
}

.r2b.go .r2b-wires path {
  animation: 1.6s linear infinite r2b-march;
}

.r2b-box {
  text-align: left;
  font-family: var(--font-display);
  color: var(--text-primary);
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  background: #121226f0;
  border: 1px solid #f0897e66;
  border-radius: 12px;
  flex-direction: column;
  gap: 2px;
  padding: 12px 18px;
  font-size: clamp(13px, 1.2vw, 17px);
  font-weight: 700;
  display: flex;
  position: absolute;
  transform: translate(-8%);
  box-shadow: 0 8px 22px #0000006b;
}

.r2b-box em {
  color: var(--text-muted);
  font-family: inherit;
  font-size: .72em;
  font-style: normal;
  font-weight: 500;
}

.r2b.go .r2b-box {
  opacity: 1;
}

.r2b.go .r2b-box:nth-of-type(2) {
  transition-delay: .12s;
}

.r2b.go .r2b-box:nth-of-type(3) {
  transition-delay: .22s;
}

.r2b.go .r2b-box:nth-of-type(4) {
  transition-delay: .32s;
}

.r2b.go .r2b-box:nth-of-type(5) {
  transition-delay: .42s;
}

.r2b-bubble {
  z-index: 2;
  border-radius: var(--radius-pill);
  white-space: nowrap;
  color: var(--text-primary);
  opacity: 0;
  background: #1c1a3af7;
  border: 1px solid #8FD3F280;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  font-size: clamp(11px, 1vw, 13.5px);
  font-weight: 600;
  display: inline-flex;
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 10px 26px #00000080;
}

.r2b-bubble i {
  background: var(--grad-signature);
  border-radius: 50%;
  width: 7px;
  height: 7px;
}

@keyframes r2b-wander {
  0% {
    opacity: 1;
    top: 26%;
    left: 12%;
    transform: scale(1);
  }

  8% {
    top: 26%;
    left: 12%;
    transform: scale(1.12);
  }

  12% {
    top: 26%;
    left: 12%;
    transform: scale(1);
  }

  30% {
    top: 24%;
    left: 74%;
    transform: scale(1);
  }

  38% {
    top: 24%;
    left: 74%;
    transform: scale(1.12);
  }

  42% {
    top: 24%;
    left: 74%;
    transform: scale(1);
  }

  58% {
    top: 80%;
    left: 68%;
    transform: scale(1);
  }

  66% {
    top: 80%;
    left: 68%;
    transform: scale(1.12);
  }

  70% {
    top: 80%;
    left: 68%;
    transform: scale(1);
  }

  86% {
    top: 76%;
    left: 18%;
    transform: scale(1);
  }

  94% {
    opacity: 1;
    top: 76%;
    left: 18%;
    transform: scale(1.12);
  }

  100% {
    opacity: 1;
    top: 26%;
    left: 12%;
    transform: scale(1);
  }
}

.r2b.go .r2b-bubble {
  animation: 11s ease-in-out 1.1s infinite r2b-wander;
}

.r2b-title {
  max-width: 20ch;
}

.r2b-merge {
  place-items: center;
  width: 100%;
  max-width: 640px;
  display: grid;
  position: relative;
}

.r2b-chip {
  z-index: 0;
  font-family: var(--font-display);
  color: var(--text-muted);
  transform: translate(var(--tx), var(--ty));
  opacity: 0;
  background: #121226e6;
  border: 1px solid #94a3b84d;
  border-radius: 11px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 700;
  position: absolute;
}

@keyframes r2b-converge {
  0% {
    opacity: 0;
    transform: translate(var(--tx), var(--ty));
  }

  22% {
    opacity: .92;
    transform: translate(var(--tx), var(--ty));
  }

  55% {
    opacity: .92;
    transform: translate(var(--tx), var(--ty));
  }

  100% {
    opacity: 0;
    transform: translate(calc(var(--tx) * .1), calc(var(--ty) * .1)) scale(.8);
  }
}

.r2b.go .r2b-chip {
  animation: r2b-converge 1.5s var(--ease-out) forwards;
}

.r2b.go .r2b-chip:first-of-type {
  animation-delay: 0s;
}

.r2b.go .r2b-chip:nth-of-type(2) {
  animation-delay: .1s;
}

.r2b.go .r2b-chip:nth-of-type(3) {
  animation-delay: .2s;
}

.r2b.go .r2b-chip:nth-of-type(4) {
  animation-delay: .3s;
}

.r2b-karton {
  z-index: 1;
  text-align: left;
  opacity: 0;
  width: 100%;
  transition: opacity .6s var(--ease-out) .6s, transform .7s var(--ease-out) .6s;
  background: linear-gradient(#12303Eb8, #0c0c18cc);
  border: 1px solid #2ed5924d;
  border-radius: 18px;
  padding: clamp(18px, 2vw, 28px);
  position: relative;
  transform: scale(.94);
  box-shadow: 0 18px 48px #0006;
}

.r2b.go .r2b-karton {
  opacity: 1;
  transform: none;
}

.r2b-karton-head {
  font-family: var(--font-display);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
  border-bottom: 1px solid #ffffff17;
  margin-bottom: 14px;
  padding-bottom: 10px;
  font-size: 13px;
  font-weight: 700;
  display: block;
}

.r2b-row {
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .55s var(--ease-out);
  border-bottom: 1px dashed #ffffff12;
  grid-template-columns: 120px 1fr 22px;
  align-items: center;
  gap: 12px;
  padding: 9px 0;
  display: grid;
  transform: translateX(-26px);
}

.r2b-row:last-of-type {
  border-bottom: 0;
}

.r2b-lb {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 600;
}

.r2b-row b {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(14px, 1.25vw, 17px);
  font-weight: 700;
}

.r2b-row svg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
  width: 18px;
  height: 18px;
  transition: opacity .35s var(--ease-out), transform .4s var(--ease-out);
  transform: scale(.5);
}

.r2b.go .r2b-row, .r2b.go .r2b-row svg {
  opacity: 1;
  transform: none;
}

.r2b.go .r2b-row1 {
  transition-delay: 1s;
}

.r2b.go .r2b-row1 svg {
  transition-delay: 1.35s;
}

.r2b.go .r2b-row2 {
  transition-delay: 1.2s;
}

.r2b.go .r2b-row2 svg {
  transition-delay: 1.55s;
}

.r2b.go .r2b-row3 {
  transition-delay: 1.4s;
}

.r2b.go .r2b-row3 svg {
  transition-delay: 1.75s;
}

.r2b.go .r2b-row4 {
  transition-delay: 1.6s;
}

.r2b.go .r2b-row4 svg {
  transition-delay: 1.95s;
}

.r2b-note {
  color: var(--text-muted);
  opacity: 0;
  transition: opacity .7s var(--ease-out) 2.2s;
  font-size: clamp(12.5px, 1.1vw, 15px);
}

.r2b.go .r2b-note {
  opacity: 1;
}

body.reduced .r2b-4, body.reduced .r2b-arr, body.reduced .r2b-1, body.reduced .r2b-sysnames, body.reduced .r2b-hook, body.reduced .r2b-pain, body.reduced .r2b-wires path, body.reduced .r2b-box, body.reduced .r2b-karton, body.reduced .r2b-row, body.reduced .r2b-row svg, body.reduced .r2b-note {
  opacity: 1;
  transition: none;
  animation: none;
  transform: none;
}

body.reduced .r2b-sysnames {
  opacity: .75;
}

body.reduced .r2b-bubble {
  opacity: 1;
  animation: none;
  top: 26%;
  left: 12%;
}

body.reduced .r2b-chip {
  opacity: 0;
}

@media (width <= 620px) {
  .r2b-chaos {
    height: 300px;
  }

  .r2b-box {
    padding: 9px 12px;
  }

  .r2b-row {
    grid-template-columns: 92px 1fr 20px;
  }

  .r2b-chip {
    display: none;
  }
}

#paciens-nyito {
  --pv2: 129,140,248;
  --pv2a: #8FD3F2;
  --pv2b: #0092D5;
  --pv2l: 224,231,255;
}

#scene-foglalas {
  --pv2: 79,123,255;
  --pv2a: #7ba3ff;
  --pv2b: #4f7bff;
  --pv2l: 219,232,255;
}

#scene-erkezes-elott {
  --pv2: 167,139,250;
  --pv2a: #c4b5fd;
  --pv2b: #8b5cf6;
  --pv2l: 237,230,255;
}

#scene-erkezes {
  --pv2: 56,199,214;
  --pv2a: #7de3ee;
  --pv2b: #23a8b8;
  --pv2l: 213,248,252;
}

#scene-ellatas-utan {
  --pv2: 46,213,146;
  --pv2a: #5ee6a8;
  --pv2b: #2ed592;
  --pv2l: 210,255,236;
}

#scene-utankovetes {
  --pv2: 255,184,120;
  --pv2a: #ffd6aa;
  --pv2b: #f0a868;
  --pv2l: 255,240,224;
}

#scene-ellatas-utan .beat-bullet, #scene-utankovetes .beat-bullet {
  transition: opacity .4s var(--ease-out);
}

#scene-ellatas-utan[data-sub="0"] .beat-bullet:not(:first-child), #scene-ellatas-utan[data-sub="1"] .beat-bullet:not(:nth-child(2)), #scene-ellatas-utan[data-sub="2"] .beat-bullet:not(:nth-child(3)), #scene-ellatas-utan[data-sub="3"] .beat-bullet:not(:nth-child(4)), #scene-utankovetes[data-sub="0"] .beat-bullet:not(:first-child), #scene-utankovetes[data-sub="1"] .beat-bullet:not(:nth-child(2)), #scene-utankovetes[data-sub="2"] .beat-bullet:not(:nth-child(3)), #scene-utankovetes[data-sub="3"] .beat-bullet:not(:nth-child(4)) {
  opacity: .38;
}

.mk-tav, .mk-uk {
  width: 100%;
  display: grid;
  position: relative;
}

.tav-s, .uk-s {
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s var(--ease-out), transform .55s var(--ease-out);
  flex-direction: column;
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  gap: 18px;
  display: flex;
  transform: translateY(14px);
}

#scene-ellatas-utan[data-sub="0"] .tav-s0, #scene-ellatas-utan[data-sub="1"] .tav-s1, #scene-ellatas-utan[data-sub="2"] .tav-s2, #scene-ellatas-utan[data-sub="3"] .tav-s3, #scene-utankovetes[data-sub="0"] .uk-s0, #scene-utankovetes[data-sub="1"] .uk-s1, #scene-utankovetes[data-sub="2"] .uk-s2, #scene-utankovetes[data-sub="3"] .uk-s3 {
  opacity: 1;
  transform: none;
}

.tav-s0 svg {
  width: min(100%, 420px);
  height: auto;
}

.tav-s0 svg * {
  fill: none;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tav-door {
  stroke: rgba(var(--pv2),.6);
  stroke-dasharray: 5 7;
}

.tav-anna * {
  stroke: rgba(var(--pv2l),.92);
  stroke-width: 2.4px;
}

.tav-ghost * {
  stroke: #f0897e80;
}

.tav-line {
  stroke: rgba(var(--pv2),.45);
  stroke-dasharray: 4 8;
}

.tav-ghost {
  opacity: .8;
  transition: opacity 1.2s var(--ease-out), filter 1.2s var(--ease-out);
}

#scene-ellatas-utan[data-sub="0"] .tav-ghost {
  transition: none;
}

#scene-ellatas-utan[data-sub="0"] .tav-g1 {
  animation: 8s ease-in-out .6s infinite tav-ghost-loop;
}

#scene-ellatas-utan[data-sub="0"] .tav-g2 {
  animation: 8s ease-in-out 1s infinite tav-ghost-loop;
}

#scene-ellatas-utan[data-sub="0"] .tav-g3 {
  animation: 8s ease-in-out 1.4s infinite tav-ghost-loop;
}

@keyframes tav-ghost-loop {
  0%, 8% {
    opacity: .8;
    filter: blur();
  }

  26%, 74% {
    opacity: 0;
    filter: blur(3px);
  }

  90%, 100% {
    opacity: .8;
    filter: blur();
  }
}

.tav-cap {
  color: var(--text-secondary);
  font-size: clamp(14px, 1.35vw, 18px);
  font-weight: 600;
}

.tav-ui {
  text-align: left;
  border: 1px solid rgba(var(--pv2),.3);
  background: #090b14f2;
  border-radius: 16px;
  width: min(100%, 420px);
  padding-bottom: 16px;
  overflow: hidden;
  box-shadow: 0 24px 60px #00000080;
}

.tav-ui-head {
  color: var(--text-muted);
  border-bottom: 1px solid #ffffff14;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  font-size: 12px;
  display: flex;
}

.tav-ui-head i {
  background: #ffffff24;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.tav-ui-head b {
  margin-left: 6px;
  font-weight: 600;
}

.tav-row {
  color: var(--text-secondary);
  border-bottom: 1px dashed #ffffff12;
  justify-content: space-between;
  padding: 12px 18px;
  font-size: clamp(14px, 1.3vw, 17px);
  font-weight: 600;
  display: flex;
}

.tav-row b {
  font-family: var(--font-display);
  color: var(--text-primary);
}

.tav-btn {
  text-align: center;
  color: #fff;
  background: var(--grad-signature);
  border-radius: 12px;
  margin: 16px 18px 0;
  padding: 13px;
  font-size: clamp(15px, 1.4vw, 19px);
  font-weight: 800;
  transition: opacity .4s 1.4s, transform .4s 1.4s;
  display: block;
}

.tav-done {
  color: var(--pv2b);
  background: rgba(var(--pv2),.1);
  border: 1px solid rgba(var(--pv2),.4);
  opacity: 0;
  transition: opacity .4s var(--ease-out) 1.5s, transform .45s var(--ease-out) 1.5s;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 16px 18px 0;
  padding: 13px;
  font-size: clamp(14px, 1.35vw, 18px);
  font-weight: 800;
  display: none;
  transform: scale(.9);
}

.tav-done svg {
  fill: none;
  width: 18px;
  height: 18px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#scene-ellatas-utan[data-sub="1"] .tav-btn {
  transition: none;
  animation: 8s infinite tav-btn-loop;
}

#scene-ellatas-utan[data-sub="1"] .tav-done {
  transition: none;
  animation: 8s infinite tav-done-loop;
  display: flex;
}

@keyframes tav-btn-loop {
  0%, 16% {
    opacity: 1;
    transform: none;
  }

  22%, 88% {
    opacity: 0;
    transform: scale(.94);
  }

  96%, 100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes tav-done-loop {
  0%, 18% {
    opacity: 0;
    transform: scale(.9);
  }

  26%, 86% {
    opacity: 1;
    transform: none;
  }

  94%, 100% {
    opacity: 0;
    transform: scale(.9);
  }
}

.tav-pocket {
  position: relative;
}

.tav-pocket svg {
  width: min(60vw, 240px);
  height: auto;
}

.tav-pocket svg * {
  fill: none;
  stroke: rgba(var(--pv2l),.55);
  stroke-width: 2px;
  stroke-linecap: round;
}

.tav-pk {
  stroke: rgba(var(--pv2),.7) !important;
}

.tav-ph {
  stroke: rgba(var(--pv2l),.8) !important;
}

.tav-pulse {
  background: rgba(var(--pv2),.5);
  border-radius: 50%;
  width: 26px;
  height: 26px;
  position: absolute;
  top: 62%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#scene-ellatas-utan[data-sub="2"] .tav-pulse {
  animation: 1.6s ease-out infinite aip;
}

.tav-mail {
  border-radius: var(--radius-pill);
  color: var(--text-primary);
  background: rgba(var(--pv2),.09);
  border: 1px solid rgba(var(--pv2),.35);
  align-items: center;
  gap: 10px;
  padding: 11px 20px;
  font-size: clamp(14px, 1.3vw, 17px);
  font-weight: 700;
  display: inline-flex;
}

.tav-mail svg {
  fill: none;
  width: 19px;
  height: 19px;
  stroke: var(--pv2b);
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tav-final {
  text-align: center;
  font-family: var(--font-display);
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(24px, 2.6vw, 38px);
  font-weight: 800;
  line-height: 1.25;
}

.tav-final b {
  background: linear-gradient(100deg, var(--pv2a), var(--pv2b));
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.uk-phone {
  text-align: left;
  border: 1px solid rgba(var(--pv2),.3);
  background: #090b14f2;
  border-radius: 18px;
  flex-direction: column;
  gap: 12px;
  width: min(100%, 400px);
  padding: 16px;
  display: flex;
  box-shadow: 0 24px 60px #00000080;
}

.uk-push {
  color: var(--text-primary);
  background: rgba(var(--pv2),.1);
  border: 1px solid rgba(var(--pv2),.4);
  border-radius: 12px;
  align-items: center;
  gap: 9px;
  padding: 11px 14px;
  font-size: clamp(13px, 1.2vw, 15.5px);
  font-weight: 700;
  display: flex;
}

.uk-push i {
  background: var(--pv2b);
  width: 8px;
  height: 8px;
  box-shadow: 0 0 8px var(--pv2b);
  border-radius: 50%;
  flex: none;
}

.uk-head {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 800;
}

.uk-tl {
  flex-direction: column;
  display: flex;
}

.uk-tl-item {
  color: var(--text-primary);
  border-left: 2px solid rgba(var(--pv2),.4);
  align-items: baseline;
  gap: 12px;
  padding: 10px 0 10px 18px;
  font-size: clamp(13.5px, 1.25vw, 16px);
  font-weight: 600;
  display: flex;
  position: relative;
}

.uk-tl-item:before {
  content: "";
  background: rgba(var(--pv2),.25);
  border: 2px solid var(--pv2b);
  border-radius: 50%;
  width: 10px;
  height: 10px;
  position: absolute;
  top: 50%;
  left: -6px;
  transform: translateY(-50%);
}

.uk-tl-item b {
  font-family: var(--font-display);
  color: var(--text-muted);
  min-width: 52px;
  font-size: .85em;
}

.uk-tabs {
  color: var(--text-muted);
  font-size: 12px;
}

.uk-call {
  text-align: center;
  border: 1px solid rgba(var(--pv2),.3);
  background: #090b14f2;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: min(100%, 420px);
  padding: 20px;
  display: flex;
}

.uk-call .pnv-ava {
  background: rgba(var(--pv2),.12);
  border-color: rgba(var(--pv2),.4);
}

.uk-call .pnv-ava svg {
  stroke: var(--pv2b);
}

.uk-call .pnv-wave i {
  background: rgba(var(--pv2),.75);
}

.uk-call-t {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(15px, 1.5vw, 20px);
  font-weight: 700;
}

.uk-cal {
  background: rgba(var(--pv2),.08);
  border: 1px solid rgba(var(--pv2),.35);
  color: var(--text-primary);
  opacity: 0;
  transition: opacity .5s var(--ease-out) .9s, transform .55s var(--ease-out) .9s;
  border-radius: 14px;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  font-size: clamp(14px, 1.3vw, 17px);
  display: inline-flex;
  transform: translateY(10px);
}

#scene-utankovetes[data-sub="1"] .uk-cal {
  transition: none;
  animation: 8s infinite uk-in-loop;
}

@keyframes uk-in-loop {
  0%, 8% {
    opacity: 0;
    transform: translateY(10px);
  }

  18%, 88% {
    opacity: 1;
    transform: none;
  }

  96%, 100% {
    opacity: 0;
    transform: translateY(10px);
  }
}

.uk-cal svg {
  fill: none;
  width: 20px;
  height: 20px;
  stroke: var(--pv2b);
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.uk-cal b {
  font-family: var(--font-display);
  font-weight: 800;
}

.uk-cal .uk-ok {
  stroke-width: 2.6px;
}

.uk-offer {
  text-align: left;
  border: 1px solid rgba(var(--pv2),.3);
  opacity: 0;
  width: min(100%, 420px);
  transition: opacity .45s var(--ease-out), transform .5s var(--ease-out);
  background: #090b14f2;
  border-radius: 14px;
  flex-direction: column;
  gap: 4px;
  padding: 15px 20px;
  display: flex;
  transform: translateX(-16px);
}

#scene-utankovetes[data-sub="2"] .uk-offer {
  transition: none;
  animation: 9s infinite uk-offer-loop;
}

#scene-utankovetes[data-sub="2"] .uk-offer:nth-child(2) {
  animation-delay: .3s;
}

#scene-utankovetes[data-sub="2"] .uk-offer:nth-child(3) {
  animation-delay: .6s;
}

@keyframes uk-offer-loop {
  0%, 5% {
    opacity: 0;
    transform: translateX(-16px);
  }

  14%, 86% {
    opacity: 1;
    transform: none;
  }

  94%, 100% {
    opacity: 0;
    transform: translateX(-16px);
  }
}

.uk-offer b {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(15px, 1.4vw, 19px);
  font-weight: 800;
}

.uk-offer em {
  color: var(--pv2b);
  font-size: clamp(12.5px, 1.15vw, 15px);
  font-style: normal;
  font-weight: 600;
}

.uk-fb {
  text-align: center;
  border: 1px solid rgba(var(--pv2),.3);
  background: #090b14f2;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: min(100%, 420px);
  padding: 24px 20px;
  display: flex;
}

.uk-fb-q {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(17px, 1.7vw, 23px);
  font-weight: 800;
}

.uk-stars {
  color: rgba(var(--pv2),.9);
  gap: 8px;
  font-size: clamp(24px, 2.4vw, 34px);
  display: flex;
}

.uk-stars i {
  opacity: 0;
  transition: opacity .35s var(--ease-out), transform .4s var(--ease-out);
  font-style: normal;
  transform: scale(.5);
}

#scene-utankovetes[data-sub="3"] .uk-stars i {
  transition: none;
  animation: 7s infinite uk-star-loop;
}

#scene-utankovetes[data-sub="3"] .uk-stars i:nth-child(2) {
  animation-delay: .14s;
}

#scene-utankovetes[data-sub="3"] .uk-stars i:nth-child(3) {
  animation-delay: .28s;
}

#scene-utankovetes[data-sub="3"] .uk-stars i:nth-child(4) {
  animation-delay: .42s;
}

#scene-utankovetes[data-sub="3"] .uk-stars i:nth-child(5) {
  animation-delay: .56s;
}

@keyframes uk-star-loop {
  0%, 5% {
    opacity: 0;
    transform: scale(.5);
  }

  13%, 86% {
    opacity: 1;
    transform: none;
  }

  94%, 100% {
    opacity: 0;
    transform: scale(.5);
  }
}

.uk-fb-note {
  color: var(--text-secondary);
  align-items: center;
  gap: 9px;
  font-size: clamp(13px, 1.2vw, 16px);
  font-weight: 600;
  display: inline-flex;
}

.uk-fb-note svg {
  fill: none;
  width: 17px;
  height: 17px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.mobile .tav-s, body.reduced .tav-s, body.mobile .uk-s, body.reduced .uk-s {
  opacity: 1;
  pointer-events: auto;
  position: static;
  transform: none;
}

body.mobile .mk-tav, body.reduced .mk-tav, body.mobile .mk-uk, body.reduced .mk-uk {
  flex-direction: column;
  gap: 26px;
  display: flex;
}

body.mobile #scene-ellatas-utan .st-visual, body.reduced #scene-ellatas-utan .st-visual, body.mobile #scene-utankovetes .st-visual, body.reduced #scene-utankovetes .st-visual {
  aspect-ratio: auto;
  height: auto;
  min-height: 0;
}

body.mobile .tav-ghost, body.reduced .tav-ghost {
  opacity: .25;
}

body.mobile .tav-btn, body.reduced .tav-btn {
  display: none;
}

body.mobile .tav-done, body.reduced .tav-done {
  opacity: 1;
  display: flex;
  transform: none;
}

body.mobile .uk-cal, body.reduced .uk-cal, body.mobile .uk-offer, body.reduced .uk-offer, body.mobile .uk-stars i, body.reduced .uk-stars i {
  opacity: 1;
  transform: none;
}

body.mobile #scene-ellatas-utan .beat-bullet, body.mobile #scene-utankovetes .beat-bullet {
  opacity: 1 !important;
}

.st-time {
  border-radius: var(--radius-pill);
  letter-spacing: .06em;
  color: var(--text-secondary);
  z-index: 1;
  opacity: var(--ep);
  transform: translateY(calc((1 - var(--ep)) * 12px));
  background: #ffffff0b;
  border: 1px solid #ffffff1f;
  align-self: flex-start;
  align-items: center;
  gap: 8px;
  margin: -6px 0 14px;
  padding: 5px 13px;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  position: relative;
}

.st-time i {
  background: var(--pv2b);
  border-radius: 50%;
  width: 7px;
  height: 7px;
}

.st-copy {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.beat--showcase {
  border: 1px solid rgba(var(--pv2),.32);
  box-shadow: 0 0 0 1px rgba(var(--pv2),.1), 0 0 72px rgba(var(--pv2),.14), 0 24px 56px #00000080;
  background: linear-gradient(#0f11248c, #090c18a6);
}

.beat--showcase .beat-title {
  color: var(--text-primary);
}

.beat--showcase .beat-bullet {
  color: var(--text-secondary);
}

.beat--showcase .beat-bullet:before {
  background: var(--pv2b);
}

.beat--showcase .st-icon {
  color: var(--pv2b);
}

.beat--showcase .beat-tag {
  background: rgba(var(--pv2),.1);
  color: var(--pv2b);
  border: 1px solid rgba(var(--pv2),.36);
}

.st-beats .beat--showcase {
  opacity: var(--ep);
  transform: translateY(calc((1 - var(--ep)) * 24px));
  transition: none;
}

.station.showcase .st-beats {
  min-height: clamp(240px, 36vh, 400px);
}

.beat-close {
  font-family: var(--font-display);
  color: var(--text-secondary);
  opacity: clamp(0, calc((var(--sp) - .8) * 5), 1);
  transform: translateY(calc((1 - clamp(0, (var(--sp) - .8) * 5, 1)) * 12px));
  margin: 18px 0 0;
  font-size: clamp(17px, 1.7vw, 24px);
  font-weight: 700;
  line-height: 1.3;
}

.beat-close b {
  color: var(--pv2b);
}

#scene-erkezes-elott .beat-bullet {
  transition: opacity .4s var(--ease-out), color .4s var(--ease-out);
}

#scene-erkezes-elott[data-sub="0"] .beat-bullet:nth-child(2), #scene-erkezes-elott[data-sub="0"] .beat-bullet:nth-child(3), #scene-erkezes-elott[data-sub="1"] .beat-bullet:first-child, #scene-erkezes-elott[data-sub="1"] .beat-bullet:nth-child(3), #scene-erkezes-elott[data-sub="2"] .beat-bullet:first-child, #scene-erkezes-elott[data-sub="2"] .beat-bullet:nth-child(2) {
  opacity: .38;
}

.mk-a2 {
  width: 100%;
  display: grid;
  position: relative;
}

.a2-scene {
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s var(--ease-out), transform .55s var(--ease-out);
  flex-direction: column;
  grid-area: 1 / 1;
  align-items: center;
  gap: 18px;
  display: flex;
  transform: translateY(14px);
}

#scene-erkezes-elott[data-sub="0"] .a2-s0, #scene-erkezes-elott[data-sub="1"] .a2-s1, #scene-erkezes-elott[data-sub="2"] .a2-s2 {
  opacity: 1;
  transform: none;
}

.a2-glow {
  z-index: -1;
  background: radial-gradient(50% 50% at 50% 42%, #B53ED033, #0000 72%);
  border-radius: 50%;
  position: absolute;
  inset: -14%;
}

.a2-phone {
  border: 1px solid rgba(var(--pv2),.28);
  background: #080a14f2;
  border-radius: 20px;
  flex-direction: column;
  width: min(88%, 380px);
  padding: 20px 22px;
  display: flex;
  box-shadow: 0 24px 60px #0000008c;
}

.a2-ph-head {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-secondary);
  border-bottom: 1px solid #ffffff14;
  padding-bottom: 12px;
  font-size: 15px;
  font-weight: 800;
}

.a2-f {
  border-bottom: 1px dashed #ffffff14;
  grid-template-columns: 1fr auto 26px;
  align-items: center;
  gap: 12px;
  padding: 13px 0;
  display: grid;
}

.a2-f:last-of-type {
  border-bottom: 0;
}

.a2-f span {
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 600;
}

.a2-f b {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(15px, 1.4vw, 19px);
  font-weight: 700;
}

.a2-f svg {
  fill: none;
  width: 20px;
  height: 20px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
  transition: opacity .35s var(--ease-out), transform .4s var(--ease-out);
  transform: scale(.5);
}

#scene-erkezes-elott[data-sub="0"] .a2-f svg {
  transition: none;
  animation: 7s infinite a2-ok-loop;
}

#scene-erkezes-elott[data-sub="0"] .a2-f:first-of-type svg {
  animation-delay: .3s;
}

#scene-erkezes-elott[data-sub="0"] .a2-f:nth-of-type(2) svg {
  animation-delay: .55s;
}

#scene-erkezes-elott[data-sub="0"] .a2-f:nth-of-type(3) svg {
  animation-delay: .8s;
}

@keyframes a2-ok-loop {
  0%, 4% {
    opacity: 0;
    transform: scale(.5);
  }

  12%, 86% {
    opacity: 1;
    transform: none;
  }

  94%, 100% {
    opacity: 0;
    transform: scale(.5);
  }
}

.a2-caption {
  color: var(--text-secondary);
  font-size: clamp(14px, 1.35vw, 18px);
  font-weight: 600;
}

.a2-docs {
  flex-direction: column;
  gap: 10px;
  width: min(88%, 380px);
  display: flex;
}

.a2-doc {
  border: 1px solid rgba(var(--pv2),.26);
  opacity: 0;
  transition: opacity .45s var(--ease-out), transform .5s var(--ease-out);
  background: #080a14f2;
  border-radius: 13px;
  align-items: center;
  gap: 12px;
  padding: 13px 18px;
  display: flex;
  transform: translateX(-14px);
}

#scene-erkezes-elott[data-sub="1"] .a2-doc {
  opacity: 1;
  transform: none;
}

#scene-erkezes-elott[data-sub="1"] .a2-doc:nth-of-type(2) {
  transition-delay: .2s;
}

#scene-erkezes-elott[data-sub="1"] .a2-doc:nth-of-type(3) {
  transition-delay: .4s;
}

.a2-doc b {
  color: var(--text-primary);
  flex: 1;
  font-size: clamp(14px, 1.3vw, 17px);
  font-weight: 700;
}

.a2-doc svg {
  fill: none;
  width: 19px;
  height: 19px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.a2-pad {
  text-align: center;
  background: #0e141ef2;
  border: 1px solid #8FD3F266;
  border-radius: 16px;
  width: min(88%, 380px);
  padding: 16px 18px 14px;
}

.a2-sign {
  width: 82%;
  height: auto;
  margin: 0 auto;
  display: block;
}

.a2-sign path {
  fill: none;
  stroke: rgba(var(--pv2l),.92);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-dasharray: 420;
  stroke-dashoffset: 420px;
}

#scene-erkezes-elott[data-sub="1"] .a2-sign path {
  animation: a2-sign-loop 7s var(--ease-out) .55s infinite;
}

@keyframes a2-signdraw {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes a2-sign-loop {
  0%, 4% {
    stroke-dashoffset: 420px;
  }

  26%, 90% {
    stroke-dashoffset: 0;
  }

  97%, 100% {
    stroke-dashoffset: 420px;
  }
}

.a2-pad-lb {
  color: var(--text-secondary);
  margin-top: 8px;
  font-size: clamp(14px, 1.3vw, 17px);
  font-weight: 700;
  display: block;
}

.a2-call {
  text-align: center;
  border: 1px solid rgba(var(--pv2),.28);
  background: #080a14f2;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: min(88%, 400px);
  padding: 20px;
  display: flex;
}

.a2-call-t {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(16px, 1.6vw, 21px);
  font-weight: 700;
}

.a2-check {
  flex-direction: column;
  gap: 9px;
  width: min(88%, 400px);
  display: flex;
}

.a2-ck {
  border-radius: var(--radius-pill);
  color: var(--text-primary);
  background: rgba(var(--pv2),.08);
  border: 1px solid rgba(var(--pv2),.32);
  opacity: 0;
  transition: opacity .45s var(--ease-out), transform .5s var(--ease-out);
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  font-size: clamp(14px, 1.35vw, 18px);
  font-weight: 700;
  display: flex;
  transform: translateY(8px);
}

#scene-erkezes-elott[data-sub="2"] .a2-ck {
  transition: none;
  animation: 8s infinite uk-offer-loop;
}

#scene-erkezes-elott[data-sub="2"] .a2-ck:nth-of-type(2) {
  animation-delay: .3s;
}

#scene-erkezes-elott[data-sub="2"] .a2-ck:nth-of-type(3) {
  animation-delay: .6s;
}

.a2-ck svg {
  fill: none;
  width: 19px;
  height: 19px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: none;
}

body.reduced .a2-scene, body.mobile .a2-scene {
  opacity: 1;
  position: static;
  transform: none;
}

body.reduced .mk-a2, body.mobile .mk-a2 {
  flex-direction: column;
  gap: 26px;
  display: flex;
}

body.reduced .a2-f svg, body.reduced .a2-doc, body.reduced .a2-ck, body.mobile .a2-f svg, body.mobile .a2-doc, body.mobile .a2-ck {
  opacity: 1;
  transition: none;
  transform: none;
}

body.reduced .a2-sign path, body.mobile .a2-sign path {
  stroke-dashoffset: 0;
  animation: none;
}

body.reduced .beat-close, body.mobile .beat-close {
  opacity: 1;
  transform: none;
}

body.mobile #scene-erkezes-elott .beat-bullet {
  opacity: 1 !important;
}

.station.oneshot .st-sticky {
  justify-content: center;
  align-items: center;
  display: flex;
}

.os-wrap {
  text-align: center;
  flex-direction: column;
  align-items: center;
  width: min(1200px, 94vw);
  display: flex;
}

.os-title {
  max-width: 26ch;
  margin-bottom: clamp(14px, 2.4vh, 26px);
}

.os-stage {
  width: 100%;
  position: relative;
}

.os-scene {
  border: 1px solid rgba(var(--pv2),.18);
  background: linear-gradient(#090a14f5, #070810fa);
  border-radius: 24px;
  width: 100%;
  height: clamp(380px, 58svh, 560px);
  position: relative;
  overflow: hidden;
  box-shadow: 0 30px 80px #0000008c;
}

.os-corridor {
  position: absolute;
  inset: 0;
}

.os-walls {
  width: 100%;
  height: 100%;
  transform: scale(calc(1 + var(--sp) * .85));
  transform-origin: 50% 45%;
}

.os-ln {
  fill: none;
  stroke: #94a3b838;
  stroke-width: 1.6px;
}

.os-seam {
  stroke: #94a3b821;
}

.os-door {
  fill: #0f1222e6;
  stroke: rgba(var(--pv2),.4);
  stroke-width: 1.6px;
}

.os-doorglow {
  fill: rgba(var(--pv2),.16);
  stroke: none;
  opacity: calc(.2 + var(--sp) * .8);
}

.os-strip {
  fill: url("#spineGrad");
}

.os-scene .os-strip {
  fill: rgba(var(--pv2),.16);
  stroke: rgba(var(--pv2),.45);
  stroke-width: 1.2px;
}

.os-tv {
  fill: #0b0e1af2;
  stroke: #8FD3F266;
  stroke-width: 1.2px;
  opacity: calc(.25 + var(--sp) * .75);
}

.os-fog {
  opacity: calc(.9 - var(--sp) * .65);
  background: radial-gradient(46% 40% at 50% 45%, #070810b3, #0000 76%);
  position: absolute;
  inset: 0;
}

.os-warm {
  pointer-events: none;
  opacity: clamp(0, calc((var(--sp) - .68) * 3), 1);
  background: radial-gradient(52% 46% at 50% 52%, #ffbe7829, #0000 74%);
  position: absolute;
  inset: 0;
}

.os-anna {
  width: clamp(60px, 8vh, 84px);
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
}

.os-anna svg {
  fill: none;
  width: 100%;
  height: auto;
  stroke: rgba(var(--pv2l),.85);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
  animation: 2.6s ease-in-out infinite os-bob;
}

@keyframes os-bob {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-5px);
  }
}

.os-mil {
  text-align: left;
  opacity: 0;
  pointer-events: none;
  filter: drop-shadow(0 6px 30px #000000d9);
  max-width: min(46%, 430px);
  transition: opacity .5s var(--ease-out), transform .6s var(--ease-out);
  padding: 0;
  position: absolute;
  top: 10%;
}

.os-m0 {
  left: 4%;
  transform: translateX(-26px);
}

.os-m1 {
  right: 4%;
  transform: translateX(26px);
}

.os-m2 {
  max-width: min(52%, 470px);
  left: 4%;
  transform: translateX(-26px);
}

.station.oneshot[data-sub="0"] .os-m0, .station.oneshot[data-sub="1"] .os-m1, .station.oneshot[data-sub="2"] .os-m2 {
  opacity: 1;
  transform: translateX(0);
}

.os-mil-t {
  font-family: var(--font-display);
  color: var(--text-primary);
  text-shadow: 0 2px 24px #000000e6;
  margin: 0 0 16px;
  font-size: clamp(24px, 2.6vw, 38px);
  font-weight: 800;
  line-height: 1.15;
}

.os-mil-t b {
  background: linear-gradient(100deg, var(--pv2a), var(--pv2b));
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.os-mil-vis {
  align-items: center;
  gap: 14px;
  display: flex;
}

.os-mil-vis--col {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

.os-qr {
  background: #ffffff0f;
  border: 1px solid #ffffff29;
  border-radius: 8px;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  width: 40px;
  height: 40px;
  padding: 5px;
  display: grid;
}

.os-qr i {
  background: rgba(var(--pv2l),.8);
  border-radius: 2px;
}

.os-arrow {
  fill: none;
  stroke: #8FD3F2cc;
  stroke-width: 2.2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 20px;
  height: 20px;
}

.os-kioskchip {
  color: var(--text-primary);
  background: rgba(var(--pv2),.1);
  border: 1px solid rgba(var(--pv2),.4);
  border-radius: 12px;
  padding: 9px 18px;
  font-size: clamp(14px, 1.3vw, 17px);
  font-weight: 700;
}

.os-ok {
  fill: none;
  width: 26px;
  height: 26px;
  stroke: var(--pv2b);
  stroke-width: 2.8px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.os-docchip {
  border-radius: var(--radius-pill);
  color: var(--text-primary);
  white-space: normal;
  background: rgba(var(--pv2),.08);
  border: 1px solid rgba(var(--pv2),.32);
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  font-size: clamp(14px, 1.3vw, 17px);
  font-weight: 700;
  display: inline-flex;
}

body.mobile .os-mil-vis--col {
  margin-top: 8px;
}

body.mobile .os-mil {
  filter: none;
  border: 1px solid rgba(var(--pv2),.24);
  background: #090b16eb;
  border-radius: 16px;
  padding: 18px;
}

body.mobile #scene-erkezes-elott .st-visual, body.reduced #scene-erkezes-elott .st-visual {
  aspect-ratio: auto;
  height: auto;
  min-height: 0;
}

body.mobile #scene-erkezes-elott .mk-stage, body.mobile #scene-erkezes-elott .mk-patient, body.reduced #scene-erkezes-elott .mk-stage, body.reduced #scene-erkezes-elott .mk-patient {
  height: auto;
}

.os-docchip svg {
  fill: none;
  width: 17px;
  height: 17px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.os-sign {
  width: 100%;
  height: auto;
}

.os-sign path {
  fill: none;
  stroke: rgba(var(--pv2l),.9);
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-dasharray: 380;
  stroke-dashoffset: 380px;
}

.station.oneshot[data-sub="1"] .os-sign path {
  animation: a2-signdraw 1.2s var(--ease-out) .4s forwards;
}

.os-kiosk-ui {
  border: 1px solid rgba(var(--pv2),.35);
  background: #080b14f5;
  border-radius: 14px;
  flex-direction: column;
  gap: 6px;
  padding: 16px 18px;
  display: flex;
}

.os-kui-head {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--pv2b);
  font-size: clamp(13px, 1.15vw, 15px);
  font-weight: 700;
}

.os-kui-place {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(17px, 1.7vw, 24px);
  font-weight: 800;
}

.os-kui-next {
  color: var(--text-secondary);
  font-size: clamp(14px, 1.35vw, 18px);
  font-weight: 700;
}

.os-tvchip {
  background: #0b0e1af2;
  border: 1px solid #8FD3F266;
  border-radius: 12px;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  padding: 10px 16px;
  display: inline-flex;
}

.os-tvchip b {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  font-size: clamp(16px, 1.6vw, 22px);
  font-weight: 800;
}

.os-tvchip svg {
  fill: none;
  width: 20px;
  height: 20px;
  stroke: var(--pv2a);
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.os-tvchip em {
  color: var(--text-secondary);
  font-size: clamp(12.5px, 1.15vw, 15px);
  font-style: normal;
  font-weight: 600;
}

.os-final {
  opacity: 0;
  pointer-events: none;
  transition: opacity .7s var(--ease-out);
  background: radial-gradient(70% 60% at 50% 62%, #ffbe7824, #0000 76%);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  padding: 24px;
  display: flex;
  position: absolute;
  inset: 0;
}

.station.oneshot[data-sub="3"] .os-final {
  opacity: 1;
}

.station.oneshot[data-sub="3"] .os-mil {
  opacity: 0;
}

.os-pult svg {
  fill: none;
  stroke: #ffd6aad9;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 26px #ffbe784d);
  width: clamp(150px, 20vh, 210px);
  height: auto;
}

.os-close {
  max-width: 24ch;
  font-family: var(--font-display);
  letter-spacing: -.015em;
  color: var(--text-primary);
  margin: 0;
  font-size: clamp(26px, 3vw, 46px);
  font-weight: 800;
  line-height: 1.15;
}

.os-close b {
  background: linear-gradient(100deg, #ffd6aa, #ffb878);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

body.mobile .os-scene, body.reduced .os-scene {
  height: auto;
  box-shadow: none;
  background: none;
  border: 0;
  flex-direction: column;
  gap: 18px;
  display: flex;
  overflow: visible;
}

body.mobile .os-corridor, body.reduced .os-corridor {
  border: 1px solid rgba(var(--pv2),.18);
  background: linear-gradient(#090a14f5, #070810fa);
  border-radius: 18px;
  height: 200px;
  position: relative;
  overflow: hidden;
}

body.mobile .os-walls, body.reduced .os-walls {
  transform: scale(1.25);
}

body.mobile .os-anna, body.reduced .os-anna {
  z-index: 2;
  width: 54px;
  position: absolute;
  top: 92px;
  bottom: auto;
}

body.mobile .os-mil, body.reduced .os-mil, body.mobile .os-m2, body.reduced .os-m2 {
  opacity: 1;
  pointer-events: auto;
  max-width: none;
  position: static;
  transform: none;
}

body.mobile .os-final, body.reduced .os-final {
  opacity: 1;
  pointer-events: auto;
  border: 1px solid #ffbe7838;
  border-radius: 18px;
  padding: 26px 18px;
  position: static;
}

body.mobile .os-sign path, body.reduced .os-sign path {
  stroke-dashoffset: 0;
  animation: none;
}

body.mobile .station.oneshot[data-sub="3"] .os-mil {
  opacity: 1;
}

body.mobile .os-fog, body.reduced .os-fog {
  opacity: .35;
}

body.mobile .os-warm, body.reduced .os-warm {
  opacity: 0;
}

.pnyito {
  z-index: 3;
  min-height: 100svh;
  position: relative;
}

.pn-stick {
  justify-content: center;
  align-items: center;
  min-height: 100svh;
  padding: clamp(40px, 6vh, 90px) 24px;
  display: flex;
}

body.desktop .pnyito {
  height: 620svh;
}

body.desktop .pn-stick {
  height: 100svh;
  position: sticky;
  top: 0;
}

.pn-inner {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 1100px;
  display: flex;
}

.pn-stage {
  width: 100%;
  max-width: 1120px;
  height: clamp(380px, 56svh, 540px);
  margin-top: 10px;
  position: relative;
}

.pn-stage .pn-orbit {
  transition: transform .9s var(--ease-out);
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.pnyito[data-phase="spot"] .pn-stage .pn-orbit {
  transform: translate(-168%, -50%) scale(.52);
}

.pns-panel {
  opacity: 0;
  pointer-events: none;
  width: min(68%, 760px);
  transition: opacity .6s var(--ease-out), transform .7s var(--ease-out);
  display: grid;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(28px, -50%);
}

.pnyito[data-phase="spot"] .pns-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translate(0, -50%);
}

.pn-stage:before {
  content: "";
  background: repeating-linear-gradient(90deg, rgba(var(--pv2),.65) 0 7px, transparent 7px 14px);
  opacity: 0;
  width: 16%;
  height: 2px;
  transition: opacity .6s var(--ease-out);
  pointer-events: none;
  position: absolute;
  top: 50%;
  left: 17%;
}

.pnyito[data-phase="spot"] .pn-stage:before {
  opacity: 1;
}

.pn-sub {
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
}

.pnyito[data-phase="spot"] .pn-sub {
  opacity: 0;
  height: 0;
  margin: 0;
  overflow: hidden;
  transform: translateY(-6px);
}

.pn-title {
  transition: font-size .6s var(--ease-out);
}

.pnyito[data-phase="spot"] .pn-title {
  font-size: clamp(24px, 2.6vw, 38px);
}

.pnyito[data-phase="spot"] .pn-rot, .pnyito[data-phase="spot"] .pn-ico {
  animation: none;
}

.pnyito[data-phase="spot"] .pn-ico {
  transition: opacity .45s var(--ease-out), scale .45s var(--ease-out),
  background .45s var(--ease-out), box-shadow .45s var(--ease-out);
  opacity: .3;
  scale: .74;
}

.pnyito[data-spot="0"] .pn-ico[data-ch="chat"], .pnyito[data-spot="1"] .pn-ico[data-ch="ai"], .pnyito[data-spot="2"] .pn-ico[data-ch="web"], .pnyito[data-spot="3"] .pn-ico[data-ch="dap"], .pnyito[data-spot="4"] .pn-ico[data-ch="call"] {
  opacity: 1;
  background: linear-gradient(135deg, color-mix(in srgb, var(--pv2b) 42%, #0a0a14), color-mix(in srgb, var(--pv2b) 20%, #0a0a14));
  box-shadow: 0 0 0 3px #0a0e0ccc, 0 0 26px rgba(var(--pv2),.55);
  scale: 1;
}

.pns-card {
  text-align: left;
  box-shadow: none;
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s var(--ease-out), transform .6s var(--ease-out);
  background: none;
  border: 0;
  flex-direction: column;
  grid-area: 1 / 1;
  gap: 16px;
  padding: 0;
  display: flex;
  transform: translateY(26px) scale(.97);
}

.pnyito[data-spot="0"] .pns-card[data-ch="chat"], .pnyito[data-spot="1"] .pns-card[data-ch="ai"], .pnyito[data-spot="2"] .pns-card[data-ch="web"], .pnyito[data-spot="3"] .pns-card[data-ch="dap"], .pnyito[data-spot="4"] .pns-card[data-ch="call"] {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.pns-card h3 {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  color: var(--text-primary);
  margin: 0;
  font-size: clamp(30px, 3.4vw, 52px);
  font-weight: 800;
}

.pns-pts {
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.pns-pts li {
  font-family: var(--font-display);
  color: var(--text-primary);
  padding-left: 34px;
  font-size: clamp(19px, 2vw, 28px);
  font-weight: 700;
  line-height: 1.25;
  position: relative;
}

.pns-pts li:before {
  content: "";
  background: linear-gradient(90deg, var(--pv2b), rgba(var(--pv2),.2));
  border-radius: 2px;
  width: 20px;
  height: 4px;
  position: absolute;
  top: .52em;
  left: 0;
}

.pns-mock {
  border: 1px solid rgba(var(--pv2),.22);
  box-shadow: 0 30px 80px #0009, 0 0 90px rgba(var(--pv2),.1);
  background: linear-gradient(#0b0d1af5, #080912fa);
  border-radius: 20px;
  flex-direction: column;
  gap: 16px;
  padding: clamp(22px, 2.4vw, 36px);
  font-size: 17px;
  animation: 7s ease-in-out infinite pns-float;
  display: flex;
}

@keyframes pns-float {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-9px);
  }
}

body.reduced .pns-mock {
  animation: none;
}

.pns-panel {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: clamp(22px, 2.6vw, 44px);
  display: grid;
}

body.desktop .pns-panel {
  align-items: center;
  height: 100%;
  top: 0;
  transform: translate(28px);
}

body.desktop .pnyito[data-phase="spot"] .pns-panel {
  transform: translate(0);
}

body.desktop .pnx-phone {
  width: auto;
  height: clamp(370px, 54svh, 540px);
}

.pnx-phone {
  aspect-ratio: 9 / 18.6;
  border: 1.5px solid rgba(var(--pv2),.32);
  width: clamp(250px, 26svh, 310px);
  box-shadow: inset 0 0 0 4px #000000a6, 0 34px 90px #000000a6, 0 0 90px rgba(var(--pv2),.14);
  background: linear-gradient(#101222fa, #090a14fc);
  border-radius: 42px;
  padding: 46px 12px 18px;
  animation: 7s ease-in-out infinite pns-float;
  position: relative;
}

.pns-ph-island {
  border-radius: var(--radius-pill);
  z-index: 2;
  background: #000;
  width: 86px;
  height: 20px;
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: inset 0 0 0 1px #ffffff0f;
}

.pns-ph-status {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  z-index: 2;
  font-size: 11.5px;
  font-weight: 700;
  position: absolute;
  top: 17px;
  right: 24px;
}

.pnx-screen {
  background: #080a14f5;
  border-radius: 24px;
  width: 100%;
  height: 100%;
  display: grid;
  position: relative;
  overflow: hidden;
}

.pnx-scr {
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s var(--ease-out), transform .55s var(--ease-out);
  flex-direction: column;
  grid-area: 1 / 1;
  gap: 10px;
  padding: 14px 12px;
  display: flex;
  transform: scale(.97);
}

.pnx-scr--center {
  text-align: center;
  justify-content: center;
  align-items: center;
  gap: 14px;
}

.pnyito[data-spot="0"] .pnx-scr[data-ch="chat"], .pnyito[data-spot="1"] .pnx-scr[data-ch="ai"], .pnyito[data-spot="2"] .pnx-scr[data-ch="web"], .pnyito[data-spot="3"] .pnx-scr[data-ch="dap"], .pnyito[data-spot="4"] .pnx-scr[data-ch="call"] {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.pnx-appbar {
  color: var(--text-primary);
  border-bottom: 1px solid #ffffff14;
  align-items: center;
  gap: 8px;
  padding-bottom: 10px;
  font-size: 13px;
  font-weight: 700;
  display: flex;
}

.pnx-appbar i {
  background: var(--pv2b);
  width: 8px;
  height: 8px;
  box-shadow: 0 0 8px var(--pv2b);
  border-radius: 50%;
}

.pnx-appbar em {
  color: var(--text-muted);
  margin-left: auto;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
}

.pnx-input {
  border-radius: var(--radius-pill);
  color: var(--text-muted);
  background: #ffffff0d;
  border: 1px solid #ffffff1a;
  align-items: center;
  margin-top: auto;
  padding: 10px 14px;
  font-size: 12px;
  display: flex;
}

.pnx-input i {
  background: rgba(var(--pv2l),.7);
  border-radius: 1px;
  width: 8px;
  height: 15px;
  margin-left: auto;
  animation: 1.1s steps(2, end) infinite pnx-caret;
}

@keyframes pnx-caret {
  50% {
    opacity: 0;
  }
}

.pnx-callstate {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-size: 11.5px;
  font-weight: 700;
}

.pnx-endcall {
  background: #f05a5ad9;
  border-radius: 50%;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-top: 14px;
  display: grid;
}

.pnx-endcall svg {
  fill: none;
  stroke: #fff;
  stroke-width: 1.8px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 24px;
  height: 24px;
  transform: rotate(135deg);
}

.pnx-urlbar {
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  background: #ffffff0f;
  border: 1px solid #ffffff1a;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.pnx-urlbar svg {
  fill: none;
  width: 13px;
  height: 13px;
  stroke: var(--pv2b);
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pnx-tiles {
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: auto;
  display: grid;
}

.pnx-tiles b {
  text-align: center;
  color: var(--text-secondary);
  background: #ffffff0b;
  border: 1px solid #ffffff1a;
  border-radius: 12px;
  padding: 14px 10px;
  font-size: 12px;
  font-weight: 700;
}

.pnx-scr .pnc-b {
  max-width: 92%;
  padding: 10px 13px;
  font-size: 14px;
  font-weight: 600;
}

.pnx-scr .pnc-slots {
  gap: 7px;
}

.pnx-scr .pnc-slots b {
  padding: 8px 13px;
  font-size: 13px;
}

.pnx-scr .pnv-name {
  font-size: 17px;
}

.pnx-scr .pnv-ava {
  width: 64px;
  height: 64px;
}

.pnx-scr .pnv-chips {
  flex-wrap: wrap;
  justify-content: center;
}

.pnx-scr .pnv-chips b {
  padding: 7px 13px;
  font-size: 12px;
}

.pnx-scr .pnw-btn {
  padding: 10px 18px;
  font-size: 13px;
}

.pnx-scr .pnw-toast {
  padding: 7px 13px;
  font-size: 12px;
}

.pnx-scr .pna-push {
  padding: 11px 13px;
  font-size: 12.5px;
}

.pnx-scr .pna-card b {
  font-size: 12.5px;
}

.pnx-scr .pna-card em {
  font-size: 15px;
}

.pnx-scr .pnl-hello {
  font-size: 21px;
}

.pnx-scr .pnl-mini b {
  font-size: 14px;
}

.pnx-scr .pnl-mini em {
  font-size: 12px;
}

.pnx-copy {
  align-items: center;
  min-width: 0;
  display: grid;
}

body.reduced .pnx-phone {
  animation: none;
}

body.reduced .pnx-scr {
  opacity: 1;
  position: static;
  transform: none;
}

body.reduced .pnx-screen {
  flex-direction: column;
  display: flex;
}

.pnc-head {
  color: var(--text-primary);
  border-bottom: 1px solid #ffffff12;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
  padding-bottom: 10px;
  font-size: 13.5px;
  font-weight: 700;
  display: flex;
}

.pnc-head i {
  background: var(--pv2b);
  width: 9px;
  height: 9px;
  box-shadow: 0 0 8px var(--pv2b);
  border-radius: 50%;
}

.pnc-head em {
  color: var(--text-muted);
  margin-left: auto;
  font-size: 11.5px;
  font-style: normal;
  font-weight: 500;
}

.pnc-b {
  border-radius: 16px;
  max-width: 88%;
  padding: 14px 20px;
  font-size: clamp(17px, 1.7vw, 23px);
  font-weight: 600;
  line-height: 1.4;
}

.pnc-u {
  color: #fff;
  background: var(--grad-signature);
  border-bottom-right-radius: 4px;
  align-self: flex-end;
}

.pnc-a {
  color: var(--text-secondary);
  background: #ffffff0f;
  border-bottom-left-radius: 4px;
  align-self: flex-start;
}

.pnc-a em {
  color: var(--pv2b);
  font-style: normal;
}

.pnc-slots {
  gap: 12px;
  display: flex;
}

.pnc-slots b {
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  background: #ffffff0d;
  border: 1px solid #ffffff1f;
  padding: 12px 24px;
  font-size: clamp(16px, 1.5vw, 21px);
  font-weight: 800;
}

.pnc-slots b.on {
  color: var(--pv2b);
  background: rgba(var(--pv2),.12);
  border-color: rgba(var(--pv2),.5);
}

.pns-aicall {
  text-align: center;
  align-items: center;
  padding: 16px 12px;
  position: relative;
}

.pnv-time {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  font-size: 15px;
  position: absolute;
  top: 14px;
  right: 16px;
}

.pnv-ava {
  background: rgba(var(--pv2),.12);
  border: 1px solid rgba(var(--pv2),.4);
  border-radius: 50%;
  place-items: center;
  width: 84px;
  height: 84px;
  display: grid;
}

.pnv-ava svg {
  fill: none;
  width: 40px;
  height: 40px;
  stroke: var(--pv2b);
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pnv-name {
  color: var(--text-primary);
  font-size: clamp(20px, 2vw, 27px);
  font-weight: 800;
}

.pnv-wave {
  align-items: center;
  gap: 6px;
  height: 38px;
  display: flex;
}

.pnv-wave i {
  background: rgba(var(--pv2),.75);
  border-radius: 2px;
  width: 5px;
  animation: 1s ease-in-out infinite pnv-w;
}

.pnv-wave i:first-child {
  height: 6px;
}

.pnv-wave i:nth-child(2) {
  height: 12px;
  animation-delay: .1s;
}

.pnv-wave i:nth-child(3) {
  height: 18px;
  animation-delay: .2s;
}

.pnv-wave i:nth-child(4) {
  height: 10px;
  animation-delay: .3s;
}

.pnv-wave i:nth-child(5) {
  height: 16px;
  animation-delay: .4s;
}

.pnv-wave i:nth-child(6) {
  height: 8px;
  animation-delay: .5s;
}

.pnv-wave i:nth-child(7) {
  height: 13px;
  animation-delay: .6s;
}

@keyframes pnv-w {
  0%, 100% {
    transform: scaleY(.5);
  }

  50% {
    transform: scaleY(1);
  }
}

.pnv-chips {
  gap: 8px;
  display: flex;
}

.pnv-chips b {
  border-radius: var(--radius-pill);
  color: var(--pv2b);
  background: rgba(var(--pv2),.1);
  border: 1px solid rgba(var(--pv2),.36);
  padding: 11px 24px;
  font-size: clamp(15px, 1.5vw, 20px);
  font-weight: 800;
}

.pnw-bar {
  color: var(--text-muted);
  border-bottom: 1px solid #ffffff12;
  align-items: center;
  gap: 6px;
  padding-bottom: 10px;
  font-size: 12.5px;
  display: flex;
}

.pnw-bar i {
  background: #ffffff24;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.pnw-bar em {
  margin-left: 6px;
  font-style: normal;
}

.pnw-grid {
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  display: grid;
}

.pnw-grid b {
  aspect-ratio: 1.35;
  background: #ffffff0d;
  border-radius: 8px;
}

.pnw-grid b.on {
  background: rgba(var(--pv2),.35);
  border: 1px solid rgba(var(--pv2),.7);
  box-shadow: 0 0 12px rgba(var(--pv2),.4);
}

.pnw-btn {
  color: #fff;
  background: var(--grad-signature);
  border-radius: 13px;
  align-self: flex-start;
  padding: 14px 30px;
  font-size: clamp(16px, 1.6vw, 21px);
  font-weight: 800;
}

.pnw-toast {
  border-radius: var(--radius-pill);
  color: var(--pv2b);
  background: rgba(var(--pv2),.1);
  border: 1px solid rgba(var(--pv2),.36);
  align-self: flex-end;
  align-items: center;
  gap: 10px;
  padding: 11px 22px;
  font-size: clamp(15px, 1.5vw, 20px);
  font-weight: 800;
  display: inline-flex;
}

.pnw-toast svg {
  fill: none;
  width: 18px;
  height: 18px;
  stroke: var(--pv2b);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pna-push {
  color: var(--text-primary);
  background: #ffffff0f;
  border: 1px solid #ffffff1f;
  border-radius: 14px;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  font-size: clamp(16px, 1.6vw, 21px);
  font-weight: 600;
  display: flex;
}

.pna-push i {
  background: var(--pv2b);
  border-radius: 50%;
  flex: none;
  width: 8px;
  height: 8px;
}

.pna-card {
  background: rgba(var(--pv2),.08);
  border: 1px solid rgba(var(--pv2),.32);
  border-radius: 14px;
  flex-direction: column;
  gap: 6px;
  padding: 20px 24px;
  display: flex;
}

.pna-card b {
  color: var(--text-primary);
  font-size: clamp(15px, 1.4vw, 19px);
}

.pna-card em {
  color: var(--pv2b);
  font-size: clamp(18px, 1.9vw, 25px);
  font-style: normal;
  font-weight: 700;
}

.pna-row {
  color: var(--text-muted);
  font-size: 12.5px;
}

.pns-call {
  text-align: center;
  align-items: center;
  gap: 18px;
  padding: clamp(28px, 3vw, 44px) 20px;
}

.pnl-hello {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(26px, 2.8vw, 40px);
  font-weight: 800;
}

.pnl-mini {
  background: #1c1a3af7;
  border: 1px solid #8FD3F280;
  border-radius: 16px;
  flex-direction: column;
  gap: 4px;
  padding: 16px 30px;
  display: flex;
}

.pnl-mini b {
  color: var(--text-primary);
  font-size: clamp(18px, 1.8vw, 24px);
}

.pnl-mini em {
  color: var(--pv2b);
  font-size: clamp(14px, 1.4vw, 18px);
  font-style: normal;
}

body.mobile .pn-stage, body.reduced .pn-stage {
  flex-direction: column;
  align-items: center;
  gap: 22px;
  height: auto;
  display: flex;
}

body.mobile .pn-stage .pn-orbit, body.reduced .pn-stage .pn-orbit {
  position: static;
  transform: none;
}

body.mobile .pns-panel, body.reduced .pns-panel {
  opacity: 1;
  pointer-events: auto;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 100%;
  max-width: 470px;
  display: flex;
  position: static;
  transform: none;
}

body.mobile .pns-card, body.reduced .pns-card {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

body.mobile .pnx-copy, body.reduced .pnx-copy {
  flex-direction: column;
  gap: 18px;
  width: 100%;
  display: flex;
}

body.mobile .pnx-scr, body.reduced .pnx-scr {
  opacity: 0;
}

body.mobile .pnx-scr[data-ch="chat"], body.reduced .pnx-scr[data-ch="chat"] {
  opacity: 1;
  transform: none;
}

body.reduced .pnx-screen {
  display: grid;
}

body.reduced .pnx-scr {
  position: relative;
}

.pn-title {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  color: var(--text-primary);
  margin: 0;
  font-size: clamp(38px, 5.6vw, 80px);
  font-weight: 800;
  line-height: 1.06;
}

.pn-title .zold {
  background: linear-gradient(100deg, var(--pv2a), var(--pv2b));
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.pn-sub {
  max-width: 46ch;
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(14px, 1.3vw, 18px);
}

.pn-orbit {
  aspect-ratio: 1;
  width: clamp(260px, 36vh, 380px);
  margin-top: 14px;
  position: relative;
}

.pn-ring {
  border: 1px dashed rgba(var(--pv2),.25);
  opacity: 0;
  transition: opacity 1s var(--ease-out) .3s;
  border-radius: 50%;
  position: absolute;
  inset: 0;
}

.pn-ring2 {
  border-color: #94a3b824;
  transition-delay: .5s;
  inset: 17%;
}

.pn-orbit.in .pn-ring {
  opacity: 1;
}

.pn-anna {
  z-index: 2;
  aspect-ratio: 1;
  background: radial-gradient(60% 60% at 50% 42%, rgba(var(--pv2),.16), #0e1412e6 78%);
  border: 1px solid rgba(var(--pv2),.35);
  width: 34%;
  box-shadow: 0 0 44px rgba(var(--pv2),.22);
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.pn-anna svg {
  fill: none;
  width: 42%;
  height: auto;
  stroke: rgba(var(--pv2l),.9);
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pn-anna b {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(12px, 1.2vw, 15px);
  font-weight: 800;
}

.pn-rot {
  animation: 70s linear infinite pn-spin;
  position: absolute;
  inset: 0;
}

.pn-arm {
  width: 0;
  height: 0;
  transform: rotate(var(--a));
  position: absolute;
  top: 50%;
  left: 50%;
}

.pn-ico {
  border: 1px solid rgba(var(--pv2),.4);
  width: 48px;
  height: 48px;
  box-shadow: 0 0 0 4px #0a0e0ccc, 0 0 22px rgba(var(--pv2),.28);
  transform: rotate(calc(var(--a) * -1));
  opacity: 0;
  transition: opacity .6s var(--ease-out) var(--d), scale .6s var(--ease-out) var(--d);
  background: #0c0f1cf2;
  border-radius: 50%;
  place-items: center;
  animation: 70s linear infinite pn-spin-rev;
  display: grid;
  position: absolute;
  top: -24px;
  left: calc(clamp(260px, 36vh, 380px) / 2 - 24px);
  scale: .5;
}

.pn-orbit.in .pn-ico {
  opacity: 1;
  scale: 1;
}

.pn-ico svg {
  fill: none;
  width: 21px;
  height: 21px;
  stroke: var(--pv2a);
  stroke-width: 1.7px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@keyframes pn-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes pn-spin-rev {
  from {
    transform: rotate(calc(var(--a) * -1));
  }

  to {
    transform: rotate(calc(var(--a) * -1 - 360deg));
  }
}

body.reduced .pn-rot, body.reduced .pn-ico {
  animation: none;
}

body.reduced .pn-ico, body.reduced .pn-ring {
  opacity: 1;
  transition: none;
  scale: 1;
}

@media (width <= 620px) {
  .pn-ico {
    width: 38px;
    height: 38px;
    top: -19px;
    left: calc(clamp(260px, 36vh, 380px) / 2 - 19px);
  }

  .pn-ico svg {
    width: 17px;
    height: 17px;
  }
}

.fd-ui {
  text-align: left;
  background: #0a0a14eb;
  grid-template-columns: 168px 1fr;
  display: grid;
}

.fd-side {
  border-right: 1px solid #ffffff12;
  flex-direction: column;
  gap: 2px;
  padding: 12px 8px;
  display: flex;
}

.fd-side span {
  color: var(--text-muted);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 11.5px;
}

.fd-side span.is-on {
  color: var(--text-primary);
  background: #0092D529;
  border: 1px solid #0092D55c;
  font-weight: 600;
}

.fd-main {
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding: 12px 14px 16px;
  display: flex;
}

.fd-tabs {
  border-bottom: 1px solid #ffffff12;
  flex-wrap: wrap;
  gap: 6px;
  padding-bottom: 10px;
  display: flex;
}

.fd-tabs span {
  border-radius: var(--radius-pill);
  color: var(--text-muted);
  background: #ffffff09;
  border: 1px solid #ffffff14;
  padding: 6px 12px;
  font-size: 11px;
  font-weight: 600;
}

.fd-tabs span.is-on {
  color: var(--text-primary);
  background: #0092D529;
  border-color: #0092D566;
}

.fd-tabs span.is-on2 {
  color: #2ed592;
  background: #2ed5921a;
  border-color: #2ed59259;
}

.fd-doc, .fd-stock {
  background: #ffffff08;
  border: 1px solid #ffffff12;
  border-radius: 12px;
  flex-direction: column;
  gap: 9px;
  padding: 12px 14px;
  display: flex;
}

.fd-doc-head, .fd-stock-head {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  display: flex;
}

.fd-doc-head b, .fd-stock-head b {
  color: var(--text-secondary);
  letter-spacing: .05em;
  text-transform: uppercase;
  font-size: 12.5px;
  font-weight: 700;
}

.fd-chip {
  border-radius: var(--radius-pill);
  color: var(--text-muted);
  background: #ffffff0b;
  border: 1px solid #ffffff1f;
  padding: 3px 10px;
  font-size: 10.5px;
  font-weight: 600;
}

.fd-chip--ok {
  color: #2ed592;
  background: #2ed59214;
  border-color: #2ed5924d;
}

.fd-line {
  height: 9px;
  width: var(--w);
  transform-origin: 0;
  transition: transform .9s var(--ease-out);
  background: #8FD3F229;
  border-radius: 5px;
  display: block;
  transform: scaleX(0);
}

.in .fd-line {
  transform: scaleX(1);
}

.in .fd-line:nth-of-type(2) {
  transition-delay: .25s;
}

.in .fd-line:nth-of-type(3) {
  transition-delay: .5s;
}

.fd-row {
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  border-bottom: 1px dashed #ffffff12;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 14px;
  padding: 8px 0;
  display: grid;
  transform: translateY(6px);
}

.in .fd-row {
  opacity: 1;
  transform: none;
}

.in .fd-row:nth-of-type(2) {
  transition-delay: .3s;
}

.in .fd-row:nth-of-type(3) {
  transition-delay: .55s;
}

.fd-nm {
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 600;
}

.fd-nm em {
  color: var(--text-muted);
  margin-left: 8px;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
}

.fd-use {
  font-family: var(--font-display);
  color: #f0897e;
  font-size: 13px;
  font-weight: 800;
}

.fd-stk {
  color: var(--text-muted);
  font-size: 12px;
}

.fd-stk b {
  font-family: var(--font-display);
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.fd-bill {
  color: var(--text-secondary);
  opacity: 0;
  transition: opacity .6s var(--ease-out) 1.6s;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding-top: 10px;
  font-size: 12.5px;
  display: flex;
}

.in .fd-bill {
  opacity: 1;
}

.fd-bill svg {
  fill: none;
  stroke: #8FD3F2cc;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 16px;
  height: 16px;
}

.fd-bill-item {
  border-radius: var(--radius-pill);
  background: #0092D51f;
  border: 1px solid #0092D55c;
  padding: 5px 12px;
}

.fd-bill-ok {
  border-radius: var(--radius-pill);
  color: #2ed592;
  background: #2ed59214;
  border: 1px solid #2ed59252;
  align-items: center;
  gap: 7px;
  padding: 5px 12px;
  display: inline-flex;
}

.fd-bill-ok svg {
  stroke: #2ed592;
  stroke-width: 2.6px;
  width: 13px;
  height: 13px;
}

body.reduced .fd-line {
  transition: none;
  transform: scaleX(1);
}

body.reduced .fd-row, body.reduced .fd-bill {
  opacity: 1;
  transition: none;
  transform: none;
}

@media (width <= 720px) {
  .fd-ui {
    grid-template-columns: 1fr;
  }

  .fd-side {
    border-bottom: 1px solid #ffffff12;
    border-right: 0;
    flex-flow: wrap;
  }

  .fd-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

.feu-flow {
  text-align: left;
  flex-direction: column;
  gap: clamp(26px, 4.5vh, 48px);
  width: 100%;
  max-width: 880px;
  margin: 0 auto;
  padding-left: 34px;
  display: flex;
  position: relative;
}

.feu-line {
  transform-origin: top;
  width: 2px;
  transition: transform 1.6s var(--ease-out) .2s;
  background: linear-gradient(#4f7bffa6, #B53ED0a6);
  border-radius: 1px;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 21px;
  transform: scaleY(0);
}

.feu-flow.in .feu-line {
  transform: scaleY(1);
}

.feu-st {
  opacity: 0;
  align-items: flex-start;
  gap: 18px;
  display: flex;
  position: relative;
}

.feu-flow.in .feu-st {
  opacity: 1;
  animation: feu-enter .6s var(--ease-out) backwards;
}

@keyframes feu-enter {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.feu-flow.in .feu-st:nth-of-type(2) {
  animation-delay: .2s;
}

.feu-flow.in .feu-st:nth-of-type(3) {
  animation-delay: .4s;
}

.feu-flow.in .feu-st:nth-of-type(4) {
  animation-delay: .6s;
}

.feu-flow.in .feu-st:nth-of-type(5) {
  animation-delay: .8s;
}

.feu-st {
  border-radius: 16px;
  margin: -10px -14px;
  padding: 10px 14px;
}

.feu-st.k-lit {
  background: #4f7bff17;
  box-shadow: 0 18px 44px #00000059;
}

.feu-st.k-lit .feu-node {
  box-shadow: 0 0 24px #4f7bff99;
}

.feu-st.k-lit h3 {
  color: #fff;
}

.feu-flow.in .feu-st:nth-of-type(6) {
  transition-delay: 1.25s;
}

.feu-node {
  color: #fff;
  background: var(--grad-signature);
  border-radius: 50%;
  flex: none;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-right: -34px;
  display: grid;
  position: relative;
  left: -34px;
  box-shadow: 0 0 0 5px #0a0a16f2, 0 0 22px #0092D566;
}

.feu-node svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 21px;
  height: 21px;
}

.feu-txt {
  flex: 1;
  min-width: 0;
  padding-left: 24px;
}

.feu-txt h3 {
  font-family: var(--font-display);
  color: var(--text-primary);
  margin: 8px 0 6px;
  font-size: clamp(16px, 1.6vw, 21px);
  font-weight: 800;
}

.feu-txt p {
  max-width: 62ch;
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(13px, 1.15vw, 15.5px);
  line-height: 1.55;
}

.feu-branch {
  border-radius: var(--radius-pill);
  color: #f0897e;
  background: #f0897e14;
  border: 1px dashed #f0897e66;
  align-items: center;
  gap: 9px;
  margin-top: 12px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.feu-branch i {
  background: #f0897e2e;
  border-radius: 50%;
  place-items: center;
  width: 17px;
  height: 17px;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  display: grid;
}

.feu-ui {
  background: #0a0a14eb;
  border: 1px solid #ffffff1a;
  border-radius: 12px;
  max-width: 560px;
  margin-top: 14px;
  overflow: hidden;
  box-shadow: 0 14px 36px #0006;
}

.feu-ui-bar {
  color: var(--text-muted);
  border-bottom: 1px solid #ffffff14;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  font-size: 11px;
  display: flex;
}

.feu-ui-bar i {
  background: #ffffff24;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.feu-ui-bar b {
  margin-left: 6px;
  font-weight: 600;
}

.feu-form {
  flex-direction: column;
  padding: 12px 14px;
  display: flex;
}

.feu-f {
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  border-bottom: 1px dashed #ffffff12;
  grid-template-columns: 140px 1fr;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  display: grid;
  transform: translateX(-12px);
}

.feu-f:last-of-type {
  border-bottom: 0;
}

.feu-flow.in .feu-f {
  opacity: 1;
  transform: none;
}

.feu-flow.in .feu-f:first-of-type {
  transition-delay: .9s;
}

.feu-flow.in .feu-f:nth-of-type(2) {
  transition-delay: 1.1s;
}

.feu-flow.in .feu-f:nth-of-type(3) {
  transition-delay: 1.3s;
}

.feu-flow.in .feu-f:nth-of-type(4) {
  transition-delay: 1.55s;
}

.feu-f span {
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
}

.feu-f b {
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 700;
}

.feu-ok-pill {
  border-radius: var(--radius-pill);
  color: #2ed592;
  background: #2ed5921a;
  border: 1px solid #2ed5925c;
  justify-self: start;
  align-items: center;
  gap: 7px;
  padding: 4px 13px;
  display: inline-flex;
}

.feu-ok-pill svg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 13px;
  height: 13px;
}

body.reduced .feu-line {
  transition: none;
  transform: scaleY(1);
}

body.reduced .feu-st, body.reduced .feu-f {
  opacity: 1;
  transition: none;
  transform: none;
}

@media (width <= 620px) {
  .feu-flow {
    padding-left: 24px;
  }

  .feu-line {
    left: 15px;
  }

  .feu-node {
    width: 32px;
    height: 32px;
    margin-right: -24px;
    left: -24px;
  }

  .feu-node svg {
    width: 16px;
    height: 16px;
  }

  .feu-txt {
    padding-left: 14px;
  }

  .feu-f {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

:root {
  --rv3-ma: #f0897e;
  --rv3-ok: #2ed592;
}

.rv3 {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(18px, 3vh, 30px);
  width: 100%;
  min-height: calc(86svh - 120px);
  display: flex;
}

.rv3-lead {
  max-width: 52ch;
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(14px, 1.3vw, 18px);
}

.rv3-head {
  flex-direction: column;
  align-items: center;
  gap: 12px;
  max-width: 900px;
  display: flex;
}

.rv3-act {
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--rv3-ma);
  background: #f0897e17;
  border: 1px solid #f0897e4d;
  padding: 5px 14px;
  font-size: 11px;
  font-weight: 800;
}

.rv3-act--ok, .rv3-extra .rv3-act {
  color: var(--rv3-ok);
  background: #2ed59217;
  border-color: #2ed59252;
}

.rv3-time {
  border-radius: var(--radius-pill);
  letter-spacing: .06em;
  color: var(--text-secondary);
  background: #ffffff0b;
  border: 1px solid #ffffff1f;
  align-items: center;
  gap: 8px;
  padding: 5px 13px;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
}

.rv3-time i {
  background: var(--rv3-ma);
  border-radius: 50%;
  width: 7px;
  height: 7px;
}

.rv3-ok .rv3-time i {
  background: var(--rv3-ok);
}

.rv3-title {
  font-family: var(--font-display);
  letter-spacing: -.015em;
  color: var(--text-primary);
  max-width: 22ch;
  margin: 0;
  font-size: clamp(26px, 3.4vw, 48px);
  font-weight: 800;
  line-height: 1.12;
}

.rv3-title .pir {
  background: linear-gradient(100deg, #f0897e, #e8736b);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.rv3-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.rv3-sub {
  max-width: 58ch;
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(13.5px, 1.25vw, 17px);
  line-height: 1.55;
}

.rv3-scene {
  width: 100%;
  max-width: 940px;
}

.rv3-scene svg, .rv3-splitpult svg, .rvx svg {
  display: block;
}

.rv3-scene svg *, .rv3-splitpult svg *, .rvx svg * {
  fill: none;
  stroke-width: 1.9px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rv3-ma .rv3-scene svg * {
  stroke: #f0897ecc;
}

.rv3-ok .rv3-scene svg * {
  stroke: #8FD3F2cc;
}

.rv3-okk {
  stroke: var(--rv3-ok) !important;
  stroke-width: 2.6px !important;
}

.rv3-splitpult {
  grid-template-columns: 1fr 1fr;
  gap: 0;
  width: 100%;
  max-width: 760px;
  margin-top: 8px;
  display: grid;
  position: relative;
}

.rv3-half {
  transition: transform 1s var(--ease-out);
  border-radius: 16px;
  padding: 18px 14px 12px;
  position: relative;
}

.rv3-half--ma {
  background: radial-gradient(80% 70% at 50% 40%, #f0897e21, #0000 78%);
}

.rv3-half--ma svg * {
  stroke: #f0897ecc;
}

.rv3-half--medio {
  background: radial-gradient(80% 70% at 50% 40%, #2ed5921f, #0000 78%);
}

.rv3-half--medio svg * {
  stroke: #8FD3F2cc;
}

.rec-open.in .rv3-half--ma {
  transform: translateX(-14px);
}

.rec-open.in .rv3-half--medio {
  transform: translateX(14px);
}

.rv3-split-line {
  width: 1px;
  transition: transform 1s var(--ease-out) .4s;
  transform-origin: top;
  background: linear-gradient(#0000, #94a3b866, #0000);
  position: absolute;
  top: 6%;
  bottom: 6%;
  left: 50%;
  transform: scaleY(0);
}

.rec-open.in .rv3-split-line {
  transform: scaleY(1);
}

.rv3-half-lb {
  font-family: var(--font-display);
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-top: 8px;
  font-size: 12px;
  font-weight: 800;
  display: block;
}

.rv3-half--ma .rv3-half-lb {
  color: var(--rv3-ma);
}

.rv3-half--medio .rv3-half-lb {
  color: var(--rv3-ok);
}

.rv3-qh, .rv3-papers {
  opacity: 0;
  transition: opacity .6s var(--ease-out);
}

.rec-open.in .rv3-qh, .rec-open.in .rv3-papers {
  opacity: 1;
}

.rec-open.in .rv3-qh:nth-of-type(3) {
  transition-delay: .5s;
}

.rec-open.in .rv3-qh:nth-of-type(4) {
  transition-delay: .65s;
}

.rec-open.in .rv3-qh:nth-of-type(5) {
  transition-delay: .8s;
}

.rec-open.in .rv3-papers {
  transition-delay: .95s;
}

.rv3-desk {
  background: radial-gradient(90% 90% at 50% 0, #f0897e12, #0000 70%), linear-gradient(#100f1ed9, #090912e6);
  border: 1px solid #f0897e38;
  border-radius: 20px;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: clamp(18px, 2.2vw, 30px);
  display: flex;
}

.rv3-monitor {
  background: #0a0a14eb;
  border: 1px solid #ffffff1a;
  border-radius: 12px;
  width: 100%;
  max-width: 660px;
  overflow: hidden;
  box-shadow: 0 0 60px #f0897e14, 0 20px 50px #00000080;
}

.rv3-mon-bar {
  color: var(--text-muted);
  border-bottom: 1px solid #ffffff14;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  font-size: 11.5px;
  display: flex;
}

.rv3-mon-bar i {
  background: #ffffff24;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.rv3-mon-bar b {
  margin-left: 6px;
  font-weight: 600;
}

.rv3-clock {
  font-family: var(--font-display);
  color: var(--rv3-ma);
  font-variant-numeric: tabular-nums;
  margin-left: auto;
  font-size: 13px;
  font-weight: 800;
}

.rv3-excel {
  grid-template-columns: repeat(8, 1fr);
  gap: 3px;
  padding: 12px;
  display: grid;
}

.rv3-cell {
  opacity: .5;
  background: #ffffff0b;
  border: 1px solid #ffffff0d;
  border-radius: 3px;
  height: 16px;
  transition: background .3s, opacity .3s;
}

.rv3.go .rv3-cell {
  transition-delay: var(--d);
  opacity: 1;
  background: #f0897e42;
  border-color: #f0897e4d;
}

.rv3-ex-corner {
  display: none;
}

.rv3-print {
  color: var(--text-muted);
  opacity: 0;
  transition: opacity .7s var(--ease-out) 3s;
  align-items: center;
  gap: 14px;
  font-size: 13px;
  display: flex;
}

.rv3-print svg {
  width: 64px;
  height: 50px;
}

.rv3-print-paper {
  opacity: 0;
  transition: transform .8s var(--ease-out) 3.3s, opacity .5s var(--ease-out) 3.3s;
  transform: translateY(-10px);
}

.rv3.go .rv3-print {
  opacity: 1;
}

.rv3.go .rv3-print-paper {
  opacity: 1;
  transform: none;
}

.rv3-arrive svg {
  width: 100%;
  height: auto;
}

.rv3-aq {
  opacity: 0;
  transition: opacity .45s var(--ease-out);
}

.rv3.go .rv3-aq1 {
  opacity: 1;
  transition-delay: .2s;
}

.rv3.go .rv3-aq2 {
  opacity: 1;
  transition-delay: .4s;
}

.rv3.go .rv3-aq3 {
  opacity: 1;
  transition-delay: .6s;
}

.rv3.go .rv3-aq4 {
  opacity: 1;
  transition-delay: .8s;
}

.rv3.go .rv3-aq5 {
  opacity: 1;
  transition-delay: 1s;
}

.rv3.go .rv3-aq6 {
  opacity: 1;
  transition-delay: 1.2s;
}

.rv3.go .rv3-aq7 {
  opacity: 1;
  transition-delay: 1.4s;
}

.rv3-pstack rect, .rv3-pen {
  opacity: 0;
  transition: opacity .5s var(--ease-out);
}

.rv3.go .rv3-pstack rect:first-of-type {
  opacity: 1;
  transition-delay: .6s;
}

.rv3.go .rv3-pstack rect:nth-of-type(2) {
  opacity: 1;
  transition-delay: .9s;
}

.rv3.go .rv3-pstack rect:nth-of-type(3) {
  opacity: 1;
  transition-delay: 1.2s;
}

.rv3.go .rv3-pstack rect:nth-of-type(4) {
  opacity: 1;
  transition-delay: 1.5s;
}

.rv3.go .rv3-pen {
  opacity: 1;
  transition-delay: 1.7s;
}

.rv3-beats {
  margin: 14px 0 0;
  text-align: left;
  flex-direction: column;
  gap: 8px;
  max-width: 62ch;
  margin-inline: auto;
  padding: 0;
  list-style: none;
  display: flex;
}

.rv3-beats li {
  color: var(--text-secondary);
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  padding-left: 22px;
  font-size: clamp(13px, 1.15vw, 15.5px);
  line-height: 1.5;
  position: relative;
  transform: translateY(6px);
}

.rv3-beats li:before {
  content: "";
  background: #f0897e33;
  border: 1.5px solid #f0897eb3;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  position: absolute;
  top: .5em;
  left: 2px;
}

.rv3.go .rv3-beats li {
  opacity: 1;
  transform: none;
}

.rv3.go .rv3-beats li:first-child {
  transition-delay: 1.6s;
}

.rv3.go .rv3-beats li:nth-child(2) {
  transition-delay: 1.85s;
}

.rv3-tension {
  font-family: var(--font-display);
  color: var(--rv3-ma);
  opacity: 0;
  transition: opacity .7s var(--ease-out) 2.3s;
  margin: 16px 0 0;
  font-size: clamp(15px, 1.5vw, 20px);
  font-style: italic;
  font-weight: 700;
}

.rv3.go .rv3-tension {
  opacity: 1;
}

.rv3-way {
  width: 100%;
  max-width: 820px;
  height: 190px;
  margin: 0 auto;
  position: relative;
}

.rv3-wayline {
  background: repeating-linear-gradient(90deg, #f0897e73 0 8px, #0000 8px 16px);
  height: 1px;
  position: absolute;
  top: 72%;
  left: 4%;
  right: 4%;
}

.rv3-station {
  border-radius: var(--radius-pill);
  letter-spacing: .06em;
  color: var(--text-secondary);
  background: #ffffff0b;
  border: 1px solid #ffffff1f;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
  position: absolute;
  top: 82%;
}

.rv3-paper {
  width: 58px;
  position: absolute;
  top: 8%;
  left: 6%;
}

.rv3-paper svg {
  width: 58px;
  height: 74px;
}

.rv3-paper svg * {
  stroke: #f0897ed9;
}

.rv3-hand {
  color: var(--rv3-ma);
  white-space: nowrap;
  opacity: 0;
  font-family: Comic Sans MS, cursive;
  font-size: 11px;
  position: absolute;
  top: 46px;
  left: 4px;
  transform: rotate(-6deg);
}

.rv3-stamp {
  opacity: 0;
  border: 2px solid #f0897ebf;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  position: absolute;
  top: -8px;
  right: -8px;
  transform: scale(1.6);
}

@keyframes rv3-paperway {
  0% {
    opacity: 1;
    left: 6%;
    transform: rotate(0);
  }

  18% {
    left: 44%;
    transform: rotate(0);
  }

  27% {
    left: 44%;
    transform: rotate(-2deg);
  }

  32% {
    left: 44%;
    transform: rotate(2deg);
  }

  52% {
    left: 84%;
    transform: rotate(3deg);
  }

  90% {
    opacity: 1;
    left: 84%;
    transform: rotate(3deg);
  }

  96% {
    opacity: 0;
    left: 84%;
  }

  98% {
    opacity: 0;
    left: 6%;
  }

  100% {
    opacity: 1;
    left: 6%;
    transform: rotate(0);
  }
}

@keyframes rv3-hand-in {
  to {
    opacity: 1;
  }
}

@keyframes rv3-stamp-in {
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.rv3.go .rv3-paper {
  animation: rv3-paperway 9s var(--ease-out) .4s infinite;
}

.rv3.go .rv3-hand {
  animation: 9s .4s infinite rv3-hand-loop;
}

.rv3.go .rv3-stamp {
  animation: rv3-stamp-loop 9s var(--ease-out) .4s infinite;
}

@keyframes rv3-hand-loop {
  0%, 24% {
    opacity: 0;
  }

  30%, 92% {
    opacity: 1;
  }

  96%, 100% {
    opacity: 0;
  }
}

@keyframes rv3-stamp-loop {
  0%, 58% {
    opacity: 0;
    transform: scale(1.6);
  }

  64%, 92% {
    opacity: 1;
    transform: scale(1);
  }

  96%, 100% {
    opacity: 0;
  }
}

.rv3-caption {
  color: var(--text-muted);
  opacity: 0;
  transition: opacity .7s var(--ease-out) 5.9s;
  margin: 8px 0 0;
  font-size: 13px;
}

.rv3.go .rv3-caption {
  opacity: 1;
}

.rv3-pay {
  position: relative;
}

.rv3-pay > svg {
  width: 100%;
  max-width: 820px;
  height: auto;
  margin: 0 auto;
}

.rv3-pq {
  opacity: 0;
  transition: opacity .5s var(--ease-out);
}

.rv3.go .rv3-pq:first-of-type {
  opacity: 1;
  transition-delay: .2s;
}

.rv3.go .rv3-pq:nth-of-type(2) {
  opacity: 1;
  transition-delay: .4s;
}

.rv3.go .rv3-pq:nth-of-type(3) {
  opacity: 1;
  transition-delay: .6s;
}

.rv3-door {
  stroke-dasharray: 5 7;
  opacity: .6;
}

.rv3-walker {
  opacity: 0;
}

@keyframes rv3-walkout {
  0% {
    opacity: 0;
    transform: translateX(0);
  }

  15% {
    opacity: 1;
  }

  85% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: translateX(240px);
  }
}

.rv3.go .rv3-walker {
  animation: 7s ease-in 1s infinite rv3-walkout;
}

.rv3-badge-un {
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #fff;
  opacity: 0;
  transition: opacity .5s var(--ease-out) 3.6s, transform .5s var(--ease-out) 3.6s;
  background: linear-gradient(135deg, #f0897e, #e8736b);
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 800;
  position: absolute;
  top: 18%;
  right: 8%;
  transform: translateY(8px);
  box-shadow: 0 8px 22px #f0897e4d;
}

.rv3.go .rv3-badge-un {
  opacity: 1;
  transform: none;
}

.rv3-evening {
  color: var(--text-muted);
  opacity: 0;
  transition: opacity .7s var(--ease-out) 4.2s;
  justify-content: center;
  align-items: center;
  gap: 14px;
  margin-top: 18px;
  font-size: 13px;
  display: flex;
}

.rv3-evening svg {
  width: 22px;
  height: 22px;
}

.rv3-evening svg * {
  stroke: #f0897eb3;
}

.rv3.go .rv3-evening {
  opacity: 1;
}

.rv3-fordulat {
  min-height: calc(78svh - 120px);
}

.rv3-ford-title {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  color: var(--text-primary);
  max-width: 16ch;
  margin: 0;
  font-size: clamp(34px, 5vw, 72px);
  font-weight: 800;
  line-height: 1.08;
}

.rv3-ford-title .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.rv3-rewind {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px;
  display: flex;
}

.rv3-rewind i {
  color: var(--text-muted);
  font-style: normal;
}

.rv3-tchip {
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  font-variant-numeric: tabular-nums;
  color: var(--rv3-ma);
  background: #f0897e1a;
  border: 1px solid #f0897e59;
  padding: 8px 18px;
  font-size: clamp(13px, 1.3vw, 17px);
  font-weight: 800;
  transition: color .6s, background .6s, border-color .6s, box-shadow .6s;
}

.rv3.go .rv3-tchip {
  color: var(--rv3-ok);
  background: #2ed5921a;
  border-color: #2ed59266;
  box-shadow: 0 0 18px #2ed5922e;
}

.rv3.go .rv3-tc1 {
  transition-delay: .3s;
}

.rv3.go .rv3-tc2 {
  transition-delay: .65s;
}

.rv3.go .rv3-tc3 {
  transition-delay: 1s;
}

.rv3.go .rv3-tc4 {
  transition-delay: 1.35s;
}

.r2b--embed {
  min-height: 0;
}

.rv3-m1 {
  grid-template-columns: 130px minmax(0, 560px);
  justify-content: center;
  align-items: center;
  gap: clamp(22px, 3.5vw, 46px);
  display: grid;
}

.rv3-phone {
  position: relative;
}

.rv3-phone svg {
  width: 110px;
  height: auto;
}

.rv3-phone svg * {
  stroke: #8FD3F2cc;
}

.rv3-phone-glow {
  z-index: -1;
  background: radial-gradient(50% 50%, #B53ED038, #0000 72%);
  border-radius: 50%;
  position: absolute;
  inset: -30%;
}

.rv3-m1note {
  margin-top: 4px;
}

.rv3 .r2b-note {
  opacity: 0;
  transition: opacity .7s var(--ease-out) 2.2s;
}

.rv3.go .r2b-note {
  opacity: 1;
}

.rv3-m1b {
  grid-template-columns: minmax(0, 640px) auto;
  justify-content: center;
  align-items: center;
  gap: clamp(22px, 3.5vw, 50px);
  display: grid;
}

.rv3-shot {
  width: 100%;
  margin: 0;
}

.rv3-dayview {
  background: #0a0a14eb;
  grid-template-columns: 52px 1fr 1fr 1fr;
  gap: 8px;
  padding: 14px;
  display: grid;
}

.rv3-dv-gutter {
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  text-align: right;
  flex-direction: column;
  gap: 26px;
  padding-top: 30px;
  font-size: 10.5px;
  display: flex;
}

.rv3-dv-col {
  text-align: left;
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.rv3-dv-col b {
  color: var(--text-secondary);
  border-bottom: 1px solid #ffffff14;
  padding: 4px 2px;
  font-size: 11.5px;
  font-weight: 700;
}

.rv3-dv-card {
  color: var(--text-secondary);
  opacity: 0;
  transition: opacity .45s var(--ease-out), transform .5s var(--ease-out);
  background: #2ed59214;
  border: 1px solid #2ed59247;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 10.5px;
  line-height: 1.35;
  transform: translateY(6px) scale(.96);
}

.rv3.go .rv3-dv-card {
  opacity: 1;
  transform: none;
}

.rv3.go .c1 {
  transition-delay: .3s;
}

.rv3.go .c2 {
  transition-delay: .5s;
}

.rv3.go .c3 {
  transition-delay: .7s;
}

.rv3.go .c4 {
  transition-delay: .9s;
}

.rv3.go .c5 {
  transition-delay: 1.1s;
}

.rv3.go .c6 {
  transition-delay: 1.3s;
}

.rv3.go .c7 {
  transition-delay: 1.5s;
}

.rv3-points {
  text-align: left;
  flex-direction: column;
  gap: 12px;
  max-width: 34ch;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.rv3-points li {
  color: var(--text-secondary);
  opacity: 0;
  transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
  padding-left: 26px;
  font-size: clamp(13.5px, 1.2vw, 16px);
  line-height: 1.45;
  position: relative;
  transform: translateX(-10px);
}

.rv3-points li:before {
  content: "";
  background: #2ed59226;
  border: 1.5px solid #2ed592b3;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  position: absolute;
  top: .28em;
  left: 0;
}

.rv3.go .rv3-points li {
  opacity: 1;
  transform: none;
}

.rv3.go .rv3-points li:first-child {
  transition-delay: .8s;
}

.rv3.go .rv3-points li:nth-child(2) {
  transition-delay: 1.05s;
}

.rv3.go .rv3-points li:nth-child(3) {
  transition-delay: 1.3s;
}

.rv3-m2 {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  align-items: center;
  gap: clamp(22px, 3vw, 44px);
  display: grid;
}

.rv3-m2-left svg {
  width: 100%;
  max-width: 330px;
  margin: 0 auto;
}

.rv3-kiosk {
  opacity: 0;
  transition: opacity .6s var(--ease-out) .2s;
}

.rv3.go .rv3-kiosk {
  opacity: 1;
}

.rv3-melt {
  opacity: .85;
  transition: opacity 1s var(--ease-out);
}

.rv3.go .rv3-me1 {
  opacity: 0;
  transition-delay: .8s;
}

.rv3.go .rv3-me2 {
  opacity: 0;
  transition-delay: 1.1s;
}

.rv3.go .rv3-me3 {
  opacity: 0;
  transition-delay: 1.4s;
}

.rv3-guide {
  stroke-dasharray: 4 8;
  opacity: 0;
  transition: opacity .7s 1.6s;
  stroke: #2ed592b3 !important;
}

.rv3.go .rv3-guide {
  opacity: 1;
}

.rv3-points--tight {
  max-width: none;
  margin-top: 14px;
}

.rv3-ui {
  text-align: left;
  background: #0a0a14eb;
  padding: 18px 16px 12px;
  position: relative;
}

.rv3-ui-row {
  background: #ffffff09;
  border: 1px solid #ffffff17;
  border-radius: 12px;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  display: grid;
  position: relative;
}

.rv3-ui-t {
  font-family: var(--font-display);
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 800;
}

.rv3-ui-n {
  color: var(--text-primary);
  font-size: 13.5px;
  font-weight: 600;
}

.rv3-ui-n em {
  color: var(--text-muted);
  font-size: 11.5px;
  font-style: normal;
  font-weight: 500;
  display: block;
}

.rv3-ui-btn, .rv3-ui-done {
  white-space: nowrap;
  border-radius: 10px;
  grid-area: 1 / 3;
  justify-self: end;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 700;
}

.rv3-ui-btn {
  color: #fff;
  background: var(--grad-signature);
  transition: opacity .3s 2.5s, transform .3s 2.5s;
}

.rv3-ui-done {
  color: var(--rv3-ok);
  opacity: 0;
  transition: opacity .35s var(--ease-out) 2.6s, transform .4s var(--ease-out) 2.6s;
  background: #2ed5921f;
  border: 1px solid #2ed59266;
  align-items: center;
  gap: 6px;
  display: inline-flex;
  transform: scale(.85);
}

.rv3-ui-done svg {
  width: 14px;
  height: 14px;
  stroke: var(--rv3-ok);
  fill: none;
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rv3.go .rv3-ui-btn {
  opacity: 0;
  transform: scale(.92);
}

.rv3.go .rv3-ui-done {
  opacity: 1;
  transform: none;
}

.rv3-cursor {
  z-index: 2;
  opacity: 0;
  background: #ffffffe6;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  position: absolute;
  top: 88px;
  right: 60px;
  box-shadow: 0 0 0 3px #0092D559;
}

@keyframes rv3-cursor-run {
  0% {
    opacity: 0;
    transform: translate(-160px, 60px);
  }

  25% {
    opacity: 1;
  }

  70% {
    opacity: 1;
    transform: translate(0, -48px);
  }

  80% {
    opacity: 1;
    transform: translate(0, -48px) scale(.72);
  }

  92% {
    opacity: 1;
    transform: translate(0, -48px) scale(1);
  }

  100% {
    opacity: 0;
    transform: translate(0, -48px);
  }
}

.rv3.go .rv3-cursor {
  animation: rv3-cursor-run 2.9s var(--ease-out) .3s forwards;
}

.rv3-ui-note {
  color: var(--text-muted);
  margin: 12px 2px 0;
  font-size: 12.5px;
}

.rv3-ui-note b {
  color: var(--text-secondary);
}

.rv3-m3 {
  grid-template-columns: 1fr auto 1fr 1fr;
  align-items: stretch;
  gap: clamp(12px, 1.8vw, 24px);
  max-width: 980px;
  margin: 0 auto;
  display: grid;
  position: relative;
}

.rv3-m3-panel {
  text-align: left;
  background: linear-gradient(#12303E99, #0c0c18b3);
  border: 1px solid #ffffff17;
  border-radius: 14px;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  display: flex;
}

.rv3-m3-head {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
  border-bottom: 1px solid #ffffff12;
  padding-bottom: 8px;
  font-size: 11px;
  font-weight: 700;
}

.rv3-item {
  color: var(--text-primary);
  background: #0092D524;
  border: 1px solid #0092D566;
  border-radius: 10px;
  align-self: flex-start;
  padding: 9px 14px;
  font-size: 13px;
  font-weight: 600;
}

.rv3-item b {
  font-family: var(--font-display);
  margin-left: 8px;
}

.rv3.go .rv3-item {
  animation: rv3-item-pulse 1s var(--ease-out) .4s;
}

@keyframes rv3-item-pulse {
  30% {
    transform: scale(1.06);
    box-shadow: 0 0 22px #0092D566;
  }
}

.rv3-m3-arrow {
  background: var(--grad-signature);
  color: #fff;
  border-radius: 50%;
  align-self: center;
  place-items: center;
  width: 34px;
  height: 34px;
  display: grid;
  box-shadow: 0 0 20px #0092D566;
}

.rv3-m3-arrow svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 16px;
  height: 16px;
}

.rv3-m3-line {
  color: var(--text-secondary);
  border-bottom: 1px dashed #ffffff12;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  font-size: 13px;
  display: flex;
}

.rv3-m3-line b {
  font-family: var(--font-display);
  color: var(--text-primary);
  margin-left: auto;
  font-weight: 700;
}

.rv3-m3-line svg {
  fill: none;
  width: 15px;
  height: 15px;
  stroke: var(--rv3-ok);
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rv3-m3-new {
  opacity: 0;
  transition: opacity .55s var(--ease-out) 1.3s, transform .6s var(--ease-out) 1.3s;
  transform: translateX(-30px);
}

.rv3.go .rv3-m3-new {
  opacity: 1;
  transform: none;
}

.rv3-m3-flash {
  opacity: 0;
  border-bottom: 0;
  border-radius: 8px;
  padding: 8px 10px;
  transition: opacity .5s 2s;
}

.rv3.go .rv3-m3-flash {
  opacity: 1;
  animation: 1.2s 2s rv3-flash;
}

@keyframes rv3-flash {
  25% {
    background: #2ed5922e;
  }
}

.rv3-oldpaper {
  color: var(--text-muted);
  align-items: center;
  gap: 10px;
  font-size: 12px;
  display: flex;
  position: absolute;
  bottom: -54px;
  right: -8px;
}

.rv3-oldpaper svg {
  width: 34px;
  height: 44px;
}

.rv3-oldpaper svg * {
  stroke: #f0897e8c;
}

.rv3.go .rv3-oldpaper {
  animation: 2.4s 2.4s forwards rv3-dissolve;
}

@keyframes rv3-dissolve {
  to {
    opacity: .18;
    filter: blur(2px);
  }
}

.rv3-m4 {
  grid-template-columns: auto minmax(0, 460px);
  justify-content: center;
  align-items: center;
  gap: clamp(26px, 4vw, 60px);
  display: grid;
}

.rv3-m4-left {
  flex-direction: column;
  align-items: center;
  gap: 16px;
  display: flex;
  position: relative;
}

.rv3-m4-left svg {
  width: 120px;
  height: auto;
}

.rv3-m4-left > svg * {
  stroke: #8FD3F2cc;
}

.rv3-payring {
  opacity: 0;
  transition: opacity .5s .4s;
}

.rv3.go .rv3-payring {
  opacity: 1;
}

.rv3-badge-swap {
  text-align: center;
  min-width: 132px;
  position: relative;
}

.rv3-badge-swap s, .rv3-badge-swap b {
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
  align-items: center;
  gap: 6px;
  padding: 7px 15px;
  font-size: 12px;
  font-weight: 800;
  display: inline-flex;
}

.rv3-badge-swap s {
  color: #fff;
  background: linear-gradient(135deg, #f0897e, #e8736b);
  text-decoration: none;
  transition: opacity .4s 1.2s;
}

.rv3-badge-swap b {
  color: #fff;
  opacity: 0;
  transition: opacity .45s var(--ease-out) 1.3s, transform .5s var(--ease-out) 1.3s;
  white-space: nowrap;
  background: linear-gradient(135deg, #2ed592, #14b87a);
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) scale(.8);
  box-shadow: 0 8px 22px #2ed59252;
}

.rv3-badge-swap b svg {
  fill: none;
  stroke: #fff;
  stroke-width: 2.6px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 13px;
  height: 13px;
}

.rv3.go .rv3-badge-swap s {
  opacity: 0;
}

.rv3.go .rv3-badge-swap b {
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

#rv3M4 {
  min-height: 100svh;
}

.rv3-final {
  font-family: var(--font-display);
  letter-spacing: -.015em;
  color: var(--text-primary);
  opacity: 0;
  transition: opacity .8s var(--ease-out) 1.8s, transform .8s var(--ease-out) 1.8s;
  margin: clamp(14px, 3vh, 30px) 0 0;
  font-size: clamp(28px, 3.6vw, 52px);
  font-weight: 800;
  line-height: 1.1;
  transform: translateY(10px);
}

.rv3-final .kek {
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.rv3.go .rv3-final {
  opacity: 1;
  transform: none;
}

.rv3-extra {
  gap: clamp(22px, 3.5vh, 40px);
  min-height: 0;
  margin-top: clamp(60px, 30vh, 300px);
}

.rvx {
  text-align: left;
  background: linear-gradient(#12303E8c, #0c0c18a8);
  border: 1px solid #ffffff14;
  border-radius: 18px;
  width: 100%;
  max-width: 980px;
  padding: clamp(18px, 2.2vw, 28px);
}

.rvx h4 {
  font-family: var(--font-display);
  color: var(--text-primary);
  margin: 0 0 16px;
  font-size: clamp(16px, 1.55vw, 21px);
  font-weight: 800;
}

.rvx-cols {
  grid-template-columns: 1fr 1fr;
  gap: clamp(14px, 2vw, 26px);
  display: grid;
}

.rvx-col {
  border-radius: 13px;
  padding: 14px;
}

.rvx-col svg {
  width: 100%;
  max-width: 230px;
  height: auto;
  margin: 0 auto 12px;
}

.rvx-col p {
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(12.5px, 1.1vw, 14.5px);
  line-height: 1.55;
}

.rvx-col p b {
  color: var(--text-primary);
}

.rvx-col--ma {
  background: #f0897e0d;
  border: 1px solid #f0897e38;
}

.rvx-col--ma svg * {
  stroke: #f0897ebf;
}

.rvx-col--ok {
  background: #2ed5920d;
  border: 1px solid #2ed5923d;
}

.rvx-col--ok svg * {
  stroke: #8FD3F2bf;
}

.rvx-copy {
  stroke-dasharray: 3 5;
}

.rvx-swoosh {
  stroke: #2ed592cc !important;
  stroke-width: 2.2px !important;
}

.rvx-blk {
  fill: #f0897e38;
  stroke: #f0897e99;
}

.rvx-ok-blk {
  fill: #2ed59233;
  stroke: #2ed59299;
}

.rvx-fill {
  fill: #2ed59259;
  stroke: none;
}

.rvx-tick {
  stroke-width: 3px !important;
}

.rvx-auto {
  stroke-dasharray: 2 4;
}

body.reduced .rv3 .rv3-cell, body.reduced .rv3-print, body.reduced .rv3-print-paper, body.reduced .rv3-aq, body.reduced .rv3-pstack rect, body.reduced .rv3-pen, body.reduced .rv3-beats li, body.reduced .rv3-tension, body.reduced .rv3-caption, body.reduced .rv3-pq, body.reduced .rv3-badge-un, body.reduced .rv3-evening, body.reduced .rv3-dv-card, body.reduced .rv3-points li, body.reduced .rv3-kiosk, body.reduced .rv3-guide, body.reduced .rv3-ui-done, body.reduced .rv3-m3-new, body.reduced .rv3-m3-flash, body.reduced .rv3-payring, body.reduced .rv3-badge-swap b, body.reduced .rv3-final, body.reduced .rv3-qh, body.reduced .rv3-papers, body.reduced .rec-open .rv3-split-line, body.reduced .rv3 .r2b-note {
  opacity: 1;
  transition: none;
  animation: none;
  transform: none;
}

body.reduced .rv3-cell {
  background: #f0897e42;
}

body.reduced .rv3-ui-btn, body.reduced .rv3-badge-swap s {
  opacity: 0;
}

body.reduced .rv3-badge-swap b {
  transform: translateX(-50%);
}

body.reduced .rv3-melt {
  opacity: 0;
}

body.reduced .rv3-walker, body.reduced .rv3-cursor, body.reduced .rv3-paper {
  animation: none;
}

body.reduced .rv3-hand, body.reduced .rv3-stamp {
  opacity: 1;
  transform: none;
}

@media (width <= 880px) {
  .rv3-m1, .rv3-m1b, .rv3-m2, .rv3-m4 {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .rv3-points {
    max-width: 46ch;
  }

  .rv3-m3 {
    grid-template-columns: 1fr;
  }

  .rv3-m3-arrow {
    transform: rotate(90deg);
  }

  .rv3-oldpaper {
    justify-content: center;
    margin-top: 14px;
    position: static;
  }

  .rvx-cols {
    grid-template-columns: 1fr;
  }

  .rv3-dayview {
    grid-template-columns: 40px 1fr 1fr;
  }

  .rv3-dayview .rv3-dv-col:last-child {
    display: none;
  }

  .rv3-splitpult {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .rv3-split-line {
    display: none;
  }
}

.rec-metrics {
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 16px;
  display: flex;
}

.rec-metric {
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  background: #ffffff09;
  border: 1px solid #ffffff1a;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  font-size: clamp(12.5px, 1.05vw, 14.5px);
  display: inline-flex;
}

.rec-metric b {
  font-family: var(--font-display);
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: 1.2em;
  font-weight: 800;
}

.rec-close {
  max-width: 56ch;
}

@media (width <= 880px) {
  .rec-pane {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .rec-scene {
    max-width: 380px;
    margin: 0 auto;
  }
}

#fekvo-eset .vg-head {
  position: relative;
}

.fk-guide {
  z-index: 1;
  pointer-events: none;
  width: 1px;
  height: clamp(76px, 11vh, 130px);
  position: absolute;
  bottom: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%);
}

.fk-guide-line {
  transform-origin: top;
  width: 1px;
  transition: transform 1.1s var(--ease-out);
  background: linear-gradient(#0092D500, #0092D5a6 30%, #0092D5e6);
  position: absolute;
  inset: 0 auto 0 0;
  transform: scaleY(0);
}

.fk-guide-tick {
  opacity: 0;
  width: 11px;
  height: 1px;
  transition: opacity .5s var(--ease-out);
  background: #8FD3F28c;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.fk-guide-tick:nth-of-type(2) {
  transition-delay: .35s;
  top: 34%;
}

.fk-guide-tick:nth-of-type(3) {
  width: 15px;
  transition-delay: .5s;
  top: 56%;
}

.fk-guide-tick:nth-of-type(4) {
  transition-delay: .65s;
  top: 78%;
}

.fk-guide-mark {
  opacity: 0;
  width: 26px;
  height: 26px;
  transition: opacity .6s var(--ease-out) .75s;
  border: 1px solid #0092D5bf;
  border-radius: 50%;
  position: absolute;
  bottom: -9px;
  left: 50%;
  transform: translate(-50%, 50%);
  box-shadow: 0 0 22px #0092D566, inset 0 0 10px #0092D52e;
}

.fk-guide-mark:before, .fk-guide-mark:after {
  content: "";
  background: #8FD3F2b3;
  position: absolute;
}

.fk-guide-mark:before {
  width: 1px;
  top: -5px;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-mask: linear-gradient(#000 4px, #0000 4px calc(100% - 4px), #000 calc(100% - 4px));
  mask: linear-gradient(#000 4px, #0000 4px calc(100% - 4px), #000 calc(100% - 4px));
}

.fk-guide-mark:after {
  height: 1px;
  top: 50%;
  left: -5px;
  right: -5px;
  transform: translateY(-50%);
  -webkit-mask: linear-gradient(90deg, #000 4px, #0000 4px calc(100% - 4px), #000 calc(100% - 4px));
  mask: linear-gradient(90deg, #000 4px, #0000 4px calc(100% - 4px), #000 calc(100% - 4px));
}

.fk-guide-mark i {
  background: var(--grad-signature);
  border-radius: 50%;
  width: 5px;
  height: 5px;
  animation: 2.2s ease-in-out infinite fkPulse;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 12px #0092D5cc;
}

@keyframes fkPulse {
  0%, 100% {
    box-shadow: 0 0 8px #0092D580;
  }

  50% {
    box-shadow: 0 0 18px #5BB8E6f2;
  }
}

.fk-guide.in .fk-guide-line {
  transform: scaleY(1);
}

.fk-guide.in .fk-guide-tick, .fk-guide.in .fk-guide-mark {
  opacity: 1;
}

body.reduced .fk-guide-line {
  transform: scaleY(1);
}

body.reduced .fk-guide-tick, body.reduced .fk-guide-mark {
  opacity: 1;
}

body.reduced .fk-guide-mark i {
  animation: none;
}

#fekvo-eset .vg-lead b {
  color: var(--text-primary);
  font-weight: 700;
}

.fk-video {
  background: #0A1D2A;
  width: 100%;
  height: auto;
  display: block;
}

.vir-split {
  grid-template-columns: minmax(0, 1.55fr) minmax(0, .85fr);
  align-items: start;
  gap: clamp(24px, 3vw, 48px);
  width: 100%;
  display: grid;
}

.vir-shot {
  width: 100%;
}

.vir-body {
  background: #0A1D2A;
  flex-direction: column;
  gap: clamp(12px, 1.3vw, 18px);
  padding: clamp(14px, 1.6vw, 22px);
  display: flex;
}

.vir-tabs {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.vir-tabs span {
  border-radius: var(--radius-pill);
  color: var(--text-muted);
  background: #ffffff08;
  border: 1px solid #ffffff12;
  padding: 5px 12px;
  font-size: 11px;
  font-weight: 600;
}

.vir-tabs span.is-on {
  color: var(--text-primary);
  background: #0092D524;
  border-color: #0092D55c;
}

.vir-kpis {
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(8px, 1vw, 14px);
  display: grid;
}

.vir-kpi {
  border: 1px solid var(--station-border);
  background: linear-gradient(#ffffff0b, #ffffff04);
  border-radius: 12px;
  flex-direction: column;
  gap: 2px;
  padding: 11px 13px;
  display: flex;
}

.vir-kpi-v {
  font-family: var(--font-display);
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  background: var(--grad-signature);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: clamp(16px, 1.6vw, 24px);
  font-weight: 800;
}

.vir-kpi-l {
  color: var(--text-secondary);
  font-size: 11px;
}

.vir-kpi-d {
  color: #8be0b0;
  font-size: 10px;
  font-weight: 700;
}

.vir-grid {
  grid-template-columns: 1.5fr 1fr;
  gap: clamp(10px, 1.1vw, 16px);
  display: grid;
}

.vir-panel {
  border: 1px solid var(--station-border);
  background: linear-gradient(#ffffff09, #ffffff03);
  border-radius: 14px;
  min-width: 0;
  padding: clamp(12px, 1.3vw, 18px);
}

.vir-p-title {
  color: var(--text-primary);
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 700;
  display: block;
}

.vir-p-title em {
  color: var(--text-muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
}

.vir-chart {
  width: 100%;
  height: auto;
  display: block;
}

.vir-grid-l {
  stroke: #ffffff24;
  stroke-width: 1px;
}

.vir-grid-l--soft {
  stroke: #ffffff0d;
  stroke-dasharray: 3 4;
}

.vir-bar {
  transform-origin: 50% 130px;
  transform: scaleY(0);
}

.vir-bar.b1 {
  fill: #608cffd9;
}

.vir-bar.b2 {
  fill: #9a6effe6;
}

.vir-shot.in .vir-bar {
  transition: transform .8s var(--ease-out);
  transform: scaleY(1);
}

.vir-shot.in .vir-bars rect:nth-child(3), .vir-shot.in .vir-bars rect:nth-child(4) {
  transition-delay: .12s;
}

.vir-shot.in .vir-bars rect:nth-child(5), .vir-shot.in .vir-bars rect:nth-child(6) {
  transition-delay: .24s;
}

.vir-shot.in .vir-bars rect:nth-child(7), .vir-shot.in .vir-bars rect:nth-child(8) {
  transition-delay: .36s;
}

.vir-line {
  stroke: #35d49a;
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 300;
  stroke-dashoffset: 300px;
}

.vir-shot.in .vir-line {
  stroke-dashoffset: 0;
  transition: stroke-dashoffset 1.1s var(--ease-out) .45s;
}

.vir-dots circle {
  fill: #0A1D2A;
  stroke: #35d49a;
  stroke-width: 2.2px;
  opacity: 0;
}

.vir-shot.in .vir-dots circle {
  opacity: 1;
  transition: opacity .4s var(--ease-out) 1.15s;
}

.vir-x text {
  fill: #ffffff6b;
  text-anchor: middle;
  font-family: inherit;
  font-size: 10px;
}

.vir-legend {
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 8px;
  display: flex;
}

.vir-legend span {
  color: var(--text-secondary);
  align-items: center;
  gap: 6px;
  font-size: 11px;
  display: inline-flex;
}

.vir-legend i {
  border-radius: 3px;
  width: 10px;
  height: 10px;
}

.vir-legend .lg-b1 {
  background: #608cffd9;
}

.vir-legend .lg-b2 {
  background: #9a6effe6;
}

.vir-legend .lg-ln {
  background: #35d49a;
  border-radius: 2px;
  height: 3px;
}

.vir-rings {
  justify-content: space-around;
  gap: clamp(14px, 1.6vw, 26px);
  display: flex;
}

.vir-ring {
  flex-direction: column;
  align-items: center;
  gap: 2px;
  display: flex;
  position: relative;
}

.vir-ring svg {
  width: clamp(62px, 5.6vw, 80px);
  height: auto;
  transform: rotate(-90deg);
}

.vir-ring-bg {
  fill: none;
  stroke: #ffffff14;
  stroke-width: 7px;
}

.vir-ring-fg {
  fill: none;
  stroke: #ffb05a;
  stroke-width: 7px;
  stroke-linecap: round;
  stroke-dasharray: 163.4;
  stroke-dashoffset: 163.4px;
}

.vir-shot.in .vir-ring-fg {
  transition: stroke-dashoffset 1.2s var(--ease-out) .3s;
}

.vir-ring-v {
  font-family: var(--font-display);
  color: #ffd08a;
  font-variant-numeric: tabular-nums;
  margin-top: 6px;
  font-size: clamp(14px, 1.3vw, 19px);
  font-weight: 800;
}

.vir-ring-l {
  color: var(--text-secondary);
  font-size: 11px;
}

.vir-ltv {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.vir-ltv-row {
  grid-template-columns: 64px 1fr auto;
  align-items: center;
  gap: 10px;
  display: grid;
}

.vir-ltv-l {
  color: var(--text-secondary);
  font-size: 12px;
}

.vir-ltv-bar {
  background: #ffffff0f;
  border-radius: 5px;
  height: 9px;
  overflow: hidden;
}

.vir-ltv-bar i {
  background: var(--grad-signature);
  border-radius: 5px;
  width: 0;
  height: 100%;
  display: block;
}

.vir-shot.in .vir-ltv-bar i {
  width: var(--w);
  transition: width 1s var(--ease-out) .5s;
}

.vir-ltv-v {
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
}

.vir-coh {
  grid-template-columns: repeat(8, 1fr);
  gap: 4px;
  display: grid;
}

.vir-coh i {
  aspect-ratio: 1;
  opacity: 0;
  border-radius: 3px;
  transform: scale(.6);
}

.vir-shot.in .vir-coh i {
  opacity: 1;
  transition: opacity .35s var(--ease-out), transform .35s var(--ease-out);
  transition-delay: var(--d, 0s);
  transform: scale(1);
}

.vir-points {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  display: flex;
}

.vir-points .od-b-ico, .vir-points .od-b-title {
  margin-bottom: 14px;
}

.vir-points .od-b-list {
  gap: 12px;
}

.vir-live {
  color: var(--text-secondary);
  border-radius: var(--radius-pill);
  background: #35d49a14;
  border: 1px solid #35d49a42;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  padding: 8px 14px;
  font-size: 12px;
  display: inline-flex;
}

.vir-live i {
  background: #35d49a;
  border-radius: 50%;
  width: 7px;
  height: 7px;
  animation: 2.2s ease-in-out infinite fkPulse;
  box-shadow: 0 0 10px #35d49acc;
}

body.reduced .vir-live i {
  animation: none;
}

body.reduced .vir-bar {
  transform: scaleY(1);
}

body.reduced .vir-line {
  stroke-dashoffset: 0;
}

body.reduced .vir-dots circle {
  opacity: 1;
}

body.reduced .vir-ltv-bar i {
  width: var(--w);
}

body.reduced .vir-coh i {
  opacity: 1;
  transform: none;
}

@media (width <= 980px) {
  .vir-split {
    grid-template-columns: 1fr;
  }

  .vir-points {
    max-width: 640px;
  }
}

@media (width <= 620px) {
  .vir-kpis {
    grid-template-columns: 1fr 1fr;
  }

  .vir-grid {
    grid-template-columns: 1fr;
  }
}

.pa-split {
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  align-items: center;
  gap: clamp(28px, 4vw, 64px);
  width: 100%;
  display: grid;
}

.pa-phone-col {
  justify-content: center;
  display: flex;
}

.pa-phone {
  background: linear-gradient(160deg, #23243a, #101120);
  border: 1px solid #ffffff1f;
  border-radius: clamp(38px, 3.6vw, 48px);
  width: clamp(240px, 24vw, 320px);
  padding: clamp(10px, 1vw, 13px);
  position: relative;
  box-shadow: 0 0 0 1px #0092D51f, 0 0 70px #0092D529, 0 34px 70px #0009;
}

.pa-island {
  z-index: 3;
  border-radius: var(--radius-pill);
  background: #000;
  width: 34%;
  height: clamp(16px, 1.6vw, 22px);
  position: absolute;
  top: clamp(18px, 1.8vw, 24px);
  left: 50%;
  transform: translateX(-50%);
  box-shadow: inset 0 0 0 1px #ffffff0d;
}

.pa-screen {
  aspect-ratio: 1202 / 2614;
  background: #0b0c16;
  border-radius: clamp(28px, 2.8vw, 36px);
  position: relative;
  overflow: hidden;
}

.pa-video, .pa-still {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
}

.pa-pending .pa-video {
  visibility: hidden;
}

.pa-phone:not(.pa-pending) .pa-still, .pa-pending-tag {
  display: none;
}

.pa-pending .pa-pending-tag {
  white-space: nowrap;
  letter-spacing: .07em;
  text-transform: uppercase;
  border-radius: var(--radius-pill);
  color: #ffd08a;
  background: #ffb05a21;
  border: 1px solid #ffb05a57;
  padding: 4px 12px;
  font-size: 10px;
  font-weight: 700;
  display: inline-flex;
  position: absolute;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
}

.pa-copy {
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  display: flex;
}

.pa-chapters {
  flex-direction: column;
  gap: 6px;
  width: 100%;
  display: flex;
}

.pa-ch {
  font: inherit;
  cursor: pointer;
  text-align: left;
  background: none;
  border: 1px solid #0000;
  border-radius: 14px;
  align-items: flex-start;
  gap: 14px;
  padding: 12px 16px;
  transition: background .35s, border-color .35s;
  display: flex;
  position: relative;
}

.pa-ch-dot {
  background: #ffffff29;
  border-radius: 50%;
  flex: none;
  width: 9px;
  height: 9px;
  margin-top: 7px;
  transition: background .35s, box-shadow .35s;
}

.pa-ch-txt {
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  display: flex;
}

.pa-ch-txt b {
  font-family: var(--font-display);
  color: var(--text-secondary);
  font-size: clamp(15px, 1.3vw, 19px);
  font-weight: 700;
  transition: color .35s;
}

.pa-ch-txt em {
  color: var(--text-muted);
  font-size: clamp(12px, 1.05vw, 14px);
  font-style: normal;
  line-height: 1.45;
  transition: color .35s;
}

.pa-ch.is-on {
  background: #0092D517;
  border-color: #0092D566;
}

.pa-ch.is-on .pa-ch-dot {
  background: var(--grad-signature);
  box-shadow: 0 0 12px #0092D5bf;
}

.pa-ch.is-on .pa-ch-txt b {
  color: var(--text-primary);
}

.pa-ch.is-on .pa-ch-txt em {
  color: var(--text-secondary);
}

@media (hover: hover) {
  .pa-ch:hover .pa-ch-txt b {
    color: var(--text-primary);
  }
}

.pa-copy .vir-live {
  margin-top: 22px;
}

@media (width <= 920px) {
  .pa-split {
    grid-template-columns: 1fr;
  }

  .pa-phone {
    width: min(300px, 72vw);
  }

  .pa-copy {
    max-width: 560px;
    margin: 0 auto;
  }
}

.vf-inner {
  text-align: center;
}

.vf-cue {
  display: none;
}

.vf-title {
  font-family: var(--font-display);
  letter-spacing: -.02em;
  background: linear-gradient(90deg, #4f7bff 0%, #0092D5 45%, #B53ED0 100%);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  margin-top: 14px;
  font-size: clamp(38px, 6.4vw, 88px);
  font-weight: 800;
  line-height: 1.03;
}

.vf-title .kek {
  -webkit-text-fill-color: initial;
  color: #0000;
  background: linear-gradient(90deg, #0092D5, #B53ED0);
  -webkit-background-clip: text;
  background-clip: text;
}

body.reduced .od-shot {
  transition: none;
}

@media (width <= 880px) {
  .od-feat {
    grid-template-columns: 1fr;
    gap: clamp(22px, 4vw, 32px);
  }

  .od-feat--rev .od-shot {
    order: 0;
  }

  .od-lab-steps {
    grid-template-columns: 1fr;
    max-width: 520px;
    margin: 0 auto;
  }
}

@media (width <= 560px) {
  .od-flow:before {
    display: none;
  }

  .od-flow {
    gap: 10px;
  }

  .od-flow-step {
    padding: 7px 13px 7px 7px;
  }
}

.mk-beat, .pz-beat {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 4.5vh, 48px);
  width: 100%;
  min-height: 92svh;
  display: flex;
}

#marketing-ret .kek, #marketing-ret .od-close .kek {
  background: linear-gradient(100deg, #ec6ead, #f0a4c8);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.mk-chaos {
  width: min(860px, 92vw);
  height: clamp(300px, 42vh, 380px);
  position: relative;
}

.mk-chip {
  color: var(--text-primary);
  background: #f8717112;
  border: 1px solid #f8717152;
  border-radius: 14px;
  flex-direction: column;
  gap: 3px;
  padding: 12px 18px;
  font-size: .95rem;
  font-weight: 600;
  animation: 7s ease-in-out infinite mk-drift;
  display: flex;
  position: absolute;
}

.mk-chip b {
  color: #fca5a5d9;
  font-size: .78rem;
  font-weight: 500;
}

.mk-chip--ads {
  animation-delay: 0s;
  top: 8%;
  left: 4%;
}

.mk-chip--meta {
  animation-delay: -1.8s;
  top: 62%;
  left: 12%;
}

.mk-chip--soc {
  animation-delay: -3.5s;
  top: 30%;
  left: 30%;
}

.mk-chip--mail {
  animation-delay: -5.2s;
  top: 36%;
  left: 8%;
}

@keyframes mk-drift {
  0%, 100% {
    transform: translate(0) rotate(-.6deg);
  }

  50% {
    transform: translate(7px, -10px) rotate(.8deg);
  }
}

.mk-goog {
  background: #0f172ab8;
  border: 1px solid #f8717166;
  border-radius: 16px;
  flex-direction: column;
  gap: 6px;
  max-width: 250px;
  padding: 18px 22px;
  display: flex;
  position: absolute;
  top: 24%;
  right: 3%;
  box-shadow: 0 18px 44px #f871711a;
}

.mk-goog-t {
  color: var(--text-primary);
  font-weight: 700;
}

.mk-goog-stars {
  letter-spacing: 3px;
  color: #f87171;
  font-size: 1.25rem;
}

.mk-goog-stars .dim {
  color: #94a3b84d;
}

.mk-goog-note {
  color: var(--text-secondary);
  font-size: .8rem;
  line-height: 1.4;
}

.mk-flystar {
  color: #f87171;
  opacity: 0;
  font-size: 1.3rem;
  animation: 6s ease-in-out infinite mk-flystar;
  position: absolute;
  top: 58%;
  left: 38%;
}

@keyframes mk-flystar {
  0%, 6% {
    opacity: 0;
    transform: translate(0) scale(.7) rotate(0);
  }

  12% {
    opacity: 1;
  }

  46% {
    opacity: 1;
    transform: translate(calc(28vw - 60px), -34%) scale(1.15) rotate(160deg);
  }

  54%, 100% {
    opacity: 0;
    transform: translate(calc(28vw - 40px), -38%) scale(.8) rotate(200deg);
  }
}

.mk-split {
  grid-template-columns: minmax(230px, 300px) minmax(300px, 520px);
  justify-content: center;
  align-items: center;
  gap: clamp(28px, 5vw, 72px);
  width: 100%;
  display: grid;
}

.mk-phone {
  aspect-ratio: 9 / 18.6;
  background: #0b1120;
  border: 1px solid #94a3b84d;
  border-radius: 38px;
  width: min(268px, 68vw);
  margin-inline: auto;
  position: relative;
  overflow: hidden;
  box-shadow: 0 30px 70px #02061799, inset 0 0 0 6px #020617;
}

.mk-island {
  z-index: 3;
  background: #020617;
  border-radius: 12px;
  width: 84px;
  height: 20px;
  position: absolute;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-scr {
  background: linear-gradient(#0f1a33, #0b1428 60%, #0a1122);
  border-radius: 32px;
  flex-direction: column;
  gap: 12px;
  padding: 44px 14px 14px;
  display: flex;
  position: absolute;
  inset: 6px;
  overflow: hidden;
}

.mk-app-head {
  color: var(--text-secondary);
  align-items: center;
  gap: 9px;
  font-size: .82rem;
  font-weight: 600;
  display: flex;
}

.mk-app-logo {
  color: #fff;
  letter-spacing: .3px;
  background: linear-gradient(135deg, #ec6ead, #b23d7d);
  border-radius: 9px;
  place-items: center;
  width: 30px;
  height: 30px;
  font-size: .72rem;
  font-weight: 800;
  display: inline-grid;
}

.mk-push {
  opacity: 0;
  background: #ec6ead1a;
  border: 1px solid #ec6ead59;
  border-radius: 14px;
  align-items: flex-start;
  gap: 9px;
  padding: 11px 12px;
  animation: 8s ease-in-out infinite mk-push;
  display: flex;
  transform: translateY(-90px);
}

.mk-push-ico {
  background: #ec6ead33;
  border-radius: 8px;
  flex: none;
  place-items: center;
  width: 26px;
  height: 26px;
  display: inline-grid;
}

.mk-push-ico svg {
  fill: none;
  stroke: #f0a4c8;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 15px;
  height: 15px;
}

.mk-push-txt {
  color: var(--text-secondary);
  flex-direction: column;
  gap: 2px;
  font-size: .74rem;
  line-height: 1.35;
  display: flex;
}

.mk-push-txt b {
  color: var(--text-primary);
  font-size: .8rem;
}

@keyframes mk-push {
  0%, 5% {
    opacity: 0;
    transform: translateY(-90px);
  }

  12%, 88% {
    opacity: 1;
    transform: translateY(0);
  }

  95%, 100% {
    opacity: 0;
    transform: translateY(-90px);
  }
}

.mk-book {
  color: #dcfce7;
  opacity: 0;
  background: #2ed59224;
  border: 1px solid #2ed59273;
  border-radius: 999px;
  align-self: center;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  padding: 9px 18px;
  font-size: .86rem;
  font-weight: 700;
  animation: 8s ease-in-out infinite mk-book;
  display: inline-flex;
  transform: scale(.85);
}

.mk-book svg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 2.4px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 15px;
  height: 15px;
}

@keyframes mk-book {
  0%, 30% {
    opacity: 0;
    transform: scale(.85);
  }

  38%, 88% {
    opacity: 1;
    transform: scale(1);
  }

  95%, 100% {
    opacity: 0;
    transform: scale(.85);
  }
}

.mk-app-rows {
  flex-direction: column;
  gap: 9px;
  margin-top: auto;
  display: flex;
}

.mk-app-rows i {
  background: #94a3b814;
  border: 1px solid #94a3b81f;
  border-radius: 11px;
  height: 34px;
}

.mk-pts {
  flex-direction: column;
  gap: 16px;
  display: flex;
}

.mk-flow {
  flex-direction: column;
  align-items: center;
  width: min(760px, 94vw);
  display: flex;
  position: relative;
}

.mk-flow-src {
  text-align: center;
  color: var(--text-secondary);
  z-index: 2;
  background: #0f172ab8;
  border: 1px solid #94a3b84d;
  border-radius: 16px;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 14px 26px;
  font-size: .86rem;
  display: flex;
}

.mk-flow-src b {
  color: var(--text-primary);
  font-size: 1.02rem;
}

.mk-flow-svg {
  width: 100%;
  height: auto;
  margin: -6px 0 -34px;
}

.mk-path {
  fill: none;
  stroke-width: 2px;
  stroke-dasharray: 6 7;
  animation: 1.6s linear infinite mk-dash;
}

.mk-path--pos {
  stroke: #2ed5928c;
}

.mk-path--neg {
  stroke: #fac4508c;
}

@keyframes mk-dash {
  to {
    stroke-dashoffset: -13px;
  }
}

.mk-dot {
  opacity: 0;
}

.mk-dot--pos {
  fill: #2ed592;
  offset-path: path("M320 18 C320 90 470 60 512 132");
  animation: 4.5s ease-in-out infinite mk-travel;
}

.mk-dot--neg {
  fill: #fac450;
  offset-path: path("M320 18 C320 90 170 60 128 132");
  animation: 4.5s ease-in-out 2.25s infinite mk-travel;
}

@keyframes mk-travel {
  0% {
    offset-distance: 0%;
    opacity: 0;
  }

  8% {
    opacity: 1;
  }

  42% {
    offset-distance: 100%;
    opacity: 1;
  }

  50%, 100% {
    offset-distance: 100%;
    opacity: 0;
  }
}

.mk-flow-out {
  z-index: 2;
  background: #0f172ab8;
  border-radius: 16px;
  flex-direction: column;
  gap: 5px;
  max-width: 270px;
  padding: 16px 20px;
  display: flex;
}

.mk-flow-out b {
  color: var(--text-primary);
  font-size: .92rem;
}

.mk-flow-out--pos {
  border: 1px solid #2ed59266;
  align-self: flex-end;
  animation: 4.5s ease-in-out infinite mk-out-pulse;
}

.mk-flow-out--neg {
  border: 1px solid #fac45066;
  align-self: flex-start;
  margin-top: -86px;
  animation: 4.5s ease-in-out 2.25s infinite mk-out-pulse;
}

@keyframes mk-out-pulse {
  0%, 34%, 62%, 100% {
    box-shadow: 0 0 #94a3b800;
  }

  46% {
    box-shadow: 0 14px 40px #ec6ead29;
  }
}

.mk-out-stars {
  color: #2ed592;
  letter-spacing: 3px;
  font-size: 1.05rem;
}

.mk-out-fix {
  color: #fac450;
  align-items: center;
  gap: 7px;
  font-size: .85rem;
  font-weight: 600;
  display: inline-flex;
}

.mk-out-fix svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 14px;
  height: 14px;
}

.mk-out-note {
  color: var(--text-secondary);
  font-size: .78rem;
}

.mk-fill {
  grid-template-columns: minmax(300px, 460px) minmax(240px, 320px);
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 4vw, 56px);
  width: 100%;
  display: grid;
}

.mk-cal {
  background: #0f172ab8;
  border: 1px solid #94a3b83d;
  border-radius: 18px;
  flex-direction: column;
  gap: 14px;
  padding: 22px 24px;
  display: flex;
}

.mk-cal-t {
  color: var(--text-primary);
  font-size: .95rem;
  font-weight: 700;
}

.mk-slots {
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  display: grid;
}

.mk-slot {
  color: var(--text-secondary);
  background: #2ed59212;
  border: 1px solid #2ed5924d;
  border-radius: 12px;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  font-size: .78rem;
  display: flex;
}

.mk-slot b {
  color: var(--text-primary);
  font-size: .84rem;
  font-weight: 600;
}

.mk-slot--gap {
  background: #f8717114;
  border-color: #f8717173;
  animation: 9s ease-in-out infinite mk-slot-frame;
  position: relative;
}

.mk-slot--gap .mk-slot-was {
  color: #fca5a5;
  animation: 9s ease-in-out infinite mk-slot-was;
}

.mk-slot--gap .mk-slot-new {
  color: #dcfce7;
  opacity: 0;
  animation: 9s ease-in-out infinite mk-slot-new;
  position: absolute;
  bottom: 10px;
  left: 12px;
}

@keyframes mk-slot-frame {
  0%, 48% {
    background: #f8717114;
    border-color: #f8717173;
  }

  60%, 92% {
    background: #2ed5921f;
    border-color: #2ed59280;
  }

  100% {
    background: #f8717114;
    border-color: #f8717173;
  }
}

@keyframes mk-slot-was {
  0%, 48% {
    opacity: 1;
  }

  56%, 92% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes mk-slot-new {
  0%, 52% {
    opacity: 0;
    transform: translateY(4px);
  }

  62%, 90% {
    opacity: 1;
    transform: translateY(0);
  }

  96%, 100% {
    opacity: 0;
  }
}

.mk-ai-chip {
  color: var(--text-primary);
  opacity: 0;
  background: #ec6ead1a;
  border: 1px solid #ec6ead66;
  border-radius: 999px;
  align-self: flex-start;
  align-items: center;
  gap: 9px;
  padding: 8px 14px;
  font-size: .82rem;
  font-weight: 600;
  animation: 9s ease-in-out infinite mk-ai-chip;
  display: inline-flex;
}

.mk-ai-chip i {
  background: #ec6ead;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  animation: 1.4s ease-in-out infinite mk-live;
}

@keyframes mk-ai-chip {
  0%, 16% {
    opacity: 0;
    transform: translateY(6px);
  }

  26%, 92% {
    opacity: 1;
    transform: translateY(0);
  }

  98%, 100% {
    opacity: 0;
  }
}

@keyframes mk-live {
  0%, 100% {
    box-shadow: 0 0 #ec6ead80;
  }

  55% {
    box-shadow: 0 0 0 7px #ec6ead00;
  }
}

.mk-kpis {
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
  display: flex;
}

.mk-ring {
  background: #0f172ab8;
  border: 1px solid #94a3b83d;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 16px;
  display: flex;
  position: relative;
}

.mk-ring svg {
  width: 108px;
  height: 108px;
  transform: rotate(-90deg);
}

.mk-ring-bg {
  fill: none;
  stroke: #94a3b829;
  stroke-width: 9px;
}

.mk-ring-fg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 9px;
  stroke-linecap: round;
  stroke-dasharray: 314;
  stroke-dashoffset: 314px;
  animation: 9s ease-in-out infinite mk-ring;
}

@keyframes mk-ring {
  0%, 8% {
    stroke-dashoffset: 314px;
  }

  38%, 90% {
    stroke-dashoffset: 9px;
  }

  97%, 100% {
    stroke-dashoffset: 314px;
  }
}

.mk-ring-val {
  color: var(--text-primary);
  font-size: 1.16rem;
  font-weight: 800;
  position: absolute;
  top: 54px;
}

.mk-ring-lab {
  color: var(--text-secondary);
  font-size: .78rem;
}

.mk-kpi {
  background: #0f172ab8;
  border: 1px solid #94a3b83d;
  border-radius: 14px;
  flex-direction: column;
  gap: 2px;
  padding: 13px 18px;
  display: flex;
}

.mk-kpi b {
  color: var(--text-primary);
  font-size: 1.14rem;
  font-weight: 800;
}

.mk-kpi span {
  color: var(--text-secondary);
  font-size: .8rem;
}

.mk-report {
  max-width: 640px;
  color: var(--text-secondary);
  background: #ec6ead0d;
  border: 1px dashed #ec6ead66;
  border-radius: 14px;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 14px 20px;
  font-size: .92rem;
  line-height: 1.5;
  display: flex;
}

.mk-report svg {
  fill: none;
  stroke: #ec6ead;
  stroke-width: 1.8px;
  stroke-linecap: round;
  flex: none;
  width: 22px;
  height: 22px;
}

#penzugy-kontrolling .kek {
  background: linear-gradient(100deg, #fac450, #fde2a8);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.pz-scatter {
  grid-template-columns: repeat(4, 1fr);
  align-items: start;
  gap: clamp(12px, 2.4vw, 26px);
  width: min(820px, 92vw);
  padding-bottom: 130px;
  display: grid;
  position: relative;
}

.pz-site {
  text-align: center;
  background: #f871710f;
  border: 1px solid #f8717159;
  border-radius: 14px;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  animation: 6s ease-in-out infinite pz-flicker;
  display: flex;
}

.pz-site:nth-child(2) {
  margin-top: 18px;
  animation-delay: -1.5s;
}

.pz-site:nth-child(3) {
  animation-delay: -3s;
}

.pz-site:nth-child(4) {
  margin-top: 12px;
  animation-delay: -4.5s;
}

.pz-site b {
  color: var(--text-primary);
  font-size: .9rem;
}

.pz-site i {
  color: #fca5a5d9;
  font-size: .76rem;
  font-style: normal;
}

@keyframes pz-flicker {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: .55;
  }
}

.pz-fog {
  color: var(--text-secondary);
  background: #0f172a99;
  border: 1px dashed #94a3b859;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 18px 34px;
  font-size: 1rem;
  font-weight: 700;
  animation: 5s ease-in-out infinite pz-fog;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: inset 0 0 46px #94a3b80f;
}

.pz-fog b {
  color: #f87171;
  font-size: 1.5rem;
}

.pz-fog span {
  font-size: .78rem;
  font-weight: 500;
}

@keyframes pz-fog {
  0%, 100% {
    filter: blur();
    opacity: .95;
  }

  50% {
    filter: blur(.7px);
    opacity: .68;
  }
}

.pz-central {
  flex-direction: column;
  align-items: center;
  width: min(760px, 94vw);
  display: flex;
}

.pz-c-sites {
  justify-content: space-between;
  width: 100%;
  display: flex;
}

.pz-c-sites span {
  color: var(--text-secondary);
  background: #0f172a99;
  border: 1px solid #94a3b842;
  border-radius: 11px;
  padding: 9px 16px;
  font-size: .82rem;
}

.pz-c-svg {
  width: 100%;
  height: auto;
  margin: -4px 0 -20px;
}

.pz-c-line {
  fill: none;
  stroke: #fac45066;
  stroke-width: 1.8px;
  stroke-dasharray: 5 7;
  animation: 1.5s linear infinite mk-dash;
}

.pz-c-dot {
  fill: #fac450;
  opacity: 0;
  offset-path: path("M80 20 C80 90 260 80 310 118");
  animation: 4s ease-in-out infinite mk-travel;
}

.pz-c-dot--2 {
  offset-path: path("M240 20 C240 70 290 75 314 112");
  animation-delay: 1s;
}

.pz-c-dot--3 {
  offset-path: path("M400 20 C400 70 350 75 326 112");
  animation-delay: 2s;
}

.pz-c-dot--4 {
  offset-path: path("M560 20 C560 90 380 80 330 118");
  animation-delay: 3s;
}

.pz-hub {
  color: var(--text-primary);
  z-index: 2;
  background: #fac45017;
  border: 1px solid #fac45080;
  border-radius: 16px;
  align-items: center;
  gap: 11px;
  padding: 15px 28px;
  font-weight: 700;
  animation: 4s ease-in-out infinite pz-hub;
  display: inline-flex;
  box-shadow: 0 16px 48px #fac4501a;
}

.pz-hub svg {
  fill: none;
  stroke: #fac450;
  stroke-width: 1.9px;
  width: 21px;
  height: 21px;
}

@keyframes pz-hub {
  0%, 55%, 100% {
    box-shadow: 0 16px 48px #fac4501a;
  }

  72% {
    box-shadow: 0 18px 60px #fac45042;
  }
}

.pz-hub-chips {
  flex-wrap: wrap;
  justify-content: center;
  gap: 9px;
  margin-top: 18px;
  display: flex;
}

.pz-hub-chips span {
  color: var(--text-secondary);
  background: #2ed59212;
  border: 1px solid #2ed59259;
  border-radius: 999px;
  padding: 7px 14px;
  font-size: .8rem;
}

.pz-shot {
  width: min(620px, 94vw);
}

.pz-inv {
  background: #0a1020e6;
  flex-direction: column;
  gap: 16px;
  padding: 22px 24px;
  display: flex;
}

.pz-inv-row {
  background: #0f172acc;
  border: 1px solid #94a3b838;
  border-radius: 12px;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  padding: 13px 16px;
  display: flex;
  position: relative;
}

.pz-inv-name {
  color: var(--text-primary);
  font-size: .92rem;
  font-weight: 600;
}

.pz-inv-sum {
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.pz-inv-badge {
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  padding: 5px 12px;
  font-size: .74rem;
  font-weight: 700;
  display: inline-flex;
}

.pz-inv-badge--ma {
  color: #fca5a5;
  background: #f871711a;
  border: 1px solid #f8717173;
  animation: 8s ease-in-out infinite pz-badge-ma;
}

.pz-inv-badge--lock {
  color: #dcfce7;
  opacity: 0;
  background: #2ed5921f;
  border: 1px solid #2ed59280;
  animation: 8s ease-in-out infinite pz-badge-lock;
  position: absolute;
  right: 16px;
}

.pz-inv-badge--lock svg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 2px;
  width: 12px;
  height: 12px;
}

@keyframes pz-badge-ma {
  0%, 40% {
    opacity: 1;
  }

  50%, 92% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes pz-badge-lock {
  0%, 44% {
    opacity: 0;
    transform: scale(.9);
  }

  54%, 90% {
    opacity: 1;
    transform: scale(1);
  }

  97%, 100% {
    opacity: 0;
  }
}

.pz-appr {
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  display: flex;
}

.pz-ap {
  color: var(--text-secondary);
  background: #94a3b80f;
  border: 1px solid #94a3b847;
  border-radius: 999px;
  align-items: center;
  gap: 8px;
  padding: 8px 15px;
  font-size: .82rem;
  font-weight: 600;
  display: inline-flex;
}

.pz-ap i {
  width: 17px;
  height: 17px;
  color: var(--text-primary);
  background: #94a3b833;
  border-radius: 50%;
  place-items: center;
  font-size: .68rem;
  font-style: normal;
  display: inline-grid;
}

.pz-ap--ok {
  color: #dcfce7;
  background: #2ed59214;
  border-color: #2ed59273;
  animation: 8s ease-in-out infinite pz-ap-ok;
}

.pz-ap--ok svg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 2.4px;
  stroke-linecap: round;
  width: 14px;
  height: 14px;
}

@keyframes pz-ap-ok {
  0%, 34% {
    opacity: .35;
  }

  46%, 92% {
    opacity: 1;
  }

  100% {
    opacity: .35;
  }
}

.pz-ap-arrow {
  color: var(--text-secondary);
}

.pz-qw {
  color: var(--text-primary);
  background: #fac45014;
  border: 1px solid #fac45073;
  border-radius: 999px;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  font-size: .86rem;
  font-weight: 600;
  display: inline-flex;
}

.pz-qw i {
  color: #fac450;
  background: #fac45038;
  border-radius: 50%;
  place-items: center;
  width: 20px;
  height: 20px;
  font-size: .8rem;
  font-style: normal;
  font-weight: 800;
  display: inline-grid;
}

.pz-time {
  flex-direction: column;
  gap: 22px;
  width: min(760px, 94vw);
  display: flex;
}

.pz-t-row {
  grid-template-columns: 150px 1fr auto;
  align-items: center;
  gap: 16px;
  display: grid;
}

.pz-t-lab {
  color: var(--text-secondary);
  text-align: right;
  font-size: .84rem;
  font-weight: 700;
}

.pz-t-row b {
  white-space: nowrap;
  font-size: 1.02rem;
  font-weight: 800;
}

.pz-t-row--ma b {
  color: #f87171;
}

.pz-t-row--uj b {
  color: #2ed592;
}

.pz-t-bar {
  background: #0f172a99;
  border: 1px solid #94a3b82e;
  border-radius: 11px;
  height: 40px;
  position: relative;
  overflow: hidden;
}

.pz-t-bar i {
  transform-origin: 0;
  position: absolute;
  inset: 0;
}

.pz-t-row--ma .pz-t-bar i {
  background: linear-gradient(90deg, #f8717157, #f871711f);
  animation: 8s ease-in-out infinite pz-bar-ma;
}

.pz-t-row--uj .pz-t-bar i {
  background: linear-gradient(90deg, #2ed59266, #2ed59224);
  width: 14%;
  animation: 8s ease-in-out infinite pz-bar-uj;
}

@keyframes pz-bar-ma {
  0%, 6% {
    transform: scaleX(0);
  }

  58%, 92% {
    transform: scaleX(1);
  }

  98%, 100% {
    transform: scaleX(0);
  }
}

@keyframes pz-bar-uj {
  0%, 20% {
    transform: scaleX(0);
  }

  30%, 92% {
    transform: scaleX(1);
  }

  98%, 100% {
    transform: scaleX(0);
  }
}

.pz-t-bar em {
  color: var(--text-secondary);
  white-space: nowrap;
  font-size: .76rem;
  font-style: normal;
  position: absolute;
  top: 50%;
  left: 14px;
  transform: translateY(-50%);
}

.pz-t-row--uj .pz-t-bar em {
  color: #bbf7d0;
}

.pz-bi {
  background: #0f172abd;
  border: 1px solid #fac45047;
  border-radius: 20px;
  flex-direction: column;
  gap: 18px;
  width: min(680px, 94vw);
  padding: 24px 28px;
  display: flex;
  box-shadow: 0 24px 64px #02061780;
}

.pz-bi-live {
  color: var(--text-secondary);
  align-items: center;
  gap: 9px;
  font-size: .8rem;
  display: inline-flex;
}

.pz-bi-live i {
  background: #2ed592;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  animation: 1.6s ease-in-out infinite mk-live;
}

.pz-bi-kpis {
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  display: grid;
}

.pz-bik {
  background: #0a1020b3;
  border: 1px solid #94a3b833;
  border-radius: 14px;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  display: flex;
}

.pz-bik span {
  color: var(--text-secondary);
  font-size: .76rem;
}

.pz-bik b {
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  font-size: 1.3rem;
  font-weight: 800;
}

.pz-bi-chart {
  align-items: flex-end;
  gap: 10px;
  height: 96px;
  padding: 0 4px;
  display: flex;
}

.pz-bi-chart i {
  transform-origin: bottom;
  height: calc(var(--h) * 100%);
  background: linear-gradient(#fac450bf, #fac45033);
  border-radius: 6px 6px 2px 2px;
  flex: 1;
  animation: 9s ease-in-out infinite pz-chart;
}

.pz-bi-chart i:nth-child(2n) {
  animation-delay: -.25s;
}

.pz-bi-chart i:nth-child(3n) {
  animation-delay: -.5s;
}

@keyframes pz-chart {
  0%, 4% {
    transform: scaleY(.08);
  }

  22%, 94% {
    transform: scaleY(1);
  }

  100% {
    transform: scaleY(.08);
  }
}

.pz-impact {
  margin-top: 6px;
}

@media (width <= 760px) {
  .mk-beat, .pz-beat {
    min-height: 0;
    padding: 12svh 0;
  }

  .mk-chaos {
    flex-direction: column;
    gap: 12px;
    height: auto;
    display: flex;
  }

  .mk-chip, .mk-goog {
    animation: none;
    position: static;
  }

  .mk-flystar {
    display: none;
  }

  .mk-split, .mk-fill {
    grid-template-columns: 1fr;
  }

  .mk-flow-svg, .mk-dot {
    display: none;
  }

  .mk-flow-out--pos, .mk-flow-out--neg {
    align-self: stretch;
    max-width: none;
    margin-top: 14px;
  }

  .mk-slots {
    grid-template-columns: repeat(2, 1fr);
  }

  .pz-scatter {
    grid-template-columns: repeat(2, 1fr);
    padding-bottom: 0;
  }

  .pz-site:nth-child(2), .pz-site:nth-child(4) {
    margin-top: 0;
  }

  .pz-fog {
    margin-top: 14px;
    position: static;
    transform: none;
  }

  .pz-c-svg, .pz-c-dot {
    display: none;
  }

  .pz-c-sites {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-bottom: 16px;
  }

  .pz-t-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .pz-t-lab {
    text-align: left;
  }

  .pz-bi-kpis {
    grid-template-columns: 1fr;
  }

  .pz-inv-badge--lock {
    position: static;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-chip, .mk-flystar, .mk-push, .mk-book, .mk-path, .mk-dot, .mk-out-pulse, .mk-flow-out--pos, .mk-flow-out--neg, .mk-slot--gap, .mk-slot--gap .mk-slot-was, .mk-ai-chip, .mk-ring-fg, .mk-kpi, .mk-ai-chip i, .pz-site, .pz-fog, .pz-c-line, .pz-c-dot, .pz-hub, .pz-inv-badge--ma, .pz-inv-badge--lock, .pz-ap--ok, .pz-t-bar i, .pz-bi-chart i, .pz-bi-live i {
    animation: none !important;
  }

  .mk-push, .mk-book, .mk-ai-chip {
    opacity: 1;
    transform: none;
  }

  .mk-slot--gap .mk-slot-new {
    opacity: 1;
    animation: none;
  }

  .mk-slot--gap .mk-slot-was {
    opacity: 0;
  }

  .mk-ring-fg {
    stroke-dashoffset: 9px;
  }

  .pz-inv-badge--ma {
    opacity: 0;
  }

  .pz-inv-badge--lock {
    opacity: 1;
  }

  .pz-t-bar i {
    transform: scaleX(1) !important;
  }

  .mk-dot {
    display: none;
  }
}

.it-beat {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 4.5vh, 48px);
  width: 100%;
  min-height: 92svh;
  display: flex;
}

#operacio-it .kek {
  background: linear-gradient(100deg, #38bdf8, #a5e3fc);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.it-shared {
  grid-template-columns: minmax(300px, 460px) minmax(230px, 300px);
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 4vw, 56px);
  width: 100%;
  display: grid;
}

.it-pc {
  background: #0a1020d9;
  border: 1px solid #f8717159;
  border-radius: 16px;
  overflow: hidden;
}

.it-pc-bar {
  border-bottom: 1px solid #94a3b824;
  gap: 5px;
  padding: 10px 13px;
  display: flex;
}

.it-pc-bar i {
  background: #94a3b84d;
  border-radius: 50%;
  width: 9px;
  height: 9px;
}

.it-pc-scr {
  flex-direction: column;
  gap: 14px;
  padding: 20px 22px 24px;
  display: flex;
}

.it-login {
  color: var(--text-secondary);
  font-size: .84rem;
}

.it-login b {
  color: #fca5a5;
  font-family: inherit;
}

.it-users {
  height: 44px;
  position: relative;
}

.it-u {
  color: var(--text-primary);
  opacity: 0;
  background: #f8717117;
  border: 1px solid #f8717166;
  border-radius: 999px;
  align-items: center;
  padding: 9px 16px;
  font-size: .86rem;
  font-weight: 600;
  animation: 7.5s ease-in-out infinite it-u;
  display: inline-flex;
  position: absolute;
  top: 0;
  left: 0;
}

.it-u--2 {
  animation-delay: 2.5s;
}

.it-u--3 {
  animation-delay: 5s;
}

@keyframes it-u {
  0%, 2% {
    opacity: 0;
    transform: translateY(6px);
  }

  7%, 28% {
    opacity: 1;
    transform: translateY(0);
  }

  33%, 100% {
    opacity: 0;
    transform: translateY(-6px);
  }
}

.it-search {
  color: var(--text-secondary);
  background: #f871710d;
  border: 1px dashed #f8717166;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: .82rem;
}

.it-search b {
  color: #fca5a5;
}

.it-pains {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.it-pain {
  color: var(--text-secondary);
  background: #f871710d;
  border: 1px solid #f871714d;
  border-radius: 999px;
  align-items: center;
  gap: 9px;
  padding: 9px 15px;
  font-size: .84rem;
  font-weight: 600;
  display: inline-flex;
}

.it-pain i {
  color: #f87171;
  background: #f871712e;
  border-radius: 50%;
  place-items: center;
  width: 17px;
  height: 17px;
  font-size: .68rem;
  font-style: normal;
  font-weight: 800;
  display: inline-grid;
}

.it-rbac-wrap {
  grid-template-columns: minmax(320px, 480px) minmax(260px, 360px);
  justify-content: center;
  align-items: start;
  gap: clamp(22px, 3.6vw, 48px);
  width: 100%;
  display: grid;
}

.it-rbac {
  background: #0f172abd;
  border: 1px solid #38bdf84d;
  border-radius: 18px;
  grid-template-columns: auto repeat(4, 1fr);
  align-items: center;
  gap: 8px;
  padding: 20px 22px;
  display: grid;
}

.it-rb-h {
  letter-spacing: .4px;
  text-transform: uppercase;
  color: var(--text-secondary);
  text-align: center;
  padding-bottom: 4px;
  font-size: .72rem;
  font-weight: 700;
}

.it-rb-r {
  color: var(--text-primary);
  white-space: nowrap;
  padding-right: 10px;
  font-size: .84rem;
  font-weight: 600;
}

.it-rbac i {
  background: #94a3b80d;
  border: 1px solid #94a3b824;
  border-radius: 8px;
  height: 30px;
  animation: 9s ease-in-out infinite it-cell;
  position: relative;
}

.it-rbac i:after {
  place-items: center;
  font-size: .82rem;
  font-weight: 800;
  display: grid;
  position: absolute;
  inset: 0;
}

.it-rbac i.ok {
  animation-name: it-cell-ok;
}

.it-rbac i.ok:after {
  content: "✓";
  color: #2ed592;
}

.it-rbac i.part {
  animation-name: it-cell-part;
}

.it-rbac i.part:after {
  content: "◐";
  color: #38bdf8;
  font-size: .7rem;
}

.it-rbac i.no:after {
  content: "✕";
  color: #94a3b873;
  font-size: .7rem;
}

@keyframes it-cell-ok {
  0%, 6% {
    background: #94a3b80d;
    border-color: #94a3b824;
  }

  16%, 92% {
    background: #2ed59214;
    border-color: #2ed59266;
  }

  98%, 100% {
    background: #94a3b80d;
    border-color: #94a3b824;
  }
}

@keyframes it-cell-part {
  0%, 10% {
    background: #94a3b80d;
    border-color: #94a3b824;
  }

  20%, 92% {
    background: #38bdf814;
    border-color: #38bdf866;
  }

  98%, 100% {
    background: #94a3b80d;
    border-color: #94a3b824;
  }
}

.it-rbac i.ok:after, .it-rbac i.part:after {
  opacity: 0;
  animation: 9s ease-in-out infinite it-mark;
}

@keyframes it-mark {
  0%, 10% {
    opacity: 0;
  }

  20%, 92% {
    opacity: 1;
  }

  98%, 100% {
    opacity: 0;
  }
}

.it-audit {
  background: #0f172abd;
  border: 1px solid #38bdf847;
  border-radius: 18px;
  flex-direction: column;
  gap: 12px;
  padding: 18px 20px;
  display: flex;
}

.it-audit-t {
  color: var(--text-primary);
  align-items: center;
  gap: 9px;
  font-size: .82rem;
  font-weight: 700;
  display: inline-flex;
}

.it-audit-t i {
  background: #38bdf8;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  animation: 1.6s ease-in-out infinite mk-live;
}

.it-log {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.it-l {
  color: var(--text-secondary);
  opacity: 0;
  background: #0a102099;
  border: 1px solid #94a3b824;
  border-radius: 9px;
  padding: 8px 12px;
  font-size: .76rem;
  animation: 8s ease-in-out infinite it-l;
  transform: translateY(6px);
}

.it-l b {
  color: #2ed592;
  font-weight: 600;
}

.it-l:first-child {
  animation-delay: 0s;
}

.it-l:nth-child(2) {
  animation-delay: 1.1s;
}

.it-l:nth-child(3) {
  animation-delay: 2.2s;
}

.it-l:nth-child(4) {
  animation-delay: 3.3s;
}

@keyframes it-l {
  0%, 3% {
    opacity: 0;
    transform: translateY(6px);
  }

  10%, 88% {
    opacity: 1;
    transform: translateY(0);
  }

  95%, 100% {
    opacity: 0;
    transform: translateY(-4px);
  }
}

.it-chips {
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  display: flex;
}

.it-chips span {
  color: var(--text-primary);
  background: #38bdf812;
  border: 1px solid #38bdf859;
  border-radius: 999px;
  padding: 8px 16px;
  font-size: .82rem;
  font-weight: 600;
}

.it-road {
  flex-direction: column;
  gap: 18px;
  width: min(620px, 92vw);
  padding-left: 34px;
  display: flex;
  position: relative;
}

.it-road-line {
  background: linear-gradient(#2ed59299, #38bdf880 55%, #94a3b840);
  width: 2px;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 11px;
}

.it-ms {
  background: #0f172ab8;
  border: 1px solid #94a3b833;
  border-radius: 14px;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  display: flex;
  position: relative;
}

.it-ms b {
  color: var(--text-primary);
  font-size: .95rem;
}

.it-ms-dot {
  background: #0b1120;
  border: 2px solid #94a3b866;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  position: absolute;
  left: -30px;
}

.it-ms--done .it-ms-dot {
  background: #2ed59259;
  border-color: #2ed592;
}

.it-ms--prog .it-ms-dot {
  background: #38bdf84d;
  border-color: #38bdf8;
  animation: 1.8s ease-in-out infinite mk-live;
}

.it-ms-tag {
  border-radius: 999px;
  margin-left: auto;
  padding: 4px 12px;
  font-size: .72rem;
  font-weight: 700;
}

.it-ms--done .it-ms-tag {
  color: #dcfce7;
  background: #2ed5921a;
  border: 1px solid #2ed59273;
}

.it-ms--prog .it-ms-tag {
  color: #bae6fd;
  background: #38bdf81a;
  border: 1px solid #38bdf880;
}

.it-ms--next .it-ms-tag {
  color: var(--text-secondary);
  background: #94a3b80f;
  border: 1px solid #94a3b84d;
}

.it-ms--done {
  border-color: #2ed5924d;
}

.it-ms--prog {
  border-color: #38bdf866;
  animation: 4s ease-in-out infinite it-prog;
}

@keyframes it-prog {
  0%, 100% {
    box-shadow: 0 0 #38bdf800;
  }

  50% {
    box-shadow: 0 12px 38px #38bdf829;
  }
}

.it-off {
  background: linear-gradient(#10182699, #0a0e1aad);
  border: 1px solid #38bdf838;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  padding: clamp(22px, 2.4vw, 34px) clamp(24px, 3vw, 44px);
  display: flex;
}

.it-off-toggle {
  align-items: center;
  gap: 14px;
  display: inline-flex;
}

.it-off-lbl {
  font-family: var(--font-display);
  color: var(--text-primary);
  font-size: clamp(14px, 1.2vw, 17px);
  font-weight: 700;
}

.it-off-sw {
  background: #94a3b824;
  border: 1px solid #94a3b866;
  border-radius: 999px;
  width: 46px;
  height: 26px;
  transition: background .5s .7s, border-color .5s .7s;
  position: relative;
}

.it-off-sw i {
  width: 18px;
  height: 18px;
  transition: transform .5s var(--ease-out) .7s, background .5s .7s;
  background: #94a3b8;
  border-radius: 50%;
  margin-top: -9px;
  position: absolute;
  top: 50%;
  left: 3px;
}

.it-off.in .it-off-sw {
  background: #38bdf847;
  border-color: #38bdf899;
}

.it-off.in .it-off-sw i {
  background: #38bdf8;
  transform: translateX(20px);
}

.it-off-scene {
  align-items: center;
  gap: 12px;
  display: flex;
}

.it-off-node {
  color: var(--text-primary);
  white-space: nowrap;
  background: #0e1624e6;
  border: 1px solid #38bdf866;
  border-radius: 11px;
  padding: 8px 15px;
  font-size: .8rem;
  font-weight: 600;
}

.it-off-node--site {
  border-color: #2ed59273;
}

.it-off.in .it-off-node--site {
  animation: 8s ease-in-out infinite it-off-site;
}

@keyframes it-off-site {
  0%, 18%, 78%, 100% {
    box-shadow: none;
  }

  30%, 62% {
    box-shadow: 0 0 0 1px #2ed59259, 0 10px 26px #2ed5921f;
  }
}

.it-off-line {
  background: #38bdf873;
  border-radius: 2px;
  width: clamp(120px, 16vw, 220px);
  height: 2px;
  position: relative;
  overflow: visible;
}

.it-off-gap {
  background: var(--bg-primary, #07070f);
  opacity: 0;
  border-radius: 2px;
  width: 24%;
  height: 4px;
  position: absolute;
  top: -1px;
  left: 38%;
}

.it-off.in .it-off-gap {
  animation: 8s ease-in-out infinite it-off-gap;
}

@keyframes it-off-gap {
  0%, 16% {
    opacity: 0;
    box-shadow: none;
  }

  20% {
    opacity: 1;
    box-shadow: 0 0 14px #f871718c;
  }

  24%, 64% {
    opacity: 1;
    box-shadow: none;
  }

  70%, 100% {
    opacity: 0;
  }
}

.it-off-wave {
  opacity: 0;
  background: #38bdf8;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  position: absolute;
  top: -3px;
  left: -6px;
  box-shadow: 0 0 10px #38bdf8b3;
}

.it-off.in .it-off-wave {
  animation: 8s ease-in-out infinite it-off-wave;
}

@keyframes it-off-wave {
  0%, 72% {
    opacity: 0;
    left: -6px;
  }

  76% {
    opacity: 1;
  }

  88% {
    opacity: 1;
    left: calc(100% - 2px);
  }

  92%, 100% {
    opacity: 0;
    left: calc(100% - 2px);
  }
}

.it-off-status {
  text-align: center;
  width: 100%;
  height: 1.3em;
  font-size: clamp(11px, 1vw, 13px);
  position: relative;
}

.it-off-status em {
  opacity: 0;
  font-style: normal;
  position: absolute;
  left: 0;
  right: 0;
}

.it-off-st1 {
  color: #7dd3fc;
}

.it-off-st2 {
  color: #fda4af;
}

.it-off-st3 {
  color: #86efac;
}

.it-off.in .it-off-st1 {
  animation: 8s ease-in-out infinite it-off-st1;
}

.it-off.in .it-off-st2 {
  animation: 8s ease-in-out infinite it-off-st2;
}

.it-off.in .it-off-st3 {
  animation: 8s ease-in-out infinite it-off-st3;
}

@keyframes it-off-st1 {
  0%, 14% {
    opacity: 1;
  }

  18%, 96% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes it-off-st2 {
  0%, 18% {
    opacity: 0;
  }

  24%, 62% {
    opacity: 1;
  }

  68%, 100% {
    opacity: 0;
  }
}

@keyframes it-off-st3 {
  0%, 68% {
    opacity: 0;
  }

  74%, 90% {
    opacity: 1;
  }

  96%, 100% {
    opacity: 0;
  }
}

@media (width <= 640px) {
  .it-off-scene {
    flex-direction: column;
    gap: 8px;
  }

  .it-off-line {
    width: 2px;
    height: 64px;
  }

  .it-off-gap {
    width: 4px;
    height: 24%;
    top: 38%;
    left: -1px;
  }

  .it-off-wave {
    top: -6px;
    left: -3px;
  }

  .it-off.in .it-off-wave {
    animation-name: it-off-wave-v;
  }

  @keyframes it-off-wave-v {
    0%, 72% {
      opacity: 0;
      top: -6px;
    }

    76% {
      opacity: 1;
    }

    88% {
      opacity: 1;
      top: calc(100% - 2px);
    }

    92%, 100% {
      opacity: 0;
      top: calc(100% - 2px);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .it-off.in .it-off-gap, .it-off.in .it-off-wave, .it-off.in .it-off-node--site, .it-off.in .it-off-st2, .it-off.in .it-off-st3 {
    animation: none !important;
  }

  .it-off.in .it-off-st1 {
    opacity: 1;
    animation: none !important;
  }

  .it-off-sw, .it-off-sw i {
    transition-delay: 0s;
  }
}

.it-esc {
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: clamp(10px, 2vw, 22px);
  display: flex;
}

.it-e {
  background: #0f172ab8;
  border: 1px solid #38bdf84d;
  border-radius: 16px;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  padding: 18px 26px;
  animation: 6s ease-in-out infinite it-e;
  display: flex;
}

.it-e:nth-child(3) {
  animation-delay: 2s;
}

.it-e:nth-child(5) {
  animation-delay: 4s;
}

@keyframes it-e {
  0%, 26%, 60%, 100% {
    box-shadow: none;
    border-color: #38bdf84d;
  }

  38% {
    border-color: #38bdf8b3;
    box-shadow: 0 12px 36px #38bdf824;
  }
}

.it-e-ico {
  background: #38bdf81a;
  border-radius: 12px;
  place-items: center;
  width: 42px;
  height: 42px;
  display: inline-grid;
}

.it-e-ico svg {
  fill: none;
  stroke: #38bdf8;
  stroke-width: 1.9px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 22px;
  height: 22px;
}

.it-e b {
  color: var(--text-primary);
  font-size: .92rem;
}

.it-e span:last-child {
  color: var(--text-secondary);
  font-size: .76rem;
}

.it-e-arr {
  color: #38bdf8b3;
  align-self: center;
  font-size: 1.2rem;
}

.it-pillars {
  margin-top: 6px;
}

@media (width <= 760px) {
  .it-beat {
    min-height: 0;
    padding: 12svh 0;
  }

  .it-shared, .it-rbac-wrap {
    grid-template-columns: 1fr;
  }

  .it-rbac {
    gap: 6px;
    padding: 14px;
  }

  .it-rb-r {
    font-size: .76rem;
  }

  .it-esc {
    flex-direction: column;
    align-items: stretch;
  }

  .it-e-arr {
    transform: rotate(90deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .it-u, .it-rbac i, .it-rbac i.ok:after, .it-rbac i.part:after, .it-l, .it-ms--prog, .it-ms--prog .it-ms-dot, .it-e, .it-audit-t i {
    animation: none !important;
  }

  .it-u--1 {
    opacity: 1;
  }

  .it-l {
    opacity: 1;
    transform: none;
  }

  .it-rbac i.ok:after, .it-rbac i.part:after {
    opacity: 1;
  }

  .it-rbac i.ok {
    background: #2ed59214;
    border-color: #2ed59266;
  }

  .it-rbac i.part {
    background: #38bdf814;
    border-color: #38bdf866;
  }
}

.gd-beat {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 4.5vh, 48px);
  width: 100%;
  min-height: 92svh;
  display: flex;
}

#operacio-gdpr .kek {
  background: linear-gradient(100deg, #D79BE6, #d6c7fd);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.gd-today {
  flex-direction: column;
  align-items: center;
  width: min(760px, 94vw);
  display: flex;
}

.gd-data {
  color: var(--text-primary);
  z-index: 2;
  background: #0f172ab8;
  border: 1px solid #94a3b852;
  border-radius: 16px;
  align-items: center;
  gap: 10px;
  padding: 13px 26px;
  font-weight: 700;
  display: inline-flex;
}

.gd-data svg {
  fill: none;
  stroke: #D79BE6;
  stroke-width: 1.9px;
  stroke-linecap: round;
  width: 20px;
  height: 20px;
}

.gd-today-svg {
  width: 100%;
  height: auto;
  margin: -4px 0 -18px;
}

.gd-t-line {
  fill: none;
  stroke: #f8717173;
  stroke-width: 1.8px;
  stroke-dasharray: 5 7;
  animation: 1.5s linear infinite mk-dash;
}

.gd-sinks {
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(12px, 2.4vw, 26px);
  width: 100%;
  display: grid;
}

.gd-sink {
  text-align: center;
  background: #f871710f;
  border: 1px solid #f8717159;
  border-radius: 14px;
  flex-direction: column;
  gap: 3px;
  padding: 14px 16px;
  animation: 6s ease-in-out infinite pz-flicker;
  display: flex;
}

.gd-sink:nth-child(2) {
  animation-delay: -2s;
}

.gd-sink:nth-child(3) {
  animation-delay: -4s;
}

.gd-sink b {
  color: var(--text-primary);
  font-size: .92rem;
}

.gd-sink i {
  color: #fca5a5d9;
  font-size: .76rem;
  font-style: normal;
}

.gd-sign-wrap {
  grid-template-columns: minmax(300px, 420px) minmax(240px, 320px);
  justify-content: center;
  align-items: center;
  gap: clamp(24px, 4vw, 56px);
  width: 100%;
  display: grid;
}

.gd-pad {
  background: #0f172abd;
  border: 1px solid #D79BE659;
  border-radius: 18px;
  flex-direction: column;
  gap: 14px;
  padding: 22px 24px;
  display: flex;
  box-shadow: 0 24px 60px #02061780;
}

.gd-pad-t {
  color: var(--text-primary);
  font-weight: 700;
}

.gd-pad-form {
  grid-template-columns: auto 1fr;
  gap: 7px 16px;
  font-size: .82rem;
  display: grid;
}

.gd-pad-form span {
  color: var(--text-secondary);
}

.gd-pad-form b {
  color: var(--text-primary);
  font-weight: 600;
}

.gd-sig {
  background: #D79BE60d;
  border: 1px dashed #D79BE673;
  border-radius: 12px;
}

.gd-sig svg {
  width: 100%;
  height: 60px;
  display: block;
}

.gd-sig-path {
  fill: none;
  stroke: #d6c7fd;
  stroke-width: 2.2px;
  stroke-linecap: round;
  stroke-dasharray: 320;
  stroke-dashoffset: 320px;
  animation: 7s ease-in-out infinite gd-sig;
}

@keyframes gd-sig {
  0%, 8% {
    stroke-dashoffset: 320px;
  }

  40%, 88% {
    stroke-dashoffset: 0;
  }

  96%, 100% {
    stroke-dashoffset: 320px;
  }
}

.gd-pad-hint {
  color: var(--text-secondary);
  font-size: .76rem;
}

.gd-sign-out {
  flex-direction: column;
  gap: 12px;
  display: flex;
}

.gd-ok-chip {
  color: var(--text-primary);
  opacity: 0;
  background: #2ed59212;
  border: 1px solid #2ed59266;
  border-radius: 13px;
  align-items: center;
  gap: 10px;
  padding: 11px 17px;
  font-size: .88rem;
  font-weight: 600;
  animation: 7s ease-in-out 2.4s infinite gd-chip;
  display: inline-flex;
  transform: translateY(6px);
}

.gd-ok-chip--2 {
  background: #D79BE612;
  border-color: #D79BE666;
  animation-delay: 3s;
}

.gd-ok-chip--3 {
  background: #D79BE612;
  border-color: #D79BE666;
  animation-delay: 3.6s;
}

.gd-ok-chip svg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 16px;
  height: 16px;
}

.gd-ok-chip--2 svg, .gd-ok-chip--3 svg {
  stroke: #D79BE6;
}

@keyframes gd-chip {
  0%, 6% {
    opacity: 0;
    transform: translateY(6px);
  }

  14%, 88% {
    opacity: 1;
    transform: translateY(0);
  }

  96%, 100% {
    opacity: 0;
  }
}

.gd-portal {
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: clamp(14px, 2.6vw, 30px);
  display: flex;
}

.gd-side {
  text-align: center;
  background: #0f172ab8;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  max-width: 300px;
  padding: 26px 30px 22px;
  display: flex;
  position: relative;
}

.gd-side b {
  color: var(--text-primary);
  font-size: 1rem;
}

.gd-side--ma {
  border: 1px solid #f8717166;
}

.gd-side--uj {
  border: 1px solid #2ed59273;
  animation: 5s ease-in-out infinite gd-uj;
}

@keyframes gd-uj {
  0%, 40%, 100% {
    box-shadow: none;
  }

  58% {
    box-shadow: 0 16px 48px #2ed59224;
  }
}

.gd-side-tag {
  letter-spacing: .5px;
  border-radius: 999px;
  padding: 3px 14px;
  font-size: .72rem;
  font-weight: 800;
  position: absolute;
  top: -11px;
  left: 50%;
  transform: translateX(-50%);
}

.gd-side--ma .gd-side-tag {
  color: #fca5a5;
  background: #1a0f16;
  border: 1px solid #f8717180;
}

.gd-side--uj .gd-side-tag {
  color: #bbf7d0;
  background: #0a1a14;
  border: 1px solid #2ed59280;
}

.gd-mail, .gd-lock {
  border-radius: 15px;
  place-items: center;
  width: 52px;
  height: 52px;
  display: inline-grid;
}

.gd-mail {
  background: #f871711a;
}

.gd-mail svg {
  fill: none;
  stroke: #f87171;
  stroke-width: 1.8px;
  width: 26px;
  height: 26px;
}

.gd-lock {
  background: #2ed5921a;
}

.gd-lock svg {
  fill: none;
  stroke: #2ed592;
  stroke-width: 1.8px;
  width: 26px;
  height: 26px;
}

.gd-side-note {
  color: var(--text-secondary);
  font-size: .78rem;
  line-height: 1.45;
}

.gd-portal-arr {
  color: #D79BE6cc;
  align-self: center;
  font-size: 1.5rem;
}

.gd-gov {
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: min(720px, 94vw);
  display: flex;
}

.gd-gov-tiles {
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  width: 100%;
  display: grid;
}

.gd-gt {
  background: #0f172abd;
  border: 1px solid #D79BE64d;
  border-radius: 15px;
  flex-direction: column;
  gap: 4px;
  padding: 16px 18px;
  display: flex;
}

.gd-gt b {
  color: var(--text-primary);
  font-size: .95rem;
}

.gd-gt span {
  color: var(--text-secondary);
  font-size: .78rem;
}

.gd-gt-b {
  border-radius: 999px;
  align-self: flex-start;
  margin-top: 7px;
  padding: 3px 11px;
  font-size: .7rem;
  font-style: normal;
  font-weight: 700;
}

.gd-gt-b--ok {
  color: #dcfce7;
  background: #2ed59217;
  border: 1px solid #2ed59273;
}

.gd-dpa {
  background: #D79BE60a;
  border: 1px dashed #D79BE666;
  border-radius: 15px;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 16px 20px;
  display: flex;
}

.gd-dpa-t {
  color: var(--text-primary);
  font-size: .84rem;
  font-weight: 700;
}

.gd-dpa-chips {
  flex-wrap: wrap;
  justify-content: center;
  gap: 9px;
  display: flex;
}

.gd-dpa-chips span {
  color: var(--text-secondary);
  background: #0f172a99;
  border: 1px solid #D79BE659;
  border-radius: 999px;
  padding: 6px 15px;
  font-size: .8rem;
}

.gd-ai-chip {
  color: var(--text-primary);
  background: #38bdf80f;
  border: 1px solid #38bdf866;
  border-radius: 999px;
  align-items: center;
  gap: 10px;
  padding: 9px 18px;
  font-size: .82rem;
  font-weight: 600;
  display: inline-flex;
}

.gd-ai-chip i {
  background: #38bdf8;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  animation: 1.6s ease-in-out infinite mk-live;
}

@media (width <= 760px) {
  .gd-beat {
    min-height: 0;
    padding: 12svh 0;
  }

  .gd-today-svg {
    display: none;
  }

  .gd-sinks {
    grid-template-columns: 1fr;
    margin-top: 14px;
  }

  .gd-sign-wrap {
    grid-template-columns: 1fr;
  }

  .gd-portal {
    flex-direction: column;
    align-items: stretch;
  }

  .gd-side {
    max-width: none;
  }

  .gd-portal-arr {
    transform: rotate(90deg);
  }

  .gd-gov-tiles {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gd-t-line, .gd-sink, .gd-sig-path, .gd-ok-chip, .gd-side--uj, .gd-ai-chip i {
    animation: none !important;
  }

  .gd-sig-path {
    stroke-dashoffset: 0;
  }

  .gd-ok-chip {
    opacity: 1;
    transform: none;
  }
}

section.offstage *, section.offstage :before, section.offstage :after {
  animation-play-state: paused !important;
}

#callcenter-terkep .kek {
  background: linear-gradient(100deg, #fb923c, #fdc79b);
  color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
}

.cct-wrap {
  grid-template-columns: minmax(380px, 1.25fr) minmax(280px, 1fr);
  align-items: start;
  gap: clamp(26px, 4vw, 64px);
  width: 100%;
  display: grid;
}

.cct-map-col {
  position: sticky;
  top: calc(50svh - clamp(190px, 29svh, 265px));
}

.cct-map {
  background: #0a1020b8;
  border: 1px solid #94a3b833;
  border-radius: 22px;
  height: clamp(380px, 58svh, 530px);
  position: relative;
  overflow: hidden;
  box-shadow: 0 30px 80px #0206178c;
}

.cct-svg {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.cct-srcs {
  z-index: 2;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  display: flex;
  position: absolute;
  top: 50%;
  left: 3.5%;
  transform: translateY(-50%);
}

.cct-src {
  color: var(--text-primary);
  background: #0f172ad9;
  border: 1px solid #94a3b852;
  border-radius: 999px;
  align-items: center;
  gap: 8px;
  padding: 9px 15px;
  font-size: .84rem;
  font-weight: 700;
  display: inline-flex;
}

.cct-src svg {
  fill: none;
  stroke: #fb923c;
  stroke-width: 1.9px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 15px;
  height: 15px;
}

.cct-src-n {
  color: var(--text-secondary);
  padding-left: 6px;
  font-size: .74rem;
}

.cct-line {
  fill: none;
  stroke-width: 1.8px;
  stroke-dasharray: 5 7;
  animation: 1.4s linear infinite mk-dash;
}

.cct-l-ma {
  stroke: #f8717180;
}

.cct-l-ai {
  stroke: #38bdf88c;
}

.cct-l-hum {
  stroke: #5BB8E68c;
}

.cct-l-out {
  stroke: #2ed59299;
}

.cct-dot {
  opacity: 0;
  animation: 3.4s linear infinite cct-travel;
}

.cct-d-ma {
  fill: #f87171;
}

.cct-d-ai {
  fill: #38bdf8;
}

.cct-d-hum {
  fill: #5BB8E6;
}

.cct-d-out {
  fill: #2ed592;
}

@keyframes cct-travel {
  0% {
    offset-distance: 0%;
    opacity: 0;
  }

  8% {
    opacity: 1;
  }

  92% {
    offset-distance: 100%;
    opacity: 1;
  }

  100% {
    offset-distance: 100%;
    opacity: 0;
  }
}

.cct-node {
  z-index: 2;
  background: #0f172ae0;
  border-radius: 14px;
  flex-direction: column;
  gap: 2px;
  padding: 12px 18px;
  display: flex;
  position: absolute;
}

.cct-node b {
  color: var(--text-primary);
  font-size: .9rem;
}

.cct-node span {
  color: var(--text-secondary);
  font-size: .74rem;
}

.cct-ops {
  border: 1px solid #5BB8E673;
  top: 46%;
  right: 6%;
}

.cct-jam {
  color: #fecaca;
  background: #200d12;
  border: 1px solid #f871718c;
  border-radius: 999px;
  padding: 3px 11px;
  font-size: .68rem;
  font-style: normal;
  font-weight: 800;
  animation: 1.6s ease-in-out infinite cct-jam;
  position: absolute;
  top: -12px;
  right: -8px;
}

@keyframes cct-jam {
  0%, 100% {
    box-shadow: 0 0 #f8717166;
  }

  55% {
    box-shadow: 0 0 0 8px #f8717100;
  }
}

.cct-ai {
  border: 1px solid #38bdf880;
  top: 9%;
  right: 6%;
}

.cct-chips-ai {
  z-index: 2;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 260px;
  display: flex;
  position: absolute;
  top: 27%;
  right: 6%;
}

.cct-chips-ai span {
  color: #bae6fd;
  background: #38bdf814;
  border: 1px solid #38bdf866;
  border-radius: 999px;
  padding: 4px 11px;
  font-size: .7rem;
  font-weight: 600;
}

.cct-inzert {
  z-index: 3;
  background: #0f172ae6;
  border: 1px solid #f8717166;
  border-radius: 14px;
  flex-direction: column;
  gap: 6px;
  padding: 14px 18px;
  display: flex;
  position: absolute;
  top: 8%;
  left: 26%;
}

.cct-iz-num {
  color: #fca5a5;
  font-variant-numeric: tabular-nums;
  font-size: .95rem;
  font-weight: 700;
}

.cct-iz-t {
  color: var(--text-primary);
  font-size: .8rem;
  font-weight: 600;
}

.cct-iz-w {
  color: var(--text-secondary);
  align-items: center;
  gap: 5px;
  font-size: .72rem;
  display: inline-flex;
}

.cct-iz-w i {
  background: #f8717114;
  border: 1px solid #f8717180;
  border-radius: 2.5px;
  width: 13px;
  height: 10px;
}

.cct-card {
  z-index: 3;
  background: #0f172aeb;
  border: 1px solid #2ed59273;
  border-radius: 14px;
  flex-direction: column;
  gap: 5px;
  max-width: 250px;
  padding: 14px 17px;
  display: flex;
  position: absolute;
  top: 60%;
  right: 4.5%;
}

.cct-c-name {
  color: var(--text-primary);
  font-size: .88rem;
  font-weight: 700;
}

.cct-c-name b {
  color: #2ed592;
  font-size: .74rem;
  font-weight: 600;
}

.cct-c-row {
  color: var(--text-secondary);
  background: #0a102099;
  border: 1px solid #94a3b829;
  border-radius: 7px;
  padding: 5px 9px;
  font-size: .76rem;
}

.cct-c-why {
  color: #86efac;
  background: #2ed59214;
  border: 1px solid #2ed59266;
  border-radius: 999px;
  align-self: flex-start;
  padding: 4px 10px;
  font-size: .74rem;
  font-weight: 700;
}

.cct-push {
  max-width: 55%;
  color: var(--text-secondary);
  z-index: 3;
  background: #38bdf80d;
  border: 1px dashed #38bdf873;
  border-radius: 12px;
  align-items: center;
  gap: 9px;
  padding: 9px 14px;
  font-size: .74rem;
  display: inline-flex;
  position: absolute;
  bottom: 6%;
  left: 5%;
}

.cct-push svg {
  fill: none;
  stroke: #38bdf8;
  stroke-width: 1.9px;
  stroke-linecap: round;
  flex: none;
  width: 15px;
  height: 15px;
}

.cct-cal {
  z-index: 3;
  background: #0f172aeb;
  border: 1px solid #2ed59259;
  border-radius: 14px;
  flex-direction: column;
  gap: 8px;
  padding: 13px 16px;
  display: flex;
  position: absolute;
  bottom: 5%;
  left: 5%;
  right: 5%;
}

.cct-cal-t {
  color: var(--text-primary);
  font-size: .78rem;
  font-weight: 700;
}

.cct-slots {
  grid-template-columns: repeat(7, 1fr);
  gap: 7px;
  display: grid;
}

.cct-slots i {
  background: #2ed5921f;
  border: 1px solid #2ed59259;
  border-radius: 6px;
  height: 22px;
}

.cct-slots i.hole {
  background: #f8717112;
  border-color: #f8717166;
  animation: 9s ease-in-out infinite cct-fill;
}

.cct-slots i.h2 {
  animation-delay: 1.2s;
}

.cct-slots i.h3 {
  animation-delay: 2.4s;
}

@keyframes cct-fill {
  0%, 18% {
    background: #f8717112;
    border-color: #f8717166;
  }

  30%, 92% {
    background: #2ed59247;
    border-color: #2ed5928c;
  }

  98%, 100% {
    background: #f8717112;
    border-color: #f8717166;
  }
}

.cct-cal-n {
  color: #86efac;
  font-size: .72rem;
}

.cct-triage {
  z-index: 4;
  background: #0f172af0;
  border: 1px solid #fb923c73;
  border-radius: 16px;
  flex-direction: column;
  gap: 12px;
  min-width: 62%;
  padding: 18px 24px;
  display: flex;
  position: absolute;
  top: 42%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 24px 70px #02061799;
}

.cct-tr-t {
  color: var(--text-primary);
  align-items: center;
  gap: 9px;
  font-size: .8rem;
  font-weight: 700;
  display: inline-flex;
}

.cct-tr-t i {
  background: #fb923c;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  animation: 1.6s ease-in-out infinite mk-live;
}

.cct-tr-rows {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.cct-tr {
  color: var(--text-secondary);
  align-items: baseline;
  gap: 10px;
  font-size: .84rem;
  display: flex;
}

.cct-tr b {
  color: var(--text-primary);
  text-align: right;
  font-variant-numeric: tabular-nums;
  min-width: 52px;
  font-size: 1.35rem;
  font-weight: 800;
}

.cct-g, .cct-inzert, .cct-card, .cct-push, .cct-cal, .cct-triage, .cct-ai, .cct-chips-ai, .cct-jam {
  opacity: 0;
  transition: opacity .7s, transform .7s;
}

.cct-g {
  transition: opacity .7s;
}

#callcenter-terkep.cct-ph1 .cct-g-ma, #callcenter-terkep.cct-ph1 .cct-inzert, #callcenter-terkep.cct-ph1 .cct-jam, #callcenter-terkep.cct-ph2 .cct-g-ai, #callcenter-terkep.cct-ph2 .cct-g-hum, #callcenter-terkep.cct-ph2 .cct-ai, #callcenter-terkep.cct-ph2 .cct-chips-ai, #callcenter-terkep.cct-ph2 .cct-card, #callcenter-terkep.cct-ph2 .cct-push {
  opacity: 1;
}

#callcenter-terkep.cct-ph3 .cct-g-ai, #callcenter-terkep.cct-ph3 .cct-g-hum {
  opacity: .35;
}

#callcenter-terkep.cct-ph3 .cct-ai, #callcenter-terkep.cct-ph3 .cct-chips-ai {
  opacity: .6;
}

#callcenter-terkep.cct-ph3 .cct-g-out, #callcenter-terkep.cct-ph3 .cct-cal {
  opacity: 1;
}

#callcenter-terkep.cct-ph4 .cct-g-ai, #callcenter-terkep.cct-ph4 .cct-g-hum, #callcenter-terkep.cct-ph4 .cct-g-out {
  opacity: .22;
}

#callcenter-terkep.cct-ph4 .cct-cal {
  opacity: .45;
}

#callcenter-terkep.cct-ph4 .cct-triage {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.cct-triage {
  transform: translate(-50%, -50%) scale(.94);
}

.cct-phases {
  flex-direction: column;
  gap: clamp(120px, 26svh, 240px);
  padding: 8svh 0 10svh;
  display: flex;
}

.cct-ph {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.cct-ph h3 {
  color: var(--text-primary);
  margin: 0;
  font-size: clamp(1.25rem, 2vw, 1.6rem);
  line-height: 1.25;
}

.cct-ph p {
  color: var(--text-secondary);
  margin: 0;
  font-size: .95rem;
  line-height: 1.6;
}

.cct-ph-tag {
  letter-spacing: .4px;
  border-radius: 999px;
  align-self: flex-start;
  padding: 4px 13px;
  font-size: .72rem;
  font-weight: 800;
}

.cct-ph-tag--ma {
  color: #fecaca;
  background: #f8717114;
  border: 1px solid #f8717180;
}

.cct-ph-tag--ai {
  color: #bae6fd;
  background: #38bdf814;
  border: 1px solid #38bdf880;
}

.cct-ph-tag--out {
  color: #bbf7d0;
  background: #2ed59214;
  border: 1px solid #2ed59280;
}

.cct-ph-tag--end {
  color: #fed7aa;
  background: #fb923c14;
  border: 1px solid #fb923c80;
}

@media (width <= 900px) {
  .cct-wrap {
    grid-template-columns: 1fr;
  }

  .cct-map-col {
    z-index: 5;
    position: sticky;
    top: 64px;
  }

  .cct-map {
    height: clamp(280px, 42svh, 380px);
  }

  .cct-phases {
    gap: clamp(90px, 18svh, 160px);
    padding-top: 5svh;
  }

  .cct-inzert {
    max-width: 62%;
    left: 30%;
  }

  .cct-chips-ai {
    display: none;
  }

  .cct-push {
    max-width: 70%;
  }

  .cct-triage {
    min-width: 80%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cct-line, .cct-dot, .cct-jam, .cct-slots i.hole, .cct-tr-t i {
    animation: none !important;
  }

  .cct-dot {
    display: none;
  }

  .cct-slots i.hole {
    background: #2ed59247;
    border-color: #2ed5928c;
  }
}

.dt-wrap {
  grid-template-columns: minmax(340px, 1.15fr) minmax(280px, 1fr);
  align-items: center;
  gap: clamp(26px, 4vw, 60px);
  width: 100%;
  display: grid;
}

.dt-hub {
  height: clamp(300px, 40vh, 380px);
  position: relative;
}

.dt-core {
  text-align: center;
  z-index: 2;
  background: #0f172adb;
  border: 1px solid #0092D580;
  border-radius: 18px;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 20px 24px;
  display: flex;
  position: absolute;
  top: 50%;
  left: 2%;
  transform: translateY(-50%);
  box-shadow: 0 20px 56px #0092D51f;
}

.dt-core svg {
  fill: none;
  stroke: #5BB8E6;
  stroke-width: 1.8px;
  width: 26px;
  height: 26px;
}

.dt-core b {
  color: var(--text-primary);
  font-size: .95rem;
}

.dt-core span {
  color: var(--text-secondary);
  font-size: .74rem;
}

.dt-svg {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.dt-link {
  fill: none;
  stroke: #5BB8E666;
  stroke-width: 1.8px;
  stroke-dasharray: 5 7;
  opacity: .35;
  animation: 1.5s linear infinite mk-dash;
}

.dt-mods {
  flex-direction: column;
  justify-content: center;
  gap: 12px;
  width: 46%;
  display: flex;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
}

.dt-mod {
  background: #0f172acc;
  border: 1px solid #94a3b83d;
  border-radius: 13px;
  flex-direction: column;
  gap: 2px;
  padding: 11px 16px;
  animation: 9s ease-in-out infinite dt-dock;
  display: flex;
}

.dt-mod b {
  color: var(--text-primary);
  font-size: .88rem;
}

.dt-mod i {
  color: var(--text-secondary);
  font-size: .72rem;
  font-style: normal;
}

.dt-mod--2 {
  animation-delay: 3s;
}

.dt-mod--3 {
  animation-delay: 6s;
}

@keyframes dt-dock {
  0%, 3% {
    box-shadow: none;
    border-color: #94a3b83d;
    transform: translateX(0);
  }

  8%, 26% {
    border-color: #5BB8E6a6;
    transform: translateX(-8px);
    box-shadow: 0 12px 36px #0092D529;
  }

  33%, 100% {
    box-shadow: none;
    border-color: #94a3b83d;
    transform: translateX(0);
  }
}

.dt-mod--plus {
  color: var(--text-secondary);
  background: #5BB8E60d;
  border-style: dashed;
  border-color: #5BB8E666;
  font-size: .8rem;
  font-weight: 600;
  animation: none;
}

.dt-link--1 {
  animation: 1.5s linear infinite mk-dash, 9s ease-in-out infinite dt-link;
}

.dt-link--2 {
  animation: 1.5s linear infinite mk-dash, 9s ease-in-out 3s infinite dt-link;
}

.dt-link--3 {
  animation: 1.5s linear infinite mk-dash, 9s ease-in-out 6s infinite dt-link;
}

@keyframes dt-link {
  0%, 3% {
    opacity: .35;
  }

  8%, 26% {
    opacity: 1;
  }

  33%, 100% {
    opacity: .35;
  }
}

.dt-pts {
  flex-direction: column;
  gap: 14px;
  display: flex;
}

@media (width <= 900px) {
  .dt-wrap {
    grid-template-columns: 1fr;
  }

  .dt-hub {
    flex-direction: column;
    gap: 14px;
    height: auto;
    display: flex;
  }

  .dt-core {
    align-self: center;
    position: static;
    transform: none;
  }

  .dt-svg {
    display: none;
  }

  .dt-mods {
    width: 100%;
    position: static;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dt-mod, .dt-link {
    animation: none !important;
  }

  .dt-link {
    opacity: .7;
  }
}

.role-card[style*="--ra"] .role-ico {
  background: linear-gradient(135deg, rgba(var(--ra), 1), rgba(var(--ra), .55));
  color: #fff;
  box-shadow: 0 10px 26px rgba(var(--ra), .28);
  border-color: #0000;
}

.role-card.featured[style*="--ra"] .role-ico {
  background: var(--grad-signature);
  color: #fff;
  border-color: #0000;
}

.role-card .role-body {
  justify-content: center;
}

.pnw-search {
  border: 1px solid rgba(var(--pv2), .45);
  color: #fff;
  background: #ffffff0d;
  border-radius: 12px;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 12px 16px;
  font-size: clamp(14px, 1.4vw, 18px);
  font-weight: 600;
  display: flex;
}

.pnw-search svg {
  fill: none;
  width: 17px;
  height: 17px;
  stroke: rgba(var(--pv2), .9);
  stroke-width: 2px;
  stroke-linecap: round;
  flex: none;
}

.pnw-type {
  white-space: nowrap;
  max-width: 0;
  animation: 9s steps(11, end) infinite pnw-type;
  display: inline-block;
  overflow: hidden;
}

@keyframes pnw-type {
  0%, 4% {
    max-width: 0;
  }

  22%, 92% {
    max-width: 11ch;
  }

  97%, 100% {
    max-width: 0;
  }
}

.pnw-caret {
  background: rgba(var(--pv2), .9);
  width: 2px;
  height: 1.15em;
  margin-left: -6px;
  animation: 1s step-end infinite pnw-caret;
}

@keyframes pnw-caret {
  0%, 49% {
    opacity: 1;
  }

  50%, 100% {
    opacity: 0;
  }
}

.pnw-grid--live b {
  opacity: 0;
  border: 1px solid rgba(var(--pv2), .22);
  background: #ffffff1a;
  animation: 9s ease-out infinite pnw-cell;
  transform: scale(.7);
}

.pnw-grid--live b:nth-child(2n) {
  animation-delay: 60ms;
}

.pnw-grid--live b:nth-child(3n) {
  animation-delay: .12s;
}

@keyframes pnw-cell {
  0%, 23% {
    opacity: 0;
    transform: scale(.7);
  }

  26%, 93% {
    opacity: 1;
    transform: scale(1);
  }

  98%, 100% {
    opacity: 0;
    transform: scale(.7);
  }
}

.pnw-grid--live b.on {
  animation-name: pnw-cell-on;
}

@keyframes pnw-cell-on {
  0%, 23% {
    opacity: 0;
    box-shadow: none;
    transform: scale(.7);
  }

  26%, 34% {
    opacity: 1;
    box-shadow: none;
    transform: scale(1);
  }

  40%, 93% {
    opacity: 1;
    box-shadow: 0 0 22px rgba(var(--pv2), .5);
    transform: scale(1.06);
  }

  98%, 100% {
    opacity: 0;
    transform: scale(.7);
  }
}

.pnx-scr[data-ch="web"] .pnw-btn {
  animation: 9s ease-in-out infinite pnw-press;
}

@keyframes pnw-press {
  0%, 44% {
    transform: scale(1);
  }

  48% {
    transform: scale(.96);
  }

  52%, 100% {
    transform: scale(1);
  }
}

.pnx-scr[data-ch="web"] .pnw-toast {
  opacity: 0;
  animation: 9s ease-out infinite pnw-toast;
  transform: translateY(8px);
}

@keyframes pnw-toast {
  0%, 52% {
    opacity: 0;
    transform: translateY(8px);
  }

  58%, 90% {
    opacity: 1;
    transform: translateY(0);
  }

  96%, 100% {
    opacity: 0;
    transform: translateY(8px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .pnw-type, .pnw-caret, .pnw-grid--live b, .pnx-scr[data-ch="web"] .pnw-btn, .pnx-scr[data-ch="web"] .pnw-toast {
    animation: none !important;
  }

  .pnw-type {
    max-width: 11ch;
  }

  .pnw-grid--live b, .pnx-scr[data-ch="web"] .pnw-toast {
    opacity: 1;
    transform: none;
  }
}

#homeBtn {
  cursor: pointer;
  width: 38px;
  height: 38px;
  color: var(--text-secondary);
  z-index: 2;
  background: #ffffff0a;
  border: 1px solid #94a3b847;
  border-radius: 10px;
  place-items: center;
  transition: color .3s, border-color .3s;
  display: inline-grid;
  position: absolute;
  top: 50%;
  right: clamp(168px, 16.4vw, 208px);
  transform: translateY(-50%);
}

#homeBtn:hover {
  color: var(--text-primary);
  border-color: #94a3b880;
}

#homeBtn svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  width: 17px;
  height: 17px;
}

.rsp-wp {
  white-space: nowrap;
  z-index: 1;
  pointer-events: auto;
  align-items: center;
  gap: 10px;
  display: inline-flex;
  position: absolute;
  left: 60px;
  transform: translateY(-50%);
}

.rsp-wp i {
  background: rgba(var(--rrf-a), .35);
  border: 1px solid rgba(var(--rrf-a), .5);
  border-radius: 50%;
  flex: none;
  width: 8px;
  height: 8px;
  transition: all .35s;
  transform: translateX(-50%);
}

.rsp-wp em {
  letter-spacing: .3px;
  color: rgba(var(--rrf-a), .95);
  text-overflow: ellipsis;
  border: 1px solid rgba(var(--rrf-a), .4);
  opacity: 0;
  pointer-events: none;
  background: #080c1aeb;
  border-radius: 999px;
  max-width: 168px;
  padding: 4px 12px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  transition: opacity .3s, transform .3s;
  overflow: hidden;
  transform: translateX(-6px);
}

.rsp-wp.on em, .rsp-wp:hover em {
  opacity: 1;
  transform: translateX(0);
}

.rsp-wp.on i {
  background: rgb(var(--rrf-a));
  box-shadow: 0 0 10px rgba(var(--rrf-a), .8);
}

@media (width <= 1240px) {
  .rsp-wp em {
    display: none;
  }
}

#mapnav .mn-sub {
  margin-top: 2px;
}

#mapnav {
  overscroll-behavior: contain;
  max-height: min(78vh, 880px);
  overflow-y: auto;
}

#orvos-dontes .dt-beat {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(22px, 4vh, 44px);
  width: 100%;
  min-height: 92svh;
  display: flex;
}

.dt-boxes {
  width: 100%;
}

@media (width <= 760px) {
  #orvos-dontes .dt-beat {
    min-height: 0;
    padding: 10svh 0;
  }
}

.fk-split {
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: clamp(14px, 2.6vw, 34px);
  width: 100%;
  display: flex;
}

.fkc-col {
  background: #0f172ab8;
  border-radius: 18px;
  flex-direction: column;
  flex: 320px;
  gap: 12px;
  max-width: 440px;
  padding: 30px 22px 22px;
  display: flex;
  position: relative;
}

.fkc-col--ma {
  border: 1px solid #f8717161;
}

.fkc-col--uj {
  border: 1px solid #2ed5926b;
  justify-content: center;
  animation: 5s ease-in-out infinite gd-uj;
}

.fkc-col--uj .fkc-box {
  align-items: flex-start;
  padding: 20px 22px;
  font-size: 1.06rem;
  line-height: 1.5;
}

.fkc-col--uj .fkc-box i {
  margin-top: 3px;
}

.fk-split {
  align-items: stretch;
}

.fkc-tag {
  letter-spacing: .5px;
  border-radius: 999px;
  padding: 3px 14px;
  font-size: .72rem;
  font-weight: 800;
  position: absolute;
  top: -11px;
  left: 22px;
}

.fkc-col--ma .fkc-tag {
  color: #fca5a5;
  background: #1a0f16;
  border: 1px solid #f8717180;
}

.fkc-col--uj .fkc-tag {
  color: #bbf7d0;
  background: #0a1a14;
  border: 1px solid #2ed59280;
}

.fkc-box {
  color: var(--text-primary);
  background: #0a102099;
  border: 1px solid #94a3b829;
  border-radius: 13px;
  align-items: center;
  gap: 11px;
  padding: 13px 16px;
  font-size: .94rem;
  font-weight: 600;
  display: flex;
}

.fkc-t {
  flex: 1;
  min-width: 0;
  display: block;
}

.fkc-t b {
  display: inline;
}

.fkc-col--uj .fkc-t {
  text-align: left;
  line-height: 1.55;
}

.fkc-box i {
  border-radius: 50%;
  flex: none;
  place-items: center;
  width: 20px;
  height: 20px;
  font-size: .72rem;
  font-style: normal;
  font-weight: 800;
  display: inline-grid;
}

.fkc-col--ma .fkc-box i {
  color: #f87171;
  background: #f8717126;
}

.fkc-col--uj .fkc-box i {
  color: #2ed592;
  background: #2ed59226;
}

.fkc-arrow {
  color: #D79BE6d9;
  align-self: center;
  font-size: 1.6rem;
}

[data-bxg] .rx-card, [data-bxg] .asz-pt, [data-bxg] .ea-card, [data-bxg] .mkc-pt {
  transition: opacity .45s, transform .45s, border-color .45s, box-shadow .45s;
}

[data-bxg]:has(.bx-on) .rx-card:not(.bx-on), [data-bxg]:has(.bx-on) .asz-pt:not(.bx-on), [data-bxg]:has(.bx-on) .ea-card:not(.bx-on), [data-bxg]:has(.bx-on) .mkc-pt:not(.bx-on) {
  opacity: .42;
  transform: scale(.985);
}

[data-bxg] .rx-card.bx-on, [data-bxg] .asz-pt.bx-on, [data-bxg] .ea-card.bx-on {
  opacity: 1;
  border-color: #D79BE68c;
  transform: scale(1);
  box-shadow: 0 16px 48px #D79BE624;
}

[data-bxg] .mkc-pt.bx-on {
  opacity: 1;
  border-color: #ec6ead8c;
  transform: scale(1);
  box-shadow: 0 16px 48px #ec6ead21;
}

@media (width <= 760px) {
  .fk-split {
    flex-direction: column;
  }

  .fkc-arrow {
    transform: rotate(90deg);
  }

  [data-bxg] .rx-card, [data-bxg] .asz-pt, [data-bxg] .ea-card, [data-bxg] .mkc-pt {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fkc-col--uj {
    animation: none !important;
  }

  [data-bxg] .rx-card, [data-bxg] .asz-pt, [data-bxg] .ea-card, [data-bxg] .mkc-pt {
    opacity: 1;
    transform: none;
  }
}

.vir-cards {
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 10px;
  margin: 14px 0;
  display: grid;
}

.vir-cards .rx-card {
  padding: 14px 16px;
}

.vir-cards .od-b-title {
  margin-bottom: 4px;
  font-size: .9rem;
}

.vir-cards .od-b-list li {
  font-size: .78rem;
}

.pz-beat--end {
  gap: clamp(18px, 3vh, 34px);
  min-height: 70svh;
}

.pa-phone {
  max-width: min(300px, 30vh) !important;
}

.pa-chapters {
  gap: 7px !important;
}

.pa-chapters .pa-ch {
  padding: 8px 12px !important;
  font-size: .84rem !important;
}

.gtt {
  width: min(1150px, 94vw);
}

#vege-utemezes .vg-head, #vege-utemezes .vg-lead {
  margin-bottom: 0;
}

#vege-utemezes .vg-inner {
  gap: clamp(14px, 2.2vh, 26px);
}

.gtt-weeks {
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  margin-bottom: 14px;
  display: grid;
}

.gtt-weeks span {
  text-align: center;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: var(--text-secondary);
  background: #94a3b80f;
  border: 1px solid #94a3b824;
  border-radius: 8px;
  padding: 7px 4px;
  font-size: .74rem;
  font-weight: 700;
}

.gtt-weeks .gtt-w-mile {
  color: #fecaca;
  background: #f8717114;
  border-color: #f8717173;
}

.gtt-rows {
  grid-template-columns: repeat(7, 1fr);
  grid-auto-rows: minmax(36px, auto);
  gap: 5px;
  display: grid;
  position: relative;
}

.gtt-bar {
  grid-column: calc(var(--c0) + 1) / span var(--cw);
  grid-row: calc(var(--r) + 1);
  opacity: 0;
  animation: gtt-in .6s var(--ease-out, ease-out) forwards;
  animation-delay: calc(var(--r) * .18s);
  background: #0092D51a;
  border: 1px solid #0092D566;
  border-radius: 11px;
  flex-direction: column;
  justify-content: center;
  gap: 0;
  padding: 5px 11px;
  display: flex;
  transform: translateX(-14px);
}

.gtt-bar b {
  color: var(--text-primary);
  font-size: .8rem;
  line-height: 1.15;
}

.gtt-bar em {
  color: var(--text-secondary);
  font-size: .7rem;
  font-style: normal;
}

.gtt-bar--par {
  border-style: dashed;
}

.gtt-bar--cont {
  background: #2ed59214;
  border-color: #2ed59273;
}

.gtt-bar--mile {
  background: #f871711a;
  border-color: #f871718c;
  flex-direction: row;
  align-items: center;
  gap: 9px;
}

.gtt-bar--mile b {
  color: #fecaca;
}

.gtt-bar--mile .gtt-flag {
  background: #f871712e;
  border-radius: 8px;
  flex: none;
  place-items: center;
  width: 26px;
  height: 26px;
  animation: 1.6s ease-in-out infinite cct-jam;
  display: inline-grid;
}

.gtt-bar--mile .gtt-flag svg {
  fill: none;
  stroke: #f87171;
  stroke-width: 2px;
  width: 14px;
  height: 14px;
}

@keyframes gtt-in {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.gtt.reveal-up:not(.in) .gtt-bar {
  animation-play-state: paused;
}

@media (width <= 860px) {
  .gtt-weeks {
    display: none;
  }

  .gtt-rows {
    grid-template-columns: 1fr;
  }

  .gtt-bar {
    grid-area: auto / 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gtt-bar {
    opacity: 1;
    animation: none;
    transform: none;
  }

  .gtt-bar--mile .gtt-flag {
    animation: none;
  }
}

#prPlans[data-plan="eves"] ~ .pr-total .pr-total-v {
  color: #fde2a8;
}

#prPlans[data-plan="eves"] ~ .pr-total .pr-badge {
  color: #fde2a8;
  background: #fac4501a;
  border-color: #fac4508c;
}

#prPlans[data-plan="eves"] ~ .pr-chart .pr-fill {
  background: linear-gradient(90deg, #b8860b, #fac450);
  box-shadow: 0 0 22px #fac45059;
}

#prPlans[data-plan="eves"] .pr-plans-thumb {
  background: linear-gradient(90deg, #fac45047, #fac45024);
}

#prPlans[data-plan="eves"] ~ .pr-foot .pr-lg-fill {
  background: linear-gradient(90deg, #b8860b, #fac450);
}

.pr-track:after {
  content: "";
  left: var(--w);
  pointer-events: none;
  background: repeating-linear-gradient(45deg, #2ed59257 0 6px, #2ed59224 6px 12px);
  border: 1px solid #2ed59259;
  border-left: none;
  border-radius: 0 8px 8px 0;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
}

.pr-track:before {
  content: "";
  background: #2ed592bf;
  border-radius: 2px;
  width: 2px;
  position: absolute;
  top: -4px;
  bottom: -4px;
  right: -1px;
}

.pr-save {
  color: #bbf7d0;
  background: #2ed5921f;
  border: 1px solid #2ed59280;
  border-radius: 999px;
  place-items: center;
  padding: 2px 8px;
  font-size: .68rem;
  font-style: normal;
  font-weight: 800;
  display: inline-grid;
}

.pr-vals s {
  color: #cbd5e1bf;
}

.pr-vars {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 14px;
  display: flex;
}

.pr-vars-t {
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--text-secondary);
  font-size: .74rem;
  font-weight: 800;
}

.pr-var-cards {
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  display: flex;
}

.pr-vc {
  background: #0f172a99;
  border: 1px solid #94a3b838;
  border-radius: 11px;
  align-items: baseline;
  gap: 9px;
  padding: 8px 14px;
  font-size: .8rem;
  display: inline-flex;
}

.pr-vc b {
  color: var(--text-primary);
  font-weight: 700;
}

.pr-vc i {
  color: var(--text-secondary);
  font-style: normal;
}

.pr-vc i s {
  opacity: .65;
}

.pr-vc i strong {
  color: #86efac;
  font-weight: 800;
}

.pr-vc em {
  color: #86efac;
  background: #2ed59214;
  border: 1px solid #2ed59266;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: .7rem;
  font-style: normal;
  font-weight: 800;
}

@media (width <= 760px) {
  .pr-var-cards {
    flex-direction: column;
    align-items: stretch;
  }
}

#vege-arazas .vg-inner {
  gap: clamp(12px, 2vh, 22px);
}

#vege-arazas .vg-head {
  margin-bottom: 0;
}

.pr-row {
  padding-top: 8px;
  padding-bottom: 8px;
}

.pr-track {
  height: 26px;
}

.pr-total {
  padding-top: 12px;
  padding-bottom: 12px;
}

.fd-status {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 7px;
  display: flex;
}

.fd-status i {
  color: #D79BE699;
  font-size: .82rem;
  font-style: normal;
}

.fd-st {
  color: var(--text-secondary);
  background: #0f172a99;
  border: 1px solid #94a3b842;
  border-radius: 999px;
  padding: 6px 13px;
  font-size: .74rem;
  font-weight: 700;
  animation: 9s ease-in-out infinite fd-st;
}

.fd-st:nth-child(3) {
  animation-delay: 1.3s;
}

.fd-st:nth-child(5) {
  animation-delay: 2.6s;
}

.fd-st:nth-child(7) {
  animation-delay: 3.9s;
}

.fd-st:nth-child(9) {
  animation-delay: 5.2s;
}

.fd-st--end {
  animation-delay: 6.5s;
}

@keyframes fd-st {
  0%, 6% {
    color: var(--text-secondary);
    background: #0f172a99;
    border-color: #94a3b842;
  }

  10%, 68% {
    color: #e9d5ff;
    background: #D79BE61f;
    border-color: #D79BE699;
  }

  76%, 100% {
    color: var(--text-secondary);
    background: #0f172a99;
    border-color: #94a3b842;
  }
}

.fd-plusz {
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  width: 100%;
  display: grid;
}

.fd-plusz .rx-card {
  padding: 16px 18px;
}

.fd-plusz .od-b-title {
  margin-bottom: 4px;
  font-size: .92rem;
}

.fd-plusz .od-b-list li {
  font-size: .78rem;
}

.fd-ma {
  color: #fca5a5cc;
  margin: 0 0 8px;
  font-size: .74rem;
  font-weight: 600;
}

@media (width <= 980px) {
  .fd-plusz {
    grid-template-columns: 1fr;
  }

  .fd-status {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fd-st {
    animation: none;
  }
}

section.offstage .rsp-trail {
  filter: none;
}

section.offstage .role-spine .rrf-ico {
  box-shadow: none;
}

.pnx-scr[data-ch="dap"] {
  gap: 10px;
}

.dap-face {
  background: #38785a24;
  border: 1px solid #46a07873;
  border-radius: 18px;
  align-self: center;
  place-items: center;
  width: 64px;
  height: 64px;
  animation: 9s ease-in-out infinite dap-face;
  display: grid;
}

.dap-face svg {
  fill: none;
  stroke: #6fcf9b;
  stroke-width: 1.6px;
  stroke-linecap: round;
  width: 36px;
  height: 36px;
}

@keyframes dap-face {
  0%, 4% {
    opacity: 0;
    transform: scale(.85);
  }

  9%, 22% {
    opacity: 1;
    transform: scale(1);
    box-shadow: 0 0 26px #46a07859;
  }

  30%, 92% {
    opacity: 1;
    box-shadow: none;
    transform: scale(1);
  }

  97%, 100% {
    opacity: 0;
  }
}

.dap-rows {
  flex-direction: column;
  gap: 7px;
  display: flex;
}

.dap-r {
  color: var(--text-primary);
  opacity: 0;
  background: #ffffff0a;
  border: 1px solid #94a3b829;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  font-size: .78rem;
  font-weight: 600;
  animation: 9s ease-in-out infinite dap-r;
  display: flex;
  transform: translateX(-10px);
}

.dap-r:nth-child(2) {
  animation-delay: .5s;
}

.dap-r:nth-child(3) {
  animation-delay: 1s;
}

.dap-r i {
  color: #6fcf9b;
  font-size: .7rem;
  font-style: normal;
}

@keyframes dap-r {
  0%, 14% {
    opacity: 0;
    transform: translateX(-10px);
  }

  22%, 92% {
    opacity: 1;
    transform: translateX(0);
  }

  97%, 100% {
    opacity: 0;
  }
}

.dap-karton {
  color: var(--text-secondary);
  align-items: center;
  gap: 8px;
  font-size: .72rem;
  display: inline-flex;
}

.dap-karton svg {
  fill: none;
  width: 14px;
  height: 14px;
  stroke: rgba(var(--pv2), .9);
  stroke-width: 1.9px;
}

.dap-sig {
  background: #46a0780d;
  border: 1px dashed #46a07873;
  border-radius: 12px;
  flex-direction: column;
  gap: 2px;
  padding: 8px 12px;
  display: flex;
}

.dap-sig svg {
  width: 100%;
  height: 40px;
}

.dap-sig em {
  color: var(--text-secondary);
  font-size: .68rem;
  font-style: normal;
}

.dap-sig-path {
  fill: none;
  stroke: #a7e6c4;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-dasharray: 300;
  stroke-dashoffset: 300px;
  animation: 9s ease-in-out infinite dap-sig;
}

@keyframes dap-sig {
  0%, 32% {
    stroke-dashoffset: 300px;
  }

  60%, 90% {
    stroke-dashoffset: 0;
  }

  97%, 100% {
    stroke-dashoffset: 300px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dap-face, .dap-r, .dap-sig-path {
    animation: none !important;
  }

  .dap-face, .dap-r {
    opacity: 1;
    transform: none;
  }

  .dap-sig-path {
    stroke-dashoffset: 0;
  }
}

#hero {
  text-align: left;
  align-items: flex-start;
  padding-left: clamp(40px, 7vw, 120px);
  padding-right: clamp(340px, 52vw, 800px);
  position: relative;
}

#hero > h1, #hero > p, #hero > .hero-chips, #hero > .scroll-hint {
  z-index: 1;
  position: relative;
}

#hero h1 {
  text-align: left;
}

.hero-paths {
  pointer-events: none;
  z-index: 0;
  width: min(280px, 26vw);
  height: min(560px, 80vh);
  position: absolute;
  top: 50%;
  right: clamp(90px, 15vw, 260px);
  transform: translateY(-50%);
}

.hero-paths svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.hp-alt {
  fill: none;
  stroke: #5BB8E652;
  stroke-width: 1.6px;
  stroke-dasharray: 4 7;
  animation: 6s ease-in-out infinite hp-alt;
}

.hp-alt--2 {
  animation-delay: -3s;
}

@keyframes hp-alt {
  0%, 100% {
    opacity: .4;
  }

  50% {
    opacity: .95;
  }
}

.hero-flex {
  max-width: 56ch;
  color: var(--text-primary);
  margin: clamp(14px, 2.6vh, 26px) 0 0;
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.6;
}

.hero-flex b {
  color: #8FD3F2;
}

.hero-chips {
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 10px;
  margin-top: clamp(14px, 2.2vh, 22px);
  display: flex;
}

.hero-chips span {
  color: var(--text-primary);
  background: #5BB8E61a;
  border: 1px solid #5BB8E673;
  border-radius: 999px;
  padding: 9px 18px;
  font-size: .92rem;
  font-weight: 700;
}

#hero .scroll-hint {
  align-self: flex-start;
  margin-top: clamp(16px, 3vh, 30px);
}

@media (width <= 900px) {
  #hero {
    text-align: center;
    align-items: center;
    padding-right: clamp(24px, 6vw, 48px);
  }

  #hero h1 {
    text-align: center;
  }

  .hero-paths {
    display: none;
  }

  .hero-chips {
    justify-content: center;
  }

  #hero .scroll-hint {
    align-self: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hp-alt {
    opacity: .7;
    animation: none;
  }
}

.pr-lg-save {
  background: repeating-linear-gradient(45deg, #2ed59280 0 5px, #2ed5922e 5px 10px) !important;
  border-color: #2ed59280 !important;
}

.cct-jam, .pz-hub, .gd-side--uj, .fkc-col--uj, .it-ms--prog, .mk-flow-out--pos, .mk-flow-out--neg, .gtt-flag {
  position: relative;
}

.pz-hub:after, .gd-side--uj:after, .fkc-col--uj:after, .it-ms--prog:after {
  content: "";
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
  opacity: 0;
  animation: 5s ease-in-out infinite glow-swell;
  position: absolute;
  inset: -2px;
}

.pz-hub:after {
  animation-duration: 4s;
  box-shadow: 0 18px 60px #fac45042;
}

.gd-side--uj:after, .fkc-col--uj:after {
  box-shadow: 0 16px 48px #2ed59224;
}

.it-ms--prog:after {
  animation-duration: 4s;
  box-shadow: 0 12px 38px #38bdf829;
}

.mk-flow-out--pos:after, .mk-flow-out--neg:after {
  content: "";
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
  opacity: 0;
  animation: 4.5s ease-in-out infinite glow-swell;
  position: absolute;
  inset: -1px;
  box-shadow: 0 14px 40px #ec6ead29;
}

.mk-flow-out--neg:after {
  animation-delay: 2.25s;
}

.pz-hub {
  box-shadow: 0 16px 48px #fac4501a;
}

@keyframes glow-swell {
  0%, 40%, 100% {
    opacity: 0;
  }

  58% {
    opacity: 1;
  }
}

.pz-hub, .gd-side--uj, .fkc-col--uj, .it-ms--prog, .mk-flow-out--pos, .mk-flow-out--neg {
  animation: none !important;
}

.cct-jam:after, .gtt-flag:after {
  content: "";
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  animation: 1.6s ease-out infinite ping-fade;
  position: absolute;
  inset: 0;
  box-shadow: 0 0 0 8px #f871712e;
}

.cct-jam, .gtt-flag {
  animation: none !important;
}

@keyframes ping-fade {
  0% {
    opacity: .9;
    transform: scale(.92);
  }

  70%, 100% {
    opacity: 0;
    transform: scale(1.12);
  }
}

.gtt-bar--mile .gtt-flag:after {
  opacity: 0;
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  .pz-hub:after, .gd-side--uj:after, .fkc-col--uj:after, .it-ms--prog:after, .mk-flow-out--pos:after, .mk-flow-out--neg:after, .cct-jam:after, .gtt-flag:after {
    opacity: 0;
    animation: none !important;
  }
}

body.lite [class] {
  backdrop-filter: none !important;
}

body.lite .rsp-trail, body.lite .hp-main {
  filter: none !important;
}

body.lite .pz-hub:after, body.lite .gd-side--uj:after, body.lite .fkc-col--uj:after, body.lite .it-ms--prog:after, body.lite .cct-jam:after, body.lite .gtt-flag:after {
  opacity: 0;
  animation: none;
}

body.lite .role-spine .rrf-ico {
  box-shadow: 0 0 0 1.6px rgb(var(--rrf-a));
}

.mkc-wrap {
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 1fr);
  align-items: center;
  gap: clamp(18px, 2.2vw, 34px);
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
}

.mkc-shot {
  width: 100%;
  margin: 0;
}

.mkc-ui {
  background: #080a14f7;
  grid-template-rows: auto 1fr;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  padding: clamp(14px, 1.5vw, 22px);
  display: grid;
}

.mkc-filters {
  flex-wrap: wrap;
  grid-column: 1 / -1;
  gap: 8px;
  display: flex;
}

.mkc-chip {
  color: var(--text-secondary);
  background: #ffffff08;
  border: 1px solid #94a3b84d;
  border-radius: 999px;
  padding: 6px 13px;
  font-size: .74rem;
  font-weight: 600;
}

.mkc-chip--on {
  color: #fbcfe8;
  background: #ec6ead1a;
  border-color: #ec6ead8c;
}

.mkc-chip--save {
  color: #f9a8d4;
  border-style: dashed;
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.mkc-chip--save svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8px;
  width: 12px;
  height: 12px;
}

.mkc-rows {
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.mkc-row {
  background: #ffffff06;
  border: 1px solid #94a3b829;
  border-radius: 11px;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  display: flex;
}

.mkc-row b {
  color: var(--text-primary);
  white-space: nowrap;
  font-size: .84rem;
}

.mkc-meta {
  color: var(--text-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .72rem;
  overflow: hidden;
}

.mkc-vip {
  color: #fde68a;
  white-space: nowrap;
  background: #fac4501a;
  border: 1px solid #fac45080;
  border-radius: 999px;
  margin-left: auto;
  padding: 3px 10px;
  font-size: .68rem;
  font-weight: 800;
}

.mkc-val {
  background: #94a3b82e;
  border-radius: 999px;
  width: 54px;
  height: 7px;
  margin-left: auto;
  position: relative;
  overflow: hidden;
}

.mkc-val i {
  width: calc(var(--v) * 100%);
  background: linear-gradient(90deg, #ec6eade6, #ec6ead73);
  border-radius: 999px;
  position: absolute;
  inset: 0;
}

.mkc-note {
  color: var(--text-secondary);
  align-items: center;
  gap: 4px;
  font-size: .7rem;
  display: inline-flex;
}

.mkc-note svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7px;
  width: 14px;
  height: 14px;
}

.mkc-note--ures {
  opacity: .45;
}

.mkc-row--bl {
  background: #f871710d;
  border-color: #f8717159;
}

.mkc-bl {
  color: #fca5a5;
  white-space: nowrap;
  background: #f8717114;
  border: 1px solid #f8717173;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  padding: 3px 10px;
  font-size: .68rem;
  font-weight: 700;
  display: inline-flex;
}

.mkc-bl svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8px;
  width: 12px;
  height: 12px;
}

.mkc-side {
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  min-width: 168px;
  display: flex;
}

.mkc-seg {
  color: var(--text-secondary);
  text-align: center;
  font-size: .74rem;
}

.mkc-seg b {
  color: #f9a8d4;
}

.mkc-sync {
  color: #fff;
  cursor: default;
  pointer-events: none;
  background: linear-gradient(135deg, #ec6ead80, #ec6ead38);
  border: 1px solid #ec6ead99;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 11px 16px;
  font-family: inherit;
  font-size: .82rem;
  font-weight: 700;
  display: inline-flex;
  position: relative;
}

.mkc-sync-ico {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9px;
  width: 15px;
  height: 15px;
  animation: 6s ease-in-out infinite mkc-spin;
}

@keyframes mkc-spin {
  0%, 55%, 100% {
    transform: rotate(0);
  }

  70%, 90% {
    transform: rotate(360deg);
  }
}

.mkc-sync-ok {
  fill: none;
  stroke: #86efac;
  stroke-width: 2.4px;
  stroke-linecap: round;
  opacity: 0;
  width: 15px;
  height: 15px;
  animation: 6s ease-in-out infinite mkc-ok;
  position: absolute;
  right: 9px;
}

@keyframes mkc-ok {
  0%, 88% {
    opacity: 0;
    transform: scale(.6);
  }

  93%, 98% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
  }
}

.mkc-ints {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 7px;
  display: flex;
}

.mkc-ints i {
  width: 24px;
  height: 24px;
  color: var(--text-secondary);
  background: #ffffff0a;
  border: 1px solid #94a3b84d;
  border-radius: 8px;
  place-items: center;
  font-size: .68rem;
  font-style: normal;
  font-weight: 800;
  display: grid;
}

.mkc-ints span {
  text-align: center;
  width: 100%;
  color: var(--text-muted);
  font-size: .66rem;
}

.mkc-pts {
  flex-direction: column;
  gap: clamp(9px, 1vh, 14px);
  display: flex;
}

.mkc-pt {
  border: 1px solid var(--station-border);
  text-align: left;
  background: linear-gradient(#12303E94, #0c0c18a8);
  border-radius: 14px;
  padding: clamp(12px, 1.3vw, 18px) clamp(14px, 1.5vw, 20px);
}

.mkc-pt h3 {
  font-family: var(--font-display);
  color: var(--text-primary);
  margin: 0 0 5px;
  font-size: clamp(13.5px, 1.1vw, 16px);
  font-weight: 700;
}

.mkc-pt p {
  color: var(--text-secondary);
  margin: 0;
  font-size: clamp(11.5px, .92vw, 13.5px);
  line-height: 1.45;
}

.mkc-pt p b {
  color: #f9a8d4;
  font-weight: 700;
}

@media (width <= 1060px) {
  .mkc-wrap {
    grid-template-columns: 1fr;
    max-width: 720px;
  }
}

@media (width <= 640px) {
  .mkc-ui {
    grid-template-columns: 1fr;
  }

  .mkc-side {
    flex-flow: wrap;
    justify-content: center;
    align-items: center;
  }

  .mkc-meta {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mkc-sync-ico, .mkc-sync-ok {
    animation: none;
  }

  .mkc-sync-ok {
    opacity: 1;
    transform: none;
  }
}

body.lite .mkc-sync-ico {
  animation: none;
}

.ft-note {
  color: var(--text-secondary);
  font-style: normal;
  font-weight: 600;
}

.ft-excl {
  text-align: left;
  color: var(--text-secondary);
  background: #f871710f;
  border: 1px solid #f8717152;
  border-radius: 13px;
  grid-column: 1 / -1;
  justify-content: center;
  align-items: center;
  gap: 11px;
  padding: 13px 20px;
  font-size: clamp(12.5px, 1.05vw, 15px);
  display: flex;
}

.ft-excl b {
  color: #fca5a5;
  font-weight: 700;
}

.ft-excl svg {
  fill: none;
  stroke: #f87171;
  stroke-width: 1.9px;
  stroke-linecap: round;
  flex: none;
  width: 17px;
  height: 17px;
}

html, body {
  overflow-x: clip;
}

.vf-cta {
  flex-direction: column;
  align-items: center;
  gap: 22px;
  margin-top: clamp(28px, 5vh, 52px);
  display: flex;
}

.vf-cta-lead {
  max-width: 560px;
  color: var(--text-secondary, #c8cbe0);
  margin: 0;
  font-size: clamp(16px, 1.5vw, 20px);
  line-height: 1.5;
}

.vf-cta-btn {
  color: #fff;
  background: linear-gradient(90deg, #0092D5, #B53ED0);
  border-radius: 40px;
  align-items: center;
  gap: 6px;
  padding: 16px 34px;
  font-size: 17px;
  font-weight: 600;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
  display: inline-flex;
  box-shadow: 0 10px 30px #0092D559;
}

.vf-cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 36px #B53ED073;
}

.vf-cta-btn:focus-visible {
  outline-offset: 4px;
  outline: 3px solid #8FD3F2;
}

.vf-cta--inline {
  align-items: flex-start;
  margin-top: clamp(22px, 4vh, 36px);
}

.hook-inner .vf-cta--inline {
  align-items: center;
}

.hdr-cta {
  color: #fff;
  letter-spacing: .02em;
  white-space: nowrap;
  z-index: 2;
  background: linear-gradient(90deg, #0092D5, #B53ED0);
  border-radius: 40px;
  align-items: center;
  gap: 4px;
  padding: 9px 18px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: box-shadow .2s;
  display: inline-flex;
  position: absolute;
  top: 50%;
  left: clamp(14px, 3vw, 32px);
  transform: translateY(-50%);
}

.hdr-cta:hover {
  box-shadow: 0 8px 24px #B53ED073;
}

.hdr-cta:focus-visible {
  outline-offset: 3px;
  outline: 3px solid #8FD3F2;
}

@media (width <= 900px) {
  .hdr-cta {
    display: none;
  }
}

body.vf-end #cobrand .hdr-cta {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.hdr-cta {
  transition: box-shadow .2s, opacity .3s, visibility .3s;
}

.vf-cta--beat {
  align-items: flex-start;
  gap: 16px;
  margin-top: clamp(20px, 3vh, 32px);
}

.vf-cta--end {
  margin: clamp(28px, 5vh, 48px) 0 clamp(18px, 3vh, 28px);
}

@media (width <= 420px) {
  #cobrand {
    justify-content: flex-start;
    padding-left: 14px;
  }

  .it-rbac {
    grid-template-columns: auto repeat(4, minmax(0, 1fr));
    gap: 4px;
    padding: 10px 6px;
  }

  .it-rb-h {
    letter-spacing: 0;
    overflow-wrap: anywhere;
    text-align: center;
    font-size: 8.5px;
  }

  .it-rb-r {
    font-size: 10.5px;
  }

  .it-audit {
    max-width: 100%;
  }
}