/* What agent-native means. The sky header and section heads come from page.css. */

/* The same job, two ways. */
.caret{display:inline-block;width:1.5px;height:1.05em;margin-left:1px;vertical-align:-2px;background:currentColor;animation:an-caret 900ms steps(1) infinite}
.done .caret,.idle .caret{display:none}
@keyframes an-caret{50%{opacity:0}}
.cmp-frame{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-radius:20px;overflow:hidden;box-shadow:inset 0 0 0 1px #15396226}
.cmp-side{margin:0;display:flex;flex-direction:column;gap:22px;padding:32px 32px 92px;min-width:0}
.cmp-side.hand{background:#ebe5d6;color:var(--sky-ink);padding-bottom:0}
.cmp-side.agent{background:linear-gradient(170deg,var(--sky-top) 0%,var(--sky-middle) 70%,var(--sky-low) 100%);color:#fff}
.cmp-status{display:flex;flex-direction:column;gap:6px;min-height:58px}
.cmp-who{font-size:13px;line-height:18px;opacity:.8}
.hw-count,.aw-state{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:24px;line-height:30px;letter-spacing:-.02em}
.hw-count{display:flex;flex-wrap:wrap;gap:0 10px}.hw-count b{font-weight:500}.hw-now{opacity:.6}
.aw-state{display:grid}.aw-state>span{grid-area:1/1;transition:opacity 240ms}.aw-state .b{opacity:0}
.agent.done .aw-state .a{opacity:0}.agent.done .aw-state .b{opacity:1}
/* By hand: a pile of windows that runs off the edge, because the job does not stop at what fits. */
.hw-pile{position:relative;flex:1;min-height:460px;-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent 100%),linear-gradient(180deg,#000 84%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,#000 86%,transparent 100%),linear-gradient(180deg,#000 84%,transparent 100%);mask-composite:intersect}
.hw-win{position:absolute;padding:0 0 12px;border-radius:12px;background:#fff;color:#2f3136;box-shadow:0 14px 34px #3b2f1424,0 0 0 1px #3b2f1412;font-size:12px;line-height:17px;overflow:hidden}
.hw-bar{display:flex;align-items:center;gap:5px;padding:8px 10px;margin-bottom:8px;background:#f4f2ee;color:#6b6e75;font-size:11px}
.hw-bar i{width:7px;height:7px;border-radius:50%;background:#d9d5cc}.hw-bar span{margin-left:6px}
.hw-transcript{left:0;top:0;width:64%}
.hw-transcript p{margin:0;padding:3px 12px;display:grid;grid-template-columns:38px 46px 1fr;gap:4px;color:#4a4d54}
.hw-transcript time{color:#9a9ba1}.hw-transcript b{font-weight:500;color:#2f3136}
.hw-hit{transition:background-color 240ms}.hw-hit.in{background:#fff0b8}
.hw-chat{left:42%;top:84px;width:56%;padding-bottom:12px}
.hw-msg{margin:6px 12px 0;padding:7px 10px;border-radius:10px;transition:opacity 220ms}
.hw-msg.you{background:#f0ede6;margin-left:40px}.hw-msg.ai{background:#f6f6f6;margin-right:30px}
.hw-copy{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:5px;font-size:11px;box-shadow:inset 0 0 0 1px #cfd3da;transition:background-color 200ms,color 200ms}
.hw-copy.pressed{background:#1d1f23;color:#fff}
.hw-office{left:3%;top:236px;width:108%}
.hw-search{margin:0 12px 8px;padding:6px 10px;border-radius:7px;box-shadow:inset 0 0 0 1px #cfd3da;color:#2f3136}.hw-search small{color:#9a9ba1;margin-left:6px}
.hw-tabs{display:flex;gap:2px;margin:0 12px 10px;border-bottom:1px solid #eceae6;white-space:nowrap;overflow:hidden}
.hw-tabs span{padding:5px 8px;color:#6b6e75;border-bottom:2px solid transparent;transition:color 200ms,border-color 200ms}
.hw-office.tab .hw-tab-income{color:#1d1f23;border-color:#1d1f23}
.hw-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 12px;padding:0 12px}
.hw-fields label{display:flex;flex-direction:column;gap:3px;color:#6b6e75;font-size:10.5px}
.hw-fields em{font-style:normal;display:block;padding:5px 8px;min-height:27px;border-radius:6px;box-shadow:inset 0 0 0 1px #e2ddd2;color:#2f3136;font-size:12px}
.hw-salary em{transition:box-shadow 200ms}.hw-office.focus .hw-salary em{box-shadow:inset 0 0 0 1.5px #1f5eff}
.hw-saved{position:absolute;right:16px;top:40px;padding:3px 9px;border-radius:6px;background:#e7f2ec;color:#2b6b4f;font-size:11px}
.hw-note{left:50%;top:10px;width:50%}.hw-note p{margin:0;padding:0 12px;min-height:34px}
[data-h]{opacity:0;translate:0 8px;transition:opacity 240ms,translate 320ms cubic-bezier(.23,1,.32,1)}
[data-h].in{opacity:1;translate:0 0}
.hw-hit[data-h]{opacity:1;translate:none}
/* With Chunkbase: one page, one line, four ticks. */
.aw-card{position:relative;padding:18px 20px;border-radius:14px;background:#fff;color:#2f3136;box-shadow:0 24px 50px #031b4440;font-size:14px;line-height:20px;display:flex;flex-direction:column}
.aw-card .nw-ask{margin-top:18px}
.aw-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:22px}
.aw-list li{display:flex;align-items:center;gap:10px;opacity:.45;transition:opacity 240ms}
.aw-list li::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1.5px #ffffffaa;transition:background-color 200ms,box-shadow 200ms}
.aw-list li.on{opacity:1}.aw-list li.on::before{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2 7 10.6l4.6-5' fill='none' stroke='%230846a7' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;box-shadow:none}
/* The one label on the seam between the two. */
.cmp-pill{position:absolute;left:50%;bottom:28px;translate:-50% 0;z-index:2;display:flex;align-items:center;gap:12px;margin:0;padding:11px 20px;border-radius:99px;background:#0f2238;color:#fff;font-family:'Geist Mono','Geist Mono Fallback',ui-monospace,monospace;font-size:12px;line-height:16px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;box-shadow:0 10px 30px #0f223840}
.cmp-pill span:first-child{opacity:.6}.cmp-pill svg{width:16px;height:16px}
.cmp-note{max-width:760px;margin:16px 0 0;font-size:13px;line-height:20px;color:#46607f}
.nw-crumb{font-size:12px;color:#6b6e75}
.nw-title{margin:10px 0 6px;font-size:18px;line-height:24px;font-weight:600;color:#1d1f23}
.nw-row{display:grid;grid-template-columns:150px 1fr auto auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #f0eee9}
.nw-row>span:first-child{color:#6b6e75}.nw-row b{font-weight:500;color:#1d1f23}
.nw-val{display:grid}.nw-val>span{grid-area:1/1;transition:opacity 260ms,translate 300ms cubic-bezier(.23,1,.32,1)}
.nw-val .new{opacity:0;translate:0 6px;color:#8c4e0b}
.nw-target.changed .old{opacity:0;translate:0 -6px}.nw-target.changed .new{opacity:1;translate:0 0}
.nw-target.accepted .new{color:#1d1f23}
.nw-target{transition:background-color 300ms;margin:0 -10px;padding:10px;border-radius:8px}
.nw-target.changed{background:#fff8ec}.nw-target.accepted{background:transparent}
.nw-src,.nw-ok{opacity:0;transition:opacity 240ms}
.nw-target.changed .nw-src,.nw-target.changed .nw-ok{opacity:1}
.nw-src{font-size:12px;padding:3px 8px;border-radius:7px;background:#edf2ff;color:#1f4fd1}
.nw-ok{display:grid}.nw-ok em{grid-area:1/1;font-style:normal;font-size:12px;padding:4px 10px;border-radius:7px;white-space:nowrap;transition:opacity 220ms}
.nw-ok .a{background:#1d1f23;color:#fff}.nw-ok .b{opacity:0;background:#e7f2ec;color:#2b6b4f}
.nw-target.accepted .nw-ok .a{opacity:0}.nw-target.accepted .nw-ok .b{opacity:1}
.nw-ask{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;box-shadow:inset 0 0 0 1px #dadde2;color:#1d1f23}
.nw-q{min-height:20px}
.nw-send{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:#1f5eff;color:#fff;font-size:14px}

/* Four questions: the list on the left, the answer on the screen on the right. */
.q-wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:12px}
.q-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.q-list button{width:100%;display:grid;grid-template-columns:36px 1fr;column-gap:12px;align-items:start;padding:20px 22px;border-radius:16px;background:#ebe5d6;color:var(--sky-ink);font:inherit;text-align:left;cursor:pointer;transition:background-color 200ms}
.q-list button[aria-selected=true]{background:#fff;box-shadow:0 0 0 1px #e4dccb,0 12px 30px #3b2f1414}
.q-n{grid-row:1 / span 2;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:13px;box-shadow:inset 0 0 0 1px currentColor}
.q-list button[aria-selected=true] .q-n{background:var(--sky-ink);color:#fff;box-shadow:none}
.q-t{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:22px;line-height:28px;letter-spacing:-.015em}
.q-a{display:grid;grid-template-rows:0fr;font-size:15px;line-height:22px;color:#46607f;transition:grid-template-rows 300ms cubic-bezier(.23,1,.32,1)}
.q-a>span{min-height:0;overflow:hidden}
.q-list button[aria-selected=true] .q-a{grid-template-rows:1fr;padding-top:6px}
.q-stage{position:relative;min-height:440px;border-radius:20px;background:linear-gradient(170deg,var(--sky-top) 0%,var(--sky-middle) 62%,var(--sky-low) 100%);overflow:hidden;display:grid;place-items:center;padding:40px}
.q-panel{width:min(520px,100%);display:flex;flex-direction:column;align-items:center;gap:18px}
.q-panel.on>*{animation:q-in 360ms cubic-bezier(.23,1,.32,1) both}
.q-panel.on>*:nth-child(2){animation-delay:90ms}
@keyframes q-in{from{opacity:0;translate:0 8px;filter:blur(3px)}to{opacity:1;translate:0 0;filter:none}}
.q-note{margin:0;font-size:14px;line-height:20px;color:#fff;text-align:center}
.q-card{width:100%;display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:14px;background:#fff;color:#2f3136;box-shadow:0 30px 60px #031b4440;font-size:14px;line-height:21px}
.q-where{align-self:flex-start;font-size:12px;padding:3px 9px;border-radius:99px;background:#eef2fb;color:#1f4fd1}
.q-ask{align-self:flex-end;max-width:84%;margin:0;padding:9px 13px;border-radius:13px 13px 4px 13px;background:#1f5eff;color:#fff}
.q-ans p{margin:0}.q-ans.stop p{padding:10px 12px;border-radius:10px;background:#fff0d7;color:#5b3608}
.q-src{display:flex;gap:6px;margin-top:8px}.q-src span{font-size:12px;padding:3px 8px;border-radius:7px;background:#f2f3f5;color:#4a4d54}
.q-done{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:12px 14px;border-radius:10px;background:#e7f2ec;color:#2b6b4f}.q-done b{color:#1d1f23}.q-done span{grid-column:1;font-size:13px}.q-done em{grid-column:2;grid-row:1 / span 2;align-self:center;font-style:normal;font-size:12px;padding:4px 10px;border-radius:7px;background:#fff;color:#1d1f23}
.q-small{margin:0;font-size:13px;color:#6b6e75}
.q-perm{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:10px;box-shadow:inset 0 0 0 1px #e4e6ea;font-size:13px;color:#4a4d54}.q-perm b{font-weight:500;color:#1d1f23}
.q-screens{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%}
.qs{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:12px;background:#fff;box-shadow:0 20px 40px #031b4433;min-height:170px}
.qs small{font-size:12px;color:#1d1f23;font-weight:600}
.qs i{display:block;height:7px;border-radius:4px;background:#eceae6}.qs i.s{width:60%}
.qs-ask{margin-top:auto;padding:6px 8px;border-radius:8px;box-shadow:inset 0 0 0 1px #dadde2;font-size:11px;color:#1f4fd1}

/* What the agents do. */
.today-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;border-top:1px solid #1539621f}
.today-list li{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:start;padding:22px 0;border-bottom:1px solid #1539621f}
.today-list b{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-weight:400;font-size:22px;line-height:28px;letter-spacing:-.015em}
.today-list span:not(.an-pill){grid-column:1;font-size:15px;line-height:22px;color:#46607f}
.an-pill{grid-column:2;grid-row:1;align-self:center;font-size:12px;line-height:16px;padding:4px 10px;border-radius:99px;background:var(--sky-ink);color:#fff;white-space:nowrap}
.an-pill.soon{background:none;color:var(--sky-ink);box-shadow:inset 0 0 0 1px #15396266}

@media(max-width:900px){
 .cmp-frame,.q-wrap{grid-template-columns:minmax(0,1fr)}
 .cmp-side{padding:24px 20px 28px}.cmp-side.agent{padding-top:76px}
 .cmp-side.hand{padding-bottom:0}.hw-pile{flex:none;height:470px}.hw-transcript{width:92%}.hw-chat{left:16%;width:84%}.hw-office{left:3%;width:124%}.hw-note{left:30%;width:70%}
 .cmp-pill{top:var(--seam,50%);bottom:auto;translate:-50% -50%}
 .hw-count,.aw-state{font-size:20px;line-height:26px}
 .nw-row{grid-template-columns:1fr auto;row-gap:6px}.nw-src{grid-column:1}.nw-ok{grid-column:2}
 .q-stage{min-height:420px;padding:24px 16px}
 .q-screens{grid-template-columns:1fr 1fr}.qs:last-child{display:none}
 .today-list{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){[data-h],.hw-hit,.hw-copy,.hw-tabs span,.hw-salary em,.aw-list li,.aw-list li::before,.aw-state>span,.nw-val>span,.nw-target,.nw-src,.nw-ok,.nw-ok em,.cw-copy,.q-a,.q-list button{transition:none!important}.q-panel.on>*,.caret{animation:none!important}}
.reduced [data-h],.reduced .aw-list li,.reduced .aw-state>span,.reduced .nw-val>span,.reduced .q-a{transition:none!important}.reduced .q-panel.on>*,.reduced .caret{animation:none!important}