:root {
    color-scheme:light;
    --accent:#245f9e;
    --focus:#357bc0;
    --surface:#e8ebef;
    --ink:#202124;
    --muted:#60646b;
    --line:#d9dce0;
    --paper:#f3f4f5
}

[data-theme="dark"] {
    color-scheme: dark;
    --accent: #91c2f3;
    --focus: #91c2f3;
    --surface: #303339;
    --ink: #eceef1;
    --muted: #b7bbc3;
    --line: #44474e;
    --paper: #18191c;
}
[data-theme="dark"] .header, [data-theme="dark"] .card,
[data-theme="dark"] .patient-banner, [data-theme="dark"] .record-table,
[data-theme="dark"] .skip, [data-theme="dark"] footer,
[data-theme="dark"] .check { background: #232529; }
[data-theme="dark"] input, [data-theme="dark"] select,
[data-theme="dark"] .encounter-form input:not([type=hidden]),
[data-theme="dark"] .encounter-form select { background: #1c1e22; color: var(--ink); border-color: #646973; }
[data-theme="dark"] .badge, [data-theme="dark"] th,
[data-theme="dark"] .save-message { background: #303339; border-color: #555b65; }
[data-theme="dark"] tbody tr:hover { background: #2b2e34; }
[data-theme="dark"] .notice { background: #303339; color: var(--ink); }
[data-theme="dark"] .error { color: #ffb7ad; }
[data-theme="dark"] .primary { background: #91c2f3; color: #102b45; }
[data-theme="dark"] .primary:hover { background: #b4d7fa; }
[data-theme="dark"] .card-bottom { background: #292c31; }

.activity-filter { display: flex; gap: 1.5rem; align-items: end; flex-wrap: wrap; }
.account-search { margin-bottom: 1.5rem; }
.activity-filter input { display: block; padding: .65rem; border: 1px solid var(--line); border-radius: .4rem; font: inherit; }
.activity-table { overflow-x: auto; margin-top: 1.5rem; }
.activity-table table { width: 100%; border-collapse: collapse; }
.header-right { flex-wrap: wrap; }

* {
    box-sizing:border-box
}

body {
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font:16px/1.6 "Century Gothic","Segoe UI",Arial,sans-serif
}

a {
    color:var(--accent)
}

button,input {
    font:inherit
}

button {
    cursor:pointer
}

button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {
    outline:3px solid var(--focus);
    outline-offset:4px
}

.skip {
    position:absolute;
    left:16px;
    top:-70px;
    padding:12px;
    background:white;
    z-index:9
}

.skip:focus {
    top:8px
}

.header {
    min-height:100px;
    padding:22px 5%;
    background:white;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px
}

.identity {
    display:flex;
    align-items:center;
    gap:14px;
    text-decoration:none;
    color:var(--ink)
}

.identity img {
    width:54px;
    height:54px
}

.identity strong {
    display:block;
    font-size:24px;
    letter-spacing:-.7px
}

.identity b {
    color:#1a5632
}

.identity small {
    display:block;
    font-size:11px;
    letter-spacing:1px;
    color:var(--muted)
}

.header-right {
    display:flex;
    align-items:center;
    gap:20px
}

.badge {
    display:inline-block;
    font-size:11px;
    letter-spacing:.7px;
    font-weight:bold;
    text-transform:uppercase;
    border:1px solid #d9dce0;
    border-radius:30px;
    padding:7px 13px;
    background:#eceef0;
    white-space:nowrap
}

main {
    min-height:calc(100vh - 180px)
}

.entry {
    max-width:1210px;
    margin:0 auto;
    padding:88px 35px;
    display:grid;
    grid-template-columns:1.15fr 1fr;
    align-items:center;
    gap:100px
}

.eyebrow {
    text-transform:uppercase;
    font-size:11px;
    font-weight:bold;
    letter-spacing:1.7px;
    color:var(--accent);
    margin:0 0 18px
}

h1,h2 {
    font-weight:600;
    line-height:1.18;
    letter-spacing:-1px
}

h1 {
    font-size:44px;
    margin:0 0 22px
}

.intro h1 {
    font-size:54px
}

.lede {
    font-size:19px;
    line-height:1.7;
    color:var(--muted)
}

p {
    color:var(--muted)
}

.rule {
    height:3px;
    width:45px;
    background:var(--line);
    margin:30px 0
}

.card {
    background:white;
    border:1px solid var(--line);
    border-radius:12px;
    padding:34px
}

.entry-card {
    box-shadow:0 12px 42px #00000008
}

.card h2 {
    font-size:25px;
    margin:0 0 15px
}

.notice {
    border-left:3px solid var(--accent);
    background:#eceef0;
    padding:16px 18px;
    font-size:14px;
    color:var(--ink);
    margin:25px 0
}

.primary {
    display:inline-block;
    text-decoration:none;
    border:0;
    border-radius:6px;
    background:var(--accent);
    color:white;
    padding:8px 14px;
    font-weight:bold;
    font-size:13px
}

.primary:hover {
    background:#194b80
}

.wide {
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center
}

.fine {
    font-size:12px;
    margin:14px 0;
    color:var(--muted)
}

.card-bottom {
    border-top:1px solid var(--line);
    margin-top:27px;
    padding-top:23px;
    font-size:13px
}

.card-bottom p {
    margin-bottom:0
}

.consent {
    max-width:650px;
    margin:55px auto;
    padding:42px
}

.consent h1 {
    font-size:36px
}

.check {
    display:flex;
    gap:15px;
    padding:22px;
    background:#f3f4f5;
    border:1px solid var(--line);
    border-radius:6px;
    margin:28px 0;
    cursor:pointer;
    font-size:14px
}

.check input {
    width:20px;
    height:20px;
    flex-shrink:0;
    accent-color:var(--accent);
    margin-top:3px
}

.error {
    color:#a12323;
    font-size:14px
}

.quiet {
    font-weight:bold;
    text-decoration:none;
    border:0;
    background:none;
    color:var(--accent);
    font-size:13px
}

.workspace {
    max-width:1240px;
    margin:auto;
    padding:50px 35px
}

.workspace-title {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px
}

.workspace h1 {
    font-size:32px
}

.module-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
    margin-top:28px
}

.module {
    padding:26px
}

.module h2 {
    font-size:20px;
    margin:20px 0 10px
}

.module p {
    font-size:14px
}

.module-status {
    font-size:11px;
    color:var(--muted);
    border:1px solid var(--line);
    border-radius:4px;
    padding:4px 8px
}

footer {
    padding:24px 5%;
    border-top:1px solid var(--line);
    font-size:11px;
    color:var(--muted);
    display:flex;
    justify-content:space-between;
    gap:20px;
    background:white
}

@media(max-width:850px) {
    .entry {
    gap:35px;
    padding:45px 25px
}

.intro h1 {
    font-size:40px
}

.module-grid {
    grid-template-columns:repeat(2,1fr)
}


}

@media(max-width:620px) {
    .header {
    align-items:flex-start;
    padding:18px
}

.identity strong {
    font-size:20px
}

.identity img {
    width:43px;
    height:43px
}

.identity small {
    font-size:9px
}

.header-right {
    flex-direction:column;
    gap:8px
}

.badge {
    font-size:9px;
    padding:5px 8px
}

.entry {
    grid-template-columns:1fr;
    gap:25px;
    padding:35px 20px
}

.intro h1 {
    font-size:38px
}

.intro .rule,.intro .rule+p {
    display:none
}

.card {
    padding:25px
}

.consent {
    margin:25px 16px
}

.consent h1 {
    font-size:30px
}

.workspace {
    padding:30px 20px
}

.workspace-title {
    display:block
}

.module-grid {
    grid-template-columns:1fr
}

footer {
    flex-direction:column;
    gap:4px
}


}

/* Patient directory and shared chart */
.back-link { display: inline-block; margin-bottom: 26px; font-size: 14px; text-decoration: none; }
.patient-search { display: flex; flex-wrap: wrap; align-items: end; gap: 24px; margin: 32px 0 36px; }
.patient-search > div { flex: 1; max-width: 560px; }
.patient-search > .birthdate-filter { flex: 0 1 220px; }
.patient-search label, .field-label { display: block; font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.patient-search input { width: 100%; padding: 13px 16px; border: 1px solid #adb2ba; border-radius: 6px; background: white; }
.patient-search > a { padding: 12px 0; }
.record-table { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; background: white; }
table { border-collapse: collapse; width: 100%; font-size: 14px; }
caption { padding: 18px 22px; text-align: left; font-size: 12px; color: var(--muted); }
th { background: #eceef0; color: var(--ink); text-align: left; font-size: 12px; }
th, td { padding: 17px 22px; border-bottom: 1px solid var(--line); white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #f6f7f8; }
td a { font-weight: bold; text-underline-offset: 4px; }
.digits, .patient-code { font-variant-numeric: tabular-nums; letter-spacing: 2px; }
.empty-state { text-align: center; padding: 35px 10px; white-space: normal; }
.empty-state h2 { font-size: 20px; }
.pager { display: flex; justify-content: center; gap: 25px; margin-top: 25px; font-size: 14px; }
.patient-banner { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 28px 32px; border: 1px solid var(--line); border-left: 5px solid var(--accent); border-radius: 8px; background: white; margin-bottom: 25px; }
.patient-banner h1 { margin-bottom: 10px; }
.patient-banner p:last-child { margin-bottom: 0; }
.patient-code { font-size: 27px; }
.chart-grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: 22px; }
.details { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; font-size: 14px; margin-bottom: 0; }
.details dt { color: var(--muted); }
.details dd { margin: 0; }
@media(max-width:620px) {
    .patient-search { flex-wrap: wrap; }
    .patient-search > div { flex-basis: 100%; }
    .patient-banner { flex-direction: column; align-items: flex-start; padding: 22px; }
    .chart-grid { grid-template-columns: 1fr; }
    th, td { padding: 14px; }
}

/* Encounter forms and record history */
.encounter-form { max-width: 620px; }
.encounter-form label { display: block; font-size: 13px; margin: 20px 0 8px; font-weight: bold; }
.encounter-form input:not([type=hidden]), .encounter-form select { display: block; width: 100%; padding: 12px; border: 1px solid #adb2ba; border-radius: 6px; background: white; color: var(--ink); font: inherit; }
.form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 32px; }
.encounter-form > .primary { margin-top: 24px; }
.workspace > p:has(> .primary) { margin-block: 24px; }
.button-link { display: inline-block; text-decoration: none; }
.history { margin-top: 25px; }
.history-entry { padding: 22px 0; border-top: 1px solid var(--line); font-size: 14px; }
.history-entry time { display: block; font-size: 12px; color: var(--muted); margin-top: 6px; }
.history-entry .details { max-width: 650px; }
.save-message { padding: 15px 20px; background: #eceef0; border-left: 3px solid var(--accent); }

.vitals-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.vital-field label { display: block; margin-bottom: .4rem; }
.vital-field input { width: 100%; box-sizing: border-box; padding: .65rem; border: 1px solid #adb2ba; border-radius: .4rem; font: inherit; }
@media (max-width: 600px) { .vitals-grid { grid-template-columns: 1fr; } }

.workout-exercise { margin: 1rem 0; }
.workout-exercise select, .workout-exercise input[data-exercise-field="exercise"], .prescription-grid input { display: block; width: 100%; box-sizing: border-box; padding: .65rem; font: inherit; border: 1px solid #adb2ba; border-radius: .4rem; }
.workout-exercise input[data-exercise-field="exercise"] { background:var(--paper); color:var(--ink); border-color:var(--line); }
.workout-set { padding: 1rem 0; border-top: 1px solid #d9dce0; }
.prescription-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-top: .7rem; }
.prescription table { width: 100%; border-collapse: collapse; }
.prescription td, .prescription th { padding: .5rem; text-align: left; border-bottom: 1px solid #d9dce0; }
@media (max-width: 700px) { .prescription-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.activity-filter select { display: block; padding: .65rem; border: 1px solid var(--line); border-radius: .4rem; font: inherit; }
.trend-chart { display: block; width: 100%; height: auto; border: 1px solid var(--line); border-radius: .4rem; }
.report-heading { margin-top: 2rem !important; }

[data-theme="dark"] .identity b { color: #b9c9bf; }

.documentation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.documentation-grid label { display: block; font-size: 14px; font-weight: bold; margin-bottom: 8px; }
.documentation-grid textarea { width: 100%; padding: 14px; font: inherit; color: var(--ink); background: white; border: 1px solid var(--line); border-radius: 6px; resize: vertical; }
[data-theme=dark] .documentation-grid textarea { background: #1c1e22; }
.narrative { white-space: pre-wrap; overflow-wrap: anywhere; }
textarea:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
@media(max-width:700px) { .documentation-grid { grid-template-columns: 1fr; } }

#observation-form > label { display: block; margin: 20px 0 8px; }
#observed-at { padding: 12px; font: inherit; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; margin-bottom: 24px; }
.group-member { display: flex; align-items: center; gap: 12px; padding: 10px 4px; }
.encounter-form .group-member input[type=checkbox] { display: inline-block; width: 20px; height: 20px; flex: 0 0 20px; padding: 0; margin: 0; }
.workout-set input[type=text] { display: block; width: 100%; box-sizing: border-box; padding: .65rem; font: inherit; border: 1px solid var(--line); border-radius: .4rem; }

.recent-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 24px; margin-top: 20px; }
.recent-grid h3 { margin: 0 0 8px; font-size: 1rem; }
.recent-grid p { margin: 6px 0; font-size: .85rem; }

.care-questionnaire-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 18px 28px; }
.care-questionnaire-grid .documentation-grid { margin: 0; }
.care-section-heading th { text-align: left; font-weight: bold; padding-top: 18px; }
.admin-toolbar{background:#1d2327;color:#f0f0f1;padding:.65rem 1.5rem;display:flex;align-items:center;gap:.75rem 1.25rem;flex-wrap:wrap;font:14px/1.4 system-ui,sans-serif}
.admin-toolbar form{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:0}
.admin-toolbar label{font-weight:600;color:inherit;margin:0}
.admin-toolbar select{background:#2c3338;color:#fff;border:1px solid #68737c;border-radius:3px;padding:.4rem .65rem;min-height:36px;width:auto;max-width:100%;font:inherit}
.admin-toolbar button{background:#394650;color:#fff;border:1px solid #68737c;border-radius:3px;padding:.45rem .8rem;min-height:36px;font:600 14px system-ui;cursor:pointer;text-decoration:none}
.admin-toolbar button:hover{background:#526371}
.admin-toolbar p{margin:0;font-size:12px;color:#d0d5d9}
.admin-toolbar :focus-visible{outline:3px solid #8fc7f2;outline-offset:2px}
@media(max-width:650px){.admin-toolbar{padding:.75rem}.admin-toolbar form{width:100%}.admin-toolbar select{flex:1;min-width:120px}}
.safety-quiz{max-width:850px}
.safety-quiz fieldset{margin:1.5rem 0;padding:1rem;border:1px solid var(--line,#b8bdc5);border-radius:6px;min-width:0}
.safety-quiz legend{font-weight:600;padding:0 .4rem}
.encounter-form.safety-quiz label{display:flex;align-items:flex-start;gap:.75rem;margin:.3rem 0;padding:.7rem;font-size:15px;font-weight:400;cursor:pointer;border-radius:4px}
.encounter-form.safety-quiz input[type=radio]{display:inline-block;width:18px;height:18px;flex:0 0 18px;padding:0;margin:.15rem 0 0}
.safety-quiz label:has(input:checked){background:var(--surface,#e8ebef);outline:1px solid #8b96a5}
.safety-quiz fieldset + fieldset{margin-top:2.5rem}
.safety-quiz legend{font-weight:700}
.chart-shell{position:sticky;top:0;z-index:5;background:var(--paper);border:1px solid var(--line);border-radius:6px;margin:0 0 1.5rem;padding:1rem}
.chart-identity{display:flex;gap:.5rem 1.5rem;flex-wrap:wrap;align-items:center}.chart-identity>strong{font-size:1.2rem}
.chart-allergies{display:flex;flex-wrap:wrap;gap:.4rem 1rem;margin:.7rem 0;font-size:.9rem}.chart-allergies>strong{color:var(--ink)}
.chart-tabs{display:flex;gap:.4rem;flex-wrap:wrap}.chart-tabs a{padding:.35rem .7rem;border:1px solid var(--line);border-radius:4px;text-decoration:none;font-size:.85rem}.chart-tabs a[aria-current=page]{background:var(--accent);color:var(--paper);font-weight:700}
.review-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.review-grid>section{border:1px solid var(--line);padding:1rem;border-radius:6px}.review-grid h3{margin-top:0}
.encounter-form .signature-check{display:flex;align-items:flex-start;gap:.75rem;font-weight:400}.encounter-form .signature-check input[type=checkbox]{width:20px;height:20px;flex:0 0 20px;margin:.2rem 0 0;padding:0}
.encounter-form textarea{width:100%;padding:.75rem;background:var(--paper);color:var(--ink);font:inherit;border:1px solid var(--line);border-radius:4px}
@media(max-width:850px){.review-grid{grid-template-columns:1fr}.chart-shell{position:static}}

[id^="chart-"]{scroll-margin-top:190px}

/* Balanced main header: school identity, program mark, account actions. */
.header { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; }
.header .identity { justify-self:start; min-width:0; }
.header-program { justify-self:center; display:flex; align-items:center; justify-content:center; }
.header-program .program-logo { width:104px; height:66px; object-fit:contain; }
[data-theme="dark"] .program-logo { filter:invert(1); }
.header .header-right { justify-self:end; justify-content:flex-end; flex-direction:row; flex-wrap:wrap; gap:16px 20px; min-width:0; }
.header .header-right { font-size:13px; }
.header .header-right form { margin:0; }
.header .account-link { text-decoration:none; font-weight:700; white-space:nowrap; }
.header .header-right button { white-space:nowrap; margin:0; padding:8px 14px; font-size:13px; min-height:36px; }
.account-tools { display:flex; flex-wrap:wrap; gap:16px; margin:24px 0; }
.account-table { width:100%; min-width:850px; border-collapse:collapse; }
.account-table th, .account-table td { text-align:left; padding:14px 16px; border-bottom:1px solid var(--line); white-space:normal; }
.account-table td:nth-child(3) { overflow-wrap:anywhere; max-width:230px; }
.account-table th a, .account-table .button-link { font-weight:700; text-decoration:none; white-space:nowrap; }
.account-table caption { text-align:left; font-weight:700; padding:0 0 12px; }
button, .primary, .quiet, .admin-toolbar button { padding:8px 14px; font-size:13px; line-height:1.6; min-height:36px; }
.primary.wide { width:auto; display:inline-flex; gap:18px; }
button:disabled { opacity:.55; cursor:not-allowed; }
.bulk-account-tools { display:flex; align-items:end; flex-wrap:wrap; gap:16px; margin:24px 0 16px; }
.bulk-account-tools select { display:block; padding:10px; font:inherit; border:1px solid var(--line); border-radius:6px; }
.bulk-confirm { display:flex; align-items:flex-start; gap:10px; margin:16px 0; font-size:14px; }
.bulk-confirm[hidden] { display:none; }
.bulk-confirm input, .account-table input[type=checkbox] { width:18px; height:18px; flex:0 0 18px; }
@media(max-width:800px) {
 .header { grid-template-columns:minmax(0,1fr) auto; gap:16px; padding:18px; }
 .header-program { grid-column:2; grid-row:1; }
 .header-program .program-logo { width:80px; height:54px; }
 .header .header-right { grid-column:1 / -1; justify-self:end; }
 .header .header-right:empty { display:none; }
}

/* Clinical color cues complement labels; neutral surfaces remain the foundation. */
:root { --info-bg:#edf4fc; --info-ink:#245f9e; --alert-bg:#fff0ef; --alert-ink:#a62732; --caution-bg:#fff4e8; --caution-ink:#8c4a0b; --review-bg:#f1effb; --review-ink:#64428d; }
[data-theme="dark"] { --info-bg:#202f42; --info-ink:#a7cef7; --alert-bg:#3b232a; --alert-ink:#ffc1c7; --caution-bg:#392f23; --caution-ink:#f3ca92; --review-bg:#2f293e; --review-ink:#d3c1f3; }
.pdf-download, [data-theme="dark"] .pdf-download { display:inline-flex; align-items:center; justify-content:center; gap:9px; background:var(--info-bg); color:var(--info-ink); border:1px solid var(--info-ink); text-decoration:none; font-weight:700; flex-shrink:0; }
.pdf-download:hover, [data-theme="dark"] .pdf-download:hover { background:var(--info-ink); color:var(--paper); }
.pdf-icon { width:19px; height:19px; flex:0 0 19px; }
.activity-filter { row-gap:20px; padding-bottom:24px; margin-bottom:24px; border-bottom:1px solid var(--line); }
.chart-tabs a[aria-current="page"] { background:var(--info-bg); color:var(--info-ink); border-color:var(--info-ink); }
.chart-allergies { padding:9px 12px; border-radius:5px; border-left:4px solid; }
.chart-allergies.allergy-severe { background:var(--alert-bg); color:var(--alert-ink); }
.chart-allergies.allergy-documented { background:var(--caution-bg); color:var(--caution-ink); }
.chart-allergies.allergy-review { background:var(--review-bg); color:var(--review-ink); }
.chart-allergies.allergy-reviewed { background:var(--info-bg); color:var(--info-ink); }
.chart-allergies a { color:inherit; }
.clinical-cue-icon { display:inline-block; margin-right:6px; font-weight:700; }
.chart-shell figure { max-width:100%; }
@media(max-width:700px) { .chart-shell figure { float:none !important; margin:0 0 14px !important; width:440px; } }

/* Shared spacing: 8 px rhythm, compact history, separated action rows. */
:root { --space-1:8px; --space-2:16px; --space-3:24px; --space-4:32px; }
.form-actions { gap:12px 16px; margin:24px 0; }
.form-actions:last-child { margin-bottom:0; }
.workspace-title { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px 24px; margin-bottom:20px; }
.workspace-title h1, .workspace-title h2, .workspace-title .form-actions { margin:0; }
.workspace-title > div { min-width:0; }
.card > :first-child { margin-top:0; }
.card > :last-child { margin-bottom:0; }
.card h2 { margin-bottom:16px; }
.card + .card { margin-top:24px; }
.chart-grid > .card { margin-top:0; min-width:0; }
.history-entry { padding:16px 0; }
.history-entry p { margin:8px 0 0; }
.history-entry h3 { margin:0 0 8px; }
.history-entry:last-child { padding-bottom:0; }
.encounter-form label { margin:20px 0 8px; }
.encounter-form > button, .encounter-form > .primary { margin-top:24px; }
.encounter-form .form-actions button { margin-top:0; }
button, .primary, .quiet { max-width:100%; text-align:center; overflow-wrap:anywhere; }
.primary, .quiet { display:inline-flex; justify-content:center; align-items:center; gap:8px; }
textarea:focus-visible, summary:focus-visible { outline:3px solid var(--focus); outline-offset:4px; }
.required-label { font-weight:normal; font-size:12px; color:var(--muted); }
.form-feedback { margin:16px 0 0; color:var(--muted); font-size:13px; }
.field-error { color:var(--alert-ink); font-size:13px; margin:8px 0 16px; }
[aria-invalid=true] { border:2px solid var(--alert-ink) !important; }
.status-badge { display:inline-block; padding:2px 8px; border:1px solid var(--line); border-radius:4px; font-size:12px; font-weight:bold; background:var(--surface); }
.status-draft { background:var(--review-bg); color:var(--review-ink); }
.status-in-progress, .status-active { background:var(--caution-bg); color:var(--caution-ink); }
.status-completed, .status-finalized, .status-signed { background:var(--info-bg); color:var(--info-ink); }
.status-entered-in-error { background:var(--alert-bg); color:var(--alert-ink); }
.chart-shell { display:flow-root; }
.chart-tabs { gap:8px; }
.details dd { overflow-wrap:anywhere; min-width:0; }
@media(max-width:700px) {
 .workspace { padding:24px 16px; }
 .card { padding:20px; }
 .chart-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
 .workspace-title { align-items:flex-start; }
 .workspace-title .form-actions { width:100%; }
 .form-actions { gap:12px; }
 .chart-shell { position:static; }
 .chart-shell figure { width:100%; }
 .details { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px 16px; }
 .patient-banner { padding:20px; }
 .pager { flex-wrap:wrap; gap:12px; }
}

@media(min-width:1000px) {
 .chart-shell { max-width:1200px; margin:24px auto; display:grid; grid-template-columns:minmax(0,1fr) 357px; gap:8px 24px; }
 .chart-shell figure { grid-column:2; grid-row:1 / 4; margin:0 !important; float:none !important; }
 .chart-shell .chart-identity, .chart-shell .chart-allergies, .chart-shell .chart-tabs { grid-column:1; }
 .chart-shell .chart-tabs { clear:none !important; align-content:start; }
}

.workspace-start-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:24px; }
.workspace-start-actions > .card { margin:0; }
@media (max-width:700px) { .workspace-start-actions { grid-template-columns:1fr; } }