:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #17231f; background: #f4f7f5; }

/* The inbox is a triage list: enough context to identify a call, never the full journal draft. */
.message { padding: 12px 13px; }
.message .message-top { display: flex; justify-content: space-between; min-width: 0; gap: .5rem; }
.message .category-pill { color: #155f53; font-size: .82rem; line-height: 1.15; }
.detail-category-badge { display: inline-block; margin-bottom: .45rem; padding: .28rem .52rem; border-radius: 999px; color: #155f53; background: #e1f2eb; font-size: .75rem; font-weight: 750; }
.detail-category-badge.category-appointment_cancellation { color: #834800; background: #fff0d4; }
.detail-category-badge.category-appointment_cancellation_and_medicine_renewal { color: #6b3d74; background: #f4e7f6; }
.detail-category-badge.category-other { color: #315f86; background: #e6f0f8; }
.detail-category-badge.category-unclear { color: #6c4e17; background: #f4eddc; }
.detail-date { color: #62726c; font-size: .78rem; font-weight: 500; }
.message time { flex: 0 0 auto; margin: 0; white-space: nowrap; font-size: .72rem; }
.message .message-phone { color: #33453f; font-weight: 650; font-size: .86rem; margin-top: .22rem; }
.message .message-preview { color: #62726c; font-size: .78rem; line-height: 1.35; margin-top: .32rem; display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.cpr { color: #17453d; font-size: .86rem; font-weight: 650; margin-bottom: 0; }
.detail-cpr { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; margin-top: .55rem; color: #17453d; font-size: .88rem; }
.detail-cpr .copy-cpr { padding: .38rem .62rem; color: #17453d; background: #e0ece8; font-size: .74rem; }
.more-details { margin-top: 1rem; border: 1px solid #dce8e3; border-radius: 8px; background: #fbfdfc; }
.more-details summary { cursor: pointer; padding: .78rem .9rem; color: #17453d; font-weight: 700; }
.more-details[open] summary { border-bottom: 1px solid #dce8e3; }
.more-details section { margin: 0 .9rem; }
.journal-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.journal-heading .copy-note { padding: .38rem .62rem; color: #17453d; background: #e0ece8; font-size: .74rem; white-space: nowrap; }
.correction-help { margin-bottom: .45rem; }
.correctable-text .transcript-word { border-radius: 3px; cursor: text; }
.correctable-text .transcript-word:hover { outline: 1px dashed #5d7e74; background: #edf5f1; }
.correctable-text .approved-correction { color: #075f9a; background: #e0f1fb; text-decoration: underline dotted #075f9a 2px; text-underline-offset: .16em; font-weight: 700; cursor: help; }
.correctable-text .approved-correction:hover { outline-color: #075f9a; background: #cdeafa; }
.correctable-text .correction-pending { color: #8a5100; background: #fff0d4; text-decoration-color: #8a5100; }
.correctable-text .correction-rejected { color: #5d6470; background: #edf0f3; text-decoration-color: #5d6470; }
.correction-form { display: grid; gap: .55rem; margin-top: .8rem; padding: .85rem; border: 1px solid #bddbd2; border-radius: 8px; background: #f2f9f6; }
.correction-form label { display: grid; gap: .28rem; color: #36564c; font-size: .82rem; font-weight: 650; }
.correction-form input, .correction-form select { border: 1px solid #abc1ba; border-radius: 6px; padding: .48rem; background: #fff; }
.correction-form div, .correction-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.correction-form button, .correction-actions button { padding: .44rem .62rem; font-size: .78rem; }
.correction-list { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.correction-list li { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .65rem .72rem; border: 1px solid #dce8e3; border-radius: 7px; background: #fbfdfc; }
.correction-list small { display: block; margin-top: .18rem; color: #62726c; }
.button-link { display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; padding: .72rem 1rem; text-decoration: none; font-weight: 650; }
.button-link.secondary { color: #17453d; background: #e0ece8; }
.correction-modal { width: min(94vw, 460px); padding: 0; border: 0; border-radius: 12px; box-shadow: 0 18px 60px #17231f55; }
.correction-modal::backdrop { background: #17231f88; }
.correction-modal form { display: grid; gap: .8rem; padding: 1.2rem; }
.correction-modal label { display: grid; gap: .3rem; color: #36564c; font-size: .86rem; font-weight: 700; }
.correction-modal input, .correction-modal select { border: 1px solid #abc1ba; border-radius: 7px; padding: .6rem; background: #fff; }
.modal-heading { display: flex; align-items: start; justify-content: space-between; gap: .75rem; }
.modal-heading h2 { margin: 0; font-size: 1.15rem; }
.icon-button { min-width: 2rem; padding: .2rem .5rem; color: #36564c; background: transparent; font-size: 1.45rem; line-height: 1; }
.modal-actions { display: flex; justify-content: end; flex-wrap: wrap; gap: .5rem; margin-top: .15rem; }
.settings-layout { width: min(100% - 48px, 940px); margin: 0 auto; padding: 24px 0; display: grid; gap: 20px; }
.settings-card { padding: 20px; border: 1px solid #dbe6e1; border-radius: 12px; background: #fff; box-shadow: 0 2px 10px #173c3320; }
.admin-list li { align-items: center; }
.inbox-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem; padding: .3rem; margin: 0 0 .8rem; border-radius: 9px; background: #edf3f0; }
.inbox-tab { display: flex; align-items: center; justify-content: center; gap: .42rem; min-width: 0; padding: .55rem .45rem; color: #426158; background: transparent; font-size: .78rem; }
.inbox-tab.active { color: #17453d; background: #fff; box-shadow: 0 1px 3px #173c3320; }
.inbox-tab span { display: grid; place-items: center; min-width: 1.4rem; height: 1.4rem; padding: 0 .25rem; border-radius: 999px; background: #d6e7e1; font-size: .7rem; }
.inbox-tab.active span { background: #006f5f; color: #fff; }
.inbox-empty { margin: 0; padding: .3rem 0 .8rem; }
.search { display: grid; gap: .3rem; margin: 0 0 1rem; color: #46625a; font-size: .78rem; font-weight: 650; }
.search input { width: 100%; border: 1px solid #abc1ba; border-radius: 7px; padding: .62rem .7rem; color: #17231f; background: #fff; }
.search input:focus { outline: 2px solid #56aa9b; outline-offset: 1px; }
.pager { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: .85rem; color: #62726c; font-size: .73rem; }
.pager button { padding: .48rem .58rem; font-size: .74rem; white-space: nowrap; }
.pager button:disabled { cursor: default; opacity: .5; }
* { box-sizing: border-box; } body { margin: 0; } button, input, select { font: inherit; } button { cursor: pointer; border: 0; border-radius: 8px; padding: .72rem 1rem; background: #006f5f; color: white; font-weight: 650; } button.secondary { color: #17453d; background: #e0ece8; } header { min-height: 88px; padding: 18px max(24px, calc((100vw - 1240px) / 2)); background: #fff; border-bottom: 1px solid #dbe6e1; display: flex; align-items: center; justify-content: space-between; } h1, h2, h3, p { margin-top: 0; } h1 { margin-bottom: 0; font-size: 1.45rem; } h2 { margin-bottom: .4rem; } h3 { margin-bottom: .5rem; font-size: .96rem; } .eyebrow { color: #126d5f; font-weight: 750; letter-spacing: .08em; font-size: .7rem; margin-bottom: .35rem; } .header-actions, .section-heading, .detail-head, .message-top { display: flex; align-items: center; gap: .8rem; } .layout { max-width: 1240px; margin: 0 auto; padding: 24px; display: grid; grid-template-columns: minmax(280px, 380px) 1fr; gap: 20px; } .inbox, .detail, .login-card { background: #fff; border: 1px solid #dbe6e1; border-radius: 12px; padding: 20px; box-shadow: 0 2px 10px #173c3320; } .section-heading { justify-content: space-between; }.message-list { display: grid; gap: 8px; }.message { width: 100%; color: #17231f; text-align: left; background: #fff; border: 1px solid #dce8e3; padding: 12px; }.message:hover, .message.selected { border-color: #007b68; background: #eff8f4; }.message-top { justify-content: space-between; }.message span, .message small { display:block; }.message small, .quiet, time { color: #62726c; font-size: .8rem; margin-top: .35rem; }.detail.empty { display: grid; place-items: center; min-height: 260px; color: #62726c; }.detail section { padding: 16px 0; border-top: 1px solid #e2ebe7; }.detail-head { justify-content: space-between; align-items: start; }.detail-head label { display: grid; gap: .25rem; font-size: .85rem; }.detail-head select { border: 1px solid #abc1ba; border-radius: 6px; padding: .4rem; background:#fff; } audio { width: 100%; } pre { white-space: pre-wrap; font: inherit; line-height: 1.55; background: #f5f8f6; padding: 12px; border-radius: 6px; margin: 0; }.warning, .error { color: #9c2916; background: #ffefe9; padding: 10px; border-radius: 6px; }.score { color: #43665c; }.login-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; }.login-card { width: min(100%, 420px); }.login-card label { display:grid; gap:.35rem; margin: 14px 0; font-weight: 600; }.login-card input { padding:.68rem; border: 1px solid #b5c9c2; border-radius: 7px; }.login-card button { width:100%; margin-top: 8px; }.error { min-height: 0; padding: 0; background: transparent; margin-bottom: 0; }@media (max-width: 760px) { header { padding: 16px; }.layout { grid-template-columns: 1fr; padding: 16px; }.detail-head { display: block; }.detail-head label { margin-top: 12px; }.header-actions { gap: .5rem; } }