/* The work, up close: four immersive tiles after the locked hero.
   Sky material sits behind; every product surface stays opaque for reading. */
/* Shared by the grid and the focused dialog, which sits outside the section. */
.work-tiles{--tile-gap:12px;--tile-radius:20px;--open:#b86b16;--open-text:#8c4e0b;--open-wash:#fff0d7;--tile-ease:cubic-bezier(.23,1,.32,1)}
.work-tiles{background:var(--sky-paper);color:var(--sky-ink);padding:120px 56px 96px;max-width:1440px;margin:auto}
.tiles-head{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin-bottom:48px}
.tiles-head h2{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-weight:400;font-size:64px;line-height:68px;letter-spacing:-.035em;margin:0;color:var(--sky-ink)}
.tiles-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--tile-gap)}


.tile{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--tile-radius);min-height:680px;display:flex;flex-direction:column;color:#fff;contain:layout paint}
.tile-notetaker{grid-column:span 12;min-height:580px;flex-direction:row;background:linear-gradient(170deg,var(--sky-top) 0%,var(--sky-middle) 58%,var(--sky-low) 100%)}
.tile-meetings{grid-column:span 7;background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-middle) 64%,var(--sky-low) 100%)}
.tile-fact-find{grid-column:span 5;background:linear-gradient(180deg,var(--sky-low) 0%,#e6ecea 52%,var(--sky-paper) 100%);color:var(--sky-ink)}
.tile-letter{grid-column:span 5;min-height:720px;background:linear-gradient(180deg,var(--sky-ink) 0%,var(--sky-top) 100%)}
.tile-ask{grid-column:span 7;min-height:720px;background:linear-gradient(160deg,var(--sky-middle) 0%,var(--sky-top) 70%)}

.tile-sky{position:absolute;inset:0;z-index:-1;pointer-events:none}
.tile-cloud{position:absolute;width:1100px;height:auto;max-width:none;transition:transform 900ms var(--tile-ease)}
.tile-notetaker .tile-cloud{left:-540px;bottom:-380px;width:1400px}
.tile-meetings .tile-cloud{left:-300px;bottom:-200px;width:1240px}
.tile-fact-find .tile-cloud{left:-430px;bottom:-150px;width:900px}
.tile-letter .tile-cloud{left:-260px;bottom:-250px;width:980px;opacity:.85}
.tile-ask .tile-cloud{right:-260px;bottom:-230px;width:1100px}

.tile-copy{position:relative;z-index:2;padding:40px 40px 0;max-width:480px;display:flex;flex-direction:column;gap:14px}
.tile-copy h3{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-weight:400;font-size:36px;line-height:40px;letter-spacing:-.025em;margin:0}
.tile-copy p{margin:0;font-size:16px;line-height:25px}
.tile-stage{position:relative;flex:1;z-index:1}

/* Meetings: the recorder phone, whole and upright. */
.tile-meetings .tile-copy{max-width:372px}
.tile-meetings .tile-stage{position:absolute;inset:0}
.dark-phone{position:absolute;right:64px;top:40px;width:300px;height:620px;transform-origin:top center;border-radius:46px;background:#000;color:#fff;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text',Geist,'Geist Fallback',sans-serif;box-shadow:0 0 0 7px #1c1d21,0 0 0 8px #3c3e44,0 40px 80px #04173a66,0 12px 24px #04173a40}
.dp-status{display:flex;justify-content:space-between;align-items:center;padding:18px 30px 0;font-size:15px;font-weight:600}
.dp-icons{display:flex;gap:4px;align-items:flex-end}.dp-icons i{display:block;width:4px;border-radius:1px;background:#fff}.dp-icons i:nth-child(1){height:6px}.dp-icons i:nth-child(2){height:9px}.dp-icons i:nth-child(3){height:12px}
.dp-nav{display:flex;justify-content:space-between;padding:18px 26px 0;font-size:15px;line-height:20px}.dp-nav span:last-child{color:#9a9ba1;font-size:13px}
.dp-title{padding:14px 26px 0;font-size:26px;line-height:30px;font-weight:600;letter-spacing:-.01em}
.dp-meta{padding:4px 26px 0;font-size:13px;line-height:18px;color:#9a9ba1}
.dp-orb{display:block;width:104px;height:104px;margin:16px auto 0;border-radius:50%;transform-origin:50% 50%}
.dp-state{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:12px;font-size:14px;line-height:18px}
.dp-state i{width:7px;height:7px;border-radius:50%;background:#ef7f6b}
.dp-time{text-align:center;font-size:40px;line-height:46px;font-weight:300;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.dp-controls{display:flex;gap:10px;padding:12px 22px 0}.dp-controls span{flex:1;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:#1c1c1f;font-size:15px}
.dp-controls .dp-stop{background:#2b1c1b;color:#f2a495}
.tile-meetings[data-captured] .dp-state i{background:#b9a7f5}.tile-meetings[data-captured] .dp-stop{background:#1c1c1f;color:#fff}
.dp-tabs{display:flex;gap:24px;margin:14px 22px 0;border-bottom:1px solid #2a2b2f;font-size:14px;line-height:18px;color:#9a9ba1}.dp-tabs span{padding-bottom:10px}.dp-tabs .on{color:#fff;box-shadow:inset 0 -2px #fff}
.dp-transcript{list-style:none;margin:0;padding:0 22px;position:absolute;left:0;right:0;top:442px;bottom:24px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 28px);mask-image:linear-gradient(180deg,transparent 0,#000 28px)}
.dp-transcript li{display:grid;grid-template-rows:1fr;font-size:14px;line-height:19px}.dp-line{display:block;min-height:0;overflow:hidden;padding-top:14px}.dp-transcript small{display:block;font-size:11px;line-height:16px;color:#9a9ba1;margin-bottom:2px}.dp-transcript .adviser{color:#b9a7f5}
.dp-home{position:absolute;left:50%;bottom:9px;width:120px;height:4px;margin-left:-60px;border-radius:4px;background:#fff}
/* Status: what is in the product today, and what is not yet. */
.tile-status{align-self:flex-start;font-size:12px;line-height:16px;padding:5px 11px;border-radius:99px;background:#f5f9ffe8;color:var(--sky-ink);white-space:nowrap}
.tile-status.soon{background:transparent;color:inherit;box-shadow:inset 0 0 0 1px color-mix(in oklab,currentColor 55%,transparent)}
.tile-fact-find .tile-status{background:#fff}

/* Notetaker: the meeting page on the adviser's computer. The calendar prompt asks first. */
.tile-notetaker .tile-copy{flex:0 0 420px;max-width:420px;padding:48px 48px 0}
.tile-notetaker .tile-stage{flex:1}
.nt-window{position:absolute;left:0;right:-24px;top:48px;bottom:-24px;display:flex;flex-direction:column;background:#fff;border-radius:14px 0 0 0;color:#2f3136;box-shadow:0 1px 2px #0d2c4d14,0 30px 60px #031b4440;overflow:hidden;font-size:14px;line-height:20px}
.nt-chrome{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid #eceae6;color:#6b6e75;font-size:12px}
.nt-chrome i{width:10px;height:10px;border-radius:50%;background:#e4e5e8}.nt-chrome span{margin-left:8px}
.nt-page{flex:1;display:flex;flex-direction:column;padding:22px 32px 0;min-height:0}
.nt-crumb{color:#6b6e75;font-size:12px;line-height:16px}
.nt-title{margin-top:12px;font-size:24px;line-height:30px;font-weight:600;color:#1d1f23;letter-spacing:-.01em}
.nt-date{align-self:flex-start;margin-top:8px;padding:3px 9px;border:1px solid #dadde2;border-radius:7px;font-size:12px;line-height:16px;color:#4a4d54}
.nt-rec{display:flex;align-items:center;gap:16px;margin-top:16px;padding:10px 12px 10px 16px;border-radius:12px;background:#f5f6f8}
.nt-rec-state{display:flex;align-items:center;gap:8px;min-width:0;white-space:nowrap}.nt-rec-state b{font-weight:600;color:#1d1f23}.nt-rec-state small{color:#6b6e75;font-size:13px}
.nt-rec-state i{width:8px;height:8px;border-radius:50%;background:#b8bbc2;transition:background-color 200ms var(--tile-ease)}
.tile-notetaker[data-recording] .nt-rec-state i{background:#d9503a}
.nt-wave{flex:1;display:flex;justify-content:flex-end;align-items:center;gap:3px;height:20px}
.nt-wave i{width:2px;height:6px;border-radius:2px;background:#9ea1a8;transform-origin:center;opacity:.45}
.tile-notetaker[data-recording] .nt-wave i{opacity:1;animation:nt-wave 900ms ease-in-out infinite alternate}
.tile-notetaker:not(.in-view) .nt-wave i{animation-play-state:paused}
.nt-wave i:nth-child(3n){animation-delay:-300ms}.nt-wave i:nth-child(3n+1){animation-delay:-600ms}.nt-wave i:nth-child(4n){animation-duration:700ms}
@keyframes nt-wave{from{transform:scaleY(.6)}to{transform:scaleY(2.6)}}
.nt-buttons{display:flex;gap:8px}.nt-buttons span{padding:6px 12px;border-radius:8px;border:1px solid #dadde2;background:#fff;font-size:13px;line-height:18px;color:#1d1f23}
.nt-buttons .nt-stop{border-color:transparent;background:#fbe9e5;color:#a3321f}
.tile-notetaker[data-stopped] .nt-stop{background:#1d1f23;color:#fff}
.nt-tabs{display:flex;gap:24px;margin-top:16px;border-bottom:1px solid #eceae6;color:#6b6e75}.nt-tabs span{padding-bottom:10px}
.nt-tabs .on{color:#1d1f23;box-shadow:inset 0 -2px #1d1f23}.nt-tabs em{font-style:normal;font-size:12px;color:#a3321f;margin-left:4px}
.tile-notetaker:not([data-recording]) .nt-tabs em{display:none}
.nt-transcript{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.nt-transcript li{display:grid;grid-template-rows:1fr}
.nt-line{display:block;min-height:0;overflow:hidden;padding-top:16px}
.nt-line small{display:block;font-size:12px;line-height:16px;color:#6b6e75;margin-bottom:6px}.nt-line small.you{color:#1f4fd1}
.nt-line{font-size:15px;line-height:22px;color:#1d1f23}
.nt-found{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;padding:12px 16px;border-radius:12px;background:var(--open-wash);color:var(--open-text);font-size:14px}
.nt-found-link{text-decoration:underline;text-underline-offset:3px}
.nt-prompt{position:absolute;top:24px;right:40px;width:330px;padding:14px 16px;border-radius:14px;background:#fff;color:#2f3136;box-shadow:0 0 0 1px #0d2c4d14,0 18px 40px #031b4455;font-size:13px;line-height:19px;z-index:2}
.nt-prompt-app{display:flex;align-items:center;gap:8px;color:#4a4d54;font-size:12px}.nt-mark{width:20px;height:20px;border-radius:5px;display:grid;place-items:center;background:#1d1f23;color:#fff;font-size:11px}
.nt-prompt strong{display:block;margin-top:10px;font-size:14px;color:#1d1f23;font-weight:600}.nt-prompt small{display:block;color:#6b6e75;font-size:12px}
.nt-prompt p{margin:10px 0 0;color:#2f3136}
.nt-prompt-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.nt-prompt-actions span{padding:6px 12px;border-radius:8px;border:1px solid #dadde2;font-size:13px;color:#1d1f23}
.nt-prompt-actions .nt-start{border-color:#1f5eff;background:#1f5eff;color:#fff;transition:transform 160ms var(--tile-ease)}

/* Fact-find: the panel bleeds off the tile edge, like a window seen up close. */
.ff-panel{position:absolute;left:88px;right:-24px;top:36px;bottom:-24px;background:#fff;border-radius:14px 0 0 0;color:#2f3136;box-shadow:0 1px 2px #0d2c4d14,0 24px 48px #0d2c4d24;padding:22px 26px;font-size:14px;line-height:20px}
.ff-top{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#6b6e75;font-size:13px}.ff-top>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ff-count{color:var(--open-text);background:var(--open-wash);border-radius:99px;padding:1px 9px;white-space:nowrap}
.ff-heading{font-size:20px;line-height:26px;font-weight:600;color:#1d1f23;margin:18px 0 6px}
.ff-rows{margin:0}.ff-rows>div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid #eceae6}
.ff-rows dt{color:#6b6e75}.ff-rows dd{margin:0;color:#1d1f23;display:flex;justify-content:space-between;gap:8px;align-items:center}
.ff-proposed{transition:background-color 260ms var(--tile-ease),box-shadow 260ms var(--tile-ease)}
.ff-proposed dd>span:first-child{color:var(--open-text)}

.ff-passage{display:grid;grid-template-rows:1fr;transition:grid-template-rows 420ms var(--tile-ease)}
.ff-passage>div{overflow:hidden;min-height:0;margin:12px 0 4px;padding:0 14px;border-radius:10px;background:#f4f6fb}
.ff-passage>div>:first-child{margin-top:12px}.ff-passage>div>:last-child{margin-bottom:12px}
.ff-passage small{display:block;color:#6b6e75;font-size:12px}
.ff-passage blockquote{margin:6px 0 6px;font-size:16px;line-height:23px;color:#1d1f23}
.ff-passage p{margin:0;color:#4a4d54;font-size:13px;line-height:19px}
.ff-actions{display:flex;gap:8px;margin:12px 0 2px}.ff-actions span{font-size:12px;line-height:16px;padding:7px 11px;border:1px solid #dadde2;border-radius:8px;color:#1d1f23}
.ff-after{margin-top:6px}

/* Recommendation letter: a page that writes itself into review. */
.letter-page{position:absolute;left:40px;right:40px;top:32px;bottom:-30px;background:#fffdf8;border-radius:10px 10px 0 0;color:#2b2a27;padding:28px 32px;box-shadow:0 30px 60px #020f2a55;font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:23px}
.lp-status{font-family:Geist,'Geist Fallback',sans-serif;font-size:12px;line-height:16px;color:var(--open-text);margin-bottom:12px}
.lp-head{display:flex;justify-content:space-between;gap:12px;padding-bottom:10px;margin-bottom:14px;border-bottom:1px solid #ece6d8;font-family:Geist,'Geist Fallback','Inter Tight','Inter Tight Fallback',sans-serif;font-size:11px;line-height:16px;color:#6b6e75}.lp-head span:first-child{color:#1d1c1a;font-weight:600}
.lp-title{font-size:20px;line-height:27px;margin-bottom:14px;color:#1d1c1a}
.letter-page .lp-open b{display:block}
.letter-page p{margin:0 0 12px}
.lp-heading{font-weight:700;margin:4px 0 6px}
.letter-page .lp-open{padding:9px 12px;background:var(--open-wash);border-radius:6px;color:#5b3608}

/* Ask: one pane, a short real conversation. */
.tile-ask{flex-direction:row}
.tile-ask .tile-copy{flex:1;max-width:400px}
.tile-ask .tile-stage{flex:0 0 min(460px,56%);padding:36px 36px 36px 0}
.tile-ask-pane{height:100%;display:flex;flex-direction:column;background:#fff;color:#2f3136;border-radius:16px;box-shadow:0 1px 2px #0d2c4d14,0 30px 60px #031b4440;overflow:hidden}
.ap-head{display:flex;flex-direction:column;gap:2px;padding:18px 22px;border-bottom:1px solid #eceae6}.ap-head strong{font-size:15px;color:#1d1f23;font-weight:600}.ap-head small{font-size:12px;color:#6b6e75}
.ap-thread{flex:1;display:flex;flex-direction:column;gap:14px;padding:20px 22px;overflow:hidden}
.ap-q{align-self:flex-end;max-width:84%;margin:0;padding:10px 14px;border-radius:14px 14px 4px 14px;background:#1f5eff;color:#fff;font-size:14px;line-height:20px}
.ap-a p{margin:0;font-size:14px;line-height:21px;color:#2f3136}
.ap-sources{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.ap-sources span{font-size:12px;line-height:16px;padding:4px 9px;border-radius:7px;background:#f2f3f5;color:#4a4d54}
.ap-input{display:flex;align-items:center;justify-content:space-between;margin:0 16px 16px;padding:12px 14px;border:1px solid #dadde2;border-radius:12px;font-size:13px;color:#6b6e75}.ap-input svg{width:18px;height:18px}

/* Works with your tools: Chunkbase at the centre, the tools around it. */
.orbit{margin-top:var(--tile-gap);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center;padding:56px;border-radius:var(--tile-radius);background:#fffdf8;box-shadow:inset 0 0 0 1px #e4dccb;color:var(--sky-ink)}
.orbit-copy{display:flex;flex-direction:column;gap:14px}.orbit-copy p{margin:0;font-size:16px;line-height:25px}
.orbit-stage{position:relative;justify-self:center;width:min(520px,100%);aspect-ratio:1;container-type:inline-size}
.orbit-ring{position:absolute;inset:11%;border-radius:50%;border:1px dashed #b9c3d6}
.orbit-ring::after{content:'';position:absolute;inset:22%;border-radius:50%;border:1px dashed #d8deea}
.orbit-core{position:absolute;left:50%;top:50%;width:112px;height:112px;margin:-56px 0 0 -56px;border-radius:28px;display:grid;place-items:center;background:#fff;box-shadow:0 0 0 1px #e4e6ea,0 20px 40px #0d2c4d1f}
.orbit-core img{width:58px;height:auto}
@property --spin{syntax:'<angle>';inherits:true;initial-value:0deg}
.orbit-nodes{list-style:none;margin:0;padding:0;position:absolute;inset:0;animation:orbit-spin 180s linear infinite}
@keyframes orbit-spin{to{--spin:360deg}}
.orbit:not(.in-view) .orbit-nodes,.orbit.hold .orbit-nodes{animation-play-state:paused}
.orb-node{--a:calc(var(--i) * 51.43deg - 90deg + var(--spin));position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(var(--a)) translate(39cqw) rotate(calc(-1 * var(--a)))}
.orb-face{position:absolute;left:-38px;top:-38px;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 0 0 1px #e4e6ea,0 10px 24px #0d2c4d14;transition:opacity 420ms var(--tile-ease),scale 420ms var(--tile-ease),box-shadow 300ms var(--tile-ease)}
.orb-face img{width:40px;height:40px;object-fit:contain}
.orb-name{position:absolute;top:44px;left:0;transform:translateX(-50%);white-space:nowrap;font-size:12px;line-height:16px;color:#4a4d54;transition:color 300ms var(--tile-ease)}
.orb-node.on .orb-face{box-shadow:0 0 0 2px #1f5eff,0 14px 30px #1f5eff33}.orb-node.on .orb-name{color:var(--sky-ink)}
/* The lines from each tool to the middle are drawn every frame, so they follow the turning ring.
   One at a time, a card carries the thing that moves: into Chunkbase, or out to the tool. */
.orbit-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.orbit-lines line{stroke:#c9d1e0;stroke-width:1;stroke-dasharray:3 6;transition:stroke 300ms var(--tile-ease)}
.orbit-lines line.on{stroke:#1f5eff;stroke-width:1.5;stroke-dasharray:none}
.orbit-core{transition:box-shadow 400ms var(--tile-ease)}
.orbit-core::after{content:'';position:absolute;inset:-1px;border-radius:inherit;box-shadow:0 0 0 0 #1f5eff55;opacity:0}
.orbit-core.pulse::after{animation:core-pulse 900ms var(--tile-ease)}
.orbit-core.pulse img{animation:core-nudge 600ms var(--tile-ease)}
@keyframes core-pulse{0%{opacity:1;box-shadow:0 0 0 0 #1f5eff55}100%{opacity:0;box-shadow:0 0 0 26px #1f5eff00}}
@keyframes core-nudge{40%{scale:1.08}}
.orb-packet{position:absolute;left:0;top:0;z-index:3;display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px #e4e6ea,0 12px 28px #0d2c4d24;white-space:nowrap;pointer-events:none;opacity:0;will-change:transform,opacity}
.orb-packet img{width:22px;height:22px;object-fit:contain}
.orb-packet span{display:flex;flex-direction:column}.orb-packet b{font-size:12px;line-height:15px;font-weight:600;color:#1d1f23}.orb-packet small{font-size:11px;line-height:14px;color:#6b6e75}
.orb-packet.wait{background:var(--open-wash);box-shadow:0 0 0 1px #f1d9b0,0 12px 28px #0d2c4d24}.orb-packet.wait b,.orb-packet.wait small{color:var(--open-text)}
.orb-node.on .orb-face{scale:1.06}
.orbit.ready:not(.played) .orb-face{opacity:0;scale:.6}
.orbit.ready .orb-face{transition-delay:calc(var(--i) * 90ms)}

/* Motion: steps start hidden only when the script is ready to play them. */
.tiles-ready .tile:not([data-state=rest]) [data-step]{opacity:0;transform:translateY(8px)}
.tiles-ready .tile [data-step]{transition:opacity 260ms var(--tile-ease),transform 260ms var(--tile-ease)}
.tiles-ready .tile [data-step].shown{opacity:1;transform:none}
.tiles-ready .tile-fact-find:not([data-state=rest]) .ff-passage:not(.shown){grid-template-rows:0fr}
.tiles-ready .tile-fact-find .ff-passage{transition:grid-template-rows 420ms var(--tile-ease),opacity 260ms var(--tile-ease) 120ms,transform 260ms var(--tile-ease) 120ms}
.tile-fact-find .ff-proposed.lit,.tile-fact-find[data-state=rest] .ff-proposed{background:#fff8ec;box-shadow:-26px 0 0 #fff8ec,26px 0 0 #fff8ec}
.tile-fact-find 
.tiles-ready .tile-letter [data-step]{transform:none;clip-path:inset(0 0 100% 0);transition:opacity 200ms var(--tile-ease),clip-path 520ms var(--tile-ease)}
.tiles-ready .tile-letter [data-step].shown,.tiles-ready .tile-letter[data-state=rest] [data-step]{clip-path:inset(0)}
.tiles-ready .tile-meetings .dp-transcript li{transition:opacity 260ms var(--tile-ease) 80ms,transform 260ms var(--tile-ease) 80ms,grid-template-rows 340ms var(--tile-ease)}
.tiles-ready .tile-meetings:not([data-state=rest]) .dp-transcript li:not(.shown){grid-template-rows:0fr}
.tiles-ready .tile-notetaker .nt-prompt{transition:opacity 260ms var(--tile-ease),transform 260ms var(--tile-ease)}
.tiles-ready .tile-notetaker:not([data-asking]) .nt-prompt{opacity:0;transform:translateY(-8px);pointer-events:none}
.tile-notetaker[data-pressed] .nt-start{transform:scale(.96)}
.tiles-ready .tile-notetaker .nt-transcript li{transition:opacity 260ms var(--tile-ease) 80ms,transform 260ms var(--tile-ease) 80ms,grid-template-rows 340ms var(--tile-ease)}
.tiles-ready .tile-notetaker:not([data-state=rest]) .nt-transcript li:not(.shown){grid-template-rows:0fr}
.tile-meetings[data-recording] .dp-orb{animation:orb-breathe 2.4s var(--ease-in-out,ease-in-out) infinite alternate}
.tile-meetings:not(.in-view) .dp-orb{animation-play-state:paused}
@keyframes orb-breathe{from{transform:scale(1);filter:saturate(1)}to{transform:scale(1.045);filter:saturate(1.12)}}


@media(hover:hover) and (pointer:fine){
 .tile:hover .tile-cloud{transform:translateX(-18px)}
}
@media(prefers-reduced-motion:reduce){.orbit-nodes{animation:none!important}.orb-face,.tile-cloud,.tile [data-step],.ff-passage{transition:none!important}.dp-orb,.nt-wave i{animation:none!important}}
.reduced .orb-face,.reduced .orbit-nodes,.reduced .tile-cloud,.reduced .tile [data-step],.reduced .ff-passage{transition:none!important}.reduced .dp-orb,.reduced .nt-wave i{animation:none!important}

@media(max-width:1180px){
 .work-tiles{padding:96px 32px 80px}
 .orbit{grid-template-columns:minmax(0,1fr);gap:32px;padding:40px}
 .tiles-head h2{font-size:52px;line-height:56px}
 .tile-meetings,.tile-fact-find,.tile-letter,.tile-ask{grid-column:span 12}
 .tile-notetaker{flex-direction:column;min-height:0}
 .tile-notetaker .tile-copy{flex:none;max-width:480px;padding:40px 40px 0}
 .tile-notetaker .tile-stage{flex:none;height:560px}
 .nt-window{left:40px;top:32px}
 .tile-fact-find,.tile-letter,.tile-ask{min-height:0}
 .tile-meetings .tile-copy{max-width:320px}
 .dark-phone{right:48px}
 .tile-fact-find .tile-stage{height:430px;flex:none}
 .ff-panel{left:auto;width:min(580px,calc(100% - 140px));top:8px}
 .tile-letter .tile-stage{height:470px;flex:none}
 .letter-page{left:auto;width:min(620px,calc(100% - 140px));top:8px}
 .tile-ask .tile-stage{flex-basis:min(480px,58%)}
 .tile-ask{min-height:680px}
}
@media(max-width:760px){
 .work-tiles{padding:72px 16px 56px}
 .orbit{padding:28px 20px 20px;gap:24px}
 .orbit h3{font-size:32px;line-height:36px}
 .orb-face{left:-29px;top:-29px;width:58px;height:58px}.orb-face img{width:30px;height:30px}.orb-name{top:34px}.orb-packet b{font-size:11px}.orb-packet small{font-size:10px}
 .orbit-core{width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:22px}.orbit-core img{width:44px}
 .orb-name{font-size:11px}
 .tiles-head{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:28px}
 .tiles-head h2{font-size:40px;line-height:44px}
 .tile{border-radius:16px}
 .tile-copy{padding:28px 24px 0;max-width:none}
 .tile-meetings .tile-copy{max-width:none}
 .tile-notetaker .tile-copy{padding:28px 24px 0;max-width:none}
 .tile-notetaker .tile-stage{height:560px}
 .nt-window{left:16px;right:16px;top:28px;border-radius:14px 14px 0 0}
 .nt-page{padding:18px 18px 0}
 .nt-crumb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .nt-title{font-size:20px;line-height:26px}
 .nt-wave{display:none}.nt-rec{justify-content:space-between}
 .nt-prompt{left:16px;right:16px;width:auto;top:20px}
 .nt-found{flex-direction:column;align-items:flex-start;gap:4px}
 .tile-notetaker .tile-cloud{left:-420px;bottom:-160px;width:900px}
 .tile-copy h3{font-size:30px;line-height:34px}
 .tile-meetings .tile-stage{position:relative;inset:auto;height:600px;flex:none}
 .dark-phone{right:auto;left:50%;margin-left:-150px;top:24px;transform:scale(.88)}
 .tile-meetings .tile-cloud{left:-420px;bottom:-140px;width:900px}
 .tile-fact-find .tile-stage{height:560px}
 .ff-panel{left:16px;right:16px;width:auto;padding:18px;border-radius:14px 14px 0 0}
 .ff-rows>div{grid-template-columns:1fr;gap:2px;padding:9px 0}
 .ff-heading{font-size:18px}
 .tile-letter .tile-stage{height:560px}
 .letter-page{left:20px;right:20px;width:auto;padding:22px 20px;font-size:14px;line-height:21px}
 .tile-ask{flex-direction:column;min-height:0}
 .tile-ask .tile-copy{max-width:none}
 .tile-ask .tile-stage{flex:none;height:500px;padding:24px 20px}
 .ap-thread{justify-content:flex-end;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 36px);mask-image:linear-gradient(180deg,transparent 0,#000 36px)}
 .tile-fact-find .tile-cloud{left:-520px;bottom:-80px;width:760px}
 .tile-letter .tile-cloud{left:-300px;bottom:-200px;width:760px}
 .tile-ask .tile-cloud{right:-380px;bottom:-200px;width:860px}
}

.reduced .orbit-nodes{animation:none!important}

/* Scroll entrances: tiles and headings rise as they come into view. Off with reduced motion. */
@supports (animation-timeline: view()){
 @media(prefers-reduced-motion:no-preference){
  body:not(.reduced) .tile,body:not(.reduced) .tiles-head,body:not(.reduced) .orbit{animation:rise-in linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
  body:not(.reduced) .orbit-stage{animation:ring-in linear both;animation-timeline:view();animation-range:entry 10% cover 45%}
 }
}
@keyframes rise-in{from{opacity:0;translate:0 48px}to{opacity:1;translate:0 0}}
@keyframes ring-in{from{scale:.9;rotate:-8deg}to{scale:1;rotate:0deg}}
body.reduced .tile,body.reduced .tiles-head,body.reduced .orbit,body.reduced .orbit-stage{animation:none!important}

/* The source mark itself is in app-ui.css. At rest the tile keeps it lit, as when it was opened. */
.tile-fact-find[data-state=rest] .ff-source{background:#875607;color:#fff}