:root{color-scheme:dark;--bg:#171819;--panel:#1b1c1d;--line:#303233;--muted:#a4a6a6;--text:#eceeec;--accent:#d9b963;--soft:#232526;font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,textarea,select{font:inherit;color:inherit}button,a,input,textarea,select,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button{border:1px solid var(--line);background:var(--soft);border-radius:8px;padding:9px 14px}button:hover,a:hover{color:white;background-color:#2b2d2e}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input,textarea,select{border:1px solid var(--line);background:var(--bg);border-radius:7px;padding:10px 12px;width:100%;min-width:0}input:focus,textarea:focus{outline:1px solid var(--accent)}textarea{resize:vertical}h1,h2,h3,p{margin:0}h1{font-size:17px;font-weight:550;line-height:1.4}h2{font-size:20px;font-weight:500;letter-spacing:-.3px}h3{font-size:16px;font-weight:550}small{font-size:13px;color:var(--muted)}[hidden]{display:none!important}.shell{max-width:970px;margin:auto;padding:0 32px}.app-head{display:flex;align-items:center;justify-content:space-between;height:82px}.brand{font-size:20px;letter-spacing:-.8px;font-weight:500}.head-actions{display:flex;gap:18px;align-items:center}.demo-tag{font-size:13px;color:var(--muted)}.menu{position:relative}.menu summary{cursor:pointer;list-style:none;font-size:24px;line-height:1;padding:5px 10px}.menu summary::-webkit-details-marker{display:none}.menu>div{position:absolute;z-index:8;right:0;top:35px;min-width:195px;padding:6px;background:#222425;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 50px #0005}.menu a,.menu button{display:block;width:100%;text-align:left;border:0;padding:10px 12px;font-size:14px;background:transparent}.conversation{height:calc(100dvh - 138px);min-height:470px;max-height:890px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:15px;background:var(--panel);overflow:hidden}.conversation-head{display:flex;align-items:center;gap:14px;padding:23px 26px;border-bottom:1px solid #ffffff06}.conversation-head p{font-size:14px;color:var(--muted);margin-top:3px}.subtle{font-size:14px;background:transparent;border:0;color:var(--muted)}#new-conversation{margin-left:auto}.sunflower{width:43px;height:43px;flex-shrink:0;color:var(--accent);transition:filter .25s,transform .25s}.sunflower svg{width:100%;height:100%}.sunflower[data-state="speaking"]{filter:drop-shadow(0 0 7px #d9b96360)}.messages{flex:1;overflow:auto;overscroll-behavior:contain;padding:22px 30px;min-height:120px;scroll-behavior:smooth}.welcome{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;text-align:center}.welcome h2{font-size:23px;font-weight:450}.starters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.starters button{font-size:14px;color:#c9ccca;border-color:#383b3a;background:transparent}.message{margin:0 0 22px;max-width:90%;white-space:pre-wrap;overflow-wrap:anywhere}.message.user{background:#2a2c2c;border-radius:14px 14px 3px 14px;padding:11px 16px;width:fit-content;margin-left:auto}.message.assistant{line-height:1.65}.message a{color:var(--accent);text-decoration:underline}.message img{display:block;max-width:220px;max-height:170px;border-radius:8px;margin-bottom:8px}.composer{display:flex;align-items:flex-end;gap:5px;padding:14px 18px;border-top:1px solid var(--line);background:#1d1e1f}.composer textarea{border:0;outline:0;resize:none;background:transparent;padding:10px 5px;max-height:140px;min-height:45px}.icon-button{border:0;background:transparent;width:44px;height:44px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:10px;font-size:25px;color:var(--muted)}.icon-button svg,.talk svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.attach{cursor:pointer}.talk{display:flex;gap:8px;align-items:center;padding:10px 12px;height:44px;background:#30312b;border-color:#545039;color:#ead393}.talk.active{background:#3b2927;color:#eec5b9;border-color:#62413a}.notice{font-size:14px;color:#d6c29b;padding:0 23px;max-height:86px;overflow:auto}.notice:not(:empty){padding-top:9px;padding-bottom:9px}.app-foot{display:flex;justify-content:center;gap:5px;flex-wrap:wrap;font-size:12px;color:#919593;padding:14px 0}.app-foot button{border:0;padding:0;background:none;font-size:12px;color:#c1c4c0;text-decoration:underline}.context-card{margin:0 22px 16px;padding:17px 20px;border:1px solid #494639;border-radius:10px;background:#22231f;max-height:52%;overflow:auto}.context-card h3{margin-bottom:10px}.context-card .caption{font-size:14px;color:var(--muted);margin-bottom:10px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}.fields label,.field{display:flex;flex-direction:column;gap:5px;font-size:14px;color:#c2c6c2}.fields .full{grid-column:1/-1}.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:16px}.primary{background:#d9c082;color:#1c1b16;border-color:#d9c082;font-weight:550}.primary:hover{background:#ead29a;color:#171713}.line-item{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.line-item>div{flex:1}.line-item input{width:72px;padding:6px 8px}.money{font-variant-numeric:tabular-nums;white-space:nowrap}.totals{margin:12px 0}.totals>div{display:flex;justify-content:space-between;padding:3px 0;font-size:14px}.totals>div:last-child{font-size:17px;margin-top:5px}.choice{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}.choice>div{flex:1}.choice small{display:block}.error{color:#e4a39a}.badge{font-size:12px;padding:3px 8px;border-radius:5px;background:#31382e;color:#c6d8bb}.photo-tray{padding:8px 24px;display:flex;align-items:center;gap:12px}.photo-tray img{height:60px;width:60px;object-fit:cover;border-radius:7px}.photo-tray button{font-size:13px}.photo-tray span{font-size:13px;color:var(--muted)}dialog{background:var(--panel);color:var(--text);border:1px solid #424544;border-radius:14px;max-width:620px;width:calc(100% - 32px);max-height:85dvh;padding:24px}dialog::backdrop{background:#0009;backdrop-filter:blur(3px)}dialog header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}dialog p{margin:0 0 14px}dialog .record{border-top:1px solid var(--line);padding:16px 0}.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}.staff-shell{max-width:1250px;padding:0 32px;margin:auto}.staff-layout{display:grid;grid-template-columns:300px minmax(0,1fr);border:1px solid var(--line);border-radius:13px;min-height:calc(100dvh - 155px);overflow:hidden}.staff-queue{border-right:1px solid var(--line);padding:16px}.staff-queue>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.queue-tabs{display:flex;gap:5px;margin-bottom:14px}.queue-tabs button{flex:1;font-size:13px}.queue-item{display:block;text-align:left;width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:15px 10px}.queue-item.active{background:#2b2c27;border-radius:6px}.queue-item small{display:block;margin-top:4px}.staff-detail{padding:27px;overflow:auto}.staff-detail>header{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:24px}.staff-detail .section{border-top:1px solid var(--line);margin-top:24px;padding-top:20px}.staff-detail h3{margin-bottom:12px}.staff-detail .messages{padding:0;max-height:350px}.staff-nav{display:flex;gap:10px;margin-bottom:18px}.staff-nav button.active{border-color:var(--accent)}.empty{color:var(--muted);padding:35px 10px;text-align:center}.audit{font-size:14px;color:var(--muted);padding:8px 0}.inline-error{padding-top:10px;color:#e4a39a;font-size:14px}.settings-row{display:grid;grid-template-columns:1fr 110px 100px;gap:12px;align-items:end;border-bottom:1px solid var(--line);padding:15px 0}.settings-row label{font-size:14px}.settings-row input{margin-top:5px}.staff-head-title{display:flex;gap:14px;align-items:center}.staff-head-title select{font-size:15px}.staff-status{font-size:13px;color:var(--muted)} @media(max-width:640px){.shell{padding:0 10px}.app-head{height:59px;padding:0 7px}.conversation{height:calc(100dvh - 105px);min-height:360px;border-radius:12px}.conversation-head{padding:17px 16px;gap:11px}.sunflower{width:35px;height:35px}.messages{padding:20px 17px}.welcome h2{font-size:21px}.starters{max-width:300px}.message{max-width:95%}.context-card{margin:0 10px 10px;padding:14px;max-height:60%}.composer{padding:10px 6px;gap:0}.talk span{display:none}.talk{padding:10px}.fields{gap:10px}.app-foot{padding:9px 0}.staff-shell{padding:0 12px}.staff-layout{display:block}.staff-queue{border-right:0;border-bottom:1px solid var(--line)}#queue{max-height:210px;overflow:auto}.staff-detail{padding:18px}.staff-head-title{gap:7px}.staff-head-title .brand{display:none}.settings-row{grid-template-columns:1fr 85px 75px;gap:7px}.notice{padding-left:15px;padding-right:15px}} @media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}} .connection-list{border-top:1px solid var(--line)}.connection-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}.connection-row strong,.connection-row small{display:block}.connection-row small{color:var(--muted);font-size:13px;margin-top:3px}.connection-state{font-size:13px;color:var(--muted);white-space:nowrap}.connection-state.ready{color:#c6d8bb}.connection-state.draft{color:#d9c082}@media(max-width:640px){.connection-row{grid-template-columns:1fr auto}.connection-row>small{grid-column:1/-1;margin-top:-10px}} .staff-layout.auth-required{display:block;min-height:calc(100dvh - 155px)}.staff-layout.auth-required .staff-queue{display:none}.staff-layout.auth-required .staff-detail{min-height:calc(100dvh - 155px);display:grid;place-items:center}.staff-access{display:flex;align-items:center;flex-direction:column;gap:12px;text-align:center}.staff-access p{color:var(--muted);margin:0}.staff-access .primary{display:inline-block;margin-top:7px;padding:10px 15px;border-radius:8px} /* Staff workspace: quiet, centered, and deliberately sparse. */ body:has(.staff-shell){background:#141516;color:#eceeec}.staff-shell{max-width:1160px;padding:0 28px}.staff-shell .app-head{height:78px}.staff-shell .brand{font-size:19px;font-weight:500;letter-spacing:-.7px}.staff-shell .head-actions a{font-size:14px;color:#a9adab}.staff-shell .staff-nav{display:flex;justify-content:center;gap:28px;margin:0 0 24px;border-bottom:1px solid #292b2b}.staff-shell .staff-nav button{border:0;border-radius:0;padding:10px 2px 13px;background:transparent;color:#929795;font-size:14px}.staff-shell .staff-nav button.active{color:#eceeec;border-bottom:1px solid #d9b963}.staff-shell .staff-layout{border:0;border-radius:0;min-height:calc(100dvh - 135px);background:#191a1b;box-shadow:0 18px 70px #0002}.staff-shell .staff-queue{border-right:1px solid #292b2b;padding:24px 18px}.staff-shell .staff-queue>header{margin:0 6px 16px}.staff-shell .staff-queue h2{font-size:15px;font-weight:500;color:#cfd2d0}.staff-shell .queue-item{padding:14px 10px;border-bottom:1px solid #292b2b}.staff-shell .queue-item.active{background:#242524;border-radius:7px}.staff-shell .staff-detail{padding:34px 48px;max-width:760px}.staff-shell .staff-detail>header{margin-bottom:28px}.staff-shell .staff-detail h2{font-size:21px;letter-spacing:-.35px}.staff-shell .staff-detail .section{border-top:1px solid #292b2b;margin-top:26px;padding-top:22px}.staff-shell .staff-detail h3{font-size:14px;color:#bfc3c1;font-weight:550;letter-spacing:.01em}.staff-shell .staff-status{color:#8f9391}.staff-shell .line-item{border-bottom:1px solid #292b2b}.staff-shell .field{margin:0 0 14px}.staff-shell .field span{font-size:13px;color:#8f9391}.staff-shell input,.staff-shell textarea{background:#151617;border-color:#292b2b}.staff-shell .actions{margin-top:18px}.staff-shell .primary{background:#d9b963;border-color:#d9b963;color:#1a1914}.staff-shell .connection-list{border-top:1px solid #292b2b}.staff-shell .connection-row{border-bottom:1px solid #292b2b;padding:17px 0}.staff-shell .connection-row strong{font-size:15px;font-weight:500}.staff-shell .connection-state{font-size:13px}.staff-shell .empty{padding:60px 20px}.staff-shell .staff-access{min-height:260px}.staff-shell .staff-access h2{font-size:22px;font-weight:450}.staff-shell .staff-access .primary{font-size:14px} @media(max-width:700px){.staff-shell{padding:0 12px}.staff-shell .app-head{height:64px}.staff-shell .staff-nav{gap:20px;margin-bottom:14px}.staff-shell .staff-layout{min-height:calc(100dvh - 110px)}.staff-shell .staff-queue{padding:14px 10px}.staff-shell .staff-detail{padding:25px 18px}.staff-shell .staff-detail>header{margin-bottom:22px}.staff-shell .staff-layout.auth-required .staff-detail{min-height:calc(100dvh - 110px)}} @media(max-width:700px){.menu-row{grid-template-columns:minmax(0,1fr) 82px auto}.menu-row input:first-child{grid-column:1/-1}} .staff-shell .app-head{display:flex;height:68px} .staff-layout.queue-hidden{display:block}.staff-layout.queue-hidden .staff-queue{display:none}.staff-layout.queue-hidden .staff-detail{width:100%;margin:0 auto} .menu-row{display:grid;grid-template-columns:minmax(0,1fr) 110px minmax(0,1.5fr) auto;gap:8px;align-items:center;margin-bottom:8px}.menu-row button{padding:7px 9px}.add-menu{padding-left:0;padding-right:0}.advanced{border-top:1px solid #292b2b;padding-top:20px}.advanced summary{cursor:pointer;color:#bfc3c1;font-size:14px}.advanced[open] summary{margin-bottom:16px} .request-photos{display:flex;flex-wrap:wrap;gap:10px}.request-photos img{width:120px;height:90px;object-fit:cover;border-radius:8px;border:1px solid var(--line)} .request-owner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 16px;align-items:end}.request-owner .field{margin:0;max-width:420px}.request-owner [data-assign]{margin-bottom:14px}.request-owner #assignment-note{grid-column:1/-1;margin:0} @media(max-width:560px){.request-owner{grid-template-columns:1fr}.request-owner [data-assign]{justify-self:start;margin:0}.request-owner #assignment-note{grid-column:auto}} .employee-profile:not([open]){padding-bottom:0}.employee-profile>summary{cursor:pointer;color:#c4c8c5}.employee-profile>.field{max-width:560px;margin-top:15px}.employee-profile>button{margin-top:5px} .task-coordination .task-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.task-coordination .field{margin-top:14px}.task-coordination .actions{margin-top:13px}.task-coordination .actions button{font-size:13px;padding:7px 11px}.task-coordination select:disabled,.task-coordination input:disabled,.task-coordination textarea:disabled{opacity:.7}.task-activity ol{list-style:none;margin:12px 0 0;padding:0}.task-activity li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:9px 0;border-top:1px solid #292b2b}.task-activity li small{white-space:nowrap}.today-requests .today-request{display:flex;justify-content:space-between;align-items:center;gap:18px;width:100%;padding:12px 2px;text-align:left;border:0;border-bottom:1px solid #292b2b;border-radius:0;background:transparent}.today-requests .today-request>span{min-width:0;display:grid;gap:2px}.today-requests .today-request strong{font-size:14px;font-weight:500}.today-requests .today-request>small{flex:none;text-align:right}.today-requests .today-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.today-requests .today-section-head .subtle{font-size:12px;padding:5px 0}.employee-profile .field{max-width:560px}.employee-profile>summary{font-size:14px}.task-coordination .staff-status[role=status]{margin-top:10px} @media(max-width:700px){.task-coordination .task-fields{grid-template-columns:1fr 1fr}.task-coordination .task-fields .field:first-child{grid-column:1/-1}.task-activity li{display:grid;gap:3px}.task-activity li small{white-space:normal}.today-requests .today-request{align-items:flex-start;gap:8px}.today-requests .today-request>small{max-width:42%;white-space:normal}} .employee-assistant{position:relative;margin:0;padding:18px 0 20px;border-bottom:1px solid #292b2b} .employee-assistant-body{position:relative} .employee-assistant-options{position:absolute;z-index:2;right:0;top:0} .employee-assistant-options>summary{list-style:none;cursor:pointer;color:#747876;font-size:14px;letter-spacing:1px;padding:4px 0 4px 8px} .employee-assistant-options>summary::-webkit-details-marker{display:none} .employee-assistant-options>button{position:absolute;right:0;top:26px;white-space:nowrap;font-size:12px;padding:7px 10px;background:#202223} #employee-assistant-log{max-height:320px;overflow:auto;padding:2px 28px 8px 0;overscroll-behavior:contain} .employee-assistant-message{max-width:88%;margin:0 0 12px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.55} .employee-assistant-message.user{margin-left:auto;padding:8px 12px;border-radius:10px 10px 2px 10px;background:#242627} .employee-assistant-message.assistant{color:#d8dad8} .employee-assistant-message{white-space:normal} .employee-message-content{white-space:pre-wrap} .employee-work-source{margin:0 0 8px} .employee-work-open{margin-top:12px} #employee-assistant-form{display:flex;align-items:flex-end;gap:5px;max-width:680px;border:1px solid #292b2b;border-radius:9px;background:#151617;padding:4px} #employee-assistant-form textarea{flex:1;min-height:38px;max-height:120px;border:0;background:transparent;padding:8px 9px;resize:none} #employee-assistant-form textarea:focus{outline:0} #employee-assistant-form button{flex:none;width:38px;height:38px;padding:0;border:0;border-radius:7px;background:#2b2d2c;color:#d6d8d6;font-size:18px} .employee-assistant-empty{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;color:#9ca09d;font-size:13px} p.employee-assistant-empty{display:block;min-height:0;padding:8px 1px 13px} .employee-assistant-empty .subtle{flex:none;padding:6px 0} .employee-agent-briefing{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px;padding:10px 0;border-bottom:1px solid var(--line)} .employee-agent-briefing p{max-width:560px;font-size:14px;line-height:1.5;color:var(--text)} .employee-agent-briefing-actions{display:flex;flex:none;align-items:center;gap:8px} .employee-agent-briefing-actions .subtle{padding:6px 0;font-size:13px} .employee-agent-briefing-actions .subtle:first-child{color:var(--accent)} @media(max-width:560px){.employee-agent-briefing{align-items:flex-start;flex-direction:column;gap:4px}.employee-agent-briefing-actions{gap:18px}} @media(max-width:560px){.employee-assistant{padding-top:14px}.employee-assistant-message{max-width:94%}.employee-assistant-empty{align-items:flex-start}} .employee-task-proposal{margin-top:10px;padding-top:9px;border-top:1px solid #343635} .employee-task-proposal>p{margin:0 0 6px} .employee-task-proposal .staff-status{font-size:13px} .employee-task-proposal-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px} .employee-proposal-recipient{max-width:360px;margin-top:10px} .task-forward{max-width:420px;margin-top:12px} .task-forward>summary{cursor:pointer;color:#aeb2af;font-size:13px;list-style-position:inside} .task-forward[open] .field{margin-top:10px} .task-forward>button{margin-top:9px} .task-forward>[data-forward-note]:empty{display:none} .task-forward>[data-forward-note]:not(:empty){margin:8px 0 0;font-size:13px} /* Customer frame: one quiet, centred surface. Keep the staff workspace rules above intact. */ body:has(.conversation){min-height:100dvh;display:grid;place-items:center;background:#151617} .shell{width:100%;max-width:none;min-height:100dvh;padding:16px;display:grid;place-items:center} .conversation{width:100%;max-width:1248px;height:380px;min-height:0;max-height:calc(100dvh - 32px);border-color:#2b2d2e;background:#1a1b1c} .conversation.engaged{height:min(760px,calc(100dvh - 32px))} .conversation-head{height:80px;flex:0 0 80px;padding:18px 24px;border-bottom-color:#242627} .sunflower{width:42px;height:42px} .venue{min-width:0} .venue h1{font-size:16px} .venue p{font-size:13px;margin-top:2px} .conversation-head>.menu{margin-left:auto} .conversation-head>.menu summary{color:#aeb1af;font-size:20px;padding:8px 4px;letter-spacing:2px} .conversation-head>.menu>div{top:38px;right:-2px} .menu .demo-tag{display:block;padding:8px 12px 6px;color:#8f9391;font-size:12px;border-bottom:1px solid #303233;margin-bottom:3px} .menu a,.menu button{font-size:13px} #new-conversation{margin-left:0} .messages{padding:20px 28px} .welcome{gap:8px} .welcome h2{font-size:16px;font-weight:450;letter-spacing:0} .welcome p{color:#8f9391;font-size:13px} .starters{display:none} .welcome .starters{display:flex;max-width:540px;margin-top:12px} .welcome .starters button{font-size:13px;padding:8px 12px;border-radius:7px;color:#c9ccca;border-color:#383b3a;background:transparent} .welcome .starters button:hover{color:#f0f1ee;background:#242627;border-color:#4a4c4a} .composer{margin:0 24px 18px;padding:0 6px 0 0;min-height:58px;flex:0 0 58px;gap:0;align-items:center;border:1px solid #303233;border-radius:10px;background:#1a1b1c} .composer textarea{min-height:56px;padding:16px 8px;line-height:1.4} .composer .icon-button{height:56px;width:44px} .composer .attach{order:-1} .composer .talk{height:56px;min-width:72px;width:auto;border:0;background:var(--accent);color:#171819;border-radius:8px;padding:10px 14px;display:inline-flex;gap:7px;align-items:center;justify-content:center;font-weight:600} .composer .talk:hover{background:#ecd28d;color:#171819} .composer .talk.active{background:#302526;color:#e2aaa0} .composer .talk svg{width:20px;height:20px} .composer .talk-label{display:inline;font-size:13px} .composer #send{color:#afb3b1} .notice{padding-left:24px;padding-right:24px;color:#d7c48f} .context-card{margin:0 24px 16px;background:#1e2020;border-color:#303233} .photo-tray{padding:8px 24px} .app-head,.app-foot{display:none} @media(max-width:640px){ body:has(.conversation){place-items:center} .shell{padding:10px} .conversation{height:min(560px,calc(100dvh - 20px));max-height:calc(100dvh - 20px);border-radius:12px} .conversation.engaged{height:calc(100dvh - 20px)} .conversation-head{height:68px;flex-basis:68px;padding:14px 16px} .sunflower{width:35px;height:35px} .messages{padding:18px 16px} .composer{margin:0 10px 10px;min-height:56px;flex-basis:56px} .composer textarea{min-height:54px;padding-left:6px} .composer .icon-button{height:54px;width:40px} .composer .talk{height:54px;min-width:64px;width:auto;padding:10px 11px} .composer .talk-label{font-size:13px} .context-card{margin-left:10px;margin-right:10px} } .context-card .request-kicker{margin:0 0 6px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.context-card .request-summary{margin:0 0 12px;font-size:16px;line-height:1.45} .connection-control{justify-self:end;min-width:150px;text-align:right}.connection-action{font-size:13px;color:var(--accent);text-decoration:underline;background:transparent;border:0;padding:4px 0}.connection-next{font-size:13px;color:var(--muted)} @media(max-width:640px){.connection-control{grid-column:1/-1;justify-self:start;text-align:left;min-width:0}.connection-next{font-size:12px}} .object-kicker{margin:0 0 5px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.object-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:0 0 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.object-links>div{padding:13px 14px;border-right:1px solid var(--line)}.object-links>div:last-child{border-right:0}.object-links small,.object-links strong{display:block}.object-links small{color:var(--muted);font-size:12px;margin-bottom:4px}.object-links strong{font-size:14px;font-weight:500}@media(max-width:640px){.object-links{grid-template-columns:1fr}.object-links>div{border-right:0;border-bottom:1px solid var(--line)}.object-links>div:last-child{border-bottom:0}} .connection-setup{max-width:560px}.connection-setup h3{margin:26px 0 8px}.connection-setup p{color:var(--muted);line-height:1.5} .setup-computer{border-top:1px solid var(--line);padding-top:18px}.setup-computer button{margin-top:14px}.setup-computer .quiet-link{margin-left:12px;color:var(--muted);background:transparent;border:0;text-decoration:underline} .connection-setup ol{margin:24px 0;padding-left:20px;color:var(--muted);line-height:1.8}.connection-keys{margin:24px 0;padding-top:16px;border-top:1px solid var(--line)}.connection-keys code{display:block;margin:8px 0;color:var(--text);font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace} /* Final visual pass: one quiet surface, one obvious action, no dashboard chrome. */ body:has(.conversation){background:#111211} body:has(.conversation) .shell{padding:16px} body:has(.conversation) .conversation{max-width:820px;height:min(820px,calc(100dvh - 32px));min-height:620px;border:1px solid #292b29;border-radius:24px;background:#171918;box-shadow:0 24px 80px #0005} body:has(.conversation) .conversation-head{position:relative;height:94px;flex:0 0 94px;justify-content:center;padding:18px 72px;border-bottom-color:#222523} body:has(.conversation) .conversation-head .sunflower{width:35px;height:35px} body:has(.conversation) .conversation-head .venue{text-align:center} body:has(.conversation) .conversation-head .venue h1{font-size:16px;letter-spacing:-.15px} body:has(.conversation) .conversation-head .venue p{font-size:12px;color:#878c88} body:has(.conversation) .conversation-head>.menu{position:absolute;right:22px;top:25px} body:has(.conversation) .conversation-head>.menu summary{font-size:18px;color:#858a87} .voice-stage{height:224px;flex:0 0 224px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px} .voice-stage .talk{width:142px;height:142px;border:1px solid #e1c475;background:#d9b963;color:#151614;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px;box-shadow:0 0 0 1px #e7cf8b1f,0 0 46px #d9b96324;transition:transform .18s ease,background .18s ease,box-shadow .18s ease} .voice-stage .talk:hover{background:#e7ca79;color:#151614;transform:translateY(-2px);box-shadow:0 0 0 1px #f0d9932b,0 0 58px #d9b96336} .voice-stage .talk:active{transform:translateY(1px)} .voice-stage .talk svg{width:27px;height:27px;stroke-width:1.6} .voice-stage .talk-label{font-size:16px;font-weight:550;letter-spacing:-.1px} .voice-stage .talk.active{background:#382a28;border-color:#85594e;color:#edc1b4;box-shadow:0 0 0 5px #85594e1b,0 0 42px #85594e28} .voice-stage-status{font-size:12px;color:#858a87;letter-spacing:.02em} body:has(.conversation) .messages{padding:8px 36px 18px;min-height:150px} body:has(.conversation) .welcome{gap:11px} body:has(.conversation) .welcome h2{font-size:17px;color:#c6cbc7;font-weight:430} body:has(.conversation) .welcome .starters{margin-top:10px;gap:6px} body:has(.conversation) .welcome .starters button{border:0;border-bottom:1px solid #4a4d49;border-radius:0;padding:5px 3px;color:#aeb4af;font-size:12px;background:transparent} body:has(.conversation) .welcome .starters button:hover{color:#e5e7e3;background:transparent;border-color:var(--accent)} body:has(.conversation) .composer{margin:0 36px 22px;padding:0 7px 0 11px;height:58px;min-height:58px;flex:0 0 58px;border-radius:30px;border:1px solid #343735;background:#141615} body:has(.conversation) .composer textarea{height:56px;min-height:56px;padding:17px 9px;font-size:14px;color:#d8dcd8} body:has(.conversation) .composer textarea::placeholder{color:#777d79} body:has(.conversation) .composer .icon-button{height:56px;width:38px;color:#8d938e} body:has(.conversation) .composer .attach{order:-1} body:has(.conversation) .composer #send{color:#c9ac5d} body:has(.conversation) .notice{text-align:center;padding-left:32px;padding-right:32px;color:#d2b967;font-size:12px} body:has(.conversation) .conversation.engaged .voice-stage{height:188px;flex-basis:188px} body:has(.conversation) .conversation.engaged .voice-stage .talk{width:112px;height:112px} body:has(.conversation) .conversation.engaged .voice-stage .talk-label{font-size:14px} body:has(.conversation) .conversation.engaged .voice-stage .talk svg{width:23px;height:23px} /* Staff keeps the same visual grammar without turning into a second product. */ body:has(.staff-shell){background:#111211} body:has(.staff-shell) .staff-shell{max-width:1120px;padding:0 24px} body:has(.staff-shell) .staff-shell .app-head{height:72px} body:has(.staff-shell) .staff-layout{background:#171918;box-shadow:0 24px 80px #0003} body:has(.staff-shell) .staff-shell .staff-nav{margin-bottom:18px} body:has(.staff-shell) .staff-shell .staff-detail{padding:32px 42px} body:has(.staff-shell) .staff-shell .staff-queue{padding:20px 16px} body:has(.staff-shell) .staff-shell .connection-action{color:#d9b963} body:has(.staff-shell) .staff-shell .primary{background:#d9b963;border-color:#d9b963;color:#181713} body:has(.staff-shell) .staff-shell .primary:hover{background:#e6c979} @media(max-width:640px){ body:has(.conversation) .shell{padding:10px} body:has(.conversation) .conversation{height:calc(100dvh - 20px);min-height:0;border-radius:18px} body:has(.conversation) .conversation-head{height:78px;flex-basis:78px;padding:14px 56px} body:has(.conversation) .conversation-head>.menu{right:14px;top:18px} .voice-stage{height:188px;flex-basis:188px} .voice-stage .talk{width:118px;height:118px} body:has(.conversation) .messages{padding:8px 18px 14px} body:has(.conversation) .composer{margin:0 12px 12px;height:55px;min-height:55px;flex-basis:55px} body:has(.conversation) .composer textarea{height:53px;min-height:53px;padding-top:15px} body:has(.conversation) .composer .icon-button{height:53px} body:has(.staff-shell) .staff-shell{padding:0 12px} body:has(.staff-shell) .staff-shell .staff-detail{padding:24px 18px} } /* Customer correction: keep the quiet voice-first composition without the oversized empty card that made the first viewport feel unfinished. */ body:has(.conversation) .conversation{max-width:900px;height:min(680px,calc(100dvh - 48px));min-height:0;border-radius:18px} body:has(.conversation) .conversation-head{height:76px;flex-basis:76px;padding:14px 64px} body:has(.conversation) .conversation-head .sunflower{width:34px;height:34px} .voice-stage{height:184px;flex-basis:184px;gap:11px} .voice-stage .talk{width:136px;height:136px} body:has(.conversation) .messages{padding:0 36px 12px;min-height:100px} body:has(.conversation) .welcome{justify-content:flex-start;padding-top:20px} body:has(.conversation) .composer{margin-bottom:16px} @media(max-width:640px){ body:has(.conversation) .conversation{height:calc(100dvh - 20px);border-radius:18px} body:has(.conversation) .conversation-head{height:70px;flex-basis:70px;padding:12px 52px} .voice-stage{height:164px;flex-basis:164px} .voice-stage .talk{width:118px;height:118px} body:has(.conversation) .messages{padding:0 18px 10px} body:has(.conversation) .welcome{padding-top:14px} } /* UI polish: keep the customer surface compact at rest and give the staff surface a clear identity without adding dashboard chrome. */ body:has(.conversation){overflow:hidden} body:has(.conversation) .shell{padding:24px} body:has(.conversation) .conversation{width:min(900px,100%);height:min(560px,calc(100dvh - 48px));min-height:0;max-height:calc(100dvh - 48px);border-radius:18px} body:has(.conversation) .conversation.engaged{height:min(760px,calc(100dvh - 48px))} body:has(.conversation) .messages{min-height:92px} body:has(.staff-shell) .staff-shell{max-width:1120px} body:has(.staff-shell) .staff-shell .app-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:76px;border-bottom:1px solid #292b2b} .staff-identity{min-width:0;justify-self:start} .staff-identity strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:500;letter-spacing:-.1px} body:has(.staff-shell) .head-actions{justify-self:end} body:has(.staff-shell) .head-actions a{padding:6px 0} body:has(.staff-shell) .staff-layout:not(.queue-hidden) .staff-detail{display:flex;flex-direction:column} body:has(.staff-shell) .staff-layout:not(.queue-hidden) .staff-detail>.empty{flex:1;display:grid;place-items:center;min-height:220px} @media(max-width:700px){ body:has(.conversation) .shell{padding:10px} body:has(.conversation) .conversation,body:has(.conversation) .conversation.engaged{height:calc(100dvh - 20px);max-height:calc(100dvh - 20px)} body:has(.staff-shell) .staff-shell .app-head{grid-template-columns:minmax(0,1fr) auto;height:66px} body:has(.staff-shell) .staff-shell .staff-nav{justify-content:space-between;gap:0;overflow:visible;flex-wrap:nowrap} body:has(.staff-shell) .staff-shell .staff-nav button{font-size:13px;white-space:nowrap} body:has(.staff-shell) .staff-layout:not(.queue-hidden) .staff-detail>.empty{min-height:140px} } body:has(.conversation) .conversation-head .history-link{margin-left:auto;padding:6px 0;border:0;background:transparent;color:#858a87;font-size:12px} body:has(.conversation) .conversation-head .history-link:hover{background:transparent;color:#eceeec} body:has(.conversation) .welcome{gap:7px} body:has(.conversation) .welcome h2{max-width:300px;font-size:18px;line-height:1.3} body:has(.conversation) .welcome p{color:#858a87;font-size:12px} /* Customer geometry: the identity is centred on the surface, not centred beside the logo. The voice action is the only visual focal point. */ body:has(.conversation) .conversation{max-width:760px;height:min(520px,calc(100dvh - 48px));border-radius:20px;box-shadow:0 22px 70px #0004} body:has(.conversation) .conversation-head{position:relative;justify-content:center;height:72px;flex-basis:72px;padding:12px 72px} body:has(.conversation) .conversation-head .sunflower{position:absolute;left:24px;top:19px;margin:0} body:has(.conversation) .conversation-head .venue{text-align:center} body:has(.conversation) .conversation-head .venue h1{font-size:15px;line-height:1.3} body:has(.conversation) .conversation-head .venue p{margin-top:4px;font-size:11px;letter-spacing:.01em} body:has(.conversation) .conversation-head .history-link{position:absolute;right:24px;top:25px;margin:0} body:has(.conversation) .voice-stage{height:176px;flex-basis:176px;gap:10px} body:has(.conversation) .voice-stage .talk{width:128px;height:128px} body:has(.conversation) .messages{padding:0 28px 12px} body:has(.conversation) .welcome{padding:0;gap:6px} body:has(.conversation) .welcome h2{font-size:17px} body:has(.conversation) .composer{margin:0 24px 20px;height:54px;min-height:54px;flex-basis:54px} body:has(.conversation) .composer textarea{height:52px;min-height:52px;padding-top:14px} @media(max-width:700px){ body:has(.conversation) .conversation{height:calc(100dvh - 20px);border-radius:18px} body:has(.conversation) .conversation-head{height:70px;flex-basis:70px;padding:11px 52px} body:has(.conversation) .conversation-head .sunflower{left:16px;top:17px} body:has(.conversation) .conversation-head .history-link{right:16px;top:23px} body:has(.conversation) .voice-stage{height:166px;flex-basis:166px} body:has(.conversation) .voice-stage .talk{width:118px;height:118px} body:has(.conversation) .messages{padding:0 18px 10px} body:has(.conversation) .composer{margin:0 12px 12px} } /* Customer surface: a direct, quiet voice-chat composition. This is the reference geometry for customer pages; capabilities remain in the same DOM and are revealed only when used. */ body:has(.conversation){background:#151515;display:grid;place-items:center;overflow:hidden} body:has(.conversation) .shell{width:100%;max-width:none;min-height:100dvh;padding:16px;display:grid;place-items:center} body:has(.conversation) .conversation{width:min(880px,100%);height:min(420px,calc(100dvh - 32px));max-width:none;max-height:calc(100dvh - 32px);min-height:0;border:1px solid #303030;border-radius:12px;background:#171717;box-shadow:none} body:has(.conversation) .conversation.engaged{height:min(760px,calc(100dvh - 32px))} body:has(.conversation) .conversation-head{height:80px;flex:0 0 80px;padding:18px 24px;gap:12px;justify-content:flex-start;border-bottom:0} body:has(.conversation) .conversation-head .sunflower{width:36px;height:36px;position:static;flex:0 0 36px} body:has(.conversation) .conversation-head .venue{text-align:left} body:has(.conversation) .conversation-head .venue h1{font-size:16px;font-weight:500;line-height:1.4} body:has(.conversation) .conversation-head .venue p{margin-top:2px;font-size:13px;color:#a3a3a3} body:has(.conversation) .conversation-head .venue p:empty{display:none} body:has(.conversation) .conversation-head .history-link{margin-left:auto;position:static;min-height:44px;padding:10px 0;border:0;background:transparent;color:#a3a3a3;font-size:14px} body:has(.conversation) .conversation-head .history-link:hover{background:transparent;color:#e6e6e6} body:has(.conversation) .messages{padding:12px 24px;min-height:0} body:has(.conversation) .welcome{gap:8px} body:has(.conversation) .welcome-mark{width:44px;height:44px;margin-bottom:5px} body:has(.conversation) .welcome-mark .sunflower{width:44px;height:44px} body:has(.conversation) .welcome h2{font-size:20px;font-weight:400;letter-spacing:0;line-height:1.4;color:#e2e2e2} body:has(.conversation) .welcome p{font-size:14px;color:#888;line-height:1.4} body:has(.conversation) .composer{height:auto;min-height:92px;flex:0 0 auto;margin:0;padding:24px;border:0;border-top:1px solid #282828;border-radius:0;background:transparent;gap:8px;align-items:center} body:has(.conversation) .composer textarea{height:44px;min-height:44px;padding:10px 12px;border:1px solid #414141;border-radius:8px;background:#202020;font-size:16px;line-height:22px} body:has(.conversation) .composer textarea:focus{outline:1px solid #656565} body:has(.conversation) .composer .icon-button{width:34px;height:36px;padding:7px;color:#898989} body:has(.conversation) .composer .attach{font-size:25px} body:has(.conversation) .composer #send{order:3;color:#8e8e8e} body:has(.conversation) .composer .talk{order:4;min-width:92px;flex:0 0 auto;background:#303030;border:1px solid #404040;border-radius:8px;color:#ececec;display:inline-flex;gap:8px;align-items:center;justify-content:center;font-weight:500} body:has(.conversation) .composer .talk-label{display:inline;font-size:14px} body:has(.conversation) .composer .talk:hover{background:#3a3a3a;color:#fff} body:has(.conversation) .composer .talk.active{background:#282323;color:#dfb9ae} body:has(.conversation) .composer .talk svg{width:21px;height:21px} body:has(.setup-page) .setup-credentials{display:grid;gap:8px;margin-top:4px;padding-top:4px} body:has(.setup-page) .setup-credentials summary{cursor:pointer;color:#c7c7c7;font-size:13px} body:has(.setup-page) .setup-credentials>small{max-width:52ch} body:has(.conversation) .notice{padding-left:25px;padding-right:25px;color:#cfb878;font-size:12px;text-align:left} body:has(.conversation) .photo-tray{padding:8px 25px} body:has(.conversation) .context-card{margin:0 25px 14px} body:has(.conversation) .message{max-width:80%} body:has(.conversation) .request-list{display:grid;gap:8px} body:has(.conversation) .request-record{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:left;padding:14px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent} body:has(.conversation) .request-record:hover{background:transparent;color:var(--text)} body:has(.conversation) .request-record-main{min-width:0;display:grid;gap:4px} body:has(.conversation) .request-record-main strong{font-size:15px;font-weight:550} body:has(.conversation) .request-record-main span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#a2a2a2;font-size:14px} body:has(.conversation) .request-record-meta{display:grid;justify-items:end;gap:4px;flex:0 0 auto} body:has(.conversation) .request-record-meta small:first-child{color:#d2b967} body:has(.conversation) #detail-dialog{max-width:560px;width:min(560px,calc(100% - 28px));padding:0;overflow:hidden;border-color:#383a39} body:has(.conversation) #detail-dialog>header{height:62px;margin:0;padding:0 20px;border-bottom:1px solid #2a2c2c} body:has(.conversation) #detail-dialog>header h2{font-size:15px;font-weight:500} body:has(.conversation) #detail-dialog>#dialog-body{max-height:calc(85dvh - 62px);overflow:auto} body:has(.conversation) .request-detail{padding:22px 22px 0} body:has(.conversation) .request-detail-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:18px} body:has(.conversation) .request-detail-head h3{font-size:18px;font-weight:500;line-height:1.38;letter-spacing:-.1px} body:has(.conversation) .request-kicker{margin:0 0 5px;color:#9a9a9a;font-size:12px} body:has(.conversation) .request-status{color:#d2b967;font-size:13px;white-space:nowrap;padding-top:2px} body:has(.conversation) .request-detail-date{margin-top:7px;color:#858585;font-size:12px} body:has(.conversation) .request-detail-section{border-top:1px solid #2a2c2c;margin-top:20px;padding-top:16px} body:has(.conversation) .request-detail-section h4{margin:0 0 10px;color:#aeb1af;font-size:12px;font-weight:550;text-transform:uppercase;letter-spacing:.06em} body:has(.conversation) .request-detail-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;margin:0} body:has(.conversation) .request-detail-facts div{min-width:0} body:has(.conversation) .request-detail-facts dt{color:#858585;font-size:12px} body:has(.conversation) .request-detail-facts dd{margin:2px 0 0;overflow-wrap:anywhere;font-size:14px} body:has(.conversation) .request-detail-needs p,body:has(.conversation) .request-detail-update p{color:#d6c28f;font-size:14px} body:has(.conversation) .request-detail-attachment{margin:18px 0 0;color:#858585;font-size:13px} body:has(.conversation) .request-detail-thread{border-top:1px solid #2a2c2c;margin-top:20px;padding-top:14px} body:has(.conversation) .request-detail-thread summary{display:flex;justify-content:space-between;cursor:pointer;color:#aeb1af;font-size:13px;list-style:none} body:has(.conversation) .request-detail-thread summary::-webkit-details-marker{display:none} body:has(.conversation) .request-detail-thread summary span{color:#858585} body:has(.conversation) .request-detail-thread>div{margin-top:10px} body:has(.conversation) .request-message{padding:9px 0;border-bottom:1px solid #242424} body:has(.conversation) .request-message small{color:#858585} body:has(.conversation) .request-message p{margin-top:3px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px} body:has(.conversation) .request-detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin:22px -22px 0;padding:14px 22px 20px;border-top:1px solid #2a2c2c} @media(max-width:640px){ body:has(.conversation) .shell{padding:10px} body:has(.conversation) .conversation,body:has(.conversation) .conversation.engaged{height:calc(100dvh - 20px);max-height:calc(100dvh - 20px);border-radius:11px} body:has(.conversation) .conversation-head{height:70px;flex-basis:70px;padding:14px 16px} body:has(.conversation) .conversation-head .sunflower{width:35px;height:35px;flex-basis:35px} body:has(.conversation) .conversation-head .history-link{font-size:14px} body:has(.conversation) .messages{padding:0 17px} body:has(.conversation) .composer{height:76px;min-height:76px;flex-basis:76px;padding:20px 10px;gap:5px} body:has(.conversation) .composer textarea{height:44px;min-height:44px} body:has(.conversation) .context-card{margin-left:12px;margin-right:12px} body:has(.conversation) .photo-tray{padding-left:12px;padding-right:12px} body:has(.conversation) .request-record{gap:10px} body:has(.conversation) .request-record-meta{font-size:12px} body:has(.conversation) .request-fields div{grid-template-columns:1fr;gap:2px} body:has(.conversation) .request-detail{padding:18px 16px 0} body:has(.conversation) .request-detail-facts{grid-template-columns:1fr;gap:10px} body:has(.conversation) .request-detail-actions{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px} } /* Interaction corrections. Preserve the existing sunflower and single surface. */ body:has(.conversation) .welcome{justify-content:center;padding:20px 0;min-height:100%;height:100%} body:has(.conversation) .composer{height:auto;flex:0 0 auto;min-height:84px;align-items:center} body:has(.conversation) .composer .icon-button{width:44px;height:44px;flex:0 0 44px} body:has(.conversation) .composer .talk{width:auto;flex:0 0 auto} body:has(.conversation) .composer textarea{min-width:0;max-height:140px;overflow-y:auto} body:has(.conversation) .context-card{max-height:32dvh;overflow:auto;flex-shrink:0} body:has(.conversation) .notice:empty{display:none} body:has(.conversation) .notice{max-height:100px;overflow:auto;flex-shrink:0} body:has(.staff-shell) .staff-shell .app-head{display:flex;justify-content:space-between;align-items:center} .staff-shell .head-actions{margin-left:auto} .staff-detail input,.staff-detail textarea{min-width:0} .staff-detail [role=alert],#review-error{color:#e4bca6;font-size:13px;overflow-wrap:anywhere} .staff-detail .save-actions{position:sticky;bottom:0;background:var(--panel,#171717);padding:14px 0;z-index:2} .staff-detail .advanced>summary{cursor:pointer} .staff-layout.auth-required .staff-queue{display:none} .connection-link{text-decoration:none;color:inherit;min-height:72px} .connection-link:hover{background:#202020} .route-url{display:block;overflow-wrap:anywhere;font-size:12px;margin:10px 0} .connection-form [data-human-routing],.connection-form [data-twilio-routing]{display:grid;gap:14px} .connection-form [hidden]{display:none!important} button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #b8b2a0;outline-offset:3px} /* Staff workspace: hierarchy comes from position, spacing and the active underline, not a page full of competing semi-bold labels. */ body:has(.staff-shell) .staff-shell{font-weight:400} body:has(.staff-shell) .staff-identity strong{font-weight:400} body:has(.staff-shell) .staff-nav button{font-weight:400} body:has(.staff-shell) .staff-queue h2, body:has(.staff-shell) .staff-detail h2, body:has(.staff-shell) .staff-detail h3{font-weight:400} body:has(.staff-shell) .staff-detail h3{color:#aeb2b0} body:has(.staff-shell) .staff-detail .field, body:has(.staff-shell) .staff-detail .field span, body:has(.staff-shell) .advanced summary, body:has(.staff-shell) .connection-row strong, body:has(.staff-shell) .queue-item strong{font-weight:400} body:has(.staff-shell) .connection-row strong{font-size:14px;color:#c7cbc8} body:has(.staff-shell) .queue-item.active strong, body:has(.staff-shell) .primary{font-weight:500} body:has(.staff-shell) .advanced summary{color:#aeb2b0;font-size:13px} #review-error a{text-decoration:underline;white-space:nowrap} @media(max-width:600px){ .staff-shell .menu-row{grid-template-columns:minmax(0,1fr) 80px 36px} .staff-shell .menu-row [data-menu-note]{grid-column:1/-1;grid-row:2} .staff-shell .menu-row [data-remove-menu]{grid-column:3;grid-row:1} } @media(max-width:700px){ .staff-layout.request-open .staff-queue{display:none} body:has(.staff-shell) .staff-shell .staff-layout:not(.request-open):not(.queue-hidden):not(.auth-required) .staff-detail{display:none} .model-row{grid-template-columns:1fr} .connection-row{grid-template-columns:minmax(0,1fr) auto!important;gap:10px} .connection-row>span:last-child{display:none} body:has(.conversation) .composer{height:auto;min-height:76px;padding:16px 10px;gap:4px} body:has(.conversation) .composer .talk{min-width:78px;padding:8px;gap:6px} body:has(.conversation) .composer textarea{padding-left:10px;padding-right:10px} body:has(.conversation) .request-detail-head{grid-template-columns:1fr;gap:8px} body:has(.conversation) .request-record-meta{max-width:105px;white-space:normal} } @media(prefers-reduced-motion:reduce){ .sunflower,.sunflower svg{animation:none!important;transition:none} .messages{scroll-behavior:auto} } /* Formatting audit: preserve the quiet surface while making list actions and their state legible at every viewport. */ .staff-shell .setup-alerts{display:flex;align-items:center;justify-content:space-between;gap:20px} .staff-shell .setup-alerts h3{margin:0} .staff-shell .setup-alerts .staff-status:empty{display:none} .staff-shell .setup-alerts button{flex:0 0 auto;margin:0} .staff-shell .connection-row{min-height:64px;padding:12px 0} .staff-shell .connection-state{text-align:right} @media(max-width:700px){ .staff-shell .setup-alerts{align-items:flex-start} .staff-shell .connection-row{grid-template-columns:minmax(0,1fr) auto auto!important;gap:10px} .staff-shell .connection-row>span:last-child{display:block;color:#aeb2b0;font-size:18px;line-height:1} } .home-shell{min-height:100dvh;display:grid;place-items:center;padding-top:32px;padding-bottom:32px} .onboarding-surface{width:min(100%,620px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px;padding:44px 30px;border:1px solid var(--line);border-radius:15px;background:var(--panel)} .onboarding-copy{display:grid;gap:8px;max-width:470px} .onboarding-copy h1{font-size:26px;font-weight:450;letter-spacing:-.5px} .onboarding-copy p{color:var(--muted);font-size:15px;line-height:1.55} .onboarding-step{color:var(--accent)!important;font-size:13px!important;text-transform:uppercase;letter-spacing:.08em} .onboarding-actions{display:grid;justify-items:center;gap:14px} .onboarding-actions .primary{min-width:178px} .quiet-link{border:0!important;background:transparent!important;color:var(--muted)!important;font-size:14px;padding:6px!important} .quiet-link:hover{color:var(--text)!important} .onboarding-form{width:min(100%,360px);display:grid;gap:15px;text-align:left} .onboarding-form label{display:grid;gap:6px;color:var(--muted);font-size:14px} .onboarding-form textarea{resize:vertical;min-height:96px} .onboarding-form .primary{justify-self:start} .onboarding-form [role=status]{min-height:1.4em;color:var(--muted);font-size:14px} .onboarding-guide{max-width:620px} .onboarding-guide>header{margin-bottom:24px} .onboarding-guide .staff-status{margin-top:6px;max-width:510px} .onboarding-steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)} .onboarding-steps li{border-bottom:1px solid var(--line)} .onboarding-steps a{display:grid;grid-template-columns:132px minmax(0,1fr);gap:16px;padding:18px 0;background:transparent} .onboarding-steps a:hover{background:transparent;color:var(--text)} .onboarding-steps strong{font-weight:550} .onboarding-steps span{color:var(--muted);font-size:14px} .onboarding-customer-link{display:inline-block;margin-top:18px;padding-left:0!important} @media(max-width:600px){.home-shell{padding:20px}.onboarding-surface{padding:34px 22px}.onboarding-steps a{grid-template-columns:1fr;gap:3px}.onboarding-form{width:100%}} /* Staff start: one purpose, one action, no repeated business identity. */ .staff-shell .onboarding-guide{max-width:560px} .staff-shell .onboarding-guide>header{margin-bottom:22px} .staff-shell .onboarding-guide h1{margin:0} .staff-shell .onboarding-guide .staff-status{max-width:460px;margin-top:7px;line-height:1.55} .staff-shell .onboarding-actions{display:flex;align-items:center;justify-content:flex-start;gap:16px} .staff-shell .onboarding-actions .primary{min-width:0} body:has(.staff-shell) .staff-layout.start-view{min-height:0;background:transparent;box-shadow:none} body:has(.staff-shell) .staff-layout.start-view .staff-detail{max-width:560px;padding:30px 0 0;margin:0} @media(max-width:700px){body:has(.staff-shell) .staff-layout.start-view .staff-detail{padding:24px 0 0}} /* Staff workspace layout pass: one aligned rail, deliberate action placement, and a business editor that reads as grouped information rather than a wall of unrelated fields. */ body:has(.staff-shell) .staff-shell{max-width:1120px;padding-left:32px;padding-right:32px} body:has(.staff-shell) .staff-layout.queue-hidden, body:has(.staff-shell) .staff-layout.start-view{display:block;width:min(100%,900px);margin:0 auto;min-height:0;background:transparent;box-shadow:none;overflow:visible} body:has(.staff-shell) .staff-layout.queue-hidden .staff-queue, body:has(.staff-shell) .staff-layout.start-view .staff-queue{display:none} body:has(.staff-shell) .staff-layout.queue-hidden .staff-detail, body:has(.staff-shell) .staff-layout.start-view .staff-detail{width:100%;max-width:none;margin:0;padding:0 0 72px;overflow:visible} body:has(.staff-shell) .staff-detail>.detail-header{padding:25px 0 23px;margin:0;border-bottom:1px solid #292b2b;align-items:flex-start} body:has(.staff-shell) .staff-detail>.detail-header .actions{margin-top:-5px} body:has(.staff-shell) #business-form{border-top:0} body:has(.staff-shell) #business-form>.section{margin:0;padding:28px 0;border-top:1px solid #292b2b} body:has(.staff-shell) #business-form>.section:first-child{border-top:0} body:has(.staff-shell) #business-form>.business-section, body:has(.staff-shell) #business-form>.customer-section, body:has(.staff-shell) #business-form>.agent-section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px} body:has(.staff-shell) #business-form>.section>h3{grid-column:1/-1;margin:0 0 1px;color:#d6d9d7;font-size:15px;font-weight:450;letter-spacing:0} body:has(.staff-shell) #business-form>.section>.field{margin:0;min-width:0} body:has(.staff-shell) #business-form>.business-section>.field:has(textarea[name="services"]), body:has(.staff-shell) #business-form>.business-section>.field:nth-of-type(3), body:has(.staff-shell) #business-form>.agent-section>.field:has(textarea[name="rules"]), body:has(.staff-shell) #business-form>.agent-section>.field:has(textarea[name="handoff"]){grid-column:1/-1} body:has(.staff-shell) #business-form>.advanced{padding:20px 0} body:has(.staff-shell) #business-form>.advanced>summary{display:flex;align-items:center;justify-content:space-between;margin:0;color:#c4c8c5;font-size:14px} body:has(.staff-shell) #business-form>.advanced>summary::after{content:'+';font-size:18px;color:#8f9491} body:has(.staff-shell) #business-form>.advanced[open]>summary::after{content:'−'} body:has(.staff-shell) #business-form>.advanced[open]>summary{margin-bottom:18px} body:has(.staff-shell) .staff-detail>.section:not(#business-form .section){border-top:1px solid #292b2b;margin:0;padding:28px 0} body:has(.staff-shell) .staff-layout.start-view .staff-detail{padding:0 0 72px} body:has(.staff-shell) .staff-layout.start-view .onboarding-guide{width:100%;max-width:none;display:flex;align-items:center;justify-content:space-between;gap:36px;padding:30px 0;border-top:1px solid #292b2b;border-bottom:1px solid #292b2b} body:has(.staff-shell) .staff-layout.start-view .onboarding-guide-copy{max-width:560px} body:has(.staff-shell) .staff-layout.start-view .onboarding-guide h1{margin:0} body:has(.staff-shell) .staff-layout.start-view .onboarding-guide .staff-status{max-width:520px;margin-top:8px;line-height:1.55} body:has(.staff-shell) .staff-layout.start-view .onboarding-actions{display:flex;flex:0 0 auto;flex-wrap:wrap;align-items:center;gap:16px;margin:0} body:has(.staff-shell) .staff-layout.start-view .onboarding-actions .primary{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-width:190px;padding:12px 15px;border-radius:8px;line-height:1.2} body:has(.staff-shell) .staff-layout.start-view .onboarding-actions .primary span:last-child{font-size:18px;line-height:1} @media(max-width:700px){ body:has(.staff-shell) .staff-shell{padding-left:12px;padding-right:12px} body:has(.staff-shell) .staff-layout.queue-hidden, body:has(.staff-shell) .staff-layout.start-view{width:100%} body:has(.staff-shell) .staff-detail>.detail-header{padding-top:20px;padding-bottom:18px} body:has(.staff-shell) #business-form>.business-section, body:has(.staff-shell) #business-form>.customer-section, body:has(.staff-shell) #business-form>.agent-section{grid-template-columns:1fr;gap:15px} body:has(.staff-shell) #business-form>.section>h3{margin-bottom:2px} body:has(.staff-shell) #business-form>.business-section>.field:has(textarea[name="services"]), body:has(.staff-shell) #business-form>.agent-section>.field:has(textarea[name="rules"]), body:has(.staff-shell) #business-form>.agent-section>.field:has(textarea[name="handoff"]){grid-column:auto} body:has(.staff-shell) .staff-layout.start-view .onboarding-guide{align-items:stretch;flex-direction:column;gap:24px;padding:24px 0} body:has(.staff-shell) .staff-layout.start-view .onboarding-actions .primary{width:100%;min-width:0} } /* Customer chat: compact until the customer actually begins a conversation. The surface expands for real messages; it never uses an empty card as filler. */ body:has(.conversation){background:#131414} body:has(.conversation) .shell{padding:24px} body:has(.conversation) .conversation{width:min(100%,760px);height:146px;min-height:0;max-height:none;border:1px solid #2a2c2c;border-radius:16px;background:#191a1a;box-shadow:0 24px 90px #0003} body:has(.conversation) .conversation.engaged{height:min(760px,calc(100dvh - 48px))} body:has(.conversation) .conversation-head{height:64px;flex:0 0 64px;padding:12px 18px;gap:11px;border-bottom:1px solid #282a2a} body:has(.conversation) .conversation-head .sunflower{width:36px;height:36px;flex:0 0 36px} body:has(.conversation) .venue h1{font-size:15px;font-weight:450;letter-spacing:-.15px;line-height:1.25} body:has(.conversation) .venue p{min-height:0;margin-top:2px;font-size:12px;color:#9da19f} body:has(.conversation) .history-link{margin-left:auto;border:0;background:transparent;color:#a9adab;padding:8px 4px;font-size:13px;font-weight:400} body:has(.conversation) .history-link:hover{background:transparent;color:#f0f1ee} body:has(.conversation) .messages{display:none;padding:24px 28px;min-height:0} body:has(.conversation) .conversation.engaged .messages{display:block} body:has(.conversation) .welcome{display:none} body:has(.conversation) .message{margin-bottom:18px;line-height:1.6} body:has(.conversation) .message.user{padding:10px 14px;border-radius:12px 12px 3px 12px;background:#292b2b} body:has(.conversation) .composer{height:54px;min-height:54px;flex:0 0 54px;margin:0 16px 16px;padding:0;gap:6px;border:0;background:transparent;align-items:stretch} body:has(.conversation) .composer textarea{height:54px;min-height:54px;padding:15px 13px;border:1px solid #303232;border-radius:10px;background:#1d1e1e;line-height:1.4;overflow-y:auto} body:has(.conversation) .composer textarea::placeholder{color:#878c89;opacity:1} body:has(.conversation) .composer .icon-button{width:40px;height:54px;flex:0 0 40px;padding:9px;border-radius:9px;color:#aeb2b0} body:has(.conversation) .composer .icon-button:hover{background:#242626;color:#f0f1ee} body:has(.conversation) .composer #attach-photo{order:0} body:has(.conversation) .composer #send{order:2} body:has(.conversation) .composer .talk{order:3;min-width:82px;width:auto;flex:0 0 82px;height:54px;padding:10px 12px;border:1px solid #383a39;border-radius:9px;background:#252726;color:#f0f1ee;gap:7px;font-size:13px;font-weight:500} body:has(.conversation) .composer .talk:hover{background:#303230;color:#fff} body:has(.conversation) .composer .talk.active{background:#302526;border-color:#62413a;color:#e9beb2} body:has(.conversation) .composer .talk-label{display:inline;font-size:13px} body:has(.conversation) .photo-tray{padding:0 16px 12px;gap:8px} body:has(.conversation) .context-card{margin:0 16px 12px;padding:12px 0;border:0;border-top:1px solid #2a2c2c;border-radius:0;background:transparent;max-height:none} body:has(.conversation) .request-summary{font-size:14px;font-weight:400;line-height:1.45} body:has(.conversation) .context-card .caption{margin:4px 0 0;color:#979b98;font-size:13px} body:has(.conversation) .context-card .actions{margin-top:10px} body:has(.conversation) .context-card .actions button{padding:7px 10px;border-radius:7px;font-size:13px} body:has(.conversation) .notice{padding:0 16px 12px;color:#d7c48f;font-size:13px} @media(max-width:640px){ body:has(.conversation) .shell{padding:10px} body:has(.conversation) .conversation{height:140px;border-radius:13px} body:has(.conversation) .conversation.engaged{height:calc(100dvh - 20px);min-height:360px;max-height:calc(100dvh - 20px)} body:has(.conversation) .conversation-head{height:62px;flex-basis:62px;padding:12px 14px} body:has(.conversation) .conversation-head .sunflower{width:34px;height:34px;flex-basis:34px} body:has(.conversation) .messages{padding:18px 16px} body:has(.conversation) .composer{height:52px;min-height:52px;flex-basis:52px;margin:0 10px 10px;gap:4px} body:has(.conversation) .composer textarea{height:52px;min-height:52px;padding:14px 10px;font-size:14px} body:has(.conversation) .composer .icon-button{width:34px;height:52px;flex-basis:34px;padding:5px} body:has(.conversation) .composer .talk{min-width:72px;flex-basis:72px;height:52px;padding:8px} body:has(.conversation) .context-card{margin:0 10px 10px} body:has(.conversation) .photo-tray,body:has(.conversation) .notice{padding-left:10px;padding-right:10px} } /* First-use setup is a quiet single surface. Connected systems, not a long questionnaire, are the primary source of operational truth. */ body.setup-page{min-height:100dvh;display:grid;place-items:center;background:#151515;color:#e6e6e6} .setup-shell{width:100%;max-width:760px;padding:16px} .setup-conversation{display:flex;flex-direction:column;min-height:460px;max-height:calc(100dvh - 32px);overflow:hidden;border:1px solid #303030;border-radius:12px;background:#171717} .setup-head{height:64px;display:flex;align-items:center;border-bottom:1px solid #282828}.setup-head .sunflower{margin-left:24px;width:32px;height:32px} .setup-thread{flex:1;min-height:0;overflow:auto;padding:24px 28px 26px;display:flex;flex-direction:column;gap:0;overscroll-behavior:contain}.setup-history{display:grid;flex:0 0 auto;gap:20px;padding-bottom:28px}.setup-history:empty{display:none}.setup-current{display:grid;flex:0 0 auto;min-height:calc(100dvh - 32px - 64px - 84px - 50px);box-sizing:border-box;align-content:end;gap:20px;padding-top:28px}.setup-message{max-width:100%;font-size:14px;line-height:1.5}.setup-message>p{font-size:17px;font-weight:450;line-height:1.4;margin-bottom:6px}.setup-message small{color:#929292;font-size:13px;line-height:1.5}.setup-message.setup-agent{border-bottom:1px solid #2b2b2b;padding:0 0 18px}.setup-message.setup-context-message{border-bottom:0;padding-bottom:0}.setup-message:last-child{border-bottom:0;padding-bottom:0} .setup-message.setup-user{display:flex;justify-content:flex-end;border-bottom:0;padding:0}.setup-user>p{max-width:70%;margin:0;padding:10px 12px;border:1px solid #303030;border-radius:10px;background:#202020;font-size:14px;line-height:1.45;overflow-wrap:anywhere} .setup-source-intro{max-width:66ch;margin:0;color:#aeb0ad;font-size:14px;font-weight:400;line-height:1.55}.setup-source-details{margin-top:16px}.setup-facts{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin:0}.setup-facts>div{display:grid;grid-template-columns:minmax(108px,140px) minmax(0,1fr);align-items:start;column-gap:18px;min-width:0;padding:11px 0;border-bottom:1px solid #2b2b2b}.setup-facts small,.setup-facts span{display:block}.setup-facts small{margin:2px 0 0;font-size:13px;font-weight:500;color:#9c9e9b;text-transform:none;letter-spacing:0}.setup-facts span{font-size:15px;font-weight:400;line-height:1.5;color:#e3e3e3;overflow-wrap:anywhere}.setup-facts>[data-source-empty]{display:block;color:#aaa;font-size:14px;line-height:1.5}.setup-sources{display:block;margin-top:12px;padding-top:10px;border-top:1px solid #2b2b2b;font-size:13px;color:#999;line-height:1.5}.setup-sources summary{width:max-content;max-width:100%;cursor:pointer;color:#b7b7b2}.setup-sources>div{display:grid;gap:7px;margin-top:8px}.setup-sources a{width:max-content;max-width:100%;color:#d0bb78;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}.setup-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:18px}.setup-actions .setup-back{margin-top:0!important} .setup-primary{margin-top:16px}.setup-primary button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:14px;background:#25231d;border-color:#806f43;text-align:left}.setup-primary button span{font-size:14px}.setup-primary button small{color:#d6bc70;white-space:nowrap}.setup-step-detail{display:block;margin-top:8px;max-width:60ch} .setup-primary.setup-optional{display:grid;gap:8px}.setup-primary.setup-optional>div{display:grid;gap:4px}.setup-primary.setup-optional>.setup-skip{justify-self:start;width:auto;margin:0;padding:0;background:transparent;border:0;color:#999;font-size:13px}.setup-primary.setup-optional>.setup-skip:hover{color:#eee} .setup-introduction{display:grid;gap:8px;max-width:58ch}.setup-introduction>p:first-child{max-width:56ch;font-size:14px;font-weight:400;line-height:1.6;color:#b0b0b0}.setup-introduction .setup-question{max-width:40ch;margin-top:20px;font-size:17px;font-weight:500;line-height:1.4;color:#f0f0f0}.setup-introduction small{font-size:12px;line-height:1.5;color:#858585}.setup-introduction small:empty,.setup-introduction p:empty{min-height:1.5em}.setup-context{color:#eceeec;margin-bottom:4px!important}.setup-context-note{display:block}.setup-next{margin:0}.setup-next>p{margin-bottom:5px}.setup-candidates{display:grid;gap:8px;margin:16px 0}.setup-candidates button{display:grid;gap:2px;width:100%;padding:12px 14px;text-align:left;background:#1d1d1d;border-color:#303030}.setup-candidates button span{font-size:14px}.setup-candidates button small{font-size:12px;overflow-wrap:anywhere} .setup-connections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}.setup-connections button{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px;background:#1d1d1d;border-color:#303030;text-align:left}.setup-connections button:last-child{grid-column:1/-1}.setup-connections button span{font-size:14px}.setup-connections button small{font-size:12px;color:#929292;white-space:nowrap} .setup-composer{display:flex;align-items:center;gap:8px;min-height:84px;padding:19px 24px;border-top:1px solid #282828}.setup-composer input{height:46px;border-color:#414141;border-radius:8px;background:#202020;font-size:15px}.setup-composer button{width:46px;height:46px;flex:0 0 46px;padding:0;border:0;border-radius:8px;background:#303030;color:#e6e6e6;font-size:19px}.setup-composer button:hover{background:#3a3a3a}.setup-notice{min-height:0;margin:0;padding:0 24px 16px;color:#cfb878;font-size:13px} .setup-form{display:grid;gap:12px;margin-top:16px}.setup-form label{display:grid;gap:5px;color:#aaa;font-size:13px}.setup-form input,.setup-form select{background:#202020;border-color:#3c3c3c}.setup-form input[type=file]{padding:8px;color:#aaa}.setup-form input[type=file]::file-selector-button{margin-right:10px;padding:7px 10px;border:1px solid #444;border-radius:6px;background:#2a2a2a;color:#e6e6e6}.setup-form [data-twilio-fields],.setup-form [data-staff-number]{display:grid;gap:12px}.setup-form button{justify-self:start;margin-top:4px} .setup-phone-handoff>small{display:block;max-width:58ch;line-height:1.6}.setup-phone-steps{display:grid;gap:16px;margin:16px 0 0;padding:0;list-style:none;counter-reset:phone-step}.setup-phone-steps>li{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:8px;counter-increment:phone-step}.setup-phone-steps>li::before{content:counter(phone-step);display:grid;place-items:center;width:22px;height:22px;border:1px solid #4a4a4a;border-radius:50%;color:#d6bc70;font-size:12px}.setup-phone-steps strong{grid-column:2;font-size:14px;font-weight:500;color:#e6e6e6}.setup-phone-steps small{grid-column:2;display:block;margin-top:4px;line-height:1.55}.setup-copy{display:block;margin-top:8px!important;padding:0!important;text-align:left;text-decoration:underline!important}.setup-phone-test{margin-top:10px;padding-top:10px;border-top:1px solid #2b2b2b}.setup-phone-test summary{cursor:pointer;color:#d6bc70;font-size:14px}.setup-phone-test>small{display:block;margin-top:9px}.setup-test-status{min-height:1.4em;margin:8px 0 0;color:#cfb878;font-size:13px} .setup-phone-steps>li>.setup-phone-test{grid-column:2;min-width:0;width:100%}.setup-phone-test .setup-form{width:100%;max-width:420px}.setup-phone-test .setup-form input[type=tel]{width:100%} .setup-phone-handoff>small{display:block;max-width:64ch;line-height:1.55}.setup-phone-destination{display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:680px;margin:18px 0 24px;padding:13px 15px;border:1px solid #3b3b3b;border-radius:8px;background:#1d1d1d}.setup-phone-destination>div{display:grid;gap:4px;min-width:0}.setup-phone-destination small{font-size:12px;color:#8f8f8f}.setup-phone-destination code{font:500 15px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e6e6e6;overflow-wrap:anywhere}.setup-phone-destination .setup-copy{margin:0!important;white-space:nowrap}.setup-phone-steps{max-width:680px;gap:20px}.setup-phone-test{margin-top:13px;padding-top:13px}.setup-phone-test .setup-form{margin-top:14px}.setup-phone-test .setup-form label>small{display:block;margin:0;color:#898989;font-size:12px} .setup-phone-provider-request{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;max-width:680px;margin:0 0 24px;padding:14px 15px;border:1px solid #303030;border-radius:8px;background:#191a1a}.setup-phone-provider-request>div{min-width:0}.setup-phone-provider-request strong{display:block;font-size:13px;font-weight:500;color:#d8d8d8}.setup-phone-provider-request p{margin:7px 0 0;color:#a7a7a7;font-size:13px;line-height:1.55}.setup-phone-provider-request .quiet-link{flex:0 0 auto;margin:0!important;white-space:nowrap} .setup-phone-start,.setup-phone-test-active,.setup-phone-complete{display:grid;gap:8px;max-width:680px}.setup-phone-start .primary{justify-self:start}.setup-phone-start small,.setup-phone-test-active small,.setup-phone-complete small{display:block}.setup-phone-complete{padding:14px 15px;border:1px solid #35352d;border-radius:8px;background:#1b1b18}.setup-phone-complete strong,.setup-phone-test-active strong{font-size:14px;font-weight:500;color:#e6e6e6}.setup-phone-start{margin-top:2px} @media(max-width:640px){.setup-phone-destination{align-items:flex-start;flex-direction:column;gap:10px}.setup-phone-destination .setup-copy{padding-left:0!important}.setup-phone-steps{gap:17px}} .setup-edit{display:inline-block;margin-top:16px;color:#8c8c8c;font-size:13px;text-decoration:none}.setup-edit:hover{color:#ededed} .setup-back{display:block;margin-top:14px!important;padding-left:0!important}.setup-history-question{border:0!important;padding:0!important;margin:4px 0 -14px!important}.setup-history-question>p{font-size:14px!important;font-weight:400!important;color:#a9acab}.setup-edit-message{display:block;margin-top:4px!important;padding-left:0!important;font-size:12px!important} @media(min-width:641px){body.setup-page:has(.setup-context-message) .setup-conversation{min-height:400px}} @media(max-width:640px){.setup-shell{padding:10px}.setup-conversation{min-height:calc(100dvh - 20px);max-height:calc(100dvh - 20px);border-radius:11px}.setup-head{height:62px}.setup-head .sunflower{left:16px;width:32px;height:32px}.setup-thread{padding:22px 17px}.setup-current{min-height:0}.setup-facts,.setup-connections{grid-template-columns:1fr}.setup-facts>div{grid-template-columns:minmax(0,1fr);row-gap:3px;padding:10px 0}.setup-facts small{margin:0}.setup-composer{min-height:76px;padding:16px 12px}.setup-notice{padding:0 16px 12px}} /* The sunflower remains gently alive while the conversation stays visible. */ .setup-current{min-height:0;align-content:start} /* Keep first-use hierarchy compact: explanation, question, answer. */ .setup-current{gap:16px;padding-top:20px} .setup-message>p{font-size:16px;line-height:1.45} .setup-introduction{gap:6px} .setup-introduction .setup-question{margin-top:14px;font-size:16px;line-height:1.45} .setup-introduction>p:first-child{line-height:1.55} .setup-composer{gap:10px;min-height:80px;padding:16px 24px} .setup-composer input{font-size:14px} .setup-composer button{font-size:18px} .setup-source-details{margin-top:16px} .setup-source-item{display:grid;justify-items:start;gap:2px}.setup-source-item small{max-width:62ch;color:#999;font-size:12px;line-height:1.45} .setup-actions{margin-top:16px} .setup-message>p.setup-source-intro{max-width:66ch;margin:0;color:#aeb0ad;font-size:14px;font-weight:400;line-height:1.55} .setup-source-actions{display:grid;justify-items:start;gap:14px}.setup-source-actions .primary{margin:0}.setup-source-secondary{display:flex;align-items:center;gap:20px}.setup-source-secondary .quiet-link{margin:0!important;padding:0!important} .setup-knowledge-step{max-width:560px}.setup-knowledge-step>p{margin:0 0 6px;font-size:17px;font-weight:500}.setup-knowledge-step>small{font-size:14px;line-height:1.5}.setup-knowledge-step .setup-form{gap:14px;margin-top:24px}.setup-knowledge-step .setup-form>label{gap:8px;color:#d7d7d7;font-size:14px}.setup-knowledge-step input[type=url]{width:100%;height:46px;font-size:15px}.setup-knowledge-or{color:#929292;font-size:13px}.setup-knowledge-photo{display:flex;align-items:center;gap:12px;min-height:44px}.setup-file-input{position:absolute;width:1px!important;height:1px!important;padding:0!important;opacity:0;overflow:hidden;clip-path:inset(50%)}.setup-photo-picker{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid #444;border-radius:7px;color:#e6e6e6;font-size:14px;cursor:pointer}.setup-knowledge-photo:focus-within .setup-photo-picker{outline:2px solid #d8c27d;outline-offset:2px}.setup-photo-name{min-width:0;color:#aaa;font-size:13px;overflow-wrap:anywhere}.setup-knowledge-actions{display:flex;align-items:center;gap:20px;margin-top:12px}.setup-knowledge-actions button{margin:0!important}.setup-knowledge-actions .setup-back{padding:0!important} .setup-knowledge-step .setup-photo-kind{display:flex;align-items:center;gap:9px;font-size:14px}.setup-photo-kind input{width:17px;height:17px;min-height:0!important;flex:none}.setup-knowledge-actions{flex-wrap:wrap;gap:8px 20px}.setup-menu-review{display:grid;gap:12px;max-height:min(50vh,480px);overflow:auto}.setup-menu-item{display:grid;grid-template-columns:minmax(0,2fr) minmax(90px,1fr);gap:8px 12px;padding-bottom:12px;border-bottom:1px solid #303030}.setup-menu-item label{display:grid;gap:5px;min-width:0}.setup-menu-item input,.setup-menu-item select{width:100%;min-width:0}@media(max-width:480px){.setup-menu-item{grid-template-columns:minmax(0,1fr) minmax(92px,.6fr)}} .setup-photo-review .setup-facts{grid-template-columns:minmax(0,1fr)}.setup-photo-review .setup-facts>div{grid-template-columns:minmax(0,1fr)}.setup-photo-review .setup-facts label{display:block}.setup-photo-review .setup-facts textarea{display:block;width:100%;min-height:58px;margin-top:6px;resize:vertical;background:#202020;border:1px solid #3c3c3c;border-radius:7px;padding:10px 12px;color:#e5e5e5;font:inherit;line-height:1.4} .setup-manual-context{margin-top:14px;border-top:1px solid #303030;padding-top:12px}.setup-manual-context>summary{width:max-content;max-width:100%;color:#c8c8c8;font-size:13px;cursor:pointer}.setup-manual-context>.setup-form{gap:12px;margin:14px 0 2px}.setup-manual-context .setup-form>label{display:grid;gap:6px;color:#c8c8c8;font-size:13px}.setup-manual-context select,.setup-manual-context textarea{width:100%;min-width:0}.setup-add-menu-item{margin:12px 0 0;padding:0}.setup-remove-menu-item{justify-self:start;align-self:center;padding:4px 0}.setup-menu-item{align-items:start} /* Phone handoff: make the only external step concrete and scannable. */ .setup-phone-handoff .setup-phone-steps{max-width:680px;margin:18px 0 0;padding-left:24px;gap:20px} .setup-phone-handoff .setup-phone-steps>li{display:block;padding-left:4px} .setup-phone-handoff .setup-phone-steps>li::before{content:none} .setup-phone-handoff .setup-phone-steps>li::marker{color:#d6bc70;font-weight:600} .setup-phone-handoff .setup-phone-steps strong{font-size:14px;font-weight:500;color:#e6e6e6} .setup-phone-handoff .setup-phone-provider-request{margin-top:9px;margin-bottom:0} .setup-phone-handoff .setup-phone-provider-request p{margin:0;color:#c1c1c1} .setup-phone-handoff .setup-phone-destination{margin:10px 0 0;max-width:420px} .setup-phone-handoff .setup-phone-start{margin-top:9px} .setup-phone-note{display:block;max-width:680px;margin-top:18px;color:#777!important} /* Long sourced records should be readable and editable, not trapped in one-line fields. */ body:has(.staff-shell) #business-form textarea{min-height:112px;line-height:1.5;overflow:auto} body:has(.staff-shell) #business-form #tone{min-height:78px} body:has(.staff-shell) .menu-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(90px,.7fr) minmax(0,1.4fr) auto;align-items:start;gap:8px} body:has(.staff-shell) .menu-row textarea{min-height:82px;resize:vertical} @media(max-width:700px){body:has(.staff-shell) .menu-row{grid-template-columns:1fr}.business-section,.customer-section,.agent-section{grid-template-columns:1fr!important}} .setup-loading{margin:0;color:#929292;font-size:14px;line-height:1.5} /* Onboarding introduction: explanation first, then one clear question. */ .setup-introduction{max-width:52ch;gap:0;padding-bottom:20px} .setup-prepared{max-width:52ch}.setup-prepared>p:first-child{color:#aeb2af}.setup-prepared>p:nth-child(2){margin-top:18px}.setup-prepared-identity{display:grid;gap:3px;padding:12px 0;border-top:1px solid #303030;border-bottom:1px solid #303030}.setup-prepared-identity span{color:#eceeec}.setup-prepared-identity small:empty{display:none} .setup-introduction>p:first-child{max-width:52ch;font-size:14px;font-weight:400;line-height:1.65;color:#aeb2af} .setup-introduction .setup-question{max-width:42ch;margin:22px 0 0;font-size:15px;font-weight:500;line-height:1.45;letter-spacing:-.05px;color:#eceeec} .setup-introduction small{display:block;margin-top:6px;font-size:12px;line-height:1.5;color:#858b87} @media(max-width:640px){.setup-introduction{padding-bottom:16px}.setup-introduction .setup-question{margin-top:20px;font-size:15px}} /* Menu workspace: source photos stay visually separate from the editable truth. */ body:has(.staff-shell) .menu-intro{max-width:62ch;margin:-2px 0 20px;line-height:1.55} body:has(.staff-shell) .menu-source{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;padding:15px 0 17px;border-top:1px solid #292b2b;border-bottom:1px solid #292b2b} body:has(.staff-shell) .menu-source h4{margin:0 0 4px;font-size:14px;font-weight:400;color:#c7cbc8} body:has(.staff-shell) .menu-source .staff-status{max-width:58ch;margin:0;line-height:1.5} body:has(.staff-shell) .upload-action{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;padding:9px 13px;border:1px solid #454844;border-radius:8px;color:#d9dcd8;font-size:13px;cursor:pointer} body:has(.staff-shell) .upload-action:hover{border-color:#8d8f87;background:#202220} body:has(.staff-shell) .upload-action input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none} body:has(.staff-shell) .menu-source-list{padding:15px 0 5px} body:has(.staff-shell) .menu-photos{display:flex;flex-wrap:wrap;gap:12px} body:has(.staff-shell) .menu-photo{width:150px;margin:0;border:1px solid #292b2b;border-radius:8px;overflow:hidden;background:#151617} body:has(.staff-shell) .menu-photo img{display:block;width:100%;height:96px;object-fit:cover;background:#202220} body:has(.staff-shell) .menu-photo figcaption{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;font-size:12px;color:#aeb2b0} body:has(.staff-shell) .menu-photo figcaption span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} body:has(.staff-shell) .menu-photo figcaption button{padding:0;color:#8f9391;font-size:12px} body:has(.staff-shell) .menu-editor{margin-top:12px} body:has(.staff-shell) .menu-labels{display:grid;grid-template-columns:minmax(0,2fr) minmax(90px,.7fr) minmax(130px,1fr) minmax(0,1.4fr) 28px;gap:8px;padding:0 36px 6px 0;color:#777d79;font-size:11px;text-transform:uppercase;letter-spacing:.06em} body:has(.staff-shell) .menu-row{grid-template-columns:minmax(0,2fr) minmax(90px,.7fr) minmax(130px,1fr) minmax(0,1.4fr) 28px} body:has(.staff-shell) .menu-row select{min-height:42px} body:has(.staff-shell) .menu-row textarea{min-height:64px} @media(max-width:700px){body:has(.staff-shell) .menu-source{align-items:stretch;flex-direction:column;gap:12px}body:has(.staff-shell) .upload-action{align-self:flex-start}body:has(.staff-shell) .menu-labels{display:none}body:has(.staff-shell) .menu-row{grid-template-columns:minmax(0,1fr) 80px 36px}body:has(.staff-shell) .menu-row [data-menu-name]{grid-column:1/-1}body:has(.staff-shell) .menu-row [data-menu-availability]{grid-column:1/3}body:has(.staff-shell) .menu-row [data-menu-note]{grid-column:1/-1;grid-row:auto}body:has(.staff-shell) .menu-row [data-remove-menu]{grid-column:3;grid-row:2}} #customer-link{display:none!important} .setup-form [data-onboarding-carrier]{display:grid;gap:9px} .setup-form [data-onboarding-carrier] label{margin:0} .setup-form [data-carrier-guide]{display:block;line-height:1.5} .setup-form [data-carrier-guide] a{text-decoration:underline;text-underline-offset:3px} .setup-phone-form-step .setup-form{gap:18px} .setup-form-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px;margin-top:4px} .setup-form-actions button{margin:0!important} .setup-form-actions .setup-back{display:inline-flex;padding:6px!important} /* Onboarding history follows a familiar chat rhythm: prompt left, reply right. */ .setup-history{display:flex;flex:0 0 auto;flex-direction:column;gap:20px;padding-bottom:28px} .setup-history-turn{display:flex;flex-direction:column;align-items:stretch;gap:7px;padding:0;border:0} .setup-turn-question,.setup-turn-answer>p{margin:0;font-size:14px;font-weight:400;line-height:1.5;overflow-wrap:anywhere} .setup-turn-question{align-self:flex-start;max-width:min(78%,58ch);padding:9px 12px;border:1px solid #2b2e2b;border-radius:14px 14px 14px 4px;background:#1d1f1d;color:#c6cac5} .setup-turn-answer{display:flex;flex-direction:column;align-items:flex-end;gap:3px} .setup-turn-answer>p{max-width:min(78%,58ch);padding:0;border:0;border-radius:0;background:transparent;color:#e4e7e3} .setup-turn-answer .setup-edit-message{flex:none;margin:0!important;padding:0!important;color:#9ba19a;font-size:12px!important;line-height:1.5;opacity:.78} .setup-current{padding-top:18px} .setup-question-step>p{margin:0 0 7px;font-size:14px;font-weight:450} .setup-question-step>small{display:block;font-size:14px;line-height:1.5} .setup-hotel-focus-options{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px} .setup-hotel-focus-options button{min-height:40px;padding:8px 12px;border:1px solid #383b37;border-radius:8px;background:#1d1f1d;color:#e2e5e0;font-size:14px;line-height:1.3;text-align:left} .setup-hotel-focus-options button:hover,.setup-hotel-focus-options button:focus-visible{border-color:#777d75;background:#252825} .setup-question-actions{margin-top:18px} .setup-question-actions .setup-back{margin:0!important;padding:0!important;color:#aeb3ad;font-size:13px;font-weight:400} .setup-phone-handoff{max-width:680px} .setup-phone-handoff.setup-agent{border-bottom:0;padding-bottom:0} .setup-phone-handoff>p{margin:0 0 6px;font-size:16px;font-weight:500} .setup-phone-handoff>small{max-width:none;color:#b9bdb9;font-size:14px;line-height:1.55} .setup-phone-handoff [data-onboarding-handoff-guide]{margin-top:12px} .setup-phone-handoff [data-carrier-guide]{font-size:13px} .setup-phone-handoff .setup-phone-provider-request{display:grid;gap:14px;max-width:none;margin:18px 0 0;padding:17px 18px;border:1px solid #383b37;border-radius:10px;background:#1d1f1d} .setup-phone-handoff .setup-phone-provider-request>p{margin:0;color:#e2e5e0;font-size:14px;line-height:1.6} .setup-phone-request-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px} .setup-phone-request-actions .quiet-link{margin:0!important;padding:0!important;font-size:13px} .setup-phone-test{display:grid;gap:9px;max-width:none;margin-top:22px;padding-top:19px;border-top:1px solid #30332f} .setup-phone-test>p{margin:0;color:#e5e7e3;font-size:14px;font-weight:500} .setup-phone-test small{display:block;margin:0;color:#aeb3ad;font-size:14px;line-height:1.55} .setup-phone-handoff .setup-phone-start{gap:13px;margin:0} .setup-phone-handoff .setup-phone-start .primary{min-height:40px;margin:0} .setup-handoff-footer{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:20px;padding-top:16px;border-top:1px solid #30332f} .setup-handoff-footer .quiet-link,.setup-handoff-footer a{margin:0!important;padding:0!important;color:#aeb3ad;font-size:13px;line-height:1.5;text-decoration:none} .setup-handoff-footer a:hover,.setup-handoff-footer .quiet-link:hover,.setup-turn-answer .setup-edit-message:hover{color:#f1f3ef;text-decoration:underline} @media(max-width:640px){.setup-turn-answer>p{max-width:90%}.setup-phone-handoff .setup-phone-provider-request{padding:15px}.setup-handoff-footer{gap:12px 18px}} .setup-phone-handoff [data-onboarding-handoff-guide]{display:grid;gap:10px;max-width:680px;margin:20px 0 0} .setup-phone-handoff [data-onboarding-handoff-guide] label{display:grid;gap:7px;color:#dfe2dc;font-size:14px;line-height:1.4} .setup-phone-handoff [data-onboarding-handoff-guide] select,.setup-phone-handoff [data-onboarding-handoff-guide] input{width:100%;max-width:440px;min-height:46px;padding:10px 12px;border:1px solid #555b52;border-radius:8px;background:#20231f;color:#f2f3ed;font:inherit} .setup-phone-handoff [data-onboarding-handoff-guide] [data-carrier-guide]{display:block;margin:0;color:#aeb3ad;font-size:14px;line-height:1.5} .setup-phone-handoff [data-onboarding-handoff-guide] [data-carrier-guide] a{display:inline-flex;align-items:center;min-height:44px;padding:10px 13px;border:1px solid #d0b76d;border-radius:8px;color:#f0d589;text-decoration:none;font-size:14px;font-weight:500} .setup-phone-handoff [data-onboarding-handoff-guide] [data-carrier-guide] a:hover{background:#303128} .setup-phone-handoff .setup-provider-hint{display:block;color:#969d94;font-size:13px;line-height:1.5} .setup-phone-route{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 14px;margin:16px 0 0;color:#c2c7bf;font-size:14px} .setup-phone-route strong{color:#eef1eb;font-size:16px;font-weight:550;letter-spacing:.01em} .setup-phone-route .quiet-link{margin:0!important;padding:0!important;font-size:13px} .setup-phone-handoff .setup-phone-provider-request{display:block;margin:22px 0 0;padding:0;border:0;border-radius:0;background:none} .setup-phone-handoff .setup-phone-provider-request summary{width:max-content;max-width:100%;cursor:pointer;color:#aeb5aa;font-size:13px;line-height:1.5} .setup-phone-handoff .setup-phone-provider-request[open]{padding:13px 15px;border:1px solid #383b37;border-radius:8px;background:#1d1f1d} .setup-phone-handoff .setup-phone-provider-request[open] p{margin:10px 0;color:#d9ddd5;font-size:13px;line-height:1.55} .setup-phone-handoff .setup-phone-provider-request[open] .quiet-link{margin:0!important;padding:0!important;font-size:13px} .setup-phone-handoff [data-onboarding-handoff-guide] [hidden]{display:none!important} .setup-phone-handoff .setup-device-guide{display:grid!important;justify-items:start;gap:8px} .setup-phone-handoff .setup-device-guide small{display:block;color:#aeb3ad;font-size:13px;line-height:1.5} .setup-pending-phone{padding:0 0 16px;border-bottom:1px solid #30332f} .setup-pending-phone>summary{width:max-content;max-width:100%;cursor:pointer;color:#d8c081;font-size:14px;line-height:1.5} .setup-pending-phone[open]>summary{margin-bottom:16px} .setup-pending-phone .setup-phone-handoff{padding:0} .setup-phone-route{display:grid;justify-items:start;gap:6px;margin-top:20px} .setup-phone-route-target{display:flex;align-items:center;flex-wrap:wrap;gap:10px} .setup-phone-route-target strong{font-size:18px;font-weight:550;letter-spacing:0} .setup-phone-route-target .quiet-link{border:1px solid #464a44;border-radius:6px;padding:5px 10px!important;color:#d8dcd5} /* Customer-facing guided setup: keep the action explicit and the carrier steps readable. */ .setup-phone-handoff [data-carrier-guide]{display:grid;gap:8px;margin:12px 0 0;color:#b5bcb2;font-size:14px;line-height:1.55} .setup-phone-handoff [data-carrier-guide] p{margin:0;max-width:64ch} .setup-phone-handoff [data-carrier-guide] ol{margin:0;padding-left:20px;max-width:64ch} .setup-phone-handoff [data-carrier-guide] li{padding:2px 0} .setup-phone-handoff [data-carrier-guide] a{display:inline;padding:0;border:0;color:#dfc987;text-decoration:underline;text-underline-offset:3px;font-size:14px;font-weight:400} .setup-computer{max-width:600px;margin:22px 0 0;padding-top:18px;border-top:1px solid #30332f} .setup-computer .setup-title{margin:0 0 7px;font-size:16px;font-weight:500;line-height:1.45} .setup-computer small{display:block;max-width:62ch;color:#b5bcb2;font-size:14px;line-height:1.55} .setup-computer .primary{justify-self:start;margin-top:14px;min-height:40px} .setup-computer .quiet-link{margin-top:10px;padding:0} /* Keep the phone handoff to one decision and one test. */ .setup-phone-handoff{max-width:600px} .setup-phone-handoff>p{margin:0 0 18px;font-size:16px;font-weight:500;line-height:1.45} .setup-phone-handoff>.setup-guide-lead{display:block;max-width:58ch;margin:-8px 0 18px;color:#aeb5aa;font-size:14px;font-weight:400;line-height:1.55} .setup-phone-handoff [data-onboarding-handoff-guide]{gap:0;margin:0} .setup-phone-handoff [data-onboarding-handoff-guide] label{gap:8px;font-size:14px;font-weight:400;line-height:1.5} .setup-phone-handoff [data-onboarding-handoff-guide] select,.setup-phone-handoff [data-onboarding-handoff-guide] input{max-width:none;min-height:44px;background:#20211f;border-color:#3e423b} .setup-phone-handoff [data-onboarding-handoff-guide] [data-carrier-guide]{margin:12px 0 0;font-size:14px} .setup-phone-handoff [data-onboarding-handoff-guide] [data-carrier-guide] a{display:inline;min-height:0;padding:0;border:0;border-radius:0;color:#dfc987;text-decoration:underline;text-underline-offset:3px;font-size:14px;font-weight:400} .setup-phone-handoff .setup-device-guide{display:block!important} .setup-phone-handoff .setup-device-guide summary{cursor:pointer;color:#c3c9c0;font-size:14px;line-height:1.5} .setup-phone-handoff .setup-device-guide p{margin:9px 0 0;color:#b5bcb2;font-size:14px;line-height:1.55} .setup-phone-handoff .setup-provider-hint{margin:8px 0 0;font-size:13px} .setup-phone-route{gap:5px;margin:24px 0 0;font-size:14px} .setup-phone-route-target{gap:12px} .setup-phone-route-target strong{font-size:18px;font-weight:500} .setup-phone-route-target .quiet-link{border:0;padding:0!important;color:#d7c183;text-decoration:underline;text-underline-offset:3px} .setup-phone-handoff .setup-phone-provider-request{margin:18px 0 0} .setup-phone-handoff .setup-phone-provider-request summary{font-size:13px} .setup-phone-handoff .setup-phone-test{gap:9px;margin:24px 0 0;padding:18px 0 0} .setup-phone-handoff .setup-phone-test>p,.setup-phone-handoff .setup-phone-test small{font-size:14px} .setup-phone-handoff .setup-phone-start{gap:12px} .setup-phone-handoff .setup-phone-start .primary{min-height:40px} .setup-other-connections{max-width:600px;margin-top:23px;padding-top:14px;border-top:1px solid #30332f} .setup-other-connections>summary{cursor:pointer;color:#aeb5aa;font-size:13px;line-height:1.5} .setup-other-connections .setup-message{margin-top:14px} .setup-other-connections .setup-next>p{font-size:14px} .setup-handoff-footer{max-width:600px;margin-top:18px;padding-top:14px} .setup-webhook-contract,.connection-webhook-contract{margin:4px 0 8px;padding-top:8px;border-top:1px solid #333631;color:#b5bcb2;font-size:13px;line-height:1.5} .setup-webhook-contract summary,.connection-webhook-contract summary{cursor:pointer;color:#c9cfc5} .setup-webhook-contract p,.connection-webhook-contract p{max-width:68ch;margin:9px 0} .setup-webhook-contract pre,.connection-webhook-contract pre{max-width:100%;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0;padding:10px;border-left:2px solid #4b5048;background:#1c1d1a;color:#d1d5cc;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace} .team-invite-form{display:grid;gap:10px;max-width:560px;margin-top:14px}.team-invite-form .field{margin:0}.invite-role>summary{cursor:pointer;color:#aeb5aa;font-size:13px;line-height:1.5}.invite-role .field{margin-top:12px}.team-invite-form>button{justify-self:start} .staff-shell .business-fact-audit>h3{margin:0 0 7px;font-size:15px;font-weight:550;line-height:1.35;color:#d8dbd6} .staff-shell .business-fact-audit>.staff-status{max-width:62ch;margin:0 0 14px;line-height:1.5} .business-fact-pending{margin:14px 0 18px} .business-fact-pending>.staff-status{margin:0 0 5px} .business-fact-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 0;border-bottom:1px solid #292b2b} .business-fact-row>div{min-width:0;display:grid;gap:4px} .business-fact-row strong{font-size:14px;font-weight:500;color:#eceeec} .business-fact-row p{margin:0;color:#c2c7c2;font-size:14px;line-height:1.45;overflow-wrap:anywhere} .business-fact-row small{font-size:12px;line-height:1.45} .business-fact-row button{flex:none} .business-fact-history{margin-top:16px;border-top:1px solid #292b2b;padding-top:13px} .business-fact-history>summary{cursor:pointer;color:#b9beb6;font-size:13px;line-height:1.5} .business-fact-usage{margin:10px 0 14px} .business-fact-usage>summary{cursor:pointer;color:#b9beb6;font-size:13px;line-height:1.5} .business-fact-usage ul{display:grid;gap:5px;margin:9px 0 0;padding-left:20px;color:#c2c7c2;font-size:13px;line-height:1.45} .business-fact-history ol{list-style:none;margin:12px 0 0;padding:0} .business-fact-history-item{display:grid;gap:5px;border-top:1px solid #292b2b;padding:12px 0} .business-fact-history-head{display:flex;justify-content:space-between;gap:14px;color:#d8dbd6;font-size:13px} .business-fact-history-head span{color:#aeb5aa;font-weight:400} .business-fact-history-item>p{margin:0;color:#c2c7c2;font-size:13px;line-height:1.45;overflow-wrap:anywhere} .business-fact-history-item>small{font-size:12px;line-height:1.4} .business-fact-history-item a{color:#dfc987;text-decoration:underline;text-underline-offset:3px} @media(max-width:640px){.business-fact-row{align-items:flex-start;flex-direction:column;gap:9px}.business-fact-history-head{align-items:flex-start;flex-direction:column;gap:2px}}