/* Colours that are not MudBlazor's: light first, then dark (set by the Light/Dark control on <html>). */
:root { --gawie-focus: #272968; --gawie-wordmark: #272968; --gawie-wordmark-accent: #9a004a; --gawie-question: #f6eef2;
        --gawie-add-bg: #e3f4e8; --gawie-add-fg: #14532d; --gawie-del-bg: #fbe4e4; --gawie-del-fg: #7f1d1d;
        --gawie-toggle-bg: #f2f2f2; --gawie-toggle-on: #ffffff; --gawie-toggle-fg: #1a1a1a;
        --gawie-ph-bg: #fff3b0; --gawie-ph-fg: #5c4400; --gawie-verify-bg: #ffd9c2; --gawie-verify-fg: #7a2400; --gawie-paper: #ffffff; --gawie-line: #e3e1de; }
:root[data-theme="dark"] { --gawie-focus: #9fb4d6; --gawie-wordmark: #ebe9e6; --gawie-wordmark-accent: #e58aa8; --gawie-question: #2e2a2c;
        --gawie-add-bg: #1f3a2c; --gawie-add-fg: #b9e7c9; --gawie-del-bg: #43262a; --gawie-del-fg: #f3c1c1;
        --gawie-toggle-bg: #2c2c2f; --gawie-toggle-on: #3d3d41; --gawie-toggle-fg: #ebe9e6;
        --gawie-ph-bg: #4a3f12; --gawie-ph-fg: #ffe9a3; --gawie-verify-bg: #4f2a1a; --gawie-verify-fg: #ffc9ad; --gawie-paper: #1f1f22; --gawie-line: #3a3a3e; color-scheme: dark; }
:root[data-theme="dark"] .gawie-logo { filter: brightness(0) invert(1); }
.gawie-appearance { display: inline-flex; background: var(--gawie-toggle-bg); border-radius: 999px; padding: 2px; margin-right: 8px; }
.gawie-appearance button { display: inline-flex; align-items: center; gap: 4px; border: 0; background: transparent; color: var(--gawie-toggle-fg);
        font: inherit; font-size: .8125rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; cursor: pointer; opacity: .7; }
.gawie-appearance button.on { background: var(--gawie-toggle-on); opacity: 1; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
.gawie-dashboard-tabs .mud-tabs-tabbar .mud-tab { min-width: auto !important; max-width: none; padding: 6px 16px; text-transform: none; font-weight: 700; letter-spacing: 0; }
/* Ciceroux on the GLR design system: Lato for every UI text (served with the app, no third-party
   font requests); Alegreya (upright; Hein 22 October 2026: no italic headings) only for rare editorial moments. Colours are in Theme.cs. */
@font-face { font-family: "Lato"; src: url("../fonts/Lato-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Lato"; src: url("../fonts/Lato-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Lato"; src: url("../fonts/Lato-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Lato"; src: url("../fonts/Lato-BoldItalic.woff2") format("woff2"); font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Lato"; src: url("../fonts/Lato-Black.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Alegreya"; src: url("../fonts/Alegreya-Italic.woff2") format("woff2"); font-weight: 400 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Alegreya"; src: url("../fonts/Alegreya-Regular.woff2") format("woff2"); font-weight: 400 900; font-style: normal; font-display: swap; }

html, body { font-family: "Lato", ui-sans-serif, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
h1, h2, .mud-typography-h4, .mud-typography-h5 { font-weight: 900 !important; letter-spacing: -0.01em; }

/* Focus: navy, 2px, offset 2px (GLR). */
:focus-visible { outline: 2px solid var(--gawie-focus); outline-offset: 2px; }

.gawie-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; gap: 1rem; color: var(--mud-palette-text-secondary); }
.gawie-wordmark { font-weight: 900; font-size: 1.25rem; letter-spacing: -0.02em; color: var(--gawie-wordmark); }
.gawie-wordmark span { color: var(--gawie-wordmark-accent); }
.gawie-muted { color: var(--mud-palette-text-secondary); }
.gawie-page { max-width: 1200px; margin: 0 auto; }

#blazor-error-ui { background: #fff4f4; bottom: 0; box-shadow: 0 -1px 2px rgba(0,0,0,.2); display: none; left: 0; padding: .6rem 1.25rem .7rem; position: fixed; width: 100%; z-index: 1000; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; border: 0; background: none; font-size: 1.2rem; }

/* The account menu in the top bar. */
.gawie-account { text-transform: none; border-radius: 999px; }
/* Sign out, at the right of the top bar on every signed-in screen; on a phone only the icon shows. */
.gawie-signout { text-transform: none; border-radius: 999px; white-space: nowrap; flex-shrink: 0; }
@media (max-width: 599.98px) {
  .gawie-signout, .gawie-account { min-width: 0; padding: 6px; }
  .gawie-signout .mud-button-icon-start, .gawie-account .mud-button-icon-start { margin: 0; }
}
/* On a phone the top bar keeps the product name and drops the institute's logo, so Sign out still fits beside the
   account button (375px wide, with Install App showing). */
@media (max-width: 480px) {
  .mud-appbar .gawie-logo { display: none; }
}

/* My writing style: the chip in a drafting area, and Firm settings, My writing style. */
.gawie-style-chip { display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px 2px 10px; border-radius: 999px; font-size: .8125rem;
        background: var(--mud-palette-action-default-hover); color: var(--mud-palette-text-secondary); white-space: nowrap; max-width: 100%; }
.gawie-style-chip.off { opacity: .85; }
.gawie-style-chip-action { border: 0; background: transparent; color: var(--mud-palette-primary); font: inherit; font-weight: 700; cursor: pointer; padding: 2px 8px; border-radius: 999px; }
.gawie-style-chip-action:hover { background: var(--mud-palette-action-default-hover); }
/* On a phone the chip takes its own line above the composer's buttons, so Send keeps its place. */
@media (max-width: 480px) {
  .gawie-style-chip { white-space: normal; }
  .gawie-composer-bar:has(> .gawie-style-chip) { flex-wrap: wrap; }
  .gawie-composer-bar > .gawie-style-chip { order: -2; margin-bottom: 4px; }
  .gawie-composer-bar:has(> .gawie-style-chip)::before { content: ""; order: -1; flex-basis: 100%; height: 0; }
}
.gawie-style-samples { display: grid; gap: 2px; }
.gawie-style-sample { display: flex; align-items: center; gap: 8px; min-width: 0; }
.gawie-style-sample-name { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.gawie-style-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 600px) { .gawie-style-compare { grid-template-columns: 1fr; } }
/* Dictation (Components/DictateButton.razor): the microphone sits with the other composer icons; while recording it is red
   with a ticking clock; while transcribing a small spinner. Beside a box outside a composer, the box and the microphone share a
   row, with no frame around either. */
.gawie-dictate { display: inline-flex; align-items: center; gap: 2px; flex-shrink: 0; }
.gawie-dictate-clock { font-size: .8125rem; font-variant-numeric: tabular-nums; color: var(--mud-palette-error); font-weight: 700; min-width: 2.6em; }
.gawie-dictate-busy { display: inline-flex; align-items: center; gap: 6px; padding: 0 6px; font-size: .8125rem; color: var(--mud-palette-text-secondary); }
.gawie-dictate-spinner { width: 18px !important; height: 18px !important; }
.gawie-dictate.recording .gawie-dictate-button { animation: gawie-dictate-pulse 1.4s ease-in-out infinite; }
@keyframes gawie-dictate-pulse { 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .gawie-dictate.recording .gawie-dictate-button { animation: none; } }
.gawie-dictate-row { display: flex; align-items: flex-end; gap: 4px; }
.gawie-dictate-row > .mud-input-control { flex: 1 1 auto; min-width: 0; }
.gawie-dictate-row > .gawie-dictate { margin-bottom: 6px; }

/* Connect email, in the top bar until the person has connected a mailbox; on a phone only the icon shows. */
.gawie-connect-email { text-transform: none; border-radius: 999px; white-space: nowrap; flex-shrink: 0; margin-right: 6px; }
@media (max-width: 480px) {
  .gawie-connect-email { min-width: 0; padding: 6px; margin-right: 2px; }
  .gawie-connect-email .mud-button-icon-start { margin: 0; }
  .gawie-connect-email-label { display: none; }
}
/* Settings, Email: one row per connected mailbox; the actions wrap under the address on a phone. */
.gawie-mailbox { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--mud-palette-lines-default); }
.gawie-mailbox-icon { flex-shrink: 0; }
.gawie-mailbox-text { flex: 1 1 200px; min-width: 0; }
.gawie-mailbox-address { overflow-wrap: anywhere; }
.gawie-mailbox-actions { display: flex; flex-wrap: wrap; gap: 4px; }
.gawie-connect-choice { justify-content: flex-start; text-transform: none; font-weight: 700; }

/* Read by screen readers, not shown. */
.gawie-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* The assistant. */
.gawie-thread { max-height: 62vh; overflow-y: auto; padding-right: 4px; }
.gawie-question { margin: 8px 0 12px auto; max-width: 85%; background: var(--gawie-question); border-radius: 10px; padding: 10px 14px; width: fit-content; }
.gawie-answer-p { margin: 0 0 8px; line-height: 1.55; }
/* A cited case: a link to where the judgment can be read (opens in a new tab). */
.gawie-case-link { color: var(--mud-palette-primary); text-decoration: underline; text-underline-offset: 2px; }
.gawie-case-link:hover { text-decoration-thickness: 2px; }
.gawie-answer-h { margin: 0 0 8px; font-weight: 700; }
.gawie-answer-rule { border: 0; border-top: 1px solid var(--gawie-line); margin: 0 0 8px; }
.gawie-answer-list { margin: 0 0 8px; padding-left: 22px; line-height: 1.55; }
.gawie-source { border-left: 3px solid var(--mud-palette-lines-default); padding: 4px 0 4px 10px; margin: 6px 0; }
.gawie-source-cited { border-left-color: var(--mud-palette-primary); }
@media (max-width: 600px) { .gawie-question { max-width: 100%; } .gawie-thread { max-height: none; } }

/* Drafts: the text box in a document face; proposed changes word by word. */
.gawie-draft textarea { font-family: "Lato", sans-serif; font-size: 0.95rem; line-height: 1.5; }
/* Hein, 25 Oct 2026: the Draft page's text box looks like the document - paragraphs justified with the last line left and no
   hyphens added, headings (# lines) left and bold. Hein, 26 Oct 2026, the house format (HouseFormat.cs): 1.5 lines and 12 pt before
   and 12 pt after each paragraph and heading, so 24 pt between paragraphs as in Word and the PDF. The blank line between two
   paragraphs is 12 pt high (it holds the caret) and each paragraph or heading line 6 pt above and below it: 6 + 12 + 6 = 24 pt.
   Lines written directly under each other (an address, a signature block) and list items (- lines) directly under each other
   stay together, as in Word; a heading directly against text keeps its full 12 pt + 12 pt. Display only; the text stays exactly
   as typed. */
.gawie-editor-field { position: relative; border: 1px solid var(--mud-palette-lines-inputs); border-radius: 4px; }
.gawie-editor-field:hover { border-color: var(--mud-palette-action-default); }
.gawie-editor-field:focus-within { border-color: var(--mud-palette-primary); box-shadow: inset 0 0 0 1px var(--mud-palette-primary); }
.gawie-editor-field.readonly:focus-within { border-color: var(--mud-palette-lines-inputs); box-shadow: none; }
.gawie-editor-label { position: absolute; top: -0.55em; left: 8px; padding: 0 5px; font-size: 0.75rem; line-height: 1; color: var(--mud-palette-text-secondary);
  background: var(--gawie-paper); pointer-events: none; }
.gawie-editor-field:focus-within .gawie-editor-label { color: var(--mud-palette-primary); }
.gawie-editor-field.readonly:focus-within .gawie-editor-label { color: var(--mud-palette-text-secondary); }
.gawie-editor { height: calc(26 * 1.5 * 0.95rem + 28px); overflow-y: auto; padding: 14px; outline: none; cursor: text;
  font-family: "Lato", sans-serif; font-size: 0.95rem; line-height: 1.5; color: var(--mud-palette-text-primary);
  white-space: pre-wrap; overflow-wrap: anywhere; word-break: normal; hyphens: manual; -webkit-hyphens: manual; caret-color: var(--mud-palette-text-primary); }
.gawie-editor .gl { margin: 0; padding: 0; }
.gawie-editor .gl-p { text-align: justify; text-align-last: left; }
.gawie-editor .gl-h { text-align: left; font-weight: 700; }
.gawie-editor .gl-blank { height: 12pt; line-height: 12pt; overflow: hidden; }
.gawie-editor .gl-p, .gawie-editor .gl-h { padding: 6pt 0; }
.gawie-editor .gl-p:not(.gl-li):has(+ .gl-p:not(.gl-li)), .gawie-editor .gl-li:has(+ .gl-li) { padding-bottom: 0; }
.gawie-editor .gl-p:not(.gl-li) + .gl-p:not(.gl-li), .gawie-editor .gl-li + .gl-li { padding-top: 0; }
.gawie-editor .gl-h:has(+ .gl-p, + .gl-h), .gawie-editor .gl-p:has(+ .gl-h), .gawie-editor .gl-p:not(.gl-li):has(+ .gl-li),
.gawie-editor .gl-li:has(+ .gl-p:not(.gl-li)) { padding-bottom: 12pt; }
.gawie-editor .gl-h + .gl-p, .gawie-editor .gl-h + .gl-h, .gawie-editor .gl-p + .gl-h, .gawie-editor .gl-p:not(.gl-li) + .gl-li,
.gawie-editor .gl-li + .gl-p:not(.gl-li) { padding-top: 12pt; }
@media (max-width: 600px) { .gawie-editor { padding: 12px; height: min(calc(26 * 1.5 * 0.95rem + 24px), 70vh); } }
.gawie-diff { white-space: pre-wrap; line-height: 1.6; max-height: 60vh; overflow-y: auto; border: 1px solid var(--mud-palette-lines-default); border-radius: 4px; padding: 12px; }
.gawie-diff-add { background: var(--gawie-add-bg); color: var(--gawie-add-fg); text-decoration: none; }
.gawie-diff-del { background: var(--gawie-del-bg); color: var(--gawie-del-fg); text-decoration: line-through; }
.gawie-grid { border-collapse: collapse; min-width: 100%; font-size: 0.875rem; }
.gawie-grid th, .gawie-grid td { border: 1px solid var(--mud-palette-lines-default); padding: 8px 10px; vertical-align: top; text-align: left; max-width: 320px; }
.gawie-grid th { background: var(--mud-palette-background-gray); font-weight: 600; position: sticky; top: 0; }
.gawie-grid td:first-child, .gawie-grid th:first-child { position: sticky; left: 0; background: var(--mud-palette-surface); min-width: 200px; z-index: 1; }
.gawie-grid th:first-child { background: var(--mud-palette-background-gray); z-index: 2; }
.gawie-grid tbody tr:hover td { background: var(--mud-palette-action-default-hover); }
.gawie-chronology-event { border-left: 3px solid var(--mud-palette-primary); }

/* Client portal: the message thread and the one-time link details. */
.gawie-thread { display: grid; gap: 8px; max-height: 420px; overflow-y: auto; }
.gawie-msg { padding: 8px 12px; border-radius: 8px; border: 1px solid var(--mud-palette-lines-default); }
.gawie-msg-client { background: var(--mud-palette-background-gray); }
.gawie-msg-firm { margin-left: 24px; }
.gawie-portal-url, .gawie-portal-pin { font-family: ui-monospace, Consolas, monospace; word-break: break-all; }
.gawie-portal-pin { font-size: 1.25rem; letter-spacing: 0.15em; }
.gawie-upload-examples { margin: 0 0 12px 1.1rem; padding: 0; display: grid; gap: 6px; font-size: .875rem; }
.gawie-wordmark { white-space: nowrap; }
@media (max-width: 480px) {
    .gawie-logo { height: 26px; }
    .gawie-wordmark { font-size: 1.05rem; }
    .gawie-appearance { margin-right: 2px; }
}
/* The menu fills the drawer's height, so Firm settings sits at the bottom with clear space above it. */
.mud-drawer .mud-drawer-content { display: flex; flex-direction: column; }
.gawie-nav-foot { margin-top: auto; padding-top: 32px; padding-bottom: 12px; }
.gawie-nav-foot .mud-nav-link { border-top: 1px solid var(--mud-palette-lines-default); }

/* Install App: top left, next to the menu, until Ciceroux is installed; on a narrow phone only the icon shows. */
.gawie-install { margin: 0 12px 0 4px; white-space: nowrap; text-transform: none; font-weight: 600; flex-shrink: 0; }
.gawie-install-steps { padding-left: 20px; }
.gawie-install-steps li { margin-bottom: 8px; }
@media (max-width: 420px) {
  .gawie-install { min-width: 0; padding: 4px 8px; }
  .gawie-install .gawie-install-label { display: none; }
  .gawie-install .mud-button-icon-start { margin: 0; }
}

/* Matter workflow and the drafting workspace */
.gawie-workflow-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.gawie-workflow-card { display: flex; flex-direction: column; gap: 4px; text-align: left; padding: 12px; border: 1px solid var(--gawie-line); border-radius: 8px;
  background: var(--gawie-paper); color: inherit; font: inherit; cursor: pointer; }
.gawie-workflow-card span { font-size: .875rem; opacity: .8; }
.gawie-workflow-card small { font-size: .75rem; opacity: .7; }
.gawie-workflow-card.on, .gawie-workflow-card:hover:not(:disabled) { border-color: var(--gawie-focus); box-shadow: 0 0 0 1px var(--gawie-focus); }
.gawie-workflow-card:disabled { cursor: default; }
.gawie-party { padding: 8px; border: 1px solid var(--gawie-line); border-radius: 8px; }
.gawie-question-row, .gawie-plan-row, .gawie-doc-row, .gawie-check-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 6px 0; border-bottom: 1px solid var(--gawie-line); }
.gawie-question-row > span, .gawie-plan-row > span, .gawie-doc-row > span, .gawie-check-row > span { flex: 1 1 180px; }
.gawie-plan-row small, .gawie-doc-row small { flex-basis: 100%; opacity: .75; }
.gawie-plan-row.muted, .gawie-doc-row.muted, .gawie-doc-link.muted { opacity: .6; }
.gawie-doc-row { cursor: pointer; }
.gawie-doc-row:hover { background: var(--gawie-question); }
.gawie-doc-link { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px; padding: 6px 8px; border-radius: 6px; color: inherit; text-decoration: none; }
.gawie-doc-link.on { background: var(--gawie-question); font-weight: 600; }
.gawie-doc-link:hover { background: var(--gawie-question); }
.gawie-draft { background: var(--gawie-paper); border: 1px solid var(--gawie-line); border-radius: 8px; padding: 24px 28px; line-height: 1.5; overflow-wrap: anywhere; }
/* Hein, 26 Oct 2026, the house format (HouseFormat.cs): 1.5 lines, 12 pt before and 12 pt after every block (as padding, so the two
   add up to 24 pt as in Word), the body justified, headings left; bullets directly under each other stay together. */
.gawie-block { margin: 0; padding-top: 12pt; padding-bottom: 12pt; display: flex; gap: 10px; }
.gb-bullet:has(+ .gb-bullet) { padding-bottom: 0; } .gb-bullet + .gb-bullet { padding-top: 0; }
.gawie-block.edited { border-left: 3px solid var(--gawie-focus); padding-left: 8px; }
.gawie-block-text { flex: 1; white-space: pre-line; }
.gawie-num { min-width: 2.2em; font-variant-numeric: tabular-nums; }
.gb-court_heading, .gb-title { justify-content: center; text-align: center; font-weight: 700; }
.gb-title { border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; padding: 6px 0; margin: 12pt 0; }
.gb-para .gawie-block-text, .gb-numbered_para .gawie-block-text, .gb-bullet .gawie-block-text, .gb-quote .gawie-block-text,
.gb-prayer_intro .gawie-block-text, .gb-prayer_item .gawie-block-text, .gb-preparation_certificate .gawie-block-text { text-align: justify; }
.gb-case_number { justify-content: flex-end; }
.gb-parties { display: block; }
.gawie-party-line { display: flex; justify-content: space-between; gap: 12px; }
.gawie-party-line > span:last-child { font-weight: 600; text-align: right; }
.gb-heading { font-weight: 700; }
.gb-quote { padding-left: 32px; font-style: italic; }
.gb-bullet .gawie-block-text::before { content: "\2022  "; }
.gb-l2 { padding-left: 28px; } .gb-l3 { padding-left: 56px; }
.gb-signature_block .gawie-block-text { text-align: right; }
.gawie-page-break { border: 0; border-top: 1px dashed var(--gawie-line); width: 100%; }
.gawie-ph, .gawie-verify { border: 0; border-radius: 4px; padding: 0 4px; font: inherit; cursor: pointer; }
.gawie-ph { background: var(--gawie-ph-bg); color: var(--gawie-ph-fg); }
.gawie-verify { background: var(--gawie-verify-bg); color: var(--gawie-verify-fg); cursor: help; text-decoration: underline dotted; }
.gawie-finding { display: flex; gap: 6px; align-items: flex-start; padding: 4px 0; font-size: .875rem; }
.gawie-diff-del { background: var(--gawie-del-bg); color: var(--gawie-del-fg); padding: 4px 8px; margin-top: 6px; border-radius: 4px; white-space: pre-line; }
.gawie-diff-add { background: var(--gawie-add-bg); color: var(--gawie-add-fg); padding: 4px 8px; margin-bottom: 6px; border-radius: 4px; white-space: pre-line; }
@media (max-width: 600px) { .gawie-draft { padding: 14px; } .gb-l2 { padding-left: 14px; } .gb-l3 { padding-left: 28px; } }

/* "Say it": the microphone on phones and tablets, bottom right of every screen, clear of the home indicator. */
.gawie-say { position: fixed; right: 20px; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 1300; width: 60px; height: 60px; border-radius: 999px; border: 0;
  background: var(--mud-palette-primary); color: var(--mud-palette-primary-text); box-shadow: 0 6px 18px rgba(0,0,0,.28);
  display: flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; font: inherit; }
.gawie-say.on { width: auto; padding: 0 20px; background: var(--mud-palette-error); color: var(--mud-palette-error-text); animation: gawie-pulse 1.2s ease-in-out infinite; }
.gawie-say:disabled { opacity: .85; cursor: default; }
.gawie-say-time { font-weight: 700; font-variant-numeric: tabular-nums; }
@keyframes gawie-pulse { 0%, 100% { box-shadow: 0 6px 18px rgba(0,0,0,.28), 0 0 0 0 rgba(220,38,38,.45); } 50% { box-shadow: 0 6px 18px rgba(0,0,0,.28), 0 0 0 12px rgba(220,38,38,0); } }
/* Room under the page for the button on touch devices. */
@media (pointer: coarse) { .mud-main-content .mud-container { padding-bottom: 104px; } }

/* The Matters workspace (22 October 2026): the list of matters as cards, and each matter's workspace. Gawie's own colours and type. */
.gawie-matters { max-width: 1200px; margin: 0 auto; }
.gawie-matters-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.gawie-eyebrow { letter-spacing: .12em; font-weight: 700; color: var(--mud-palette-text-secondary); line-height: 1.6; }
.gawie-display { font-family: "Alegreya", Georgia, serif; font-style: normal; font-weight: 800 !important; letter-spacing: -0.01em; }
.gawie-new-matter { white-space: nowrap; }
.gawie-matters-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; border-top: 1px solid var(--gawie-line); border-bottom: 1px solid var(--gawie-line); padding: 6px 0; margin-bottom: 18px; }
/* The Matters search, sort and view bar stays pinned under the top bar while the list scrolls (Hein, 26 October 2026), opaque, with a
   soft shadow once pinned (.stuck, from gawieWatchSticky). */
.gawie-matters-toolbar { position: sticky; top: var(--gawie-bar-h); z-index: 10; background: var(--mud-palette-background); transition: box-shadow .15s ease; }
.gawie-matters-toolbar.stuck { box-shadow: 0 6px 10px -8px rgba(0,0,0,.35); }
:root[data-theme="dark"] .gawie-matters-toolbar.stuck { box-shadow: 0 6px 12px -8px rgba(0,0,0,.8); }
.gawie-matters-search { flex: 1 1 260px; margin: 0 !important; }
.gawie-sort { letter-spacing: .06em; font-size: .78rem; text-transform: uppercase; }
.gawie-sort-label { color: var(--mud-palette-text-secondary); }
.gawie-view-toggle { display: inline-flex; border: 1px solid var(--gawie-line); border-radius: 8px; overflow: hidden; }
.gawie-view-toggle button { border: 0; background: transparent; color: var(--mud-palette-text-secondary); padding: 5px 9px; cursor: pointer; display: inline-flex; }
.gawie-view-toggle button.on { background: var(--gawie-question); color: var(--mud-palette-primary); }
.gawie-matter-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.gawie-matter-card { position: relative; display: flex; flex-direction: column; gap: 6px; min-height: 140px; padding: 16px; border: 1px solid var(--gawie-line); border-radius: 10px;
  background: var(--gawie-paper); transition: border-color .15s, box-shadow .15s; }
.gawie-matter-card:hover, .gawie-matter-card:focus-within { border-color: var(--mud-palette-primary); box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.gawie-matter-card-top { display: flex; align-items: flex-start; justify-content: space-between; min-height: 34px; }
.gawie-matter-card-title { color: inherit; text-decoration: none; font-weight: 700; font-size: 1rem; line-height: 1.3; margin-top: 8px; overflow-wrap: anywhere; }
.gawie-matter-card-title::after { content: ""; position: absolute; inset: 0; border-radius: 10px; }
.gawie-matter-card-title:focus-visible { outline: none; }
.gawie-matter-card-title:focus-visible::after { outline: 2px solid var(--gawie-focus); outline-offset: 2px; }
.gawie-card-action { position: relative; z-index: 2; opacity: .55; }
.gawie-matter-card:hover .gawie-card-action, .gawie-card-action:focus-visible { opacity: 1; }
.gawie-matter-card-client { font-size: .85rem; color: var(--mud-palette-text-secondary); overflow-wrap: anywhere; }
.gawie-matter-card-meta { display: flex; align-items: center; gap: 6px; font-size: .72rem; letter-spacing: .06em; color: var(--mud-palette-text-secondary); margin-top: auto; }
.gawie-matter-card-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.gawie-chip { display: inline-flex; align-items: center; font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px;
  border: 1px solid var(--gawie-line); color: var(--mud-palette-text-secondary); }
.gawie-chip-warn { color: var(--mud-palette-warning); border-color: currentColor; }
.gawie-avatar { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; color: #fff; font-weight: 900; font-size: 1rem; flex-shrink: 0; }
.gawie-avatar-sm { width: 24px; height: 24px; border-radius: 6px; font-size: .78rem; }
.gawie-avatar-lg { width: 52px; height: 52px; border-radius: 14px; font-size: 1.4rem; }
.gawie-matters-empty { text-align: center; }
/* Deleting a matter: the card's menu beside Complete & archive, the confirmation's list, and Recently deleted. */
.gawie-card-actions { display: inline-flex; align-items: center; gap: 2px; margin: -6px -6px 0 0; }
.gawie-delete-list { margin: 0 0 12px; padding-left: 20px; font-size: .9rem; line-height: 1.6; }
.gawie-delete-note { padding: 10px 12px; border-radius: 8px; background: var(--mud-palette-background-gray); }
.gawie-avatar-deleted { opacity: .5; }

/* One matter's workspace: header, instructions, the assistant with its conversations and context, and the composer. */
.gawie-ws-header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.gawie-ws-title { font-size: 1.6rem !important; line-height: 1.2 !important; overflow-wrap: anywhere; }
.gawie-ws-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.gawie-ws-sub { margin: 2px 0 6px 44px; }
.gawie-model { display: inline-flex; align-items: center; gap: 2px; padding: 2px 4px 2px 8px; border: 1px solid var(--gawie-line); border-radius: 999px; }
.gawie-model button { border: 0; background: transparent; color: var(--mud-palette-text-secondary); font: inherit; font-size: .82rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; cursor: pointer; }
.gawie-model button.on { background: var(--mud-palette-primary); color: var(--mud-palette-primary-text); }
.gawie-model button:disabled { opacity: .45; cursor: not-allowed; }
.gawie-instructions { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin: 0 0 6px 36px; }
.gawie-instructions-toggle { display: inline-flex; align-items: center; gap: 4px; border: 0; background: transparent; color: inherit; font: inherit; font-weight: 700; font-size: .9rem; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
.gawie-instructions-toggle:hover { background: var(--gawie-question); }
.gawie-instructions-body { flex-basis: 100%; padding: 8px 12px; border-left: 3px solid var(--mud-palette-primary); background: var(--gawie-paper); margin: 4px 0 6px; max-width: 900px; }
.gawie-ws { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 16px; align-items: start; }
/* The context panel: narrow, compact, on the right; the chat takes the main width. */
.gawie-ws-side { position: sticky; top: calc(var(--gawie-bar-h) + 16px); max-height: calc(100vh - var(--gawie-bar-h) - 36px); overflow-y: auto; padding: 10px; border: 1px solid var(--gawie-line); border-radius: 10px; background: var(--gawie-paper); font-size: .85rem; }
.gawie-ws-side .gawie-context-files li { font-size: .78rem; }
.gawie-ctx-toggle { display: none; justify-content: flex-end; margin-bottom: 6px; }
.gawie-doc-lead { font-size: .9rem; margin: 2px 0 6px; }
.gawie-doc-excerpt { white-space: pre-wrap; border-left: 3px solid var(--gawie-line); padding-left: 8px; }
.gawie-context-limit { display: block; margin-top: 4px; color: var(--mud-palette-warning); }
.gawie-side-title { font-weight: 700 !important; letter-spacing: .02em; }
/* Context panel: bold "Context" on top, the smaller muted count under it, then the meter, the note and the documents. */
.gawie-context-head { margin-bottom: 10px; }
.gawie-context-titlebar { display: flex; align-items: center; gap: 2px; min-height: 30px; }
.gawie-context-title { flex: 1; margin: 0; font-size: 1rem; font-weight: 700; line-height: 1.3; letter-spacing: .01em; color: var(--mud-palette-text-primary); }
.gawie-context-count { margin: 0; font-size: .75rem; line-height: 1.4; color: var(--mud-palette-text-secondary); }
.gawie-context-empty { margin-top: 10px; }
.gawie-ctx-collapse, .gawie-ctx-rail { display: inline-flex; align-items: center; justify-content: center; border: 0; background: transparent; cursor: pointer; color: var(--mud-palette-text-secondary); font: inherit; }
.gawie-ctx-collapse { width: 30px; height: 30px; border-radius: 999px; padding: 0; }
.gawie-ctx-collapse:hover, .gawie-ctx-rail:hover { background: var(--gawie-question); color: var(--mud-palette-primary); }
.gawie-ctx-collapse:focus-visible, .gawie-ctx-rail:focus-visible, .gawie-icon-upload:focus-within { outline: 2px solid var(--mud-palette-primary); outline-offset: 1px; }
.gawie-ctx-rail { display: none; flex-direction: column; gap: 10px; width: 100%; padding: 10px 0; border-radius: 8px; }
@media (min-width: 960px) {
    /* Never taller than the window below the chat's top (at least 360px), so 50 documents do not make the page scroll. */
    .gawie-ws-side { display: flex; flex-direction: column; max-height: min(calc(100vh - var(--gawie-bar-h) - 36px), max(360px, calc(100dvh - var(--gawie-ws-top, 320px) - 8px))); }
    /* On a matter the Context panel stays below the pinned tab row (not under it) as the chat scrolls. */
    .gawie-sticky-tabs .gawie-ws-side { top: calc(var(--gawie-bar-h) + var(--gawie-tabs-h) + 12px);
      max-height: min(calc(100vh - var(--gawie-bar-h) - var(--gawie-tabs-h) - 28px), max(360px, calc(100dvh - var(--gawie-ws-top, 320px) - 8px))); }
    .gawie-ws.ctx-collapsed { grid-template-columns: minmax(0, 1fr) 44px; }
    .gawie-ws.ctx-collapsed .gawie-ws-side { padding: 4px; overflow: visible; }
    .gawie-ws.ctx-collapsed .gawie-ctx-body { display: none; }
    .gawie-ws.ctx-collapsed .gawie-ctx-rail { display: flex; }
}
.gawie-context-meter { height: 6px; border-radius: 999px; background: var(--gawie-line); overflow: hidden; margin: 0 0 6px; }
.gawie-context-meter-bar { height: 100%; background: var(--mud-palette-tertiary); border-radius: 999px; transition: width .3s; }
.gawie-context-note { line-height: 1.4; }
/* The documents scroll in their own area (Hein, 23 October 2026: up to 50), so the page does not, and the bold Context heading,
   the x/50 count and the note stay in view above them: the panel is a column as tall as the window leaves it (desktop: from where
   the chat starts, --gawie-ws-top from gawieChatFollow, down to the bottom; phone: the sheet), and the list takes what is left. */
.gawie-ctx-body, .gawie-context { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; }
.gawie-context-head, .gawie-context-meter, .gawie-context-note, .gawie-context-limit, .gawie-context-empty { flex-shrink: 0; }
.gawie-context-files { list-style: none; margin: 8px 0 0; padding: 0 2px 0 0; display: grid; align-content: start; gap: 2px;
    flex: 0 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.gawie-context-files li { display: flex; align-items: center; gap: 4px; font-size: .82rem; min-width: 0; }
.gawie-context-files li.off .gawie-context-name { opacity: .5; text-decoration: line-through; }
.gawie-context-files .mud-checkbox { margin: 0 !important; }
.gawie-context-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gawie-context-size { flex-shrink: 0; font-size: .7rem; color: var(--mud-palette-text-secondary); }
.gawie-context-state { flex-shrink: 0; font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 0 5px; border-radius: 4px; background: var(--gawie-question); }
.gawie-context-state.flagged { color: var(--mud-palette-error); }
.gawie-context-state.retrieved { color: var(--mud-palette-warning); }
.gawie-icon-upload { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 999px; cursor: pointer; color: var(--mud-palette-text-secondary); }
.gawie-icon-upload:hover, .gawie-icon-upload:focus-within { background: var(--gawie-question); color: var(--mud-palette-primary); }
.gawie-ws-main { min-width: 0; max-width: 960px; width: 100%; margin: 0 auto; display: flex; flex-direction: column; min-height: calc(100dvh - var(--gawie-chat-top, 240px) - 4px); }
.gawie-ws-thread { flex: 1 1 auto; display: flex; flex-direction: column; padding-bottom: 8px; }
.gawie-ws-end { height: 1px; scroll-margin-bottom: 160px; }
/* The prompt box pinned near the bottom of the window (small padding below), over the messages that scroll above it. */
.gawie-composer-dock { position: sticky; bottom: 0; z-index: 3; padding: 6px 0 10px; padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); background: var(--mud-palette-background); }
.gawie-ws-empty { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 24px 12px; margin: auto 0; }
.gawie-question { position: relative; }
.gawie-time { display: block; font-size: .7rem; color: var(--mud-palette-text-secondary); margin-top: 4px; }
.gawie-research-line { display: inline-flex; align-items: center; gap: 4px; font-size: .75rem; color: var(--mud-palette-text-secondary); margin: 0 0 4px 2px; }
.gawie-answer-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-top: 8px; border-top: 1px solid var(--gawie-line); padding-top: 4px; }
.gawie-doc-card { overflow: hidden; }
.gawie-doc-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 12px; font-size: .8rem; font-weight: 700; border-bottom: 1px solid var(--gawie-line); color: var(--mud-palette-secondary); }
.gawie-doc-card-body { padding: 10px 12px; }
.gawie-doc-excerpt { white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.gawie-doc-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 6px 8px; border-top: 1px solid var(--gawie-line); }
.gawie-composer { position: relative; border: 1px solid var(--gawie-line); border-radius: 16px; padding: 8px 10px 6px 14px; background: var(--gawie-paper); box-shadow: 0 4px 18px rgba(0,0,0,.07); z-index: 3; }
.gawie-composer:focus-within { border-color: var(--mud-palette-primary); }
.gawie-composer.dragging { border: 2px dashed var(--mud-palette-primary); }
.gawie-composer-input { margin: 0 !important; }
.gawie-composer-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.gawie-tool-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.gawie-tool { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--gawie-line); background: transparent; color: var(--mud-palette-text-secondary); font: inherit; font-size: .76rem; font-weight: 700;
  padding: 3px 10px; border-radius: 999px; cursor: pointer; }
.gawie-tool.on { border-color: var(--mud-palette-primary); color: var(--mud-palette-primary); background: var(--gawie-question); }
.gawie-tool:disabled { opacity: .45; cursor: not-allowed; }
.gawie-send { border-radius: 999px !important; }
.gawie-drop-hint { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 8px; font-weight: 700; color: var(--mud-palette-primary); background: var(--gawie-paper); border-radius: 14px; z-index: 4; pointer-events: none; }
.gawie-drop-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: copy; z-index: 5; }
.gawie-files { max-width: 1100px; }
.gawie-dropzone { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 26px 16px; border: 2px dashed var(--gawie-line); border-radius: 12px; text-align: center; background: var(--gawie-paper); }
.gawie-dropzone.dragging, .gawie-dropzone:hover, .gawie-dropzone:focus-within { border-color: var(--mud-palette-primary); }
.gawie-dropzone-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 2; }
.gawie-format-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.gawie-type-badge { display: inline-block; font-size: .66rem; font-weight: 900; letter-spacing: .05em; padding: 2px 6px; border-radius: 4px; background: var(--mud-palette-secondary); color: var(--mud-palette-secondary-text); }
.gawie-included { color: var(--mud-palette-success); font-weight: 700; }
.gawie-ws-tabs .mud-tabs-tabbar { border-bottom: 1px solid var(--gawie-line); }
@media (max-width: 959.98px) {
  .gawie-ws { grid-template-columns: minmax(0, 1fr); }
  /* Phones and tablets: the context panel sits behind the Context button, above the chat when opened. */
  .gawie-ctx-toggle { display: flex; }
  .gawie-ws-side { display: none; position: static; max-height: none; order: -1; }
  /* On a phone or tablet the context opens as a sheet over the chat, so the prompt box stays at the bottom. */
  .gawie-ws.ctx-open .gawie-ws-side { display: block; position: fixed; top: 72px; left: 8px; right: 8px; max-height: calc(100dvh - 240px); overflow-y: auto; z-index: 1250; box-shadow: 0 10px 32px rgba(0,0,0,.22); }
  /* In the phone sheet the list takes what the sheet leaves under the heading, the count and the note. */
  .gawie-ws.ctx-open .gawie-ws-side { display: flex; flex-direction: column; }
  .gawie-ws-sub, .gawie-instructions { margin-left: 0; }
}
@media (max-width: 600px) {
  .gawie-ws-title { font-size: 1.3rem !important; }
  .gawie-composer-dock { padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px)); }
}
/* Tabs everywhere in sentence case (as written), never all capitals. */
.mud-tab { text-transform: none !important; }
.gawie-ws-tabs .mud-tabs-tabbar-content { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-behavior: smooth; }
.gawie-ws-tabs .mud-tabs-tabbar-content::-webkit-scrollbar { display: none; }
.gawie-ws-tabs .mud-tabs-tabbar-wrapper { flex-wrap: nowrap; transform: none !important; width: max-content; }
.gawie-ws-tabs .mud-tabs-scroll-button { display: none; }
.gawie-ws-tabs .mud-tab { padding: 6px 12px; min-height: 40px; min-width: 0 !important; border-bottom: 2px solid transparent; font-weight: 500; letter-spacing: 0; white-space: nowrap; flex-shrink: 0; }
.gawie-ws-tabs .mud-tab.mud-tab-active { border-bottom-color: var(--mud-palette-primary); color: var(--mud-palette-primary); font-weight: 700; }
/* One row of tabs (Hein, 22 October 2026): when they do not fit, the row scrolls sideways, with arrows at the ends. */
.gawie-tabs-wrap { position: relative; }
.gawie-tab-arrow { display: none; position: absolute; top: 0; z-index: 2; height: 40px; width: 32px; border: 0; cursor: pointer; color: var(--mud-palette-text-primary); align-items: center; justify-content: center; }
.gawie-tab-arrow.left { left: 0; background: linear-gradient(90deg, var(--mud-palette-background) 60%, transparent); }
.gawie-tab-arrow.right { right: 0; background: linear-gradient(270deg, var(--mud-palette-background) 60%, transparent); }
.gawie-tabs-wrap.can-left .gawie-tab-arrow.left, .gawie-tabs-wrap.can-right .gawie-tab-arrow.right { display: inline-flex; }

/* Pinned tabs (Hein, 26 October 2026: "If I scroll down, the top tab should remain visible in matters"). The page itself scrolls
   (the window; no ancestor of the tabs has overflow set), so the tab row is position: sticky right under the top bar, whose height
   follows MudBlazor's (56px on a phone, 48px on a phone held sideways, 64px from 600px up). MudTabs' Rounded sets overflow: hidden on
   the tabs, which would stop the row sticking, so it is visible here. The row is opaque in the page colour, above the chat's prompt
   box (z-index 3) and the end arrows' row, and below the menu drawer, popovers, the phone's Context sheet, the top bar and dialogs
   (MudBlazor's 1100 and up). Once pinned (.stuck, from gawieWatchTabs) it gets a soft shadow under its line. */
:root { --gawie-bar-h: 56px; --gawie-tabs-h: 49px; }
@media (orientation: landscape) { :root { --gawie-bar-h: 48px; } }
@media (min-width: 600px) { :root { --gawie-bar-h: 64px; } }
.gawie-ws-tabs.mud-tabs-rounded { overflow: visible; }
.gawie-sticky-tabs .gawie-ws-tabs > .mud-tabs-tabbar { position: sticky; top: var(--gawie-bar-h); z-index: 10; background: var(--mud-palette-background); border-radius: 0;
  transition: box-shadow .15s ease; }
.gawie-sticky-tabs.stuck .gawie-ws-tabs > .mud-tabs-tabbar { box-shadow: 0 6px 10px -8px rgba(0,0,0,.35); }
:root[data-theme="dark"] .gawie-sticky-tabs.stuck .gawie-ws-tabs > .mud-tabs-tabbar { box-shadow: 0 6px 12px -8px rgba(0,0,0,.8); }
/* The end arrows: a row of no height that sticks with the tabs, the arrows laid over the ends of the tab row. */
.gawie-sticky-tabs .gawie-tab-arrows { position: sticky; top: var(--gawie-bar-h); height: 0; z-index: 11; }
/* The matter's name at the start of the pinned row (tablet and desktop only), so it is clear which matter is open. */
.gawie-stuck-title { display: none; align-items: center; gap: 8px; flex: none; width: 220px; padding: 0 12px 0 2px; margin-right: 6px; border-right: 1px solid var(--gawie-line);
  font-weight: 700; font-size: .9rem; color: var(--mud-palette-text-primary); min-width: 0; }
.gawie-stuck-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
@media (min-width: 600px) {
  .gawie-sticky-tabs.stuck .gawie-stuck-title { display: inline-flex; }
  .gawie-sticky-tabs.stuck .gawie-tab-arrow.left { left: 228px; }
}
@media (min-width: 600px) and (max-width: 959.98px) {
  .gawie-stuck-title { width: 160px; }
  .gawie-sticky-tabs.stuck .gawie-tab-arrow.left { left: 168px; }
}
/* The answer tier at the end of the pinned row (Hein, 26 October 2026): Basic or Advanced, switchable, with the Advanced credits
   under it, laid over the row's end like the arrows; the tabs and the end arrow make room for it while the row is pinned. */
:root { --gawie-pin-w: 132px; }
@media (min-width: 600px) { :root { --gawie-pin-w: 176px; } }
.gawie-pin-tier { display: none; position: absolute; top: 0; right: 0; z-index: 3; width: var(--gawie-pin-w); height: 48px; padding: 0 2px 0 8px;
  flex-direction: column; align-items: flex-end; justify-content: center; gap: 1px; background: var(--mud-palette-background); }
.gawie-sticky-tabs.stuck .gawie-pin-tier { display: flex; }
.gawie-sticky-tabs.stuck .gawie-ws-tabs > .mud-tabs-tabbar { padding-right: var(--gawie-pin-w); }
.gawie-sticky-tabs.stuck .gawie-tab-arrow.right { right: var(--gawie-pin-w); }
.gawie-model.gawie-model-pin { padding: 2px; }
.gawie-model.gawie-model-pin button { font-size: .74rem; padding: 2px 9px; }
.gawie-pin-credits { font-size: .68rem; line-height: 1.2; color: var(--mud-palette-text-secondary); white-space: nowrap; padding-right: 4px; }
@media (max-width: 599.98px) {
  .gawie-model.gawie-model-pin button { font-size: .7rem; padding: 2px 7px; }
  .gawie-pin-credits { font-size: .62rem; }
}
/* Anchors and "scroll into view" on a matter land below the pinned row, not under it. */
html:has(.gawie-sticky-tabs) { scroll-padding-top: calc(var(--gawie-bar-h) + var(--gawie-tabs-h) + 8px); }

/* The Document Vault (22 October 2026). */
.gawie-hidden-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.gawie-vault-folder-upload { position: relative; cursor: pointer; }
.gawie-vault-folder-upload input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.gawie-vault-drop { margin: 16px 0; padding: 18px 16px; }
.gawie-vault-body { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 20px; align-items: start; }
.gawie-vault-folders { display: flex; flex-direction: column; gap: 2px; position: sticky; top: 72px; }
.gawie-vault-folder-row { display: flex; align-items: center; }
.gawie-vault-folder { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; padding: 7px 10px; border: 0; border-radius: 8px; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gawie-vault-folder:hover { background: var(--mud-palette-action-default-hover); }
.gawie-vault-folder.active { background: var(--mud-palette-primary-hover); color: var(--mud-palette-primary); font-weight: 700; }
.gawie-vault-folder .gawie-muted { margin-left: auto; font-size: .78rem; }
.gawie-vault-nav-label { margin: 14px 10px 4px; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--mud-palette-text-secondary); }
.gawie-vault-filter-matter { outline: 2px solid var(--mud-palette-primary-hover); border-radius: 6px; }
/* A document's text status: "Reading text…", "Text ready", "Couldn't read" (with a retry). */
.gawie-text-status { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-size: .78rem; color: var(--mud-palette-text-secondary); }
.gawie-text-status .mud-icon-root { font-size: 1rem; }
.gawie-text-ready { color: var(--mud-palette-success-darken, #2e7d32); }
.gawie-text-reading { color: var(--mud-palette-info, #0277bd); }
.gawie-text-failed, .gawie-text-unavailable { color: var(--mud-palette-warning-darken, #b26a00); }
.gawie-text-retry { min-width: 0; padding: 0 6px; font-size: .78rem; }
.gawie-vault-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.gawie-vault-search { flex: 1 1 240px; min-width: 200px; }
.gawie-vault-filter { flex: 0 1 150px; min-width: 130px; }
.gawie-vault-view { flex: none; display: flex; gap: 4px; }
.gawie-vault-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 40px 16px; border: 1px dashed var(--gawie-line); border-radius: 12px; }
.gawie-vault-badge { display: inline-block; font-size: .64rem; font-weight: 900; letter-spacing: .05em; padding: 1px 6px; border-radius: 4px; background: var(--mud-palette-primary); color: var(--mud-palette-primary-text); text-transform: uppercase; }
.gawie-vault-picker-list { max-height: 50vh; overflow-y: auto; border: 1px solid var(--gawie-line); border-radius: 8px; }
.gawie-vault-pick { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-bottom: 1px solid var(--gawie-line); cursor: pointer; }
.gawie-vault-pick:last-child { border-bottom: 0; }
.gawie-vault-pick.linked { opacity: .6; cursor: default; }
.gawie-vault-pick-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gawie-vault-pick-meta { font-size: .78rem; white-space: nowrap; }
@media (max-width: 900px) {
    .gawie-vault-body { grid-template-columns: 1fr; }
    .gawie-vault-folders { position: static; flex-direction: row; flex-wrap: wrap; }
    .gawie-vault-folder { flex: none; }
}
.gawie-nowrap { white-space: nowrap; }
.gawie-vault-table td[data-label="Name"] { min-width: 180px; }

/* The minimal Document Vault (Hein, 22 October 2026): a title, one search bar, Upload, and a plain list. */
.gawie-vault-simple { position: relative; }
.gawie-vault-top { margin-bottom: 12px; }
.gawie-vault-bar { display: flex; gap: 10px; align-items: center; margin-top: 12px; }
.gawie-vault-search { flex: 1; }
.gawie-vault-search .mud-input-control { margin: 0; }
.gawie-vault-upload { position: relative; flex: none; cursor: pointer; }
.gawie-vault-upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
/* Document cards: the Matters page's cards (.gawie-matter-card), a little smaller and more compact. */
.gawie-vault-cards { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.gawie-vault-card { position: relative; display: flex; flex-direction: column; gap: 4px; min-height: 118px; padding: 12px; border: 1px solid var(--gawie-line); border-radius: 10px;
  background: var(--gawie-paper); transition: border-color .15s, box-shadow .15s; min-width: 0; }
.gawie-vault-card:hover, .gawie-vault-card:focus-within { border-color: var(--mud-palette-primary); box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.gawie-vault-card:hover .gawie-card-action, .gawie-vault-card:focus-within .gawie-card-action { opacity: 1; }
.gawie-vault-card-top { display: flex; align-items: flex-start; justify-content: space-between; min-height: 28px; }
.gawie-vault-card-top .gawie-card-action { margin: -6px -6px 0 0; }
.gawie-vault-card-tile { width: 28px; height: 28px; border-radius: 8px; }
.gawie-vault-card-title { all: unset; color: inherit; font-weight: 700; font-size: .9rem; line-height: 1.3; margin-top: 6px; overflow-wrap: anywhere; cursor: pointer;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gawie-vault-card-title::after { content: ""; position: absolute; inset: 0; border-radius: 10px; }
.gawie-vault-card-title:focus-visible::after { outline: 2px solid var(--gawie-focus); outline-offset: 2px; }
.gawie-vault-card-client { font-size: .78rem; color: var(--mud-palette-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gawie-vault-card-meta { display: flex; align-items: center; gap: 6px; font-size: .66rem; letter-spacing: .06em; color: var(--mud-palette-text-secondary); margin-top: auto; padding-top: 4px; }
.gawie-vault-card-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.gawie-vault-card-chips .gawie-chip { font-size: .62rem; padding: 1px 7px; }
@media (max-width: 600px) {
  .gawie-vault-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .gawie-vault-card { padding: 10px; min-height: 112px; }
  .gawie-vault-card .gawie-card-action { opacity: 1; }
}
.gawie-vault-dropcover { position: absolute; inset: 0; z-index: 20; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 2px dashed var(--mud-palette-primary); border-radius: 12px; background: rgba(255,255,255,.92); color: var(--mud-palette-primary); font-weight: 700; min-height: 240px; }
.gawie-vault-dropcover .gawie-dropzone-input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; }

/* Deceased estate: fields filled from an uploaded document, marked with the document until the person types in them. */
.gawie-from-doc .mud-input-outlined-border { border-color: var(--mud-palette-primary); border-style: dashed; }
.gawie-from-doc .mud-input-helper-text,
.gawie-from-doc-note { color: var(--mud-palette-primary); font-weight: 600; }
.gawie-doc-differs { border-left: 3px solid var(--mud-palette-warning); }

/* The Diary chat (Diary tab): a compact chat above the diary; its thread scrolls within a short box. */
.gawie-diary-chat { border: 1px solid var(--gawie-line); border-radius: 14px; padding: 10px 12px 8px; background: var(--gawie-paper); margin-bottom: 12px; }
.gawie-diary-chat-thread { max-height: 280px; overflow-y: auto; }
.gawie-diary-chat-thread .gawie-question { margin: 4px 0 8px auto; padding: 6px 12px; }
.gawie-diary-chat-answer { margin: 4px 0 10px; }
.gawie-diary-chat-done { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; border-left: 3px solid var(--mud-palette-success); padding: 4px 10px; margin-top: 6px; }
.gawie-diary-chat .gawie-composer { box-shadow: none; }
.gawie-diary-chat-hints { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }

/* The left menu's width, dragged by its right edge on a desktop (Hein, 23 October 2026); gawieNav in js/gawie.js sets
   --gawie-nav-width. Below 140 px only the icons show (their names stay for screen readers). Phones and tablets keep the drawer. */
.gawie-nav-resizer { display: none; }
@media (min-width: 960px) {
    .mud-layout { --mud-drawer-width-left: var(--gawie-nav-width, 240px) !important; }
    .gawie-nav-resizer { display: block; position: absolute; top: 0; right: 0; width: 7px; height: 100%; cursor: col-resize; z-index: 5;
        background: transparent; border: 0; padding: 0; touch-action: none; }
    .gawie-nav-resizer::after { content: ""; position: absolute; top: 0; bottom: 0; left: 3px; width: 1px; background: transparent; transition: background .15s; }
    .gawie-nav-resizer:hover::after, .gawie-nav-resizer:focus-visible::after, .gawie-nav-resizing .gawie-nav-resizer::after { width: 3px; left: 2px; background: var(--brand-latte, #C8A97E); }
    .gawie-nav-resizer:focus-visible { outline: none; }
    .gawie-nav-drawer { overflow-x: hidden; }
    .gawie-nav-resizing, .gawie-nav-resizing * { cursor: col-resize !important; user-select: none !important; }
    .gawie-nav-resizing .mud-drawer, .gawie-nav-resizing .mud-main-content, .gawie-nav-resizing .mud-appbar { transition: none !important; }
    .gawie-nav-narrow .gawie-nav-drawer .mud-nav-link { justify-content: center; padding-left: 0 !important; padding-right: 0 !important; }
    .gawie-nav-narrow .gawie-nav-drawer .mud-nav-link-text,
    .gawie-nav-narrow .gawie-nav-drawer .mud-nav-link-expand-icon { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .gawie-nav-narrow .gawie-nav-drawer .mud-nav-link-icon { margin: 0 !important; }
    .gawie-nav-narrow .gawie-nav-drawer .mud-navgroup .mud-collapse-wrapper-inner .mud-nav-link { padding-left: 0 !important; }
    .gawie-nav-narrow .gawie-nav-drawer .glr-endorse { display: none; }
    /* Icons only: each section (Legal work, Practice, Advanced Features) set off by a thin rule instead of its label. */
    .gawie-nav-narrow .gawie-nav-drawer .mud-navgroup { border-top: 1px solid var(--brand-frame-rule, var(--mud-palette-lines-default)); }
}

/* The AI at work, in every chat (ThinkingPanel, Hein 23 October 2026): "Thinking… 7s" and the step, the reasoning summary below
   (open while it works), then "Thought for 12s" (folded, opens again). Fits a 390 px phone: the step wraps under the ticker. */
.gawie-thinking { margin: 4px 0 8px; max-width: 100%; }
.gawie-thinking-head { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; max-width: 100%; border: 0; background: transparent; padding: 4px 2px;
  font: inherit; font-size: .85rem; color: var(--mud-palette-text-secondary); cursor: pointer; text-align: left; border-radius: 6px; }
.gawie-thinking-head:disabled { cursor: default; }
.gawie-thinking-head:hover:not(:disabled) { color: var(--mud-palette-text-primary); }
.gawie-thinking-label { font-weight: 700; font-variant-numeric: tabular-nums; }
.gawie-thinking.working .gawie-thinking-label { color: var(--mud-palette-primary); }
.gawie-thinking-step { overflow-wrap: anywhere; }
.gawie-thinking-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--mud-palette-primary); animation: gawie-pulse 1.2s ease-in-out infinite; flex: none; }
@keyframes gawie-pulse { 0%, 100% { opacity: .25; transform: scale(.8); } 50% { opacity: 1; transform: scale(1); } }
.gawie-thinking-body { border-left: 2px solid var(--gawie-line); margin: 2px 0 6px 5px; padding: 2px 0 2px 12px; font-size: .85rem; color: var(--mud-palette-text-secondary); }
.gawie-thinking-steps { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.gawie-thinking-steps li { display: flex; align-items: center; gap: 6px; }
.gawie-thinking-steps li.current { color: var(--mud-palette-text-primary); font-weight: 600; }
.gawie-thinking-text { white-space: pre-wrap; line-height: 1.5; max-height: 320px; overflow-y: auto; overflow-wrap: anywhere; font-style: italic; }
.gawie-answer-preview { white-space: pre-wrap; line-height: 1.55; overflow-wrap: anywhere; margin: 4px 0 8px; }
.gawie-caret { display: inline-block; width: 7px; height: 1em; vertical-align: text-bottom; margin-left: 2px; background: var(--mud-palette-primary); animation: gawie-pulse 1s steps(2) infinite; }
@media (max-width: 600px) { .gawie-thinking-text { max-height: 220px; } }
@media (prefers-reduced-motion: reduce) { .gawie-thinking-dot, .gawie-caret { animation: none; } }

/* Refresh (top bar, beside the light/dark switch) and "New version available" (Hein, 25 October 2026). The notice sits
   bottom left, clear of the snackbars and the phone's "Say it" microphone (bottom right). */
.mud-appbar .gawie-refresh { flex-shrink: 0; margin-right: 6px; }
@media (max-width: 480px) { .mud-appbar .gawie-refresh { padding: 6px; margin-right: 2px; } }
.gawie-update { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 1350;
  display: flex; align-items: center; gap: 8px; padding: 4px 4px 4px 12px; border-radius: 8px; max-width: calc(100vw - 32px);
  background: var(--brand-midnight); color: var(--brand-cream); box-shadow: 0 4px 14px rgba(0,0,0,.22); font-size: .875rem; }
.gawie-update .gawie-update-icon { color: var(--brand-latte); }
.gawie-update .gawie-update-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gawie-update .gawie-update-refresh { color: var(--brand-latte); font-weight: 600; text-transform: none; min-width: 0; }
.gawie-update .gawie-update-close { color: var(--brand-cream); }
.gawie-update .gawie-update-refresh:hover, .gawie-update .gawie-update-close:hover { background: rgba(238,236,226,.14); }
:root[data-theme="dark"] .gawie-update { background: var(--brand-cream); color: var(--brand-midnight); box-shadow: 0 4px 14px rgba(0,0,0,.45); }
:root[data-theme="dark"] .gawie-update .gawie-update-icon, :root[data-theme="dark"] .gawie-update .gawie-update-refresh { color: var(--brand-denim); }
:root[data-theme="dark"] .gawie-update .gawie-update-close { color: var(--brand-midnight); }
:root[data-theme="dark"] .gawie-update .gawie-update-refresh:hover, :root[data-theme="dark"] .gawie-update .gawie-update-close:hover { background: rgba(37,52,76,.10); }
@media (max-width: 600px) { .gawie-update { left: 12px; transform: none; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); max-width: calc(100vw - 104px); } }

/* "Jump to latest" (Hein, 26 October 2026; Components/JumpToLatest.razor): a row of no height just above the prompt box (or, in a
   result list, pinned near the bottom of the window), the round button floating over the end of the messages, centred, so it is
   clear of the attach icon (in the box) and of the phone's "New version available" notice (bottom left; it moves aside to the right
   if the two would meet, .dodge) and the phone's "Say it" microphone (bottom right). Hidden at the bottom; shown (.shown) by gawie.js. */
.gawie-jump { position: relative; height: 0; z-index: 4; pointer-events: none; }
.gawie-jump-float { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); pointer-events: none; }
.gawie-jump.dodge .gawie-jump-float { left: auto; right: 8px; transform: none; }
.gawie-jump-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--gawie-line); background: var(--gawie-paper); color: var(--mud-palette-text-primary); box-shadow: 0 4px 14px rgba(0,0,0,.18);
  opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .15s ease, transform .15s ease, visibility 0s linear .15s; }
.gawie-jump.shown .gawie-jump-btn { opacity: 1; visibility: visible; transform: none; pointer-events: auto; transition: opacity .15s ease, transform .15s ease, visibility 0s; }
.gawie-jump-btn:hover { color: var(--mud-palette-primary); border-color: var(--mud-palette-primary); }
.gawie-jump-btn:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; }
:root[data-theme="dark"] .gawie-jump-btn { box-shadow: 0 4px 14px rgba(0,0,0,.55); }
/* In a result list (Agents, Workflows): pinned above the bottom of the window, clear of the notice and the microphone. */
.gawie-jump.gawie-jump-page { position: sticky; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }

/* The estate's assistant (EstateChat): a document shown as the firm's drafts are (justified, 12pt, no extra gaps); the thread scrolls in the card. */
.gawie-estate-chat .gawie-ws-thread { max-height: 520px; overflow-y: auto; }
.gawie-estate-document { white-space: pre-wrap; text-align: justify; font-size: 12pt; line-height: 1.5; max-height: 360px; overflow-y: auto; }

/* A recording made in the browser (RecordingIndicator, Hein 26 October 2026): a pulsing red dot, "Recording" and the time. */
.gawie-rec { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 999px; font-weight: 700;
  color: var(--mud-palette-error); background: rgba(220,38,38,.08); border: 1px solid rgba(220,38,38,.35); line-height: 1.4; }
.gawie-rec-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--mud-palette-error); flex: none; animation: gawie-rec-pulse 1.2s ease-in-out infinite; }
.gawie-rec-time { font-variant-numeric: tabular-nums; min-width: 3.2em; color: var(--mud-palette-text-primary); }
.gawie-rec.paused { color: var(--mud-palette-text-secondary); background: transparent; border-color: var(--mud-palette-lines-inputs); }
.gawie-rec.paused .gawie-rec-dot { animation: none; background: var(--mud-palette-text-secondary); }
@keyframes gawie-rec-pulse { 0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 0 0 rgba(220,38,38,.5); } 50% { opacity: .55; transform: scale(.85); box-shadow: 0 0 0 6px rgba(220,38,38,0); } }
@media (prefers-reduced-motion: reduce) { .gawie-rec-dot { animation: none; } }

/* The Personal Assistant's action cards (docs/dotnet/ASSISTANT_ACTIONS.md). "Important" ones carry a warm edge. */
.gawie-action-card { border-left: 3px solid var(--mud-palette-info); }
.gawie-action-card.gawie-action-important { border-left-color: var(--mud-palette-warning); }
.gawie-action-fields { display: grid; grid-template-columns: minmax(90px, max-content) 1fr; gap: 2px 12px; margin: 0; font-size: .875rem; }
.gawie-action-fields dt { color: var(--mud-palette-text-secondary); }
.gawie-action-fields dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 600px) { .gawie-action-fields { grid-template-columns: 1fr; } .gawie-action-fields dd { margin-bottom: 4px; } }