
    :root {
      --bg-dark: #0f172a;
      --bg-card: #1e293b;
      --text-main: #f8fafc;
      --text-muted: #94a3b8;
      --accent: #ffc107; 
    }
    body { 
      background-color: var(--bg-dark); 
      color: var(--text-main); 
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
      -webkit-user-select: auto;
      -moz-user-select: auto;
      -ms-user-select: auto;
      user-select: auto;
    }
    .card { background-color: #1a1a1a; border: 1px solid #333; }
    .text-muted { color: var(--text-muted) !important; }
    .form-control, .form-select { background-color: #0f172a; border: 1px solid #334155; color: white; }
    .form-control:focus, .form-select:focus { background-color: #0f172a; color: white; border-color: var(--accent); box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); }
    .btn-primary { background-color: var(--accent); border-color: var(--accent); color: #000; font-weight: bold; }
    .btn-primary:hover { background-color: #e0a800; border-color: #e0a800; color: #000; }
    .sidebar { min-height: 100vh; background-color: var(--bg-card); border-right: 1px solid #334155; }
    .nav-link-custom { color: var(--text-muted); padding: 12px 20px; border-radius: 8px; margin-bottom: 5px; transition: all 0.3s; cursor: pointer; display: flex; align-items: center; gap: 10px; }
    .nav-link-custom:hover { background-color: #334155; color: white; }
    .nav-link-custom.active { background-color: var(--accent); color: #000; font-weight: bold; }
    .placeholder-glow .placeholder { background: linear-gradient(90deg, #334155 25%, #475569 50%, #334155 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; }
    @keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
    
    @keyframes pulse-danger { 0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7); } 50% { transform: scale(1.02); box-shadow: 0 0 10px 5px rgba(220, 53, 69, 0); } 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(220, 53, 69, 0); } }
    .pulse-danger { animation: pulse-danger 1.5s infinite; }

    /* Efek Sponsor Hover Premium (Berwarna & Glow) */
    .sponsor-logo { transition: transform 0.3s ease, filter 0.3s ease; cursor: pointer; }
    .sponsor-logo:hover { transform: scale(1.1); filter: drop-shadow(0 0 8px rgba(255, 193, 7, 0.6)); }

    .video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: 12px; background: #000; border: 2px solid var(--accent); }
    .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
    .video-container:fullscreen { padding-bottom: 0 !important; height: 100% !important; width: 100% !important; border-radius: 0 !important; border: none !important; }
    .video-container:-webkit-full-screen { padding-bottom: 0 !important; height: 100% !important; width: 100% !important; border-radius: 0 !important; border: none !important; }
  


/* =========================================================
   INVINITY STREAM — LIGHT 3D / SOFT NEUMORPHIC HOMEPAGE
   Scoped to #landingPage so existing admin/user UI is untouched.
   ========================================================= */
#landingPage {
  --is-bg-1: #f8f9ff;
  --is-bg-2: #eef2ff;
  --is-ink: #172554;
  --is-muted: #68759a;
  --is-purple: #9b5cff;
  --is-violet: #7557ff;
  --is-blue: #3d8cff;
  --is-pink: #ff72b6;
  --is-orange: #ffb52e;
  min-height: 100vh;
  background:
    radial-gradient(circle at 15% 18%, rgba(255, 149, 199, .28), transparent 22%),
    radial-gradient(circle at 88% 28%, rgba(114, 196, 255, .24), transparent 23%),
    radial-gradient(circle at 50% 85%, rgba(166, 129, 255, .20), transparent 30%),
    linear-gradient(145deg, var(--is-bg-1), var(--is-bg-2));
  color: var(--is-ink);
  overflow: hidden;
}

#landingPage .infinity-landing-shell {
  position: relative;
  min-height: calc(100vh - 3rem);
  max-width: 1440px;
  padding: 18px clamp(10px, 3vw, 44px) 28px;
  border-radius: 42px;
  background: rgba(248, 250, 255, .66);
  border: 1px solid rgba(255,255,255,.95);
  box-shadow: 22px 22px 55px rgba(114, 116, 170, .16), -18px -18px 45px rgba(255,255,255,.95), inset 1px 1px 0 rgba(255,255,255,.9);
  isolation: isolate;
}

#landingPage .infinity-topbar {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: 58px 1fr 58px;
  align-items: center;
  gap: 14px;
  max-width: 980px;
  margin: 0 auto 25px;
  padding: 10px 12px;
  border-radius: 32px;
  background: rgba(255,255,255,.58);
  border: 1px solid rgba(255,255,255,.92);
  box-shadow: 10px 10px 24px rgba(120, 126, 177, .13), -8px -8px 20px rgba(255,255,255,.96), inset 1px 1px 0 rgba(255,255,255,.8);
  backdrop-filter: blur(14px);
}
#landingPage .infinity-mini-avatar,
#landingPage .infinity-mini-menu {
  width: 52px; height: 52px; border-radius: 50%; display:flex; align-items:center; justify-content:center;
  color: #6f48dc; font-size: 20px;
  background: linear-gradient(145deg,#ffffff,#edf0fb);
  box-shadow: 7px 7px 15px rgba(119,124,168,.18), -6px -6px 14px #fff, inset 1px 1px 0 rgba(255,255,255,.9);
}
#landingPage .infinity-mini-menu { justify-self:end; color:#172554; }
#landingPage .infinity-brand-mini { text-align:center; font-weight:900; letter-spacing:3px; font-size: .9rem; color:#21345f; }
#landingPage .infinity-brand-mini span { color:#8b55e9; }

#landingPage .infinity-hero { z-index:2; padding-top: 4px; }
#landingPage .infinity-logo-orb {
  position: relative;
  width: clamp(210px, 27vw, 330px);
  aspect-ratio: 1;
  border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(232,235,251,.88));
  border: 1px solid rgba(255,255,255,.98);
  box-shadow: 20px 20px 42px rgba(116, 119, 171, .20), -18px -18px 40px rgba(255,255,255,.98), inset 5px 5px 14px rgba(255,255,255,.85), inset -7px -7px 15px rgba(170,174,211,.18);
}
#landingPage .infinity-logo-ring { position:absolute; inset:13%; border-radius:50%; border:1px solid rgba(130,110,255,.13); box-shadow: inset 0 0 18px rgba(100,94,210,.08); }
#landingPage #landingLogo { position:relative; z-index:2; width:68%; max-height:none !important; object-fit:contain; filter: drop-shadow(9px 12px 9px rgba(67,75,137,.23)); }
#landingPage .infinity-logo-fallback { color:#8b55e9; font-size:4rem; }

#landingPage .infinity-hero-title {
  font-weight: 950; letter-spacing: 1px; font-size: clamp(2rem, 4vw, 3.35rem);
  background: linear-gradient(90deg,#1d315f 8%,#a44ee8 46%,#426fff 88%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow: 0 8px 18px rgba(120,100,220,.13);
}
#landingPage .infinity-hero-copy { color:var(--is-muted); font-size:clamp(.95rem,1.5vw,1.2rem); line-height:1.65; max-width:700px; font-weight:600; }

#landingPage .infinity-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(130px,1fr)); gap:18px; max-width:920px; }
#landingPage .infinity-feature-card,
#landingPage .infinity-benefit-card,
#landingPage .infinity-action-btn {
  background:linear-gradient(145deg,rgba(255,255,255,.93),rgba(237,240,252,.83));
  border:1px solid rgba(255,255,255,.95);
  box-shadow:10px 10px 23px rgba(113,117,167,.17),-9px -9px 20px rgba(255,255,255,.96),inset 1px 1px 0 rgba(255,255,255,.95);
}
#landingPage .infinity-feature-card { min-height:150px; padding:18px 12px; border-radius:27px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; transition:.25s ease; }
#landingPage .infinity-feature-card:hover { transform:translateY(-5px); box-shadow:14px 16px 28px rgba(113,117,167,.21),-10px -10px 22px #fff; }
#landingPage .infinity-feature-card strong { font-size:1rem; color:#162856; }
#landingPage .infinity-feature-card small { color:#7280a5; font-size:.78rem; }
#landingPage .infinity-feature-icon { width:55px;height:55px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:25px;margin-bottom:6px;background:linear-gradient(145deg,#fff,#e9ecf8);box-shadow:inset 3px 3px 7px rgba(255,255,255,.95),inset -4px -4px 8px rgba(154,159,198,.17),6px 7px 13px rgba(110,115,165,.12); }
#landingPage .icon-purple { color:#7954ef; } #landingPage .icon-pink { color:#f34fa4; } #landingPage .icon-orange { color:#ff9e14; } #landingPage .icon-blue { color:#2789f5; }

#landingPage .infinity-main-cta { width:min(100%,560px); border:0; min-height:74px; border-radius:38px; display:grid; grid-template-columns:52px 1fr 30px; align-items:center; padding:9px 17px; color:#fff; font-weight:900; font-size:1.22rem; background:linear-gradient(100deg,#c05bfa,#8657f6 48%,#3e80ff); box-shadow:13px 15px 28px rgba(101,88,207,.27),-8px -8px 18px rgba(255,255,255,.9),inset 2px 2px 5px rgba(255,255,255,.42),inset -3px -3px 7px rgba(47,57,165,.2); transition:.25s ease; }
#landingPage .infinity-main-cta:hover { transform:translateY(-3px); box-shadow:16px 18px 34px rgba(101,88,207,.32),-9px -9px 19px #fff; }
#landingPage .infinity-cta-icon { width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.2);box-shadow:inset 2px 2px 5px rgba(255,255,255,.3),5px 6px 12px rgba(60,54,154,.2); }
#landingPage .infinity-main-cta > span:nth-child(2) { text-shadow:0 2px 5px rgba(57,36,133,.2); }

#landingPage .infinity-action-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; max-width:820px; }
#landingPage .infinity-action-btn { min-height:58px; border-radius:31px; color:#172a58; font-weight:800; padding:10px 18px; display:flex; align-items:center; justify-content:center; gap:10px; transition:.25s ease; }
#landingPage .infinity-action-btn i { font-size:1.05rem; }
#landingPage .infinity-action-btn:hover { transform:translateY(-3px); }
#landingPage .infinity-action-primary { color:#fff; border-color:rgba(255,255,255,.8); background:linear-gradient(100deg,#c15cf5,#795af4); box-shadow:10px 12px 23px rgba(117,83,218,.25),-7px -7px 17px rgba(255,255,255,.9),inset 2px 2px 5px rgba(255,255,255,.3); }

#landingPage .infinity-benefit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; max-width:940px; }
#landingPage .infinity-benefit-card { min-height:92px; border-radius:27px; padding:14px 18px; display:flex; align-items:center; gap:15px; text-align:left; }
#landingPage .infinity-benefit-card strong { display:block; color:#172856; font-size:.98rem; }
#landingPage .infinity-benefit-card small { color:#7783a5; display:block; margin-top:3px; font-size:.76rem; }
#landingPage .infinity-benefit-icon { flex:0 0 54px;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:23px;background:linear-gradient(145deg,#fff,#e8ebf7);box-shadow:7px 8px 15px rgba(111,116,164,.16),-6px -6px 14px #fff,inset 2px 2px 4px rgba(255,255,255,.95); }
#landingPage .benefit-green { color:#18b77d; } #landingPage .benefit-orange { color:#ff9e18; } #landingPage .benefit-blue { color:#278cf2; }
#landingPage .infinity-section-label { color:#7380a3; letter-spacing:3px; font-size:.72rem; font-weight:900; }
#landingPage .infinity-footer { margin:38px 0 4px; color:#7180a4; font-size:.88rem; font-weight:600; }

#landingPage .infinity-floating { position:absolute; border-radius:50%; filter:blur(.1px); opacity:.82; box-shadow:inset 7px 7px 13px rgba(255,255,255,.55),8px 11px 20px rgba(98,103,160,.15); z-index:-1; }
#landingPage .infinity-float-pink { width:35px;height:35px;background:linear-gradient(145deg,#ffb0d2,#ff63aa);left:12%;top:26%; }
#landingPage .infinity-float-blue { width:42px;height:42px;background:linear-gradient(145deg,#a7ddff,#4f9ff5);right:12%;top:31%; }
#landingPage .infinity-float-yellow { width:32px;height:32px;background:linear-gradient(145deg,#ffe09a,#ffad31);left:15%;top:59%; }
#landingPage .infinity-float-purple { width:30px;height:30px;background:linear-gradient(145deg,#d2b3ff,#8757ec);right:18%;top:66%; }
#landingPage .infinity-shape { position:absolute; z-index:-1; opacity:.68; filter:drop-shadow(7px 10px 11px rgba(100,90,160,.15)); }
#landingPage .infinity-shape-left { width:150px;height:150px;left:-70px;top:28%;border-radius:50%;background:linear-gradient(145deg,#ffc2db,#ff70b1); }
#landingPage .infinity-shape-right { width:150px;height:150px;right:-70px;top:45%;border-radius:50%;background:linear-gradient(145deg,#9edbff,#5ea7f4); }


/* Invinity Stream 3D orb + compact feature cards */
#landingPage .infinity-logo-orb {
  background: linear-gradient(145deg, #b86cff 0%, #7358ff 38%, #36bdf8 72%, #ff8fca 100%);
  box-shadow: inset 10px 10px 22px rgba(255,255,255,.62), inset -14px -14px 24px rgba(50,76,180,.24), 18px 20px 38px rgba(109,88,190,.22), 0 0 0 1px rgba(255,255,255,.86);
}
#landingPage .infinity-logo-ring {
  background: linear-gradient(145deg, rgba(255,255,255,.38), rgba(255,255,255,.08));
  border-color: rgba(255,255,255,.72);
  box-shadow: inset 4px 4px 10px rgba(255,255,255,.42), inset -5px -5px 12px rgba(83,64,173,.18);
}
#landingPage .infinity-logo-orb img { filter: drop-shadow(0 14px 18px rgba(28,36,94,.22)); }
#landingPage .infinity-feature-grid { grid-template-columns: repeat(2, minmax(180px, 260px)); justify-content: center; max-width: 560px; }
#landingPage .infinity-feature-card { min-height: 132px; }
#landingPage .infinity-feature-card small { display:none !important; }
#landingPage .infinity-feature-card strong { font-size: 1.12rem; }

@media (max-width: 900px) {
  #landingPage .infinity-feature-grid { grid-template-columns:repeat(2,minmax(140px,1fr)); max-width:520px; }
  #landingPage .infinity-benefit-grid { grid-template-columns:1fr; max-width:620px; }
  #landingPage .infinity-action-row { max-width:620px; }
}
@media (max-width: 600px) {
  #landingPage { padding:10px !important; }
  #landingPage .infinity-landing-shell { min-height:calc(100vh - 20px); padding:12px 10px 24px; border-radius:30px; }
  #landingPage .infinity-topbar { grid-template-columns:48px 1fr 48px; padding:7px 9px; border-radius:26px; margin-bottom:20px; }
  #landingPage .infinity-mini-avatar, #landingPage .infinity-mini-menu { width:43px;height:43px;font-size:16px; }
  #landingPage .infinity-brand-mini { font-size:.68rem; letter-spacing:2px; }
  #landingPage .infinity-logo-orb { width:min(70vw,250px); }
  #landingPage .infinity-hero-title { font-size:1.75rem; }
  #landingPage .infinity-hero-copy { font-size:.9rem; }
  #landingPage .infinity-feature-grid { gap:11px; }
  #landingPage .infinity-feature-card { min-height:130px; border-radius:22px; padding:12px 7px; }
  #landingPage .infinity-feature-icon { width:48px;height:48px;font-size:21px; }
  #landingPage .infinity-main-cta { min-height:64px; font-size:1rem; grid-template-columns:45px 1fr 22px; }
  #landingPage .infinity-cta-icon { width:43px;height:43px; }
  #landingPage .infinity-action-row { grid-template-columns:1fr; gap:10px; }
  #landingPage .infinity-action-btn { min-height:52px; }
  #landingPage .infinity-benefit-card { min-height:78px; padding:11px 14px; }
  #landingPage .infinity-shape-left, #landingPage .infinity-shape-right { width:100px;height:100px; }
}


/* Landing interaction: keep all homepage controls clickable. */
#landingPage { position: relative; z-index: 1; }
#landingPage .infinity-landing-shell, #landingPage button, #landingPage a { pointer-events: auto; }
#fullPageLoader[style*="display: none"] { pointer-events: none !important; }

/* =========================================================
   INVINITY STREAM - REGISTER PAGE 3D / NEUMORPHIC THEME
   Scoped ONLY to #registerPage so existing pages/functions stay untouched.
   ========================================================= */
#registerPage {
  --reg-ink: #1c2b59;
  --reg-muted: #6f7ea8;
  --reg-purple: #8b55e9;
  --reg-purple-2: #6f5cf5;
  --reg-pink: #ee72b7;
  --reg-blue: #55a9f7;
  --reg-surface: rgba(249, 251, 255, 0.88);
  --reg-border: rgba(255,255,255,.92);
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 18%, rgba(255,157,202,.20), transparent 25%),
    radial-gradient(circle at 92% 18%, rgba(105,181,255,.18), transparent 25%),
    radial-gradient(circle at 50% 92%, rgba(180,143,255,.18), transparent 30%),
    linear-gradient(145deg, #f7f8ff 0%, #eef5ff 48%, #fdf3fb 100%);
  border-radius: 34px;
  margin: 10px auto;
  padding-top: 28px !important;
  padding-bottom: 42px !important;
  color: var(--reg-ink);
}

#registerPage .row { position: relative; z-index: 2; }
#registerPage .col-md-5 { width: min(100%, 560px); }

#registerPage .card {
  background: var(--reg-surface) !important;
  border: 1px solid var(--reg-border) !important;
  border-radius: 32px !important;
  box-shadow:
    18px 20px 42px rgba(89, 99, 160, .15),
    -10px -10px 25px rgba(255,255,255,.95),
    inset 2px 2px 6px rgba(255,255,255,.92),
    inset -4px -4px 10px rgba(127, 136, 184, .08) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  padding: 30px !important;
}

#registerPage .text-center.mb-4 h4 {
  color: var(--reg-ink) !important;
  font-size: clamp(1.55rem, 3vw, 2rem);
  letter-spacing: .8px;
  text-shadow: 0 2px 8px rgba(117,89,221,.12);
}
#registerPage .text-center.mb-4 h4::after {
  content: '';
  display: block;
  width: 72px;
  height: 5px;
  margin: 10px auto 0;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--reg-pink), var(--reg-purple), var(--reg-blue));
  box-shadow: 0 5px 12px rgba(130, 91, 227, .22);
}
#registerPage .text-center.mb-4 small { color: var(--reg-muted) !important; font-weight: 600; }

#registerPage #paymentInfoBox {
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(237,242,255,.92)) !important;
  border: 1px solid rgba(132,144,196,.28) !important;
  border-radius: 24px !important;
  box-shadow:
    inset 3px 3px 8px rgba(255,255,255,.95),
    inset -5px -5px 11px rgba(124,133,185,.12),
    10px 13px 28px rgba(95,103,155,.12) !important;
  color: var(--reg-ink) !important;
}
#registerPage #paymentInfoBox h6,
#registerPage #paymentInfoBox .text-warning {
  color: var(--reg-purple) !important;
}
#registerPage #paymentInfoBox small,
#registerPage #paymentInfoBox .text-muted {
  color: var(--reg-muted) !important;
}
#registerPage #dispNominal,
#registerPage #dispRekAn,
#registerPage #dispQrisAn {
  color: var(--reg-ink) !important;
}
#registerPage #dispNominal {
  font-weight: 900 !important;
  text-shadow: 0 4px 10px rgba(92, 83, 170, .12);
}

#registerPage #paymentInfoBox .input-group {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 7px 8px 18px rgba(97,105,158,.10), -5px -5px 13px rgba(255,255,255,.85);
}
#registerPage #dispRek {
  background: linear-gradient(145deg, #f3f6ff, #e9eefc) !important;
  color: var(--reg-ink) !important;
  border: 1px solid rgba(124,135,185,.28) !important;
}
#registerPage #paymentInfoBox .btn-warning {
  background: linear-gradient(135deg, #c16cff, #7b5cf5) !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: inset 2px 2px 5px rgba(255,255,255,.32), 6px 8px 15px rgba(117,83,218,.18);
}
#registerPage #paymentInfoBox .btn-warning:hover { transform: translateY(-1px); }

#registerPage #paymentInfoBox img {
  background: #fff;
  padding: 8px;
  border-radius: 18px !important;
  box-shadow: 8px 10px 20px rgba(95,103,155,.12), -6px -6px 15px rgba(255,255,255,.92);
}

#registerPage #paymentInfoBox .alert-warning,
#registerPage #alertRegMasaAktif {
  background: linear-gradient(145deg, #fff8df, #fff2bd) !important;
  color: #765400 !important;
  border: 1px solid #f5ca65 !important;
  border-radius: 18px !important;
  box-shadow: inset 2px 2px 5px rgba(255,255,255,.9), 6px 8px 15px rgba(146,116,47,.10) !important;
}

#registerPage form .form-label {
  color: var(--reg-ink) !important;
  font-size: .86rem;
  letter-spacing: .2px;
}
#registerPage form .form-control {
  background: linear-gradient(145deg, #f7f9ff, #ebf0fb) !important;
  color: var(--reg-ink) !important;
  border: 1px solid rgba(119,130,177,.30) !important;
  border-radius: 16px !important;
  min-height: 52px;
  box-shadow: inset 3px 3px 7px rgba(141,151,194,.11), inset -4px -4px 8px rgba(255,255,255,.92), 5px 7px 15px rgba(95,103,155,.07);
}
#registerPage form .form-control::placeholder { color: #8792b1 !important; }
#registerPage form .form-control:focus {
  background: #f9fbff !important;
  color: var(--reg-ink) !important;
  border-color: rgba(139,85,233,.55) !important;
  box-shadow: 0 0 0 .2rem rgba(139,85,233,.10), inset 3px 3px 7px rgba(141,151,194,.08), inset -4px -4px 8px rgba(255,255,255,.94) !important;
}

#registerPage #btnRegisterSubmit {
  min-height: 56px;
  border: 0 !important;
  color: #fff !important;
  background: linear-gradient(100deg, #b75df4 0%, #835af6 48%, #4c8ff7 100%) !important;
  box-shadow:
    10px 12px 24px rgba(111,84,215,.24),
    -7px -7px 16px rgba(255,255,255,.90),
    inset 2px 2px 5px rgba(255,255,255,.35),
    inset -3px -3px 7px rgba(64,58,173,.16);
  letter-spacing: .3px;
  transition: .25s ease;
}
#registerPage #btnRegisterSubmit:hover {
  transform: translateY(-3px);
  box-shadow: 13px 16px 29px rgba(111,84,215,.28), -8px -8px 17px #fff, inset 2px 2px 5px rgba(255,255,255,.36);
}
#registerPage #btnRegisterSubmit:active { transform: translateY(0); }

#registerPage form .text-center a {
  color: #6b5bd6 !important;
  text-underline-offset: 4px;
  text-shadow: 0 2px 6px rgba(105,87,201,.10);
}

@media (max-width: 600px) {
  #registerPage {
    margin: 0;
    border-radius: 0;
    padding: 16px 10px 28px !important;
  }
  #registerPage .card { padding: 22px 16px !important; border-radius: 26px !important; }
  #registerPage #paymentInfoBox { border-radius: 20px !important; }
}

/* Invinity Stream - Resume Playback UI */
.infinity-resume-card{
  position:absolute;
  left:18px;right:18px;bottom:18px;
  z-index:30;
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(87,67,160,.96),rgba(53,135,211,.94));
  color:#fff;
  box-shadow:0 18px 42px rgba(42,32,100,.34), inset 0 1px 0 rgba(255,255,255,.2);
  backdrop-filter:blur(14px);
}
.infinity-resume-icon{
  width:42px;height:42px;min-width:42px;
  border-radius:14px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.16);
  box-shadow:inset 3px 3px 7px rgba(0,0,0,.14),inset -3px -3px 7px rgba(255,255,255,.18);
}
#nativeVideoPlayer{width:100%;height:100%;background:#000}
@media(max-width:640px){
  .infinity-resume-card{left:10px;right:10px;bottom:10px;flex-wrap:wrap}
  .infinity-resume-card .d-flex{margin-left:auto}
}
