/* agenters.de — Linear/Notion visual system. Loaded last by every rendered view. */
:root {
    --ui-bg:#f7f8fa; --ui-surface:#ffffff; --ui-surface-2:#f1f3f5; --ui-surface-3:#e9edf1;
    --ui-border:#dfe3e8; --ui-border-strong:#cbd2d9; --ui-text:#17191d; --ui-muted:#5f6875; --ui-faint:#7b8490;
    --ui-primary:#087f8c; --ui-primary-hover:#066b76; --ui-primary-soft:#e4f5f6; --ui-on-primary:#fff;
    --ui-success:#16845b; --ui-warning:#a36508; --ui-danger:#c73545; --ui-info:#2563b9;
    --ui-ring:rgba(8,127,140,.24); --ui-scrim:rgba(13,18,24,.52);
    --ui-radius-sm:6px; --ui-radius:8px; --ui-radius-lg:12px;
    --ui-shadow:0 1px 2px rgba(16,24,40,.05),0 8px 24px rgba(16,24,40,.05);
    --font-ui:'Satoshi','General Sans',Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --font-code:'JetBrains Mono','Fira Code','SFMono-Regular',Consolas,"Liberation Mono",monospace;
    --ui-font:var(--font-ui);
    --ui-mono:var(--font-code);
    --ui-fast:160ms cubic-bezier(.2,.8,.2,1);

    /* Compatibility map for existing components and the React flow builder. */
    --control-bg:var(--ui-bg); --control-panel:var(--ui-surface); --control-panel-2:var(--ui-surface-2);
    --control-panel-hover:var(--ui-surface-2); --control-input:var(--ui-surface); --control-canvas:var(--ui-bg);
    --control-line:var(--ui-border); --control-line-strong:var(--ui-border-strong); --control-text:var(--ui-text);
    --control-muted:var(--ui-muted); --control-faint:var(--ui-faint); --control-violet:var(--ui-primary); --control-violet-strong:var(--ui-primary-hover);
    --control-violet-soft:var(--ui-primary-soft); --control-cyan:var(--ui-primary); --control-green:var(--ui-success);
    --control-amber:var(--ui-warning); --control-rose:var(--ui-danger); --font:var(--ui-font);
    --flow-handoff:var(--ui-primary); --flow-conditional:var(--ui-info); --flow-fallback:var(--ui-danger);
    --flow-approval:var(--ui-warning); --flow-tool:var(--ui-success);
}

html[data-theme="dark"] {
    --ui-bg:#111315; --ui-surface:#171a1d; --ui-surface-2:#1d2125; --ui-surface-3:#252a2f;
    --ui-border:#2b3036; --ui-border-strong:#3a4149; --ui-text:#f1f3f5; --ui-muted:#a5adb7; --ui-faint:#848e99;
    --ui-primary:#45b8c3; --ui-primary-hover:#63c7d0; --ui-primary-soft:#15363a; --ui-on-primary:#071416;
    --ui-success:#4cc38a; --ui-warning:#d6a74f; --ui-danger:#ee7180; --ui-info:#78a9ed;
    --ui-ring:rgba(69,184,195,.3); --ui-scrim:rgba(0,0,0,.62); --ui-shadow:none;
}

html { color-scheme:light; background:var(--ui-bg); }
html[data-theme="dark"] { color-scheme:dark; }
body,button,input,textarea,select { font-family:var(--ui-font); }
body { background:var(--ui-bg)!important; color:var(--ui-text); font-size:14px; line-height:1.5; }
body::before,body::after,.control-body::before,.control-body::after { display:none!important; content:none!important; }
*,*::before,*::after { box-sizing:border-box; }
button,a,input,textarea,select { transition:border-color var(--ui-fast),background-color var(--ui-fast),color var(--ui-fast),opacity var(--ui-fast),box-shadow var(--ui-fast); }
button { touch-action:manipulation; }
button:hover,.agent-card:hover,.quick-card:hover { transform:none!important; }
:focus-visible { outline:2px solid var(--ui-primary)!important; outline-offset:2px; box-shadow:0 0 0 4px var(--ui-ring)!important; }
::selection { background:var(--ui-primary-soft); color:var(--ui-text); }

/* Shell and navigation */
.control-shell,.workspace-shell,.workspace-main { background:var(--ui-bg)!important; background-image:none!important; }
.command-sidebar { width:252px; background:var(--ui-surface)!important; border-right:1px solid var(--ui-border)!important; box-shadow:none!important; }
.brand-row { min-height:68px; padding:0 16px; border-bottom:1px solid var(--ui-border)!important; }
.brand-row strong,.mobile-brand { color:var(--ui-text)!important; font-size:13px; letter-spacing:.08em!important; }
.brand-row small { color:var(--ui-muted)!important; font:500 10px/1.2 var(--ui-font)!important; letter-spacing:0!important; }
.brand-mark,.brand-mark.mini,.auth-brand-mark { border:0!important; border-radius:7px!important; background:var(--ui-primary)!important; box-shadow:none!important; }
.brand-mark span,.auth-brand-mark span { background:var(--ui-on-primary)!important; box-shadow:none!important; border-radius:2px!important; }
.primary-navigation::before,.sidebar-section-head>span::before,.sidebar-build>.sidebar-label::before { content:none!important; }
.primary-navigation,.sidebar-section,.sidebar-build { padding-left:10px; padding-right:10px; }
.sidebar-section-head,.sidebar-label { color:var(--ui-faint)!important; font-size:10px!important; font-weight:650!important; letter-spacing:.06em!important; text-transform:uppercase; }
.nav-button,.channel-nav-button,.channel-nav-row { min-height:40px; border-radius:var(--ui-radius-sm)!important; color:var(--ui-muted)!important; box-shadow:none!important; }
.nav-button:hover,.channel-nav-button:hover,.channel-nav-row:hover { background:var(--ui-surface-2)!important; color:var(--ui-text)!important; }
.nav-button.is-active,.channel-nav-button.is-active,.channel-nav-row.is-active { background:var(--ui-primary-soft)!important; color:var(--ui-primary)!important; box-shadow:none!important; }
.nav-button.is-active svg,.channel-nav-button.is-active svg { color:var(--ui-primary)!important; }
.nav-count { background:var(--ui-surface-3)!important; color:var(--ui-muted)!important; }
.channel-more-button,.icon-button,.mini-icon-button,.theme-toggle { min-width:40px; min-height:40px; border-radius:var(--ui-radius-sm)!important; color:var(--ui-muted); }
.channel-more-button:hover,.icon-button:hover,.mini-icon-button:hover,.theme-toggle:hover { background:var(--ui-surface-2)!important; color:var(--ui-text)!important; }
.sidebar-account { padding:12px; border-top:1px solid var(--ui-border)!important; background:var(--ui-surface)!important; }
.account-link { border-radius:var(--ui-radius)!important; }
.account-link:hover { background:var(--ui-surface-2)!important; }
.user-avatar,.agent-avatar,.ledger-avatar,.settings-avatar,.avatar-picker-circle { overflow:hidden; border:1px solid var(--ui-border-strong)!important; border-radius:50%!important; background:var(--ui-surface-3)!important; color:var(--ui-text)!important; box-shadow:none!important; }
.user-avatar img,.agent-avatar img,.ledger-avatar img,.settings-avatar img,.avatar-picker-circle img { width:100%; height:100%; object-fit:cover; }
.connection-dot,.local-only-dot { box-shadow:none!important; }
.mobile-topbar { background:var(--ui-surface)!important; border-bottom:1px solid var(--ui-border)!important; box-shadow:none!important; }

/* Shared page composition */
.app-view:not(.chat-view) { width:100%; max-width:1440px; margin:0 auto; padding:28px 32px 56px!important; background:var(--ui-bg)!important; color:var(--ui-text)!important; }
.page-header,.ledger-header { min-height:auto!important; margin:0 0 24px; padding:0 0 22px!important; border-bottom:1px solid var(--ui-border)!important; }
.page-header h1,.ledger-heading-block h1 { margin:3px 0 4px!important; color:var(--ui-text)!important; font:650 28px/1.2 var(--ui-font)!important; letter-spacing:-.025em!important; }
.page-header p,.ledger-heading-block p { margin:0!important; color:var(--ui-muted)!important; font-size:13px; }
.eyebrow,.ledger-kicker,.ledger-label,.ledger-section-index { color:var(--ui-primary)!important; font:650 10px/1.2 var(--ui-font)!important; letter-spacing:.06em!important; text-transform:uppercase; }
.panel-card,.mission-card,.system-card,.quick-card,.agent-card,.settings-card,.settings-action-card,.security-summary,.ledger-panel { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg)!important; background:var(--ui-surface)!important; background-image:none!important; box-shadow:none!important; }
.panel-card:hover,.agent-card:hover,.settings-action-card:hover { border-color:var(--ui-border-strong)!important; box-shadow:none!important; }

/* Controls */
.primary-button,.ledger-primary-action,.auth-form button[type="submit"],.composer-send { min-height:42px; padding:0 15px; border:1px solid var(--ui-primary)!important; border-radius:var(--ui-radius-sm)!important; background:var(--ui-primary)!important; background-image:none!important; color:var(--ui-on-primary)!important; font-size:13px; font-weight:650; box-shadow:none!important; }
.primary-button:hover,.ledger-primary-action:hover,.auth-form button[type="submit"]:hover,.composer-send:hover { border-color:var(--ui-primary-hover)!important; background:var(--ui-primary-hover)!important; }
.secondary-button,.ledger-secondary-action,.btn-link { min-height:42px; border:1px solid var(--ui-border-strong)!important; border-radius:var(--ui-radius-sm)!important; background:var(--ui-surface)!important; color:var(--ui-text)!important; box-shadow:none!important; }
.secondary-button:hover,.ledger-secondary-action:hover,.btn-link:hover { background:var(--ui-surface-2)!important; }
.danger-button { border-radius:var(--ui-radius-sm)!important; background:var(--ui-danger)!important; color:#fff!important; box-shadow:none!important; }
button:disabled { opacity:.45!important; cursor:not-allowed!important; }
input,textarea,select,.search-field,.secret-field,.handle-field { border:1px solid var(--ui-border-strong)!important; border-radius:var(--ui-radius-sm)!important; background:var(--ui-surface)!important; color:var(--ui-text)!important; box-shadow:none!important; }
input,select { min-height:42px; }
input::placeholder,textarea::placeholder { color:var(--ui-faint)!important; }
input:focus,textarea:focus,select:focus,.secret-field:focus-within,.handle-field:focus-within { border-color:var(--ui-primary)!important; box-shadow:0 0 0 3px var(--ui-ring)!important; outline:0!important; }
.metric-icon,.privacy-badge,.security-note,.memory-context-chip { border-color:var(--ui-border)!important; background:var(--ui-surface-2)!important; color:var(--ui-primary)!important; box-shadow:none!important; }
.metric-icon.violet,.metric-icon.cyan,.metric-icon.amber,.metric-icon.green,.metric-icon.rose { color:var(--ui-primary)!important; background:var(--ui-primary-soft)!important; }

/* Authentication */
.auth-body { min-height:100dvh; display:grid; place-items:center; padding:24px; background:var(--ui-bg)!important; background-image:none!important; }
.auth-card { width:min(420px,calc(100vw - 48px)); padding:38px!important; border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg)!important; background:var(--ui-surface)!important; box-shadow:var(--ui-shadow)!important; }
.auth-card--register { width:min(520px,calc(100vw - 48px)); }
.auth-brand-mark { width:42px!important; height:42px!important; margin-bottom:24px!important; padding:10px!important; }
.auth-title { color:var(--ui-text)!important; font:650 28px/1.2 var(--ui-font)!important; letter-spacing:-.025em; }
.auth-subtitle,.auth-footer,.auth-form small { color:var(--ui-muted)!important; }
.auth-subtitle { margin:5px 0 28px!important; font-size:14px!important; }
.auth-form { gap:8px!important; }
.auth-form label { margin-top:10px; color:var(--ui-text)!important; font-size:12px; font-weight:650; }
.auth-form input { min-height:48px; margin-bottom:6px; padding-inline:14px; font-size:14px; }
.auth-form button[type="submit"] { min-height:48px; margin-top:18px; font-size:14px; }
.auth-error { border:1px solid color-mix(in srgb,var(--ui-danger) 35%,var(--ui-border))!important; border-radius:var(--ui-radius)!important; background:color-mix(in srgb,var(--ui-danger) 8%,var(--ui-surface))!important; color:var(--ui-danger)!important; }
.auth-footer a { color:var(--ui-primary)!important; }
.auth-totp-setup { border-top:1px solid var(--ui-border)!important; }
.auth-secret { border-radius:var(--ui-radius-sm)!important; background:var(--ui-surface-2)!important; color:var(--ui-text)!important; }

/* Settings and avatar upload */
.settings-shell { min-height:100dvh; background:var(--ui-bg)!important; color:var(--ui-text)!important; }
.settings-header { min-height:64px; border-bottom:1px solid var(--ui-border)!important; background:var(--ui-surface)!important; box-shadow:none!important; }
.settings-main { width:min(100% - 32px,920px)!important; margin:32px auto!important; }
.settings-card { padding:28px!important; }
.settings-nav .btn-link.active { border-color:var(--ui-primary)!important; background:var(--ui-primary-soft)!important; color:var(--ui-primary)!important; }
.avatar-picker { border-radius:50%; cursor:pointer; }
.avatar-picker-hint { border-radius:50%!important; background:rgba(17,25,32,.68)!important; color:#fff!important; }
.avatar-picker-menu { z-index:40; min-width:170px; padding:5px; border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius)!important; background:var(--ui-surface)!important; box-shadow:var(--ui-shadow)!important; }
.avatar-picker-menu button { min-height:38px; border-radius:var(--ui-radius-sm)!important; color:var(--ui-text)!important; }
.avatar-picker-menu button:hover { background:var(--ui-surface-2)!important; }

/* Dashboard — replaces Ledger visual identity without changing data hooks */
.control-body.is-overview-route,.overview-view { --ledger-bg:var(--ui-bg); --ledger-sidebar:var(--ui-surface); --ledger-surface:var(--ui-surface); --ledger-surface-2:var(--ui-surface-2); --ledger-surface-3:var(--ui-surface-3); --ledger-text:var(--ui-text); --ledger-muted:var(--ui-muted); --ledger-faint:var(--ui-faint); --ledger-line:var(--ui-border); --ledger-line-strong:var(--ui-border-strong); --ledger-brass:var(--ui-primary); --ledger-brass-strong:var(--ui-primary-hover); --ledger-success:var(--ui-success); --ledger-warning:var(--ui-warning); --ledger-error:var(--ui-danger); }
.overview-view h1,.overview-view h2,.overview-view .ledger-metrics strong { font-family:var(--ui-font)!important; }
.ledger-header-actions { gap:8px; }
.ledger-system-state { min-height:42px; padding:0 12px; border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-sm); background:var(--ui-surface); }
.ledger-command { margin-top:0!important; grid-template-columns:44px minmax(140px,.8fr) minmax(260px,2.4fr) 130px 110px; border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg)!important; background:var(--ui-surface)!important; overflow:hidden; }
.ledger-command-copy,.ledger-command-input,.ledger-command>.ledger-section-index,.ledger-audience { border-color:var(--ui-border)!important; }
.ledger-command-input { background:var(--ui-surface)!important; }
.ledger-command-input:focus-within { box-shadow:inset 0 -2px var(--ui-primary)!important; }
.ledger-metrics { margin:20px 0 28px!important; border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg); background:var(--ui-surface); overflow:hidden; }
.ledger-metrics strong { font-size:28px!important; font-weight:650!important; }
.ledger-workspace-grid { gap:16px!important; margin-bottom:24px!important; }
.ledger-panel { overflow:hidden; }
.ledger-panel-header { padding:14px 16px!important; border-color:var(--ui-border)!important; }
.ledger-table-head,.ledger-roster-head { background:var(--ui-surface-2); }
.ledger-operation-row,.ledger-agent-row { border-color:var(--ui-border)!important; }
.ledger-operation-row:hover,.ledger-agent-row:hover { background:var(--ui-surface-2)!important; box-shadow:none!important; }
.ledger-attention { padding-left:0!important; border-left:1px solid var(--ui-border)!important; }
.ledger-attention-list,.ledger-shortcuts { padding:0 16px; }

/* Agent Studio */
.filter-toolbar { margin-bottom:16px; padding:0!important; background:transparent!important; border:0!important; }
.search-field { min-height:42px; background:var(--ui-surface)!important; }
.agent-studio-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px!important; }
.agent-card { min-height:132px; padding:16px!important; text-align:left; }
.agent-card .agent-avatar { width:42px; height:42px; }
.agent-card.is-archived { opacity:.62; }
.agent-status,.ledger-agent-state { color:var(--ui-success)!important; }
.agent-status.is-error,.ledger-agent-state.is-error { color:var(--ui-danger)!important; }
.agent-status.is-thinking,.ledger-agent-state.is-thinking { color:var(--ui-warning)!important; }
.app-dialog::backdrop { background:var(--ui-scrim)!important; backdrop-filter:none!important; }
.dialog-shell { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg)!important; background:var(--ui-surface)!important; box-shadow:var(--ui-shadow)!important; }
.dialog-header,.dialog-footer,.form-section { border-color:var(--ui-border)!important; }
.dialog-header { background:var(--ui-surface)!important; }
.dialog-footer { background:var(--ui-surface-2)!important; }
.bundle-card,.capability-card { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius)!important; background:var(--ui-surface)!important; box-shadow:none!important; }
.bundle-card:has(input:checked),.capability-card:has(input:checked) { border-color:var(--ui-primary)!important; background:var(--ui-primary-soft)!important; box-shadow:none!important; }
.temperature-row { border-color:var(--ui-border)!important; background:var(--ui-surface-2)!important; }

/* Chat */
.chat-view,.chat-view button,.chat-view textarea { font-family:var(--font-ui); }
.chat-view { background:var(--ui-bg)!important; }
.chat-header-new { border-bottom:1px solid var(--ui-border)!important; background:var(--ui-surface)!important; }
.channel-symbol,.empty-orbit { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius)!important; background:var(--ui-primary-soft)!important; color:var(--ui-primary)!important; box-shadow:none!important; }
.message-list { width:min(100%,960px); margin-inline:auto; padding-inline:20px; }
.message-list>article { border:0!important; display:flex; gap:10px; align-items:flex-end; padding:8px 0!important; }
.message-list>article.is-user { flex-direction:row-reverse; }
.message-list .msg-body { width:fit-content; max-width:min(76%,720px); padding:11px 14px; border:1px solid var(--ui-border); border-radius:var(--ui-radius-lg); background:var(--ui-surface-2); color:var(--ui-text); }
.message-list .is-user .msg-body { border-color:color-mix(in srgb,var(--ui-primary) 42%,var(--ui-border)); background:color-mix(in srgb,var(--ui-primary) 17%,var(--ui-surface)); }
.message-list .is-user .msg-meta { justify-content:flex-end; }
.message-list .msg-content { color:var(--ui-text)!important; white-space:pre-wrap; overflow-wrap:anywhere; }
.message-list .msg-avatar { width:32px; height:32px; flex:0 0 auto; display:grid; place-items:center; overflow:hidden; border:1px solid var(--ui-border-strong); border-radius:50%; background:var(--ui-surface-3); color:var(--ui-text); font-size:10px; font-weight:700; }
.message-list .msg-avatar--user { background:var(--ui-primary-soft); color:var(--ui-primary); }
.message-list .msg-avatar img { width:100%; height:100%; display:block; object-fit:cover; border-radius:inherit; }
.message-list .msg { animation:chat-message-in 180ms cubic-bezier(.2,.8,.2,1); }
.message-list .is-optimistic { opacity:.82; }
.message-list .msg-typing .msg-body { min-width:92px; padding-block:9px; }
.typing-label { color:var(--ui-faint); font-size:10px; }
.typing-dots { height:18px; display:flex; align-items:center; gap:4px; }
.typing-dots i { width:5px; height:5px; border-radius:50%; background:var(--ui-muted); animation:typing-dot 1.05s ease-in-out infinite; }
.typing-dots i:nth-child(2) { animation-delay:120ms; }
.typing-dots i:nth-child(3) { animation-delay:240ms; }
@keyframes typing-dot { 0%,60%,100% { opacity:.35; transform:translateY(0); } 30% { opacity:1; transform:translateY(-3px); } }
@keyframes chat-message-in { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
.chat-code-block { margin:10px 0 2px; overflow:hidden; border:1px solid var(--ui-border-strong); border-radius:var(--ui-radius); background:var(--ui-surface-3); }
.chat-code-toolbar { min-height:38px; padding:5px 7px 5px 11px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--ui-border); color:var(--ui-muted); font:600 11px/1 var(--font-ui); }
.chat-code-toolbar span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.save-code-button { min-height:28px; padding:0 9px; border:1px solid var(--ui-border-strong); border-radius:var(--ui-radius-sm); background:var(--ui-surface); color:var(--ui-text); font:600 11px/1 var(--font-ui); cursor:pointer; }
.save-code-button:hover { border-color:var(--ui-primary); color:var(--ui-primary); background:var(--ui-primary-soft); }
.chat-code-block pre { margin:0; padding:14px; overflow:auto; background:transparent; color:var(--ui-text); tab-size:4; }
.chat-code-block code { font:500 12.5px/1.65 var(--font-code); white-space:pre; }
.created-file-note { padding:9px 11px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--ui-border); background:var(--ui-primary-soft); color:var(--ui-text); font-size:12px; }
.created-file-note a { color:var(--ui-primary); font-weight:650; text-decoration:none; }
.created-file-note a:hover { text-decoration:underline; }
.message-form-new { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg)!important; background:var(--ui-surface)!important; box-shadow:none!important; }
.message-input-wrap textarea { border:0!important; box-shadow:none!important; }
.channel-context-menu,.mention-dropdown { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius)!important; background:var(--ui-surface)!important; box-shadow:var(--ui-shadow)!important; }
.code-file-body { display:grid; gap:14px; }
.code-file-preview { margin:0; padding:12px; max-height:150px; overflow:auto; border:1px solid var(--ui-border); border-radius:var(--ui-radius); background:var(--ui-surface-3); color:var(--ui-muted); font:500 11px/1.55 var(--font-code); white-space:pre; }

@media (max-width:700px) {
    .message-list { padding-inline:12px; }
    .message-list .msg-body { max-width:86%; }
    .message-list .msg-avatar { display:none; }
}
@media (prefers-reduced-motion:reduce) {
    .message-list .msg,.typing-dots i { animation:none!important; }
}

/* Deployment update notice. Created globally by theme.js when version.json changes. */
.app-update-banner { position:fixed; z-index:1200; right:18px; bottom:18px; width:min(420px,calc(100vw - 36px)); min-height:64px; padding:12px; display:flex; align-items:center; justify-content:space-between; gap:16px; border:1px solid var(--ui-border-strong); border-left:3px solid var(--ui-primary); border-radius:var(--ui-radius); background:var(--ui-surface); color:var(--ui-text); box-shadow:var(--ui-shadow); }
.app-update-banner[hidden] { display:none!important; }
.app-update-banner>span { min-width:0; display:grid; gap:2px; }
.app-update-banner strong { font-size:13px; font-weight:700; }
.app-update-banner small { color:var(--ui-muted); font-size:11px; line-height:1.4; }
.app-update-banner button { min-height:36px; flex:0 0 auto; padding:0 13px; border:1px solid var(--ui-primary); border-radius:var(--ui-radius-sm); background:var(--ui-primary); color:var(--ui-on-primary); font:650 12px/1 var(--font-ui); cursor:pointer; }
.app-update-banner button:hover { border-color:var(--ui-primary-hover); background:var(--ui-primary-hover); }
@media (max-width:620px) {
    .app-update-banner { right:10px; bottom:10px; width:calc(100vw - 20px); min-height:58px; padding:10px; }
    .app-update-banner small { display:none; }
}

/* Memory and security */
.memory-layout,.security-layout { gap:16px!important; }
.memory-connect-card,.memory-agents,.security-panel { padding:20px!important; }
.memory-visual { min-height:150px; background:var(--ui-surface-2)!important; }
.vault-core { border:1px solid var(--ui-border-strong)!important; border-radius:var(--ui-radius-lg)!important; background:var(--ui-surface)!important; color:var(--ui-primary)!important; box-shadow:none!important; }
.memory-visual>span { background:var(--ui-primary)!important; box-shadow:none!important; }
.local-storage-note { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius)!important; background:var(--ui-primary-soft)!important; color:var(--ui-muted)!important; }
.security-summary-grid { gap:12px!important; }
.security-summary { padding:18px!important; }
.security-summary strong { color:var(--ui-text)!important; font-family:var(--ui-mono); }
.security-row,.security-event-row,.memory-agent-row { border-color:var(--ui-border)!important; }
.security-event-dot { box-shadow:none!important; }
.skeleton-line { border-radius:var(--ui-radius)!important; background:var(--ui-surface-2)!important; animation:none!important; }

/* React automation builder */
.automation-app { min-height:100%; background:var(--ui-bg)!important; color:var(--ui-text)!important; }
html[data-theme="light"] .automation-app,html[data-theme="dark"] .automation-app { --control-bg:var(--ui-bg); --control-panel:var(--ui-surface); --control-panel-2:var(--ui-surface-2); --control-panel-hover:var(--ui-surface-2); --control-input:var(--ui-surface); --control-canvas:var(--ui-bg); --control-line:var(--ui-border); --control-line-strong:var(--ui-border-strong); --control-text:var(--ui-text); --control-muted:var(--ui-muted); --control-faint:var(--ui-faint); }
.automation-header,.automation-commandbar,.automation-library,.automation-canvas-pane,.automation-right,.automation-grid { background:var(--ui-surface)!important; background-image:none!important; border-color:var(--ui-border)!important; box-shadow:none!important; }
.automation-header h1 { font:650 27px/1.2 var(--ui-font)!important; letter-spacing:-.02em; }
.automation-grid { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg)!important; overflow:hidden; }
.automation-commandbar { border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius)!important; }
.automation-commandbar button,.automation-header button,.rf-zoom button,.pane-title button { border-radius:var(--ui-radius-sm)!important; box-shadow:none!important; }
.automation-commandbar button.primary,.automation-header button.primary { background:var(--ui-primary)!important; color:var(--ui-on-primary)!important; }
.automation-library-item,.inspector-agent { border-color:var(--ui-border)!important; border-radius:var(--ui-radius)!important; background:var(--ui-surface)!important; }
.automation-library-item:hover { background:var(--ui-surface-2)!important; }
.rf-canvas { background-color:var(--ui-bg)!important; background-image:none!important; }
.rf-node { border:1px solid var(--ui-border-strong)!important; border-radius:var(--ui-radius)!important; background:var(--ui-surface)!important; box-shadow:0 2px 8px rgba(16,24,40,.08)!important; }
.rf-node.selected { border-color:var(--ui-primary)!important; box-shadow:0 0 0 3px var(--ui-ring)!important; }
.rf-port.output { background:var(--ui-primary)!important; }
.rf-port.active { box-shadow:0 0 0 5px var(--ui-ring)!important; }
.rf-edges g.selected .rf-edge { filter:none!important; stroke:var(--ui-primary)!important; }
.rf-zoom { border-color:var(--ui-border)!important; border-radius:var(--ui-radius)!important; background:var(--ui-surface)!important; box-shadow:var(--ui-shadow)!important; }
.validation-strip { background:var(--ui-surface-2)!important; border-color:var(--ui-border)!important; }

/* Responsive */
@media (max-width:900px) {
    .app-view:not(.chat-view) { padding:20px 20px 44px!important; }
    .ledger-command { grid-template-columns:42px 1fr!important; }
    .ledger-workspace-grid,.memory-layout,.security-layout { grid-template-columns:1fr!important; }
    .security-summary-grid { grid-template-columns:1fr 1fr!important; }
}
@media (max-width:620px) {
    .app-view:not(.chat-view) { padding:16px 16px 36px!important; }
    .page-header,.ledger-header { align-items:flex-start!important; }
    .page-header h1,.ledger-heading-block h1 { font-size:24px!important; }
    .security-summary-grid,.field-grid.two-columns { grid-template-columns:1fr!important; }
    .auth-card { width:min(420px,calc(100vw - 28px)); padding:28px!important; }
    .settings-main { width:min(100% - 24px,920px)!important; margin:20px auto!important; }
}
@media (prefers-reduced-motion:reduce) {
    *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; }
}

/* Agent Studio OS editor — scoped to the agent dialog */
.app-dialog.agent-dialog { width:min(1120px,calc(100vw - 32px)); height:min(880px,calc(100dvh - 32px)); max-height:min(880px,calc(100dvh - 32px)); overflow:hidden; }
.agent-dialog .dialog-shell { width:100%; height:100%; max-height:none; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; overflow:hidden; }
.agent-dialog .dialog-header { padding:20px 24px 16px; }
.agent-editor-tabs { display:flex; min-width:0; padding:0 16px; border-bottom:1px solid var(--ui-border); background:var(--ui-surface); overflow-x:auto; scrollbar-width:none; }
.agent-editor-tabs::-webkit-scrollbar { display:none; }
.agent-editor-tabs button { position:relative; min-width:max-content; min-height:52px; display:flex; align-items:center; gap:7px; padding:0 14px; border:0; background:transparent; color:var(--ui-muted); font-size:12px; font-weight:600; cursor:pointer; }
.agent-editor-tabs button span { color:var(--ui-faint); font:500 9px/1 var(--ui-mono); }
.agent-editor-tabs button::after { position:absolute; right:14px; bottom:-1px; left:14px; height:2px; border-radius:2px 2px 0 0; background:transparent; content:""; }
.agent-editor-tabs button:hover { color:var(--ui-text); }
.agent-editor-tabs button[aria-selected="true"] { color:var(--ui-primary); }
.agent-editor-tabs button[aria-selected="true"] span { color:var(--ui-primary); }
.agent-editor-tabs button[aria-selected="true"]::after { background:var(--ui-primary); }
.agent-tab-content { min-width:0; min-height:0; padding:0!important; overflow-x:hidden; overflow-y:auto; background:var(--ui-bg); }
.agent-tab-panel { width:min(100%,920px); margin:0 auto; padding:24px 28px 40px; }
.agent-tab-panel[hidden] { display:none!important; }
.agent-panel-intro { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:20px; }
.agent-panel-intro h3 { margin:4px 0; color:var(--ui-text); font-size:21px; letter-spacing:-.015em; }
.agent-panel-intro p { max-width:680px; margin:0; color:var(--ui-muted); font-size:12px; }
.agent-dialog .form-section { margin:0 0 16px; padding:20px; border:1px solid var(--ui-border)!important; border-radius:var(--ui-radius-lg); background:var(--ui-surface); }
.agent-dialog .form-section-title { margin-bottom:18px; }
.agent-dialog .form-section-title>span { min-width:44px; color:var(--ui-primary); font:650 9px/1 var(--ui-font); text-transform:uppercase; }
.agent-identity-layout { display:grid; grid-template-columns:112px minmax(0,1fr); gap:20px; align-items:start; }
.agent-avatar-placeholder { width:112px; height:112px; display:grid; place-items:center; align-content:center; gap:7px; overflow:hidden; border:1px dashed var(--ui-border-strong); border-radius:50%; background:var(--ui-surface-2); color:var(--ui-muted); text-align:center; }
.agent-avatar-placeholder>span { font-size:28px; font-weight:650; color:var(--ui-primary); }
.agent-avatar-placeholder>small { max-width:76px; font-size:9px; line-height:1.25; }
.agent-avatar-placeholder img { width:64px; height:64px; border-radius:50%; object-fit:cover; }
.agent-advanced-section { margin-bottom:16px; border:1px solid var(--ui-border); border-radius:var(--ui-radius-lg); background:var(--ui-surface); overflow:hidden; }
.agent-advanced-section summary { min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:12px 18px; cursor:pointer; list-style:none; }
.agent-advanced-section summary::-webkit-details-marker { display:none; }
.agent-advanced-section summary:hover { background:var(--ui-surface-2); }
.agent-advanced-section summary>span { display:grid; gap:2px; }
.agent-advanced-section summary strong { color:var(--ui-text); font-size:12px; }
.agent-advanced-section summary small { color:var(--ui-muted); font-size:10px; }
.agent-advanced-section summary>svg { width:15px; height:15px; color:var(--ui-faint); transform:rotate(90deg); transition:transform var(--ui-fast); }
.agent-advanced-section[open] summary>svg { transform:rotate(-90deg); }
.advanced-body { padding:18px; border-top:1px solid var(--ui-border); background:var(--ui-surface); }
.preview-note { margin:0; color:var(--ui-faint)!important; font-size:10px!important; }
.preview-note::before { content:"Vorschau · "; color:var(--ui-warning); font-weight:650; }
.unit-field { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; border:1px solid var(--ui-border-strong); border-radius:var(--ui-radius-sm); background:var(--ui-surface); overflow:hidden; }
.unit-field input { min-width:0; border:0!important; border-radius:0!important; box-shadow:none!important; }
.unit-field span { padding:0 12px; color:var(--ui-faint); font-size:10px; }
.advanced-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.advanced-groups fieldset { min-width:0; display:grid; align-content:start; gap:12px; margin:0; padding:16px; border:1px solid var(--ui-border); border-radius:var(--ui-radius); }
.advanced-groups legend { padding:0 6px; color:var(--ui-text); font-size:11px; font-weight:650; }
.advanced-groups fieldset>small { color:var(--ui-faint); font-size:10px; }
.handoff-target-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.handoff-target-list>span { color:var(--ui-muted); font-size:11px; }
.handoff-target-list .checkbox-row { min-height:40px; padding:8px 10px; border:1px solid var(--ui-border); border-radius:var(--ui-radius-sm); }
.handoff-target-list small { display:block; color:var(--ui-faint); }
.memory-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.memory-choice-grid label { min-height:82px; display:flex; gap:10px; padding:14px; border:1px solid var(--ui-border); border-radius:var(--ui-radius); cursor:pointer; }
.memory-choice-grid label:has(input:checked) { border-color:var(--ui-primary); background:var(--ui-primary-soft); }
.agent-dialog input[type="checkbox"],.agent-dialog input[type="radio"] { appearance:auto; flex:0 0 auto; width:17px!important; min-width:17px; height:17px!important; min-height:17px!important; margin:0; padding:0!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; accent-color:var(--ui-primary); }
.agent-dialog .checkbox-row { min-width:0; display:flex!important; flex-direction:row!important; align-items:center!important; gap:10px!important; }
.agent-dialog .checkbox-row>span { min-width:0; }
.memory-choice-grid input { align-self:flex-start; margin-top:1px; }
.memory-choice-grid span { display:grid; align-content:start; gap:3px; }
.memory-choice-grid strong { color:var(--ui-text); font-size:11px; }
.memory-choice-grid small { color:var(--ui-muted); font-size:10px; }
.cost-profile-card { display:grid; grid-template-columns:1fr auto; align-items:center; gap:3px 20px; padding:16px; border:1px solid var(--ui-border); border-radius:var(--ui-radius); background:var(--ui-surface-2); }
.cost-profile-card span { color:var(--ui-muted); font-size:10px; }
.cost-profile-card strong { grid-row:1/3; grid-column:2; color:var(--ui-text); font-size:18px; }
.cost-profile-card small { color:var(--ui-faint); font-size:10px; }
.credential-select-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.credential-select-row .secondary-button { white-space:nowrap; }
.credential-select-row svg { width:14px; height:14px; }
.provider-connect-body { display:grid; gap:16px; }
.provider-connect-status { margin:0; padding:11px 12px; border:1px solid var(--ui-border); border-radius:var(--ui-radius-sm); background:var(--ui-surface-2); color:var(--ui-muted); font-size:11px; }
.agent-dialog .dialog-footer { position:relative; z-index:2; }

@media (max-width:760px) {
    .app-dialog.agent-dialog { width:100vw; height:100dvh; max-height:none; border:0!important; border-radius:0!important; }
    .agent-dialog .dialog-shell { width:100%; height:100%; max-height:none; border:0!important; border-radius:0!important; }
    .agent-dialog .dialog-header { padding:16px; }
    .agent-editor-tabs { padding:0 6px; }
    .agent-editor-tabs button { min-height:48px; padding:0 10px; }
    .agent-editor-tabs button span { display:none; }
    .agent-tab-panel { padding:20px 16px 32px; }
    .agent-identity-layout { grid-template-columns:1fr; }
    .agent-avatar-placeholder { width:88px; height:88px; }
    .advanced-groups,.memory-choice-grid { grid-template-columns:1fr; }
    .handoff-target-list { grid-template-columns:1fr; }
    .credential-select-row { grid-template-columns:1fr; }
}