/* ============================================================
   YUNBU REEL / 站内示意影片播放器
   只服务评审包：不依赖网络与打包工具
   ============================================================ */

#yunbuReel{
  --rl-lime:#c8ff4d;
  --rl-cyan:#38e8ff;
  --rl-coral:#ff6b5a;
  --rl-violet:#a78bfa;
  --rl-gold:#e8c27a;
  --rl-paper:#f2efe7;
  --rl-ink:#070b12;
  position:fixed;inset:0;z-index:200;display:grid;place-items:center;
  padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s ease,visibility .4s;
  font-family:inherit;color:#fff;
}
/* visibility 在淡出过程中仍按「可见」插值（CSS 离散属性的规矩），整页遮罩会在这段窗口里吃掉点击；
   用不参与过渡的 pointer-events 把「关着」钉死成点不到，退场动效照旧。 */
#yunbuReel.is-open{opacity:1;visibility:visible;pointer-events:auto}
#yunbuReel *{box-sizing:border-box}
.rl-shell:fullscreen{
  width:100vw;height:100vh;max-width:none;border:0;border-radius:0;
  display:flex;flex-direction:column;background:#05070d;
}
.rl-shell:fullscreen .rl-stage{flex:1;aspect-ratio:auto;min-height:0}
.rl-shell:fullscreen .rl-chapters{flex:none}

.rl-backdrop{position:absolute;inset:0;background:rgba(2,4,9,.88);backdrop-filter:blur(18px) saturate(1.1)}
.rl-shell{
  position:relative;width:min(1120px,94vw);max-width:100%;
  background:#070b12;border:1px solid rgba(255,255,255,.14);border-radius:22px;overflow:hidden;
  box-shadow:0 60px 160px -50px #000,0 0 0 1px rgba(0,0,0,.4);
  transform:translateY(18px) scale(.985);transition:transform .55s cubic-bezier(.2,.8,.2,1);
}
#yunbuReel.is-open .rl-shell{transform:none}

/* ---------- top bar ---------- */
.rl-top{
  display:flex;align-items:center;gap:14px;padding:11px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.01));
}
.rl-mark{display:flex;align-items:center;gap:9px;flex:none}
.rl-mark img{width:23px;height:23px;object-fit:contain;display:block}
.rl-mark span{font-family:"Space Grotesk",sans-serif;font-size:9px;letter-spacing:.22em;color:rgba(255,255,255,.5);white-space:nowrap}
.rl-titlebar{display:flex;flex-direction:column;gap:4px;min-width:0}
.rl-titlebar b{font-size:13px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-titlebar small{font-family:"Space Grotesk",sans-serif;font-size:8px;letter-spacing:.16em;color:rgba(255,255,255,.34);white-space:nowrap}
.rl-badge{
  flex:none;display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;
  border:1px solid rgba(200,255,77,.34);background:rgba(200,255,77,.08);
  font-size:8.5px;letter-spacing:.1em;color:rgba(200,255,77,.9);white-space:nowrap;
}
.rl-badge i{width:5px;height:5px;border-radius:50%;background:var(--rl-lime);box-shadow:0 0 0 3px rgba(200,255,77,.14);animation:rlPulse 2s infinite}
.rl-pick{
  margin-left:auto;flex:none;max-width:240px;appearance:none;
  padding:7px 28px 7px 11px;border-radius:8px;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%23ffffff' opacity='.5'/%3E%3C/svg%3E") no-repeat right 11px center;
  color:rgba(255,255,255,.78);font-size:10px;letter-spacing:.04em;font-family:inherit;cursor:pointer;
}
.rl-pick option{background:#0b101a;color:#fff}
.rl-x{
  flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#fff;font-size:14px;
  cursor:pointer;transition:background .25s,border-color .25s,transform .25s;
}
.rl-x:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.36);transform:rotate(90deg)}

/* ---------- stage ---------- */
.rl-stage{
  position:relative;aspect-ratio:16/9;overflow:hidden;container-type:inline-size;
  background:radial-gradient(120% 100% at 70% 10%,rgba(56,232,255,.14),transparent 55%),
             radial-gradient(90% 90% at 12% 90%,rgba(167,139,250,.14),transparent 60%),
             #05070d;
  isolation:isolate;
}
.rl-grid{
  position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:5.5cqw 5.5cqw;
  mask-image:radial-gradient(120% 100% at 50% 40%,#000 30%,transparent 88%);
}
.rl-glow{
  position:absolute;z-index:0;inset:-20%;pointer-events:none;
  background:conic-gradient(from 120deg at 60% 45%,rgba(200,255,77,.10),rgba(56,232,255,.12),rgba(167,139,250,.10),rgba(255,107,90,.07),rgba(200,255,77,.10));
  filter:blur(70px);animation:rlDrift 26s linear infinite;
}
.rl-stage::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    radial-gradient(130% 100% at 50% 0%,transparent 45%,rgba(2,4,9,.55) 100%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px);
  mix-blend-mode:normal;
}
.rl-scan{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,transparent 0%,rgba(200,255,77,.05) 48%,transparent 52%);
  background-size:100% 220%;animation:rlScan 7s linear infinite;
}
.rl-scene{position:absolute;inset:0;z-index:1}
.rl-video{position:absolute;inset:0;z-index:1;display:none;width:100%;height:100%;object-fit:cover;background:#05070d}
.rl-stage.is-live .rl-video{display:block}
.rl-stage.is-live .rl-scene,.rl-stage.is-live .rl-shotno,.rl-stage.is-live .rl-chapters{display:none}

.rl-shot{
  position:absolute;inset:0;display:grid;grid-template-columns:1.02fr .98fr;
  gap:3.5cqw;padding:4.2cqw;animation:rlShotIn .55s cubic-bezier(.2,.8,.2,1) both;
}
.rl-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;z-index:2}
.rl-copy>*{animation:rlRise .7s cubic-bezier(.2,.8,.2,1) both}
.rl-copy>*:nth-child(1){animation-delay:.02s}
.rl-copy>*:nth-child(2){animation-delay:.1s}
.rl-copy>*:nth-child(3){animation-delay:.18s}
.rl-copy>*:nth-child(4){animation-delay:.26s}
.rl-kicker{
  display:flex;align-items:center;gap:.7cqw;
  font-family:"Space Grotesk",sans-serif;font-size:clamp(6px,1.02cqw,11px);
  letter-spacing:.2em;color:rgba(255,255,255,.46);text-transform:uppercase;
}
.rl-kicker i{width:1.5cqw;height:1px;background:var(--a,var(--rl-lime));box-shadow:0 0 8px var(--a,var(--rl-lime))}
.rl-title{
  margin:1.4cqw 0 0;font-size:clamp(18px,3.5cqw,50px);line-height:1.04;letter-spacing:-.045em;font-weight:700;
  text-wrap:balance;
}
.rl-title em{font-style:normal;color:var(--a,var(--rl-lime))}
.rl-sub{
  margin:1.5cqw 0 0;max-width:34ch;
  font-size:clamp(8.5px,1.14cqw,13px);line-height:1.75;color:rgba(255,255,255,.52);
}
.rl-metrics{display:flex;gap:2.4cqw;margin-top:2.2cqw;flex-wrap:wrap}
.rl-metrics div{display:flex;flex-direction:column;gap:.5cqw;padding-left:1.2cqw;border-left:1px solid rgba(255,255,255,.18)}
.rl-metrics b{font-family:"Space Grotesk",sans-serif;font-size:clamp(14px,2.3cqw,30px);line-height:1;letter-spacing:-.03em;color:var(--a,var(--rl-lime))}
.rl-metrics span{font-size:clamp(6.5px,.82cqw,9px);letter-spacing:.08em;color:rgba(255,255,255,.4)}

.rl-visual{position:relative;display:grid;place-items:center;min-width:0;min-height:0;z-index:1}
.rl-v{position:relative;width:100%;height:100%;display:grid;place-items:center;animation:rlVisualIn .9s cubic-bezier(.2,.8,.2,1) both;animation-delay:.08s}

.rl-hud{
  position:absolute;left:2.2cqw;top:1.8cqw;z-index:4;display:flex;align-items:center;gap:.8cqw;
  font-family:"Space Grotesk",sans-serif;font-size:clamp(6px,.72cqw,8px);letter-spacing:.16em;color:rgba(255,255,255,.38);
}
.rl-hud i{width:.55cqw;height:.55cqw;border-radius:50%;background:var(--rl-coral);box-shadow:0 0 0 .35cqw rgba(255,107,90,.16);animation:rlPulse 2.2s infinite}
.rl-hudtime{
  position:absolute;right:2.2cqw;top:1.8cqw;z-index:4;
  font-family:"Space Grotesk",sans-serif;font-size:clamp(6px,.72cqw,8px);letter-spacing:.12em;color:rgba(255,255,255,.32);
}
.rl-watermark{
  position:absolute;left:2.2cqw;bottom:1.6cqw;z-index:4;
  font-family:"Space Grotesk",sans-serif;font-size:clamp(5.5px,.64cqw,7px);letter-spacing:.18em;color:rgba(255,255,255,.2);
}
.rl-shotno{
  position:absolute;right:2.2cqw;bottom:1.6cqw;z-index:4;
  font-family:"Space Grotesk",sans-serif;font-size:clamp(5.5px,.64cqw,7px);letter-spacing:.14em;color:rgba(255,255,255,.24);
}
.rl-stage.is-paused .rl-shot,.rl-stage.is-paused .rl-shot *{
  animation-duration:0s!important;animation-delay:0s!important;
  animation-iteration-count:1!important;animation-play-state:running!important;
}
.rl-stage.is-paused .rl-glow,.rl-stage.is-paused .rl-scan{animation-play-state:paused!important}
.rl-stage.no-sub .rl-sub{display:none}

/* ---------- chapters ---------- */
.rl-chapters{
  display:flex;align-items:center;gap:6px;padding:8px 14px;overflow-x:auto;
  border-top:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.018);
  scrollbar-width:none;
}
.rl-chapters::-webkit-scrollbar{display:none}
.rl-ch{
  flex:none;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:6px;
  border:1px solid transparent;background:transparent;color:rgba(255,255,255,.42);
  font-size:9px;letter-spacing:.04em;font-family:inherit;cursor:pointer;transition:all .25s;white-space:nowrap;
}
.rl-ch b{font-family:"Space Grotesk",sans-serif;font-size:7.5px;letter-spacing:.1em;opacity:.6}
.rl-ch:hover{color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.12)}
.rl-ch.is-on{color:#fff;border-color:rgba(200,255,77,.36);background:rgba(200,255,77,.08)}
.rl-ch.is-on b{color:var(--rl-lime);opacity:1}

/* ---------- controls ---------- */
.rl-controls{display:flex;align-items:center;gap:13px;padding:10px 15px 11px;background:#060910}
.rl-btn{
  flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);
  color:rgba(255,255,255,.82);font-size:12px;cursor:pointer;transition:all .25s;font-family:inherit;line-height:1;
}
.rl-btn:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.34)}
.rl-btn--play{
  width:40px;height:40px;border:0;background:var(--rl-lime);color:#070b12;font-size:13px;
  box-shadow:0 6px 24px -6px rgba(200,255,77,.55);
}
.rl-btn--play:hover{background:#d8ff7a;transform:scale(1.04)}
.rl-btn.is-on{border-color:rgba(200,255,77,.4);color:var(--rl-lime);background:rgba(200,255,77,.08)}
.rl-clock{flex:none;font-family:"Space Grotesk",sans-serif;font-size:10px;letter-spacing:.06em;color:rgba(255,255,255,.55);font-variant-numeric:tabular-nums}
.rl-clock b{color:#fff;font-weight:500}
.rl-track{position:relative;flex:1;height:24px;display:flex;align-items:center;cursor:pointer;touch-action:none;min-width:60px}
.rl-track::before{content:"";position:absolute;left:0;right:0;height:4px;border-radius:3px;background:rgba(255,255,255,.12)}
.rl-fill{position:absolute;left:0;height:4px;border-radius:3px;background:linear-gradient(90deg,var(--rl-cyan),var(--rl-lime));width:0;box-shadow:0 0 12px rgba(200,255,77,.4)}
.rl-fill::after{
  content:"";position:absolute;right:-5px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;
  background:#fff;box-shadow:0 0 0 3px rgba(200,255,77,.2);
}
.rl-ticks{position:absolute;inset:0;pointer-events:none}
.rl-ticks i{position:absolute;top:50%;width:1px;height:8px;margin-top:-4px;background:rgba(255,255,255,.3)}
.rl-tags{display:flex;align-items:center;gap:5px;flex:none}
.rl-tags span{
  font-family:"Space Grotesk",sans-serif;font-size:7px;letter-spacing:.12em;color:rgba(255,255,255,.28);
  padding:4px 6px;border:1px solid rgba(255,255,255,.1);border-radius:4px;white-space:nowrap;
}
.rl-foot{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:7px 16px 9px;border-top:1px solid rgba(255,255,255,.06);
  font-size:8px;letter-spacing:.04em;color:rgba(255,255,255,.26);
}
.rl-foot b{font-weight:400;color:rgba(255,255,255,.4)}

/* ============================================================
   视觉模块（cqw 随舞台宽度缩放）
   ============================================================ */
.rl-v small{font-size:clamp(5.5px,.62cqw,8px);line-height:1.4}
.rl-v b{line-height:1}

/* opening */
.rl-v--opening{place-items:center}
.rl-rings{position:absolute;inset:0;display:grid;place-items:center}
.rl-rings i{position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%;width:16cqw;height:16cqw;animation:rlRing 5s ease-out infinite}
.rl-rings i:nth-child(2){width:26cqw;height:26cqw;animation-delay:.8s;border-color:rgba(200,255,77,.16)}
.rl-rings i:nth-child(3){width:36cqw;height:36cqw;animation-delay:1.6s;border-color:rgba(56,232,255,.12)}
.rl-rings i:nth-child(4){width:46cqw;height:46cqw;animation-delay:2.4s;border-color:rgba(255,255,255,.06)}
.rl-core{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.6cqw;z-index:1}
.rl-core img{width:11cqw;height:11cqw;object-fit:contain;filter:drop-shadow(0 0 24px rgba(200,255,77,.2));animation:rlFloat 6s ease-in-out infinite}
.rl-core span{font-family:"Space Grotesk",sans-serif;font-size:1.35cqw;letter-spacing:.5em;color:rgba(255,255,255,.55);padding-left:.5em}
.rl-coord{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);font-family:"Space Grotesk",sans-serif;font-size:.68cqw;letter-spacing:.24em;color:rgba(255,255,255,.25)}

/* 15 grid */
.rl-v--matrix{padding:2cqw}
.rl-matrix{display:grid;grid-template-columns:repeat(5,1fr);gap:.85cqw;width:90%;max-height:92%}
.rl-cell{
  position:relative;display:grid;place-items:center;aspect-ratio:1.35;border-radius:.6cqw;
  border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);
  animation:rlCell .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.05s);
}
.rl-cell b{font-family:"Space Grotesk",sans-serif;font-size:1.05cqw;color:rgba(255,255,255,.34);letter-spacing:.06em}
.rl-cell:nth-child(3n+1){border-color:rgba(200,255,77,.28);background:rgba(200,255,77,.06)}
.rl-cell:nth-child(3n+1) b{color:rgba(200,255,77,.9)}
.rl-cell:nth-child(4n+2){border-color:rgba(56,232,255,.28);background:rgba(56,232,255,.06)}
.rl-cell:nth-child(4n+2) b{color:rgba(56,232,255,.9)}
.rl-cell:nth-child(5n+3){border-color:rgba(167,139,250,.3);background:rgba(167,139,250,.07)}
.rl-cell:nth-child(5n+3) b{color:rgba(167,139,250,.95)}
.rl-cell::after{content:"";position:absolute;inset:auto 12% 16% 12%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);opacity:.5}

/* browser */
.rl-v--web{place-items:center}
.rl-browser{
  position:relative;width:88%;aspect-ratio:16/10;border-radius:.8cqw;overflow:hidden;
  border:1px solid rgba(255,255,255,.18);background:linear-gradient(155deg,#0d1522,#060a11);
  box-shadow:0 2.4cqw 5cqw rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.3);
}
.rl-browser__bar{display:flex;align-items:center;gap:.55cqw;height:11%;padding:0 1.3cqw;border-bottom:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045)}
.rl-browser__bar i{width:.6cqw;height:.6cqw;border-radius:50%;background:rgba(255,255,255,.28)}
.rl-browser__bar i:first-child{background:rgba(255,107,90,.7)}
.rl-browser__bar i:nth-child(2){background:rgba(232,194,122,.65)}
.rl-browser__bar i:nth-child(3){background:rgba(200,255,77,.6)}
.rl-browser__bar span{margin-left:.9cqw;font-family:"Space Grotesk",sans-serif;font-size:.66cqw;letter-spacing:.08em;color:rgba(255,255,255,.34)}
.rl-browser__bar em{margin-left:auto;font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:.58cqw;letter-spacing:.1em;color:rgba(200,255,77,.8)}
.rl-browser__page{position:relative;height:89%;padding:1.6cqw;display:flex;flex-direction:column;gap:1.1cqw}
.rl-wire{display:flex;flex-direction:column;gap:.6cqw;padding:1.2cqw;border-radius:.4cqw;background:linear-gradient(120deg,rgba(56,232,255,.14),rgba(200,255,77,.06));border:1px solid rgba(255,255,255,.08)}
.rl-wire span{display:block;height:.55cqw;border-radius:1px;background:rgba(255,255,255,.34);animation:rlWire 2.4s ease-in-out infinite alternate}
.rl-wire span:nth-child(1){width:62%;height:.9cqw;background:rgba(255,255,255,.68);animation-delay:.1s}
.rl-wire span:nth-child(2){width:44%;animation-delay:.25s}
.rl-wire span:nth-child(3){width:74%;height:.4cqw;background:rgba(255,255,255,.2);animation-delay:.4s}
.rl-wire-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.8cqw;flex:1}
.rl-wire-row i{display:block;border-radius:.35cqw;border:1px solid rgba(255,255,255,.09);background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));animation:rlCell .8s ease both}
.rl-wire-row i:nth-child(2){animation-delay:.12s}
.rl-wire-row i:nth-child(3){animation-delay:.24s}
.rl-scanline{position:absolute;left:0;right:0;height:12%;background:linear-gradient(180deg,transparent,rgba(200,255,77,.16),transparent);animation:rlSweep 3.2s ease-in-out infinite}
.rl-score{
  position:absolute;right:2%;bottom:8%;width:7.6cqw;height:7.6cqw;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:1px solid rgba(200,255,77,.4);background:rgba(5,9,14,.86);box-shadow:0 0 3cqw rgba(200,255,77,.14);
  animation:rlFloat 5s ease-in-out infinite;
}
.rl-score b{font-family:"Space Grotesk",sans-serif;font-size:1.9cqw;color:var(--rl-lime);letter-spacing:-.03em}
.rl-score span{font-family:"Space Grotesk",sans-serif;font-size:.48cqw;letter-spacing:.12em;color:rgba(255,255,255,.4);margin-top:.25cqw}

/* commerce */
.rl-v--shop{display:flex;flex-direction:column;justify-content:center;gap:1.3cqw;width:92%}
.rl-kpi{padding:1.4cqw 1.6cqw;border-radius:.7cqw;border:1px solid rgba(200,255,77,.24);background:linear-gradient(140deg,rgba(200,255,77,.1),rgba(255,255,255,.02))}
.rl-kpi small{display:block;font-family:"Space Grotesk",sans-serif;font-size:.62cqw;letter-spacing:.12em;color:rgba(255,255,255,.4)}
.rl-kpi b{display:block;margin-top:.5cqw;font-family:"Space Grotesk",sans-serif;font-size:2.5cqw;letter-spacing:-.04em;color:#fff}
.rl-kpi em{font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:.72cqw;color:var(--rl-lime);margin-left:.6cqw}
.rl-bars{display:flex;align-items:flex-end;gap:.6cqw;height:12cqw;padding:0 .3cqw}
.rl-bars i{
  flex:1;border-radius:.2cqw .2cqw 0 0;background:linear-gradient(to top,rgba(56,232,255,.12),rgba(56,232,255,.65));
  animation:rlBar 1.4s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.08s);transform-origin:bottom;
}
.rl-bars i:nth-child(3n){background:linear-gradient(to top,rgba(200,255,77,.12),rgba(200,255,77,.7))}
.rl-feed{display:flex;flex-direction:column;gap:.42cqw}
.rl-feed span{display:flex;justify-content:space-between;gap:1cqw;padding:.55cqw .9cqw;border-radius:.35cqw;background:rgba(255,255,255,.04);font-size:.58cqw;color:rgba(255,255,255,.52);border:1px solid rgba(255,255,255,.06)}
.rl-feed span b{font-family:"Space Grotesk",sans-serif;font-weight:500;color:var(--rl-lime);font-size:.55cqw;letter-spacing:.06em}

/* phones */
.rl-v--mini{width:100%}
.rl-phones{display:flex;align-items:center;justify-content:center;gap:1.1cqw;width:100%}
.rl-phone{
  position:relative;width:19%;aspect-ratio:9/18.5;border-radius:1.15cqw;padding:.55cqw;
  border:1px solid rgba(255,255,255,.2);background:#0a0f18;
  box-shadow:0 1.6cqw 3.4cqw rgba(0,0,0,.6);animation:rlPhone .8s cubic-bezier(.2,.8,.2,1) both;
}
.rl-phone:nth-child(2){animation-delay:.12s;transform:translateY(-1.2cqw) scale(1.05)}
.rl-phone:nth-child(3){animation-delay:.24s}
.rl-phone__screen{position:relative;height:100%;border-radius:.75cqw;overflow:hidden;background:linear-gradient(175deg,#111a28,#070b12)}
.rl-phone__notch{position:absolute;left:50%;top:.35cqw;transform:translateX(-50%);width:34%;height:.45cqw;border-radius:1cqw;background:#02040a;z-index:2}
.rl-phone__hero{height:38%;background:linear-gradient(140deg,rgba(56,232,255,.35),rgba(167,139,250,.18));position:relative}
.rl-phone__hero::after{content:"";position:absolute;inset:auto 12% 12% 12%;height:.35cqw;background:rgba(255,255,255,.6);border-radius:1px}
.rl-phone__rows{display:flex;flex-direction:column;gap:.38cqw;padding:.7cqw .55cqw}
.rl-phone__rows i{height:.4cqw;border-radius:1px;background:rgba(255,255,255,.18)}
.rl-phone__rows i:nth-child(odd){width:86%}
.rl-phone__tab{position:absolute;left:.55cqw;right:.55cqw;bottom:.55cqw;height:.55cqw;border-radius:.3cqw;background:rgba(255,255,255,.1);display:flex;gap:.2cqw}
.rl-phone__tab i{flex:1;border-radius:.15cqw;background:rgba(255,255,255,.18)}
.rl-phone__tab i:first-child{background:rgba(200,255,77,.7)}
.rl-phone small{position:absolute;left:0;right:0;bottom:-1.5cqw;text-align:center;font-family:"Space Grotesk",sans-serif;font-size:.55cqw;letter-spacing:.16em;color:rgba(255,255,255,.4)}
.rl-phone:nth-child(2) small{color:var(--rl-lime)}
.rl-v--mini{padding-bottom:1.8cqw}

/* map / investment */
.rl-v--map{width:94%;height:92%;position:relative;border-radius:.8cqw;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03)}
.rl-mapgrid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:3.2cqw 3.2cqw;opacity:.6}
.rl-dot{position:absolute;left:var(--x);top:var(--y);width:1.05cqw;height:1.05cqw;margin:-.5cqw;border-radius:50%;background:var(--rl-lime);box-shadow:0 0 0 .35cqw rgba(200,255,77,.16),0 0 1.6cqw rgba(200,255,77,.5);animation:rlDot 2.6s ease-in-out infinite;animation-delay:calc(var(--i)*-.35s)}
.rl-dot.c{background:var(--rl-cyan);box-shadow:0 0 0 .35cqw rgba(56,232,255,.16),0 0 1.6cqw rgba(56,232,255,.5)}
.rl-dot.v{background:var(--rl-violet);box-shadow:0 0 0 .35cqw rgba(167,139,250,.16),0 0 1.6cqw rgba(167,139,250,.5)}
.rl-lead{
  position:absolute;right:1.4cqw;bottom:1.4cqw;display:flex;flex-direction:column;gap:.45cqw;
  width:44%;padding:.9cqw;border-radius:.5cqw;background:rgba(5,8,14,.86);border:1px solid rgba(255,255,255,.14);
}
.rl-lead span{display:flex;justify-content:space-between;gap:.6cqw;font-size:.55cqw;color:rgba(255,255,255,.5)}
.rl-lead span b{font-family:"Space Grotesk",sans-serif;font-weight:500;color:var(--rl-lime);font-size:.52cqw}
.rl-lead strong{font-size:.72cqw;font-weight:600;color:#fff;letter-spacing:.02em;padding-bottom:.35cqw;border-bottom:1px solid rgba(255,255,255,.1)}

/* line chart */
.rl-v--line{width:92%;height:88%}
.rl-chart{width:100%;height:100%;overflow:visible}
.rl-chart .axis{stroke:rgba(255,255,255,.1);stroke-width:1}
.rl-chart .grid{stroke:rgba(255,255,255,.06);stroke-width:1}
.rl-chart .area{fill:url(#rlArea)}
.rl-chart .path{fill:none;stroke:var(--rl-lime);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:640;stroke-dashoffset:640;animation:rlDraw 2.6s .2s ease both;filter:drop-shadow(0 0 6px rgba(200,255,77,.4))}
.rl-chart .dot{fill:#fff;stroke:var(--rl-lime);stroke-width:2;animation:rlDot 2.4s 1.4s ease-in-out infinite}
.rl-chart text{font-family:"Space Grotesk",sans-serif;fill:rgba(255,255,255,.28);font-size:7px;letter-spacing:.08em}
.rl-chart .val{fill:var(--rl-lime);font-size:12px;letter-spacing:-.02em}

/* calendar */
.rl-v--cal{width:90%}
.rl-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:.5cqw;width:100%}
.rl-cal span{
  aspect-ratio:1;border-radius:.28cqw;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.03);
  display:grid;place-items:center;font-family:"Space Grotesk",sans-serif;font-size:.5cqw;color:rgba(255,255,255,.25);
}
.rl-cal span.on{border-color:rgba(200,255,77,.5);background:rgba(200,255,77,.14);color:rgba(200,255,77,.9);animation:rlCell .6s both;animation-delay:calc(var(--i)*.06s)}
.rl-cal span.cy{border-color:rgba(56,232,255,.4);background:rgba(56,232,255,.1);color:rgba(56,232,255,.85)}
.rl-cal-head{display:grid;grid-template-columns:repeat(7,1fr);gap:.5cqw;margin-bottom:.5cqw}
.rl-cal-head span{text-align:center;font-family:"Space Grotesk",sans-serif;font-size:.48cqw;letter-spacing:.1em;color:rgba(255,255,255,.28)}
.rl-cal-foot{display:flex;gap:.6cqw;margin-top:1cqw}
.rl-cal-foot span{padding:.4cqw .7cqw;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-size:.52cqw;color:rgba(255,255,255,.45)}

/* brand */
.rl-v--brand{width:94%;display:flex;flex-direction:column;justify-content:center;gap:1.6cqw}
.rl-word{font-size:6.6cqw;line-height:.9;letter-spacing:-.06em;font-weight:700;background:linear-gradient(100deg,#fff 20%,var(--rl-lime) 55%,var(--rl-cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.rl-word small{display:block;font-family:"Space Grotesk",sans-serif;font-size:.9cqw;letter-spacing:.4em;color:rgba(255,255,255,.4);-webkit-text-fill-color:rgba(255,255,255,.4);margin-top:1cqw}
.rl-swatches{display:flex;gap:.6cqw}
.rl-swatches i{flex:1;height:2.4cqw;border-radius:.3cqw;border:1px solid rgba(255,255,255,.14)}
.rl-swatches i:nth-child(1){background:var(--rl-lime)}
.rl-swatches i:nth-child(2){background:var(--rl-cyan)}
.rl-swatches i:nth-child(3){background:var(--rl-violet)}
.rl-swatches i:nth-child(4){background:var(--rl-coral)}
.rl-swatches i:nth-child(5){background:var(--rl-paper)}
.rl-type-row{display:flex;align-items:baseline;gap:1.1cqw;color:rgba(255,255,255,.5);font-size:.65cqw;letter-spacing:.04em}

/* topology */
.rl-v--topo{width:96%;height:92%}
.rl-topo{position:relative;width:100%;height:100%}
.rl-topo svg{position:absolute;inset:0;width:100%;height:100%}
.rl-topo path{fill:none;stroke:rgba(255,255,255,.18);stroke-width:1.2;stroke-dasharray:5 5;animation:rlDash 2.6s linear infinite}
.rl-topo path.hot{stroke:rgba(200,255,77,.65);filter:drop-shadow(0 0 4px rgba(200,255,77,.5))}
.rl-node{
  position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  min-width:7.2cqw;padding:.55cqw .6cqw;border-radius:.4cqw;text-align:center;
  border:1px solid rgba(255,255,255,.16);background:rgba(8,12,20,.92);
  font-size:.58cqw;color:rgba(255,255,255,.62);animation:rlNode .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.1s);
}
.rl-node b{display:block;font-family:"Space Grotesk",sans-serif;font-size:.5cqw;letter-spacing:.1em;color:rgba(255,255,255,.3);margin-bottom:.25cqw}
.rl-node.core{border-color:rgba(200,255,77,.55);background:rgba(200,255,77,.1);color:#fff;box-shadow:0 0 2.4cqw rgba(200,255,77,.18)}
.rl-node.core b{color:var(--rl-lime)}

/* agent */
.rl-v--agent{width:86%}
.rl-chat{
  width:100%;border-radius:.8cqw;overflow:hidden;border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(160deg,#0b1220,#070b12);box-shadow:0 2cqw 4cqw rgba(0,0,0,.5);
}
.rl-chat__bar{display:flex;align-items:center;gap:.55cqw;padding:.75cqw 1cqw;border-bottom:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.03)}
.rl-chat__bar img{width:1.4cqw;height:1.4cqw;object-fit:contain}
.rl-chat__bar b{font-size:.62cqw;font-weight:500;color:rgba(255,255,255,.72)}
.rl-chat__bar span{margin-left:auto;font-family:"Space Grotesk",sans-serif;font-size:.48cqw;letter-spacing:.1em;color:rgba(200,255,77,.75)}
.rl-chat__body{padding:1cqw;display:flex;flex-direction:column;gap:.7cqw;min-height:15cqw}
.rl-bubble{max-width:78%;padding:.65cqw .85cqw;border-radius:.5cqw;font-size:.6cqw;line-height:1.6;animation:rlBubble .55s cubic-bezier(.2,.8,.2,1) both}
.rl-bubble.user{align-self:flex-end;background:rgba(200,255,77,.14);border:1px solid rgba(200,255,77,.3);color:rgba(255,255,255,.8);animation-delay:.15s}
.rl-bubble.bot{align-self:flex-start;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.62);animation-delay:.7s}
.rl-bubble.typing{display:flex;gap:.3cqw;padding:.7cqw .85cqw;animation-delay:1.5s}
.rl-bubble.typing i{width:.4cqw;height:.4cqw;border-radius:50%;background:rgba(255,255,255,.5);animation:rlTyping 1s infinite}
.rl-bubble.typing i:nth-child(2){animation-delay:.15s}
.rl-bubble.typing i:nth-child(3){animation-delay:.3s}
.rl-chat__input{display:flex;align-items:center;gap:.6cqw;padding:.65cqw .8cqw;border-top:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.24);font-size:.55cqw}
.rl-chat__input i{flex:1;height:.5cqw;border-radius:1px;background:rgba(255,255,255,.1)}

/* documents */
.rl-v--docs{width:80%}
.rl-docs{position:relative;width:100%;height:18cqw}
.rl-paper{
  position:absolute;left:50%;top:50%;width:12.5cqw;height:16.5cqw;padding:1.1cqw;
  border-radius:.35cqw;background:linear-gradient(170deg,#f7f3e9,#e6dfcf);color:#141a22;
  box-shadow:0 1.6cqw 3cqw rgba(0,0,0,.5);animation:rlPaper .8s cubic-bezier(.2,.8,.2,1) both;
}
.rl-paper:nth-child(1){transform:translate(-78%,-54%) rotate(-7deg);opacity:.55}
.rl-paper:nth-child(2){transform:translate(-22%,-50%) rotate(5deg);opacity:.7;animation-delay:.1s}
.rl-paper:nth-child(3){transform:translate(-50%,-48%);animation-delay:.2s}
.rl-paper b{display:block;font-size:1.05cqw;letter-spacing:-.02em;margin-bottom:.6cqw}
.rl-paper i{display:block;height:.34cqw;margin-bottom:.32cqw;background:rgba(10,13,20,.2);border-radius:1px}
.rl-paper i:nth-of-type(2n){width:82%}
.rl-paper i:nth-of-type(3n){width:64%}
.rl-stamp{
  position:absolute;right:.7cqw;bottom:2.6cqw;width:3.6cqw;height:3.6cqw;border-radius:50%;
  border:1.5px solid rgba(255,107,90,.7);display:grid;place-items:center;
  font-size:.52cqw;color:rgba(255,107,90,.9);transform:rotate(-14deg);letter-spacing:.05em;text-align:center;line-height:1.3;
}

/* erp */
.rl-v--erp{width:90%}
.rl-erp{display:grid;grid-template-columns:repeat(2,1fr);gap:.9cqw;width:100%}
.rl-mod{
  position:relative;padding:1.3cqw;border-radius:.6cqw;border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.015));overflow:hidden;
  animation:rlCell .7s both;animation-delay:calc(var(--i)*.1s);
}
.rl-mod::after{content:"";position:absolute;right:-20%;bottom:-60%;width:70%;height:120%;border-radius:50%;background:radial-gradient(circle,rgba(200,255,77,.14),transparent 70%)}
.rl-mod b{display:block;font-size:.8cqw;font-weight:600;color:rgba(255,255,255,.82)}
.rl-mod span{display:block;margin-top:.3cqw;font-size:.52cqw;color:rgba(255,255,255,.34)}
.rl-mod i{display:block;margin-top:.9cqw;height:.35cqw;background:linear-gradient(90deg,var(--rl-lime),transparent);border-radius:1px;width:var(--w,60%)}

/* approval */
.rl-v--flow{width:92%}
.rl-flow{position:relative;display:flex;flex-direction:column;gap:1.15cqw;width:100%}
.rl-step{display:flex;align-items:center;gap:.9cqw}
.rl-step__dot{
  flex:none;width:2.2cqw;height:2.2cqw;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(200,255,77,.45);background:rgba(200,255,77,.1);
  font-size:.72cqw;color:var(--rl-lime);animation:rlCell .6s both;animation-delay:calc(var(--i)*.25s);
}
.rl-step__bar{flex:1;height:1.8cqw;border-radius:.25cqw;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);position:relative;overflow:hidden}
.rl-step__bar i{position:absolute;inset:0;width:var(--w);background:linear-gradient(90deg,rgba(200,255,77,.18),rgba(200,255,77,.55));transform-origin:left;animation:rlGrow 1.1s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.25s + .15s)}
.rl-step__bar b{position:relative;z-index:1;display:block;padding:.35cqw .7cqw;font-family:"Space Grotesk",sans-serif;font-size:.5cqw;letter-spacing:.06em;color:rgba(255,255,255,.7);font-weight:400}
.rl-hour{
  position:absolute;right:-1cqw;top:-1.2cqw;width:7cqw;height:7cqw;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:1px dashed rgba(200,255,77,.4);background:rgba(5,9,14,.9);
}
.rl-hour b{font-family:"Space Grotesk",sans-serif;font-size:1.5cqw;color:var(--rl-lime)}
.rl-hour span{font-size:.46cqw;letter-spacing:.08em;color:rgba(255,255,255,.4)}

/* orders */
.rl-v--orders{width:90%}
.rl-orders{display:flex;flex-direction:column;gap:.55cqw;width:100%}
.rl-order{display:flex;align-items:center;gap:.7cqw;padding:.7cqw .85cqw;border-radius:.4cqw;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);animation:rlCell .6s both;animation-delay:calc(var(--i)*.12s)}
.rl-order b{font-family:"Space Grotesk",sans-serif;font-size:.56cqw;color:rgba(255,255,255,.7);font-weight:500;letter-spacing:.05em}
.rl-order span{font-size:.52cqw;color:rgba(255,255,255,.35)}
.rl-order em{margin-left:auto;font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:.46cqw;letter-spacing:.08em;color:var(--rl-lime);padding:.18cqw .4cqw;border:1px solid rgba(200,255,77,.3);border-radius:.2cqw}

/* sync */
.rl-v--sync{width:88%}
.rl-sync{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:1.2cqw}
.rl-sync__ends{display:flex;gap:1.4cqw;justify-content:center}
.rl-sync__ends span{padding:.6cqw .9cqw;border-radius:.35cqw;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.045);font-size:.58cqw;color:rgba(255,255,255,.6)}
.rl-sync__core{width:6.4cqw;height:6.4cqw;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(200,255,77,.5);background:rgba(200,255,77,.1);box-shadow:0 0 2.4cqw rgba(200,255,77,.2);font-family:"Space Grotesk",sans-serif;font-size:.62cqw;letter-spacing:.12em;color:var(--rl-lime);text-align:center;line-height:1.4}
.rl-sync__lines{position:absolute;inset:0;pointer-events:none}
.rl-sync__lines i{position:absolute;left:50%;top:1.8cqw;width:1px;height:calc(50% - 3.2cqw);background:linear-gradient(180deg,rgba(200,255,77,.5),transparent);transform-origin:top;animation:rlGrowV 1s ease both}

/* terminal */
.rl-v--term{width:90%}
.rl-term{width:100%;border-radius:.7cqw;overflow:hidden;border:1px solid rgba(255,255,255,.16);background:#04070c;box-shadow:0 2cqw 4cqw rgba(0,0,0,.55)}
.rl-term__bar{display:flex;gap:.5cqw;padding:.6cqw .9cqw;background:rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.08)}
.rl-term__bar i{width:.55cqw;height:.55cqw;border-radius:50%;background:rgba(255,255,255,.25)}
.rl-term__bar span{margin-left:auto;font-family:"Space Grotesk",sans-serif;font-size:.48cqw;letter-spacing:.1em;color:rgba(255,255,255,.3)}
.rl-term__body{padding:1cqw 1.1cqw;display:flex;flex-direction:column;gap:.55cqw;font-family:"Space Grotesk",sans-serif;font-size:.6cqw;line-height:1.6}
.rl-term__body p{margin:0;color:rgba(255,255,255,.42);animation:rlType .7s steps(30) both;animation-delay:calc(var(--i)*.35s);white-space:nowrap;overflow:hidden}
.rl-term__body p b{color:var(--rl-lime);font-weight:400}
.rl-term__body p em{font-style:normal;color:var(--rl-cyan)}
.rl-term__body p.ok{color:rgba(200,255,77,.75)}
.rl-term__body p.warn{color:rgba(255,107,90,.8)}

/* reach / radar */
.rl-v--radar{width:90%;height:90%;place-items:center}
.rl-radar{position:relative;width:100%;height:100%;display:grid;place-items:center}
.rl-radar i{position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%}
.rl-radar i:nth-child(1){width:26cqw;height:26cqw}
.rl-radar i:nth-child(2){width:38cqw;height:38cqw;border-style:dashed;border-color:rgba(200,255,77,.16)}
.rl-radar i:nth-child(3){width:50cqw;height:50cqw;border-color:rgba(56,232,255,.12)}
.rl-radar__sweep{position:absolute;width:26cqw;height:26cqw;border-radius:50%;background:conic-gradient(from 0deg,rgba(200,255,77,.32),transparent 32%);animation:rlSpin 5s linear infinite}
.rl-radar__core{position:relative;z-index:2;width:8cqw;height:8cqw;border-radius:50%;display:grid;place-items:center;background:rgba(200,255,77,.1);border:1px solid rgba(200,255,77,.45);font-size:.62cqw;color:var(--rl-lime);letter-spacing:.1em;text-align:center;line-height:1.4}
.rl-radar span{position:absolute;font-size:.52cqw;color:rgba(255,255,255,.5);padding:.3cqw .55cqw;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(5,8,14,.85);z-index:3}
.rl-radar span:nth-of-type(1){top:8%;left:22%}
.rl-radar span:nth-of-type(2){top:18%;right:12%}
.rl-radar span:nth-of-type(3){bottom:14%;left:10%}
.rl-radar span:nth-of-type(4){bottom:8%;right:20%}

/* ecg */
.rl-v--ecg{width:92%}
.rl-ecg{width:100%;display:flex;flex-direction:column;gap:1.2cqw}
.rl-ecg svg{width:100%;height:12cqw;overflow:visible}
.rl-ecg .pulse{fill:none;stroke:var(--rl-lime);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:520;stroke-dashoffset:520;animation:rlDraw 3s linear infinite;filter:drop-shadow(0 0 6px rgba(200,255,77,.5))}
.rl-ecg__meta{display:flex;justify-content:space-between;align-items:flex-end}
.rl-ecg__meta b{font-family:"Space Grotesk",sans-serif;font-size:2.9cqw;letter-spacing:-.04em;color:#fff;line-height:1}
.rl-ecg__meta span{font-size:.55cqw;color:rgba(255,255,255,.4);letter-spacing:.08em}

/* guarantee shield */
.rl-v--shield{width:80%;place-items:center}
.rl-shield{position:relative;width:19cqw;height:22cqw;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9cqw;background:linear-gradient(160deg,rgba(232,194,122,.16),rgba(232,194,122,.03));clip-path:polygon(50% 0,100% 18%,100% 62%,50% 100%,0 62%,0 18%);border:0}
.rl-shield::before{content:"";position:absolute;inset:.35cqw;clip-path:polygon(50% 0,100% 18%,100% 62%,50% 100%,0 62%,0 18%);border:1px solid rgba(232,194,122,.4)}
.rl-shield b{font-family:"Space Grotesk",sans-serif;font-size:2.2cqw;color:var(--rl-gold)}
.rl-shield span{font-size:.55cqw;letter-spacing:.12em;color:rgba(255,255,255,.55)}
.rl-shield small{font-size:.5cqw;color:rgba(255,255,255,.32)}

/* industries */
.rl-v--grid4{width:88%}
.rl-grid4{display:grid;grid-template-columns:repeat(2,1fr);gap:.85cqw;width:100%}
.rl-grid4 div{padding:1.2cqw;border-radius:.55cqw;border:1px solid rgba(255,255,255,.12);background:linear-gradient(150deg,rgba(255,255,255,.05),rgba(255,255,255,.012));animation:rlCell .7s both;animation-delay:calc(var(--i)*.12s)}
.rl-grid4 b{display:block;font-size:.78cqw;color:rgba(255,255,255,.82);font-weight:600}
.rl-grid4 span{display:block;margin-top:.35cqw;font-size:.5cqw;color:rgba(255,255,255,.34);line-height:1.5}

/* proof cards */
.rl-v--proof{width:90%}
.rl-proof{display:flex;gap:.8cqw;width:100%}
.rl-proof div{flex:1;padding:1.1cqw;border-radius:.55cqw;border:1px solid rgba(255,255,255,.12);background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));animation:rlCell .7s both;animation-delay:calc(var(--i)*.14s)}
.rl-proof b{display:block;font-size:.62cqw;color:rgba(255,255,255,.75);font-weight:500;line-height:1.5;min-height:2.4cqw}
.rl-proof span{display:block;margin-top:.7cqw;font-family:"Space Grotesk",sans-serif;font-size:1.15cqw;color:var(--rl-lime);letter-spacing:-.02em}
.rl-proof em{display:block;margin-top:.3cqw;font-style:normal;font-size:.46cqw;letter-spacing:.08em;color:rgba(255,255,255,.28)}

/* metric */
.rl-v--metric{width:88%;place-items:center;text-align:center}
.rl-metric{display:flex;flex-direction:column;align-items:center;gap:1cqw}
.rl-metric__big{font-family:"Space Grotesk",sans-serif;font-size:9.2cqw;line-height:.9;letter-spacing:-.06em;color:var(--a,var(--rl-lime));text-shadow:0 0 5cqw rgba(200,255,77,.22);animation:rlRise .8s cubic-bezier(.2,.8,.2,1) both}
.rl-metric__label{font-size:.72cqw;letter-spacing:.16em;color:rgba(255,255,255,.45)}
.rl-metric__rule{width:12cqw;height:1px;background:linear-gradient(90deg,transparent,var(--a,var(--rl-lime)),transparent)}
.rl-metric__note{font-size:.55cqw;letter-spacing:.08em;color:rgba(255,255,255,.28)}

/* gap / silos */
.rl-v--gap{width:92%}
.rl-gap{display:flex;gap:.7cqw;width:100%}
.rl-gap div{flex:1;padding:1.1cqw .8cqw;border-radius:.5cqw;border:1px dashed rgba(255,107,90,.3);background:rgba(255,107,90,.05);text-align:center;animation:rlCell .7s both;animation-delay:calc(var(--i)*.15s)}
.rl-gap b{display:block;font-size:.7cqw;color:rgba(255,255,255,.6)}
.rl-gap span{display:block;margin-top:.4cqw;font-family:"Space Grotesk",sans-serif;font-size:.46cqw;letter-spacing:.1em;color:rgba(255,107,90,.7)}
.rl-gap__break{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:"Space Grotesk",sans-serif;font-size:1.2cqw;color:rgba(255,107,90,.65);letter-spacing:.14em;background:#070b12;padding:.2cqw .6cqw;border:1px solid rgba(255,107,90,.3);border-radius:.3cqw}

/* domains */
.rl-v--domains{width:94%}
.rl-domains{display:grid;grid-template-columns:repeat(5,1fr);gap:.65cqw;width:100%;align-items:end}
.rl-domains div{padding:1.1cqw .4cqw;border-radius:.5cqw;text-align:center;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.015));animation:rlCell .8s both;animation-delay:calc(var(--i)*.12s)}
.rl-domains b{display:block;font-size:1.7cqw;color:var(--c,var(--rl-lime));line-height:1}
.rl-domains span{display:block;margin-top:.55cqw;font-size:.54cqw;color:rgba(255,255,255,.42)}
.rl-domains small{display:block;margin-top:.2cqw;font-family:"Space Grotesk",sans-serif;font-size:.42cqw;letter-spacing:.1em;color:rgba(255,255,255,.24)}

/* retainer */
.rl-v--retainer{width:90%}
.rl-ret{display:flex;flex-direction:column;gap:1cqw;width:100%}
.rl-ret__row{display:flex;gap:.6cqw}
.rl-ret__row span{flex:1;padding:.85cqw .5cqw;border-radius:.4cqw;text-align:center;font-size:.55cqw;color:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);animation:rlCell .6s both;animation-delay:calc(var(--i)*.12s)}
.rl-ret__row span b{display:block;font-family:"Space Grotesk",sans-serif;font-size:.46cqw;letter-spacing:.1em;color:var(--rl-lime);margin-bottom:.25cqw}
.rl-ret__bar{display:flex;align-items:center;gap:.7cqw;padding:.75cqw .9cqw;border-radius:.4cqw;border:1px solid rgba(255,107,90,.3);background:rgba(255,107,90,.08);font-size:.58cqw;color:rgba(255,255,255,.7)}
.rl-ret__bar em{margin-left:auto;font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:.46cqw;letter-spacing:.1em;color:rgba(255,107,90,.85)}

/* channels */
.rl-v--channels{width:88%}
.rl-channels{display:flex;align-items:flex-end;gap:.9cqw;height:18cqw;width:100%}
.rl-channels div{flex:1;display:flex;flex-direction:column;align-items:center;gap:.55cqw;height:100%;justify-content:flex-end}
.rl-channels i{width:100%;border-radius:.3cqw .3cqw 0 0;background:linear-gradient(to top,rgba(200,255,77,.12),rgba(200,255,77,.62));animation:rlBar 1.2s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.12s);transform-origin:bottom}
.rl-channels div:nth-child(even) i{background:linear-gradient(to top,rgba(56,232,255,.12),rgba(56,232,255,.6))}
.rl-channels b{font-family:"Space Grotesk",sans-serif;font-size:.55cqw;color:rgba(255,255,255,.6);font-weight:500}
.rl-channels span{font-size:.46cqw;color:rgba(255,255,255,.28)}
.rl-channels em{font-style:normal;font-family:"Space Grotesk",sans-serif;font-size:.48cqw;color:var(--rl-lime);margin-top:.2cqw}

/* funnel */
.rl-v--funnel{width:80%}
.rl-funnel{display:flex;flex-direction:column;align-items:center;gap:.45cqw;width:100%}
.rl-funnel div{height:2.6cqw;border-radius:.25cqw;background:linear-gradient(90deg,rgba(200,255,77,.55),rgba(56,232,255,.3));display:flex;align-items:center;justify-content:center;font-size:.52cqw;color:rgba(5,8,14,.8);font-weight:600;animation:rlGrow 1s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.18s);transform-origin:center}

/* CTA */
.rl-v--cta{width:90%;place-items:center;text-align:center}
.rl-cta{display:flex;flex-direction:column;align-items:center;gap:1.2cqw}
.rl-cta img{width:7cqw;height:7cqw;object-fit:contain;animation:rlFloat 5s ease-in-out infinite}
.rl-cta b{font-size:1.5cqw;letter-spacing:-.02em;color:#fff}
.rl-cta span{font-size:.62cqw;color:rgba(255,255,255,.45);letter-spacing:.06em}
.rl-cta em{font-style:normal;padding:.65cqw 1.2cqw;border-radius:999px;background:var(--rl-lime);color:#05070d;font-size:.62cqw;font-weight:600;letter-spacing:.04em;box-shadow:0 0 2.4cqw rgba(200,255,77,.3)}

/* end card */
.rl-v--end{width:90%;place-items:center;text-align:center}
.rl-end{display:flex;flex-direction:column;align-items:center;gap:1.1cqw}
.rl-end img{width:9cqw;height:9cqw;object-fit:contain;opacity:.95}
.rl-end b{font-size:1.4cqw;letter-spacing:-.02em}
.rl-end span{font-family:"Space Grotesk",sans-serif;font-size:.58cqw;letter-spacing:.16em;color:rgba(255,255,255,.45)}
.rl-end small{font-size:.48cqw;letter-spacing:.1em;color:rgba(255,255,255,.25)}

/* ---------- keyframes ---------- */
@keyframes rlShotIn{from{opacity:0;filter:blur(8px);transform:scale(1.015)}to{opacity:1;filter:none;transform:none}}
@keyframes rlRise{from{opacity:0;transform:translateY(1.4cqw)}to{opacity:1;transform:none}}
@keyframes rlVisualIn{from{opacity:0;transform:translateY(1.6cqw) scale(.97)}to{opacity:1;transform:none}}
@keyframes rlPulse{50%{opacity:.35}}
@keyframes rlDrift{to{transform:rotate(360deg)}}
@keyframes rlScan{from{background-position:0 -120%}to{background-position:0 220%}}
@keyframes rlSweep{0%{top:-12%}100%{top:108%}}
@keyframes rlRing{0%{transform:scale(.72);opacity:0}30%{opacity:.8}100%{transform:scale(1.18);opacity:0}}
@keyframes rlFloat{50%{transform:translateY(-.8cqw)}}
@keyframes rlCell{from{opacity:0;transform:translateY(.8cqw) scale(.96)}to{opacity:1;transform:none}}
@keyframes rlNode{from{opacity:0;transform:translate(-50%,-30%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes rlWire{from{opacity:.5;transform:scaleX(.86);transform-origin:left}to{opacity:1;transform:scaleX(1);transform-origin:left}}
@keyframes rlBar{from{transform:scaleY(.04);opacity:.4}to{transform:scaleY(1);opacity:1}}
@keyframes rlPhone{from{opacity:0;transform:translateY(2cqw) rotate(-2deg)}to{opacity:1;transform:none}}
@keyframes rlDot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.55}}
@keyframes rlDraw{to{stroke-dashoffset:0}}
@keyframes rlDash{to{stroke-dashoffset:-20}}
@keyframes rlBubble{from{opacity:0;transform:translateY(.7cqw) scale(.97)}to{opacity:1;transform:none}}
@keyframes rlTyping{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-.15cqw)}}
@keyframes rlPaper{from{opacity:0;transform:translate(-50%,-40%) rotate(0)}to{opacity:1}}
@keyframes rlGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes rlGrowV{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes rlType{from{width:0}to{width:100%}}
@keyframes rlSpin{to{transform:rotate(360deg)}}

/* paper cards keep their own transforms after entrance */
.rl-paper:nth-child(1){animation-name:rlPaperA}
.rl-paper:nth-child(2){animation-name:rlPaperB}
.rl-paper:nth-child(3){animation-name:rlPaperC}
@keyframes rlPaperA{from{opacity:0;transform:translate(-78%,-40%) rotate(-2deg)}to{opacity:.55;transform:translate(-78%,-54%) rotate(-7deg)}}
@keyframes rlPaperB{from{opacity:0;transform:translate(-22%,-36%) rotate(1deg)}to{opacity:.7;transform:translate(-22%,-50%) rotate(5deg)}}
@keyframes rlPaperC{from{opacity:0;transform:translate(-50%,-38%) rotate(-1deg)}to{opacity:1;transform:translate(-50%,-48%) rotate(0)}}
.rl-phone:nth-child(2){animation-name:rlPhoneMid}
@keyframes rlPhoneMid{from{opacity:0;transform:translateY(2cqw) rotate(-2deg)}to{opacity:1;transform:translateY(-1.2cqw) scale(1.05)}}

/* ---------- responsive ---------- */
@media (max-width:820px){
  #yunbuReel{padding:12px}
  .rl-shell{border-radius:16px;width:96vw}
  .rl-top{padding:9px 12px;gap:10px}
  .rl-mark span,.rl-titlebar small{display:none}
  .rl-titlebar b{font-size:11px}
  .rl-badge{display:none}
  .rl-pick{max-width:150px;font-size:9px;padding:6px 24px 6px 9px;background-position:right 8px center}
  .rl-x{width:30px;height:30px}
  .rl-shot{display:block;padding:0}
  .rl-copy{
    position:absolute;left:0;right:0;bottom:0;z-index:2;justify-content:flex-end;
    padding:10cqw 6cqw 6.5cqw;
    background:linear-gradient(0deg,rgba(4,7,12,.95) 10%,rgba(4,7,12,.58) 52%,transparent 100%);
  }
  .rl-visual{position:absolute;inset:0;z-index:1;opacity:.72}
  .rl-title{font-size:clamp(18px,6.2cqw,30px);margin-top:1.8cqw;max-width:94%}
  .rl-sub{font-size:clamp(8px,2.5cqw,11px);margin-top:1.6cqw;max-width:100%}
  .rl-kicker{font-size:clamp(5.8px,1.9cqw,8px)}
  .rl-kicker i{width:2.4cqw}
  .rl-metrics{margin-top:2cqw;gap:4cqw}
  .rl-metrics b{font-size:clamp(12px,4cqw,20px)}
  .rl-metrics span{font-size:clamp(5.6px,1.6cqw,8px)}
  .rl-visual{min-height:0}
  .rl-shot .rl-visual .rl-v{filter:drop-shadow(0 1cqw 2cqw rgba(0,0,0,.5))}
  .rl-chapters{padding:6px 10px}
  .rl-ch{padding:5px 8px;font-size:8px}
  .rl-controls{gap:9px;padding:9px 11px}
  .rl-btn{width:28px;height:28px;font-size:11px}
  .rl-btn--play{width:36px;height:36px}
  .rl-tags{display:none}
  .rl-foot{padding:6px 12px 8px;font-size:7px}
  .rl-foot span:last-child{display:none}
  .rl-phone{width:24%}
  .rl-phone small{display:none}
}
@media (max-height:780px) and (min-width:821px){
  .rl-shell{width:min(940px,88vw)}
  .rl-top{padding:8px 14px}
  .rl-titlebar b{font-size:12px}
  .rl-chapters{padding:6px 12px}
  .rl-ch{padding:5px 8px}
  .rl-controls{padding:8px 13px}
  .rl-btn--play{width:36px;height:36px}
  .rl-foot{padding:5px 14px 7px}
}
@media (max-height:660px) and (min-width:821px){
  .rl-shell{width:min(780px,76vw)}
  .rl-chapters{display:none}
}
@media (prefers-reduced-motion:reduce){
  .rl-glow,.rl-scan{animation:none!important}
}