/* Kivanto visual system. Layout foundations live in kivanto.css.
   Local assets only; module colours complement the original Kivanto mark. */
:root {
  /* Farben von kivanto.ai (Landing): Paper, Ink, Kivanto-Teal. */
  --ground: #fafaf8;
  --surface: #f1f0eb;
  --surface-raised: #fff;
  --text: #101418;
  --text-quiet: #4a5560;
  --accent: #1e8a80;
  --accent-soft: #e3f0ee;
  --line: #e3e1da;
  --warning: #a14324;
  --ok: #15645d;
  --attention: #90620c;
  --teal: #1e8a80;
  --violet: #7252bf;
  --coral: #c85048;
  --radius: 1rem;
  --radius-sm: 0.625rem;
  --shadow-card: 0 1px 3px rgb(16 20 24 / 0.025);
  --topbar-height: 4.25rem;
  --header-height: 4rem;
  --rail-width: 15rem;
  --panel-width: 14rem;
  --duration: 160ms;
}

/* Shell and navigation */
.topbar { padding: 0 1.5rem; box-shadow: none; z-index: 12; }
.topbar__brand { font-size: 1.3rem; font-weight: 750; }
.topbar .brand { gap: 0.7rem; }
.topbar .brand-mark { width: 2rem; height: 2rem; }
.rail__project-picker { display: grid; gap: .4rem; min-width: 0; padding: 0 .4rem .85rem; border-bottom: 1px solid var(--line); }
.rail__project-picker .rail__label { padding: 0 .3rem; margin: 0; }
.rail__project-picker select { width: 100%; min-width: 0; min-height: 2.75rem; background: var(--accent-soft); border-color: var(--line); color: var(--text); font-weight: 600; text-overflow: ellipsis; }
.topbar__avatar { display: grid; place-items: center; flex: none; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-size: 0.85rem; font-weight: 700; }
.topbar__role { margin-top: 0.2rem; }
.rail { background: var(--ground); border-color: var(--line); padding: 1rem .6rem .75rem; color: var(--text); }
.rail__items { gap: 1.15rem; scrollbar-width: thin; scrollbar-color: var(--line) transparent; padding-bottom: 1rem; }
.rail__group { min-width: 0; }
.rail__label { margin: 0 0 .4rem; padding: 0 .7rem; font-size: .625rem; font-weight: 500; letter-spacing: .06em; line-height: 1.5; text-transform: uppercase; color: var(--text-quiet); }
.rail__links { display: grid; gap: .15rem; }
.rail__group[data-nav-group='administration'] { border-top: 1px solid var(--line); padding-top: 1rem; }
.rail__item { color: var(--text-quiet); padding: .45rem .7rem; border-radius: .5rem; gap: .6rem; font-size: .8125rem; min-height: 2.5rem; }
.rail__item:hover { background: var(--surface); color: var(--text); }
.rail__item[aria-current='true'] { background: var(--accent-soft); color: var(--accent); box-shadow: none; }
.rail__glyph { width: 1.35rem; height: 1.35rem; background: none; color: inherit; }
.rail__item[aria-current='true'] .rail__glyph { color: inherit; background: none; }
.rail__foot { border-color: var(--line); padding-top: .8rem; }
.rail__foot .button, .rail__version, .rail__foot .update-controls__status { color: var(--text-quiet); }
.rail__foot .button:hover { background: var(--surface); color: var(--text); }
.rail :focus-visible { outline-color: var(--accent); }
.panel__head { padding: 1.1rem .85rem .75rem; }
.panel__title { font-size: .9rem; font-weight: 600; }
.panel__item { min-height: 2.5rem; border-radius: .5rem; }
.panel__item[aria-current='true'] { box-shadow: none; }
.panel__head .button--primary { background: var(--surface-raised); color: var(--text); border-color: var(--line); box-shadow: none; font-size: .8rem; }
.panel__head .button--primary:hover { background: var(--accent-soft); border-color: var(--accent); }
.main__header { background: var(--ground); border-bottom-color: transparent; padding: 0 1.5rem; }
.main { grid-template-columns: minmax(0, 1fr); }
.main__footer { min-width: 0; }
.main__left { display: flex; align-items: center; gap: 0.8rem; min-width: 0; }
.main__module { display: none; }
.main__title { font-size: 1rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.3; min-width: 0; }
.main__middle { padding: 1rem clamp(1rem, 2vw, 2rem) 2rem; scrollbar-gutter: stable; }
.main__footer { background: var(--ground); border-top-color: transparent; padding: 1rem 2rem 1.4rem; }

/* Shared controls and content surfaces */
.button { min-height: 2.5rem; font-weight: 600; border-radius: 0.625rem; transition: background var(--duration), border-color var(--duration), box-shadow var(--duration); }
.button:hover:not(:disabled) { box-shadow: none; }
.button--primary { background: #1e8a80; border-color: #1e8a80; color: #fff; box-shadow: none; }
.button--primary:hover:not(:disabled) { background: #15645d; border-color: #15645d; opacity: 1; }
.button--quiet:hover:not(:disabled) { box-shadow: none; background: var(--accent-soft); color: var(--accent); }
input:where(:not([type='checkbox']):not([type='radio']):not([type='range']):not([type='file'])), select, textarea, .field {
  max-width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 0.625rem;
  padding: 0.65rem 0.8rem; background: var(--surface-raised); color: var(--text); font: inherit; font-size: 0.875rem;
  transition: border-color var(--duration), box-shadow var(--duration);
}
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
input[type='checkbox'], input[type='radio'] { accent-color: #1e8a80; }
input::placeholder, textarea::placeholder { color: var(--text-quiet); opacity: 0.8; }
label { min-width: 0; }
.card, .crm-panel, .crm-form, .crm-detail, .kg-form, .kg-community { padding: 1.4rem; }
.notice { border-radius: 0.8rem; background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 22%, var(--line)); }
.notice--error, .notice--warn { color: var(--warning); background: color-mix(in srgb, var(--warning) 9%, var(--surface-raised)); }
.matrix thead th, .crm-table thead th, .kg-table thead th { background: var(--surface); color: var(--text-quiet); padding-top: 0.85rem; padding-bottom: 0.85rem; }
.crm-table tbody tr:hover, .kg-table tbody tr:hover { background: var(--accent-soft); }
.crm-chip, .panel__badge, .project__access { border-radius: 999px; }

/* Project overview */
.projects { gap: 1.2rem; }
.workspace-intro { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.8rem 2rem; border-radius: .85rem; border: 1px solid var(--line); background: var(--surface-raised); color: var(--text); position: relative; overflow: hidden; }
.workspace-intro__eyebrow { color: var(--text-quiet); font-size: 0.65rem; letter-spacing: 0.16em; font-weight: 700; }
.workspace-intro h2 { margin: 0.45rem 0 0.55rem; font-size: clamp(1.3rem, 2.4vw, 1.8rem); line-height: 1.25; letter-spacing: -0.035em; }
.workspace-intro p { color: var(--text-quiet); margin: 0; font-size: 0.85rem; max-width: 34rem; }
.workspace-intro__art { display: flex; align-items: center; gap: 1.25rem; flex: none; padding: 0 0.5rem; }
.workspace-intro__node { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 0.8rem; border: 1px solid #2f7d75; background: #1a4d48; color: #a8e2da; }
.workspace-intro__node:last-child { color: #dbd0ff; transform: translateY(1rem); }
.workspace-intro__hub { display: grid; place-items: center; width: 4.25rem; height: 4.25rem; border-radius: 1.1rem; background: #fff; box-shadow: 0 0 0 8px rgb(255 255 255 / 0.08), 0 6px 20px rgb(0 0 0 / 0.15); transform: rotate(-5deg); }
.workspace-intro__hub .brand-mark { width: 2.6rem; height: 2.6rem; background-image: url('/brand/kivanto-mark.png'); }
.projects__list { gap: 1rem; }
.project { padding: 1.3rem; gap: 1.1rem; }
.project[aria-current='true'] { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); box-shadow: none; }
.project__line { gap: 1rem; }
.project__symbol { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 0.85rem; flex: none; background: var(--accent-soft); color: var(--accent); }
.project__symbol .icon { width: 1.5rem; height: 1.5rem; }
.project__name { font-size: 1.1rem; font-weight: 700; margin-bottom: 0.25rem; letter-spacing: -0.02em; }
.project__path { font-size: 0.7rem; line-height: 1.6; }
.project__access { background: var(--accent-soft); color: var(--accent); padding: 0.15rem 0.55rem; }
.project__stores { color: var(--teal); font-weight: 600; }
.project__actions { padding-top: 0.85rem; gap: 0.35rem; }
.project__actions .button { font-size: 0.8rem; }
.project__actions .button[aria-expanded='true'] { background: var(--accent-soft); color: var(--accent); }
.project__actions .button[data-open] { margin-left: auto; color: var(--accent); }

/* Project sources and vendor identities. Scope to .project so chat citations
   keep their compact layout despite the legacy shared .sources class. */
.project > .sources { padding: 1.25rem; margin: 0; border: 1px solid var(--line); background: var(--ground); border-radius: 0.9rem; gap: 1rem; }
.project > .sources h4 { margin: 0; font-size: 1rem; letter-spacing: -0.015em; }
.project > .sources h5 { font-size: 0.72rem; color: var(--text-quiet); letter-spacing: 0.055em; text-transform: uppercase; }
.sources__lead { font-size: 0.8rem; line-height: 1.7; max-width: 65rem; }
.sources__provider-grid { gap: 0.75rem; }
.sources__provider.button { --provider-color: #1e8a80; position: relative; padding: 1.15rem; gap: 0.4rem; min-height: 10.5rem; border-radius: 0.85rem; border-top: 3px solid var(--provider-color); background: var(--surface-raised); box-shadow: var(--shadow-card); }
.sources__provider[data-provider='hubspot'] { --provider-color: #f34d28; }
.sources__provider[data-provider='brevo'] { --provider-color: #0b996e; }
.sources__provider[data-provider='pipedrive'] { --provider-color: #087c53; }
.sources__provider[data-provider='monday'] { --provider-color: #7761e8; }
.sources__provider.button:hover, .sources__provider.button:focus-visible { border-color: var(--provider-color); background: color-mix(in srgb, var(--provider-color) 5%, var(--surface-raised)); box-shadow: 0 5px 18px color-mix(in srgb, var(--provider-color) 12%, transparent); }
.sources__provider-logo { height: 2.75rem; max-width: 100%; display: flex; align-items: center; margin-bottom: 0.5rem; padding: 0.45rem 0.6rem; border-radius: 0.55rem; background: #fff; }
.sources__provider-logo img { display: block; width: auto; height: auto; max-height: 1.6rem; max-width: min(7.5rem, 100%); object-fit: contain; }
.sources__provider[data-provider='brevo'] .sources__provider-logo img { width: 1.8rem; max-height: 1.8rem; }
.sources__provider strong { font-size: 0.9rem; color: var(--text); }
.sources__provider-summary { font-size: 0.75rem; font-weight: 400; line-height: 1.5; padding-right: 0.5rem; }
.sources__provider .sources__provider-arrow { position: absolute; right: 0.7rem; top: 0.7rem; color: var(--text-quiet); }
.project .sources__item { padding: 0.85rem 1rem; background: var(--surface-raised); border: 1px solid var(--line); border-radius: 0.75rem; gap: 0.7rem; }
.project .sources__list { gap: 0.7rem; }
.sources__main { flex-wrap: wrap; }
.sources__name { overflow-wrap: anywhere; }
.sources__kind { background: var(--accent-soft); color: var(--accent); font-size: 0.64rem; text-transform: uppercase; border-radius: 0.35rem; padding: 0.15rem 0.35rem; }
.sources__scope { color: var(--teal); font-size: 0.68rem; font-weight: 650; }
.sources__form { padding: 1.25rem; background: var(--surface-raised); gap: 1rem; border-radius: 0.85rem; }
.sources__form--connection { border-left: 3px solid var(--accent); }
.sources__form label { display: grid; gap: 0.4rem; font-size: 0.8rem; font-weight: 600; }
.sources__form label.sources__personal { display: flex; }
.sources__form label input, .sources__form label select { width: 100%; }
.sources__form label input[type='checkbox'] { width: auto; }
.sources__provider-details { background: var(--accent-soft); padding: 1rem; border-radius: 0.65rem; }
.sources__provider-details a { color: var(--accent); font-size: 0.8rem; }
.sources__warn { padding: 0.8rem 1rem; background: color-mix(in srgb, var(--attention) 8%, var(--surface-raised)); border: 1px solid color-mix(in srgb, var(--attention) 24%, var(--line)); border-radius: 0.65rem; color: var(--text-quiet); line-height: 1.65; }
.sources__account-actions .button { font-size: 0.75rem; min-height: 2.1rem; }
.sources__result { color: var(--teal); }

/* Chat, search, file browser, CRM and settings */
.empty { max-width: 35rem; margin: clamp(1.5rem, 7vh, 5rem) auto; text-align: center; padding: 1.5rem; }
.empty__visual { display: grid; place-items: center; width: 4.5rem; height: 4.5rem; margin: 0 auto 1.5rem; border-radius: 1.4rem; background: var(--accent-soft); color: var(--accent); box-shadow: 0 0 0 10px color-mix(in srgb, var(--accent) 4%, transparent); }
.empty__visual .brand-mark { width: 2.6rem; height: 2.6rem; }
.empty__visual .icon { width: 2rem; height: 2rem; }
.empty__title { color: var(--text); font-family: var(--font-ui); font-weight: 650; font-size: 1.7rem; line-height: 1.25; letter-spacing: -0.04em; }
.empty p { line-height: 1.75; }
.turn__question { background: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 14%, transparent); padding: 0.9rem 1.15rem; }
.history, .turn { min-width: 0; grid-template-columns: minmax(0, 1fr); }
.turn__answer { min-width: 0; overflow-wrap: anywhere; }
.step-chip { max-width: min(22rem, 100%); min-width: 0; }
.step-chip__input { min-width: 0; }
.turn__answer { padding: 1.2rem 1.4rem; background: var(--surface-raised); border: 1px solid var(--line); border-radius: 1rem; box-shadow: var(--shadow-card); }
.composer { background: var(--surface-raised); padding: 0.65rem; border: 1px solid var(--line); border-radius: 1rem; box-shadow: 0 4px 22px rgb(16 20 24 / 0.06); }
textarea.composer__field { border-color: transparent; background: transparent; min-height: 2.6rem; }
.hit { padding: 1.1rem; margin-bottom: 0.65rem; }
.file-view__head, .files__head { background: var(--surface); }
.crm-tiles { grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: 1rem; }
.crm-tile { padding: 1.2rem; position: relative; overflow: hidden; border-top: 3px solid var(--accent); }
.crm-tile__icon { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 0.6rem; background: var(--accent-soft); color: var(--accent); margin-bottom: 0.85rem; }
.crm-tile__value { font-size: 1.8rem; letter-spacing: -0.04em; overflow-wrap: anywhere; }
.crm-tile__label { margin-top: 0.4rem; line-height: 1.4; }
.crm-tile:nth-child(3n+2) { border-top-color: var(--teal); }
.crm-tile:nth-child(3n+2) .crm-tile__icon { color: var(--teal); background: color-mix(in srgb, var(--teal) 10%, var(--surface-raised)); }
.crm-tile:nth-child(3n) { border-top-color: var(--violet); }
.crm-tile:nth-child(3n) .crm-tile__icon { color: var(--violet); background: color-mix(in srgb, var(--violet) 10%, var(--surface-raised)); }
.crm-tile[data-tone='good'] { border-top-color: var(--ok); }
.crm-tile[data-tone='good'] .crm-tile__value { color: var(--ok); }
.crm-tile[data-tone='bad'] { border-top-color: var(--warning); }
.crm-tile[data-tone='bad'] .crm-tile__icon { color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, var(--surface-raised)); }
.crm-columns-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: 1rem; }
.crm-bars__fill { background: var(--teal); }
.crm-bars__row:nth-child(3n) .crm-bars__fill { background: var(--violet); }
.crm-bars__row:nth-child(3n+2) .crm-bars__fill { background: var(--accent); }
.crm-graph-block { background: color-mix(in srgb, var(--teal) 7%, var(--surface-raised)); border-color: color-mix(in srgb, var(--teal) 20%, var(--line)); padding: 1.2rem; }
.settings__row { padding: 1.2rem 0; }
.settings__origin { background: var(--surface); border-radius: 999px; padding: 0.15rem 0.55rem; }

@media (max-width: 1100px) {
  .workspace-intro__art { gap: 0.7rem; }
  .workspace-intro__node { display: none; }
  .topbar__avatar { display: none; }
}
@media (max-width: 768px) {
  :root { --topbar-height: 3.75rem; --header-height: 4rem; }
  .topbar { padding: 0 0.8rem; }
  .topbar__tools { gap: 0.45rem; }
  .topbar .brand-mark { width: 1.65rem; height: 1.65rem; }
  .topbar__picker select { min-height: 2.2rem; padding: 0.4rem; }
  .topbar__me .button { padding: 0.45rem; font-size: 0.75rem; }
  .main__header { padding: 0 1rem; gap: 0.6rem; }
  .main__middle { padding: 0.35rem 1rem 1.5rem; scrollbar-gutter: auto; }
  .main__footer { padding: 0.7rem 1rem; }
  .composer { flex-wrap: wrap; }
  textarea.composer__field { flex: 1 1 100%; width: 100%; }
  .main__title { font-size: 1.1rem; }
  .main__module { width: 2rem; height: 2rem; }
  .workspace-intro { padding: 1.35rem; }
  .workspace-intro__art { display: none; }
  .project { padding: 1rem; }
  .project__main { flex-basis: calc(100% - 4rem); }
  .project__meta { flex-basis: 100%; flex-direction: row; flex-wrap: wrap; gap: 0.4rem 0.7rem; }
  .project__symbol { width: 2.5rem; height: 2.5rem; }
  .project > .sources { padding: 0.85rem; }
  .project__actions .button { flex: 1 1 auto; padding: 0.5rem; }
  .sources__provider-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sources__provider.button { min-height: 10rem; padding: 0.85rem; }
  .sources__provider-logo { padding: 0.3rem; }
  .sources__form, .project .sources__item { padding: 0.85rem; }
  .sources__provider-details { padding: 0.8rem; }
  .turn__answer { padding: 1rem; }
  .source__main { flex-direction: column; align-items: stretch; }
  .source__row { flex-basis: auto; grid-template-columns: 1.5rem minmax(0, 1fr) auto; gap: 0.35rem; }
  .source__open { align-self: flex-end; min-height: 2.25rem; }
  .empty { padding: 1rem; }
  .empty__title { font-size: 1.45rem; }
  .crm-bars__row { grid-template-columns: minmax(5rem, 1fr) 1fr 2rem; }
}
@media (max-width: 420px) {
  .main__middle { padding-left: 0.75rem; padding-right: 0.75rem; }
  .project { padding: 0.85rem; }
  .sources__provider-grid { grid-template-columns: 1fr; }
  .sources__provider.button { min-height: auto; display: grid; grid-template-columns: 1fr; padding: 1rem; }
  .sources__provider-logo { justify-self: start; margin-bottom: 0.25rem; }
  .sources__provider-logo img { max-width: 7.5rem; }
  .main__left { gap: 0.5rem; }
  .main__module { width: 1.8rem; height: 1.8rem; }
}
/* File explorer: frequent actions above the workspace, maintenance folded away. */
.files-browser { display: grid; gap: 1rem; min-width: 0; }
.files-browser__toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.files-browser__toolbar h2 { margin: 0 0 0.25rem; font-size: 1rem; letter-spacing: -0.025em; }
.files-browser__toolbar .files__actions { margin: 0; gap: 0.5rem; }
.files-browser__toolbar .files__actions .button { font-size: 0.8rem; }
.files__upload[aria-disabled='true'] { opacity: 0.5; cursor: default; }
.files-browser__maintenance { border-bottom: 1px solid var(--line); padding-bottom: 0.75rem; color: var(--text-quiet); }
.files-browser__maintenance > summary { cursor: pointer; font-size: 0.75rem; width: fit-content; }
.files-browser__maintenance .index-run { margin: 0.75rem 0 0; }
.files-browser .files { grid-template-columns: minmax(15rem, 19rem) minmax(0, 1fr); gap: 1.25rem; }
.files-browser .files__tree { padding: 0.75rem; max-height: calc(100dvh - var(--topbar-height) - var(--header-height) - 12rem); position: sticky; top: 0; }
.files__breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 0.15rem; min-width: 0; padding: 0.2rem 0 0.7rem; }
.files__breadcrumbs span { display: inline-flex; align-items: center; gap: 0.15rem; min-width: 0; }
.files__breadcrumbs .icon { width: 0.8rem; color: var(--text-quiet); }
.files__breadcrumbs button { border: 0; background: transparent; color: var(--accent); font: inherit; font-size: 0.75rem; padding: 0.25rem 0.2rem; cursor: pointer; overflow-wrap: anywhere; text-align: left; border-radius: 0.25rem; }
.files__breadcrumbs button:hover { background: var(--accent-soft); }
.files-browser__search { display: flex; align-items: center; gap: 0.35rem; position: relative; }
.files-browser__search > .icon { position: absolute; left: 0.65rem; color: var(--text-quiet); pointer-events: none; }
.files-browser__search input[type='search'] { width: 100%; padding-left: 2rem; font-size: 0.78rem; background: var(--ground); }
.files-browser__tree-tools { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem; padding: 0.55rem 0; }
.files-browser__tree-tools button { font: inherit; font-size: 0.68rem; color: var(--text-quiet); background: transparent; border: 0; padding: 0.3rem; border-radius: 0.3rem; cursor: pointer; }
.files-browser__tree-tools button:hover { background: var(--accent-soft); color: var(--accent); }
.files-browser__tree-tools button:disabled { opacity: 0.5; cursor: default; }
.files-browser__matches, .files-browser__no-files { font-size: 0.78rem; color: var(--text-quiet); margin: 0.5rem 0; line-height: 1.6; }
.files-browser .tree__row { padding-top: 0.55rem; padding-bottom: 0.55rem; gap: 0.45rem; min-height: 2.6rem; font-size: 0.8rem; }
.files-browser .tree__row:disabled { cursor: default; }
.files-browser .tree__row[aria-current='true'] { box-shadow: inset 3px 0 var(--accent); font-weight: 600; }
.files-browser .tree__zip { opacity: 1; min-width: 1.8rem; min-height: 2rem; }
.files-browser .tree__name { white-space: normal; overflow-wrap: anywhere; line-height: 1.4; }
.files-browser .file__nodes { display: none; }
.files-browser .file__marks { flex-wrap: wrap; justify-content: flex-end; flex: 0 0 auto; max-width: 5rem; }
.file-type { display: inline-grid; place-items: center; flex: none; width: 1.7rem; height: 1.7rem; border-radius: 0.4rem; color: var(--text-quiet); background: var(--surface); }
.file-type--folder { color: var(--attention); background: color-mix(in srgb, var(--attention) 10%, var(--surface-raised)); }
.file-type[data-type='document'] { color: var(--accent); background: var(--accent-soft); }
.file-type[data-type='code'] { color: var(--violet); background: color-mix(in srgb, var(--violet) 10%, var(--surface-raised)); }
.file-type[data-type='table'] { color: var(--teal); background: color-mix(in srgb, var(--teal) 10%, var(--surface-raised)); }
.file-type[data-type='image'] { color: var(--coral); background: color-mix(in srgb, var(--coral) 10%, var(--surface-raised)); }
.file-type .icon { width: 1rem; height: 1rem; }
.files-browser .file-view { padding: 1.25rem; }
.files-browser .file-view__head { background: transparent; padding: 0 0 0.85rem; gap: 0.6rem; }
.file-view__name { flex: 1 1 auto; min-width: 0; font-size: 1rem; margin: 0; overflow-wrap: anywhere; line-height: 1.4; letter-spacing: -0.02em; }
.file-view__actions { display: flex; flex-wrap: wrap; flex: 1 1 100%; gap: 0.25rem; }
.file-view__actions .button { font-size: 0.75rem; }
.file-view__actions [data-action='delete-file'] { margin-left: auto; color: var(--warning); }
.file-view__tabs { display: flex; gap: 0.2rem; width: fit-content; padding: 0.25rem; margin-bottom: 1rem; border-radius: 0.65rem; background: var(--surface); }
.file-view__tabs button { display: flex; align-items: center; gap: 0.35rem; font: inherit; font-size: 0.75rem; padding: 0.4rem 0.65rem; border: 0; border-radius: 0.45rem; color: var(--text-quiet); background: transparent; cursor: pointer; }
.file-view__tabs [aria-pressed='true'] { background: var(--surface-raised); box-shadow: var(--shadow-card); color: var(--accent); font-weight: 600; }
.editor__modes { margin-bottom: 0; }
.editor__modes button[aria-pressed='true'] { color: var(--accent); }
.file-view__document { font-family: var(--font-ui); font-size: 0.9rem; line-height: 1.8; padding: 0.25rem 0.5rem; overflow-wrap: anywhere; overflow-x: auto; }
.file-view__document :is(h1,h2,h3) { letter-spacing: -0.025em; line-height: 1.4; }
.file-view__document h1 { font-size: 1.6rem; }
.file-view__document h2 { font-size: 1.2rem; }
.file-view__document pre { max-width: 100%; overflow: auto; }
.files-browser textarea.editor__field { font-family: var(--font-code); min-height: 18rem; width: 100%; }
.files-browser__back { display: none; }
.files-browser .files__content > .empty { margin: 2rem auto; }
@media (max-width: 1000px) and (min-width: 769px) {
  .files-browser .files { grid-template-columns: minmax(13rem, 0.8fr) minmax(0, 1fr); gap: 0.75rem; }
}
@media (max-width: 768px) {
  .files-browser .files { grid-template-columns: minmax(0, 1fr); }
  .files-browser .files__tree { position: static; max-height: none; }
  .files-browser .files[data-mobile-pane='preview'] .files__tree { display: none; }
  .files-browser .files[data-mobile-pane='list'] .files__content { display: none; }
  .files-browser:has(.files[data-mobile-pane='preview']) .files-browser__toolbar .files__actions { display: none; }
  .files-browser__back { display: inline-flex; margin-bottom: 0.7rem; }
  .files-browser .file-view { padding: 0.85rem; }
  .files-browser .file-view__body { max-height: 65dvh; padding: 0.55rem; }
  .files-browser .files__confirm { flex-wrap: wrap; }
  .files-browser__toolbar .files__actions { width: 100%; }
  .files-browser__toolbar .files__actions .button { flex: 1 1 auto; }
  .files-browser .files__new-dir { flex-wrap: wrap; }
  .files-browser__tree-tools button { min-height: 2.5rem; }
}

/* Start dashboard */
.home { display: grid; gap: 1.35rem; min-width: 0; }
.home-welcome { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.8rem 2rem; color: var(--text); background: var(--surface-raised); border: 1px solid var(--line); border-radius: .85rem; }
.home-welcome__eyebrow, .home-connect__eyebrow { font-size: 0.65rem; font-weight: 700; letter-spacing: .1em; color: var(--text-quiet); }
.home-welcome h2 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); line-height: 1.25; letter-spacing: -0.04em; margin: 0.45rem 0 0.55rem; }
.home-welcome p { color: var(--text-quiet); font-size: 0.87rem; margin: 0; }
.home-welcome__project { display: inline-flex; align-items: center; gap: 0.4rem; background: var(--accent-soft); color: var(--accent); border: 1px solid transparent; border-radius: 999px; padding: 0.3rem 0.65rem; margin-top: 1rem; font-size: 0.72rem; overflow-wrap: anywhere; }
.home-welcome__mark { display: grid; place-items: center; width: 4.7rem; height: 4.7rem; flex: none; margin: 0 0.5rem; border-radius: 1.2rem; background: #fff; box-shadow: 0 0 0 10px rgb(255 255 255 / 0.06), 0 0 0 22px rgb(255 255 255 / 0.03); }
.home-welcome__mark .brand-mark { width: 3rem; height: 3rem; background-image: url('/brand/kivanto-mark.png'); }
.home-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.home-metric { position: relative; padding: 1.3rem; background: var(--surface-raised); border: 1px solid var(--line); border-radius: 1rem; box-shadow: var(--shadow-card); min-width: 0; }
.home-metric__icon { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 0.65rem; margin-bottom: 0.85rem; background: var(--accent-soft); color: var(--accent); }
.home-metric[data-tone='teal'] .home-metric__icon { background: color-mix(in srgb, var(--teal) 10%, var(--surface-raised)); color: var(--teal); }
.home-metric[data-tone='violet'] .home-metric__icon { background: color-mix(in srgb, var(--violet) 10%, var(--surface-raised)); color: var(--violet); }
.home-metric[data-tone='warning'] .home-metric__icon { background: color-mix(in srgb, var(--warning) 10%, var(--surface-raised)); color: var(--warning); }
.home-metric__value { font-size: clamp(1.2rem, 2vw, 1.75rem); font-weight: 700; letter-spacing: -0.04em; line-height: 1.3; overflow-wrap: anywhere; }
.home-metric__label { font-size: 0.8rem; font-weight: 600; margin-top: 0.35rem; }
.home-metric__note { color: var(--text-quiet); font-size: 0.7rem; margin-top: 0.25rem; overflow-wrap: anywhere; }
.home-shortcuts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: 0.75rem; }
.home-shortcut { display: flex; align-items: center; gap: 0.65rem; min-width: 0; padding: 1rem; border: 1px solid var(--line); border-radius: 0.85rem; background: var(--surface-raised); color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: background var(--duration), border-color var(--duration); }
.home-shortcut:hover { border-color: var(--accent); background: var(--accent-soft); }
.home-shortcut__icon { display: grid; place-items: center; flex: none; color: var(--accent); }
.home-shortcut[data-view='files'] .home-shortcut__icon { color: var(--attention); }
.home-shortcut[data-view='crm'] .home-shortcut__icon { color: var(--teal); }
.home-shortcut__copy { display: grid; gap: 0.25rem; min-width: 0; flex: 1; }
.home-shortcut__copy strong { font-size: 0.8rem; }
.home-shortcut__copy > span { font-size: 0.68rem; line-height: 1.5; color: var(--text-quiet); }
.home-shortcut > .icon { width: 0.85rem; color: var(--text-quiet); }
.home-columns { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1rem; }
.home-panel { min-width: 0; padding: 1.25rem; background: var(--surface-raised); border: 1px solid var(--line); border-radius: 1rem; box-shadow: var(--shadow-card); }
.home-panel__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.home-panel__head h3 { font-size: 0.95rem; margin: 0; letter-spacing: -0.02em; }
.home-panel__head .button { font-size: 0.7rem; padding: 0.4rem; }
.home-projects { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.5rem; }
.home-project { display: flex; align-items: center; gap: 0.7rem; width: 100%; padding: 0.85rem; border: 1px solid var(--line); border-radius: 0.75rem; background: var(--surface-raised); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.home-project:hover { border-color: var(--accent); }
.home-project[aria-current='true'] { background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 22%, var(--line)); }
.home-project__icon { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border-radius: 0.65rem; color: var(--accent); background: var(--surface-raised); flex: none; }
.home-project__copy { display: grid; gap: 0.2rem; flex: 1; min-width: 0; }
.home-project__copy strong { font-size: 0.85rem; overflow-wrap: anywhere; }
.home-project__copy > span { font-size: 0.7rem; color: var(--text-quiet); }
.home-project__active { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.65rem; color: var(--accent); }
.home-panel__link { margin-top: 0.7rem; font-size: 0.75rem; color: var(--accent); }
.home-knowledge { display: grid; }
.home-knowledge__row { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; border-bottom: 1px solid var(--line); padding: 0.6rem 0; font-size: 0.82rem; }
.home-knowledge__row strong { font-variant-numeric: tabular-nums; color: var(--teal); }
.home-status { display: flex; align-items: flex-start; gap: 0.65rem; padding: 0.9rem; border-radius: 0.7rem; background: color-mix(in srgb, var(--teal) 7%, var(--surface-raised)); margin-top: 1rem; color: var(--teal); }
.home-status strong { font-size: 0.75rem; }
.home-status p { color: var(--text-quiet); font-size: 0.72rem; line-height: 1.6; margin: 0.3rem 0 0; }
.home-status[data-state='failed'] { color: var(--warning); background: color-mix(in srgb, var(--warning) 9%, var(--surface-raised)); }
.home-status[data-state='running'] { color: var(--violet); background: color-mix(in srgb, var(--violet) 9%, var(--surface-raised)); }
.home-status[data-state='pending'] { color: var(--text-quiet); background: var(--surface); }
.home-empty { padding: 0.75rem 0; color: var(--text-quiet); font-size: 0.85rem; line-height: 1.7; }
.home-empty h4 { color: var(--text); margin: 0.75rem 0 0.4rem; font-size: 1.1rem; }
.home-empty p { margin: 0 0 1rem; }
.home-empty__icon { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 0.75rem; color: var(--accent); background: var(--accent-soft); }
.home-connect { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.5rem; border: 1px solid color-mix(in srgb, var(--teal) 20%, var(--line)); border-radius: 1rem; background: color-mix(in srgb, var(--teal) 5%, var(--surface-raised)); }
.home-connect__eyebrow { color: var(--teal); }
.home-connect h3 { font-size: 1.15rem; margin: 0.4rem 0; letter-spacing: -0.025em; }
.home-connect p { color: var(--text-quiet); font-size: 0.8rem; margin: 0 0 1rem; max-width: 28rem; }
.home-connect .button { font-size: 0.8rem; }
.home-connect__logos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem; flex: 0 0 17rem; }
.home-connect__logo { display: flex; align-items: center; justify-content: center; gap: 0.4rem; min-width: 0; height: 3.7rem; padding: 0.75rem; background: #fff; border: 1px solid #e3e1da; border-radius: 0.75rem; }
.home-connect__logo img { display: block; max-width: 100%; width: auto; max-height: 1.5rem; object-fit: contain; }
.home-connect__logo span { font-size: 0.9rem; font-weight: 700; color: #101418; }
@media (max-width: 768px) {
  .home { gap: 1rem; }
  .home-welcome { padding: 1.3rem; }
  .home-welcome__mark { display: none; }
  .home-metrics { gap: 0.6rem; }
  .home-metric { padding: 1rem; }
  .home-columns { grid-template-columns: minmax(0, 1fr); }
  .home-connect { flex-direction: column; align-items: stretch; padding: 1.2rem; }
  .home-connect__logos { flex-basis: auto; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .home-connect__logo { padding: 0.5rem; }
}
@media (max-width: 480px) {
  .home-metrics { grid-template-columns: minmax(0, 1fr); }
  .home-metric { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); column-gap: 0.7rem; }
  .home-metric__icon { grid-row: 1 / 4; margin: 0; }
  .home-metric__value, .home-metric__label, .home-metric__note { grid-column: 2; }
  .home-project { flex-wrap: wrap; }
  .home-connect__logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  :root { --duration: 0ms; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

/* Project data sources: service accounts contain their imports. */
.source-workspace__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.source-workspace__head > div { flex: 1 1 18rem; min-width: 0; }
.source-workspace__head .sources__lead { margin-top: 0.35rem; max-width: 43rem; }
.source-services { display: grid; gap: 1rem; min-width: 0; }
.source-service { border: 1px solid var(--line); background: var(--surface-raised); border-radius: 0.85rem; overflow: hidden; min-width: 0; }
.source-service__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; padding: 1rem; }
.project .source-service h5, .project .source-setup h5, .project .source-workspace__empty h5 { margin: 0; font-size: 0.95rem; letter-spacing: -0.01em; text-transform: none; color: var(--text); overflow-wrap: anywhere; }
.source-service__title { flex: 1 1 10rem; min-width: 0; }
.source-service__title > span { display: block; margin-top: 0.2rem; color: var(--text-quiet); font-size: 0.75rem; }
.source-service__logo { flex: 0 0 3rem; height: 2.7rem; display: flex; align-items: center; justify-content: center; padding: 0.35rem; border-radius: 0.65rem; color: var(--accent); background: var(--accent-soft); }
.source-service__logo:has(img) { background: white; flex-basis: 5rem; border: 1px solid #e3e1da; }
.source-service__logo img { max-width: 100%; max-height: 1.8rem; object-fit: contain; }
.source-badge { display: inline-flex; align-items: center; font-size: 0.7rem; padding: 0.2rem 0.5rem; border-radius: 0.35rem; background: color-mix(in srgb, var(--teal) 10%, var(--surface-raised)); color: var(--teal); overflow-wrap: anywhere; }
.source-badge[data-tone='quiet'] { color: var(--text-quiet); background: var(--ground); }
.source-badge[data-tone='warning'] { color: var(--danger); background: color-mix(in srgb, var(--danger) 9%, var(--surface-raised)); }
.source-imports { margin: 0; padding: 0 1rem; list-style: none; }
.source-import { padding: 1rem 0; border-top: 1px solid var(--line); }
.source-import__head { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; }
.source-import__icon { display: grid; place-items: center; color: var(--teal); width: 2rem; flex-shrink: 0; }
.source-import__copy { flex: 1 1 12rem; min-width: 0; }
.source-import__copy strong { display: block; font-size: 0.85rem; overflow-wrap: anywhere; }
.source-import__copy > span { color: var(--text-quiet); font-size: 0.73rem; }
.source-import__head .button, .source-service__head .button { font-size: 0.75rem; }
.source-import__details { margin: 0.65rem 0 0 2.7rem; }
.source-import__details summary, .source-service__settings summary { cursor: pointer; color: var(--text-quiet); font-size: 0.75rem; width: fit-content; }
.source-import__details summary:hover, .source-service__settings summary:hover { color: var(--accent); }
.source-service__settings { padding: 0.85rem 1rem; background: color-mix(in srgb, var(--ground) 60%, var(--surface-raised)); border-top: 1px solid var(--line); }
.source-service__settings summary svg { display: inline-block; vertical-align: middle; width: 1rem; height: 1rem; margin: 0 0.3rem; }
.source-facts { margin: 1rem 0; display: grid; gap: 0.6rem; font-size: 0.75rem; }
.source-facts > div { display: grid; grid-template-columns: minmax(7rem, 0.4fr) minmax(0, 1fr); gap: 1rem; }
.source-facts dt { color: var(--text-quiet); }
.source-facts dd { margin: 0; overflow-wrap: anywhere; }
.source-facts code { white-space: normal; font-size: 0.72rem; }
.source-import__remove { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.source-import__remove p { flex-basis: 100%; color: var(--text-quiet); font-size: 0.78rem; }
.source-service__empty { margin: 0; padding: 0 1rem 1rem; color: var(--text-quiet); font-size: 0.8rem; }
.source-service__next { padding: 1rem; margin: 0 1rem 1rem; background: var(--accent-soft); border-radius: 0.65rem; font-size: 0.8rem; }
.source-service__next p { color: var(--text-quiet); margin: 0.35rem 0 0.7rem; }
.mcp-personal-access { margin: 0 1rem 1rem; padding: 0.85rem 1rem; border: 1px solid var(--line); border-radius: 0.65rem; background: var(--ground); min-width: 0; }
.mcp-personal-access:empty { display: none; }
.mcp-personal-access__summary { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; }
.mcp-personal-access__summary > p { flex: 1 1 16rem; min-width: 0; overflow-wrap: anywhere; }
.mcp-personal-access .sources__actions { gap: 0.5rem; }
.mcp-personal-access .button { font-size: 0.8rem; white-space: normal; }
.mcp-personal-access .sources__form { margin: 0; padding: 0; border: 0; max-width: 32rem; }
.mcp-personal-access .sources__form input { width: 100%; min-width: 0; box-sizing: border-box; }
.mcp-personal-access .sources__warn { margin: 0 0 0.75rem; }
.source-setup { display: grid; gap: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: 0.85rem; background: var(--surface-raised); min-width: 0; }
.source-setup .sources__form { padding: 0; border: 0; }
.source-steps { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; margin: 0 0 0.25rem; padding: 0 0 1rem; list-style: none; border-bottom: 1px solid var(--line); }
.source-steps li { display: flex; align-items: center; gap: 0.4rem; font-size: 0.75rem; color: var(--text-quiet); }
.source-steps li > span { display: grid; place-items: center; width: 1.5rem; height: 1.5rem; background: var(--ground); border-radius: 50%; }
.source-steps li[aria-current] { color: var(--accent); font-weight: 650; }
.source-steps li[aria-current] > span { background: var(--accent); color: #fff; }
.source-steps li[data-complete='true'] > span { color: var(--teal); }
.source-steps svg { width: 0.9rem; height: 0.9rem; }
.source-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.source-option { display: flex; align-items: center; gap: 0.75rem; padding: 1rem; border: 1px solid var(--line); border-radius: 0.75rem; background: var(--surface-raised); color: var(--text); text-align: left; cursor: pointer; }
.source-option:hover { border-color: var(--accent); background: var(--accent-soft); }
.source-option > span { display: grid; gap: 0.3rem; flex: 1; min-width: 0; }
.source-option strong { font-size: 0.85rem; }
.source-option span span { font-size: 0.75rem; color: var(--text-quiet); }
.source-option > svg { flex-shrink: 0; color: var(--accent); }
.source-selected { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem; background: var(--accent-soft); border-radius: 0.65rem; }
.source-workspace__empty { padding: 2rem 1rem; display: grid; justify-items: center; gap: 0.75rem; text-align: center; }
.source-workspace__empty > span { color: var(--accent); }
.source-workspace__empty p { margin: 0; color: var(--text-quiet); font-size: 0.8rem; max-width: 30rem; }
.sources-workspace .sources__result { padding: 0.85rem; border: 1px solid var(--line); border-radius: 0.65rem; background: var(--surface-raised); }
@media (max-width: 600px) {
  .source-options { grid-template-columns: minmax(0, 1fr); }
  .source-steps { gap: 0.6rem; }
  .source-steps li { flex: 1 1 100%; }
  .source-facts > div { grid-template-columns: minmax(0, 1fr); gap: 0.2rem; }
  .source-import__details { margin-left: 0; }
  .source-import__copy { flex-basis: calc(100% - 3rem); }
  .source-service__head, .source-service__settings, .source-setup { padding: 0.85rem; }
  .source-service__head .button { flex-basis: 100%; justify-content: center; }
  .source-import__head .button { margin-left: auto; }
  .source-service__title { flex-basis: calc(100% - 6.5rem); }
  .source-service__logo:has(img) { flex-basis: 4rem; }
  .mcp-personal-access { margin: 0 0.85rem 0.85rem; padding: 0.85rem; }
  .mcp-personal-access__summary > .sources__actions { flex: 1 1 100%; }
  .mcp-personal-access .sources__actions .button { flex: 1 1 auto; }
}
.source-tool-fields { display: grid; gap: 0.85rem; min-width: 0; }
.source-tool-fields input { max-width: 100%; box-sizing: border-box; }
.sources-workspace details summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 0.2rem; }

/* Personal agent connections */
.agents-page { display: grid; gap: 1.25rem; min-width: 0; }
.agents-page .home-panel > h3 { margin: 0 0 0.75rem; font-size: 1.05rem; }
.agents-page .sources__form { padding: 1rem 0; }
.agents-instructions { padding-left: 1.3rem; color: var(--text-quiet); font-size: 0.85rem; }
.agents-instructions li { margin-bottom: 0.65rem; padding-left: 0.2rem; }
.agents-endpoint, .agents-secret label { display: grid; gap: 0.4rem; font-size: 0.8rem; margin: 1rem 0; }
.agents-page input, .agents-page select { width: 100%; min-width: 0; box-sizing: border-box; }
.agents-secret { padding: 1rem; background: var(--accent-soft); border: 1px solid var(--accent); border-radius: 0.75rem; font-size: 0.8rem; }
.agents-config { margin: 1rem 0; font-size: 0.8rem; }
.agents-config summary { cursor: pointer; color: var(--accent); font-weight: 650; }
.agents-config pre { padding: 0.8rem; border-radius: 0.6rem; background: var(--ground); white-space: pre-wrap; overflow-wrap: anywhere; font-size: 0.72rem; }
.agents-keys { padding: 0; margin: 0; list-style: none; display: grid; gap: 0.5rem; }
.agents-keys li { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem; border: 1px solid var(--line); border-radius: 0.7rem; flex-wrap: wrap; }
.agents-key__copy { flex: 1 1 12rem; min-width: 0; display: grid; gap: 0.15rem; }
.agents-key__copy strong { font-size: 0.85rem; overflow-wrap: anywhere; }
.agents-key__copy span { color: var(--text-quiet); font-size: 0.75rem; }
.agents-page .sources__form { border: 0; }

/* Mobile navigation uses the drawer's full width; module panels follow below. */
@media (max-width: 68rem) {
  .drawer { width: min(22rem, 92vw); flex-direction: column; overflow-y: auto; overscroll-behavior: contain; background: var(--ground); }
  .drawer > .rail { width: 100%; flex: 0 0 auto; min-height: 100%; overflow: visible; }
  .drawer .rail__items { overflow: visible; }
  .drawer > .panel { width: 100%; flex: 0 0 auto; min-height: 18rem; max-height: 65dvh; }
  .rail__item { min-height: 2.875rem; }
}

/* Graph export workspace */
.gexport { container: graph-export / inline-size; display: grid; gap: 1.1rem; min-width: 0; }
.gexport__hero { display: flex; align-items: center; gap: 1.1rem; padding: 1.5rem; border-radius: 18px; background: var(--surface-raised); border: 1px solid var(--line); }
.gexport__hero h2 { margin: .2rem 0 .4rem; font-size: clamp(1.35rem, 2.5vw, 1.9rem); }
.gexport__hero > div { min-width: 0; }
.gexport__hero p { margin: 0; max-width: 65ch; }
.gexport__hero-icon { flex: 0 0 auto; display: grid; place-items: center; width: 3.2rem; height: 3.2rem; border-radius: 15px; color: var(--accent); background: var(--accent-soft); }
.gexport__eyebrow { font-size: .7rem; font-weight: 700; letter-spacing: .12em; }
.gexport .card { min-width: 0; display: grid; align-content: start; gap: 1rem; padding: 1.2rem; }
.gexport h3, .gexport h4 { margin: 0; }
.gexport .form__hint { margin: 0; }
.gexport__section-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; }
.gexport__formats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }
.gexport__format { cursor: pointer; text-align: left; color: inherit; background: transparent; border: 1px solid var(--line, #ccd1d6); border-radius: 12px; padding: 1rem; display: grid; gap: .4rem; min-width: 0; }
.gexport__format strong { font-size: 1.05rem; overflow-wrap: anywhere; }
.gexport__format span { font-size: .8rem; line-height: 1.4; overflow-wrap: anywhere; }
.gexport__format:nth-child(1) { border-top: 4px solid #7970c7; }
.gexport__format:nth-child(2) { border-top: 4px solid #ca944c; }
.gexport__format:nth-child(3) { border-top: 4px solid #408d70; }
.gexport__format:nth-child(4) { border-top: 4px solid #4b8daa; }
.gexport__format.is-selected { background: color-mix(in srgb, #1e8a80 12%, transparent); box-shadow: 0 0 0 2px #1e8a80; }
.gexport__layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; gap: 1.1rem; }
.gexport__settings { display: grid; gap: 1.1rem; min-width: 0; }
.gexport__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); align-items: end; gap: .85rem; }
.gexport__field { display: grid; min-width: 0; gap: .4rem; font-size: .85rem; }
.gexport__field .field { width: 100%; min-width: 0; box-sizing: border-box; }
.gexport__check { display: flex; gap: .6rem; align-items: start; font-size: .85rem; }
.gexport input[type=checkbox] { accent-color: #1e8a80; width: 1rem; height: 1rem; flex-shrink: 0; }
.gexport__choices { border: 0; padding: 0; margin: 0; min-width: 0; }
.gexport__choices legend { font-size: .85rem; font-weight: 600; margin-bottom: .5rem; }
.gexport__chips { display: flex; flex-wrap: wrap; gap: .4rem; max-height: 12rem; overflow: auto; margin-top: .5rem; }
.gexport__chip { display: flex; align-items: center; gap: .4rem; padding: .35rem .55rem; border: 1px solid var(--line, #ccd1d6); border-radius: 8px; font-size: .78rem; cursor: pointer; max-width: 100%; overflow-wrap: anywhere; }
.gexport__chip.is-selected { background: color-mix(in srgb, #1e8a80 15%, transparent); border-color: #1e8a80; }
.gexport__advanced summary { cursor: pointer; font-weight: 600; padding: .4rem 0; }
.gexport__advanced[open] { display: grid; gap: 1rem; }
.gexport__order { padding-left: 1.5rem; font-size: .8rem; }
.gexport__order li { padding: .15rem; }
.gexport__order li span { display: inline-block; min-width: 8rem; }
.gexport__order .button { padding: .15rem .45rem; min-height: 28px; }
.gexport__counts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.gexport__counts > div { display: grid; gap: .3rem; padding: 1rem; border-radius: 12px; background: color-mix(in srgb, #1e8a80 9%, transparent); }
.gexport__counts strong { font-size: 1.8rem; font-variant-numeric: tabular-nums; }
.gexport__counts span { font-size: .8rem; }
.gexport__download { width: 100%; display: flex; justify-content: center; align-items: center; gap: .5rem; }
.gexport__samples { display: grid; gap: 1rem; min-width: 0; }
.gexport__samples > div { min-width: 0; }
.gexport__table-scroll { overflow: auto; max-height: 19rem; max-width: 100%; margin-top: .6rem; border: 1px solid var(--line, #ccd1d6); border-radius: 8px; }
.gexport__table-scroll table { width: max-content; min-width: 100%; font-size: .75rem; }
.gexport__table-scroll td, .gexport__table-scroll th { padding: .55rem .7rem; max-width: 18rem; overflow-wrap: anywhere; }
.gexport__table-scroll th { white-space: nowrap; }
/* Export breakpoints measure the workspace, excluding both navigation rails.
   Browser zoom and embedded panes reduce this width independently of viewport. */
@container graph-export (max-width: 50rem) {
  .gexport__layout { grid-template-columns: minmax(0, 1fr); }
  .gexport__preview { grid-row: 1; }
}
@container graph-export (max-width: 42rem) {
  .gexport__formats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container graph-export (max-width: 30rem) {
  .gexport__hero { padding: 1rem; align-items: flex-start; }
  .gexport__hero-icon { display: none; }
  .gexport__hero h2 { font-size: 1.35rem; overflow-wrap: anywhere; }
  .gexport__fields { grid-template-columns: minmax(0, 1fr); }
  .gexport .card { padding: .9rem; }
  .gexport__section-head > .button { white-space: normal; text-align: left; }
}
@container graph-export (max-width: 20rem) {
  .gexport__formats { grid-template-columns: minmax(0, 1fr); }
}

/* Query export uses the editor's content width, including narrow workspaces. */
.sparql-export { display: grid; gap: .85rem; min-width: 0; }
.sparql-export h3, .sparql-export p { margin: 0; }
.sparql-export__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); align-items: end; gap: .85rem; }
.sparql-export > .button { justify-self: start; white-space: normal; }
.gexport .kg-sparql__field { width: 100%; min-width: 0; box-sizing: border-box; font-family: var(--font-mono, monospace); }
.kg-query-workspace { container: sparql-workspace / inline-size; min-width: 0; }
@container sparql-workspace (max-width: 48rem) {
  .kg-sparql { grid-template-columns: minmax(0, 1fr); }
  .kg-sparql__result { order: 1; }
  .kg-sparql__examples { order: 2; }
}

/* Personal scheduled prompts */
.routines { width: 100%; min-width: 0; }
.routines-dialog { box-sizing: border-box; width: min(52rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); overflow: auto; padding: 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-raised); color: var(--text); }
.routines-dialog::backdrop { background: #10141880; }
.routines-dialog .routines__editor { border: 0; box-shadow: none; margin: 0; padding: 0; }
.chat__actions, .turn__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.turn__actions { justify-content: flex-end; margin: .35rem 0 .75rem; }
.routines__created { color: var(--text-quiet); font-size: .85rem; }
.routines__hint { color: var(--text-quiet); font-size: .875rem; line-height: 1.55; }
.routines__actions { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0; }
.routines__editor, .routines__card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-raised); padding: 1.4rem; margin: 1.25rem 0; box-shadow: var(--shadow-card); }
.routines__editor { border-color: var(--accent); }
.routines__editor h2, .routines__card h2 { font-size: 1.15rem; margin: 0 0 1rem; }
.routines__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: .4rem 1rem; }
.routines .form__row { display: flex; flex-direction: column; gap: .4rem; margin: .85rem 0; }
.routines .field { width: 100%; min-width: 0; }
.routines textarea { resize: vertical; }
.routines__toggle { display: flex; align-items: center; gap: .6rem; margin-top: 1rem; }
.routines__heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .8rem; }
.routines__badge { color: var(--accent); background: var(--accent-soft); border-radius: 2rem; padding: .3rem .7rem; font-size: .8rem; }
.routines__prompt { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 10rem; overflow: auto; line-height: 1.6; }
.routines__history, .routines__confirmation { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.routines__run { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; padding: .85rem 0; border-bottom: 1px solid var(--line); }
.routines__run p { margin: .3rem 0; font-size: .85rem; color: var(--text-quiet); }
.routines__empty { padding: 2rem; background: var(--surface); border-radius: var(--radius); text-align: center; }
.routines__example { white-space: pre-wrap; overflow-wrap: anywhere; padding: 1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: .8rem; }

/* Apps: Fachmodule als Kacheln, darunter die eigenen Prompt-Apps */
.apps__hub { display: grid; gap: 2rem; }
.apps__section-title { margin: 0 0 0.85rem; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-quiet); }
.apps__tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: 0.85rem; }
.apps__tile { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 0.85rem; row-gap: 0.25rem; align-items: center; padding: 1rem 1.1rem; text-align: left; font: inherit; color: var(--text); background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-card); cursor: pointer; transition: border-color var(--duration), transform var(--duration); }
.apps__tile:hover { border-color: var(--accent); background: var(--accent-soft); }
.apps__tile:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.apps__tile-glyph { grid-row: 1 / 3; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 0.7rem; background: var(--accent-soft); color: var(--accent); }
.apps__tile-name { font-weight: 650; font-size: 0.95rem; }
.apps__tile-about { font-size: 0.8rem; color: var(--text-quiet); line-height: 1.4; }

/* Connectors and local extension setup. */
.source-extension, .source-local-setup { display: grid; gap: 1rem; min-width: 0; }
.source-extension__drop { display: grid; justify-items: center; gap: 0.65rem; padding: 1.5rem; text-align: center; border: 2px dashed var(--line); border-radius: 0.85rem; background: var(--ground); cursor: pointer; }
.source-extension__drop:hover, .source-extension__drop:focus-within { border-color: var(--accent); background: var(--accent-soft); }
.source-extension__drop > svg { color: var(--accent); }
.source-extension__drop input { max-width: 100%; }
.source-advanced { margin: 0.5rem 0; padding: 0.85rem; border: 1px solid var(--line); border-radius: 0.65rem; }
.source-advanced > summary { cursor: pointer; color: var(--text-quiet); font-size: 0.8rem; }
.source-advanced[open] > summary { margin-bottom: 1rem; }
.source-advanced > .button { margin-bottom: 1rem; }
.source-env-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) auto; gap: 0.5rem; align-items: center; }
.source-env-row input { width: 100%; min-width: 0; }
.source-group-title { margin: 0.5rem 0 0; color: var(--text-quiet); }
.source-local-setup > .button { justify-self: start; }
.source-extension label, .source-local-setup label { display: grid; gap: 0.45rem; }
.source-extension input[type='checkbox'] { justify-self: start; width: auto; }
@media (max-width: 480px) {
  .source-env-row { grid-template-columns: minmax(0, 1fr) auto; }
  .source-env-row input:first-child { grid-column: 1 / -1; }
}
.source-extension__drop[data-loaded='true'] { padding: 0.85rem; }
.source-extension__file { position: absolute; width: 1px; height: 1px; padding: 0; opacity: 0; overflow: hidden; }
.source-extension__drop strong { overflow-wrap: anywhere; max-width: 100%; }

/* Chat speech controls follow the available speech models. */
.chat-speech { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; min-width: 0; }
.chat-speech--input { padding: .35rem .75rem; }
.chat-speech--output { margin-top: .75rem; }
.chat-speech__model { width: auto; max-width: min(100%, 20rem); }
.chat-speech audio { max-width: 100%; height: 2.5rem; }
.chat-speech [aria-pressed="true"] { color: var(--danger, #b42318); }
.chat-speech .notice { margin: 0; }

/* Focused chat: quiet navigation, readable messages and progressive disclosure. */
.rail__disclosure > summary { cursor: pointer; padding-block: .6rem; }
.rail__disclosure > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: .3rem; }
.shell[data-view='chat'] .conversation { position: relative; }
.shell[data-view='chat'] .conversation__turns { display: none; }
@media (hover: hover) and (min-width: 1001px) {
  .shell[data-view='chat'] .conversation__actions { position: absolute; right: .25rem; background: var(--surface-raised); border-radius: .4rem; }
  .shell[data-view='chat'] .conversation[aria-current='true'] .conversation__actions { background: var(--accent-soft); }
}
.shell[data-view='chat'] .main__middle { padding-top: 1.5rem; }
.shell[data-view='chat'] .main__footer { padding: .75rem 1.5rem 1.25rem; }
.shell[data-view='chat'] .history { gap: 2rem; }
.shell[data-view='chat'] .turn { gap: 1.25rem; }
.shell[data-view='chat'] .turn__question { max-width: 85%; border: 0; border-radius: 1rem 1rem .3rem 1rem; padding: .8rem 1rem; }
.shell[data-view='chat'] .turn__answer { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.shell[data-view='chat'] .agent-activity { background: transparent; border: 0; margin-bottom: .75rem; }
.shell[data-view='chat'] .agent-activity__summary { padding: .5rem 0; color: var(--text-quiet); gap: .5rem; }
.shell[data-view='chat'] .agent-activity__summary strong { font-weight: 500; }
.shell[data-view='chat'] .agent-activity__summary:hover { background: transparent; color: var(--accent); }
.shell[data-view='chat'] .agent-activity__state { margin-left: .4rem; }
.shell[data-view='chat'] .agent-activity__heading { gap: .5rem; }
.turn__details { margin-top: .75rem; font-size: .75rem; color: var(--text-quiet); }
.turn__details > summary { cursor: pointer; width: fit-content; padding: .25rem 0; }
.turn__details > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.chat-menu { position: relative; }
.chat-menu > summary { list-style: none; cursor: pointer; padding: .5rem .75rem; border-radius: .5rem; color: var(--text-quiet); }
.chat-menu > summary::-webkit-details-marker { display: none; }
.chat-menu > summary:hover, .chat-menu[open] > summary { background: var(--surface); }
.chat-menu > summary:focus-visible, .composer__more > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.chat-menu__items { position: absolute; top: calc(100% + .4rem); right: 0; z-index: 25; display: grid; min-width: 14rem; padding: .4rem; background: var(--surface-raised); border: 1px solid var(--line); border-radius: .75rem; box-shadow: var(--shadow-card); }
.chat-menu__items > .button { text-align: left; justify-content: flex-start; font-size: .8rem; }
.shell[data-view='chat'] .composer--enhanced { gap: .25rem; padding: .65rem .8rem; box-shadow: 0 2px 12px rgb(16 20 24 / .04); }
.shell[data-view='chat'] .composer__field { order: -1; }
.shell[data-view='chat'] .composer__toolbar { gap: .35rem; }
.shell[data-view='chat'] .chat-model-picker > summary { border-color: transparent; padding: .35rem .4rem; }
.shell[data-view='chat'] .chat-model-picker__current strong { max-width: min(19rem, 32vw); font-size: .75rem; font-weight: 500; }
.shell[data-view='chat'] .chat-attachments__toolbar .button { min-height: 2rem; font-size: .75rem; }
.shell[data-view='chat'] .chat-attachments__settings-toggle { margin-left: 0; }
.shell[data-view='chat'] .composer__status:not([hidden]) { padding-top: .25rem; }
.composer__more > summary[data-active='true'] { color: var(--accent); background: var(--accent-soft); border-radius: .5rem; }
.composer__more-menu { display: grid; gap: .4rem; width: min(20rem, calc(100vw - 3rem)); max-height: 45vh; overflow-y: auto; }
.composer__more-menu .composer__research { padding: .65rem; width: 100%; white-space: normal; }
.composer__sources { padding: .25rem .5rem; border-top: 1px solid var(--line); }
@media (max-width: 768px) {
  .shell[data-view='chat'] .main__header { padding-inline: 1rem; }
  .shell[data-view='chat'] .main__footer { padding: .5rem .75rem .75rem; }
  .shell[data-view='chat'] .main__middle { padding-top: .75rem; }
  .shell[data-view='chat'] .chat-model-picker__current strong { max-width: 8rem; }
  .shell[data-view='chat'] .agent-activity__summary { flex-wrap: wrap; }
}
.shell[data-view='chat'] .answer__text { font-family: var(--font-ui); font-size: .9375rem; line-height: 1.75; }
@media (min-width: 1001px) {
  .application:has(.shell) .kintari-launcher:not([style]) { left: 1rem; right: auto; bottom: 4rem; font-size: .75rem; box-shadow: none; border: 1px solid var(--line); }
}
@media (max-width: 1000px) {
  .application:has(.shell[data-view='chat']) .kintari-launcher:not([style]) { top: calc(var(--topbar-height) + .85rem); right: 4rem; bottom: auto; width: 2.25rem; height: 2.25rem; min-height: 0; padding: .2rem; gap: 0; font-size: 0; box-shadow: none; }
  .application:has(.shell[data-view='chat']) .kintari-launcher:not([style]) .kintari-avatar { width: 1.85rem; height: 1.85rem; }
  .shell[data-view='chat'] .main__tools { margin-left: 3rem; }
}
@media (max-width: 600px) {
  .shell[data-view='chat'] .composer__more { position: static; }
  .shell[data-view='chat'] .composer__more-menu { right: .5rem; width: min(20rem, calc(100vw - 3rem)); }
}

/* Decorative artwork gives way to content across the shared light workspace. */
.workspace-intro__art, .home-welcome__mark { display: none; }
.card, .crm-panel, .crm-form, .crm-detail, .kg-form, .kg-community,
.home-metric, .home-panel, .apps__tile, .routines__editor, .routines__card { box-shadow: none; }
.empty__visual { width: 3.5rem; height: 3.5rem; border-radius: .9rem; box-shadow: none; }
.sources__provider.button { border-top-width: 1px; box-shadow: none; }
.sources__provider.button:hover, .sources__provider.button:focus-visible { box-shadow: none; }
@media (min-width: 68.001rem) {
  .application:has(.kintari-launcher:not([style])) .rail__items { margin-bottom: 3.5rem; }
}
@media (max-width: 68rem) {
  .application:has(.shell[data-sidebar='open']) .kintari-launcher { visibility: hidden; }
}

/* Compact workspaces: spend height on records and actions instead of padding. */
:root { --topbar-height: 3.75rem; --header-height: 3.25rem; }
.shell[data-view='chat'] { --header-height: 4rem; }
.shell:not([data-view='chat']) .main__middle { padding: .5rem 1.5rem 1.25rem; }
.shell:not([data-view='chat']) .main__footer { padding: .5rem 1.5rem .75rem; }
.shell:not([data-view='chat']) .main .button { min-height: 2.25rem; padding-block: .4rem; }
.shell:not([data-view='chat']) .main input:where(:not([type='checkbox']):not([type='radio']):not([type='range']):not([type='file'])),
.shell:not([data-view='chat']) .main select { padding: .5rem .65rem; }
.card, .crm-panel, .crm-form, .crm-detail, .crm-io, .kg-form, .kg-community { padding: 1rem; }
.form, .settings, .crm, .crm-section, .audit { gap: .7rem; }
.settings__row { padding: .65rem 0; }
.block { margin-bottom: 1rem; }
.matrix thead th, .crm-table thead th, .kg-table thead th { padding-block: .55rem; }
.audit__filters { padding: .75rem; gap: .6rem; }
.audit__table th, .audit__table td { padding: .55rem .7rem; }
.model-catalog__layout, .model-catalog__fields { gap: .85rem; }
.model-catalog__card, .model-catalog__default { padding: .8rem; margin-block: .65rem; }
.model-catalog__card .form__row, .model-catalog__fieldset > .form__row { margin-block: .5rem; }
.model-catalog__model-summary, .model-catalog__savebar { padding: .65rem .8rem; }
.model-catalog__provider { padding: .65rem .75rem; }
.model-catalog__savebar { margin-top: .65rem; }
.projects, .projects__list { gap: .75rem; }
.workspace-intro { padding: 1rem 1.15rem; gap: .75rem; }
.workspace-intro h2 { font-size: 1.25rem; margin: .2rem 0 .3rem; }
.project { padding: .9rem 1rem; gap: .65rem; }
.project__symbol { width: 2.5rem; height: 2.5rem; border-radius: .65rem; }
.project__name { font-size: 1rem; }
.project__actions { padding-top: .5rem; }
.project__actions > .button { min-height: 2.25rem; }
.project > .sources, .sources__form { padding: .85rem; gap: .65rem; }
.sources__provider.button { min-height: 7rem; padding: .8rem; }
.sources__provider-logo { height: 2rem; margin-bottom: .15rem; padding: .25rem; }
.apps__hub { gap: 1.25rem; }
.apps__tiles { gap: .6rem; }
.apps__section-title { margin-bottom: .6rem; }
.apps__tile { padding: .75rem .85rem; column-gap: .65rem; }
.apps__tile-glyph { width: 2.1rem; height: 2.1rem; border-radius: .55rem; }
.apps__tile-name { font-size: .875rem; }
.routines__editor, .routines__card { padding: 1rem; margin-block: .75rem; }
.media-studio__form, .media-studio__job { padding: 1rem; margin-block: .75rem; }
.media-studio .form__row { gap: .35rem; margin-bottom: .75rem; }
.media-studio__selectors, .playground__grid { gap: .85rem; }
.crm-tiles, .crm-columns-2 { gap: .7rem; }
.crm-tile { padding: .85rem; }
.crm-tile__icon { float: right; width: 1.75rem; height: 1.75rem; margin: 0 0 .4rem .5rem; }
.crm-tile__value { font-size: 1.5rem; }
.gexport__hero { padding: 1rem; gap: .75rem; }
.gexport__hero h2 { font-size: 1.25rem; }
.gexport .card, .gexport__format { padding: .85rem; }

/* Dashboard overview fits above the fold; detailed usage remains available. */
.home { gap: .75rem; }
.home-welcome { padding: .25rem 0 .5rem; border: 0; border-radius: 0; background: transparent; }
.home-welcome > div:first-child { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .3rem 1rem; width: 100%; }
.home-welcome__eyebrow { display: none; }
.home-welcome h2 { font-size: 1.25rem; margin: 0; }
.home-welcome p { grid-column: 1; font-size: .82rem; }
.home-welcome__project { grid-column: 2; grid-row: 1 / 3; margin: 0; }
.home-metrics { gap: .65rem; }
.home-metric { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .15rem .7rem; padding: .85rem 1rem; border-radius: .75rem; }
.home-metric__icon { grid-row: 1 / 4; align-self: center; width: 2rem; height: 2rem; margin: 0; }
.home-metric__value { font-size: 1.3rem; }
.home-metric__label, .home-metric__note { grid-column: 2; margin: 0; }
.home-shortcuts, .home-columns { gap: .65rem; }
.home-shortcut { padding: .7rem .8rem; }
.home-panel { padding: .9rem 1rem; border-radius: .75rem; }
.home-panel__head { margin-bottom: .6rem; }
.home-project { padding: .6rem .7rem; }
.home-project__icon { width: 1.8rem; height: 1.8rem; }
.home-knowledge__row { padding-block: .4rem; }
.home-status { padding: .6rem .7rem; margin-top: .6rem; }
.home-connect { padding: 1rem; gap: 1rem; }
.home-connect h3 { font-size: 1rem; margin: .25rem 0; }
.home-connect p { margin-bottom: .65rem; }
.home-connect__logos { gap: .4rem; }
.home-connect__logo { height: 2.6rem; padding: .5rem; }
.usage-dashboard { margin-bottom: 0; }
.usage-dashboard .home-panel__head { gap: .4rem; }
.usage-dashboard .home-panel__head .usage-dashboard__controls > label { flex-direction: row; align-items: center; gap: .5rem; }
.usage-dashboard .home-panel__head .usage-dashboard__controls .field,
.usage-dashboard .home-panel__head .usage-dashboard__controls > .button { height: 2.25rem; }
.usage-dashboard__metrics { gap: .6rem; margin: .5rem 0 .65rem; }
.usage-dashboard__metrics > div { padding: .6rem .75rem; gap: .15rem; font-size: .8rem; }
.usage-dashboard__metrics strong { font-size: 1.1rem; }
.usage-dashboard__details { font-size: .8rem; }
.usage-dashboard__details > summary { cursor: pointer; color: var(--text-quiet); padding-block: .3rem; width: fit-content; }
.usage-dashboard__details > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.usage-dashboard__details > .form__hint { margin-block: .4rem; }
.usage-dashboard__requests { margin-block: .65rem; }
.usage-dashboard__requests > li { padding-block: .65rem; }
@media (max-width: 768px) {
  .shell:not([data-view='chat']) .main__middle { padding: .4rem .75rem 1rem; }
  .shell:not([data-view='chat']) .main__footer { padding: .5rem .75rem; }
  .home-welcome > div:first-child { grid-template-columns: minmax(0, 1fr); }
  .home-welcome__project { grid-column: 1; grid-row: auto; justify-self: start; margin-top: .2rem; }
  .home-metric { padding: .7rem; grid-template-columns: minmax(0, 1fr); }
  .home-metric__icon { display: none; }
  .home-metric__label, .home-metric__note { grid-column: 1; }
  .home-metric__value { font-size: 1.1rem; }
  .home-panel { padding: .8rem; }
  .usage-dashboard .home-panel__head .usage-dashboard__controls > label { flex-wrap: wrap; }
}
@media (pointer: coarse) {
  .shell:not([data-view='chat']) .main .button,
  .shell:not([data-view='chat']) .main select { min-height: 2.75rem; }
  .usage-dashboard__details > summary { min-height: 2.75rem; display: flex; align-items: center; gap: .4rem; }
  .usage-dashboard__details > summary::before { content: '▸'; }
  .usage-dashboard__details[open] > summary::before { content: '▾'; }
}
.skills-page, .skills-grid, .skills-list { gap: .7rem; }
.skill-card { padding: .8rem; gap: .6rem; }
.skills-empty { padding: 1.25rem 1rem; gap: .5rem; }
@media (max-width: 480px) {
  .home-metric { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .home-metric__value { grid-column: 2; grid-row: 1; }
  .home-metric__label { grid-column: 1; grid-row: 1; }
  .home-metric__note { grid-column: 1 / -1; }
}
.solo-setup__settings { padding: .65rem .8rem; margin-block: 0; }
.solo-setup__settings > .button:only-child { margin-bottom: 0; }

/* Dashboard: a compact overview with two complementary, data-backed charts. */
.home--modern { gap: .9rem; padding-bottom: .5rem; }
.home--modern .home-welcome { padding: .25rem 0 .6rem; }
.home--modern .home-welcome__eyebrow { display: block; grid-column: 1; color: var(--accent); font-size: .6rem; letter-spacing: .14em; }
.home--modern .home-welcome h2 { font-size: clamp(1.2rem, 2vw, 1.6rem); grid-column: 1; letter-spacing: -.045em; }
.home--modern .home-welcome p { font-size: .8rem; }
.home--modern .home-welcome__project { grid-row: 1 / 4; background: var(--surface-raised); border: 1px solid var(--line); padding: .45rem .7rem; }
.home--modern .home-metrics { gap: .8rem; }
.home--modern .home-metric { padding: .8rem 1rem; border-color: #e4e8e5; background: linear-gradient(120deg, #fff, #fcfdfb); box-shadow: 0 2px 8px #10141803; }
.home--modern .home-metric__value { font-size: 1.4rem; font-weight: 650; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.home--modern .home-metric__icon { width: 2.25rem; height: 2.25rem; background: #edf5f3; }
.home--modern .home-metric[data-tone='blue'] .home-metric__icon { color: #7974c9; background: #f1eff9; }
.home--modern .home-shortcuts { gap: .65rem; }
.home--modern .home-shortcut { padding: .7rem .85rem; transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.home--modern .home-shortcut:hover { transform: translateY(-2px); box-shadow: 0 5px 12px #10141808; }
.home--modern .home-shortcut:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.home--modern .home-shortcut[data-view='chat'] { background: var(--accent); color: #fff; border-color: var(--accent); }
.home--modern .home-shortcut[data-view='chat'] .home-shortcut__icon,
.home--modern .home-shortcut[data-view='chat'] > .icon { color: #fff; }
.home--modern .home-shortcut[data-view='chat'] .home-shortcut__copy > span { color: #e1f3ef; }
.home-insights { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(17rem, 1fr); gap: .9rem; align-items: start; }
.home-insights[data-activity='false'] { grid-template-columns: minmax(0, 1fr); }
.home-bottom { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(17rem, 1fr); gap: .9rem; align-items: start; }
.home--modern .home-panel { padding: 1rem 1.1rem; border-color: #e4e8e5; border-radius: .9rem; }
.home--modern .home-panel__head h3 { font-size: .9rem; font-weight: 650; }
.home--modern .home-panel__head { margin-bottom: .7rem; }
.home--modern .home-project { border-color: transparent; border-radius: .6rem; }
.home--modern .home-project[aria-current='true'] { background: #eef6f3; }
.home--modern .home-project:hover { border-color: var(--accent); }
.home--modern .home-connect { display: grid; padding: 1rem 1.1rem; gap: .65rem; background: #f3f7f4; border-color: #e0e9e3; border-radius: .9rem; }
.home--modern .home-connect__eyebrow { font-size: .6rem; }
.home--modern .home-connect p { font-size: .75rem; }
.home--modern .home-connect h3 { font-size: .95rem; }
.home--modern .home-connect .button { background: var(--surface-raised); border-color: var(--line); color: var(--text); font-size: .75rem; }
.home--modern .home-connect__logos { display: flex; flex-wrap: wrap; gap: .35rem; }
.home--modern .home-connect__logo { height: 1.8rem; flex: 0 1 auto; padding: .3rem .45rem; border: 0; background: transparent; }
.home--modern .home-connect__logo img { max-height: .9rem; max-width: 4rem; }
.home--modern .home-connect__logo span { font-size: .7rem; }
.home--modern .usage-dashboard__subtitle { margin: .15rem 0 0; font-size: .7rem; color: var(--text-quiet); }
.home--modern .usage-dashboard__controls .form__label { font-size: .72rem; }
.home--modern .usage-dashboard__controls select { font-size: .72rem; max-width: 11rem; }
.home--modern .usage-dashboard__controls .button { font-size: .72rem; }
.home--modern .usage-dashboard__metrics { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr); gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: .6rem 0 .4rem; padding-block: .6rem; }
.home--modern .usage-dashboard__metrics > div { padding: 0 .6rem; background: transparent; border: 0; border-radius: 0; font-size: .72rem; }
.home--modern .usage-dashboard__metrics > div:first-child { padding-left: 0; }
.home--modern .usage-dashboard__metrics > div + div { border-left: 1px solid var(--line); }
.home--modern .usage-dashboard__metrics strong { font-size: 1.05rem; line-height: 1.4; }
.home--modern .usage-dashboard__metrics small { font-size: .65rem; }
.home--modern .usage-dashboard__metrics > div:last-child { grid-column: auto; }
.home--modern .usage-dashboard__details > summary { font-size: .7rem; }
.activity-charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: 1rem; }
.activity-chart { margin: 0; min-width: 0; }
.activity-chart__heading { display: flex; justify-content: space-between; gap: .5rem; font-size: .7rem; font-weight: 550; }
.activity-chart__heading > span:last-child { color: var(--text-quiet); font-weight: 400; }
.activity-chart__readout { min-height: 1.5rem; padding-top: .2rem; color: var(--text-quiet); font-size: .65rem; overflow-wrap: anywhere; }
.activity-chart__plot { display: flex; gap: .6rem; height: 7.5rem; margin-top: .25rem; }
.activity-chart__scale { display: flex; flex-direction: column; justify-content: space-between; flex: none; min-width: 1.5rem; color: var(--text-quiet); font-size: .6rem; font-variant-numeric: tabular-nums; }
.activity-chart__bars { display: flex; align-items: stretch; gap: clamp(2px, .35vw, 6px); min-width: 0; flex: 1; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to top, transparent 0, transparent calc(50% - 1px), #e9edeb 50%); }
.activity-chart__bar { display: flex; align-items: flex-end; justify-content: center; flex: 1; min-width: 0; padding: 0; border: 0; background: transparent; cursor: pointer; border-radius: .25rem .25rem 0 0; }
.activity-chart__bar:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.activity-chart__fill { width: 100%; max-width: 2rem; border-radius: .2rem .2rem 0 0; background: #88c2b6; transform-origin: bottom; transition: background 140ms ease; animation: dashboard-bar-in 500ms ease-out both; }
.activity-chart__bar:hover .activity-chart__fill, .activity-chart__bar[data-active='true'] .activity-chart__fill { background: var(--accent); }
.activity-chart__axis { display: flex; justify-content: space-between; padding: .35rem 0 0 2rem; color: var(--text-quiet); font-size: .6rem; }
.activity-chart__scope { font-size: .65rem; color: var(--text-quiet); margin: .3rem 0 0; }
.activity-chart__empty { display: grid; place-content: center; min-height: 9.75rem; padding: 1rem; text-align: center; font-size: .8rem; color: var(--text-quiet); border-bottom: 1px dashed var(--line); }
.knowledge-chart { display: grid; gap: .65rem; padding-top: .25rem; }
.knowledge-chart__ring { position: relative; width: 9rem; margin: 0 auto; }
.knowledge-chart__ring svg { display: block; width: 100%; height: auto; }
.knowledge-chart__segment { transition: opacity 180ms ease, stroke-width 180ms ease; }
.knowledge-chart__total { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.knowledge-chart__total strong { max-width: 75%; font-size: 1.25rem; letter-spacing: -.04em; overflow-wrap: anywhere; text-align: center; }
.knowledge-chart__total > span { font-size: .65rem; color: var(--text-quiet); }
.knowledge-chart__legend { list-style: none; margin: 0; padding: 0; display: grid; gap: .15rem; }
.knowledge-chart__legend button { display: grid; grid-template-columns: .5rem minmax(0, 1fr) auto 3rem; align-items: center; gap: .5rem; width: 100%; padding: .25rem .35rem; border: 0; background: transparent; border-radius: .4rem; color: var(--text); font: inherit; font-size: .75rem; text-align: left; cursor: pointer; }
.knowledge-chart__legend button:hover, .knowledge-chart__legend button[aria-pressed='true'] { background: var(--surface); }
.knowledge-chart__legend button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.knowledge-chart__legend small { color: var(--text-quiet); text-align: right; font-variant-numeric: tabular-nums; }
.knowledge-chart__dot { width: .45rem; height: .45rem; border-radius: 50%; }
.knowledge-chart__empty { display: grid; justify-items: center; gap: .5rem; padding: 1.5rem 0; color: var(--text-quiet); font-size: .8rem; text-align: center; }
.knowledge-chart__empty-ring { display: grid; place-content: center; width: 6rem; height: 6rem; border: .5rem solid var(--surface); border-radius: 50%; font-size: 1.4rem; }
.home--modern .home-status { padding: .6rem .7rem; margin-top: .75rem; font-size: .75rem; }
.home--modern .home-status p { font-size: .65rem; line-height: 1.5; }
.home--modern > section, .home--modern > div { animation: dashboard-reveal 350ms ease-out both; }
.home--modern > :nth-child(2) { animation-delay: 40ms; }
.home--modern > :nth-child(3) { animation-delay: 80ms; }
.home--modern > :nth-child(4) { animation-delay: 120ms; }
.home--modern > :nth-child(5) { animation-delay: 160ms; }
@keyframes dashboard-reveal { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes dashboard-bar-in { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@media (max-width: 1200px) {
  .home-insights, .home-bottom { grid-template-columns: minmax(0, 1.4fr) minmax(16rem, 1fr); }
  .home--modern .usage-dashboard .home-panel__head { align-items: flex-start; }
}
@media (max-width: 900px) {
  .home-insights, .home-bottom { grid-template-columns: minmax(0, 1fr); }
  .knowledge-chart { grid-template-columns: 9rem minmax(0, 1fr); align-items: center; }
}
@media (max-width: 768px) {
  .home--modern { gap: .75rem; }
  .home--modern .home-welcome__project { grid-row: auto; }
  .home--modern .home-panel { padding: .85rem; }
  .home--modern .home-metric__value { font-size: 1.1rem; }
  .home--modern .home-shortcut:hover { transform: none; }
  .home--modern .usage-dashboard .home-panel__head { flex-direction: row; }
}
@media (max-width: 420px) {
  .home--modern .home-shortcut { min-height: 3.5rem; }
  .home--modern .home-shortcut__copy > span { display: none; }
  .home--modern .usage-dashboard__controls { width: 100%; justify-content: space-between; }
  .knowledge-chart { grid-template-columns: 7rem minmax(0, 1fr); gap: .5rem; }
  .knowledge-chart__ring { width: 7rem; }
  .knowledge-chart__legend button { grid-template-columns: .4rem minmax(0, 1fr) auto; gap: .3rem; }
  .knowledge-chart__legend small { grid-column: 2 / -1; text-align: left; }
  .activity-chart__readout { min-height: 2.2rem; }
}
@media (prefers-reduced-motion: reduce) {
  .home--modern > section, .home--modern > div, .activity-chart__fill { animation: none; }
  .home--modern .home-shortcut, .knowledge-chart__segment { transition: none; }
  .home--modern .home-shortcut:hover { transform: none; }
}

/* Shared project memory and human question cards. */
.memory-toolbar,.memory-condition,.memory-entry__head {display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.memory-toolbar {margin:20px 0;}
.memory-toolbar .field {width:auto;min-width:180px;}
.memory-list {display:grid;gap:16px;}
.memory-entry__head {justify-content:space-between;}
.memory-entry__text {white-space:pre-wrap;}
.memory-editor {margin:20px 0;}
.question-card__field {border:0;padding:12px 0;margin:0;min-width:0;}
.question-card__field legend {font-weight:600;}
.question-card__field .field {width:100%;}
.question-card__option {display:flex;gap:10px;align-items:center;padding:6px 0;}
.question-card__answers dt {font-weight:600;}
.question-card__answers dd {margin:4px 0 14px;}

/* Recurring actions use the same target size and visible keyboard focus. */
.ui-action.button--icon { flex: 0 0 auto; width: 2.75rem; min-width: 2.75rem; height: 2.75rem; padding: .65rem; }
.ui-action .icon { width: 1.125rem; height: 1.125rem; }
.ui-action[data-ui-action='trash']:hover, .ui-action[data-ui-action='trash']:focus-visible { color: var(--warning); }
button:focus-visible, a:focus-visible, summary:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 3px;
}
.main__title:focus { outline: none; }
.rail__tools { flex-wrap: wrap; }
.command-dialog { box-sizing: border-box; width: min(40rem, calc(100vw - 2rem)); max-height: calc(100dvh - 3rem); margin: max(1.5rem, 10dvh) auto auto; padding: 1rem; color: var(--text); background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 18px 60px #10141830; overflow: auto; }
.command-dialog::backdrop { background: #10141865; }
.command-dialog__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.command-dialog__head h2 { margin: 0; font-size: 1.05rem; }
.command-dialog__search { width: 100%; box-sizing: border-box; }
.command-results { max-height: 48dvh; overflow-y: auto; margin-top: .75rem; padding: .25rem; }
.command-result { display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; min-height: 2.75rem; padding: .65rem .75rem; border: 0; border-radius: .5rem; background: transparent; color: var(--text); text-align: left; cursor: pointer; font: inherit; font-size: .875rem; }
.command-result span { min-width: 0; overflow-wrap: anywhere; }
.command-result small { color: var(--text-quiet); font-size: .7rem; flex: 0 0 auto; max-width: 40%; }
.command-result:hover { background: var(--surface); }
.command-result[aria-selected='true'] { background: var(--accent-soft); color: var(--accent); }
.command-dialog__hint, .command-dialog__empty, .command-help p { color: var(--text-quiet); font-size: .8rem; line-height: 1.6; }
.command-dialog__hint { margin: .75rem 0 0; }
.command-help dl { margin: 0; }
.command-help dl > div { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .55rem 0; border-bottom: 1px solid var(--line); font-size: .85rem; }
.command-help dd { margin: 0; flex: 0 0 auto; }
.command-help kbd { font: inherit; font-size: .75rem; background: var(--surface); border: 1px solid var(--line); border-radius: .3rem; padding: .2rem .4rem; }
@media (max-width: 600px) { .command-dialog { margin-top: 1rem; } .command-result { flex-wrap: wrap; gap: .25rem; } .command-result small { max-width: 100%; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: .5rem; left: .5rem; transform: translateY(-200%); background: var(--surface-raised); color: var(--accent); padding: .75rem 1rem; border: 1px solid var(--accent); border-radius: .5rem; }
.skip-link:focus { transform: none; }
.main:focus { outline: none; }