:root {
  --ink: #21364d;
  --muted: #678096;
  --faint: #91a9bc;
  --line: #dcecf8;
  --panel: #f5faff;
  --green: #65aae1;
  --green-2: #83bfe9;
  --mint: #e8f5ff;
  --cream: #f7fbff;
  --blue-deep: #397fb9;
  --blue-soft: #eaf6ff;
  --blue-pale: #f4faff;
  --blue-shadow: rgba(75, 142, 194, .16);
}

body {
  color: var(--ink);
  background: #f7fbff;
}

button, input, select, textarea {
  font-family: inherit;
}

button, a, input, select, textarea {
  transition: border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(83,164,221,.22);
  outline-offset: 2px;
}

.brand-ip-badge {
  display: grid;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(62, 129, 180, .18);
}

.brand-ip-badge img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.auth-screen {
  background: #f7fbff;
}

.auth-visual {
  color: #294965;
  background:
    radial-gradient(circle at 10% 4%, rgba(255,255,255,.96), transparent 30%),
    radial-gradient(circle at 86% 78%, rgba(143,205,246,.34), transparent 34%),
    linear-gradient(145deg, #dff2ff 0%, #eef8ff 48%, #d7efff 100%);
}

.auth-visual::before {
  width: 520px;
  height: 520px;
  right: -230px;
  top: -260px;
  border-color: rgba(255,255,255,.42);
}

.auth-visual::after {
  width: 330px;
  height: 330px;
  left: -160px;
  bottom: -190px;
  border-color: rgba(96,168,222,.08);
}

.auth-brand strong { color: #28445d; }
.auth-brand small { color: #6d8da6; }

.auth-story {
  width: min(560px, 100%);
  display: block;
  padding: 28px 0;
}

.auth-story-copy { max-width: 520px; }

.auth-story-copy > span {
  display: inline-flex;
  padding: 7px 11px;
  border: 1px solid rgba(81,151,205,.16);
  border-radius: 999px;
  color: #5c93bb;
  background: rgba(255,255,255,.56);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .15em;
}

.auth-story h1 {
  margin-top: 18px;
  color: #243d55;
  font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: clamp(38px, 3.4vw, 55px);
  font-weight: 760;
  line-height: 1.16;
  letter-spacing: -.045em;
}

.auth-story h1 b {
  color: #5a9fd5;
  font-weight: inherit;
}

.auth-story-copy > p {
  margin: 19px 0 0;
  color: #67859d;
  font-size: 14px;
  line-height: 1.85;
}

.auth-trust { color: #7391a8; }
.auth-trust i { background: #93c9ed; }

.auth-panel {
  background:
    radial-gradient(circle at 78% 16%, rgba(178,221,251,.32), transparent 32%),
    #f9fcff;
}

.auth-footer { color: #7891a4; }
.auth-footer a:hover { color: #4389bb; }

.auth-card {
  padding: 30px;
  border: 1px solid #e1eff9;
  border-radius: 28px;
  background: rgba(255,255,255,.84);
  box-shadow: 0 28px 75px rgba(80,137,177,.1);
}

.auth-heading p { color: #63a7d9; }
.auth-heading h2 { color: #223a50; font-family: Inter, "PingFang SC", sans-serif; font-weight: 760; }
.auth-tabs { background: #edf7fe; }
.auth-tabs button.is-active { color: #3979a9; box-shadow: 0 7px 18px rgba(71,135,182,.1); }
.auth-form input, .auth-form select { border-color: #dcecf7; background: #fbfdff; }
.auth-form input:focus, .auth-form select:focus { border-color: #86bde3; box-shadow: 0 0 0 4px rgba(105,174,224,.11); }
.auth-submit { background: linear-gradient(135deg, #69afe2, #4f96cf); box-shadow: 0 13px 28px rgba(75,151,208,.25); }
.auth-submit:hover { background: linear-gradient(135deg, #5ba4da, #438ac3); }

.workspace {
  background:
    radial-gradient(circle at 76% 4%, rgba(171,219,250,.24), transparent 28%),
    radial-gradient(circle at 10% 82%, rgba(207,236,255,.35), transparent 25%),
    #f7fbff;
}

.workspace::before {
  width: 580px;
  height: 580px;
  right: -280px;
  bottom: -320px;
  border: 82px solid rgba(111,185,235,.055);
}

.app-shell { grid-template-columns: 308px minmax(0, 1fr); }

.sidebar {
  padding: 25px 18px 18px;
  border-right: 1px solid rgba(202,226,243,.9);
  background: linear-gradient(180deg, rgba(247,252,255,.98), rgba(239,248,255,.96));
  box-shadow: 12px 0 42px rgba(68,127,171,.055);
}

.brand-row { padding-bottom: 23px; }
.brand-row strong { color: #27425a; }
.brand-row small { color: #7390a6; }
.collapse-button { border-color: #d8e9f5; color: #6e96b4; background: rgba(255,255,255,.72); }
.collapse-button:hover { color: #3e84ba; background: #fff; }

.primary-nav { gap: 8px; }
.nav-button { border: 1px solid transparent; color: #537087; }
.nav-button:hover { border-color: #dcecf7; background: rgba(255,255,255,.7); transform: translateX(2px); }
.nav-button.is-active {
  border-color: rgba(255,255,255,.7);
  color: #fff;
  background: linear-gradient(135deg, #74b8e7, #559dd4);
  box-shadow: 0 12px 26px rgba(76,151,207,.22);
}
.nav-icon { color: currentColor; }

.history { border-top-color: #dcebf6; }
.history-item { color: #425e74; }
.history-item:hover, .history-item.is-current { color: #3977a5; background: rgba(219,240,253,.68); }
.history-item small, .section-label { color: #8aa5b9; }
.history-delete { color: #ac5f5b; }
.history-delete:hover, .history-delete:focus-visible { color: #a53834; background: #fff0ef; }
.sidebar-footer { border-top-color: #dcebf6; }
.admin-entry { color: #527087; }
.admin-entry:hover { color: #397eb1; background: #e8f5fd; }
.admin-entry em { color: #3e8bc1; background: #dff2ff; }

.profile-button {
  border-color: #d8e9f5;
  border-radius: 17px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 9px 25px rgba(75,131,171,.07);
}
.profile-button:hover { border-color: #bcdcf1; transform: translateY(-1px); }
.avatar { background: linear-gradient(145deg, #85c5ee, #579fd5); box-shadow: 0 7px 16px rgba(66,144,201,.18); }
.profile-menu { border-color: #d9eaf6; border-radius: 17px; box-shadow: 0 22px 54px rgba(53,106,146,.18); }
.profile-menu div, .profile-menu button { border-color: #e3eff7; }
.profile-menu button:hover { background: #f2f9fe; }

.topbar {
  min-height: 82px;
  padding-inline: 36px;
  border-bottom: 1px solid rgba(220,237,248,.58);
  background: linear-gradient(180deg, rgba(249,253,255,.97), rgba(249,253,255,.78));
  backdrop-filter: blur(18px);
}
.status-pill { color: #67859b; }
.status-pill i { background: #72bce9; box-shadow: 0 0 0 5px #e4f4fd; }
.status-pill b { border-color: #dceaf4; color: #91a8ba; }
.account-button { border-color: #d8e9f4; background: rgba(255,255,255,.9); box-shadow: 0 7px 22px rgba(69,126,169,.08); }

.welcome {
  width: min(900px, calc(100% - 64px));
  margin-top: clamp(24px, 4.5vh, 62px);
}

@media (min-width: 721px) {
  body:not(.mobile-agent-mode) .welcome {
    margin-top: calc(clamp(24px, 4.5vh, 62px) + 30px);
  }
}

.welcome-ip-stage {
  position: relative;
  width: 160px;
  height: 160px;
  margin: 0 auto 18px;
}

.welcome-ip-glow {
  position: absolute;
  inset: 15px;
  border-radius: 50%;
  background: #dff2ff;
  box-shadow: 0 0 0 18px rgba(229,245,255,.62), 0 20px 48px rgba(84,151,201,.16);
}

.welcome-ip-stage img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  border: 5px solid rgba(255,255,255,.9);
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 18px 42px rgba(68,131,179,.14);
}

.welcome-ip-status {
  position: absolute;
  z-index: 2;
  right: -24px;
  bottom: 6px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid #e3eff7;
  border-radius: 999px;
  color: #618099;
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 24px rgba(76,133,175,.12);
  font-size: 9px;
  white-space: nowrap;
}

.welcome-ip-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #69b8e9;
  box-shadow: 0 0 0 4px #e8f6ff;
}

.welcome h1 {
  color: #233c53;
  font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 760;
}

.welcome h1 span { color: #61a6d9; }
.welcome-copy { color: #6e879b; }

.composer {
  border-color: #d6e9f6;
  border-radius: 28px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 24px 62px rgba(69,132,179,.12), 0 2px 8px rgba(69,132,179,.05);
}
.composer:focus-within { border-color: #91c5e8; box-shadow: 0 26px 64px rgba(69,132,179,.15), 0 0 0 4px rgba(100,176,228,.1); }
.composer textarea { color: #294259; }
.composer textarea::placeholder { color: #9db2c2; }
.composer-toolbar { border-top: 1px solid rgba(225,239,248,.72); }
.composer label.attachment-button,
.composer-tools > .attachment-button { color: #4387b9; border-color: #c6e2f4; background: #f1f9fe; }
.composer-tools > .attachment-button:hover { color: #fff; border-color: #62a9db; background: #62a9db; }
.mode-pill { color: #4786b5; background: #e8f5fd; }
.mode-pill i { background: #66afe0; }
.knowledge-mode-select { border-color: #d5e8f5; color: #456c89; background: #f5faff; }
.knowledge-mode-select:focus { border-color: #84bde4; box-shadow: 0 0 0 4px rgba(91,166,218,.1); }
.send-button { background: linear-gradient(145deg, #72bcea, #4b96cf); box-shadow: 0 10px 23px rgba(68,146,204,.26), inset 0 1px 0 rgba(255,255,255,.34); }
.send-button:hover { background: linear-gradient(145deg, #62afe0, #4389c1); transform: translateY(-2px); box-shadow: 0 12px 26px rgba(68,146,204,.3), inset 0 1px 0 rgba(255,255,255,.38); }
.send-button.is-generating { background: linear-gradient(145deg, #657784, #4e616f); box-shadow: 0 9px 20px rgba(55,73,86,.24); }
.send-button.is-generating:hover { background: linear-gradient(145deg, #5c6e7b, #465966); transform: none; }
body.mobile-agent-mode .send-button:hover { transform: translateY(-4px); }
body.mobile-agent-mode .send-button:active { transform: translateY(-2px) scale(.97); }
body.mobile-agent-mode .send-button.is-generating:hover { transform: translateY(-3px); }
.trust-row { color: #89a1b4; }
.trust-row span { padding: 6px 10px; border-radius: 999px; background: rgba(236,247,254,.72); }
.trust-row i { color: #58a8dd; }
.legal-note { color: #9bb0bf; }

.attachment-chip { border-color: #d9eaf6; background: #f7fbfe; }
.attachment-chip.uploading { border-color: #add7f0; background: #edf8fe; }
.attachment-visual { color: #3f8dc3; background: #e3f3fd; }
.attachment-chip b { color: #36536a; }
.attachment-chip small { color: #7892a5; }
.attachment-chip.uploading small { color: #458ec1; }

.chat-scroll { scrollbar-color: #c5dfef transparent; }
.message-avatar {
  overflow: hidden;
  border: 2px solid #fff;
  color: #fff;
  background: linear-gradient(145deg, #80c1ea, #539bd2);
  box-shadow: 0 8px 20px rgba(65,136,190,.16);
}
.message-avatar.is-ip-avatar { width: 44px; height: 44px; flex-basis: 44px; overflow: hidden; border: 2px solid #fff; border-radius: 15px; background: #fff; box-shadow: 0 6px 16px rgba(43, 114, 158, .12); }
.message-avatar.is-ip-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.18); transform-origin: center; }
.message-avatar.is-ip-avatar[data-assistant-persona="nutrition"] { border-color: #d8f2e8; background: #f2fbf7; }
.message-avatar.is-ip-avatar[data-assistant-persona="nutrition"] img { transform: scale(1.3); }
.message-avatar.is-ip-avatar[data-assistant-persona="exercise"] { border-color: #d7ebfb; background: #edf7ff; }
.message-avatar.is-ip-avatar[data-assistant-persona="compliance"] { border-color: #dce6f5; background: #eef4fb; }
.message-avatar.is-ip-avatar[data-assistant-persona="general"] { border-color: #e4f0f8; background: #f5faff; }
.message.user .message-avatar { background: linear-gradient(145deg, #8abfdf, #608fb2); }
.message-label { color: #839caf; }
.message-content { border-color: #dcecf7; color: #354f64; background: rgba(255,255,255,.94); box-shadow: 0 10px 28px rgba(64,119,160,.055); }
.message.user .message-content { background: linear-gradient(135deg, #73b7e5, #579ed4); box-shadow: 0 12px 27px rgba(68,142,198,.17); }
.thinking-dots i { background: #79b9e2; }
.chat-composer { bottom: 30px; }

.library-pane, .admin-pane { background: linear-gradient(180deg, rgba(248,252,255,.62), rgba(244,250,255,.88)); }
.page-heading p, .modal-heading p { color: #5da4d6; }
.page-heading h2, .modal-heading h2, .document-drawer h2 { color: #263f55; font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif; font-weight: 760; }
.page-heading > div > span { color: #6f899e; }
.primary-action { background: linear-gradient(135deg, #6fb4e4, #4e96ce); box-shadow: 0 9px 20px rgba(74,150,206,.2); }
.primary-action:hover { transform: translateY(-1px); box-shadow: 0 12px 25px rgba(74,150,206,.25); }
.secondary-action { border-color: #d4e7f4; color: #557891; background: rgba(255,255,255,.9); }
.secondary-action:hover { border-color: #afd5ed; color: #3f83b4; background: #fff; }
.membership-action { background: linear-gradient(135deg, #8ebfdf, #658eac); box-shadow: 0 9px 20px rgba(74,126,164,.18); }

.case-privacy-note { border-color: #cce5f5; color: #355a76; background: #edf8fe; }
.case-privacy-note > span { background: linear-gradient(145deg, #73b8e7, #5098d0); }
.case-card {
  position: relative;
  overflow: hidden;
  border-color: #d8e9f5;
  border-radius: 21px;
  background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(244,250,255,.94));
  box-shadow: 0 10px 30px rgba(66,123,165,.055);
}
.case-card::after { display: none; }
.case-card:hover { border-color: #acd5ee; box-shadow: 0 18px 38px rgba(67,129,174,.1); }
.case-card-heading span { color: #3f88bb; background: #e3f3fd; }
.case-card-footer { border-color: #e5f0f7; }
.case-card-footer span, .case-card-footer strong { color: #4d89b3; }
.case-card-profile span { color: #557a94; background: #eaf5fc; }
.case-card-progress { background: #e2f0f9; }
.case-card-progress i { background: linear-gradient(90deg, #75b9e7, #4d98d0); }
.case-chat-context { border-color: #cde5f4; color: #3c617d; background: #edf8fe; }
.case-chat-context > span { background: #5da7d9; }
.case-chat-context button { border-color: #c4dfef; color: #4389b9; }
.case-detail-hero { border-color: #d4e8f5; background: linear-gradient(145deg, #fff, #eef8fe); box-shadow: 0 14px 38px rgba(66,123,165,.08); }
.case-detail-hero > div:first-child > span, .case-section-heading em { color: #3f88bb; background: #e3f3fd; }
.case-detail-hero h1 { color: #24465e; }
.case-completeness strong, .case-section-heading span { color: #4d98ce; }
.case-completeness > i, .case-card-progress { background: #e0eff8; }
.case-completeness > i > b { background: linear-gradient(90deg, #73b8e7, #4f98cf); }
.case-detail-card, .case-conversation-card, .case-archive-record { border-color: #d9eaf5; background: rgba(255,255,255,.94); }
.case-profile-card dl > div, .case-follow-up-form { border-color: #e4f0f7; }
.case-missing-fields { color: #476d87; background: #eef7fc; }
.case-profile-form input:focus, .case-profile-form select:focus, .case-profile-form textarea:focus, .case-follow-up-form textarea:focus { border-color: #7db9df; box-shadow: 0 0 0 3px rgba(84,161,211,.1); }
.case-timeline-message { border-color: #d8e9f4; background: #f3f9fd; }
.case-timeline-message.user { background: linear-gradient(135deg, #68afe0, #4c95cb); }
.case-timeline-empty { border-color: #c8dfed; }
.case-intake-dialog { background: linear-gradient(155deg, #fff, #f6fbff); }
.case-intake-notice { border-color: #cce5f5; background: #edf8fe; }
.case-intake-notice > span { background: linear-gradient(145deg, #73b8e7, #5098d0); }
.case-intake-grid label > span i { color: #4f99ca; }
.case-intake-grid input:focus, .case-intake-grid select:focus, .case-intake-grid textarea:focus { border-color: #7db9df; box-shadow: 0 0 0 3px rgba(84,161,211,.1); }

.ip-empty-state img {
  width: 112px;
  height: 112px;
  border: 5px solid #fff;
  border-radius: 34px;
  object-fit: cover;
  box-shadow: 0 16px 35px rgba(69,132,179,.13);
}
.ip-empty-state h3 { color: #31516a; }

.metric-grid article {
  position: relative;
  overflow: hidden;
  border-color: #d9eaf5;
  border-radius: 19px;
  background: linear-gradient(145deg, #fff, #f4faff);
  box-shadow: 0 10px 28px rgba(66,120,161,.055);
}
.admin-tabs { border-color: #d9eaf5; background: rgba(255,255,255,.9); box-shadow: 0 10px 28px rgba(64,119,160,.055); }
.admin-tabs button:hover { color: #315877; background: #f1f8fd; }
.admin-tabs button.is-active { color: #fff; background: linear-gradient(135deg, #70b4e2, #4e95cd); box-shadow: 0 10px 24px rgba(70,145,197,.22); }
.admin-tabs button span { color: #4388b9; background: #e8f5fd; }
.admin-tabs button.is-active span { color: #4388b9; background: #fff; }
.admin-module-heading { border-color: #d9eaf5; background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(244,250,255,.96)); box-shadow: 0 10px 28px rgba(64,119,160,.045); }
.admin-module-heading > div > span { color: #4d9bcf; }
.admin-module-heading h3 { color: #31516a; }
.admin-module-heading p { color: #7892a5; }
.metric-grid article::after { content: ""; position: absolute; width: 74px; height: 74px; right: -27px; top: -27px; border: 16px solid rgba(105,181,231,.08); border-radius: 50%; }
.metric-grid b { color: #315877; font-family: Inter, sans-serif; font-weight: 720; }
.metric-grid span, .metric-grid small { color: #7994a8; }
.admin-card { border-color: #d9eaf5; border-radius: 21px; background: rgba(255,255,255,.94); box-shadow: 0 10px 32px rgba(64,119,160,.055); }
.card-heading { border-color: #e3eff7; background: linear-gradient(180deg, #fbfdff, #f7fbfe); }
.card-heading h3 { color: #31516a; }
.card-heading > button { color: #4a91c3; }
.ai-persona-field textarea, .modal-field input,
.access-code-generator input, .access-purchase-settings input, .access-purchase-settings textarea,
.upload-fields input, .upload-fields select, .upload-fields textarea {
  border-color: #d9eaf5;
  background: #fbfdff;
}
.ai-persona-field textarea:focus, .modal-field input:focus,
.access-code-generator input:focus, .access-purchase-settings input:focus, .access-purchase-settings textarea:focus {
  border-color: #84bde3;
  box-shadow: 0 0 0 4px rgba(89,164,216,.1);
}
.priority-options label { border-color: #dcebf5; background: #fbfdff; }
.priority-options label:has(input:checked) { border-color: #8dc3e6; background: #edf8fe; box-shadow: inset 4px 0 0 #62a9da; }
.admin-row { border-color: #e5eff6; }
.admin-row:hover { background: #f7fbfe; }
.row-actions button, .row-actions select { border-color: #d7e8f4; color: #57758c; background: #fff; }
.row-actions button:hover, .row-actions select:hover { border-color: #afd4eb; }
.row-actions button.membership-grant { border-color: #c9e5f5; color: #347fac; background: #edf8fe; }
.user-self-badge, .readonly-badge { color: #3e86b8; background: #e6f4fd; }
.locked-control { border-color: #dce9f2; color: #5a7386; background: #f6faff; }
.admin-filter-bar { border-color: #e3eff7; background: #f7fbfe; }
.admin-filter-bar input, .admin-filter-bar select { border-color: #d9eaf5; background: #fff; }
.admin-filter-bar input:focus, .admin-filter-bar select:focus { border-color: #84bde3; box-shadow: 0 0 0 4px rgba(89,164,216,.1); }
.admin-payment-plan, .admin-payment-provider { border-color: #dceaf5; background: #f8fcff; }
.admin-payment-plan strong { color: #315877; }
.provider-status.ready, .payment-status.paid { color: #347fac; background: #e6f4fd; }
.provider-status.pending, .payment-status.pending { color: #9b7428; background: #fff5dc; }
.access-code-generator, .access-purchase-settings { border-color: #dceaf5; border-radius: 17px; background: #f8fcff; }
.qr-upload-button, #resetPurchaseQrButton { border-color: #c9e2f2; color: #4388b9; background: #edf8fe; }
.generated-code-panel { border-color: #bddff2; background: #edf8fe; }
.generated-code-panel textarea { border-color: #cce3f1; color: #315872; }
.access-code-summary span { color: #638095; background: #edf6fc; }
.code-status.unused { color: #3c88bb; background: #e4f4fd; }

.drawer-backdrop, .modal-backdrop { background: rgba(37,64,84,.38); backdrop-filter: blur(7px); }
.document-drawer { border-color: #d8e9f4; background: #f9fcff; box-shadow: -28px 0 70px rgba(40,85,118,.18); }
.drawer-close, .modal-heading > button { border-color: #d8e9f4; color: #68869c; }
.drawer-summary, .password-target { color: #48687f; background: #edf7fd; }
.sample-block { border-color: #dceaf4; }
.drawer-actions a { background: linear-gradient(135deg, #70b4e2, #4e95cd); }

.upload-dialog, .password-dialog, .purchase-code-dialog, .membership-dialog, .usage-notice-dialog {
  border: 1px solid rgba(218,235,247,.95);
  border-radius: 25px;
  background: linear-gradient(145deg, #fff, #f7fbfe);
  box-shadow: 0 34px 90px rgba(38,79,109,.24);
}
.usage-notice-intro { border-color: #c9e3f3; color: #365f79; background: #edf8fe; }
.usage-notice-points article { border-color: #d8e9f4; background: #f9fcff; }
.usage-notice-points article > b { background: linear-gradient(145deg, #73b8e6, #5198cf); }
.usage-notice-points article > p { color: #466477; }
.drop-zone { border-color: #a9d3ec; border-radius: 19px; background: #f0f9fe; }
.drop-zone:hover, .drop-zone.is-dragging { border-color: #63aadc; background: #e5f4fd; }
.drop-zone > span { background: linear-gradient(145deg, #73b8e6, #5198cf); }
.trial-access-option { border-color: #c9e3f3; background: #edf8fe; }
.trial-access-option b { color: #365b75; }
.trial-access-option button { border-color: #add4eb; color: #4187b9; }
.purchase-code-content img { border-color: #d8e9f4; box-shadow: 0 14px 36px rgba(57,111,150,.09); }
.membership-plan { border-color: #d8e9f4; color: #3c5c73; border-radius: 17px; background: #fbfdff; }
.membership-plan:hover { border-color: #99c9e8; }
.membership-plan.is-selected { border-color: #69addc; background: #edf8fe; box-shadow: inset 0 0 0 1px rgba(75,157,213,.13); }
.membership-provider { border-color: #d8e9f4; color: #456278; background: #fbfdff; }
.membership-provider.is-selected { border-color: #74b4de; background: #eef8fe; }
.membership-qr-stage { border-color: #c9e3f3; background: #f0f9fe; }
.membership-qr-stage strong { color: #315873; }
.toast { border-color: #d7e8f3; color: #416077; border-radius: 14px; box-shadow: 0 17px 40px rgba(44,91,124,.17); }

.mobile-agent-avatar { border-color: #fff; background: #fff; box-shadow: 0 8px 22px rgba(61,133,184,.2); }
.mobile-agent-avatar::before, .mobile-agent-avatar::after { display: none; }
.mobile-agent-avatar img { width: 100%; height: 100%; object-fit: cover; }
.mobile-agent-avatar i { background: #67b6e6; }
.mobile-agent-title small { color: #6f899c; }
.mobile-agent-title small i { background: #69b7e7; box-shadow: 0 0 0 3px #e4f4fd; }
.mobile-agent-orb { overflow: hidden; border-color: rgba(255,255,255,.8); background: #fff; box-shadow: 0 12px 28px rgba(59,122,168,.18); }
.mobile-agent-orb::before, .mobile-agent-orb::after { display: none; }
.mobile-agent-orb img { width: 100%; height: 100%; object-fit: cover; }

body.mobile-agent-mode { background: #f2f9fe; }
body.mobile-agent-mode .workspace { background: linear-gradient(180deg, #eaf7ff 0, #f7fbff 38%, #f7fbff 100%); }
body.mobile-agent-mode .mobile-agent-header { border-color: rgba(210,231,245,.9); background: rgba(249,253,255,.92); box-shadow: 0 6px 26px rgba(54,113,156,.07); }
body.mobile-agent-mode .mobile-agent-intro {
  color: #31526c;
  border-color: rgba(255,255,255,.9);
  background: radial-gradient(circle at 94% 6%, rgba(255,255,255,.72), transparent 31%), linear-gradient(145deg, #cfeaff, #e8f6ff 56%, #d7eeff);
  box-shadow: 0 18px 38px rgba(66,137,188,.16);
}
.mobile-agent-profile > div > span { color: #6790ae; }
.mobile-agent-profile p { color: #68879e; }
.mobile-agent-capabilities { border-color: rgba(99,167,215,.16); }
.mobile-agent-capabilities span { border-color: rgba(92,157,204,.15); color: #527c9a; background: rgba(255,255,255,.55); }
body.mobile-agent-mode .welcome > .welcome-ip-stage { display: none; }
body.mobile-agent-mode .welcome .composer { box-shadow: 0 15px 40px rgba(59,121,164,.1); }
body.mobile-agent-mode .message-content { box-shadow: 0 8px 20px rgba(54,104,139,.055); }
body.mobile-agent-mode .message.user .message-content { box-shadow: 0 9px 22px rgba(62,134,185,.17); }
body.mobile-agent-mode .mobile-agent-nav { border-color: rgba(208,230,244,.92); background: rgba(250,253,255,.95); box-shadow: 0 -10px 30px rgba(49,104,143,.08); }
.mobile-agent-nav button { color: #829bad; }
.mobile-agent-nav button.is-active { color: #4389bb; }
.mobile-agent-nav button.is-active > span { background: #e2f3fd; }
body.mobile-agent-mode .mobile-sheet-backdrop:not(.is-hidden) { background: rgba(31,57,77,.4); }
.mobile-sheet { background: #f8fcff; box-shadow: 0 -25px 60px rgba(38,82,113,.2); }
.mobile-sidebar-nav > .mobile-new-chat { background: linear-gradient(135deg, #70b5e3, #4e95cc); box-shadow: 0 11px 26px rgba(64,142,198,.2); }
.mobile-profile-card, .mobile-profile-actions button { border-color: #d9e9f4; background: #fff; box-shadow: 0 9px 24px rgba(49,103,142,.055); }
.mobile-sidebar-button { border-color: #d6e8f4; background: rgba(255,255,255,.92); box-shadow: 0 7px 19px rgba(51,111,153,.08); }
.mobile-sidebar-button span { background: #4e7b9a; }
.mobile-ip-user-avatar { border-color: #fff; box-shadow: 0 7px 18px rgba(58,127,177,.16); }
.mobile-sidebar-sheet { background: linear-gradient(180deg, #f7fcff, #eef8ff); box-shadow: 22px 0 58px rgba(34,73,102,.22); }
.mobile-sidebar-brand > span,
.mobile-sidebar-brand button,
.mobile-sidebar-nav > button,
.mobile-sidebar-history-heading button { border-color: #d6e8f4; }
.mobile-sidebar-nav > button > span { color: #4389bb; background: #e4f4fd; }
.mobile-sidebar-nav > button.is-active:not(.mobile-new-chat) { border-color: #a9d2ea; background: #eaf7ff; }
.mobile-sidebar-history-heading { border-color: #d9eaf5; }
@media (min-width: 1280px) {
  body:not(.mobile-agent-mode) .app-shell { grid-template-columns: 320px minmax(0, 1fr); }
  body:not(.mobile-agent-mode) .welcome { width: min(960px, calc(100% - 72px)); }
}

@media (max-width: 1100px) {
  .app-shell { grid-template-columns: 250px minmax(0, 1fr); }
}

@media (max-width: 820px) {
  .auth-visual { display: none; }
  .auth-screen { grid-template-columns: 1fr; }
  .auth-panel { background: radial-gradient(circle at 50% 0%, #dff2ff, transparent 42%), #f7fbff; }
  .auth-card { padding: 24px; border-radius: 24px; }
  .welcome-ip-stage { width: 128px; height: 128px; }
  .welcome-ip-status { right: -46px; }
  .auth-card { width: min(510px, 100%); }
  .message-avatar.is-ip-avatar { width: 36px; height: 36px; flex-basis: 36px; border-radius: 12px; }
  .case-card::after { display: none; }
}

@media (max-width: 520px) {
  .auth-panel { padding: calc(24px + env(safe-area-inset-top)) 16px 14px; }
  .auth-card { padding: 22px 19px; border-radius: 22px; }
  .welcome-ip-status { display: none; }
  .composer-tools { gap: 5px; }
  .knowledge-mode-select { max-width: 142px; }
  .upload-dialog, .password-dialog, .purchase-code-dialog, .membership-dialog, .usage-notice-dialog { border-radius: 21px; }
}

/* Login-card IP mascot: both hands sit in front of the upper-right border. */
.auth-card {
  position: relative;
  overflow: visible;
}

.auth-card-mascot {
  position: absolute;
  z-index: 3;
  top: -160px;
  right: 16px;
  width: 228px;
  margin: 0;
  pointer-events: none;
  user-select: none;
  /* The supplied IP artwork uses a very light checker matte. This makes the
     matte inherit the surrounding pale surface while keeping the blue model. */
  mix-blend-mode: multiply;
}

.auth-card-mascot img {
  display: block;
  width: 100%;
  height: auto;
  filter: brightness(1.025) saturate(1.04);
}

.auth-heading,
.auth-tabs,
.auth-form-stack {
  position: relative;
  z-index: 1;
}

@media (min-width: 821px) {
  .auth-card-mascot {
    top: -90px;
    width: 150px;
  }
}

@media (max-width: 820px) {
  .auth-panel {
    padding-top: calc(136px + env(safe-area-inset-top));
  }

  .auth-card-mascot {
    top: -124px;
    right: 10px;
    width: 178px;
  }
}

@media (max-width: 520px) {
  .auth-panel {
    padding-top: calc(126px + env(safe-area-inset-top));
  }

  .auth-card-mascot {
    top: -116px;
    right: 7px;
    width: 166px;
  }
}

@media (max-width: 380px) {
  .auth-panel {
    padding-top: calc(116px + env(safe-area-inset-top));
  }

  .auth-card-mascot {
    top: -102px;
    right: 4px;
    width: 146px;
  }
}

@media (max-width: 820px) and (max-height: 710px) {
  .auth-panel {
    padding-top: calc(92px + env(safe-area-inset-top));
  }

  .auth-card-mascot {
    top: -84px;
    width: 122px;
  }

  .auth-footer { bottom: calc(4px + env(safe-area-inset-bottom)); gap: 0; font-size: 8px; line-height: 1.25; }
}

@media (prefers-reduced-motion: no-preference) {
  .auth-card-mascot {
    animation: auth-mascot-settle .62s cubic-bezier(.2, .82, .25, 1) both;
    transform-origin: 68% 100%;
  }
}

@keyframes auth-mascot-settle {
  from { opacity: 0; transform: translate3d(8px, 10px, 0) rotate(1.5deg); }
  to { opacity: 1; transform: translate3d(0, 0, 0) rotate(0); }
}

/* Mobile authentication welcome page, based on the supplied typewriter reference. */
.mobile-auth-welcome { display: none; }

@media (max-width: 820px) {
  .mobile-auth-welcome {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: grid;
    min-height: 100%;
    grid-template-rows: minmax(0, 1fr) auto;
    padding: calc(24px + env(safe-area-inset-top)) 28px calc(28px + env(safe-area-inset-bottom));
    overflow: hidden;
    color: #183b54;
    background:
      radial-gradient(circle at 31% 27%, rgba(182,224,251,.34), transparent 24%),
      linear-gradient(180deg, #fbfdff 0%, #f7fbfe 53%, #eef8ff 100%);
    opacity: 0;
    pointer-events: none;
    transform: translate3d(-24px, 0, 0) scale(.99);
    transition: opacity .34s ease, transform .44s cubic-bezier(.2,.76,.25,1), visibility .44s;
    visibility: hidden;
  }

  .mobile-auth-welcome-main {
    position: relative;
    z-index: 1;
    display: flex;
    width: min(520px, 100%);
    min-height: 0;
    justify-self: center;
    justify-content: center;
    flex-direction: column;
    padding-top: clamp(8px, 2.5vh, 30px);
  }

  .mobile-auth-welcome-avatar {
    position: relative;
    width: clamp(118px, 32vw, 152px);
    aspect-ratio: 1;
    overflow: hidden;
    border: 7px solid rgba(255,255,255,.94);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 18px 42px rgba(68,145,197,.14), inset 0 0 0 1px rgba(114,190,238,.16);
  }

  .mobile-auth-welcome-avatar span {
    position: absolute;
    inset: 8%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(164,215,249,.24), transparent 70%);
  }

  .mobile-auth-welcome-avatar img {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    mix-blend-mode: multiply;
    filter: brightness(1.03) saturate(1.03);
    transform: scale(1.08);
  }

  .mobile-auth-welcome-copy {
    position: relative;
    z-index: 1;
    width: 100%;
    margin-top: clamp(22px, 4.2vh, 36px);
    text-align: left;
  }

  .mobile-auth-welcome-copy h1 {
    margin: 0;
    color: #17384f;
    font-family: inherit;
    font-size: clamp(29px, 7.8vw, 38px);
    font-weight: 540;
    line-height: 1.2;
    letter-spacing: -.035em;
  }

  .mobile-auth-welcome-copy h1 strong { color: #295b7d; font-weight: 820; }

  .mobile-auth-welcome-typewriter {
    min-height: 3.1em;
    margin: 8px 0 0;
    color: #244a63;
    font-size: clamp(19px, 5.25vw, 24px);
    font-weight: 650;
    line-height: 1.5;
    letter-spacing: -.018em;
  }

  .mobile-auth-welcome-typewriter i {
    display: inline-block;
    width: 2px;
    height: 1.2em;
    margin-left: 3px;
    border-radius: 2px;
    vertical-align: -.16em;
    background: #56aee4;
    animation: mobile-auth-caret-blink .82s steps(1, end) infinite;
  }

  .mobile-auth-welcome-actions {
    position: relative;
    z-index: 1;
    display: grid;
    width: min(520px, 100%);
    justify-self: center;
    grid-template-columns: 1fr;
    gap: 12px;
    padding-top: clamp(22px, 4vh, 38px);
  }

  .mobile-auth-welcome-actions button {
    position: relative;
    display: flex;
    height: 58px;
    align-items: center;
    justify-content: center;
    border: 1px solid #cee5f4;
    border-radius: 999px;
    color: #347da9;
    background: rgba(255,255,255,.92);
    box-shadow: 0 12px 28px rgba(77,142,186,.08);
    font-size: 17px;
    font-weight: 760;
    transition: transform .16s ease, box-shadow .16s ease;
  }

  .mobile-auth-welcome-actions button.is-primary {
    color: #fff;
    border-color: #58a9dc;
    background: linear-gradient(135deg, #69b9eb, #4395ce);
    box-shadow: 0 16px 34px rgba(64,146,202,.24);
  }

  .mobile-auth-welcome-actions button i {
    position: absolute;
    right: 22px;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
  }

  .mobile-auth-welcome-actions button:active { transform: translateY(1px) scale(.99); }

  body.mobile-auth-welcome-mode .auth-panel { padding: 0; overflow: hidden; }
  body.mobile-auth-welcome-mode .auth-footer { opacity: 0; pointer-events: none; visibility: hidden; }
  body.mobile-auth-welcome-mode .mobile-auth-welcome { opacity: 1; pointer-events: auto; transform: translate3d(0, 0, 0) scale(1); visibility: visible; }
  body.mobile-auth-welcome-mode .auth-card { opacity: 0; pointer-events: none; transform: translate3d(30px, 0, 0) scale(.985); visibility: hidden; }
  body:not(.mobile-auth-welcome-mode) .auth-card { transition: opacity .34s ease, transform .46s cubic-bezier(.2,.76,.25,1), visibility .46s; }
  body.mobile-auth-form-entering .auth-card { animation: mobile-auth-form-enter .48s cubic-bezier(.2,.76,.25,1) both; }
}

@media (max-width: 380px) {
  .mobile-auth-welcome { padding-inline: 22px; }
  .mobile-auth-welcome-copy h1 { font-size: 28px; }
  .mobile-auth-welcome-typewriter { font-size: 18px; }
  .mobile-auth-welcome-actions button { height: 54px; font-size: 16px; }
}

@media (max-width: 820px) and (max-height: 710px) {
  .mobile-auth-welcome { padding-top: calc(12px + env(safe-area-inset-top)); padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
  .mobile-auth-welcome-main { padding-top: 0; }
  .mobile-auth-welcome-avatar { width: min(18vh, 106px); border-width: 5px; }
  .mobile-auth-welcome-copy { margin-top: min(2.5vh, 16px); }
  .mobile-auth-welcome-copy h1 { font-size: 26px; }
  .mobile-auth-welcome-typewriter { min-height: 2.8em; margin-top: 4px; font-size: 17px; line-height: 1.4; }
  .mobile-auth-welcome-actions { gap: 9px; padding-top: 14px; }
  .mobile-auth-welcome-actions button { height: 48px; font-size: 15px; }
}

@media (prefers-reduced-motion: no-preference) {
  body.mobile-auth-welcome-mode .mobile-auth-welcome-avatar { animation: mobile-auth-avatar-enter .58s cubic-bezier(.2,.8,.25,1) both; }
  body.mobile-auth-welcome-mode .mobile-auth-welcome-copy { animation: mobile-auth-copy-enter .58s .08s cubic-bezier(.2,.8,.25,1) both; }
  body.mobile-auth-welcome-mode .mobile-auth-welcome-actions { animation: mobile-auth-actions-enter .58s .15s cubic-bezier(.2,.8,.25,1) both; }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-auth-welcome,
  body:not(.mobile-auth-welcome-mode) .auth-card { transition: none; }
  .mobile-auth-welcome-typewriter i { animation: none; }
  body.mobile-auth-form-entering .auth-card { animation: none; }
}

@keyframes mobile-auth-caret-blink {
  0%, 52% { opacity: 1; }
  53%, 100% { opacity: 0; }
}

@keyframes mobile-auth-avatar-enter {
  from { opacity: 0; transform: translate3d(0, 12px, 0) scale(.94); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes mobile-auth-copy-enter {
  from { opacity: 0; transform: translate3d(0, 10px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes mobile-auth-actions-enter {
  from { opacity: 0; transform: translate3d(0, 14px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes mobile-auth-form-enter {
  from { opacity: 0; transform: translate3d(30px, 0, 0) scale(.985); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

/* Match the mobile welcome screen to the two-pixel typography reduction. */
@media (max-width: 820px) {
  .mobile-auth-welcome-copy h1 { font-size: clamp(27px, 7.3vw, 36px); }
  .mobile-auth-welcome-typewriter { font-size: clamp(17px, 4.75vw, 22px); }
  .mobile-auth-welcome-actions button { font-size: 15px; }
  .mobile-auth-welcome-actions button i { font-size: 18px; }
}

@media (max-width: 380px) {
  .mobile-auth-welcome-copy h1 { font-size: 26px; }
  .mobile-auth-welcome-typewriter { font-size: 16px; }
  .mobile-auth-welcome-actions button { font-size: 14px; }
}

@media (max-width: 820px) and (max-height: 710px) {
  .mobile-auth-welcome-copy h1 { font-size: 24px; }
  .mobile-auth-welcome-typewriter { font-size: 15px; }
  .mobile-auth-welcome-actions button { font-size: 13px; }
}