/* Client surface: compact, persistent navigation and content-first workspaces. */
body[data-web-client="modern"] {--bg:#fff;--surface:#fff;--surface-secondary:#f5f5f5;--text:#202123;--secondary:#71717a;--line:#e8e8eb;--accent:#303136;--selection:#e8e8eb;--radius-small:9px;--radius-card:14px;--radius-panel:0px;--shadow:none;--glass:var(--surface);background:var(--bg);background-image:none;color:var(--text)}
@media(prefers-color-scheme:dark){html:not([data-theme=light]) body[data-web-client="modern"]{--bg:#212121;--surface:#212121;--surface-secondary:#2c2c2c;--text:#ececec;--secondary:#a0a0a7;--line:#383838;--accent:#ececec;--selection:#343434}}
html[data-theme=dark] body[data-web-client="modern"]{--bg:#212121;--surface:#212121;--surface-secondary:#2c2c2c;--text:#ececec;--secondary:#a0a0a7;--line:#383838;--accent:#ececec;--selection:#343434}
.client-modern {height:100dvh;width:100%;overflow:hidden;background:var(--bg)}
.client-modern .shell {display:grid;grid-template-columns:268px minmax(0,1fr);gap:0;padding:0;height:100%;width:100%;margin:0;max-width:none;overflow:hidden;border:0;border-radius:0;background:none}
.client-modern .shell>aside {display:flex;flex-direction:column;position:relative;top:auto;bottom:auto;left:auto;width:auto;min-width:0;min-height:0;order:0;gap:0;padding:16px 12px 10px;border:0;border-right:1px solid var(--line);border-radius:0;background:var(--surface-secondary);backdrop-filter:none;box-shadow:none;transform:none;z-index:20;overflow:visible}
.client-modern aside::before,.client-modern .toolbar::before,.client-modern .composer::before,.client-modern .filters::before,.client-modern .glass-water,.client-modern .liquid-lens,.client-modern .glass-refraction,.client-modern .water-glass-layer {display:none!important}
.client-modern .shell>main {display:flex;flex-direction:column;position:relative;height:100%;min-width:0;min-height:0;overflow:hidden;border:0;border-radius:0;background:var(--bg);box-shadow:none}
.client-modern .sidebar-heading {display:flex;align-items:center;justify-content:space-between;height:40px;margin:0 4px 14px}
.client-modern .client-wordmark {display:inline-flex;align-items:center;gap:5px;font-size:24px;font-weight:650;letter-spacing:-1px;color:var(--text);text-decoration:none}
.wordmark-dot {height:5px;width:5px;border-radius:50%;background:#65a38c;margin-top:12px}
.client-modern svg {width:18px;height:18px;flex:none;color:currentColor}
.client-modern button,.client-modern a {touch-action:manipulation}
.client-modern button {box-shadow:none;transition:background-color 120ms,color 120ms;border-radius:9px;transform:none}
.client-modern .new-chat {display:flex;align-items:center;gap:10px;width:100%;height:42px;min-height:42px;padding:0 12px;margin-bottom:12px;background:var(--surface);border:1px solid var(--line);font-size:14px;text-align:left}
.client-modern .new-chat:hover {background:var(--selection)}
.client-modern kbd {margin-left:auto;font:11px system-ui;color:var(--secondary);border:0;background:none}
.client-modern .workspace-navigation {display:flex;flex-direction:column;flex:none;gap:2px;overflow:visible;padding:0;margin:0 0 22px;border:0;background:none}
.client-modern .workspace-navigation>a {position:relative;display:flex;align-items:center;gap:10px;padding:0 12px;min-height:40px;height:40px;width:100%;max-width:none;border-radius:9px;color:var(--text);font-size:14px;font-weight:450;text-decoration:none;flex-direction:row;transform:none;box-shadow:none;background:none}
.client-modern .workspace-navigation>a>span {position:static;width:auto;height:auto;overflow:visible;clip-path:none;font-size:14px;white-space:normal}
.client-modern .workspace-navigation>a:hover,.client-modern .workspace-navigation>a[aria-current=page] {background:var(--selection);color:var(--text)}
.client-modern .session-heading {display:flex;align-items:center;justify-content:space-between;margin:0 12px 10px;color:var(--secondary);font-size:11px;font-weight:600;letter-spacing:.04em}
.client-modern .session-search {display:flex;align-items:center;gap:7px;margin:0 4px 12px;padding:0 8px;min-height:34px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--secondary)}
.client-modern .session-search input {border:0;background:transparent;min-width:0;width:100%;height:32px;min-height:32px;padding:0;font-size:12px;box-shadow:none;outline:0}
.client-modern .session-search svg {width:14px;height:14px}
.client-modern .session-search button {display:grid;place-items:center;min-width:26px;min-height:26px;padding:0;background:none}
.client-modern .session-search:focus-within {outline:2px solid var(--secondary);outline-offset:1px}
.client-modern .conversation-list {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 4px 12px}
.client-modern .default-session {display:flex;align-items:center;gap:10px;min-height:40px;padding:8px 10px;margin-bottom:16px;color:var(--text);text-decoration:none;border-radius:8px;font-size:13px}
.client-modern .default-session[aria-current=page],.client-modern .default-session:hover {background:var(--selection)}
.client-modern .pinned-label {margin-left:auto;font-size:10px;color:var(--secondary)}
.client-modern .session-group {margin:0 0 16px}
.client-modern .session-group h2 {margin:0 10px 5px;font-size:10px;line-height:20px;color:var(--secondary);font-weight:500;letter-spacing:.025em}
.client-modern .session-item {position:relative;display:flex;align-items:center;border-radius:8px;min-height:36px;margin:1px 0}
.client-modern .session-item:hover,.client-modern .session-item[data-selected=true] {background:var(--selection)}
.client-modern .session-item>a {min-width:0;flex:1;display:block;padding:10px;color:var(--text);font-size:13px;line-height:16px;text-decoration:none}
.client-modern .session-title {display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.client-modern .session-more {min-width:30px;min-height:32px;padding:0;display:grid;place-items:center;background:transparent;opacity:0;color:var(--secondary)}
.client-modern .session-item:hover .session-more,.client-modern .session-item:focus-within .session-more {opacity:1}
@media(hover:none){.client-modern .session-more{opacity:1}}
.client-modern .session-menu {position:absolute;right:5px;top:34px;z-index:30;min-width:126px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 4px 16px #0002}
.client-modern .session-menu button {display:block;width:100%;min-height:36px;background:transparent;text-align:left;font-size:13px}
.client-modern .session-menu button:hover {background:var(--selection)}
.client-modern .sidebar-empty,.client-modern .sidebar-error {display:block;font-size:12px;line-height:1.6;padding:8px 10px;color:var(--secondary)}
.client-modern .sidebar-error button {min-height:28px;padding:2px 8px;font-size:12px;display:block;margin-top:6px}
.client-modern .session-placeholders {display:flex;flex-direction:column;gap:23px;padding:12px 10px}
.client-modern .session-placeholders i {height:12px;display:block;border-radius:4px;background:var(--line);animation:client-pulse 1.6s ease-in-out infinite alternate}
@keyframes client-pulse {to{opacity:.4}}
.client-modern .shell>aside>.sidebar-bottom {display:flex;align-items:center;gap:2px;flex:none;flex-wrap:nowrap;padding:12px 4px 0;margin:0;border-top:1px solid var(--line)}
.client-modern #workspace-identity {display:flex;align-items:center;gap:9px;flex:1;min-width:0;padding:2px;color:var(--text);text-decoration:none;font-size:13px}
.client-modern .identity-avatar {width:30px;height:30px;display:grid;place-items:center;background:var(--selection);border-radius:50%;overflow:hidden;font-size:12px;font-weight:600;flex:none}
.client-modern .identity-avatar img {width:100%;height:100%;object-fit:cover}
.client-modern #connection {display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px;font-size:12px}
.client-modern .sidebar-bottom button {display:grid;place-items:center;min-height:32px;min-width:32px;width:32px;padding:0;background:transparent;color:var(--secondary)}
.client-modern .toolbar {position:relative;display:flex;align-items:center;flex:none;justify-content:flex-start;gap:10px;padding:10px 24px;min-height:62px;height:auto;border:0;border-radius:0;background:var(--bg);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;z-index:10;transform:none}
.client-modern .toolbar h1 {font-size:15px;font-weight:600;line-height:24px;flex:1;margin:0;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;letter-spacing:0}
.client-modern #actions {display:flex;gap:4px;flex-wrap:nowrap;margin-left:auto;align-items:center}
.client-modern .toolbar button {display:grid;place-items:center;background:transparent;min-height:36px;min-width:36px;height:36px;width:auto;padding:8px;border-radius:8px;font-size:12px}
.client-modern .toolbar button:hover {background:var(--surface-secondary)}
.client-modern .toolbar .button-label {display:none}
.client-modern .toolbar .client-menu,.client-modern .sidebar-close,.client-modern .sidebar-scrim {display:none}
.client-modern #content,.client-modern #account-content {flex:1;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px 36px 40px;scrollbar-width:thin}
.client-modern #content[data-page=chat] {padding:0;overflow:hidden}
.client-modern .stack {max-width:1000px;margin:0 auto;gap:20px}
.client-modern .stack>h2,.client-modern .portal-page>h2 {font-size:18px;font-weight:600;margin:8px 0}
.client-modern .card,.client-modern .list {border:1px solid var(--line);border-radius:12px;box-shadow:none;background:var(--surface);padding:20px}
.client-modern .card .card,.client-modern .card .list {box-shadow:none;background:none;border-radius:8px}
.client-modern .list {padding:0;overflow:hidden}
.client-modern .list>button,.client-modern .list>a {border:0;border-radius:0;padding:14px 18px;background:transparent;border-bottom:1px solid var(--line);min-height:52px}
.client-modern .list>button:last-child {border-bottom:0}
.client-modern .list>button:hover,.client-modern .settings-row:hover {background:var(--surface-secondary)}
.client-modern .settings-row {border-radius:0;box-shadow:none;padding:14px 18px;min-height:60px;background:transparent}
.client-modern .settings-row>svg {width:19px;height:19px;box-shadow:none;border-radius:6px;background:none;padding:0}
.client-modern input:not([type=range]):not([type=checkbox]),.client-modern select,.client-modern textarea {border-radius:8px;border-color:var(--line);background:var(--surface);font-size:14px;box-shadow:none}
.client-modern input[type=range] {height:26px;accent-color:var(--text)}
.client-modern .filters,.client-modern .segmented {display:flex;padding:3px;gap:3px;min-height:36px;width:fit-content;max-width:100%;border:1px solid var(--line);border-radius:9px;background:var(--surface-secondary);backdrop-filter:none;box-shadow:none;overflow:auto}
.client-modern .filters button,.client-modern .segmented button {font-size:12px;min-height:30px;padding:4px 14px;background:transparent;white-space:nowrap;transform:none;border-radius:6px}
.client-modern .filters button[aria-pressed=true],.client-modern .segmented button[aria-pressed=true],.client-modern .segmented button[aria-selected=true] {background:var(--surface);color:var(--text);box-shadow:0 1px 3px #0001}
.client-modern .chat-layout {position:relative;display:flex;flex-direction:column;height:100%;min-height:0;width:100%;max-width:none;margin:0;background:var(--bg);overflow:hidden}
.client-modern .messages {flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:30px max(24px,calc((100% - 760px)/2)) 180px;scrollbar-gutter:stable;scroll-behavior:auto;overflow-anchor:none;overscroll-behavior:contain}
.client-modern .message {margin-bottom:28px;font-size:15px;line-height:1.8;overflow-wrap:anywhere}
.client-modern .message.user {background:var(--surface-secondary);color:var(--text);border:0;border-radius:20px;padding:10px 17px;max-width:85%;box-shadow:none;transform:none}
.client-modern .message.assistant {padding:0;border:0;background:transparent;color:var(--text)}
.client-modern .message.assistant>header {font-size:11px;color:var(--secondary)}
.client-modern .message details {border:1px solid var(--line);border-radius:9px;font-size:12px;background:transparent;padding:10px 12px;margin:10px 0}
.client-modern .message details summary {font-size:12px;font-weight:450;color:var(--secondary);min-height:20px}
.client-modern .message .copy {min-height:30px;font-size:11px;padding:4px 7px;background:none;color:var(--secondary)}
.client-modern .message .copy svg {width:14px;height:14px}
.client-modern .message img {border:0;box-shadow:none;max-height:360px;max-width:min(100%,440px);border-radius:10px}
.client-modern .composer {position:absolute;left:0;right:0;bottom:max(18px,env(safe-area-inset-bottom));width:min(calc(100% - 48px),780px);margin:auto;padding:10px 14px;display:grid;gap:4px;border:1px solid var(--line);border-radius:22px;background:var(--surface-secondary);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none;z-index:5}
.client-modern .composer:focus-within {border-color:var(--secondary);box-shadow:none}
.client-modern .composer textarea {padding:8px 4px;min-height:44px;max-height:150px;line-height:24px;font-size:14px;background:transparent;border:0;resize:none}
.client-modern .composer textarea:focus {outline:none;box-shadow:none}
.client-modern .composer footer {min-height:32px;gap:4px;align-items:center}
.voice-status{font-size:.75rem;color:var(--secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.composer .voice-mic[aria-pressed=true]{color:var(--danger);background:var(--surface)}
.composer .voice-speaker[aria-pressed=true]{color:var(--accent);background:var(--surface)}
.composer footer>div{min-width:0}.composer footer>div:last-child{flex-shrink:0}
/* The capture surface uses measured RMS, rather than an idle recording pulse. */
.client-modern .composer button {width:32px;height:32px;min-height:32px;min-width:32px;padding:6px;border-radius:50%;background:transparent;box-shadow:none}
.client-modern button.primary,.client-modern a.primary {background:var(--text);color:var(--bg)}
.client-modern .composer button.primary {background:var(--text);color:var(--bg)}
.client-modern .composer .usage-live {grid-column:1/-1;width:fit-content;max-width:100%;height:auto;min-height:20px;border:0;border-radius:0;padding:0 2px;font-size:10px;color:var(--secondary);text-align:left;background:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:none;margin:0;order:3}
.client-modern .chat-subagents {flex:none;margin:0 auto 8px;padding:10px 14px;width:min(calc(100% - 48px),780px);max-height:25%;border:1px solid var(--line);border-radius:10px;background:var(--surface-secondary);font-size:12px}
.client-modern .badge {border-radius:5px;font-size:10px;padding:3px 6px;box-shadow:none}
.client-modern .interaction-bubble {border:1px solid var(--line);border-radius:12px;padding:16px;background:var(--surface-secondary);box-shadow:none}
.client-modern .interaction-option {font-size:13px;background:var(--surface);border:1px solid var(--line);border-radius:8px;min-height:38px}
.client-modern .plugin-grid {grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.client-modern .plugin-tile {border:1px solid var(--line);border-radius:12px;box-shadow:none;transform:none;background:var(--surface)}
.client-modern .portal-page {width:100%;max-width:1000px;margin:0 auto}
.client-modern .portal-title {padding:0;margin:0 0 18px;min-height:0;box-shadow:none;background:none;border:0}
.client-modern .portal-title h1 {font-size:22px}
.client-modern .portal-title p {font-size:13px;color:var(--secondary)}
.client-modern .portal-card,.client-modern .portal-section,.client-modern .instance-card {border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:none}
.client-modern .page-placeholder {padding:12px 0;gap:18px}
.client-modern .ph-panel {border-radius:12px;border-color:var(--line);box-shadow:none}
.client-modern dialog {max-width:min(540px,calc(100vw - 32px));border:1px solid var(--line);border-radius:16px;padding:24px;background:var(--surface);color:var(--text);box-shadow:0 20px 70px #0003}
.client-modern dialog::backdrop {background:#0005;backdrop-filter:none}
.client-modern dialog .close {width:32px;height:32px;min-height:32px;min-width:32px;padding:0;font-size:22px;top:12px;right:12px;background:var(--surface-secondary)}
.client-modern .markdown pre {border:1px solid var(--line);border-radius:10px;background:var(--surface-secondary);box-shadow:none}
.client-modern .markdown table {font-size:13px}
.client-modern :focus-visible {outline:2px solid var(--secondary);outline-offset:2px}
@media(max-width:900px){.client-modern .shell{grid-template-columns:248px minmax(0,1fr)}.client-modern #content,.client-modern #account-content{padding:20px 24px}}
@media(max-width:720px){
 .client-modern .shell{display:flex;gap:0;padding:0}.client-modern .shell>main{flex:1;width:100%}
 .client-modern .shell>aside{position:fixed;inset:0 auto 0 0;width:min(300px,85vw);height:100dvh;transform:translateX(-100%);transition:transform 180ms cubic-bezier(.2,.7,.2,1);z-index:100;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom));border-right:1px solid var(--line)}
 .client-modern[data-sidebar-open=true] .shell>aside{transform:translateX(0)}
 .client-modern .toolbar{padding:10px 12px;min-height:56px;flex-wrap:nowrap;gap:4px}.client-modern .toolbar h1{font-size:14px}
 .client-modern .toolbar .client-menu,.client-modern .sidebar-close{display:grid;place-items:center;background:transparent;min-width:36px;min-height:36px;width:36px;padding:8px}
 .client-modern .sidebar-scrim{position:fixed;left:100%;top:0;width:100vw;height:100dvh;background:#0005;border:0;border-radius:0;z-index:-1;opacity:0;pointer-events:none}
 .client-modern[data-sidebar-open=true] .sidebar-scrim{display:block;pointer-events:auto;opacity:1}
 .client-modern #actions{gap:1px}.client-modern .toolbar #actions button{min-width:32px;width:32px;min-height:32px;height:32px;padding:7px}
 .client-modern #content,.client-modern #account-content{padding:18px 16px 28px}.client-modern .messages{padding:22px 18px 170px;scrollbar-gutter:auto}
 .client-modern .message{font-size:15px}.client-modern .composer{width:calc(100% - 24px);bottom:max(12px,env(safe-area-inset-bottom));padding:8px 12px;border-radius:20px}
 .client-modern .stack{gap:16px}.client-modern .card{padding:16px}.client-modern .plugin-grid{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){.client-modern *,.client-modern *::before,.client-modern *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.client-modern .session-search input[aria-label] {background:transparent;border:0;padding:0;min-height:32px;height:32px;border-radius:0}
.client-modern .session-search input::-webkit-search-cancel-button {display:none}
@media(max-width:720px){.client-modern[data-sidebar-open=false] .shell>aside{transition:none}}

/* Route recipes share these modern loading primitives across Client, Account and Admin. */
body[data-web-client=modern] .page-placeholder{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:24px;padding:0;opacity:1;min-width:0;max-width:100%;animation:none}
body[data-web-client=modern] .page-placeholder>*{min-width:0}
body[data-web-client=modern] .ph-shape{background-color:var(--selection);background-image:linear-gradient(105deg,transparent 28%,color-mix(in srgb,var(--text) 10%,transparent) 48%,transparent 68%);background-size:240% 100%;border-radius:4px;animation:modern-placeholder 1.8s cubic-bezier(.4,0,.2,1) infinite}
body[data-web-client=modern] .ph-panel{display:flex;flex-direction:column;gap:16px;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:none;min-width:0}
body[data-web-client=modern] .ph-list{padding:0;border-radius:0;background:none}
body[data-web-client=modern] .ph-row{min-height:64px;padding:16px 0;gap:12px}
body[data-web-client=modern] .ph-list>.ph-row+.ph-row{border-top:1px solid var(--line)}
body[data-web-client=modern] .ph-avatar.ph-shape{width:32px;height:32px;border-radius:9px}
body[data-web-client=modern] .ph-tabs{max-width:380px;padding:4px;gap:4px;border-radius:9px;background:var(--surface-secondary)}
body[data-web-client=modern] .ph-tabs .ph-shape{border-radius:6px;height:34px!important}
body[data-web-client=modern] .ph-field{gap:8px}
body[data-web-client=modern] .ph-field>.ph-shape:last-child{border:1px solid var(--line);border-radius:8px;background-color:var(--surface-secondary)}
body[data-web-client=modern] .ph-filterbar{display:flex;flex-wrap:wrap;align-items:end;gap:12px}
body[data-web-client=modern] .ph-filterbar>.ph-field{display:flex;flex:1 1 140px;min-width:0}
body[data-web-client=modern] .ph-filterbar>.ph-shape{flex:0 0 74px;border-radius:8px}
body[data-web-client=modern] .ph-metrics{grid-template-columns:repeat(var(--ph-count,4),minmax(0,1fr));gap:16px}
body[data-web-client=modern] .ph-minimetrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:24px 16px}
body[data-web-client=modern] .ph-table{padding:0;border:1px solid var(--line);border-radius:10px;background:none;overflow:hidden}
body[data-web-client=modern] .ph-table-head,body[data-web-client=modern] .ph-table-row{display:grid;grid-template-columns:repeat(var(--ph-columns),minmax(0,1fr));min-height:54px;padding:12px 14px;gap:18px}
body[data-web-client=modern] .ph-table-head{min-height:40px;background:var(--surface-secondary)}
body[data-web-client=modern] .ph-table-row{border-top:1px solid var(--line)}
body[data-web-client=modern] .ph-chart{display:grid;gap:20px;padding:20px 0;border-block:1px solid var(--line)}
body[data-web-client=modern] .ph-chart-bars{display:flex;align-items:end;gap:12px;height:190px;padding:0 12px;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to top,transparent 0,transparent calc(25% - 1px),var(--line) 25%)}
body[data-web-client=modern] .ph-chart-bars .ph-shape{flex:1;min-width:0;flex-shrink:1;max-width:60px;border-radius:4px 4px 0 0}
body[data-web-client=modern] .ph-chat{min-height:clamp(320px,65dvh,720px);max-width:760px;margin-inline:auto;width:100%}
body[data-web-client=modern] .ph-assistant{background:none;border-radius:0;padding:16px 0}
body[data-web-client=modern] .ph-user{border-radius:20px;background:var(--surface-secondary);width:250px}
body[data-web-client=modern] .ph-composer{min-height:96px;background:var(--surface-secondary);border:1px solid var(--line);border-radius:22px}
body[data-web-client=modern] .ph-settings-group{display:grid;gap:12px;padding-block:8px}
@keyframes modern-placeholder{0%{background-position:160% 0;opacity:.65}50%{opacity:1}100%{background-position:-80% 0;opacity:.65}}
@media(max-width:1100px){body[data-web-client=modern] .ph-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){body[data-web-client=modern] .ph-metrics{gap:12px}body[data-web-client=modern] .ph-columns,body[data-web-client=modern] .ph-grid{grid-template-columns:minmax(0,1fr)}body[data-web-client=modern] .ph-filterbar>.ph-field{flex-basis:calc(50% - 12px)}body[data-web-client=modern] .ph-table-head,body[data-web-client=modern] .ph-table-row{gap:12px;grid-template-columns:repeat(var(--ph-columns),minmax(70px,1fr));min-width:calc(var(--ph-columns)*85px)}body[data-web-client=modern] .ph-chart-bars{gap:8px;height:170px}body[data-web-client=modern] .ph-chart-bars .ph-shape{max-height:90%}}
@media(prefers-reduced-motion:reduce){body[data-web-client=modern] .ph-shape{animation:none;opacity:.65}}
body[data-web-client=modern] .control-auth button.primary,body[data-web-client=modern] .control-sheet button.primary{background:var(--text);color:var(--bg)}
body[data-web-client=modern] .control-sheet{border-radius:16px;box-shadow:0 12px 48px #00000026}
body[data-web-client=modern] .control-sheet::backdrop{background:#0006;backdrop-filter:none}
body[data-web-client=modern] .social-person{border-radius:12px}
body[data-web-client=modern] .social-placeholder{display:block;grid-column:1/-1}

/* Native feedback shares one short, non-linear rhythm across Client and Admin. */
:where(body[data-web-client=modern]) :is(.client-modern,.adm-main,.adm-dialog,.control-sheet) button{transition:background-color 140ms,color 140ms,opacity 140ms,transform 180ms cubic-bezier(.2,.8,.2,1)}
:where(body[data-web-client=modern]) :is(.client-modern,.adm-main,.adm-dialog,.control-sheet) button:not(:disabled):active{transform:scale(.97)}
:where(body[data-web-client=modern]) .settings-link{transition:background-color 140ms,color 140ms}
:where(body[data-web-client=modern]) .settings-link:hover{background:var(--surface-secondary)}
:where(body[data-web-client=modern]) .settings-link:active{background:var(--selection)}
:where(body[data-web-client=modern]) .settings-link>.settings-chevron{transition:transform 180ms cubic-bezier(.2,.8,.2,1)}
:where(body[data-web-client=modern]) .settings-link:hover>.settings-chevron{transform:translateX(2px)}
:where(body[data-web-client=modern]) .native-segmented button{transition:background-color 180ms,color 180ms,transform 180ms cubic-bezier(.2,.8,.2,1)}
body[data-web-client=modern] .session-placeholders i{background-color:var(--selection);background-image:linear-gradient(105deg,transparent 28%,color-mix(in srgb,var(--text) 10%,transparent) 48%,transparent 68%);background-size:240% 100%;animation:modern-placeholder 1.8s cubic-bezier(.4,0,.2,1) infinite}
@media(prefers-reduced-motion:reduce){:where(body[data-web-client=modern]) :is(.client-modern,.adm-main,.adm-dialog,.control-sheet) button,:where(body[data-web-client=modern]) .settings-link,:where(body[data-web-client=modern]) .settings-chevron{transition:none!important;transform:none!important}body[data-web-client=modern] .ph-shape,body[data-web-client=modern] .session-placeholders i{animation:none;opacity:.65;background-image:none}}
.speech-settings{max-width:760px;width:100%;margin:0 auto;gap:16px}
.speech-current{margin:0;color:var(--secondary);font-size:.875rem}
.speech-controls>.row{min-height:64px;padding:12px 16px}
.speech-controls>.row+.row{border-top:1px solid var(--line)}
.speech-controls select{width:min(64%,350px);min-height:44px;margin:0}
.speech-sample{display:grid;gap:12px;margin-top:8px}
.speech-sample>label{font-size:.9375rem;font-weight:500}
.speech-sample textarea{width:100%;resize:vertical;min-height:110px}
.speech-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.speech-actions [role=status]{font-size:.8125rem}
.speech-tempo{display:flex;align-items:center;gap:12px;width:min(64%,350px)}
.speech-tempo input[type=range]{width:100%;min-width:0;min-height:44px;padding:0;margin:0}
.speech-tempo output{font-size:.875rem;min-width:3.5em;font-variant-numeric:tabular-nums;text-align:right}
.speech-custom{display:grid;gap:12px}.speech-custom h2{margin:0;font-size:1rem}.speech-custom p{margin:0}
.voice-draft-editor{position:relative;min-width:0;width:100%;isolation:isolate}
.voice-draft-editor>textarea{display:block;width:100%}
.voice-draft-caption{position:absolute;inset:0;padding:8px 4px;overflow:hidden;pointer-events:none;white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:14px;line-height:24px;color:var(--text);visibility:hidden}
.voice-draft-editor[data-live=true] .voice-draft-caption{visibility:visible}
.client-modern .voice-draft-editor[data-live=true] textarea{color:transparent;caret-color:var(--text)}
.speech-confirmed{color:var(--text)}.speech-provisional{color:color-mix(in srgb,var(--text) 76%,var(--secondary))}
.speech-arriving{will-change:opacity,filter}
.voice-dictation-header{display:flex;gap:var(--space-2,8px);align-items:center;min-height:32px;padding:0 4px}
.voice-dictation-header[hidden],.voice-call-panel[hidden]{display:none}
.voice-dictation-header .voice-status{max-width:none;white-space:normal;line-height:1.5}
.voice-dictation-header[data-state=failed] .voice-status{color:var(--danger)}
.voice-call-panel{display:grid;gap:var(--space-2,8px);width:100%;padding:6px 4px 12px;margin:0 0 4px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}
.voice-call-heading{display:flex;align-items:center;gap:var(--space-3,12px);min-height:36px;font-size:.8125rem;font-weight:500}
.voice-call-status{min-width:0;overflow-wrap:anywhere}
.voice-caption-source{margin:4px 0 -4px;font-size:.6875rem;line-height:1.4;color:var(--secondary)}
.voice-caption-source[hidden]{display:block;visibility:hidden}
.voice-call-caption{font-size:1rem;line-height:1.7;min-height:3.4em;max-height:clamp(6.8em,22vh,10.2em);overflow:auto;overscroll-behavior:contain;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;scrollbar-width:thin}
.voice-call-caption[data-empty=true]{visibility:hidden}
.voice-call-controls{display:flex;gap:var(--space-2,8px);align-items:center;flex-wrap:wrap;padding-top:4px}
.client-modern .composer .voice-call-controls>button{width:44px;height:44px;min-height:44px;flex:0 0 44px;padding:12px}
.client-modern .composer .voice-call-controls>button:not(.icon):not(.voice-call-end){width:auto;flex:0 1 auto;padding:10px 14px;border-radius:22px;white-space:nowrap}
.client-modern .composer .voice-call-end{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;color:var(--danger,#d24c4c);background:color-mix(in srgb,var(--danger,#d24c4c) 10%,transparent)}
.voice-call-end>svg{width:18px;height:18px}.voice-call-panel[data-state=failed] .voice-call-status{color:var(--danger)}
.voice-phone[aria-pressed=true]{background:var(--selection);color:var(--accent)}
.composer[data-call=true] footer :is(.voice-mic,.voice-speaker,.voice-phone){display:none}
.voice-signal{position:relative;display:flex;align-items:center;justify-content:center;gap:3px;width:45px;height:30px;flex:none;color:var(--accent);--voice-amplitude:0}
.voice-signal>i{display:block;flex:none;width:3px;height:4px;border-radius:3px;background:currentColor;opacity:.84;transform-origin:center;transform:scaleY(calc(1 + var(--voice-amplitude)*6.5*var(--voice-weight)))}
.voice-signal[data-state=connecting]::before{content:'';position:absolute;width:18px;height:18px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:speech-connect 1s linear infinite}
.voice-signal[data-state=connecting]>i{opacity:0;transform:none}
.voice-signal[data-state=processing]>i{transform:none;opacity:.3}
.voice-signal[data-state=processing]>i:nth-child(n+3):nth-child(-n+5){animation:speech-process 1.4s ease-in-out infinite}
.voice-signal[data-state=processing]>i:nth-child(4){animation-delay:120ms}.voice-signal[data-state=processing]>i:nth-child(5){animation-delay:240ms}
.voice-signal[data-state=processing]>i:nth-child(-n+2),.voice-signal[data-state=processing]>i:nth-child(n+6){visibility:hidden}
.voice-signal[data-state=settling]{color:var(--secondary)}
.voice-signal[data-state=muted]>i,.voice-signal[data-state=off]>i{opacity:.3;transform:none}
.voice-signal[data-state=failed]{color:var(--danger)}.voice-signal[data-state=failed]>i{transform:none}
@keyframes speech-connect{to{transform:rotate(360deg)}}
@keyframes speech-process{50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.voice-signal::before,.voice-signal>i{animation:none!important;transform:none!important}.voice-signal[data-has-signal=true]>i{opacity:1}.speech-arriving{will-change:auto}}
@media(prefers-reduced-transparency:reduce){.speech-provisional{color:var(--text)}}

.credential-actions{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}
.credential-actions .badge{white-space:nowrap}

.client-modern .toolbar .voice-wake-status{display:flex;gap:7px;align-items:center;max-width:220px;padding:7px 10px;color:var(--secondary);font-size:.6875rem;line-height:1.35;white-space:nowrap}
.voice-wake-status>svg{width:15px;height:15px;flex:none}.voice-wake-status>span{overflow:hidden;text-overflow:ellipsis}
.client-modern .toolbar .voice-wake-status[hidden]{display:none}
.voice-wake-status[data-phase=listening]{color:var(--accent)}.voice-wake-status[data-phase=failed],.voice-wake-status[data-phase=blocked]{color:var(--danger)}
.wake-settings{padding:0 16px 12px}.wake-settings>.row{padding:12px 0;min-height:60px}.wake-settings>p{font-size:.8125rem;line-height:1.6;margin:8px 0}.wake-settings input[type=checkbox]{width:40px;height:24px;accent-color:var(--accent)}
.client-modern #content[data-page=jarvis]{padding:0;overflow:hidden}
.client-modern .chat-layout.jarvis-workspace{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.9fr);grid-template-rows:auto minmax(0,1fr) auto;gap:0;isolation:isolate}
.jarvis-visual-area[hidden]{display:none}
.jarvis-visual-area{grid-column:1;grid-row:1/4;display:flex;flex-direction:column;gap:16px;min-width:0;min-height:0;padding:20px 24px;border-right:1px solid var(--line);background:var(--bg)}
.jarvis-workspace-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;min-height:44px}.jarvis-workspace-controls>[role=status]{font-size:.8125rem;line-height:1.5;min-width:0;overflow-wrap:anywhere}.jarvis-workspace-controls>button{border:1px solid var(--line);border-radius:22px;min-height:44px;padding:8px 16px;white-space:nowrap;background:var(--surface);color:var(--text);font-size:.8125rem}
.jarvis-workspace-controls>button[aria-pressed=true]{color:var(--danger)}
.jarvis-visual-content{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.jarvis-visual-shelf{display:flex;flex:none;gap:8px;max-height:96px;overflow:auto;padding:2px;scrollbar-width:thin;align-items:center}
.jarvis-visual-shelf:empty{display:none}.jarvis-visual-shelf>button{flex:none;max-width:200px;padding:8px 12px;min-height:40px;border:1px solid var(--line);border-radius:20px;font-size:.75rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;background:var(--surface);color:var(--secondary)}
.jarvis-visual-shelf>button[aria-pressed=true]{color:var(--accent);border-color:var(--accent)}
.visual-panel{display:flex;flex-direction:column;min-width:0;min-height:0;flex:1;border:1px solid var(--line);border-radius:22px;background:var(--surface);overflow:hidden}
.visual-panel-header{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:14px 18px;min-height:52px;border-bottom:1px solid var(--line);font-size:.875rem;flex:none}.visual-panel-header h2,.visual-panel-header h3{margin:0;font-size:inherit;font-weight:500}.visual-panel-header button{width:36px;height:36px;border:0;border-radius:50%;background:var(--surface-secondary);color:var(--secondary)}
.visual-panel-body{flex:1;min-height:0;min-width:0;overflow:auto;padding:20px;font-size:.9375rem;line-height:1.7}.visual-panel-body iframe{display:block;width:100%;height:100%;min-height:320px;border:0;border-radius:12px;background:var(--surface)}
.visual-panel-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:280px;flex:1;padding:32px;text-align:center;color:var(--secondary);font-size:.9375rem;line-height:1.7}.visual-panel-empty button{min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:22px;background:var(--surface);color:var(--text);font-size:.8125rem}
.visual-panel-controls{display:flex;align-items:center;gap:4px}.visual-panel-header .visual-panel-controls button{width:44px;height:44px;min-width:44px;min-height:44px}.visual-panel.is-fullscreen{position:fixed;inset:80px 20px 180px;z-index:4;box-shadow:0 12px 48px #0002}.visual-panel-empty.is-loading{background:linear-gradient(110deg,var(--surface-secondary) 20%,var(--surface) 45%,var(--surface-secondary) 70%);background-size:240% 100%;animation:modern-placeholder 1.8s ease-in-out infinite}.visual-panel-empty.is-error{color:var(--danger)}
.jarvis-workspace>.chat-subagents{grid-column:2;grid-row:1}.client-modern .jarvis-workspace>.messages{grid-column:2;grid-row:2;padding:24px 22px!important;min-height:0;overflow:auto;scrollbar-gutter:auto}.client-modern .jarvis-workspace>.composer{position:relative;grid-column:2;grid-row:3;left:auto;right:auto;bottom:auto;width:calc(100% - 32px);margin:0 16px max(16px,env(safe-area-inset-bottom));padding:10px 12px}.client-modern .jarvis-workspace .message{font-size:.875rem}.client-modern .jarvis-workspace .voice-call-caption{max-height:18vh}
@media(max-width:1050px){.client-modern .chat-layout.jarvis-workspace{grid-template-columns:minmax(0,1.15fr) minmax(280px,.9fr)}.jarvis-visual-area{padding:16px}.jarvis-workspace-controls>[role=status]{font-size:.75rem}}
@media(max-width:760px){.client-modern .toolbar .voice-wake-status{max-width:150px}.client-modern .chat-layout.jarvis-workspace{display:flex;flex-direction:column}.jarvis-visual-area{flex:1;min-height:220px;max-height:58%;border:0;border-bottom:1px solid var(--line);padding:12px 16px;gap:10px}.jarvis-workspace-controls{min-height:36px}.jarvis-workspace-controls>button{min-height:44px;padding:8px 12px}.client-modern .jarvis-workspace>.messages{flex:.6;min-height:100px;padding:16px!important}.client-modern .jarvis-workspace>.composer{flex:none;width:calc(100% - 24px);margin:0 12px max(12px,env(safe-area-inset-bottom))}.visual-panel-body{padding:14px}.visual-panel-body iframe{min-height:240px}.visual-panel-empty{min-height:180px;padding:20px}.jarvis-visual-shelf>button{min-height:36px;padding:6px 10px}}
@media(prefers-reduced-transparency:reduce){.visual-panel,.jarvis-workspace-controls>button{background:var(--surface)}}

@media(prefers-reduced-motion:reduce){.visual-panel-empty.is-loading{animation:none;background-image:none}}
@media(max-width:720px){.client-modern .shell .toolbar{display:flex;flex-wrap:nowrap;gap:2px;padding:6px 10px;min-height:56px;height:56px}.client-modern .shell .toolbar h1{font-size:14px;min-width:36px;flex:1}.client-modern .shell .toolbar #actions{display:flex;flex-wrap:nowrap;flex:none;gap:0}.client-modern .shell .toolbar #actions button{width:40px;min-width:40px;height:44px;min-height:44px;padding:10px}.client-modern .shell .toolbar .voice-wake-status{width:36px;min-width:36px;max-width:36px;height:44px;padding:10px}.client-modern .shell .toolbar .voice-wake-status>span{display:none}}
.jarvis-workspace-controls>.jarvis-history-toggle{display:none}
@media(max-width:760px){.jarvis-workspace[data-voice-call=true] .jarvis-history-toggle{display:inline-flex;align-items:center;justify-content:center}.client-modern .jarvis-workspace[data-voice-call=true]:not(.jarvis-show-history)>.messages{display:none}.jarvis-workspace[data-voice-call=true]>.jarvis-visual-area{max-height:none}.jarvis-workspace-controls>[role=status]{flex:1}.client-modern .jarvis-workspace[data-voice-call=true] .voice-call-caption[data-empty=true],.client-modern .jarvis-workspace[data-voice-call=true] .voice-caption-source[hidden]{display:none}}

/* Jarvis is a focused presentation surface; ordinary chat retains its shell. */
body:not([data-jarvis=true]) .jarvis-only{display:none!important}
body[data-jarvis=true] .client-modern .shell{grid-template-columns:minmax(0,1fr);gap:0;padding:0}
body[data-jarvis=true] .client-modern .shell>aside,body[data-jarvis=true] .client-modern .sidebar-scrim,body[data-jarvis=true] .client-modern .toolbar :is(#actions,h1,.client-menu){display:none!important}
body[data-jarvis=true] .client-modern .shell>.toolbar{width:100%}
body[data-jarvis=true] .client-modern .toolbar{min-height:56px;height:56px;border:0;background:transparent;padding:6px 20px}
body[data-jarvis=true] .client-modern .toolbar .jarvis-only{display:grid;place-items:center;width:44px;height:44px;min-width:44px;border-radius:50%;padding:12px}
body[data-jarvis=true] .client-modern .toolbar .jarvis-back{margin-right:auto}
body[data-jarvis=true] .client-modern #content{padding:0;overflow:hidden}
.client-modern .chat-layout.jarvis-workspace{display:flex;flex-direction:column;align-items:stretch;position:relative}
.jarvis-workspace>.jarvis-visual-area{flex:1;min-height:0;max-height:none;border:0;width:100%;padding:16px clamp(20px,5vw,90px);gap:12px}
.jarvis-workspace .jarvis-workspace-controls{display:none}
.jarvis-workspace:not(.jarvis-show-history)>.messages{display:none!important}
.client-modern .jarvis-workspace.jarvis-show-history>.messages{display:block;position:absolute;top:12px;right:20px;width:min(440px,calc(100% - 40px));height:min(62vh,620px);z-index:7;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:20px!important;box-shadow:0 12px 32px #0001}
.client-modern .jarvis-workspace>.composer{display:none;position:relative;flex:none;width:min(740px,calc(100% - 40px));margin:8px auto max(18px,env(safe-area-inset-bottom));left:auto;right:auto;bottom:auto}
.client-modern .jarvis-workspace.jarvis-show-input>.composer{display:grid}
.jarvis-workspace .usage-live,.jarvis-workspace>.chat-subagents{display:none!important}
.jarvis-voice-zone[hidden]{display:none}
.jarvis-voice-zone{display:flex;flex-direction:column;align-items:center;flex:none;width:min(740px,calc(100% - 40px));margin:0 auto max(20px,env(safe-area-inset-bottom))}
.jarvis-voice-zone>button{display:grid;place-items:center;width:56px;height:56px;min-height:56px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--accent);padding:17px}
.jarvis-workspace[data-voice-call=true] .jarvis-voice-zone>button{display:none}
.jarvis-voice-zone .voice-call-panel{border:0;padding:4px 0;margin:0;width:100%;text-align:center}
.jarvis-voice-zone .voice-call-heading{justify-content:center;font-size:.8125rem;color:var(--secondary)}
.jarvis-voice-zone .voice-call-caption{min-height:0;max-height:16vh;margin:0 auto;font-size:1rem;line-height:1.65;width:min(620px,100%)}
.jarvis-voice-zone .voice-call-controls{justify-content:center;padding:10px 0 0}.jarvis-voice-zone .voice-call-controls>button{display:grid;place-items:center;width:48px;height:48px;min-height:48px;padding:14px;border-radius:50%;background:var(--surface);color:var(--secondary);border:1px solid var(--line)}
.jarvis-voice-zone .voice-call-controls>.voice-call-end{margin:0;color:var(--danger)}
.jarvis-voice-zone .voice-call-caption[data-empty=true],.jarvis-voice-zone .voice-caption-source[hidden]{display:none}
.jarvis-idle{display:none;flex:1;min-height:120px;align-items:center;justify-content:center;flex-direction:column;gap:20px;color:var(--secondary);font-size:.9375rem}
.jarvis-visual-area[data-has-panel=false] .jarvis-idle{display:flex}.jarvis-visual-area[data-has-panel=false]>.jarvis-visual-content{flex:0;min-height:0}.jarvis-visual-area[data-has-panel=false] .visual-panel{display:none}
.jarvis-idle p{margin:0}.jarvis-idle .voice-signal{transform:scale(1.25)}
@media(max-width:760px){body[data-jarvis=true] .client-modern .toolbar{padding:6px 12px}.jarvis-workspace>.jarvis-visual-area{padding:8px 16px 12px}.jarvis-voice-zone{width:calc(100% - 32px);margin-bottom:max(16px,env(safe-area-inset-bottom))}.client-modern .jarvis-workspace>.composer{width:calc(100% - 32px);margin-bottom:max(16px,env(safe-area-inset-bottom))}.client-modern .jarvis-workspace.jarvis-show-history>.messages{right:16px;width:calc(100% - 32px);max-height:58vh}.jarvis-voice-zone .voice-call-caption{font-size:.9375rem;max-height:18vh}}
