/* One shared stage, one small action, then a long rest. Static is the default. */
.product-visual{margin:0;background:var(--well);display:grid;place-items:center;min-width:0;position:relative;--scene-duration:10s;--scene-ease:cubic-bezier(.22,1,.36,1)}
.scene-stage{width:100%;max-width:440px;min-height:420px;padding:32px;display:grid;align-content:center;gap:16px;color:var(--ink)}
.scene-card{min-width:0;background:var(--card);border:1px solid var(--border-strong);border-radius:10px;padding:24px;font-size:12px;line-height:1.6}
.scene-avatar{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;border-radius:8px;background:var(--well);font-size:13px;font-weight:500;color:var(--ink)}

.scene-check{flex-shrink:0;overflow:visible}.scene-check path{stroke-dasharray:1;stroke-dashoffset:0}
.source-provider{display:inline-flex;align-items:center;gap:6px;max-width:100%;color:var(--body);font-size:10px;line-height:1.7}.source-provider img{display:block;width:16px;height:16px;flex-shrink:0;object-fit:contain}.source-description{color:var(--muted)}
.aura-avatar img{mix-blend-mode:multiply}
.email-card{padding:20px 22px}.email-address{display:flex;align-items:baseline;gap:10px;font-size:10px;color:var(--muted);margin-top:16px;padding-top:12px;border-top:1px solid var(--border)}.email-address strong{font-size:12px;font-weight:500;color:var(--ink)}.email-address small{display:inline-block;font-size:11px;font-weight:400;color:var(--muted);margin-left:7px}
.email-message{margin-top:0}.email-message>span{font-size:10px;color:var(--muted)}.email-message p{font-size:14px!important;line-height:1.6;margin:3px 0 0!important;color:var(--ink)}
.aura-response{display:flex;gap:10px;padding-top:0;margin-top:14px}.aura-avatar{width:36px;height:36px;border-radius:50%;background:transparent}.aura-avatar img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}.aura-response>div{min-width:0}.aura-response strong{font-size:11px;font-weight:500}.aura-response small{margin-left:5px;font-size:10px;font-weight:400;color:var(--muted)}.aura-response p{font-size:12px!important;line-height:1.65!important;margin:3px 0 0!important;color:var(--body)}
.form-card{padding:17px 22px}.form-heading{font-size:11px;font-weight:500}.form-heading>span{font-weight:400;color:var(--muted)}.form-select{position:relative;display:flex;align-items:center;justify-content:space-between;gap:15px;background:var(--well);border:1px solid var(--border);border-radius:5px;margin-top:10px;padding:7px 10px;font-size:12px;overflow:hidden}.scene-chevron{flex-shrink:0}.form-message{font-size:10px;color:var(--muted);background:var(--well);border-radius:5px;margin-top:7px;padding:7px 10px}
/* One request is selected; its details open below without moving the list. */
.inbox-scene{gap:12px;padding:24px}
.inbox-list.scene-card{padding:0;overflow:hidden}
.inbox-list-heading{display:flex;justify-content:space-between;padding:10px 16px 8px;font-size:10px;color:var(--muted);border-bottom:1px solid var(--border)}
.inbox-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px;font-size:11px;border-left:2px solid transparent}
.inbox-row+.inbox-row{border-top:1px solid var(--border)}
.inbox-row strong{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}
.inbox-row-selected{background:var(--well);border-left-color:var(--ink)}
.inbox-detail.scene-card{padding:18px}
.inbox-detail-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.inbox-detail-heading>div>strong{display:block;font-size:17px;line-height:1.4;letter-spacing:-.025em;font-weight:500;margin-top:5px}
.inbox-detail-heading small{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.inbox-score{text-align:right;flex-shrink:0}
.inbox-score>span{display:flex;align-items:baseline;gap:2px;line-height:1;font-variant-numeric:tabular-nums}
.inbox-score b{font-size:24px;font-weight:500;letter-spacing:-.04em}
.inbox-score>span>span{font-size:10px;color:var(--muted)}
.inbox-detail .inbox-benefit{font-size:12px;line-height:1.7;color:var(--body);margin-top:12px}
.inbox-support{border-top:1px solid var(--border);margin-top:18px;padding-top:12px}
.inbox-support .inbox-support-label{font-size:10px;line-height:1.6;color:var(--muted);margin:0 0 10px}
.claim-facts{display:grid;gap:11px;margin-top:0}
.claim-fact h3{font-size:11px;font-weight:400;line-height:1.5;color:var(--body)}
.claim-fact h3 strong{font-weight:500}
.claim-fact p{font-size:10px;color:var(--muted);line-height:1.7;margin-top:4px}
.claim-receipt{margin-top:12px;font-size:10px;line-height:1.6;color:var(--muted)}

.connection-reel{--connection-panel-height:188px;height:var(--connection-panel-height);overflow:hidden}.connection-slide{height:var(--connection-panel-height)}.connection-heading{font-size:11px;color:var(--muted)}.connection-pair{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:26px;position:relative}.connection-person{min-width:0;position:relative;display:flex;align-items:center;flex-direction:column;text-align:center}
.connection-portrait{position:relative;width:96px;max-width:100%;height:112px;z-index:1}.connection-portrait img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px;background:var(--well)}
.connection-role{display:flex;align-items:center;gap:6px;position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);padding:4px 7px;border:1px solid var(--border-strong);border-radius:6px;background:var(--card);font-size:10px;line-height:1.25;min-height:34px;width:max-content;max-width:112px;text-align:left}
.company-mark{display:grid;place-items:center;width:17px;height:17px;border-radius:3px;background:var(--ink);color:var(--card);flex-shrink:0}.company-mark svg{width:14px;height:14px}
.connection-route{position:absolute;top:0;width:100%;height:112px;overflow:visible}.connection-route path{stroke-width:1;stroke-linecap:round}.route-base{stroke:var(--border)}.route-left,.route-right{stroke:var(--ink);}
.connection-consent{display:flex;align-items:center;justify-content:center;gap:7px;font-size:11px;margin-top:14px}.connection-message{background:var(--well);border-radius:6px;padding:12px;margin-top:15px;font-size:12px;text-align:center;color:var(--body)}
/* Brief selection and reveal, then a long hold. Scores never count up. */
.motion-ready .aura-response{animation:scene-reply var(--scene-duration) var(--scene-ease) infinite both paused}
.motion-ready .intake-form .scene-chevron{animation:scene-chevron var(--scene-duration) var(--scene-ease) infinite both paused}
.motion-ready .inbox-row-selected{animation:inbox-select var(--scene-duration) var(--scene-ease) infinite both paused}
.motion-ready .inbox-detail{animation:inbox-open var(--scene-duration) var(--scene-ease) infinite both paused}
.motion-ready .connection-track{animation:connection-scroll 12s var(--scene-ease) infinite both paused}
.motion-ready.is-playing *,.motion-ready.is-playing *::after{animation-play-state:running}
@keyframes scene-reply{0%,6%{transform:translateY(5px);opacity:.55}19%,94%{transform:translateY(0);opacity:1}100%{transform:translateY(5px);opacity:.55}}
@keyframes scene-chevron{0%,6%,95%,100%{transform:translateY(0)}13%{transform:translateY(3px)}22%{transform:translateY(0)}}
@keyframes inbox-select{0%,8%,100%{background:var(--card);border-left-color:transparent}14%,94%{background:var(--well);border-left-color:var(--ink)}}
@keyframes inbox-open{0%,12%,100%{opacity:0;transform:translateY(6px)}20%,94%{opacity:1;transform:translateY(0)}}
@keyframes connection-scroll{0%,28.333333%{transform:translateY(0)}33.333333%,61.666667%{transform:translateY(-25%)}66.666667%,95%{transform:translateY(-50%)}100%{transform:translateY(-75%)}}
@media(max-width:1000px){.scene-stage{padding:25px}.scene-card{padding:20px}.email-card{padding:18px}.form-card{padding:16px 18px}.email-address small{display:block;margin-left:0}.connection-pair{gap:18px}}
@media(max-width:480px){.scene-stage{padding:22px;min-height:400px}.scene-card{padding:20px}.email-card,.form-card{padding:16px}.inbox-scene{padding:18px}.inbox-detail.scene-card{padding:16px}.inbox-row{padding-inline:13px}.inbox-list-heading{padding-inline:15px}.connection-pair{gap:18px}.connection-reel{--connection-panel-height:174px}.connection-portrait{width:78px;height:94px}.connection-route{height:94px}.connection-message{font-size:11px}.connection-role{font-size:9px;padding:4px 6px;gap:5px;max-width:90px}}
@media(prefers-reduced-motion:reduce){.product-visual *,.product-visual *::after{animation:none!important;transition:none!important}}

.product-visual:focus-visible{outline:2px solid var(--ink);outline-offset:4px}

/* Homepage: one card and one moving element per product. */
.product-overview .scene-stage{max-width:460px;min-height:320px;padding:28px}
.ranked-inbox .inbox-list-heading{padding:15px 20px 12px;font-size:11px}
.ranked-row{display:grid;grid-template-columns:minmax(0,1fr) 70px 48px;align-items:center;gap:14px;padding:18px 18px;border-left:2px solid transparent;min-height:70px}
.ranked-row+.ranked-row{border-top:1px solid var(--border)}
.request-title{font-size:13px;line-height:1.5}
.request-tools{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.request-tools img{width:18px;height:18px;object-fit:contain}
.request-score{text-align:right;font-size:17px;line-height:1.5;font-weight:500;font-variant-numeric:tabular-nums}
.request-score small{font-size:10px;font-weight:400;color:var(--muted);margin-left:1px}
.ranked-row-selected{border-left-color:var(--ink);background:var(--well)}
@media(max-width:1000px){.product-overview .scene-stage{padding:22px}.ranked-row{gap:10px;padding-inline:14px;grid-template-columns:minmax(0,1fr) 66px 44px}.request-title{font-size:12px}}
@media(max-width:480px){
  .product-overview .scene-stage{min-height:290px;padding:22px}
  .ranked-row{grid-template-columns:minmax(0,1fr) auto;gap:5px 12px;padding:13px 16px}
  .request-title{font-size:13px;grid-column:1;grid-row:1}
  .request-tools{grid-column:1;grid-row:2;justify-content:flex-start}
  .request-tools img{width:15px;height:15px}
  .request-score{grid-column:2;grid-row:1 / span 2;font-size:18px}
}

/* Homepage stories. Screens share one grid cell and one loop clock, so hover,
   focus, Escape and offscreen pauses hold every screen together. Without motion
   the last screen of each story shows as a completed still. */
.story-card{display:grid;padding:0;overflow:hidden}
.story-screen{grid-area:1/1;min-width:0}
.product-overview{--story-ease:cubic-bezier(.4,0,.2,1)}
.product-overview .intake-email{--story-duration:7.2s}.product-overview .intake-link{--story-duration:5.2s}.product-overview .inbox-scene{--story-duration:8.4s}

/* Intake: new mail → Forward → type Aura's address. */
.intake-story{min-height:250px}
.intake-arrive,.intake-open{visibility:hidden}
.intake-arrive{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.mail-icon{position:relative;display:block;color:var(--ink);line-height:0}
.mail-badge{position:absolute;top:-9px;right:-11px;display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--ink);color:var(--card);font-size:12px;font-weight:600;line-height:1;box-shadow:0 0 0 3px var(--card)}
.mail-label{font-size:12px;color:var(--muted)}
.intake-open{padding:24px 28px;display:flex;flex-direction:column}
.mail-from{display:flex;align-items:center;gap:12px}.mail-from .chat-face{width:36px;height:36px}
.mail-meta small{display:block;color:var(--muted);font-size:11px}
.mail-meta strong{display:block;font-size:17px;font-weight:500;line-height:1.5;margin-top:4px;letter-spacing:-.02em}
.mail-body{font-size:13px;line-height:1.6;color:var(--body);margin:8px 0 0}
.mail-actions{position:relative;display:flex;gap:8px;margin-top:auto;padding-top:18px}
.mail-action{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--border-strong);border-radius:6px;background:var(--card);font-size:12px;color:var(--ink)}
.story-cursor{position:absolute;left:52px;top:36px;opacity:0;pointer-events:none}
.intake-compose{padding:22px 28px;display:flex;flex-direction:column;justify-content:center}
.compose-field{display:grid;grid-template-columns:56px minmax(0,1fr);align-items:baseline;gap:8px;padding:10px 0;border-bottom:1px solid var(--border);font-size:13px}
.compose-field>span:first-child{font-size:11px;color:var(--muted)}
.compose-to{white-space:nowrap;overflow:hidden;color:var(--ink)}
.type-char{display:inline-block;overflow:hidden;vertical-align:top}
.type-caret{display:none;width:1px;height:1.1em;margin-left:1px;background:var(--ink);vertical-align:-2px}
.compose-chip{display:inline-flex;justify-self:start;align-items:center;gap:6px;padding:2px 9px 2px 3px;border-radius:12px;background:var(--well);color:var(--ink);font-size:12px;line-height:1.6}
.compose-chip .chat-face{width:20px;height:20px}
.compose-reply{padding-top:14px;font-size:13px;line-height:1.7;color:var(--ink)}
.compose-reply p{margin:0}
.compose-quote{margin-top:8px!important;padding-left:10px;border-left:2px solid var(--border-strong);font-size:12px;color:var(--muted)}
.compose-quote span{color:var(--body)}

/* Share your link: a direct message, your reply with the link, then the form. */
.link-story{min-height:250px}
.link-chat{padding:18px 20px;display:flex;flex-direction:column;gap:12px}
.chat-owner{justify-content:flex-end}
.chat-incoming{background:var(--card);border:1px solid var(--border);border-radius:12px 12px 12px 4px;color:var(--muted)}
.chat-contact .chat-typing{justify-self:start;border-radius:12px 12px 12px 4px}
.chat-outgoing{max-width:80%}
.chat-link-text{text-decoration:underline;text-underline-offset:3px}
.chat-input{display:flex;align-items:center;gap:10px;margin-top:auto;padding:6px 6px 6px 12px;border:1px solid var(--border-strong);border-radius:18px;font-size:12px}
.chat-input-swap{display:grid;flex:1;min-width:0}.chat-input-swap>*{grid-area:1/1}
.chat-input-placeholder{color:var(--muted)}
.chat-input-text{display:inline-flex;align-items:center;gap:6px;color:var(--ink);visibility:hidden}
.chat-send{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--card)}

/* Inbox: Aura follows up with the sender, then the request arrives ranked. */
.inbox-chat{visibility:hidden;padding:18px 20px;display:flex;flex-direction:column;gap:12px}
.chat-heading{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted);padding-bottom:10px;border-bottom:1px solid var(--border)}
.chat-heading span:first-child{color:var(--ink);font-weight:500}
.chat-line{display:flex;align-items:flex-start;gap:10px}
.chat-aura{justify-content:flex-end}
.chat-line .aura-avatar{width:32px;height:32px}
.chat-face{flex-shrink:0;width:32px;height:32px;border-radius:50%;object-fit:cover}
.chat-slot{display:grid;min-width:0}.chat-slot>*{grid-area:1/1;align-self:start}
.chat-bubble{background:var(--well);border-radius:12px 12px 4px 12px;padding:10px 12px;font-size:12px;line-height:1.55;color:var(--ink)}
.chat-bubble p{margin:0}
.chat-reply{background:var(--card);border:1px solid var(--border);border-radius:12px 12px 12px 4px;color:var(--muted)}
.chat-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.chat-tool{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid var(--border-strong);border-radius:6px;background:var(--card);font-size:11px}
.chat-tool img{object-fit:contain}
.chat-typing{display:inline-flex;gap:4px;justify-self:end;padding:12px 14px;border-radius:12px 12px 4px 12px;background:var(--well);opacity:0}
.chat-typing i{width:6px;height:6px;border-radius:50%;background:var(--muted)}

/* Inbox: three rows visible; a new one arrives on top. */
.ranked-rows{--row-h:70px;height:calc(3 * var(--row-h));overflow:hidden}
.ranked-rows .ranked-row{height:var(--row-h);min-height:0}

/* Connect: the network, with one path traced between two people at a time. */
.network-card{padding:20px 22px 18px}
.network-map{position:relative;height:220px}
.network-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.network-lines path{vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.network-edge{stroke:var(--border-strong);stroke-width:1}
.network-dot{fill:var(--card);stroke:var(--border-strong);stroke-width:1;vector-effect:non-scaling-stroke}
.network-route{stroke:var(--ink);stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:0;opacity:0}
.network-route.net-pair-0{opacity:1}
.network-person{position:absolute;width:46px;height:46px;transform:translate(-50%,-50%);border-radius:50%;opacity:.55;filter:grayscale(1)}
.network-person img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;box-shadow:0 0 0 3px var(--card)}
.network-person.net-pair-0{opacity:1;filter:none}
.network-person.net-pair-0 img{box-shadow:0 0 0 2px var(--card),0 0 0 3.5px var(--ink)}
.network-person-0{left:15.5%;top:23.64%}.network-person-1{left:84%;top:68.18%}.network-person-2{left:19%;top:72.73%}
.network-person-3{left:80.5%;top:20%}.network-person-4{left:49%;top:12.73%}.network-person-5{left:51.5%;top:76.36%}
.network-role{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);width:max-content;padding:3px 7px;border:1px solid var(--border-strong);border-radius:6px;background:var(--card);font-size:10px;line-height:1.3;color:var(--ink);opacity:0}
.network-role.net-pair-0{opacity:1}
.network-card .connection-consent{margin-top:8px;color:var(--muted)}

/* One shared clock per story. Negative delays offset typed letters and pairs. */
.product-overview.motion-ready .story-screen,.motion-ready .product-overview .story-screen{visibility:visible}
.motion-ready .intake-arrive{animation:intake-arrive var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .mail-badge{animation:mail-badge var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .intake-open{animation:intake-open var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .story-cursor{animation:story-cursor var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .mail-pick{animation:mail-forward var(--story-duration) linear infinite both paused}
.motion-ready .intake-compose{animation:intake-compose var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .type-char{animation:type-char var(--story-duration) linear infinite both paused}
.motion-ready .type-caret{display:inline-block;animation:type-caret 1s steps(1) infinite paused}
.motion-ready .chat-contact .chat-typing{animation-name:contact-typing}
.motion-ready .chat-input-placeholder{animation:input-placeholder var(--story-duration) linear infinite both paused}
.motion-ready .chat-input-text{visibility:visible;animation:input-paste var(--story-duration) linear infinite both paused}
.motion-ready .chat-send{animation:chat-send var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .chat-incoming{animation:chat-incoming var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .chat-owner{animation:chat-owner var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .inbox-chat{animation:inbox-chat var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .chat-typing{animation:chat-typing var(--story-duration) linear infinite both paused}
.motion-ready .chat-typing i{animation:typing-dot .9s ease-in-out infinite paused}
.motion-ready .chat-typing i:nth-child(2){animation-delay:-.75s}.motion-ready .chat-typing i:nth-child(3){animation-delay:-.6s}
.motion-ready .chat-offer{animation:chat-offer var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .chat-sender{animation:chat-reply var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .ranked-inbox{animation:inbox-ranked var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .ranked-row-selected{animation:row-arrive var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .ranked-row:not(.ranked-row-selected){animation:row-make-room var(--story-duration) var(--story-ease) infinite both paused}
.motion-ready .network-person{animation:network-person 10.5s var(--story-ease) infinite both paused}
.motion-ready .network-person img{animation:network-ring 10.5s var(--story-ease) infinite both paused}
.motion-ready .network-role{animation:network-role 10.5s var(--story-ease) infinite both paused}
.motion-ready .network-route{animation:network-route 10.5s var(--story-ease) infinite both paused}
.motion-ready .net-pair-1,.motion-ready .net-pair-1 img{animation-delay:-7s}
.motion-ready .net-pair-2,.motion-ready .net-pair-2 img{animation-delay:-3.5s}
/* aura@useroom.ai: one letter every 0.08s from 3.9s. */
.motion-ready .type-char:nth-child(2){animation-delay:-3.22s}.motion-ready .type-char:nth-child(3){animation-delay:-3.14s}.motion-ready .type-char:nth-child(4){animation-delay:-3.06s}
.motion-ready .type-char:nth-child(5){animation-delay:-2.98s}.motion-ready .type-char:nth-child(6){animation-delay:-2.9s}.motion-ready .type-char:nth-child(7){animation-delay:-2.82s}
.motion-ready .type-char:nth-child(8){animation-delay:-2.74s}.motion-ready .type-char:nth-child(9){animation-delay:-2.66s}.motion-ready .type-char:nth-child(10){animation-delay:-2.58s}
.motion-ready .type-char:nth-child(11){animation-delay:-2.5s}.motion-ready .type-char:nth-child(12){animation-delay:-2.42s}.motion-ready .type-char:nth-child(13){animation-delay:-2.34s}
.motion-ready .type-char:nth-child(14){animation-delay:-2.26s}.motion-ready .type-char:nth-child(15){animation-delay:-2.18s}
.motion-ready .type-char:nth-child(1){animation-delay:-3.3s}
.product-overview.motion-ready.is-playing *,.motion-ready.is-playing .product-overview *{animation-play-state:running}
/* While Intake autoplays, the selected tab fills over its story's length. */
.motion-ready:not(.intake-manual) .intake-tab[aria-selected="true"] .intake-tab-progress{display:block;animation:tab-progress 4.2s linear infinite both paused}
.motion-ready:not(.intake-manual) .intake-tab-email[aria-selected="true"] .intake-tab-progress{animation-duration:6.4s}
.motion-ready.is-playing:not(.intake-manual) .intake-tab[aria-selected="true"] .intake-tab-progress{animation-play-state:running}
@keyframes tab-progress{to{transform:scaleX(1)}}

/* Forward an email, 7.2s: new mail 0–1.7s, Forward 1.5–3.6s, type the address 3.4–6.9s. */
@keyframes intake-arrive{0%,19.44%{opacity:1;transform:none}23.61%,95.83%{opacity:0;transform:translateY(6px)}100%{opacity:1;transform:none}}
@keyframes mail-badge{0%,2.78%{opacity:0;transform:scale(0)}6.25%{opacity:1;transform:scale(1.18)}8.33%,90.28%{opacity:1;transform:scale(1)}91.67%,100%{opacity:0;transform:scale(0)}}
@keyframes intake-open{0%,20.83%{opacity:0;transform:translateY(6px)}25%,45.83%{opacity:1;transform:none}50%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes story-cursor{0%,26.39%{opacity:0;transform:translate(64px,26px)}27.78%{opacity:1;transform:translate(64px,26px)}36.11%{opacity:1;transform:translate(0,0)}37.78%{opacity:1;transform:translate(0,0) scale(.86)}39.58%,45.83%{opacity:1;transform:translate(0,0)}50%,100%{opacity:0;transform:translate(0,0)}}
@keyframes mail-forward{0%,37.78%{background:var(--card);color:var(--ink);border-color:var(--border-strong)}38.61%,50%{background:var(--ink);color:var(--card);border-color:var(--ink)}50.69%,100%{background:var(--card);color:var(--ink);border-color:var(--border-strong)}}
@keyframes intake-compose{0%,47.22%{opacity:0;transform:translateY(6px)}51.39%,91.67%{opacity:1;transform:none}95.83%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes type-char{0%,55.56%{max-width:1em;opacity:1}55.69%,100%{max-width:0;opacity:0}}
@keyframes type-caret{0%{opacity:1}50%{opacity:0}}

/* Share your link, 5.2s: a message arrives, the link is pasted at 1.65s and sent at 2.3s. */
@keyframes contact-typing{0%,2.88%{opacity:0}5.77%,15.38%{opacity:1}18.27%,100%{opacity:0}}
@keyframes chat-incoming{0%,15.38%{opacity:0;transform:translateY(5px)}20.19%,88.46%{opacity:1;transform:none}93.27%,100%{opacity:0}}
@keyframes input-paste{0%,30.77%{opacity:0}31.73%,44.23%{opacity:1}45.19%,100%{opacity:0}}
@keyframes input-placeholder{0%,30.77%{opacity:1}31.73%,44.23%{opacity:0}45.19%,100%{opacity:1}}
@keyframes chat-send{0%,42.31%,46.15%,100%{transform:none}44.23%{transform:scale(.85)}}
@keyframes chat-owner{0%,44.23%{opacity:0;transform:translateY(5px)}49.04%,88.46%{opacity:1;transform:none}93.27%,100%{opacity:0}}

/* Inbox, 8.4s: Aura interviews the sender 0–4.9s; the request arrives ranked 4.7–8.1s. */
@keyframes inbox-chat{0%,54.76%{opacity:1;transform:none}58.33%,96.43%{opacity:0;transform:translateY(-6px)}100%{opacity:1;transform:none}}
@keyframes chat-typing{0%,1.79%{opacity:0}3.57%,10.12%{opacity:1}11.9%,100%{opacity:0}}
@keyframes chat-offer{0%,10.12%{opacity:0;transform:translateY(5px)}13.1%,96.43%{opacity:1;transform:none}97.62%,100%{opacity:0;transform:translateY(5px)}}
@keyframes chat-reply{0%,34.52%{opacity:0;transform:translateY(5px)}37.5%,96.43%{opacity:1;transform:none}97.62%,100%{opacity:0;transform:translateY(5px)}}
@keyframes typing-dot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-3px);opacity:1}}
@keyframes inbox-ranked{0%,55.95%{opacity:0;transform:translateY(6px)}59.52%,92.86%{opacity:1;transform:none}96.43%,100%{opacity:0;transform:translateY(6px)}}
@keyframes row-arrive{0%,63.1%{opacity:0;transform:translateY(-12px)}69.05%,100%{opacity:1;transform:none}}
@keyframes row-make-room{0%,63.1%{transform:translateY(-100%)}69.05%,100%{transform:none}}

/* Connect, 10.5s: each pair has 3.5s — trace the path, hold, fade. */
@keyframes network-person{0%{opacity:.55;filter:grayscale(1)}4%,30%{opacity:1;filter:none}33.33%,100%{opacity:.55;filter:grayscale(1)}}
@keyframes network-ring{0%{box-shadow:0 0 0 3px var(--card),0 0 0 3px var(--card)}4%,30%{box-shadow:0 0 0 2px var(--card),0 0 0 3.5px var(--ink)}33.33%,100%{box-shadow:0 0 0 3px var(--card),0 0 0 3px var(--card)}}
@keyframes network-role{0%,6%{opacity:0;transform:translate(-50%,-3px)}10%,30%{opacity:1;transform:translateX(-50%)}33.33%,100%{opacity:0;transform:translate(-50%,-3px)}}
@keyframes network-route{0%{opacity:1;stroke-dashoffset:1}6%,30%{opacity:1;stroke-dashoffset:0}33.33%,100%{opacity:0;stroke-dashoffset:0}}

@media(max-width:480px){
  .intake-open,.intake-compose{padding:20px 22px}
  .story-cursor{left:46px}
  .inbox-chat{padding:16px}
  .ranked-rows{--row-h:68px}
  .network-card{padding:16px}
  .network-map{height:200px}
  .network-person{width:40px;height:40px}
  .network-role{font-size:9px;padding:2px 6px}
}
