* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; min-height: 100%; margin: 0; }
body {
    overflow: hidden;
    color: var(--color-ink);
    background: radial-gradient(circle at 15% 10%, rgba(200,147,77,.11), transparent 25rem), linear-gradient(145deg, var(--color-paper), #f8f5ee 52%, var(--color-paper-deep));
    font-family: var(--font-ui);
}
button, textarea, input, select { font: inherit; }
button { color: inherit; }
button:focus-visible, textarea:focus-visible, input:focus-visible, select:focus-visible { outline: .1875rem solid rgba(81,102,83,.28); outline-offset: .1875rem; }
[hidden] { display: none !important; }
.visually-hidden { position: absolute; width: .0625rem; height: .0625rem; padding: 0; margin: -.0625rem; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: .75rem; left: .75rem; padding: .7rem 1rem; border-radius: var(--radius-pill); color: white; background: var(--color-sage-deep); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.app-shell { display: grid; height: 100dvh; min-height: 100dvh; grid-template-rows: var(--header-height) minmax(0,1fr); overflow: hidden; }
.app-header { position: relative; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .65rem clamp(1rem,3vw,2.4rem); border-bottom: .0625rem solid var(--color-line); background: rgba(248,244,236,.82); backdrop-filter: blur(1.125rem); }
.brand { display: inline-flex; align-items: center; gap: .85rem; min-width: 0; padding: 0; border: 0; text-align: left; background: transparent; cursor: pointer; }
.brand-portrait { width: 3.8rem; aspect-ratio: 1; flex: 0 0 auto; border: .125rem solid rgba(255,253,248,.92); border-radius: 50%; background-image: var(--mira-portrait); background-size: 155%; background-position: 50% 20%; box-shadow: 0 .5rem 1.375rem rgba(66,58,46,.18); }
.brand-copy { display: grid; line-height: 1.06; }
.brand-copy strong { font-family: var(--font-display); font-size: clamp(1.15rem,2vw,1.52rem); letter-spacing: -.025em; }
.brand-copy span { margin-top: .27rem; color: var(--color-sage-deep); font-family: var(--font-display); font-size: .87rem; font-style: italic; white-space: nowrap; }
.header-actions, .composer-actions { display: flex; align-items: center; gap: .65rem; }
.model-chip, .primary-action, .secondary-action, .icon-button, .text-button, .composer-action, .round-action, .send-button, .quiet-link, .suggestion-row button { border: 0; cursor: pointer; transition: transform var(--duration-fast) var(--ease-out), background var(--duration-fast), box-shadow var(--duration-fast); }
.model-chip:hover, .primary-action:hover, .secondary-action:hover, .icon-button:hover, .text-button:hover, .composer-action:hover, .round-action:hover, .suggestion-row button:hover { transform: translateY(-.0625rem); }
.model-chip { display: flex; align-items: center; gap: .6rem; min-width: 10.5rem; padding: .55rem .75rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); background: rgba(255,253,248,.76); }
.model-chip-dot, .status-dot { width: .5rem; height: .5rem; flex: 0 0 auto; border-radius: 50%; background: var(--color-sage); box-shadow: 0 0 0 .25rem rgba(119,139,120,.13); }
.model-chip-copy { display: grid; flex: 1; text-align: left; line-height: 1.05; }
.model-chip-copy small { color: var(--color-ink-soft); font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; }
.model-chip-copy strong { margin-top: .24rem; font-size: .86rem; }
.chevron { color: var(--color-ink-soft); }
.primary-action, .secondary-action { min-height: 2.8rem; padding: .7rem 1rem; border-radius: var(--radius-pill); font-weight: 700; }
.primary-action { display: inline-flex; align-items: center; gap: .35rem; color: #fff; background: var(--color-sage-deep); box-shadow: 0 .4375rem 1.125rem rgba(81,102,83,.2); }
.secondary-action { width: 100%; color: var(--color-sage-deep); background: var(--color-sage-soft); }
.icon-button, .round-action { display: inline-grid; width: 2.8rem; aspect-ratio: 1; place-items: center; padding: 0; border-radius: 50%; }
.user-button { color: white; background: var(--color-amber); font-family: var(--font-display); font-size: 1.05rem; box-shadow: inset 0 0 0 .1875rem rgba(255,255,255,.45); }
.quiet { color: var(--color-ink-soft); background: rgba(41,45,43,.06); font-size: 1.35rem; }
.workspace { position: relative; min-height: 0; overflow: hidden; }
.conversation { position: relative; display: grid; grid-template-rows: auto auto minmax(0,1fr); grid-template-areas: "toolbar" "speech" "stage"; width: 100%; height: 100%; overflow: hidden; }
.conversation-toolbar { grid-area: toolbar; }
.message-list, .welcome-stage { grid-area: stage; }
.conversation-toolbar { position: relative; z-index: 5; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 3.6rem; padding: .45rem clamp(1rem,3vw,2.4rem); }
.text-button { display: inline-flex; align-items: center; gap: .45rem; width: max-content; padding: .55rem .75rem; border-radius: var(--radius-pill); color: var(--color-ink-soft); background: transparent; font-size: .88rem; }
.text-button:hover { color: var(--color-ink); background: rgba(255,253,248,.72); }
.conversation-context { display: flex; align-items: center; gap: .65rem; color: var(--color-ink-soft); font-size: .8rem; }
.conversation-actions { display: flex; align-items: center; justify-self: end; gap: .2rem; }
.conversation-new-chat { display: none; }
.protocol-workspace { position: absolute; inset: 0; display: grid; grid-template-rows: auto minmax(0,1fr); overflow: hidden; background: radial-gradient(circle at 9% 6%,rgba(200,147,77,.09),transparent 25rem),linear-gradient(145deg,rgba(248,245,238,.96),rgba(244,239,229,.98)); }
.protocol-toolbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 3.6rem; padding: .45rem clamp(1rem,3vw,2.4rem); border-bottom: .0625rem solid var(--color-line); background: rgba(255,253,248,.58); }
.protocol-toolbar-title { display: flex; align-items: center; gap: .65rem; color: var(--color-ink-soft); font-size: .84rem; }
.protocol-new { justify-self: end; min-height: 2.45rem; padding: .55rem .85rem; font-size: .8rem; }
.protocol-layout { display: grid; grid-template-columns: minmax(14rem,19rem) minmax(0,1fr); min-height: 0; }
.protocol-index { display: grid; align-content: start; gap: .75rem; min-height: 0; padding: 1.1rem; overflow-y: auto; border-right: .0625rem solid var(--color-line); background: rgba(255,253,248,.54); }
.protocol-index-heading { display: flex; align-items: start; justify-content: space-between; gap: .75rem; }
.protocol-index-heading h2 { margin: .22rem 0 0; font-family: var(--font-display); font-size: 1.45rem; font-weight: 500; }
.protocol-index-heading .icon-button { width: 2.3rem; font-size: 1.2rem; }
.protocol-index-note { margin: 0; color: var(--color-ink-soft); font-size: .75rem; line-height: 1.45; }
.protocol-draft-item { display: grid; grid-template-columns: 2.2rem minmax(0,1fr); align-items: center; gap: .55rem; padding: .65rem; border: .0625rem solid rgba(81,102,83,.17); border-radius: var(--radius-small); background: var(--color-sage-soft); }
.protocol-list-item { display: grid; grid-template-columns: 2.2rem minmax(0,1fr); align-items: center; gap: .55rem; width: 100%; padding: .65rem; border: .0625rem solid transparent; border-radius: var(--radius-small); text-align: left; color: var(--color-ink); background: rgba(255,253,248,.48); cursor: pointer; }
.protocol-list-item:hover, .protocol-list-item:focus-visible { border-color: rgba(81,102,83,.25); background: var(--color-sage-soft); }
.protocol-list-item > span:last-child { display: grid; min-width: 0; gap: .12rem; }
.protocol-list-item strong { overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.protocol-list-item small { color: var(--color-ink-soft); font-size: .66rem; }
.protocol-item-mark, .protocol-empty-mark, .protocol-record-mark { display: grid; place-items: center; border-radius: 50%; color: var(--color-sage-deep); background: rgba(255,253,248,.78); font-weight: 800; }
.protocol-item-mark { width: 2.2rem; aspect-ratio: 1; }
.protocol-draft-item > span:last-child { display: grid; min-width: 0; gap: .12rem; }
.protocol-draft-item strong { overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.protocol-draft-item small { color: var(--color-ink-soft); font-size: .66rem; }
.protocol-stage { min-width: 0; overflow-y: auto; padding: clamp(1rem,3vw,2.25rem); }
.protocol-empty, .protocol-metadata-form, .protocol-record-view { width: min(100%,52rem); margin: 0 auto; }
.protocol-empty { display: grid; justify-items: start; gap: .65rem; padding-top: clamp(2rem,9vh,7rem); }
.protocol-empty-mark { width: 3rem; aspect-ratio: 1; font-size: 1.2rem; box-shadow: 0 .55rem 1.35rem rgba(66,58,46,.1); }
.protocol-empty h1, .protocol-stage-heading h1 { margin: 0; font-family: var(--font-display); font-size: clamp(2rem,4vw,3.2rem); font-weight: 500; line-height: 1.02; letter-spacing: -.035em; }
.protocol-empty p, .protocol-stage-heading p { max-width: 42rem; margin: 0; color: var(--color-ink-soft); line-height: 1.55; }
.protocol-empty .primary-action { margin-top: .35rem; }
.protocol-metadata-form, .protocol-record-view { display: grid; gap: 1rem; padding-bottom: 2rem; }
.protocol-stage-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.protocol-stage-heading > div { display: grid; gap: .45rem; }
.protocol-stage-heading .text-button { flex: 0 0 auto; }
.protocol-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem 1rem; }
.protocol-field-wide { grid-column: 1 / -1; }
.protocol-details-editor { border-top: .0625rem solid var(--color-line); border-bottom: .0625rem solid var(--color-line); }
.protocol-details-editor summary, .protocol-details-card summary { padding: .8rem 0; color: var(--color-sage-deep); cursor: pointer; font-size: .8rem; font-weight: 750; }
.protocol-details-editor > .protocol-field-grid { padding: .15rem 0 1rem; }
.protocol-form-note { display: grid; grid-template-columns: auto minmax(0,1fr); gap: .55rem; padding: .75rem .8rem; border-radius: var(--radius-small); color: var(--color-ink-soft); background: rgba(119,139,120,.09); font-size: .76rem; line-height: 1.45; }
.protocol-form-note > span { color: var(--color-sage-deep); }
.protocol-control-card { display: grid; gap: .9rem; padding: clamp(1rem,2.8vw,1.5rem); border: .0625rem solid rgba(81,102,83,.2); border-radius: var(--radius-large); background: rgba(255,253,248,.82); box-shadow: var(--shadow-soft); }
.protocol-guidance { display: grid; grid-template-columns: 3.15rem minmax(0,1fr); align-items: center; gap: .75rem; margin-bottom: .1rem; padding: .72rem .85rem; border: .0625rem solid rgba(81,102,83,.23); border-radius: var(--radius-medium); background: rgba(255,253,248,.9); box-shadow: var(--shadow-soft); }
.protocol-guidance[data-tone="warning"] { border-color: rgba(194,132,55,.5); background: rgba(249,239,220,.9); }
.protocol-guidance[data-tone="error"] { border-color: rgba(162,78,66,.48); background: rgba(251,235,231,.94); }
.protocol-guidance img { width: 3.15rem; aspect-ratio: 1; object-fit: cover; border-radius: 50%; background: var(--color-paper); }
.protocol-guidance div { display: grid; gap: .12rem; }
.protocol-guidance strong { color: var(--color-sage-deep); font-size: .82rem; }
.protocol-guidance p { margin: 0; color: var(--color-ink-soft); font-size: .77rem; line-height: 1.42; }
.protocol-guidance-action { justify-self: start; margin-top: .45rem; }
.protocol-control-heading { display: grid; grid-template-columns: 2.65rem minmax(0,1fr); align-items: center; gap: .7rem; }
.protocol-record-mark { width: 2.65rem; aspect-ratio: 1; background: var(--color-sage-soft); }
.protocol-control-heading > div { display: grid; gap: .14rem; }
.protocol-control-heading strong { font-size: 1rem; }
.protocol-control-heading small, .protocol-control-actions small { color: var(--color-ink-soft); font-size: .74rem; line-height: 1.4; }
.protocol-meter { position: relative; display: grid; min-height: 5.8rem; overflow: hidden; place-items: center; border: .0625rem solid rgba(81,102,83,.14); border-radius: var(--radius-small); color: var(--color-ink-soft); background: linear-gradient(180deg,rgba(119,139,120,.1),rgba(119,139,120,.025)); font-size: .76rem; }
.protocol-meter-wave { position: absolute; inset: 0; opacity: .5; background: repeating-linear-gradient(90deg,transparent 0 .75rem,rgba(81,102,83,.16) .75rem .82rem,transparent .82rem 1.4rem),linear-gradient(180deg,transparent 46%,rgba(81,102,83,.24) 48% 52%,transparent 54%); mask-image: linear-gradient(90deg,transparent 0%,#000 13%,#000 87%,transparent 100%); }
.protocol-meter canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.protocol-meter > span { position: relative; z-index: 1; padding: .35rem .55rem; border-radius: var(--radius-pill); background: rgba(255,253,248,.74); }
.protocol-health { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .55rem; }
.protocol-health div { display: grid; gap: .2rem; padding: .65rem .7rem; border-radius: .75rem; background: rgba(41,45,43,.04); }
.protocol-health span { color: var(--color-ink-soft); font-size: .65rem; text-transform: uppercase; letter-spacing: .06em; }
.protocol-health strong { font-size: .82rem; }
.protocol-control-actions { display: flex; align-items: center; gap: .8rem; }
.protocol-control-actions .primary-action:disabled { cursor: not-allowed; opacity: .55; }
.protocol-details-card { padding: 0 1rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); background: rgba(255,253,248,.62); }
.protocol-details-card summary { margin: 0; }
.protocol-details-card dl { display: grid; grid-template-columns: minmax(8rem,.7fr) minmax(0,1.3fr); gap: .55rem .8rem; margin: 0; padding: .2rem 0 1rem; font-size: .8rem; }
.protocol-details-card dt { color: var(--color-ink-soft); }
.protocol-details-card dd { margin: 0; overflow-wrap: anywhere; }
.protocol-future-note { display: grid; grid-template-columns: auto minmax(0,1fr); gap: .65rem; padding: .8rem .9rem; border-left: .1875rem solid var(--color-amber); border-radius: 0 var(--radius-small) var(--radius-small) 0; background: rgba(243,225,197,.28); }
.protocol-future-note > span { color: var(--color-amber); }
.protocol-future-note div { display: grid; gap: .2rem; }
.protocol-future-note strong { font-size: .82rem; }
.protocol-future-note p { margin: 0; color: var(--color-ink-soft); font-size: .75rem; line-height: 1.45; }
.protocol-transcript { display: grid; gap: .75rem; padding: clamp(.9rem,2.4vw,1.35rem); border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); background: rgba(255,253,248,.72); }
.protocol-transcript > header { display: flex; align-items: start; justify-content: space-between; gap: .8rem; }
.protocol-transcript h2 { margin: .18rem 0 0; font-family: var(--font-display); font-size: 1.35rem; font-weight: 500; }
.protocol-transcript-status { padding: .32rem .55rem; border-radius: var(--radius-pill); color: var(--color-sage-deep); background: var(--color-sage-soft); font-size: .68rem; font-weight: 700; }
.protocol-transcript-explainer { margin: 0; color: var(--color-ink-soft); font-size: .75rem; line-height: 1.45; }
.protocol-content-tabs { display: flex; flex-wrap: wrap; gap: .3rem; padding: .2rem; border-radius: var(--radius-pill); background: rgba(81,102,83,.06); }
.protocol-content-tabs button { min-height: 2.1rem; padding: .42rem .7rem; border: 0; border-radius: var(--radius-pill); color: var(--color-ink-soft); background: transparent; font-size: .72rem; font-weight: 720; cursor: pointer; }
.protocol-content-tabs button[aria-selected="true"] { color: var(--color-sage-deep); background: rgba(255,253,248,.9); box-shadow: 0 .2rem .65rem rgba(66,58,46,.08); }
.protocol-transcript-navigation { display: grid; grid-template-columns: auto minmax(8rem,1fr) auto auto; align-items: center; gap: .45rem; }
.protocol-transcript-navigation[hidden] { display: none; }
.protocol-transcript-navigation > span { overflow: hidden; color: var(--color-ink-soft); font-size: .7rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.protocol-transcript-navigation .text-button { min-height: 2.15rem; height: auto; width: auto; padding: .42rem .62rem; font-size: .7rem; }
.protocol-live-follow { min-height: 2.15rem; padding: .42rem .62rem; border: .0625rem solid rgba(81,102,83,.15); color: var(--color-sage-deep); font-size: .7rem; white-space: nowrap; }
.protocol-live-follow[aria-pressed="false"] { color: var(--color-ink-soft); background: transparent; }
.protocol-transcript-list { display: grid; gap: .55rem; }
.protocol-segment { display: grid; gap: .38rem; padding: .72rem .78rem; border-left: .18rem solid rgba(81,102,83,.58); border-radius: 0 var(--radius-small) var(--radius-small) 0; background: rgba(81,102,83,.045); }
.protocol-segment[data-state="provisional"] { border-left-color: var(--color-amber); background: rgba(243,225,197,.2); }
.protocol-segment > header { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.protocol-segment-speaker { padding: 0; border: 0; color: var(--color-sage-deep); background: transparent; font-size: .75rem; font-weight: 800; text-align: left; cursor: pointer; }
.protocol-segment-speaker:hover, .protocol-segment-speaker:focus-visible { text-decoration: underline; }
.protocol-segment-state { color: var(--color-ink-soft); font-size: .67rem; }
.protocol-segment-meta { display: inline-flex; align-items: center; justify-content: flex-end; gap: .55rem; color: var(--color-ink-soft); font-size: .67rem; }
.protocol-segment-time { font-variant-numeric: tabular-nums; white-space: nowrap; }
.protocol-segment p { margin: 0; white-space: pre-wrap; line-height: 1.48; }
.protocol-segment-actions { display: flex; justify-content: flex-end; gap: .3rem; }
.protocol-segment-actions button { min-height: 1.9rem; padding: .25rem .48rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-pill); color: var(--color-sage-deep); background: rgba(255,253,248,.7); font-size: .68rem; cursor: pointer; }
.protocol-segment-actions button:hover, .protocol-segment-actions button:focus-visible { background: var(--color-sage-soft); }
.protocol-preparation-panel { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: .75rem; padding: .75rem .8rem; border-top: .0625rem solid var(--color-line); border-radius: var(--radius-small); background: rgba(119,139,120,.06); }
.protocol-preparation-panel[hidden] { display: none; }
.protocol-preparation-panel div { display: grid; gap: .18rem; }
.protocol-preparation-panel strong { font-size: .78rem; }
.protocol-preparation-panel p { margin: 0; color: var(--color-ink-soft); font-size: .7rem; line-height: 1.4; }
.protocol-preparation-panel button { justify-content: center; white-space: nowrap; }
.protocol-preparation-panel .protocol-preparation-actions { display: flex; align-items: center; justify-content: flex-end; gap: .35rem; }
.protocol-preparation-actions .text-button { width: auto; min-height: 2.2rem; padding: .4rem .55rem; font-size: .68rem; }
.protocol-preparation-block[data-state="stale"] { border-left-color: #9a6854; background: rgba(154,104,84,.08); }
.protocol-preparation-badge { color: #7b5140; font-weight: 750; }

/* Protocol desktop workspace: transcript first, controls compact and secondary. */
.protocol-layout { grid-template-columns: clamp(15rem,18vw,21rem) minmax(0,1fr); }
.protocol-index { padding: .9rem; }
.protocol-stage { padding: clamp(.85rem,2vw,2rem); }
.protocol-empty { width: min(100%,40rem); gap: .5rem; padding-top: clamp(2rem,8vh,5rem); }
.protocol-empty-mark { width: 2.55rem; }
.protocol-empty h1 { font-size: clamp(2rem,3.4vw,2.8rem); }
.protocol-empty p { font-size: .9rem; }
.protocol-metadata-form { width: min(100%,48rem); }
.protocol-record-view { width: min(100%,110rem); gap: .75rem; }
.protocol-record-heading { align-items: center; padding-inline: .15rem; }
.protocol-record-heading > div { gap: .25rem; }
.protocol-record-heading h1 { font-size: clamp(1.75rem,2.5vw,2.35rem); }
.protocol-record-heading p { font-size: .8rem; }
.protocol-record-grid { display: grid; grid-template-columns: minmax(0,1fr) clamp(19rem,24vw,27rem); grid-template-areas: "main side"; align-items: start; gap: clamp(.75rem,1.6vw,1.5rem); }
.protocol-record-primary { grid-area: main; min-width: 0; }
.protocol-record-sidebar { position: sticky; top: 0; display: grid; grid-area: side; gap: .65rem; min-width: 0; }
.protocol-guidance { width: min(100%,110rem); grid-template-columns: 2.55rem minmax(0,1fr); margin: 0 auto .75rem; padding: .6rem .72rem; }
.protocol-guidance img { width: 2.55rem; }
.protocol-control-card { gap: .7rem; padding: .85rem; border-radius: var(--radius-medium); box-shadow: none; }
.protocol-control-heading { grid-template-columns: 2.15rem minmax(0,1fr); gap: .55rem; }
.protocol-record-mark { width: 2.15rem; }
.protocol-control-heading strong { font-size: .9rem; }
.protocol-control-heading small, .protocol-control-actions small { font-size: .68rem; }
.protocol-meter { min-height: 4.3rem; }
.protocol-meter > span { font-size: .68rem; }
.protocol-health { gap: .35rem; }
.protocol-health div { padding: .5rem .55rem; }
.protocol-health span { font-size: .58rem; }
.protocol-health strong { font-size: .75rem; }
.protocol-control-actions { display: grid; grid-template-columns: auto auto; gap: .4rem; }
.protocol-control-actions small { grid-column: 1 / -1; }
.protocol-control-actions .primary-action { min-height: 2.4rem; padding: .55rem .75rem; font-size: .76rem; }
.protocol-control-actions .text-button { min-height: 2.4rem; padding: .5rem .65rem; font-size: .74rem; }
.protocol-details-card { padding-inline: .8rem; background: rgba(255,253,248,.5); }
.protocol-details-card summary { padding: .65rem 0; }
.protocol-details-card dl { grid-template-columns: minmax(6rem,.75fr) minmax(0,1.25fr); gap: .4rem .55rem; padding-bottom: .75rem; font-size: .72rem; }
.protocol-transcript { min-height: 22rem; padding: clamp(.85rem,1.8vw,1.15rem); background: rgba(255,253,248,.78); }
.protocol-transcript-empty { display: grid; min-height: 22rem; grid-template-columns: auto minmax(0,1fr); align-content: center; justify-content: center; gap: .65rem; padding: 1.2rem; border: .0625rem dashed rgba(81,102,83,.2); border-radius: var(--radius-medium); color: var(--color-ink-soft); background: rgba(255,253,248,.34); }
.protocol-transcript-empty > span { color: var(--color-amber); }
.protocol-transcript-empty div { display: grid; max-width: 28rem; gap: .2rem; }
.protocol-transcript-empty strong { color: var(--color-ink); font-size: .85rem; }
.protocol-transcript-empty p { margin: 0; font-size: .74rem; line-height: 1.4; }

@media (max-width: 68rem) and (min-width: 51.26rem) {
    .protocol-record-grid { grid-template-columns: 1fr; grid-template-areas: "side" "main"; }
    .protocol-record-sidebar { position: static; grid-template-columns: minmax(0,1.6fr) minmax(15rem,1fr); }
    .protocol-control-card { min-width: 0; }
}
.export-trigger { color: var(--color-sage-deep); background: rgba(255,253,248,.62); }
.export-menu { position: absolute; z-index: 25; top: calc(100% - .2rem); right: clamp(1rem,3vw,2.4rem); display: grid; width: min(20rem,calc(100vw - 2rem)); gap: .08rem; padding: .45rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.export-menu-title { padding: .4rem .55rem .5rem; color: var(--color-ink-soft); font-size: .67rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.export-menu button { display: grid; grid-template-columns: 2rem minmax(0,1fr); align-items: center; gap: .6rem; padding: .58rem; border: 0; border-radius: var(--radius-small); color: var(--color-ink); text-align: left; background: transparent; cursor: pointer; }
.export-menu button:hover, .export-menu button:focus-visible { background: var(--color-paper); }
.export-menu button > span:first-child { display: grid; width: 2rem; aspect-ratio: 1; place-items: center; border-radius: .55rem; color: var(--color-sage-deep); background: var(--color-sage-soft); font-size: .84rem; font-weight: 800; }
.export-menu button > span:last-child { display: grid; gap: .1rem; }
.export-menu strong { font-size: .8rem; }
.export-menu small { color: var(--color-ink-soft); font-size: .67rem; }
.latest-button { position: absolute; z-index: 12; right: max(1rem,calc((100% - var(--content-width)) / 2 + 1rem)); bottom: 6.7rem; display: inline-flex; align-items: center; gap: .45rem; padding: .65rem .8rem; border: .0625rem solid rgba(81,102,83,.2); border-radius: var(--radius-pill); color: var(--color-sage-deep); background: rgba(255,253,248,.95); box-shadow: var(--shadow-soft); cursor: pointer; font-size: .75rem; font-weight: 750; }
.latest-button:hover { background: var(--color-surface-solid); }
.welcome-stage { position: relative; display: grid; min-height: 0; place-items: center; overflow: hidden; padding: 2rem 1.25rem 8rem; isolation: isolate; }
.chat-mira-watermark { position: absolute; z-index: -1; inset: 3.6rem 0 0 54%; background-image: linear-gradient(90deg,var(--color-paper) 0%,transparent 48%),linear-gradient(0deg,var(--color-paper) 0%,transparent 42%),var(--mira-portrait); background-position: center,center,55% 20%; background-size: cover,cover,cover; opacity: 0; filter: saturate(.55) sepia(.12); pointer-events: none; transition: opacity var(--duration-normal); mask-image: linear-gradient(90deg,transparent 0%,#000 28%,#000 76%,transparent 100%); }
.conversation.has-messages .chat-mira-watermark { opacity: .12; }
.message-list { position: relative; z-index: 2; width: min(100%,var(--content-width)); min-height: 0; margin: 0 auto; padding: 1.5rem 1rem 10rem; overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-color: rgba(81,102,83,.42) transparent; scrollbar-gutter: stable; scrollbar-width: thin; scroll-behavior: smooth; touch-action: pan-y; -webkit-overflow-scrolling: touch; }
.message-list::-webkit-scrollbar { width: .65rem; }
.message-list::-webkit-scrollbar-track { background: transparent; }
.message-list::-webkit-scrollbar-thumb { border: .18rem solid transparent; border-radius: var(--radius-pill); background: rgba(81,102,83,.42); background-clip: padding-box; }
.message { display: grid; gap: .38rem; margin: 0 0 1.4rem; }
.message-meta { display: flex; align-items: center; gap: .45rem; color: var(--color-ink-soft); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.message-copy { padding: .22rem .42rem; border: .0625rem solid transparent; border-radius: var(--radius-pill); color: var(--color-ink-soft); background: transparent; cursor: pointer; font-size: .64rem; letter-spacing: .02em; text-transform: none; }
.message-copy:hover, .message-copy:focus-visible { border-color: var(--color-line); color: var(--color-sage-deep); background: rgba(255,253,248,.72); }
.message-user { justify-items: end; }
.message-user .message-bubble { max-width: min(72%,65rem); padding: .85rem 1.05rem; border-radius: 1.2rem 1.2rem .3rem 1.2rem; color: #fff; background: var(--color-sage-deep); box-shadow: 0 .5rem 1.5rem rgba(81,102,83,.14); white-space: pre-wrap; line-height: 1.55; }
.message-attachments { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: .65rem; }
.message-attachment { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: .5rem; min-width: min(15rem,100%); max-width: min(24rem,100%); padding: .42rem; overflow: hidden; border: .0625rem solid rgba(255,255,255,.24); border-radius: .75rem; color: inherit; background: rgba(255,255,255,.1); text-decoration: none; }
.message-attachment.is-image { grid-template-columns: 4.2rem minmax(0,1fr); }
.message-attachment img { width: 4.2rem; aspect-ratio: 1.25; border-radius: .48rem; object-fit: cover; }
.attachment-mark { display: grid; width: 2.25rem; aspect-ratio: 1; place-items: center; border-radius: .5rem; background: rgba(255,255,255,.13); }
.attachment-name { overflow: hidden; font-size: .74rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.message-assistant { justify-items: start; }
.assistant-body { position: relative; width: min(100%,96rem); padding: 1rem 1.15rem; border: .0625rem solid rgba(255,255,255,.64); border-radius: .35rem 1.35rem 1.35rem 1.35rem; background: rgba(255,253,248,.79); box-shadow: 0 .625rem 2.25rem rgba(55,50,41,.07); backdrop-filter: blur(.75rem); }
.assistant-read-aloud { position: absolute; z-index: 1; top: .62rem; right: .7rem; display: grid; width: 2.15rem; aspect-ratio: 1; place-items: center; padding: 0; border: .0625rem solid rgba(81,102,83,.18); border-radius: 50%; color: var(--color-sage-deep); background: rgba(255,253,248,.88); box-shadow: 0 .2rem .6rem rgba(55,50,41,.08); cursor: pointer; font-size: .9rem; }
.assistant-read-aloud:hover, .assistant-read-aloud:focus-visible { border-color: rgba(81,102,83,.46); background: var(--color-sage-soft); }
.assistant-read-aloud[data-state="starting"], .assistant-read-aloud[data-state="playing"] { color: #fff; border-color: var(--color-sage-deep); background: var(--color-sage-deep); }
.assistant-body:has(.assistant-read-aloud:not([hidden])) .assistant-content { padding-right: 2.3rem; }
.assistant-status { display: flex; align-items: center; gap: .55rem; padding: .25rem 0; color: var(--color-sage-deep); font-size: .82rem; }
.assistant-status::before { width: .55rem; height: .55rem; border-radius: 50%; background: var(--color-amber); box-shadow: 0 0 0 0 rgba(200,147,77,.35); content: ""; animation: status-pulse 1.6s infinite; }
.assistant-status[data-kind="tool"] { min-height: 2.5rem; padding: .55rem .75rem; border-radius: var(--radius-small); background: rgba(243,225,197,.3); font-weight: 700; }
.assistant-status[data-kind="tool"]::before { flex: 0 0 auto; }
.message-artifact { width: min(100%,96rem); }
.message-document-artifact { width: min(100%,72rem); }
.document-artifact-card { display: grid; grid-template-columns: 2.6rem minmax(0,1fr) auto; align-items: center; gap: .7rem; width: min(100%,44rem); padding: .72rem; border: .0625rem solid rgba(81,102,83,.22); border-radius: var(--radius-medium); background: rgba(255,253,248,.86); box-shadow: 0 .55rem 1.6rem rgba(55,50,41,.07); }
.document-artifact-mark { display: grid; width: 2.6rem; aspect-ratio: 1; place-items: center; border-radius: .7rem; color: var(--color-sage-deep); background: var(--color-sage-soft); font-weight: 800; }
.document-artifact-copy { display: grid; min-width: 0; gap: .12rem; }
.document-artifact-copy strong { overflow: hidden; font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.document-artifact-copy small { color: var(--color-ink-soft); font-size: .7rem; }
.document-artifact-actions { display: flex; align-items: center; gap: .35rem; }
.document-artifact-actions .text-button, .document-artifact-actions .secondary-action { display: inline-flex; width: auto; min-height: 2.35rem; padding: .48rem .62rem; font-size: .7rem; text-decoration: none; }
.artifact-card { width: min(100%,64rem); margin: 0; overflow: hidden; border: .0625rem solid rgba(81,102,83,.2); border-radius: var(--radius-medium); background: rgba(255,253,248,.9); box-shadow: 0 .8rem 2.5rem rgba(55,50,41,.09); }
.artifact-card a { display: block; color: inherit; background: rgba(243,238,228,.58); text-decoration: none; }
.artifact-card img { display: block; width: 100%; max-height: min(70vh,52rem); object-fit: contain; }
.artifact-card figcaption { padding: .65rem .8rem; overflow-wrap: anywhere; color: var(--color-ink-soft); font-size: .72rem; }
.artifact-load-error .artifact-card a::before { display: block; padding: 1rem; color: #843d34; content: "Das Bild konnte nicht geladen werden. Zum erneuten Öffnen anklicken."; }
.artifact-load-error .artifact-card img { display: none; }
.thinking-panel { margin: .15rem 0 .85rem; padding: .65rem .75rem; border-left: .1875rem solid var(--color-amber); border-radius: 0 var(--radius-small) var(--radius-small) 0; color: var(--color-ink-soft); background: rgba(243,225,197,.28); }
.thinking-panel summary { cursor: pointer; color: var(--color-sage-deep); font-size: .78rem; font-weight: 750; }
.thinking-content { max-height: 17rem; overflow: auto; padding-top: .55rem; font-size: .82rem; }
.markdown-body { overflow-wrap: anywhere; line-height: 1.62; }
.markdown-body > :first-child { margin-top: 0; }
.markdown-body > :last-child { margin-bottom: 0; }
.markdown-body p { margin: .25rem 0 .8rem; }
.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4 { margin: 1.25rem 0 .55rem; font-family: var(--font-display); font-weight: 550; line-height: 1.18; }
.markdown-body h1 { font-size: 1.65rem; }.markdown-body h2 { font-size: 1.4rem; }.markdown-body h3 { font-size: 1.18rem; }
.markdown-body ul,.markdown-body ol { margin: .45rem 0 .9rem; padding-left: 1.4rem; }
.markdown-body li + li { margin-top: .3rem; }
.markdown-body a { color: var(--color-sage-deep); text-decoration-thickness: .08em; text-underline-offset: .16em; }
.markdown-body .inline-math { font-family: "Cambria Math", "STIX Two Math", Cambria, serif; white-space: nowrap; }
.markdown-body .math-frac { display: inline-flex; flex-direction: column; margin: 0 .08em; vertical-align: middle; line-height: 1.05; text-align: center; font-size: .9em; }
.markdown-body .math-frac > span:first-child { padding: 0 .16em .05em; border-bottom: .0625rem solid currentColor; }
.markdown-body .math-frac > span:last-child { padding: .05em .16em 0; }
.markdown-body .math-sqrt { display: inline-flex; align-items: flex-start; vertical-align: middle; }
.markdown-body .math-sqrt > span { padding-left: .04em; border-top: .0625rem solid currentColor; }
.markdown-body .source-list { margin: .4rem 0 .65rem; padding-top: .45rem; border-top: .0625rem solid var(--color-line); }
.markdown-body .source-list > strong { display: block; font-size: .82rem; }
.markdown-body .source-list ul { display: grid; gap: .15rem; margin: .35rem 0 0; padding-left: 1.25rem; }
.markdown-body .source-list li + li { margin-top: 0; }
.markdown-body .source-list a { overflow-wrap: anywhere; }
.assistant-documents { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.message-document-link { display: inline-flex; align-items: center; min-height: 2.25rem; max-width: 100%; padding: .45rem .65rem; overflow-wrap: anywhere; border: .0625rem solid rgba(81,102,83,.24); border-radius: var(--radius-small); color: var(--color-sage-deep); background: var(--color-sage-soft); font-size: .76rem; font-weight: 700; text-decoration: none; }
.message-document-link:hover, .message-document-link:focus-visible { border-color: rgba(81,102,83,.45); background: rgba(255,253,248,.92); }
.markdown-body code { padding: .12em .34em; border-radius: .35rem; background: rgba(41,45,43,.075); font-family: ui-monospace,SFMono-Regular,Consolas,monospace; font-size: .88em; }
.markdown-body pre { max-width: 100%; margin: .8rem 0; padding: .9rem; overflow: auto; border-radius: var(--radius-small); color: #f5f3ed; background: #303532; }
.markdown-body pre code { padding: 0; color: inherit; background: transparent; }
.markdown-body blockquote { margin: .7rem 0; padding: .35rem .8rem; border-left: .1875rem solid var(--color-sage); color: var(--color-ink-soft); }
.table-scroll { max-width: 100%; margin: .8rem 0; overflow-x: auto; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); }
.markdown-body table { width: 100%; border-collapse: collapse; background: rgba(255,253,248,.68); font-size: .86rem; }
.markdown-body th,.markdown-body td { padding: .55rem .7rem; border-bottom: .0625rem solid var(--color-line); text-align: left; vertical-align: top; }
.markdown-body th { color: var(--color-sage-deep); background: var(--color-sage-soft); }
.message-error .assistant-body { border-color: rgba(166,79,67,.3); }
.message-error-box { padding: .75rem .85rem; border-radius: var(--radius-small); color: #843d34; background: rgba(166,79,67,.09); line-height: 1.5; }
.is-chat-busy .status-dot { background: var(--color-amber); animation: status-pulse 1.6s infinite; }
@keyframes status-pulse { 50% { box-shadow: 0 0 0 .4375rem rgba(200,147,77,0); opacity: .72; } }
.welcome-stage::before { position: absolute; z-index: -3; width: min(68vw,58rem); aspect-ratio: 1.4; border-radius: 50%; background: radial-gradient(ellipse, rgba(255,253,248,.74), rgba(255,253,248,0) 68%); content: ""; filter: blur(.25rem); }
.mira-presence { position: absolute; z-index: -2; inset: -8% 0 -18% 43%; background-image: linear-gradient(90deg,var(--color-paper) 0%,rgba(246,241,232,.05) 42%), linear-gradient(0deg,var(--color-paper) 0%,transparent 35%), var(--mira-portrait); background-repeat: no-repeat; background-position: center,center,55% 20%; background-size: cover,cover,cover; opacity: .62; filter: saturate(.72) sepia(.08); mask-image: linear-gradient(90deg,transparent 0%,#000 28%,#000 76%,transparent 100%); }
.welcome-card { position: relative; width: min(100%,48rem); margin-right: min(28vw,18rem); padding: clamp(1.35rem,3vw,2.25rem); border: .0625rem solid rgba(255,255,255,.55); border-radius: var(--radius-large); background: linear-gradient(135deg,rgba(255,253,248,.82),rgba(255,253,248,.54)); box-shadow: var(--shadow-soft); backdrop-filter: blur(.9375rem); }
.welcome-close { position: absolute; top: .75rem; right: .75rem; display: grid; width: 2.65rem; aspect-ratio: 1; place-items: center; padding: 0; border: .0625rem solid rgba(81,102,83,.1); border-radius: 50%; color: var(--color-ink-soft); background: rgba(255,253,248,.76); cursor: pointer; font-size: 1.35rem; line-height: 1; }
.welcome-close:hover { color: var(--color-ink); background: var(--color-surface-solid); }
.eyebrow { color: var(--color-sage-deep); font-size: .72rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.welcome-card h1 { max-width: 13ch; margin: .5rem 3rem .7rem 0; font-family: var(--font-display); font-size: clamp(2.15rem,4.6vw,4rem); font-weight: 500; line-height: 1; letter-spacing: -.04em; }
.welcome-card > p { max-width: 37rem; margin: 0; color: var(--color-ink-soft); font-size: clamp(.98rem,1.5vw,1.13rem); line-height: 1.6; }
.suggestion-row { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.1rem; }
.suggestion-row button { padding: .5rem .72rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-pill); color: var(--color-ink-soft); background: rgba(255,253,248,.7); font-size: .78rem; }
.composer-zone { position: absolute; z-index: 10; right: 0; bottom: 0; left: 0; width: min(calc(100% - 2rem),var(--content-width)); margin: 0 auto; padding-bottom: max(.85rem,env(safe-area-inset-bottom)); }
.composer { display: grid; grid-template-columns: minmax(10rem,1fr) auto auto; align-items: end; gap: .8rem; padding: .8rem; border: .0625rem solid rgba(57,61,57,.16); border-radius: 1.45rem; background: rgba(255,253,248,.93); box-shadow: var(--shadow-float); backdrop-filter: blur(1.25rem); }
.pending-files { display: flex; grid-column: 1 / -1; flex-wrap: nowrap; gap: .45rem; padding: .1rem .2rem .25rem; overflow-x: auto; }
.pending-file { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .45rem; max-width: min(100%,20rem); padding: .3rem .38rem; border: .0625rem solid rgba(81,102,83,.16); border-radius: var(--radius-small); color: var(--color-ink-soft); background: var(--color-sage-soft); font-size: .75rem; }
.pending-file > span:not(.pending-file-mark) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pending-file img, .pending-file-mark { display: grid; width: 2.2rem; aspect-ratio: 1; place-items: center; border-radius: .55rem; object-fit: cover; color: var(--color-sage-deep); background: rgba(255,253,248,.7); }
.pending-file button { display: grid; width: 1.65rem; aspect-ratio: 1; place-items: center; padding: 0; border: 0; border-radius: 50%; color: var(--color-ink-soft); background: transparent; cursor: pointer; font-size: 1.05rem; }
.pending-file button:hover { background: rgba(41,45,43,.08); }
.composer textarea { width: 100%; min-height: 2.75rem; max-height: 9rem; resize: none; padding: .73rem .8rem; border: 0; outline: 0; color: var(--color-ink); background: transparent; line-height: 1.35; }
.composer textarea::placeholder { color: #92938d; }
.composer-action { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; padding: .65rem .7rem; border-radius: var(--radius-pill); color: var(--color-ink-soft); background: rgba(41,45,43,.055); font-size: .78rem; font-weight: 650; }
.composer-action[data-tools-trigger].is-active, .round-action[data-tools-trigger].is-active { color: var(--color-sage-deep); background: var(--color-sage-soft); box-shadow: inset 0 0 0 .0625rem rgba(81,102,83,.2); }
.send-button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-width: 5.5rem; min-height: 2.75rem; padding: .65rem .9rem; border-radius: var(--radius-pill); color: white; background: var(--color-sage-deep); font-weight: 750; }
.send-button:disabled { cursor: default; opacity: .42; }
.composer-meta { display: flex; justify-content: center; gap: .8rem; padding: .6rem 1rem 0; color: var(--color-ink-soft); font-size: .68rem; }
.speech-meter { min-height: 3.2rem; overflow: hidden; border: .0625rem solid rgba(81,102,83,.14); border-radius: var(--radius-small); background: linear-gradient(180deg,rgba(119,139,120,.08),rgba(119,139,120,.025)); }
.speech-meter canvas { display: block; width: 100%; height: 3.2rem; }
.speech-rail { position: relative; z-index: 8; display: grid; grid-area: speech; gap: .55rem; width: min(calc(100% - 2rem),var(--content-width)); max-height: min(35dvh,18rem); margin: .65rem auto 0; padding: .7rem .8rem; overflow-x: hidden; overflow-y: auto; border: .0625rem solid rgba(81,102,83,.2); border-radius: var(--radius-medium); background: rgba(255,253,248,.88); box-shadow: var(--shadow-soft); backdrop-filter: blur(1rem); }
.speech-rail[data-speech-view="dictation-decision"] { max-height: none; overflow: visible; }
.speech-rail-heading { display: grid; grid-template-columns: 2rem minmax(0,1fr) auto; align-items: center; gap: .65rem; }
.speech-mode-mark { display: grid; width: 2rem; aspect-ratio: 1; place-items: center; border-radius: 50%; color: var(--color-sage-deep); background: var(--color-sage-soft); font-weight: 800; }
.speech-rail-copy { display: grid; min-width: 0; gap: .04rem; }
.speech-rail-copy .eyebrow { font-size: .6rem; }
.speech-rail-copy strong { overflow: hidden; font-size: .86rem; text-overflow: ellipsis; white-space: nowrap; }
.speech-rail-copy small { overflow: hidden; color: var(--color-ink-soft); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.speech-interrupt { min-height: 2.3rem; padding: .5rem .7rem; white-space: nowrap; }
.speech-rail .speech-meter { min-height: 2.15rem; border-radius: .65rem; }
.speech-rail .speech-meter canvas { height: 2.15rem; }
.speech-live-text { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: baseline; gap: .25rem .65rem; min-width: 0; padding: .45rem .6rem; border-radius: .7rem; background: rgba(119,139,120,.07); }
.speech-live-text > span { color: var(--color-sage-deep); font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.speech-live-text p { min-width: 0; margin: 0; overflow: hidden; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.speech-live-text small { grid-column: 2; color: var(--color-sage-deep); font-style: italic; }
.speech-live-text-compact { padding-block: .38rem; }
.voice-ptt-controls { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .45rem .6rem; border-radius: .7rem; background: rgba(119,139,120,.09); }
.voice-ptt-controls .eyebrow { color: var(--color-sage-deep); font-size: .62rem; }
.voice-ptt-controls button { min-height: 2.35rem; padding-inline: 1rem; touch-action: none; }
.voice-ptt-controls button[aria-pressed="true"] { color: #fff; background: var(--color-sage-deep); box-shadow: inset 0 0 0 .12rem rgba(255,255,255,.3); }
#dictation-live { align-items: start; }
#dictation-live p { max-height: min(10.5em,22dvh); overflow-wrap: anywhere; overflow-y: auto; scrollbar-width: thin; text-overflow: clip; white-space: pre-wrap; }
.dictation-question { display: grid; width: min(100%,72rem); grid-template-columns: 3.25rem minmax(0,1fr); align-items: center; gap: .65rem .8rem; margin-inline: auto; }
.dictation-question-portrait { width: 3.25rem; aspect-ratio: 1; border: .12rem solid rgba(255,253,248,.95); border-radius: 50%; background-image: var(--mira-portrait); background-position: 50% 20%; background-size: 155%; box-shadow: 0 .4rem 1rem rgba(66,58,46,.14); }
.dictation-question-copy { display: grid; gap: .08rem; }
.dictation-question-copy strong { font-family: var(--font-display); font-size: 1.12rem; font-weight: 550; }
.dictation-question-copy small { color: var(--color-ink-soft); font-size: .68rem; }
.dictation-question textarea { grid-column: 1 / -1; width: 100%; min-height: 4.6rem; max-height: min(14em,30dvh); field-sizing: content; resize: vertical; padding: .65rem .75rem; overflow-y: auto; border: .0625rem solid var(--color-line); border-radius: .7rem; color: var(--color-ink); background: var(--color-paper); line-height: 1.45; }
.dictation-question-actions { display: flex; grid-column: 1 / -1; justify-content: flex-end; gap: .45rem; }
.dictation-question-actions button { min-width: 3.8rem; justify-content: center; }
.dictation-question-actions .secondary-action { width: auto; }
.dictation-question-actions .dictation-discard { margin-right: auto; }
.speech-menu { position: absolute; z-index: 18; right: 6.8rem; bottom: 6.3rem; display: grid; width: min(22rem,calc(100vw - 2rem)); padding: .4rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.speech-menu button { display: grid; grid-template-columns: 2.25rem minmax(0,1fr); align-items: center; gap: .65rem; padding: .62rem; border: 0; border-radius: var(--radius-small); color: var(--color-ink); text-align: left; background: transparent; cursor: pointer; }
.speech-menu button:hover, .speech-menu button:focus-visible { background: var(--color-paper); }
.speech-menu button > span:first-child { display: grid; aspect-ratio: 1; place-items: center; border-radius: .6rem; color: var(--color-sage-deep); background: var(--color-sage-soft); }
.speech-menu button > span:last-child { display: grid; gap: .08rem; }
.speech-menu small { color: var(--color-ink-soft); font-size: .67rem; }
.tool-menu { position: absolute; z-index: 18; right: 6.8rem; bottom: 6.3rem; display: grid; width: min(24rem,calc(100vw - 2rem)); gap: .35rem; padding: .7rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.tool-menu-heading { display: flex; align-items: start; justify-content: space-between; gap: .5rem; padding: .22rem .3rem .45rem; }
.tool-menu-heading > div { display: grid; gap: .1rem; }
.tool-menu-heading strong { font-size: .94rem; }
.tool-menu-close { display: grid; flex: 0 0 auto; width: 1.65rem; aspect-ratio: 1; place-items: center; margin: -.1rem -.1rem 0 0; border: 0; border-radius: 50%; color: var(--color-ink-soft); background: transparent; font-size: 1.2rem; line-height: 1; cursor: pointer; }
.tool-menu-close:hover, .tool-menu-close:focus-visible { color: var(--color-ink); background: var(--color-paper); }
.composer-menu-heading { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .2rem .3rem .3rem; color: var(--color-ink-soft); font-size: .78rem; }
.composer-menu-close { display: grid !important; grid-template-columns: none !important; flex: 0 0 auto; width: 1.65rem; aspect-ratio: 1; place-items: center; margin: -.1rem -.1rem 0 0; padding: 0 !important; border: 0; border-radius: 50%; color: var(--color-ink-soft); background: transparent; font-size: 1.2rem; line-height: 1; cursor: pointer; }
.composer-menu-close:hover, .composer-menu-close:focus-visible { color: var(--color-ink); background: var(--color-paper); }
.tool-choice { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; gap: .62rem; padding: .62rem; border-radius: var(--radius-small); cursor: pointer; }
.tool-choice:hover, .tool-choice:focus-within { background: var(--color-paper); }
.tool-choice input { width: 1.05rem; height: 1.05rem; margin: .16rem 0 0; accent-color: var(--color-sage-deep); }
.tool-choice > span { display: grid; gap: .12rem; }
.tool-choice strong { font-size: .82rem; }
.tool-choice small { color: var(--color-ink-soft); font-size: .7rem; line-height: 1.38; }
.tool-choice input:disabled + span { opacity: .56; }
.tool-protocol-action { display: grid; grid-template-columns: 1.85rem minmax(0,1fr); align-items: center; gap: .62rem; width: 100%; padding: .62rem; border: .0625rem solid rgba(81,102,83,.17); border-radius: var(--radius-small); text-align: left; color: var(--color-sage-deep); background: rgba(119,139,120,.08); cursor: pointer; }
.tool-protocol-action:hover, .tool-protocol-action:focus-visible { background: var(--color-sage-soft); }
.tool-protocol-action > span:first-child { display: grid; width: 1.85rem; aspect-ratio: 1; place-items: center; border-radius: .55rem; background: rgba(255,253,248,.78); font-weight: 800; }
.tool-protocol-action > span:last-child { display: grid; gap: .1rem; }
.tool-protocol-action strong { font-size: .82rem; }
.tool-protocol-action small { color: var(--color-ink-soft); font-size: .69rem; line-height: 1.35; }
.tool-country { display: grid; grid-template-columns: minmax(0,1fr) minmax(8.5rem,11rem); align-items: center; gap: .6rem; padding: .5rem .62rem .2rem; color: var(--color-ink-soft); font-size: .73rem; }
.tool-country select { min-width: 0; min-height: 2.35rem; padding: .42rem .55rem; border: .0625rem solid var(--color-line); border-radius: .65rem; color: var(--color-ink); background: var(--color-paper); }
.tool-country select:disabled { cursor: not-allowed; opacity: .5; }
[data-stage-two-action="voice"].is-active { color: #fff; background: var(--color-sage-deep); box-shadow: 0 .45rem 1.15rem rgba(81,102,83,.2); }
.mobile-speech-label { display: none; }
.app-shell.is-dictating .composer textarea,
.app-shell.is-dictating .composer button:not([data-stage-two-action="voice"]) { opacity: .4; pointer-events: none; }
.quiet-link { padding: 0; color: var(--color-sage-deep); background: transparent; }
.runtime-info { position: absolute; right: 0; bottom: 3.15rem; max-width: min(28rem,calc(100vw - 2rem)); padding: .8rem 1rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); color: var(--color-ink-soft); background: var(--color-surface-solid); box-shadow: var(--shadow-soft); font-size: .75rem; line-height: 1.55; }
.upload-menu { position: absolute; z-index: 15; right: 6.9rem; bottom: 6.3rem; display: grid; width: min(21rem,calc(100vw - 2rem)); padding: .45rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-medium); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.upload-menu button { display: grid; grid-template-columns: 2.3rem 1fr; align-items: center; gap: .7rem; padding: .65rem; border: 0; border-radius: var(--radius-small); text-align: left; color: var(--color-ink); background: transparent; cursor: pointer; }
.upload-menu button:hover, .upload-menu button:focus-visible { background: var(--color-paper); }
.upload-menu button > span:first-child { display: grid; aspect-ratio: 1; place-items: center; border-radius: .65rem; color: var(--color-sage-deep); background: var(--color-sage-soft); }
.upload-menu button > span:last-child { display: grid; gap: .14rem; }
.upload-menu small { color: var(--color-ink-soft); font-size: .68rem; }
.upload-status-overlay { position: fixed; z-index: 70; inset: 0; display: grid; place-items: center; padding: 1rem; pointer-events: none; background: rgba(248,244,236,.52); opacity: 0; visibility: hidden; transition: opacity var(--duration-normal),visibility var(--duration-normal); backdrop-filter: blur(.16rem); }
.upload-status-overlay.is-visible { opacity: 1; visibility: visible; }
.upload-status-card { display: grid; width: min(34rem,100%); grid-template-columns: 5.7rem minmax(0,1fr); align-items: center; gap: 1rem; padding: 1.05rem 1.15rem; border: .0625rem solid rgba(81,102,83,.24); border-radius: var(--radius-large); color: var(--color-ink); background: rgba(255,253,248,.96); box-shadow: var(--shadow-float); transform: translateY(.65rem) scale(.985); transition: transform var(--duration-normal) var(--ease-out),border-color var(--duration-normal),box-shadow var(--duration-normal); }
.upload-status-overlay.is-visible .upload-status-card { transform: translateY(0) scale(1); }
.upload-status-card[data-upload-state="success"] { border-color: rgba(81,102,83,.42); box-shadow: 0 1.4rem 4rem rgba(81,102,83,.18); }
.upload-status-card[data-upload-state="error"] { border-color: rgba(166,79,67,.38); box-shadow: 0 1.4rem 4rem rgba(132,61,52,.15); }
.upload-status-portrait-wrap { position: relative; display: grid; width: 5.7rem; aspect-ratio: 1; place-items: center; }
.upload-status-portrait { position: relative; z-index: 1; width: 4.8rem; aspect-ratio: 1; border: .16rem solid rgba(255,253,248,.94); border-radius: 50%; background-image: var(--mira-portrait); background-position: 50% 20%; background-size: 155%; box-shadow: 0 .65rem 1.5rem rgba(66,58,46,.18); }
.upload-status-ring { position: absolute; inset: .25rem; border: .12rem solid rgba(200,147,77,.42); border-radius: 50%; box-shadow: 0 0 0 0 rgba(200,147,77,.2); }
.upload-status-card[data-upload-state="busy"] .upload-status-portrait { animation: upload-breathe 1.8s ease-in-out infinite; }
.upload-status-card[data-upload-state="busy"] .upload-status-ring { animation: upload-pulse 1.7s ease-out infinite; }
.upload-status-card[data-upload-state="success"] .upload-status-ring { border-color: rgba(81,102,83,.5); box-shadow: 0 0 0 .45rem rgba(81,102,83,.1); }
.upload-status-card[data-upload-state="error"] .upload-status-ring { border-color: rgba(166,79,67,.5); box-shadow: 0 0 0 .45rem rgba(166,79,67,.09); }
.upload-status-content { display: grid; min-width: 0; gap: .3rem; }
.upload-status-kicker { color: var(--color-sage-deep); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.upload-status-content strong { font-family: var(--font-display); font-size: 1.35rem; font-weight: 550; }
.upload-status-text { color: var(--color-ink); font-size: .88rem; line-height: 1.45; overflow-wrap: anywhere; }
.upload-status-meta { min-height: 1.2em; color: var(--color-ink-soft); font-size: .72rem; line-height: 1.4; overflow-wrap: anywhere; }
.upload-status-card[data-upload-state="error"] .upload-status-meta { color: #843d34; }
.upload-status-content progress { width: 100%; height: .38rem; margin-top: .25rem; accent-color: var(--color-sage-deep); }
@keyframes upload-breathe { 50% { transform: scale(1.035); } }
@keyframes upload-pulse { 70% { box-shadow: 0 0 0 .7rem rgba(200,147,77,0); } 100% { box-shadow: 0 0 0 0 rgba(200,147,77,0); } }
.is-uploading [data-upload-trigger] { opacity: .48; pointer-events: none; }
.mobile-actions { display: none; }
.session-drawer { position: absolute; z-index: 25; top: 0; bottom: 0; left: 0; width: min(24rem,calc(100vw - 3rem)); padding: 1.35rem; border-right: .0625rem solid var(--color-line); background: rgba(255,253,248,.96); box-shadow: var(--shadow-float); transform: translateX(-105%); transition: transform var(--duration-normal) var(--ease-out); backdrop-filter: blur(1.375rem); }
.app-shell.is-session-open .session-drawer { transform: translateX(0); }
.drawer-header, .panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.drawer-header h2, .panel-heading h2 { margin: .25rem 0 0; font-family: var(--font-display); font-size: 1.55rem; font-weight: 500; }
.search-field { display: flex; align-items: center; gap: .5rem; margin-top: 1rem; padding: .15rem .75rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-pill); color: var(--color-ink-soft); background: rgba(41,45,43,.035); }
.search-field input { width: 100%; padding: .65rem 0; border: 0; outline: 0; background: transparent; }
.session-controls { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: .4rem; margin: .65rem 0; color: var(--color-ink-soft); font-size: .72rem; }
.session-controls select { max-width: 9rem; padding: .45rem .55rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); color: var(--color-ink-soft); background: var(--color-paper); font-size: .72rem; }
.session-refresh { width: 2.25rem; font-size: 1rem; }
.session-list { display: grid; gap: .38rem; max-height: calc(100% - 8.25rem); padding: .1rem .15rem 1.25rem; overflow-y: auto; }
.session-item { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .3rem; padding: .62rem .68rem; border: .0625rem solid transparent; border-radius: .9rem; background: rgba(246,241,232,.7); }
.session-item:hover { border-color: var(--color-line); background: var(--color-paper); }
.session-item.is-current { border-color: rgba(81,102,83,.3); background: var(--color-sage-soft); }
.session-open { min-width: 0; padding: 0; border: 0; text-align: left; background: transparent; cursor: pointer; }
.session-title { display: block; overflow: hidden; color: var(--color-ink); font-size: .86rem; font-weight: 720; text-overflow: ellipsis; white-space: nowrap; }
.session-meta { display: block; margin-top: .2rem; color: var(--color-ink-soft); font-size: .67rem; }

@media (min-width: 51.3125rem) {
    body { font-family: "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif; }
    .primary-action, .secondary-action { font-weight: 600; }
    .message-meta, .eyebrow, .upload-status-kicker, .speech-mode-mark, .speech-live-text > span { font-weight: 700; }
    .thinking-panel summary, .send-button, .field-stack, .account-field { font-weight: 600; }
    .composer-action, .stage-toast { font-weight: 600; }
    .session-title { font-weight: 600; }
}
.session-menu { position: relative; }
.session-menu summary { display: grid; width: 2rem; aspect-ratio: 1; place-items: center; border-radius: 50%; color: var(--color-ink-soft); cursor: pointer; list-style: none; }
.session-menu summary::-webkit-details-marker { display: none; }
.session-menu[open] summary { background: rgba(41,45,43,.08); }
.session-menu-actions { position: absolute; z-index: 4; top: 2.15rem; right: 0; display: grid; width: 11.5rem; padding: .35rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); background: var(--color-surface-solid); box-shadow: var(--shadow-soft); }
.session-menu-actions button { padding: .6rem .7rem; border: 0; border-radius: .55rem; text-align: left; background: transparent; cursor: pointer; }
.session-menu-actions button:hover { background: var(--color-paper); }
.session-menu-actions .danger { color: #843d34; }
.session-placeholder { display: grid; place-items: center; margin-top: 4rem; padding: 1.5rem; color: var(--color-ink-soft); text-align: center; }
.session-placeholder-mark { display: grid; width: 3.2rem; aspect-ratio: 1; place-items: center; margin-bottom: .9rem; border-radius: 50%; color: var(--color-sage-deep); background: var(--color-sage-soft); }
.session-placeholder p { margin: .35rem 0; font-size: .85rem; }
.drawer-scrim { position: absolute; z-index: 20; inset: 0; border: 0; background: rgba(41,40,35,.2); opacity: 0; pointer-events: none; transition: opacity var(--duration-normal); backdrop-filter: blur(.125rem); }
.app-shell.is-session-open .drawer-scrim { opacity: 1; pointer-events: auto; }
.floating-panel { position: fixed; z-index: 40; top: calc(var(--header-height) - .2rem); right: clamp(1rem,3vw,2.4rem); width: min(23rem,calc(100vw - 2rem)); padding: 1.25rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-large); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.floating-panel p { color: var(--color-ink-soft); font-size: .88rem; line-height: 1.55; }
.account-menu-actions { display: grid; gap: .6rem; }
.account-menu-actions .primary-action { justify-content: center; }
.account-logout { width: 100%; justify-content: center; color: #843d34; }
.field-stack { display: grid; gap: .45rem; margin-top: 1rem; color: var(--color-ink-soft); font-size: .75rem; font-weight: 750; }
.field-stack select { width: 100%; min-height: 2.8rem; padding: .6rem .75rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); color: var(--color-ink); background: var(--color-paper); }
.field-note { margin: .55rem 0 1rem; font-size: .74rem !important; }
.switch-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem; border-radius: var(--radius-small); background: var(--color-paper); }
.switch-row > span { display: grid; gap: .15rem; }
.switch-row small { color: var(--color-ink-soft); font-size: .7rem; }
.switch-row input { width: 1.2rem; height: 1.2rem; accent-color: var(--color-sage-deep); }
.model-info-state { margin-top: .8rem; padding: .7rem .8rem; border-radius: var(--radius-small); color: var(--color-ink-soft); background: rgba(119,139,120,.09); font-size: .75rem; line-height: 1.45; }
.info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; margin-top: 1rem; }
.info-grid div { display: grid; gap: .25rem; padding: .75rem; border-radius: var(--radius-small); background: var(--color-paper); }
.info-grid span { color: var(--color-ink-soft); font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; }
.info-grid strong { font-size: .82rem; }
.stage-toast { position: fixed; z-index: 60; left: 50%; bottom: 7.6rem; max-width: min(32rem,calc(100vw - 2rem)); padding: .75rem 1rem; border: .0625rem solid rgba(81,102,83,.18); border-radius: var(--radius-pill); color: var(--color-sage-deep); background: rgba(255,253,248,.96); box-shadow: var(--shadow-soft); transform: translateX(-50%); font-size: .8rem; font-weight: 650; }
.session-dialog { width: min(32rem,calc(100% - 2rem)); padding: 0; border: .0625rem solid var(--color-line); border-radius: var(--radius-large); color: var(--color-ink); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.session-dialog::backdrop { background: rgba(41,40,35,.3); backdrop-filter: blur(.125rem); }
.session-dialog form { padding: 1.25rem; }
.session-dialog p { color: var(--color-ink-soft); line-height: 1.5; }
.session-dialog textarea { width: 100%; min-height: 7rem; resize: vertical; padding: .75rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); color: var(--color-ink); background: var(--color-paper); line-height: 1.5; }
.session-dialog select { width: 100%; min-height: 3rem; padding: .65rem .75rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); color: var(--color-ink); background: var(--color-paper); }
.protocol-edit-dialog[data-kind="speaker"] textarea { min-height: 3.2rem; resize: none; }
.account-dialog { width: min(34rem,calc(100% - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; overflow-x: hidden; overflow-y: auto; border: .0625rem solid var(--color-line); border-radius: var(--radius-large); color: var(--color-ink); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.account-dialog-wide { width: min(46rem,calc(100% - 2rem)); }
.account-dialog::backdrop { background: rgba(41,40,35,.38); backdrop-filter: blur(.16rem); }
.account-dialog form { display: grid; gap: .85rem; padding: 1.35rem; }
.mira-dialog-heading { display: grid; grid-template-columns: 4.6rem minmax(0,1fr); align-items: center; gap: 1rem; padding-bottom: .55rem; border-bottom: .0625rem solid var(--color-line); }
.mira-dialog-portrait { width: 4.6rem; aspect-ratio: 1; border: .14rem solid rgba(255,253,248,.94); border-radius: 50%; background-image: var(--mira-portrait); background-position: 50% 20%; background-size: 155%; box-shadow: 0 .55rem 1.35rem rgba(66,58,46,.16); }
.mira-dialog-heading h2 { margin: .18rem 0 0; font-family: var(--font-display); font-size: clamp(1.55rem,3vw,2rem); font-weight: 500; }
.mira-dialog-heading p { margin: .35rem 0 0; color: var(--color-ink-soft); font-size: .82rem; line-height: 1.45; }
.account-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem 1rem; }
.account-field { display: grid; min-width: 0; gap: .4rem; color: var(--color-ink-soft); font-size: .75rem; font-weight: 750; }
.account-field input, .account-field select, .account-field textarea { width: 100%; min-height: 2.8rem; padding: .65rem .75rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); color: var(--color-ink); background: var(--color-paper); }
.account-field textarea { min-height: 12rem; resize: vertical; line-height: 1.5; }
.account-field input[readonly] { color: var(--color-ink-soft); background: rgba(41,45,43,.045); }
.profile-read-aloud { grid-column: 1 / -1; }
.profile-tts-note { grid-column: 1 / -1; margin: -.25rem 0 0; color: var(--color-ink-soft); font-size: .72rem; line-height: 1.4; }
.password-field { display: grid; grid-template-columns: minmax(0,1fr) 2.8rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); background: var(--color-paper); }
.password-field input { border: 0; background: transparent; }
.password-field button { border: 0; border-radius: 0 var(--radius-small) var(--radius-small) 0; color: var(--color-ink-soft); background: transparent; cursor: pointer; }
.password-field button[aria-pressed="true"] { color: var(--color-sage-deep); background: var(--color-sage-soft); }
.profile-unlock { margin-top: .7rem; }
.dialog-hint { margin: -.15rem 0 0; color: var(--color-ink-soft); font-size: .72rem; line-height: 1.45; }
.dialog-error { padding: .7rem .8rem; border: .0625rem solid rgba(166,79,67,.24); border-radius: var(--radius-small); color: #843d34; background: rgba(166,79,67,.08); font-size: .78rem; line-height: 1.45; }
.account-dialog form[aria-busy="true"] { cursor: progress; }
.dialog-actions { display: flex; justify-content: flex-end; gap: .55rem; margin-top: 1rem; }
.dialog-actions .primary-action { border: 0; }
.dialog-actions .danger-action { background: #843d34; }
.camera-dialog { width: min(46rem,calc(100% - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; overflow: auto; border: .0625rem solid var(--color-line); border-radius: var(--radius-large); color: var(--color-ink); background: var(--color-surface-solid); box-shadow: var(--shadow-float); }
.camera-dialog::backdrop { background: rgba(41,40,35,.48); backdrop-filter: blur(.2rem); }
.camera-dialog > section { padding: 1.15rem; }
.camera-dialog p { margin: .55rem 0 .85rem; color: var(--color-ink-soft); }
.camera-device { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: .7rem; margin-bottom: .7rem; color: var(--color-ink-soft); font-size: .75rem; font-weight: 700; }
.camera-device select { min-height: 2.5rem; padding: .45rem .65rem; border: .0625rem solid var(--color-line); border-radius: var(--radius-small); color: var(--color-ink); background: var(--color-paper); }
.camera-viewport { display: grid; min-height: min(55dvh,27rem); overflow: hidden; place-items: center; border-radius: var(--radius-medium); color: var(--color-ink-soft); background: #272b29; }
.camera-viewport video, .camera-viewport img { width: 100%; height: min(55dvh,27rem); object-fit: contain; }
.camera-error { max-width: 30rem; padding: 1.5rem; color: #fff; text-align: center; line-height: 1.55; }
