/* Pilot AI visual language, adapted from the supplied dashboard reference. */
:root {
  color-scheme: dark;
  --navy: #030b14;
  --navy2: #091725;
  --blue: #0b49ee;
  --blue-light: #0c203c;
  --ink: #f4f6fb;
  --muted: #aebacb;
  --line: #192936;
  --bg: #020a13;
  --green: #65cb40;
  --amber: #f5b62e;
  --radius: 10px;
  --shadow: none;
}
body { background: var(--bg); color: var(--ink); }
a { color: #438dff; }
.skip { background: #0b1b2d; color: white; }
.sidebar {
  width: 228px;
  padding: 17px 13px 20px;
  background: #020a13;
  border-right: 1px solid #142330;
  color: #d0d6e0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #273b51 transparent;
}
.brand {
  min-height: 165px;
  margin: -7px -13px 16px;
  padding: 0 11px 9px;
  border-bottom: 1px solid #142330;
}
.brand-logo { display: block; position: relative; width: 194px; max-width: 100%; height: auto; aspect-ratio: 1402 / 1122; overflow: visible; }
.brand-logo img {
  display: block; position: static; width: 100%; height: auto; max-width: 100%;
  inset: auto; object-fit: contain; pointer-events: none;
}
.practice { border-color: #1a2b3a; background: #071320; border-radius: 8px; padding: 10px; margin-bottom: 18px; }
.practice-icon { background: #0d2037; border-color: #243f60; color: #579aff; border-radius: 8px; }
.practice strong { color: #f6f7fa; }
.practice span { color: #9faec1; }
.nav-label { padding-left: 11px; color: #8e9aad; font-size: 11px; letter-spacing: 1.1px; }
.nav { gap: 5px; }
.nav button { color: #dde1e9; border-radius: 6px; padding: 11px 12px; font-weight: 450; font-size: 14px; }
.nav button svg { width: 19px; height: 19px; }
.nav button:hover { background: #0b1826; color: #fff; }
.nav button.active { background: linear-gradient(110deg, #1051f2, #073bdc); color: #fff; box-shadow: 0 0 12px #074dff14; }
.nav .counter { background: #0b45db; color: #f6f8ff; border-radius: 20px; min-width: 21px; }
.sidebar-bottom { padding-top: 22px; }
.sidebar-rhino { border: 1px solid #1a2a38; border-radius: 9px; padding: 14px 9px 12px; background: #030c16; text-align: center; overflow: hidden; }
.sidebar-rhino h3 { justify-content: center; color: #f5f5f7; font-size: 14px; font-weight: 550; letter-spacing: .3px; }
.rhino-reference { position: relative; overflow: hidden; width: 180px; max-width: 100%; height: 232px; margin: 8px auto 0; }
.rhino-reference img {
  position: absolute; width: 1459.2px; height: 972.8px; max-width: none;
  left: -19px; top: -566px; pointer-events: none;
}
.sidebar-rhino p { color: #ced5df; font-size: 12px; margin: 7px 0 15px; }
.sidebar-rhino button {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid #235de8; border-radius: 5px; background: linear-gradient(110deg, #1157ee, #0640da);
  padding: 10px 6px; color: white; font-size: 14px; font-weight: 550;
}
.sidebar-rhino button:hover { background: #1556eb; }
.sidebar-rhino button svg { width: 17px; height: 17px; }
.profile { margin-top: 18px; }
.profile strong { color: #e6eaf1; }
.profile span { color: #a8b2c3; }
.profile .avatar, .avatar { color: #d8e5fc; background: #163455; border: 1px solid #285178; }
.main-shell { margin-left: 228px; }
.topbar { min-height: 95px; height: auto; padding: 14px 17px 12px; gap: 18px; border-bottom: 0; background: #020a13; }
.topbar-main { display: flex; align-items: center; gap: 10px; min-width: 0; }
.page-heading { margin: 0; min-width: 0; }
.page-heading h1 { font-size: 25px; font-weight: 650; letter-spacing: -.65px; line-height: 1.25; }
.page-heading .eyebrow { display: none; }
.page-heading .subtitle { color: #bfc8d6; font-size: 14px; margin-top: 5px; line-height: 1.4; }
.top-actions { gap: 11px; flex-shrink: 0; }
.top-date { display: inline-flex; align-items: center; gap: 18px; color: #e3e7ef; border: 1px solid #233241; background: #030d18; border-radius: 6px; padding: 9px 12px; font-size: 13px; }
.top-date svg { width: 16px; height: 16px; color: #bcc7d9; }
.demo-badge { color: #e4bd67; background: #221c10; border-color: #564421; border-radius: 5px; }
.page { max-width: 1800px; padding: 0 17px 24px; }
.metrics { gap: 12px; margin-bottom: 14px; }
.metric {
  display: grid; grid-template-columns: 51px minmax(0, 1fr); grid-template-rows: auto auto auto; column-gap: 15px;
  padding: 19px 18px 17px; min-height: 130px; border: 1px solid #182a38; border-radius: 9px;
  background: linear-gradient(135deg, #071523, #040e19); box-shadow: none; text-align: left;
}
.metric:hover { transform: none; border-color: #305482; background: #091829; }
.metric-top { display: contents; }
.metric-top > span:first-child { grid-column: 2; grid-row: 1; font-size: 13px; line-height: 1.45; font-weight: 500; color: #f4f6fa; }
.metric-icon { grid-column: 1; grid-row: 1 / span 2; align-self: start; width: 51px; height: 51px; margin-top: 1px; border-radius: 50%; color: #f4f8ff; box-shadow: inset 0 0 10px #ffffff0d; }
.metric-icon svg { width: 26px; height: 26px; stroke-width: 1.9; }
.metric:nth-child(1) .metric-icon { background: linear-gradient(145deg, #1662f1, #032daf); }
.metric:nth-child(2) .metric-icon { background: linear-gradient(145deg, #8136b8, #3d147c); }
.metric:nth-child(3) .metric-icon { background: linear-gradient(145deg, #35a60c, #195806); }
.metric:nth-child(4) .metric-icon { background: linear-gradient(145deg, #c49005, #805700); }
.metric-value { grid-column: 2; grid-row: 2; font-size: 33px; line-height: 1.2; letter-spacing: -.55px; margin: 4px 0 5px; font-weight: 650; color: #f3f6fe; }
.metric-bottom { grid-column: 2; grid-row: 3; font-size: 12px; line-height: 1.45; color: #b6c1d2; }
.metric-bottom .warning { color: #e9b648; font-weight: 500; }
.workspace { grid-template-columns: minmax(0, 1fr) 344px; gap: 14px; }
.card { border: 1px solid #192936; background: linear-gradient(120deg, #07131f, #050f1a); border-radius: 9px; box-shadow: none; }
.card + .card { margin-top: 14px; }
.card-head { padding: 17px 18px 14px; }
.card-head h2 { color: #f3f5fb; font-size: 15px; font-weight: 550; letter-spacing: .15px; text-transform: uppercase; }
.card-head p { color: #a9b6c9; margin-top: 5px; }
.priority { border: 1px solid #3b2530; background: linear-gradient(110deg, #20151c, #100e17); border-radius: 9px; padding: 16px 18px; margin-bottom: 14px; }
.priority-icon { background: #461d26; border-radius: 8px; color: #f66d72; }
.priority-copy small { color: #f4777b; font-size: 11px; }
.priority h2 { color: #f1e6e9; font-weight: 550; font-size: 15px; }
.priority p { color: #c0a7b0; }
.priority .button { background: #161725; border: 1px solid #4a3540; color: #e6cdd4; box-shadow: none; }
.priority .button:hover { background: #2d1b2a; border-color: #79505b; }
.button { background: #081726; border-color: #26394f; color: #d4dfed; border-radius: 6px; font-weight: 500; }
.button:hover { background: #10263d; border-color: #3e628d; }
.button.primary { background: linear-gradient(110deg, #1257ef, #0640db); border-color: #1c55d7; color: white; box-shadow: 0 0 10px #074dff12; }
.button.primary:hover { background: #1a58e7; border-color: #4f83f3; }
.button.soft { background: #0c2240; color: #77acff; border-color: #1e426a; }
.button.text { background: transparent; color: #4292ff; }
.button.text:hover { color: #a1c9ff; }
th { background: #06111e; border-top-color: #182632; border-bottom-color: #182632; color: #a8b8cd; font-weight: 500; }
td { border-bottom-color: #142533; padding: 16px 18px; }
.time { color: #d3dbea; font-weight: 500; }
.time small { color: #9eb1c9; }
.patient-button { color: #eef1f8; font-weight: 500; }
.patient-button:hover { color: #67a7ff; }
.secondary { color: #a9b7ca; }
.person .avatar { background: #122840; border: 1px solid #29415e; border-radius: 50%; color: #a8c3e4; }
.status { border-radius: 4px; }
.status.confirmed, .status.complete { background: #092116; color: #81d269; border-color: #1c3c29; }
.status.pending { background: #2b1b12; color: #f2bd67; border-color: #4c3420; }
.status.arrived { background: #0b2440; color: #70adff; border-color: #1c426b; }
.status.open { background: #0b1928; color: #becbdc; border-color: #21364b; }
.card-foot { border-top-color: #162735; color: #a8b7cb; padding: 12px 18px; }
.followup-row { border-top-color: #142634; padding: 16px 18px; }
.followup-row h3 { font-weight: 500; }
.followup-row p { color: #aab8cc; }
.followup-row .avatar { background: #0a2745; border-color: #1e4670; color: #549cff; border-radius: 50%; }
.done-button { background: #0b1928; border-color: #2b4159; color: #b6cbe4; border-radius: 5px; }
.done-button:hover { background: #11301e; border-color: #3b743d; color: #89df76; }
.rhino-panel { background: linear-gradient(155deg, #081625, #040e19); border: 1px solid #1d3147; border-radius: 10px; box-shadow: none; padding: 18px; top: 14px; }
.rhino-panel:before { display: none; }
.rhino-heading h2 { font-size: 17px; font-weight: 550; color: #f3f5fa; letter-spacing: -.1px; }
.rhino-heading p { color: #b0c0d7; }
.rhino-mark { width: 43px; height: 43px; border: 1px solid #304154; border-radius: 50%; position: relative; overflow: hidden; background: #030b14; }
.rhino-mark img { position: absolute; width: 552.96px; height: 368.64px; max-width: none; left: -18px; top: -218px; pointer-events: none; }
.rhino-knowledge { color: #c7d7ec; border-color: #243b54; background: #0a1c31; border-radius: 6px; }
.rhino-knowledge:hover { background: #0e2947; }
.rhino-knowledge svg { color: #64a2ff; }
.chat-item.assistant { background: #08192a; border-color: #1c334e; border-radius: 5px; }
.chat-item.user { background: #123b70; border-color: #29578f; border-radius: 7px 7px 2px 7px; }
.chat-item .chat-label { color: #6ea8fb; }
.chat-priorities li { color: #ced9e9; }
.chat-priorities strong { color: #80b5ff; }
.source-link { color: #549cff; }
.prompt { color: #b9cde8; background: #0b1c30; border: 1px solid #2b4361; border-radius: 5px; }
.prompt:hover { background: #15365c; color: #fff; }
.rhino-compose { background: #020b16; border: 1px solid #335580; border-radius: 6px; }
.rhino-compose input { color: #edf4ff; }
.rhino-compose input::placeholder { color: #a3b5cd; }
.rhino-compose button { border-radius: 4px; background: #124ee4; }
.rhino-disclaimer { color: #a1b2c9; }
.workspace-note { color: #97a7bc; }
.filter { background: #081522; border-color: #253a4f; color: #b4c3d7; border-radius: 5px; }
.filter.active { background: #0a2b50; color: #88baff; border-color: #305988; }
.task-row { border-top-color: #1a2b3a; padding: 18px; }
.task-type { background: #322510; color: #edb64d; border-radius: 6px; }
.task-type.complete { background: #102914; color: #7dc65b; }
.task-main h3 { color: #f1f4fb; font-weight: 550; }
.task-main p { color: #aab9cb; }
.knowledge-card { background: linear-gradient(125deg, #071624, #050f1c); border-color: #1b2e41; border-radius: 9px; padding: 20px; }
.book-tile { background: #0b2547; border-color: #254a78; border-radius: 6px; color: #569bff; }
.knowledge-top h2 { color: #f2f5fc; font-weight: 550; }
.knowledge-top p, .knowledge-card > p { color: #b5c2d5; }
.inline-label { background: #0b213a; border-color: #2b4467; color: #b7cee9; border-radius: 4px; }
.knowledge-note { background: #091e35; border-color: #214265; color: #bccde1; border-radius: 8px; }
.knowledge-note strong { color: #77aeff; }
.dialog { background: #071320; color: #f1f4fa; border-color: #2d4560; border-radius: 12px; box-shadow: 0 25px 100px #000a; }
.dialog::backdrop { background: #010711c9; }
.dialog-header { border-bottom-color: #23384e; }
.dialog-header h2 { font-weight: 550; }
.dialog-header p, .detail-grid dt { color: #adbed4; }
.field input, .field textarea { background: #030d19; color: #edf2fb; border-color: #304966; border-radius: 6px; }
.field input::placeholder, .field textarea::placeholder { color: #95a8c2; }
.field small { color: #a4b6ce; }
.form-notice { background: #0c2035; color: #b9cbe2; border-color: #25435f; border-radius: 6px; }
.source-body { color: #c7d3e5; }
.checklist label { background: #091827; border-color: #294056; color: #e5edf9; border-radius: 7px; }
.checklist label:has(input:checked) { background: #0d261b; border-color: #386446; }
.draft-text { background: #0d213a; border-color: #2e4c73; }
.file-choice { background: #071c32; border-color: #45688f; border-radius: 7px; }
.file-choice input { color: #bdcde2; }
.file-choice input::file-selector-button { background: #143050; color: #bfdbff; border-color: #3d6089; border-radius: 5px; }
.error { color: #ff999b; }
.toast { background: #102139; border-color: #355475; color: #e4efff; border-radius: 8px; box-shadow: 0 8px 40px #0007; }
.float-rhino { background: #0b4aec; border-color: #4a7bea; color: #fff; border-radius: 7px; }
.icon-button:hover { background: #152a43; }

@media (max-width: 1380px) {
  .sidebar { width: 220px; }
  .main-shell { margin-left: 220px; }
  .topbar { padding-left: 15px; padding-right: 15px; }
  .page { padding-left: 15px; padding-right: 15px; }
  .topbar .avatar { display: none; }
  .top-actions { gap: 8px; }
  .top-date { padding: 8px 10px; gap: 10px; }
  .page-heading h1 { font-size: 23px; }
  .page-heading .subtitle { font-size: 13px; }
  .metric { grid-template-columns: 44px minmax(0, 1fr); column-gap: 12px; padding: 17px 14px; }
  .metric-icon { width: 44px; height: 44px; }
  .metric-icon svg { width: 23px; height: 23px; }
  .metric-top > span:first-child { font-size: 12px; }
  .metric-value { font-size: 31px; }
  .metric-bottom { font-size: 11px; }
  .workspace { grid-template-columns: minmax(0, 1fr) 314px; }
}
@media (max-width: 1140px) {
  .workspace { grid-template-columns: minmax(0, 1fr); }
  .top-date { display: none; }
  .page { padding-bottom: 90px; }
  .rhino-panel.mobile-open { box-shadow: 0 16px 90px #000a; background: #071423; border-color: #34557e; }
  .header-rhino { font-size: 12px; padding: 8px 10px; }
}
@media (max-width: 800px) {
  .sidebar { width: 228px; visibility: hidden; }
  .sidebar.mobile-open { visibility: visible; }
  .main-shell { margin-left: 0; }
  .topbar { flex-wrap: wrap; justify-content: space-between; padding: 17px 16px 14px; gap: 11px; }
  .topbar-main { flex: 1 1 auto; gap: 9px; }
  .page-heading h1 { font-size: 23px; }
  .page-heading .subtitle { font-size: 12px; max-width: 285px; margin-top: 4px; }
  .top-actions { margin-left: 34px; gap: 9px; }
  .top-actions .header-rhino { display: none; }
  .demo-badge { font-size: 10px; }
  .page { padding: 0 15px 88px; }
  .metrics { gap: 10px; margin-bottom: 13px; }
  .metric { grid-template-columns: 39px minmax(0, 1fr); column-gap: 10px; padding: 15px 12px; min-height: 122px; }
  .metric-icon { width: 39px; height: 39px; }
  .metric-icon svg { width: 22px; height: 22px; }
  .metric-top > span:first-child { font-size: 12px; line-height: 1.4; }
  .metric-value { font-size: 30px; }
  .metric-bottom { font-size: 11px; grid-column: 1 / -1; padding-top: 6px; }
  .priority { padding: 15px; }
  .card-head { padding: 16px 15px; }
  .card-head h2 { font-size: 14px; }
  .card-head p { font-size: 11px; }
  td { padding: 15px; }
  .card-foot { padding: 12px 15px; }
  .followup-row { padding: 16px 15px; }
  .person .avatar { display: none; }
  .task-row { padding: 18px 15px; }
  .knowledge-card { padding: 18px; }
  .rhino-panel.mobile-open { right: 14px; bottom: 14px; }
}