/* EVE — system typography, solid content surfaces, and translucent navigation. */
:root { color-scheme: light; --paper:#fff; --white:#fff; --ink:#1d1d1f; --muted:#65656b; --rule:#dcdce1; --purple:#5745dc; --purple-dark:#4432ba; --lilac:#efedfc; --green:#28654a; --radius:1.25rem; --surface-shadow:0 2px 8px #1d1d1f04,0 24px 64px #1d1d1f08; --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif; --display:var(--sans); --mono:ui-monospace,"SFMono-Regular",Consolas,monospace; }
:root { --surface:#f8f7fb; --radius-xl:1.25rem; --action:#292434; --action-hover:#17131f; --section-display:clamp(2.25rem,4vw,3.5rem); --ease-out:cubic-bezier(.16,1,.3,1); }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--header-bar-height,73px) + 24px); }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:1.0625rem; line-height:1.55; -webkit-font-smoothing:antialiased; font-optical-sizing:auto; }
body.modal-open { overflow:hidden; }
h1,h2,h3,h4,p,figure,blockquote { margin:0; }
h1,h2,h3,h4 { overflow-wrap:anywhere; }
p,li { overflow-wrap:anywhere; }
h1 { font-size:clamp(2.75rem,5.6vw,4.5rem); font-weight:600; line-height:1.06; letter-spacing:-.04em; text-wrap:balance; }
h2 { font-size:clamp(2rem,3.8vw,3.25rem); font-weight:550; line-height:1.1; letter-spacing:-.035em; text-wrap:balance; }
h3 { font-size:1.3125rem; font-weight:600; line-height:1.3; letter-spacing:-.02em; }
a { color:inherit; text-decoration:none; }
button,input,textarea { font:inherit; }
button { border:0; background:none; color:inherit; cursor:pointer; padding:0; touch-action:manipulation; }
button:disabled { cursor:default; }
img { display:block; max-width:100%; }
::selection { background:#e3defc; color:var(--ink); }
:focus-visible { outline:3px solid var(--purple); outline-offset:4px; }
.icon { width:20px; height:20px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.icon-definitions { position:absolute; width:0; height:0; overflow:hidden; }
.container { width:min(1140px,calc(100% - 96px)); margin-inline:auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:12px; left:12px; transform:translateY(-180%); z-index:100; background:var(--purple); color:white; padding:12px 18px; border-radius:10px; }
.skip-link:focus { transform:none; }
.brand { display:inline-flex; align-items:center; gap:8px; line-height:1; }
.brand img { width:27px; height:22px; }
.brand > span { font-size:1.375rem; letter-spacing:-.025em; font-weight:700; }
.button,.demo-button { min-height:48px; max-width:100%; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:.75rem 1.125rem; border-radius:.75rem; font-size:.9375rem; font-weight:500; line-height:1.4; text-align:center; transition:background 150ms,box-shadow 150ms,transform 100ms ease-out; }
.button-primary,.demo-button { background:var(--action); color:white; }
.button-primary:hover,.demo-button:hover { background:var(--action-hover); }
.button:active,.demo-button:active,.icon-button:active { transform:scale(.97); }
.button .icon,.demo-button .icon { width:15px; height:15px; }
.text-link { display:inline-flex; align-items:center; gap:8px; max-width:100%; min-height:44px; font-size:1rem; line-height:1.5; color:var(--purple); }
.text-link .icon { width:15px; height:15px; }
.text-link:hover,.text-button:hover { text-decoration:underline; text-underline-offset:4px; }
.text-button { font-size:.875rem; color:var(--purple); min-height:44px; max-width:100%; }
.icon-button { display:grid; place-items:center; width:44px; height:44px; border-radius:50%; transition:background 120ms,transform 100ms; }
.icon-button:hover { background:#eaeaef; }
.site-header { position:sticky; top:0; z-index:20; background:#ffffffd9; backdrop-filter:blur(22px) saturate(160%); box-shadow:0 12px 24px -24px #1d1d1f70; }
.header-inner { min-height:72px; padding-block:8px; display:flex; flex-wrap:wrap; align-items:center; gap:8px 24px; }
.desktop-nav { margin-left:auto; display:flex; flex-wrap:wrap; align-items:center; gap:18px; font-size:.8125rem; font-weight:500; }
.desktop-nav a { display:flex; align-items:center; min-height:48px; color:#494950; }
.desktop-nav a:hover,.desktop-nav a[aria-current='page'] { color:var(--purple); }
.desktop-nav a { position:relative; }
.desktop-nav a::after { content:''; position:absolute; left:0; right:0; bottom:6px; height:2px; border-radius:2px; background:var(--purple); transform:scaleX(0); transform-origin:left; transition:transform 220ms var(--ease-out); }
.desktop-nav a:hover::after,.desktop-nav a[aria-current='page']::after { transform:scaleX(1); }
.header-preview { margin-left:8px; font-size:.8125rem; }
.header-contact { min-height:44px; font-size:.8125rem; padding:10px 18px; gap:8px; }
.header-contact:hover { color:white; text-decoration:none; }
.menu-toggle { display:none; }
.mobile-nav { display:flex; flex-direction:column; padding-block:8px 12px; background:#fff; }
.mobile-nav a { min-height:48px; padding:12px 4px; font-size:1rem; }
.mobile-nav a:hover,.mobile-nav a[aria-current='page'] { color:var(--purple); }
.eyebrow { font-size:1rem; font-weight:500; line-height:1.5; color:var(--muted); margin-bottom:16px; letter-spacing:.005em; }
.sample-note { font-size:.8125rem; line-height:1.6; color:var(--muted); }
.contact-address { font-size:.9375rem; color:var(--purple); overflow-wrap:anywhere; }
.page-intro { padding-block:4.5rem 3.5rem; text-align:center; }
.intro-grid { display:block; max-width:800px; margin-inline:auto; }
.intro-grid h1 { margin-inline:auto; }
.intro-description { max-width:700px; margin:1.5rem auto 0; color:var(--muted); font-size:1.3125rem; line-height:1.5; letter-spacing:-.012em; }
.intro-grid .text-link,.intro-grid .button { margin-top:1.25rem; }
.intro-grid .sample-note { margin-top:1rem; }
.screen-figure { min-width:0; }
.screen-button { display:block; position:relative; width:100%; background:#fff; border:1px solid #dedee5; border-radius:1rem; overflow:hidden; cursor:zoom-in; }
.capture-viewport { display:block; overflow:hidden; }
.screen-button img { width:100%; height:auto; }
.figure-hint { display:flex; position:static; align-items:center; justify-content:flex-end; gap:8px; min-height:44px; padding:10px 16px; border-top:1px solid #e8e8ed; color:#53535a; background:#fff; font-size:.8125rem; line-height:1.5; }
.figure-hint .icon { width:14px; height:14px; }
.screen-button:hover .figure-hint { color:var(--purple); background:#faf9ff; }
.screen-figure figcaption { display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 16px; padding-top:12px; font-size:.8125rem; line-height:1.6; color:var(--muted); }
.workspace-gallery { background:var(--surface); border-radius:var(--radius-xl); padding:1.5rem; }
.gallery-tabs,.experience-tabs { display:flex; flex-wrap:wrap; gap:4px; width:fit-content; max-width:100%; margin:0 auto 1.5rem; padding:4px; border-radius:.75rem; background:#efedf4; }
.gallery-tabs button,.experience-tabs button { min-height:44px; padding:10px 20px; border-radius:.5rem; font-size:.9375rem; line-height:1.4; font-weight:500; color:#55555d; }
.gallery-tabs button[aria-selected='true'],.experience-tabs button[aria-selected='true'] { color:var(--purple-dark); background:#fff; box-shadow:0 1px 4px #1d1d1f12; }
.gallery-tabs button:active,.experience-tabs button:active { background:#dcd9f5; }
html:not(.has-js) .gallery-panel[hidden] { display:block !important; margin-top:2rem; }
html:not(.has-js) .gallery-tabs { display:none; }
.gallery-description { max-width:780px; margin:1rem auto 0; color:var(--muted); font-size:1rem; line-height:1.6; }
.detail-section { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); align-items:start; gap:5rem; margin-top:5rem; }
.detail-section > div:first-child { min-width:0; }
.detail-rows { display:grid; grid-template-columns:minmax(0,1fr); gap:0; min-width:0; background:var(--surface); border-radius:var(--radius-xl); }
.detail-rows article { padding:1.75rem; background:transparent; }
.detail-rows article + article { border-top:1px solid #e2e2e9; }
.detail-rows p { margin-top:12px; color:var(--muted); font-size:1rem; line-height:1.65; }
.detail-rows .text-link { margin-top:12px; }
.connection-section { margin-top:5rem; padding:2.75rem; border-radius:var(--radius-xl); background:var(--surface); }
.connection-section > h2 { font-size:2.25rem; }
.connection-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; margin-top:2rem; }
.connection-grid p { color:var(--muted); font-size:1rem; line-height:1.65; margin-top:12px; }
.connection-section > .text-link { margin-top:1.5rem; }
.related-link { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.5rem; padding:2rem 2.5rem; margin-block:4rem; border-radius:1.5rem; background:var(--surface); }
.related-link h2 { font-size:1.75rem; }
.related-link p { max-width:700px; color:var(--muted); margin-top:10px; font-size:1rem; line-height:1.6; }
.related-link > .text-link { flex-shrink:0; }
.experience-section,.memory-playground { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:4rem; align-items:start; }
.demo-guide { padding-top:1rem; }
.demo-guide h2,.memory-copy h2 { font-size:2.5rem; }
.demo-guide ol { display:grid; gap:1.5rem; list-style:none; padding:0; margin-block:2rem; }
.demo-guide li { display:grid; gap:8px; }
.demo-guide li strong { color:var(--purple); font-size:.875rem; font-weight:600; }
.demo-guide li span { max-width:320px; color:var(--muted); font-size:1rem; line-height:1.65; }
.demo-guide > .text-link { margin-top:1rem; }
.working-preview { min-width:0; }
.demo-shell { background:#fff; border:1px solid var(--rule); border-radius:1.5rem; overflow:hidden; box-shadow:var(--surface-shadow); }
.desk-header { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; padding:1.125rem 1.5rem; background:var(--surface); font-size:.875rem; }
.desk-brand { display:flex; align-items:center; gap:8px; font-weight:650; }
.desk-brand img { width:22px; height:18px; }
.desk-person { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.8125rem; }
.avatar { display:inline-grid; place-items:center; width:32px; height:32px; flex-shrink:0; background:var(--lilac); border-radius:50%; font-size:.75rem; font-weight:600; color:var(--purple-dark); }
.demo-content { padding:1.75rem; min-width:0; }
.desk-date { color:var(--muted); font-size:.75rem; line-height:1.6; letter-spacing:.025em; }
.desk-title,.demo-static h2 { font-size:1.75rem; font-weight:600; line-height:1.2; letter-spacing:-.025em; margin-top:12px; }
.desk-subtitle,.demo-static p:not(.desk-date) { color:var(--muted); font-size:1rem; line-height:1.6; margin-top:12px; }
.day-timeline { margin-top:1.75rem; }
.timeline-row { display:grid; grid-template-columns:54px minmax(0,1fr); gap:20px; position:relative; }
.timeline-row:not(:last-child) { padding-bottom:1.75rem; }
.timeline-row:not(:last-child)::before { content:''; position:absolute; left:63px; top:12px; bottom:-8px; width:1px; background:var(--rule); }
.timeline-time { font-size:.75rem; padding-top:2px; line-height:1.6; color:var(--muted); }
.timeline-body { position:relative; min-width:0; padding-left:8px; }
.timeline-body::before { content:''; position:absolute; left:-14px; top:6px; width:7px; height:7px; background:#fff; border:1px solid #aaa5bd; border-radius:50%; }
.timeline-row:first-child .timeline-body::before { background:var(--purple); border-color:var(--purple); }
.source-label { display:flex; flex-wrap:wrap; align-items:center; gap:6px; color:var(--muted); font-size:.75rem; line-height:1.5; letter-spacing:.02em; }
.source-label .icon { width:12px; height:12px; }
.timeline-body h3 { font-size:1.0625rem; font-weight:600; line-height:1.4; letter-spacing:-.01em; margin-top:6px; }
.timeline-body p { color:var(--muted); font-size:.9375rem; line-height:1.6; margin-top:8px; }
.review-button { display:inline-flex; align-items:center; gap:8px; min-height:44px; max-width:100%; margin-top:10px; color:var(--purple); font-size:.9375rem; text-align:left; }
.review-button .icon { width:14px; height:14px; }
.review-button:hover { text-decoration:underline; text-underline-offset:4px; }
.evidence-link { display:flex; align-items:flex-start; gap:8px; margin-top:10px; padding:12px; border-radius:10px; background:var(--lilac); font-size:.875rem; line-height:1.55; color:#575164; }
.evidence-link .icon { width:13px; height:13px; margin-top:3px; color:var(--purple); }
.demo-footer { display:flex; flex-wrap:wrap; gap:6px 12px; justify-content:space-between; margin-top:12px; color:var(--muted); font-size:.8125rem; line-height:1.6; }
.scenario-caption { color:var(--muted); font-size:.8125rem; line-height:1.6; margin-top:6px; }
.reply-source { margin-top:1.25rem; padding-block:1rem; border-block:1px solid var(--rule); }
.reply-source-head { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.reply-source-head > div { flex:1; min-width:0; }
.reply-source strong { display:block; font-size:.9375rem; }
.reply-source small { display:block; color:var(--muted); font-size:.8125rem; margin-top:4px; }
.original-message { color:var(--muted); font-size:.9375rem; line-height:1.6; margin-top:12px; }
.reply-meeting { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.8125rem; margin-top:12px; }
.reply-meeting .icon { width:14px; height:14px; }
.draft-card { margin-top:1.25rem; }
.draft-header { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px; font-size:.875rem; font-weight:600; }
.draft-header > span:first-child { display:flex; align-items:center; gap:6px; }
.draft-header .icon { width:14px; height:14px; color:var(--purple); }
.badge { display:inline-block; padding:5px 9px; border-radius:999px; color:var(--purple-dark); background:var(--lilac); font-size:.75rem; line-height:1.4; font-weight:500; }
.draft-destination { color:var(--muted); font-size:.8125rem; line-height:1.6; margin-top:10px; overflow-wrap:anywhere; }
.draft-text,.memory-editor textarea { display:block; width:100%; resize:vertical; min-height:190px; padding:1rem; margin-top:12px; background:#fafafa; border:1px solid #bcbcc5; border-radius:.875rem; color:var(--ink); font-size:1rem; line-height:1.6; }
.draft-controls,.memory-editor > div { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; margin-top:12px; }
.demo-button-secondary { background:#efeff3; color:#45454d; }
.demo-button-secondary:hover { background:#e5e5ed; }
.demo-button:disabled { background:#e9f3ed; color:var(--green); }
.demo-safety,.focus-status { color:var(--muted); font-size:.8125rem; line-height:1.6; margin-top:12px; }
.demo-result { display:flex; align-items:center; gap:8px; margin-top:12px; padding:12px; border-radius:10px; background:#e9f3ed; color:var(--green); font-size:.875rem; line-height:1.55; }
.demo-result .icon { width:14px; height:14px; }
.focus-header { display:flex; justify-content:space-between; gap:12px; margin-top:1.5rem; padding-bottom:12px; border-bottom:1px solid var(--rule); font-size:.875rem; font-weight:600; }
.task-list { margin-bottom:1.5rem; }
.task-row { display:flex; align-items:center; gap:12px; padding-block:14px; border-bottom:1px solid var(--rule); cursor:pointer; }
.task-row input { width:20px; height:20px; margin:0; accent-color:var(--purple); flex-shrink:0; }
.task-row:hover,.task-row:focus-within { background:#f7f6fc; }
.task-name { flex:1; min-width:0; overflow-wrap:anywhere; font-size:1rem; line-height:1.5; }
.task-row:has(input:checked) .task-name { text-decoration:line-through; color:var(--muted); }
.task-date { color:var(--muted); font-size:.8125rem; flex-shrink:0; }
.focus-note { background:#f5f3fc; border-radius:1rem; padding:1rem; }
.focus-note h4 { font-size:1rem; font-weight:600; margin-top:8px; }
.focus-note > p { color:var(--muted); font-size:.9375rem; line-height:1.6; margin-top:8px; }
.focus-note .demo-button { margin-top:12px; }
.demo-walkthrough,.control-flow { margin-top:4rem; }
.demo-walkthrough > h2,.control-flow > h2 { font-size:2.25rem; }
.three-columns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1.5rem; }
.three-columns article { padding:1.75rem; background:var(--surface); border-radius:1.5rem; }
.three-columns article > span { display:inline-block; color:var(--purple-dark); background:#e9e5fb; padding:6px 10px; border-radius:999px; font-size:.8125rem; }
.three-columns h3 { margin-top:1rem; }
.three-columns p { margin-top:12px; color:var(--muted); font-size:1rem; line-height:1.6; }
.memory-copy { padding-top:1.5rem; }
.memory-copy > p:not(.eyebrow) { color:var(--muted); font-size:1rem; line-height:1.65; margin-top:1.25rem; }
.memory-instructions { margin-top:1.5rem; padding:1.25rem; background:var(--surface); border-radius:1rem; }
.memory-instructions strong { font-size:.9375rem; }
.memory-instructions p { color:var(--muted); font-size:.9375rem; line-height:1.6; margin-top:8px; }
.memory-desk { min-width:0; padding:1.75rem; border:1px solid var(--rule); border-radius:1.5rem; background:#fff; box-shadow:var(--surface-shadow); }
.memory-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 12px; }
.memory-toolbar h3 { font-size:1.25rem; }
.memory-filters { display:flex; flex-wrap:wrap; gap:4px; padding:4px; margin-top:1.25rem; background:#f0f0f4; border-radius:1rem; }
.memory-filters button { min-height:44px; min-width:0; padding:10px 12px; color:#53535a; border-radius:.75rem; font-size:.875rem; line-height:1.5; overflow-wrap:anywhere; }
.memory-filters button[aria-pressed='true'] { color:var(--purple-dark); background:#fff; box-shadow:0 1px 3px #1d1d1f10; }
.memory-item { padding-block:1.25rem; border-bottom:1px solid var(--rule); }
.memory-item > p { font-size:1.0625rem; line-height:1.6; overflow-wrap:anywhere; }
.memory-item > span { display:block; margin-top:8px; color:var(--muted); font-size:.8125rem; }
.memory-item-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.memory-item-actions .text-button { min-height:44px; padding:8px 14px; background:#f3f2f8; border-radius:999px; line-height:1.5; }
.memory-item-actions .text-button:active { background:#e7e3f6; }
.memory-editor { margin-top:1.5rem; }
.memory-editor > label { font-size:.9375rem; font-weight:500; }
.memory-feedback { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:1rem; }
.memory-feedback p { color:var(--green); font-size:.875rem; line-height:1.6; }
.memory-empty,.memory-nojs { color:var(--muted); padding-block:1rem; font-size:.875rem; }
.has-js .memory-nojs { display:none; }
.review-section { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:3rem; align-items:center; padding:2.5rem; border-radius:var(--radius-xl); background:var(--surface); }
.review-copy h2 { font-size:2.5rem; }
.review-copy > p:not(.eyebrow) { color:var(--muted); font-size:1rem; line-height:1.65; margin-top:1.25rem; }
.release-status { padding:2.5rem; border-radius:var(--radius-xl); background:var(--surface); }
.release-heading { display:flex; align-items:center; gap:10px; }
.release-heading h2 { font-size:1.25rem; }
.status-dot { width:8px; height:8px; flex-shrink:0; border-radius:50%; background:#8b6830; }
.release-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; margin-top:2rem; }
.release-grid h3 { font-size:1.5rem; }
.release-grid p { margin-top:12px; color:var(--muted); font-size:1rem; line-height:1.65; }
.release-grid .button { margin-top:1.25rem; }
.release-actions { display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:1rem; }
.questions-layout { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:4rem; margin-block:4rem; }
.questions-layout h2 { font-size:2.5rem; }
.page-jump-links { display:grid; gap:8px; margin-top:1.5rem; font-size:.9375rem; color:var(--muted); }
.page-jump-links a { padding-block:8px; }
.page-jump-links a:hover { color:var(--purple); }
.faq-list > section + section { margin-top:2.5rem; }
.faq-list section > h3 { font-size:1.125rem; margin-bottom:12px; }
.faq-list details { border-bottom:1px solid var(--rule); }
.faq-list summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:1.25rem; cursor:pointer; list-style:none; font-size:1rem; font-weight:500; }
.faq-list summary:hover { color:var(--purple); }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary .icon { width:16px; height:16px; }
.faq-list details[open] summary .icon { transform:rotate(45deg); }
.faq-list details p { padding-bottom:1.25rem; color:var(--muted); font-size:1rem; line-height:1.65; }
.document-intro { padding-block:4.5rem 3rem; max-width:960px; }
.document-intro h1 { font-size:clamp(2.75rem,5vw,4rem); max-width:800px; }
.document-intro > p:not(.eyebrow) { max-width:760px; color:var(--muted); font-size:1.25rem; line-height:1.55; margin-top:1.5rem; }
.document-date { display:block; margin-top:1rem; color:var(--muted); font-size:.8125rem; }
.document-layout { display:grid; grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr); gap:4rem; padding-block:1rem 4rem; max-width:960px; }
.document-layout > * { min-width:0; }
.document-contents { display:grid; align-self:start; gap:8px; padding:1.25rem; border-radius:1.25rem; background:var(--surface); font-size:.875rem; color:var(--muted); }
.document-contents strong { color:var(--ink); font-weight:600; margin-bottom:8px; }
.document-contents a { padding-block:5px; overflow-wrap:anywhere; }
.document-contents a:hover { color:var(--purple); }
.document-body section + section { margin-top:2.25rem; }
.document-body h2 { font-size:1.75rem; }
.document-body p { color:var(--muted); font-size:1rem; line-height:1.75; margin-top:1rem; }
.document-related { margin-top:2rem; }
.not-found { padding-block:5rem; text-align:center; }
.not-found > p { color:var(--muted); margin-top:1.5rem; }
.not-found > div { display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; margin-top:2rem; }
.site-footer { padding-block:3rem 1.5rem; color:#55555c; }
.footer-main { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:4rem; }
.footer-main > div > p { max-width:300px; margin-top:1.25rem; font-size:.9375rem; line-height:1.6; }
.footer-contact { margin-top:1rem; font-size:.9375rem; }
.footer-main .contact-address { margin-top:8px; }
.footer-main nav { display:grid; align-content:start; gap:2px; font-size:.875rem; }
.footer-main nav a { display:flex; align-items:center; min-height:44px; }
.footer-main nav > span { color:var(--ink); font-size:.8125rem; font-weight:600; margin-bottom:8px; }
.footer-main nav a:hover { color:var(--purple); text-decoration:underline; text-underline-offset:4px; }
.footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 20px; padding-top:2rem; font-size:.75rem; line-height:1.6; }
.info-dialog { position:fixed; width:min(1360px,calc(100% - 40px)); max-height:90dvh; margin:auto; padding:1.75rem; border:1px solid #d0d0d8; border-radius:var(--radius-xl); background:#fff; color:var(--ink); box-shadow:0 32px 100px #1d1d1f30; overflow:hidden; }
.info-dialog[open] { display:flex; flex-direction:column; }
.info-dialog::backdrop { background:#1d1d1f66; backdrop-filter:blur(4px); }
#dialog-content { display:flex; flex-direction:column; flex:1; min-height:0; }
.dialog-close { position:absolute; top:10px; right:10px; z-index:1; background:#ededf2; }
.info-dialog h2 { font-size:1.625rem; padding-right:40px; }
.dialog-image-hint { display:none; }
.dialog-image-viewport { overflow:auto; flex:1; min-height:0; margin-top:1.25rem; border-radius:1rem; border:1px solid var(--rule); overscroll-behavior:contain; touch-action:pan-x pan-y; }
.dialog-product-image { width:100%; height:auto; }
.info-dialog h2,.dialog-image-hint,.info-dialog .sample-note { flex-shrink:0; }
.info-dialog .sample-note { margin-top:12px; }
.toast { position:fixed; left:50%; bottom:24px; z-index:80; transform:translateX(-50%); width:max-content; max-width:calc(100% - 40px); padding:14px 20px; border-radius:16px; background:var(--ink); color:#fff; font-size:.875rem; line-height:1.5; box-shadow:0 12px 40px #1d1d1f20; }
/* Shared motion and composition across every page. */
.page-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:1.25rem; color:var(--muted); font-size:.8125rem; }
.page-tools nav { display:flex; flex-wrap:wrap; align-items:center; gap:10px; line-height:1.5; }
.page-tools nav a { display:inline-flex; align-items:center; min-height:44px; }
.page-tools nav a:hover { color:var(--purple); }
.site-motion-toggle { display:inline-flex; align-items:center; gap:7px; min-height:44px; max-width:100%; padding:8px 0; color:var(--muted); font-size:.8125rem; line-height:1.5; }
.site-motion-toggle:hover { color:var(--purple); }
.site-motion-toggle .icon { width:14px; height:14px; }
.site-motion-toggle .motion-pause,html[data-motion='running'] .site-motion-toggle .motion-play { display:none; }
html[data-motion='running'] .site-motion-toggle .motion-pause { display:block; }
.page-intro { padding-top:2.75rem; }
.document-intro { text-align:center; padding-top:2.75rem; max-width:960px; }
.document-intro h1,.document-intro > p:not(.eyebrow) { margin-inline:auto; }
.page-intro > .eyebrow,.document-intro > .eyebrow,.startup-home .home-hero-copy > .home-eyebrow { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:6px 14px; border:1px solid #e8e5f2; border-radius:999px; background:#faf9ff; color:#5c576b; font-size:.9375rem; line-height:1.5; }
.page-intro > .eyebrow::before,.document-intro > .eyebrow::before,.home-hero-copy > .home-eyebrow::before { content:''; width:6px; height:6px; flex-shrink:0; border-radius:50%; background:var(--purple); box-shadow:0 0 0 4px #5745dc0d; }
.has-js[data-motion='running'] .page-intro > .eyebrow::before,.has-js[data-motion='running'] .document-intro > .eyebrow::before,.has-js[data-motion='running'] .home-hero-copy > .home-eyebrow::before { animation:eve-signal 2.8s ease-in-out infinite alternate; }
.motion-segments { position:relative; isolation:isolate; }
.motion-word { display:inline-block; max-width:100%; overflow-wrap:anywhere; }
.motion-roll { position:relative; display:inline-block; min-width:0; max-width:100%; overflow:hidden; line-height:inherit; }
.motion-roll-track { position:relative; display:block; }
.motion-roll-track::after { content:attr(data-roll-label); position:absolute; top:100%; left:0; width:100%; }
.motion-segments > button { position:relative; z-index:1; }
.motion-segment-indicator { position:absolute; top:0; left:0; z-index:0; border-radius:.5rem; background:#fff; box-shadow:0 2px 6px #1d1d1f0c; pointer-events:none; }
.motion-segments button[aria-selected='true'],.motion-segments button[aria-pressed='true'] { color:var(--ink); background:transparent; box-shadow:none; }
.memory-filters .motion-segment-indicator { border-radius:.75rem; }
.gallery-tabs,.experience-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:360px; padding:4px; gap:0; }
.gallery-tabs button,.experience-tabs button { padding:10px 12px; }
.screen-button { transition:border-color 220ms,box-shadow 220ms; }
.screen-button:hover { border-color:#a59be5; box-shadow:0 8px 30px #5745dc0b; }
.figure-hint { font-size:.8125rem; color:var(--purple); }
.text-link .icon,.home-text-link .icon,.button .icon,.review-button .icon { transition:transform 220ms var(--ease-out); }
.text-link:hover .icon,.home-text-link:hover .icon,.button:hover .icon,.review-button:hover .icon { transform:translateX(3px); }
.memory-filters button:active,.gallery-tabs button:active,.experience-tabs button:active { transform:scale(.97); }
.three-columns article { border:1px solid #eaeaf0; }
.related-link { background:#f3f1fc; }
.button-primary,.home-button-primary,.demo-button:not(.demo-button-secondary) { box-shadow:inset 0 1px 0 #ffffff24,0 2px 4px #3f2c8b0c; }
.site-header { box-shadow:0 1px 0 #eeedf366,0 12px 24px -24px #32244c60; }
.detail-rows,.connection-section,.review-section,.release-status,.document-contents { border:1px solid #e5e3ed; }
.workspace-gallery { border:1px solid #e7e6ed; box-shadow:0 12px 40px -28px #34304a30; }
.detail-rows article { padding:1.875rem; }
.detail-rows h3 { font-size:1.1875rem; letter-spacing:-.018em; }
.detail-rows p { margin-top:10px; }
.connection-section h3,.release-grid h3 { font-weight:600; }
.related-link { border:1px solid #e5def4; }
.related-link > .text-link { padding:10px 16px; border:1px solid #dcd5ed; border-radius:999px; background:#ffffffb3; font-size:.9375rem; }
.related-link > .text-link:hover { background:white; }
.demo-shell,.memory-desk { border-color:#dcd7e9; box-shadow:0 2px 6px #33275504,0 24px 60px -32px #44308024; }
.desk-header { background:#f8f6fc; border-bottom:1px solid #ebe6f2; }
.three-columns article { background:#f8f7fb; border-color:#e6e2ed; }
.three-columns article > span { background:#ede8fa; color:#625181; }
.document-contents a { border-radius:6px; }
.document-contents a:hover { background:#eeebf7; }
.site-footer { border-top:1px solid #ececf1; }
.faq-list summary .icon { transition:transform 250ms var(--ease-out); }
.demo-result { animation:eve-confirm 280ms var(--ease-out); }
html[data-motion='paused'] .demo-result { animation:none; }
.home-stage-identity { display:inline-flex; align-items:center; gap:8px; }
.home-stage-identity img { flex-shrink:0; }
.startup-home .home-frame-track { position:absolute; top:0; left:2rem; right:2rem; height:2px; overflow:hidden; }
.startup-home .home-frame-track::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent 38%,#7767e7 50%,transparent 62%); transform:translateX(-70%); }
.startup-home.home-ready[data-motion='running'] .home-frame-track::after { animation:eve-frame-trace 9s linear infinite; }
.startup-home.home-hero-away .home-light-one,.startup-home.home-hero-away .home-frame-track::after,.startup-home.home-hero-away .home-hero-copy > .home-eyebrow::before { animation-play-state:paused !important; }
.motion-document-hidden *,.motion-document-hidden *::before,.motion-document-hidden *::after { animation-play-state:paused !important; }
.motion-intro-away > .eyebrow::before { animation-play-state:paused !important; }
@keyframes eve-signal { from { opacity:.45; transform:scale(.85); } to { opacity:1; transform:scale(1.1); } }
@keyframes eve-frame-trace { from { transform:translateX(-70%); } to { transform:translateX(70%); } }
@keyframes eve-confirm { from { transform:translateY(4px); } to { transform:translateY(0); } }
html[data-motion='paused'] *,html[data-motion='paused'] *::before,html[data-motion='paused'] *::after { transition:none; }
html[data-motion='paused'] .button:active,html[data-motion='paused'] .demo-button:active,html[data-motion='paused'] [role='tab']:active { transform:none; }
html[data-motion='paused'] .text-link:hover .icon,html[data-motion='paused'] .home-text-link:hover .icon,html[data-motion='paused'] .button:hover .icon { transform:none; }
.toast:not([hidden]) { animation:eve-toast-in 240ms var(--ease-out); }
html[data-motion='paused'] .toast { animation:none; }
@keyframes eve-toast-in { from { opacity:.5; transform:translate3d(-50%,4px,0); } to { opacity:1; transform:translate3d(-50%,0,0); } }
@view-transition { navigation:auto; }
.site-header { view-transition-name:site-header; }
::view-transition-old(root) { animation:eve-page-out 180ms ease-out both; }
::view-transition-new(root) { animation:eve-page-in 220ms ease-out both; }
::view-transition-old(site-header),::view-transition-new(site-header) { animation:none; mix-blend-mode:normal; }
html[data-motion='paused']::view-transition-group(*),html[data-motion='paused']::view-transition-image-pair(*),html[data-motion='paused']::view-transition-old(*),html[data-motion='paused']::view-transition-new(*) { animation:none; }
@keyframes eve-page-out { to { opacity:0; } }
@keyframes eve-page-in { from { opacity:0; } }

/* Precise frames and numbered navigation carry the reference direction across pages. */
.nav-index { align-self:center; margin:-7px 0 0 3px; font-family:var(--mono); font-size:.5625rem; line-height:1; color:#6b6278; font-weight:400; }
.mobile-nav a { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.mobile-nav .nav-index { margin:0; font-size:.6875rem; }
.button-primary { padding-right:.625rem; gap:16px; }
.button-primary > .icon { width:30px; height:30px; padding:7px; border-radius:6px; background:#8270e8; color:#fff; }
.button-primary:hover > .icon { background:#9382f4; }
.button-primary:hover > .icon { transform:none; }
.page-intro > .eyebrow,.document-intro > .eyebrow,.startup-home .home-hero-copy > .home-eyebrow { border-radius:6px; background:#ffffffbf; border-color:#dfd8ed; padding:7px 12px; font-size:.8125rem; font-family:var(--mono); letter-spacing:.015em; }
.page-intro > .eyebrow::before,.document-intro > .eyebrow::before,.home-hero-copy > .home-eyebrow::before { box-shadow:none; width:5px; height:5px; }
.workspace-gallery,.review-section,.release-status,.connection-section { border-radius:1rem; }
.screen-button,.demo-shell,.memory-desk { border-radius:.875rem; }
.detail-rows,.document-contents,.related-link { border-radius:1rem; }
.related-link > .text-link { border-radius:.625rem; background:#fff; }
.gallery-tabs,.experience-tabs { border-radius:.75rem; }
.gallery-tabs button,.experience-tabs button { border-radius:.5rem; }
.gallery-tabs .motion-segment-indicator,.experience-tabs .motion-segment-indicator { border-radius:.5rem; }
.three-columns article { border-radius:1rem; }

@media (max-width:1100px) {
 .container { width:calc(100% - 72px); }
 .desktop-nav { gap:18px; }
 .header-inner { gap:8px 16px; }
 .header-preview { display:none; }
 .detail-section,.experience-section,.memory-playground,.questions-layout,.document-layout { gap:3rem; }
}
@media (max-width:850px) {
 .container { width:calc(100% - 48px); }
 .header-inner { min-height:68px; flex-wrap:nowrap; gap:12px; }
 .desktop-nav { display:none; }
 .header-demo { margin-left:auto; min-width:0; }
 .menu-toggle { display:grid; flex:none; }
 .mobile-nav { max-height:calc(100dvh - var(--header-bar-height,69px)); overflow-y:auto; overscroll-behavior:contain; }
 .page-intro { padding-block:3rem 2.5rem; }
 .intro-description { font-size:1.1875rem; }
 .detail-section,.connection-grid,.review-section,.release-grid,.questions-layout,.document-layout { grid-template-columns:1fr; gap:2rem; }
 .experience-section,.memory-playground { grid-template-columns:1fr; gap:1.75rem; }
 .working-preview,.memory-desk { grid-row:1; }
 .demo-guide,.memory-copy { padding-top:0; }
 .demo-guide h2,.demo-guide > .eyebrow { display:none; }
 .demo-guide ol { grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-block:1rem; }
 .three-columns { grid-template-columns:1fr; }
 .review-copy h2,.questions-layout h2 { font-size:2.25rem; }
 .footer-main { gap:2rem; }
 html:not(.has-js) .menu-toggle { display:none; }
 html:not(.has-js) .site-header { position:static; }
 html:not(.has-js) .mobile-nav { display:flex !important; max-height:none; overflow:visible; }
}
@media (max-width:600px) {
 .container { width:calc(100% - 40px); }
 .header-inner { gap:8px; min-height:64px; }
 .brand img { width:24px; height:20px; }
 .brand > span { font-size:1.3125rem; }
 .header-contact { padding:10px 12px; }
 .header-contact .icon { display:none; }
 .page-intro { padding-block:2.5rem 2rem; }
 .page-tools { padding-top:.75rem; font-size:.75rem; }
 .site-motion-toggle { font-size:.75rem; }
 .intro-grid h1 { font-size:2.75rem; }
 .intro-description { font-size:1.125rem; line-height:1.55; }
 .eyebrow { font-size:.875rem; }
 .workspace-gallery { padding:12px; border-radius:1.25rem; }
 .capture-viewport { height:300px; }
 .screen-button img { width:735px; max-width:none; transform:translateX(-100px); }
 .review-figure .capture-viewport { height:auto; }
 .review-figure .screen-button img { width:100%; max-width:100%; transform:none; }
 .screen-figure figcaption { flex-direction:column; gap:3px; font-size:.75rem; }
 .gallery-tabs,.experience-tabs { width:100%; border-radius:1rem; justify-content:space-between; }
 .gallery-tabs button,.experience-tabs button { flex:1; padding:10px 6px; font-size:.8125rem; border-radius:.875rem; }
 .detail-section { margin-top:3rem; gap:1.5rem; }
 .detail-section h2 { font-size:2.25rem; }
 .detail-rows article { padding:1.375rem; }
 .related-link > .text-link { font-size:.875rem; }
 .connection-section,.review-section,.release-status { padding:1.5rem; margin-top:2rem; border-radius:1.25rem; }
 .connection-section > h2,.demo-walkthrough > h2,.control-flow > h2 { font-size:2rem; }
 .related-link { padding:1.5rem; margin-block:2.5rem; }
 .related-link h2 { font-size:1.5rem; }
 .demo-guide ol { grid-template-columns:1fr; }
 .desk-header { padding:1rem; }
 .demo-content,.memory-desk { padding:1.125rem; }
 .desk-title,.demo-static h2 { font-size:1.5rem; }
 .memory-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .timeline-row { grid-template-columns:42px minmax(0,1fr); gap:16px; }
 .timeline-row:not(:last-child)::before { left:47px; }
 .timeline-body::before { left:-14px; }
 .reply-source .source-label { flex-basis:100%; }
 .demo-button { font-size:.875rem; padding:11px 16px; }
 .memory-copy h2,.review-copy h2,.questions-layout h2 { font-size:2rem; }
 .document-intro { padding-block:2.5rem 2rem; }
 .document-intro h1 { font-size:2.5rem; }
 .document-intro > p:not(.eyebrow) { font-size:1.125rem; }
 .document-contents { grid-template-columns:1fr 1fr; gap:6px 16px; }
 .document-contents strong { grid-column:1 / -1; }
 .footer-main { grid-template-columns:1fr 1fr; gap:2rem 1rem; }
 .footer-main > div { grid-column:1 / -1; }
 .info-dialog { width:calc(100% - 24px); max-height:94dvh; padding:1.25rem; border-radius:1.25rem; }
 .info-dialog h2 { font-size:1.375rem; }
 .dialog-image-hint { display:block; color:var(--muted); font-size:.8125rem; line-height:1.5; margin-top:10px; }
 .dialog-product-image { width:1120px; max-width:none; }
}
@media (max-height:420px) and (max-width:850px) {
 .info-dialog { max-height:calc(100dvh - 16px); padding:16px; }
 .info-dialog h2 { font-size:1.125rem; line-height:1.3; }
 .dialog-image-hint { margin-top:6px; font-size:.6875rem; }
 .dialog-image-viewport { margin-top:8px; }
 .info-dialog .sample-note { margin-top:6px; font-size:.6875rem; line-height:1.5; }
}
@media (prefers-reduced-motion:reduce) {
 @view-transition { navigation:none; }
 html[data-motion='running'][data-motion-opt-in='true'] .page-intro > .eyebrow::before,html[data-motion='running'][data-motion-opt-in='true'] .document-intro > .eyebrow::before {
  animation-name:eve-signal !important; animation-duration:2.8s !important; animation-timing-function:ease-in-out !important; animation-iteration-count:infinite !important; animation-direction:alternate !important;
 }
 html { scroll-behavior:auto; }
 *,*::before,*::after { animation:none !important; transition:none !important; }
 .button:active,.demo-button:active,.icon-button:active { transform:none; }
}
@media (prefers-reduced-transparency:reduce) {
 .site-header { background:#fff; backdrop-filter:none; }
 .info-dialog::backdrop { backdrop-filter:none; }
}
@media (prefers-contrast:more) {
 :root { --muted:#3c3c43; --rule:#8d8d99; }
 .site-header { background:#fff; backdrop-filter:none; border-bottom:1px solid #8d8d99; }
 .screen-button,.demo-shell,.memory-desk,.info-dialog { border-color:#8d8d99; }
}
