*,:before,:after { box-sizing:border-box; min-width:0; }
[hidden] { display:none!important; }
:root { color:#17243c; background:#f7f9fc; font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif; }
:root { color-scheme:light; }
:root[data-theme="dark"] { color-scheme:dark; color:#e4eaf3; background:#111827; }
:root[data-theme="dark"] .topbar { background:#111827f5; border-color:#364357; }
:root[data-theme="dark"] .icon-button:hover:not(:disabled) { background:#2c3d56; }
:root[data-theme="dark"] :is(.drawer,.chat,.profile-editor,.diagnostic-case,.admin-card,.admin-agent-row) { background:#182438; border-color:#44516a; color:#e4eaf3; }
:root[data-theme="dark"] :is(.tile,.member-button,.secondary,.mode-switch,.drawer nav button,.account-button,.home-more summary,.profile-picker select,.composer,.profile-editor input,.profile-editor select,.profile-editor textarea) { background:#24334c; border-color:#4b5e7a; color:#e4eaf3; }
:root[data-theme="dark"] :is(.voice-status,.message) { background:#223b4e; border-color:#517e91; color:#e4eaf3; }
:root[data-theme="dark"] .message.you { background:#2b3d5c; }
:root[data-theme="dark"] :is(textarea,input,select) { color:#e4eaf3; }
:root[data-theme="dark"] .error { background:#44252e; border-color:#bc7886; color:#ffd7df; }
:root[data-theme="dark"] :is(.fineprint,.footer-note,.lead,.status,.summary-note,.view-label,.tile-note,.voice-status p,#v2-chat-status,.message strong,.timing-row dd) { color:#c0ccdf; }
:root[data-theme="dark"] :is(.home-selected,.message-sources a,.voice-status>strong) { color:#9fe0ea; }
:root[data-theme="dark"] .member-button[aria-pressed="true"] { background:#174c59; border-color:#83d9e8; color:white; }
:root[data-theme="dark"] .tile[aria-pressed="true"]:not(:disabled) { background:#214e77; border-color:#93c9ff; color:white; }
:root[data-theme="dark"] .tile:disabled { background:#1b273b; color:#9caabe; }
:root[data-theme="dark"] .tile-icon { background:#ffffff12; color:#b6d6ee; }
:root[data-theme="dark"] #v2-admin input { background:#24334c; border-color:#4b5e7a; }
body { margin:0; min-height:100vh; min-height:100svh; }
button,textarea { font:inherit; }
input { font:inherit; font-size:16px; min-height:44px; max-width:100%; }
select { font:inherit; font-size:16px; min-height:44px; max-width:100%; width:100%; color:inherit; }
.profile-picker { max-width:440px; margin:24px auto; text-align:center; }
.profiles-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.profiles-heading h1 { margin-bottom:0; }
#v2-profiles-add { font-size:26px; line-height:1; }
.profile-dialog { width:min(520px,calc(100vw - 32px)); padding:28px; border:1px solid #dfe7f1; border-radius:24px; color:#17243c; background:#fff; }
.profile-dialog::backdrop { background:#101f3b55; }
:root[data-theme="dark"] .profile-dialog { background:#182438; border-color:#44516a; color:#e4eaf3; }
.profile-picker label { display:block; font-weight:600; margin-bottom:8px; }
.profile-picker select { background:#fff; border:1px solid #c8d4e4; border-radius:16px; padding:12px; }
.home-picker { max-width:900px; margin:24px auto 32px; padding:0; }
.home-members,.home-overflow { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.home-picker .member-button { flex:0 0 calc((100% - 24px)/4); }
.member-button { padding:12px 8px; min-height:64px; background:#edf2f8; border:2px solid transparent; overflow-wrap:anywhere; }
.member-button span { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.member-button[aria-pressed="true"] { border-color:#087c9a; background:#dbf4f3; color:#124d60; box-shadow:0 0 0 3px #087c9a1a; }
.member-button:disabled { opacity:.65; }
.home-selected { margin:16px 0 6px; color:#12556a; font-weight:650; overflow-wrap:anywhere; }
.home-more { margin-top:8px; }
.home-more[open] { display:flex; flex-direction:column; }
.home-more summary { min-height:44px; width:44px; margin:0 auto; padding:10px; display:flex; align-items:center; justify-content:center; border-radius:50%; cursor:pointer; order:2; }
#v2-home-more-label { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.home-more summary::-webkit-details-marker { display:none; }
.home-more[open] summary svg { transform:rotate(180deg); }
.home-more summary[aria-disabled="true"] { opacity:.55; cursor:not-allowed; }
.home-overflow { padding:0; order:1; }
.home-agents { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.home-agent { min-height:190px; }
.home-agent[aria-pressed="true"]:not(:disabled) { box-shadow:0 0 0 3px #8ab3e259,0 8px 32px #204a8d59; }
.profile-editor { background:#fff; border:1px solid #dfe7f1; border-radius:22px; padding:20px; margin:20px 0; overflow-wrap:anywhere; }
.profile-editor>label { display:block; font-weight:600; margin:16px 0 6px; }
.profile-editor input,.profile-editor select,.profile-editor textarea { width:100%; border:1px solid #c8d4e4; border-radius:12px; padding:12px; background:#f7f9fc; }
.profile-actions,.profile-confirm { display:flex; flex-wrap:wrap; gap:12px; margin:18px 0; }
.profile-actions button,.profile-confirm button { flex:1 1 200px; }
.profile-confirm p { flex:1 0 100%; }
.profile-editor dl { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:8px; }
.profile-editor dd { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; }
.profile-metadata summary { min-height:44px; padding:12px 0; cursor:pointer; }
.permission-notes { padding-left:22px; color:#596a80; font-size:14px; }
.permission-notes li { margin:12px 0; overflow-wrap:anywhere; }
.admin-card,.admin-agent-row { border:1px solid #dfe7f1; border-radius:18px; padding:18px; margin:18px 0; background:#fff; overflow-wrap:anywhere; }
.admin-card legend { font-weight:650; padding:0 6px; }
.admin-actions,.admin-email-row { display:flex; flex-wrap:wrap; gap:12px; margin:12px 0; }
.admin-actions button { flex:1 1 220px; }
.admin-email-row input { flex:1 1 230px; width:100%; }
.admin-email-row button { flex:0 1 110px; }
#v2-admin label { display:block; margin:14px 0 6px; }
#v2-admin input { padding:9px; border:1px solid #c8d4e4; border-radius:9px; }
#v2-admin input[type=range] { width:100%; accent-color:#17345b; }
#v2-admin dl { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:8px; }
#v2-admin dd { margin:0; overflow-wrap:anywhere; }
#v2-admin output { display:block; }
#v2-admin h1 { display:none; }
button { cursor:pointer; min-height:44px; min-width:44px; border:0; border-radius:14px; padding:11px 18px; color:inherit; }
button:disabled { cursor:not-allowed; }
button:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid #087c9a; outline-offset:4px; }
svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.topbar { position:sticky; top:0; z-index:10; display:flex; align-items:center; gap:12px; padding:12px clamp(12px,4vw,36px); min-height:76px; background:#f7f9fcf5; border-bottom:1px solid #e8edf5; }
.brand { display:flex; align-items:center; gap:10px; font-size:23px; font-weight:650; letter-spacing:-.7px; flex:1; }
.brand-spark { width:34px; height:34px; stroke:#176c91; fill:#ddf0f3; stroke-width:1.3; }
.view-label { font-size:13px; font-weight:500; color:#62718a; border-left:1px solid #d5deeb; padding-left:12px; letter-spacing:0; }
.view-label:empty { display:none; }
.icon-button { padding:10px; display:inline-flex; align-items:center; justify-content:center; background:transparent; border-radius:50%; font-size:26px; }
.icon-button:hover:not(:disabled) { background:#e9eef6; }
.icon-button:disabled { opacity:.35; }
.account-button { background:#e7edf7; }
main { max-width:1100px; margin:auto; padding:12px clamp(16px,5vw,56px) 40px; }
.status { color:#62718a; font-size:14px; overflow-wrap:anywhere; margin:4px 0 18px; min-height:22px; }
.error { border:1px solid #e7afaf; background:#fff1f1; color:#822929; border-radius:16px; padding:14px 18px; overflow-wrap:anywhere; }
.error-overlay { position:fixed; z-index:1000; inset:calc(88px + env(safe-area-inset-top)) 16px auto; max-width:640px; max-height:calc(100dvh - 104px - env(safe-area-inset-top)); overflow:auto; margin:0 auto; display:flex; align-items:center; gap:12px; box-shadow:0 12px 40px #0003; }
.error-overlay[hidden] { display:none; }
.error-overlay p { flex:1; margin:0; min-width:0; }
.error-overlay button { flex-shrink:0; color:inherit; }
.error-overlay[data-severity="notice"] { background:#eef4ff; border-color:#b6c8e5; color:#213c60; }
:root[data-theme="dark"] .error-overlay[data-severity="notice"] { background:#1d334f; border-color:#7a9ac5; color:#d9e8ff; }
.startup { margin:24px 0; }
h1 { font-size:clamp(29px,5vw,46px); line-height:1.15; letter-spacing:-1.6px; font-weight:550; margin:10px 0 14px; }
h2 { font-size:18px; line-height:1.35; font-weight:600; margin:0 0 5px; }
p { margin:6px 0 12px; }
.lead { font-size:17px; color:#66758a; margin-bottom:28px; }
.eyebrow { font-size:11px; color:#54768e; letter-spacing:2px; font-weight:700; margin-top:18px; }
.login-panel { max-width:680px; margin:10px auto 0; }
.welcome-mark { width:78px; height:78px; border-radius:26px; background:linear-gradient(140deg,#dceff0,#e3e7fb); display:grid; place-items:center; margin:20px 0 28px; }
.welcome-mark span { width:42px; height:42px; background:#277c9c; clip-path:polygon(50% 0,62% 37%,100% 50%,62% 63%,50% 100%,38% 63%,0 50%,38% 37%); transform:rotate(12deg); }
#v2-google-button { min-height:48px; margin:12px 0; max-width:100%; overflow:hidden; }
#v2-google-button>div,#v2-google-button iframe { max-width:100%!important; }
.consent-notes { background:white; border:1px solid #e2e8f1; border-radius:22px; margin-top:30px; padding:24px; color:#596a80; font-size:14px; }
.consent-notes h2 { color:#17243c; margin-bottom:14px; }
code { font:inherit; font-size:.94em; overflow-wrap:anywhere; }
.primary { background:#17345b; color:white; box-shadow:0 5px 15px #102f541a; }
.primary:disabled { opacity:.55; }
.secondary { background:#edf2f8; border:1px solid #dce5f0; font-size:14px; }
.tiles { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.tile { position:relative; background:#eaf0f7; border:1px solid transparent; border-radius:22px; padding:20px 16px; min-height:170px; display:flex; flex-direction:column; text-align:left; align-items:flex-start; transition:background .15s,box-shadow .15s; }
.tile-icon { width:42px; height:42px; border-radius:14px; background:#fff9; display:grid; place-items:center; margin-bottom:18px; color:#4c718d; }
.tile-title { font-size:16px; font-weight:600; line-height:1.35; overflow-wrap:anywhere; }
.tile-note { margin-top:5px; font-size:12px; line-height:1.4; color:#5c6e86; }
.tile-arrow { position:absolute; top:18px; right:16px; font-size:19px; }
.tile:hover:not(:disabled) { background:#e1eaf5; }
.tile[aria-pressed="true"]:not(:disabled) { background:#122e56; border-color:#4b88c9; color:white; box-shadow:0 7px 24px #204a8d40,0 0 0 3px #8ab3e229; }
.tile[aria-pressed="true"] .tile-icon { color:#d5ecff; background:#ffffff12; }
.tile[aria-pressed="true"] .tile-note { color:#c2d7ef; }
.tile:disabled { background:#f0f3f8; color:#768396; }
.tile:disabled .tile-icon { color:#8290a4; }
.chat { background:white; border:1px solid #dfe7f1; border-radius:24px; padding:20px; margin:28px 0; overflow-anchor:none; scroll-margin-top:100px; }
.chat>h2 { margin:0; }
.onboarding-tip { position:fixed; z-index:20; width:280px; max-width:calc(100vw - 24px); padding:14px 58px 14px 16px; border:1px solid #9db8d7; border-radius:16px; background:#e9f2ff; color:#17345b; box-shadow:0 6px 24px #102f5426; pointer-events:none; overflow-wrap:anywhere; }
.onboarding-tip p { margin:0; }
.onboarding-tip::after { content:""; position:absolute; left:var(--tip-arrow-left); width:12px; height:12px; background:inherit; border:solid #9db8d7; transform:translateX(-50%) rotate(45deg); }
.onboarding-tip[data-placement="above"]::after { bottom:-7px; border-width:0 1px 1px 0; }
.onboarding-tip[data-placement="below"]::after { top:-7px; border-width:1px 0 0 1px; }
.onboarding-tip button { position:absolute; top:4px; right:4px; pointer-events:auto; }
:root[data-theme="dark"] .onboarding-tip { background:#243954; color:#e4eaf3; border-color:#809cbe; }
:root[data-theme="dark"] .onboarding-tip::after { border-color:#809cbe; }
.summary-note { display:block; font-size:12px; font-weight:400; color:#64758a; padding-left:19px; }
.voice-status { display:flex; align-items:center; justify-content:space-between; gap:12px; height:68px; margin-top:12px; padding:10px 20px; border-left:3px solid #277c9c; background:#edf5fa; border-radius:0 18px 18px 0; }
.voice-status>strong { color:#17345b; }
.conversation-toggle { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; min-height:44px; padding:0; background:transparent; border:1px solid currentColor; }
.conversation-control-icon { display:block; width:12px; height:12px; background:#d21f32; }
:root[data-theme="dark"] .conversation-toggle[data-action="pause"] .conversation-control-icon { background:#ff5868; }
.conversation-toggle[data-action="resume"] .conversation-control-icon { width:0; height:0; background:transparent; border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:12px solid currentColor; margin-left:3px; }
.voice-status[aria-busy="true"]::before { content:none; }
#v2-voice-note,#v2-chat-status,#v2-wake-status { display:none!important; }
.voice-status p { color:#536b81; margin:5px 0; font-size:14px; }
.mode-switch { display:flex; flex-wrap:wrap; align-items:center; gap:10px; text-align:left; background:#edf2f8; width:100%; }
.mode-switch strong { font-size:13px; margin-left:auto; }
.switch-track { display:block; position:relative; flex-shrink:0; width:42px; height:26px; border-radius:20px; background:#8b9bb1; }
.switch-track:after { content:""; position:absolute; top:3px; left:3px; width:20px; height:20px; background:white; border-radius:50%; }
.mode-switch[aria-checked="true"] .switch-track { background:#17345b; }
.mode-switch[aria-checked="true"] .switch-track:after { transform:translateX(16px); }
.chat-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
#v2-chat-status { color:#64768e; font-size:14px; margin:12px 0; }
.messages { list-style:none; padding:0; margin:18px 0; height:clamp(180px,38svh,430px); max-height:46svh; overflow:auto; overscroll-behavior-y:auto; overflow-anchor:none; scrollbar-gutter:stable; }
.message { width:fit-content; max-width:92%; background:#f0f4f9; border-radius:18px 18px 18px 5px; padding:12px 16px; margin:12px 0; }
.message.you { margin-left:auto; background:#e8f1fb; border-radius:18px 18px 5px 18px; }
.message-typing { margin-right:auto; }
.typing-dots { display:flex; gap:4px; line-height:1; }
.typing-dots span { display:inline-block; font-size:28px; font-weight:700; animation:typing-bounce 1.2s ease-in-out infinite; }
.typing-dots span:nth-child(2) { animation-delay:.15s; }
.typing-dots span:nth-child(3) { animation-delay:.3s; }
@keyframes typing-bounce { 0%,60%,100% { opacity:.35; transform:translateY(0); } 30% { opacity:1; transform:translateY(-4px); } }
@media(prefers-reduced-motion:reduce) { .typing-dots span { animation:none; } }
.message strong { display:block; font-size:11px; color:#536c88; margin-bottom:4px; }
.message p { white-space:pre-wrap; overflow-wrap:anywhere; margin:0; }
.message-sources { margin-top:12px; border-top:1px solid #bad5df; padding-top:8px; overflow-wrap:anywhere; }
.message-sources a { display:block; min-height:44px; max-width:100%; padding:10px 0; color:#12556a; text-decoration:underline; }
.message .message-sources strong,.message .message-sources p { font-size:14px; }
.composer { display:grid; grid-template-columns:minmax(0,1fr) 48px; gap:10px; align-items:end; background:#f4f7fb; border:1px solid #dce4ef; border-radius:20px; padding:9px; }
textarea { display:block; width:100%; font-size:16px; min-height:52px; max-height:170px; resize:vertical; border:0; border-radius:12px; padding:12px; color:#17243c; background:transparent; }
.send-button { width:48px; height:48px; padding:12px; background:#18365d; color:white; }
.send-button:disabled { background:#d5dfec; color:#708197; }
.fineprint,.footer-note { color:#64758a; font-size:12px; }
.footer-note { margin:22px 4px; }
.drawer { position:fixed; inset:0 auto 0 0; margin:0; width:min(340px,calc(100vw - 24px)); max-width:100%; height:100%; max-height:100%; background:#f8faff; color:#17243c; border:0; border-radius:0 24px 24px 0; padding:22px; box-shadow:0 0 60px #10284d30; }
.drawer::backdrop { background:#101f3b55; backdrop-filter:blur(3px); }
.account-drawer { inset:0 0 0 auto; border-radius:24px 0 0 24px; }
.drawer-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:28px; }
.drawer nav { display:flex; flex-direction:column; gap:8px; margin-bottom:24px; }
.drawer nav button { display:flex; align-items:center; gap:12px; text-align:left; background:#eaf0f8; }
.activity,[aria-busy="true"].mode-switch { overflow-wrap:anywhere; }
.activity::before,[aria-busy="true"]:is(button,form)::before { content:""; display:inline-block; width:18px; height:18px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; vertical-align:middle; margin-right:8px; animation:busy-spin .9s linear infinite; }
@keyframes busy-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .activity::before,[aria-busy="true"]::before { animation:none!important; border-right-color:currentColor; } }
.drawer nav button:disabled { color:#8490a2; background:#f1f4f8; }
.identity { overflow-wrap:anywhere; font-weight:600; }
.diagnostic-controls { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.diagnostic-controls button { flex:1 1 190px; }
.diagnostic-choice { display:flex; align-items:center; gap:10px; min-height:44px; cursor:pointer; flex:1 1 220px; }
.diagnostic-choice input { width:24px; height:24px; margin:0; accent-color:#17345b; flex-shrink:0; }
.quota-note { display:block; font-size:12px; font-weight:400; }
.diagnostic-case { padding:20px; margin:18px 0; border:1px solid #dfe7f1; background:white; border-radius:20px; overflow-wrap:anywhere; }
.diagnostic-case > summary { min-height:44px; padding:10px 0; cursor:pointer; font-weight:600; }
.diagnostic-case h3 { font-size:17px; margin:0 0 12px; }
.timing-list { margin:12px 0; }
.timing-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:7px 0; border-bottom:1px solid #edf1f7; font-size:14px; }
.timing-row dt { overflow-wrap:anywhere; }
.timing-row dd { margin:0; font-variant-numeric:tabular-nums; white-space:nowrap; color:#17345b; }
.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; }
@media(min-width:850px) { .tiles { grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; } .tile { min-height:195px; padding:22px; } }
@media(max-width:480px) { .chat { padding:14px; } .consent-notes { padding:18px; } .view-label { display:none; } .topbar { gap:8px; } }
@media(prefers-reduced-motion:reduce) { * { transition:none!important; scroll-behavior:auto!important; } }
.module-instructions { width: 100%; min-height: 18rem; resize: vertical; font: inherit; }
#v2-modules-list, #v2-home-custom-modules { margin-top: 1.25rem; }
