/* Reused unchanged from Hermes UI @ bcecef72485ca0dc3dadc8798c21809866322c4a (Iris / Codex Mini). See LICENSE.codex-mini.txt. */

    :root {
      color-scheme: dark;
      --bg: #0d0d0d;
      --topbar-bg: #000000;
      --topbar-row-height: 52px;
      --topbar-safe-lift: 0px;
      --top-control-size: 26px;
      --thread-composer-gap: 6px;
      --thread-menu-edge-gap: 12px;
      --notice-top-gap: 8px;
      --panel: #171717;
      --panel-2: #242424;
      --text: #f4f4f5;
      --muted: #a1a1aa;
      --faint: #71717a;
      --line: rgba(255,255,255,.09);
      --user: #2f2f2f;
      --assistant: transparent;
      --accent: #f4f4f5;
      --ok: #8ef0b7;
      --app-height: 100dvh;
      --app-top: 0px;
      --keyboard-shift: 0px;
      --keyboard-composer-gap: 0px;
      --keyboard-shift-trim: 28px;
      --keyboard-gap-bg: #0d0d0d;
      --lock-card-top: 92px;
      --composer-bottom-pad: max(34px, calc(env(safe-area-inset-bottom) + 10px));
      --composer-signature-gap: 15px;
      --composer-signature-top: calc(var(--thread-composer-gap) + 64px + var(--composer-signature-gap));
      --signature-dot-tint-a: color(display-p3 .67 .90 .82);
      --signature-dot-tint-b: color(display-p3 .57 .92 .74);
      --signature-dot-glow: rgba(142,240,183,.14);
      --dot-core: color(display-p3 .42 1 .68);
      --dot-glow-soft: color(display-p3 .18 1 .48 / .52);
      --dot-glow-peak: color(display-p3 .56 1 .78);
      --dot-glow-deep: color(display-p3 .08 .9 .36 / .58);
      --dot-hdr-flare: color(display-p3 .64 1 .78 / .98);
      --dot-flash-duration: 1.82s;
      --dot-flash-delay: 0ms;
      font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, "PingFang SC", sans-serif;
    }
    :root.android-keyboard-mode {
      --keyboard-shift-trim: 64px;
    }
    @media (dynamic-range: high) {
      @supports (dynamic-range-limit: no-limit) {
        :root {
          --dot-core: color(display-p3 .54 1 .72);
          --dot-glow-soft: color(display-p3 .22 1 .50 / .72);
          --dot-glow-peak: color(display-p3 .72 1 .86);
          --dot-glow-deep: color(display-p3 .10 1 .42 / .86);
          --dot-hdr-flare: color(display-p3 .86 1 .92);
        }
        .title-dot { dynamic-range-limit: no-limit; }
      }
    }
    * { box-sizing: border-box; }
    html, body { width: 100%; min-height: 100%; height: 100%; background: var(--topbar-bg); touch-action: pan-x pan-y; overflow: hidden; overscroll-behavior: none; }
    body { position: fixed; inset: 0; margin: 0; color: var(--text); overflow: hidden; overscroll-behavior: none; }

    .app {
      position: fixed;
      left: 0;
      right: 0;
      top: var(--app-top);
      width: 100%;
      height: var(--app-height);
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      background: var(--bg);
    }

    .topbar {
      position: relative;
      z-index: 80;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-width: 0;
      height: calc(var(--topbar-row-height) + max(0px, calc(env(safe-area-inset-top) - var(--topbar-safe-lift))));
      padding: max(0px, calc(env(safe-area-inset-top) - var(--topbar-safe-lift))) 14px 0;
      border-bottom: 1px solid rgba(255,255,255,.22);
      background: var(--topbar-bg);
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .title {
      min-width: 0;
      flex: 1 1 auto;
      display: flex;
      align-items: center;
      gap: 6px;
      overflow: visible;
      font-weight: 760;
      letter-spacing: -.02em;
    }
    .route-badge {
      flex: 0 0 auto;
      height: var(--top-control-size);
      appearance: none;
      display: inline-grid;
      grid-template-columns: 15px auto;
      align-items: center;
      justify-items: center;
      gap: 5px;
      padding: 0 9px 0 8px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.055);
      color: var(--muted);
      font-family: inherit;
      font-size: 12px;
      font-weight: 760;
      line-height: 1;
      white-space: nowrap;
      cursor: pointer;
      touch-action: manipulation;
    }
    .route-badge.is-compact {
      width: var(--top-control-size);
      grid-template-columns: 1fr;
      gap: 0;
      padding: 0;
    }
    .route-badge.is-compact #route-text { display: none; }
    .route-badge:active { transform: scale(.96); }
    .route-badge svg {
      width: 15px;
      height: 15px;
      display: block;
      transform: translateY(.25px);
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    #route-text {
      display: block;
      line-height: 15px;
      transform: translateY(.15px);
    }
    .route-badge.is-local {
      color: var(--ok);
      border-color: rgba(142,240,183,.28);
      background: rgba(142,240,183,.11);
    }
    .route-badge.is-relay {
      color: #9ecbff;
      border-color: rgba(158,203,255,.25);
      background: rgba(158,203,255,.10);
    }
    .permission-badge,
    .reasoning-badge,
    .model-badge {
      flex: 0 0 auto;
      height: var(--top-control-size);
      min-width: 42px;
      appearance: none;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 999px;
      background: rgba(255,255,255,.055);
      color: var(--muted);
      padding: 0 9px;
      font: inherit;
      font-size: 12px;
      font-weight: 820;
      line-height: 1;
      display: inline-grid;
      place-items: center;
      cursor: pointer;
      touch-action: manipulation;
      white-space: nowrap;
    }
    /* 模型/推理名异常长（如 cc 中转把整排档位词下发）时省略，不撑爆顶栏 */
    #model-text {
      max-width: 88px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    #reasoning-text {
      max-width: 56px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .permission-badge {
      width: var(--top-control-size);
      min-width: var(--top-control-size);
      max-width: var(--top-control-size);
      flex-basis: var(--top-control-size);
      padding: 0;
      color: #a1a1aa;
      border-color: rgba(212,212,216,.22);
      background: rgba(212,212,216,.08);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0;
      overflow: hidden;
    }
    .permission-badge #permission-text { display: none !important; }
    .permission-badge.mode-request {
      color: #d4d4d8;
      border-color: rgba(212,212,216,.28);
      background: rgba(212,212,216,.10);
    }
    .permission-badge.mode-auto {
      color: #9ecbff;
      border-color: rgba(158,203,255,.30);
      background: rgba(158,203,255,.11);
    }
    .permission-badge.mode-full {
      color: #ffb86b;
      border-color: rgba(255,184,107,.32);
      background: rgba(255,184,107,.12);
    }
    .permission-badge.mode-custom {
      color: var(--ok);
      border-color: rgba(142,240,183,.30);
      background: rgba(142,240,183,.12);
    }
    .permission-badge svg {
      width: 14px;
      height: 14px;
      display: block;
      margin: 0;
      flex: 0 0 14px;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
      transform: translateZ(0);
    }
    .reasoning-badge {
      min-width: 32px;
      color: #ffd68a;
      border-color: rgba(255,214,138,.26);
      background: rgba(255,214,138,.10);
    }
    .reasoning-badge.is-fast {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 3px;
    }
    .reasoning-badge.is-fast::before {
      content: '';
      width: .72em;
      height: 1em;
      flex: 0 0 .72em;
      align-self: center;
      background: currentColor;
      clip-path: polygon(60% 0, 8% 56%, 45% 56%, 30% 100%, 94% 37%, 58% 37%);
      transform: translateY(.5px);
    }
    .reasoning-badge:not(.mode-xhigh) {
      width: var(--top-control-size);
      min-width: var(--top-control-size);
      padding: 0;
      line-height: 1;
      text-align: center;
    }
    .reasoning-badge.mode-low {
      color: #9ecbff;
      border-color: rgba(158,203,255,.28);
      background: rgba(158,203,255,.10);
    }
    .reasoning-badge.mode-medium {
      color: var(--ok);
      border-color: rgba(142,240,183,.28);
      background: rgba(142,240,183,.11);
    }
    .reasoning-badge.mode-high {
      color: #ffd68a;
      border-color: rgba(255,214,138,.30);
      background: rgba(255,214,138,.12);
    }
    .reasoning-badge.mode-xhigh {
      color: #ff9a8d;
      border-color: rgba(255,154,141,.32);
      background: rgba(255,154,141,.12);
    }
    .model-badge.is-relay {
      color: var(--ok);
      border-color: rgba(142,240,183,.28);
      background: rgba(142,240,183,.11);
    }
    .model-badge.is-official {
      color: #ffd447;
      border-color: rgba(255,212,71,.52);
      background: rgba(255,212,71,.16);
      box-shadow: 0 0 14px rgba(255,212,71,.12);
    }
    .permission-badge.is-switching,
    .reasoning-badge.is-switching,
    .model-badge.is-switching {
      opacity: .68;
      cursor: wait;
    }
    .permission-badge:disabled,
    .reasoning-badge:disabled,
    .model-badge:disabled {
      opacity: .5;
      cursor: wait;
    }
    .permission-badge:active:not(:disabled),
    .reasoning-badge:active:not(:disabled),
    .model-badge:active:not(:disabled) {
      transform: scale(.96);
    }
    #permission-text {
      display: none !important;
    }
    #reasoning-text,
    #model-text,
    .settings-btn span {
      display: block;
      line-height: 1;
      transform: translateY(.5px);
    }
    .model-menu-card {
      position: fixed;
      z-index: 120;
      display: none;
      grid-template-columns: repeat(2, minmax(116px, max-content));
      gap: 8px;
      min-width: 182px;
      width: max-content;
      max-width: calc(100vw - 24px);
      padding: 10px;
      border-radius: 18px;
      border: 1px solid rgba(142,240,183,.22);
      background: linear-gradient(rgba(142,240,183,.08), rgba(142,240,183,.08)), #13263a;
      box-shadow: 0 18px 42px rgba(0,0,0,.36);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }
    .model-menu-card.is-open { display: grid; }
    .model-menu-item {
      min-width: 0;
      height: 34px;
      appearance: none;
      border: 1px solid rgba(142,240,183,.24);
      border-radius: 999px;
      background: rgba(142,240,183,.11);
      color: var(--ok);
      padding: 0 12px;
      font: inherit;
      font-size: 12px;
      font-weight: 760;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      cursor: pointer;
      touch-action: manipulation;
      white-space: nowrap;
      position: relative;
    }
    .model-menu-item.source-official {
      color: #ffd447;
      border-color: rgba(255,212,71,.44);
      background: rgba(255,212,71,.14);
    }
    .model-menu-item.source-relay {
      color: var(--ok);
      border-color: rgba(142,240,183,.24);
      background: rgba(142,240,183,.11);
    }
    .model-menu-item.source-official.is-current {
      background: rgba(255,212,71,.22);
      border-color: rgba(255,212,71,.62);
    }
    .model-menu-item.source-relay.is-current {
      background: rgba(142,240,183,.18);
      border-color: rgba(142,240,183,.44);
    }
    .model-menu-item:active { transform: scale(.98); }
    .model-menu-item.is-current {
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
    }
    .model-menu-item.is-current::after {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 999px;
      background: currentColor;
      box-shadow: 0 0 10px currentColor;
      flex: 0 0 auto;
    }
    .reasoning-menu-card {
      grid-template-columns: minmax(0, 1fr);
      min-width: 97px;
      border-color: rgba(255,255,255,.12);
      background: rgba(29,29,32,.96);
    }
    .permission-menu-card {
      grid-template-columns: minmax(228px, 1fr);
      min-width: 252px;
      border-color: rgba(255,255,255,.13);
      background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)), rgba(20,22,27,.98);
      box-shadow: 0 20px 52px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.045);
    }
    .permission-menu-status {
      padding: 2px 3px 4px;
      color: var(--faint);
      font-size: 11px;
      font-weight: 700;
      line-height: 1.25;
    }
    .permission-menu-item {
      width: 100%;
      height: auto;
      min-height: 43px;
      display: grid;
      grid-template-columns: 28px minmax(0, 1fr) 16px;
      align-items: center;
      justify-content: stretch;
      column-gap: 10px;
      border-radius: 999px;
      padding: 8px 11px 8px 12px;
      text-align: left;
      white-space: normal;
    }
    .permission-menu-item.mode-request {
      color: #d4d4d8;
      border-color: rgba(212,212,216,.30);
      background: rgba(212,212,216,.105);
    }
    .permission-menu-item.mode-auto {
      color: #9ecbff;
      border-color: rgba(158,203,255,.31);
      background: rgba(158,203,255,.115);
    }
    .permission-menu-item.mode-full {
      color: #ffb86b;
      border-color: rgba(255,184,107,.34);
      background: rgba(255,184,107,.13);
    }
    .permission-menu-item.mode-custom {
      color: var(--ok);
      border-color: rgba(142,240,183,.30);
      background: rgba(142,240,183,.12);
    }
    .permission-menu-item.mode-request.is-current {
      border-color: rgba(212,212,216,.52);
      background: rgba(212,212,216,.17);
    }
    .permission-menu-item.mode-auto.is-current {
      border-color: rgba(158,203,255,.52);
      background: rgba(158,203,255,.18);
    }
    .permission-menu-item.mode-full.is-current {
      border-color: rgba(255,184,107,.58);
      background: rgba(255,184,107,.20);
    }
    .permission-menu-item.mode-custom.is-current {
      border-color: rgba(142,240,183,.50);
      background: rgba(142,240,183,.18);
    }
    /* 候选菜单外框：跟「线程菜单」同款（深底 + 大圆角 + 可滚），宽度由 JS 对齐输入框 */
    .composer-menu-card {
      position: fixed;
      z-index: 130;
      display: none;
      flex-direction: column;
      gap: 1px;
      width: min(520px, calc(100vw - 24px));
      height: 320px; /* 默认固定高度，JS 会按「topbar 底 → 输入框顶」的空间算出精确固定值 */
      max-height: 86svh;
      overflow-y: auto;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,.28) transparent;
      padding: 8px 10px;
      border: 1px solid var(--line);
      border-radius: 22px;
      background: rgba(24,24,27,.98);
      box-shadow: 0 18px 60px rgba(0,0,0,.45);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }
    .composer-menu-card::-webkit-scrollbar { width: 6px; }
    .composer-menu-card::-webkit-scrollbar-track { background: transparent; }
    .composer-menu-card::-webkit-scrollbar-thumb { background: rgba(255,255,255,.28); border-radius: 999px; }
    .theme-light .composer-menu-card::-webkit-scrollbar-thumb { background: rgba(0,0,0,.26); }
    .composer-menu-card.is-open { display: flex; }
    /* Pro 模式：外面彩色渐变描边（与线程菜单一致） */
    body.pro-mode .composer-menu-card {
      border-color: transparent;
      background:
        linear-gradient(rgba(24,24,27,.98), rgba(24,24,27,.98)) padding-box,
        linear-gradient(92deg, rgba(255,255,255,.58) 0%, rgba(158,203,255,.98) 28%, var(--signature-dot-tint-a) 46%, rgba(142,240,183,.9) 64%, var(--signature-dot-tint-b) 78%, rgba(255,255,255,.58) 100%) border-box;
      background-size: auto, 260% 100%;
      background-position: 0 0, 50% 50%;
    }
    body.pro-mode.color-flow-on .composer-menu-card { animation: signatureColorFlow 4.8s ease-in-out infinite; }
    @media (prefers-reduced-motion: reduce) {
      body.pro-mode.color-flow-on .composer-menu-card { animation: none; }
    }
    .composer-menu-group {
      padding: 4px 10px 2px;
      font-size: 11px;
      font-weight: 800;
      color: rgba(255,255,255,.5);
      letter-spacing: .3px;
    }
    .composer-menu-group:not(:first-child) { margin-top: 2px; }
    .composer-menu-item {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      min-height: 30px;
      appearance: none;
      border: 0;
      border-radius: 14px;
      background: transparent;
      color: var(--text);
      padding: 4px 10px;
      font: inherit;
      line-height: 1.18;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
    }
    .composer-menu-item-title {
      flex: 0 0 auto;
      max-width: 45%;
      font-size: 14px;
      font-weight: 760;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .composer-menu-item-desc {
      flex: 1 1 auto;
      min-width: 0;
      font-size: 12.5px;
      font-weight: 500;
      line-height: 1.16;
      color: rgba(255,255,255,.5);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .composer-menu-item:hover, .composer-menu-item:active { background: rgba(255,255,255,.055); }
    .composer-menu-item.is-active { background: rgba(255,255,255,.08); }
    .composer-menu-item.is-disabled { cursor: not-allowed; }
    .composer-menu-item.is-disabled .composer-menu-item-title { color: rgba(255,255,255,.34); }
    .composer-menu-item.is-disabled .composer-menu-item-desc { color: rgba(255,255,255,.26); }
    .composer-menu-empty,
    .composer-menu-loading {
      padding: 18px 12px;
      text-align: center;
      font-size: 12px;
      font-weight: 600;
      color: rgba(255,255,255,.6);
    }
    .theme-light .composer-menu-card { border-color: rgba(0,0,0,.10); background: rgba(252,252,253,.99); box-shadow: 0 18px 60px rgba(31,35,40,.20); }
    .theme-light .composer-menu-item-title { color: #1f2328; }
    .theme-light .composer-menu-item-desc { color: rgba(31,35,40,.55); }
    .theme-light .composer-menu-item:hover, .theme-light .composer-menu-item:active { background: rgba(0,0,0,.05); }
    .theme-light .composer-menu-item.is-active { background: rgba(0,0,0,.07); }
    .theme-light .composer-menu-item.is-disabled .composer-menu-item-title { color: rgba(31,35,40,.36); }
    .theme-light .composer-menu-group { color: rgba(31,35,40,.55); }
    .permission-menu-item.is-current::after { content: none; }
    .permission-menu-item-icon {
      width: 28px;
      height: 28px;
      flex: 0 0 auto;
      display: inline-grid;
      place-items: center;
      color: currentColor;
      opacity: .98;
    }
    .permission-menu-item-icon svg {
      width: 20px;
      height: 20px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2.15;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
      transform: translateZ(0);
    }
    .permission-menu-item-inner {
      min-width: 0;
      display: grid;
      gap: 3px;
    }
    .permission-menu-item-title {
      color: currentColor;
      font-size: 12.5px;
      font-weight: 820;
      line-height: 1.12;
    }
    .permission-menu-item-desc {
      color: rgba(244,244,245,.58);
      font-size: 10.5px;
      font-weight: 650;
      line-height: 1.22;
    }
    .permission-menu-current-dot {
      width: 7px;
      height: 7px;
      border-radius: 999px;
      justify-self: end;
      align-self: center;
      background: currentColor;
      border: 1px solid currentColor;
      box-shadow: none;
      opacity: .22;
      transform: translateX(-4px);
    }
    .permission-menu-item.is-current .permission-menu-current-dot {
      background: currentColor;
      border-color: currentColor;
      box-shadow: 0 0 12px currentColor;
      opacity: 1;
    }
    .reasoning-menu-item {
      width: 75px;
      justify-content: space-between;
      padding: 0 10px;
    }
    .reasoning-menu-item.mode-low {
      color: #9ecbff;
      border-color: rgba(158,203,255,.28);
      background: rgba(158,203,255,.10);
    }
    .reasoning-menu-item.mode-medium {
      color: var(--ok);
      border-color: rgba(142,240,183,.28);
      background: rgba(142,240,183,.11);
    }
    .reasoning-menu-item.mode-high {
      color: #ffd68a;
      border-color: rgba(255,214,138,.30);
      background: rgba(255,214,138,.12);
    }
    .reasoning-menu-item.mode-xhigh {
      color: #ff9a8d;
      border-color: rgba(255,154,141,.32);
      background: rgba(255,154,141,.12);
    }
    .reasoning-menu-item.mode-max {
      color: #ff7f66;
      border-color: rgba(255,127,102,.36);
      background: rgba(255,127,102,.14);
    }
    .reasoning-menu-item.is-current {
      box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 38%, transparent);
    }
    .reasoning-speed-divider {
      width: 75px;
      height: 1px;
      margin: 1px 0;
      border: 0;
      background: rgba(255,255,255,.12);
    }
    .reasoning-speed-toggle {
      width: 75px;
      justify-content: space-between;
      padding: 0 10px;
    }
    .reasoning-speed-toggle.mode-standard {
      color: #9ecbff;
      border-color: rgba(158,203,255,.28);
      background: rgba(158,203,255,.10);
    }
    .reasoning-speed-toggle.mode-fast {
      color: var(--ok);
      border-color: rgba(142,240,183,.32);
      background: rgba(142,240,183,.13);
    }
    .reasoning-speed-toggle.is-loading,
    .reasoning-speed-toggle.is-unsupported {
      color: var(--faint);
      border-color: rgba(255,255,255,.10);
      background: rgba(255,255,255,.04);
      justify-content: center;
      cursor: default;
      opacity: .72;
    }
    .reasoning-menu-item.mode-low.is-current {
      background: rgba(158,203,255,.18);
      border-color: rgba(158,203,255,.48);
    }
    .reasoning-menu-item.mode-medium.is-current {
      background: rgba(142,240,183,.18);
      border-color: rgba(142,240,183,.48);
    }
    .reasoning-menu-item.mode-high.is-current {
      background: rgba(255,214,138,.20);
      border-color: rgba(255,214,138,.50);
    }
    .reasoning-menu-item.mode-xhigh.is-current {
      background: rgba(255,154,141,.20);
      border-color: rgba(255,154,141,.50);
    }
    .reasoning-menu-item.mode-max.is-current {
      background: rgba(255,127,102,.22);
      border-color: rgba(255,127,102,.56);
    }
    .thread-button {
      min-width: 0;
      flex: 1 1 auto;
      overflow: hidden;
      appearance: none;
      border: 0;
      padding: 6px 7px;
      border-radius: 12px;
      background: transparent;
      color: var(--text);
      font: inherit;
      display: flex;
      align-items: center;
      gap: 7px;
      cursor: pointer;
      touch-action: manipulation;
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .thread-button:active { background: var(--panel); }
    .thread-current-pin {
      flex: 0 0 auto;
      width: 16px;
      height: 16px;
      display: none;
      color: #5eb4ff;
      transform: translateY(.25px);
    }
    body.thread-current-pinned .thread-current-pin { display: inline-grid; place-items: center; }
    .thread-current-pin svg {
      width: 16px;
      height: 16px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .thread-name {
      max-width: min(58vw, 560px);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .new-thread-btn {
      flex: 0 0 auto;
      width: var(--top-control-size);
      height: var(--top-control-size);
      appearance: none;
      border: 1px solid rgba(158,203,255,.25);
      border-radius: 999px;
      background: rgba(158,203,255,.10);
      color: #9ecbff;
      display: inline-grid;
      place-items: center;
      padding: 0;
      cursor: pointer;
      touch-action: manipulation;
    }
    .new-thread-btn:active {
      transform: scale(.94);
      background: rgba(158,203,255,.16);
    }
    .new-thread-btn svg {
      width: 15px;
      height: 15px;
      display: block;
      transform: none;
      stroke: currentColor;
      stroke-width: 2.35;
      stroke-linecap: round;
      vector-effect: non-scaling-stroke;
    }
    .new-thread-btn:disabled {
      opacity: .48;
      cursor: wait;
    }
    .new-thread-card {
      position: fixed;
      z-index: 124;
      display: none;
      width: min(352px, calc(100vw - 24px));
      max-height: min(620px, calc(100dvh - 24px));
      padding: 12px;
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 22px;
      background:
        linear-gradient(145deg, rgba(158,203,255,.055), transparent 38%),
        rgba(25,25,28,.985);
      box-shadow: 0 22px 72px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.045);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
      transform-origin: top right;
    }
    .new-thread-card.is-open {
      display: grid;
      gap: 10px;
      animation: newThreadCardIn .16s cubic-bezier(.22,.61,.36,1) both;
    }
    @keyframes newThreadCardIn {
      from { opacity: 0; transform: translateY(-4px) scale(.985); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }
    .new-thread-header {
      min-height: 34px;
      display: grid;
      grid-template-columns: 30px minmax(0, 1fr) 30px;
      align-items: center;
      gap: 7px;
      padding: 0 1px 2px;
    }
    .new-thread-heading {
      min-width: 0;
      display: grid;
      gap: 1px;
      text-align: center;
    }
    .new-thread-title {
      color: var(--text);
      font-size: 15px;
      font-weight: 820;
      line-height: 1.2;
      letter-spacing: -.02em;
    }
    .new-thread-kicker {
      color: var(--faint);
      font-size: 10.5px;
      font-weight: 650;
      line-height: 1.2;
    }
    .new-thread-back,
    .new-thread-close {
      width: 29px;
      height: 29px;
      display: inline-grid;
      place-items: center;
      appearance: none;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 999px;
      background: rgba(255,255,255,.052);
      color: var(--muted);
      padding: 0;
      font: inherit;
      cursor: pointer;
      touch-action: manipulation;
    }
    .new-thread-back[hidden] { visibility: hidden; display: inline-grid; }
    .new-thread-back svg,
    .new-thread-close svg {
      width: 15px;
      height: 15px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2.1;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .new-thread-back:active,
    .new-thread-close:active { transform: scale(.94); background: rgba(255,255,255,.085); }
    .new-thread-status {
      min-height: 36px;
      display: grid;
      grid-template-columns: 18px minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      padding: 8px 10px;
      border: 1px solid rgba(158,203,255,.16);
      border-radius: 14px;
      background: rgba(158,203,255,.075);
      color: rgba(210,230,255,.84);
      font-size: 11.5px;
      font-weight: 680;
      line-height: 1.3;
    }
    .new-thread-status[hidden] { display: none; }
    .new-thread-status.is-error {
      border-color: rgba(255,134,120,.25);
      background: rgba(255,112,96,.09);
      color: #ffb3a9;
    }
    .new-thread-status-icon {
      width: 18px;
      height: 18px;
      display: inline-grid;
      place-items: center;
      color: currentColor;
    }
    .new-thread-status-icon::before {
      content: "";
      width: 11px;
      height: 11px;
      border: 1.8px solid currentColor;
      border-right-color: transparent;
      border-radius: 999px;
      animation: newThreadSpin .72s linear infinite;
    }
    .new-thread-status.is-error .new-thread-status-icon::before {
      content: "!";
      width: 17px;
      height: 17px;
      border: 1px solid currentColor;
      border-radius: 999px;
      animation: none;
      font-size: 11px;
      font-weight: 850;
      line-height: 15px;
      text-align: center;
    }
    @keyframes newThreadSpin { to { transform: rotate(360deg); } }
    .new-thread-retry {
      min-height: 24px;
      appearance: none;
      border: 1px solid currentColor;
      border-radius: 999px;
      background: transparent;
      color: inherit;
      padding: 0 9px;
      font: inherit;
      font-size: 10.5px;
      font-weight: 780;
      cursor: pointer;
      touch-action: manipulation;
    }
    .new-thread-page { display: none; min-height: 0; }
    .new-thread-page.is-active { display: grid; gap: 10px; }
    .new-thread-page[data-new-thread-page="summary"].is-active {
      max-height: calc(100dvh - 92px);
      overflow-y: auto;
      overscroll-behavior: contain;
      scrollbar-width: none;
      padding: 1px;
    }
    .new-thread-page[data-new-thread-page="summary"]::-webkit-scrollbar { display: none; }
    .new-thread-settings {
      display: grid;
      gap: 8px;
    }
    .new-thread-row {
      width: 100%;
      min-height: 57px;
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr) auto;
      align-items: center;
      gap: 11px;
      appearance: none;
      border: 1px solid rgba(255,255,255,.055);
      border-radius: 17px;
      background: rgba(255,255,255,.047);
      color: inherit;
      padding: 9px 10px;
      font: inherit;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
      transition: background .14s ease, border-color .14s ease, transform .14s ease, opacity .14s ease;
    }
    .new-thread-row:active:not(:disabled) {
      transform: scale(.985);
      border-color: rgba(158,203,255,.14);
      background: rgba(158,203,255,.075);
    }
    .new-thread-row:disabled,
    .new-thread-row.is-disabled { cursor: default; opacity: .52; }
    .new-thread-row-icon,
    .new-thread-option-icon {
      width: 36px;
      height: 36px;
      display: inline-grid;
      place-items: center;
      border: 1px solid rgba(158,203,255,.16);
      border-radius: 13px;
      background: rgba(158,203,255,.10);
      color: #a9d2ff;
    }
    .new-thread-row[data-new-thread-picker="runtime"] .new-thread-row-icon,
    .new-thread-option[data-new-thread-kind="runtime"] .new-thread-option-icon {
      border-color: rgba(142,240,183,.17);
      background: rgba(142,240,183,.09);
      color: #9cefc0;
    }
    .new-thread-row[data-new-thread-picker="branch"] .new-thread-row-icon,
    .new-thread-option[data-new-thread-kind="branch"] .new-thread-option-icon {
      border-color: rgba(255,214,138,.18);
      background: rgba(255,214,138,.095);
      color: #ffdc99;
    }
    .new-thread-row-icon svg,
    .new-thread-option-icon svg {
      width: 18px;
      height: 18px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .new-thread-row-copy,
    .new-thread-option-copy {
      min-width: 0;
      display: grid;
      gap: 3px;
    }
    .new-thread-row-label {
      color: var(--faint);
      font-size: 10.5px;
      font-weight: 760;
      line-height: 1;
    }
    .new-thread-row-value,
    .new-thread-option-title {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: var(--text);
      font-size: 13.5px;
      font-weight: 780;
      line-height: 1.2;
    }
    .new-thread-row-trailing {
      min-width: 22px;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 6px;
      color: var(--faint);
    }
    .new-thread-chevron {
      font-size: 22px;
      font-weight: 620;
      line-height: 1;
      transform: translateY(-1px);
    }
    .new-thread-context {
      min-width: 0;
      margin: -1px 4px 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: var(--faint);
      font-size: 10.5px;
      font-weight: 620;
      line-height: 1.25;
    }
    .new-thread-hint {
      padding: 0 4px;
      color: var(--faint);
      font-size: 10.5px;
      font-weight: 620;
      line-height: 1.35;
    }
    .new-thread-actions {
      display: grid;
      grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
      gap: 8px;
      padding-top: 1px;
    }
    .new-thread-action {
      min-height: 38px;
      appearance: none;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 14px;
      background: rgba(255,255,255,.055);
      color: var(--muted);
      padding: 0 12px;
      font: inherit;
      font-size: 12.5px;
      font-weight: 790;
      cursor: pointer;
      touch-action: manipulation;
    }
    .new-thread-action.primary {
      border-color: rgba(158,203,255,.34);
      background: linear-gradient(135deg, rgba(92,160,255,.26), rgba(108,209,255,.17));
      color: #d7eaff;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
    }
    .new-thread-action:active:not(:disabled) { transform: scale(.98); }
    .new-thread-action:disabled { opacity: .48; cursor: wait; }
    .new-thread-options {
      min-height: 92px;
      max-height: min(410px, 56dvh);
      display: grid;
      align-content: start;
      gap: 7px;
      overflow-y: auto;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,.22) transparent;
      padding: 1px;
    }
    .new-thread-option {
      width: 100%;
      min-height: 55px;
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr) 20px;
      align-items: center;
      gap: 11px;
      appearance: none;
      border: 1px solid rgba(255,255,255,.055);
      border-radius: 16px;
      background: rgba(255,255,255,.04);
      color: inherit;
      padding: 8px 10px;
      font: inherit;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
    }
    .new-thread-option:active { transform: scale(.988); background: rgba(255,255,255,.07); }
    .new-thread-option.is-current {
      border-color: rgba(158,203,255,.23);
      background: rgba(158,203,255,.085);
    }
    .new-thread-option-desc {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: var(--faint);
      font-size: 10.5px;
      font-weight: 620;
      line-height: 1.2;
    }
    .new-thread-option-check {
      width: 18px;
      height: 18px;
      display: inline-grid;
      place-items: center;
      justify-self: end;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 999px;
      color: transparent;
    }
    .new-thread-option.is-current .new-thread-option-check {
      border-color: rgba(158,203,255,.56);
      background: #9ecbff;
      color: #10243a;
    }
    .new-thread-option-check svg {
      width: 11px;
      height: 11px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2.7;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .new-thread-option-badge {
      display: inline-block;
      margin-left: 6px;
      padding: 2px 6px;
      border: 1px solid rgba(255,214,138,.22);
      border-radius: 999px;
      background: rgba(255,214,138,.09);
      color: #e9c67c;
      font-size: 9px;
      font-weight: 800;
      line-height: 1;
      vertical-align: 1px;
    }
    .new-thread-empty {
      min-height: 112px;
      display: grid;
      place-items: center;
      align-content: center;
      gap: 6px;
      padding: 18px;
      border: 1px dashed rgba(255,255,255,.10);
      border-radius: 17px;
      color: var(--faint);
      text-align: center;
    }
    .new-thread-empty strong { color: var(--muted); font-size: 12.5px; }
    .new-thread-empty span { font-size: 10.5px; line-height: 1.35; }
    .new-thread-worktree-confirm-modal {
      position: fixed;
      inset: 0;
      z-index: 240;
      display: none;
      place-items: center;
      padding: calc(env(safe-area-inset-top) + 18px) 18px calc(env(safe-area-inset-bottom) + 18px);
      background: rgba(5,7,10,.42);
      -webkit-backdrop-filter: blur(18px) saturate(1.15);
      backdrop-filter: blur(18px) saturate(1.15);
    }
    .new-thread-worktree-confirm-modal.is-open { display: grid; }
    .new-thread-worktree-confirm-card {
      width: min(344px, calc(100vw - 24px));
      display: grid;
      gap: 15px;
      padding: 19px 18px 18px;
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 22px;
      background: linear-gradient(180deg, rgba(34,37,44,.94), rgba(22,24,30,.92));
      box-shadow: 0 24px 70px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
      -webkit-backdrop-filter: blur(30px) saturate(1.24);
      backdrop-filter: blur(30px) saturate(1.24);
      color: var(--text);
    }
    .new-thread-worktree-confirm-title {
      font-size: 15.5px;
      font-weight: 760;
      line-height: 1.45;
      text-align: center;
    }
    .new-thread-worktree-confirm-body {
      color: var(--muted);
      font-size: 12.5px;
      line-height: 1.55;
      text-align: center;
      text-wrap: balance;
    }
    .new-thread-worktree-confirm-actions {
      display: grid;
      grid-template-columns: .82fr 1.18fr;
      gap: 9px;
      margin-top: 1px;
    }
    .new-thread-worktree-confirm-actions .settings-action-button {
      min-width: 0;
      min-height: 42px;
      padding-inline: 10px;
      white-space: nowrap;
    }
    .new-thread-worktree-confirm-actions .settings-action-button:active { transform: scale(.97); }
    @media (max-width: 360px) {
      .new-thread-card { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); padding: 10px; border-radius: 20px; }
      .new-thread-row { min-height: 53px; grid-template-columns: 33px minmax(0, 1fr) auto; gap: 9px; padding: 8px 9px; }
      .new-thread-row-icon,
      .new-thread-option-icon { width: 33px; height: 33px; border-radius: 12px; }
      .new-thread-option { grid-template-columns: 33px minmax(0, 1fr) 18px; gap: 9px; padding: 8px 9px; }
      .new-thread-row-value,
      .new-thread-option-title { font-size: 13px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .new-thread-card.is-open,
      .new-thread-status-icon::before { animation: none; }
      .new-thread-row,
      .new-thread-action { transition: none; }
    }
    .settings-btn {
      flex: 0 0 auto;
      width: var(--top-control-size);
      min-width: var(--top-control-size);
      height: var(--top-control-size);
      appearance: none;
      border: 1px solid rgba(185,196,211,.20);
      border-radius: 999px;
      background: rgba(185,196,211,.075);
      color: rgba(232,238,247,.70);
      display: inline-grid;
      place-items: center;
      padding: 0;
      font: inherit;
      line-height: 1;
      cursor: pointer;
      touch-action: manipulation;
    }
    .settings-btn:active {
      transform: scale(.94);
      background: rgba(185,196,211,.13);
    }
    .settings-btn svg {
      width: 14px;
      height: 14px;
      display: block;
      transform: translate(.25px, .45px);
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .keep-awake-btn {
      display: none;
      flex: 0 0 auto;
      width: var(--top-control-size);
      min-width: var(--top-control-size);
      height: var(--top-control-size);
      appearance: none;
      border: 1px solid rgba(185,196,211,.20);
      border-radius: 999px;
      background: rgba(185,196,211,.075);
      color: rgba(185,196,211,.62);
      place-items: center;
      padding: 0;
      cursor: pointer;
      touch-action: manipulation;
    }
    body.beta-mode .keep-awake-btn { display: none; }
    .keep-awake-btn.is-on {
      color: #ffe68a;
      border-color: rgba(255,230,138,.38);
      background: rgba(255,230,138,.16);
      box-shadow: 0 0 18px rgba(255,214,138,.18);
    }
    .keep-awake-btn.is-busy {
      opacity: .58;
      cursor: wait;
    }
    .keep-awake-btn:active:not(:disabled) {
      transform: scale(.94);
      background: rgba(185,196,211,.13);
    }
    .keep-awake-btn.is-on:active:not(:disabled) {
      background: rgba(255,230,138,.18);
    }
    .keep-awake-btn svg {
      width: 15px;
      height: 15px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .top-actions {
      flex: 0 1 min(46vw, 340px);
      width: min(46vw, 340px);
      max-width: calc(100vw - 148px);
      height: calc(var(--top-control-size) + 8px);
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      padding: 4px 5px 4px 0;
      margin: -4px -5px -4px 0;
      overflow-x: auto;
      overflow-y: hidden;
      overscroll-behavior-x: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      touch-action: pan-x;
      contain: layout paint;
      will-change: scroll-position;
      transform: translateZ(0);
      -webkit-transform: translateZ(0);
    }
    .top-actions::-webkit-scrollbar { display: none; }
    .top-actions > * { touch-action: pan-x; }
    .top-actions.is-fit { justify-content: flex-end; }
    .top-actions > .is-hidden-by-settings,
    .top-actions > [hidden] { display: none !important; }
    .settings-card {
      position: fixed;
      z-index: 122;
      display: none;
      width: min(344px, calc(100vw - 24px));
      padding: 12px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 22px;
      background: rgba(27,27,30,.98);
      box-shadow: 0 20px 70px rgba(0,0,0,.56);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .settings-card.is-open { display: grid; gap: 10px; }
    .settings-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      min-height: 31px;
      padding: 2px 2px 4px;
      color: var(--text);
      font-size: 15px;
      font-weight: 800;
      letter-spacing: -.02em;
    }
    .settings-title-main {
      flex: 1 1 auto;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .settings-back {
      flex: 0 0 auto;
      width: 27px;
      height: 27px;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 999px;
      background: rgba(255,255,255,.055);
      color: var(--text);
      font: inherit;
      font-size: 18px;
      line-height: 1;
      display: inline-grid;
      place-items: center;
      padding: 0 1px 2px 0;
      cursor: pointer;
      touch-action: manipulation;
    }
    .settings-back[hidden] { display: none; }
    .settings-back:active { transform: scale(.95); }
    .settings-page { display: none; }
    .settings-page.is-active { display: grid; gap: 10px; }
    .settings-nav-row {
      min-height: 50px;
      width: 100%;
      display: grid;
      grid-template-columns: 34px minmax(0, 1fr) auto;
      align-items: center;
      gap: 12px;
      padding: 9px 10px;
      border: 0;
      border-radius: 17px;
      background: rgba(255,255,255,.045);
      color: inherit;
      font: inherit;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
    }
    .settings-nav-row[hidden] { display: none; }
    .settings-nav-row:active { transform: scale(.985); background: rgba(255,255,255,.065); }
    .settings-nav-icon {
      --settings-icon-color: rgba(178,225,255,.92);
      --settings-icon-bg: rgba(142,203,255,.11);
      --settings-icon-border: rgba(142,203,255,.14);
      --settings-icon-bg-light: rgba(31,111,208,.09);
      --settings-icon-border-light: rgba(31,111,208,.13);
      --settings-icon-shadow: inset 0 1px 0 rgba(255,255,255,.08);
      width: 34px;
      height: 34px;
      display: inline-grid;
      place-items: center;
      border-radius: 13px;
      color: var(--settings-icon-color);
      background: var(--settings-icon-bg);
      border: 1px solid var(--settings-icon-border);
      box-shadow: var(--settings-icon-shadow);
    }
    .settings-nav-icon.is-status {
      --settings-icon-color: rgba(126,205,255,.95);
      --settings-icon-bg: rgba(60,153,255,.14);
      --settings-icon-border: rgba(102,190,255,.18);
      --settings-icon-bg-light: rgba(31,111,208,.10);
      --settings-icon-border-light: rgba(31,111,208,.15);
    }
    .settings-nav-icon.is-appearance {
      --settings-icon-color: rgba(255,190,104,.95);
      --settings-icon-bg: rgba(255,176,73,.13);
      --settings-icon-border: rgba(255,195,111,.18);
      --settings-icon-bg-light: rgba(205,124,21,.10);
      --settings-icon-border-light: rgba(205,124,21,.14);
    }
    .settings-nav-icon.is-security {
      --settings-icon-color: rgba(111,222,162,.94);
      --settings-icon-bg: rgba(65,201,125,.13);
      --settings-icon-border: rgba(116,222,165,.18);
      --settings-icon-bg-light: rgba(23,122,76,.10);
      --settings-icon-border-light: rgba(23,122,76,.14);
    }
    .settings-nav-icon.is-guardian {
      --settings-icon-color: rgba(157,214,255,.95);
      --settings-icon-bg: rgba(92,128,255,.13);
      --settings-icon-border: rgba(139,168,255,.18);
      --settings-icon-bg-light: rgba(74,102,202,.10);
      --settings-icon-border-light: rgba(74,102,202,.14);
    }
    .settings-nav-icon.is-feedback {
      --settings-icon-color: rgba(255,145,132,.95);
      --settings-icon-bg: rgba(255,119,103,.12);
      --settings-icon-border: rgba(255,151,137,.18);
      --settings-icon-bg-light: rgba(190,70,58,.10);
      --settings-icon-border-light: rgba(190,70,58,.14);
    }
    .settings-nav-icon svg {
      width: 18px;
      height: 18px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
      transform: translateZ(0);
    }
    .settings-subtitle {
      margin-top: 3px;
      color: var(--faint);
      font-size: 11px;
      font-weight: 650;
      line-height: 1.25;
    }
    .settings-chevron {
      color: var(--faint);
      font-size: 22px;
      font-weight: 650;
      line-height: 1;
      display: inline-block;
      transform: translate(-4px, -1px);
    }
    .settings-hint {
      padding: 0 4px 1px;
      color: var(--faint);
      font-size: 11.5px;
      font-weight: 650;
      line-height: 1.35;
    }
    .settings-pro-pill {
      flex: 0 0 auto;
      height: 23px;
      min-width: 50px;
      padding: 0 9px;
      display: inline-grid;
      place-items: center;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.11);
      background: rgba(255,255,255,.055);
      color: var(--muted);
      font-size: 11px;
      font-weight: 760;
    }
    .settings-pro-pill.is-on {
      color: var(--ok);
      border-color: rgba(142,240,183,.28);
      background: rgba(142,240,183,.11);
    }
    .settings-pro-pill.is-max {
      position: relative;
      min-width: 58px;
      overflow: hidden;
      color: #3a2600;
      border-color: rgba(255,225,132,.72);
      background: linear-gradient(105deg, rgba(255,189,46,.95), rgba(255,244,169,.98), rgba(255,176,42,.94), rgba(255,236,137,.98));
      background-size: 260% 100%;
      box-shadow: 0 0 18px rgba(255,201,72,.22), inset 0 1px 0 rgba(255,255,255,.58);
      animation: maxGoldFlow 3.8s linear infinite;
    }
    .settings-pro-pill.is-max::after {
      content: "";
      position: absolute;
      inset: 1px 40% 1px -35%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent);
      transform: skewX(-18deg);
      animation: maxGoldSheen 2.6s ease-in-out infinite;
      pointer-events: none;
    }
    @keyframes maxGoldFlow {
      0% { background-position: 0% 50%; }
      100% { background-position: 260% 50%; }
    }
    @keyframes maxGoldSheen {
      0%, 22% { transform: translateX(-80%) skewX(-18deg); opacity: 0; }
      36% { opacity: .75; }
      60%, 100% { transform: translateX(220%) skewX(-18deg); opacity: 0; }
    }
    .settings-label-line {
      display: flex;
      align-items: center;
      gap: 7px;
      min-width: 0;
    }
    .settings-entitlement-chip {
      flex: 0 0 auto;
      padding: 2px 7px;
      border-radius: 999px;
      border: 1px solid rgba(255,218,115,.42);
      background: rgba(255,204,86,.13);
      color: #ffd56f;
      font-size: 10px;
      font-weight: 850;
      line-height: 1.1;
      letter-spacing: -.01em;
    }
    .settings-row {
      min-height: 48px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 12px;
      padding: 9px 10px;
      border-radius: 16px;
      background: rgba(255,255,255,.045);
    }
    .settings-row.is-disabled { opacity: .52; }
    .settings-row.is-super-active {
      border: 1px solid rgba(142,203,255,.28);
      background: linear-gradient(92deg, rgba(74,144,255,.16), rgba(45,217,158,.12));
      box-shadow: 0 0 18px rgba(74,144,255,.10), inset 0 1px 0 rgba(255,255,255,.08);
    }
    .settings-row.is-super-active .settings-label {
      color: rgba(220,242,255,.98);
      text-shadow: 0 0 10px rgba(83,177,255,.32);
    }
    .settings-row-text { min-width: 0; }
    .settings-nav-row .settings-row-text {
      display: grid;
      gap: 1px;
    }
    .settings-nav-row .settings-label,
    .settings-nav-row .settings-subtitle {
      display: block;
    }
    .settings-label {
      color: var(--text);
      font-size: 13px;
      font-weight: 760;
      line-height: 1.25;
    }
    .settings-nav-row .settings-label {
      font-size: 15px;
      line-height: 1.18;
    }
    .settings-switch {
      position: relative;
      width: 48px;
      height: 29px;
      border: 0;
      border-radius: 999px;
      background: rgba(113,113,122,.38);
      padding: 0;
      cursor: pointer;
      touch-action: manipulation;
      appearance: none;
      transition: background .18s ease, opacity .18s ease;
    }
    .settings-switch::after {
      content: "";
      position: absolute;
      top: 3px;
      left: 3px;
      width: 23px;
      height: 23px;
      border-radius: 999px;
      background: rgba(255,255,255,.94);
      box-shadow: 0 2px 8px rgba(0,0,0,.28);
      transition: transform .18s cubic-bezier(.22,.61,.36,1);
    }
    .settings-switch.is-on {
      background: linear-gradient(92deg, rgba(158,203,255,.86), rgba(142,240,183,.78), rgba(255,214,138,.78));
    }
    .settings-switch.is-on::after { transform: translateX(19px); }
    .settings-switch:disabled {
      cursor: not-allowed;
      opacity: .58;
      background: rgba(113,113,122,.28);
    }
    .settings-section-title {
      padding: 2px 4px 0;
      color: rgba(255,255,255,.62);
      font-size: 11px;
      font-weight: 820;
      letter-spacing: 0;
    }
    .device-subsettings {
      display: grid;
      gap: 9px;
    }
    .device-subsettings[hidden] { display: none; }
    .guardian-advanced-toggle {
      min-height: 46px;
      width: 100%;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 12px;
      padding: 9px 10px;
      border: 0;
      border-radius: 16px;
      background: rgba(255,255,255,.045);
      color: inherit;
      font: inherit;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
    }
    .guardian-advanced-toggle:active {
      transform: scale(.985);
      background: rgba(255,255,255,.065);
    }
    .guardian-advanced-toggle .settings-chevron {
      font-size: 18px;
      transition: transform .16s ease;
    }
    .guardian-advanced-toggle .settings-row-text {
      display: grid;
      gap: 1px;
    }
    .guardian-advanced-toggle .settings-label,
    .guardian-advanced-toggle .settings-subtitle {
      display: block;
    }
    .guardian-advanced-toggle.is-open .settings-chevron {
      transform: translate(-4px, -1px) rotate(90deg);
    }
    .settings-slider-card {
      display: grid;
      gap: 8px;
      padding: 10px;
      border-radius: 14px;
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.045);
    }
    .settings-slider-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      color: rgba(255,255,255,.62);
      font-size: 11px;
      font-weight: 760;
      line-height: 1.25;
    }
    .settings-slider-head strong {
      flex: 0 0 auto;
      color: rgba(142,240,183,.90);
      font-size: 12px;
      font-weight: 820;
    }
    .settings-range {
      position: relative;
      width: 100%;
      height: 28px;
      margin: 0;
      padding: 0;
      cursor: pointer;
      touch-action: none;
      user-select: none;
      -webkit-user-select: none;
      --range-fill-width: 0%;
    }
    .settings-range-track {
      position: absolute;
      left: 0;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      height: 7px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.08);
    }
    .settings-range-fill {
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: var(--range-fill-width);
      border-radius: 999px;
      background: linear-gradient(92deg, rgba(158,203,255,.82), rgba(142,240,183,.72), rgba(255,214,138,.62));
      transition: width .12s ease;
    }
    .settings-range-thumb {
      position: absolute;
      top: 50%;
      width: 24px;
      height: 24px;
      border: 1px solid rgba(255,255,255,.52);
      border-radius: 999px;
      background: rgba(255,255,255,.96);
      box-shadow: 0 3px 10px rgba(0,0,0,.28);
      transform: translate(-50%, -50%);
      transition: transform .16s ease, box-shadow .16s ease, left .12s ease;
    }
    .settings-range.is-dragging .settings-range-thumb {
      transform: translate(-50%, -50%) scale(1.08);
      box-shadow: 0 4px 14px rgba(142,240,183,.24), 0 3px 10px rgba(0,0,0,.30);
    }
    .settings-range.is-dragging .settings-range-fill,
    .settings-range.is-layouting .settings-range-fill {
      transition: none;
    }
    .settings-range.is-dragging .settings-range-thumb,
    .settings-range.is-layouting .settings-range-thumb {
      transition: transform .16s ease, box-shadow .16s ease;
    }
    .settings-range:disabled,
    .settings-range.is-disabled {
      cursor: not-allowed;
      opacity: .46;
    }
    .settings-range-labels {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 4px;
      color: rgba(255,255,255,.42);
      font-size: 9.5px;
      font-weight: 720;
      line-height: 1.1;
      text-align: center;
    }
    .settings-range-label {
      text-align: center;
    }
    .guardian-status-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 7px;
    }
    .guardian-status-pill {
      min-width: 0;
      padding: 8px 8px;
      border-radius: 13px;
      background: rgba(255,255,255,.045);
      border: 1px solid rgba(255,255,255,.08);
    }
    .guardian-status-pill strong,
    .guardian-status-pill span {
      display: block;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }
    .guardian-status-pill strong {
      color: rgba(255,255,255,.48);
      font-size: 9.5px;
      font-weight: 760;
      margin-bottom: 4px;
    }
    .guardian-status-pill span {
      color: rgba(255,255,255,.78);
      font-size: 11px;
      font-weight: 780;
    }
    /* 超级守护：只保留一个主按钮；激活后按钮切为退出并显示状态胶囊 */
    .super-guardian-block {
      display: grid;
      gap: 9px;
      padding: 4px 0 2px;
    }
    .super-guardian-actions {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
    }
    .super-guardian-actions .settings-action-button {
      width: 100%;
      min-height: 40px;
      font-size: 13px;
    }
    .settings-action-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }
    .settings-action-row.single { grid-template-columns: 1fr; }
    .settings-row > .settings-action-row {
      min-width: min(210px, 48vw);
      grid-template-columns: minmax(126px, 1fr) minmax(52px, .45fr);
    }
    .settings-row > .settings-action-row .settings-action-button {
      min-height: 34px;
      padding: 0 10px;
      white-space: nowrap;
    }
    .guardian-info-modal {
      position: fixed;
      inset: 0;
      z-index: 90;
      display: none;
      place-items: center;
      padding: calc(env(safe-area-inset-top) + 18px) 18px calc(env(safe-area-inset-bottom) + 18px);
      background: rgba(0,0,0,.55);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .guardian-info-modal.is-open { display: grid; }
    .guardian-info-card {
      width: min(360px, 100%);
      display: grid;
      gap: 12px;
      padding: 16px;
      border-radius: 20px;
      border: 1px solid rgba(255,255,255,.12);
      background: rgba(23,23,25,.96);
      box-shadow: 0 18px 60px rgba(0,0,0,.42);
      color: var(--text);
    }
    .guardian-info-title {
      font-size: 16px;
      font-weight: 840;
      line-height: 1.25;
    }
    .guardian-info-body {
      color: rgba(255,255,255,.70);
      font-size: 12.5px;
      font-weight: 650;
      line-height: 1.55;
    }
    .guardian-info-actions {
      display: grid;
      grid-template-columns: 1fr 1.35fr;
      gap: 8px;
      padding-top: 2px;
    }
    .settings-action-button {
      min-height: 36px;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 13px;
      background: rgba(255,255,255,.06);
      color: rgba(255,255,255,.78);
      font: inherit;
      font-size: 12px;
      font-weight: 780;
      cursor: pointer;
      touch-action: manipulation;
      transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, opacity .18s ease;
    }
    .settings-action-button.primary {
      color: rgba(8,16,20,.92);
      background: linear-gradient(92deg, rgba(158,203,255,.90), rgba(142,240,183,.82));
      border-color: rgba(255,255,255,.30);
    }
    .settings-action-button.is-active {
      color: rgba(5,18,24,.96);
      background: linear-gradient(92deg, rgba(94,178,255,.96), rgba(83,235,179,.90));
      border-color: rgba(206,244,255,.58);
      box-shadow: 0 0 18px rgba(83,177,255,.20), 0 0 22px rgba(83,235,179,.12);
    }
    .settings-action-button.is-busy {
      color: rgba(230,245,255,.94);
      background: rgba(94,178,255,.18);
      border-color: rgba(158,203,255,.34);
    }
    .settings-action-button.danger {
      color: rgba(255,176,176,.90);
      background: rgba(255,95,95,.10);
      border-color: rgba(255,95,95,.20);
    }
    .settings-action-button:disabled {
      cursor: not-allowed;
      opacity: .46;
    }
    .settings-action-button.is-active:disabled {
      opacity: 1;
    }
    .settings-input {
      width: 100%;
      min-height: 42px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 15px;
      padding: 0 12px;
      background: rgba(0,0,0,.24);
      color: var(--text);
      font: inherit;
      font-size: 15px;
      outline: none;
      -webkit-user-select: text;
      user-select: text;
      -webkit-touch-callout: default;
    }
    .settings-input:focus {
      border-color: rgba(94,180,255,.52);
      box-shadow: 0 0 0 3px rgba(94,180,255,.12);
    }
    .settings-input::placeholder { color: var(--faint); }
    .notification-guide {
      display: grid;
      gap: 7px;
      padding: 10px 11px;
      border-radius: 16px;
      background: rgba(255,255,255,.04);
      color: var(--muted);
      font-size: 11.5px;
      font-weight: 650;
      line-height: 1.45;
    }
    .notification-guide strong { color: var(--text); font-size: 12.5px; }
    .notification-guide-step { display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 7px; }
    .notification-guide-step > span:last-child { min-width: 0; display: flex; align-items: center; }
    .notification-guide-step > span:first-child {
      width: 18px;
      height: 18px;
      display: inline-grid;
      place-items: center;
      border-radius: 999px;
      background: rgba(142,203,255,.13);
      color: rgba(188,225,255,.96);
      font-size: 10px;
      font-weight: 850;
    }
    .notification-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .notification-actions .primary { grid-column: 1 / -1; }
    .notification-status-card {
      display: grid;
      gap: 7px;
      padding: 10px 11px;
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 15px;
      background: rgba(255,255,255,.035);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
      transition: border-color .18s ease, background .18s ease;
    }
    .notification-status-card.is-ready {
      border-color: rgba(83,235,179,.18);
      background: linear-gradient(105deg, rgba(83,235,179,.075), rgba(94,178,255,.035));
    }
    .notification-status-card.is-error {
      border-color: rgba(255,106,106,.20);
      background: rgba(255,95,95,.055);
    }
    .notification-status {
      min-height: 17px;
      display: grid;
      grid-template-columns: 14px minmax(0, 1fr);
      align-items: start;
      gap: 7px;
      color: var(--muted);
      font-size: 11.5px;
      font-weight: 760;
      line-height: 1.45;
    }
    .notification-status::before {
      content: '';
      flex: 0 0 auto;
      width: 7px;
      height: 7px;
      margin-top: 4.5px;
      justify-self: center;
      border-radius: 999px;
      background: currentColor;
      opacity: .72;
    }
    .notification-status.is-ready { color: #72e9ae; }
    .notification-status.is-ready::before { box-shadow: 0 0 0 3px rgba(83,235,179,.10), 0 0 9px rgba(83,235,179,.35); opacity: 1; }
    .notification-status.is-error { color: #ff9d9d; }
    .notification-privacy-note {
      display: grid;
      grid-template-columns: 14px minmax(0, 1fr);
      align-items: start;
      gap: 7px;
      color: rgba(255,255,255,.48);
      font-size: 10.5px;
      font-weight: 650;
      line-height: 1.4;
    }
    .notification-privacy-note svg {
      width: 13px;
      height: 13px;
      margin-top: 1px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
      justify-self: center;
    }
    /* 本机密码（二次验证）设置区 */
    .security-form { display: grid; gap: 8px; }
    .security-form[hidden] { display: none; }
    .security-actions { display: flex; gap: 8px; }
    .security-btn {
      flex: 1;
      min-height: 42px;
      border-radius: 14px;
      border: 1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.06);
      color: var(--text);
      font: inherit;
      font-size: 14px;
      font-weight: 640;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
    }
    .security-btn:active { transform: scale(.97); }
    .security-btn:disabled { opacity: .5; }
    .security-btn.primary { border-color: rgba(94,180,255,.55); background: rgba(94,180,255,.16); color: #cfe8ff; }
    .security-btn.danger { border-color: rgba(255,138,128,.5); background: rgba(255,107,90,.14); color: #ffb9ad; }
    .security-msg { font-size: 12px; font-weight: 560; min-height: 16px; color: var(--faint); }
    .security-msg.is-error { color: #ff9b8c; }
    .security-msg.is-ok { color: #58d39a; }
    /* 解锁锁屏：开启本机密码后，进入网址先输密码这一道 */
    .lock-screen {
      position: fixed;
      inset: 0;
      z-index: 4000;
      display: flex;
      align-items: flex-start;
      justify-content: center;
      padding: calc(env(safe-area-inset-top) + var(--lock-card-top)) 24px 24px;
      background: rgba(8,8,10,.92);
      -webkit-backdrop-filter: blur(18px);
      backdrop-filter: blur(18px);
    }
    .lock-screen[hidden] { display: none; }
    .lock-card {
      width: 100%;
      max-width: 340px;
      display: grid;
      gap: 12px;
      padding: 26px 22px 22px;
      border-radius: 22px;
      border: 1px solid rgba(255,255,255,.12);
      background: var(--panel);
      box-shadow: 0 30px 90px rgba(0,0,0,.6);
      text-align: center;
    }
    .lock-icon { font-size: 34px; line-height: 1; }
    .lock-title { font-size: 19px; font-weight: 760; color: var(--text); }
    .lock-sub { font-size: 13px; font-weight: 520; color: var(--faint); line-height: 1.5; }
    .lock-input {
      width: 100%;
      min-height: 48px;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 15px;
      padding: 0 14px;
      background: rgba(0,0,0,.3);
      color: var(--text);
      font: inherit;
      font-size: 16px;
      text-align: center;
      outline: none;
    }
    .lock-input:focus { border-color: rgba(94,180,255,.55); box-shadow: 0 0 0 3px rgba(94,180,255,.14); }
    .lock-btn {
      width: 100%;
      min-height: 48px;
      border-radius: 15px;
      border: 1px solid rgba(94,180,255,.55);
      background: rgba(94,180,255,.18);
      color: #cfe8ff;
      font: inherit;
      font-size: 16px;
      font-weight: 680;
      cursor: pointer;
    }
    .lock-btn:active { transform: scale(.98); }
    .lock-btn:disabled { opacity: .55; }
    .lock-msg { font-size: 13px; font-weight: 560; min-height: 18px; color: #ff9b8c; }
    .lock-msg:empty {
      display: none;
      min-height: 0;
    }
    .top-control-settings-list {
      display: grid;
      gap: 8px;
    }
    .top-control-settings-list.is-reordering {
      user-select: none;
      -webkit-user-select: none;
    }
    .top-control-setting {
      min-height: 54px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      padding: 9px 10px;
      border-radius: 17px;
      background: rgba(255,255,255,.045);
      transition: background .16s ease, box-shadow .16s ease, opacity .16s ease;
      transform: translate3d(0, var(--drag-y, 0px), 0);
    }
    .top-control-setting.is-dragging {
      z-index: 2;
      opacity: .94;
      background: rgba(255,255,255,.075);
      box-shadow: 0 12px 28px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08);
    }
    .top-control-actions {
      display: flex;
      align-items: center;
      gap: 7px;
    }
    .top-control-drag-handle {
      width: 28px;
      height: 28px;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 999px;
      background: rgba(255,255,255,.055);
      color: var(--text);
      font: inherit;
      font-size: 13px;
      font-weight: 850;
      display: inline-grid;
      place-items: center;
      padding: 0;
      cursor: pointer;
      touch-action: none;
    }
    .top-control-drag-handle svg {
      width: 15px;
      height: 15px;
      display: block;
      fill: currentColor;
      opacity: .82;
    }
    .top-control-drag-handle:active,
    .top-control-setting.is-dragging .top-control-drag-handle {
      transform: scale(.94);
      cursor: grabbing;
    }
    .approval-sheet {
      position: fixed;
      left: var(--thread-menu-edge-gap);
      right: var(--thread-menu-edge-gap);
      top: calc(max(0px, calc(env(safe-area-inset-top) - var(--topbar-safe-lift))) + var(--topbar-row-height) + var(--thread-menu-edge-gap));
      z-index: 135;
      display: none;
      width: min(520px, calc(100vw - (var(--thread-menu-edge-gap) * 2)));
      margin: 0 auto;
      padding: 10px;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 23px;
      background: rgba(24,24,27,.98);
      box-shadow: 0 18px 54px rgba(0,0,0,.56);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .approval-sheet.is-open { display: grid; gap: 8px; }
    .approval-title,
    .approval-source { display: none; }
    .approval-content {
      white-space: normal;
      color: rgba(244,244,245,.92);
      padding: 3px 4px 5px;
      font-size: 15px;
      line-height: 1.42;
      font-weight: 780;
      -webkit-user-select: text;
      user-select: text;
      -webkit-touch-callout: default;
    }
    .approval-input {
      width: 100%;
      min-height: 86px;
      border: 1px solid rgba(158,203,255,.28);
      border-radius: 16px;
      padding: 11px 12px;
      background: rgba(0,0,0,.24);
      color: var(--text);
      font: inherit;
      font-size: 16px;
      line-height: 1.42;
      outline: none;
      resize: vertical;
      -webkit-user-select: text;
      user-select: text;
      -webkit-touch-callout: default;
    }
    .approval-input:focus {
      border-color: rgba(94,180,255,.62);
      box-shadow: 0 0 0 3px rgba(94,180,255,.13);
    }
    .approval-actions {
      display: grid;
      grid-template-columns: 1fr;
      gap: 7px;
    }
    .approval-action {
      min-height: 43px;
      appearance: none;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 16px;
      padding: 12px 14px;
      background: rgba(255,255,255,.055);
      color: var(--text);
      font: inherit;
      font-size: 15px;
      line-height: 1.32;
      font-weight: 820;
      cursor: pointer;
      touch-action: manipulation;
    }
    .approval-action.allow {
      order: 1;
      color: var(--ok);
      border-color: rgba(142,240,183,.26);
      background: rgba(142,240,183,.11);
    }
    .approval-action.submit {
      order: 2;
      color: #9ecbff;
      border-color: rgba(158,203,255,.25);
      background: rgba(158,203,255,.10);
    }
    .approval-action.deny {
      order: 3;
      color: #ffb0a7;
      border-color: rgba(255,154,141,.25);
      background: rgba(255,154,141,.09);
    }
    .approval-sheet[data-adjusting="1"] .approval-action.submit {
      color: #d5e9ff;
      border-color: rgba(158,203,255,.34);
      background: rgba(158,203,255,.14);
    }
    .approval-action:disabled {
      opacity: .55;
      cursor: wait;
    }
    .approval-action:active:not(:disabled) { transform: scale(.98); }
    .thread-menu-scrim {
      position: fixed;
      left: 0;
      right: 0;
      top: calc(max(0px, calc(env(safe-area-inset-top) - var(--topbar-safe-lift))) + var(--topbar-row-height));
      bottom: 0;
      z-index: 19;
      display: none;
      background: var(--bg);
      pointer-events: none;
    }
    body:has(.thread-menu.is-open) .thread-menu-scrim { display: block; }
    .thread-menu {
      position: fixed;
      left: var(--thread-menu-edge-gap);
      top: calc(max(0px, calc(env(safe-area-inset-top) - var(--topbar-safe-lift))) + var(--topbar-row-height) + var(--thread-menu-edge-gap));
      z-index: 20;
      display: none;
      width: min(520px, calc(100vw - (var(--thread-menu-edge-gap) * 2)));
      padding: 8px;
      border: 1px solid var(--line);
      border-radius: 29px;
      background: rgba(24,24,27,.98);
      box-shadow: 0 18px 60px rgba(0,0,0,.45);
      -webkit-text-size-adjust: 100%;
      text-size-adjust: 100%;
      scrollbar-width: none;
      -ms-overflow-style: none;
      backdrop-filter: blur(18px);
      max-height: min(78svh, 720px);
      overflow: auto;
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .thread-menu.is-open { display: block; }
    .thread-menu::-webkit-scrollbar { width: 0; height: 0; display: none; }
    .thread-action-card {
      position: fixed;
      left: 18px;
      top: calc(max(0px, calc(env(safe-area-inset-top) - var(--topbar-safe-lift))) + var(--topbar-row-height) + 7px);
      z-index: 31;
      display: none;
      width: min(224px, calc(100vw - 36px));
      padding: 10px;
      border: 1px solid rgba(255,255,255,.11);
      border-radius: 18px;
      background: rgba(27,27,30,.98);
      box-shadow: 0 20px 70px rgba(0,0,0,.56);
      backdrop-filter: blur(18px);
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .thread-action-card.is-open { display: block; }
    .thread-action-card.is-renaming {
      left: 50% !important;
      top: max(84px, calc(env(safe-area-inset-top) + 14svh)) !important;
      width: min(340px, calc(100vw - 36px));
      transform: translateX(-50%);
    }
    .thread-action-card:not(.is-renaming) { transform: none; }
    .thread-action-buttons {
      display: grid;
      gap: 6px;
    }
    .thread-action-button {
      appearance: none;
      border: 0;
      width: 100%;
      min-height: 40px;
      border-radius: 13px;
      padding: 0 12px;
      display: grid;
      grid-template-columns: 20px minmax(0,1fr);
      align-items: center;
      gap: 10px;
      background: rgba(255,255,255,.045);
      color: var(--text);
      font: inherit;
      font-size: 14px;
      font-weight: 720;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .thread-action-button:active { background: rgba(255,255,255,.085); transform: scale(.99); }
    .thread-action-button.is-blue { color: #5eb4ff; background: rgba(94,180,255,.10); }
    .thread-action-button.is-refresh { color: #56d6a5; background: rgba(86,214,165,.10); }
    .thread-action-button.is-danger { color: #ff8a8a; background: rgba(255,107,107,.09); }
    .thread-action-button svg,
    .action-icon svg,
    .pinned-thread-icon svg,
    .thread-title-pin svg {
      width: 18px;
      height: 18px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .thread-rename-panel {
      display: none;
      gap: 8px;
      padding-top: 4px;
    }
    .thread-action-card.is-renaming .thread-action-buttons { display: none; }
    .thread-action-card.is-renaming .thread-rename-panel { display: grid; }
    .thread-rename-input {
      width: 100%;
      min-height: 42px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 13px;
      padding: 0 12px;
      background: rgba(0,0,0,.32);
      color: var(--text);
      font: inherit;
      font-size: 16px;
      line-height: 1.35;
      outline: none;
      -webkit-user-select: text;
      user-select: text;
      -webkit-touch-callout: default;
    }
    .thread-rename-input:focus {
      border-color: rgba(94,180,255,.52);
      box-shadow: 0 0 0 3px rgba(94,180,255,.12);
    }
    .thread-rename-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }
    .thread-rename-actions button {
      appearance: none;
      border: 0;
      min-height: 38px;
      border-radius: 12px;
      background: rgba(255,255,255,.06);
      color: var(--text);
      font: inherit;
      font-size: 13px;
      font-weight: 740;
    }
    .thread-rename-actions .save { color: #5eb4ff; background: rgba(94,180,255,.12); }
    .thread-section + .thread-section { margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.07); }
    .thread-section-label {
      padding: 5px 10px 7px;
      color: var(--faint);
      font-size: 11px;
      font-weight: 720;
      letter-spacing: .04em;
    }
    .project-group + .project-group { margin-top: 4px; }
    .project-header {
      appearance: none;
      border: 0;
      width: 100%;
      font-family: inherit;
      position: relative;
      isolation: isolate;
      display: grid;
      grid-template-columns: 22px minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      min-height: 32px;
      padding: 6px 10px;
      color: var(--text);
      background: transparent;
      font-size: 13px;
      font-weight: 760;
      text-align: left;
      border-radius: 0;
      cursor: pointer;
      touch-action: manipulation;
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .project-header::before {
      content: "";
      position: absolute;
      z-index: 0;
      left: 0;
      right: 0;
      top: 50%;
      height: 30px;
      border-radius: 0;
      background: transparent;
      transform: translateY(-50%);
      pointer-events: none;
    }
    .project-header > * {
      position: relative;
      z-index: 1;
    }
    .project-header:hover, .project-header:active { background: transparent; }
    .project-header:hover::before, .project-header:active::before { background: rgba(255,255,255,.045); }
    .project-header.is-current { color: var(--ok); }
    .project-header small {
      color: var(--faint);
      font-size: 11px;
      font-weight: 560;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      white-space: nowrap;
    }
    .project-header small.has-project-status-dot {
      width: 13px;
      min-width: 13px;
      max-width: 13px;
      overflow: visible;
      justify-content: center;
      gap: 0;
    }
    .pinned-thread-option {
      appearance: none;
      border: 0;
      width: 100%;
      font-family: inherit;
      display: grid;
      grid-template-columns: 22px minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      min-height: 32px;
      padding: 6px 10px;
      color: #5eb4ff;
      background: rgba(94,180,255,.075);
      font-size: 13px;
      font-weight: 760;
      text-align: left;
      border-radius: 12px;
      cursor: pointer;
    }
    .pinned-thread-option + .pinned-thread-option { margin-top: 4px; }
    .pinned-thread-option:hover, .pinned-thread-option:active { background: rgba(94,180,255,.12); }
    .pinned-thread-option[aria-current="true"] { background: rgba(94,180,255,.16); }
    .pinned-thread-icon {
      width: 20px;
      height: 18px;
      color: #5eb4ff;
      display: inline-grid;
      place-items: center;
    }
    .pinned-thread-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pinned-thread-meta { color: rgba(158,203,255,.74); font-size: 11px; font-weight: 600; white-space: nowrap; }
    .project-folder {
      width: 20px;
      height: 18px;
      color: var(--faint);
      opacity: .9;
      display: inline-grid;
      place-items: center;
    }
    .project-header.is-current .project-folder { color: var(--ok); opacity: .95; }
    .project-folder svg {
      width: 19px;
      height: 17px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.75;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .project-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .thread-list { display: grid; gap: 2px; }
    .project-group:not(.is-open) .thread-list { display: none; }
    .thread-option {
      appearance: none;
      border: 0;
      width: 100%;
      font-family: inherit;
      position: relative;
      isolation: isolate;
      border-radius: 12px;
      padding: 8px 9px 8px 40px;
      color: var(--text);
      background: transparent;
      text-align: left;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      touch-action: manipulation;
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .thread-option::before {
      content: "";
      position: absolute;
      z-index: 0;
      left: 0;
      right: 0;
      top: 50%;
      height: 30px;
      border-radius: 12px;
      background: transparent;
      transform: translateY(-50%);
      pointer-events: none;
    }
    .thread-option > * {
      position: relative;
      z-index: 1;
    }
    .thread-option:hover,
    .thread-option:active { background: transparent; }
    .thread-option[aria-current="true"]::before { background: rgba(255,255,255,.045); }
    .thread-option.is-pinned { color: #9ecbff; }
    .thread-option.is-project-toggle {
      color: #9ecbff;
    }
    .thread-option.is-project-toggle .thread-title-text {
      font-weight: 760;
    }
    .thread-option.is-project-toggle:hover::before,
    .thread-option.is-project-toggle:active::before {
      background: rgba(94,180,255,.10);
    }
    .thread-option-title {
      width: 100%;
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
      font-size: 13px;
      line-height: 1.35;
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .thread-title-pin {
      width: 14px;
      height: 14px;
      color: #5eb4ff;
      display: inline-grid;
      place-items: center;
      flex: 0 0 auto;
    }
    .thread-title-pin svg { width: 14px; height: 14px; stroke-width: 2.1; }
    .thread-title-text {
      display: block;
      flex: 1 1 auto;
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .thread-option-state {
      flex: 0 0 auto;
      min-width: 32px;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      color: var(--faint);
      font-size: 11px;
      white-space: nowrap;
    }
    .thread-option-dot {
      width: 8px;
      height: 8px;
      margin-right: 4px;
      border-radius: 999px;
      background: #5eb4ff;
      box-shadow: 0 0 7px 1.5px rgba(94,180,255,.48);
    }
    .project-status-dot {
      --dot-color: #5eb4ff;
      --dot-shadow-rest: 0 0 7px 1.5px rgba(94,180,255,.48);
      --dot-shadow-dim: 0 0 6px 1px rgba(94,180,255,.34);
      --dot-shadow-peak: 0 0 10px 2px rgba(94,180,255,.58);
      display: block;
      width: 8px;
      height: 8px;
      border-radius: 999px;
      background: var(--dot-color);
      box-shadow: var(--dot-shadow-rest);
      flex: 0 0 8px;
    }
    .project-status-dot.is-yellow {
      --dot-color: #ffae45;
      --dot-shadow-rest: 0 0 7px 1.5px rgba(255,174,69,.46);
      --dot-shadow-dim: 0 0 6px 1px rgba(255,174,69,.32);
      --dot-shadow-peak: 0 0 10px 2px rgba(255,174,69,.56);
    }
    .project-status-dot.is-flashing {
      animation: dotFlash var(--dot-flash-duration) ease-in-out infinite;
      animation-delay: var(--dot-flash-delay);
    }
    .thread-option-spinner {
      width: 15px;
      height: 15px;
      border-radius: 999px;
      border: 2px solid rgba(255,255,255,.24);
      border-top-color: rgba(244,244,245,.92);
      animation: threadSpin .85s linear infinite;
    }
    .thread-option.is-conversation { padding-left: 12px; }
    .empty-thread-menu { padding: 18px 12px; color: var(--muted); font-size: 13px; }
    .thread-load-more {
      appearance: none;
      border: 1px solid rgba(255,255,255,.10);
      width: 100%;
      min-height: 38px;
      margin-top: 8px;
      border-radius: 12px;
      background: rgba(255,255,255,.045);
      color: var(--text);
      font: inherit;
      font-size: 13px;
      font-weight: 720;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 8px;
      align-items: center;
      padding: 8px 10px;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
    }
    .thread-load-more:disabled { opacity: .68; cursor: default; }
    .thread-load-more small { color: var(--faint); font-size: 11px; font-weight: 620; white-space: nowrap; }
    @media (min-width: 900px) and (min-height: 650px) {
      :root {
        --ipad-thread-rail-width: clamp(304px, 28vw, 356px);
        --ipad-layout-gap: 14px;
        --ipad-content-max: 1140px;
      }
      .app {
        grid-template-columns: var(--ipad-thread-rail-width) minmax(0, 1fr);
      }
      .topbar {
        grid-column: 1 / -1;
      }
      .thread-menu {
        position: relative;
        left: auto;
        top: auto;
        grid-column: 1;
        grid-row: 2 / 4;
        align-self: stretch;
        display: block;
        width: auto;
        max-height: none;
        min-height: 0;
        margin: var(--ipad-layout-gap);
        border-radius: 29px;
        background: rgba(24,24,27,.98);
        box-shadow: 10px 0 42px rgba(0,0,0,.18);
      }
      .thread {
        grid-column: 2;
        grid-row: 2;
        padding-left: max(14px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
        padding-right: max(14px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
      }
      .composer-shell {
        grid-column: 2;
        grid-row: 3;
        padding-left: max(12px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
        padding-right: max(12px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
      }
      .thread-menu .thread-section:last-child {
        padding-bottom: max(12px, env(safe-area-inset-bottom));
      }
      .thread-menu-scrim { display: none !important; }
    }
    .title-dot {
      --dot-color: var(--dot-core);
      --dot-shadow-rest: 0 0 8px 1.75px var(--dot-glow-soft);
      --dot-shadow-dim: 0 0 5px 1px color(display-p3 .18 1 .48 / .42);
      --dot-shadow-peak: 0 0 12px 2.5px color(display-p3 .56 1 .78 / .72);
      flex: 0 0 auto;
      width: 8px;
      height: 8px;
      margin-left: 2px;
      border-radius: 999px;
      background: var(--dot-color);
      box-shadow: var(--dot-shadow-rest);
    }
    body.dot-blue .title-dot {
      --dot-color: #5eb4ff;
      --dot-shadow-rest: 0 0 7px 1.5px rgba(94,180,255,.48);
      --dot-shadow-dim: 0 0 5px 1px rgba(94,180,255,.30);
      --dot-shadow-peak: 0 0 12px 2.5px rgba(94,180,255,.66);
    }
    body.dot-orange .title-dot {
      --dot-color: #ffae45;
      --dot-shadow-rest: 0 0 7px 1.5px rgba(255,174,69,.46);
      --dot-shadow-dim: 0 0 5px 1px rgba(255,174,69,.28);
      --dot-shadow-peak: 0 0 12px 2.5px rgba(255,174,69,.64);
    }
    body.dot-flashing .title-dot {
      animation: titleDotFlash var(--dot-flash-duration) ease-in-out infinite;
      animation-delay: var(--dot-flash-delay);
    }
    @keyframes titleDotFlash {
      0%, 100% {
        opacity: .82;
        box-shadow: var(--dot-shadow-dim);
      }
      50% {
        opacity: 1;
        box-shadow: var(--dot-shadow-peak);
      }
    }
    @keyframes dotFlash {
      0%, 100% {
        opacity: .88;
        box-shadow: var(--dot-shadow-dim);
      }
      50% {
        opacity: .98;
        box-shadow: var(--dot-shadow-peak);
      }
    }
    @keyframes threadSpin {
      to { transform: rotate(360deg); }
    }
    @media (prefers-reduced-motion: reduce) {
      .thread-option-spinner,
      .project-status-dot.is-flashing,
      body.dot-flashing .title-dot {
        animation: none;
      }
    }
    .context-status {
      --context-progress: 0deg;
      --context-color: color(display-p3 .42 1 .68);
      flex: 0 0 auto;
      height: var(--top-control-size);
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 6px;
      max-width: min(46vw, 360px);
      min-width: 18px;
      color: var(--context-color);
      font-size: 12px;
      font-weight: 720;
      letter-spacing: -.01em;
      white-space: nowrap;
      text-align: right;
      cursor: pointer;
      user-select: none;
      transition: color .55s ease;
    }
    .context-status.mode-ring {
      width: calc(var(--top-control-size) - 1px);
      min-width: calc(var(--top-control-size) - 1px);
      height: calc(var(--top-control-size) - 1px);
      display: inline-grid;
      place-items: center;
      justify-content: center;
    }
    .context-status.mode-ring .context-text { display: none; }
    .context-status.mode-percent { min-width: 50px; }
    .context-status.mode-used { min-width: 58px; }
    .context-status.is-unknown { --context-color: rgba(161,161,170,.72); }
    .context-quick-card {
      position: fixed;
      z-index: 32;
      display: none;
      appearance: none;
      border: 0;
      box-sizing: border-box;
      height: 44px;
      border-radius: 17px;
      padding: 0 14px;
      grid-template-columns: 18px minmax(0,1fr);
      align-items: center;
      gap: 8px;
      background: linear-gradient(rgba(94,180,255,.10), rgba(94,180,255,.10)), #13263a;
      color: #5eb4ff;
      font: inherit;
      font-size: 14px;
      font-weight: 760;
      text-align: left;
      cursor: pointer;
      touch-action: manipulation;
      box-shadow: 0 10px 34px rgba(0,0,0,.28), 0 8px 22px rgba(72,135,190,.16);
      -webkit-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
    }
    .context-quick-card.is-open { display: grid; }
    .context-quick-card:active { background: linear-gradient(rgba(94,180,255,.12), rgba(94,180,255,.12)), #13263a; transform: scale(.99); }
    .context-quick-card svg {
      width: 17px;
      height: 17px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      vector-effect: non-scaling-stroke;
    }
    .context-text {
      min-width: 0;
      display: inline-flex;
      align-items: baseline;
      gap: 0;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .context-percent {
      min-width: 28px;
      color: var(--context-color);
      font-variant-numeric: tabular-nums;
      text-align: right;
      transition: color .55s ease;
    }
    .context-ring {
      position: relative;
      flex: 0 0 auto;
      width: calc(var(--top-control-size) - 2px);
      height: calc(var(--top-control-size) - 2px);
      border-radius: 999px;
      transform: none;
      background: conic-gradient(var(--context-color) var(--context-progress), rgba(255,255,255,.13) 0);
      box-shadow: 0 0 4px color-mix(in srgb, var(--context-color) 14%, transparent);
      transition: background .65s cubic-bezier(.22,.61,.36,1), box-shadow .65s ease;
    }
    .context-ring::after {
      content: "";
      position: absolute;
      inset: 3.4px;
      border-radius: inherit;
      background: var(--topbar-bg);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
    }
    .context-status.is-unknown .context-ring {
      background: conic-gradient(rgba(161,161,170,.38) 0deg, rgba(255,255,255,.12) 0);
      box-shadow: none;
    }

    .thread {
      position: relative;
      z-index: 1;
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      padding: 22px max(14px, calc((100vw - 860px) / 2)) var(--thread-composer-gap);
      scroll-behavior: smooth;
      transform: translate3d(0, calc(-1 * var(--keyboard-shift)), 0);
      transition: transform .2s cubic-bezier(.22,.61,.36,1);
      will-change: transform;
    }
    .thread.is-instant-scroll {
      scroll-behavior: auto;
    }
    .thread.is-history-rendering .message {
      visibility: hidden;
    }
    .history-load-older {
      display: block;
      margin: 0 auto 14px;
      padding: 8px 14px;
      border: 0;
      border-radius: 999px;
      background: transparent;
      color: var(--faint);
      font: inherit;
      font-size: 12px;
      font-weight: 650;
      cursor: pointer;
      touch-action: manipulation;
    }
    .history-load-older:active { background: rgba(255,255,255,.07); }
    .history-load-older:disabled { opacity: .62; cursor: default; }
    .day-note {
      width: fit-content;
      margin: 0 auto 20px;
      color: var(--faint);
      font-size: 12px;
    }

    .message {
      display: flex;
      margin: 0 0 18px;
      min-width: 0;
    }
    .message.user { justify-content: flex-end; }
    .thread > .message:last-child { margin-bottom: 0; }
    .message.assistant { justify-content: flex-start; }
    .bubble-wrap { max-width: min(760px, 86%); min-width: 0; }
    .message.assistant .bubble-wrap { width: 100%; max-width: none; min-width: 0; }
    .message.user .bubble-wrap { max-width: min(720px, 82%); min-width: 0; }
    .meta {
      margin: 0 0 6px;
      color: var(--faint);
      font-size: 12px;
      line-height: 1;
    }
    .meta-duration-number {
      font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
      font-variant-numeric: tabular-nums;
      font-feature-settings: "tnum" 1;
    }
    .message.user .meta { text-align: right; }
    .bubble {
      color: var(--text);
      font-size: 15px;
      line-height: 1.62;
      overflow-wrap: anywhere;
      min-width: 0;
      max-width: 100%;
    }
    .message.user .bubble {
      padding: 11px 14px;
      border-radius: 19px;
      background: var(--user);
      line-height: 1.48;
      -webkit-user-select: text;
      user-select: text;
      -webkit-touch-callout: default;
    }
    /* @ 提及在气泡里渲染成蓝色标签（去掉 @，只显示名字，像 Codex 原生提及） */
    .mention-chip {
      color: #4aa3ff;
      font-weight: 650;
      padding: 0 2px;
      border-radius: 5px;
      background: rgba(74,163,255,.12);
    }
    .theme-light .mention-chip { color: #1f6fd0; background: rgba(31,111,208,.12); }
    .message.user .bubble.is-copyable {
      cursor: pointer;
      -webkit-tap-highlight-color: rgba(255,255,255,.12);
      touch-action: auto;
    }
    .message.user .bubble.is-copyable:active {
      filter: brightness(1.08);
    }
    .bubble img.attachment-preview {
      display: block;
      max-width: min(260px, 68vw);
      max-height: 260px;
      border-radius: 14px;
      object-fit: cover;
      cursor: zoom-in;
    }
    .bubble .file-attachment-preview {
      display: flex;
      align-items: center;
      gap: 8px;
      box-sizing: border-box;
      width: 100%;
      max-width: 100%;
      margin-top: 8px;
      padding: 9px 11px;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 13px;
      background: rgba(255,255,255,.045);
      color: var(--text);
      font-size: 13px;
      line-height: 1.25;
      text-decoration: none;
    }
    .bubble button.file-attachment-preview {
      border: 1px solid rgba(255,255,255,.10);
      font: inherit;
      text-align: left;
      cursor: pointer;
    }
    .bubble a.file-attachment-preview:active { background: rgba(255,255,255,.085); }
    .bubble button.file-attachment-preview:active { background: rgba(255,255,255,.085); }
    .bubble .file-attachment-preview.is-disabled { opacity: .62; }
    .bubble .file-attachment-ext {
      flex: 0 0 auto;
      min-width: 34px;
      color: var(--ok);
      font-size: 11px;
      font-weight: 780;
      text-transform: uppercase;
    }
    .bubble .file-attachment-name {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .message.user .bubble .file-attachment-preview:last-child {
      margin-bottom: 3px;
    }
    .attachment-note {
      margin-top: 8px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
    }
    .file-input { display: none; }
    .file-preview-modal {
      position: fixed;
      inset: 0;
      z-index: 5000;
      display: none;
      flex-direction: column;
      width: 100vw;
      height: 100dvh;
      max-height: 100dvh;
      background: rgba(5, 7, 11, .96);
      color: var(--text);
      padding: max(12px, env(safe-area-inset-top)) 12px max(14px, env(safe-area-inset-bottom));
      box-sizing: border-box;
      overflow: hidden;
    }
    .file-preview-modal.is-open { display: flex; }
    .file-preview-head {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      padding: 4px 0 12px;
    }
    .file-preview-back,
    .file-preview-download {
      appearance: none;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 999px;
      background: rgba(255,255,255,.08);
      color: var(--text);
      min-height: 34px;
      padding: 0 13px;
      font-size: 13px;
      font-weight: 750;
    }
    .file-preview-title {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-size: 14px;
      font-weight: 780;
      text-align: center;
    }
    .file-preview-body {
      flex: 1 1 auto;
      min-height: 0;
      height: 100%;
      display: block;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior: contain;
      touch-action: pan-y;
      border-radius: 18px;
      background: rgba(255,255,255,.035);
    }
    .file-preview-body img {
      display: block;
      margin: auto;
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
      -webkit-touch-callout: default;
    }
    .file-preview-text {
      align-self: stretch;
      justify-self: stretch;
      margin: 0;
      padding: 14px;
      box-sizing: border-box;
      white-space: pre-wrap;
      word-break: break-word;
      font: 12px/1.52 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      color: rgba(255,255,255,.88);
    }
    .file-preview-markdown {
      min-height: 100%;
      padding: 16px;
      box-sizing: border-box;
      color: rgba(255,255,255,.9);
      font-size: 14px;
      line-height: 1.58;
      overflow-wrap: anywhere;
      touch-action: pan-y;
    }
    .file-preview-markdown h1 { font-size: 1.48em; }
    .file-preview-markdown h2 { font-size: 1.28em; }
    .file-preview-markdown h3 { font-size: 1.12em; }
    .file-preview-markdown pre {
      white-space: pre;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
    }
    .file-preview-markdown .table-scroll {
      max-width: 100%;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }
    .file-preview-empty {
      color: var(--muted);
      font-size: 13px;
      padding: 18px;
      text-align: center;
    }
    .file-preview-placeholder {
      min-height: 100%;
      box-sizing: border-box;
      display: grid;
      place-items: center;
      padding: 26px;
      text-align: center;
    }
    .file-preview-placeholder-box {
      width: min(100%, 320px);
      display: grid;
      justify-items: center;
      gap: 12px;
      padding: 24px 18px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 18px;
      background: rgba(255,255,255,.045);
    }
    .file-preview-placeholder-ext {
      min-width: 72px;
      padding: 12px 14px;
      border-radius: 15px;
      background: rgba(82, 211, 173, .14);
      color: var(--ok);
      font-size: 20px;
      font-weight: 850;
      letter-spacing: .04em;
      text-transform: uppercase;
    }
    .file-preview-placeholder-name {
      max-width: 100%;
      color: rgba(255,255,255,.92);
      font-size: 14px;
      font-weight: 760;
      line-height: 1.4;
      overflow-wrap: anywhere;
    }
    .file-preview-placeholder-type {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
    }
    .message.assistant .bubble {
      padding: 0;
      background: transparent;
    }
    /* Hermes 回复左下角「复制」按钮：一摁复制这条 Hermes 回复 */
    .bubble-actions {
      display: none;
      margin-top: 7px;
      align-items: center;
      gap: 7px;
      flex-wrap: wrap;
    }
    .message.assistant .bubble-actions { display: flex; }
    .message.assistant.pending .bubble-actions { display: none; }
    .bubble-copy-btn {
      flex: 0 0 auto;
      appearance: none;
      -webkit-appearance: none;
      display: inline-flex;
      align-items: center;
      gap: 5px;
      height: 26px;
      padding: 0 10px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.05);
      color: var(--faint);
      font: inherit;
      font-size: 12px;
      line-height: 1;
      cursor: pointer;
      touch-action: manipulation;
      -webkit-tap-highlight-color: transparent;
      transition: color .15s, border-color .15s, background .15s, transform .12s;
    }
    .bubble-copy-btn:active { transform: scale(.97); background: rgba(255,255,255,.1); color: var(--text); }
    .bubble-copy-btn.copied { color: var(--ok); border-color: rgba(142,240,183,.4); background: rgba(142,240,183,.13); }
    /* 默认只显示图标：label 为空时收起，不留 gap 缝隙；复制成功填「已复制」再显示 */
    .bubble-copy-btn .bubble-copy-label:empty { display: none; }
    .bubble-copy-btn svg {
      width: 13px;
      height: 13px;
      flex: 0 0 auto;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .theme-light .bubble-copy-btn { border-color: rgba(0,0,0,.12); background: rgba(0,0,0,.045); }
    .theme-light .bubble-copy-btn:active { background: rgba(0,0,0,.09); }
    .theme-light .bubble-copy-btn.copied { color: #177a4c; border-color: rgba(23,122,76,.45); background: rgba(23,122,76,.1); }
    .message.pending .meta { color: var(--muted); }
    .process-feed {
      display: grid;
      gap: 0;
    }
    .process-feed > * + * { margin-top: 15px; }
    .process-feed > * + .process-tool-row { margin-top: 2px; }
    .process-tool-row {
      display: flex;
      flex-direction: row;
      gap: 6px;
      min-width: 0;
      overflow-x: auto;
      overflow-y: hidden;
      overscroll-behavior-x: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      touch-action: pan-x;
    }
    .process-tool-row::-webkit-scrollbar { display: none; }
    .process-start,
    .process-complete,
    .process-error {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.35;
    }
    .process-error { color: #ff9a9a; }
    .process-thinking {
      color: var(--text);
      font-size: 15px;
      line-height: 1.66;
    }
    .process-tool {
      flex: 0 0 auto;
      min-width: 0;
      width: fit-content;
      max-width: 100%;
      padding: 4px 8px;
      border: 1px solid rgba(255,255,255,.07);
      border-radius: 999px;
      color: var(--faint);
      background: rgba(255,255,255,.035);
      font-size: 11px;
      line-height: 1.2;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    @keyframes process-tool-enter {
      from { opacity: 0; transform: translateX(-10px) scale(.96); }
      to { opacity: 1; transform: translateX(0) scale(1); }
    }
    .process-tool.process-tool-enter {
      animation: process-tool-enter 220ms cubic-bezier(.2,.8,.2,1) both;
    }
    @media (prefers-reduced-motion: reduce) {
      .process-tool.process-tool-enter { animation: none; }
    }

    details.process {
      margin-top: 10px;
      color: var(--muted);
      font-size: 12px;
    }
    details.process summary { cursor: pointer; color: var(--muted); user-select: none; }
    .steps {
      margin: 8px 0 0;
      padding: 0;
      list-style: none;
      max-height: 180px;
      overflow: auto;
      border-top: 1px solid var(--line);
    }
    .steps li {
      padding: 7px 0;
      border-bottom: 1px solid rgba(255,255,255,.06);
      color: var(--muted);
      font-size: 11px;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }

    .composer-shell {
      position: relative;
      z-index: 2;
      min-width: 0;
      max-width: 100%;
      overflow-x: hidden;
      padding: var(--thread-composer-gap) max(12px, calc((100vw - 860px) / 2)) var(--composer-bottom-pad);
      border-top: 0;
      background: transparent;
      overscroll-behavior: contain;
      transform: translate3d(0, calc(-1 * var(--keyboard-shift)), 0);
      transition: transform .2s cubic-bezier(.22,.61,.36,1);
      will-change: transform;
    }
    /* iOS WebKit 会把 transform 动画中的 textarea 连同父层先栅格化再移动，
       Liquid Glass/半透明背景下文字会在亚像素过渡帧里短暂发糊。键盘位移本身
       已由 visualViewport 连续提供整数像素，改用相对 bottom 跟随即可保持清晰。 */
    html.ios-keyboard-crisp .composer-shell {
      bottom: var(--keyboard-shift);
      transform: none;
      transition: none;
      will-change: auto;
    }
    body.keyboard-open {
      background: var(--keyboard-gap-bg);
    }
    @media (min-width: 900px) and (min-height: 650px) {
      .thread {
        padding-left: max(14px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
        padding-right: max(14px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
      }
      .composer-shell {
        padding-left: max(12px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
        padding-right: max(12px, calc((100vw - var(--ipad-thread-rail-width) - var(--ipad-content-max)) / 2));
      }
    }
    .notice-pill {
      position: fixed;
      z-index: 90;
      left: 50%;
      top: calc(max(0px, calc(env(safe-area-inset-top) - var(--topbar-safe-lift))) + var(--topbar-row-height) + var(--notice-top-gap));
      width: fit-content;
      max-width: min(680px, calc(100vw - 32px));
      min-height: 0;
      margin: 0;
      padding: 0 12px;
      border: 1px solid rgba(142,240,183,.22);
      border-radius: 999px;
      color: var(--ok);
      background: rgba(16, 38, 27, .78);
      box-shadow: 0 10px 34px rgba(0,0,0,.22);
      font-size: 13px;
      line-height: 28px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      opacity: 0;
      transform: translate(-50%, -8px) scale(.98);
      max-height: 0;
      pointer-events: none;
      transition: opacity .22s ease, transform .22s ease, max-height .22s ease;
    }
    .notice-pill.is-visible {
      opacity: 1;
      transform: translate(-50%, 0) scale(1);
      max-height: 34px;
    }
    .notice-pill.error {
      color: #ff8d8d;
      border-color: rgba(255,141,141,.24);
      background: rgba(54, 24, 24, .82);
    }
    .notice-mono-number {
      font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
      font-variant-numeric: tabular-nums;
    }
    .queued-send-bar {
      display: none;
      flex-direction: column;
      gap: 5px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      margin: 0 0 6px;
      max-height: 38vh;
      overflow-y: auto;
    }
    .queued-send-bar.is-visible { display: flex; }
    .queued-send-card {
      position: relative;
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      max-width: 100%;
      min-height: 32px;
      padding: 4px 8px 4px 11px;
      border: 1px solid var(--line);
      border-radius: 22px;
      background: #202020;
      box-shadow: none;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.25;
      overflow: hidden;
    }
    .queued-send-card.is-sending { border-color: rgba(255,210,138,.45); }
    .queued-send-card-text {
      flex: 1 1 0;
      min-width: 0;
      display: flex;
      align-items: baseline;
      gap: 6px;
      overflow: hidden;
    }
    .queued-send-card-state {
      flex: 0 0 auto;
      color: #ff9b62;
      font-weight: 760;
      white-space: nowrap;
    }
    .queued-send-card.is-sending .queued-send-card-state { color: #ffd28a; }
    .queued-send-card-summary {
      flex: 1 1 0;
      min-width: 0;
      color: var(--muted);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .queued-send-promote, .queued-send-delete {
      flex: 0 0 auto;
      appearance: none;
      border-radius: 999px;
      padding: 0 9px;
      height: 24px;
      font: inherit;
      font-size: 12px;
      font-weight: 760;
      cursor: pointer;
      touch-action: manipulation;
      white-space: nowrap;
      display: inline-flex;
      align-items: center;
      gap: 4px;
    }
    .queued-send-promote {
      border: 1px solid rgba(142,240,183,.32);
      background: rgba(142,240,183,.14);
      color: var(--ok);
    }
    .queued-send-delete {
      border: 1px solid rgba(255,107,107,.34);
      background: rgba(255,107,107,.13);
      color: #ff8a8a;
      width: 24px;
      padding: 0;
      justify-content: center;
    }
    .queued-send-btn-icon {
      width: 14px;
      height: 14px;
      flex: 0 0 auto;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .queued-send-promote:disabled, .queued-send-delete:disabled { opacity: .45; cursor: progress; }
    .queued-send-promote:active, .queued-send-delete:active { transform: scale(.97); }
    .queued-send-card.is-promoting { border-color: rgba(142,240,183,.4); }
    .queued-send-card.is-deleting { border-color: rgba(255,107,107,.4); }
    body.pro-mode .queued-send-card {
      border-color: transparent;
    }
    body.pro-mode .queued-send-card > * {
      position: relative;
      z-index: 1;
    }
    body.pro-mode .queued-send-card::before {
      content: "";
      position: absolute;
      inset: -1px;
      z-index: 0;
      pointer-events: none;
      border-radius: inherit;
      padding: 1px;
      background: linear-gradient(92deg, rgba(255,255,255,.46) 0%, rgba(158,203,255,.95) 28%, var(--signature-dot-tint-a) 46%, rgba(142,240,183,.84) 64%, var(--signature-dot-tint-b) 78%, rgba(255,255,255,.48) 100%);
      background-size: 260% 100%;
      background-position: 50% 50%;
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      opacity: .98;
    }
    body.pro-mode.color-flow-on .queued-send-card::before {
      animation: signatureColorFlow 4.8s ease-in-out infinite;
    }
    @media (prefers-reduced-motion: reduce) {
      body.pro-mode.color-flow-on .queued-send-card::before { animation: none; }
    }
    .theme-light .queued-send-delete { color: #d23b3b; border-color: rgba(210,59,59,.4); background: rgba(210,59,59,.09); }
    .attachment-tray {
      display: none;
      gap: 8px;
      padding: 0 8px 8px;
      overflow-x: auto;
    }
    .attachment-tray.has-items { display: flex; }
    .attachment-chip {
      position: relative;
      flex: 0 0 auto;
      width: 58px;
      height: 58px;
      border-radius: 14px;
      overflow: hidden;
      background: var(--panel-2);
      border: 1px solid var(--line);
    }
    .attachment-chip img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .attachment-chip .file-chip-icon {
      display: grid;
      place-items: center;
      width: 100%;
      height: 100%;
      padding: 7px 5px 5px;
      color: var(--text);
      font-size: 10px;
      font-weight: 780;
      line-height: 1.05;
      text-align: center;
      overflow: hidden;
      overflow-wrap: anywhere;
    }
    .attachment-chip .file-chip-ext {
      display: block;
      max-width: 48px;
      color: var(--ok);
      font-size: 11px;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .attachment-chip .file-chip-name {
      display: block;
      max-width: 48px;
      color: var(--muted);
      font-size: 8px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .attachment-chip button {
      position: absolute;
      top: 3px;
      right: 3px;
      width: 20px;
      height: 20px;
      border: 0;
      border-radius: 999px;
      background: rgba(0,0,0,.62);
      color: white;
      font-size: 14px;
      line-height: 20px;
      padding: 0;
    }
    .composer {
      position: relative;
      z-index: 2;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: end;
      gap: 5px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      padding: 9px;
      border: 1px solid var(--line);
      border-radius: 24px;
      background: #202020;
      box-shadow: none;
    }
    body.dot-blue {
      --signature-dot-tint-a: color(display-p3 .58 .77 1);
      --signature-dot-tint-b: color(display-p3 .48 .70 1);
      --signature-dot-glow: rgba(94,180,255,.15);
    }
    body.dot-orange {
      --signature-dot-tint-a: color(display-p3 1 .74 .48);
      --signature-dot-tint-b: color(display-p3 1 .62 .34);
      --signature-dot-glow: rgba(255,174,69,.13);
    }
    .composer-signature {
      position: absolute;
      left: 50%;
      top: var(--composer-signature-top);
      bottom: auto;
      z-index: 1;
      max-width: calc(100vw - 48px);
      transform: translateX(-50%) scaleX(1.14);
      transform-origin: center;
      pointer-events: none;
      -webkit-user-select: none;
      user-select: none;
      white-space: nowrap;
      font-family: "Snell Roundhand", "Bradley Hand", "Apple Chancery", "Segoe Script", cursive;
      font-size: clamp(16px, 3.8vw, 21px);
      font-weight: 650;
      line-height: 1.35;
      padding-bottom: .18em;
      letter-spacing: .06em;
      color: transparent;
      -webkit-text-fill-color: transparent;
      background: linear-gradient(92deg, rgba(255,255,255,.46) 0%, rgba(158,203,255,.95) 28%, var(--signature-dot-tint-a) 46%, rgba(142,240,183,.84) 64%, var(--signature-dot-tint-b) 78%, rgba(255,255,255,.48) 100%);
      background-size: 260% 100%;
      background-position: 50% 50%;
      -webkit-background-clip: text;
      background-clip: text;
      text-shadow: 0 0 18px rgba(158,203,255,.22), 0 0 26px rgba(142,240,183,.16), 0 0 22px var(--signature-dot-glow);
      opacity: 1;
      filter: brightness(1.28) saturate(1.06);
      dynamic-range-limit: no-limit;
      animation: none;
      transition: opacity .18s ease, transform .18s ease;
    }
    body.dot-blue .composer-signature {
      --signature-dot-tint-a: color(display-p3 .58 .77 1);
      --signature-dot-tint-b: color(display-p3 .48 .70 1);
      --signature-dot-glow: rgba(94,180,255,.15);
    }
    body.dot-orange .composer-signature {
      --signature-dot-tint-a: color(display-p3 1 .74 .48);
      --signature-dot-tint-b: color(display-p3 1 .62 .34);
      --signature-dot-glow: rgba(255,174,69,.13);
    }
    body.dot-flashing .composer-signature {
      animation: signatureColorFlow 4.8s ease-in-out infinite;
    }

    @media (dynamic-range: high) {
      .composer-signature {
        filter: brightness(1.38) saturate(1.08);
        text-shadow: 0 0 22px rgba(158,203,255,.28), 0 0 34px rgba(142,240,183,.2), 0 0 28px var(--signature-dot-glow);
      }
    }
    @keyframes signatureColorFlow {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }
    body.keyboard-open .composer-signature {
      opacity: 0;
      transform: translateX(-50%) translateY(8px) scaleX(1.14);
    }
    body.signature-hidden .composer-signature { display: none; }
    body.signature-plain .composer-signature {
      color: rgba(244,244,245,.60);
      -webkit-text-fill-color: currentColor;
      background: none;
      text-shadow: 0 0 16px rgba(255,255,255,.08);
      filter: none;
      animation: none;
      dynamic-range-limit: standard;
    }
    body.signature-plain.dot-flashing .composer-signature { animation: none; }
    @media (prefers-reduced-motion: reduce) {
      .composer-signature { animation: none; }
    }
    body.pro-mode .composer {
      border-color: transparent;
      box-shadow: none;
    }
    body.pro-mode .composer > * {
      position: relative;
      z-index: 1;
    }
    body.pro-mode .composer::before {
      content: "";
      position: absolute;
      inset: -1px;
      z-index: 0;
      pointer-events: none;
      border-radius: inherit;
      padding: 1px;
      background: linear-gradient(92deg, rgba(255,255,255,.46) 0%, rgba(158,203,255,.95) 28%, var(--signature-dot-tint-a) 46%, rgba(142,240,183,.84) 64%, var(--signature-dot-tint-b) 78%, rgba(255,255,255,.48) 100%);
      background-size: 260% 100%;
      background-position: 50% 50%;
      -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      opacity: .98;
    }
    body.pro-mode .icon-btn {
      color: transparent;
      -webkit-text-fill-color: transparent;
      background: linear-gradient(92deg, rgba(255,255,255,.54) 0%, rgba(158,203,255,1) 28%, var(--signature-dot-tint-a) 46%, rgba(142,240,183,.9) 64%, var(--signature-dot-tint-b) 78%, rgba(255,255,255,.54) 100%);
      background-size: 260% 100%;
      background-position: 50% 50%;
      -webkit-background-clip: text;
      background-clip: text;
      filter: drop-shadow(0 0 10px var(--signature-dot-glow)) drop-shadow(0 0 13px rgba(158,203,255,.16));
    }
    body.pro-mode .send-btn {
      overflow: hidden;
      isolation: isolate;
      background: transparent;
      color: #070707;
      box-shadow: 0 0 13px var(--signature-dot-glow), 0 0 18px rgba(158,203,255,.14), inset 0 0 0 1px rgba(255,255,255,.18);
      filter: none;
      text-shadow: 0 1px 1px rgba(255,255,255,.24), 0 0 5px rgba(255,255,255,.18);
    }
    body.pro-mode .send-btn::before {
      content: "";
      position: absolute;
      inset: -8px;
      z-index: -1;
      pointer-events: none;
      border-radius: inherit;
      background:
        radial-gradient(circle at 18% 22%, rgba(255,255,255,.82) 0 12%, transparent 34%),
        radial-gradient(circle at 36% 34%, rgba(158,203,255,.96) 0 20%, transparent 46%),
        radial-gradient(circle at 57% 54%, var(--signature-dot-tint-a) 0 22%, transparent 50%),
        radial-gradient(circle at 76% 70%, rgba(142,240,183,.92) 0 20%, transparent 48%),
        radial-gradient(circle at 91% 48%, var(--signature-dot-tint-b) 0 18%, transparent 44%),
        linear-gradient(92deg, rgba(255,255,255,.72) 0%, rgba(158,203,255,.94) 30%, var(--signature-dot-tint-a) 50%, rgba(142,240,183,.9) 70%, var(--signature-dot-tint-b) 88%, rgba(255,255,255,.70) 100%);
      background-size: 260% 100%, 260% 100%, 260% 100%, 260% 100%, 260% 100%, 320% 100%;
      background-position: 50% 50%;
      filter: blur(6px) saturate(1.08);
      transform: scale(1.04);
    }
    body.pro-mode .send-btn::after {
      content: "";
      position: absolute;
      inset: 1px;
      z-index: -1;
      pointer-events: none;
      border-radius: inherit;
      background: rgba(255,255,255,.08);
      box-shadow: inset 0 1px 5px rgba(255,255,255,.28), inset 0 -4px 8px rgba(0,0,0,.08);
    }
    body.pro-mode textarea::placeholder {
      color: color(display-p3 .74 .88 1 / .82);
      text-shadow: 0 0 12px rgba(158,203,255,.18), 0 0 16px var(--signature-dot-glow);
    }
    body.pro-mode .thread-menu {
      border-color: transparent;
      background:
        linear-gradient(rgba(24,24,27,.98), rgba(24,24,27,.98)) padding-box,
        linear-gradient(92deg, rgba(255,255,255,.58) 0%, rgba(158,203,255,.98) 28%, var(--signature-dot-tint-a) 46%, rgba(142,240,183,.9) 64%, var(--signature-dot-tint-b) 78%, rgba(255,255,255,.58) 100%) border-box;
      background-size: auto, 260% 100%;
      background-position: 0 0, 50% 50%;
    }
    @media (min-width: 900px) and (min-height: 650px) {
      body.pro-mode .thread-menu {
        border-color: var(--line);
        background: rgba(24,24,27,.98);
        background-size: auto;
        background-position: 0 0;
      }
    }
    body.pro-mode.color-flow-on .composer::before,
    body.pro-mode.color-flow-on .thread-menu,
    body.pro-mode.color-flow-on .icon-btn,
    body.pro-mode.color-flow-on .send-btn::before {
      animation: signatureColorFlow 4.8s ease-in-out infinite;
    }
    @media (min-width: 900px) and (min-height: 650px) {
      body.pro-mode.color-flow-on .thread-menu { animation: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      body.pro-mode.color-flow-on .composer::before,
      body.pro-mode.color-flow-on .thread-menu,
      body.pro-mode.color-flow-on .icon-btn,
      body.pro-mode.color-flow-on .send-btn::before { animation: none; }
    }
    .icon-btn, .send-btn {
      appearance: none;
      border: 0;
      width: 36px;
      height: 36px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      background: transparent;
      color: var(--muted);
      font-size: 22px;
      line-height: 1;
      position: relative;
      top: -1px;
      cursor: pointer;
      touch-action: manipulation;
    }
    .icon-btn:active, .send-btn:active { transform: scale(.96); }
    .composer-action-hidden { display: none; }
    .stop-btn:disabled { opacity: .45; cursor: wait; }
    .stop-square {
      width: 13px;
      height: 13px;
      border-radius: 3px;
      background: currentColor;
      display: block;
    }
    .send-btn {
      left: -1px;
      background: var(--accent);
      color: #111;
      font-size: 20px;
      font-weight: 900;
    }
    .send-btn:disabled { opacity: .45; cursor: wait; }
    textarea {
      width: 100%;
      max-height: 150px;
      min-height: 38px;
      resize: none;
      border: 0;
      outline: 0;
      padding: 8px 2px;
      position: relative;
      top: -1px;
      color: var(--text);
      background: transparent;
      font: 500 16px / 1.4 ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", sans-serif;
      touch-action: auto;
      overscroll-behavior: contain;
    }
    textarea::placeholder { color: var(--faint); }
    .mini-status { display: none; }

    .markdown-body > *:first-child { margin-top: 0; }
    .markdown-body > *:last-child { margin-bottom: 0; }
    .markdown-body p { margin: 0 0 .45em; }
    .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 { margin: .9em 0 .45em; line-height: 1.2; }
    .markdown-body h1 { font-size: 1.35em; }
    .markdown-body h2 { font-size: 1.18em; }
    .markdown-body h3 { font-size: 1.06em; }
    .markdown-body h4 { font-size: 1em; }
    .markdown-body h5 { font-size: .96em; }
    .markdown-body h6 { font-size: .92em; }
    .markdown-body ul, .markdown-body ol { margin: .35em 0 .6em; padding-left: 1.35em; }
    .markdown-body li { margin: .12em 0; }
    .markdown-body blockquote { margin: .55em 0; padding-left: .9em; border-left: 3px solid #3f3f46; color: var(--muted); }
    .markdown-body pre { margin: .65em 0; padding: .75em .85em; border-radius: 12px; background: var(--panel-2); overflow: auto; white-space: pre-wrap; }
    .markdown-body code { border-radius: 6px; padding: .08em .32em; background: var(--panel-2); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; }
    .markdown-body pre code { padding: 0; background: transparent; }
    .markdown-body .table-scroll { width: 100%; margin: .65em 0; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 12px; border: 1px solid rgba(63,63,70,.78); }
    .markdown-body .katex-display {
      display: block;
      max-width: 100%;
      margin: .65em 0;
      padding: 2px 2px 6px;
      overflow-x: auto;
      overflow-y: hidden;
      overscroll-behavior-x: contain;
      -webkit-overflow-scrolling: touch;
      touch-action: pan-x pan-y;
      scrollbar-width: thin;
      text-align: left;
    }
    .markdown-body .katex-display > .katex { text-align: left; }
    .markdown-body .katex { max-width: 100%; }
    .markdown-body table { width: 100%; min-width: 420px; border-collapse: collapse; background: rgba(24,24,27,.55); font-size: .94em; }
    .markdown-body th, .markdown-body td { padding: .48em .7em; border: 1px solid rgba(63,63,70,.78); vertical-align: top; text-align: left; }
    .markdown-body th { background: rgba(39,39,42,.88); color: var(--text); font-weight: 750; }
    .markdown-body tr:nth-child(even) td { background: rgba(39,39,42,.34); }
    .markdown-body .align-center { text-align: center; }
    .markdown-body .align-right { text-align: right; }
    .markdown-body a { color: #9ecbff; }
    .memory-citation-card {
      margin: .85em 0 .1em;
      border: 1px solid rgba(135, 164, 255, .20);
      border-radius: 16px;
      background:
        linear-gradient(135deg, rgba(92, 124, 255, .13), rgba(44, 211, 162, .075)),
        rgba(24, 24, 27, .62);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 12px 34px rgba(0,0,0,.18);
      overflow: hidden;
    }
    .memory-citation-card summary {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 9px;
      padding: 10px 12px;
      cursor: pointer;
      color: #d7ddff;
      list-style: none;
      user-select: none;
    }
    .memory-citation-card summary::-webkit-details-marker { display: none; }
    .memory-citation-icon {
      display: inline-grid;
      place-items: center;
      width: 22px;
      height: 22px;
      border-radius: 999px;
      background: rgba(136, 166, 255, .16);
      box-shadow: inset 0 0 0 1px rgba(183, 202, 255, .16);
      font-size: 12px;
      line-height: 1;
    }
    .memory-citation-title {
      min-width: 0;
      font-size: 13px;
      font-weight: 760;
      letter-spacing: .01em;
    }
    .memory-citation-count {
      color: rgba(215, 221, 255, .68);
      font-size: 11px;
      font-weight: 650;
      white-space: nowrap;
    }
    .memory-citation-list {
      display: grid;
      gap: 8px;
      padding: 0 12px 12px;
    }
    .memory-citation-item {
      min-width: 0;
      padding: 9px 10px;
      border: 1px solid rgba(255,255,255,.07);
      border-radius: 12px;
      background: rgba(0,0,0,.16);
    }
    .memory-citation-path {
      color: rgba(255,255,255,.86);
      font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
      font-size: 11.5px;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .memory-citation-note {
      margin-top: 4px;
      color: rgba(214, 222, 255, .58);
      font-size: 11.5px;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .memory-citation-empty {
      padding: 0 12px 12px;
      color: rgba(214, 222, 255, .58);
      font-size: 12px;
    }

    @media (max-width: 700px) {
      :root { --topbar-row-height: 44px; --topbar-safe-lift: 12px; --top-control-size: 24px; --topbar-content-lift: -5px; }
      .topbar { padding-left: 12px; padding-right: 12px; }
      .topbar > .title,
      .topbar > .top-actions { transform: translateY(var(--topbar-content-lift)); }
      .route-badge { grid-template-columns: 14px auto; padding-inline: 7px 8px; font-size: 11px; gap: 4px; }
      .route-badge.is-compact { width: var(--top-control-size); grid-template-columns: 1fr; gap: 0; padding: 0; }
      .route-badge svg { width: 14px; height: 14px; transform: translateY(.2px); }
      .reasoning-badge,
      .model-badge { min-width: 38px; padding-inline: 8px; font-size: 11px; }
      .reasoning-badge { min-width: 30px; font-size: 10px; }
      #model-text { max-width: 64px; }
      #reasoning-text { max-width: 44px; }
      .context-status.mode-ring { width: calc(var(--top-control-size) - 3.5px); min-width: calc(var(--top-control-size) - 3.5px); height: calc(var(--top-control-size) - 3.5px); }
      .context-status .context-ring { width: calc(var(--top-control-size) - 3.5px); height: calc(var(--top-control-size) - 3.5px); }
      #route-text { line-height: 14px; transform: translateY(.1px); }
      .thread-button { padding-inline: 5px; }
      .thread-name { max-width: min(48vw, 300px); }
      .new-thread-btn svg { width: 12px; height: 12px; }
      .settings-btn svg { width: 13px; height: 13px; transform: translate(.25px, .45px); }
      .top-actions {
        flex-basis: min(46vw, 184px);
        width: min(46vw, 184px);
        max-width: calc(100vw - 144px);
        gap: 6px;
        padding-right: 5px;
        margin-right: -5px;
      }
      .thread { padding: 18px 12px var(--thread-composer-gap); }
      .bubble-wrap { max-width: 88%; }
      .message.assistant .bubble-wrap { width: 100%; max-width: none; }
      .message.user .bubble-wrap { max-width: 88%; }
      .bubble { font-size: 15px; }
      .composer-shell {
        padding-left: max(var(--thread-menu-edge-gap), calc((100vw - 520px) / 2));
        padding-right: max(var(--thread-menu-edge-gap), calc((100vw - 520px) / 2));
      }
      .composer { border-radius: 29px; }
      .composer-signature { font-size: 18.5px; }
    }

    body.standalone .thread { padding-top: 16px; }
    body.standalone .composer-shell {
      padding-top: var(--thread-composer-gap);
      padding-bottom: max(34px, calc(env(safe-area-inset-bottom) + 10px));
    }

    /* ===== 浅色外观（theme-light）：仅在 html.theme-light 下生效，深色默认样式不动 ===== */
    :root.theme-light {
      color-scheme: light;
      --bg: #f2f2f7;
      --topbar-bg: #f7f7fa;
      --panel: #ffffff;
      --panel-2: #e8e8ee;
      --text: #1d1d1f;
      --muted: #636369;
      --faint: #8e8e95;
      --line: rgba(0,0,0,.10);
      --user: #e4e4ea;
      --accent: #1d1d1f;
      --ok: #177a4c;
      --keyboard-gap-bg: #f2f2f7;
      --signature-dot-glow: rgba(23,122,76,.16);
    }
    .theme-light .topbar { border-bottom: 1px solid rgba(0,0,0,.14); }
    .theme-light .route-badge,
    .theme-light .permission-badge,
    .theme-light .reasoning-badge,
    .theme-light .model-badge,
    .theme-light .settings-back,
    .theme-light .settings-pro-pill,
    .theme-light .top-control-drag-handle,
    .theme-light .approval-action { border-color: rgba(0,0,0,.12); background: rgba(0,0,0,.045); }
    .theme-light .settings-nav-row,
    .theme-light .settings-row,
    .theme-light .notification-guide,
    .theme-light .top-control-setting,
    .theme-light .thread-action-button { background: rgba(0,0,0,.045); }
    .theme-light .settings-nav-row:active { background: rgba(0,0,0,.075); }
    .theme-light .notification-status-card { border-color: rgba(0,0,0,.08); background: rgba(0,0,0,.025); box-shadow: inset 0 1px 0 rgba(255,255,255,.6); }
    .theme-light .notification-status-card.is-ready { border-color: rgba(23,122,76,.16); background: linear-gradient(105deg, rgba(23,122,76,.07), rgba(31,111,208,.035)); }
    .theme-light .notification-status-card.is-error { border-color: rgba(190,70,58,.18); background: rgba(190,70,58,.055); }
    .theme-light .notification-status.is-ready { color: #177a4c; }
    .theme-light .notification-status.is-error { color: #b94336; }
    .theme-light .notification-privacy-note { color: rgba(29,29,31,.52); }
    .theme-light .thread-action-button:active { background: rgba(0,0,0,.085); }
    .theme-light .settings-switch { background: rgba(0,0,0,.16); }
    .theme-light .settings-switch::after { background: #ffffff; box-shadow: 0 2px 8px rgba(0,0,0,.22); }
    .theme-light .settings-pro-pill.is-max {
      color: #352200;
      border-color: rgba(204,143,18,.36);
      box-shadow: 0 0 18px rgba(214,154,28,.18), inset 0 1px 0 rgba(255,255,255,.78);
    }
    .theme-light .settings-entitlement-chip {
      color: #8a5a00;
      border-color: rgba(176,112,12,.24);
      background: rgba(255,189,46,.16);
    }
    .theme-light .settings-input,
    .theme-light .approval-input,
    .theme-light .thread-rename-input { border-color: rgba(0,0,0,.14); background: rgba(0,0,0,.05); }
    .theme-light .thread-rename-actions button { background: rgba(0,0,0,.06); }
    .theme-light .thread-menu { background: rgba(252,252,253,.98); box-shadow: 0 18px 60px rgba(31,35,40,.18), 10px 0 42px rgba(31,35,40,.06); }
    .theme-light .new-thread-card {
      border-color: rgba(0,0,0,.12);
      background: linear-gradient(145deg, rgba(31,111,208,.035), transparent 38%), rgba(252,252,253,.985);
      box-shadow: 0 22px 72px rgba(31,35,40,.20), inset 0 1px 0 rgba(255,255,255,.72);
    }
    .theme-light .new-thread-back,
    .theme-light .new-thread-close,
    .theme-light .new-thread-action { border-color: rgba(0,0,0,.12); background: rgba(0,0,0,.045); }
    .theme-light .new-thread-row,
    .theme-light .new-thread-option { border-color: rgba(0,0,0,.065); background: rgba(0,0,0,.035); }
    .theme-light .new-thread-row:active:not(:disabled),
    .theme-light .new-thread-option:active { border-color: rgba(31,111,208,.15); background: rgba(31,111,208,.065); }
    .theme-light .new-thread-option.is-current { border-color: rgba(31,111,208,.22); background: rgba(31,111,208,.075); }
    .theme-light .new-thread-row-icon,
    .theme-light .new-thread-option-icon { border-color: rgba(31,111,208,.14); background: rgba(31,111,208,.075); color: #1f6fd0; }
    .theme-light .new-thread-row[data-new-thread-picker="runtime"] .new-thread-row-icon,
    .theme-light .new-thread-option[data-new-thread-kind="runtime"] .new-thread-option-icon { border-color: rgba(23,122,76,.15); background: rgba(23,122,76,.07); color: #177a4c; }
    .theme-light .new-thread-row[data-new-thread-picker="branch"] .new-thread-row-icon,
    .theme-light .new-thread-option[data-new-thread-kind="branch"] .new-thread-option-icon { border-color: rgba(176,106,20,.16); background: rgba(176,106,20,.075); color: #9a6112; }
    .theme-light .new-thread-status { border-color: rgba(31,111,208,.15); background: rgba(31,111,208,.065); color: #155fb8; }
    .theme-light .new-thread-status.is-error { border-color: rgba(190,70,58,.20); background: rgba(190,70,58,.06); color: #b94336; }
    .theme-light .new-thread-action.primary { border-color: rgba(31,111,208,.28); background: linear-gradient(135deg, rgba(31,111,208,.16), rgba(38,153,197,.10)); color: #155fb8; }
    .theme-light .new-thread-option-check { border-color: rgba(0,0,0,.14); }
    .theme-light .new-thread-option.is-current .new-thread-option-check { border-color: #1f6fd0; background: #1f6fd0; color: #fff; }
    .theme-light .new-thread-option-badge { border-color: rgba(176,106,20,.20); background: rgba(176,106,20,.08); color: #8f5b11; }
    .theme-light .new-thread-empty { border-color: rgba(0,0,0,.11); }
    .theme-light .new-thread-worktree-confirm-card {
      background: linear-gradient(180deg, rgba(255,255,255,.97), rgba(247,248,251,.95));
      border-color: rgba(0,0,0,.08);
      box-shadow: 0 18px 42px rgba(31,35,40,.16);
    }
    .theme-light .settings-card { border-color: rgba(0,0,0,.12); background: rgba(252,252,253,.98); box-shadow: 0 20px 70px rgba(31,35,40,.20); }
    .theme-light .thread-action-card { border-color: rgba(0,0,0,.11); background: rgba(252,252,253,.98); box-shadow: 0 20px 70px rgba(31,35,40,.20); }
    .theme-light .approval-sheet { border-color: rgba(0,0,0,.13); background: rgba(252,252,253,.98); box-shadow: 0 18px 54px rgba(31,35,40,.20); }
    .theme-light .reasoning-menu-card { border-color: rgba(0,0,0,.13); background: rgba(252,252,253,.97); }
    .theme-light .reasoning-speed-divider { background: rgba(0,0,0,.10); }
    .theme-light .reasoning-speed-toggle.is-loading,
    .theme-light .reasoning-speed-toggle.is-unsupported {
      border-color: rgba(0,0,0,.10);
      background: rgba(0,0,0,.035);
    }
    .theme-light .permission-menu-card { border-color: rgba(0,0,0,.13); background: linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,0)), rgba(252,252,253,.98); box-shadow: 0 20px 52px rgba(31,35,40,.18), inset 0 1px 0 rgba(255,255,255,.6); }
    .theme-light .model-menu-card { border-color: rgba(23,122,76,.26); background: linear-gradient(rgba(23,122,76,.05), rgba(23,122,76,.05)), #f2faf5; box-shadow: 0 18px 42px rgba(31,35,40,.16); }
    .theme-light .model-menu-item.is-current { box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }
    .theme-light .queued-send-card { border-color: rgba(0,0,0,.12); background: #ffffff; box-shadow: 0 6px 22px rgba(31,35,40,.08); color: rgba(28,28,30,.78); }
    .theme-light .queued-send-card.is-sending { border-color: rgba(176,106,20,.55); }
    .theme-light .queued-send-card.is-promoting { border-color: rgba(23,122,76,.5); }
    .theme-light .queued-send-card-summary { color: rgba(28,28,30,.78); }
    .theme-light .queued-send-promote { color: #177a4c; border-color: rgba(23,122,76,.45); background: rgba(23,122,76,.10); }
    .theme-light .notice-pill { border-color: rgba(23,122,76,.26); background: rgba(232,247,239,.95); box-shadow: 0 10px 34px rgba(31,35,40,.12); }
    .theme-light .thread-section + .thread-section { border-top-color: rgba(0,0,0,.08); }
    .theme-light .project-header:hover,
    .theme-light .project-header:active { background: transparent; }
    .theme-light .project-header:hover::before,
    .theme-light .project-header:active::before { background: rgba(0,0,0,.045); }
    .theme-light .thread-option[aria-current="true"]::before { background: rgba(0,0,0,.045); }
    .theme-light .thread-option.is-project-toggle:hover::before,
    .theme-light .thread-option.is-project-toggle:active::before { background: rgba(0,122,255,.10); }
    .theme-light .thread-option-spinner { border-color: rgba(0,0,0,.18); }
    .theme-light .bubble .file-attachment-preview { border-color: rgba(0,0,0,.11); background: rgba(0,0,0,.045); }
    .theme-light .bubble a.file-attachment-preview:active { background: rgba(0,0,0,.08); }
    .theme-light .process-tool { border-color: rgba(0,0,0,.08); background: rgba(0,0,0,.035); }
    .theme-light .steps li { border-bottom-color: rgba(0,0,0,.07); }
    .theme-light .message.user .bubble.is-copyable { -webkit-tap-highlight-color: rgba(0,0,0,.10); }
    .theme-light .markdown-body .table-scroll { border-color: rgba(0,0,0,.13); }
    .theme-light .markdown-body table { background: rgba(0,0,0,.02); }
    .theme-light .markdown-body th { background: rgba(0,0,0,.06); }
    .theme-light .markdown-body th, .theme-light .markdown-body td { border-color: rgba(0,0,0,.13); }
    .theme-light .markdown-body tr:nth-child(even) td { background: rgba(0,0,0,.025); }
    .theme-light .markdown-body a { color: #155fb8; }
    .theme-light .memory-citation-card { box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 12px 34px rgba(31,35,40,.12); }
    .theme-light .memory-citation-item { border-color: rgba(0,0,0,.08); background: rgba(0,0,0,.04); }
    .theme-light .memory-citation-path { color: rgba(28,28,30,.86); }
    .theme-light .send-btn { color: #f5f5f7; }
    .theme-light .context-quick-card { color: #155fb8; background: linear-gradient(rgba(31,111,208,.08), rgba(31,111,208,.08)), #eaf2fb; box-shadow: 0 10px 34px rgba(31,35,40,.14), 0 8px 22px rgba(72,135,190,.12); }
    .theme-light .context-quick-card:active { background: linear-gradient(rgba(31,111,208,.14), rgba(31,111,208,.14)), #eaf2fb; }
    .theme-light .context-ring::after { box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }
    .theme-light .context-status.is-unknown .context-ring { background: conic-gradient(rgba(99,99,105,.38) 0deg, rgba(0,0,0,.12) 0deg); }
    /* 蓝色系文字在浅色下加深 */
    .theme-light .route-badge.is-relay,
    .theme-light .permission-badge.mode-auto,
    .theme-light .reasoning-badge.mode-low,
    .theme-light .permission-menu-item.mode-auto,
    .theme-light .reasoning-menu-item.mode-low,
    .theme-light .new-thread-btn,
    .theme-light .thread-option.is-pinned,
    .theme-light .approval-action.submit { color: #155fb8; }
    .theme-light .thread-current-pin,
    .theme-light .pinned-thread-option,
    .theme-light .pinned-thread-icon,
    .theme-light .thread-title-pin,
    .theme-light .thread-action-button.is-blue,
    .theme-light .thread-rename-actions .save { color: #1f6fd0; }
    .theme-light .thread-option-dot {
      background: #1f6fd0;
      box-shadow: 0 0 7px 1.5px rgba(31,111,208,.36);
    }
    .theme-light .project-status-dot.is-blue {
      --dot-color: #1f6fd0;
      --dot-shadow-rest: 0 0 7px 1.5px rgba(31,111,208,.36);
      --dot-shadow-dim: 0 0 6px 1px rgba(31,111,208,.26);
      --dot-shadow-peak: 0 0 10px 2px rgba(31,111,208,.46);
    }
    .theme-light .project-status-dot.is-yellow {
      --dot-color: #b87414;
      --dot-shadow-rest: 0 0 7px 1.5px rgba(184,116,20,.34);
      --dot-shadow-dim: 0 0 6px 1px rgba(184,116,20,.24);
      --dot-shadow-peak: 0 0 10px 2px rgba(184,116,20,.44);
    }
    .theme-light body.dot-blue .title-dot { --dot-color: #1f6fd0; }
    /* 琥珀/红色系文字在浅色下加深 */
    .theme-light .reasoning-badge,
    .theme-light .reasoning-badge.mode-high,
    .theme-light .reasoning-menu-item.mode-high,
    .theme-light .model-badge.is-official,
    .theme-light .model-menu-item.source-official,
    .theme-light .keep-awake-btn.is-on,
    .theme-light .queued-send-card.is-sending .queued-send-card-state { color: #9a6a12; }
    .theme-light .permission-badge.mode-full,
    .theme-light .permission-menu-item.mode-full,
    .theme-light .queued-send-card-state { color: #b05f16; }
    .theme-light .reasoning-badge.mode-xhigh,
    .theme-light .reasoning-menu-item.mode-xhigh,
    .theme-light .approval-action.deny,
    .theme-light .thread-action-button.is-danger,
    .theme-light .process-error,
    .theme-light .notice-pill.error { color: #c2483c; }
    .theme-light .permission-badge.mode-request,
    .theme-light .permission-menu-item.mode-request { color: #5b5b61; }
    /* 签名与彩色流动在浅色下的可读性 */
    .theme-light .composer-signature { background: linear-gradient(92deg, rgba(28,28,30,.66) 0%, rgba(23,122,76,.78) 55%, rgba(31,111,208,.72) 100%); -webkit-background-clip: text; background-clip: text; }
    .theme-light body.signature-plain .composer-signature { text-shadow: 0 0 16px rgba(0,0,0,.06); }
    .theme-light body.pro-mode .icon-btn { background: linear-gradient(92deg, rgba(28,28,30,.72) 0%, rgba(23,122,76,.82) 100%); -webkit-background-clip: text; background-clip: text; }
    .theme-light body.pro-mode .thread-menu { background: linear-gradient(rgba(252,252,253,.98), rgba(252,252,253,.98)); }
    .theme-light .composer { background: #ffffff; border-color: rgba(0,0,0,.12); box-shadow: 0 6px 22px rgba(31,35,40,.08); }
    .theme-light .permission-menu-item-desc { color: rgba(28,28,30,.56); }
    .theme-light .approval-content { color: rgba(28,28,30,.92); }
    .theme-light .thread-option-spinner { border-top-color: rgba(28,28,30,.85); }
    .theme-light body.signature-plain .composer-signature { color: rgba(28,28,30,.62); }
    .theme-light .settings-switch.is-on { background: linear-gradient(92deg, rgba(31,111,208,.78), rgba(23,138,84,.82), rgba(176,106,20,.66)); }
    .theme-light .settings-btn { border-color: rgba(0,0,0,.14); background: rgba(0,0,0,.05); color: rgba(28,28,30,.62); }
    .theme-light .settings-nav-icon {
      color: var(--settings-icon-color);
      background: var(--settings-icon-bg-light);
      border-color: var(--settings-icon-border-light);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
    }
    .theme-light .settings-btn:active { background: rgba(0,0,0,.09); }
    .theme-light .thread-button:active { background: rgba(0,0,0,.05); }
    .theme-light body.pro-mode textarea::placeholder { color: rgba(31,111,208,.62); text-shadow: none; }
    .theme-light body.pro-mode .composer { border-color: transparent; box-shadow: none; }
    .theme-light body.pro-mode .queued-send-card { border-color: transparent; box-shadow: none; }