/* Harmony: a patient record, designed around the next useful action. */
:root {
  --ink: #192d2b;
  --green: #164c43;
  --muted: #626f70;
  --line: #dce3e3;
  --light: #edf3f1;
  --paper: #f5f7f7;
  color: var(--ink);
  background: var(--paper);
  font-family: 'Hanken Grotesk', Arial, sans-serif;
  font-size: 16px;
}
body {background:var(--paper);color:var(--ink)}
h1,h2,h3 {font-family:'Hanken Grotesk',Arial,sans-serif;letter-spacing:-.025em;color:inherit}
h1 {font-size:2rem;line-height:1.2;font-weight:600}
h2 {font-size:1.125rem;line-height:1.4;font-weight:600}
h3 {font-size:1rem;line-height:1.5;font-weight:500}
p {line-height:1.6}
button,.button {border-radius:5px;box-shadow:none;font-size:.9375rem;min-height:44px;font-weight:500}
button:hover,.button:hover {transform:none}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible {outline:3px solid #3c8278;outline-offset:3px}
.quiet {font-size:.875rem;min-height:40px}
.icon {stroke-width:1.5}
.wordmark {font:400 2.25rem/1 Spectral,Georgia,serif;letter-spacing:-.04em;color:var(--ink)}
.wordmark small {font-size:.5rem;letter-spacing:.2em;margin-top:8px}
.eyebrow {font-size:.75rem;letter-spacing:.06em;font-weight:500}
.muted {color:var(--muted)}
.badge {background:#edf2f2;border:0;color:#506966;font-size:.75rem;border-radius:3px;padding:4px 8px}
.badge.warm {background:#f7eee1;color:#85591b}
.card {box-shadow:none;border-radius:6px;border-color:var(--line)}
.card.tint {background:#edf3f1;border-color:#dce7e3}
.source-line,.clinical-note {font-size:.8125rem;color:var(--muted);line-height:1.55}

/* The practice header carries navigation; the patient record stays in the page. */
.portal-header {background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:25}
.portal-header-inner {max-width:1320px;margin:auto;padding:0 36px;min-height:90px;display:flex;align-items:center;gap:48px}
.portal-header .wordmark {flex:none}
.navigation {display:flex;flex-direction:row;gap:4px;align-self:stretch;margin:auto}
.navigation a {border-radius:0;border:0;border-bottom:2px solid transparent;background:transparent;display:flex;align-items:center;justify-content:center;padding:26px 12px 24px;color:#647270;font-size:.875rem;font-weight:500;white-space:nowrap;text-decoration:none;gap:8px}
.navigation a .icon {display:none}
.navigation a:hover {background:transparent;color:var(--ink)}
.navigation a.active {color:var(--green);border-bottom-color:var(--green);background:transparent}
.identity {display:flex;align-items:center;gap:10px;flex:none;max-width:230px}
.identity .identity-initials {width:36px;height:36px;border:1px solid #d8e4e0;background:#eff4f2;border-radius:50%;display:grid;place-items:center;font-size:.75rem;color:#42645b}
.identity-text {display:grid;justify-items:start;gap:0}
.identity strong {font-size:.875rem;font-weight:500;line-height:1.4}
.identity .quiet {min-height:26px;padding:0;margin:0;font-size:.75rem;color:var(--muted)}
.content {display:block;max-width:1280px;width:100%;margin:0 auto;padding:22px 36px 40px;grid-column:auto}
.record-context {display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:26px;color:#6c7978;font-size:.75rem;min-height:28px}
.record-context>span>span {color:#acb5b3;padding:0 8px}
.record-context .switch-demo {font-size:.8125rem;padding:0;min-height:28px}
.page-head {margin-bottom:28px;display:flex;align-items:flex-end;justify-content:space-between}
.page-head h1 {font-size:2rem;font-weight:600;margin:0 0 9px;letter-spacing:-.035em}
.page-head .muted {font-size:1rem;margin:0}
.record-footer {display:flex;justify-content:space-between;align-items:flex-start;gap:32px;border-top:1px solid var(--line);padding-top:24px;margin-top:40px;font-size:.75rem;color:#7a8684}
.record-footer>span {font-weight:500;white-space:nowrap}
.record-footer p {margin:0;max-width:560px;font-size:.75rem;line-height:1.5;text-align:right}

/* Home: the most recent treatment and results, alongside upcoming care. */
.overview-heading {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}
.overview-heading h1 {font-size:2rem;letter-spacing:-.035em;margin-bottom:8px}
.overview-heading p {margin:0;color:var(--muted);font-size:.9375rem}
.overview-heading p span {padding:0 6px;color:#a0aba7}
.overview-heading>.quiet {color:#657a73;font-size:.8125rem}
.care-overview {display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}
.overview-primary {background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.overview-primary>section {padding:28px 30px}
.overview-primary>section+section {border-top:1px solid var(--line)}
.section-heading {display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}
.section-heading h2 {font-size:1rem;font-weight:600;letter-spacing:-.01em;margin:0}
.section-heading time {font-size:.8125rem;color:var(--muted);white-space:nowrap}
.section-heading p {margin:6px 0 0;font-size:.8125rem;color:var(--muted)}
.section-heading p span {padding:0 3px}
.section-heading .quiet {font-size:.8125rem;padding:0;min-height:32px;white-space:nowrap}
.section-heading .icon {width:16px}
.current-visit {position:relative}
.current-visit h3 {font-size:1.55rem;font-weight:500;line-height:1.35;max-width:29ch;margin:0 0 8px;letter-spacing:-.035em}
.current-visit .visit-provider {font-size:.875rem;color:var(--muted);margin:0 0 20px}
.current-visit .visit-description {font-size:1rem;color:#4f6260;margin:0 0 22px}
.visit-actions {display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.visit-actions>button:first-child {font-size:.875rem;padding:11px 16px}
.visit-actions .icon {width:16px}
.visit-actions .quiet {font-size:.875rem}
.home-lab-head {display:grid;grid-template-columns:minmax(0,1fr) 72px 78px 16px;gap:16px;padding:0 0 9px;font-size:.75rem;color:#788480}
.home-lab-head>span:nth-child(3) {text-align:right}
.result-row {grid-template-columns:minmax(0,1fr) 72px 78px 16px;gap:16px;padding:18px 0;border-top:1px solid #e7ebeb;min-height:85px;background:#fff}
.result-name strong {font-size:1rem;font-weight:500}
.result-name small {font-size:.75rem;margin-top:6px}
.result-value {font-size:1.375rem;font-weight:500;color:var(--ink);letter-spacing:-.02em}
.result-value small {font-size:.75rem;font-weight:400;margin-top:2px}
.result-row>.icon {width:16px;color:#6e8980}
.result-trend .spark {width:72px;margin:0}
.range-status {color:#42675a}
.range-status.warm {color:#8f672f}
.range-status>span {color:#7a8582}
.overview-history .section-heading {margin-bottom:8px}
.home-visit-row {display:grid;grid-template-columns:92px minmax(0,1fr) 18px;gap:16px;background:transparent;color:var(--ink);border:0;border-top:1px solid #e9eded;border-radius:0;padding:17px 0;width:100%;text-align:left}
.home-visit-row:first-of-type {border-top:0}
.home-visit-row:hover {background:#f8faf9}
.home-visit-date {font-size:.8125rem;color:var(--muted);align-self:start;line-height:1.5}
.home-visit-row strong {display:block;font-weight:500;font-size:.9375rem;line-height:1.4}
.home-visit-row small {display:block;margin-top:4px;font-size:.75rem;color:var(--muted)}
.home-visit-row .icon {width:16px}
.next-appointment {background:#173e36;color:#fff;padding:25px 25px 23px;border-radius:8px;box-shadow:none}
.appointment-label {font-size:.875rem;color:#c7d7d0;margin:0 0 20px}
.appointment-when {display:flex;gap:14px;align-items:center;margin-bottom:22px}
.appointment-when>strong {font-size:3.75rem;font-weight:400;letter-spacing:-.06em;line-height:1}
.appointment-when>span {font-size:.875rem;line-height:1.5;color:#c0d0c9}
.next-appointment h2 {font-size:1.2rem;font-weight:500;margin:0 0 9px;line-height:1.4;color:#fff}
.next-appointment>p:not(.appointment-label) {font-size:.875rem;color:#c6d7cf;margin:0 0 15px}
.appointment-status {font-size:.75rem;color:#abc3b8;display:block;margin-bottom:22px}
.next-appointment .secondary {border:1px solid #79988d;color:#fff;background:transparent;width:100%;font-size:.8125rem;justify-content:space-between;padding:10px 12px}
.next-appointment .secondary:hover {background:#244d42}
.next-appointment .icon {width:16px}
.home-imaging {margin:28px 0;padding:0 1px}
.home-imaging .section-heading {margin-bottom:16px}
.scan-preview {display:block;height:auto;margin:0;padding:0;width:100%;text-align:left;background:none;border:0;border-radius:0;color:var(--ink)}
.scan-preview:hover {background:none}
.scan-preview-image {display:block;position:relative;background:#09100e;overflow:hidden;border-radius:5px;aspect-ratio:1.94}
.scan-preview img {width:100%;height:100%;object-fit:contain;display:block;transition:opacity .2s}
.scan-preview:hover img {opacity:.85}
.scan-preview-image>span {position:absolute;left:9px;bottom:8px;background:#0c1814db;color:#d7e2db;font-size:.75rem;padding:3px 6px;border-radius:2px}
.scan-preview-caption {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.scan-preview-caption strong {font-size:.9375rem;font-weight:500}
.scan-preview-caption .icon {width:16px;height:16px}
.home-imaging>p {font-size:.8125rem;color:var(--muted);line-height:1.5;margin:9px 0 17px}
.home-scan-link {display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:16px 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);text-align:left;font-size:.9375rem}
.home-scan-link small {font-size:.75rem;display:block;margin-top:5px;font-weight:400;color:var(--muted)}
.home-scan-link .icon {width:16px}
.home-scan-link:hover {background:none;color:var(--green)}
.home-documents {border-top:1px solid var(--line);padding-top:22px}
.home-documents .section-heading {margin-bottom:10px}
.home-documents p {font-size:.875rem;color:var(--muted);margin:0 0 10px}
.home-documents .quiet {font-size:.875rem}

/* History and documents use aligned rows instead of nested cards. */
.health-summary {background:#fff;border:1px solid var(--line);border-radius:7px;padding:28px;margin-bottom:16px}
.health-summary .card-head {margin-bottom:28px;align-items:baseline}
.health-summary .card-head h2 {font-size:1.125rem}
.health-summary .source-line {margin:0;padding:0;border:0;font-size:.75rem}
.health-grid {display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px}
.health-grid h3 {font-size:.875rem;color:#647570;margin:0 0 16px}
.health-grid p {font-size:1rem;line-height:1.5;margin:0 0 20px}
.health-grid p strong {display:block;font-weight:500}
.health-grid p span {display:block;font-size:.8125rem;color:var(--muted);margin-top:5px}
.health-grid small {font-size:.75rem}
.health-grid .allergy-entry {font-size:.9375rem;padding:0 0 12px;border-bottom:1px solid #e0e6e4}
.health-grid .measurement-heading {margin-top:24px}
.measurement-history {border-top:1px solid var(--line);padding-top:16px;margin-top:16px}
.measurement-history summary {font-size:.875rem;cursor:pointer;min-height:32px;color:#4d6d63}
.measurement-table>div {display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.8125rem}
.dental-ledger {background:#fff;border:1px solid var(--line);border-radius:7px;padding:20px 28px;margin-bottom:32px}
.dental-ledger summary {font-size:1rem;font-weight:500;cursor:pointer}
.dental-ledger summary span {font-size:.8125rem;color:var(--muted);font-weight:400;margin-left:12px}
.dental-rows>div {display:flex;align-items:baseline;gap:20px;border-bottom:1px solid var(--line);padding:18px 0}
.tooth-number {min-width:110px;font-size:.875rem;color:#587568}
.dental-rows strong {font-size:1rem;font-weight:500}
.dental-rows p {font-size:.8125rem;color:var(--muted);margin:4px 0 0}
.timeline-heading {display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:12px}
.timeline-heading h2 {font-size:1.25rem;margin:0}
.filters {gap:8px;margin-bottom:8px;border-bottom:1px solid var(--line);padding-bottom:0}
.filters button {font-size:.875rem;min-height:44px}
.visit-count {margin-left:auto;font-size:.8125rem;color:var(--muted);align-self:center}
.timeline-year {font-size:1.25rem;font-weight:500;margin:0;padding:28px 0 8px;color:#314f46}
.visit-record {display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:24px;align-items:start;padding:22px 0;border-bottom:1px solid var(--line)}
.visit-record time {font-size:.875rem;color:var(--muted);padding-top:4px}
.visit-record-body h3 {font-size:1.125rem;font-weight:500;margin:8px 0 7px}
.visit-record-body p {font-size:1rem;color:#566c64;margin:0 0 9px;max-width:660px}
.visit-clinician {font-size:.8125rem;color:var(--muted)}
.visit-record>button {font-size:.875rem;white-space:nowrap;margin-top:23px}
.document-library {background:#fff;border:1px solid var(--line);border-radius:7px;padding:26px 28px;margin-bottom:30px}
.document-library .card-head {margin-bottom:8px}
.document-library .card-head .muted {font-size:.8125rem}
.document-row {display:flex;align-items:center;gap:18px;width:100%;padding:20px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:#fff;color:var(--ink);text-align:left}
.document-row:last-child {border-bottom:0}
.document-row:hover {background:#f8faf9}
.document-row>span:nth-child(2) {flex:1}
.document-icon {display:grid;place-items:center;min-width:36px;color:#667f73}
.document-row strong {font-weight:500;font-size:1rem;display:block}
.document-row small {font-size:.8125rem;color:var(--muted);display:block;margin-top:5px}
.document-row>.icon {width:18px}
.records-grid .card {padding:28px}
.records-grid h2 {font-size:1.25rem}
.records-grid p {font-size:1rem}
.records-grid .source-line,.upload-note {font-size:.8125rem}
.connection p {font-size:.875rem}
.connection strong {font-weight:500}

/* Comparable lab results, with source and history kept close to the value. */
.lab-tools {background:#fff;border:1px solid var(--line);border-radius:7px;padding:22px;gap:20px}
.lab-tools label {font-size:.875rem;font-weight:500}
.lab-tools input,.lab-tools select {font-size:1rem;background:#fff;border-color:#cfd9d5;min-height:44px}
.lab-tools .lab-outside {font-size:.875rem;font-weight:400}
.lab-collection {font-size:.875rem;padding:20px 0}
.lab-collection #lab-count {font-size:.8125rem}
.lab-table {background:#fff;border:1px solid var(--line);border-radius:7px;padding:0 24px;overflow:hidden}
.lab-table-head {padding:17px 0;color:#6d7e76;font-size:.75rem;background:transparent}
.lab-table-row {padding:22px 0}
.lab-test strong {font-size:1rem;font-weight:500}
.lab-test small {font-size:.8125rem}
.lab-reading>strong {font-size:1.375rem;font-weight:500}
.lab-reading>small,.lab-range>span {font-size:.8125rem}
.lab-range>.range-status {font-size:.75rem}
#detail {border-radius:8px;box-shadow:0 16px 70px #0b292629}
#detail .dialog-head {padding:23px 26px}
#detail .dialog-head h2 {font-family:'Hanken Grotesk',sans-serif;font-size:1.5rem;font-weight:500;letter-spacing:-.035em}
.dialog-body {padding:25px 26px}
.dialog-body p,.dialog-body .care-item {font-size:1rem;line-height:1.65}
.history-choice>span {font-size:.8125rem}
.history-choice>strong {font-size:1.125rem}
.history-label {font-size:.875rem}
.chart-key {font-size:.75rem}

/* A scan gets a dark viewing surface, with controls on the white side panel. */
.content[data-view=scan] .record-context {margin-bottom:16px}
.content[data-view=scan] .page-head {margin-bottom:22px}
.content[data-view=scan] .page-head h1 {font-size:1.75rem;margin:0 0 8px}
.content[data-view=scan] .back {display:inline-flex;align-items:center;min-height:36px;font-size:.875rem;margin:0 0 12px;padding:0}
.view-layout {grid-template-columns:minmax(0,1fr) 246px;gap:22px;align-items:start}
.viewer {border-radius:6px;background:#0b110f;border:1px solid #18352c;overflow:hidden}
.ct-viewer .canvas-wrap {width:100%;height:460px;aspect-ratio:auto;max-height:none;place-items:center}
.ct-viewer #scan-canvas {width:auto;height:100%;max-width:100%;object-fit:contain}
.viewer-top,.viewer-footer {padding:13px 16px;font-size:.75rem;letter-spacing:0;color:#c2d3cc}
.view-controls {padding:20px;border-radius:6px;border-color:var(--line)}
.view-controls label {font-size:.875rem;line-height:1.5;margin-top:20px}
.view-controls select {font-size:.875rem;min-height:44px}
.view-controls output {font-size:.8125rem}
.view-controls .slice-actions button {font-size:.75rem;min-height:40px}
.viewer-help {font-size:.8125rem;line-height:1.6;color:var(--muted)}
.scan-source {font-size:.875rem;margin-top:24px}
.scan-source summary,.scan-source p {font-size:.875rem}
.library-meta {font-size:.875rem;padding-bottom:14px}
.study-list {background:#fff;border:1px solid var(--line);border-radius:7px;padding:0 26px}
.study {padding:26px 0;gap:26px;grid-template-columns:180px minmax(0,1fr) auto}
.study-copy h2 {font-size:1.35rem;font-weight:500}
.study-copy p {font-size:1rem}
.study-copy>small {font-size:.8125rem}
.study-copy .eyebrow {font-size:.75rem;letter-spacing:.04em}
.study-type {border-radius:4px}
.study-type img {height:130px}
.study-type>span {font-size:.75rem}
.study button {font-size:.875rem}
.imaging-note p {font-size:.875rem;line-height:1.65}
.explain-layout {grid-template-columns:minmax(0,1fr) 320px;gap:22px}
.guide-toolbar {padding:16px 18px;background:#e9f0ec}
.guide-kicker {font-size:.8125rem;letter-spacing:.03em}
.guide-kicker>span {font-size:.75rem;letter-spacing:0}
.guide-toolbar p {font-size:.875rem}
.overlay-toggle {font-size:.8125rem}
.guide-panel {padding:24px;border-radius:6px}
.guide-panel-heading .eyebrow {font-size:.75rem;letter-spacing:.03em}
.annotation-count {font-size:.75rem}
.guide-options button {font-size:.8125rem;min-height:40px}
.guide-options button>span {font-size:.75rem}
.detail-category {font-size:.75rem;letter-spacing:.03em;color:var(--muted)}
.guide-detail h2 {font-family:'Hanken Grotesk',sans-serif;font-size:1.5rem;font-weight:500;letter-spacing:-.03em}
.guide-detail>p,.explanation-more p {font-size:1rem;color:#4c6258;line-height:1.65}
.focus-area {font-size:.875rem;min-height:44px}
.explanation-more,.image-settings>summary {font-size:.875rem}
.dentist-question>span {font-size:.75rem;letter-spacing:.02em}
.dentist-question p {font-size:.9375rem}
.guide-reference,.guide-disclosure,.sheet-disclosure {font-size:.8125rem}
.guide-fit {font-size:.8125rem}
.guide-sheet-header>span {font-size:.75rem;letter-spacing:.03em}
.image-settings .viewer-help {font-size:.8125rem}

/* Care plans and printable instructions. */
.appointment-strip {display:flex;align-items:center;gap:20px;padding:24px 0;border-bottom:1px solid var(--line);margin-bottom:24px}
.appointment-date {min-width:72px;text-align:center;border:1px solid var(--line);border-radius:5px;background:#fff;padding:12px 10px}
.appointment-date strong {font-size:1.75rem;font-weight:500;line-height:1.1;display:block}
.appointment-date span {font-size:.75rem;color:var(--muted)}
.appointment-strip h3 {font-size:1.125rem;font-weight:500;margin:3px 0 5px}
.appointment-strip p {font-size:.875rem;margin:0;color:var(--muted)}
.appointment-strip .eyebrow {font-size:.75rem;letter-spacing:.04em}
.appointment-strip>button {margin-left:auto;white-space:nowrap}
.plan-step h3 {font-size:1.25rem;font-weight:500}
.plan-step p {font-size:1rem}
.plan-step .phase {font-size:.875rem}
.card.tint>h2 {font-size:1.5rem;font-weight:500;max-width:42ch}
.aftercare-body,.aftercare-index {font-size:1rem}
.aftercare-index nav a {font-size:.875rem}
.aftercare-body h2 {font-size:1.35rem;font-weight:500}
.aftercare-body p,.care-points li {font-size:1rem;line-height:1.7}
.care-points strong {font-weight:600}
.urgent-care {border:1px solid #decec7;border-radius:6px;background:#fff9f6}
.pharmacy {background:#eaf1ed;border-radius:6px;padding:26px}
.pharmacy-number {font-size:1rem}
.instruction-section {border-top:1px solid var(--line);padding-top:26px;margin-top:26px}
.care-contact h2 {font-size:1.25rem}

/* Staff and access pages share the practice typography without dashboard decoration. */
#app {--green:#edf3ef;background:var(--paper)}
#app .topbar {background:#fff;border-bottom:1px solid var(--line);box-shadow:none;padding:22px 36px}
#app .brand-row .mark {display:none}
#app .brand {font:400 2.35rem/1 Spectral,Georgia,serif;letter-spacing:-.04em}
#app .brand small {font:500 .5rem 'Hanken Grotesk',sans-serif;letter-spacing:.2em;margin-top:8px}
#app .shell {max-width:1240px;padding:24px 36px 50px}
#app .nav {border-bottom:1px solid var(--line);gap:24px}
#app .nav button {background:none;border-radius:0;color:var(--muted);padding:12px 0;font-size:.9375rem;border-bottom:2px solid transparent}
#app .nav button.active {color:var(--ink);border-bottom-color:#164c43}
#app h1 {font-family:'Hanken Grotesk',sans-serif;font-size:2rem;font-weight:600;letter-spacing:-.035em}
#app h2 {font-family:'Hanken Grotesk',sans-serif;font-size:1.25rem;font-weight:500}
#app .heading {padding:8px 0 22px}
#app .heading .eyebrow {display:none}
#app .stats {display:flex;background:none;border:0;gap:38px;margin-bottom:30px}
#app .stat {border:0;border-radius:0;padding:0;background:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:7px 12px;flex:0 1 auto}
#app .stat strong {font-family:inherit;font-size:1.75rem;font-weight:500;order:-1}
#app .stat>span {font-size:.875rem}
#app .stat small {width:100%;font-size:.75rem}
#app .panel {border:1px solid var(--line);border-radius:7px;box-shadow:none;padding:26px}
#app .panel-head h2 {font-size:1.125rem}
#app .row {padding:20px 0;border-color:var(--line)}
#app .row-title {font-size:1rem;font-weight:500}
#app .row p {font-size:.875rem}
#app .pill {border-radius:3px;font-size:.75rem}
#app .avatar {background:none;border:1px solid var(--line);border-radius:50%;color:#627970}
#app .notice,#app .demo {font-size:.75rem;line-height:1.5;letter-spacing:0}
#app .steps {font-size:1rem;line-height:1.65}
.gate,.login {max-width:560px;margin:60px auto;padding:0 30px}
.gate .wordmark,.login .brand-row {margin-bottom:42px}
.gate h1,.login h1 {font-family:'Hanken Grotesk',sans-serif;font-size:2rem;font-weight:500}
.gate>.eyebrow,.login>.eyebrow {color:var(--muted);letter-spacing:.06em;font-size:.75rem;margin-bottom:12px}
.gate .card,.login .panel {padding:28px;margin:28px 0 22px;background:#fff;border:1px solid var(--line);border-radius:7px}
.gate form label,.login label {font-size:.875rem}
.gate form button {width:100%}
.gate>p,.login>p {font-size:1rem;color:var(--muted)}
.gate>a {font-size:.875rem}
.patient-directory {max-width:1190px;margin:0 auto;padding:36px 36px 50px}
.directory-heading {display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:44px 0 30px}
.directory-heading h1 {font-size:2rem;font-weight:600;margin:0 0 10px}
.directory-heading .eyebrow {display:none}
.directory-heading p {font-size:1rem;color:var(--muted);margin:0}
.directory-heading a {display:flex;gap:12px;align-items:center;white-space:nowrap}
.patient-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px;background:#fff;border:1px solid var(--line);border-radius:7px;padding:0 28px}
.patient-choice {display:block;position:relative;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:24px 0;color:var(--ink);text-align:left;width:100%}
.patient-choice:hover {background:#f9fbfa}
.patient-choice-top {display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.demo-badge {font-size:.75rem;color:var(--muted);border:0;background:none;padding:0}
.patient-choice>strong {display:block;font-size:1.25rem;font-weight:500;letter-spacing:-.02em}
.patient-demographics {display:block;font-size:.8125rem;color:var(--muted);margin-top:6px}
.patient-focus {display:block;font-size:.9375rem;font-weight:400;margin-top:14px;color:#4f6860}
.patient-choice:last-child,.patient-choice:nth-last-child(2) {border-bottom:0}
#app .draft {background:#edf2ee;font-size:.75rem;letter-spacing:0;padding:11px 20px;color:#627069}
#app .patient-header {max-width:920px;padding:30px 40px;margin:auto;background:none}
#app .patient {max-width:920px;padding:26px 40px 50px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:7px}
#app .patient h1 {font-size:2.2rem;font-weight:500;line-height:1.25;max-width:27ch}
#app .patient h2 {font-size:1.35rem;font-weight:500}
#app .patient>p {font-size:1rem}
#app .patient .panel {border:0;border-top:1px solid var(--line);padding:28px 0;border-radius:0;margin:26px 0;background:none}
#app .patient .red {padding:24px;border:1px solid #dfcec7;background:#fff9f6;border-radius:5px}
#app .patient .pharmacy-panel {padding:24px;background:#edf3ef;border:0;border-radius:5px}
#app .patient .care-list li {font-size:1rem;line-height:1.7}
#app .patient .care-list strong {font-weight:600}
#app .patient-quick-actions {margin:26px 0}
#app .patient-quick-actions a {font-size:.875rem}
#app .patient-contents summary {font-size:.875rem}
#app .patient .contact-line {font-size:1rem}

@media(min-width:1450px){.care-overview{grid-template-columns:minmax(0,1fr) 320px}}
@media(max-width:1100px){
 .portal-header-inner {gap:24px;padding:0 28px}
 .navigation a {padding-left:9px;padding-right:9px;font-size:.8125rem}
 .identity .identity-initials {display:none}
 .identity {max-width:160px}
 .care-overview {grid-template-columns:minmax(0,1fr) 280px;gap:22px}
 .overview-primary>section {padding:25px}
 .explain-layout {grid-template-columns:1fr}
}
@media(max-width:900px){
 .portal-header {position:static}
 .portal-header-inner {min-height:90px;justify-content:space-between;padding:18px 26px;gap:24px}
 .navigation {position:fixed;bottom:0;left:0;right:0;z-index:30;background:#fff;border-top:1px solid var(--line);height:76px;padding:5px 12px 9px;gap:0;justify-content:space-around}
 .navigation a {flex:1;flex-direction:column;justify-content:center;gap:5px;border:0;font-size:.75rem;padding:5px 3px;min-width:0}
 .navigation a .icon {display:block;width:21px;height:21px}
 .navigation a.active {background:none;color:#164c43;font-weight:600}
 .navigation a.active .icon {stroke-width:2}
 .identity-text {justify-items:end}
 .identity {max-width:220px}
 .identity .identity-initials {display:grid}
 .content {padding:20px 26px 106px}
 .record-context {margin-bottom:22px}
 .care-overview {grid-template-columns:minmax(0,1fr) 250px;gap:20px}
 .overview-primary>section {padding:23px}
 .current-visit h3 {font-size:1.4rem}
 .home-lab-head,.result-row {grid-template-columns:minmax(0,1fr) 64px 16px;gap:12px}
 .home-lab-head>span:nth-child(2),.result-trend {display:none}
 .home-lab-head>span:nth-child(3) {text-align:right}
 .result-name strong {font-size:.9375rem}
 .next-appointment {padding:23px}
 .health-grid {gap:22px}
 .view-layout {grid-template-columns:1fr}
 .view-controls {display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
 .view-controls .viewer-help {grid-column:1/-1}
 .ct-viewer .canvas-wrap {height:440px}
 .study {grid-template-columns:145px minmax(0,1fr) auto;gap:20px}
 .record-footer {flex-direction:column;gap:8px}
 .record-footer p {text-align:left}
}
@media(max-width:700px){
 .care-overview {display:flex;flex-direction:column;gap:28px}
 .overview-primary,.overview-aside {width:100%}
 .overview-aside {display:grid;grid-template-columns:1fr 1fr;gap:24px}
 .home-imaging {margin:0}
 .home-documents {grid-column:1/-1}
 .overview-heading {align-items:flex-start}
 .overview-heading>.quiet {max-width:100px;text-align:right;line-height:1.5;align-items:flex-start}
 .overview-heading>.quiet .icon {display:none}
 .home-lab-head,.result-row {grid-template-columns:minmax(0,1fr) 70px 75px 16px;gap:16px}
 .home-lab-head>span:nth-child(2),.result-trend {display:block}
 .health-grid {grid-template-columns:1fr 1fr}
 .health-grid section:last-child {grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px}
 .study {grid-template-columns:100px minmax(0,1fr);gap:18px}
 .study button {grid-column:2}
 .study-type img {height:100px}
 .view-controls>div:first-child,.view-controls>div:nth-child(2) {grid-column:1/-1}
 .view-controls>div:nth-child(2) {grid-row:2}
 .patient-grid {grid-template-columns:1fr}
 .patient-choice:nth-last-child(2) {border-bottom:1px solid var(--line)}
 .directory-heading {display:block;margin-top:32px}
 .directory-heading a {margin-top:14px}
}
@media(max-width:480px){
 .portal-header-inner {padding:17px 20px;min-height:88px}
 .portal-header .wordmark {font-size:2.1rem}
 .identity .identity-initials {display:none}
 .identity strong {font-size:.8125rem}
 .identity .quiet {font-size:.75rem}
 .content {padding:16px 18px 100px}
 .record-context {font-size:.75rem;gap:8px;margin-bottom:22px}
 .record-context>span>span {padding:0 4px}
 .record-context .switch-demo {font-size:.75rem}
 .overview-heading {margin-bottom:22px;gap:16px}
 .overview-heading h1,.page-head h1 {font-size:1.75rem}
 .overview-heading p {font-size:.8125rem;max-width:220px;line-height:1.5}
 .overview-heading>.quiet {font-size:.75rem;max-width:92px}
 .overview-primary>section {padding:22px 20px}
 .section-heading {gap:14px;margin-bottom:20px}
 .section-heading h2 {font-size:.9375rem}
 .section-heading time,.section-heading p,.section-heading .quiet {font-size:.75rem}
 .section-heading .quiet {gap:6px}
 .current-visit h3 {font-size:1.375rem;max-width:24ch}
 .current-visit .visit-provider {font-size:.8125rem;margin-bottom:18px}
 .current-visit .visit-description {font-size:1rem;line-height:1.5;margin-bottom:20px}
 .visit-actions {gap:18px}
 .visit-actions>button:first-child {font-size:.8125rem;padding:11px 13px}
 .visit-actions .quiet {font-size:.8125rem}
 .home-lab-head,.result-row {grid-template-columns:minmax(0,1fr) 65px 14px;gap:10px}
 .home-lab-head>span:nth-child(2),.result-trend {display:none}
 .result-name strong {font-size:.9375rem}
 .result-name small {font-size:.75rem}
 .result-value {font-size:1.25rem}
 .result-value small {font-size:.75rem}
 .result-row {min-height:80px}
 .home-visit-row {grid-template-columns:1fr 16px;gap:4px 14px;padding:17px 0}
 .home-visit-date {grid-column:1;font-size:.75rem}
 .home-visit-row>span:nth-child(2) {grid-column:1}
 .home-visit-row>.icon {grid-column:2;grid-row:1/3}
 .home-visit-row strong {font-size:.9375rem}
 .home-visit-row small {font-size:.75rem}
 .overview-aside {display:flex;flex-direction:column;gap:26px}
 .next-appointment {padding:24px;display:grid;grid-template-columns:68px minmax(0,1fr);gap:0 20px}
 .appointment-label {grid-column:1/-1;margin-bottom:22px}
 .appointment-when {grid-column:1;grid-row:2/5;display:block;margin:0}
 .appointment-when>strong {font-size:3.2rem;display:block}
 .appointment-when>span {font-size:.75rem;display:block;margin-top:8px}
 .next-appointment h2 {grid-column:2;font-size:1.125rem}
 .next-appointment>p:not(.appointment-label) {grid-column:2;font-size:.8125rem}
 .appointment-status {grid-column:2;font-size:.75rem;margin-bottom:20px}
 .next-appointment>.secondary {grid-column:1/-1}
 .home-imaging {margin:0}
 .home-imaging .scan-preview-image {aspect-ratio:2.15}
 .home-documents {padding-top:22px}
 .page-head .muted {font-size:1rem;line-height:1.5}
 .health-summary {padding:22px 20px}
 .health-summary .card-head {display:block;margin-bottom:24px}
 .health-summary .card-head h2 {margin-bottom:8px}
 .health-grid {grid-template-columns:1fr;gap:18px}
 .health-grid section+section {border-top:1px solid var(--line);padding-top:20px}
 .health-grid h3 {font-size:.875rem}
 .health-grid p {font-size:1rem}
 .health-grid p span {font-size:.8125rem}
 .health-grid .allergy-entry {padding:0;border:0}
 .measurement-table>div {grid-template-columns:1.2fr 1.1fr 1fr 1fr;gap:5px;font-size:.75rem}
 .dental-ledger {padding:19px 20px}
 .dental-ledger summary span {display:block;margin:6px 0 0 18px;font-size:.75rem}
 .tooth-number {min-width:62px;max-width:80px;font-size:.8125rem}
 .dental-rows strong {font-size:.9375rem}
 .dental-rows p {font-size:.75rem}
 .timeline-heading h2 {font-size:1.125rem}
 .timeline-heading .quiet {font-size:.8125rem}
 .visit-record {grid-template-columns:46px minmax(0,1fr);gap:10px 14px;padding:22px 0}
 .visit-record time {font-size:.75rem}
 .visit-record-body h3 {font-size:1.0625rem}
 .visit-record-body p {font-size:1rem}
 .visit-record>button {grid-column:2;justify-self:start;margin:0;padding:0;font-size:.8125rem;min-height:36px}
 .visit-clinician {font-size:.75rem}
 .filters button {font-size:.8125rem}
 .visit-count {font-size:.75rem}
 .lab-tools {padding:20px;gap:18px}
 .lab-tools label {font-size:.875rem}
 .lab-tools .lab-outside {font-size:.8125rem}
 .lab-collection {font-size:.8125rem;gap:8px;align-items:flex-start}
 .lab-collection #lab-count {font-size:.75rem}
 .lab-table {padding:0 18px}
 .lab-table-row {padding:21px 0}
 .lab-test strong {font-size:1rem}
 .lab-test small,.lab-range>span,.lab-range>.range-status {font-size:.75rem}
 #detail .dialog-head {padding:20px}
 #detail .dialog-head h2 {font-size:1.35rem}
 .dialog-body {padding:22px 20px}
 .document-library {padding:22px 20px}
 .document-library .card-head {display:block;margin-bottom:15px}
 .document-library .card-head .muted {font-size:.75rem;display:block;margin-top:6px}
 .document-row {gap:10px}
 .document-icon {min-width:24px}
 .document-row strong {font-size:.9375rem}
 .document-row small {font-size:.75rem}
 .records-grid .card {padding:22px 20px}
 .library-meta {font-size:.75rem;gap:14px;align-items:flex-start}
 .study-list {padding:0 20px}
 .study {grid-template-columns:82px minmax(0,1fr);gap:14px;padding:24px 0}
 .study-copy h2 {font-size:1.125rem}
 .study-copy p {font-size:.875rem}
 .study-copy>small,.study-copy .eyebrow {font-size:.75rem}
 .study-type img {height:90px}
 .study button {font-size:.8125rem}
 .content[data-view=scan] .page-head h1 {font-size:1.65rem}
 .content[data-view=scan] .page-head .muted {font-size:.875rem}
 .content[data-view=scan] .record-context {margin-bottom:10px}
 .viewer-top,.viewer-footer {padding:12px;font-size:.75rem}
 .ct-viewer .canvas-wrap {height:300px}
 .view-controls {padding:20px;gap:0 18px}
 .view-controls label,.view-controls select {font-size:.875rem}
 .guide-toolbar {padding:14px;gap:8px}
 .guide-kicker {font-size:.75rem;gap:6px}
 .guide-kicker>span {font-size:.75rem}
 .guide-toolbar p {font-size:.8125rem}
 .overlay-toggle {font-size:.75rem}
 .guide-panel {padding:22px 20px}
 .guide-options button {font-size:.8125rem}
 .guide-detail h2 {font-size:1.5rem}
 .guide-detail>p {font-size:1rem}
 .guide-disclosure,.guide-reference,.sheet-disclosure {font-size:.8125rem}
 .appointment-strip {display:grid;grid-template-columns:68px minmax(0,1fr);gap:8px 15px}
 .appointment-strip>.appointment-date {grid-column:1;grid-row:1/3;min-width:0}
 .appointment-strip>div:nth-child(2) {grid-column:2}
 .appointment-strip>button {grid-column:2;justify-self:start;margin:0;font-size:.8125rem;padding:0}
 .appointment-strip h3 {font-size:1rem}
 .appointment-strip p {font-size:.8125rem}
 .appointment-strip .eyebrow {font-size:.75rem}
 .pharmacy {padding:22px 20px}
 .pharmacy .actions {gap:10px}
 .pharmacy .actions a {font-size:.8125rem}
 .plan-step .phase {font-size:.75rem}
 .plan-step h3 {font-size:1.125rem}
 .record-footer {margin-top:30px;font-size:.75rem}
 .record-footer p {font-size:.75rem}
 .patient-directory {padding:28px 20px 40px}
 .patient-grid {padding:0 20px}
 .directory-heading h1 {font-size:1.75rem}
 .directory-heading p {font-size:1rem}
 .directory-heading a {font-size:.8125rem}
 .patient-choice {padding:22px 0}
 .patient-choice>strong {font-size:1.25rem}
 .patient-focus {font-size:.875rem}
 .gate,.login {padding:0 22px;margin:35px auto}
 .gate .card,.login .panel {padding:24px}
 #app .topbar {padding:20px;gap:20px;align-items:flex-start}
 #app .topbar .person {gap:8px;flex-wrap:wrap;justify-content:flex-end}
 #app .topbar .demo {display:none}
 #app .topbar .button {font-size:.75rem;padding:8px 10px}
 #app .shell {padding:18px 20px 40px}
 #app .heading {display:block}
 #app .heading h1 {font-size:1.75rem}
 #app .heading>button {margin-top:18px}
 #app .stats {gap:20px;flex-wrap:wrap}
 #app .stat>span {font-size:.8125rem}
 #app .stat strong {font-size:1.5rem}
 #app .stat small {font-size:.75rem}
 #app .panel {padding:22px 20px}
 #app .row {gap:12px;flex-wrap:wrap}
 #app .row .pill {font-size:.75rem}
 #app .row .person {gap:10px}
 #app .row .avatar {display:none}
 #app .row p {font-size:.8125rem}
 #app .patient-header {padding:25px 22px}
 #app .patient {padding:24px 22px 40px;border-left:0;border-right:0;border-radius:0}
 #app .patient h1 {font-size:1.85rem}
 #app .patient .red,#app .patient .pharmacy-panel {padding:20px}
 #app .patient-quick-actions {gap:10px}
 #app .patient-quick-actions a {font-size:.8125rem}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{
 .portal-header,.record-context,.record-footer,.overview-heading>button{display:none!important}
 .content{max-width:none;padding:0;margin:0;background:#fff}
 body,#app{background:#fff}
 .next-appointment{color:#111;background:#fff;border:1px solid #aaa}
 .next-appointment h2,.next-appointment p,.appointment-status,.appointment-when>span{color:#111}
 #app .patient{border:0;padding:0;max-width:none}
}

@media(max-width:700px){
 .care-overview {display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
 .overview-primary,.overview-aside {display:contents}
 .overview-primary>section {background:#fff;border:1px solid var(--line);border-radius:7px;overflow:hidden}
 .current-visit {order:1}
 .next-appointment {order:2}
 .overview-results {order:3}
 .home-imaging {order:4;margin:8px 0 0}
 .overview-history {order:5}
 .home-documents {order:6}
}

@media(max-width:700px){.page-head{display:block;align-items:flex-start}.content[data-view=scan] .page-head{text-align:left}}
#app .nav {margin-bottom:26px}
#app .heading {margin-bottom:22px;padding-bottom:12px}
#app .stats {padding:0;margin-bottom:28px}
#app .stat strong {margin:0;line-height:1.25}
#app .panel.tint {background:#fff}
/* Longitudinal records: compact search tools and progressively disclosed history. */
.history-tools{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:16px;margin:20px 0 16px}
.history-tools label{display:grid;gap:7px;font-size:13px;font-weight:500;color:var(--ink,#192d2b);min-width:0}
.history-tools input,.history-tools select{width:100%;min-width:0;margin:0;min-height:46px;font-size:15px;background:#fff;border:1px solid #d9e1df;border-radius:5px;padding:10px 12px}
.document-tools{grid-template-columns:minmax(0,1fr) 190px 130px}
.history-pagination{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;color:#61706c;font-size:13px}
.record-disclosure{border-top:1px solid #dde4e1;margin-top:14px;padding-top:16px}
.record-disclosure summary{cursor:pointer;font-size:14px;font-weight:500;min-height:32px}
.history-background{display:grid;grid-template-columns:1fr 1fr;gap:36px;padding:16px 0 0}
.history-background h3{margin:0 0 18px;font-size:16px}
.medication-entry{padding:0 0 16px;margin:0 0 16px;border-bottom:1px solid #e4e9e7}
.medication-entry>strong{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:15px}
.medication-entry p{font-size:14px!important;line-height:1.6;margin:7px 0 0!important;color:#61706c}
.background-facts{margin:0;font-size:14px}
.background-facts dt{font-weight:600;color:#192d2b;margin-top:16px}
.background-facts dt:first-child{margin-top:0}
.background-facts dd{margin:4px 0 0;color:#61706c;line-height:1.65}
.imaging-history{margin-top:36px}
.imaging-history .card-head{align-items:flex-start;gap:20px}
.imaging-history .card-head p{font-size:14px;margin:8px 0 0;max-width:520px}
@media(max-width:700px){
 .history-tools{grid-template-columns:minmax(0,1fr) 110px;gap:10px}
 .document-tools{grid-template-columns:minmax(0,1fr) 110px}
 .document-tools label:first-child{grid-column:1/-1}
 .history-background{grid-template-columns:1fr;gap:24px}
 .history-pagination{align-items:flex-start;flex-direction:column;gap:12px}
 .history-pagination button{width:100%}
 .imaging-history .card-head{display:block}
 .imaging-history .card-head>span{display:block;margin-top:12px}
}