/*
 * JLPT180 Roadmap CSS owner.
 * P4.4: moved from assets/css/dashboard.css.
 * Scope: #loop-pulse-target / #jlpt-dlb / .dlb-* / roadmap CTA only.
 */
body.jlpt180-clean-lobby #loop-pulse-target{
  border: 2px solid var(--jlpt-line);
  box-shadow: var(--jlpt-shadow);
}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  grid-area: 2 / 1 / 3 / 2;
  min-height: 0;
  height: 100%;
  border-radius: 18px;
  background: rgba(246,255,255,.94);
  overflow: hidden;
}


  body.jlpt180-clean-lobby #jlpt-dlb{
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 12px;
  overflow: hidden;
  background: transparent;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 74px 24px 72px 260px;
  display: grid;
  align-content: start;
  background: transparent;
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  content: "Hôm nay cần ôn ✦";
  position: absolute;
  left: 30px;
  top: 20px;
  z-index: 2;
  color: #092c75;
  font-size: 20px;
  line-height: 1;
  font-weight: 900;
}


  body.jlpt180-clean-lobby #jlpt-dlb::after{
  content: "";
  position: absolute;
  left: 24px;
  top: 68px;
  width: 212px;
  height: 180px;
  background: var(--jlpt-task-stack) center / contain no-repeat;
  filter: none;
  pointer-events: none;
}


  body.jlpt180-clean-lobby .dlb-loading,
body.jlpt180-clean-lobby .dlb-top,
body.jlpt180-clean-lobby .dlb-bar{
  display: none;
}


  body.jlpt180-clean-lobby .dlb-stats{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  align-items: center;
  width: 100%;
  min-height: 120px;
  margin: 0 0 18px;
  padding: 16px 10px;
  border: 1px solid rgba(164, 202, 230, .72);
  border-radius: 15px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 7px 18px rgba(16, 87, 122, .08);
}


  body.jlpt180-clean-lobby .dlb-stat{
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  align-items: start;
  gap: 7px;
  color: #073451;
  text-align: center;
  background: transparent;
  border: 0;
}


  body.jlpt180-clean-lobby .dlb-stat + .dlb-stat{
  border-left: 1px solid rgba(126, 170, 205, .42);
}


  body.jlpt180-clean-lobby .dlb-stat::before{
  content: "";
  width: 48px;
  height: 48px;
  background: var(--jlpt-task-1) center / contain no-repeat;
  filter: none;
}


  body.jlpt180-clean-lobby .dlb-stat:nth-child(2)::before{
  background-image: var(--jlpt-task-2);
}


  body.jlpt180-clean-lobby .dlb-stat:nth-child(3)::before{
  background-image: var(--jlpt-stat-streak);
}


  body.jlpt180-clean-lobby .dlb-sn{
  display: block;
  color: #0b3f93;
  font-size: 29px;
  line-height: .9;
  font-weight: 900;
  text-shadow: none;
}


  body.jlpt180-clean-lobby .dlb-sl{
  display: block;
  color: #0a2c80;
  font-size: 13px;
  line-height: 1.1;
  font-weight: 900;
  text-transform: none;
}


  body.jlpt180-clean-lobby .dlb-steps{
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 68px;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}


  body.jlpt180-clean-lobby .dlb-step{
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 5px;
  min-width: 0;
  min-height: 76px;
  border: 1px solid rgba(171, 206, 230, .65);
  border-radius: 13px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 7px 15px rgba(22,91,120,.08);
  opacity: 1;
}


  body.jlpt180-clean-lobby .dlb-dot{
  width: 38px;
  height: 38px;
  color: transparent;
  font-size: 0;
  background: var(--jlpt-task-1) center / contain no-repeat;
  filter: none;
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(2) .dlb-dot{
  background-image: var(--jlpt-task-2);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(3) .dlb-dot{
  background-image: var(--jlpt-task-3);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(4) .dlb-dot{
  background-image: var(--jlpt-task-4);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(5) .dlb-dot{
  background-image: var(--jlpt-task-5);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(6) .dlb-dot{
  background-image: var(--jlpt-task-6);
}


  body.jlpt180-clean-lobby .dlb-lbl{
  color: #0a2c80;
  font-size: 12px;
  line-height: 1.05;
  font-weight: 900;
  text-transform: none;
  white-space: nowrap;
}


  body.jlpt180-clean-lobby .dlb-cta{
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 16px;
  width: auto;
  height: 48px;
  border: 0;
  border-radius: 18px;
  background: linear-gradient(180deg, #5fff19, #12bc00);
  color: #fff;
  font-family: "Plus Jakarta Sans", Arial, sans-serif;
  font-size: 21px;
  line-height: 48px;
  font-weight: 800;
  text-align: center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 -6px 22px rgba(86,255,153,.28);
}

}


@media (min-width: 900px) and (max-height: 900px){
body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  padding: 58px 18px 58px 226px;
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  left: 24px;
  top: 18px;
  font-size: 18px;
}


  body.jlpt180-clean-lobby #jlpt-dlb::after{
  left: 20px;
  top: 62px;
  width: 188px;
  height: 150px;
}


  body.jlpt180-clean-lobby .dlb-stats{
  min-height: 94px;
  margin-bottom: 12px;
  padding: 11px 8px;
}


  body.jlpt180-clean-lobby .dlb-stat::before{
  width: 38px;
  height: 38px;
}


  body.jlpt180-clean-lobby .dlb-sn{
  font-size: 25px;
}


  body.jlpt180-clean-lobby .dlb-steps{
  left: 16px;
  right: 16px;
  bottom: 56px;
  gap: 8px;
}


  body.jlpt180-clean-lobby .dlb-step{
  min-height: 62px;
  gap: 4px;
}


  body.jlpt180-clean-lobby .dlb-dot{
  width: 32px;
  height: 32px;
}


  body.jlpt180-clean-lobby .dlb-lbl{
  font-size: 11px;
}


  body.jlpt180-clean-lobby .dlb-cta{
  height: 40px;
  line-height: 40px;
  font-size: 18px;
  border-radius: 15px;
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  order: 3;
  height: 360px;
  border-radius: 17px;
  background: rgba(239,255,255,.86);
  overflow: hidden;
}


  body.jlpt180-clean-lobby #jlpt-dlb,
body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  width: 100%;
  height: 100%;
  background: transparent;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  position: relative;
  padding: 48px 12px 50px;
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  content: "Hôm nay cần ôn ✦";
  position: absolute;
  left: 18px;
  top: 16px;
  z-index: 2;
  color: #092c75;
  font-size: 16px;
  line-height: 1;
  font-weight: 900;
}


  body.jlpt180-clean-lobby #jlpt-dlb::after{
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  top: 45px;
  height: 105px;
  background: var(--jlpt-task-stack) center / contain no-repeat;
  opacity: .98;
  pointer-events: none;
}


  body.jlpt180-clean-lobby .dlb-top,
body.jlpt180-clean-lobby .dlb-bar,
body.jlpt180-clean-lobby .dlb-loading{
  display: none;
}


  body.jlpt180-clean-lobby .dlb-stats{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 108px 0 10px;
  padding: 9px 4px;
  border: 1px solid rgba(164, 202, 230, .72);
  border-radius: 13px;
  background: rgba(255,255,255,.78);
}


  body.jlpt180-clean-lobby .dlb-stat{
  display: grid;
  justify-items: center;
  gap: 4px;
  background: transparent;
  border: 0;
}


  body.jlpt180-clean-lobby .dlb-stat + .dlb-stat{
  border-left: 1px solid rgba(126, 170, 205, .42);
}


  body.jlpt180-clean-lobby .dlb-stat::before{
  content: "";
  width: 31px;
  height: 31px;
  background: var(--jlpt-task-1) center / contain no-repeat;
}


  body.jlpt180-clean-lobby .dlb-stat:nth-child(2)::before{
  background-image: var(--jlpt-task-2);
}


  body.jlpt180-clean-lobby .dlb-stat:nth-child(3)::before{
  background-image: var(--jlpt-stat-streak);
}


  body.jlpt180-clean-lobby .dlb-sn{
  color: #0b3f93;
  font-size: 23px;
  font-weight: 900;
  line-height: .9;
  text-shadow: none;
}


  body.jlpt180-clean-lobby .dlb-sl,
body.jlpt180-clean-lobby .dlb-lbl{
  color: #073451;
  font-size: 10px;
  font-weight: 900;
  text-transform: none;
}


  body.jlpt180-clean-lobby .dlb-steps{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}


  body.jlpt180-clean-lobby .dlb-step{
  min-width: 0;
  min-height: 58px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 3px;
  border: 1px solid rgba(171, 206, 230, .65);
  border-radius: 12px;
  background: rgba(255,255,255,.82);
}


  body.jlpt180-clean-lobby .dlb-dot{
  width: 27px;
  height: 27px;
  color: transparent;
  font-size: 0;
  background: var(--jlpt-task-1) center / contain no-repeat;
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(2) .dlb-dot{
  background-image: var(--jlpt-task-2);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(3) .dlb-dot{
  background-image: var(--jlpt-task-3);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(4) .dlb-dot{
  background-image: var(--jlpt-task-4);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(5) .dlb-dot{
  background-image: var(--jlpt-task-5);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(6) .dlb-dot{
  background-image: var(--jlpt-task-6);
}


  body.jlpt180-clean-lobby .dlb-cta{
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  height: 36px;
  border: 0;
  border-radius: 13px;
  background: linear-gradient(180deg, #70ff58, #11c654);
  color: #073451;
  font-family: "Plus Jakarta Sans", Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  border-radius: 24px;
  box-shadow: 0 10px 24px rgba(4, 72, 106, .16), inset 0 0 0 1px rgba(255,255,255,.82);
}


  body.jlpt180-clean-lobby #loop-pulse-target{
  padding: 0 20px;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  padding: 68px 0 74px 250px;
}


  body.jlpt180-clean-lobby #jlpt-dlb::after{
  top: 58px;
  transform: translateY(-10px);
}


  body.jlpt180-clean-lobby .dlb-stats{
  min-height: 112px;
  display: grid;
  align-items: center;
}


  body.jlpt180-clean-lobby .dlb-stat{
  align-items: center;
  align-content: center;
  gap: 5px;
}


  body.jlpt180-clean-lobby .dlb-stat::before{
  width: 44px;
  height: 44px;
}


  body.jlpt180-clean-lobby .dlb-sn,
body.jlpt180-clean-lobby .dlb-sl{
  line-height: 1;
  text-align: center;
}


  body.jlpt180-clean-lobby .dlb-steps{
  left: 20px;
  right: 20px;
  bottom: 70px;
  gap: 10px;
}


  body.jlpt180-clean-lobby .dlb-step{
  min-height: 72px;
  align-content: center;
  gap: 3px;
}


  body.jlpt180-clean-lobby .dlb-dot{
  transform: translateY(-2px);
}


  body.jlpt180-clean-lobby .dlb-lbl{
  transform: translateY(-1px);
  line-height: 1;
}


  body.jlpt180-clean-lobby .dlb-cta{
  left: 28px;
  right: 28px;
  bottom: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border-radius: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 5px 14px rgba(41,206,0,.2);
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  background: linear-gradient(180deg, rgba(241,255,255,.96), rgba(225,251,255,.92));
}


  body.jlpt180-clean-lobby .dlb-stats{
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(246,252,255,.92));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(1){
  background: linear-gradient(180deg, #f4eaff, #ffffff);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(2){
  background: linear-gradient(180deg, #e7f5ff, #ffffff);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(3){
  background: linear-gradient(180deg, #fff2dc, #ffffff);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(4){
  background: linear-gradient(180deg, #f3e9ff, #ffffff);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(5){
  background: linear-gradient(180deg, #fff0d5, #ffffff);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(6){
  background: linear-gradient(180deg, #f4f7ff, #ffffff);
}

}


body.jlpt180-clean-lobby #loop-pulse-target{
  background: linear-gradient(180deg, rgba(236, 255, 247, .96), rgba(238, 248, 255, .92));
  border-color: rgba(92, 233, 184, .55);
  box-shadow: 0 10px 24px rgba(16, 185, 129, .12), inset 0 0 0 1px rgba(255,255,255,.82);
}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  background: linear-gradient(180deg, rgba(236, 255, 247, .98), rgba(238, 248, 255, .94));
  box-shadow: 0 12px 28px rgba(16, 185, 129, .14), inset 0 0 0 1px rgba(255,255,255,.84);
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  height: auto;
  min-height: 0;
  overflow: visible;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(167, 243, 208, .34), rgba(191, 219, 254, .34), rgba(255, 255, 255, .98));
  border-color: rgba(125, 211, 252, .72);
  box-shadow: 0 14px 30px rgba(34, 197, 94, .16), inset 0 0 0 1px rgba(255,255,255,.86);
}


  body.jlpt180-clean-lobby #jlpt-dlb,
body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  height: auto;
  min-height: 0;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
}


  body.jlpt180-clean-lobby #jlpt-dlb::after{
  left: 12px;
  right: 12px;
  top: 42px;
  height: 96px;
}


  body.jlpt180-clean-lobby .dlb-stats{
  margin: 102px 0 12px;
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(239, 246, 255, .96));
  border-color: rgba(125, 211, 252, .7);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(1){
  background: linear-gradient(135deg, rgba(139, 92, 246, .18), rgba(255,255,255,.98));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(2){
  background: linear-gradient(135deg, rgba(34, 211, 238, .18), rgba(255,255,255,.98));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(3){
  background: linear-gradient(135deg, rgba(74, 222, 128, .18), rgba(255,255,255,.98));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(4){
  background: linear-gradient(135deg, rgba(251, 191, 36, .18), rgba(255,255,255,.98));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(5){
  background: linear-gradient(135deg, rgba(244, 114, 182, .18), rgba(255,255,255,.98));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(6){
  background: linear-gradient(135deg, rgba(96, 165, 250, .18), rgba(255,255,255,.98));
}


  body.jlpt180-clean-lobby .dlb-steps{
  position: static;
  left: auto;
  right: auto;
  bottom: auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}


  body.jlpt180-clean-lobby .dlb-step{
  min-height: 64px;
  border-color: rgba(125, 211, 252, .7);
  box-shadow: 0 10px 18px rgba(59, 130, 246, .08);
}


  body.jlpt180-clean-lobby .dlb-dot{
  width: 30px;
  height: 30px;
}


  body.jlpt180-clean-lobby .dlb-lbl{
  color: #0b3f93;
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  min-height: 56px;
  margin: 2px 0 0;
  border: 0;
  border-radius: 22px;
  background: linear-gradient(135deg, #00e5ff, #7c3aed 50%, #22c55e);
  color: #fff;
  font-size: 16px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .05em;
  box-shadow: 0 14px 28px rgba(59, 130, 246, .22), 0 0 0 1px rgba(255,255,255,.72), 0 0 18px rgba(34, 211, 238, .34);
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  background:
      linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.06)),
      var(--jlpt-bg-bicanh) center / cover no-repeat;
  border-color: rgba(125,211,252,.62);
  box-shadow: 0 16px 34px rgba(14,165,233,.10), inset 0 0 0 1px rgba(255,255,255,.82);
}


  body.jlpt180-clean-lobby #loop-pulse-target::before{
  opacity: .42;
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  border-radius: 22px;
  border: 2px solid rgba(125,211,252,.72);
  box-shadow: 0 8px 24px rgba(16,185,129,.16), inset 0 0 0 1px rgba(255,255,255,.86);
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  font-size: 15px;
  font-weight: 900;
  color: #0b3f93;
  left: 14px;
  top: 14px;
}


  body.jlpt180-clean-lobby #jlpt-dlb::after{
  height: 88px;
  top: 38px;
}


  body.jlpt180-clean-lobby .dlb-stats{
  margin-top: 94px;
  border-radius: 16px;
  border-color: rgba(125,211,252,.65);
}


  body.jlpt180-clean-lobby .dlb-sn{
  color: #0b3f93;
}


  body.jlpt180-clean-lobby .dlb-sl,
body.jlpt180-clean-lobby .dlb-lbl{
  color: #2d5a8e;
}


  body.jlpt180-clean-lobby .dlb-step{
  border-radius: 16px;
  border-color: rgba(147,197,253,.65);
  box-shadow: 0 5px 14px rgba(59,130,246,.10);
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  border-radius: 999px;
  min-height: 52px;
  font-size: 15px;
  letter-spacing: .06em;
  background: linear-gradient(135deg, #1bd15c, #0fa84a);
  box-shadow: 0 8px 20px rgba(16,168,74,.3), inset 0 1px 0 rgba(255,255,255,.5);
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  border-color: rgba(255, 183, 213, .46);
  box-shadow:
      0 12px 26px rgba(6, 93, 128, .13),
      0 0 0 1px rgba(255,255,255,.72) inset,
      0 0 24px rgba(255, 143, 189, .08);
}


  body.jlpt180-clean-lobby .dlb-sl,
body.jlpt180-clean-lobby .dlb-step span{
  color: var(--sc-text);
}


  body.jlpt180-clean-lobby #loop-pulse-target{
  background:
      radial-gradient(circle at 8% 12%, rgba(255, 219, 234, .28), transparent 27%),
      linear-gradient(180deg, rgba(255,255,255,.58), rgba(238, 255, 252, .44));
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  background:
      linear-gradient(180deg, rgba(255,255,255,.16), rgba(235, 255, 251, .12)),
      var(--jlpt-bg-dlb, transparent);
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  color: #12324a;
  text-shadow: 0 2px 0 rgba(255,255,255,.5);
}


  body.jlpt180-clean-lobby .dlb-stats{
  border-color: rgba(255, 188, 216, .58);
  background: rgba(255,255,255,.82);
  box-shadow: 0 10px 22px rgba(14, 105, 140, .10), inset 0 1px 0 rgba(255,255,255,.9);
}


  body.jlpt180-clean-lobby .dlb-step{
  border-color: rgba(255, 205, 226, .56);
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255, 246, 251, .78));
  box-shadow: 0 8px 17px rgba(38, 107, 137, .09), inset 0 1px 0 rgba(255,255,255,.9);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(2),
body.jlpt180-clean-lobby .dlb-step:nth-child(4){
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(238, 251, 255, .82));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(3),
body.jlpt180-clean-lobby .dlb-step:nth-child(5){
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255, 248, 229, .78));
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  background: linear-gradient(180deg, #4be76f, #20c751);
  border-bottom-color: #129236;
  box-shadow: 0 12px 22px rgba(34, 197, 94, .28), 0 0 18px rgba(255, 143, 189, .10);
  text-shadow: 0 2px 0 rgba(0, 87, 34, .18);
}


  body.jlpt180-clean-lobby #loop-pulse-target::before{
  content: "✿";
  position: absolute;
  right: 18px;
  top: 14px;
  z-index: 2;
  color: rgba(255, 143, 189, .34);
  font-size: 18px;
  line-height: 1;
  pointer-events: none;
  text-shadow: 0 2px 0 rgba(255,255,255,.55);
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  border-color: rgba(255, 183, 213, .46);
  box-shadow: 0 10px 24px rgba(8, 86, 120, .12), 0 0 18px rgba(255, 143, 189, .08);
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  border: 2px solid var(--sc-border-main);
  background:
      radial-gradient(circle at 9% 14%, rgba(255, 207, 228, .44), transparent 24%),
      linear-gradient(180deg, rgba(255,255,255,.78), rgba(237, 255, 252, .60));
  box-shadow: var(--sc-depth-strong), 0 0 34px rgba(255, 143, 189, .14);
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  color: #102742;
  text-shadow: 0 2px 0 rgba(255,255,255,.75), 0 8px 18px rgba(17, 80, 120, .16);
}


  body.jlpt180-clean-lobby .dlb-stats{
  border: 2px solid rgba(255, 174, 205, .70);
  background: rgba(255,255,255,.92);
  box-shadow: 0 14px 30px rgba(16, 86, 124, .16), inset 0 1px 0 rgba(255,255,255,.95);
}


  body.jlpt180-clean-lobby .dlb-step{
  border-width: 2px;
  box-shadow: 0 11px 22px rgba(38, 107, 137, .12), inset 0 1px 0 rgba(255,255,255,.95);
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  background: linear-gradient(180deg, #58f37c 0%, #24d65c 58%, #17b748 100%);
  border: 0;
  border-bottom: 6px solid #108a38;
  box-shadow: 0 16px 28px rgba(31, 178, 78, .34), 0 0 22px rgba(91, 245, 129, .24);
  transform: translateY(0);
  text-shadow: 0 2px 0 rgba(0, 102, 37, .24);
}


  body.jlpt180-clean-lobby .dlb-cta:hover,
body.jlpt180-clean-lobby .jlpt-cta-outside:hover{
  filter: none;
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  border-width: 2px;
  box-shadow: 0 13px 28px rgba(8, 86, 120, .16), 0 0 20px rgba(255, 143, 189, .11);
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  border-bottom: 5px solid #108a38;
  box-shadow: 0 13px 24px rgba(31, 178, 78, .30);
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  position: relative;
  isolation: isolate;
  border: 2px solid rgba(255, 166, 205, .88);
  background:
      radial-gradient(circle at 12% 18%, rgba(255, 196, 220, .50), transparent 22%),
      radial-gradient(circle at 92% 84%, rgba(255, 220, 235, .42), transparent 24%),
      linear-gradient(135deg, rgba(255, 247, 252, .90) 0%, rgba(237, 255, 253, .74) 48%, rgba(255, 243, 232, .66) 100%);
  box-shadow:
      0 22px 48px rgba(15, 77, 116, .24),
      0 0 38px rgba(255, 142, 190, .18),
      inset 0 1px 0 rgba(255,255,255,.96),
      inset 0 -1px 0 rgba(255, 177, 211, .34);
}


  body.jlpt180-clean-lobby #loop-pulse-target::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 1;
  background:
      radial-gradient(ellipse at 13% 51%, rgba(255,255,255,.72) 0 7%, transparent 8%),
      radial-gradient(circle at 10% 46%, rgba(255, 116, 178, .20) 0 2.3%, transparent 2.8%),
      radial-gradient(circle at 16% 42%, rgba(255, 168, 207, .20) 0 2.1%, transparent 2.6%),
      radial-gradient(circle at 20% 50%, rgba(255, 195, 220, .18) 0 2.2%, transparent 2.8%),
      radial-gradient(circle at 88% 11%, rgba(255, 131, 184, .28) 0 1.9%, transparent 2.4%),
      radial-gradient(circle at 92% 15%, rgba(255, 175, 210, .24) 0 2.4%, transparent 3%),
      radial-gradient(circle at 83% 18%, rgba(255, 203, 226, .22) 0 2%, transparent 2.6%),
      radial-gradient(circle at 70% 8%, rgba(255, 174, 210, .18) 0 1.2%, transparent 1.8%),
      radial-gradient(circle at 74% 15%, rgba(255, 142, 190, .16) 0 1.1%, transparent 1.7%),
      linear-gradient(115deg, transparent 0 67%, rgba(160, 82, 82, .24) 67.1% 67.45%, transparent 67.55%),
      linear-gradient(18deg, transparent 0 13%, rgba(255, 166, 205, .36) 13.1% 13.45%, transparent 13.55%);
  filter: none;
}


  body.jlpt180-clean-lobby #loop-pulse-target::after{
  content: "";
  position: absolute;
  left: 32px;
  top: 64px;
  width: 230px;
  height: 230px;
  z-index: 0;
  pointer-events: none;
  border-radius: 999px;
  opacity: .50;
  background:
      repeating-conic-gradient(from 8deg, rgba(119, 96, 255, .18) 0 5deg, transparent 5deg 14deg),
      radial-gradient(circle, transparent 0 48%, rgba(255,255,255,.42) 49% 51%, transparent 52%),
      radial-gradient(circle, rgba(255, 213, 235, .34), transparent 70%);
  mask-image: radial-gradient(circle, transparent 0 38%, #000 39% 62%, transparent 63%);
}


  body.jlpt180-clean-lobby #jlpt-dlb{
  position: relative;
  z-index: 1;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  position: relative;
  z-index: 2;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner::before{
  content: "✿ ✦ ✿";
  position: absolute;
  right: 28px;
  top: 16px;
  z-index: 3;
  pointer-events: none;
  color: rgba(255, 124, 181, .48);
  font-size: 20px;
  letter-spacing: 7px;
  line-height: 1;
  text-shadow: 0 2px 0 rgba(255,255,255,.75), 0 0 14px rgba(255, 142, 190, .26);
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner::after{
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 12px;
  height: 58px;
  z-index: 1;
  pointer-events: none;
  border-radius: 999px;
  background:
      linear-gradient(90deg, transparent, rgba(255, 191, 216, .30), rgba(255, 243, 205, .24), rgba(118, 221, 211, .18), transparent),
      radial-gradient(circle at 10% 50%, rgba(255,255,255,.56), transparent 14%),
      radial-gradient(circle at 88% 50%, rgba(255,255,255,.50), transparent 14%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.48);
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  left: 34px;
  top: 20px;
  z-index: 5;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.42);
  border: 1px solid rgba(255, 174, 209, .55);
  box-shadow: 0 8px 20px rgba(14, 80, 120, .10), inset 0 1px 0 rgba(255,255,255,.72);
}


  body.jlpt180-clean-lobby .dlb-stats{
  position: relative;
  z-index: 4;
  border-color: rgba(255, 187, 215, .84);
  background:
      linear-gradient(180deg, rgba(255,255,255,.95), rgba(255, 250, 253, .88));
  box-shadow:
      0 16px 34px rgba(17, 89, 125, .17),
      0 0 0 1px rgba(255,255,255,.80) inset,
      0 0 26px rgba(255, 147, 193, .13);
}


  body.jlpt180-clean-lobby .dlb-stats::before,
body.jlpt180-clean-lobby .dlb-stats::after{
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  width: 28px;
  pointer-events: none;
  opacity: .70;
  background:
      radial-gradient(circle at 50% 12%, rgba(255, 157, 199, .50) 0 4px, transparent 5px),
      radial-gradient(circle at 50% 36%, rgba(255, 211, 230, .54) 0 3px, transparent 4px),
      radial-gradient(circle at 50% 64%, rgba(255, 157, 199, .44) 0 3px, transparent 4px),
      linear-gradient(180deg, transparent, rgba(255, 176, 209, .28), transparent);
}


  body.jlpt180-clean-lobby .dlb-stats::before{
  left: 9px;
}


  body.jlpt180-clean-lobby .dlb-stats::after{
  right: 9px;
}


  body.jlpt180-clean-lobby .dlb-steps{
  z-index: 4;
}


  body.jlpt180-clean-lobby .dlb-step{
  position: relative;
  overflow: hidden;
  border-color: rgba(255, 190, 216, .72);
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255, 246, 252, .80));
  box-shadow:
      0 11px 22px rgba(35, 104, 137, .12),
      0 0 0 1px rgba(255,255,255,.80) inset,
      inset 0 -4px 0 rgba(255, 184, 215, .16);
}


  body.jlpt180-clean-lobby .dlb-step::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .64;
  background:
      radial-gradient(circle at 24% 18%, rgba(255,255,255,.84), transparent 18%),
      radial-gradient(circle at 82% 84%, rgba(255, 178, 211, .24), transparent 24%);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(1){
  border-bottom: 4px solid rgba(124,58,237,.36);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(2){
  border-bottom: 4px solid rgba(14,165,233,.42);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(3){
  border-bottom: 4px solid rgba(245,158,11,.40);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(4){
  border-bottom: 4px solid rgba(168,85,247,.38);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(5){
  border-bottom: 4px solid rgba(234,179,8,.42);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(6){
  border-bottom: 4px solid rgba(100,116,139,.28);
}


  body.jlpt180-clean-lobby .dlb-dot,
body.jlpt180-clean-lobby .dlb-sl{
  position: relative;
  z-index: 2;
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  position: relative;
  z-index: 5;
  border-radius: 18px;
  border: 1px solid rgba(255, 231, 168, .54);
  border-bottom: 7px solid #0f8735;
  background:
      linear-gradient(90deg, rgba(255, 234, 170, .36), transparent 18%, transparent 82%, rgba(255, 234, 170, .36)),
      linear-gradient(180deg, #55f783 0%, #28d861 55%, #16b947 100%);
  box-shadow:
      0 18px 30px rgba(31, 178, 78, .34),
      0 0 24px rgba(91, 245, 129, .26),
      inset 0 1px 0 rgba(255,255,255,.58);
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  position: relative;
  isolation: isolate;
  border-color: rgba(255, 166, 205, .72);
  background:
      radial-gradient(circle at 10% 16%, rgba(255, 204, 226, .46), transparent 25%),
      linear-gradient(135deg, rgba(255,255,255,.92), rgba(239, 255, 252, .72));
}


  body.jlpt180-clean-lobby #loop-pulse-target::before{
  content: "✿";
  position: absolute;
  right: 16px;
  top: 12px;
  z-index: 1;
  color: rgba(255, 124, 181, .42);
  font-size: 20px;
  pointer-events: none;
}


  body.jlpt180-clean-lobby #jlpt-dlb,
body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner,
body.jlpt180-clean-lobby .dlb-stats,
body.jlpt180-clean-lobby .dlb-steps,
body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  position: relative;
  z-index: 2;
}


  body.jlpt180-clean-lobby .dlb-step{
  border-color: rgba(255, 190, 216, .62);
  box-shadow: 0 9px 18px rgba(35, 104, 137, .10), inset 0 -3px 0 rgba(255, 184, 215, .14);
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  overflow: hidden;
}


  body.jlpt180-clean-lobby #jlpt-dlb,
body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  position: relative;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner{
  padding-bottom: 82px;
}


  body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner::after{
  z-index: 0;
  bottom: 8px;
  height: 54px;
}


  body.jlpt180-clean-lobby .dlb-stats{
  margin-bottom: 16px;
}


  body.jlpt180-clean-lobby .dlb-steps{
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 84px;
  z-index: 5;
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside,
body.jlpt180-clean-lobby #dlb-cta.jlpt-cta-outside{
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 16px;
  width: auto;
  height: 48px;
  min-height: 48px;
  max-height: 48px;
  margin: 0;
  padding: 0 24px;
  display: block;
  z-index: 8;
  line-height: 48px;
  transform: none;
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside,
body.jlpt180-clean-lobby #dlb-cta.jlpt-cta-outside{
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  width: 100%;
  margin-top: 10px;
  transform: none;
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  overflow: hidden;
  border: 2px solid rgba(255, 151, 194, .82);
  background:
      radial-gradient(circle at 12% 19%, rgba(255, 202, 226, .48), transparent 25%),
      radial-gradient(circle at 82% 10%, rgba(255, 174, 211, .28), transparent 22%),
      linear-gradient(135deg, rgba(255,255,255,.96), rgba(255, 246, 252, .84) 48%, rgba(233, 255, 252, .76));
  box-shadow:
      0 14px 30px rgba(12, 82, 118, .16),
      0 0 26px rgba(255, 143, 189, .16),
      inset 0 1px 0 rgba(255,255,255,.88);
}


  body.jlpt180-clean-lobby #loop-pulse-target::before{
  content: "✿ ✦";
  right: 14px;
  top: 10px;
  z-index: 1;
  color: rgba(255, 117, 177, .44);
  font-size: 18px;
  letter-spacing: 5px;
  text-shadow: 0 2px 0 rgba(255,255,255,.72), 0 0 12px rgba(255, 143, 189, .24);
}


  body.jlpt180-clean-lobby #loop-pulse-target::after{
  content: "";
  position: absolute;
  left: -44px;
  top: 74px;
  width: 190px;
  height: 190px;
  z-index: 0;
  pointer-events: none;
  border-radius: 999px;
  opacity: .42;
  background:
      repeating-conic-gradient(from 12deg, rgba(137, 104, 255, .18) 0 5deg, transparent 5deg 14deg),
      radial-gradient(circle, transparent 0 46%, rgba(255,255,255,.50) 47% 50%, transparent 51%),
      radial-gradient(circle, rgba(255, 214, 234, .38), transparent 70%);
  -webkit-mask-image: radial-gradient(circle, transparent 0 38%, #000 39% 63%, transparent 64%);
  mask-image: radial-gradient(circle, transparent 0 38%, #000 39% 63%, transparent 64%);
}


  body.jlpt180-clean-lobby #jlpt-dlb,
body.jlpt180-clean-lobby #jlpt-dlb .dlb-inner,
body.jlpt180-clean-lobby .dlb-stats,
body.jlpt180-clean-lobby .dlb-steps,
body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside{
  position: relative;
  z-index: 2;
}


  body.jlpt180-clean-lobby #jlpt-dlb::before{
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255, 160, 202, .62);
  border-radius: 999px;
  padding: 5px 12px;
  box-shadow: 0 7px 16px rgba(14, 80, 120, .10), inset 0 1px 0 rgba(255,255,255,.78);
}


  body.jlpt180-clean-lobby .dlb-stats{
  border: 2px solid rgba(255, 180, 212, .76);
  background:
      linear-gradient(180deg, rgba(255,255,255,.96), rgba(255, 249, 253, .90));
  box-shadow:
      0 12px 24px rgba(18, 89, 123, .14),
      0 0 0 1px rgba(255,255,255,.82) inset,
      0 0 18px rgba(255, 143, 189, .12);
}


  body.jlpt180-clean-lobby .dlb-stats::before,
body.jlpt180-clean-lobby .dlb-stats::after{
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  width: 18px;
  pointer-events: none;
  opacity: .55;
  background:
      radial-gradient(circle at 50% 18%, rgba(255, 151, 194, .50) 0 3px, transparent 4px),
      radial-gradient(circle at 50% 50%, rgba(255, 215, 232, .52) 0 2px, transparent 3px),
      radial-gradient(circle at 50% 78%, rgba(255, 151, 194, .42) 0 2px, transparent 3px),
      linear-gradient(180deg, transparent, rgba(255, 180, 212, .22), transparent);
}


  body.jlpt180-clean-lobby .dlb-stats::before{
  left: 7px;
}


  body.jlpt180-clean-lobby .dlb-stats::after{
  right: 7px;
}


  body.jlpt180-clean-lobby .dlb-step{
  overflow: hidden;
  border-width: 2px;
  border-color: rgba(255, 196, 220, .70);
  background:
      radial-gradient(circle at 24% 16%, rgba(255,255,255,.85), transparent 24%),
      linear-gradient(180deg, rgba(255,255,255,.95), rgba(255, 247, 252, .84));
  box-shadow:
      0 9px 18px rgba(35, 104, 137, .12),
      inset 0 1px 0 rgba(255,255,255,.9),
      inset 0 -4px 0 rgba(255, 184, 215, .17);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(1){
  border-bottom: 4px solid rgba(124,58,237,.44);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(2){
  border-bottom: 4px solid rgba(14,165,233,.48);
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(235, 251, 255, .86));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(3){
  border-bottom: 4px solid rgba(245,158,11,.48);
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255, 249, 230, .86));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(4){
  border-bottom: 4px solid rgba(168,85,247,.44);
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(5){
  border-bottom: 4px solid rgba(234,179,8,.48);
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255, 247, 233, .86));
}


  body.jlpt180-clean-lobby .dlb-step:nth-child(6){
  border-bottom: 4px solid rgba(100,116,139,.34);
}


  body.jlpt180-clean-lobby .dlb-cta,
body.jlpt180-clean-lobby .jlpt-cta-outside,
body.jlpt180-clean-lobby #dlb-cta.jlpt-cta-outside{
  border-radius: 16px;
  border: 1px solid rgba(255, 231, 168, .56);
  border-bottom: 6px solid #108a38;
  background:
      linear-gradient(90deg, rgba(255, 235, 178, .34), transparent 20%, transparent 80%, rgba(255, 235, 178, .34)),
      linear-gradient(180deg, #5ff985 0%, #2ddb63 56%, #17b948 100%);
  box-shadow:
      0 13px 24px rgba(31, 178, 78, .30),
      0 0 20px rgba(91, 245, 129, .22),
      inset 0 1px 0 rgba(255,255,255,.60);
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby #loop-pulse-target{
  margin-bottom: 5px;
  overflow: hidden;
}

}


@media (max-width: 899px){
body.jlpt180-clean-lobby #loop-pulse-target{
  margin-bottom: 5px;
}

}


@media (min-width: 900px){
body.jlpt180-clean-lobby .dlb-stats{
  transform: translateY(-10px);
}

}