* { box-sizing: border-box; }
[hidden] { display: none !important; }
:root { font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; font-size: 16px; color: #171333; background: #e9eaf1; font-synthesis: none; --purple: #6554ec; --muted: #9699ae; --text-caption: .875rem; --text-secondary: .9375rem; --text-body: 1rem; --text-main: 1.125rem; --text-heading: 1.25rem; --text-title: 1.5rem; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button { border: 0; background: none; padding: 0; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
button, a, input, textarea, select { outline-offset: 4px; }
button:focus-visible, a:focus-visible { outline: 2px solid #6356ef; }
button:disabled { cursor: default; opacity: .5; }
button:active:not(:disabled) { filter: brightness(.97); }
input, textarea, select { color: #211c3d; min-width: 0; }
input::placeholder, textarea::placeholder { color: #afb2c0; }
svg { flex-shrink: 0; }
.icon { width: 1.5rem; height: 1.5rem; vertical-align: middle; }
.phone-shell { width: min(100%, 430px); height: 100dvh; min-height: 35rem; margin: auto; position: relative; overflow: hidden; background: #eae9ff; box-shadow: 0 0 5rem #4c478112; isolation: isolate; }
.phone-shell:has(.archive-screen) { background: #dcddff; }
.screen { position: absolute; inset: 0; padding-top: env(safe-area-inset-top); transition: transform .28s ease; }
.screen-scroll { overflow: auto; height: 100%; scrollbar-width: none; overscroll-behavior: contain; padding-bottom: 6rem; }
.screen-scroll::-webkit-scrollbar, .home-feed::-webkit-scrollbar, .drawer-scroll::-webkit-scrollbar { display: none; }
.topbar { display: flex; align-items: center; height: 3rem; padding: 0 1rem; gap: .65rem; }
.icon-button { width: 2.2rem; height: 2.2rem; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; border-radius: 50%; }
.icon-button .icon { width: 1.6rem; height: 1.6rem; }
.home-topbar { padding: 0 1.5rem 0 .85rem; gap: .6rem; }
.brand { font-size: 1.38rem; font-weight: 900; letter-spacing: -.1rem; transform: skew(-7deg); margin-right: auto; }
.gift-button { color: #7770f6; background: #ffffff45; width: 2.4rem; height: 2.4rem; box-shadow: inset 0 0 .7rem #fff6; }
.gift-button .icon { fill: #8184ff; stroke: #9496ff; width: 1.56rem; height: 1.56rem; filter: drop-shadow(0 .15rem .22rem #938aff); }
.agent-button { background: #ffffffa8; display: flex; align-items: center; gap: .45rem; padding: .5rem .65rem; border-radius: 2rem; font-weight: 700; font-size: 1.08rem; white-space: nowrap; }
.agent-button .icon { width: 1.35rem; height: 1.35rem; }
.more-capsule { display: flex; align-items: center; padding: 0 .24rem; height: 2.3rem; background: #fffffff0; border-radius: 2rem; }
.more-capsule .icon-button { width: 2.2rem; height: 2rem; }
.more-capsule .icon { width: 1.25rem; height: 1.25rem; }
.more-capsule::before { content: ""; order: 1; width: 1px; height: .8rem; background: #f0f0f4; }
.more-capsule button:last-child { order: 2; }
.home-screen { background: radial-gradient(ellipse at 7% 19%, #ffe5ec88, transparent 25%), linear-gradient(130deg, #eeedff, #e9e8ff 42%, #e9e8ff); }
.home-feed { overflow: auto; height: calc(100% - 3rem); padding-bottom: 10rem; scrollbar-width: none; }
.home-hero { height: 7.8rem; position: relative; overflow: hidden; }
.home-hero::after { content: "HEALTH"; color: #ffffff48; font-size: 4.6rem; line-height: 1; font-weight: 800; letter-spacing: .32rem; position: absolute; bottom: -.65rem; left: 7.9rem; z-index: 0; }
.doctor-art { position: absolute; bottom: -.1rem; left: 1.4rem; width: 8.4rem; height: 7.85rem; background: none no-repeat; background-size: 26.875rem 59.0625rem; background-position: -1.4rem -6.1rem; mask-image: linear-gradient(to right, transparent, #000 8%, #000 94%, transparent), linear-gradient(to bottom, transparent, #000 5%, #000 88%, transparent); mask-composite: intersect; z-index: 1; }
.hero-greeting { position: absolute; top: 1.6rem; left: 10.9rem; font-size: 1.34rem; font-weight: 750; line-height: 1.55; letter-spacing: -.03rem; z-index: 2; }
.hero-greeting p { margin: 0 0 .18rem; }
.hero-greeting p:first-child { color: #24206e; }
.hero-greeting .icon { color: #637cf5; width: 1.35rem; height: 1.35rem; margin-left: .35rem; }
.home-health { margin: 0 .875rem; border: 1.5px solid #fff; border-radius: 1.7rem; background: #f4f4ff22; padding: 0 .85rem 1.08rem; box-shadow: 0 .65rem 1.4rem #999bb41d; }
.health-summary { height: 10.9rem; margin: 0 -.85rem; position: relative; background: linear-gradient(145deg, #eef3ffeb, #f0f2ffb8); border-radius: 1.7rem; box-shadow: 0 .5rem .6rem #b4b1d11c; transition: height .2s; overflow: hidden; }
.health-summary.collapsed { height: 3.65rem; }
.health-summary-header { height: 3.45rem; display: flex; align-items: center; justify-content: space-between; padding: 0 1.25rem 0 1.1rem; }
.health-summary-header > button:first-child { display: flex; align-items: center; gap: .58rem; font-size: 1.12rem; font-weight: 600; }
.purple-mark { width: .3rem; height: .85rem; border-radius: .2rem; background: linear-gradient(#9890ff, #8154e7); }
.collapse-button { background: #ffffffeb; width: 2rem; height: 2rem; color: #969bb8; }
.collapse-button .icon { width: 1.1rem; height: 1.1rem; }
.overview-charts { height: 5.4rem; position: relative; display: flex; padding: 0 1.4rem; gap: 1.1rem; }
.overview-charts > div { position: relative; width: 50%; }
.overview-charts > div + div::before { content: ""; position: absolute; left: -.6rem; top: .8rem; height: 4rem; width: 1px; background: #e2e5f2; }
.overview-charts svg { width: 100%; height: 5.2rem; overflow: visible; }
.chart-label { position: absolute; top: -.3rem; right: .4rem; font-size: .88rem; color: #8980d9; background: #ffffff9c; padding: 0 .3rem; border-radius: .2rem; white-space: nowrap; }
.health-caption { position: absolute; top: 7.05rem; left: 50%; transform: translateX(-50%); width: max-content; max-width: 95%; padding: .55rem .85rem; background: #ffffffea; box-shadow: 0 -.7rem 1.5rem #f6f7fff5; border-radius: 2rem; font-size: .94rem; font-weight: 550; display: flex; gap: .3rem; align-items: center; }
.health-caption .icon { color: #5c7af1; width: 1rem; height: 1rem; }
.promotion { display: flex; align-items: center; width: 100%; text-align: left; gap: .65rem; height: 5.25rem; padding: .4rem 1.2rem .4rem .7rem; margin-top: .9rem; background: linear-gradient(#f7edff, white 56%); border: 1px solid white; border-radius: 1.6rem; }
.mini-doctor { width: 2.8rem; height: 3.4rem; flex-shrink: 0; background: none no-repeat; background-size: 26.875rem 59.0625rem; background-position: -2.4rem -26.55rem; mask-image: radial-gradient(ellipse at center, #000 45%, transparent 75%); }
.promotion-copy { flex: 1; font-size: 1rem; white-space: nowrap; }
.promotion-copy small { display: block; color: #969aaf; font-size: .97rem; margin-top: .35rem; }
.promotion-cta { font-size: .86rem; white-space: nowrap; background: #eee9fd; border: 1px solid #e7e0f8; border-radius: 2rem; padding: .62rem 1.1rem; }
.promotion-cta span { font-size: .55rem; }
.topic-card { width: 100%; display: flex; align-items: center; height: 4.1rem; gap: 1.2rem; margin-top: .65rem; padding: 0 1.25rem; background: linear-gradient(#ffffffed, white); border: 1px solid white; border-radius: 1.65rem; text-align: left; font-size: 1rem; }
.topic-hash { width: 1.55rem; height: 1.55rem; display: grid; place-items: center; background: linear-gradient(140deg, #9557fe, #554ee5); border-radius: 50% 50% 35% 45%; color: white; font-size: 1.2rem; font-weight: 700; box-shadow: 0 .2rem .3rem #847af23d; }
.topic-card .icon { margin-left: auto; color: #c6cbd4; width: 1.4rem; }
.composer-dock { position: absolute; left: 0; right: 0; bottom: 0; padding: .75rem .875rem 1.1rem; background: linear-gradient(transparent, #eae9fff5 30%); }
.service-shortcuts { display: flex; gap: .58rem; overflow: auto; scrollbar-width: none; margin: 0 -.875rem .85rem 0; padding-right: 1rem; }
.shortcut { flex-shrink: 0; display: flex; align-items: center; gap: .38rem; padding: .59rem .92rem; background: #ffffffac; border-radius: 2rem; font-size: .97rem; white-space: nowrap; }
.shortcut .icon { width: 1.08rem; height: 1.08rem; }
.composer { display: flex; align-items: center; gap: .5rem; height: 3.65rem; padding: .5rem 1rem; border-radius: 3rem; background: #fff; }
.composer .icon-button { width: 2rem; height: 2rem; }
.composer .icon-button .icon { width: 1.7rem; height: 1.7rem; }
.composer input { border: none; background: transparent; width: 0; flex: 1; outline: none; font-size: 1.12rem; padding: 0; }
.composer .send-button { border-radius: 50%; background: var(--purple); color: white; }
.plus-outline { border: 2px solid; width: 1.7rem !important; height: 1.7rem !important; }
.plus-outline .icon { width: 1.1rem !important; height: 1.1rem !important; }
.archive-screen { background: linear-gradient(#dcddff 0, #dedfff 23%, #f0f4f8 65%); }
.archive-topbar { justify-content: space-between; padding: 0 1.2rem; }
.archive-topbar h1 { font-size: 1.3rem; margin: 0; font-weight: 650; }
.archive-topbar .icon-button:first-child { margin-left: -.4rem; }
.settings-glass { border: 1px solid #ffffff85; box-shadow: inset 0 .13rem .15rem #ffffff91, 0 .1rem .5rem #979adc10; }
.settings-glass .icon { width: 1.2rem; height: 1.2rem; }
.member-selector { min-height: 4.5rem; padding: 1rem 1.15rem 1.3rem; display: flex; align-items: flex-start; gap: .55rem; overflow-x: auto; scrollbar-width: none; }
.member-pill { display: flex; align-items: center; gap: .35rem; background: linear-gradient(110deg, #6051e8, #7360ff); color: white; border-radius: 2rem; font-size: .95rem; padding: .2rem .65rem .2rem .22rem; position: relative; white-space: nowrap; font-weight: 600; }
.member-pill::after { content: ""; position: absolute; width: .75rem; height: .75rem; bottom: -.27rem; left: 48%; background: #6a59f3; transform: rotate(45deg); border-radius: .18rem; }
.member-pill.inactive { background: #ffffff7a; color: #66598f; }.member-pill.inactive::after { display: none; }
.member-pill .icon { width: .8rem; height: .8rem; }
.member-avatar { width: 1.65rem; height: 1.65rem; flex-shrink: 0; border-radius: 50%; display: block; background: #b6dbe6 url('assets/member-avatar.9defa0bd5ad0.webp') center / cover no-repeat; }
.add-member { width: 2.08rem; height: 2.08rem; background: #ffffffeb; }
.binding-card { height: 5rem; margin: 0 .875rem .85rem; padding: .8rem 1.1rem; border: 1.5px solid #ffffffe8; background: #ffffff47; border-radius: 1.5rem; display: flex; align-items: center; justify-content: space-between; }
.binding-card h2 { margin: 0 0 .42rem; font-size: 1.12rem; font-weight: 600; }
.binding-card p { margin: 0; color: #9295aa; font-size: .78rem; }
.binding-card button { background: #fff; color: #5545b2; padding: .65rem 1.15rem; border-radius: 2rem; font-size: .98rem; font-weight: 550; }
.health-board, .record-board { border-top: 1.5px solid #fff; border-radius: 1.8rem 1.8rem 0 0; background: linear-gradient(#f0f7ffeb, #f0f4f8 18rem); min-height: calc(100% - 8rem); padding: 0 .875rem 2rem; }
.board-heading { display: flex; height: 3.55rem; align-items: center; justify-content: space-between; padding: 0 .18rem; }
.board-heading h2 { margin: 0; font-size: 1.24rem; font-weight: 700; }
.board-heading > button { font-size: .94rem; display: flex; align-items: center; color: #49495f; }
.board-heading > button .icon { width: 1.1rem; height: 1.1rem; }
.metric-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem .6rem; }
.metric-card { min-width: 0; position: relative; min-height: 12rem; border-radius: 1.5rem; background: linear-gradient(#eeeaff 0, #fff 40%); border: 1.5px solid #ffffffd9; padding: 1rem 1rem .85rem; box-shadow: 0 .3rem .6rem #afb1bf10, inset 0 .05rem .1rem white; overflow: hidden; }
.metric-card.aqua { background: linear-gradient(#e2f8fd 0, white 39%); }
.metric-card:not(.wide) { height: 12.1rem; min-height: 0; display: flex; flex-direction: column; }
.metric-card:not(.wide) .metric-art { flex: 1; min-height: 0; }
.metric-card .outline-button { margin-top: auto; flex-shrink: 0; }
.metric-card h3 { position: relative; margin: 0 0 .45rem; font-size: 1.08rem; font-weight: 650; }
.metric-card p { margin: 0; color: #969aac; font-size: .82rem; white-space: nowrap; }
.metric-card::before { content: "HEALTHY"; position: absolute; left: .4rem; top: .3rem; color: #fff6; font-size: 2rem; letter-spacing: .1rem; font-weight: 800; }
.metric-art { width: 100%; height: 4.9rem; margin: .15rem 0 .65rem; background-image: radial-gradient(#dcdfea55 .45px, transparent .8px); background-size: 3px 3px; mask-image: radial-gradient(ellipse at center, black 35%, #0004 70%, transparent); }
.sleep-bars { display: flex; align-items: center; justify-content: center; gap: .54rem; padding-top: .9rem; }
.sleep-bars i { width: .34rem; height: calc(var(--bar) * 1.15); background: #c5b9f9; border-radius: .4rem; transform: translateY(calc((var(--i) - 3) * .05rem)); }
.sleep-bars i:nth-child(4) { background: linear-gradient(#8464f4, #b598ea); position: relative; }
.sleep-bars i:nth-child(4)::before { content: ""; width: 2px; height: 3px; background: white; position: absolute; left: 2px; top: 3px; border-radius: 50%; }
.period-dots { display: grid; grid-template-columns: repeat(7, 1fr); align-content: center; justify-content: center; gap: .45rem .15rem; }
.period-dots i { font-style: normal; display: grid; place-items: center; width: 1.28rem; height: 1.28rem; border-radius: 50%; background: linear-gradient(#fdfaff, #ded7f9); color: #b9a7f4; font-size: .9rem; font-weight: bold; }
.outline-button { height: 2.2rem; border-radius: 2rem; border: 1px solid #d7cfee; box-shadow: inset 0 0 1px #d0c7ec; background: #ffffffa3; display: flex; align-items: center; justify-content: center; width: 100%; font-size: 1rem; white-space: nowrap; }
.aqua .outline-button { border-color: #a9d8e7; box-shadow: inset 0 0 1px #a9d8e7; }
.metric-card.wide { grid-column: span 2; min-height: 9rem; height: 9rem; display: flex; flex-direction: column; }
.metric-card.wide p { font-size: .99rem; margin-top: 1rem; margin-bottom: 1rem; position: relative; }
.metric-card.wide h3 { margin-top: .05rem; }
.metric-latest { height: 5.7rem; display: flex; flex-direction: column; justify-content: center; color: #7a68d8; }
.metric-latest strong { font-size: 1.8rem; font-weight: 600; }.metric-latest small { color: var(--muted); font-size: .7rem; margin-top: .2rem; }
.metric-card.wide .metric-latest { height: 4.5rem; }
.archive-bottom { position: absolute; height: 4.85rem; bottom: 0; left: 0; right: 0; background: #fff; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; z-index: 10; padding-bottom: max(.3rem, env(safe-area-inset-bottom)); box-shadow: 0 -.3rem .9rem #d9d9e122; }
.archive-bottom::before { content: ""; width: 5.8rem; height: 3.5rem; border-radius: 50%; background: white; position: absolute; top: -1.15rem; left: calc(50% - 2.9rem); }
.bottom-item { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: .35rem; font-size: .86rem; position: relative; }
.bottom-item .icon { width: 1.65rem; height: 1.65rem; stroke-width: 1.9; }
.bottom-item.active { color: #8970ef; }
.bottom-item.active .icon { fill: #927af0; stroke: #927af0; }
.bottom-item.active .icon path + path { stroke: white; }
.bottom-add { width: 3.55rem; height: 3.55rem; border-radius: 50%; background: linear-gradient(145deg, #62a0ff, #623bff 80%); position: relative; justify-self: center; align-self: start; margin-top: -.85rem; color: white; box-shadow: inset 0 .1rem .15rem #ffffff55; display: grid; place-items: center; }
.bottom-add .icon { width: 2rem; height: 2rem; stroke-width: 2.6; }
.folder-tip { position: absolute; right: .45rem; bottom: 5.8rem; border-radius: 1.3rem; padding: .85rem .75rem .85rem 1rem; background: linear-gradient(110deg, #6650ff, #8b73ff); color: #fff; display: flex; align-items: center; gap: .6rem; z-index: 12; font-size: .92rem; box-shadow: 0 .4rem 1rem #6b55e81a; }
.folder-tip::after { content: ""; position: absolute; bottom: -.35rem; right: 4rem; background: #8169ff; width: .9rem; height: .9rem; transform: rotate(45deg); border-radius: .2rem; }
.folder-tip .icon-button { width: 1.25rem; height: 1.25rem; color: #ffffffc9; }.folder-tip .icon { width: 1.1rem; height: 1.1rem; }
.record-board { min-height: calc(100% - 7.5rem); padding-bottom: 9rem; }
.record-title { display: flex; align-items: center; gap: .45rem; }
.record-title .icon-button { width: 32px; height: 32px; }.record-title .icon { width: 1.15rem; height: 1.15rem; }
.board-heading > .medicine-button { border-radius: 1.5rem; background: #e5e4fa; color: #6e5fc6; padding: .38rem .72rem; gap: .15rem; font-size: .97rem; }
.medicine-button .icon { width: 1.25rem !important; height: 1.25rem !important; }
.upload-card { position: relative; background: #ffffffdf; border-radius: 1.6rem; padding: 3.3rem 1.1rem 1.25rem; }
.report-illustration { height: 12.7rem; background: linear-gradient(130deg, #f4f0ff, #fcfaff 55%, #f3f1ff); border-radius: 1.2rem; position: relative; overflow: hidden; padding-top: 1.5rem; text-align: center; color: #aaaec1; font-size: .98rem; }
.report-illustration::after { content: ""; position: absolute; inset: 65% 0 0; background: linear-gradient(transparent, #f6f3ff); pointer-events: none; }
.report-paper { width: 10.2rem; height: 8.2rem; position: absolute; top: 3.5rem; left: calc(50% - 5.1rem); background: #fff; padding: .65rem .75rem; box-shadow: -.1rem -.1rem .25rem #bbb6cf44, .3rem .3rem 1rem #c9c5dc21; color: #272343; }
.report-paper h3 { font-size: .92rem; margin: 0 0 .45rem; font-weight: 550; }.paper-rule { border-top: 3px double #b9c5c8; margin-bottom: .8rem; }
.paper-row { display: flex; justify-content: space-between; margin: .44rem 0; }.paper-row i { width: 3.4rem; height: .47rem; background: #ededf1; }.paper-row i:last-child { width: 1.15rem; }
.paper-foot { border-top: 1px solid #cdced5; display: flex; justify-content: space-between; padding-top: .3rem; font: .5rem Arial; color: #a4a3b5; }.barcode { width: 1.5rem; height: .6rem; background: repeating-linear-gradient(90deg,#c2c3cc 0px,#c2c3cc 1px,transparent 1px,transparent 2px); }
.scan-beam { position: absolute; top: 5.9rem; left: calc(50% - 6.4rem); width: 12.8rem; height: 1.75rem; background: linear-gradient(transparent,#86eef27d); border-bottom: 2px solid #91edee; box-shadow: 0 .1rem .4rem #b0f2f3; z-index: 2; }
.upload-benefits { display: flex; justify-content: space-between; align-items: center; margin: 1.5rem -.1rem 1.45rem; }
.benefit { text-align: center; font-size: .88rem; font-weight: 550; white-space: nowrap; }.benefit .icon { display: block; margin: 0 auto .6rem; width: 1.5rem; height: 1.5rem; }.benefit-arrow { color: #c4c5d5; width: 1.2rem; align-self: flex-start; margin-top: .25rem; }
.primary-button { width: 100%; border: none; background: #6251e9; color: white; border-radius: 2.5rem; min-height: 3.4rem; font-size: 1.1rem; display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .7rem 1rem; }
.privacy-promise { display: flex; align-items: center; justify-content: center; gap: .25rem; font-size: .83rem; color: #bfc3ce; margin: .8rem 0 0; }.privacy-promise .icon { width: .9rem; height: .9rem; fill: #c3c7d4; stroke: white; }
.privacy-footer { margin: .85rem -.2rem 0; font-size: .76rem; color: #b6bdcb; display: flex; align-items: center; justify-content: center; gap: .28rem; white-space: nowrap; }.privacy-footer .icon { width: .9rem; height: .9rem; }
.privacy-tooltip { position: absolute; z-index: 5; left: 2.8rem; right: 5.4rem; top: 3.58rem; padding: .75rem .8rem; border-radius: 1.2rem; background: linear-gradient(115deg, #6350ff, #8c74ff); color: white; display: flex; align-items: center; gap: .5rem; font-size: .92rem; line-height: 1.5; }
.privacy-tooltip::before { content: ""; position: absolute; top: -.38rem; left: 2.1rem; width: .95rem; height: .95rem; transform: rotate(45deg); border-radius: .22rem; background: #6855ff; }
.privacy-tooltip p { margin: 0; flex: 1; }.privacy-tooltip .icon-button { width: 1.25rem; height: 1.25rem; color: #ffffffbb; }.privacy-tooltip .icon { width: 1.15rem; height: 1.15rem; }
.record-content { position: relative; }.record-content > .privacy-tooltip { top: -.15rem; left: 1.9rem; right: 4.5rem; }
.report-list { display: grid; gap: .7rem; margin: .3rem 0 1rem; }.report-item { display: flex; align-items: center; width: 100%; padding: 1rem; background: white; border-radius: 1.1rem; gap: .7rem; text-align: left; }.report-item > .icon { color: #8270e9; width: 2rem; height: 2rem; }.report-item strong { font-size: .98rem; display: block; word-break: break-all; }.report-item small { display: block; color: var(--muted); font-size: .75rem; margin-top: .35rem; }.report-item > span { flex: 1; }
.drawer-open .home-screen { transform: translateX(90%); }
.drawer-scrim { position: absolute; inset: 0; background: #22212e77; z-index: 39; }
.drawer { position: absolute; left: 0; top: 0; bottom: 0; width: 90%; z-index: 40; background: linear-gradient(125deg, #e8e2ff, #eaeeff 29%, #f4f7ff 35%); display: flex; flex-direction: column; animation: drawer-in .24s ease-out; padding-top: max(1rem, env(safe-area-inset-top)); }
.drawer-scroll { overflow: auto; scrollbar-width: none; flex: 1; }
.drawer-profile { display: flex; gap: .65rem; align-items: center; padding: 1.65rem 1.45rem 1.1rem; }
.profile-round { width: 3.55rem; height: 3.55rem; border-radius: 50%; display: grid; place-items: center; background: #ffffff7a; color: #cbcddc; flex-shrink: 0; }.profile-round .icon { width: 2.25rem; height: 2.25rem; fill: currentColor; stroke: none; }
.profile-text { text-align: left; flex: 1; min-width: 0; }.profile-text strong { font-size: 1.04rem; font-weight: 650; white-space: nowrap; }.profile-text small { color: #989bac; font-size: .82rem; display: block; margin-top: .22rem; }.profile-text .icon { width: .85rem; height: .85rem; }
.profile-action { display: flex; flex-direction: column; align-items: center; gap: .22rem; color: #979caf; font-size: .76rem; white-space: nowrap; }.profile-action .icon { width: 1.7rem; height: 1.7rem; color: #1c1838; }
.profile-actions { display: flex; gap: 1.05rem; margin-left: .45rem; }
.drawer-feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; padding: .1rem 1.45rem 1rem; }
.drawer-feature { display: flex; align-items: center; gap: .6rem; min-height: 5.6rem; padding: 1rem .95rem; border: 1.5px solid #ffffffe0; border-radius: 1.5rem; background: #edf0ff8c; box-shadow: 0 .4rem .6rem #adafc42a; text-align: left; }
.feature-icon { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; flex-shrink: 0; border-radius: 50%; color: white; background: linear-gradient(135deg,#2651ff,#5991ff); }.feature-icon.purple { background: linear-gradient(135deg,#5520cb,#8a56e3); }.feature-icon .icon { width: 1.4rem; height: 1.4rem; fill: #ffffffdd; stroke: #6e75e8; }
.drawer-feature strong { font-size: 1.05rem; white-space: nowrap; display: block; font-weight: 550; }.drawer-feature small { color: #999cac; font-size: .72rem; display: block; white-space: nowrap; margin-top: .3rem; }
.drawer-content { background: #f5f8ffe8; border-radius: 1.8rem 0 0 0; min-height: calc(100% - 13rem); padding: 1.1rem 1.45rem 3rem; }
.drawer-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }.drawer-heading h2, .history h2 { font-size: 1.3rem; margin: 0; }.drawer-heading button { color: #9499af; font-size: .98rem; }.drawer-heading .icon { width: .9rem; }
.agent-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }.agent-tile { display: flex; flex-direction: column; align-items: center; min-width: 0; gap: .55rem; font-size: .96rem; }.agent-tile > span:last-child { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.drawer .agent-grid { margin-right: -.5rem; }
.agent-avatar { display: block; width: 4.1rem; height: 4.1rem; border-radius: 50%; background: none no-repeat; background-size: 26.875rem 59.0625rem; background-position-y: -19.8rem; }.agent-avatar.a0 { background-position-x: -1.65rem; }.agent-avatar.a1 { background-position-x: -7.55rem; }.agent-avatar.a2 { background-position-x: -13.07rem; }.agent-avatar.a3 { background-position-x: -18.6rem; }
.favorites-link { border-top: 1px solid #d7dae4; border-bottom: 1px solid #d7dae4; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 4.1rem; margin-top: 1.4rem; font-size: 1.25rem; font-weight: 700; }.favorites-link .icon { width: 1.1rem; color: #9ca6b8; }
.history { padding-top: 1.15rem; }.history-year { margin: 1.2rem 0 .5rem; font-size: .77rem; color: #9299ae; }.history-row { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: .4rem 0; margin-bottom: 1.65rem; font-size: 1.07rem; text-align: left; gap: .75rem; }.history-row time { color: #b7bccf; font-size: .83rem; white-space: nowrap; }.history-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.group-bar { background: #f5f8ff; border-top: 1px solid #d5d8e4; height: 4.9rem; display: flex; align-items: center; gap: .4rem; padding: 0 1.45rem; flex-shrink: 0; }.group-bar strong { font-size: 1.22rem; white-space: nowrap; }.group-bar span { color: #8e96b4; font-size: .95rem; font-weight: 600; white-space: nowrap; }.group-bar button { background: #6352e8; padding: .6rem 1.2rem; color: white; border-radius: 2rem; margin-left: auto; font-size: 1rem; }
.modal-backdrop { position: absolute; inset: 0; z-index: 60; background: #201b3d55; display: flex; align-items: end; padding-top: 4rem; backdrop-filter: blur(3px); }
.sheet { width: 100%; max-height: 100%; overflow: auto; overscroll-behavior: contain; border-radius: 1.8rem 1.8rem 0 0; background: #f9faff; padding: .7rem 1.3rem max(1.5rem, env(safe-area-inset-bottom)); box-shadow: 0 -.4rem 2rem #26223d15; animation: sheet-in .2s ease; }
.sheet-handle { width: 2rem; height: .25rem; border-radius: 1rem; background: #d8d7e7; margin: 0 auto .7rem; }.sheet-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: .85rem; }.sheet-header h2 { margin: 0; font-size: 1.2rem; }.sheet-header .icon-button { background: #efedf7; width: 1.8rem; height: 1.8rem; color: #807994; }.sheet-header .icon { width: 1.1rem; height: 1.1rem; }
.sheet-description { color: #8c879e; font-size: .85rem; line-height: 1.75; margin: .3rem 0 1.2rem; }.sheet form { display: grid; gap: .95rem; }.field { display: flex; flex-direction: column; gap: .4rem; font-size: .88rem; }.field input, .field select, .field textarea { padding: .8rem .9rem; background: #fff; border: 1px solid #e1deed; border-radius: .8rem; width: 100%; min-height: 2.9rem; }.field textarea { resize: vertical; min-height: 6rem; }.field small { color: #a3a0b2; font-size: .74rem; }.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }.field-check { display: flex; align-items: center; gap: .5rem; font-size: .94rem; padding: .7rem; background: white; border-radius: .7rem; }.field-check input { accent-color: var(--purple); width: 1rem; height: 1rem; }
.sheet .primary-button { margin-top: .4rem; min-height: 2.9rem; font-size: 1rem; }.sheet .agent-grid { margin: 1.4rem 0 1.8rem; }.sheet .agent-avatar { width: 4.1rem; height: 4.1rem; }
.action-list { display: grid; gap: .6rem; }.action-row { display: flex; gap: .8rem; align-items: center; width: 100%; background: #fff; border-radius: .9rem; padding: 1rem; text-align: left; }.action-row > .icon { color: #8570e5; }.action-row > span { flex: 1; }.action-row small { color: #a09aae; display: block; font-size: .75rem; margin-top: .3rem; }.action-row .arrow-icon { color: #b3acc3; width: 1.1rem; }.action-row.danger { color: #c56677; }
.empty-state { text-align: center; padding: 2rem 1rem; color: #a09aae; }.empty-state > .icon { color: #a896ef; width: 3rem; height: 3rem; margin-bottom: .8rem; }.empty-state h3 { margin: 0 0 .5rem; color: #55466f; font-size: 1.05rem; }.empty-state p { font-size: .85rem; line-height: 1.7; margin: 0; }
.upload-zone { display: flex; align-items: center; flex-direction: column; gap: .65rem; border: 1px dashed #ada0e8; border-radius: 1rem; padding: 1.3rem; background: #f1ecff; color: #7e65d9; cursor: pointer; text-align: center; }.upload-zone input { max-width: 100%; font-size: .8rem; }.upload-zone > .icon { width: 2.1rem; height: 2.1rem; }.upload-zone small { color: #a398b9; }
.form-error { margin: 0; font-size: .82rem; color: #bc5468; line-height: 1.6; }.form-error:empty { display: none; }.support-note { color: #a19bad; font-size: .76rem; text-align: center; margin: 1rem 0 0; }
.toast { position: absolute; bottom: 7rem; left: 50%; transform: translateX(-50%); padding: .8rem 1.15rem; background: #29203be8; color: #fff; border-radius: .9rem; font-size: .87rem; line-height: 1.5; width: max-content; max-width: 85%; text-align: center; z-index: 90; box-shadow: 0 .3rem 1rem #29203b20; animation: toast-in .15s ease; pointer-events: none; }
.preview-image { width: 100%; max-height: 65vh; object-fit: contain; background: #eeebf8; border-radius: .7rem; }.preview-pdf { width: 100%; height: 58vh; border: none; background: white; }.preview-download { display: inline-block; color: var(--purple); margin-top: 1rem; font-size: .9rem; }
.chat-messages { max-height: 50vh; min-height: 7rem; overflow: auto; padding: .5rem 0 1rem; }.chat-bubble { border-radius: 1rem 1rem 1rem .25rem; padding: .9rem; background: #eeebf8; font-size: .91rem; line-height: 1.75; margin: .5rem 2rem .5rem 0; white-space: pre-wrap; word-break: break-word; }.chat-bubble.user { margin: .5rem 0 .5rem 2rem; background: #6b57ea; color: white; border-radius: 1rem 1rem .25rem 1rem; }.chat-save { color: #8a78c4; font-size: .77rem; padding: .3rem 0; }.chat-save .icon { width: .85rem; height: .85rem; }.chat-input { display: flex !important; flex-direction: row; gap: .5rem !important; }.chat-input input { flex: 1; border: 1px solid #e3deef; border-radius: 1.5rem; padding: .7rem 1rem; }.chat-input button { width: 2.8rem; height: 2.8rem; background: var(--purple); color: white; border-radius: 50%; flex-shrink: 0; }
.checkin-art { width: 5rem; height: 5rem; display: grid; place-items: center; margin: 1rem auto; color: #8b69e5; background: #eee6ff; border-radius: 1.7rem; }.checkin-art .icon { width: 3rem; height: 3rem; }.checkin-title { text-align: center; margin: .5rem 0; }.sheet-centered { text-align: center; }
@keyframes drawer-in { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@keyframes sheet-in { from { transform: translateY(30%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes toast-in { from { opacity: 0; } to { opacity: 1; } }
@media (min-width: 600px) { body { background: radial-gradient(at 10% 0, #ede9fa, transparent 50%), #e8ebf1; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

/* Live case management interface. */
.brand { font-size:1.18rem; letter-spacing:0; transform:none; white-space:nowrap; }
.home-topbar { gap:.38rem; padding-right:.75rem; height:3.8rem; }
.home-topbar .gift-button { display:none; }
.agent-button { font-size:.88rem; padding:.45rem .6rem; }
.more-capsule .icon-button { width:1.8rem; }
.home-feed { height:calc(100% - 3.8rem); }
.home-hero { height:9rem; }
.doctor-art { width:8.6rem; height:auto; aspect-ratio:1; bottom:0; left:1.3rem; background:url('/chat-assets/avatars/consultant-nurse-v2.webp') center / cover no-repeat; border-radius:50%; mask-image:none; }
.hero-greeting { top:2rem; left:10.5rem; font-size:1.16rem; }
.mini-doctor { height:auto; aspect-ratio:1; align-self:center; background:url('/chat-assets/avatars/consultant-nurse-v2.webp') center / cover no-repeat; border-radius:50%; mask-image:none; }
.overview-live { display:grid; grid-template-columns:1fr 1fr; padding:.35rem 1.4rem 0; gap:1rem; height:5.35rem; }
.overview-live button { text-align:left; }
.overview-live small { display:block; font-size:.8rem; color:#9492ad; margin-bottom:.35rem; }
.overview-live strong { font-size:1.9rem; color:#7060cf; font-weight:600; }
.overview-live em { font-style:normal; font-size:.9rem; font-weight:400; }
.identity-card { display:flex; align-items:center; text-align:left; gap:.8rem; margin:0 .875rem .75rem; padding:1rem; border-radius:1.3rem; background:#ffffffab; width:calc(100% - 1.75rem); }
.identity-card > span:nth-child(2) { flex:1; min-width:0; }
.identity-card strong { display:block; font-size:1.05rem; }
.identity-card small { display:block; font-size:.75rem; color:#8a88a1; margin-top:.3rem; line-height:1.6; }
.identity-icon { width:2.7rem; height:2.7rem; display:grid; place-items:center; color:#7160d9; background:#e9e4ff; border-radius:50%; }
.binding-card p { font-size:.73rem; max-width:17rem; line-height:1.5; }
.binding-card h2 { font-size:1rem; }
.binding-card button { flex-shrink:0; }
.health-board { min-height:0; padding-bottom:1rem; }
.metric-latest strong { font-size:1.4rem; overflow-wrap:anywhere; }
.pressure-art { flex:1; display:grid; place-items:center; color:#b8acf2; }
.pressure-art .icon { width:3.4rem; height:3.4rem; }
.health-timeline { padding:0 .875rem 1.5rem; background:#f0f4f8; }
.timeline-entry { position:relative; padding:1rem 2.5rem 1rem 1rem; background:white; border-radius:1rem; margin-bottom:.6rem; }
.timeline-entry > div { display:flex; gap:.5rem; justify-content:space-between; }
.timeline-entry strong { font-size:.9rem; }
.timeline-entry time,.timeline-entry small { font-size:.7rem; color:#9894a9; }
.timeline-entry p { font-size:.92rem; line-height:1.6; margin:.5rem 0; overflow-wrap:anywhere; }
.timeline-entry small { display:block; line-height:1.6; }
.timeline-entry > button { position:absolute; right:.6rem; top:1rem; color:#a6a0b6; }
.timeline-entry > button .icon { width:1.1rem; height:1.1rem; }
.timeline-empty { padding:.8rem .3rem 1.5rem; color:#9994aa; font-size:.85rem; line-height:1.7; }
.agent-grid { display:block; }
.agent-tile { display:flex; align-items:center; gap:1rem; width:100%; background:#efedff; padding:.7rem; border-radius:1.2rem; }
.agent-avatar.a0 { width:3.6rem; height:3.6rem; background:#fff url('/chat-assets/avatars/consultant-nurse-v2.webp') center / cover no-repeat; }
.drawer-content .agent-tile > span:last-child { font-size:1.05rem; }
.group-bar strong { font-size:1rem; }.group-bar span { font-size:.72rem; white-space:normal; }
.group-bar { padding:0 1rem; }.group-bar button { font-size:.8rem; padding:.55rem .8rem; }
.chat-identity { display:flex; gap:.65rem; align-items:center; padding:.6rem .65rem; border-radius:1rem; background:#f0ecff; }
.chat-identity img { width:2.8rem; height:2.8rem; object-fit:cover; object-position:top; border-radius:50%; background:#e3dcf8; }
.chat-identity > span { flex:1; font-size:.78rem; line-height:1.5; }
.chat-identity small { display:block; color:#a09aaf; font-size:.69rem; }
.chat-identity button { color:#7560d4; font-size:.73rem; }
.chat-bubble.failed { background:#fff1ec; color:#ac685b; }
.profile-saved { display:flex; align-items:center; gap:.2rem; color:#7563c6; font-size:.72rem; margin-top:.7rem; padding-top:.65rem; border-top:1px solid #d9d1f0; text-align:left; }
.profile-saved .icon { width:.9rem; height:.9rem; }
.thinking { color:#9991ab; animation:pulse 1.8s infinite; }
@keyframes pulse { 50% { opacity:.5; } }
.stop-response { color:#a098af; font-size:.76rem; display:block; margin:0 auto .8rem; }
.app-loading { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem; height:100%; color:#8f83b3; padding:2rem; text-align:center; font-size:.9rem; }
.app-loading button { padding:.7rem 1.4rem; background:var(--purple); color:white; border-radius:2rem; }
.chat-input input { min-width:0; }

.health-caption { top:8.5rem; font-size:.8rem; padding:.4rem .65rem; box-shadow:none; }
.overview-live { height:4.7rem; padding-top:0; }

.legacy-notice { display:block; margin:.4rem .875rem; padding:.75rem 1rem; border-radius:1rem; background:#fff7e9; color:#a88046; font-size:.8rem; width:calc(100% - 1.75rem); text-align:left; }

.service-shortcuts { gap:.35rem; }
.shortcut { flex:1; min-width:0; font-size:.76rem; padding:.65rem .45rem; gap:.25rem; justify-content:center; }

/* Flexible page regions keep controls stable when the keyboard opens. */
.phone-shell { height: var(--app-height, 100dvh); min-height: 0; }
button { touch-action: manipulation; line-height: 1.4; }
.icon { display: inline-block; width: 1.5rem; height: 1.5rem; }
.icon-button { flex: 0 0 auto; aspect-ratio: 1; }
.icon-button .icon { display: block; }
.home-screen { display: flex; flex-direction: column; }
.home-topbar { flex: 0 0 auto; height: 4rem; padding: 0 .7rem; gap: .4rem; }
.home-topbar .icon-button { width: 40px; height: 40px; }
.brand { flex: 1; min-width: 0; margin: 0; font-size: 1.15rem; letter-spacing: .01em; }
.new-chat-button { display: inline-flex; align-items: center; justify-content: center; gap: .2rem; min-height: 36px; padding: .4rem .65rem; border-radius: 2rem; background: #ffffffbd; color: #6351b3; white-space: nowrap; font-size: .82rem; flex-shrink: 0; }
.new-chat-button .icon { width: 1.1rem; height: 1.1rem; }
.home-feed { flex: 1; min-height: 0; height: auto; padding-bottom: 1rem; overscroll-behavior: contain; }
.composer-dock { position: relative; flex: 0 0 auto; padding: .65rem .8rem max(.45rem, env(safe-area-inset-bottom)); background: #eae9fff5; }
.service-shortcuts { margin: 0 0 .65rem; padding: 0; overflow: visible; gap: .35rem; }
.shortcut { min-height: 38px; padding: .55rem .3rem; font-size: .74rem; }
.shortcut .icon { width: 1rem; height: 1rem; }
.composer { height: auto; min-height: 4rem; gap: .25rem; padding: .5rem; border-radius: 1.75rem; box-shadow: 0 2px 12px #867ac011; align-items: center; }
.composer:focus-within { box-shadow: 0 0 0 2px #8b78e63d, 0 2px 12px #867ac011; }
.composer .icon-button { width: 40px; height: 40px; flex: 0 0 40px; padding: 0; }
.composer .icon-button .icon { width: 22px; height: 22px; }
.composer textarea { flex: 1; width: 0; min-width: 0; min-height: 40px; max-height: 124px; border: 0; outline: none; resize: none; background: transparent; padding: 6px 2px; margin: 0; font-size: 16px; line-height: 24px; overflow-y: hidden; scrollbar-width: thin; }
.composer .send-button { color: white; background: #6853e9; }
.composer .send-button:disabled { opacity: 1; background: #eae7f6; color: #b5acca; }
.composer .stop-button { background: #6853e9; }
.stop-button span { display: block; width: 12px; height: 12px; border-radius: 3px; background: white; }
.composer-note { margin: .45rem 0 0; color: #9b94ac; font-size: .68rem; line-height: 1.5; text-align: center; }
.conversation-panel { position: relative; flex: 1; display: flex; flex-direction: column; min-height: 0; }
.chat-identity { flex-shrink: 0; margin: .15rem .8rem .5rem; padding: .65rem .7rem; background: #ffffff83; gap: .55rem; }
.chat-identity img { width: 2.6rem; height: 2.6rem; flex-shrink: 0; }
.chat-identity > span { min-width: 0; font-size: .78rem; }
.chat-identity small { overflow-wrap: anywhere; }
.chat-identity > button { display: flex; align-items: center; flex-shrink: 0; min-height: 36px; font-size: .75rem; }
.chat-identity > button .icon { width: .85rem; height: .85rem; }
.chat-messages { min-height: 0; max-height: none; padding: 0 1rem 1.5rem; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; scroll-behavior: auto; overflow-anchor: none; }
.conversation-welcome { text-align: center; padding: 1rem .5rem 1.8rem; }
.conversation-welcome img { display: block; margin: 0 auto .7rem; width: 4.2rem; height: 4.2rem; object-fit: cover; object-position: top; background: #e3def9; border: 3px solid #fff9; border-radius: 50%; }
.conversation-welcome h2 { font-size: 1.06rem; font-weight: 600; margin: 0; color: #4c416c; }
.conversation-welcome p { color: #9690a6; font-size: .82rem; line-height: 1.8; margin: .6rem 0 0; }
.chat-message { margin-bottom: 1.1rem; }
.chat-bubble { width: fit-content; max-width: calc(100% - 1.2rem); margin: 0; padding: .85rem 1rem; background: #ffffffdc; font-size: .95rem; line-height: 1.8; color: #383044; white-space: normal; border-radius: 1.15rem 1.15rem 1.15rem .3rem; }
.chat-bubble.user { margin: 0 0 0 auto; background: #7861e9; color: #fff; border-radius: 1.15rem 1.15rem .3rem 1.15rem; }
.message-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.message-text:empty { display: none; }
.chat-save { display: flex; gap: .25rem; align-items: center; justify-content: flex-end; margin-left: auto; font-size: .7rem; padding: .35rem .2rem; min-height: 30px; }
.thinking { display: block; font-size: .78rem; color: #9b8fad; margin-top: .2rem; }
.reply-error { margin: .6rem 0 0; font-size: .78rem; color: #ad7367; line-height: 1.6; }
.profile-saved { min-height: 34px; line-height: 1.6; flex-wrap: wrap; }
.latest-message { position: absolute; bottom: .7rem; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: .3rem; background: white; box-shadow: 0 2px 14px #74639533; border: 1px solid #eee9f6; padding: .55rem .9rem; border-radius: 2rem; white-space: nowrap; color: #7560a9; font-size: .8rem; }
.latest-message .icon { width: 1rem; height: 1rem; }

/* Prevent flex shrink and fixed-height clipping in the archive and menu. */
.health-summary { height: auto; min-height: 10.9rem; padding-bottom: .7rem; }
.health-summary.collapsed { min-height: 0; height: auto; padding-bottom: 0; }
.health-caption { position: static; transform: none; width: fit-content; margin: .35rem auto 0; min-height: 30px; }
.promotion { height: auto; min-height: 5.25rem; padding: .7rem; gap: .5rem; }
.promotion-copy { min-width: 0; white-space: normal; font-size: .92rem; }
.promotion-copy small { font-size: .76rem; line-height: 1.5; }
.promotion-cta { padding: .55rem .7rem; flex-shrink: 0; font-size: .75rem; }
.hero-greeting { left: 43%; font-size: 1.06rem; }
.member-selector { align-items: center; min-height: 4.3rem; padding: .75rem .9rem 1rem; }
.member-pill { flex: 0 0 auto; min-height: 36px; max-width: 80%; }
.member-pill > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; }
.member-avatar { flex-shrink: 0; }
.add-member { width: 36px; height: 36px; }
.identity-icon { flex-shrink: 0; }
.identity-card strong, .identity-card small { overflow-wrap: anywhere; }
.binding-card { height: auto; min-height: 5rem; gap: .6rem; padding: .8rem; }
.binding-card > div { min-width: 0; }
.binding-card button { padding: .6rem .85rem; font-size: .85rem; min-height: 36px; }
.board-heading { height: auto; min-height: 3.55rem; gap: .6rem; padding: .65rem .18rem; }
.board-heading h2 { font-size: 1.12rem; }
.board-heading > button { font-size: .8rem; flex-shrink: 0; min-height: 34px; }
.metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.metric-card, .metric-card:not(.wide), .metric-card.wide { height: auto; min-height: 12.1rem; padding: .9rem .8rem; display: flex; flex-direction: column; }
.metric-card.wide { min-height: 8.8rem; }
.metric-card p { white-space: normal; font-size: .78rem; line-height: 1.6; }
.metric-card h3 { font-size: 1rem; }
.metric-card .metric-art { min-height: 3.5rem; }
.metric-card .outline-button { position: static; align-self: flex-start; margin-top: auto; min-height: 34px; display: inline-flex; align-items: center; justify-content: center; padding: .4rem .9rem; line-height: 1.4; }
.metric-card.wide .outline-button { align-self: flex-end; }
.metric-latest, .metric-card.wide .metric-latest { height: auto; margin: .7rem 0 1rem; }
.metric-latest strong { display: block; font-size: 1.25rem; line-height: 1.6; }
.metric-latest small { display: block; margin-top: .3rem; }
.archive-bottom { height: calc(4.8rem + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); align-items: center; }
.archive-bottom::before { display: none; }
.bottom-add { position: static; width: 52px; height: 52px; flex: 0 0 52px; aspect-ratio: 1; border-radius: 50%; margin: 0; align-self: center; display: grid; place-items: center; }
.bottom-add .icon { width: 28px; height: 28px; }
.bottom-item { flex: 1; min-width: 0; height: 100%; justify-content: center; }
.folder-tip { bottom: calc(5.1rem + env(safe-area-inset-bottom)); }
.timeline-entry > div { flex-wrap: wrap; }
.timeline-entry > button { width: 28px; height: 28px; display: grid; place-items: center; top: .75rem; right: .4rem; }
.privacy-promise, .privacy-footer { white-space: normal; line-height: 1.6; text-align: center; }
.upload-card { padding-left: .8rem; padding-right: .8rem; }
.benefit { font-size: .73rem; }
.benefit-arrow { width: .8rem; height: .8rem; }
.report-item > span, .action-row > span { min-width: 0; overflow-wrap: anywhere; }
.profile-text strong { display: block; overflow: hidden; text-overflow: ellipsis; }
.drawer-profile { padding: 1rem; gap: .5rem; }
.profile-actions { gap: .65rem; margin-left: 0; }
.profile-action { min-width: 34px; }
.drawer-feature-grid { gap: .6rem; padding: .1rem 1rem 1rem; }
.drawer-feature { min-width: 0; gap: .5rem; padding: .7rem .6rem; }
.feature-icon { width: 2.1rem; height: 2.1rem; }
.drawer-feature strong { font-size: .9rem; }
.drawer-feature small { font-size: .65rem; }
.drawer-content { padding-left: 1rem; padding-right: 1rem; }
.agent-tile { flex-direction: row; text-align: left; }
.agent-avatar { flex-shrink: 0; }
.group-bar { display: grid; grid-template-columns: 1fr auto; gap: .1rem .5rem; height: auto; min-height: 4.9rem; padding: .7rem 1rem max(.7rem, env(safe-area-inset-bottom)); }
.group-bar strong { grid-column: 1; align-self: end; }
.group-bar span { grid-column: 1; grid-row: 2; align-self: start; font-weight: 400; }
.group-bar button { grid-column: 2; grid-row: 1 / 3; min-height: 36px; }
.sheet-header { gap: .6rem; }
.sheet-header h2 { overflow-wrap: anywhere; min-width: 0; }
.sheet-header .icon-button { width: 36px; height: 36px; }
.field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.field input, .field select, .field textarea { font-size: 16px; }
@media (max-width: 360px) {
  .home-topbar { gap: .2rem; padding: 0 .45rem; }
  .home-topbar .icon-button { width: 36px; height: 36px; }
  .brand { font-size: 1.07rem; }
  .new-chat-button { padding: .4rem .5rem; }
  .shortcut { flex-direction: column; gap: .2rem; border-radius: 1rem; }
  .composer textarea { font-size: 16px; }
  .chat-identity > span { font-size: .72rem; }
  .chat-identity img { width: 2.2rem; height: 2.2rem; }
  .profile-round { width: 2.8rem; height: 2.8rem; }
  .profile-text strong { font-size: .86rem; }
  .feature-icon { width: 1.7rem; height: 1.7rem; }
  .drawer-feature { gap: .3rem; }
  .drawer-feature strong { font-size: .82rem; }
  .drawer-feature small { font-size: .6rem; }
  .upload-benefits { gap: .2rem; }
}
@media (max-height: 520px) {
  .home-topbar { height: 3.3rem; }
  .chat-identity { padding: .3rem .6rem; margin-bottom: .3rem; }
  .composer-dock { padding-top: .35rem; }
  .composer-note, .service-shortcuts { display: none; }
  .modal-backdrop { padding-top: 1rem; }
}

.message-text strong { font-weight: 650; }
.message-text code { padding: .08rem .25rem; border-radius: .25rem; background: #eee9f7; font-family: inherit; }

.delivery-status { display: block; margin: .3rem .2rem; text-align: right; color: #9b91ac; font-size: .7rem; }

/* Shared hospital conversation identity and service notices. */
.care-sender{font-size:11px;color:#817794;margin:0 3px 5px}.care-sender.human{color:#2c795d;font-weight:600}.care-sender.human+.chat-bubble{background:#e8f5ef;border:1px solid #c5e3d5}
.care-system-message{margin:7px 0;text-align:center;color:#918b9e;font-size:11px;line-height:1.7;overflow-wrap:anywhere}.care-interrupted{color:#907c59;font-size:11px;line-height:1.6;margin:8px 0 0}.chat-identity .care-current-status{color:#48836b;font-size:10px;margin-top:3px}

/* Keep reading sizes stable on phones; wrap content instead of shrinking text. */
.brand, .archive-topbar h1 { font-size: var(--text-title); }
.hero-greeting { right: .9rem; font-size: var(--text-heading); line-height: 1.6; }
.hero-greeting p:first-child { font-size: var(--text-title); }
.home-hero { height: 9.75rem; }
.doctor-art { left: .75rem; width: 40%; }
.health-summary-header > button:first-child,
.board-heading h2, .drawer-heading h2, .history h2,
.sheet-header h2, .conversation-welcome h2 { font-size: var(--text-heading); }
.promotion-copy, .topic-card, .shortcut, .chat-bubble,
.metric-card h3, .identity-card strong, .binding-card h2,
.profile-text strong, .drawer-feature strong, .history-row,
.drawer-content .agent-tile > span:last-child,
.primary-button, .sheet .primary-button { font-size: var(--text-main); }
.new-chat-button, .promotion-cta, .member-pill,
.board-heading > button, .binding-card button, .outline-button,
.report-item strong, .drawer-heading button, .group-bar button,
.chat-identity > span, .chat-identity > button,
.conversation-welcome p, .latest-message, .field, .field-check,
.timeline-entry strong, .timeline-entry p, .empty-state h3,
.preview-download, .toast { font-size: var(--text-body); }
.promotion-copy small, .health-caption, .overview-live small,
.metric-card p, .metric-card.wide p, .identity-card small,
.binding-card p, .timeline-empty, .sheet-description, .empty-state p,
.form-error, .bottom-item, .report-illustration { font-size: var(--text-secondary); }
.composer-note, .chat-identity small, .chat-identity .care-current-status,
.chat-save, .thinking, .reply-error, .profile-saved, .delivery-status,
.care-sender, .care-system-message, .care-interrupted,
.metric-latest small, .timeline-entry time, .timeline-entry small,
.report-item small, .profile-text small, .profile-action,
.drawer-feature small, .history-year, .history-row time,
.group-bar span, .field small, .action-row small,
.upload-zone input, .support-note, .privacy-promise, .privacy-footer,
.benefit { font-size: var(--text-caption); line-height: 1.6; }
.composer textarea { font-size: var(--text-main); line-height: 28px; }
.field input, .field select, .field textarea { font-size: var(--text-main); }
.metric-latest strong { font-size: var(--text-heading); }
.overview-live strong { font-size: 2rem; }
.overview-live em { font-size: var(--text-body); }
.group-bar strong { font-size: var(--text-main); }
.folder-tip, .privacy-tooltip { font-size: var(--text-body); }

.service-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.shortcut { flex-direction: row; min-height: 48px; gap: .45rem; padding: .65rem .5rem; border-radius: 1rem; }
.shortcut .icon { width: 1.35rem; height: 1.35rem; }
.topic-card { height: auto; min-height: 4.1rem; padding: .85rem 1rem; gap: .75rem; }
.topic-card > span:nth-child(2) { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.topic-hash { flex-shrink: 0; }
.overview-live { height: auto; min-height: 5rem; padding: .2rem 1.1rem .5rem; }
.overview-live button { min-width: 0; }
.health-caption { max-width: calc(100% - 1rem); line-height: 1.6; text-align: left; }
.promotion { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr) auto; gap: .4rem; }
.promotion .mini-doctor { width: 2.5rem; }
.promotion-copy { line-height: 1.5; }
.promotion-copy small { text-wrap: balance; }
.promotion-cta { padding: .55rem .5rem; }
.chat-identity { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: .6rem; row-gap: .3rem; }
.chat-identity > span { grid-column: 2 / -1; line-height: 1.6; }
.chat-identity > .care-current-status { grid-column: 1 / 3; margin: 0; line-height: 1.6; }
.chat-identity > button { grid-column: 3; grid-row: 2; justify-self: end; gap: .15rem; padding: .25rem .5rem; border-radius: .65rem; background: #ffffff9c; white-space: nowrap; }
.metric-card .outline-button { height: auto; min-height: 40px; }
.metric-card:not(.wide) .metric-latest { flex: 1; }
.metric-card.wide p { margin-bottom: 1rem; }
.drawer-profile { flex-wrap: wrap; }
.profile-text { flex-basis: 9rem; }
.profile-text strong, .drawer-feature strong, .drawer-feature small { white-space: normal; overflow-wrap: anywhere; }
.profile-actions { margin-left: auto; }
.drawer-feature { flex-direction: column; align-items: flex-start; padding: .85rem; }
.drawer-feature > span:last-child { min-width: 0; }
.feature-icon { width: 2.1rem; height: 2.1rem; }
.upload-benefits { gap: .3rem; align-items: flex-start; }
.benefit { flex: 1; min-width: 0; white-space: normal; }
.privacy-footer { align-items: flex-start; }
.privacy-footer .icon { margin-top: .3rem; }
.privacy-tooltip { left: 1rem; right: 1rem; }
.record-content > .privacy-tooltip { left: .5rem; right: .5rem; }
.folder-tip { left: .75rem; right: .75rem; width: fit-content; max-width: calc(100% - 1.5rem); margin-left: auto; }
.folder-tip > button:first-child { min-width: 0; }
.field { line-height: 1.5; }
.field-check input { flex-shrink: 0; }

@media (max-width: 360px) {
  .brand { font-size: var(--text-heading); }
  .hero-greeting { left: 42%; right: .65rem; }
  .chat-identity { column-gap: .5rem; }
  .composer { gap: .125rem; padding: .375rem; }
  .composer .icon-button { width: 36px; height: 36px; flex-basis: 36px; }
  .promotion { grid-template-columns: 2.5rem minmax(0, 1fr); }
  .promotion .mini-doctor { grid-row: 1 / 3; }
  .promotion-cta { grid-column: 2; justify-self: end; }
  .field-row { grid-template-columns: 1fr; }
}
@media (max-height: 520px) {
  .service-shortcuts { display: none; }
  .composer textarea { max-height: 96px; }
}

/* Hospital follow-up cards are ordinary chat content, with explicit submissions. */
.care-task-card{display:grid;gap:10px;padding:16px;background:#fff;border:1px solid #ddd9ed;border-radius:6px;font-size:16px;max-width:100%}
.care-task-card small,.care-task-card>span{color:#78718b;font-size:13px}.care-task-card strong{font-size:18px}.care-task-card button{border:0;background:#eeeaf8;color:#5c4c87;padding:10px;border-radius:4px;text-align:center;font:inherit}
.care-task-home{display:flex;justify-content:space-between;gap:12px;text-align:left;width:100%;padding:14px;background:#fff;border:1px solid #ddd9ed;border-radius:6px;color:#51456f;font-size:15px;margin:8px 0}.care-task-home span{flex-shrink:0}
.care-question{border:0;border-bottom:1px solid #e9e6f0;margin:0 0 18px;padding:0 0 16px}.care-question legend{font-size:17px;margin-bottom:10px}.care-question label{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:16px}.care-question input{width:18px;height:18px;flex:0 0 18px;accent-color:#8069a5}.care-education{white-space:pre-wrap;line-height:1.8;margin-bottom:16px}