:root {
  --ink: #17211f;
  --muted: #72807c;
  --line: #dfe7e3;
  --surface: #ffffff;
  --canvas: #f3f7f5;
  --mint: #e9f6ef;
  --green: #1d7659;
  --green-dark: #135842;
  --purple: #6e61a8;
  --danger: #b74747;
  --shadow: 0 18px 50px rgba(27, 61, 49, .10);
  --text-bump: 1px;
  --app-height: 100dvh;
}

.function-menu > button.menu-danger { margin-top:5px; border-top:1px solid #f0dddd; border-radius:0 0 10px 10px; color:var(--danger); }
.function-menu > button.menu-danger:hover { background:#fff1f0; }
.function-menu > button.menu-danger i { background:#fff0ef; color:var(--danger); }
.function-menu > button:disabled { opacity:.55; cursor:wait; }
* { box-sizing: border-box; }
html { width: 100%; height: 100%; overflow: hidden; }
body { position:fixed; inset:0; width: 100%; height: 100%; min-width: 0; overflow: hidden; }
img, svg, video, canvas { max-width: 100%; }
button, input, select, textarea { max-width: 100%; }
button, input, select, textarea, [contenteditable] { min-width: 0; }
body { margin: 0; color: var(--ink); background: #e8efec; font-family: Manrope, system-ui, sans-serif; font-size:calc(14px + var(--text-bump)); }
body[data-font-size="large"] { --text-bump: 3px; }
body[data-font-size="extra"] { --text-bump: 5px; }
button, textarea { font: inherit; }
button { color: inherit; }
.app-shell { width: min(1480px, calc(100% - 32px)); max-width: 100%; height: min(900px, calc(100vh - 32px)); height: min(900px, calc(100dvh - 32px)); min-width: 0; min-height: 0; margin: 16px auto; display: grid; grid-template-columns: 244px minmax(0, 1fr) 290px; grid-template-rows:minmax(0,1fr); overflow: hidden; background: var(--surface); border: 1px solid rgba(23, 69, 53, .12); border-radius: 22px; box-shadow: var(--shadow); }
.app-shell > * { min-width: 0; min-height:0; }
.sidebar { display: flex; flex-direction: column; min-width: 0; min-height:0; overflow:hidden; padding: 25px 17px 18px; background: #f7faf8; border-right: 1px solid var(--line); }
.sidebar-close, .team-backdrop { display:none; }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 25px; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--green); color: white; font-size:calc(18px + var(--text-bump)); font-weight: 700; box-shadow: 0 7px 16px rgba(29,118,89,.22); }
.brand strong, .brand span { display: block; }
.brand strong { font-size:calc(16px + var(--text-bump)); letter-spacing: -.02em; }
.brand span { margin-top: 2px; color: var(--muted); font-size:calc(11px + var(--text-bump)); }
.team-heading, .activity-heading { display: flex; justify-content: space-between; align-items: center; }
.team-heading { padding: 0 9px 10px; color: var(--muted); font-size:calc(11px + var(--text-bump)); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.count { color: var(--green); letter-spacing: 0; text-transform: none; }
.agent-list { min-width:0; min-height:0; max-height:none; flex:1 1 0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; scrollbar-width: thin; }
.agent-group-label { padding: 15px 10px 6px; color: #94a19d; font-size:calc(10px + var(--text-bump)); font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.agent-row { width: 100%; min-width:0; display: grid; grid-template-columns: 34px minmax(0,1fr) 7px; align-items: center; gap: 9px; padding: 9px 10px; overflow:hidden; border: 0; border-radius: 11px; background: transparent; text-align: left; cursor: pointer; transition: .18s ease; }
.agent-row:hover { background: #edf4f0; }
.agent-row.active { background: #deeee6; color: var(--green-dark); }
.agent-icon { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #d4e1db; border-radius: 10px; background: white; color: var(--green); font-size:calc(16px + var(--text-bump)); }
.agent-row.active .agent-icon { background: var(--green); border-color: var(--green); color: white; }
.agent-row strong, .agent-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-row strong { font-size:calc(12px + var(--text-bump)); font-weight: 600; }
.agent-row small { margin-top: 2px; color: var(--muted); font-size:calc(9.5px + var(--text-bump)); }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: #54b68f; box-shadow: 0 0 0 2px white; }
.sidebar-note { display: flex; gap: 10px; align-items: center; margin-top: auto; padding: 12px; border: 1px solid #d9e8e0; border-radius: 12px; background: white; }
.pulse-dot { width: 8px; height: 8px; flex: none; border-radius: 50%; background: #d59d42; box-shadow: 0 0 0 4px #f8edd9; }
.pulse-dot.configured { background: #3da979; box-shadow: 0 0 0 4px #e1f2e9; }
.sidebar-note strong, .sidebar-note small { display: block; }
.sidebar-note strong { font-size:calc(10px + var(--text-bump)); }.sidebar-note small { margin-top: 2px; color: var(--muted); font-size:calc(9px + var(--text-bump)); }
.history-section { min-height: 0; max-height:190px; flex:0 1 auto; overflow:hidden; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.conversation-list { max-height: 150px; overflow-y: auto; scrollbar-width: thin; }
.conversation-row { width: 100%; display: block; padding: 8px 10px; border: 0; border-radius: 9px; background: transparent; text-align: left; cursor: pointer; }
.conversation-row:hover, .conversation-row.active { background: #e8f2ed; }
.conversation-row strong, .conversation-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-row strong { font-size:calc(9.5px + var(--text-bump)); font-weight: 500; }.conversation-row small { margin-top: 3px; color: var(--muted); font-size:calc(8px + var(--text-bump)); }
.no-conversations { padding: 0 10px; color: var(--muted); font-size:calc(9px + var(--text-bump)); }
.chat-column { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; background: var(--surface); }
.chat-header { position:relative; z-index:4; min-width: 0; min-height: 83px; flex: 0 0 auto; display: flex; align-items: center; gap: 12px; padding: 17px 25px; overflow: visible; border-bottom: 1px solid var(--line); }
.chat-header.has-risk { min-height:112px; padding-bottom:45px; }
.active-avatar, .message-avatar, .mini-avatar { display: grid; place-items: center; border-radius: 13px; background: #e4f1ea; color: var(--green-dark); font-weight: 700; }
.active-avatar { width: 44px; height: 44px; }
.chat-title { min-width: 0; flex: 1 1 auto; overflow: hidden; }.chat-title > div { display: flex; min-width: 0; align-items: center; gap: 8px; }.chat-title strong, .chat-title .role { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.chat-title strong { font-size:calc(14px + var(--text-bump)); }.role { padding: 3px 7px; border-radius: 6px; background: #eef2f0; color: var(--muted); font-size:calc(9px + var(--text-bump)); }.online { display: flex; align-items: center; gap: 5px; margin-top: 4px; color: var(--muted); font-size:calc(10px + var(--text-bump)); }.online i { width: 5px; height: 5px; border-radius: 50%; background: #3da979; }
.human-button, .primary-button { border: 0; border-radius: 10px; background: var(--green); color: white; font-weight: 600; cursor: pointer; transition: .18s ease; }
.human-button { margin-left: auto; padding: 10px 14px; font-size:calc(11px + var(--text-bump)); }.human-button:hover, .primary-button:hover { background: var(--green-dark); transform: translateY(-1px); }
.mobile-team { display: none; }.icon-button { border: 1px solid var(--line); border-radius: 9px; padding: 8px; background: white; cursor: pointer; font-size:calc(11px + var(--text-bump)); }
.new-chat-button { margin-left: auto; flex: 0 0 auto; white-space: nowrap; }.new-chat-button + .human-button { margin-left: 0; }.human-button, .mobile-team { flex: 0 0 auto; }
.handoff-banner { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; gap: 7px; margin: 12px 24px 0; padding: 8px 12px; border: 1px solid #dceae3; border-radius: 10px; background: #f2f8f5; color: var(--muted); animation: slideDown .3s ease; }
.handoff-banner p { min-width: 0; margin: 0 0 0 5px; overflow-wrap: anywhere; font-size:calc(10px + var(--text-bump)); }.mini-avatar { width: 25px; height: 25px; border-radius: 8px; font-size:calc(8px + var(--text-bump)); }.mini-avatar.specialist { background: var(--green); color: white; }.handoff-line { width: 28px; height: 1px; background: #aac5b8; position: relative; }.handoff-line::after { content: ''; position: absolute; right: -1px; top: -2px; width: 4px; height: 4px; border-top: 1px solid #aac5b8; border-right: 1px solid #aac5b8; transform: rotate(45deg); }
.insight-dock { flex: 0 0 auto; display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; margin: 10px clamp(22px, 5vw, 64px) 0; }.insight-card { min-width: 0; padding: 11px 12px; overflow: hidden; border: 1px solid #dce9e3; border-radius: 13px; background: linear-gradient(135deg,#fff,#f6faf8); box-shadow: 0 5px 16px rgba(31,75,59,.04); }.insight-heading { display: flex; min-width: 0; align-items: center; gap: 8px; }.insight-heading > div { min-width: 0; flex: 1; }.insight-heading strong, .insight-heading small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.insight-heading strong { font-size:calc(10px + var(--text-bump)); }.insight-heading small { margin-top: 2px; color: var(--muted); font-size:calc(8px + var(--text-bump)); }.insight-heading button { flex: none; padding: 4px 7px; border: 0; border-radius: 7px; background: var(--mint); color: var(--green); font-size:calc(8px + var(--text-bump)); cursor: pointer; }.insight-icon { display: grid; place-items: center; width: 25px; height: 25px; flex: none; border-radius: 8px; background: var(--mint); color: var(--green); }.fact-list { display: flex; gap: 5px; margin-top: 8px; overflow-x: auto; scrollbar-width: none; }.fact-list::-webkit-scrollbar { display:none; }.fact-chip { max-width: 210px; flex: 0 0 auto; padding: 4px 7px; overflow: hidden; border-radius: 7px; background: #edf4f1; color: #49625a; font-size:calc(8px + var(--text-bump)); text-overflow: ellipsis; white-space: nowrap; }.urgency-track { position: relative; height: 5px; margin: 12px 2px 8px; border-radius: 9px; background: linear-gradient(90deg,#57ad82 0 33%,#d9ab4d 55%,#d9675c 100%); }.urgency-track i { position: absolute; top: 50%; left: 8%; width: 11px; height: 11px; border: 2px solid white; border-radius: 50%; background: var(--green); box-shadow: 0 1px 5px rgba(0,0,0,.25); transform: translate(-50%,-50%); transition: left .35s ease; }
.header-risk { position:absolute; left:25px; right:25px; bottom:9px; display:grid; grid-template-columns:auto minmax(110px,1fr) minmax(90px,.45fr) auto; align-items:center; gap:10px; min-width:0; }.header-risk-label { display:flex; align-items:center; gap:6px; min-width:0; color:var(--green); }.header-risk-label > i { width:7px; height:7px; flex:none; border-radius:50%; background:currentColor; box-shadow:0 0 0 4px rgba(29,118,89,.1); }.header-risk-label strong { overflow:hidden; font-size:calc(8px + var(--text-bump)); text-overflow:ellipsis; white-space:nowrap; }.header-risk .urgency-track { min-width:0; margin:0; }.header-risk-topic,.header-risk-questions { min-width:0; overflow:hidden; color:var(--muted); font-size:calc(7px + var(--text-bump)); text-overflow:ellipsis; white-space:nowrap; }.header-risk-questions { text-align:right; }.header-risk[data-urgency="soon"] .header-risk-label { color:#a77821; }.header-risk[data-urgency="urgent"] .header-risk-label,.header-risk[data-urgency="emergency"] .header-risk-label { color:var(--danger); }
.messages { width: 100%; max-width: 100%; flex: 1 1 0; min-width: 0; min-height: 0; contain: inline-size; overflow-x: hidden; overflow-y: scroll; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; touch-action: pan-y; scrollbar-gutter: stable; scrollbar-color: #a9bdb4 transparent; padding: 26px clamp(22px, 5vw, 64px); background-image: radial-gradient(#dce8e2 0.55px, transparent .55px); background-size: 18px 18px; }
.messages::-webkit-scrollbar { width: 10px; }.messages::-webkit-scrollbar-track { background: transparent; }.messages::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 10px; background: #a9bdb4; background-clip: padding-box; }
.message-row { width: 100%; max-width: 100%; min-width: 0; display: flex; align-items: flex-start; gap: 10px; margin-bottom: 22px; animation: messageIn .27s ease both; }.message-row.user { justify-content: flex-end; }.message-row > :not(.message-avatar) { min-width: 0; max-width: calc(100% - 43px); }.message-row.user > .bubble { max-width: min(530px, 88%); }.message-avatar { width: 33px; height: 33px; flex: none; border-radius: 10px; font-size:calc(9px + var(--text-bump)); }.message-author { min-width: 0; display: flex; align-items: center; gap: 7px; margin: 0 0 6px 3px; overflow: hidden; }.message-author strong, .message-author span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.message-author strong { font-size:calc(11px + var(--text-bump)); }.message-author span { color: var(--muted); font-size:calc(9px + var(--text-bump)); }.bubble { width: fit-content; max-width: min(530px, 100%); min-width: 0; overflow: hidden; padding: 13px 16px 8px; box-shadow: 0 5px 18px rgba(31,75,59,.07); }.bubble p { min-width: 0; margin: 0; line-height: 1.65; font-size:calc(12px + var(--text-bump)); white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; }.bubble > span { display: block; margin-top: 5px; text-align: right; color: #8d9a96; font-size:calc(8px + var(--text-bump)); }.agent-bubble { border: 1px solid #e0e8e4; border-radius: 5px 15px 15px 15px; background: white; }.user-bubble { border-radius: 15px 15px 5px 15px; background: var(--green); color: white; }.user-bubble > span { color: rgba(255,255,255,.65); }.urgent .agent-bubble { border-color: #edcaca; background: #fff8f8; }.urgent .message-avatar { background: #f4dada; color: var(--danger); }
.message-file { display:inline-block; max-width:100%; margin:0 5px 7px 0; padding:4px 7px; overflow:hidden; border-radius:7px; background:rgba(255,255,255,.15); font-size:calc(8px + var(--text-bump)); font-style:normal; text-overflow:ellipsis; white-space:nowrap; }.special-label { flex:none; padding:3px 6px; border-radius:6px; background:#eeeafb; color:var(--purple); font-size:calc(7px + var(--text-bump)); }.council-result { width:min(650px,100%); margin:4px auto 24px; padding:15px; border:1px solid #d7e7df; border-radius:16px; background:linear-gradient(145deg,#fff,#f3f8f5); box-shadow:0 9px 28px rgba(31,75,59,.08); animation:messageIn .3s ease; }.council-title { display:flex; align-items:center; gap:9px; }.council-title > span { display:grid; place-items:center; width:31px; height:31px; border-radius:9px; background:var(--green); color:white; }.council-title strong, .council-title small { display:block; }.council-title strong { font-size:calc(11px + var(--text-bump)); }.council-title small { margin-top:2px; color:var(--muted); font-size:calc(8px + var(--text-bump)); }.opinion-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin:12px 0; }.opinion-grid article { min-width:0; padding:9px; border:1px solid var(--line); border-radius:10px; background:white; }.opinion-grid article > div { display:flex; align-items:center; gap:6px; }.opinion-grid i { display:grid; place-items:center; width:24px; height:24px; flex:none; border-radius:7px; background:var(--mint); color:var(--green); font-size:calc(7px + var(--text-bump)); font-style:normal; font-weight:700; }.opinion-grid strong, .opinion-grid small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.opinion-grid strong { font-size:calc(8px + var(--text-bump)); }.opinion-grid small { color:var(--muted); font-size:calc(7px + var(--text-bump)); }.council-focus { display:-webkit-box; margin-top:7px; overflow:hidden; color:var(--green); font-size:calc(7px + var(--text-bump)); font-style:normal; line-height:1.35; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.opinion-grid p { display:-webkit-box; margin:7px 0 0; overflow:hidden; color:#52655f; font-size:calc(7.5px + var(--text-bump)); line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:4; }.council-synthesis { padding:10px 11px; border-radius:10px; background:#eaf4ef; }.council-synthesis strong { font-size:calc(9px + var(--text-bump)); }.council-synthesis p { margin:5px 0 0; overflow-wrap:anywhere; white-space:pre-wrap; font-size:calc(9px + var(--text-bump)); line-height:1.55; }
.typing { display: flex; gap: 4px; padding: 14px 17px; border: 1px solid var(--line); border-radius: 5px 15px 15px 15px; background: white; }.typing i { width: 5px; height: 5px; border-radius: 50%; background: #82a695; animation: bounce 1s infinite ease-in-out; }.typing i:nth-child(2){ animation-delay:.13s }.typing i:nth-child(3){ animation-delay:.26s }
.system-error { width: min(560px, 100%); max-width: 100%; margin: 0 auto 20px; overflow: hidden; padding: 12px 14px; border: 1px solid #edcaca; border-radius: 11px; background: #fff8f8; color: var(--danger); }.system-error strong { font-size:calc(10px + var(--text-bump)); }.system-error p { margin: 4px 0 0; overflow-wrap: anywhere; word-break: break-word; font-size:calc(9px + var(--text-bump)); line-height: 1.5; }
.suggestions { flex: 0 0 auto; display: flex; gap: 7px; flex-wrap: wrap; padding: 0 clamp(22px, 5vw, 64px) 12px; }.suggestions button { padding: 7px 11px; border: 1px solid var(--line); border-radius: 20px; background: white; color: var(--muted); font-size:calc(10px + var(--text-bump)); cursor: pointer; }.suggestions button:hover { border-color: #90b7a5; color: var(--green); background: var(--mint); }
.composer { position: relative; z-index: 2; width: auto; min-width: 0; flex: 0 0 auto; margin: 0 clamp(18px, 4vw, 50px) 20px; padding: 6px 50px 24px; border: 1px solid #cad9d2; border-radius: 14px; background: white; box-shadow: 0 8px 24px rgba(27, 61, 49, .08); }.composer:focus-within { border-color: #79a891; box-shadow: 0 0 0 3px rgba(29,118,89,.08); }.composer textarea { width: 100%; min-width: 0; max-height: 140px; resize: none; overflow-wrap: anywhere; word-break: break-word; padding: 10px 0 4px; border: 0; outline: 0; color: var(--ink); background: transparent; font-size:calc(12px + var(--text-bump)); }.composer textarea::placeholder { color: #9ba7a3; }.attach-button, .send-button { position: absolute; top: 8px; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 10px; cursor: pointer; }.attach-button { left: 8px; background: #eef5f1; color: var(--green); font-size:calc(20px + var(--text-bump)); }.send-button { right: 8px; background: var(--green); color: white; }.send-button svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }.composer-meta { position: absolute; left: 50px; right: 50px; bottom: 7px; min-width: 0; display: flex; justify-content: space-between; gap: 8px; overflow: hidden; color: #9da8a4; font-size:calc(8px + var(--text-bump)); }.composer-meta span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.attachment-list { position: absolute; left: 0; right: 0; bottom: calc(100% + 7px); display: flex; gap: 6px; padding: 0 3px; overflow-x: auto; }.attachment-chip { display: flex; max-width: 200px; align-items: center; gap: 6px; flex: 0 0 auto; padding: 6px 8px; border: 1px solid #d8e7df; border-radius: 9px; background: white; box-shadow: 0 5px 15px rgba(31,75,59,.08); color: var(--muted); font-size:calc(8px + var(--text-bump)); }.attachment-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.attachment-chip button { border: 0; background: none; color: var(--danger); cursor: pointer; }
.activity-panel { display: flex; flex-direction: column; min-width: 0; min-height:0; overflow:hidden; padding: 25px 22px 18px; border-left: 1px solid var(--line); background: #fbfcfb; }.activity-heading strong, .activity-heading span { display: block; }.activity-heading strong { font-size:calc(13px + var(--text-bump)); }.activity-heading div > span { margin-top: 4px; color: var(--muted); font-size:calc(9px + var(--text-bump)); }.live-badge { padding: 4px 7px; border-radius: 6px; background: #e1f2e9; color: var(--green)!important; font-size:calc(8px + var(--text-bump))!important; font-weight: 700; letter-spacing: .08em; }
.memory-button { width: 100%; display: grid; grid-template-columns: 28px minmax(0,1fr) 20px; align-items: center; gap: 8px; margin-top: 16px; padding: 9px; border: 1px solid var(--line); border-radius: 11px; background: white; text-align: left; cursor: pointer; }.memory-button > span { display:grid; place-items:center; width:28px; height:28px; border-radius:8px; background:var(--mint); color:var(--green); }.memory-button strong, .memory-button small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.memory-button strong { font-size:calc(9px + var(--text-bump)); }.memory-button small { margin-top:2px; color:var(--muted); font-size:calc(7.5px + var(--text-bump)); }.memory-button b { display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#edf4f1; color:var(--green); font-size:calc(8px + var(--text-bump)); }
.timeline { flex: 1; min-height: 0; margin-top: 28px; overflow-y: auto; }.empty-state { margin: 70px 10px 0; text-align: center; }.empty-icon { display: grid; place-items: center; width: 42px; height: 42px; margin: 0 auto 13px; border-radius: 13px; background: var(--mint); color: var(--green); font-size:calc(21px + var(--text-bump)); }.empty-state strong { font-size:calc(11px + var(--text-bump)); }.empty-state p { margin: 7px 0; color: var(--muted); font-size:calc(9px + var(--text-bump)); line-height: 1.55; }
.timeline-item { position: relative; min-width: 0; display: grid; grid-template-columns: 25px minmax(0, 1fr); gap: 10px; padding-bottom: 24px; }.timeline-item::after { content: ''; position: absolute; left: 12px; top: 25px; bottom: 0; width: 1px; background: #dbe6e1; }.timeline-item:last-child::after { display: none; }.timeline-marker { z-index: 1; display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; background: #e5f2eb; color: var(--green); font-size:calc(9px + var(--text-bump)); font-weight: 700; }.timeline-item.active .timeline-marker { background: var(--green); color: white; }.timeline-marker i { width: 6px; height: 6px; border-radius: 50%; background: white; animation: pulse 1.2s infinite; }.timeline-item strong, .timeline-item p, .timeline-item span { overflow-wrap: anywhere; word-break: break-word; }.timeline-item strong { font-size:calc(10px + var(--text-bump)); }.timeline-item p { margin: 4px 0; color: var(--ink); font-size:calc(9px + var(--text-bump)); line-height: 1.45; }.timeline-item span { color: var(--muted); font-size:calc(8px + var(--text-bump)); }
.safety-card { display: flex; gap: 9px; padding: 12px; border: 1px solid #e1e7e4; border-radius: 12px; background: white; }.shield { display: grid; place-items: center; width: 26px; height: 26px; flex: none; border-radius: 9px; background: #e5f2eb; color: var(--green); font-weight: 700; }.safety-card strong { font-size:calc(9px + var(--text-bump)); }.safety-card p { margin: 4px 0 0; color: var(--muted); font-size:calc(8px + var(--text-bump)); line-height: 1.4; }
.modal-backdrop { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; min-width:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; padding: 20px; background: rgba(18, 33, 28, .48); backdrop-filter: blur(5px); }.modal { position: relative; width: min(430px, 100%); min-width:0; max-height:calc(100dvh - 40px); overflow-x:hidden; overflow-y:auto; overflow-wrap:anywhere; padding: 31px; border-radius: 20px; background: white; box-shadow: var(--shadow); text-align: center; animation: messageIn .25s ease; }.modal > * { max-width:100%; }.modal-close { position: absolute; top: 12px; right: 14px; border: 0; background: none; color: var(--muted); font-size:calc(24px + var(--text-bump)); cursor: pointer; }.modal-icon { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 15px; border-radius: 15px; background: var(--mint); color: var(--green); font-size:calc(22px + var(--text-bump)); }.modal h2 { margin: 0; padding-inline:6px; overflow-wrap:anywhere; font-size:calc(18px + var(--text-bump)); }.modal p { overflow-wrap:anywhere; color: var(--muted); font-size:calc(11px + var(--text-bump)); line-height: 1.6; }.ticket { display: flex; min-width:0; justify-content: space-between; gap:10px; margin: 18px 0; padding: 12px; border-radius: 10px; background: var(--canvas); font-size:calc(10px + var(--text-bump)); }.ticket span,.ticket strong { min-width:0; overflow-wrap:anywhere; }.ticket span { color: var(--muted); }
.human-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-bottom: 13px; }.human-option { display: flex; min-width:0; align-items: center; gap: 9px; min-height: 68px; padding: 11px; border: 1px solid var(--line); border-radius: 12px; background: white; color: var(--ink); text-align: left; cursor: pointer; transition: .18s ease; }.human-option > span:last-child { min-width:0; }.human-option:hover, .human-option:focus-visible { border-color: #79a891; background: var(--mint); outline: none; transform: translateY(-1px); }.human-option:disabled { opacity: .55; cursor: wait; transform: none; }.human-option-icon { display: grid; place-items: center; width: 31px; height: 31px; flex: none; border-radius: 9px; background: #e4f1ea; color: var(--green); font-size:calc(15px + var(--text-bump)); }.human-option strong, .human-option small { display: block; overflow-wrap:anywhere; }.human-option strong { font-size:calc(10px + var(--text-bump)); }.human-option small { margin-top: 3px; color: var(--muted); font-size:calc(8px + var(--text-bump)); line-height: 1.35; }.secondary-button { width: 100%; padding: 10px; border: 0; border-radius: 10px; background: transparent; color: var(--green); font-size:calc(10px + var(--text-bump)); font-weight: 600; cursor: pointer; }.secondary-button:hover { background: var(--mint); }
.call-phone-step { margin-bottom:13px; padding:14px; border:1px solid #cfe1d8; border-radius:14px; background:#f7fbf9; text-align:left; }.call-phone-step > strong { display:block; font-size:calc(12px + var(--text-bump)); }.call-phone-step > p { margin:5px 0 10px; color:var(--muted); font-size:calc(8px + var(--text-bump)); line-height:1.45; }.call-phone-step .field-label { margin:10px 0; }.call-phone-back { margin:0 0 10px; padding:0; border:0; background:none; color:var(--green); font-size:calc(8px + var(--text-bump)); font-weight:600; cursor:pointer; }.call-phone-error { display:block; margin:-3px 0 10px; color:var(--danger); font-size:calc(8px + var(--text-bump)); }.call-phone-step .primary-button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.handoff-preview { margin: 12px 0; padding: 10px; border: 1px solid #dce9e3; border-radius: 10px; background: #f7faf8; text-align: left; }.handoff-preview strong { display:block; margin-bottom:5px; font-size:calc(9px + var(--text-bump)); }.handoff-preview span, .handoff-preview li { color:var(--muted); font-size:calc(8px + var(--text-bump)); line-height:1.45; }.handoff-preview ul { margin:5px 0 0; padding-left:16px; }.field-label { display:block; margin:12px 0; color:var(--muted); text-align:left; font-size:calc(9px + var(--text-bump)); }.field-label small { display:block; margin-top:5px; color:var(--muted); font-size:calc(7px + var(--text-bump)); line-height:1.4; }.field-label input, .field-label textarea, .memory-form input, .memory-form select { width:100%; margin-top:5px; padding:9px 10px; resize:vertical; border:1px solid var(--line); border-radius:9px; outline:none; color:var(--ink); background:white; font-size:calc(10px + var(--text-bump)); }.field-label input[readonly] { background:#f3f7f5; color:#587067; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }.field-label input:focus, .field-label textarea:focus, .memory-form input:focus { border-color:#79a891; }.context-modal, .memory-modal { text-align:left; }.context-modal .modal-icon, .memory-modal .modal-icon { margin-left:0; }.context-modal h2, .memory-modal h2 { text-align:left; }.primary-button { width:100%; padding:11px; }.memory-modal { width:min(520px,100%); }.memory-form { display:grid; grid-template-columns:120px minmax(0,1fr) auto; gap:7px; margin:15px 0; }.memory-form input, .memory-form select { margin:0; }.memory-form button { border:0; border-radius:9px; background:var(--green); color:white; font-size:calc(9px + var(--text-bump)); cursor:pointer; }.memory-list { max-height:260px; overflow-y:auto; }.memory-item { display:grid; grid-template-columns:75px minmax(0,1fr) 24px; align-items:center; gap:7px; padding:8px 2px; border-bottom:1px solid var(--line); }.memory-item small { color:var(--green); font-size:calc(7px + var(--text-bump)); text-transform:uppercase; }.memory-item span { overflow-wrap:anywhere; font-size:calc(9px + var(--text-bump)); }.memory-item button { border:0; background:none; color:var(--danger); cursor:pointer; }
.capabilities-button { flex:0 0 auto; white-space:nowrap; border-color:#cfe1d8; background:var(--mint); color:var(--green); font-weight:600; }.profile-button + .memory-button { margin-top:8px; }.capabilities-modal { width:min(720px,100%); text-align:left; }.capabilities-modal .modal-icon { margin-left:0; }.capabilities-modal h2 { text-align:left; }.capability-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:18px; }.capability-card { min-width:0; display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:9px; min-height:72px; padding:11px; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fbfdfc; color:var(--ink); text-align:left; }.capability-card > span { min-width:0; }.capability-card.accent { border-color:#bcd8ca; background:linear-gradient(135deg,#edf8f2,#fff); cursor:pointer; }.capability-card i { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; background:var(--mint); color:var(--green); font-style:normal; font-weight:700; }.capability-card strong, .capability-card small { display:block; overflow-wrap:anywhere; }.capability-card strong { font-size:calc(10px + var(--text-bump)); }.capability-card small { margin-top:3px; color:var(--muted); font-size:calc(8px + var(--text-bump)); line-height:1.35; }.capability-card b { max-width:82px; padding:4px 6px; overflow:hidden; border-radius:6px; background:var(--green); color:white; font-size:calc(7px + var(--text-bump)); text-overflow:ellipsis; white-space:nowrap; }.profile-modal { width:min(680px,100%); text-align:left; }.profile-modal .modal-icon { margin-left:0; }.profile-modal h2 { text-align:left; }.profile-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; }.profile-grid .wide { grid-column:1/-1; }.field-label select { width:100%; margin-top:5px; padding:9px 10px; border:1px solid var(--line); border-radius:9px; outline:none; color:var(--ink); background:white; font-size:calc(10px + var(--text-bump)); }.profile-footer { display:flex; align-items:center; gap:12px; margin-top:13px; }.profile-footer span { min-width:0; flex:1; overflow-wrap:anywhere; color:var(--muted); font-size:calc(8px + var(--text-bump)); }.profile-footer .primary-button { width:auto; min-width:170px; }.preview-edit { display:block; margin-top:8px; padding:5px 7px; border:0; border-radius:7px; background:var(--mint); color:var(--green); font-size:calc(8px + var(--text-bump)); cursor:pointer; }
.lab-results-modal { width:min(500px,100%); text-align:left; }.lab-results-modal .modal-icon { margin-left:0; }.lab-results-modal h2 { text-align:left; }.lab-tube-step { margin-top:16px; padding:14px; border:1px solid #cfe1d8; border-radius:14px; background:#f7fbf9; }.lab-tube-step > strong { display:block; font-size:calc(11px + var(--text-bump)); }.lab-tube-step > p { margin:5px 0 8px; font-size:calc(8px + var(--text-bump)); }.lab-results-error { display:block; margin:-5px 0 10px; color:var(--danger); font-size:calc(8px + var(--text-bump)); }.lab-tube-card { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3px 10px; margin:16px 0 12px; padding:12px; border-radius:12px; background:var(--mint); }.lab-tube-card span { grid-column:1/-1; color:var(--muted); font-size:calc(8px + var(--text-bump)); }.lab-tube-card strong { min-width:0; overflow-wrap:anywhere; color:var(--green-dark); font-size:calc(12px + var(--text-bump)); }.lab-tube-card button { align-self:center; padding:5px 8px; border:0; border-radius:8px; background:white; color:var(--green); font-size:calc(8px + var(--text-bump)); cursor:pointer; }.lab-results-placeholder { display:grid; grid-template-columns:34px minmax(0,1fr); gap:10px; margin-bottom:13px; padding:13px; border:1px solid var(--line); border-radius:13px; background:#fbfdfc; }.lab-results-placeholder > span { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; background:#dff1e8; color:var(--green); font-weight:700; }.lab-results-placeholder strong { display:block; font-size:calc(10px + var(--text-bump)); }.lab-results-placeholder p { margin:4px 0 0; font-size:calc(8px + var(--text-bump)); }.lab-results-ready .primary-button:disabled { opacity:.55; cursor:not-allowed; transform:none; }
.council-modal { width:min(520px,100%); text-align:left; }.council-modal .modal-icon { margin-left:0; }.council-modal h2 { text-align:left; }.council-steps { display:grid; gap:8px; margin:16px 0; }.council-steps article { display:grid; grid-template-columns:28px minmax(0,1fr); align-items:start; gap:9px; padding:10px; border:1px solid var(--line); border-radius:11px; background:#fbfdfc; }.council-steps b { display:grid; place-items:center; width:28px; height:28px; border-radius:9px; background:var(--mint); color:var(--green); font-size:calc(10px + var(--text-bump)); }.council-steps strong,.council-steps small { display:block; }.council-steps strong { font-size:calc(10px + var(--text-bump)); }.council-steps small { margin-top:3px; color:var(--muted); font-size:calc(8px + var(--text-bump)); line-height:1.4; }.council-members { margin:14px 0; padding:11px; border-radius:11px; background:#f1f7f4; }.council-members > span { color:var(--muted); font-size:calc(8px + var(--text-bump)); text-transform:uppercase; }.council-members > div { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }.council-member { display:flex; align-items:center; gap:5px; padding:5px 7px; border-radius:8px; background:white; color:var(--ink); font-size:calc(8px + var(--text-bump)); }.council-member i { display:grid; place-items:center; width:21px; height:21px; border-radius:7px; background:var(--mint); color:var(--green); font-size:calc(6px + var(--text-bump)); font-style:normal; font-weight:700; }
.header-actions { display:flex; flex:0 0 auto; align-items:center; gap:8px; margin-left:auto; }.header-action-button { display:grid; place-items:center; width:40px; height:40px; padding:0; border:1px solid #cfe1d8; border-radius:12px; background:white; color:var(--green); font-size:calc(18px + var(--text-bump)); cursor:pointer; transition:.16s ease; }.header-action-button:hover,.header-action-button[aria-expanded="true"] { border-color:#8cb5a2; background:var(--mint); }.function-menu-wrap { position:relative; }.function-menu { position:absolute; top:calc(100% + 10px); right:0; z-index:12; width:280px; max-height:min(560px,calc(100dvh - 100px)); overflow-y:auto; padding:10px; border:1px solid var(--line); border-radius:15px; background:white; box-shadow:0 18px 50px rgba(20,50,39,.2); animation:messageIn .18s ease; }.function-menu > strong { display:block; padding:5px 7px 9px; color:var(--muted); font-size:calc(9px + var(--text-bump)); text-transform:uppercase; letter-spacing:.08em; }.function-menu > button { width:100%; min-width:0; display:grid; grid-template-columns:32px minmax(0,1fr); align-items:center; gap:9px; padding:9px; border:0; border-radius:10px; background:white; color:var(--ink); text-align:left; cursor:pointer; }.function-menu > button:hover { background:var(--mint); }.function-menu i { display:grid; place-items:center; width:32px; height:32px; border-radius:9px; background:#edf6f1; color:var(--green); font-size:calc(12px + var(--text-bump)); font-style:normal; }.function-menu span,.function-menu small { display:block; min-width:0; }.function-menu span { font-size:calc(10px + var(--text-bump)); font-weight:600; }.function-menu small { margin-top:2px; overflow:hidden; color:var(--muted); font-size:calc(7.5px + var(--text-bump)); font-weight:400; text-overflow:ellipsis; white-space:nowrap; }
.appearance-options,.font-size-options { display:grid; gap:10px; margin-top:18px; }.appearance-options { grid-template-columns:repeat(3,minmax(0,1fr)); }.appearance-choice,.font-size-choice { min-width:0; display:flex; align-items:center; gap:10px; padding:13px; border:1px solid var(--line); border-radius:13px; background:#fbfdfc; color:var(--ink); text-align:left; cursor:pointer; }.appearance-choice { min-height:92px; flex-direction:column; justify-content:center; text-align:center; }.appearance-choice.selected,.font-size-choice.selected { border-color:var(--green); background:var(--mint); box-shadow:inset 0 0 0 1px var(--green); }.appearance-choice b,.appearance-choice small,.font-size-choice b,.font-size-choice small { display:block; }.appearance-choice b { color:var(--green); }.appearance-choice small,.font-size-choice small { margin-top:4px; color:var(--muted); line-height:1.35; }.appearance-choice[data-size="standard"] b { font-size:calc(12px + var(--text-bump)); }.appearance-choice[data-size="large"] b { font-size:calc(16px + var(--text-bump)); }.appearance-choice[data-size="extra"] b { font-size:calc(20px + var(--text-bump)); }.font-size-modal { width:min(480px,100%); text-align:left; }.font-size-modal .modal-icon { margin-left:0; }.font-size-modal h2 { text-align:left; }.font-size-choice { width:100%; }.font-size-choice > i { display:grid; place-items:center; width:40px; height:40px; flex:none; border-radius:11px; background:white; color:var(--green); font-style:normal; font-weight:700; }.font-size-choice[data-size="standard"] > i { font-size:calc(13px + var(--text-bump)); }.font-size-choice[data-size="large"] > i { font-size:calc(17px + var(--text-bump)); }.font-size-choice[data-size="extra"] > i { font-size:calc(21px + var(--text-bump)); }
.activity-panel > .memory-button + .memory-button { margin-top:8px; }
.body-map-modal { width:min(920px,100%); max-height:min(92dvh,820px); overflow-y:auto; text-align:left; }.body-map-modal > .modal-icon { margin-left:0; }.body-map-modal > h2 { text-align:left; }.body-map-layout { display:grid; grid-template-columns:minmax(250px,340px) minmax(0,1fr); gap:22px; margin-top:18px; }.body-picker { min-width:0; padding:12px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(180deg,#f5faf7,#fff); }.body-view-tabs { display:grid; grid-template-columns:1fr 1fr; gap:5px; padding:4px; border-radius:11px; background:#eaf2ee; }.body-view-tabs button { min-height:36px; border:0; border-radius:8px; outline:none; background:transparent; color:var(--muted); font-weight:600; cursor:pointer; }.body-view-tabs button:focus-visible { box-shadow:inset 0 0 0 2px #6ba88d; }.body-view-tabs button.selected { background:white; color:var(--green); box-shadow:0 2px 9px rgba(31,75,59,.09); }.body-canvas { position:relative; display:grid; place-items:center; min-height:470px; overflow:hidden; }.body-figure { width:min(100%,230px); height:450px; overflow:visible; }.body-silhouette { stroke:#a9c5b8; stroke-width:1.6; stroke-linejoin:round; }.body-silhouette > * { vector-effect:non-scaling-stroke; }.body-details { fill:none; stroke:#b7cdc2; stroke-width:1.2; stroke-linecap:round; opacity:.9; pointer-events:none; }.body-details * { vector-effect:non-scaling-stroke; }#bodyFront .body-silhouette { fill:url(#bodyFrontFill); }#bodyBack .body-silhouette { fill:url(#bodyBackFill); }.body-zone { fill:rgba(72,166,125,.001); stroke:transparent; stroke-width:2.4; stroke-linejoin:round; cursor:pointer; outline:none; transition:.16s ease; }.body-zone:hover,.body-zone:focus { fill:rgba(71,168,124,.2); stroke:#398767; }.body-zone.selected { fill:rgba(29,118,89,.3); stroke:var(--green); }.body-zone.has-symptom { fill:rgba(220,111,93,.16); stroke:#d06458; }.body-zone.has-symptom.selected { fill:rgba(220,88,72,.3); }.body-map-legend { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; color:var(--muted); font-size:calc(7px + var(--text-bump)); }.body-map-legend span { display:flex; align-items:center; gap:5px; }.body-map-legend i { width:9px; height:9px; border-radius:50%; background:#acd9c5; }.body-map-legend i.saved { background:#d56f62; }.symptom-form { min-width:0; }.selected-body-region { display:flex; align-items:center; gap:11px; padding:12px; border:1px solid #cfe1d8; border-radius:13px; background:var(--mint); }.selected-body-region > span { display:grid; place-items:center; width:34px; height:34px; flex:none; border-radius:11px; background:white; color:var(--green); font-weight:700; }.selected-body-region small,.selected-body-region strong { display:block; }.selected-body-region small { color:var(--muted); font-size:calc(7px + var(--text-bump)); }.selected-body-region strong { margin-top:2px; font-size:calc(11px + var(--text-bump)); }.symptom-form fieldset { min-width:0; margin:14px 0 0; padding:0; border:0; }.symptom-form legend,.intensity-field { color:var(--muted); font-size:calc(9px + var(--text-bump)); }.symptom-choice-grid { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }.symptom-choice-grid button { padding:8px 10px; border:1px solid var(--line); border-radius:9px; background:white; color:var(--ink); font-size:calc(9px + var(--text-bump)); cursor:pointer; }.symptom-choice-grid button.selected { border-color:var(--green); background:var(--mint); color:var(--green); box-shadow:inset 0 0 0 1px var(--green); }.intensity-field { display:block; margin-top:15px; }.intensity-field strong { float:right; color:var(--green); }.intensity-field input { width:100%; margin-top:9px; accent-color:var(--green); }.symptom-field-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.symptom-safety-note { margin:12px 0; padding:9px 10px; border-radius:10px; background:#fff8ea; color:#80642d; font-size:calc(8px + var(--text-bump)); line-height:1.45; }
.symptom-form .primary-button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.health-history-modal { width:min(820px,100%); max-height:min(92dvh,820px); overflow-y:auto; text-align:left; }.history-heading { display:flex; align-items:flex-start; gap:18px; }.history-heading > div { min-width:0; flex:1; }.history-heading .modal-icon { margin-left:0; }.history-heading h2 { margin-top:10px; text-align:left; }.history-heading p { margin-bottom:0; }.history-add-symptom { flex:none; margin:8px 36px 0 0; padding:9px 12px; border:0; border-radius:10px; background:var(--green); color:white; font-weight:600; cursor:pointer; }.history-filters { display:flex; gap:7px; margin:18px 0 12px; overflow-x:auto; scrollbar-width:none; }.history-filters::-webkit-scrollbar { display:none; }.history-filters button { flex:0 0 auto; padding:7px 10px; border:1px solid var(--line); border-radius:999px; background:white; color:var(--muted); font-size:calc(8px + var(--text-bump)); cursor:pointer; }.history-filters button.selected { border-color:var(--green); background:var(--mint); color:var(--green); }.health-history-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:16px; }.history-stat { min-width:0; padding:10px; border-radius:11px; background:#f3f8f5; }.history-stat strong,.history-stat span { display:block; }.history-stat strong { color:var(--green); font-size:calc(15px + var(--text-bump)); }.history-stat span { margin-top:2px; overflow:hidden; color:var(--muted); font-size:calc(7px + var(--text-bump)); text-overflow:ellipsis; white-space:nowrap; }.health-history-list { position:relative; min-height:120px; }.health-history-list::before { content:''; position:absolute; top:14px; bottom:14px; left:17px; width:1px; background:#d7e5de; }.health-event { position:relative; display:grid; grid-template-columns:36px minmax(0,1fr); gap:11px; padding-bottom:14px; }.health-event-icon { z-index:1; display:grid; place-items:center; width:36px; height:36px; border:4px solid white; border-radius:50%; background:#dff1e8; color:var(--green); font-size:calc(10px + var(--text-bump)); font-weight:700; }.health-event[data-type="symptom"] .health-event-icon { background:#f9dfdc; color:#b54e45; }.health-event[data-type="document"] .health-event-icon { background:#e6e9f8; color:#5a66a5; }.health-event[data-type="council"] .health-event-icon { background:#eee7fb; color:#6f52a4; }.health-event-card { min-width:0; padding:11px 12px; border:1px solid var(--line); border-radius:13px; background:white; }.health-event-top { display:flex; align-items:flex-start; gap:9px; }.health-event-top > div { min-width:0; flex:1; }.health-event-top strong,.health-event-top small { display:block; overflow-wrap:anywhere; }.health-event-top strong { font-size:calc(10px + var(--text-bump)); }.health-event-top small { margin-top:3px; color:var(--muted); font-size:calc(8px + var(--text-bump)); line-height:1.4; }.health-event-date { flex:none; color:var(--muted); font-size:calc(7px + var(--text-bump)); white-space:nowrap; }.health-event-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }.health-event-meta span { padding:4px 7px; border-radius:7px; background:#f0f5f2; color:#4f665d; font-size:calc(7px + var(--text-bump)); }.health-event-actions { display:flex; gap:7px; margin-top:9px; }.health-event-actions button { padding:5px 8px; border:0; border-radius:7px; background:var(--mint); color:var(--green); font-size:calc(7px + var(--text-bump)); cursor:pointer; }.health-event-actions button.danger { background:#fff0ef; color:var(--danger); }.history-empty { padding:32px 16px; color:var(--muted); text-align:center; font-size:calc(9px + var(--text-bump)); }
.hidden { display: none!important; }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.onboarding { min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; align-items:center; padding:max(18px,env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom)); background:radial-gradient(circle at 50% -20%,#dff1e8 0,transparent 44%),var(--canvas); }
.onboarding-brand { width:min(560px,100%); min-width:0; display:flex; align-items:center; gap:10px; margin-bottom:18px; }.onboarding-brand > span { display:grid; place-items:center; width:40px; height:40px; flex:none; border-radius:13px; background:var(--green); color:white; font-weight:700; }.onboarding-brand > div { min-width:0; }.onboarding-brand strong,.onboarding-brand small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.onboarding-brand strong { font-size:calc(14px + var(--text-bump)); }.onboarding-brand small { margin-top:2px; color:var(--muted); font-size:calc(9px + var(--text-bump)); }.onboarding-brand b { max-width:42%; margin-left:auto; padding:6px 9px; overflow:hidden; border-radius:9px; background:white; color:var(--green); font-size:calc(9px + var(--text-bump)); box-shadow:0 3px 12px rgba(31,75,59,.07); text-overflow:ellipsis; white-space:nowrap; }
.onboarding-card { width:min(560px,100%); min-width:0; overflow:hidden; padding:clamp(20px,5vw,36px); border:1px solid rgba(23,69,53,.12); border-radius:24px; background:white; box-shadow:var(--shadow); }.onboarding-progress { height:5px; margin-bottom:28px; overflow:hidden; border-radius:9px; background:#e7efeb; }.onboarding-progress i { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--green),#61a986); transition:width .3s ease; }
.onboarding-kicker { color:var(--green); font-size:calc(10px + var(--text-bump)); font-weight:700; letter-spacing:.06em; text-transform:uppercase; }.onboarding-card h1 { margin:8px 0; overflow-wrap:anywhere; font-size:clamp(calc(22px + var(--text-bump)),calc(6vw + var(--text-bump)),calc(30px + var(--text-bump))); line-height:1.15; }.onboarding-lead { margin:0 0 24px; color:var(--muted); font-size:calc(11px + var(--text-bump)); line-height:1.6; }.onboarding-input { width:100%; min-height:50px; padding:13px 14px; border:1px solid var(--line); border-radius:13px; outline:none; color:var(--ink); background:#fbfdfc; font:inherit; font-size:calc(14px + var(--text-bump)); }.onboarding-input:focus { border-color:#70a48b; box-shadow:0 0 0 3px rgba(29,118,89,.08); }.onboarding-input-area { height:68px; min-height:68px; max-height:96px; resize:vertical; }
.choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.choice-button { min-width:0; min-height:52px; padding:11px 12px; overflow-wrap:anywhere; border:1px solid var(--line); border-radius:13px; background:#fbfdfc; color:var(--ink); font-size:calc(11px + var(--text-bump)); font-weight:600; cursor:pointer; transition:.16s ease; }.choice-button:hover,.choice-button.selected { border-color:var(--green); background:var(--mint); color:var(--green); box-shadow:inset 0 0 0 1px var(--green); }
.onboarding-actions { display:flex; gap:10px; margin-top:26px; }.onboarding-actions button { min-height:46px; padding:11px 18px; border:0; border-radius:12px; font-size:calc(11px + var(--text-bump)); font-weight:700; cursor:pointer; }.onboarding-back { background:#eef4f1; color:var(--green); }.onboarding-next { flex:1; background:var(--green); color:white; }.onboarding-next:disabled { opacity:.45; cursor:not-allowed; }.onboarding-error { margin:14px 0 0; padding:10px; border-radius:10px; background:#fff2f2; color:var(--danger); font-size:calc(10px + var(--text-bump)); }.onboarding-safety { width:min(560px,100%); margin:14px 0 0; color:#73827d; text-align:center; font-size:calc(8px + var(--text-bump)); line-height:1.5; }
.bmi-preview { margin-top:12px; padding:10px 12px; border-radius:11px; background:var(--mint); color:var(--green); font-size:calc(10px + var(--text-bump)); }.exam-intro { display:flex; gap:11px; margin:16px 0; padding:12px; border-radius:13px; background:#f2f7f4; color:var(--muted); font-size:calc(9px + var(--text-bump)); line-height:1.5; }.exam-intro strong { color:var(--ink); }.exam-list { display:grid; gap:10px; max-height:min(45vh,410px); overflow-y:auto; padding-right:3px; }.exam-card { position:relative; display:block; min-width:0; padding:14px 42px 14px 14px; border:1px solid var(--line); border-radius:14px; background:white; cursor:pointer; }.exam-card.selected { border-color:var(--green); background:#f4faf7; box-shadow:inset 0 0 0 1px var(--green); }.exam-card input { position:absolute; opacity:0; }.exam-check { position:absolute; top:15px; right:14px; display:grid; place-items:center; width:21px; height:21px; border:1px solid #aec2b8; border-radius:7px; color:transparent; }.exam-card.selected .exam-check { border-color:var(--green); background:var(--green); color:white; }.exam-card strong,.exam-card small,.exam-card em { display:block; overflow-wrap:anywhere; }.exam-card strong { padding-right:55px; font-size:calc(11px + var(--text-bump)); }.exam-card b { position:absolute; top:15px; right:45px; color:var(--green); font-size:calc(10px + var(--text-bump)); }.exam-card small { margin-top:6px; color:var(--muted); font-size:calc(8px + var(--text-bump)); line-height:1.45; }.exam-card em { margin-top:5px; color:#45675a; font-size:calc(8px + var(--text-bump)); font-style:normal; }.recommended-badge { display:inline-block!important; width:max-content; margin:0 0 6px!important; padding:3px 6px; border-radius:6px; background:#dff1e8; color:var(--green)!important; font-size:calc(7px + var(--text-bump))!important; font-weight:700; text-transform:uppercase; }.exam-total { display:flex; justify-content:space-between; gap:10px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line); font-size:calc(11px + var(--text-bump)); }.exam-skip { width:100%; margin-top:9px; border:0; background:none; color:var(--muted); font-size:calc(10px + var(--text-bump)); cursor:pointer; }
.payment-stub { min-width:0; padding:18px; overflow:hidden; border:1px solid var(--line); border-radius:16px; background:#fbfdfc; }.demo-badge { display:inline-block; max-width:100%; padding:5px 8px; overflow-wrap:anywhere; border-radius:7px; background:#fff0cc; color:#8a6214; font-size:calc(8px + var(--text-bump)); font-weight:700; }.payment-lines { margin:15px 0; padding:0; list-style:none; }.payment-lines li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:7px 0; border-bottom:1px solid #e8efeb; color:var(--muted); font-size:calc(9px + var(--text-bump)); }.payment-lines li span { min-width:0; overflow-wrap:anywhere; }.payment-lines li strong { white-space:nowrap; }.payment-total,.exam-total { min-width:0; }.payment-total { display:flex; justify-content:space-between; gap:10px; font-size:calc(14px + var(--text-bump)); }.payment-total span,.payment-total strong,.exam-total span,.exam-total strong { min-width:0; overflow-wrap:anywhere; }.success-mark { display:grid; place-items:center; width:64px; height:64px; margin:6px auto 18px; border-radius:22px; background:var(--mint); color:var(--green); font-size:calc(30px + var(--text-bump)); }
@keyframes messageIn { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-6px); } }
@keyframes bounce { 0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)} }
@keyframes pulse { 50% { opacity: .4; transform: scale(.75); } }
@media (max-width: 1040px) { .app-shell { grid-template-columns: 220px minmax(0, 1fr); }.activity-panel { display:none; } }
@media (max-width: 720px) {
  body { background: white; }.app-shell { position:fixed; inset:0 0 auto; width:100%; height:var(--app-height,100dvh); min-height:0; margin:0; grid-template-columns:minmax(0,1fr); border:0; border-radius:0; }
  .sidebar { position:fixed; inset:0 auto 0 0; z-index:6; width:min(300px,84vw); transform:translateX(-105%); transition:.25s ease; box-shadow:var(--shadow); }.show-team .sidebar { transform:translateX(0); }.team-backdrop { position:fixed; inset:0; z-index:5; width:100%; height:100%; padding:0; border:0; background:rgba(20,40,33,.35); opacity:0; pointer-events:none; transition:opacity .2s ease; }.show-team .team-backdrop { display:block; opacity:1; pointer-events:auto; }.sidebar-close { position:absolute; top:max(12px,env(safe-area-inset-top)); right:12px; z-index:2; display:grid; place-items:center; width:34px; height:34px; border:0; border-radius:10px; background:#e8f2ed; color:var(--green); font-size:calc(24px + var(--text-bump)); line-height:1; cursor:pointer; }.sidebar .brand { padding-right:42px; }
  .chat-header { gap:8px; padding:12px; min-height:68px; }.chat-header.has-risk { min-height:98px; padding-bottom:40px; }.active-avatar { width:38px; height:38px; }.chat-title strong { font-size:calc(13px + var(--text-bump)); }.role { max-width:92px; }.header-actions { gap:6px; }.header-action-button { width:38px; height:38px; }.header-risk { left:12px; right:12px; bottom:10px; grid-template-columns:auto minmax(80px,1fr); gap:9px; }.header-risk-topic,.header-risk-questions { display:none; }.function-menu { position:fixed; top:70px; right:10px; width:min(310px,calc(100vw - 20px)); max-height:calc(100dvh - 88px); }.chat-header.has-risk .function-menu { top:100px; max-height:calc(100dvh - 118px); }.insight-dock { grid-template-columns:1fr; margin:8px 14px 0; }.messages { padding:20px 14px; }.suggestions { padding:0 14px 10px; }.composer { margin:0 12px 12px; }.composer-meta span:first-child { display:none; }
  .human-options { grid-template-columns: 1fr; }
  .opinion-grid { grid-template-columns:1fr; }.opinion-grid p { -webkit-line-clamp:3; }
  .memory-form { grid-template-columns:1fr; }.memory-form button { padding:9px; }
  .capability-grid, .profile-grid { grid-template-columns:1fr; }.profile-grid .wide { grid-column:auto; }.profile-footer { align-items:stretch; flex-direction:column; }.profile-footer .primary-button { width:100%; }.capabilities-modal, .profile-modal { padding:24px 18px; }
  #bodyMapModal,#healthHistoryModal { align-items:stretch; padding:0; }.body-map-modal,.health-history-modal { width:100%; height:var(--app-height,100dvh); max-height:var(--app-height,100dvh); padding:22px 16px calc(22px + env(safe-area-inset-bottom)); border-radius:0; }.body-map-layout { grid-template-columns:1fr; gap:14px; }.body-picker { padding:9px; }.body-canvas { min-height:360px; }.body-figure { height:350px; }.symptom-field-grid { grid-template-columns:1fr; gap:0; }.history-heading { display:block; }.history-add-symptom { width:100%; margin:14px 0 0; }.health-history-summary { grid-template-columns:repeat(3,minmax(90px,1fr)); overflow-x:auto; }.health-event-top { display:block; }.health-event-date { display:block; margin-top:5px; }.body-map-legend { font-size:calc(8px + var(--text-bump)); }
  .onboarding { height:var(--app-height,100dvh); min-height:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior-y:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; padding-inline:0; background:white; }.onboarding-brand { flex:0 0 auto; padding:0 16px; margin-bottom:8px; }.onboarding-card { flex:0 0 auto; width:100%; min-height:calc(var(--app-height,100dvh) - 130px); overflow:visible; padding:22px 18px calc(22px + env(safe-area-inset-bottom)); border:0; border-radius:0; box-shadow:none; }.onboarding-safety { flex:0 0 auto; padding:0 16px; }.choice-grid { grid-template-columns:1fr 1fr; }.appearance-options { grid-template-columns:1fr; }.appearance-choice { min-height:76px; flex-direction:row; justify-content:flex-start; text-align:left; }.onboarding-input-area { height:54px; min-height:54px; max-height:70px; resize:none; }.onboarding-card:has(.onboarding-input-area) .onboarding-lead { margin-bottom:14px; }.onboarding-actions { position:sticky; bottom:0; z-index:2; padding-top:10px; padding-bottom:max(4px,env(safe-area-inset-bottom)); background:linear-gradient(transparent,white 18%,white); }.exam-list { max-height:none; overflow:visible; }
}
@media (max-width: 460px), (max-width: 720px) and (max-height: 560px) {
  .chat-header { padding:9px 10px; }
  .active-avatar { width:36px; height:36px; border-radius:11px; }
  .role { display:none; }
  .online { margin-top:2px; }
  .header-action-button { width:36px; height:36px; border-radius:10px; }
  .messages { padding:16px 10px; scrollbar-gutter:auto; }
  .message-row { gap:8px; margin-bottom:18px; }
  .message-row > :not(.message-avatar) { max-width:calc(100% - 39px); }
  .message-row.user > .bubble { max-width:94%; }
  .bubble { padding:11px 12px 7px; }
  .suggestions { flex-wrap:nowrap; padding:0 10px 8px; overflow-x:auto; scrollbar-width:none; }
  .suggestions::-webkit-scrollbar { display:none; }
  .suggestions button { flex:0 0 auto; }
  .composer { margin:0 8px max(8px,env(safe-area-inset-bottom)); padding-inline:46px; }
  .composer-meta { left:46px; right:46px; }
  .modal-backdrop { align-items:start; padding:8px; }
  .modal { max-height:calc(100dvh - 16px); padding:27px 16px 18px; border-radius:16px; }
  .modal-close { top:7px; right:8px; }
  .ticket,.payment-total,.exam-total { align-items:flex-start; flex-direction:column; }
  .human-options,.choice-grid { grid-template-columns:minmax(0,1fr); }
  .capability-card { grid-template-columns:32px minmax(0,1fr); }
  .capability-card b { grid-column:2; width:max-content; max-width:100%; }
  .onboarding-actions { flex-wrap:wrap; }
  .onboarding-actions button { min-width:0; flex:1 1 130px; }
  .exam-card { padding-right:38px; }
  .exam-card strong { padding-right:0; }
  .exam-card b { position:static; display:block; margin-top:5px; }
  .payment-lines li { grid-template-columns:minmax(0,1fr); }
  .payment-lines li strong { white-space:normal; }
  .health-history-summary { grid-template-columns:minmax(0,1fr); overflow:visible; }
  .history-stat span { white-space:normal; }
  .health-event-actions { flex-wrap:wrap; }
}
@media (max-height: 520px) and (max-width: 720px) {
  .chat-header { min-height:58px; }
  .chat-header.has-risk { min-height:84px; padding-bottom:34px; }
  .function-menu { top:58px; max-height:calc(100dvh - 66px); }
  .chat-header.has-risk .function-menu { top:84px; max-height:calc(100dvh - 92px); }
  .insight-dock,.handoff-banner { margin-top:6px; }
  .messages { padding-block:10px; }
  .suggestions { display:none; }
  .composer { margin-bottom:max(5px,env(safe-area-inset-bottom)); }
}