:root {
  color-scheme: dark;
  --bg: #07111b;
  --panel: #102334;
  --ink: #f4f8ff;
  --muted: #b6c6d3;
  --blue: #83d4ff;
  --line: rgba(148, 205, 238, .18);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (min-width: 1000px) { html { scrollbar-gutter: stable; } }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.55 -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, sans-serif; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, sans-serif; letter-spacing: -.055em; line-height: 1.04; }
h2 { font-size: clamp(2.7rem, 5.2vw, 5.5rem); }
h2 span, h1 em { color: var(--blue); font-style: normal; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
#hero-title:focus-visible { outline: none; }
.skip-link { position: fixed; top: -100px; left: 12px; z-index: 30; padding: 8px 12px; background: #fff; color: #000; }
.skip-link:focus { top: 12px; }
.site-header { position: absolute; z-index: 10; top: 0; left: 0; right: 0; background: linear-gradient(#06101cbd, transparent); }
.nav { max-width: 1440px; min-height: 74px; padding: 12px clamp(20px, 4vw, 64px); margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 750; letter-spacing: -.04em; font-size: 1.15rem; white-space: nowrap; }
.brand img { border-radius: 9px; }
.nav-links { display: flex; align-items: center; gap: clamp(14px, 2vw, 32px); font-size: .88rem; font-weight: 600; }
.nav-links a:not(.nav-download):hover, .footer a:hover { color: var(--blue); }
.nav-download { padding: 9px 16px; border-radius: 999px; background: #ebf7ff; color: #05121e; white-space: nowrap; }
.nav-download:hover, .button-primary:hover { background: #bdeaff; }
.nav-primary { position: relative; gap: 16px; }
.nav-primary .nav-links { gap: 10px; flex-shrink: 0; white-space: nowrap; }
.nav-primary .nav-links a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 9px 14px; border-radius: 999px; }
.nav-primary .nav-links a:not(.nav-download) { background: #081828b8; border: 1px solid #ffffff60; }
.nav-toggle { display: none; position: relative; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; color: #fff; background: transparent; border: 0; border-radius: 12px; cursor: pointer; }
.nav-toggle span { position: absolute; width: 22px; height: 2px; border-radius: 2px; background: currentColor; transform: translateY(-4px); transition: transform .25s ease; }
.nav-toggle span + span { transform: translateY(4px); }
.nav-open .nav-toggle span { transform: rotate(45deg); }
.nav-open .nav-toggle span + span { transform: rotate(-45deg); }
@media (max-width: 760px) {
  .nav-primary .nav-toggle { display: inline-flex; }
  .nav-primary.nav-open { background: #07121f; }
  .nav-primary .nav-links { display: none; position: absolute; top: 100%; right: 0; left: 0; gap: 0; max-height: calc(100dvh - 74px); overflow-y: auto; padding: 22px 28px 32px; background: radial-gradient(ellipse at 100% 0%, #153e56 0%, transparent 65%), #07121f; border-bottom: 1px solid #83d4ff30; border-radius: 0 0 28px 28px; box-shadow: 0 30px 70px #0009; }
  .nav-primary.nav-open .nav-links { display: flex; flex-direction: column; align-items: stretch; animation: nav-reveal .28s ease-out both; }
  .nav-primary .nav-links a:not(.nav-download) { justify-content: space-between; padding: 17px 0; background: none; border: 0; border-radius: 0; font-size: clamp(1.65rem, 6.7vw, 2.2rem); font-weight: 650; letter-spacing: -.045em; line-height: 1.2; }
  .nav-primary .nav-links a:not(.nav-download)::after { content: ""; width: 8px; height: 8px; border-top: 1.5px solid #83d4ff99; border-right: 1.5px solid #83d4ff99; transform: rotate(45deg); margin-right: 5px; }
  .nav-primary .nav-links .nav-download { align-self: flex-start; margin-top: 26px; min-height: 48px; padding: 12px 24px; color: #05121e; background: var(--blue); font-size: 1rem; box-shadow: 0 4px 24px #83d4ff20; }
  .nav-open .nav-links a { animation: nav-link-arrive .3s ease-out both; }
  .nav-open .nav-links a:nth-child(2) { animation-delay: .04s; }
  .nav-open .nav-links a:nth-child(3) { animation-delay: .08s; }
  .nav-open .nav-links a:nth-child(4) { animation-delay: .12s; }
}
@keyframes nav-reveal { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes nav-link-arrive { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.video-hero { position: relative; min-height: min(900px, 100svh); height: 100svh; overflow: hidden; display: flex; align-items: center; }
.hero-poster, .hero-video, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-poster img, .hero-video { width: 100%; height: 100%; object-fit: cover; }
.hero-video { opacity: 0; }
.hero-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; pointer-events: none; }
.hero-background-ready .hero-background { opacity: 1; animation: hero-unblur 2s linear both; }
.video-hero::after { content: ""; position: absolute; inset: 0; background: #000; pointer-events: none; opacity: 0; }
.hero-intro-pending::after { opacity: 1; }
.hero-intro-revealed::after { animation: hero-black-reveal 2s linear both; }
@keyframes hero-black-reveal { from { opacity: 1; } to { opacity: 0; } }
@keyframes hero-unblur { from { filter: blur(18px); } to { filter: blur(var(--hero-background-blur, 0px)); } }
.hero-playing .hero-background, .hero-playing .hero-pause, .hero-playing .video-hero::after { visibility: hidden; }
.hero-pause { color: inherit; background: none; border: 0; padding: 10px 0; min-height: 44px; font: inherit; text-decoration: underline; cursor: pointer; }
.hero-pause[hidden] { display: none; }
.hero-playing .hero-video { opacity: 1; }
.hero-playing .hero-poster, .hero-playing .site-header, .hero-playing .hero-shade, .hero-playing .hero-content, .hero-playing .hero-play, .hero-playing .scroll-cue { visibility: hidden; }
.hero-video:fullscreen, .hero-video:-webkit-full-screen { background: #000; object-fit: contain; opacity: 1; }
.hero-fallback { overflow: hidden; }
.hero-fallback .hero-video { position: fixed; z-index: 60; inset: 0; width: 100vw; height: 100dvh; background: #000; object-fit: contain; }
.hero-shade { background: linear-gradient(90deg, rgba(3, 8, 16, .91) 0%, rgba(3, 8, 16, .64) 40%, rgba(3, 8, 16, .12) 100%), linear-gradient(0deg, rgba(3, 8, 16, .48), transparent 40%); }
.hero-content { position: relative; z-index: 1; width: min(800px, 62%); margin-left: max(calc((100vw - 1320px)/2), 6vw); padding-top: 55px; }
.eyebrow { margin-bottom: 18px; color: var(--blue); font-size: .76rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.hero-content h1 { position: relative; font-size: clamp(3.5rem, 5vw, 5.5rem); margin-bottom: 22px; }
.hero-content > p:not(.eyebrow) { max-width: 560px; font-size: clamp(1.1rem, 1.75vw, 1.5rem); color: #e6edf5; }
.hero-word { position: relative; display: inline-block; overflow: hidden; border-radius: .08em; padding: 0 .02em; }
.hero-follow-ready .hero-word { animation: hero-word-follow var(--word-duration) linear var(--word-delay) both; }
.hero-follow-ready .hero-word::after { content: ""; position: absolute; top: 50%; left: -72px; width: 72px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 24'%3E%3Cpath d='M1 12h8l4-7 4 14 4-10 4 6 4-11 4 16 4-8 4-6 4 12 4-6h19' fill='none' stroke='%2383d4ff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; filter: drop-shadow(0 0 5px #83d4ff); pointer-events: none; animation: hero-wave-sweep var(--word-duration) linear var(--word-delay) both; }
@keyframes hero-word-follow { 0% { opacity: .42; background: transparent; box-shadow: none; } 8%, 78% { opacity: 1; background: #999ba87a; box-shadow: inset 0 0 0 1px #d9dde677; } 100% { opacity: 1; background: transparent; box-shadow: none; } }
@keyframes hero-wave-sweep { 0% { left: -72px; opacity: 0; transform: translateY(-50%); } 12%, 78% { opacity: .9; } 100% { left: 100%; opacity: 0; transform: translateY(-50%); } }
.hero-wave { position: absolute; left: 0; bottom: -13px; display: flex; align-items: center; justify-content: center; gap: 3px; width: 76px; height: 20px; border: 1px solid #83d4ff7a; border-radius: 99px; background: #071725db; opacity: 0; pointer-events: none; }
.hero-follow-ready .hero-wave { opacity: 1; animation: hero-wave-exit .35s ease var(--follow-end) forwards; }
.hero-wave i { width: 3px; height: 5px; border-radius: 3px; background: var(--blue); animation: hero-waveform .48s ease-in-out infinite alternate; }
.hero-wave i:nth-child(2), .hero-wave i:nth-child(4) { animation-delay: -.31s; }
.hero-wave i:nth-child(3) { animation-delay: -.17s; }
@keyframes hero-waveform { to { height: 14px; } }
@keyframes hero-wave-exit { to { opacity: 0; } }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 10px; min-height: 50px; padding: 12px 22px; border-radius: 999px; font-weight: 750; text-align: center; transition: background .2s, transform .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--blue); color: #061521; }
.button-secondary { background: rgba(11, 24, 39, .68); color: #fff; border: 1px solid rgba(255,255,255,.35); backdrop-filter: blur(12px); }
.button-secondary:hover { background: rgba(29, 51, 70, .9); }
.hero-play { position: absolute; z-index: 2; right: clamp(20px, 4vw, 64px); bottom: 28px; min-height: 44px; color: #fff; background: #081828b8; border: 1px solid #ffffff60; border-radius: 999px; padding: 9px 15px; cursor: pointer; }
.hero-close { position: fixed; z-index: 61; top: max(18px, env(safe-area-inset-top)); right: max(18px, env(safe-area-inset-right)); min-height: 44px; color: #fff; background: #081828b8; border: 1px solid #ffffff60; border-radius: 999px; padding: 9px 15px; cursor: pointer; }
.hero-close[hidden] { display: none; }
.scroll-cue { position: absolute; z-index: 2; bottom: 30px; left: 50%; transform: translateX(-50%); text-transform: uppercase; font-size: .7rem; font-weight: 800; letter-spacing: .15em; white-space: nowrap; }
.scroll-cue span { margin-left: 6px; color: var(--blue); }
.section-shell { max-width: 1320px; margin: 0 auto; padding: clamp(72px, 9vw, 130px) clamp(20px, 4vw, 64px); }
.intro { text-align: center; }
.intro h2 { margin-bottom: 22px; }
.mobile-break { display: none; }
.lead { max-width: 810px; margin: auto; color: var(--muted); font-size: clamp(1.18rem, 2.1vw, 1.55rem); }
.quick-benefits { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 32px; }
.quick-benefits span { border: 1px solid var(--line); background: #102537; color: #d9eeff; border-radius: 999px; padding: 9px 16px; font-weight: 700; font-size: .9rem; }
.motion-ready .reveal { opacity: 0; transform: translateY(24px); transition: opacity .85s ease, transform .85s cubic-bezier(.2,.8,.2,1); }
.motion-ready .reveal.in-view { opacity: 1; transform: none; }
.motion-ready .intro h2.reveal { transition-delay: .08s; }
.motion-ready .intro .lead.reveal { transition-delay: .16s; }
.motion-ready .intro .quick-benefits.reveal { transition-delay: .24s; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.stories-section { max-width: none; --card-size: calc((100% - 60px)/4); padding: 28px clamp(20px, 3vw, 64px) 72px; }
.story-track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-inline: contain; }
.story-track::-webkit-scrollbar { display: none; }
.story-card { flex: 0 0 var(--card-size); min-width: 0; height: clamp(620px, calc(100svh - 210px), 760px); display: flex; flex-direction: column; overflow: hidden; clip-path: inset(0 round 15px); scroll-snap-align: start; border-radius: 15px; background: radial-gradient(circle at 50% 60%, #1a435a, #0b1b2a 65%); border: 1px solid var(--line); container-type: inline-size; }
.motion-ready .story-card, .motion-ready .plan-card { opacity: 0; transition: opacity .85s ease; }
.motion-ready .plan-card { transform: translateY(24px); transition: opacity .85s ease, transform .85s cubic-bezier(.2,.8,.2,1); }
.motion-ready .story-card.entered, .motion-ready .plan-card.entered { opacity: 1; }
.motion-ready .plan-card.entered { transform: none; }
.motion-ready .story-card:nth-child(2), .motion-ready .plan-card:nth-child(2) { transition-delay: .08s; }
.motion-ready .story-card:nth-child(3), .motion-ready .plan-card:nth-child(3) { transition-delay: .16s; }
.motion-ready .story-card:nth-child(4) { transition-delay: .24s; }
.story-card-featured { flex-basis: calc(2 * var(--card-size) + 20px); }
#speech-follow, #intro-demo { position: relative; }
.follow-play { position: absolute; inset: 0; z-index: 5; width: 100%; border: 0; border-radius: inherit; padding: 0; background: transparent; color: var(--ink); cursor: pointer; }
.follow-play:focus-visible { outline-offset: -5px; }
.demo-choices { position: absolute; z-index: 6; bottom: 18px; left: 18px; right: 18px; display: flex; flex-wrap: wrap; gap: 8px; }
.demo-choices button { flex: 1 1 190px; display: flex; align-items: center; gap: 11px; min-height: 68px; padding: 12px 16px; border: 1px solid #b2e4ff45; border-radius: 15px; background: #071521ed; backdrop-filter: blur(16px); color: var(--ink); text-align: left; cursor: pointer; box-shadow: 0 8px 25px #0005; transition: background .2s, border-color .2s; }
.demo-choices button:first-child { background: #15394fed; border-color: #83d4ff80; }
.demo-choices button:hover { background: #214860; border-color: #b2e4ff; }
.demo-choices strong, .demo-choices small { display: block; }
.demo-choices strong { font-size: .85rem; font-weight: 650; }
.demo-choices small { font-size: .72rem; color: #b6c6d3; margin-top: 3px; }
.demo-play-icon { color: var(--blue); font-size: .8rem; }
html.follow-player-open { overflow: hidden; }
.follow-player { position: fixed; inset: 0; width: 100%; height: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: #000; color: var(--ink); overflow: hidden; }
.follow-player::backdrop { background: #000; }
.follow-player-close { position: absolute; z-index: 2; top: max(12px, env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; color: #fff; background: #0008; cursor: pointer; }
.follow-player-close svg { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.follow-player-close:hover { background: #333; }
.follow-player > video { display: block; width: 100%; height: 100%; object-fit: contain; }
.follow-player-error { position: absolute; inset: 40% 20px auto; padding: 20px; text-align: center; background: #102331; border-radius: 12px; }
.follow-player-error a { color: var(--blue); text-decoration: underline; }
.demo-end { position: absolute; inset: 0; overflow-y: auto; background: radial-gradient(ellipse at 50% 80%, #102332 0%, #03080c 48%, #000 78%); }
.demo-end:not([hidden]) { display: grid; place-items: center; }
.demo-end-content { width: min(100%, 940px); padding: 80px 24px 48px; text-align: center; animation: demo-end-arrive .65s ease-out both; }
.demo-end h2 { font-size: clamp(2.2rem, 5.8vw, 5rem); line-height: 1.12; margin-bottom: 22px; outline: none; }
.demo-end-description { color: var(--muted); font-size: clamp(1rem, 2vw, 1.2rem); margin-bottom: 32px; }
.demo-next { display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 17px 28px; min-height: 56px; border: 1px solid #b8e8ff; border-radius: 99px; background: #b5e6ff; color: #071521; font: inherit; font-weight: 700; cursor: pointer; box-shadow: 0 0 45px #83d4ff18; transition: background .2s, box-shadow .2s; }
.demo-next:hover { background: #e1f5ff; box-shadow: 0 0 55px #83d4ff30; }
.demo-next > span:first-child { font-size: .8rem; }
.demo-end-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 26px; margin-top: 23px; }
.demo-end-actions button { min-height: 44px; padding: 8px 2px; border: 0; background: transparent; color: #b6c6d3; cursor: pointer; font-size: .9rem; }
.demo-end-actions button:hover { color: #fff; }
.demo-return span { margin-left: 6px; }
.follow-player > video[hidden] { display: none; }
@keyframes demo-end-arrive { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .demo-choices button, .demo-next { transition: none; } .demo-end-content { animation: none; } }
.story-copy { flex: 0 0 280px; padding: 26px; background: linear-gradient(180deg, #0b1d2c, #123248); }
@media (min-width: 1200px) { .story-copy { flex-basis: 250px; } }
.story-copy .eyebrow { margin-bottom: 12px; }
.story-copy h3 { font-size: clamp(1.8rem, 6.8cqw, 3.5rem); margin-bottom: 12px; }
.story-card-featured .story-copy h3 { font-size: clamp(1.8rem, 6.4cqw, 3.25rem); }
.story-copy h3 span { color: var(--blue); }
.story-copy p:last-child { color: var(--muted); max-width: 460px; margin-bottom: 0; font-size: .96rem; line-height: 1.45; }
.story-video, .story-art, .phone-pan, .ipad-stage, .remote-stage, .session-stage, .monitor-stage { flex: 1; min-height: 0; height: 520px; overflow: hidden; position: relative; background: #0b1d2d; }
.story-follow-visual { flex: 1; min-height: 0; position: relative; overflow: hidden; background: #07111b; }
.story-follow-visual .follow-frame { height: 100%; object-fit: cover; }
.story-video { display: grid; place-items: center; background: radial-gradient(circle at 50% 50%, #1d5069, #0a1c2c 70%); }
.iphone-video-frame { position: relative; height: 90%; width: auto; aspect-ratio: 1013 / 2098; filter: drop-shadow(0 22px 35px #000b); }
.iphone-video-frame video { position: absolute; inset: 1.7% 3%; width: 94%; height: 96.6%; object-fit: cover; border-radius: 19px; }
.iphone-video-frame img { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.iphone-video-frame .iphone-video-motion { display: none; inset: 1.7% 3%; width: 94%; height: 96.6%; object-fit: cover; border-radius: 19px; }
.iphone-video-frame.motion-fallback video { display: none; }
.iphone-video-frame.motion-fallback .iphone-video-motion { display: block; }
.story-card.in-view .iphone-video-frame { animation: story-art-enter 1.1s cubic-bezier(.16,.82,.22,1) both; }
.story-art { display: grid; place-items: center; background: radial-gradient(circle at 45% 44%, #1c445b, #0a1c2b 70%); }
.story-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.story-card.in-view .story-art img { animation: story-art-enter 1.5s cubic-bezier(.16,.82,.22,1) both; }
.story-card.in-view .story-copy { animation: story-copy-enter .65s ease both; }
.recordings-stage { flex: 1; min-height: 0; position: relative; overflow: hidden; }
.recordings-device { position: absolute; left: 2%; top: 50%; width: 96%; aspect-ratio: 1848 / 1430; transform: translateY(-50%); filter: drop-shadow(0 20px 30px #0008); }
.recordings-device img { display: block; width: 100%; height: 100%; }
.recordings-focus { position: absolute; border: 2px solid #83d8ff; border-radius: 11px; box-shadow: 0 0 18px #83d8ff88; opacity: 0; }
.recordings-focus-row { left: 42.4%; top: 32.4%; width: 51.5%; height: 7.7%; border-radius: 16px; }
.recordings-focus-preview { left: 5.2%; top: 23.4%; width: 33.7%; height: 30%; }
.recordings-focus-share { left: 5.2%; top: 60.2%; width: 6%; height: 3.4%; border-radius: 24px; }
.recordings-caption { position: absolute; z-index: 2; left: 7%; right: 7%; bottom: 22px; padding: 12px 15px; border: 1px solid #81d5ff66; border-radius: 11px; background: #071622e8; color: #e2f5ff; font-size: clamp(.85rem, 3.5cqw, 1.08rem); line-height: 1.25; font-weight: 750; text-align: center; opacity: 0; }
.story-card.in-view .recordings-device { animation: recordings-device-loop 12s ease-in-out infinite both; }
.story-card.in-view .recordings-focus-row { animation: recordings-row 12s ease-in-out infinite both; }
.story-card.in-view .recordings-focus-preview { animation: recordings-preview 12s ease-in-out infinite both; }
.story-card.in-view .recordings-focus-share { animation: recordings-share 12s ease-in-out infinite both; }
.story-card.in-view .recordings-caption-find { animation: recordings-row 12s ease-in-out infinite both; }
.story-card.in-view .recordings-caption-review { animation: recordings-preview 12s ease-in-out infinite both; }
.story-card.in-view .recordings-caption-share { animation: recordings-share 12s ease-in-out infinite both; }
@keyframes recordings-device-loop { 0% { opacity: 0; transform: translate(5%, -47%) scale(.92); } 8%, 22% { opacity: 1; transform: translate(0, -50%) scale(1); } 30%, 39% { opacity: 1; transform: translate(-10%, -50%) scale(1.25); } 48%, 57% { opacity: 1; transform: translate(12%, -50%) scale(1.27); } 67%, 77% { opacity: 1; transform: translate(87%, -67%) scale(2.2); } 83%, 97% { opacity: 1; transform: translate(0, -50%) scale(1); } 100% { opacity: 0; transform: translate(5%, -47%) scale(.92); } }
@keyframes recordings-row { 0%, 22% { opacity: 0; } 27%, 39% { opacity: 1; } 43%, 100% { opacity: 0; } }
@keyframes recordings-preview { 0%, 43% { opacity: 0; } 48%, 57% { opacity: 1; } 61%, 100% { opacity: 0; } }
@keyframes recordings-share { 0%, 62% { opacity: 0; } 67%, 77% { opacity: 1; } 81%, 100% { opacity: 0; } }
.scripts-stage { flex: 1; min-height: 0; height: 520px; position: relative; overflow: hidden; container-type: inline-size; background: radial-gradient(circle at 42% 38%, #1a4258, #0a1b2b 72%); }
.scripts-scene { position: absolute; inset: 0; opacity: 0; }
.scripts-scene-project { opacity: 1; }
.scripts-scene img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: left top; transform-origin: left top; }
.scripts-scene:not(.scripts-scene-phone) > img { inset: 100px auto auto 5%; width: 110%; height: calc(100% - 90px); max-width: none; box-shadow: 0 16px 32px #0009; }
.scripts-scene .scripts-image-wide { display: none; }
.scripts-ipad-device { position: absolute; top: 100px; left: 5%; width: 90%; aspect-ratio: 2300 / 3000; filter: drop-shadow(0 18px 26px #0009); }
.scripts-scene .scripts-ipad-screen { left: 5.130435%; top: 4.133333%; width: 89.73913%; height: 91.733333%; object-fit: fill; border-radius: 1.94% / 1.45%; }
.scripts-scene .scripts-ipad-bezel { inset: 0; width: 100%; height: 100%; object-fit: fill; pointer-events: none; }
.scripts-scene:not(.scripts-scene-phone) .scripts-caption { top: 12px; bottom: auto; }
@container (min-width: 400px) {
  .scripts-scene .scripts-image-narrow { display: none; }
  .scripts-scene .scripts-image-wide { display: block; }
}
.scripts-phone-device { position: absolute; top: 2%; left: 50%; height: 135%; aspect-ratio: 1013 / 2098; transform: translateX(-50%); }
.scripts-scene-phone .scripts-phone-screen { inset: 1.6% 2.5%; width: 95%; height: 96.8%; object-fit: fill; border-radius: 8% / 4%; }
.scripts-scene-phone .scripts-phone-bezel { inset: 0; width: 100%; height: 100%; object-fit: fill; pointer-events: none; }
.scripts-caption { position: absolute; left: 17px; right: 17px; bottom: 17px; display: grid; gap: 3px; padding: 13px 16px; border: 1px solid #78cfff66; border-radius: 13px; background: #071725e8; box-shadow: 0 14px 35px #0008; }
.scripts-caption span { color: var(--blue); font-size: .72rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.scripts-caption strong { color: #f4f8ff; font-size: clamp(1rem, 3.8cqw, 1.35rem); line-height: 1.15; }
.scripts-caption small { color: #bfd1dd; font-size: .8rem; line-height: 1.3; }
.story-card.in-view .scripts-scene-pin { animation: scripts-pin 22s ease-in-out infinite; }
.story-card.in-view .scripts-scene-import { animation: scripts-import 22s ease-in-out infinite; }
.story-card.in-view .scripts-scene-export { animation: scripts-export 22s ease-in-out infinite; }
.story-card.in-view .scripts-scene-phone { animation: scripts-phone 22s ease-in-out infinite; }
.story-card.in-view .scripts-scene-project { animation: scripts-project 22s ease-in-out infinite; }
.story-card.in-view .scripts-scene img { animation: scripts-pan 22s ease-in-out infinite alternate; }
.story-card.in-view .scripts-scene-phone img { animation: none; }
.story-card.in-view .scripts-ipad-device img { animation: none; }
@keyframes scripts-pin { 0%, 17% { opacity: 1; } 19%, 100% { opacity: 0; } }
@keyframes scripts-import { 0%, 19% { opacity: 0; } 21%, 37% { opacity: 1; } 39%, 100% { opacity: 0; } }
@keyframes scripts-export { 0%, 39% { opacity: 0; } 41%, 57% { opacity: 1; } 59%, 100% { opacity: 0; } }
@keyframes scripts-phone { 0%, 59% { opacity: 0; } 61%, 77% { opacity: 1; } 79%, 100% { opacity: 0; } }
@keyframes scripts-project { 0%, 79% { opacity: 0; } 81%, 98% { opacity: 1; } 100% { opacity: 0; } }
@keyframes scripts-pan { from { transform: translate(0, 0) scale(1.01); } to { transform: translate(0, -1%) scale(1.04); } }
.settings-stage { flex: 1; min-height: 0; height: 520px; position: relative; overflow: hidden; background: radial-gradient(circle at 38% 44%, #17394d, #0b1d2d 72%); }
.settings-device { position: absolute; top: 8%; left: 5%; width: 136%; aspect-ratio: 2300 / 3000; filter: drop-shadow(0 24px 25px #0009); transform-origin: top left; }
.settings-screen { position: absolute; left: 5.130435%; top: 4.133333%; width: 89.73913%; height: 91.733333%; overflow: hidden; border-radius: 1.94% / 1.45%; background: #050a11; }
.settings-bezel { position: absolute; inset: 0; z-index: 20; display: block; width: 100%; height: 100%; pointer-events: none; }
.settings-shot { position: absolute; inset: 0; width: 100%; height: auto; display: block; opacity: 0; }
.settings-shot-final { opacity: 1; }
.settings-thumb { position: absolute; z-index: 2; width: 4.17%; height: auto; opacity: 0; }
.settings-margin-thumb { left: 33.72%; top: 14.83%; }
.settings-zoom-thumb { left: 45.35%; top: 21.51%; }
.settings-value { position: absolute; z-index: 3; right: 2%; padding: 0 2px; color: #99999e; background: #2d2d2f; font-size: clamp(9px, 2.2cqw, 14px); line-height: 1.3; opacity: 0; }
.settings-margin-value { top: 12.36%; }
.settings-zoom-value { top: 19.04%; }
.settings-margin-fill, .settings-zoom-fill { position: absolute; z-index: 1; height: .44%; border-radius: 99px; background: #80d4ff; transform-origin: left center; opacity: 0; }
.settings-margin-fill { left: 33.19%; top: 15.66%; width: 21.8%; }
.settings-zoom-fill { left: 33.91%; top: 22.38%; width: 27.3%; height: .44%; background: #89d5fe; }
.settings-margin-result { position: absolute; left: 50%; top: 50%; width: 94%; aspect-ratio: 3000 / 2300; filter: drop-shadow(0 18px 21px #0009); transform: translate(-50%, -50%); opacity: 0; }
.settings-margin-result .settings-screen { left: 4.133333%; top: 5.130435%; width: 91.733333%; height: 89.73913%; border-radius: 1.45% / 1.94%; }
.settings-margin-result img { display: block; width: 100%; height: 100%; }
.settings-caption { position: absolute; z-index: 5; left: 7%; right: 7%; bottom: 22px; padding: 12px 15px; border: 1px solid #81d5ff66; border-radius: 11px; background: #071622e8; color: #e2f5ff; font-size: clamp(.85rem, 3.5cqw, 1.08rem); line-height: 1.25; font-weight: 750; text-align: center; opacity: 0; }
.story-card.in-view .settings-device { animation: settings-device-loop 20s ease-in-out infinite both; }
.story-card.in-view .settings-shot-sliders { animation: settings-sliders 20s steps(1) infinite both; }
.story-card.in-view .settings-margin-thumb { animation: settings-margin-move 20s ease-in-out infinite both; }
.story-card.in-view .settings-zoom-thumb { animation: settings-zoom-move 20s ease-in-out infinite both; }
.story-card.in-view .settings-margin-fill { animation: settings-margin-fill 20s ease-in-out infinite both; }
.story-card.in-view .settings-zoom-fill { animation: settings-fill 20s ease-in-out infinite both; }
.story-card.in-view .settings-margin-value { animation: settings-margin-value 20s steps(1) infinite both; }
.story-card.in-view .settings-zoom-value { animation: settings-zoom-value 20s steps(1) infinite both; }
.story-card.in-view .settings-margin-result { animation: settings-margin-result 20s ease-in-out infinite both; }
.story-card.in-view .settings-shot-countdown-option { animation: settings-countdown-option 20s ease-in-out infinite both; }
.story-card.in-view .settings-shot-three { animation: settings-three 20s steps(1) infinite both; }
.story-card.in-view .settings-shot-two { animation: settings-two 20s steps(1) infinite both; }
.story-card.in-view .settings-shot-one { animation: settings-one 20s steps(1) infinite both; }
.story-card.in-view .settings-shot-light-option { animation: settings-light-option 20s ease-in-out infinite both; }
.story-card.in-view .settings-shot-light { animation: settings-light 20s ease-in-out infinite both; }
.story-card.in-view .settings-shot-final { animation: settings-final 20s steps(1) infinite both; }
.story-card.in-view .settings-caption-size { animation: settings-caption-size 20s ease-in-out infinite both; }
.story-card.in-view .settings-caption-countdown { animation: settings-caption-countdown 20s ease-in-out infinite both; }
.story-card.in-view .settings-caption-light { animation: settings-caption-light 20s ease-in-out infinite both; }
@keyframes settings-device-loop { 0% { opacity: 0; transform: translateY(28px) scale(.96); } 4% { opacity: 1; transform: none; } 13%, 18% { opacity: 1; transform: translateX(-29%); } 20%, 30% { opacity: 0; transform: scale(.52); } 33%, 39% { opacity: 1; transform: translateX(-29%); } 41%, 54% { opacity: 1; transform: translateX(15%) scale(.43); } 59%, 64% { opacity: 1; transform: translateX(-29%); } 67%, 79% { opacity: 1; transform: translateX(8%) scale(.5); } 81%, 97% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(10px); } }
@keyframes settings-sliders { 0%, 18% { opacity: 1; } 19%, 100% { opacity: 0; } }
@keyframes settings-margin-move { 0%, 2% { opacity: 1; transform: none; } 10%, 18% { opacity: 1; transform: translateX(180%); } 19%, 100% { opacity: 0; transform: translateX(180%); } }
@keyframes settings-zoom-move { 0%, 9% { opacity: 1; transform: none; } 17%, 18% { opacity: 1; transform: translateX(330%); } 19%, 100% { opacity: 0; transform: translateX(330%); } }
@keyframes settings-margin-fill { 0%, 2% { opacity: 1; transform: scaleX(.12); } 10%, 18% { opacity: 1; transform: scaleX(.46); } 19%, 100% { opacity: 0; transform: scaleX(.46); } }
@keyframes settings-fill { 0%, 9% { opacity: 1; transform: scaleX(.4); } 17%, 18% { opacity: 1; transform: scaleX(1); } 19%, 100% { opacity: 0; transform: scaleX(1); } }
@keyframes settings-margin-value { 0%, 9% { opacity: 0; } 10%, 18% { opacity: 1; } 19%, 100% { opacity: 0; } }
@keyframes settings-zoom-value { 0%, 16% { opacity: 0; } 17%, 18% { opacity: 1; } 19%, 100% { opacity: 0; } }
@keyframes settings-margin-result { 0%, 19% { opacity: 0; transform: translate(-50%, -50%) scale(.94); } 21%, 29% { opacity: 1; transform: translate(-50%, -50%) scale(1); } 32%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(1); } }
@keyframes settings-countdown-option { 0%, 31% { opacity: 0; } 33%, 39% { opacity: 1; } 41%, 100% { opacity: 0; } }
@keyframes settings-three { 0%, 40% { opacity: 0; } 41%, 45% { opacity: 1; } 46%, 100% { opacity: 0; } }
@keyframes settings-two { 0%, 45% { opacity: 0; } 46%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes settings-one { 0%, 49% { opacity: 0; } 50%, 53% { opacity: 1; } 54%, 100% { opacity: 0; } }
@keyframes settings-light-option { 0%, 53% { opacity: 0; } 55%, 64% { opacity: 1; } 66%, 100% { opacity: 0; } }
@keyframes settings-light { 0%, 65% { opacity: 0; } 67%, 79% { opacity: 1; } 81%, 100% { opacity: 0; } }
@keyframes settings-final { 0%, 80% { opacity: 0; } 81%, 100% { opacity: 1; } }
@keyframes settings-caption-size { 0%, 3%, 31%, 100% { opacity: 0; } 5%, 27% { opacity: 1; } }
@keyframes settings-caption-countdown { 0%, 32%, 55%, 100% { opacity: 0; } 34%, 52% { opacity: 1; } }
@keyframes settings-caption-light { 0%, 55%, 81%, 100% { opacity: 0; } 58%, 77% { opacity: 1; } }
.monitor-stage { background: radial-gradient(circle at 40% 58%, #1b4359, #0b1d2d 70%); }
.monitor-stage > img { position: absolute; display: block; max-width: none; height: auto; filter: drop-shadow(0 20px 26px #0008); }
.monitor-prompter { width: min(60%, 320px); left: 38%; top: 12%; }
.monitor-screen { width: min(88%, 440px); left: 4%; bottom: 4%; }
.monitor-camera { position: absolute; left: 72%; top: 24%; height: 61%; aspect-ratio: 3000 / 1470; }
.monitor-camera img { display: block; width: 100%; height: 100%; filter: drop-shadow(0 20px 26px #0008); }
.monitor-camera-light { position: absolute; left: 5.35%; top: 47%; width: 8px; height: 8px; border-radius: 50%; background: #3cff72; box-shadow: 0 0 5px #3cff72, 0 0 17px 7px #3cff7299; transform: translate(-50%, -50%); opacity: 0; }
.monitor-link { position: absolute; z-index: 4; right: calc(94.65% + 10px); top: 41.2%; width: 17cqw; height: 20px; transform: translateY(-50%); pointer-events: none; }
.monitor-link::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 3px; transform: translateY(-50%); background: repeating-linear-gradient(to right, #83d8ff 0 7px, transparent 7px 15px); opacity: 0; }
.monitor-link::after { content: ""; position: absolute; left: calc(100% - 15px); top: 50%; transform: translateY(-50%); border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-right: 15px solid #83d8ff; opacity: 0; }
.monitor-caption { position: absolute; z-index: 5; top: 6%; left: 5%; width: 32%; color: #d9f2ff; font-size: clamp(.9rem, 3.3cqw, 1.15rem); line-height: 1.25; font-weight: 750; text-shadow: 0 2px 15px #00111e; opacity: 0; }
.story-card.in-view .monitor-prompter { animation: monitor-prompter-arrive 12s cubic-bezier(.2,.8,.2,1) infinite both; }
.story-card.in-view .monitor-screen { animation: monitor-screen-arrive 12s cubic-bezier(.2,.8,.2,1) infinite both; }
.story-card.in-view .monitor-camera { animation: monitor-camera-arrive 12s cubic-bezier(.2,.8,.2,1) infinite both; }
.story-card.in-view .monitor-camera-light { animation: monitor-camera-light 12s ease-in-out infinite both; }
.story-card.in-view .monitor-link::before { animation: monitor-line-draw 12s ease-in-out infinite both; }
.story-card.in-view .monitor-link::after { animation: monitor-arrow-travel 12s ease-in-out infinite both; }
.story-card.in-view .monitor-caption-prompter { animation: monitor-caption-one 12s ease-in-out infinite both; }
.story-card.in-view .monitor-caption-screen { animation: monitor-caption-two 12s ease-in-out infinite both; }
.story-card.in-view .monitor-caption-camera { animation: monitor-caption-three 12s ease-in-out infinite both; }
@keyframes monitor-prompter-arrive { 0% { opacity: 0; transform: translateX(-110%); } 16%, 92% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateX(-6%); } }
@keyframes monitor-screen-arrive { 0%, 24% { opacity: 0; transform: translateY(115%); } 42%, 92% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(6%); } }
@keyframes monitor-camera-arrive { 0%, 46% { opacity: 0; transform: translateX(110%); } 63%, 92% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateX(12%); } }
@keyframes monitor-camera-light { 0%, 63% { opacity: 0; } 66%, 92% { opacity: 1; } 100% { opacity: 0; } }
@keyframes monitor-line-draw { 0%, 66% { opacity: 0; clip-path: inset(0 0 0 100%); } 67% { opacity: 1; clip-path: inset(0 0 0 100%); } 80%, 92% { opacity: 1; clip-path: inset(0 0 0 0); } 100% { opacity: 0; clip-path: inset(0 0 0 0); } }
@keyframes monitor-arrow-travel { 0%, 66% { opacity: 0; left: calc(100% - 15px); } 67% { opacity: 1; left: calc(100% - 15px); } 80%, 92% { opacity: 1; left: 0; } 100% { opacity: 0; left: 0; } }
@keyframes monitor-caption-one { 0%, 7% { opacity: 0; transform: translateY(8px); } 11%, 25% { opacity: 1; transform: none; } 30%, 100% { opacity: 0; transform: translateY(-8px); } }
@keyframes monitor-caption-two { 0%, 32% { opacity: 0; transform: translateY(8px); } 37%, 54% { opacity: 1; transform: none; } 59%, 100% { opacity: 0; transform: translateY(-8px); } }
@keyframes monitor-caption-three { 0%, 65% { opacity: 0; transform: translateY(8px); } 70%, 92% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-8px); } }
.remote-stage { background: radial-gradient(circle at 50% 48%, #1b445d, #0b1d2d 72%); }
.remote-phone { position: absolute; left: 50%; bottom: 5%; height: 90%; aspect-ratio: 1013 / 2098; transform: translateX(-50%); filter: drop-shadow(0 22px 30px #0009); }
.remote-screen { position: absolute; inset: 1.7% 3%; overflow: hidden; border-radius: 10% / 4.7%; }
.remote-screen img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; }
.remote-screen img:not(:first-child) { opacity: 0; }
.remote-bezel { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.remote-tap { position: absolute; z-index: 2; width: 18%; aspect-ratio: 1; border: 2px solid #9cdeff; border-radius: 50%; opacity: 0; box-shadow: 0 0 0 7px #77cfff33, 0 0 28px #77cfff; transform: translate(-50%, -50%) scale(.35); pointer-events: none; }
.remote-listen-tap { left: 50%; top: 69%; }
.remote-menu-tap { left: 93%; top: 8%; }
.remote-wide { position: absolute; left: 50%; top: 50%; width: 93%; aspect-ratio: 2098 / 1013; opacity: 0; filter: drop-shadow(0 22px 30px #0009); transform: translate(-50%, -40%) rotate(-12deg) scale(.7); }
.remote-wide-screen { position: absolute; inset: 3% 1.7%; overflow: hidden; border-radius: 4.7% / 10%; }
.remote-wide img { display: block; width: 100%; height: 100%; }
.remote-wide .remote-wide-bezel { position: absolute; left: 50%; top: 50%; width: 48.28408%; height: 207.1076%; max-width: none; transform: translate(-50%, -50%) rotate(90deg); pointer-events: none; }
.story-card.in-view .remote-phone { animation: remote-portrait 12s ease-in-out infinite; }
.story-card.in-view .remote-listening { animation: remote-listening 12s steps(1) infinite; }
.story-card.in-view .remote-follow-one { animation: remote-follow-one 12s steps(1) infinite; }
.story-card.in-view .remote-follow-two { animation: remote-follow-two 12s steps(1) infinite; }
.story-card.in-view .remote-follow-three { animation: remote-follow-three 12s steps(1) infinite; }
.story-card.in-view .remote-follow-four { animation: remote-follow-four 12s steps(1) infinite; }
.story-card.in-view .remote-settings { animation: remote-menu 12s steps(1) infinite; }
.story-card.in-view .remote-listen-tap { animation: remote-listen-tap 12s ease-out infinite; }
.story-card.in-view .remote-menu-tap { animation: remote-menu-tap 12s ease-out infinite; }
.story-card.in-view .remote-wide { animation: remote-wide 12s cubic-bezier(.2,.8,.2,1) infinite; }
@keyframes remote-portrait { 0%, 70% { opacity: 1; transform: translateX(-50%) scale(1); } 78%, 92% { opacity: 0; transform: translateX(-50%) scale(.6) rotate(12deg); } 100% { opacity: 1; transform: translateX(-50%) scale(1); } }
@keyframes remote-listening { 0%, 12% { opacity: 0; } 13%, 21% { opacity: 1; } 22%, 100% { opacity: 0; } }
@keyframes remote-follow-one { 0%, 21% { opacity: 0; } 22%, 31% { opacity: 1; } 32%, 100% { opacity: 0; } }
@keyframes remote-follow-two { 0%, 31% { opacity: 0; } 32%, 41% { opacity: 1; } 42%, 100% { opacity: 0; } }
@keyframes remote-follow-three { 0%, 41% { opacity: 0; } 42%, 51% { opacity: 1; } 52%, 100% { opacity: 0; } }
@keyframes remote-follow-four { 0%, 51% { opacity: 0; } 52%, 61% { opacity: 1; } 62%, 100% { opacity: 0; } }
@keyframes remote-menu { 0%, 61% { opacity: 0; } 62%, 72% { opacity: 1; } 73%, 100% { opacity: 0; } }
@keyframes remote-listen-tap { 0%, 8%, 14%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.35); } 10% { opacity: 1; transform: translate(-50%, -50%) scale(.7); } 13% { opacity: 0; transform: translate(-50%, -50%) scale(1.25); } }
@keyframes remote-menu-tap { 0%, 58%, 64%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.35); } 60% { opacity: 1; transform: translate(-50%, -50%) scale(.7); } 63% { opacity: 0; transform: translate(-50%, -50%) scale(1.25); } }
@keyframes remote-wide { 0%, 70% { opacity: 0; transform: translate(-50%, -40%) rotate(-12deg) scale(.7); } 79%, 91% { opacity: 1; transform: translate(-50%, -50%) rotate(0) scale(1); } 100% { opacity: 0; transform: translate(-50%, -55%) rotate(8deg) scale(.8); } }
.session-stage { perspective: 1000px; background: radial-gradient(circle at 50% 50%, #1d4258, #0b1d2d 74%); }
.session-stage img { position: absolute; top: 50%; left: 50%; display: block; width: auto; height: auto; max-height: calc(100% - 24px); backface-visibility: hidden; filter: drop-shadow(0 24px 26px #0008); }
.session-connect { max-width: min(88%, 700px); transform: translate(-50%, -50%); }
.session-devices { max-width: min(95%, 960px); opacity: 0; transform: translate3d(5%, -50%, -320px); }
.story-card.in-view .session-connect { animation: session-connect-orbit 14s ease-in-out infinite; }
.story-card.in-view .session-devices { animation: session-devices-orbit 14s ease-in-out infinite; }
@keyframes session-connect-orbit {
  0%, 18% { opacity: 1; transform: translate3d(-50%, -50%, 0); animation-timing-function: cubic-bezier(.16, 1, .3, 1); }
  22% { opacity: .65; }
  24%, 81% { opacity: 0; transform: translate3d(-110%, -50%, -320px); animation-timing-function: cubic-bezier(.16, 1, .3, 1); }
  84% { opacity: .35; }
  87%, 100% { opacity: 1; transform: translate3d(-50%, -50%, 0); }
}
@keyframes session-devices-orbit {
  0%, 20% { opacity: 0; transform: translate3d(5%, -50%, -320px); animation-timing-function: cubic-bezier(.16, 1, .3, 1); }
  23% { opacity: .35; }
  25%, 38% { opacity: 1; transform: translate3d(-50%, -50%, 0); }
  52% { opacity: 1; transform: translate(33%, -38%) scale(2.3); }
  65% { opacity: 1; transform: translate(33%, -62%) scale(2.3); }
  77%, 81% { opacity: 1; transform: translate3d(-50%, -50%, 0); animation-timing-function: cubic-bezier(.16, 1, .3, 1); }
  84% { opacity: .65; }
  87%, 100% { opacity: 0; transform: translate3d(5%, -50%, -320px); }
}
.story-controls { display: flex; align-items: center; justify-content: center; gap: 18px; padding-top: 16px; }
.story-arrow { width: 40px; height: 40px; border: 1px solid #8cd9ff66; border-radius: 50%; background: #102c41; color: #e8f7ff; font-size: 1.8rem; line-height: 1; cursor: pointer; }
.story-arrow:hover { background: #256185; }
.story-dots { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 9px; }
.story-dots button { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 99px; background: #7195aa; cursor: pointer; transition: width .3s, background .3s; }
.story-dots button.is-active { width: 28px; background: var(--blue); }
.feature-section { padding-top: 34px; }
.feature-heading, .connected-heading { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 35px; margin-bottom: 42px; }
.feature-heading h2, .connected-heading h2, .meeting-copy h2 { margin-bottom: 0; }
.feature-heading > p, .connected-heading > p { color: var(--muted); font-size: clamp(1.1rem, 1.8vw, 1.35rem); max-width: 530px; }
.feature-visual { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 26px; background: #08131c; box-shadow: 0 26px 80px #0005; }
.feature-visual img { width: 100%; height: auto; }
.follow-visual { isolation: isolate; }
.follow-visual .follow-frame { width: 100%; }
.follow-frame:not(:first-child) { position: absolute; inset: 0; }
.follow-frame-two { animation: follow-second 4.2s ease-in-out infinite; }
.follow-frame-three { animation: follow-third 4.2s ease-in-out infinite; }
.follow-mobile, .follow-tablet { display: none; }
.follow-mobile, .follow-tablet { height: 100%; place-items: center; background: radial-gradient(circle at 50% 50%, #1d5069, #0a1c2c 70%); }
.follow-phone-device, .follow-ipad-device { position: relative; filter: drop-shadow(0 22px 35px #000b); }
.follow-phone-device { width: min(50%, 205px); max-height: calc(100% - 32px); aspect-ratio: 1013 / 2098; }
.follow-ipad-device { height: calc(100% - 36px); max-height: 520px; aspect-ratio: 2300 / 3000; }
.follow-phone-device img, .follow-ipad-device img { position: absolute; display: block; max-width: none; }
.follow-phone-device .follow-screen-first, .follow-phone-device .follow-screen-second { inset: 1.7% 3%; width: 94%; height: 96.6%; object-fit: cover; border-radius: 19px; }
.follow-phone-bezel { inset: 0; width: 100%; height: 100%; pointer-events: none; }
.follow-ipad-device .follow-screen-first, .follow-ipad-device .follow-screen-second { inset: 4.2% 5.1%; width: 89.8%; height: 91.6%; object-fit: cover; border-radius: 4%; }
.follow-ipad-bezel { left: -15.217%; top: 11.667%; width: 130.434%; height: 76.667%; transform: rotate(90deg); pointer-events: none; }
.follow-screen-first { animation: mobile-follow-base 3.6s ease-in-out infinite; }
.follow-screen-second { animation: mobile-follow 3.6s ease-in-out infinite; }
.feature-footnote { color: #91a5b6; font-size: .85rem; margin: 14px 0 0; }
.hands-artboard { position: relative; width: 100%; aspect-ratio: 1320 / 2868; transform: translateY(-22%); }
.hands-device { position: absolute; left: 10.453%; top: 22.366%; width: 79.17%; aspect-ratio: 1045.04655 / 2126.54006; filter: drop-shadow(0 18px 26px #0009); }
.hands-device img { position: absolute; display: block; max-width: none; }
.hands-screen { left: 5.193%; top: 2.125%; width: 89.913%; height: 96.126%; border-radius: 8% / 4%; }
.hands-bezel { inset: 0; width: 100%; height: 100%; pointer-events: none; }
.hands-cues { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.hands-cue { opacity: 0; }
.hands-bubble { fill: #17394c; stroke: #83d4ff77; stroke-width: 3; }
.hands-cue text { fill: #e9f7ff; font: 500 46px -apple-system, BlinkMacSystemFont, sans-serif; }
.hands-dash { fill: none; stroke: #9de2ff; stroke-width: 7; stroke-dasharray: 10 12; filter: drop-shadow(0 0 4px #83d4ff); }
.hands-dot { fill: #83d4ff; }
.hands-expand { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 10%; background: transparent; color: #e9f7ff; cursor: zoom-in; }
.hands-expand[aria-busy="true"] { cursor: progress; }
.hands-expand:focus-visible { outline-offset: -5px; }
html.artwork-expanded { overflow: hidden; }
.artwork-expanded .story-card *, .artwork-preparing .story-card * { animation-play-state: paused !important; }
.artwork-expanded .art-source-hidden { opacity: 0 !important; }
#artwork-viewer { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 40px 16px; border: 0; background: transparent; color: var(--ink); overflow: hidden; }
#artwork-viewer[open] { display: grid; place-items: center; }
#artwork-viewer::backdrop { background: #020812c9; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.artwork-expanded-art { position: relative; width: min(100%, calc((100dvh - 80px) * .58407), 900px); aspect-ratio: 1320 / 2260; }
#artwork-viewer .hands-artboard { position: absolute; top: -26.5487%; width: 100%; transform: none; visibility: visible; }
#artwork-viewer .hands-cue { opacity: 1; }
#artwork-viewer .hands-line-reveal { transform: none; }
.artwork-viewer-close { position: absolute; top: max(16px, env(safe-area-inset-top)); right: max(20px, env(safe-area-inset-right)); width: 44px; height: 44px; border: 1px solid #ffffff40; border-radius: 50%; background: #102537; color: #fff; font-size: 1.3rem; cursor: pointer; }
.artwork-expanded-art.art-composite { width: min(100%, calc((100dvh - 80px) * var(--art-ratio)), 1600px); aspect-ratio: var(--art-ratio); }
.art-full-size { position: absolute; left: 0; top: 0; transform-origin: top left; }
.art-full-size > img { display: block; width: 100%; height: 100%; }
#artwork-viewer .art-full-size, #artwork-viewer .art-full-size * { animation: none !important; transition-property: none !important; }
[data-art-key] { cursor: zoom-in; }
.art-keyboard-trigger { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); border: 0; }
.art-keyboard-trigger:focus-visible { z-index: 30; inset: auto 16px 16px; width: auto; height: auto; padding: 12px 18px; clip-path: none; border: 1px solid #83d4ff; border-radius: 12px; background: #102537; color: #fff; }
.story-card:has(.art-keyboard-trigger:focus-visible) * { animation-play-state: paused !important; }
.hands-line-reveal { transform-box: fill-box; transform-origin: center top; transform: scaleY(0); }
.story-card.in-view .hands-artboard { animation: phone-pan 10s ease-in-out 1s infinite; }
.story-card.in-view .hands-cue-stop { animation: hands-cue-appear 10s ease-in-out 1s infinite; }
.story-card.in-view .hands-cue-record { animation: hands-cue-appear-record 10s ease-in-out 1s infinite; }
.story-card.in-view .hands-stop-reveal { animation: hands-draw-stop 10s ease-in-out 1s infinite; }
.story-card.in-view .hands-record-reveal { animation: hands-draw-record 10s ease-in-out 1s infinite; }
.ipad-stage svg { display: block; width: 100%; height: 100%; }
.ipad-mobile-art { display: none; }
.ipad-portrait, .ipad-landscape { transform-box: fill-box; transform-origin: center; }
.story-card.in-view .ipad-portrait { animation: ipad-portrait-story 8.8s ease-in-out infinite both; }
.story-card.in-view .ipad-landscape { animation: ipad-landscape-story 8.8s ease-in-out infinite both; }
.connected-section { background: linear-gradient(to bottom, #08131d00 70%, #08131d), radial-gradient(circle at 50% 20%, #1b4259, #0a1b29 66%, #08131d); border-top: 1px solid var(--line); }
.connected-section .section-shell { padding-bottom: clamp(45px, 5vw, 70px); }
.connected-section.restarting .production-visual { opacity: 0; }
.production-flow { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.production-status { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.production-status > span { padding: 7px 13px; border: 1px solid #76d5ff55; border-radius: 999px; color: #d3eeff; background: #071b2b; font-size: .8rem; font-weight: 700; }
.production-status .status-sync { animation: status-glow 3.6s ease-in-out infinite; }
.production-status .status-host { animation: status-glow 3.6s ease-in-out infinite -1.8s; }
.record-dot { display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 50%; background: #ff5d6d; box-shadow: 0 0 9px #ff5d6d; }
.flow-step { flex: 1; min-width: 0; padding: 16px 20px; border: 1px solid #8ad9ff5c; border-radius: 16px; background: #092033; display: flex; justify-content: space-between; gap: 10px; align-items: center; animation: role-glow 3.6s ease-in-out infinite; }
.flow-step:nth-child(3) { animation-delay: -2.4s; }
.flow-step:nth-child(5) { animation-delay: -1.2s; }
.flow-step strong { font-size: 1.16rem; }
.flow-step span { color: #9fdcff; }
.flow-link { flex: 0 0 5%; color: var(--blue); text-align: center; }
.flow-link::after { content: "+"; font-size: 1.5rem; line-height: 1; }
.production-visual { position: relative; overflow: hidden; border: 1px solid #7acaf747; border-radius: 26px; background: radial-gradient(circle at 25% 65%, #153448, #091723 64%, #06111c); }
.production-narration { position: relative; height: 155px; color: #d8f2ff; }
.production-narration p { position: absolute; top: 25px; left: 4%; max-width: 660px; margin: 0; opacity: 0; }
.production-narration strong, .production-narration span { display: block; }
.production-narration strong { color: #83d4ff; font-size: clamp(1.45rem, 2.3vw, 2.3rem); letter-spacing: -.035em; line-height: 1.08; }
.production-narration span { margin-top: 11px; font-size: clamp(1rem, 1.5vw, 1.25rem); font-weight: 650; }
.production-narration .narration-ipad { left: auto; right: 4%; text-align: right; }
.production-desktop { display: block; width: 100%; height: auto; overflow: visible; }
.production-mobile { display: none; }
.arrival-label { fill: #83d4ff; font: 47px -apple-system, BlinkMacSystemFont, sans-serif; text-anchor: middle; }
.connection { fill: #83d4ff; stroke: #83d4ff; stroke-width: 3; }
.connection path:first-of-type { fill: none; stroke-dasharray: 12 10; }
.connection path.script-target { fill: none; stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 0 6px #83d4ff88); }
.line-reveal { transform-box: fill-box; transform-origin: left center; }
.phone-cue, .ipad-cue { fill: none; stroke: #83d4ff; stroke-width: 5; stroke-dasharray: 14 11; opacity: 0; }
.phone-cue-tip { fill: #83d4ff; stroke: none; }
.phone-cue-reveal { transform-box: fill-box; transform-origin: center top; }
.ipad-cue-reveal { transform-box: fill-box; transform-origin: right center; }
.mobile-camera-focus, .mobile-group-phone-cue, .mobile-preview-cue, .mobile-script-cue { display: none; }
.production-visual.in-view .arrival-mac { animation: mac-arrive .85s cubic-bezier(.16,.9,.24,1) .2s both, mac-depart .7s ease 16.3s forwards; }
.production-visual.in-view .label-mac { animation: label-arrive .4s ease 1.05s both, scene-fade-out .7s ease 16.3s forwards; }
.production-visual.in-view .narration-mac { animation: narration 3.1s ease 1.15s both; }
.production-visual.in-view .arrival-ipad { animation: ipad-arrive .85s cubic-bezier(.16,.9,.24,1) 4.35s both, ipad-depart .7s ease 16.3s forwards; }
.production-visual.in-view .label-ipad { animation: label-arrive .4s ease 5.2s both, scene-fade-out .7s ease 16.3s forwards; }
.production-visual.in-view .narration-ipad { animation: narration 3.1s ease 5.35s both; }
.production-visual.in-view .ipad-cue { animation: phone-cue-visible 3.1s ease 5.35s both; }
.production-visual.in-view .ipad-cue-reveal { animation: line-grow .9s ease 5.5s both; }
.production-visual.in-view .arrival-iphone { transform-box: fill-box; transform-origin: center; animation: iphone-arrive .85s cubic-bezier(.16,.9,.24,1) 8.55s both, phone-focus 1.3s cubic-bezier(.16,.9,.24,1) 16.7s forwards; }
.production-visual.in-view .label-iphone { animation: label-arrive .4s ease 9.4s both, scene-fade-out .7s ease 16.3s forwards; }
.production-visual.in-view .narration-iphone { animation: narration 3.1s ease 9.55s both; }
.production-visual.in-view .phone-cue { animation: phone-cue-visible 3.1s ease 9.55s both; }
.production-visual.in-view .phone-cue-reveal { animation: line-down .9s ease 9.7s both; }
.production-visual.in-view .line-top { animation: line-grow .7s ease 12.8s both; }
.production-visual.in-view .script-target { animation: script-target-draw .65s ease 13.5s both; }
.production-visual.in-view .line-bottom { animation: line-grow .8s ease 13s both; }
.production-visual.in-view .narration-connected { animation: narration 3.5s ease 12.8s both; }
.production-visual.in-view .connection { animation: scene-fade-out .7s ease 16.3s forwards; }
.production-transfer { position: absolute; inset: 155px 0 0; pointer-events: none; }
.transfer-progress { position: absolute; z-index: 5; left: 43%; top: 30%; width: 43%; padding: 24px 28px; border: 1px solid #83d4ff80; border-radius: 12px; background: #09283d; box-shadow: 0 24px 65px #0009; color: #e9f8ff; font-weight: 750; opacity: 0; }
.transfer-progress small { display: block; margin-top: 9px; color: #9bdcff; font-size: .75rem; }
.receive-track { display: block; height: 5px; margin-top: 7px; border-radius: 9px; background: #345469; overflow: hidden; }
.receive-track span { display: block; height: 100%; width: 100%; background: #83d4ff; }
.transfer-line { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 4; }
.transfer-line-mobile { display: none; }
.transfer-line path:first-child { fill: none; stroke: #83d4ff; stroke-width: 3; stroke-dasharray: 10 8; }
.transfer-line path:last-child { fill: #83d4ff; }
.transfer-line-reveal { transform-box: fill-box; transform-origin: left center; }
.transfer-window { position: absolute; left: 46%; top: 19%; width: 50%; z-index: 2; filter: drop-shadow(0 25px 45px #000a); opacity: 0; }
.transfer-window img { width: 100%; }
.take-target { position: absolute; box-sizing: border-box; left: .8%; top: 22.6%; width: 48.4%; height: 11%; border: 2px solid #83d4ff; border-radius: 11px; box-shadow: 0 0 24px #55caff88; }
.transfer-ready { position: absolute; z-index: 3; top: -60px; left: 46%; right: 4%; color: #d8f2ff; opacity: 0; }
.transfer-ready strong { display: block; color: #83d4ff; font-size: clamp(1.4rem, 2.25vw, 2.35rem); line-height: 1.1; letter-spacing: -.035em; }
.transfer-ready span { display: block; margin-top: 12px; font-size: clamp(.95rem, 1.25vw, 1.15rem); font-weight: 650; line-height: 1.35; }
.production-visual.in-view .transfer-progress { animation: transfer-progress 4s ease 19.2s both; }
.production-visual.in-view .receive-track span { animation: receive-fill 2.8s ease 19.7s both; }
.production-visual.in-view .transfer-line-reveal { animation: line-grow .8s ease 23.6s both; }
.production-visual.in-view .transfer-window { animation: takes-window-enter 1.2s cubic-bezier(.16,.82,.22,1) 24.3s both; }
.production-visual.in-view .take-target { animation: target-glow .55s ease 25.45s both; }
.production-visual.in-view .transfer-ready { animation: label-arrive .65s ease 25.5s both; }
.connected-aside { color: #c5d9e7; margin: 14px 0 0; text-align: center; }
.meeting-section.section-shell { display: flow-root; position: relative; z-index: 1; max-width: none; padding: 0 0 clamp(80px, 9vw, 130px); background: linear-gradient(#08131d, #102739 46%, #07131e); }
.meeting-stage-viewport { position: relative; margin: -5vw 0 -25vw; overflow: hidden; }
.meeting-demo { position: relative; width: 125vw; aspect-ratio: 3042 / 1965; margin-left: 50%; transform: translateX(-50%) scale(var(--meeting-scale, 1)); transform-origin: center top; }
.camera-cue { position: absolute; top: 65%; left: 50%; width: 1px; height: 1px; pointer-events: none; }
.meeting-screen { position: absolute; left: 12.55%; top: 11.6%; width: 77.5%; height: 73.3%; overflow: hidden; border-radius: 1.2%; background: linear-gradient(145deg, #1b496e, #173651 58%, #0c1b31); }
.meeting-screen video { display: block; width: 100%; height: auto; aspect-ratio: 5 / 3; pointer-events: none; }
.meeting-laptop { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; pointer-events: none; }
.camera-indicator { position: absolute; z-index: 4; left: 51.85%; top: 9.16%; width: clamp(7px, .75vw, 15px); aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: #03080c; }
.meeting-section.camera-on .camera-indicator { animation: camera-on 1.25s ease both; }
.meeting-copy { display: grid; grid-template-columns: 1fr .8fr; align-items: end; gap: 50px; max-width: 1220px; margin: 0 auto; padding: clamp(35px, 5vw, 70px) clamp(20px, 4vw, 64px) clamp(50px, 7vw, 100px); }
.meeting-copy > p { color: var(--muted); font-size: clamp(1.05rem, 1.6vw, 1.25rem); max-width: 510px; margin: 0 0 6px; }
.mini-window { position: absolute; left: 24%; top: 61%; width: 54%; aspect-ratio: 1120 / 448; filter: drop-shadow(0 18px 22px #000b); pointer-events: none; }
.mini-window img { display: block; width: 100%; height: 100%; }
.mini-window img + img { position: absolute; inset: 0; opacity: 0; }
.mini-title-hit { position: absolute; z-index: 1; inset: 0 0 auto; height: 11%; pointer-events: auto; }
.meeting-pointer { position: absolute; width: 4%; left: 39%; top: 66%; filter: drop-shadow(0 2px 3px #000a); }
.meeting-hint { position: absolute; left: 3%; top: 4%; max-width: 54%; margin: 0; padding: 8px 12px; border-radius: 7px; background: #071624dc; color: #eaf7ff; font-size: clamp(.75rem, 1vw, .9rem); font-weight: 750; }
.meeting-section.in-view .mini-window { animation: mini-position 9s ease-in-out infinite; }
.meeting-section.in-view .mini-idle { animation: mini-idle-show 9s ease-in-out infinite; }
.meeting-section.in-view .mini-controls { animation: mini-controls-show 9s ease-in-out infinite; }
.meeting-section.in-view .mini-ghost { animation: mini-ghost-show 9s ease-in-out infinite; }
.meeting-section.in-view .meeting-pointer { animation: mini-pointer 9s ease-in-out infinite; }
.meeting-section.in-view .meeting-hint { animation: meeting-hint 9s ease-in-out infinite; }
.meeting-section.in-view .meeting-screen.pointer-follow .mini-window { animation: none; opacity: 1; transform: none; left: var(--mini-left); top: var(--mini-top); }
.meeting-section.in-view .meeting-screen.pointer-follow .mini-idle { animation: none; opacity: 0; }
.meeting-section.in-view .meeting-screen.pointer-follow .mini-controls { animation: none; opacity: 1; }
.meeting-section.in-view .meeting-screen.pointer-follow .mini-ghost, .meeting-section.in-view .meeting-screen.pointer-follow .meeting-pointer { animation: none; opacity: 0; }
.meeting-section.in-view .meeting-screen.magnet-entering .mini-window { transition: left .5s cubic-bezier(.16,.88,.2,1), top .5s cubic-bezier(.16,.88,.2,1); }
.meeting-section.in-view .meeting-screen.magnet-follow .mini-window { transition: left .09s ease-out, top .09s ease-out; }
.meeting-screen.pointer-return .mini-window { animation: none !important; opacity: 1; transform: none; left: var(--mini-left); top: var(--mini-top); transition: left .55s cubic-bezier(.2,.75,.25,1), top .55s cubic-bezier(.2,.75,.25,1); }
.meeting-screen.pointer-return .mini-idle { animation: none !important; opacity: 1; }
.meeting-screen.pointer-return .mini-controls, .meeting-screen.pointer-return .mini-ghost { animation: none !important; opacity: 0; }
.meeting-section.in-view .meeting-screen.mini-resumed .mini-window, .meeting-section.in-view .meeting-screen.mini-resumed .mini-window img, .meeting-section.in-view .meeting-screen.mini-resumed .meeting-pointer { animation-delay: -2.8s; }
.plans-section { text-align: center; border-top: 1px solid var(--line); }
.plans-heading { max-width: 850px; margin: 0 auto 38px; }
.plans-heading h2 { font-size: clamp(2.7rem, 4.4vw, 4.5rem); margin-bottom: 16px; }
.plans-heading > p:last-child { color: var(--muted); font-size: 1.12rem; }
.plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; text-align: left; margin-bottom: 34px; }
.plan-card { display: flex; flex-direction: column; background: #0d2232; border: 1px solid var(--line); border-radius: 22px; padding: 26px; }
.plan-pro { background: linear-gradient(145deg, #164562, #0d2436 65%); border-color: #6cc8f188; }
.plan-card h3 { font-size: 2rem; margin-bottom: 5px; }
.plan-tagline { color: var(--blue); font-weight: 750; }
.plan-price { margin: 14px 0 0; font-size: 2rem; font-weight: 800; line-height: 1.2; }
.plan-price span { color: var(--muted); font-size: .9rem; font-weight: 500; }
.plan-billing, .plan-offer { margin: 6px 0 0; color: #c5d9e7; font-size: .88rem; }
.plan-card ul { padding-left: 20px; margin: 16px 0; }
.plan-card li { margin: 0 0 10px; }
.plan-note { margin-top: auto; color: #a9c3d2; font-size: .87rem; }
.comparison-link { display: block; width: fit-content; margin: 0 auto 26px; color: var(--blue); font-weight: 750; }
.comparison-link:hover { color: #bdeaff; text-decoration: underline; }
.app-store-badge { display: block; width: fit-content; margin: 0 auto; }
.app-store-badge img { display: block; width: auto; height: 60px; }
.plans-small { margin: 16px auto 0; color: #8ea7b8; font-size: .82rem; }
.plans-small + .plans-small { margin-top: 4px; }
.comparison-page { padding-top: 140px; }
.comparison-page h1 { font-size: clamp(2.7rem, 5vw, 4.5rem); margin-bottom: 16px; }
.comparison-page .lead { margin: 0 0 24px; }
.comparison-back { display: inline-block; margin-bottom: 24px; color: var(--blue); font-weight: 700; }
.comparison-back:hover { text-decoration: underline; }
.comparison-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 20px; background: #0d2232; }
.comparison-table { width: 100%; min-width: 720px; border-collapse: collapse; text-align: left; }
.comparison-table th, .comparison-table td { padding: 13px 16px; border-bottom: 1px solid var(--line); vertical-align: top; }
.comparison-table thead th { background: #16364b; }
.comparison-table th[scope="row"] { width: 45%; font-weight: 700; }
.comparison-table th[scope="row"] small { display: block; margin-top: 4px; color: var(--muted); font-size: .85rem; font-weight: 400; }
.comparison-table td:nth-child(n+3), .comparison-table thead th:nth-child(n+3) { width: 10%; text-align: center; white-space: nowrap; }
.comparison-table .comparison-group th { padding-top: 20px; background: #102b40; color: var(--blue); font-size: 1.05rem; }
.comparison-table tbody:last-child tr:last-child th, .comparison-table tbody:last-child tr:last-child td { border-bottom: 0; }
.comparison-no { color: #9aafbd; }
.comparison-limited { color: #ffdca0; }
.comparison-hint { color: var(--muted); font-size: .88rem; }
@media (max-width: 650px) {
  .mobile-break { display: inline; }
  .comparison-page { padding-top: 110px; }
  .comparison-table { min-width: 0; }
  .comparison-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .comparison-table tbody, .comparison-table .comparison-group, .comparison-table .comparison-group th { display: block; }
  .comparison-table tbody tr:not(.comparison-group) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .comparison-table tr:not(.comparison-group) th[scope="row"], .comparison-table tr:not(.comparison-group) td:nth-child(2) { grid-column: 1 / -1; width: auto; border-bottom: 0; }
  .comparison-table tr:not(.comparison-group) th[scope="row"] { padding-bottom: 4px; }
  .comparison-table tr:not(.comparison-group) td:nth-child(2) { padding-top: 0; color: var(--muted); }
  .comparison-table tr:not(.comparison-group) td:nth-child(n+3) { width: auto; padding-top: 4px; text-align: left; white-space: normal; }
  .comparison-table td:nth-child(3)::before { content: "Free"; }
  .comparison-table td:nth-child(4)::before { content: "Studio"; }
  .comparison-table td:nth-child(5)::before { content: "Pro"; }
  .comparison-table td:nth-child(n+3)::before { display: block; color: var(--muted); font-size: .75rem; font-weight: 700; }
}
.footer { border-top: 1px solid var(--line); background: #050e16; }
.footer-inner { max-width: 1320px; margin: auto; padding: 35px clamp(20px, 4vw, 64px); display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.footer-inner div { display: flex; gap: 18px; font-size: .9rem; }
.footer-inner p { margin: 0; color: #93aabc; font-size: .85rem; }
.footer-inner .apple-credit { flex-basis: 100%; font-size: .72rem; }
@keyframes result-pulse { 0%, 100% { border-color: #74ccf98c; box-shadow: 0 14px 40px #0009; } 55% { border-color: #b5ecff; box-shadow: 0 0 30px #54caff77; } }
@keyframes follow-second { 0%, 27%, 68%, 100% { opacity: 0; } 33%, 62% { opacity: 1; } }
@keyframes follow-third { 0%, 60%, 100% { opacity: 0; } 68%, 93% { opacity: 1; } }
@keyframes status-glow { 0%, 100% { background: #071b2b; } 50% { background: #195176; } }
@keyframes role-glow { 0%, 30%, 100% { background: #092033; box-shadow: none; } 12% { background: #1b597a; box-shadow: 0 0 24px #53c9ff66; } }
@keyframes story-copy-enter { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes story-art-enter { from { opacity: 0; transform: translate(55px, 45px) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes phone-pan { 0%, 8%, 100% { transform: translateY(-22%); } 32%, 75% { transform: translateY(-47%); } }
@keyframes hands-cue-appear { 0%, 35%, 78%, 100% { opacity: 0; } 41%, 72% { opacity: 1; } }
@keyframes hands-cue-appear-record { 0%, 41%, 78%, 100% { opacity: 0; } 47%, 72% { opacity: 1; } }
@keyframes hands-draw-stop { 0%, 41% { transform: scaleY(0); } 51%, 75% { transform: scaleY(1); } 78%, 100% { transform: scaleY(0); } }
@keyframes hands-draw-record { 0%, 47% { transform: scaleY(0); } 57%, 75% { transform: scaleY(1); } 78%, 100% { transform: scaleY(0); } }
@keyframes ipad-portrait-story {
  0% { opacity: 0; transform: translate(-90px, 30px) scale(.94); }
  19%, 44% { opacity: 1; transform: none; }
  76% { opacity: 1; transform: translate(12px, -14px) scale(1.025); }
  92%, 96% { opacity: 1; transform: none; }
  100% { opacity: 0; transform: none; }
}
@keyframes ipad-landscape-story {
  0%, 21% { opacity: 0; transform: translate(100px, 85px) scale(.92); }
  40%, 44% { opacity: 1; transform: none; }
  76% { opacity: 1; transform: translate(-10px, -8px) scale(1.04); }
  92%, 96% { opacity: 1; transform: none; }
  100% { opacity: 0; transform: none; }
}
@keyframes mac-arrive { from { opacity: 0; transform: translate(1400px, -260px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes ipad-arrive { from { opacity: 0; transform: translate(-1300px, 130px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes iphone-arrive { from { opacity: 0; transform: translate(-760px, 160px) scale(.88); } to { opacity: 1; transform: none; } }
@keyframes mac-depart { from { opacity: 1; transform: none; } to { opacity: 0; transform: translate(110px, -25px) scale(.97); } }
@keyframes ipad-depart { from { opacity: 1; transform: none; } to { opacity: 0; transform: translate(-110px, 25px) scale(.97); } }
@keyframes phone-focus { from { transform: none; } to { transform: translate(281.5px, -333.4px) scale(2.15); } }
@keyframes phone-focus-mobile { from { transform: none; } to { transform: translate(-130px, -195px) scale(1.65); } }
@keyframes mobile-stage-grow { from { min-height: 685px; } to { min-height: 960px; } }
@keyframes portrait-phone-focus { from { transform: none; } to { transform: translate(-85%, -130%) scale(1.25); } }
@keyframes scene-fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes label-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes narration { 0%, 100% { opacity: 0; transform: translateY(8px); } 12%, 84% { opacity: 1; transform: none; } }
@keyframes phone-cue-visible { 0%, 5%, 100% { opacity: 0; } 12%, 84% { opacity: 1; } }
@keyframes phone-cue-mobile { 0%, 5%, 100% { opacity: 0; transform: scaleY(0); } 26%, 84% { opacity: 1; transform: scaleY(1); } }
@keyframes mobile-devices-dim { 0%, 100% { opacity: 1; } 12%, 88% { opacity: 0; } }
@keyframes mobile-camera-focus { 0%, 100% { opacity: 0; transform: translate(-50%, 15px); } 15%, 85% { opacity: 1; transform: translate(-50%, 0); } }
@keyframes line-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes script-target-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes mobile-target-draw { from { stroke-dashoffset: 200px; } to { stroke-dashoffset: 0; } }
@keyframes line-down { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes transfer-progress { 0%, 100% { opacity: 0; transform: scale(.75); } 16%, 73% { opacity: 1; transform: scale(1.08); } 86% { opacity: 1; transform: scale(1); } }
@keyframes takes-window-enter { from { opacity: 0; transform: translateX(170px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes target-glow { from { opacity: 0; transform: scale(1.03); } to { opacity: 1; transform: none; } }
@keyframes receive-fill { from { transform: scaleX(0); transform-origin: left; } to { transform: scaleX(1); transform-origin: left; } }
@keyframes mini-position { 0%, 5% { opacity: 0; transform: translate(55%, -42%) scale(.9); } 15% { opacity: 1; transform: translate(20%, -22%) scale(.96); } 31%, 88% { opacity: 1; transform: none; } 100% { opacity: 0; transform: none; } }
@keyframes mini-pointer { 0%, 8% { opacity: 0; transform: translate(520%, -150%); } 18% { opacity: 1; transform: translate(150%, -35%); } 31%, 42% { opacity: 1; transform: none; } 55%, 73% { opacity: 1; transform: translate(650%, 320%); } 85%, 100% { opacity: 0; transform: translate(650%, 320%); } }
@keyframes mini-idle-show { 0%, 56%, 92%, 100% { opacity: 1; } 64%, 86% { opacity: 0; } }
@keyframes mini-controls-show { 0%, 38%, 63%, 100% { opacity: 0; } 45%, 57% { opacity: 1; } }
@keyframes mini-ghost-show { 0%, 56%, 92%, 100% { opacity: 0; } 64%, 86% { opacity: 1; } }
@keyframes meeting-hint { 0%, 8%, 83%, 100% { opacity: 0; } 15%, 70% { opacity: 1; } }
@keyframes camera-on { 0%, 15% { background: #03080c; box-shadow: none; } 55%, 100% { background: #42f26c; box-shadow: 0 0 7px 2px #50ff78bb; } }
@media (max-width: 1499px) {
  .stories-section { --card-size: calc((100% - 40px)/3); }
}
@media (max-width: 1050px) {
  .stories-section { --card-size: calc((100% - 20px)/2); }
}
@media (min-width: 651px) and (max-width: 1050px) and (orientation: portrait) and (any-pointer: coarse) {
  .stories-section { --card-size: 100%; }
  .story-card-featured { flex-basis: 100%; }
}
@media (max-width: 900px) {
  .nav { min-height: 66px; }
  .video-hero { min-height: 670px; }
  .hero-shade { background: linear-gradient(0deg, rgba(3,8,16,.94), rgba(3,8,16,.32) 66%, rgba(3,8,16,.18)); }
  .hero-content { width: auto; margin: auto 20px 90px; padding-top: 80px; align-self: flex-end; }
  .hero-content h1 { font-size: clamp(3.2rem, 10vw, 5.5rem); }
  .feature-heading, .connected-heading { grid-template-columns: 1fr; }
  .feature-heading, .connected-heading { gap: 18px; }
  .meeting-copy { grid-template-columns: 1fr; gap: 24px; }
  .scroll-cue { left: 20px; transform: none; }
}
@media (max-width: 900px) and (orientation: portrait) {
  .video-hero { --hero-background-blur: 6px; }
  .hero-actions .button-secondary { display: none; }
  .hero-actions { justify-content: space-between; flex-wrap: nowrap; }
  .hero-actions .button-primary { height: 50px; white-space: nowrap; }
  .video-hero .hero-play { bottom: 90px; right: 20px; height: 50px; font-size: .9rem; }
  .hero-background, .hero-poster { transform: scale(1.04); }
  .hero-poster { filter: blur(6px); }
  .hero-shade { background: linear-gradient(180deg, rgba(3,8,16,.2), rgba(3,8,16,.78) 35%, rgba(3,8,16,.88) 70%, rgba(3,8,16,.94)); }
}
@media (orientation: landscape) and (max-height: 600px) {
  .video-hero { min-height: 620px; }
}
@media (max-width: 650px) {
  .stories-section { --card-size: 100%; }
  .brand { font-size: 1rem; }
  .nav-download { padding: 8px 12px; font-size: .82rem; }
  .video-hero { min-height: 620px; }
  .hero-content > p:not(.eyebrow) { font-size: 1.1rem; }
  .hero-actions { gap: 8px; }
  .button { min-height: 46px; padding: 10px 16px; font-size: .9rem; }
  .hero-play { bottom: 22px; right: 18px; }
  .scroll-cue { bottom: 29px; font-size: .6rem; }
  .section-shell { padding-top: 68px; padding-bottom: 68px; }
  .feature-section { padding-top: 20px; }
  .follow-visual > .follow-frame { display: none; }
  .follow-mobile { display: grid; }
  .plan-grid { grid-template-columns: 1fr; }
  .story-card { height: 735px; }
  .story-card-featured { flex-basis: 100%; }
  .story-copy { flex-basis: 315px; }
  .story-copy h3 { font-size: clamp(2rem, 9vw, 4rem); }
  .story-video, .story-art, .phone-pan, .ipad-stage, .remote-stage, .session-stage, .settings-stage, .scripts-stage { height: 455px; }
  .production-flow { gap: 5px; }
  .flow-step { display: block; padding: 10px; text-align: center; }
  .flow-step strong, .flow-step span { display: block; font-size: .77rem; }
  .flow-link { flex-basis: 3%; }
  .production-desktop { display: none; }
  .production-narration { height: 200px; }
  .production-narration p, .production-narration .narration-ipad, .production-narration .narration-iphone { left: 5%; right: 5%; max-width: none; text-align: center; }
  .production-narration strong { font-size: clamp(1.35rem, 6vw, 1.8rem); }
  .production-narration span { font-size: .95rem; }
  .production-mobile { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: 6px; padding: 22px 12px; }
  .production-mobile > div:first-child { grid-column: 1 / -1; }
  .production-mobile img { margin: auto; max-height: 240px; width: auto; object-fit: contain; }
  .production-mobile .mobile-mac { max-height: 210px; max-width: 100%; }
  .production-mobile span { display: block; padding-top: 4px; color: #83d4ff; font-size: .8rem; font-weight: 700; text-align: center; }
  .production-visual.in-view .mobile-mac { animation: mac-mobile-arrive .85s cubic-bezier(.16,.9,.24,1) .2s both; }
  .production-visual.in-view .mobile-ipad { animation: ipad-mobile-arrive .85s cubic-bezier(.16,.9,.24,1) 4.35s both; }
  .production-visual.in-view .mobile-iphone { animation: iphone-mobile-arrive .85s cubic-bezier(.16,.9,.24,1) 8.55s both; }
  .production-visual.in-view .production-mobile > div:first-child { animation: scene-fade-out .7s ease 16.3s forwards; }
  .production-visual.in-view .production-mobile > div:nth-child(2) { animation: scene-fade-out .7s ease 16.3s forwards; }
  .production-visual.in-view .production-mobile > div:first-child span { animation: label-arrive .4s ease 1.05s both; }
  .production-visual.in-view .production-mobile > div:nth-child(2) span { animation: label-arrive .4s ease 5.2s both; }
  .production-visual.in-view .production-mobile > div:nth-child(3) span { animation: label-arrive .4s ease 9.4s both, scene-fade-out .7s ease 16.3s forwards; }
  .production-transfer { inset: 145px 0 0; }
  .transfer-progress { left: 17%; top: 48%; width: 66%; padding: 15px; font-size: .78rem; }
  .transfer-line { display: none; }
  .transfer-line-mobile { display: block; position: absolute; inset: 0; width: 100%; height: 100%; z-index: 4; }
  .transfer-line-mobile path:first-child { fill: none; stroke: #83d4ff; stroke-width: 2; stroke-dasharray: 7 6; }
  .transfer-line-mobile path:last-child { fill: #83d4ff; }
  .transfer-mobile-reveal { transform-box: fill-box; transform-origin: center top; }
  .production-visual.in-view .transfer-mobile-reveal { animation: line-down .8s ease 23.6s both; }
  .transfer-window { left: 3%; top: 57%; width: 94%; }
  .transfer-ready { top: 27%; left: 5%; right: 5%; text-align: center; }
  .transfer-ready strong { font-size: clamp(1.35rem, 6vw, 1.8rem); }
  .transfer-ready span { font-size: .9rem; margin-top: 8px; }
  .meeting-stage-viewport { margin-top: -6.4vw; margin-bottom: -32vw; }
  .meeting-demo { width: 160vw; }
  .meeting-copy { padding-top: 54px; padding-bottom: 34px; }
  .mini-window { width: 62%; left: 18%; top: 60%; }
}
@media (max-width: 650px) and (orientation: landscape) {
  .mobile-camera-focus { display: block; position: absolute; z-index: 3; left: 50%; top: 220px; height: 240px; aspect-ratio: 365 / 760; opacity: 0; }
  .mobile-camera-focus img { display: block; width: 100%; height: 100%; object-fit: contain; }
  .mobile-phone-cue { position: absolute; left: 50%; top: -75px; height: 73px; border-left: 2px dashed #83d4ff; transform-origin: center top; opacity: 0; }
  .mobile-phone-cue::after { content: ""; position: absolute; left: -7px; bottom: -1px; border: 6px solid transparent; border-top: 10px solid #83d4ff; }
  .production-visual.in-view { animation: mobile-stage-grow 1.2s ease 16.3s forwards; }
  .production-visual.in-view .production-mobile { animation: mobile-devices-dim 3.4s ease 9.3s both; }
  .production-visual.in-view .mobile-camera-focus { animation: mobile-camera-focus 3.4s ease 9.3s both; }
  .production-visual.in-view .mobile-iphone { animation: iphone-mobile-arrive .85s cubic-bezier(.16,.9,.24,1) 8.55s both, phone-focus-mobile 1.3s cubic-bezier(.16,.9,.24,1) 16.7s forwards; }
  .production-visual.in-view .mobile-phone-cue { animation: phone-cue-mobile 3.1s ease 9.55s both; }
}
@media (max-width: 650px) and (orientation: portrait) {
  .production-visual { height: clamp(650px, 190vw, 740px); }
  .production-narration { height: 150px; }
  .production-mobile > div { position: relative; }
  .production-visual.in-view .production-mobile > div:nth-child(3) { transform-origin: center top; animation: portrait-phone-focus 1.3s cubic-bezier(.16,.9,.24,1) 16.7s forwards, scene-fade-out .7s ease 27.2s forwards; }
  .production-visual.in-view .transfer-mobile-reveal { animation: line-down .8s ease 25s both; }
  .production-visual.in-view .transfer-line-mobile { animation: scene-fade-out .7s ease 27.2s forwards; }
  .production-visual.in-view .transfer-ready { animation: label-arrive .65s ease 27.7s both; }
  .production-transfer { inset: 0; }
  .transfer-progress { top: 56%; }
  .transfer-window { top: 54%; }
  .transfer-ready { top: 22%; }
  .transfer-line-mobile path:first-child { stroke-width: 1.25; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
  .take-target { border-width: 1.25px; border-radius: 3px; box-shadow: 0 0 8px #55caff88; }
  .mobile-group-phone-cue { display: block; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0; }
  .mobile-group-phone-cue path:first-child { fill: none; stroke: #83d4ff; stroke-width: 1.25; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
  .mobile-group-phone-cue path:last-child { fill: #83d4ff; }
  .mobile-group-phone-reveal { transform-box: fill-box; transform-origin: center top; }
  .production-visual.in-view .mobile-group-phone-cue { animation: phone-cue-visible 3.1s ease 9.55s both; }
  .production-visual.in-view .mobile-group-phone-reveal { animation: line-down .9s ease 9.7s both; }
  .mobile-preview-cue, .mobile-script-cue { display: block; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0; overflow: visible; }
  .mobile-cue-dash { fill: none; stroke: #83d4ff; stroke-width: 1.25; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
  .mobile-cue-target { fill: none; stroke: #83d4ff; stroke-width: 1.25; stroke-dasharray: 200px; stroke-dashoffset: 200px; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 3px #83d4ff99); }
  .mobile-preview-reveal, .mobile-script-reveal { transform-box: fill-box; transform-origin: center bottom; }
  .mobile-script-reveal { transform-origin: center top; }
  .production-visual.in-view .mobile-preview-cue, .production-visual.in-view .mobile-script-cue { animation: phone-cue-visible 3.5s ease 12.8s both; }
  .production-visual.in-view .mobile-preview-reveal { animation: line-down .7s ease 13s both; }
  .production-visual.in-view .mobile-script-reveal { animation: line-down .9s ease 13.45s both; }
  .production-visual.in-view .mobile-cue-target { animation: mobile-target-draw .65s ease 12.8s both; }
}
@media (min-width: 651px) and (min-height: 600px) and (any-pointer: coarse) {
  .follow-visual > .follow-frame { display: none; }
  .follow-tablet { display: grid; }
  #speech-follow .demo-choices { position: relative; order: 1; bottom: auto; left: auto; right: auto; flex: 0 0 auto; padding: 12px; background: #07111b; }
}
@media (min-width: 651px) and (max-height: 599px) and (orientation: landscape) and (any-pointer: coarse) {
  .follow-visual > .follow-frame { display: none; }
  .follow-mobile { display: grid; }
  .follow-phone-device { width: auto; height: calc(100% - 24px); max-height: none; }
  #speech-follow .demo-choices { position: relative; order: 1; bottom: auto; left: auto; right: auto; flex: 0 0 auto; padding: 12px; background: #07111b; }
}
@media (max-width: 650px) and (orientation: portrait) {
  .stories-section { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .story-copy { flex-basis: auto; padding: 22px 22px 24px; }
  .story-copy .eyebrow { margin-bottom: 10px; }
  .story-copy h3 { margin-bottom: 10px; }
  #speech-follow .demo-choices { position: relative; order: 1; bottom: auto; left: auto; right: auto; flex: 0 0 auto; flex-wrap: nowrap; padding: 10px 12px 12px; background: #07111b; }
  #speech-follow .demo-choices button { flex: 1 1 0; min-width: 0; min-height: 48px; justify-content: center; gap: 7px; padding: 8px 6px; text-align: center; }
  #speech-follow .demo-choices strong { font-size: clamp(.68rem, 3vw, .84rem); line-height: 1.15; }
  #speech-follow .demo-choices small { display: none; }
  .ipad-stage svg { display: none; }
  .ipad-mobile-art { display: block; position: absolute; inset: 0; }
  .ipad-mobile-art img { position: absolute; display: block; height: auto; max-width: none; filter: drop-shadow(0 16px 22px #0009); }
  .ipad-mobile-art .ipad-portrait { top: 4%; right: 6%; width: 88%; }
  .ipad-mobile-art .ipad-landscape { left: 4%; bottom: 4%; width: 71%; }
}
@keyframes mac-mobile-arrive { from { opacity: 0; transform: translate(110px, -30px) scale(.92); } to { opacity: 1; transform: none; } }
@keyframes ipad-mobile-arrive { from { opacity: 0; transform: translateX(-150px) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes iphone-mobile-arrive { from { opacity: 0; transform: translateX(110px) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes mobile-follow { 0%, 43%, 100% { opacity: 0; } 52%, 92% { opacity: 1; } }
@keyframes mobile-follow-base { 0%, 43%, 100% { opacity: 1; } 52%, 92% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .follow-frame:not(:first-child) { display: none; }
  .follow-screen-second { display: none !important; }
  .follow-screen-first { animation: none; }
  .motion-ready .reveal, .motion-ready .story-card, .motion-ready .plan-card { opacity: 1; transform: none; transition: none; }
  .meeting-demo { --meeting-scale: .7; }
  .production-narration { display: none; }
  .phone-cue, .ipad-cue, .mobile-camera-focus, .mobile-group-phone-cue, .mobile-preview-cue, .mobile-script-cue { display: none; }
  .story-card.in-view .hands-artboard, .story-card.in-view .hands-cue, .story-card.in-view .hands-line-reveal, .story-card.in-view .ipad-portrait, .story-card.in-view .ipad-landscape, .story-card.in-view .story-art img, .story-card.in-view .story-copy { animation: none; }
  .story-card.in-view .remote-phone, .story-card.in-view .remote-screen img, .story-card.in-view .remote-tap, .story-card.in-view .remote-wide { animation: none; }
  .story-card.in-view .session-stage img { animation: none; }
  .story-card.in-view .monitor-stage img, .story-card.in-view .monitor-camera, .story-card.in-view .monitor-camera-light, .story-card.in-view .monitor-link::before, .story-card.in-view .monitor-link::after, .story-card.in-view .monitor-caption { animation: none; }
  .story-card.in-view .recordings-device, .story-card.in-view .recordings-focus, .story-card.in-view .recordings-caption { animation: none; }
  .recordings-focus, .recordings-caption { display: none; }
  .story-card.in-view .settings-device, .story-card.in-view .settings-shot, .story-card.in-view .settings-thumb, .story-card.in-view .settings-margin-fill, .story-card.in-view .settings-zoom-fill, .story-card.in-view .settings-margin-result, .story-card.in-view .settings-value, .story-card.in-view .settings-caption { animation: none; }
  .story-card.in-view .scripts-scene, .story-card.in-view .scripts-scene img { animation: none; }
  .scripts-scene { opacity: 0; }
  .scripts-scene-project { opacity: 1; }
  .settings-shot-final { opacity: 1; }
  .settings-thumb, .settings-margin-fill, .settings-zoom-fill, .settings-margin-result, .settings-value, .settings-caption { display: none; }
  .monitor-caption { display: none; }
  .monitor-camera-light { opacity: 1; }
  .monitor-link::before { opacity: 1; }
  .monitor-link::after { left: 0; opacity: 1; }
  .hands-artboard { transform: translateY(-47%); }
  .hands-cue { opacity: 1; }
  .hands-line-reveal { transform: none; }
  .transfer-progress, .transfer-line, .transfer-line-mobile, .meeting-pointer { display: none; }
  .mini-window, .mini-window img { animation: none !important; opacity: 1; transform: none; }
  .mini-window img + img { opacity: 0; }
}