/* Consumer expression of the plurelinc.com identity. Consumer sections,
   app walkthrough, forms and analytics remain intact. */
:root {
  --bg-1:var(--plurel-canvas); --bg-2:var(--plurel-cream); --paper:var(--plurel-paper);
  --ink:var(--plurel-ink); --ink-2:var(--plurel-muted); --ink-3:var(--plurel-muted); --ink-4:var(--plurel-muted);
  --hair:var(--plurel-border); --hair-2:var(--plurel-control-border);
  --terra:var(--plurel-orange); --butter:var(--plurel-yellow); --mint:var(--plurel-blue-ink);
  --sans:var(--plurel-body); --serif:var(--plurel-display); --mono:var(--plurel-body);
  --dark:var(--plurel-yellow); --dark-2:var(--plurel-paper); --dark-ink:var(--plurel-ink); --dark-hair:var(--plurel-border);
}
html { scroll-padding-top:112px; -webkit-text-size-adjust:100%; }
body { font:400 16px/1.55 var(--sans); }
body::before { content:""; position:absolute; inset:0 0 auto; height:104px; background:var(--plurel-canvas); border-bottom:1px solid var(--ink); }
.logo-pill { position:absolute; top:16px; left:4vw; height:72px; padding:0; border:0; background:none; box-shadow:none; backdrop-filter:none; }
.logo-badgeSvg { display:none; }
.logo-lockupSvg { height:64px; width:114px; }
.nav-cluster { position:absolute; top:28px; right:auto; left:50%; transform:translateX(-50%); }
.nav-linksPill { background:none; border:0; box-shadow:none; backdrop-filter:none; }
.nav-linksPill a { font-size:16px; min-height:44px; display:flex; align-items:center; }
.nav-cta, .invite-submit { background:var(--terra); color:var(--ink); border:1px solid var(--ink); border-radius:6px; box-shadow:var(--plurel-shadow-action); min-height:48px; font-size:16px; }
.nav-cta:hover, .invite-submit:hover { background:var(--plurel-orange-hover); color:var(--ink); box-shadow:var(--plurel-shadow-action); }
.nav-cta:active, .invite-submit:active { transform:translateY(3px); box-shadow:none; }
.hero { max-width:1440px; padding:158px max(4vw,24px) 72px; background:var(--plurel-canvas); border-bottom:1px solid var(--ink); gap:72px; min-height:800px; }
.hero::before { display:none; }
.hero-copy { padding:24px; max-width:680px; }
.hero-badge { background:none; border:0; border-radius:0; padding:0; font-size:14px; }
.hero-badgeDot { box-shadow:none; }
.hero-splitNowTrigger, .hero-h1Stars, .deck-stickerBurst, .deck-doodleFlower, .deck-doodleSpark { display:none; }
.hero-h1 { font:400 clamp(48px,5.1vw,74px)/.98 var(--serif); letter-spacing:-.04em; margin:24px 0; }
.hero-h1 > * { display:block; }
.hero-h1 .hero-script { font:400 1.24em/.8 var(--plurel-script); letter-spacing:-.02em; padding-left:.06em; }
.hero-h1 .hero-once { display:inline-block; font:700 .88em/1.04 var(--sans); letter-spacing:-.055em; background:var(--butter); padding:2px 14px 6px 5px; margin-top:22px; }
.hero-h1 strong { font-weight:400; }
.hero-h1 .serifAccent, .hero-h1 .mutedInk { color:var(--ink); }
.hero-sub { font-size:18px; line-height:1.6; }
.hero-metaStrip { display:none; }
.invite-bar { border-radius:6px; padding:8px; gap:8px; background:var(--paper); border-color:var(--ink); box-shadow:none; }
.invite-bar input { min-width:0; font-size:16px; min-height:48px; padding-left:8px; }
.invite-feedback { font:400 14px/1.5 var(--sans); color:var(--ink-2); }
.platform-pill { background:none; border:0; padding:0; border-radius:0; font-size:14px; }
.hero-deckWrap { position:relative; height:auto; padding:58px 28px 36px; perspective:none; background:var(--plurel-blue-soft); border-radius:8px; border:1px solid var(--ink); }
.hero-deckWrap::before { content:""; position:absolute; width:88px; height:88px; top:-34px; right:20px; background:url('/brand/plurel/doodle-1.svg') center/contain no-repeat; pointer-events:none; transform:rotate(10deg); }
.hero-deckWrap::after { content:""; position:absolute; width:62px; height:62px; bottom:32px; left:-32px; background:url('/brand/plurel/doodle-4.svg') center/contain no-repeat; pointer-events:none; }
.hero-deckStage { height:auto; transform:none!important; display:grid; gap:20px; }
.hero .deck-card { position:static; width:100%; max-width:440px; margin-inline:auto; opacity:1; transform:none!important; animation:none; }
.hero .deck-card--3, .hero .deck-card--4, .hero .deck-card--5 { display:none; }
.deck-float { transform:none!important; animation:none; }
.uiCard, .hero .uiCard { border-radius:8px; border:1px solid var(--ink); box-shadow:none; transform:none!important; }
.uiCard--darkCard { position:relative; background:var(--paper); color:var(--ink); aspect-ratio:1.586; padding:28px; }
.uiCard--darkCard .uiCard-top { justify-content:flex-end; }
.uiCard--darkCard .uiCard-lockup { width:94px; height:44px; }
.uiCard--darkCard .uiCard-chip { position:absolute; left:28px; top:44%; width:42px; height:32px; }
.uiCard--darkCard .uiCard-cardMid { position:absolute; left:28px; top:65%; margin:0; }
.uiCard--darkCard .uiCard-cardFoot { position:absolute; bottom:24px; left:28px; right:28px; border:0; padding:0; }
.uiCard--darkCard :is(.uiCard-cardLabel,.uiCard-metaLabel,.uiCard-metaVal,.uiCard-brandSub) { color:var(--ink-2); }
.uiCard--darkCard .uiCard-lockup path:first-child { fill:var(--ink); }
.uiCard--darkCard .uiCard-mark, .uiCard--darkCard .uiCard-cardBal { display:none; }
.uiCard--darkCard .uiCard-walletBadge { background:var(--plurel-cream); color:var(--ink); border-color:var(--hair); }
.uiCard--darkCard .uiCard-cardFoot { border-color:var(--hair); }
.uiCard-pillMint { background:var(--plurel-blue-soft); color:var(--plurel-blue-ink); }
.uiCard-bar span { background:var(--plurel-blue-ink); }
.uiCard-chip { background:#e8cd8c; border:1px solid #8d733c; border-radius:4px; box-shadow:none; }
.blueprint-sec, .theater-sec, .moments-sec, .faq-sec { padding-block:88px; }
.blueprint-sec .sec-h2 .serifAccent, .moments-sec .serifAccent, .close-h2 .serifAccent { font-family:var(--plurel-script); font-size:1.26em; }
.sec-h2, .sec-h2 strong, .section-h2, .blueprint-h2, .moments-h2, .faq-h2, .close-h2 { font-family:var(--serif); font-weight:400; }
.dark-pod, .close-pod { background:var(--butter); color:var(--ink); border-radius:0; border-block:1px solid var(--ink); margin-inline:0; }
.close-pod { margin-inline:auto; }
.dark-pod { max-width:none; box-shadow:none; }
.dark-pod :is(.kicker,.sec-h2,.mutedInk), .bento-title { color:var(--ink); }
.serifAccent { color:var(--ink); }
.site-footer .footer-wordmarkWrap { color:var(--ink); opacity:1; max-width:420px; margin:32px 0; }
.bento-card { border:1px solid var(--ink); border-radius:8px; }
.bento-desc, .bento-num, .bento-foot { color:var(--ink-2); }
.bento-desc { font-size:16px; line-height:1.6; }
.bento-foot { gap:12px; flex-wrap:wrap; }
.theater-stageSticker, .theater-stageDoodle, .close-badgeRow, .snapshot-sticker { display:none; }
.phPrimaryBtn { color:var(--ink); border:1px solid var(--ink); border-radius:6px; }
.phInputCard, .phLinkPreview, .phRingCard { border-radius:8px; box-shadow:none; }
.phScreen--dark { background:var(--plurel-canvas); color:var(--ink); }
.phWalletCard { background:var(--paper); border:1px solid var(--ink); box-shadow:none; border-radius:8px; color:var(--ink); }
.phWalletBadge { display:none; }
.phWalletLogo svg { width:80px; height:auto; }
.phWalletLogo svg path:first-child { fill:var(--ink); }
.phWalletVisa, .phWalletBalLabel, .phWalletBot, .phWaveBox p { color:var(--ink-2); }
.phWaveBox { background:var(--paper); border-color:var(--hair); border-radius:8px; }
.theater-stepBtn, .theater-stepBtn.is-active { border-radius:8px; box-shadow:none; }
.theater-stepBtn.is-active .theater-stepNum { color:var(--plurel-blue-ink); }
.snapshot-card, .polaroid { border-radius:8px; box-shadow:none; }
.close-pod :is(.close-h2,.close-sub,.invite-feedback,.kicker) { color:var(--ink); }
.close-fan { display:none; }
.close-pod .invite-bar { background:var(--paper); border-color:var(--ink); }
.close-pod .invite-bar input { color:var(--ink); }
.close-pod .invite-bar input::placeholder { color:var(--ink-2); }
.site-footer { background:var(--plurel-canvas); border-top:1px solid var(--ink); }
button, summary { min-height:44px; }
:focus-visible { outline:3px solid var(--plurel-blue-ink); outline-offset:4px; }
@media(max-width:1000px) {
  .nav-linksPill { display:none; }
  .hero { grid-template-columns:1fr; gap:28px; padding-top:144px; }
  .hero-copy { max-width:720px; margin:auto; padding:16px; }
  .hero-deckStage { max-width:540px; margin:auto; }
  .theater-sticky { grid-template-columns:minmax(0,1fr); }
  .theater-steps, .theater-stage { min-width:0; }
  .iphone-shell { width:min(370px,100%); box-shadow:none; }
  .theater-stepBtn.is-active .theater-stepDesc { max-height:none; }
}
@media(max-width:600px) {
  body::before { height:92px; }
  .logo-pill { left:20px; top:12px; height:64px; }
  .logo-lockupSvg { height:56px; width:100px; }
  .nav-cluster { top:24px; right:20px; }
  .nav-cta { padding:10px 12px; font-size:14px; }
  .hero { padding:132px 24px 52px; }
  .hero::before { inset:112px 12px 20px; }
  .hero-copy { padding:0; }
  .hero-deckWrap { padding:40px 16px 20px; margin-top:24px; }
  .hero-deckWrap::before { width:60px; height:60px; top:-25px; right:16px; }
  .hero-deckWrap::after { display:none; }
  .hero-topRow { margin-bottom:20px; }
  .hero-badge { font-size:12px; letter-spacing:.04em; }
  .hero-h1 { font-size:clamp(40px,12vw,60px); }
  .hero-sub { font-size:16px; }
  .invite-bar { flex-direction:column; align-items:stretch; padding:10px; }
  .invite-bar input, .invite-submit { width:100%; }
  .hero .deck-card { max-width:100%; }
  .uiCard--darkCard { padding:20px; }
  .uiCard--darkCard .uiCard-chip { left:20px; top:40%; }
  .uiCard--darkCard .uiCard-cardMid { left:20px; top:63%; }
  .uiCard--darkCard .uiCard-cardFoot { left:20px; right:20px; bottom:16px; }
  .uiCard--darkCard .uiCard-walletBadge { display:none; }
  .platform-pills { gap:16px; flex-wrap:wrap; }
  .blueprint-sec, .theater-sec, .moments-sec, .faq-sec { padding-block:56px; }
}
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{animation:none!important;transition:none!important} }

/* Original company artwork, adapted to the consumer site's vertical flow. */
body::before { background:var(--butter); }
.hero {
  max-width:none; min-height:0; padding:156px max(4vw,24px) 72px;
  grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr); gap:64px;
  background:var(--butter); align-items:center;
}
.hero-copy { width:100%; max-width:850px; padding:0; min-width:0; }
.hero-topRow { margin-bottom:28px; }
.hero-badge { letter-spacing:.08em; }
.friendship-frame { display:block; width:100%; padding:28px 16px; border:1px solid var(--ink); border-radius:4px; }
.hero-h1.friendship-headline { width:100%; max-width:none; margin:0; line-height:1; }
.friendship-art { display:block; width:100%; height:auto; aspect-ratio:2075/1060; }
.hero-signup { margin-top:32px; }
.signup-label { display:block; font:400 28px/1.2 var(--serif); margin-bottom:14px; }
.hero .invite-bar { max-width:none; padding:0; border:0; background:none; gap:12px; box-shadow:none; }
.hero .invite-bar input { background:var(--plurel-canvas); border:1px solid var(--ink); border-radius:6px; padding:16px 18px; min-height:56px; }
.hero .invite-submit { display:flex; align-items:center; justify-content:center; gap:18px; min-height:56px; padding:14px 22px; white-space:nowrap; font-weight:700; }
.hero .invite-feedback { margin-top:16px; font-size:14px; }
.hero .platform-pills { margin-top:24px; gap:16px; flex-wrap:wrap; }
.hero .platform-pills a { margin-left:0!important; font-size:14px!important; min-height:44px; display:inline-flex; align-items:center; }
.consumer-pool-preview {
  display:block;
  width:100%; max-width:460px; justify-self:center; padding:28px;
  background:var(--plurel-blue-soft); border:1px solid var(--ink); border-radius:8px;
  box-shadow:4px 4px 0 var(--ink);
}
.consumer-pool-preview::before { width:64px; height:64px; top:-48px; right:10px; }
.consumer-pool-preview::after { display:none; }
.pool-preview-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:16px; }
.pool-preview-status { font-size:12px; border:1px solid var(--plurel-blue-ink); border-radius:4px; padding:4px 8px; white-space:nowrap; color:var(--plurel-blue-ink); }
.pool-preview-balance { margin:28px 0 24px; }
.pool-preview-balance>span { display:block; color:var(--ink-2); font-size:14px; }
.pool-preview-balance strong { display:block; font-size:clamp(36px,3.4vw,48px); line-height:1.15; letter-spacing:-.035em; margin-top:4px; }
.pool-preview-balance small { font-size:.6em; }
.consumer-pool-preview .uiCard--darkCard {
  width:100%; aspect-ratio:1.586; min-height:0; padding:24px;
  background:var(--plurel-canvas); border:1px solid var(--ink); border-radius:8px; overflow:hidden;
  box-shadow:0 3px 0 var(--ink);
}
.uiCard--darkCard .uiCard-top { margin:0; }
.uiCard--darkCard .uiCard-lockup { width:112px; height:auto; max-height:66px; }
.uiCard--darkCard .uiCard-chip { width:46px; height:34px; top:43%; left:24px; border:0; border-radius:0; background:none; opacity:1; }
.uiCard--darkCard .uiCard-cardFoot { left:24px; right:24px; bottom:22px; align-items:flex-end; }
.uiCard--darkCard .uiCard-metaVal { color:var(--ink); font-size:16px; letter-spacing:.08em; margin:0 0 10px; }
.uiCard--darkCard .uiCard-metaLabel { font-size:10px; letter-spacing:.1em; display:flex; gap:32px; }
.card-contactless { color:var(--ink); flex:none; }
.pool-preview-people { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:30px; }
.pool-preview-people>div { display:flex; flex-direction:column; align-items:center; gap:6px; font-size:14px; }
.pool-avatar { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--ink); border-radius:50%; background:var(--plurel-canvas); font-size:12px; }
.pool-preview-note { margin-top:24px; padding-top:18px; border-top:1px solid var(--ink); font-size:14px; text-align:center; }
.sec-head { padding-bottom:28px; border-bottom:1px solid var(--ink); }
.figure-card { background:var(--plurel-blue-soft); border:1px solid var(--ink); border-radius:8px; box-shadow:none; }
.theater-stage { background:var(--plurel-blue-soft); border:1px solid var(--ink); border-radius:8px; box-shadow:none; padding:36px 28px; }
.scrub-sec { max-width:none; padding:96px max(8vw,24px); background:var(--butter); border-block:1px solid var(--ink); }
.scrub-p { max-width:1000px; margin:28px auto 0; font-family:var(--serif); line-height:1.2; letter-spacing:-.025em; }
.scrub-word, .scrub-word.is-lit { color:var(--ink); }
.scrub-word.is-accent.is-lit { color:var(--ink); text-decoration:underline; text-decoration-color:var(--terra); text-underline-offset:8px; text-decoration-thickness:2px; }
.scrub-doodle--bl, .scrub-doodle--tr { display:none; }
.consumer-team { padding:88px max(4vw,24px); max-width:1440px; margin:auto; }
.consumer-team-heading { display:flex; align-items:center; justify-content:space-between; gap:32px; padding-bottom:30px; border-bottom:1px solid var(--ink); }
.consumer-team h2 { font:400 clamp(36px,4.2vw,60px)/1.1 var(--serif); letter-spacing:-.03em; margin-top:16px; }
.consumer-team h2 em { font-weight:400; }
.team-doodle { flex:none; width:76px; height:76px; }
.consumer-team-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; margin-top:40px; }
.consumer-person { display:flex; align-items:flex-start; flex-direction:column; min-width:0; }
.consumer-headshot { width:132px; height:132px; border-radius:50%; object-fit:cover; margin-bottom:24px; }
.consumer-person h3 { font:400 30px/1.12 var(--serif); letter-spacing:-.025em; min-height:68px; }
.consumer-role { font-size:15px; font-weight:700; min-height:48px; margin-top:10px; }
.consumer-bio { font-size:16px; color:var(--ink-2); line-height:1.6; margin:12px 0 20px; }
.consumer-person>a { display:inline-flex; align-items:center; min-height:44px; text-underline-offset:5px; text-decoration:underline; font-size:16px; margin-top:auto; }
.site-footer { max-width:none; padding:56px max(4vw,24px) 32px; }
.site-footer .footer-wordmarkWrap { max-width:280px; margin:24px 0 48px; padding:0; }
.footer-wordmarkWrap img { display:block; width:100%; height:auto; }
.footer-col a { min-height:44px; display:flex; align-items:center; font-size:15px; }
.modal-backdrop { backdrop-filter:none; -webkit-backdrop-filter:none; }
.modal-card { border:1px solid var(--ink); border-radius:8px; box-shadow:4px 4px 0 var(--ink); max-height:calc(100dvh - 40px); overflow-y:auto; }
.modal-close { width:44px; height:44px; border:1px solid var(--ink); border-radius:6px; top:16px; right:16px; }
.modal-brandHead { padding-right:40px; }
.modal-releaseBox { border-radius:6px; }
.modal-card h3 { font-family:var(--serif); }
.modal-card .invite-bar { box-shadow:none; }
.close-pod .invite-feedback.is-ok { color:var(--ink); }
.close-pod .close-launch-label { color:var(--ink); font:700 14px/1.5 var(--sans); letter-spacing:.06em; }
@media(min-width:1600px) {
  .hero { padding-inline:max(4vw,calc((100vw - 1440px)/2)); }
}
@media(max-width:1100px) {
  .hero { gap:36px; grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr); }
  .hero .invite-bar { flex-direction:column; align-items:stretch; }
  .hero .invite-submit, .hero .invite-bar input { width:100%; }
  .consumer-pool-preview { padding:22px; }
  .consumer-team-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; }
}
@media(max-width:800px) {
  .hero { grid-template-columns:minmax(0,1fr); padding:138px 24px 56px; gap:54px; }
  .hero-copy { max-width:660px; margin:auto; }
  .hero .invite-bar { flex-direction:row; }
  .hero .invite-submit { width:auto; }
  .consumer-pool-preview { max-width:440px; margin:0; padding:24px; }
  .consumer-team { padding-block:60px; }
}
@media(max-width:1000px) {
  .logo-pill { left:50%; transform:translateX(-50%); }
  .nav-cluster { top:94px; left:20px; right:20px; transform:none; justify-content:center; }
  .nav-linksPill { display:flex; flex-wrap:wrap; justify-content:center; gap:4px 14px; padding:0; }
  .nav-linksPill a { font-size:14px; padding:0 4px; }
  .hero { padding-top:216px; }
  .theater-stage { padding:32px 20px; }
}
@media(max-width:600px) {
  .hero { padding:216px 20px 48px; }
  .hero-topRow { margin-bottom:22px; }
  .friendship-frame { padding:24px 10px; }
  .hero-signup { margin-top:28px; }
  .hero .invite-bar { flex-direction:column; gap:12px; }
  .hero .invite-submit { width:100%; }
  .hero .platform-pills { column-gap:18px; row-gap:8px; }
  .consumer-pool-preview { padding:20px; }
  .consumer-pool-preview .uiCard--darkCard { padding:18px; }
  .uiCard--darkCard .uiCard-lockup { width:96px; max-height:52px; }
  .uiCard--darkCard .uiCard-chip { left:18px; width:40px; height:30px; top:40%; }
  .uiCard--darkCard .uiCard-cardFoot { left:18px; right:18px; bottom:16px; }
  .uiCard--darkCard .uiCard-metaVal { font-size:14px; letter-spacing:.03em; margin-bottom:8px; }
  .pool-preview-heading { font-size:14px; gap:8px; }
  .pool-preview-balance { margin:22px 0; }
  .pool-preview-people { gap:4px; margin-top:26px; }
  .scrub-sec { padding:72px 28px; }
  .scrub-p { font-size:34px; }
  .scrub-doodle { width:30px; }
  .scrub-doodle--tl { top:20px; left:20px; }
  .scrub-doodle--br { bottom:20px; right:20px; }
  .consumer-team-heading { gap:12px; }
  .team-doodle { width:48px; height:48px; }
  .consumer-team-grid { grid-template-columns:minmax(0,1fr); gap:32px; margin-top:32px; }
  .consumer-person { display:grid; grid-template-columns:80px minmax(0,1fr); column-gap:20px; padding-bottom:24px; border-bottom:1px solid var(--hair); }
  .consumer-headshot { width:80px; height:80px; grid-column:1; grid-row:1 / 3; margin:0; }
  .consumer-person h3 { font-size:27px; min-height:0; align-self:end; }
  .consumer-role { grid-column:2; margin-top:8px; min-height:0; font-size:14px; }
  .consumer-bio { grid-column:1 / -1; margin:20px 0 8px; }
  .consumer-person>a { grid-column:1 / -1; justify-self:start; }
  .consumer-person:last-child { border-bottom:0; padding-bottom:0; }
  .site-footer .footer-wordmarkWrap { max-width:220px; }
  .theater-sec { padding-inline:16px; }
  .theater-stage { padding:28px 12px; }
  .iphone-shell { padding:10px; border-radius:40px; }
  .iphone-screen { border-radius:30px; }
  .modal-card { padding:28px 20px; }
  .modal-brandHead { padding-right:44px; }
  .modal-releaseBox { flex-wrap:wrap; }
}

/* Device geometry designed in Figma: 426 × 898 chassis, 402 × 874 display.
   https://www.figma.com/design/03ukwawY4pa2Zc9pIczlsi?node-id=4-40
   The actual app screens stay live HTML, using the site's Plurel typeface. */
.hero { grid-template-columns:minmax(0,1fr); justify-items:center; gap:0; }
.hero-copy { max-width:900px; text-align:center; margin-inline:auto; }
.hero-topRow, .hero .platform-pills { justify-content:center; }
.hero-signup { max-width:660px; margin:32px auto 0; text-align:left; }
.hero .invite-feedback { text-align:center; }
.hero .invite-bar { flex-direction:row; }
.hero .invite-submit { width:auto; }
.theater-stage {
  --phone-bezel-total:23px;
  --stage-padding-y:36px;
  padding-block:var(--stage-padding-y);
}
@media(min-width:1025px) {
  /* The navigation is not fixed: land on the full-height walkthrough itself. */
  .theater-sec { padding-block:0; scroll-margin-top:-112px; }
  .theater-sticky { grid-template-rows:minmax(0,1fr); }
}
.iphone-shell {
  /* Fit both dimensions, reserving stage padding and 24px above/below it.
     Account for the bezel before converting display height to display width. */
  width:min(370px,calc(100% - 8px),calc((100svh - 48px - 2 * var(--stage-padding-y) - 2px - var(--phone-bezel-total)) * 402 / 874 + var(--phone-bezel-total)));
  height:auto; padding:10px;
  border:1.5px solid #777772; border-radius:54px; background:#141414;
  box-shadow:0 2px 0 #141414; flex:none;
}
.iphone-screen {
  aspect-ratio:402 / 874; height:auto; border-radius:43px;
  background:var(--plurel-canvas); isolation:isolate;
}
.iphone-content {
  position:absolute; inset:0 auto auto 0; width:346px; height:752.249px;
  transform:scale(var(--iphone-scale,1)); transform-origin:top left;
}
.iphone-shell::before, .iphone-shell::after,
.iphone-action-button, .iphone-power-button {
  content:""; position:absolute; width:3px; border-radius:2px;
  background:#555551; pointer-events:none;
}
.iphone-shell::before { left:-4px; top:18.2%; height:5.8%; }
.iphone-shell::after { left:-4px; top:25.4%; height:5.8%; }
.iphone-action-button { left:-4px; top:12.4%; height:2.7%; }
.iphone-power-button { right:-4px; top:21.2%; height:8.9%; }
.iphone-status {
  position:absolute; inset:10px 0 auto; z-index:2; height:38px;
  display:grid; grid-template-columns:1fr 110px 1fr;
  align-items:center; padding-inline:21px; color:#141414; pointer-events:none;
}
.iphone-time { font:600 14px/1 -apple-system,BlinkMacSystemFont,sans-serif; text-align:center; }
.iphone-island { display:block; width:110px; height:32px; background:#050505; border-radius:18px; position:relative; }
.iphone-island>span { position:absolute; right:10px; top:11px; width:10px; height:10px; border-radius:50%; background:#11141b; }
.iphone-status-icons { display:block; width:62px; height:16px; justify-self:center; }
.iphone-home-indicator { position:absolute; bottom:8px; left:50%; transform:translateX(-50%); width:35%; height:4px; background:#141414; border-radius:3px; z-index:2; pointer-events:none; }
.iphone-screen .phScreen { padding:72px 18px 38px; background:var(--plurel-canvas); }
.iphone-screen .phStatus { display:none; }
.iphone-screen .phBody { min-height:0; }
@media(max-width:600px) {
  .hero .invite-bar { flex-direction:column; }
  .hero .invite-submit { width:100%; }
  .theater-stage { --phone-bezel-total:21px; --stage-padding-y:30px; padding-inline:14px; }
  .iphone-shell { padding:9px; border-radius:46px; }
  .iphone-screen { border-radius:35px; }
}