/* Shared visual contract for scan → person → starter conversation. */
:root{--flow-bg:#f5f5f7;--flow-surface:#fff;--flow-ink:#1d1d1f;--flow-muted:#6e6e73;--flow-accent:#0066cc;--flow-line:#dedee3;--flow-radius:20px}
body.focused-chat{--paper:var(--flow-bg);--ink:var(--flow-ink);--muted:var(--flow-muted);--green:var(--flow-accent);--line:var(--flow-line);background:var(--flow-bg);font-family:system-ui,-apple-system,sans-serif}
.focused-chat .voicebox,.focused-chat .composer,.focused-chat #keyboard,.focused-chat #saved,.focused-chat .story-link,.focused-chat .event-art,.focused-chat .companion,.focused-chat .work-offer,.focused-chat .conversation-offer,.focused-chat .eyebrow,.focused-chat .attribution{display:none!important}
.focused-chat header{height:68px;margin:0 auto;padding:0 20px;max-width:960px;border-bottom:1px solid var(--flow-line)}
.focused-chat header .brand{font:750 25px/1 system-ui;letter-spacing:-1px;color:var(--flow-ink);text-decoration:none}
.focused-chat header .brand>*{display:none}
.focused-chat header .brand:after{content:'Here'}
.focused-chat h1,.focused-chat h2,.focused-chat .name,.focused-chat .result-count{font-family:inherit;letter-spacing:-.04em}
.focused-chat main{max-width:960px;padding:24px 20px;gap:24px}
.focused-chat .card,.focused-chat .empty{border:1px solid var(--flow-line);border-radius:var(--flow-radius);background:var(--flow-surface);box-shadow:none}
.focused-chat button,.focused-chat .chip{min-height:44px;border-radius:12px}
.focused-chat .idea-dialog{background:var(--flow-surface);color:var(--flow-ink);border:1px solid var(--flow-line);border-radius:var(--flow-radius);max-width:min(640px,calc(100vw - 24px));max-height:calc(100dvh - 32px);font-family:inherit}
.focused-chat .idea-dialog button{font-family:inherit}
.focused-chat .reply{border-color:var(--flow-accent)}
@media(max-width:660px){.focused-chat main{padding:18px 14px}.focused-chat header{padding:0 14px}.focused-chat .right{margin-top:18px}}
.focused-chat .scene-person,.focused-chat .scene-ground,.focused-chat .asset-credit,.focused-chat .event-place,.focused-chat .event-kicker{display:none!important}
.focused-chat:not(.has-results) main{padding-top:32px}
.focused-chat .event-hero h1{font-size:clamp(30px,5vw,48px);max-width:620px}
.focused-chat .event-hero>.intro{max-width:560px}
.focused-chat .suggestions{margin-top:24px}
.focused-chat .idea-dialog h2{font-size:24px}
.focused-chat .save,.focused-chat .intro-button{display:none!important}
.focused-chat .back-to-badge{font-size:14px;color:var(--flow-accent);text-decoration:none;min-height:44px;display:flex;align-items:center}

/* Motion stays on transform and opacity; layout remains immediately usable. */
:root{--flow-ease:cubic-bezier(.22,1,.36,1)}
@media(prefers-reduced-motion:no-preference){
 .focused-chat .idea-dialog[open]{animation:flow-reveal 280ms var(--flow-ease) both}
 .focused-chat .idea-dialog[open]::backdrop{animation:flow-fade 220ms ease-out both}
 .focused-chat .reply,.focused-chat .card{animation:flow-reveal 320ms var(--flow-ease) both}
 button,a.chip{transition:transform 160ms var(--flow-ease),background-color 160ms ease,color 160ms ease}
 button:active,a.chip:active{transform:scale(.98)}
 @keyframes flow-reveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
 @keyframes flow-fade{from{opacity:0}to{opacity:1}}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}