#screen-couple {
  --couple-ink: #315968;
  --couple-accent: #ed8f4f;
  display: none;
  padding: 16px 18px calc(104px + var(--sa-bottom)) !important;
  color: var(--couple-ink);
  background: linear-gradient(#b7e7ff 0%, #e8f9ef 59%, #fff9e8 100%);
}
#screen-couple.active { display: flex; }
#screen-couple .couple-role-gate[hidden],
#screen-couple .couple-role-confirm-panel[hidden] { display: none; }
#screen-couple #couple-leave[hidden] { display: none; }
#screen-couple .couple-role-gate { position: fixed; z-index: 210; inset: 0; display: grid; place-items: center; padding: 18px; background: #214e68d9; }
#screen-couple .couple-role-card { width: min(100%, 390px); max-height: calc(100dvh - 36px); overflow-y: auto; padding: 20px 18px 16px; border: 3px solid #fff7e5; border-radius: 25px; background: linear-gradient(155deg,#fffdf4,#e8f8f1); box-shadow: 0 15px 35px #1b4d6070, inset 0 0 0 2px #e9ca9b; text-align: center; }
#screen-couple .couple-role-mark { display: block; color: #ed86a3; font: 900 35px/1 Arial,sans-serif; }
#screen-couple .couple-role-card h2 { margin: 5px 0 7px; color: #315968; font-size: 21px; }
#screen-couple .couple-role-card p { margin: 0 0 12px; font-size: 12px; line-height: 1.45; }
#screen-couple .couple-role-choices { display: grid; gap: 9px; }
#screen-couple .couple-role-choices button { min-height: 51px; border: 2px solid #e5cfab; border-radius: 15px; background: linear-gradient(#fff9e9,#f5e9ca); box-shadow: 0 3px 0 #d3b483; color: #755a38; font: 800 15px var(--font-bangla); }
#screen-couple .couple-role-choices button:last-child { border-color: #d9c6e8; background: linear-gradient(#fcf8ff,#eee4f8); box-shadow: 0 3px 0 #bea6d2; color: #73518d; }
#screen-couple .couple-role-choices button.is-selected { outline: 3px solid #15b784; outline-offset: 2px; }
#screen-couple .couple-role-note { margin: 13px 0 !important; color: #54716d; }
#screen-couple .couple-role-confirm-panel { margin: 10px 0; padding: 12px; border: 1px solid #a8d7c5; border-radius: 15px; background: #e2f8eb; }
#screen-couple .couple-role-confirm-panel strong { display: block; margin-bottom: 10px; font-size: 12px; line-height: 1.45; }
#screen-couple .couple-role-confirm-panel button { min-height: 39px; margin: 0 3px; padding: 5px 10px; border: 0; border-radius: 10px; background: #0fa77a; color: white; font: 800 12px var(--font-bangla); }
#screen-couple .couple-role-confirm-panel button:last-child { background: #8c9a95; }
#screen-couple .couple-role-error { min-height: 0; color: #ad344a; }
#screen-couple .couple-role-later { padding: 5px 12px; border: 0; background: transparent; color: #64837c; text-decoration: underline; font: 700 12px var(--font-bangla); }
#screen-couple.join-input-focused {
  padding-bottom: calc(104px + var(--sa-bottom) + var(--join-keyboard-space, 260px)) !important;
}
#screen-couple #shared-topbar { flex: 0 0 auto; margin-bottom: 18px; }
#screen-couple .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
#screen-couple .couple-top { display: flex; align-items: center; gap: 11px; margin: 0 0 2px; }
#screen-couple .couple-top button { width: 42px; height: 42px; border: 1px solid #bfe5db; background: #ffffffed; color: #149e7e; font: 800 29px/1 Arial, sans-serif; }
#screen-couple .couple-top h1 { margin: 0; font-size: 20px; color: #28546a; }
#screen-couple .couple-two-badge { margin-left: auto; white-space: nowrap; padding: 5px 10px; border-radius: 20px; background: #fff9ed; border: 1px solid #edd6ab; color: #9e692e; font-size: 11px; font-weight: 800; }
#screen-couple .couple-hero { padding: 0; margin: 0 0 12px; border: 0; background: transparent; text-align: center; }
#screen-couple .couple-hero img { display: block; width: min(100%, 390px); height: clamp(280px, 40vh, 390px); margin: 0 auto; object-fit: contain; filter: drop-shadow(0 9px 13px #426a6824); }
#screen-couple .couple-hero h2,
#screen-couple .couple-session-hero h2 { margin: -4px 0 0; color: #325a49; font-size: clamp(18px, 5.6vw, 23px); line-height: 1.3; }
#screen-couple .couple-hero-line { display: block; width: 55px; height: 5px; margin: 6px auto 0; border-radius: 9px; background: #f2a66c; }
#screen-couple .couple-entry-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#screen-couple .couple-choice { display: flex; flex-direction: column; justify-content: center; align-items: center; min-width: 0; min-height: 152px; padding: 7px 3px; border: 2px solid #ebd8b8; border-radius: 22px; background: linear-gradient(#fffefa, #fff3dd); box-shadow: 0 5px 0 #cbb383, 0 10px 16px #657b5b19; color: #a16232; }
#screen-couple .couple-choice--join { color: #7453a6; border-color: #dfccef; background: linear-gradient(#fefaff, #f5ecff); box-shadow: 0 5px 0 #bea9d9, 0 10px 16px #68528819; }
#screen-couple .couple-choice img { width: min(103px, 70%); height: 104px; object-fit: contain; filter: drop-shadow(0 4px 5px #59624d20); }
#screen-couple .couple-choice strong { display: block; font-size: clamp(12px, 3.9vw, 16px); line-height: 1.3; white-space: nowrap; }
#screen-couple .couple-choice:active { transform: translateY(3px); box-shadow: 0 2px 0 #cbb383; }
#screen-couple .couple-join-box { margin: 13px 0 0; padding: 10px 12px 12px; border: 2px solid #d9c7ed; border-radius: 18px; background: linear-gradient(140deg,#fffefa,#f7efff); box-shadow: 0 5px 0 #bfaed7, 0 9px 20px #7452a51f; }
#screen-couple .couple-join-box[hidden] { display: none; }
#screen-couple .couple-join-box label { display: block; margin: 0 0 6px; font-size: 12px; font-weight: 800; color: #67469c; }
#screen-couple .couple-code-entry { display: flex; gap: 7px; }
#screen-couple #couple-code-input { flex: 1; min-width: 0; height: 45px; border: 2px solid #d7c4e9; border-radius: 12px; text-align: center; padding: 4px 8px; background: #fff; color: #44336e; font: 800 17px var(--font-english); letter-spacing: 2px; }
#screen-couple #couple-code-input::placeholder { color: #9888ad; letter-spacing: 0; font: 700 12px var(--font-bangla); }
#screen-couple #couple-code-input:focus-visible { outline: 3px solid #a57ddd; outline-offset: 1px; }
#screen-couple #couple-join { flex: 0 0 auto; min-width: 89px; padding: 0 9px; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(#9471d4,#7052ad); box-shadow: 0 3px 0 #543a88; font: 800 12px var(--font-bangla); cursor: pointer; }
#screen-couple .couple-steps { display: flex; align-items: center; justify-content: space-between; gap: 4px; margin: 20px 2px 16px; }
#screen-couple .couple-steps span { width: 78px; display: grid; justify-items: center; align-content: center; width: 67px; height: 50px; border: 2px solid #fff; border-radius: 17px; background: #ffffffd8; box-shadow: 0 4px 0 #d2e6d6; color: #178e72; font: 800 24px/1 Arial; }
#screen-couple .couple-steps small { display: block; margin-top: 3px; color: #476f75; font: 800 9px/1.3 var(--font-bangla); white-space: nowrap; }
#screen-couple .couple-steps i { flex: 1; height: 3px; background: repeating-linear-gradient(90deg,#7bcdb0 0 6px,transparent 6px 11px); }
#screen-couple .couple-facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 0 0 12px; }
#screen-couple .couple-facts span { border: 1px solid #eddcbb; border-radius: 18px; background: #fffaf1d6; padding: 4px 8px; color: #826b4a; font-size: 10px; font-weight: 800; white-space: nowrap; }
#screen-couple #couple-status { min-height: 20px; padding: 3px 0; margin: 3px 0; text-align: center; font-size: 11px; color: #657c77; }
#screen-couple .couple-session-hero { text-align: center; margin: 0 0 11px; }
#screen-couple .couple-session-hero img { display: block; width: 67%; height: clamp(140px, 24vh, 200px); margin: auto; object-fit: contain; filter: drop-shadow(0 7px 10px #4f685124); }
#screen-couple .couple-room-board,
#screen-couple .couple-topics { display: block; margin: 0 0 13px; padding: 13px; border: 2px solid #ead7b4; border-radius: 22px; background: #fffdf6; box-shadow: 0 5px 0 #cdb689; }
#screen-couple .couple-room-label { display: block; text-align: center; font-size: 12px; font-weight: 800; }
#screen-couple #couple-room-code { display: block; margin: 8px 0 12px; padding: 8px 6px; border: 2px dashed #dcb468; border-radius: 14px; background: #fff6dd; color: #905b32; text-align: center; font: 900 28px/1.35 var(--font-english); letter-spacing: 5px; }
#screen-couple #couple-share { width: 100%; min-height: 43px; border: 0; border-radius: 13px; background: #fff0da; color: #b46132; font-size: 14px; font-weight: 800; }
#screen-couple #couple-share-fallback { margin: 9px 0 0; padding: 10px; border: 1px solid #dfc9a8; border-radius: 13px; background: #fffaf0; text-align: left; }
#screen-couple #couple-share-fallback[hidden] { display: none; }
#screen-couple #couple-share-fallback label { display: block; margin-bottom: 5px; font-size: 11px; color: #715c4b; }
#screen-couple #couple-invite-link { width: 100%; height: 38px; padding: 5px 9px; border: 1px solid #d6bfa0; border-radius: 9px; background: white; color: #315968; font: 12px var(--font-english); user-select: text; -webkit-user-select: text; }
#screen-couple .couple-share-actions { display: flex; gap: 5px; margin-top: 7px; }
#screen-couple .couple-share-actions button { flex: 1 1 0; min-width: 0; min-height: 36px; padding: 4px 2px; border: 0; border-radius: 9px; color: white; font: 700 10px var(--font-bangla); }
#screen-couple #couple-share-whatsapp { background: #18a45a; }
#screen-couple #couple-share-messenger { background: #168ce0; }
#screen-couple #couple-copy-invite { background: #9171bc; }
#screen-couple #couple-share-feedback { margin: 5px 0 0; font-size: 10px; color: #376b5d; }
#screen-couple .couple-people-graphic { display: flex; justify-content: center; align-items: center; gap: 18px; margin-top: 13px; }
#screen-couple .couple-people-graphic span { width: 49px; height: 49px; display: grid; place-items: center; border: 3px solid #fff; border-radius: 50%; background: #ffcd96; box-shadow: 0 3px 5px #758d7d2b; font-size: 22px; }
#screen-couple .couple-people-graphic span:last-child { background: #ebebe8; color: #9caba8; border-style: dashed; }
#screen-couple .couple-people-graphic i { color: #e89a6e; font: normal 24px Arial; }
#screen-couple #couple-people { margin: 5px 0 0; text-align: center; font-size: 11px; color: #667d7d; }
#screen-couple #couple-progress { display: none; }
#screen-couple .couple-topics legend { padding: 0 5px; color: #315968; font-size: 17px; font-weight: 800; }
#screen-couple #couple-topic-options { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; }
#screen-couple #couple-topic-options label { position: relative; min-width: 0; min-height: 78px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 5px 2px; border: 2px solid #f1ba8b; border-radius: 16px; background: #fff5e7; color: #b46631; text-align: center; font-size: 10px; font-weight: 800; line-height: 1.25; }
#screen-couple #couple-topic-options label:has(input:checked)::after { content: '✓'; position: absolute; top: -7px; right: -6px; display: grid; place-items: center; width: 21px; height: 21px; border: 2px solid #fff; border-radius: 50%; background: linear-gradient(#44d99b,#0a9b69); color: #fff; box-shadow: 0 2px 5px #316e4966; font: 900 14px/1 Arial,sans-serif; }
#screen-couple #couple-topic-options label:has(input:not(:checked)) { border-color: #e6e6db; background: #fff; color: #7b9090; }
#screen-couple #couple-topic-options label::before { content: attr(data-icon); font: 25px/1.2 Arial, sans-serif; }
#screen-couple #couple-topic-options input { position: absolute; opacity: 0; width: 1px; height: 1px; }
#screen-couple .couple-topic-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; }
#screen-couple #couple-topic-count { margin: 0; font-size: 11px; line-height: 1.35; color: #207d67; font-weight: 700; }
#screen-couple #couple-topic-save { min-height: 35px; padding: 5px 10px; border: 0; border-radius: 11px; background: #efa066; color: #fff; font-size: 11px; font-weight: 800; white-space: nowrap; }
#screen-couple #couple-selected-topics { display: none; }
#screen-couple #couple-content { padding: 14px; border: 2px solid #e9dabd; background: #fffdf8; color: #315968; box-shadow: 0 5px 0 #d2c29f; }
#screen-couple #couple-content h2 { margin: 6px 0 14px; font-size: 20px; }
#screen-couple #couple-content p { font-size: 13px; }
#screen-couple .couple-option { text-align: center; background: #fff8ed; border-color: #edd6b0; }
#screen-couple .couple-primary { background: #efa066; border-color: #d8874b; }
#screen-couple #couple-leave { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 50px; margin: 0 auto 19px; padding: 10px 18px; border: 2px solid #e39c76; border-radius: 16px; background: linear-gradient(180deg,#fff7ed,#ffe5ce); color: #93462e; box-shadow: 0 4px 0 #c58866, 0 8px 14px #875b4930; font-size: 15px; font-weight: 850; cursor: pointer; }
#screen-couple #couple-leave:active { transform: translateY(3px); box-shadow: 0 1px 0 #c58866; }
#screen-couple #couple-leave:focus-visible { outline: 3px solid #176b9a; outline-offset: 3px; }
#screen-couple[data-phase="waiting"] #couple-content { display: none; }
#screen-couple:not([data-phase="waiting"]) .couple-session-hero,
#screen-couple:not([data-phase="waiting"]) .couple-people-graphic,
#screen-couple:not([data-phase="waiting"]) #couple-people,
#screen-couple:not([data-phase="waiting"]) #couple-share { display: none; }
#screen-couple:not([data-phase="waiting"]) .couple-room-board { padding: 7px 12px; }
#screen-couple:not([data-phase="waiting"]) #couple-room-code { display: inline-block; margin: 0 0 0 8px; padding: 2px 6px; font-size: 14px; letter-spacing: 2px; }
#screen-couple:not([data-phase="waiting"]) .couple-room-label { display: inline; font-size: 11px; }
#screen-couple:not([data-phase="waiting"]) #couple-progress { display: block; margin: 8px 0 0; accent-color: #ed9859; }
#screen-couple:not([data-phase="waiting"]) #couple-topics { display: none; }
@media (max-width: 350px) {
  #screen-couple { padding-left: 12px !important; padding-right: 12px !important; }
  #screen-couple .couple-choice { min-height: 138px; }
  #screen-couple .couple-choice img { height: 91px; }
  #screen-couple #couple-topic-options label { min-height: 73px; font-size: 9px; }
}


#screen-couple[data-phase="starting"],
#screen-couple[data-phase="between"],
#screen-couple[data-phase="playing"],
#screen-couple[data-phase="complete"] {
  padding: 0 0 calc(83px + var(--sa-bottom)) !important;
  background: linear-gradient(#b7e7ff, #eaf9f1 58%, #f8f5e7);
  overflow-y: auto;
}
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #shared-topbar {
  z-index: 4;
  width: 100%;
  flex: 0 0 auto;
  margin: 0;
  padding: 12px 17px 9px;
  background: #b8e8fa;
}
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #couple-session { width: 100%; }
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) .couple-room-board,
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #couple-topics,
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #couple-status { display: none !important; }
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #couple-content {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #couple-leave {
  position: absolute;
  z-index: 6;
  left: 18px;
  bottom: calc(90px + var(--sa-bottom));
  width: 43px;
  min-height: 43px;
  margin: 0;
  padding: 7px;
  border: 2px solid #fff;
  border-radius: 13px;
  background: linear-gradient(#fffbf5, #e7eedf);
  color: #417d72;
  box-shadow: 0 4px 8px #5b867853;
}
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #couple-leave span { display: none; }
#screen-couple:is([data-phase="starting"],[data-phase="between"],[data-phase="playing"],[data-phase="complete"]) #couple-leave svg { width: 25px; height: 25px; }
.couple-start { min-height: clamp(480px, calc(100dvh - 205px), 680px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 22px 20px 70px; text-align: center; background: radial-gradient(circle at 50% 44%, #fff9ed 0, #e9f8ee 55%, #bceafb 100%); color: #365b53; }
.couple-start__tree { width: min(68vw, 285px); height: min(31dvh, 235px); object-fit: contain; filter: drop-shadow(0 8px 12px #477b6b45); }
.couple-start h2 { margin: 0; font: 800 clamp(22px, 6vw, 28px)/1.2 'Anek Bangla', var(--font-bangla); }
.couple-start__names { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; max-width: 100%; }
.couple-start__names span { max-width: 44vw; padding: 7px 13px; border: 2px solid #fff; border-radius: 18px; background: #fff9f0e8; box-shadow: 0 4px 10px #66857930; overflow-wrap: anywhere; font-size: 13px; font-weight: 700; }
.couple-start p { margin: 0; font-size: 15px; font-weight: 700; }
.couple-start__clock { width: 70px; height: 70px; display: grid; place-items: center; border: 6px solid #e8869c; border-radius: 50%; background: #fffdf6; box-shadow: 0 0 0 3px #fff, 0 7px 17px #84617540; font: 900 29px/1 var(--font-bangla); color: #b64363; }
.couple-start__button { border: 2px solid #fff; border-radius: 18px; padding: 12px 25px; background: linear-gradient(125deg, #ef7da0, #ce5489); box-shadow: 0 6px 0 #a9366b, 0 9px 20px #b8578040; color: #fff; font: 800 17px/1.2 var(--font-bangla); }
.couple-start__button:disabled { opacity: .6; }
.couple-start__hint { color: #6d827c; font-size: 12px; }
.couple-garden {
  position: relative;
  height: clamp(580px, calc(100dvh - 205px), 700px);
  min-width: 0;
  overflow: hidden;
  background: radial-gradient(ellipse at 8% 25%, #fff8, transparent 35%), linear-gradient(#bceafb, #effaf1 64%, #f8f5e7);
}
.couple-garden--long-options { height: clamp(660px, calc(100dvh - 205px), 740px); }
.couple-garden__heading { position: absolute; z-index: 3; top: 1%; left: 0; right: 0; text-align: center; }
#screen-couple .couple-garden__heading h2 { margin: 0; color: #395e50; font: 800 clamp(20px, 6vw, 24px)/1.2 'Anek Bangla', var(--font-bangla); text-shadow: 0 2px 0 #fff; }
.couple-garden__heading small { display: block; margin-top: -2px; color: #73918c; font-size: 10px; font-weight: 700; }
.couple-garden__clock { position: absolute; z-index: 5; top: 7%; right: 6%; width: 63px; height: 63px; display: grid; place-items: center; border: 6px solid #2398e0; border-radius: 50%; background: #fffdf5; color: #1c5787; box-shadow: 0 0 0 3px #fff, 0 5px 10px #26607866; font: 900 25px/1 var(--font-english); }
.couple-garden__clock::before { content: ''; position: absolute; top: -14px; width: 21px; height: 10px; border: 2px solid #2165b1; border-radius: 7px 7px 2px 2px; background: #ec6486; }
.couple-garden__clock::after { content: ''; position: absolute; inset: 4px; border: 3px solid #f5cc74; border-radius: 50%; pointer-events: none; }
.couple-garden__clock.couple-clock--urgent { border-color: #e35b68; color: #be314a; }
.couple-garden__tree { position: absolute; z-index: 1; top: 9%; left: 20%; width: 60%; height: 31%; object-fit: contain; filter: drop-shadow(0 4px 6px #6e9d7c25); }
.couple-garden__board { position: absolute; z-index: 2; top: 24%; left: 3%; width: 94%; height: 36%; display: grid; place-items: center; border: 1px solid transparent; border-image: url('assets/couple-mode/garden-question-board.webp') 220 330 220 330 fill / 44px 55px / 0 stretch; }
.couple-garden__board strong { width: 76%; color: #3a3d35; font: 800 clamp(15px, 4.2vw, 18px)/1.28 'Anek Bangla', var(--font-bangla); text-align: center; overflow-wrap: anywhere; }
.couple-garden__hint { position: absolute; z-index: 3; top: 61%; left: 5%; right: 5%; color: #6c8a83; text-align: center; font-size: 11px !important; font-weight: 700; }
.couple-garden__choices { position: absolute; z-index: 3; top: 65%; left: 6%; right: 6%; display: grid; gap: 10px; }
#screen-couple .couple-garden__choice { min-height: 59px; display: flex; align-items: center; gap: 13px; padding: 9px 13px; border: 2px solid #dfd5b7; border-radius: 20px; background: linear-gradient(#fffdf9, #fff7e8); box-shadow: 0 5px 0 #d0c59e, 0 8px 14px #38574f25; color: #425b58; font: 750 clamp(13px, 3.8vw, 16px)/1.3 var(--font-bangla); text-align: left; }
.couple-garden__choice span { width: 32px; height: 32px; flex: 0 0 32px; display: grid; place-items: center; border-radius: 50%; background: #e0f2dc; color: #3a9d76; font: bold 17px Arial, sans-serif; }
.couple-garden__choice:focus-visible { outline: 3px solid #238d7a; outline-offset: 2px; }
.couple-garden__waiting { display: grid; place-items: center; min-height: 128px; border: 2px solid #dfd5b7; border-radius: 20px; background: #fffdf9; color: #4d786e; text-align: center; font-size: 14px; font-weight: 800; }
.couple-question-progress { position: absolute; z-index: 2; top: 94%; left: 12%; right: 12%; display: grid; gap: 5px; }
.couple-question-progress__label { color: #507f7a; font-size: 12px; font-weight: 800; }
#screen-couple .couple-question-progress__bar { display: block; width: 100%; height: 13px; margin: 0; border: 2px solid #91d5be; border-radius: 99px; overflow: hidden; background: #fffdf5; }
.couple-question-progress__bar::-webkit-progress-bar { background: #fffdf5; }
.couple-question-progress__bar::-webkit-progress-value { border-radius: 99px; background: linear-gradient(90deg,#78d7b6,#28b98f); }
.couple-question-progress__bar::-moz-progress-bar { border-radius: 99px; background: linear-gradient(90deg,#78d7b6,#28b98f); }
.couple-garden--recap { background: linear-gradient(#bceafb, #eefaf0 55%, #f8f5e7); }
#screen-couple .couple-recap__title { position: absolute; top: 3%; left: 0; right: 0; margin: 0; color: #426f67; text-align: center; font: 900 24px/1.2 'Anek Bangla', var(--font-bangla); }
.couple-recap__subtitle { position: absolute; top: 9%; left: 0; right: 0; color: #779387; text-align: center; font-size: 11px !important; font-weight: 700; }
.couple-recap__tree { position: absolute; top: 11%; left: 36%; width: 28%; height: 21%; object-fit: contain; }
.couple-recap__summary { position: absolute; top: 28%; left: 8%; right: 8%; min-height: 66px; display: flex; align-items: center; justify-content: center; gap: 11px; border: 2px solid #e2d5b7; border-radius: 20px; background: #fff9eadd; box-shadow: 0 5px 0 #d4c9ac; color: #5e7567; }
.couple-recap__summary strong { color: #ec788d; font: 900 27px/1 var(--font-bangla); white-space: nowrap; }
.couple-recap__summary span { white-space: pre-line; font-size: 11px; line-height: 1.2; font-weight: 800; }
.couple-recap__actions { position: absolute; z-index: 3; top: 39%; left: 6%; right: 6%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.couple-recap__actions button { min-width: 0; min-height: 48px; padding: 6px 5px; border: 2px solid #fff; border-radius: 15px; color: #fff; font: 800 clamp(11px, 3.2vw, 14px)/1.2 var(--font-bangla); text-align: center; cursor: pointer; }
.couple-recap__replay { background: linear-gradient(125deg,#ef7da0,#ce5489); box-shadow: 0 4px 0 #ae4372, 0 7px 13px #ad58804a; }
.couple-recap__share { background: linear-gradient(125deg,#61cdb1,#239d90); box-shadow: 0 4px 0 #178579, 0 7px 13px #4a9d8b4a; }
.couple-recap__replay:disabled { opacity: .7; cursor: default; }
.couple-recap__list { position: absolute; top: 49%; left: 6%; right: 6%; bottom: 2%; overflow-y: auto; scrollbar-width: none; overscroll-behavior: contain; }
.couple-recap__list::-webkit-scrollbar { display: none; }
#screen-couple .couple-recap__list h3 { margin: 0 0 7px; color: #476e67; font-size: 15px; }
.couple-recap__item { position: relative; margin-bottom: 9px; padding: 10px 12px; border: 1px solid #e4d6b7; border-radius: 17px; background: #fffbf2ed; box-shadow: 0 3px 0 #d6c8a7; color: #4b6560; }
.couple-recap__item::after { content: '♡'; position: absolute; top: 4px; right: 11px; color: #a2a9a1; font: 900 16px Arial; }
.couple-recap__item.is-match::after { content: '♥'; color: #ee7890; }
.couple-recap__item strong { display: block; max-width: calc(100% - 17px); margin-bottom: 5px; color: #435b55; font-size: 12px; line-height: 1.3; }
.couple-recap__answer { display: flex; justify-content: space-between; gap: 7px; margin-top: 2px; font-size: 10px; line-height: 1.25; }
.couple-recap__answer b { flex: 0 0 42px; }
.couple-recap__answer span { text-align: right; overflow-wrap: anywhere; }