.brain-page { --brain-border: oklch(89% .018 260); }
.brain-layout { display: grid; grid-template-columns: minmax(17rem, .8fr) minmax(0, 1.6fr); gap: 2.5rem; margin-top: 2rem; }
.brain-layout > section { min-width: 0; }
.brain-page h2 { font-size: 1.35rem; margin: 1.2rem 0 .7rem; }
.brain-page h3 { font-size: 1rem; }
.brain-help, .brain-page small { color: var(--slate-700); font-size: .82rem; line-height: 1.6; max-width: 72ch; }
.brain-notice { padding: 1rem; background: var(--paper); border: 1px solid var(--brain-border); margin-block: 1rem; }
.brain-summary { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: -.65rem; color: var(--slate-700); font-size: .68rem; }
.brain-summary span { display: inline-flex; align-items: baseline; gap: .35rem; }
.brain-summary strong { color: var(--navy); font-size: .9rem; }
.brain-form { display: grid; gap: .6rem; margin-block: 1rem; }
.brain-form label, .brain-search label { font-size: .85rem; font-weight: 600; }
.brain-form input:not([type=checkbox]), .brain-form select, .brain-form textarea, .brain-search input, .brain-search select { width: 100%; min-height: 2.8rem; padding: .65rem; color: var(--ink); background: var(--paper); border: 1px solid var(--brain-border); border-radius: .45rem; font: inherit; }
.brain-form textarea { resize: vertical; }
.brain-form :focus-visible, .brain-search :focus-visible, .brain-disclosure summary:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.brain-form .brain-checkbox { display: flex; align-items: flex-start; gap: .6rem; margin-block: .7rem; }
.brain-checkbox input { width: 1.2rem; height: 1.2rem; flex: 0 0 auto; }
.brain-suggestions, .brain-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-block: 1rem; }
.brain-suggestions a { font-size: .85rem; text-decoration: underline; text-underline-offset: .2em; padding-block: .4rem; }
.brain-disclosure { padding: 1rem 0; border-block: 1px solid var(--brain-border); margin-block: 1rem; }
.brain-disclosure summary { cursor: pointer; min-height: 2rem; font-weight: 600; }
.brain-sources, .brain-tasks { list-style: none; padding: 0; }
.brain-sources li, .brain-tasks li { display: grid; gap: .45rem; border-bottom: 1px solid var(--brain-border); padding-block: 1.3rem; overflow-wrap: anywhere; }
.brain-sources li.is-selected { padding-inline: .8rem; border-radius: .55rem; background: var(--blue-100); }
.brain-search { display: grid; grid-template-columns: 1fr auto; gap: .6rem; margin-block: 1rem; }
.brain-search label { grid-column: 1 / -1; }
.brain-search input { grid-column: 1 / -1; }
.brain-document { border-bottom: 1px solid var(--brain-border); padding-block: 1.4rem; overflow-wrap: anywhere; }
.brain-document a { color: var(--blue-700); text-decoration: underline; text-underline-offset: .2em; }
.brain-empty-diagnostic { margin-top: 1rem; padding: 1rem; border: 1px solid var(--brain-border); border-left: .2rem solid var(--blue); background: var(--paper); }
.brain-empty-diagnostic strong { font-size: .88rem; }
.brain-empty-diagnostic p { margin-top: .35rem; color: var(--slate-700); font-size: .82rem; line-height: 1.55; }
.agent-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 1rem 0 0; padding: 0; border: 1px solid var(--brain-border); background: var(--paper); list-style: none; }
.agent-flow li { position: relative; display: grid; gap: .25rem; min-height: 5.5rem; padding: 1rem; }
.agent-flow li + li { border-left: 1px solid var(--brain-border); }
.agent-flow li:not(:last-child)::after { content: "→"; position: absolute; top: 50%; right: -.45rem; z-index: 1; color: var(--blue); background: var(--paper); transform: translateY(-50%); }
.agent-flow span { color: var(--blue); font-size: .6rem; }
.agent-flow strong { font-size: .85rem; }
.agent-flow small { font-size: .7rem; line-height: 1.4; }
.brain-page pre { white-space: pre-wrap; overflow-wrap: anywhere; font-family: inherit; font-size: .88rem; line-height: 1.7; margin-block: 1rem; max-width: 75ch; }
.brain-page button:disabled { opacity: .5; cursor: not-allowed; }
.admin-tabs a[aria-current=page] { color: var(--blue-700); }
@media (max-width: 850px) {
    .brain-layout { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
    .agent-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .agent-flow li:nth-child(3) { border-left: 0; border-top: 1px solid var(--brain-border); }
    .agent-flow li:nth-child(4) { border-top: 1px solid var(--brain-border); }
    .agent-flow li:nth-child(2)::after { display: none; }
}
