/* B 晴空蓝：仅负责视觉、尺寸与响应式，不改变游戏状态和对话。 */
:root {
  --blue: #6199b8;
  --blue-dark: #46748f;
  --ink: #263d4a;
  --muted: #5b7483;
  --line: #dce8ee;
  --paper: #f0f6f8;
  --sky-card: #fff;
  --sky-header: #f8fbfb;
  --sky-soft: #e3eff5;
  --sky-own: #d8eaf5;
  --sky-link: #46748f;
  --sky-red: #cf565e;
  --sky-gold: #88662e;
  color-scheme: light;
}
body { background: #e8f0f4; }
#app { background: var(--paper); box-shadow: 0 0 30px #2440500b; }
.content { background-color: var(--paper); scrollbar-color: #bed3df transparent; }
button { touch-action: manipulation; }
.primary, .send { background: var(--blue-dark); color: #fff; box-shadow: none; border-radius: 12px; }
.primary { min-height: 44px; }
.secondary { background: var(--sky-soft); color: var(--sky-link); border-radius: 12px; min-height: 44px; }
button:focus-visible, a:focus-visible { outline: 3px solid #46748f; outline-offset: 3px; }
input:focus, textarea:focus { border-color: #6199b8!important; box-shadow: 0 0 0 2px #6199b81c; }
input::placeholder, textarea::placeholder { color: #5b7483; opacity: 1; }
.icon { width: 44px; min-width: 44px; height: 44px; border-radius: 12px; }
.icon:hover { background: var(--sky-soft); }
.danger, .error { color: #a2444c; }
.muted, .hint, .small-note, .about, .locked, .empty, .mini-label, .source-detail { color: var(--muted); }
.pill { color: var(--sky-link); background: var(--sky-soft); border-radius: 9px; }

/* 熟悉的顶部与底栏；红标保持独立。 */
.top { background: var(--sky-header); border-bottom-color: var(--line); }
.top small { color: var(--muted); }
.connection i { background: var(--blue); border-color: var(--sky-header); box-shadow: none; }
.bottom { background: var(--sky-header); border-top-color: var(--line); }
.tab { color: #5b7483; }
.tab.active { color: var(--blue-dark); }
.badge, .avatar-unread { background: var(--sky-red); color: #fff; border-color: var(--sky-header); }
.muted-unread, .row-dot, .unheard { background: var(--sky-red); }
.draft-label { color: #a2444c; }
.friend-star { color: #866c3f; }

/* 消息、通讯录与检索结果。 */
.list { padding: 8px 12px 14px; background: var(--paper); }
.list-row { background: var(--sky-card); border: 1px solid transparent; border-radius: 18px; margin: 0 0 8px; padding: 13px 12px; gap: 12px; min-height: 78px; }
.list-row:hover, .list-row.pinned { background: #e7f1f6; border-color: #cddfe9; }
.list-row strong { color: var(--ink); }
.list-row strong small, .list-row p, .list-row time, .row-end small, .catalog-entry small { color: var(--muted); }
.list-row p { font-size: 12px; line-height: 1.5; margin-top: 6px; }
.row-end { min-width: 40px; max-width: 53px; }
.row-end small { margin-top: 15px; font-size: 10px; }
.avatar { border-radius: 12px; background-color: #dbe8ef; color: var(--sky-link); }
.avatar.large { border-radius: 18px; }
.avatar.service { background: #6199b8; color: #fff; }
.avatar.mystery { background: #d7e5ef; color: #526f83; }
.avatar.me { background: #d4e5f0; color: var(--sky-link); }
.avatar.me[data-color="1"] { background: #dcece7; color: #486e63; }
.avatar.me[data-color="2"] { background: #f1e7d9; color: #7a603e; }
.monogram { background: #e1edf2; color: var(--sky-link); }
.search-wrap { padding: 12px 16px 6px; }
.search { background: #fff; border-color: var(--line); border-radius: 12px; min-height: 44px; }
.section-label { color: var(--muted); margin: 15px 16px 8px; }
.panel { margin: 12px; padding: 0 16px; background: #fff; border: 1px solid #e6eef2; border-radius: 18px; }
.setting-row { border-color: #e4edf1; color: var(--ink); min-height: 56px; }
.setting-row small { color: var(--muted); }
.setting-row svg { color: var(--sky-link); }
.setting-row svg:last-child { color: #718592; }
.setting-row select { border-color: #ccdfe9; border-radius: 9px; color: var(--ink); background: #f8fbfb; min-height: 44px; }
.contact-shortcuts { margin-top: 12px; }
.contact-shortcuts [data-action="requests"] small { background: var(--sky-red); color: #fff; }
.request-row { background: #fff; border: 1px solid #e2ecf1; border-radius: 18px; padding: 16px; margin: 10px 12px; width: calc(100% - 24px); }
.request-row small { color: var(--muted); }
.quick-menu { background: #f8fbfb; color: var(--ink); border: 1px solid #cddfe8; border-radius: 14px; box-shadow: 0 8px 25px #24405021; }
.quick-menu:before { background: #f8fbfb; border-left: 1px solid #cddfe8; border-top: 1px solid #cddfe8; }
.quick-menu .setting-row { border-bottom-color: #dce8ee; }
.quick-menu .setting-row svg { color: var(--sky-link); }
.quick-menu .setting-row small { color: var(--muted); }

/* 对话字号沿用原设置，避免改动人物对白的呈现与换行。 */
.chat-content { background: var(--paper); padding: 12px 12px 24px; }
.message .avatar { border-radius: 9px; }
.bubble-wrap { max-width: calc(100% - 61px); }
.bubble { background: #fff; border-color: #e5edf1; border-radius: 16px; box-shadow: none; color: var(--ink); }
.bubble:before { background: #fff; border-color: #e5edf1; top: 15px; }
.own .bubble { background: var(--sky-own); border-color: #cbdfe9; border-radius: 16px; }
.own .bubble:before { background: var(--sky-own); border-color: #cbdfe9; }
.voice { color: var(--sky-link); min-height: 46px; }
.voice.playing { background: #e6f1f7; border-color: #9ac0d4; }
.voice time, .voice-meta { color: var(--muted); }
.bars i { background: #6199b8; }
.voice-meta button { color: var(--sky-link); min-width: 44px; min-height: 44px; border-radius: 9px; }
.transcript { background: #ffffffd9; border: 0; border-radius: 14px; color: #405967; }
.quote { border-left-color: #abcbdc; color: #516d7d; }
.quote button { min-width: 44px; min-height: 44px; }
.date-line, .message-date, .system-message { color: var(--muted); }
.chat-photo, .chat-video, .photo-full { border-radius: 14px; }
.photo-caption { color: var(--muted); }
.contact-card { background: #fff; border-color: #dce8ee; border-radius: 14px; }
.contact-card .avatar { border-radius: 10px; }
.contact-card small { color: var(--muted); }
.time-card { background: #fff; border: 1px solid #d7e5ed; border-radius: 16px; color: var(--ink); }
.time-card p { color: var(--muted); }
.time-card span { color: var(--sky-link); }
.assistant-tools { background: #e5f0f6; border-color: #d5e6ef; border-radius: 16px; color: var(--ink); }
.assistant-tools small { color: #566f7e; }
.assistant-tools button { background: #f8fbfb; border-color: #c8dde8; border-radius: 10px; color: var(--sky-link); min-height: 44px; }
.intent-card { background: #fff; border: 1px solid #cddfe9; border-radius: 16px; }
.intent-card small { color: var(--muted); }
.intent-card button { border-radius: 10px; border-color: #c8dde8; background: #e8f2f7; color: #3b6278; min-height: 44px; }
.intent-card strong { color: var(--ink); }

/* 可改的草稿、灵感与录音。 */
.composer { background: var(--sky-header); border-top-color: var(--line); padding: 8px 6px max(8px,env(safe-area-inset-bottom)); }
.compose-row { gap: 3px; }
.compose-row textarea { background: #fff; border-color: #ccdee8; border-radius: 11px; }
.compose-row .icon { width: 44px; min-width: 44px; height: 44px; }
.send { border-radius: 11px; min-width: 49px; height: 44px; padding: 0 9px; }
.reply-hints { max-height: 154px; padding-bottom: 6px; }
.reply-heading, .reply-heading small { color: var(--muted); }
.reply-heading .soft { color: var(--sky-link); min-height: 44px; }
.reply-grid { gap: 6px; }
.reply-grid button { background: #e8f2f7; border-color: #d3e4ed; color: #45677a; border-radius: 14px; min-height: 44px; }
.reply-grid button.selected { background: #d6eaf5; border-color: #83afc6; color: #294f64; }
.draft-tools, .queue-hint, .idea-row span { color: #5c7483; }
.draft-tools button { min-width: 44px; min-height: 44px; color: var(--sky-link); }
.recording svg { color: var(--sky-link); }

/* 朋友圈的照片保留原图，动态改为柔白卡片。 */
.cover { background: linear-gradient(135deg,#7c9eac,#9bb1b7 68%,#c5ceca); }
.cover p { opacity: 1; color: #fff; text-shadow: 0 1px 3px #29465365; }
.cover-avatar { border-color: var(--sky-header); border-radius: 16px; }
.cover-avatar .avatar { border-radius: 12px; }
.feed { background: var(--paper); padding: 27px 12px 18px; }
.post { background: #fff; border: 1px solid #e6eef2; border-radius: 18px; padding: 16px 12px; margin: 0 0 10px; }
.post-head .avatar { border-radius: 9px; }
.post-name { color: var(--sky-link); min-height: 44px; text-align: left; }
.post-head small { color: var(--muted); }
.post-text { margin-left: 49px; }
.post-image { border-radius: 10px; }
.post-actions { color: var(--sky-link); flex-wrap: wrap; gap: 13px; }
.post-actions button { min-width: 44px; min-height: 44px; }
.post-actions .liked { color: #3e6f89; }
.comments { border-radius: 10px; background: #edf5f8; color: #3f5968; }
.comments button { color: var(--sky-link); min-height: 44px; }

/* 我的、钱包、资料、分组与结局。 */
.profile-hero { background: #fff; margin: 12px; padding: 24px 17px; width: calc(100% - 24px); border-radius: 18px; }
.profile-hero p, .profile-hero>svg { color: var(--muted); }
.toggle { background: #bed2de; }
.toggle.on { background: var(--blue-dark); }
.wallet-balance { background: #e1eff6; margin: 12px; border-radius: 20px; padding: 24px 20px; }
.wallet-balance h2 { color: #355c71; }
.wallet-balance small, .wallet-balance p { color: #546f7e; }
.shop-list { padding: 0 12px; }
.shop-item { padding: 16px 12px; margin-bottom: 9px; border: 1px solid #e2ecf1; border-radius: 16px; background: #fff; }
.shop-item p, .shop-item small, .order-row p, .order-row small { color: var(--muted); }
.shop-item>button { flex-shrink: 0; min-height: 44px; }
.order-row { background: #fff; margin: 9px 12px; border: 1px solid #e2ecf1; border-radius: 16px; }
.clock-mode { background: var(--sky-soft); color: #486b7e; border-radius: 12px; }
.catalog-summary { background: #e1eff6; border-color: #d6e6ef; border-radius: 18px; color: #345a70; }
.catalog-summary small { color: #597483; }
.catalog-summary progress::-webkit-progress-bar { background: #c7dce7; }
.catalog-summary progress::-webkit-progress-value { background: #6199b8; }
.catalog-tools select { background: #fff; color: #3f5e6e; border-color: #ccdee8; border-radius: 10px; }
.catalog-status b { color: var(--sky-link); }
.catalog-status small, .pager { color: var(--muted); }
.dossier { background: #f0f6f8; border-radius: 14px; }
.dossier span { color: var(--muted); }
.dossier b { color: #456170; }
.relationship { background: #e5f0f6; border-radius: 16px; }
.relationship span, .relationship small, .relationship-metrics { color: #516d7d; }
.relationship progress::-webkit-progress-bar { background: #cbdfe9; }
.relationship progress::-webkit-progress-value { background: #6199b8; }
.privacy-note { color: #795e36!important; }
.relation-entry { border-color: #dce8ee; }
.collection-groups details { border-bottom: 1px solid #e4edf1; }
.collection-groups details:last-child { border: 0; }
.collection-groups summary { min-height: 44px; padding: 11px 0; cursor: pointer; color: var(--sky-link); }
.known-note-form textarea { border-color: #ccdee8; border-radius: 12px; }
.coverage-grid>div { background: #e9f3f7; border-radius: 14px; }
.coverage-grid strong { color: var(--sky-link); }
.coverage-grid small { color: var(--muted); }
.intro-banner, .ending-banner { background: #e5f0f6; border-bottom-color: #dce8ee; }
.intro-banner span, .intro-banner p { color: #526f80; }
.intro-banner h2, .ending-banner .ending-status { color: #2e586d; }

/* 注册、账号与常用弹层。 */
.register, .account-screen { background: var(--sky-header); }
.reg-brand p, .reg-footer, .register label.field, .consent, .account-brand p { color: var(--muted); }
.register label.field input { border-color: #ccdee8; border-radius: 12px; }
.avatars button { border-radius: 14px; }
.avatars .avatar { border-radius: 9px; }
.avatars button.selected { border-color: #6199b8; background: #e6f1f7; }
.slot-row { border-color: #dce8ee; border-radius: 18px; }
.slot-row small, .slot-row>svg { color: var(--muted); }
.slot-number { background: var(--sky-soft); color: var(--sky-link); }
.modal-backdrop { background: #35556552; }
.modal { background: #fdfefe; border: 1px solid #deebf0; border-radius: 22px; box-shadow: 0 16px 42px #28465323; }
.modal p { color: #5b7483; }
.modal .close { min-width: 44px; min-height: 44px; color: var(--sky-link); margin-top: -8px; }
.modal input, .modal textarea, .modal select { border-color: #ccdee8; border-radius: 12px; background: #fff; }
.modal .actions { flex-wrap: wrap; }
.modal .actions button { min-height: 44px; }
.emoji-grid button, .extras-grid button { background: #eaf3f7; border-radius: 12px; }
.extras-grid svg { color: var(--sky-link); }
.checkline { min-height: 44px; }
.checkline input, .consent input { accent-color: var(--blue-dark); }
#toast { background: #365665ee; color: #fff; border-radius: 14px; }

/* B 系统与任务也像日常聊天，不再采用深色仪表盘。 */
#system-overlay { color: var(--ink); --zx-cyan: #6199b8; --zx-gold: #9c7c43; }
.zx-system-backdrop { background: #35556566; backdrop-filter: blur(3px); }
.zx-system-modal { border: 1px solid #cbdfe9; border-radius: 23px; background: #f8fbfb; color: var(--ink); box-shadow: 0 16px 45px #28465329; padding: 22px 20px 18px; }
.zx-system-modal:before, .zx-system-modal:after { display: none; }
.zx-system-kicker { color: #5b7483; letter-spacing: .02em; }
.zx-system-kicker>span { background: #6199b8; box-shadow: none; }
.zx-system-emblem { border: 0; background: #e1eff6; color: #46748f; box-shadow: none; width: 52px; height: 52px; font-size: 28px; margin: 18px auto 14px; }
.zx-system-code { color: #5b7483; letter-spacing: .05em; margin-bottom: 15px; }
.zx-system-chapter { color: #5b7483; }
.zx-system-modal h2 { color: #263d4a; text-shadow: none; font-size: 21px; }
.zx-system-description { color: #526d7c; line-height: 1.75; }
.zx-system-objective { background: #e7f2f7; border-color: #d7e6ee; border-radius: 14px; }
.zx-system-objective>span { color: #6199b8; }
.zx-system-objective strong { color: #2d4a5b; }
.zx-system-objective p { color: #526d7c; }
.zx-system-stages li { color: #5b7483; }
.zx-system-stages li>span:first-child { border-color: #aac9d9; }
.zx-system-stages li.is-done { color: #3f6c83; }
.zx-system-stages li.is-done>span:first-child { color: #3f6c83; background: #d8eaf5; border-color: #9fc2d5; }
.zx-system-rewards>div { background: #fff; border-color: #d7e6ee; border-radius: 13px; }
.zx-system-rewards i { color: #84672f; background: #f5efdf; }
.zx-system-rewards i.zx-system-xp { color: #46748f; background: #e4f1f7; }
.zx-system-rewards strong { color: #795c28; }
.zx-system-rewards small { color: #5c7584; }
.zx-system-button { border-radius: 12px; }
.zx-system-primary { background: #46748f; border-color: #46748f; color: #fff; box-shadow: none; }
.zx-system-secondary { background: #e4eff5; border-color: #cbdfe9; color: #3e687f; }
.zx-system-gold { background: #f0e5c9; border-color: #dccb9d; color: #604918; box-shadow: none; }
.zx-system-button:focus-visible, .zx-system-filters button:focus-visible, #system-nudge button:focus-visible { outline-color: #46748f; }
.zx-system-close { color: #4e6d7e; min-width: 44px; min-height: 44px; border-radius: 12px; }
.zx-system-note, .zx-system-page-note { color: #5b7483; }
.zx-system-collection { background: #f6f0e0; border-color: #e3d7b7; color: #745929; border-radius: 12px; }
.zx-system-success { background: #f8fbfb; border-color: #d9cba3; box-shadow: 0 16px 45px #28465329; }
.zx-system-success .zx-system-emblem { background: #f3ecd8; border: 0; color: #87652d; box-shadow: none; }
.zx-system-success h2 { color: #694f24; text-shadow: none; }
.zx-system-success .zx-system-kicker, .zx-system-success .zx-system-chapter { color: #7b673f; }
.zx-system-success .zx-system-kicker>span { background: #b3965c; box-shadow: none; }
#system-nudge button { background: #f8fbfb; border-color: #c8dde8; border-radius: 15px; color: #294c61; box-shadow: 0 8px 24px #2846531c; }
/* 固定任务提示有专用留白，不压住首条消息、任务卡或钱包余额。 */
body:has(#system-nudge:not([hidden])) #app > .top { margin-bottom: 72px; }
#system-nudge { top: 66px; max-width: 432px; }
#system-nudge button { height: 58px; min-height: 58px; }
#system-nudge strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#system-nudge .zx-system-nudge-mark { color: #6199b8; }
#system-nudge small { color: #5c7787; }
#system-nudge b { background: var(--sky-red); }
#system-nudge i { color: #5b7483; }
.zx-system-banner-wrap { background: var(--paper); padding-top: 10px; }
.zx-system-banner { background: #e0eef5; border-color: #d2e4ee; border-radius: 18px; color: #345b70; box-shadow: none; }
.zx-system-banner small { color: #526f80; }
.zx-system-banner-symbol { color: #6199b8; }
.zx-system-progress { background: #c9dee9; height: 4px; }
.zx-system-progress i { background: #6199b8; }
.zx-system-banner.is-ready { background: #eef2e9; border-color: #d7dfcb; color: #587044; }
.zx-system-banner.is-ready small { color: #5a6e4b; }
.zx-system-banner.is-ready .zx-system-progress i { background: #90a974; }
.zx-system-page { background: var(--paper); color: var(--ink); padding: 16px 12px 24px; }
.zx-system-summary { background: #e4f0f6; border-color: #d2e3ed; border-radius: 20px; }
.zx-system-summary h2 { color: #2e5165; }
.zx-system-summary>p { color: #5a7585; }
.zx-system-level>strong { color: #46748f; }
.zx-system-level small { color: #5c7787; }
.zx-system-level>b { color: #7c602b; }
.zx-system-level>b small { color: #6d5b37; }
.zx-system-filters { gap: 5px; }
.zx-system-filters button { background: #fff; border-color: #d2e3ed; border-radius: 12px; color: #516d7d; min-height: 48px; }
.zx-system-filters small { color: #5b7483; }
.zx-system-filters button[aria-pressed=true] { background: #d8eaf5; border-color: #9bbfd2; color: #2d5b73; }
.zx-system-filters button[aria-pressed=true] small { color: #476f86; }
.zx-system-task-card { background: #fff; border-color: #e1ebf0; border-radius: 18px; padding: 16px 14px; }
.zx-system-card-meta { color: #5b7686; }
.zx-system-card-meta>b { background: #e7f1f6; border-color: #d3e4ed; color: #4e7186; border-radius: 9px; }
.zx-system-task-card h3 { color: #2e4e61; }
.zx-system-task-card>p { color: #536f7e; }
.zx-system-task-card .zx-system-rewards>div { background: #f3f8fa; }
.zx-system-task-card.is-ready { background: #f9fbf7; border-color: #d8e3cd; }
.zx-system-task-card.is-ready .zx-system-card-meta>b { color: #587044; border-color: #d0dec1; background: #eaf1e3; }
.zx-system-empty { color: #5e7888; }
.zx-system-times { background: #eaf3f7; border-color: #d8e7ef; border-radius: 13px; }
.zx-system-times dt { color: #55798e; }
.zx-system-times dd { color: #2e4e61; }
.zx-system-history, .zx-system-history section { border-color: #d5e5ed; }
.zx-system-history h3 { color: #5b6f45; }
.zx-system-history p, .zx-system-history blockquote { color: #405d6e; }
.zx-system-history blockquote { background: #edf5f8; border-left-color: #8fb7cd; border-radius: 0 10px 10px 0; }
.zx-system-history blockquote small, .zx-system-history .zx-system-secondary-copy { color: #5b7483; }
.zx-system-growth { color: #42667a; }
.zx-system-growth>span { border-color: #cbdfe9; border-radius: 9px; background: #eaf3f7; }
.zx-system-growth p { color: #5b7483; }

/* 公司开场统一柔白色；保留原动画与跳过按钮。 */
.brand-stage { background: radial-gradient(ellipse at 50% 44%,#fff,#edf5f8 74%); color: var(--ink); }
.company-mark { background: #6199b8; border-radius: 28px; padding: 17px; filter: drop-shadow(0 9px 18px #477e9a15); }
.company-name { color: #365c71; }
.brand-stage p, .brand-stage small { color: #5b7483; }
.brand-drop { background: #6199b8; }
.brand-ripples i { border-color: #93bdd3; }
.brand-skip { color: #46748f; background: #fff9; border-color: #cddfe9; border-radius: 12px; }

@media (max-width: 390px) {
  .list { padding-left: 10px; padding-right: 10px; }
  .list-row { padding-left: 11px; padding-right: 11px; gap: 11px; }
  .reply-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .post { padding-left: 10px; padding-right: 10px; }
  .zx-system-modal { padding-left: 17px; padding-right: 17px; }
  .zx-system-rewards>div { gap: 7px; padding: 10px; }
}
@media (max-width: 360px) {
  .top { grid-template-columns: 88px minmax(0,1fr) 88px; padding-left: 4px; padding-right: 4px; }
  .top.chat h1 { font-size: 16px; }
  .compose-row .icon { width: 44px; min-width: 44px; }
  .send { padding: 0 8px; min-width: 46px; }
  .compose-row textarea { padding-left: 7px; padding-right: 7px; }
  .reply-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .list-row { padding: 12px 10px; gap: 10px; }
  .list-row strong { font-size: 15px; }
  .catalog-status { max-width: 61px; }
  .catalog-summary { margin: 12px; gap: 10px; padding: 18px 15px; }
  .catalog-summary strong { font-size: 25px; }
  .setting-row small { max-width: 108px; }
  .modal { padding: 19px 16px; }
  .zx-system-page { padding-left: 10px; padding-right: 10px; }
  .zx-system-level { flex-wrap: wrap; }
  .zx-system-level>span { flex-basis: calc(100% - 80px); }
  .zx-system-level>b { margin-left: auto; }
  .zx-system-filters button { font-size: 10px; padding-left: 2px; padding-right: 2px; }
  .zx-system-actions>.zx-system-button { min-width: 95px; }
}
@media (prefers-reduced-motion: reduce) {
  .zx-system-modal { animation: none; }
}
