:root{color-scheme:light;--ink:#193c37;--muted:#6a7974;--paper:#f6f7f3;--line:#dce4dc;--green:#19664f;--pale:#edf4ed;--gold:#b88945}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}header{display:flex;align-items:center;gap:24px;padding:22px 5vw;border-bottom:1px solid var(--line);background:#fff}header .muted{margin-left:auto;font-size:13px}.brand{color:var(--ink);display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:650;letter-spacing:-.3px}.logo{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--green);color:white;font-size:21px}main{margin:36px auto;padding:0 24px}.admin{max-width:1280px}.client{max-width:840px;margin-top:60px}h1,h2,h3{font-weight:600;line-height:1.25;letter-spacing:-.6px}h1{font-size:32px;margin:10px 0 22px}h2{font-size:21px;margin:0 0 15px}h3{font-size:17px}p{margin:12px 0}.lead{font-size:18px;max-width:620px}.muted{color:var(--muted)}.small{font-size:13px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--green);margin:0 0 12px}.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px;margin-bottom:22px;box-shadow:0 5px 24px #193c3703}.narrow{max-width:470px;margin:70px auto}.client .panel{padding:38px}.columns{display:grid;grid-template-columns:270px 1fr;gap:24px;align-items:start}.row,.actions,.connection{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.row{justify-content:space-between}.row h2{margin:0}.actions{margin:14px 0 6px}.connection div:first-child{flex:1}.connection h2,.connection p{margin:0}.connection #device-login{flex-basis:100%;padding-top:15px;border-top:1px solid var(--line)}button,.button{font:inherit;line-height:1.3;display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:12px 19px;background:var(--green);color:#fff;border:1px solid var(--green);border-radius:10px;cursor:pointer;font-size:14px;font-weight:600;text-decoration:none;transition:background .15s}button:hover,.button:hover{background:#12533f}button:disabled{opacity:.5;cursor:wait}.secondary{background:#fff;color:var(--ink);border-color:var(--line);padding:10px 13px}.secondary:hover{background:var(--pale)}label{display:block;font-size:14px;font-weight:550;margin:0 0 18px}input,textarea,select{display:block;width:100%;font:inherit;font-size:15px;color:var(--ink);background:#fff;border:1px solid #cdd8cf;border-radius:9px;padding:11px 12px;margin-top:7px;outline:none}textarea{resize:vertical;line-height:1.55}input:focus,textarea:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px #19664f12}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.invite-form{display:grid;grid-template-columns:2fr 1.5fr 1fr;gap:14px}.invite-form button{grid-column:1/-1;justify-self:start}.agent-item{width:100%;text-align:left;justify-content:start;background:#fff;color:var(--ink);border:none;margin:4px 0}.agent-item:hover,.agent-item.selected{background:var(--pale)}.invite-card,.attempt{padding:22px 0;border-top:1px solid var(--line);margin-top:20px}.badge{font-size:12px;background:var(--pale);border-radius:20px;padding:4px 10px;color:var(--green)}.notice{padding:14px 18px;border:1px solid #e5ccb0;border-radius:10px;background:#fff5e8;color:#845522;margin-bottom:22px;white-space:pre-wrap;overflow-wrap:anywhere}#new-link{padding:18px;border-radius:12px;background:var(--pale);margin:20px 0}#new-link input{font-size:13px;margin:12px 0}.intro-note{border-left:3px solid var(--green);background:var(--pale);padding:18px 22px;margin:24px 0;border-radius:0 10px 10px 0}.intro-note p{margin-bottom:0}.intro-note button{margin-top:20px}.chat-heading{border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:24px}.chat-heading h1{font-size:25px;margin-bottom:10px}.message{padding:18px 22px;margin:16px 0;border-radius:14px;background:#f3f6f1;white-space:pre-wrap;overflow-wrap:anywhere}.message.user{margin-left:8%;background:#e6f0ea}.message.assistant{margin-right:8%}.message p{margin:8px 0 0}.message-author{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:700}#message-form{margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}#message-form label{margin-bottom:5px}#message-form .row{margin-top:14px}.warning{color:#9b651e;font-weight:600}.score{display:flex;align-items:baseline;gap:12px;margin-top:20px;font-size:20px}.score #score-number{font-size:58px;line-height:1.2;font-weight:650;letter-spacing:-2px;color:var(--green)}.score-bar{height:8px;border-radius:20px;background:#e8eeea;margin:18px 0 22px;overflow:hidden}.score-bar span{display:block;background:var(--green);height:100%;width:0;transition:width .8s ease}.report,.transcript{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:14px;line-height:1.65;padding:20px;background:#f5f7f3;border-radius:12px}summary{cursor:pointer;color:var(--green);font-weight:550;padding:12px 0}details select{margin-bottom:10px}.device-code{font-size:22px;letter-spacing:3px;margin-right:20px}footer{text-align:center;margin:55px 24px 28px;font-size:12px;color:var(--muted)}[hidden]{display:none!important}@media(max-width:850px){.columns{grid-template-columns:1fr}.invite-form{grid-template-columns:1fr 1fr}.invite-form label:first-child{grid-column:1/-1}header{padding:17px 20px}header .muted{display:none}.client{margin-top:25px}.client .panel{padding:24px}main{padding:0 16px}.panel{padding:22px}h1{font-size:27px}.message.user{margin-left:3%}.message.assistant{margin-right:3%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.connection #device-help{flex-basis:100%}
/* The interview owns the viewport; only its conversation and long intro scroll. */
.interview-page{height:100vh;height:var(--app-height,100dvh);overflow:hidden;display:flex;flex-direction:column}.interview-page header{flex:none;padding:15px 5vw}.interview-page main.client{flex:1;min-height:0;width:100%;max-width:960px;margin:0 auto;padding:18px 24px;display:flex;flex-direction:column}.interview-page .notice{flex:none;max-height:100px;overflow:auto;margin:0 0 10px}.interview-page .panel{margin:0;min-height:0}.interview-page #intro{overflow:auto}.interview-page #chat-panel{flex:1;display:flex;flex-direction:column;padding:0;overflow:hidden}.interview-page .chat-heading{flex:none;padding:18px 24px 12px;margin:0;border-bottom:1px solid var(--line)}.interview-page .chat-heading h1{font-size:20px;margin:0 0 10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.progress-heading{display:flex;justify-content:space-between;gap:10px;font-size:13px}.interview-progress{height:5px;background:var(--pale);border-radius:20px;margin:8px 0 4px;overflow:hidden}.interview-progress>span{display:block;height:100%;background:var(--green);width:0;transition:width .3s}#interview-plan{position:relative;font-size:13px}#interview-plan summary{padding:3px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#interview-plan[open]{max-height:160px;overflow:auto}#plan-list{list-style:none;margin:8px 0;padding:0;display:flex;gap:6px;flex-wrap:wrap}#plan-list li{background:var(--paper);padding:3px 9px;border-radius:6px}#plan-list li.completed{color:var(--green)}#plan-list li.current{background:var(--pale);font-weight:650}#remaining{margin:4px 0}.conversation-wrap{min-height:0;flex:1;position:relative;display:flex;flex-direction:column}#conversation-scroll{overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;min-height:0;flex:1;padding:10px 24px 20px;overflow-anchor:none}#conversation-scroll:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}.interview-page .message{padding:14px 18px;font-size:15px}.interview-block{border-bottom:1px solid var(--line);margin-bottom:6px}.interview-block>summary{font-size:13px;display:list-item;padding:10px 0}.interview-block.completed>summary{color:var(--muted)}.interview-block.current>summary{color:var(--green)}.interview-block.pending>summary{color:var(--muted);cursor:default}.interview-block .block-messages{padding-bottom:6px}#jump-bottom{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);box-shadow:0 3px 18px #193c3720;font-size:12px;padding:7px 13px;white-space:nowrap}.reply-dock{flex:none;padding:12px 24px 16px;border-top:1px solid var(--line);background:white}.pause-status{display:flex;align-items:center;gap:10px}.pause-status p{margin:0;line-height:1.4}.pause-ring{width:48px;height:48px;flex:none;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--green) var(--remaining-angle,360deg),var(--line) 0)}.pause-ring:before{content:'';grid-area:1/1;width:40px;height:40px;border-radius:50%;background:white}.pause-ring span{grid-area:1/1;font-size:10px;font-variant-numeric:tabular-nums;font-weight:700;z-index:1}.pause-ring.warning{background:conic-gradient(#b88945 var(--remaining-angle,360deg),var(--line) 0)}.pause-ring.paused{background:var(--line)}.interview-page #message-form{border:0;margin:9px 0 0;padding:0}.interview-page #message-form label{font-size:12px;margin:0}.interview-page #answer{resize:none;min-height:72px;max-height:160px;height:88px;margin-top:4px;font-size:16px}.interview-page #message-form .row{margin-top:8px}.voice-actions{display:flex;flex-wrap:wrap;gap:6px}.voice-actions button{font-size:12px;padding:9px 11px}.interview-page #voice-status{margin:6px 0 0;font-size:12px;line-height:1.3}.interview-page #retry{margin:10px 0 0}.interview-page #completion{padding:18px 0}.interview-page #expired{margin:12px 0}.composer-actions{align-items:flex-start;flex-wrap:nowrap}.interview-page button:disabled{cursor:default}
@media(max-width:600px){.interview-page header{padding:10px 16px;font-size:13px}.interview-page .logo{width:29px;height:29px;font-size:17px}.interview-page main.client{padding:8px 8px}.interview-page .chat-heading{padding:12px 14px 8px}.interview-page .chat-heading h1{font-size:18px;margin-bottom:7px}#conversation-scroll{padding:6px 14px 15px}.reply-dock{padding:9px 14px 11px}.pause-ring{width:40px;height:40px}.pause-ring:before{width:33px;height:33px}.pause-ring span{font-size:9px}.pause-status p{font-size:12px}.interview-page #answer{height:76px}.interview-page #intro{padding:22px}.interview-page .message{padding:12px 14px}.interview-page #send{padding:10px 13px;white-space:nowrap}}
@media(max-height:600px){.interview-page header{padding:7px 14px}.interview-page .chat-heading{padding:7px 14px}.interview-page .chat-heading h1{display:none}.reply-dock{padding:6px 14px}.pause-ring{width:32px;height:32px}.pause-ring:before{width:27px;height:27px}.pause-ring span{font-size:8px}.interview-page #answer{height:60px;min-height:50px}.interview-page main.client{padding-top:4px;padding-bottom:4px}}
/* One optional left sidebar; the conversation has the full remaining height. */
.interview-page main.client{max-width:none;padding:14px 20px}.interview-page #intro{max-width:800px;width:100%;margin:auto}.interview-layout{flex:1;min-height:0;display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;position:relative}.interview-layout.sidebar-collapsed{grid-template-columns:minmax(0,1fr);gap:0}.interview-layout.sidebar-collapsed .interview-sidebar{display:none}.interview-sidebar{min-height:0;overflow-y:auto;padding:16px 18px;background:#eef2ec;border:1px solid var(--line);border-radius:14px}.sidebar-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.sidebar-heading h2{font-size:17px;margin:0}.sidebar-heading button{padding:4px 9px;background:transparent;font-size:20px}.side-section{padding:20px 0;border-bottom:1px solid var(--line)}.side-section:last-child{border:0}.side-section h3{font-size:13px;margin:0 0 12px}.interview-sidebar .pause-status{align-items:flex-start}.interview-sidebar .pause-ring{width:50px;height:50px}.interview-sidebar .pause-ring:before{width:42px;height:42px;background:#eef2ec}.interview-sidebar p{line-height:1.5}.interview-sidebar #interview-plan[open]{max-height:none;overflow:visible}.interview-sidebar #interview-plan summary{padding:8px 0;white-space:normal}.interview-sidebar #plan-list{display:block;margin:6px 0}.interview-sidebar #plan-list li{display:block;padding:8px 9px;margin:4px 0;background:transparent}.interview-sidebar #plan-list li.current{background:#dce9df}.interview-sidebar #remaining{font-size:12px;margin-top:10px}.interview-page #chat-panel{width:100%;max-width:900px;margin:0 auto;box-shadow:none;background:transparent;border:0;border-radius:0}.interview-page .chat-heading{display:flex;align-items:center;gap:14px;padding:4px 6px 16px;border:0}.interview-page .chat-heading h1{margin:0;font-size:19px;flex:1}.sidebar-toggle{padding:7px 11px;background:transparent;font-size:20px;border:0}#compact-time{font-variant-numeric:tabular-nums;font-size:12px}#conversation-scroll{padding:12px 20px 24px}.interview-page .message.assistant{background:transparent;margin:16px 0;padding:12px 4px}.interview-page .message.user{margin:16px 0 16px 12%;padding:14px 20px}.reply-dock{padding:12px 18px 8px;border:0;background:transparent}.interview-page #message-form{margin:0;padding:12px 14px 10px;border:1px solid #ccd7ce;border-radius:20px;background:#fff;box-shadow:0 3px 15px #193c3707}.interview-page #message-form:focus-within{border-color:var(--green)}.interview-page #message-form>label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.interview-page #answer{height:72px;min-height:52px;margin:0;padding:2px 2px 9px;border:0;border-radius:0;background:transparent;box-shadow:none}.interview-page #send{padding:10px 14px;border-radius:20px}.voice-actions button{border-radius:18px}.interview-page #voice-status{margin:7px 0 0}.interview-progress.indeterminate>span{animation:interview-pulse 2s ease-in-out infinite}@keyframes interview-pulse{50%{opacity:.35;transform:translateX(90%)}}@media(prefers-reduced-motion:reduce){.interview-progress.indeterminate>span{animation:none}}
@media(max-width:1000px){.interview-page main.client{padding:8px 12px}.interview-layout{grid-template-columns:minmax(0,1fr);gap:0}.interview-sidebar{position:absolute;top:48px;bottom:8px;left:0;width:min(280px,calc(100% - 20px));z-index:5;box-shadow:8px 8px 35px #193c3733;background:#f0f4ee}.interview-page .chat-heading{padding:4px 2px 8px}.interview-page #chat-panel{max-width:820px}.reply-dock{padding:10px 4px 6px}#conversation-scroll{padding:8px 12px 20px}.interview-page .chat-heading h1{display:block;font-size:17px}.interview-page .message.user{margin-left:6%}.interview-page #answer{height:68px}.interview-page #send{padding:10px 13px}.interview-sidebar .pause-ring:before{background:#f0f4ee}}
@media(max-height:600px){.interview-page .chat-heading{padding-bottom:4px}.interview-page #answer{height:52px}.reply-dock{padding-top:4px}.interview-page #message-form{padding-top:8px;padding-bottom:7px}}

/* Keep the entire chat in the visible viewport when iOS pans it for the keyboard. */
html.interview-root{height:100%;overflow:hidden;overscroll-behavior:none}.interview-page{position:fixed;top:var(--app-top,0px);left:0;width:100%;min-height:0;overscroll-behavior:none}.compact-viewport .interview-page>header{display:none}.compact-viewport .interview-page main.client{padding-top:4px;padding-bottom:4px}.compact-viewport .interview-page .chat-heading{padding-bottom:4px}.compact-viewport .interview-page #answer{height:52px}.compact-viewport .reply-dock{padding-top:4px}

.manager-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none}.manager-avatar svg{width:100%;height:100%}@media(max-width:600px){.manager-avatar{width:30px;height:30px}}

.interview-page header .brand{flex:1;min-width:0}.manager-title{min-width:0}.client-identity{margin-left:auto;flex:0 1 auto;min-width:0;max-width:38%;color:var(--muted);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}@media(max-width:600px){.interview-page header{gap:12px}.interview-page header .brand{gap:8px}.client-identity{font-size:12px;max-width:36%}}

/* Compact composer: one row at rest, growing text between the two touch controls. */
.interview-page #message-form{padding:8px;border-radius:26px}
.composer-input{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:4px;align-items:end}
.interview-page .composer-icon{width:44px;height:44px;min-width:44px;padding:10px;border:0;border-radius:50%;background:transparent;color:var(--ink)}
.interview-page .composer-icon:hover{background:var(--pale)}
.composer-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#voice-start,#voice-stop{grid-column:1;grid-row:1}
.interview-page #voice-stop{color:#a44038;background:#fff0ed}#voice-stop rect{fill:currentColor;stroke:none}
.interview-page #answer{grid-column:2;grid-row:1;height:44px;min-height:44px;max-height:180px;padding:10px 4px;margin:0;resize:none;overflow-y:auto;font-size:16px;line-height:24px}
.interview-page #send{grid-column:3;grid-row:1;padding:10px;background:var(--green);color:white}.interview-page #send:hover{background:#12533f}
.interview-page #send svg{fill:currentColor;stroke:var(--green);stroke-width:1.3}
.interview-page #send:disabled{opacity:.35;cursor:default}
.interview-page .voice-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-start}
.interview-page .voice-actions:has(button:not([hidden])){margin:8px 6px 0}
.interview-page .voice-actions button{font-size:12px;padding:7px 10px}
.interview-page #voice-status{font-size:12px;line-height:1.45;margin:6px 8px 2px}
.thinking-text{color:var(--muted)}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
 .thinking-text{background:linear-gradient(100deg,var(--muted) 35%,#c1d1ca 48%,var(--ink) 52%,var(--muted) 65%);background-size:250% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:thinking-shimmer 2.2s linear infinite}
}
@keyframes thinking-shimmer{from{background-position:150% 0}to{background-position:-100% 0}}
@media(prefers-reduced-motion:reduce){.thinking-text{animation:none;background:none;color:var(--muted)}}
@media(max-width:600px){.reply-dock{padding:6px 0 4px}.interview-page main.client{padding-right:8px;padding-left:8px}}

/* Voice status is announced to screen readers without taking up chat space. */
.interview-page #voice-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.interview-page #message-form[data-voice-phase="recording"] #voice-stop svg{animation:robot-signal 1.2s ease-in-out infinite}

/* Short robot reactions leave the conversation in place and stop at rest. */
.manager-avatar{width:44px;height:44px;padding:4px;border:0;border-radius:14px;background:transparent;overflow:visible}
.manager-avatar:hover{background:var(--pale)}
.manager-avatar svg{width:36px;height:36px;transform-origin:50% 75%;overflow:visible}
.manager-avatar .robot-eyes,.manager-avatar .robot-antenna{transform-box:fill-box;transform-origin:center}
.manager-avatar[data-state="thinking"],.manager-avatar[data-state="listening"]{background:var(--pale)}
.manager-avatar[data-state="thinking"] .robot-antenna{animation:robot-signal 1.4s ease-in-out infinite}
.manager-avatar[data-state="thinking"] .robot-eyes{animation:robot-blink 2.8s ease-in-out infinite}
.manager-avatar[data-state="listening"] .robot-antenna{fill:var(--green);animation:robot-signal .8s ease-in-out infinite}
.manager-avatar[data-reaction="tap"] svg{animation:robot-greet .65s ease-in-out}
.manager-avatar[data-reaction="send"] svg{animation:robot-nod .6s ease-in-out}
.manager-avatar[data-reaction="reply"] svg{animation:robot-reply .7s ease-out}
.manager-avatar[data-reaction] .robot-eyes{animation:robot-blink .7s ease-in-out}
.manager-avatar.robot-compact{display:none}
.compact-viewport .manager-avatar.robot-compact{display:inline-flex;margin-left:auto}
@keyframes robot-greet{0%,100%{transform:rotate(0)}25%{transform:rotate(-9deg)}55%{transform:rotate(8deg)}80%{transform:rotate(-3deg)}}
@keyframes robot-nod{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(3px) rotate(-6deg)}70%{transform:translateY(-1px) rotate(3deg)}}
@keyframes robot-reply{0%,100%{transform:translateY(0) scale(1)}35%{transform:translateY(-4px) scale(1.06)}65%{transform:translateY(1px) scale(.98)}}
@keyframes robot-blink{0%,35%,55%,100%{transform:scaleY(1)}45%{transform:scaleY(.15)}}
@keyframes robot-signal{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(1.35)}}
@media(max-width:600px){.manager-avatar svg{width:32px;height:32px}}
@media(prefers-reduced-motion:reduce){.manager-avatar svg,.manager-avatar .robot-eyes,.manager-avatar .robot-antenna,.interview-page #voice-stop svg{animation:none!important}}
