.phase-two-shell {
  --phase-two-accent: #d56f3f;
  --phase-two-accent-soft: #f5d8bd;
  --phase-two-complete: #3e7864;
}

.phase-two-home {
  background: #fffdf9;
}

.local-preview-badge {
  padding: 6px 9px;
  border: 1px solid #8c5a3f;
  border-radius: 6px;
  color: #70452f;
  font-size: 12px;
  font-weight: 800;
}

.phase-two-summary .primary-button,
.phase-two-shell .primary-button {
  background: var(--phase-two-accent);
}

.phase-two-summary .home-progress-track > div,
.phase-two-shell .progress-bar {
  background: var(--phase-two-accent);
}

.phase-two-shell .course-group {
  background: transparent;
}

.phase-two-shell .unit-row.completed .unit-number {
  background: var(--phase-two-complete);
  color: #fff;
}

.phase-two-shell .unit-row.current {
  border-color: #d89069;
  background: #fff8f2;
}

.phase-two-shell .unit-row.current .unit-number {
  background: var(--phase-two-accent);
  color: #fff;
}

.phase-two-video-placeholder {
  opacity: 0.82;
}

.phase-two-scene {
  display: grid;
  place-items: center;
  padding: 24px;
}

.phase-two-scene-card {
  width: min(100%, 360px);
  min-height: 220px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 16px;
  padding: 28px;
  border: 1px solid #e7c7af;
  border-radius: 8px;
  background: linear-gradient(155deg, #fffaf4, #f8dfca);
  box-shadow: 0 16px 38px rgba(91, 57, 37, 0.12);
  text-align: center;
}

.phase-two-scene-emoji {
  font-size: 72px;
  line-height: 1;
}

.phase-two-scene-card strong {
  max-width: 260px;
  color: #68422f;
  font-size: 16px;
  letter-spacing: 0;
}

.phase-two-scene-card.question {
  background: linear-gradient(155deg, #fffaf4, #f4e8d9);
}

.phase-two-scene-card.compare {
  border-color: #b9d5ca;
  background: linear-gradient(155deg, #fbfffd, #deeee7);
}

.p2-unit-one-scene {
  position: relative;
  width: min(100%, 370px);
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #dfd4c5;
  border-radius: 8px;
  background: #f4eadc;
  box-shadow: 0 12px 28px rgb(69 54 42 / 10%);
}

.p2-unit-one-scene::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 48px;
  background: #dbc7ad;
}

.p2-urgent-clock,
.p2-big-watch,
.p2-door,
.p2-small-door,
.p2-home,
.p2-stop-sign,
.p2-waiting-person,
.p2-leaving-watch {
  position: absolute;
  z-index: 3;
  line-height: 1;
}

.p2-urgent-clock { top: 24px; left: 27px; font-size: 55px; transform: rotate(-8deg); }
.p2-urgent-person { position: absolute; z-index: 4; left: 135px; bottom: 35px; font-size: 92px; transform: rotate(-5deg); }
.p2-urgent-face { position: absolute; z-index: 5; top: 33px; right: 39px; font-size: 50px; }
.p2-motion-lines { position: absolute; z-index: 2; left: 74px; bottom: 81px; color: #c76c43; font-size: 48px; font-weight: 900; letter-spacing: -8px; }
.p2-task-stack { position: absolute; z-index: 3; right: 34px; bottom: 45px; font-size: 48px; }

.p2-watch-person { position: absolute; z-index: 3; left: 58px; bottom: 39px; font-size: 92px; }
.p2-pointing-hand { position: absolute; z-index: 5; left: 145px; top: 75px; font-size: 48px; transform: rotate(90deg); }
.p2-big-watch { top: 39px; left: 176px; font-size: 68px; }
.p2-exit-arrow { position: absolute; z-index: 4; right: 65px; bottom: 91px; color: #c55d3c; font-size: 48px; font-weight: 900; }
.p2-exit-arrow.small { right: 45px; bottom: 73px; font-size: 35px; }
.p2-door { right: 22px; bottom: 32px; font-size: 82px; }
.p2-small-door { right: 18px; bottom: 31px; font-size: 64px; }

.p2-family { position: absolute; z-index: 3; top: 25px; left: 50%; transform: translateX(-50%); font-size: 70px; }
.p2-dinner-table { position: absolute; z-index: 4; left: 50%; bottom: 40px; transform: translateX(-50%); width: 235px; height: 64px; display: flex; align-items: center; justify-content: center; gap: 15px; border-radius: 50% 50% 12px 12px; background: #a96f46; box-shadow: inset 0 7px #c99166; font-size: 36px; }
.p2-dinner-table::before, .p2-dinner-table::after { content: ""; position: absolute; top: 56px; width: 14px; height: 38px; background: #7d4d31; }
.p2-dinner-table::before { left: 38px; }
.p2-dinner-table::after { right: 38px; }
.p2-pov-hands { position: absolute; z-index: 6; left: 50%; bottom: -3px; transform: translateX(-50%); width: 310px; display: flex; justify-content: space-between; font-size: 48px; }
.p2-invite-bubble, .p2-question-bubble { position: absolute; z-index: 7; right: 21px; top: 16px; min-width: 86px; min-height: 55px; padding: 8px 11px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 3px solid #fff; border-radius: 24px; background: #fffdf9; box-shadow: 0 5px 13px rgb(62 51 41 / 15%); font-size: 29px; }
.p2-invite-bubble::after, .p2-question-bubble::after { content: ""; position: absolute; left: 14px; bottom: -14px; border: 8px solid transparent; border-top-color: #fffdf9; transform: rotate(12deg); }
.p2-question-bubble strong { color: #be563a; font-size: 32px; }
.p2-question-bubble.bus { min-width: 118px; }
.p2-leaving-person { position: absolute; z-index: 7; right: 78px; bottom: 35px; font-size: 58px; }
.p2-leaving-watch { right: 116px; bottom: 112px; font-size: 35px; }

.p2-timetable { position: absolute; z-index: 4; left: 24px; top: 22px; width: 115px; padding: 10px; display: grid; gap: 5px; border: 5px solid #526963; border-radius: 7px; background: #f8f4e8; box-shadow: 0 6px 12px rgb(49 55 51 / 13%); }
.p2-timetable::before { content: ""; position: absolute; left: 50%; top: 100%; width: 7px; height: 66px; transform: translateX(-50%); background: #526963; }
.p2-timetable i, .p2-timetable strong { padding: 3px 4px; border-bottom: 1px solid #c9c0b5; color: #52615d; font-size: 12px; font-style: normal; text-align: center; }
.p2-timetable strong { border-radius: 4px; background: #d55f43; color: #fff; }
.p2-timetable.compact { top: 26px; width: 105px; }
.p2-bus { position: absolute; z-index: 5; left: 50px; bottom: 42px; font-size: 91px; line-height: 1; }
.p2-bus.last { left: 165px; }
.p2-bus b { position: absolute; left: 25px; top: 14px; padding: 2px 5px; border-radius: 3px; background: #d04f36; color: #fff; font-size: 11px; white-space: nowrap; }
.p2-stop-sign { right: 30px; bottom: 54px; font-size: 61px; }
.p2-road-arrow { position: absolute; z-index: 4; left: 163px; bottom: 90px; color: #c45d3b; font-size: 46px; font-weight: 900; }
.p2-road-arrow.small { left: auto; right: 85px; bottom: 91px; font-size: 34px; }
.p2-home { right: 27px; bottom: 44px; font-size: 83px; }
.p2-home.small { right: 20px; bottom: 52px; font-size: 60px; }
.p2-stop-shelter { position: absolute; z-index: 3; left: 25px; bottom: 47px; width: 105px; height: 116px; border: 8px solid #657a75; border-bottom-width: 4px; border-radius: 9px 9px 0 0; background: #d8e5e1; }
.p2-stop-shelter span { position: absolute; right: -35px; top: -34px; font-size: 48px; }
.p2-bus.arriving { left: 165px; bottom: 43px; transform: rotate(-2deg); }
.p2-bus.arriving.close { left: 145px; font-size: 103px; }
.p2-arrival-lines { position: absolute; z-index: 2; right: 24px; bottom: 102px; color: #c25f3d; font-size: 40px; font-weight: 900; transform: rotate(8deg); }
.p2-waiting-person { left: 55px; bottom: 46px; font-size: 43px; }
.p2-big-watch.near { top: 24px; left: 39px; font-size: 58px; }

.p2-unit-one-recap .orbit-1 { top: 16px; left: 8px; }
.p2-unit-one-recap .orbit-2 { top: 17px; right: 10px; }
.p2-unit-one-recap .orbit-3 { top: auto; bottom: 18px; left: 0; }
.p2-unit-one-recap .orbit-4 { top: auto; right: 13px; bottom: 21px; }
.p2-unit-one-recap .recap-core strong { min-width: 100px; }

.p2-unit-two-scene {
  position: relative;
  width: min(100%, 370px);
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #dfd4c5;
  border-radius: 8px;
  background: #f4eadc;
  box-shadow: 0 12px 28px rgb(69 54 42 / 10%);
}

.p2-unit-two-scene::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 46px;
  background: #dbc7ad;
}

.p2-shop-shelf {
  position: absolute;
  z-index: 1;
  top: 22px;
  right: 22px;
  width: 145px;
  height: 92px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  padding: 8px;
  border: 8px solid #8f6748;
  border-top-width: 5px;
  background: repeating-linear-gradient(to bottom, #f9f2e8 0 38px, #8f6748 38px 44px);
  font-size: 28px;
}

.p2-need-person { position: absolute; z-index: 4; left: 58px; bottom: 37px; font-size: 83px; }
.p2-need-hands { position: absolute; z-index: 5; left: 141px; bottom: 67px; font-size: 53px; }
.p2-need-hands.water { left: 150px; bottom: 30px; }
.p2-product-focus { position: absolute; z-index: 5; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 108px; line-height: 1; }
.p2-product-focus.bag { font-size: 90px; }
.p2-product-focus.bag.right { left: auto; right: 48px; transform: translateY(-50%); }
.p2-product-focus.bag.left { left: 65px; transform: translateY(-50%); }
.p2-need-arrow { position: absolute; z-index: 5; left: 163px; top: 87px; color: #c45d3b; font-size: 49px; font-weight: 900; }
.unit-two-need-bag .p2-need-person { left: 42px; }
.unit-two-need-bag .p2-need-arrow { left: 157px; }
.unit-two-need-bag .p2-product-focus.bag { left: auto; right: 37px; transform: translateY(-50%); }
.p2-carry-person { position: absolute; z-index: 4; left: 74px; bottom: 38px; font-size: 100px; }
.p2-carry-hand { position: absolute; z-index: 6; left: 171px; bottom: 79px; font-size: 42px; }
.p2-carry-bag { position: absolute; z-index: 5; left: 203px; bottom: 38px; font-size: 72px; }
.p2-grocery-row { position: absolute; z-index: 4; inset: 58px 24px auto; display: flex; justify-content: space-around; font-size: 57px; }
.p2-grocery-bag { position: absolute; z-index: 4; left: 50%; bottom: 29px; width: 205px; height: 116px; transform: translateX(-50%); display: flex; align-items: flex-start; justify-content: center; gap: 5px; padding-top: 12px; border-radius: 7px 7px 25px 25px; background: #c38a52; box-shadow: inset 0 9px #e4b77f; font-size: 42px; }
.p2-pov-hands.shopping { bottom: -6px; }

.p2-clerk { position: absolute; z-index: 4; left: 50%; top: 42px; transform: translateX(-50%); font-size: 79px; }
.p2-clerk.price { left: 88px; top: 36px; transform: none; font-size: 75px; }
.p2-clerk.payment { left: auto; right: 61px; top: 38px; transform: none; font-size: 78px; }
.p2-shop-counter { position: absolute; z-index: 3; left: 28px; right: 28px; bottom: 35px; height: 66px; border-radius: 6px 6px 0 0; background: #9a6745; box-shadow: inset 0 8px #c58f65; }
.p2-shop-counter.price { left: 41px; right: 41px; }
.p2-shop-counter.price span { position: absolute; right: 57px; bottom: 26px; font-size: 65px; }
.p2-shop-counter.payment { left: 32px; right: 32px; }
.p2-shop-bubble { position: absolute; z-index: 7; right: 55px; top: 16px; width: 78px; height: 61px; display: grid; place-items: center; border: 3px solid #fff; border-radius: 28px; background: #fffdf9; box-shadow: 0 5px 13px rgb(62 51 41 / 15%); }
.p2-shop-bubble::after { content: ""; position: absolute; left: 15px; bottom: -14px; border: 8px solid transparent; border-top-color: #fffdf9; transform: rotate(12deg); }
.p2-shop-bubble strong { color: #be563a; font-size: 38px; }

.p2-core-icons { position: absolute; z-index: 4; inset: 61px 27px auto; display: flex; align-items: center; justify-content: space-around; }
.p2-core-icons > span { position: relative; min-width: 83px; height: 83px; display: grid; place-items: center; border-radius: 50%; background: #fffdf9; box-shadow: 0 8px 18px rgb(66 51 40 / 12%); font-size: 54px; }
.p2-core-icons > span.none { color: #cf4f39; font-family: Arial, sans-serif; font-size: 76px; font-weight: 500; }
.p2-core-icons i { position: absolute; right: -8px; bottom: 4px; font-size: 30px; font-style: normal; }
.p2-none-symbol { position: absolute; z-index: 4; inset: 37px 0 auto; color: #cf4f39; font-family: Arial, sans-serif; font-size: 145px; line-height: 1; text-align: center; }
.p2-problem-face { position: absolute; z-index: 4; left: 80px; top: 59px; font-size: 80px; }
.p2-problem-warning { position: absolute; z-index: 5; right: 77px; top: 52px; font-size: 88px; }
.p2-problem-lines { position: absolute; z-index: 3; left: 112px; bottom: 45px; color: #c45d3b; font-size: 39px; font-weight: 900; letter-spacing: -9px; transform: rotate(-8deg); }
.p2-crossed-problem { position: absolute; z-index: 4; left: 50%; top: 48%; width: 130px; height: 130px; transform: translate(-50%, -50%); display: grid; place-items: center; border: 9px solid #cf4f39; border-radius: 50%; background: #fff9ef; }
.p2-crossed-problem span { font-size: 72px; }
.p2-crossed-problem i { position: absolute; width: 150px; height: 10px; border-radius: 8px; background: #cf4f39; transform: rotate(-42deg); }
.p2-crossed-problem.small { left: 82px; width: 91px; height: 91px; border-width: 7px; }
.p2-crossed-problem.small span { font-size: 49px; }
.p2-crossed-problem.small i { width: 105px; height: 8px; }
.p2-plus, .p2-equals { position: absolute; z-index: 5; left: 50%; top: 48%; transform: translate(-50%, -50%); color: #8c5a3f; font-size: 48px; font-weight: 900; }
.p2-money-face { position: absolute; z-index: 4; left: 50%; top: 48%; transform: translate(-50%, -50%); font-size: 100px; }
.p2-money-face.right { left: auto; right: 45px; transform: translateY(-50%); font-size: 82px; }
.p2-price-coins { position: absolute; z-index: 5; right: 62px; bottom: 45px; font-size: 38px; }
.p2-euro-coin { position: absolute; z-index: 6; left: 50%; top: 48%; width: 126px; height: 126px; transform: translate(-50%, -50%); display: grid; place-items: center; border: 9px double #b57b18; border-radius: 50%; background: #f4c94e; color: #6d4a08; font-family: Arial, sans-serif; font-size: 43px; font-weight: 900; box-shadow: 0 8px 20px rgb(99 73 17 / 18%); }
.p2-euro-coin.small { left: auto; right: 37px; top: 40px; width: 82px; height: 82px; transform: none; border-width: 7px; font-size: 28px; }

.p2-payment-hand { position: absolute; z-index: 5; left: 68px; top: 78px; font-size: 90px; }
.p2-payment-item { position: absolute; z-index: 6; left: 132px; top: 61px; font-size: 65px; transform: rotate(-10deg); }
.p2-payment-arrow { position: absolute; z-index: 4; right: 61px; top: 87px; color: #c45d3b; font-size: 55px; font-weight: 900; }
.p2-payment-hand.cash { left: 45px; top: 92px; font-size: 77px; }
.p2-payment-item.cash { left: 100px; top: 78px; font-size: 57px; }
.p2-payment-arrow.cash { left: 170px; right: auto; top: 89px; }
.p2-payment-hand.cash.large { left: 62px; top: 75px; font-size: 96px; }
.p2-payment-item.cash.large { left: 132px; top: 60px; font-size: 70px; }
.p2-payment-arrow.cash.large { left: auto; right: 59px; top: 88px; }
.p2-cash-focus { position: absolute; z-index: 4; inset: 52px 0 auto; font-size: 115px; line-height: 1; text-align: center; }

.p2-kiosk { position: absolute; z-index: 3; left: 27px; bottom: 39px; width: 175px; height: 135px; display: flex; align-items: flex-end; justify-content: space-evenly; padding: 0 12px 18px; border: 8px solid #865a3d; background: #fff4df; font-size: 37px; }
.p2-kiosk b { position: absolute; left: -8px; right: -8px; top: -30px; height: 31px; background: repeating-linear-gradient(90deg, #d96349 0 27px, #fff6e9 27px 54px); clip-path: polygon(0 0, 100% 0, 94% 100%, 6% 100%); }
.p2-kiosk.compact { width: 125px; height: 120px; padding: 0; }
.p2-kiosk-clerk { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); font-size: 61px; }
.p2-water-bottle { position: absolute; z-index: 5; right: 57px; top: 46px; width: 68px; height: 124px; display: grid; place-items: center; border: 5px solid #7ab7cf; border-radius: 17px 17px 23px 23px; background: linear-gradient(90deg, #dff6ff, #fff 55%, #c9ecf8); box-shadow: inset 0 -17px #9bd4e8, 0 8px 16px rgb(65 102 116 / 15%); }
.p2-water-bottle::before { content: ""; position: absolute; top: -18px; width: 34px; height: 20px; border-radius: 6px 6px 2px 2px; background: #3c8eb3; }
.p2-water-bottle i { position: absolute; inset: 47px 8px auto; height: 31px; border-radius: 7px; background: #80cceb; }
.p2-water-bottle b { position: relative; z-index: 1; margin-top: 7px; color: #256985; font-size: 20px; }
.p2-pointing-right { position: absolute; z-index: 6; left: 151px; top: 83px; font-size: 47px; }
.p2-vending-machine { position: absolute; z-index: 4; right: 25px; bottom: 35px; width: 120px; height: 165px; display: grid; grid-template-columns: repeat(2, 1fr); place-items: center; padding: 17px 10px 27px; border: 9px solid #526963; border-radius: 8px; background: #cfe4e6; box-shadow: inset 0 -20px #526963; font-size: 29px; }
.p2-two-coins { position: absolute; z-index: 5; inset: 55px 47px auto; display: flex; justify-content: center; gap: 22px; }
.p2-two-coins span { width: 105px; height: 105px; display: grid; place-items: center; border: 8px double #b57b18; border-radius: 50%; background: #f4c94e; color: #6d4a08; font-family: Arial, sans-serif; font-size: 34px; font-weight: 900; box-shadow: 0 8px 18px rgb(99 73 17 / 18%); }

.p2-unit-two-recap .recap-core { grid-template-columns: 1fr 1fr; gap: 7px; }
.p2-unit-two-recap .recap-core strong { min-width: 92px; padding: 11px 9px; font-size: 15px; }
.p2-unit-two-recap .orbit { font-size: 11px; }
.p2-unit-two-recap .orbit-1 { top: 6px; left: 8px; }
.p2-unit-two-recap .orbit-2 { top: 6px; right: 10px; }
.p2-unit-two-recap .orbit-3 { top: 62px; left: 0; }
.p2-unit-two-recap .orbit-4 { top: 64px; right: 0; }
.p2-unit-two-recap .orbit-5 { top: auto; bottom: 65px; left: 0; }
.p2-unit-two-recap .orbit-6 { top: auto; right: 0; bottom: 67px; }
.p2-unit-two-recap .orbit-7 { top: auto; bottom: 7px; left: 9px; }
.p2-unit-two-recap .orbit-8 { top: auto; right: 12px; bottom: 7px; }

.p2-unit-three-scene {
  position: relative;
  width: min(100%, 370px);
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #dfd4c5;
  border-radius: 8px;
  background: #f4eadc;
  box-shadow: 0 12px 28px rgb(69 54 42 / 10%);
}

.p2-unit-three-scene::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 44px;
  background: #8b5943;
}

.p2-bar-window { position: absolute; z-index: 1; top: 20px; left: 18px; right: 18px; height: 88px; display: flex; justify-content: space-around; align-items: center; border: 8px solid #654938; background: #253748; box-shadow: inset 0 -14px #172633; }
.p2-bar-window i { width: 5px; height: 5px; border-radius: 50%; background: #f5d76e; box-shadow: 25px 12px #f5d76e, -20px 29px #f5d76e, 7px 47px #f5d76e; }
.p2-bar-table { position: absolute; z-index: 5; left: 50%; bottom: 30px; width: 205px; height: 70px; transform: translateX(-50%); display: flex; align-items: flex-start; justify-content: center; gap: 32px; padding-top: 6px; border-radius: 50% 50% 8px 8px; background: #9b6545; box-shadow: inset 0 7px #c18b65; font-size: 38px; }
.p2-bar-friend { position: absolute; z-index: 4; bottom: 43px; font-size: 79px; }
.p2-bar-friend.left { left: 35px; }
.p2-bar-friend.right { right: 34px; }
.p2-juan-bubble { position: absolute; z-index: 8; top: 8px; left: 50%; width: 122px; height: 86px; transform: translateX(-50%); display: grid; grid-template-columns: 55px 1fr; align-items: center; padding: 6px 9px; border: 3px solid #fff; border-radius: 28px; background: #fffdf9; box-shadow: 0 5px 13px rgb(30 27 24 / 22%); }
.p2-juan-bubble::after { content: ""; position: absolute; left: 16px; bottom: -14px; border: 8px solid transparent; border-top-color: #fffdf9; }
.p2-juan-bubble span { grid-row: 1 / 3; font-size: 49px; }
.p2-juan-bubble b { color: #4d3a30; font-family: Arial, sans-serif; font-size: 12px; text-align: center; }
.p2-juan-bubble strong { color: #c2573f; font-size: 34px; line-height: 1; text-align: center; }

.p2-thinker { position: absolute; z-index: 4; left: 50%; top: 48%; transform: translate(-50%, -50%); font-size: 112px; }
.p2-thinker.left { left: 30%; }
.p2-thought-dots { position: absolute; z-index: 3; top: 42px; right: 57px; display: flex; align-items: flex-end; gap: 7px; }
.p2-thought-dots i { width: 13px; height: 13px; border-radius: 50%; background: #c8b59f; }
.p2-thought-dots i:nth-child(2) { width: 20px; height: 20px; }
.p2-thought-dots i:nth-child(3) { width: 28px; height: 28px; }
.p2-big-check { position: absolute; z-index: 5; left: 50%; top: 47%; width: 128px; height: 128px; transform: translate(-50%, -50%); display: grid; place-items: center; border-radius: 50%; background: #3e7864; color: #fff; font-family: Arial, sans-serif; font-size: 94px; font-weight: 900; box-shadow: 0 10px 22px rgb(42 93 74 / 20%); }
.p2-big-check.right { left: auto; right: 35px; transform: translateY(-50%); width: 106px; height: 106px; font-size: 76px; }
.p2-confident { position: absolute; z-index: 4; left: 50%; top: 48%; transform: translate(-50%, -50%); font-size: 116px; filter: drop-shadow(0 8px 11px rgb(65 45 32 / 12%)); }
.p2-confident.left { left: 29%; }
.p2-confident.small { left: 65px; top: 49%; font-size: 90px; }
.p2-confident.window { left: 55px; top: 48%; font-size: 72px; }
.p2-confidence-lines { position: absolute; z-index: 5; right: 67px; top: 44px; color: #d9a72d; font-size: 67px; }
.p2-point-far { position: absolute; z-index: 4; left: 67px; top: 72px; font-size: 93px; }
.p2-eye-focus { position: absolute; z-index: 4; right: 65px; top: 70px; font-size: 91px; }
.p2-point-far.right { left: 156px; top: 82px; font-size: 66px; }
.p2-eye-focus.right { right: 39px; top: 80px; font-size: 68px; }

.p2-cloud-window { position: absolute; z-index: 2; top: 19px; left: 24px; right: 24px; height: 151px; display: grid; grid-template-columns: repeat(2, 1fr); place-items: center; overflow: hidden; border: 10px solid #7a543d; background: linear-gradient(#79bce0, #d6edf7 70%, #a6c887); font-size: 56px; }
.p2-cloud-window::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 7px; transform: translateX(-50%); background: #7a543d; }
.p2-cloud-window::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 7px; transform: translateY(-50%); background: #7a543d; }
.p2-cloud-window span { position: relative; z-index: 1; }
.p2-cloud-window i { position: absolute; right: 12px; bottom: 9px; width: 25px; height: 18px; border-radius: 50% 50% 25% 25%; background: #8797a0; box-shadow: -18px 4px #8797a0; }
.p2-cloud-window.compact { left: 125px; right: 16px; height: 157px; font-size: 45px; }
.p2-point-window { position: absolute; z-index: 6; left: 32px; bottom: 38px; font-size: 63px; }
.p2-eye-window { position: absolute; z-index: 6; right: 28px; bottom: 34px; font-size: 58px; }

.p2-unit-three-recap .recap-core { grid-template-columns: 1fr 1fr; gap: 7px; }
.p2-unit-three-recap .recap-core strong { min-width: 100px; padding: 11px 8px; font-size: 14px; }
.p2-unit-three-recap .orbit { font-size: 11px; }
.p2-unit-three-recap .orbit-1 { top: 7px; left: 12px; }
.p2-unit-three-recap .orbit-2 { top: 7px; right: 13px; }
.p2-unit-three-recap .orbit-3 { top: 70px; left: 4px; }
.p2-unit-three-recap .orbit-4 { top: 70px; right: 0; }
.p2-unit-three-recap .orbit-5 { top: auto; bottom: 62px; left: 2px; }
.p2-unit-three-recap .orbit-6 { top: auto; right: 7px; bottom: 62px; }
.p2-unit-three-recap .orbit-7 { top: auto; bottom: 8px; left: 50%; transform: translateX(-50%); }

.p2-unit-four-scene {
  position: relative;
  width: min(100%, 370px);
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #dfd4c5;
  border-radius: 8px;
  background: #f6eadc;
  box-shadow: 0 12px 28px rgb(69 54 42 / 10%);
}

.p2-unit-four-scene::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: auto 0 0;
  height: 42px;
  background: #bd8b6b;
}

.p2-reluctant-face { position: absolute; z-index: 3; left: 50%; top: 46%; transform: translate(-50%, -50%); font-size: 122px; filter: drop-shadow(0 8px 12px rgb(72 47 32 / 12%)); }
.p2-reluctant-lines { position: absolute; z-index: 2; right: 49px; top: 61px; color: #9d806e; font-size: 62px; transform: rotate(-12deg); }

.p2-trouser-pocket { position: absolute; z-index: 3; left: 50%; bottom: 20px; width: 205px; height: 175px; transform: translateX(-50%); overflow: hidden; border: 7px solid #35577b; border-bottom: 0; border-radius: 25px 25px 0 0; background: #5f86ad; box-shadow: inset 0 0 0 5px rgb(255 255 255 / 10%), 0 10px 20px rgb(35 57 80 / 18%); }
.p2-trouser-pocket::before { content: ""; position: absolute; z-index: 3; left: 42px; top: 45px; width: 112px; height: 105px; border: 6px solid #d4dfeb; border-top-width: 8px; border-radius: 10px 10px 46px 46px; background: #52779c; transform: rotate(-2deg); }
.p2-trouser-pocket::after { content: ""; position: absolute; z-index: 4; left: 38px; top: 39px; width: 121px; height: 16px; border-radius: 8px; background: #d4dfeb; }
.p2-cash-bills { position: absolute; z-index: 2; left: 62px; top: 4px; display: flex; gap: 3px; transform: rotate(-6deg); }
.p2-cash-bills i { width: 58px; height: 86px; display: grid; place-items: center; border: 4px solid #5f886a; border-radius: 5px; background: #b8d69b; color: #3d684a; font-family: Arial, sans-serif; font-size: 31px; font-style: normal; font-weight: 900; box-shadow: inset 0 0 0 5px #dcebc7; }
.p2-cash-bills i + i { margin-left: -29px; margin-top: 6px; transform: rotate(7deg); }
.p2-pocket-ban { position: absolute; z-index: 8; left: 50%; top: 47%; width: 176px; height: 176px; transform: translate(-50%, -50%); border: 14px solid #d95345; border-radius: 50%; box-shadow: 0 5px 14px rgb(149 45 37 / 15%); }
.p2-pocket-ban::after { content: ""; position: absolute; left: 50%; top: 50%; width: 205px; height: 14px; transform: translate(-50%, -50%) rotate(-45deg); border-radius: 9px; background: #d95345; }

.p2-cash-person { position: absolute; z-index: 4; left: 50%; bottom: 28px; transform: translateX(-50%); font-size: 113px; }
.p2-cash-bubble { position: absolute; z-index: 7; top: 15px; right: 36px; width: 130px; height: 82px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 4px solid #fff; border-radius: 34px; background: #fffdf9; box-shadow: 0 6px 15px rgb(54 42 34 / 20%); }
.p2-cash-bubble::after { content: ""; position: absolute; left: 20px; bottom: -17px; border: 10px solid transparent; border-top-color: #fffdf9; transform: rotate(13deg); }
.p2-cash-bubble strong { color: #bd513f; font-family: Arial, sans-serif; font-size: 43px; }
.p2-cash-bubble span { font-size: 41px; }
.p2-pov-hands.cash-question { z-index: 6; bottom: 7px; color: initial; font-size: 44px; }

.p2-desire-heart { position: absolute; z-index: 4; left: 49px; top: 65px; color: #dc5c62; font-family: Arial, sans-serif; font-size: 115px; line-height: 1; filter: drop-shadow(0 7px 10px rgb(152 57 62 / 18%)); }
.p2-desire-bubble { position: absolute; z-index: 4; top: 30px; right: 32px; width: 177px; min-height: 120px; display: grid; grid-template-columns: repeat(2, 1fr); place-items: center; padding: 13px 18px; border: 5px solid #fff; border-radius: 54px; background: #fffdf9; box-shadow: 0 7px 17px rgb(59 43 32 / 16%); font-size: 39px; }
.p2-desire-bubble::after { content: ""; position: absolute; left: -20px; bottom: 27px; width: 24px; height: 24px; border-radius: 50%; background: #fffdf9; box-shadow: -20px 14px 0 -5px #fffdf9; }

.p2-today-calendar { position: absolute; z-index: 5; left: 28px; top: 25px; width: 93px; height: 89px; display: grid; place-items: center; padding-top: 15px; border: 5px solid #bd604b; border-radius: 8px; background: #fffdf9; color: #754538; font-size: 21px; box-shadow: inset 0 19px #d87259, 0 6px 13px rgb(75 51 38 / 13%); }
.p2-today-calendar::before, .p2-today-calendar::after { content: ""; position: absolute; top: -9px; width: 9px; height: 20px; border-radius: 6px; background: #754538; }
.p2-today-calendar::before { left: 19px; }
.p2-today-calendar::after { right: 19px; }
.p2-out-door { position: absolute; z-index: 3; right: 42px; bottom: 21px; font-size: 127px; }
.p2-out-people { position: absolute; z-index: 6; left: 119px; bottom: 42px; font-size: 73px; }
.p2-out-arrow { position: absolute; z-index: 7; right: 103px; bottom: 83px; color: #c45d3b; font-size: 48px; font-weight: 900; }

.p2-night-moon { position: absolute; z-index: 5; left: 50%; top: 7px; transform: translateX(-50%); color: #e6aa39; font-family: Georgia, serif; font-size: 63px; line-height: 1; }
.p2-night-moon.left { left: 31px; top: 18px; transform: none; }
.p2-dinner-option { position: absolute; z-index: 4; bottom: 37px; width: 126px; height: 126px; display: grid; place-items: center; border: 4px solid #dccab7; border-radius: 18px; background: #fffaf3; box-shadow: 0 8px 17px rgb(71 49 33 / 12%); }
.p2-dinner-option.outside { left: 29px; grid-template-rows: 72px 1fr; }
.p2-dinner-option.outside span { font-size: 58px; }
.p2-dinner-option.outside b { margin-top: -9px; color: #81523c; font-size: 18px; }
.p2-dinner-option.home { right: 29px; }
.p2-dinner-option.home span { position: absolute; top: 4px; font-size: 74px; }
.p2-dinner-option.home i { position: absolute; bottom: 5px; right: 7px; font-size: 43px; font-style: normal; }
.p2-choice-slash { position: absolute; z-index: 6; left: 50%; top: 90px; transform: translateX(-50%); color: #bc684e; font-family: Arial, sans-serif; font-size: 70px; font-weight: 900; }

.p2-out-door.restaurant { left: 28px; right: auto; bottom: 18px; font-size: 118px; }
.p2-out-people.restaurant { left: 105px; bottom: 38px; font-size: 62px; }
.p2-out-arrow.restaurant { left: 181px; right: auto; bottom: 80px; font-size: 43px; }
.p2-restaurant-table { position: absolute; z-index: 4; right: 20px; bottom: 34px; width: 116px; height: 133px; display: grid; grid-template-rows: 36px 1fr; place-items: center; border: 7px solid #8d5d43; border-radius: 10px 10px 3px 3px; background: #f4cf9c; box-shadow: inset 0 31px #b75f4d; }
.p2-restaurant-table b { position: relative; z-index: 2; color: #fff7ec; font-size: 15px; }
.p2-restaurant-table span { font-size: 56px; }

.p2-unit-four-recap .recap-core { grid-template-columns: 1fr 1fr; gap: 8px; }
.p2-unit-four-recap .recap-core strong { min-width: 105px; padding: 12px 9px; font-size: 15px; }
.p2-unit-four-recap .orbit { font-size: 12px; }
.p2-unit-four-recap .orbit-1 { top: 8px; left: 10px; }
.p2-unit-four-recap .orbit-2 { top: 8px; right: 12px; }
.p2-unit-four-recap .orbit-3 { top: auto; bottom: 9px; left: 21px; }
.p2-unit-four-recap .orbit-4 { top: auto; right: 17px; bottom: 9px; }

.p2-round-two-scene {
  position: relative;
  width: min(100%, 370px);
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #dfd4c5;
  border-radius: 8px;
  background: #f5eadc;
  box-shadow: 0 12px 28px rgb(69 54 42 / 10%);
}

.r2-floor { position: absolute; z-index: 0; inset: auto 0 0; height: 43px; background: #b98c6c; }
.r2-bubble { position: absolute; z-index: 12; top: 14px; right: 24px; min-width: 105px; height: 73px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 4px 13px; border: 4px solid #fff; border-radius: 31px; background: #fffdf9; box-shadow: 0 6px 15px rgb(54 42 34 / 18%); font-size: 36px; }
.r2-bubble::after { content: ""; position: absolute; left: 20px; bottom: -15px; border: 9px solid transparent; border-top-color: #fffdf9; transform: rotate(12deg); }
.r2-bubble strong { color: #bd513f; font-family: Arial, sans-serif; font-size: 39px; }
.r2-bubble b { color: #714a3a; font-size: 15px; white-space: nowrap; }
.r2-bubble i, .r2-bubble em { font-style: normal; }
.r2-bubble .coins { color: #7d5b18; font-family: Arial, sans-serif; font-size: 23px; font-weight: 900; }
.r2-pov-small { position: absolute; z-index: 9; left: 50%; bottom: 6px; transform: translateX(-50%); font-size: 42px; white-space: nowrap; }

.r2-family { position: absolute; z-index: 4; left: 33px; bottom: 37px; font-size: 95px; }
.r2-family-group { position: absolute; z-index: 5; left: 18px; right: 137px; bottom: 49px; display: flex; justify-content: space-around; font-size: 66px; }
.r2-family-table { position: absolute; z-index: 7; left: 34px; bottom: 24px; width: 178px; height: 51px; display: grid; place-items: start center; padding-top: 5px; border-radius: 50% 50% 6px 6px; background: #9c694a; box-shadow: inset 0 7px #be8a68; font-size: 30px; }
.r2-sofa { position: absolute; z-index: 2; left: 24px; bottom: 29px; color: #9b654b; font-size: 145px; line-height: .5; transform: scaleY(1.35); }
.r2-sofa.real { left: 24px; bottom: 37px; width: 164px; height: 72px; border-radius: 22px 22px 8px 8px; background: #a86f58; box-shadow: inset 0 15px #c28a70; }
.r2-partner { position: absolute; z-index: 5; left: 56px; bottom: 32px; font-size: 105px; }
.r2-partner.neutral { font-size: 101px; }
.r2-partner.sofa-person { left: 66px; bottom: 52px; font-size: 82px; }
.r2-no-person { position: absolute; z-index: 5; left: 46px; bottom: 31px; font-size: 108px; }
.r2-watch { position: absolute; z-index: 7; left: 162px; top: 63px; font-size: 60px; }
.r2-watch.small { left: 165px; top: 93px; font-size: 43px; }
.r2-door-exit { position: absolute; z-index: 4; right: 27px; bottom: 25px; font-size: 114px; }
.r2-door-exit i { position: absolute; left: -37px; top: 42px; color: #c45d3b; font-family: Arial, sans-serif; font-size: 44px; font-style: normal; font-weight: 900; }
.r2-door-exit.muted { filter: grayscale(.25); opacity: .68; }
.r2-door-exit.muted i { color: #998779; }
.r2-worker { position: absolute; z-index: 5; left: 48px; bottom: 31px; font-size: 103px; }
.r2-briefcase { position: absolute; z-index: 7; left: 132px; bottom: 42px; font-size: 58px; }

.r2-street { position: absolute; z-index: 0; inset: 0; background: linear-gradient(#b9d9e6 0 56%, #b8b2a7 56% 68%, #62666c 68%); }
.r2-street::after { content: ""; position: absolute; left: 0; right: 0; bottom: 25px; height: 7px; background: repeating-linear-gradient(90deg, #f7e8a9 0 35px, transparent 35px 64px); }
.r2-street i { position: absolute; bottom: 73px; width: 54px; height: 76px; background: #d3a47b; box-shadow: inset 0 20px #9d6750; }
.r2-street i:nth-child(1) { left: 8px; }
.r2-street i:nth-child(2) { left: 75px; height: 104px; }
.r2-street i:nth-child(3) { right: 8px; height: 90px; }
.r2-street-friend { position: absolute; z-index: 6; left: 51px; bottom: 36px; font-size: 103px; }
.r2-phone { position: absolute; z-index: 8; left: 35px; top: 27px; width: 113px; height: 161px; display: grid; grid-template-rows: 53px 1fr; place-items: center; border: 8px solid #343638; border-radius: 21px; background: #eef6ef; box-shadow: 0 8px 14px rgb(31 34 35 / 20%); }
.r2-phone b { color: #287055; font-size: 19px; }
.r2-phone span { font-size: 55px; }
.r2-leave-person { position: absolute; z-index: 7; right: 85px; bottom: 35px; font-size: 86px; }
.r2-leave-arrow { position: absolute; z-index: 8; right: 27px; bottom: 88px; color: #c45d3b; font-size: 47px; font-weight: 900; }

.r2-child { position: absolute; z-index: 6; left: 62px; bottom: 32px; font-size: 104px; }
.r2-child.small { left: auto; right: 29px; bottom: 27px; font-size: 83px; }
.r2-mom-phone { position: absolute; z-index: 6; left: 47px; top: 41px; display: flex; align-items: center; gap: 12px; }
.r2-mom-phone span { font-size: 103px; }
.r2-mom-phone i { font-size: 58px; font-style: normal; }
.r2-soon-lines { position: absolute; z-index: 6; left: 173px; top: 83px; color: #c45d3b; font-size: 61px; font-weight: 900; }

.r2-shop { position: absolute; z-index: 1; left: 18px; right: 18px; bottom: 35px; height: 123px; display: flex; align-items: flex-end; justify-content: space-around; padding: 0 12px 13px; border: 7px solid #855b40; background: #fff4df; font-size: 34px; }
.r2-shop i { position: absolute; left: -7px; right: -7px; top: -27px; height: 29px; background: repeating-linear-gradient(90deg, #d96349 0 28px, #fff6e9 28px 56px); clip-path: polygon(0 0, 100% 0, 95% 100%, 5% 100%); }
.r2-clerk { position: absolute; z-index: 6; left: 45px; bottom: 37px; font-size: 92px; }
.r2-clerk.happy { font-size: 86px; }
.r2-clerk.small { left: auto; right: 34px; bottom: 36px; font-size: 77px; }
.r2-clerk.machine { left: 31px; font-size: 73px; }
.r2-clerk.price { left: 28px; font-size: 78px; }
.r2-counter { position: absolute; z-index: 7; left: 26px; right: 26px; bottom: 28px; height: 33px; border-radius: 8px 8px 2px 2px; background: #9c694a; box-shadow: inset 0 7px #be8a68; }
.r2-two-bags { position: absolute; z-index: 7; left: 50%; top: 54px; transform: translateX(-50%); display: flex; gap: 19px; font-size: 83px; }
.r2-groceries { position: absolute; z-index: 8; left: 50%; bottom: 42px; transform: translateX(-50%); font-size: 30px; white-space: nowrap; }
.r2-two-coins.small { position: absolute; z-index: 9; right: 31px; top: 57px; display: flex; gap: 8px; }
.r2-two-coins.small span, .r2-four-coins span { width: 55px; height: 55px; display: grid; place-items: center; border: 5px double #b57b18; border-radius: 50%; background: #f4c94e; color: #6d4a08; font-family: Arial, sans-serif; font-size: 18px; font-weight: 900; }
.r2-pay-hand { position: absolute; z-index: 9; left: 48px; top: 75px; font-size: 89px; }
.r2-card { position: absolute; z-index: 10; left: 119px; top: 58px; font-size: 66px; transform: rotate(-10deg); }
.r2-pay-arrow { position: absolute; z-index: 9; left: 190px; top: 84px; color: #c45d3b; font-size: 51px; font-weight: 900; }
.r2-pay-hand.large { left: 55px; top: 70px; font-size: 98px; }
.r2-card.large { left: 130px; top: 54px; font-size: 73px; }
.r2-pay-arrow.large { left: 211px; top: 82px; }
.r2-door-side { position: absolute; z-index: 3; right: 24px; bottom: 25px; font-size: 112px; }
.r2-window { position: absolute; z-index: 3; top: 23px; right: 25px; width: 161px; height: 139px; overflow: hidden; border: 9px solid #79543e; background: #9dd0e7; }
.r2-window::before { content: ""; position: absolute; inset: 0 50% 0 auto; width: 7px; background: #79543e; }
.r2-window::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 7px; background: #79543e; }
.r2-window.rain { left: 27px; right: auto; }
.r2-window.rain span { position: relative; z-index: 2; display: inline-block; margin: 20px 8px 0; color: #3b8fbd; font-size: 29px; }
.r2-umbrella { position: absolute; z-index: 7; left: 158px; bottom: 25px; font-size: 100px; }
.r2-fridge { position: absolute; z-index: 4; left: 50%; bottom: 24px; width: 154px; height: 178px; transform: translateX(-50%); border: 8px solid #87979d; border-radius: 10px; background: #dce7e8; box-shadow: 0 8px 17px rgb(49 66 69 / 15%); }
.r2-fridge.open::after { content: ""; position: absolute; left: 17px; right: 17px; top: 66px; height: 6px; background: #9aabaf; box-shadow: 0 50px #9aabaf; }
.r2-fridge.open i, .r2-fridge.open span, .r2-fridge.open b { position: absolute; left: 25px; right: 25px; height: 4px; background: #bac9cc; }
.r2-fridge.open i { top: 38px; }
.r2-fridge.open span { top: 92px; }
.r2-fridge.open b { top: 142px; }
.r2-empty-mark { position: absolute; z-index: 8; left: 50%; top: 48%; transform: translate(-50%, -50%); color: #9a7770; font-size: 29px; font-weight: 900; }

.r2-water-pair { position: absolute; z-index: 8; left: 50%; top: 37px; transform: translateX(-50%); display: flex; gap: 22px; }
.r2-water-pair i { width: 58px; height: 126px; border: 5px solid #75abc1; border-radius: 15px 15px 22px 22px; background: linear-gradient(90deg, #dff6ff, #fff 55%, #c9ecf8); box-shadow: inset 0 -18px #94cee4; }
.r2-water-pair i::before { content: ""; position: absolute; width: 28px; height: 17px; margin: -17px 0 0 10px; border-radius: 5px; background: #3c8eb3; }
.r2-need-hands { position: absolute; z-index: 9; left: 50%; bottom: 15px; transform: translateX(-50%); font-size: 59px; }
.r2-point-machine { position: absolute; z-index: 9; left: 132px; top: 89px; font-size: 43px; }
.r2-machine { position: absolute; z-index: 6; right: 22px; bottom: 31px; width: 126px; height: 164px; display: grid; grid-template-columns: repeat(2, 1fr); place-items: center; padding: 14px 9px 25px; border: 8px solid #526963; border-radius: 8px; background: #cfe4e6; box-shadow: inset 0 -19px #526963; font-size: 29px; }
.r2-four-coins { position: absolute; z-index: 10; right: 22px; top: 50px; width: 137px; display: grid; grid-template-columns: repeat(2, 55px); gap: 8px; }

.r2-bar-bg { position: absolute; inset: 0; background: linear-gradient(#27394a 0 65%, #8c5b43 65%); }
.r2-bar-bg::after { content: ""; position: absolute; left: 25px; right: 25px; top: 22px; height: 73px; background: radial-gradient(circle at 15% 25%, #f5d76e 0 3px, transparent 4px), radial-gradient(circle at 70% 45%, #f5d76e 0 3px, transparent 4px); }
.r2-bar-friends { position: absolute; z-index: 5; left: 42px; right: 42px; bottom: 39px; display: flex; justify-content: space-between; font-size: 86px; }
.r2-bar-table-small { position: absolute; z-index: 7; left: 50%; bottom: 23px; width: 188px; height: 55px; transform: translateX(-50%); display: grid; place-items: start center; padding-top: 7px; border-radius: 50% 50% 7px 7px; background: #a56d4c; font-size: 31px; }
.r2-think-no { position: absolute; z-index: 4; left: 48px; top: 62px; font-size: 101px; }
.r2-leo-card { position: absolute; z-index: 5; right: 39px; top: 40px; width: 126px; height: 140px; display: grid; grid-template-rows: 83px 1fr; place-items: center; border: 5px solid #d6c7b6; border-radius: 13px; background: #fffdf9; }
.r2-leo-card span { font-size: 73px; }
.r2-leo-card b { font-family: Arial, sans-serif; font-size: 16px; }
.r2-leo-card i { position: absolute; inset: 38px auto auto 37px; color: #d65348; font-family: Arial, sans-serif; font-size: 76px; font-style: normal; font-weight: 900; }

.r2-big-check { position: absolute; z-index: 8; left: 45px; top: 72px; width: 94px; height: 94px; display: grid; place-items: center; border-radius: 50%; background: #3e7864; color: #fff; font-family: Arial, sans-serif; font-size: 68px; font-weight: 900; }
.r2-big-check.tiny { left: 22px; top: 126px; width: 64px; height: 64px; font-size: 46px; }
.r2-big-check.airport { left: auto; right: 21px; top: 136px; }
.r2-window.dragonflies, .r2-window.clouds { right: 22px; top: 25px; width: 194px; height: 151px; background: linear-gradient(#879fab, #d1e0e4 70%, #87a96c); }
.r2-window.dragonflies .fly { position: relative; z-index: 2; display: inline-block; width: 31px; height: 7px; margin: 35px 11px 18px; border-radius: 50%; background: #334d52; transform: rotate(-18deg); }
.r2-window.dragonflies .fly::before, .r2-window.dragonflies .fly::after { content: ""; position: absolute; left: 7px; width: 17px; height: 10px; border: 2px solid #587f86; border-radius: 70% 20% 70% 20%; background: rgb(210 236 239 / 75%); }
.r2-window.dragonflies .fly::before { top: -10px; transform: rotate(20deg); }
.r2-window.dragonflies .fly::after { bottom: -10px; transform: rotate(-20deg); }
.r2-window.dragonflies .fly:nth-child(2) { margin-top: 57px; transform: rotate(12deg); }
.r2-window.dragonflies .fly:nth-child(3) { margin-top: 24px; transform: rotate(-5deg); }
.r2-window.dragonflies i { position: relative; z-index: 2; margin: 5px; color: #3b8fbd; font-style: normal; }
.r2-window.clouds { display: grid; grid-template-columns: repeat(2, 1fr); place-items: center; font-size: 48px; }
.r2-look-hand { position: absolute; z-index: 9; left: 126px; bottom: 35px; font-size: 55px; }
.r2-thinker-small { position: absolute; z-index: 7; left: 19px; top: 50px; font-size: 78px; }

.r2-airport { position: absolute; inset: 0; background: linear-gradient(#d9e4e8 0 62%, #7a858b 62%); }
.r2-airport i { position: absolute; bottom: 35px; width: 82px; height: 47px; border-radius: 22px 22px 4px 4px; background: #4d6875; }
.r2-airport i:first-child { left: 24px; }
.r2-airport i:last-child { right: 24px; }
.r2-traveler { position: absolute; z-index: 5; left: 58px; bottom: 39px; font-size: 90px; }
.r2-airport-window { position: absolute; z-index: 3; left: 25px; right: 25px; top: 20px; height: 143px; overflow: hidden; border: 9px solid #576a72; background: linear-gradient(#94c6dc, #dcecf1 73%, #777f83 73%); }
.r2-airport-window span { position: absolute; z-index: 3; left: 81px; bottom: 15px; font-size: 82px; transform: rotate(-4deg); }
.r2-airport-window i { position: absolute; left: 31px; right: 31px; bottom: 28px; height: 8px; background: #4c5559; }
.r2-airport-window b { position: absolute; right: 27px; bottom: 18px; width: 70px; height: 18px; border-radius: 3px; background: #667276; }
.r2-gate { position: absolute; z-index: 5; left: 31px; bottom: 26px; padding: 8px 13px; border-radius: 5px; background: #385466; color: #fff; font-size: 16px; font-weight: 800; }

.r2-coin-pocket { position: absolute; z-index: 4; left: 50%; bottom: 21px; width: 197px; height: 166px; transform: translateX(-50%); overflow: hidden; border: 7px solid #35577b; border-bottom: 0; border-radius: 25px 25px 0 0; background: #5f86ad; }
.r2-coin-pocket::before { content: ""; position: absolute; left: 38px; top: 51px; width: 111px; height: 100px; border: 6px solid #d4dfeb; border-radius: 10px 10px 44px 44px; background: #52779c; }
.r2-coin-pocket span { position: relative; z-index: 4; width: 59px; height: 59px; display: grid; place-items: center; margin: 7px 0 0 48px; border: 5px double #b57b18; border-radius: 50%; background: #f4c94e; color: #6d4a08; font-family: Arial, sans-serif; font-size: 18px; font-weight: 900; }
.r2-coin-pocket span + span { position: absolute; left: 57px; top: 17px; }
.r2-pocket-ban, .r2-card-ban, .r2-food-ban { position: absolute; z-index: 11; left: 50%; top: 48%; width: 166px; height: 166px; transform: translate(-50%, -50%); border: 13px solid #d95345; border-radius: 50%; }
.r2-pocket-ban::after, .r2-card-ban::after, .r2-food-ban::after { content: ""; position: absolute; left: 50%; top: 50%; width: 194px; height: 13px; transform: translate(-50%, -50%) rotate(-45deg); border-radius: 8px; background: #d95345; }
.r2-reluctant-small { position: absolute; z-index: 13; left: 22px; top: 30px; font-size: 69px; }
.r2-reluctant-small.right { left: auto; right: 16px; }

.r2-restaurant-card { position: absolute; z-index: 5; left: 50%; top: 30px; width: 170px; height: 160px; transform: translateX(-50%); display: grid; grid-template-columns: 1fr 1fr; place-items: center; border: 7px solid #8d5d43; border-radius: 10px; background: #f4cf9c; box-shadow: inset 0 37px #b75f4d; }
.r2-restaurant-card span { color: #f5d675; font-size: 47px; }
.r2-restaurant-card i { font-size: 58px; font-style: normal; }
.r2-restaurant-card b { grid-column: 1 / 3; color: #74432f; font-size: 20px; }
.r2-card-ban { width: 174px; height: 174px; }
.r2-home-table { position: absolute; z-index: 4; left: 50%; top: 33px; width: 190px; height: 159px; transform: translateX(-50%); display: grid; place-items: center; }
.r2-home-table span { font-size: 130px; }
.r2-home-table i { position: absolute; right: 10px; bottom: 0; font-size: 60px; font-style: normal; }
.r2-big-check.home-check { left: auto; right: 23px; top: 32px; width: 67px; height: 67px; font-size: 49px; }

.r2-breakfast-foods, .r2-ingredients { position: absolute; z-index: 5; left: 50%; top: 71px; transform: translateX(-50%); display: flex; gap: 22px; font-size: 67px; }
.r2-food-ban { width: 205px; height: 150px; border-radius: 44px; }
.r2-ingredients { top: 69px; gap: 9px; font-size: 50px; }
.r2-food-ban.ingredients-ban { width: 210px; height: 137px; }
.r2-door-exit.dinner { right: 15px; bottom: 18px; font-size: 92px; }
.r2-heart-small { position: absolute; z-index: 4; left: 43px; top: 65px; color: #dc5c62; font-family: Arial, sans-serif; font-size: 103px; }
.r2-fruit-pile, .r2-lunch-food { position: absolute; z-index: 5; right: 34px; top: 76px; font-size: 57px; white-space: nowrap; }
.r2-lunch-food { right: 28px; top: 80px; font-size: 63px; }
.r2-juicer { position: absolute; z-index: 5; left: 50%; top: 33px; width: 143px; height: 162px; transform: translateX(-50%); border: 8px solid #7d8c91; border-radius: 15px; background: #dfe7e8; box-shadow: inset 0 44px #93a4a9; }
.r2-juicer::before { content: ""; position: absolute; left: 32px; right: 32px; bottom: 13px; height: 53px; border-radius: 6px 6px 20px 20px; background: #efb245; }
.r2-juicer span { position: absolute; z-index: 3; left: 39px; top: -20px; font-size: 62px; }
.r2-juicer i { position: absolute; z-index: 3; right: 12px; bottom: 2px; font-size: 41px; font-style: normal; }
.r2-juicer.mini { left: auto; right: 25px; top: 103px; width: 67px; height: 83px; transform: none; border-width: 5px; }
.r2-juicer.mini span { left: 12px; top: -20px; font-size: 42px; }
.r2-card-ban.juicer-ban { width: 170px; height: 170px; }

.p2-round-three-dialog-scene {
  position: relative;
  width: min(100%, 370px);
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #dfd4c5;
  border-radius: 8px;
  background: #f5eadc;
  box-shadow: 0 12px 28px rgb(69 54 42 / 10%);
}

.r3-bubble { max-width: 170px; }
.r3-family-small { position: absolute; z-index: 5; left: 27px; bottom: 52px; font-size: 87px; }
.r3-dinner-small { position: absolute; z-index: 7; left: 39px; bottom: 28px; width: 154px; height: 46px; display: grid; place-items: start center; padding-top: 5px; border-radius: 50% 50% 6px 6px; background: #9c694a; font-size: 27px; }
.r3-morning-clock { position: absolute; z-index: 6; left: 28px; top: 38px; width: 113px; height: 113px; display: grid; grid-template-rows: 41px 1fr; place-items: center; border: 7px solid #c5744e; border-radius: 50%; background: #fffaf2; color: #744333; box-shadow: 0 7px 15px rgb(85 53 35 / 15%); }
.r3-morning-clock b { padding-top: 8px; font-size: 19px; }
.r3-morning-clock span { font-family: Arial, sans-serif; font-size: 24px; font-weight: 900; }
.r3-walking { position: absolute; z-index: 7; left: 145px; bottom: 38px; font-size: 75px; }
.r3-fruit-shop { position: absolute; z-index: 3; left: 26px; right: 26px; bottom: 35px; height: 130px; display: flex; align-items: flex-end; justify-content: space-evenly; padding: 0 13px 17px; border: 8px solid #865a3d; background: #fff4df; font-size: 45px; }
.r3-fruit-shop i { position: absolute; left: -8px; right: -8px; top: -29px; height: 31px; background: repeating-linear-gradient(90deg, #d96349 0 27px, #fff6e9 27px 54px); clip-path: polygon(0 0, 100% 0, 94% 100%, 6% 100%); }
.r3-shopping-person { position: absolute; z-index: 7; left: 37px; bottom: 26px; font-size: 68px; }
.r3-basket { position: absolute; z-index: 8; left: 97px; bottom: 30px; font-size: 51px; }

.r3-no-gesture { position: absolute; z-index: 8; left: 38px; bottom: 35px; font-size: 104px; }
.r3-loose-coins { position: absolute; z-index: 8; right: 38px; top: 66px; display: flex; gap: 9px; }
.r3-loose-coins span { width: 67px; height: 67px; display: grid; place-items: center; border: 6px double #b57b18; border-radius: 50%; background: #f4c94e; color: #6d4a08; font-family: Arial, sans-serif; font-size: 21px; font-weight: 900; }
.r3-small-cross { position: absolute; z-index: 10; right: 74px; top: 72px; color: #d65348; font-family: Arial, sans-serif; font-size: 81px; font-weight: 900; }
.r3-ok-check { position: absolute; z-index: 9; left: 112px; top: 49px; width: 53px; height: 53px; display: grid; place-items: center; border-radius: 50%; background: #3e7864; color: #fff; font-family: Arial, sans-serif; font-size: 38px; font-weight: 900; }

.r3-person-card { position: absolute; z-index: 5; right: 45px; top: 40px; width: 125px; height: 142px; display: grid; grid-template-rows: 91px 1fr; place-items: center; border: 5px solid #d6c7b6; border-radius: 13px; background: #fffdf9; }
.r3-person-card span { font-size: 79px; }
.r3-person-card b { font-family: Arial, sans-serif; font-size: 15px; }
.r3-house-large { position: absolute; z-index: 3; left: 50%; top: 37px; transform: translateX(-50%); font-size: 150px; }
.r3-juan-home { position: absolute; z-index: 6; left: 50%; bottom: 26px; transform: translateX(-50%); font-size: 70px; }
.r3-location-pin { position: absolute; z-index: 7; right: 55px; top: 34px; font-size: 55px; }
.r3-home-office { position: absolute; inset: 19px 26px 24px; display: grid; place-items: center; }
.r3-home-office > span { position: absolute; z-index: 1; font-size: 178px; }
.r3-home-office > div { position: relative; z-index: 4; margin-top: 44px; font-size: 80px; }
.r3-home-office > i { position: absolute; z-index: 5; right: 65px; bottom: 24px; font-size: 48px; font-style: normal; }

.r3-night { position: absolute; inset: 0; background: linear-gradient(#26394c 0 67%, #555b61 67%); }
.r3-night::after { content: ""; position: absolute; inset: 16px 20px auto; height: 72px; background: radial-gradient(circle at 10% 30%, #f3d872 0 3px, transparent 4px), radial-gradient(circle at 64% 22%, #f3d872 0 3px, transparent 4px), radial-gradient(circle at 86% 58%, #f3d872 0 3px, transparent 4px); }
.r3-bus-stop { position: absolute; z-index: 3; right: 26px; bottom: 34px; width: 115px; height: 127px; border: 8px solid #4a5960; border-bottom: 0; background: rgb(188 212 218 / 35%); }
.r3-bus-stop span { position: absolute; left: -62px; top: 7px; font-size: 64px; }
.r3-tired-friends { position: absolute; z-index: 7; left: 30px; bottom: 41px; display: flex; gap: 13px; font-size: 72px; }
.r3-last-bus-card { position: absolute; z-index: 7; right: 29px; top: 41px; width: 157px; height: 128px; display: grid; grid-template-rows: 33px 1fr; place-items: center; border: 5px solid #f4e5ca; border-radius: 12px; background: #fff7e8; }
.r3-last-bus-card b { color: #b34e3c; font-size: 19px; }
.r3-last-bus-card span { font-size: 73px; }
.r3-last-bus-card i { position: absolute; inset: 40px auto auto 49px; color: #d65348; font-family: Arial, sans-serif; font-size: 72px; font-style: normal; font-weight: 900; }
.r3-excited-friend { position: absolute; z-index: 6; left: 32px; bottom: 42px; font-size: 97px; }
.r3-point-bus { position: absolute; z-index: 8; left: 115px; bottom: 69px; font-size: 56px; }
.r3-far-bus { position: absolute; z-index: 6; right: 39px; bottom: 40px; font-size: 89px; }
.r3-far-bus.card-bus { right: 24px; bottom: 35px; font-size: 78px; }
.r3-shine { position: absolute; z-index: 8; right: 44px; top: 29px; color: #f2cc54; font-size: 58px; }
.r3-arrived-bus { position: absolute; z-index: 5; right: 24px; bottom: 34px; font-size: 113px; }
.r3-happy-tired { position: absolute; z-index: 7; left: 24px; top: 65px; display: flex; align-items: center; gap: 5px; font-size: 61px; }
.r3-happy-tired i { color: #f2d78b; font-family: Arial, sans-serif; font-size: 34px; font-style: normal; }
.r3-tired-partner { position: absolute; z-index: 5; left: 54px; bottom: 42px; font-size: 97px; }
.r3-paella { position: absolute; z-index: 5; right: 43px; top: 55px; font-size: 117px; }
.r3-food-shine { position: absolute; z-index: 6; right: 40px; top: 28px; color: #e3a936; font-size: 49px; }

.r3-help-person { position: absolute; z-index: 7; left: 61px; bottom: 36px; font-size: 101px; }
.r3-help-hands { position: absolute; z-index: 8; left: 137px; bottom: 52px; font-size: 65px; }
.r3-help-mark { position: absolute; z-index: 8; right: 61px; top: 51px; color: #c55543; font-family: Arial, sans-serif; font-size: 96px; font-weight: 900; }
.r3-smile-big { position: absolute; z-index: 4; left: 58px; top: 63px; font-size: 104px; }
.round-three-07-no-problem .r3-smile-big { left: 42px; }
.round-three-07-no-problem .r2-big-check { left: auto; right: 49px; }
.r3-shopping-item { position: absolute; z-index: 8; right: 35px; bottom: 32px; font-size: 69px; }
.r3-point-door { position: absolute; z-index: 9; left: 139px; bottom: 67px; font-size: 55px; }
.r3-card-check { position: absolute; z-index: 13; right: 19px; top: 37px; width: 105px; height: 102px; display: grid; place-items: center; }
.r3-card-check span { font-size: 70px; }
.r3-card-check i { position: absolute; right: -2px; top: -1px; width: 43px; height: 43px; display: grid; place-items: center; border-radius: 50%; background: #3e7864; color: #fff; font-family: Arial, sans-serif; font-size: 30px; font-style: normal; font-weight: 900; }

.r3-food-phone { position: absolute; z-index: 5; left: 50%; top: 23px; width: 176px; height: 183px; transform: translateX(-50%); display: grid; grid-template-rows: 45px 1fr; place-items: center; border: 8px solid #35383a; border-radius: 24px; background: #f5faf7; box-shadow: 0 8px 17px rgb(33 37 38 / 20%); }
.r3-food-phone b { color: #497164; font-size: 18px; }
.r3-food-phone > div { display: flex; gap: 19px; font-size: 57px; }
.r3-food-phone strong { position: absolute; right: -50px; top: 55px; color: #c55543; font-family: Arial, sans-serif; font-size: 66px; }
.r3-food-phone.selected span { position: relative; padding: 8px; border: 4px solid transparent; border-radius: 12px; }
.r3-food-phone.selected span:first-child { border-color: #3e7864; background: #dff1e8; }
.r3-food-phone.selected span i { position: absolute; right: -7px; top: -12px; width: 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; background: #3e7864; color: #fff; font-family: Arial, sans-serif; font-size: 25px; font-style: normal; font-weight: 900; }
.r3-strawberry-choice { position: absolute; z-index: 5; left: 35px; top: 57px; width: 113px; height: 113px; display: grid; place-items: center; border: 5px solid #3e7864; border-radius: 17px; background: #eef8f3; }
.r3-strawberry-choice span { font-size: 72px; }
.r3-strawberry-choice i { position: absolute; right: -10px; top: -13px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #3e7864; color: #fff; font-family: Arial, sans-serif; font-size: 30px; font-style: normal; font-weight: 900; }
.r3-plus-food { position: absolute; z-index: 6; left: 165px; top: 93px; color: #936343; font-family: Arial, sans-serif; font-size: 52px; font-weight: 900; }
.r3-bread { position: absolute; z-index: 5; right: 39px; top: 69px; font-size: 91px; }

.phase-two-shell .audio-fallback {
  margin-top: 12px;
}

.phase-two-shell .audio-fallback audio {
  width: 100%;
}

@media (max-width: 560px) {
  .local-preview-badge { align-self: flex-start; }
  .phase-two-scene { padding: 14px; }
  .phase-two-scene-card { min-height: 190px; padding: 20px; }
  .phase-two-scene-emoji { font-size: 62px; }
}