










@font-face { font-family: Inspire; src: url("/releases/c4edfb60b63c/design-inspire-400.ff53cc245f.otf") format("opentype"); font-weight: 400; font-display: swap; }
@font-face { font-family: Inspire; src: url("/releases/c4edfb60b63c/design-inspire-500.2eea1df8f1.otf") format("opentype"); font-weight: 500; font-display: swap; }

@font-face { font-family: Inspire; src: url("/releases/c4edfb60b63c/design-inspire-700.3cfd78fbcb.otf") format("opentype"); font-weight: 700; font-display: swap; }
@font-face { font-family: Inspire; src: url("/releases/c4edfb60b63c/design-inspire-900.ce12f2a0e7.otf") format("opentype"); font-weight: 900; font-display: swap; }
@font-face { font-family: Novarift; src: url("/releases/c4edfb60b63c/design-novarift.76b17df493.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

#app[data-look="v2"] {

  --color-surface-background-start: rgb(1, 43, 45);
  --color-surface-background-startmid: rgb(5, 12, 23);
  --color-surface-background-endmid: rgb(5, 12, 23);
  --color-surface-background-end: rgb(1, 43, 45);
  --color-gray-900: #17171b;
  --color-gray-100: #dbdcde;
  --color-white-1000: #ffffff;
  --color-white-100: rgba(255, 255, 255, 0.1);
  --color-text-overlay-strong: rgba(255, 255, 255, 0.9);
  --color-text-secondary: #a8aab2;
  --color-surface-translucent-heavy: rgba(26, 26, 26, 0.9);
  --color-surface-scrim-default: rgba(0, 0, 0, 0.7);
  --color-surface-scrim-strong: rgba(0, 0, 0, 0.8);
  --color-surface-scrim-light: rgba(0, 0, 0, 0.5);
  --color-border-subtle: rgba(255, 255, 255, 0.1);
  --color-action-primary: #12708a;
  --color-action-destructive: #d92c20;
  --color-drag-handle: #31343e;
  --radius-24: 24px; --radius-18: 18px; --radius-12: 12px; --radius-8: 8px; --radius-circle: 9999px;
  --font-primary: Inspire, "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;

  --font-chat: Novarift, var(--font-primary);
  --cc3-caption-rocket: #bfabf8;
  --cc3-caption-fan: rgba(255, 255, 255, 0.92);
  --cc3-caption-shadow: 0 1px 2px #000, 0 1px 4px #000, 0 1px 8px rgba(0, 0, 0, .9), 0 1px 16px rgba(0, 0, 0, .8), 0 2px 32px rgba(0, 0, 0, .7);

  --safe-top: 59px; --gutter: 24px;
  --ease: cubic-bezier(.2, .7, .2, 1);

  position: relative;
  display: block;
  height: 100%;
  overflow: hidden;
  color: var(--color-white-1000);
  font-family: var(--font-primary);
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
  background: linear-gradient(180deg, var(--color-surface-background-start) 0%, var(--color-surface-background-startmid) 35%, var(--color-surface-background-endmid) 65%, var(--color-surface-background-end) 100%), var(--color-gray-900);
}
body:has(#app[data-look="v2"]) { background: var(--color-gray-900, #17171b); }
#app[data-look="v2"] button { font-family: inherit; }


#app[data-look="v2"]:not([data-entry="product"]) :is(.v2-aurora, .v2-scrim-top, .v2-scrim-bottom, .v2-top-bar, .v2-pip-over, .v2-conversation, .v2-state-chip, .v2-gear, .v2-hold-hint, .v2-sheet, .v2-sheet-scrim, .v2-page) { display: none; }




#app[data-look="v2"] #avatar-frame {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: transparent;
}
#app[data-look="v2"][data-character="rocket-raccoon"] #avatar-frame {
  background:
    linear-gradient(0deg, #050e19 0%, rgba(5, 14, 25, 0) 62%),
    url("/releases/c4edfb60b63c/design-backdrop.a10479c2a5.jpg") center / cover no-repeat,
    var(--color-gray-900);
}
#app[data-look="v2"] .v2-scrim-top { position: absolute; left: 0; right: 0; top: 0; height: 120px; z-index: 2; background: linear-gradient(180deg, var(--color-surface-scrim-default), rgba(0, 0, 0, 0)); pointer-events: none; }
#app[data-look="v2"] .v2-scrim-bottom { position: absolute; left: 0; right: 0; bottom: 0; height: 260px; z-index: 2; background: linear-gradient(180deg, rgba(0, 0, 0, 0), var(--color-surface-scrim-strong)); pointer-events: none; }

#app[data-look="v2"] .v2-aurora { position: absolute; left: -24px; bottom: -12px; width: calc(100% + 48px); height: 430px; z-index: 3; mix-blend-mode: lighten; pointer-events: none; filter: blur(18px) saturate(1.15); }


#app[data-look="v2"] .v2-top-bar { position: absolute; left: 0; right: 0; top: var(--safe-top); height: 52px; z-index: 10; display: flex; align-items: center; justify-content: space-between; padding: 0 16px 0 var(--gutter); pointer-events: none; }
#app[data-look="v2"] .v2-top-bar > * { pointer-events: auto; }
#app[data-look="v2"] .v2-brand { position: relative; width: 92px; height: 42px; }
#app[data-look="v2"] .v2-brand > span { position: absolute; left: 0; top: 50%; background-position: left center; background-size: contain; background-repeat: no-repeat; transition: opacity .7s ease, transform .9s var(--ease); }
#app[data-look="v2"] .v2-brand-home { width: 75px; height: 42px; margin-top: -21px; background-image: url("/releases/c4edfb60b63c/design-brand-disney-plus.90b70e482f.png"); }
#app[data-look="v2"] .v2-brand-franchise { width: 90px; height: 20px; margin-top: -10px; background-image: url("/releases/c4edfb60b63c/design-brand-franchise.3b481dff45.png"); }
#app[data-look="v2"] .v2-brand[data-at="home"] .v2-brand-franchise,
#app[data-look="v2"] .v2-brand[data-at="franchise"] .v2-brand-home { opacity: 0; transform: translateY(-16px); }
#app[data-look="v2"] .v2-hit { width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-circle); background: none; color: inherit; }

#app[data-look="v2"] #end-button { position: fixed; top: calc(var(--safe-top) + 4px); right: 16px; z-index: 11; width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; border-radius: var(--radius-circle); background: center / 16px 16px no-repeat url("/releases/c4edfb60b63c/design-icon-close.2bf00953a0.svg"); }
#app[data-look="v2"] #end-button::before { content: none; }


#app[data-look="v2"] .v2-icon { display: block; background: center / contain no-repeat; }
#app[data-look="v2"] .v2-icon-close { width: 16px; height: 16px; background-image: url("/releases/c4edfb60b63c/design-icon-close.2bf00953a0.svg"); }
#app[data-look="v2"] .v2-icon-info { width: 10px; height: 10px; background-image: url("/releases/c4edfb60b63c/design-icon-info.528f5d5df1.svg"); }
#app[data-look="v2"] .v2-icon-gear { width: 44px; height: 44px; background-image: url("/releases/c4edfb60b63c/design-icon-gear.f9ddbc910f.svg"); }
#app[data-look="v2"] .v2-icon-mic { width: 20px; height: 20px; background-image: url("/releases/c4edfb60b63c/design-icon-mic.b0edf5d6cd.svg"); }
#app[data-look="v2"] .v2-icon-pause { width: 20px; height: 20px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Crect x='4.5' y='3.5' width='3.6' height='13' rx='1.2' fill='%23fff'/%3E%3Crect x='11.9' y='3.5' width='3.6' height='13' rx='1.2' fill='%23fff'/%3E%3C/svg%3E"); }
#app[data-look="v2"] .v2-icon-play { width: 20px; height: 20px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 4.3v11.4a1 1 0 0 0 1.5.86l9.3-5.7a1 1 0 0 0 0-1.72L7.5 3.44A1 1 0 0 0 6 4.3z' fill='%23fff'/%3E%3C/svg%3E"); }
#app[data-look="v2"] .v2-icon-chevron { width: 20px; height: 20px; flex: none; background-size: 8.33px 15px; background-image: url("/releases/c4edfb60b63c/design-icon-chevron.4dd9214964.svg"); }
#app[data-look="v2"] .v2-icon-report { width: 18px; height: 18px; flex: none; background-image: url("/releases/c4edfb60b63c/design-icon-report.e114fd4f8a.svg"); }
#app[data-look="v2"] .v2-icon-settings { width: 18px; height: 18px; flex: none; background-image: url("/releases/c4edfb60b63c/design-icon-settings.2d2113b4f1.svg"); }
#app[data-look="v2"] .v2-icon-back { width: 7px; height: 12px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 12'%3E%3Cpath d='M6 1 1 6l5 5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
#app[data-look="v2"] .v2-icon-trash { width: 18px; height: 18px; flex: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M3 4.5h12M7 4.5V3h4v1.5M4.5 4.5l.7 10.2a1.2 1.2 0 0 0 1.2 1.1h5.2a1.2 1.2 0 0 0 1.2-1.1l.7-10.2M7.5 7.5v5M10.5 7.5v5' fill='none' stroke='%238b8e98' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }





#app[data-look="v2"][data-avatar="pip"]:where(:not(:has(#avatar-frame[data-frame="fullscreen"]))) #avatar-frame :is(#avatar-poster, #avatar-video, #avatar-image) {
  position: absolute;
  inset: auto;
  left: 31px;
  top: 122px;
  width: 124px;
  height: 202px;
  max-width: none;
  aspect-ratio: auto;
  z-index: 6;
  border-radius: 14px;
  background: transparent;
  box-shadow: none;


  object-fit: cover;
  object-position: 50% 0%;
}
#app[data-look="v2"][data-avatar="pip"]:where(:not(:has(#avatar-frame[data-frame="fullscreen"]))) .v2-pip-under { position: absolute; left: 27px; top: 118px; width: 132px; height: 210px; z-index: 5; pointer-events: none; --rv: 0; --ang: 0deg; }
#app[data-look="v2"]:not([data-avatar="pip"]) .v2-pip-under,
#app[data-look="v2"]:has(#avatar-frame[data-frame="fullscreen"]) .v2-pip-under { display: none; }


#app[data-look="v2"]:has(#avatar-frame[data-frame="fullscreen"]) .v2-pip-over { left: 16px; top: calc(var(--safe-top) + 56px); width: 44px; height: 44px; border: 0; border-radius: 0; overflow: visible; }
#app[data-look="v2"]:has(#avatar-frame[data-frame="fullscreen"]) .v2-ai-tag { left: 0; top: 0; right: auto; bottom: auto; }

#app[data-look="v2"][data-avatar="full"] .v2-pip-over { left: 16px; top: calc(var(--safe-top) + 56px); width: 44px; height: 44px; border: 0; border-radius: 0; overflow: visible; }
#app[data-look="v2"][data-avatar="full"] .v2-ai-tag { left: 0; top: 0; right: auto; bottom: auto; }

#app[data-look="v2"][data-reader="hidden"] .v2-pip-over { left: 16px; top: calc(var(--safe-top) + 56px); width: 44px; height: 44px; border: 0; border-radius: 0; overflow: visible; }
#app[data-look="v2"][data-reader="hidden"] .v2-ai-tag { left: 0; top: 0; right: auto; bottom: auto; }



#app[data-look="v2"][data-avatar="pip"]:has(#avatar-frame[data-window$="-right"]) :is(#avatar-poster, #avatar-video, #avatar-image) { left: auto; right: 31px; }
#app[data-look="v2"][data-avatar="pip"]:has(#avatar-frame[data-window$="-right"]) .v2-pip-under { left: auto; right: 27px; }
#app[data-look="v2"][data-avatar="pip"]:has(#avatar-frame[data-window$="-right"]) .v2-pip-over { left: auto; right: 19px; }
#app[data-look="v2"][data-avatar="pip"]:has(#avatar-frame[data-window^="window-bottom"]) :is(#avatar-poster, #avatar-video, #avatar-image) { top: auto; bottom: 176px; }
#app[data-look="v2"][data-avatar="pip"]:has(#avatar-frame[data-window^="window-bottom"]) .v2-pip-under { top: auto; bottom: 172px; }
#app[data-look="v2"][data-avatar="pip"]:has(#avatar-frame[data-window^="window-bottom"]) .v2-pip-over { top: auto; bottom: 164px; }
#app[data-look="v2"] .v2-pip-ribbon, #app[data-look="v2"] .v2-pip-glow { position: absolute; pointer-events: none; }
#app[data-look="v2"] .v2-pip-ribbon { inset: calc(var(--rv) * -3px); border-radius: calc(var(--radius-18) + var(--rv) * 3px); background: rgba(255, 255, 255, 0.3); overflow: hidden; }
#app[data-look="v2"] :is(.v2-pip-spectrum, .v2-pip-glow) { background: conic-gradient(from var(--ang), rgb(72, 226, 52), rgb(255, 98, 98) 27%, rgb(112, 59, 153) 55%, rgb(13, 106, 255) 80%, rgb(72, 226, 52)); }
#app[data-look="v2"] .v2-pip-spectrum { position: absolute; inset: -40%; opacity: min(1, calc(var(--rv) * 4)); }
#app[data-look="v2"] .v2-pip-glow { inset: 6px; border-radius: var(--radius-18); filter: blur(22px); opacity: min(.95, calc(var(--rv) * 1.6)); transform: scale(calc(1 + var(--rv) * .14)); }

#app[data-look="v2"] .v2-pip-light { position: absolute; inset: 4px; border-radius: 14px; background: radial-gradient(ellipse 120% 64% at 50% 22%, rgba(255, 226, 188, .5) 0%, rgba(255, 170, 90, .22) 34%, rgba(14, 18, 40, .9) 72%, #070914 100%), #0c0f1f; }
#app[data-look="v2"] .v2-pip-over { position: absolute; left: 27px; top: 118px; width: 132px; height: 210px; z-index: 7; border: 4px solid transparent; border-radius: var(--radius-18); overflow: hidden; pointer-events: none; }

#app[data-look="v2"] .v2-ai-tag { position: absolute; right: 13px; bottom: 4px; width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-circle); background: none; pointer-events: auto; }
#app[data-look="v2"] .v2-ai-badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: var(--radius-circle); background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); font-weight: 700; font-size: 12px; line-height: 18px; letter-spacing: .11px; color: var(--color-text-overlay-strong); }



#app[data-look="v2"]:is([data-avatar="full"], :has(#avatar-frame[data-frame="fullscreen"])) #avatar-frame :is(#avatar-poster, #avatar-video, #avatar-image) { object-position: 50% 0%; }











#app[data-look="v2"][data-scene="off"] #avatar-frame { background: transparent; }
#app[data-look="v2"][data-scene="off"] #avatar-frame::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, var(--color-surface-background-start) 0%, var(--color-surface-background-startmid) 35%, var(--color-surface-background-endmid) 65%, var(--color-surface-background-end) 100%), var(--color-gray-900); }
#app[data-look="v2"][data-scene="off"] #avatar-frame :is(#avatar-poster, #avatar-video, #avatar-image) { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; max-width: none; aspect-ratio: auto; border-radius: 0; background: transparent; box-shadow: none; object-fit: contain; object-position: 50% 0%; }
@media (max-aspect-ratio: 9/16) {
  #app[data-look="v2"][data-scene="off"] #avatar-frame :is(#avatar-poster, #avatar-video, #avatar-image) { object-fit: cover; object-position: 50% 0%; }
}



#app[data-look="v2"] .v2-conversation { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 104px; top: 340px; z-index: 5; display: flex; flex-direction: column; gap: 14px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; padding-top: 48px; padding-bottom: 46px;
  -webkit-mask: linear-gradient(180deg, transparent 0, #000 64px, #000 calc(100% - 52px), transparent 100%); mask: linear-gradient(180deg, transparent 0, #000 64px, #000 calc(100% - 52px), transparent 100%); }
#app[data-look="v2"] .v2-conversation::-webkit-scrollbar { display: none; }
#app[data-look="v2"] .v2-conversation > :first-child { margin-top: auto; }
#app[data-look="v2"] .v2-turn { flex: none; font-family: var(--font-chat); text-shadow: var(--cc3-caption-shadow); transition: opacity .45s ease; animation: v2-rise .45s var(--ease) both; }
@keyframes v2-rise { from { opacity: 0; transform: translateY(12px); } }
#app[data-look="v2"] .v2-character { display: flex; gap: 16px; color: var(--cc3-caption-rocket); font-weight: 600; font-size: 30px; line-height: 38px; }
#app[data-look="v2"] .v2-rule { flex: none; width: 3px; margin: 3px 0; background: var(--cc3-caption-rocket); border-radius: 2px; }
#app[data-look="v2"] .v2-words { flex: 1; min-width: 0; word-break: break-word; }
#app[data-look="v2"] .v2-fan { align-self: flex-end; max-width: 86%; text-align: right; color: var(--cc3-caption-fan); font-weight: 500; font-size: 22px; line-height: 28px; }
#app[data-look="v2"] .v2-fan.v2-live { opacity: .75; }
#app[data-look="v2"] .v2-fan.v2-live::after { content: ""; display: inline-block; width: 3px; height: 22px; margin-left: 6px; vertical-align: -3px; background: currentColor; animation: v2-caret 1s steps(2) infinite; }
@keyframes v2-caret { 50% { opacity: 0; } }
#app[data-look="v2"] .v2-past { opacity: .5; }
#app[data-look="v2"] .v2-thinking .v2-words { letter-spacing: 6px; }
#app[data-look="v2"] .v2-thinking .v2-words i { font-style: normal; animation: v2-dot 1.2s ease-in-out infinite; }
#app[data-look="v2"] .v2-thinking .v2-words i:nth-child(2) { animation-delay: .15s; }
#app[data-look="v2"] .v2-thinking .v2-words i:nth-child(3) { animation-delay: .3s; }
@keyframes v2-dot { 0%, 100% { opacity: .25; } 40% { opacity: 1; } }

#app[data-look="v2"] .v2-notice { align-self: stretch; padding: 16px; border-radius: 16px; background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); font-family: var(--font-primary); text-shadow: none; }
#app[data-look="v2"] .v2-notice b { display: block; font-weight: 700; font-size: 12px; line-height: 18px; letter-spacing: 1.76px; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
#app[data-look="v2"] .v2-notice p { margin: 8px 0 0; font-size: 15px; line-height: 23px; letter-spacing: -.1px; }
#app[data-look="v2"] #disclosure-banner { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

#app[data-look="v2"] #caption-area { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

#app[data-look="v2"][data-captions="off"] .v2-conversation { visibility: hidden; }
#app[data-look="v2"] .v2-state-chip { position: absolute; left: var(--gutter); bottom: 138px; z-index: 5; display: none; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: var(--radius-circle); background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle); font-size: 12px; font-weight: 500; }
#app[data-look="v2"] .v2-state-chip i { width: 6px; height: 6px; border-radius: 50%; background: var(--cc3-caption-rocket); }
#app[data-look="v2"][data-captions="off"]:has(#end-button:not([hidden])) .v2-state-chip:not([hidden]) { display: inline-flex; }

#app[data-look="v2"] .v2-state-chip[hidden] { display: none; }


#app[data-look="v2"] #controls { position: absolute; left: 0; right: 0; bottom: 0; z-index: 12; display: block; height: 0; padding: 0; background: none; }
#app[data-look="v2"] #call-icons { display: block; width: auto; margin: 0; }
#app[data-look="v2"] #keyboard-button { position: absolute; left: 36px; bottom: 64px; width: 44px; height: 44px; min-width: 44px; background: center / 32px 24px no-repeat url("/releases/c4edfb60b63c/design-icon-keyboard.6a420f1712.svg"); transition: opacity .3s ease; }
#app[data-look="v2"] #keyboard-button::before { content: none; }
#app[data-look="v2"] .v2-gear { position: absolute; right: 36px; bottom: 64px; z-index: 12; transition: opacity .3s ease; }
#app[data-look="v2"] .v2-gear { visibility: hidden; }
#app[data-look="v2"]:has(#end-button:not([hidden])) .v2-gear { visibility: visible; }

#app[data-look="v2"]:has(#start-button:not([hidden])) .v2-gear { visibility: visible; bottom: auto; top: calc(var(--safe-top) + 4px); right: 16px; }
#app[data-look="v2"] #mic-button { position: absolute; left: 50%; bottom: 50px; width: 72px; height: 72px; margin-left: -36px; padding: 0; border-radius: var(--radius-circle); touch-action: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
  background: var(--color-surface-translucent-heavy) center / 24px 24px no-repeat url("/releases/c4edfb60b63c/design-icon-mic.b0edf5d6cd.svg"); box-shadow: inset 0 0 0 1px var(--color-border-subtle); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); transition: background-color .25s ease, transform .2s ease; }
#app[data-look="v2"] #mic-button::before { content: none; }
#app[data-look="v2"] #mic-button:active { transform: scale(.96); }
#app[data-look="v2"][data-phase="listening"] #mic-button { background-color: var(--color-white-1000); background-image: url("/releases/c4edfb60b63c/design-icon-mic-dark.a93bf671c4.svg"); }
#app[data-look="v2"][data-phase="listening"] :is(#keyboard-button, .v2-gear, .v2-story-pause) { opacity: .2; }


#app[data-look="v2"] .v2-story-pause { position: absolute; left: 25%; bottom: 64px; z-index: 12; border: 0; transition: opacity .3s ease; }
#app[data-look="v2"] .v2-story-pause::before { content: none; }
#app[data-look="v2"] .v2-story-pause[hidden] { display: none; }

@media (max-width: 359px) {
  #app[data-look="v2"] .v2-story-pause { left: calc(25% + 2px); bottom: 66px; width: 40px; height: 40px; min-width: 40px; min-height: 40px; }
}

#app[data-look="v2"] #mic-button[data-blocked="true"] { background-image: none; color: var(--color-text-secondary); }
#app[data-look="v2"] #mic-button[data-blocked="true"]::before { content: ''; -webkit-mask-size: 24px; mask-size: 24px; }

#app[data-look="v2"] .v2-hold-hint { position: absolute; left: 50%; bottom: 134px; z-index: 13; transform: translate(-50%, 6px); padding: 6px 12px; border-radius: var(--radius-circle); background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle); font-size: 13px; line-height: 18px; font-weight: 500; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .25s var(--ease); }
#app[data-look="v2"] .v2-hold-hint.v2-show { opacity: 1; transform: translate(-50%, 0); }

[data-input="pointer"] #app[data-look="v2"] :is(#start-button, #end-button):focus-visible { outline: none; box-shadow: none; }
#app[data-look="v2"] #controls button:focus-visible, #app[data-look="v2"] :is(.v2-hit, .v2-menu-item, .v2-row, .v2-pill, .v2-link, .v2-ai-tag):focus-visible { outline: 3px solid #8ea2ff; outline-offset: 2px; }



#app[data-look="v2"] #composer { position: absolute; left: 16px; right: 16px; bottom: 50px; z-index: 12; display: flex; flex-wrap: nowrap; align-items: center; gap: 10px; animation: v2-rise .3s var(--ease) both; }
#app[data-look="v2"] #composer[hidden], #app[data-look="v2"] #composer[data-collapsed="true"] { display: none; }
#app[data-look="v2"]:has(#keyboard-button:not([hidden])):has(#composer[data-collapsed="false"]:not([hidden])) :is(#keyboard-button, #mic-button, .v2-story-pause) { opacity: 0; pointer-events: none; }


#app[data-look="v2"]:has(#keyboard-button[hidden]):has(#composer[data-collapsed="false"]:not([hidden])) .v2-story-pause { bottom: 98px; }
#app[data-look="v2"]:has(#keyboard-button[hidden]):has(#composer[data-collapsed="false"]:not([hidden])):has(.v2-story-pause:not([hidden])) .ra-panel { bottom: 166px; }
@media (max-width: 359px) {
  #app[data-look="v2"]:has(#keyboard-button[hidden]):has(#composer[data-collapsed="false"]:not([hidden])) .v2-story-pause { bottom: 100px; }
}






#app[data-look="v2"][data-read-along]:has(#keyboard-button[hidden]):has(#composer[data-collapsed="false"]:not([hidden])) #mic-recovery { bottom: 166px; }
#app[data-look="v2"][data-read-along]:has(#keyboard-button[hidden]):has(#composer[data-collapsed="false"]:not([hidden])):has(#mic-recovery:not([hidden])) .ra-panel { bottom: calc(178px + var(--mic-recovery-h, 0px)); }
#app[data-look="v2"][data-read-along][data-read-hold] #mic-recovery, #app[data-look="v2"][data-read-along]:has(.ra-end:not([hidden])) #mic-recovery { visibility: hidden; pointer-events: none; }

#app[data-look="v2"]:has(#keyboard-button:not([hidden])):has(#composer[data-collapsed="false"]:not([hidden])):has(#end-button:not([hidden])) .v2-gear { bottom: auto; top: calc(var(--safe-top) + 4px); right: 64px; transform: scale(.8); }
#app[data-look="v2"]:has(#keyboard-button:not([hidden])):has(#composer[data-collapsed="false"]:not([hidden])):has(#end-button:not([hidden])) #connection-dot { right: 108px; }


#app[data-look="v2"]:has(#keyboard-button[hidden]):has(#end-button:not([hidden])) .v2-gear { bottom: auto; top: calc(var(--safe-top) + 4px); right: 64px; transform: scale(.8); }
#app[data-look="v2"] #composer-input { flex: 1; min-width: 0; height: 40px; padding: 0 44px 0 14px; border-radius: var(--radius-8); border: 0; outline: 0; background: rgba(43, 45, 51, .92); box-shadow: inset 0 0 0 1px var(--color-border-subtle); color: var(--color-white-1000); font: 400 16px/23px var(--font-primary); letter-spacing: -.1px; }
#app[data-look="v2"] #composer-input::placeholder { color: var(--color-text-secondary); }
#app[data-look="v2"] #composer-input[aria-invalid="true"] { box-shadow: inset 0 0 0 1px var(--color-action-destructive); }
#app[data-look="v2"] #composer-send { position: absolute; right: 54px; top: 4px; width: 32px; height: 32px; min-width: 32px; min-height: 32px; padding: 0; border-radius: var(--radius-circle); overflow: hidden; text-indent: 150%; white-space: nowrap; opacity: 0; transform: scale(.7); pointer-events: none; transition: opacity .18s ease, transform .22s var(--ease);
  background: var(--color-action-primary) center / 8px 14px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.33333 15'%3E%3Cpath d='M1 1l6.3 6.5L1 14' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
#app[data-look="v2"] #composer-send.v2-ready { opacity: 1; transform: none; pointer-events: auto; }
#app[data-look="v2"] .v2-to-voice { flex: none; width: 40px; height: 40px; min-width: 40px; min-height: 40px; padding: 0; border-radius: var(--radius-circle); display: flex; align-items: center; justify-content: center; background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle); }
#app[data-look="v2"] #composer-error { position: absolute; left: 4px; right: 50px; top: 46px; padding: 0; font-size: 11px; line-height: 15px; color: #ff6b61; }


#app[data-look="v2"]:has(#keyboard-button[hidden]) .v2-to-voice { display: none; }
#app[data-look="v2"]:has(#keyboard-button[hidden]) #composer-send { right: 4px; }
#app[data-look="v2"] #mic-button[data-blocked="true"] { left: auto; right: 16px; bottom: 50px; width: 40px; height: 40px; min-width: 40px; min-height: 40px; margin-left: 0; }
#app[data-look="v2"]:has(#mic-button[data-blocked="true"]:not([hidden])) #composer { right: 66px; }


#app[data-look="v2"] #disclosure { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 110px; z-index: 12; margin: 0; padding: 0; background: none; font-size: 15px; line-height: 23px; letter-spacing: -.1px; color: var(--color-white-1000); text-shadow: 0 1px 8px rgba(0, 0, 0, .8); }
#app[data-look="v2"] #start-button { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 50px; height: 44px; border-radius: var(--radius-circle); background: var(--color-white-1000); color: #000; font-weight: 700; font-size: 15px; line-height: 23px; letter-spacing: 1.76px; text-transform: uppercase; }
#app[data-look="v2"] #start-button:disabled { background: #2d2f36; color: var(--color-text-secondary); }




#app[data-look="v2"] .v2-layout { display: none; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])) .v2-layout:not([hidden]) { display: block; position: absolute; left: var(--gutter); right: var(--gutter); bottom: 106px; z-index: 12; }
#app[data-look="v2"] .v2-layout-label { margin: 0 0 8px; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--color-gray-100); text-shadow: 0 1px 8px rgba(0, 0, 0, .8); }
#app[data-look="v2"] .v2-layout-options { display: flex; gap: 4px; padding: 4px; border-radius: var(--radius-circle); background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle); }
#app[data-look="v2"] .v2-layout-option { flex: 1 1 0; min-width: 0; height: 44px; min-height: 44px; margin: 0; padding: 0 8px; border: 0; border-radius: var(--radius-circle); background: none; color: var(--color-white-1000); font: inherit; font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; transition: background-color .2s ease, color .2s ease; }
#app[data-look="v2"] .v2-layout-option[aria-checked="true"] { background: var(--color-white-1000); color: #000; font-weight: 700; }
#app[data-look="v2"] .v2-layout-option:focus-visible { outline: 3px solid #8ea2ff; outline-offset: 2px; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout:not([hidden])) #disclosure { bottom: 196px; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout:not([hidden])) #status { bottom: 192px; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout:not([hidden])) .v2-scrim-bottom { height: 480px; background: linear-gradient(180deg, rgba(0, 0, 0, 0), var(--color-surface-scrim-strong) 45%); }



#app[data-look="v2"] .v2-safety { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; margin: 6px 0 0; padding: 0 4px; border: 0; background: none; color: var(--color-white-1000); font: inherit; text-align: left; cursor: pointer; }
#app[data-look="v2"] .v2-safety[hidden] { display: none; }
#app[data-look="v2"] .v2-safety .v2-body { gap: 0; flex: 1 1 auto; min-width: 0; }


#app[data-look="v2"] .v2-safety-label { display: block; font-size: 14px; line-height: 20px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 8px rgba(0, 0, 0, .8); }
#app[data-look="v2"] .v2-safety-help { display: block; font-size: 12px; line-height: 16px; color: var(--color-gray-100); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 8px rgba(0, 0, 0, .8); }
#app[data-look="v2"] .v2-safety:focus-visible { outline: 3px solid #8ea2ff; outline-offset: 2px; border-radius: 12px; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) #disclosure { bottom: 246px; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) #status { bottom: 242px; }


#app[data-look="v2"] :is(.v2-layout-label, .v2-layout-options)[hidden], #app[data-look="v2"] .v2-row[hidden] { display: none; }
#app[data-look="v2"] .v2-layout[data-book] .v2-safety { margin-top: 0; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-book]:not([hidden])) #disclosure { bottom: 168px; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-book]:not([hidden])) #status { bottom: 164px; }
#app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) .v2-scrim-bottom { height: 540px; }



@media (max-height: 740px) {
  #app[data-look="v2"][data-entry="product"]:has(.v2-layout[data-speech-safety]:not([hidden])) #start-button:not([hidden]) { bottom: 32px; }
  #app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])) .v2-layout[data-speech-safety]:not([hidden]) { bottom: 84px; }
  #app[data-look="v2"] .v2-layout[data-speech-safety] .v2-safety { margin-top: 2px; }
  #app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) #disclosure { bottom: 216px; font-size: 14px; line-height: 20px; }
  #app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) #status { bottom: 212px; }
  #app[data-look="v2"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) .v2-scrim-bottom { height: 500px; }
}



@media (max-height: 640px) {
  #app[data-look="v2"][data-avatar="pip"][data-entry="product"]:has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) :is(.v2-pip-under, .v2-pip-over) { transform: scale(.66); transform-origin: top left; }
  #app[data-look="v2"][data-avatar="pip"][data-entry="product"]:has(#avatar-frame[data-window$="-right"]):has(#start-button:not([hidden])):has(.v2-layout[data-speech-safety]:not([hidden])) :is(.v2-pip-under, .v2-pip-over) { transform-origin: top right; }
}
#app[data-look="v2"] #extra-time-env { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 14px; z-index: 12; font-size: 12px; color: var(--color-gray-100); }
#app[data-look="v2"] #status { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 18px; margin: 0; z-index: 12; font-size: 12px; line-height: 18px; color: var(--color-gray-100); text-align: center; }
#app[data-look="v2"]:has(#start-button:not([hidden])) #status { bottom: 100px; }
#app[data-look="v2"]:has(#start-button:not([hidden])):has(#disclosure:not(:empty)) #status { display: none; }



#app[data-look="v2"]:has(#start-button:not([hidden])) .v2-conversation { display: none; }





#app[data-look="v2"]:has(#start-button:not([hidden])) .v2-scrim-bottom { display: block; z-index: 11; height: 380px; background: linear-gradient(180deg, rgba(0, 0, 0, 0), var(--color-surface-scrim-strong) 55%); }




#app[data-look="v2"]:has(#composer:not([hidden]):not([data-collapsed="true"]) #composer-error:not([hidden])) #status { opacity: 0; }
#app[data-look="v2"] #connection-dot { top: calc(var(--safe-top) + 21px); right: 64px; width: 8px; height: 8px; }
#app[data-look="v2"] #mic-recovery { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 134px; z-index: 13; padding: 12px 16px; border-radius: 16px; background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle); font-size: 13px; line-height: 19px; }


#app[data-look="v2"] .v2-sheet-scrim { position: absolute; inset: 0; z-index: 40; background: var(--color-surface-scrim-light); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
#app[data-look="v2"]:is([data-sheet="menu"], [data-sheet="about"]) .v2-sheet-scrim { opacity: 1; pointer-events: auto; }
#app[data-look="v2"] .v2-sheet { position: absolute; left: 25px; right: 26px; bottom: 34px; z-index: 41; border-radius: var(--radius-24); overflow: hidden; background: var(--color-gray-900); box-shadow: inset 0 0 0 1px var(--color-white-100), 0 4px 4px rgba(0, 0, 0, .25);
  transform: translateY(calc(100% + 60px)); visibility: hidden; transition: transform .42s var(--ease), visibility 0s linear .42s; }
#app[data-look="v2"][data-sheet="menu"] .v2-sheet[data-sheet="menu"],
#app[data-look="v2"][data-sheet="about"] .v2-sheet[data-sheet="about"] { transform: none; visibility: visible; transition: transform .42s var(--ease); }
#app[data-look="v2"] .v2-handle { display: flex; justify-content: center; padding-top: 16px; }
#app[data-look="v2"] .v2-handle i { width: 60px; height: 5px; border-radius: var(--radius-circle); background: var(--color-drag-handle); }
#app[data-look="v2"] .v2-menu-item { width: 100%; display: flex; align-items: center; gap: 8px; min-height: 45px; padding: 16px; border-radius: 0; background: none; color: inherit; text-align: left; border-bottom: 1px solid var(--color-white-100); }
#app[data-look="v2"] .v2-menu-item:last-child { border-bottom: 0; }
#app[data-look="v2"] .v2-menu-item[hidden] { display: none; }
#app[data-look="v2"] .v2-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
#app[data-look="v2"] .v2-menu-item .v2-label { font-weight: 700; font-size: 18px; line-height: 26px; letter-spacing: .11px; }
#app[data-look="v2"] .v2-menu-item .v2-sub { font-weight: 400; font-size: 12px; line-height: 18px; letter-spacing: -.1px; color: var(--color-gray-100); }
#app[data-look="v2"] .v2-menu-item.v2-small .v2-label { font-weight: 400; font-size: 15px; line-height: 23px; letter-spacing: -.1px; }
#app[data-look="v2"] .v2-sheet h2 { margin: 0; font-weight: 700; font-size: 20px; line-height: 26px; padding: 18px 16px 10px; }
#app[data-look="v2"] .v2-sheet .v2-copy { margin: 0; font-size: 13px; line-height: 19px; color: var(--color-gray-100); padding: 0 16px 16px; }
#app[data-look="v2"] .v2-actions { display: flex; flex-direction: column; gap: 10px; padding: 16px; }
#app[data-look="v2"] .v2-pill { display: flex; align-items: center; justify-content: center; height: 44px; padding: 0 20px; border-radius: var(--radius-circle); font-weight: 700; font-size: 14px; letter-spacing: 1.6px; text-transform: uppercase; }
#app[data-look="v2"] .v2-light { background: var(--color-white-1000); color: #0e0e12; }
#app[data-look="v2"] .v2-link { display: block; margin: -4px auto 16px; padding: 4px 8px; background: none; font-weight: 400; font-size: 13px; color: #6fc8e8; }


#app[data-look="v2"] #report-button { display: none; }
#app[data-look="v2"] #report-sheet { left: 25px; right: 26px; bottom: 34px; top: auto; width: auto; max-width: none; margin: 0; padding: 0; border: 0; border-radius: var(--radius-24); background: var(--color-gray-900); color: var(--color-white-1000); box-shadow: inset 0 0 0 1px var(--color-white-100), 0 4px 4px rgba(0, 0, 0, .25); font-family: var(--font-primary); }
#app[data-look="v2"] #report-sheet::backdrop { background: var(--color-surface-scrim-light); }
#app[data-look="v2"] #report-sheet form { padding-top: 16px; }
#app[data-look="v2"] #report-sheet form::before { content: ""; display: block; width: 60px; height: 5px; margin: 0 auto; border-radius: var(--radius-circle); background: var(--color-drag-handle); }
#app[data-look="v2"] #report-title { margin: 0; font-weight: 700; font-size: 20px; line-height: 26px; padding: 18px 16px 10px; }
#app[data-look="v2"] #report-options { margin: 0; padding: 0; border: 0; display: block; }
#app[data-look="v2"] #report-options label { display: flex; align-items: center; justify-content: space-between; flex-direction: row-reverse; gap: 12px; padding: 14px 16px; border-top: 1px solid var(--color-white-100); font-size: 14px; cursor: pointer; }
#app[data-look="v2"] #report-options input { appearance: none; -webkit-appearance: none; width: 16px; height: 16px; margin: 0; background: none; }
#app[data-look="v2"] #report-options input:checked { background: center / 16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5 6.5 12 13 4.5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
#app[data-look="v2"] #report-options label:has(input:focus-visible) { outline: 3px solid #8ea2ff; outline-offset: -3px; }
#app[data-look="v2"] .report-actions { display: flex; flex-direction: column-reverse; gap: 10px; padding: 16px; }
#app[data-look="v2"] :is(#report-send, #report-cancel) { height: 44px; border: 0; border-radius: var(--radius-circle); font-weight: 700; font-size: 14px; letter-spacing: 1.6px; text-transform: uppercase; }
#app[data-look="v2"] #report-send { background: var(--color-white-1000); color: #0e0e12; }
#app[data-look="v2"] #report-cancel { background: #2b2d33; color: var(--color-white-1000); }

#app[data-look="v2"] #report-status { position: absolute; left: 16px; right: 16px; top: 116px; z-index: 60; display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0; padding: 0 16px; border-radius: var(--radius-circle); background: rgba(60, 62, 72, .94); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); color: var(--color-white-1000); font-size: 14px; font-weight: 500; transform: none; }
#app[data-look="v2"] #report-status:empty { display: none; }


#app[data-look="v2"] .v2-page { position: absolute; inset: 0; z-index: 50; display: flex; flex-direction: column; padding-top: var(--safe-top); transform: translateX(100%); visibility: hidden; transition: transform .42s var(--ease), visibility 0s linear .42s;
  background: linear-gradient(180deg, var(--color-surface-background-start) 0%, var(--color-surface-background-startmid) 32%, var(--color-surface-background-endmid) 72%, var(--color-surface-background-end) 100%), var(--color-gray-900); }
#app[data-look="v2"][data-page="settings"] .v2-page[data-page="settings"],
#app[data-look="v2"][data-page="notes"] .v2-page[data-page="notes"],
#app[data-look="v2"][data-page="notes"] .v2-page[data-page="settings"] { transform: none; visibility: visible; transition: transform .42s var(--ease); }
#app[data-look="v2"] .v2-page-head { position: relative; height: 52px; display: flex; align-items: center; justify-content: center; }
#app[data-look="v2"] .v2-page-head h1 { margin: 0; font-weight: 700; font-size: 18px; line-height: 26px; }
#app[data-look="v2"] .v2-back { position: absolute; left: 12px; top: 4px; }
#app[data-look="v2"] .v2-back > span { width: 24px; height: 24px; border-radius: 50%; background: rgba(255, 255, 255, .16); display: flex; align-items: center; justify-content: center; }
#app[data-look="v2"] .v2-page-body { flex: 1; overflow-y: auto; scrollbar-width: none; padding: 8px var(--gutter) 48px; }
#app[data-look="v2"] .v2-page-body::-webkit-scrollbar { display: none; }
#app[data-look="v2"] .v2-group-hd { font-weight: 500; font-size: 12px; letter-spacing: 1.8px; text-transform: uppercase; color: var(--color-gray-100); padding: 22px 0 6px; }
#app[data-look="v2"] .v2-row { width: 100%; display: flex; align-items: center; gap: 12px; padding: 16px 0; border-radius: 0; border-bottom: 1px solid var(--color-white-100); background: none; color: inherit; text-align: left; }
#app[data-look="v2"] .v2-row .v2-body { gap: 2px; }
#app[data-look="v2"] .v2-row .v2-label { font-weight: 700; font-size: 15px; line-height: 22px; }
#app[data-look="v2"] .v2-row .v2-sub { font-weight: 400; font-size: 12px; line-height: 17px; color: var(--color-gray-100); }
#app[data-look="v2"] .v2-toggle { flex: none; position: relative; width: 44px; height: 24px; border-radius: var(--radius-circle); background: #3c3e48; transition: background-color .2s ease; }
#app[data-look="v2"] .v2-toggle::after { content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: #e6e7ea; box-shadow: 0 1px 3px rgba(0, 0, 0, .4); transition: transform .22s var(--ease); }
#app[data-look="v2"] .v2-toggle.v2-on { background: var(--color-action-primary); }
#app[data-look="v2"] .v2-toggle.v2-on::after { transform: translateX(20px); }
#app[data-look="v2"] .v2-notes-intro { margin: 0; font-size: 13px; line-height: 19px; color: var(--color-gray-100); padding: 12px 0 8px; }
#app[data-look="v2"] .v2-notes-empty { padding: 28px 0; text-align: center; font-size: 13px; color: var(--color-text-secondary); }



#app[data-look="v2"] #notice { left: var(--gutter); right: var(--gutter); bottom: 134px; width: auto; transform: none; z-index: 30; padding: 16px; border-radius: 16px; border-top: 0; background: var(--color-surface-translucent-heavy); box-shadow: inset 0 0 0 1px var(--color-border-subtle), inset 0 3px 0 var(--lc-notice-rule, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: var(--color-white-1000); font-size: 15px; line-height: 23px; }
#app[data-look="v2"] #notice button { height: 44px; padding: 0 20px; border: 0; border-radius: var(--radius-circle); background: var(--color-white-1000); color: #000; font-weight: 700; font-size: 14px; letter-spacing: 1.6px; text-transform: uppercase; }
#app[data-look="v2"] #story-ending { z-index: 30; background: var(--color-surface-scrim-default); }
#app[data-look="v2"] #story-ending-title { font-weight: 700; font-size: 30px; line-height: 38px; letter-spacing: .11px; }
#app[data-look="v2"] #story-ending-text { font-size: 15px; line-height: 23px; color: var(--color-gray-100); }
#app[data-look="v2"] #character-clip-close { height: 38px; border: 0; border-radius: var(--radius-circle); background: rgba(255, 255, 255, .12); color: var(--color-white-1000); font-size: 15px; }
#app[data-look="v2"] #character-clip { z-index: 30; background: var(--color-gray-900); }

#app[data-look="v2"] #tap-prompt { z-index: 9; }
#app[data-look="v2"] :is(#story-ending, #notice, #character-clip) { font-family: var(--font-primary); }

@media (prefers-reduced-motion: reduce) {
  #app[data-look="v2"] :is(.v2-turn, #composer, .v2-sheet, .v2-page, .v2-brand > span) { animation: none; transition: none; }
  #app[data-look="v2"] .v2-thinking .v2-words i, #app[data-look="v2"] .v2-fan.v2-live::after { animation: none; }
}
#app[data-look="v2"]:has(#keyboard-button[hidden]):has(#end-button:not([hidden])) #connection-dot { right: 108px; }





#app[data-look="v2"] .ra-cover { position: absolute; inset: 0; z-index: 12; display: flex; align-items: flex-end; justify-content: center; padding: 16px 16px 120px; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.72)); }
#app[data-look="v2"] .ra-cover[hidden], #app[data-look="v2"] .ra-panel[hidden], #app[data-look="v2"] .ra-end[hidden] { display: none; }
#app[data-look="v2"] .ra-card { width: 100%; max-width: 420px; padding: 20px; border-radius: 20px; background: rgba(23, 23, 27, 0.88); color: #fff; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4); }
#app[data-look="v2"] .ra-eyebrow { margin: 0 0 4px; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.7; }
#app[data-look="v2"] .ra-title { margin: 0 0 16px; font-size: 24px; font-weight: 700; line-height: 1.2; }
#app[data-look="v2"] .ra-modes { display: grid; gap: 8px; margin-bottom: 16px; }
#app[data-look="v2"] .ra-modes label { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: 14px; background: rgba(255, 255, 255, 0.08); cursor: pointer; }
#app[data-look="v2"] .ra-modes label:has(input:checked) { background: rgba(255, 255, 255, 0.2); outline: 2px solid rgba(255, 255, 255, 0.7); }
#app[data-look="v2"] .ra-modes span { display: grid; gap: 2px; }
#app[data-look="v2"] .ra-modes small { font-size: 13px; opacity: 0.75; }
#app[data-look="v2"] .ra-start, #app[data-look="v2"] .ra-again { min-height: 44px; padding: 0 22px; border: 0; border-radius: 22px; background: #fff; color: #17171b; font-size: 16px; font-weight: 700; cursor: pointer; }
#app[data-look="v2"] .ra-start { width: 100%; }
#app[data-look="v2"] .ra-with { margin: -4px 0 12px; font-size: 15px; font-weight: 600; opacity: 0.85; }
#app[data-look="v2"] .ra-hint { margin: 12px 0 0; font-size: 13px; text-align: center; opacity: 0.7; }
#app[data-look="v2"] .ra-panel { position: absolute; left: 16px; right: 16px; bottom: 132px; z-index: 8; display: grid; gap: 10px; pointer-events: none; }
#app[data-look="v2"] .ra-panel > * { pointer-events: auto; }


#app[data-look="v2"] .ra-panel { justify-items: center; }





#app[data-look="v2"] .ra-text { max-width: 100%; padding: 14px 22px; border-radius: 22px; background: rgba(18, 20, 28, 0.62); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.14), inset 0 0 0 1px rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.9); font-size: 17px; line-height: 1.45; font-weight: 400; letter-spacing: 0.005em; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); }
#app[data-look="v2"] .ra-text > .ra-s:not(.ra-cur) { display: none; }
#app[data-look="v2"][data-read-along]:not([data-read-hold]) .v2-turn { visibility: hidden; }
#app[data-look="v2"] .ra-w { transition: color 120ms ease-out, text-shadow 120ms ease-out; }
#app[data-look="v2"] .ra-w.said { color: #fff; }

#app[data-look="v2"] .ra-w.now { color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 10px rgba(255, 206, 140, 0.75), 0 0 3px rgba(255, 220, 170, 0.6); }
@media (prefers-reduced-motion: reduce) {
  #app[data-look="v2"] .ra-w { transition: none; }
}
#app[data-look="v2"][data-read-along="listen"] .ra-text { display: none; }
#app[data-look="v2"] .ra-end { position: absolute; left: 16px; right: 16px; bottom: 200px; z-index: 9; display: grid; justify-items: center; gap: 12px; padding: 20px; border-radius: 20px; background: rgba(23, 23, 27, 0.85); color: #fff; }
#app[data-look="v2"] .ra-end-title { margin: 0; font-size: 28px; font-weight: 700; }

#app[data-look="v2"][data-read-reading] :is(#caption-area, .v2-conversation) { visibility: hidden; }
#app[data-look="v2"][data-read-along="cover"] :is(#caption-area, .v2-conversation) { visibility: hidden; }



#app[data-look="v2"][data-read-along]:not([data-read-hold]) :is(#caption-area, .v2-conversation) { visibility: hidden; }
#app[data-look="v2"][data-read-hold] .ra-text { display: none; }


#app[data-look="v2"][data-read-wait] .ra-text { visibility: hidden; }
#app[data-look="v2"] .ra-lede { margin: 0 0 16px; font-size: 15px; line-height: 1.4; opacity: 0.8; }

#app[data-look="v2"][data-read-along] .v2-character { gap: 12px; font-size: 20px; line-height: 26px; }
#app[data-look="v2"][data-read-along] .v2-fan { font-size: 16px; line-height: 21px; }

#app[data-look="v2"][data-read-along] .v2-conversation { bottom: 184px; padding-bottom: 8px; }







#app[data-look="v2"][data-reader="hidden"] #avatar-frame :is(#avatar-poster, #avatar-video, #avatar-image),
#app[data-look="v2"][data-reader="hidden"] .v2-pip-under,
#app[data-look="v2"][data-reader="hidden"] [data-reader-part] { opacity: 0; }
