/* "Remote team command center" intro: plays once per visit */
.tx { position: fixed; inset: 0; z-index: 100000; background: #070B14; color: #EDF0F6; font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  display: flex; align-items: center; justify-content: center; overflow: hidden; transition: opacity .7s ease, visibility .7s; }
.tx::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(237,240,246,.11) 1px, transparent 1.4px); background-size: 22px 22px; mask-image: radial-gradient(ellipse at center, #000 30%, transparent 78%); -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 78%); }
.tx::after { content: ""; position: absolute; width: 900px; height: 900px; left: 50%; top: 46%; transform: translate(-50%, -50%); background: radial-gradient(circle, rgba(47,107,235,.20), rgba(255,122,26,.07) 40%, transparent 65%); pointer-events: none; }
.tx.is-out { opacity: 0; visibility: hidden; }
.tx__stage { position: relative; z-index: 1; width: min(1060px, 94vw); height: min(640px, 92vh); }
.tx__type { position: absolute; top: 0; left: 0; font: 400 15px/1.4 "JetBrains Mono", ui-monospace, monospace; color: #8FA6D9; letter-spacing: .02em; }
.tx__type b { color: #FF7A1A; font-weight: 400; }
.tx__type i { display: inline-block; width: 8px; height: 16px; background: #FF7A1A; margin-left: 3px; vertical-align: -2px; animation: tx-blink .8s steps(1) infinite; }
@keyframes tx-blink { 50% { opacity: 0; } }
.tx__skip { position: absolute; top: 0; right: 0; z-index: 3; font: 500 13px "Poppins", sans-serif; color: #EDF0F6; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: 8px 16px; cursor: pointer; }
.tx__skip:hover { background: rgba(255,255,255,.16); }
.tx__lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.tx__lines path { fill: none; stroke: rgba(143,166,217,.22); stroke-width: 1.5; }
.tx__lines path.flow { stroke: #FF7A1A; stroke-width: 2; stroke-dasharray: 6 14; animation: tx-flow 1s linear infinite; opacity: 0; transition: opacity .5s; filter: drop-shadow(0 0 4px rgba(255,122,26,.6)); }
.tx.s3 .tx__lines path.flow { opacity: .9; }
@keyframes tx-flow { to { stroke-dashoffset: -40; } }
.tx__core { position: absolute; left: 50%; top: 40%; width: 170px; height: 170px; transform: translate(-50%, -50%) scale(.6); opacity: 0; transition: transform .8s cubic-bezier(.2,.9,.3,1.2), opacity .6s; }
.tx.s2 .tx__core { transform: translate(-50%, -50%) scale(1); opacity: 1; }
.tx__ring { position: absolute; inset: 0; border-radius: 50%; border: 1.5px solid rgba(47,107,235,.55); border-top-color: #FF7A1A; animation: tx-spin 3.2s linear infinite; }
.tx__ring--2 { inset: -18px; border-color: rgba(143,166,217,.18); border-right-color: #2F6BEB; animation-duration: 5s; animation-direction: reverse; }
.tx__ring--3 { inset: -36px; border: 1px dashed rgba(143,166,217,.18); animation-duration: 12s; }
@keyframes tx-spin { to { transform: rotate(360deg); } }
.tx__core-in { position: absolute; inset: 22px; border-radius: 50%; display: grid; place-content: center; text-align: center;
  background: radial-gradient(circle at 50% 40%, #13203F, #0A1122 70%); box-shadow: 0 0 40px rgba(47,107,235,.45), inset 0 0 24px rgba(255,122,26,.18); }
.tx__core-in b { font-weight: 700; font-size: 30px; letter-spacing: .14em; color: #fff; }
.tx__core-in span { font: 600 11px/1 "Poppins", sans-serif; letter-spacing: .3em; color: #3DDC84; margin-top: 6px; }
.tx__core-in span::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #3DDC84; margin-right: 6px; box-shadow: 0 0 8px #3DDC84; vertical-align: 1px; animation: tx-pulse 1.4s infinite; }
@keyframes tx-pulse { 50% { opacity: .35; } }
.tx-card { position: absolute; width: 250px; padding: 14px 16px; border-radius: 14px; background: rgba(14,22,38,.86); border: 1px solid rgba(143,166,217,.22);
  box-shadow: 0 10px 30px -12px rgba(0,0,0,.6); opacity: 0; transform: translateY(10px); transition: opacity .5s, transform .5s; backdrop-filter: blur(6px); }
.tx.s3 .tx-card { opacity: 1; transform: none; }
.tx.s3 .tx-card:nth-of-type(2) { transition-delay: .12s; } .tx.s3 .tx-card:nth-of-type(3) { transition-delay: .24s; } .tx.s3 .tx-card:nth-of-type(4) { transition-delay: .36s; }
.tx-card h4 { margin: 0 0 8px; font: 600 13.5px/1.2 "Poppins", sans-serif; color: #fff; display: flex; align-items: center; gap: 8px; }
.tx-card h4 i { width: 8px; height: 8px; border-radius: 50%; background: #FF7A1A; box-shadow: 0 0 8px #FF7A1A; }
.tx__task { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #C9D4EE; min-height: 22px; }
.tx__task svg { width: 16px; height: 16px; flex: none; color: #3DDC84; opacity: 0; transform: scale(.4); transition: transform .3s cubic-bezier(.3,1.6,.5,1), opacity .2s; }
.tx__task.is-done svg { opacity: 1; transform: none; }
.tx__task span { transition: opacity .25s; }
.tx__task.is-swap span { opacity: 0; }
.tx__c1 { left: 0; top: 70px; } .tx__c2 { right: 0; top: 70px; } .tx__c3 { left: 0; top: 300px; } .tx__c4 { right: 0; top: 300px; }
.tx__head { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; opacity: 0; transform: translateY(14px); transition: opacity .7s, transform .7s; }
.tx.s4 .tx__head { opacity: 1; transform: none; }
.tx__head h1 { margin: 0 0 10px; font: 700 clamp(26px, 4vw, 44px)/1.12 "Poppins", sans-serif; letter-spacing: -.02em; color: #fff; }
.tx__head h1 em { font-style: normal; color: #FF7A1A; }
.tx__head p { margin: 0 0 18px; font-size: 14px; color: #8FA6D9; }
.tx__btn { display: inline-flex; align-items: center; gap: 8px; background: #2F6BEB; color: #fff; border: 0; border-radius: 10px; padding: 13px 24px; font: 600 15px "Poppins", sans-serif; cursor: pointer; box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 10px 30px -10px rgba(47,107,235,.8); }
.tx__btn:hover { background: #2559CC; }
@media (max-width: 760px) {
  .tx__stage { height: 94vh; width: 94vw; }
  .tx__type { font-size: 12.5px; top: 48px; }
  .tx__skip { top: -2px; padding: 7px 13px; font-size: 12px; }
  .tx__core { top: 20%; width: 120px; height: 120px; }
  .tx__core-in { inset: 16px; } .tx__core-in b { font-size: 22px; } .tx__core-in span { font-size: 9px; }
  .tx__ring--2 { inset: -12px; } .tx__ring--3 { inset: -24px; }
  .tx-cards { position: absolute; left: 0; right: 0; top: 34%; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .tx-card { position: static; width: auto; padding: 10px; }
  .tx-card h4 { font-size: 11.5px; margin-bottom: 6px; }
  .tx__task { font-size: 11px; min-height: 30px; align-items: flex-start; }
  .tx__task svg { width: 13px; height: 13px; margin-top: 1px; }
  .tx__lines { display: none; }
  .tx__head h1 { font-size: 25px; }
  .tx__head p { font-size: 12px; }
}
@media (max-height: 560px) and (min-width: 761px) { .tx__stage { transform: scale(.85); } }
/* guard against site-wide styles */
.tx h1, .tx h4 { font-family: "Poppins", system-ui, sans-serif !important; -webkit-text-fill-color: currentColor !important; background: none !important; }
.tx .tx__head h1 { color: #fff !important; font-weight: 700 !important; letter-spacing: -.02em !important; }
.tx .tx__head h1 em { color: #FF7A1A !important; -webkit-text-fill-color: #FF7A1A !important; }
.tx .tx-card { background: rgba(14,22,38,.86) !important; border: 1px solid rgba(143,166,217,.22) !important; border-radius: 14px !important; }
.tx .tx-card h4 { color: #fff !important; }
.tx .tx__btn { background: #2F6BEB !important; color: #fff !important; }