:root {
    --bg: #faf9f5;
    --card: #ffffff;
    --panel: #f0eee6;
    --line: #e8e5dc;
    --text: #2b2a27;
    --dim: #8a867c;
    --accent: #c96442;        
    --accent-soft: #d97757;
    --user-bubble: #f0eee6;
    --sage: #96B08F;          
    --sage-track: #E7EDE2;
    --pink-track: #F8E5DE;
    --green: #2e7d43;
    --red: #c0392b;
    --amber: #e3a13a;         
    --amber-track: #f5e6c8;
    --red-track: #f6d8d4;
    --overlay: rgba(40, 38, 34, .4);
    --serif: SerifNum, "Songti SC", "Noto Serif SC", Georgia, serif;
    --glass: color-mix(in srgb, var(--card) 70%, transparent);  /* 悬浮层玻璃度（顶栏/菜单——内容条 8/3 改用 --panel 实色） */
    --pink: #E5A192;          
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) {
      --bg: #262624; --card: #30302e; --panel: #383836; --line: #3d3d3a;
      --text: #f5f4ef; --dim: #a3a099; --user-bubble: #35353260;
      --sage: #A8C0A0; --sage-track: #3A423A; --pink-track: #4A3B34;
      --green: #6fbf85; --red: #e07a6a;
      --amber: #e8b45c; --amber-track: #4a4232; --red-track: #4d3a36;
      --overlay: rgba(0, 0, 0, .55);
    }
}
html[data-theme="dark"] {
      --bg: #262624; --card: #30302e; --panel: #383836; --line: #3d3d3a;
      --text: #f5f4ef; --dim: #a3a099; --user-bubble: #35353260;
      --sage: #A8C0A0; --sage-track: #3A423A; --pink-track: #4A3B34;
      --green: #6fbf85; --red: #e07a6a;
      --amber: #e8b45c; --amber-track: #4a4232; --red-track: #4d3a36;
      --overlay: rgba(0, 0, 0, .55);
    }
  
  @font-face {
    font-family: SerifNum;
    src: local("Helvetica Neue"), local("Helvetica");
    unicode-range: U+0030-0039, U+002F, U+002E, U+003A;
  }
  * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
  html, body {
    margin: 0; height: 100%;
    overflow-x: hidden; max-width: 100vw;   
    background: var(--bg); color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans SC", "Segoe UI", sans-serif;
    font-size: 15.5px; line-height: 1.72;
    font-variant-numeric: tabular-nums;   
    -webkit-font-smoothing: antialiased;
    overscroll-behavior: none;
  }
  body { display: flex; flex-direction: column; }
  button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }

  .ic { display: inline-flex; align-items: center; justify-content: center; flex: none; }
  .ic svg { width: 100%; height: 100%; display: block; }

  #toastLane {
    position: fixed; z-index: 400; left: 10px; right: 10px;
    top: calc(env(safe-area-inset-top) + 8px);
    display: flex; flex-direction: column; gap: 8px; pointer-events: none;
  }
  
  #doingLine { display: none; margin: 0 auto 7px; max-width: 720px;
    pointer-events: none; }
  #doingLine.on { display: flex; }
  #doingLine .pill { display: inline-flex; align-items: center; gap: 8px;
    max-width: 100%; padding: 7px 14px; border-radius: 999px;
    font-size: 14px; color: var(--dim); font-variant-numeric: tabular-nums;
    white-space: nowrap; overflow: hidden;
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    box-shadow: 0 2px 14px rgba(0,0,0,.07), inset 0 0 0 1px rgba(255,255,255,.5); }
  
  #doingLine .w { font-weight: 600; color: var(--accent); overflow: hidden;
    text-overflow: ellipsis; }
  #doingLine .en { color: var(--accent); opacity: .55; font-size: 12px;
    font-weight: 600; flex: none; }
  #doingLine .t { flex: none; color: var(--dim); }
  #doingLine .t { opacity: .75; }

  .toast {
    display: flex; align-items: center; gap: 12px;
    padding: 13px 14px 13px 16px; border-radius: 20px;
    pointer-events: auto; cursor: pointer;
    transform: translateY(-140%); opacity: 0;
    transition: transform .42s cubic-bezier(.22,1.1,.36,1), opacity .28s ease;
  }
  .toast.in { transform: translateY(0); opacity: 1; }
  .toast .ti { flex: none; width: 22px; height: 22px; color: var(--dim); }
  .toast .ti svg { width: 100%; height: 100%; stroke-width: 1.8; }
  .toast .tx { flex: 1; min-width: 0; }
  .toast .t1 { font-size: 14.5px; font-weight: 700; line-height: 1.35; }
  .toast .t2 { font-size: 13px; color: var(--dim); line-height: 1.45; margin-top: 1px;
    word-break: break-word; }
  .toast .tx-close { flex: none; width: 26px; height: 26px; color: var(--dim); opacity: .7; }
  .toast .tx-close svg { width: 100%; height: 100%; stroke-width: 1.8; }

  .glass,
  .composer, #nkPop, .nk-say, .board-toggle, .menuCard, .crow, .songcard {
    
    background: var(--glass);
    background: linear-gradient(180deg,
      color-mix(in srgb, var(--card) 76%, transparent),
      color-mix(in srgb, var(--card) 58%, transparent));
    -webkit-backdrop-filter: blur(24px) saturate(1.9) brightness(1.04);
    backdrop-filter: blur(24px) saturate(1.9) brightness(1.04);
    border: 0;
    box-shadow:
      0 10px 34px rgba(0,0,0,.09),              /* 外阴影：浮起来 */
      0 1px 3px rgba(0,0,0,.05),                /* 贴地那道近影 */
      inset 0 1px 0 rgba(255,255,255,.92),      /* 顶部内高光：上边缘那道光 */
      inset 0 -7px 18px rgba(255,255,255,.34),  /* 底部内反光：光打在下沿的回弹 */
      inset 0 0 0 1px rgba(255,255,255,.44);    /* 一圈细描边：厚度的轮廓 */
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .glass,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .songcard,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .composer,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #nkPop,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .nk-say,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .board-toggle,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .menuCard,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .crow {
      background: var(--glass);
      background: linear-gradient(180deg,
        color-mix(in srgb, var(--card) 74%, transparent),
        color-mix(in srgb, var(--card) 56%, transparent));
      box-shadow:
        0 12px 38px rgba(0,0,0,.42),
        0 1px 3px rgba(0,0,0,.3),
        inset 0 1px 0 rgba(255,255,255,.16),
        inset 0 -7px 18px rgba(255,255,255,.045),
        inset 0 0 0 1px rgba(255,255,255,.09);
    }
}
html[data-theme="dark"] .glass,
  html[data-theme="dark"] .songcard,
  html[data-theme="dark"] .composer,
  html[data-theme="dark"] #nkPop,
  html[data-theme="dark"] .nk-say,
  html[data-theme="dark"] .board-toggle,
  html[data-theme="dark"] .menuCard,
  html[data-theme="dark"] .crow {
      background: var(--glass);
      background: linear-gradient(180deg,
        color-mix(in srgb, var(--card) 74%, transparent),
        color-mix(in srgb, var(--card) 56%, transparent));
      box-shadow:
        0 12px 38px rgba(0,0,0,.42),
        0 1px 3px rgba(0,0,0,.3),
        inset 0 1px 0 rgba(255,255,255,.16),
        inset 0 -7px 18px rgba(255,255,255,.045),
        inset 0 0 0 1px rgba(255,255,255,.09);
    }

  /* ============ 顶栏（悬浮玻璃，消息从底下滑过去） ============ */
  header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 20;
    padding: 8px 12px 20px; padding-top: calc(8px + env(safe-area-inset-top));
    display: flex; align-items: center; gap: 8px;
    
    background: linear-gradient(to bottom,
      color-mix(in srgb, var(--bg) 88%, transparent) 0%,
      color-mix(in srgb, var(--bg) 55%, transparent) 55%,
      transparent 100%);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 52%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 52%, transparent 100%);
  }
  .iconbtn {
    width: 40px; height: 40px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    flex: none; color: var(--text);
  }
  .iconbtn .ic { width: 18px; height: 18px; }
  
  header .iconbtn.glass {
    background: transparent;
    border: none; box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .title { flex: 1; text-align: center; min-width: 0; }
  .title h1 { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.3; }
  .title .sub { font-size: 12px; color: var(--dim); line-height: 1.2; }

  /* ============ 消息流 ============ */
  
  #log {
    flex: 1; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain;
    padding: calc(76px + env(safe-area-inset-top)) 18px 150px;
    display: flex; flex-direction: column; gap: 18px;
  }
  #log .row.me + .row:not(.me) { margin-top: 12px; }
  /* 顶上那颗「看更早的」——老账都在，按一下捞 400 行 */
  #olderBtn {
    align-self: center; border: none; cursor: pointer;
    background: rgba(128,128,128,.12); color: inherit; opacity: .72;
    font-size: 13px; padding: 6px 16px; border-radius: 14px;
  }
  .row { width: 100%; max-width: 720px; margin: 0 auto; padding: 0 4px; }
  .row.me { display: flex; justify-content: flex-end; }
  .bubble {
    background: var(--user-bubble); /* fallback: 不支持 color-mix 的旧浏览器仍是实色，气泡不消失 */
    background: color-mix(in srgb, var(--user-bubble) 55%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.8);
    backdrop-filter: blur(20px) saturate(1.8);
    border: 1px solid rgba(255,255,255,.35); /* fallback: 1px 亮光边 */
    border: 1px solid color-mix(in srgb, #fff 45%, transparent);
    border-radius: 18px; padding: 11px 17px;
    box-shadow: 0 4px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.5);
    max-width: 88%; white-space: pre-wrap; word-break: break-word;
  }
  .gu {
    background: var(--card); /* fallback */
    background: color-mix(in srgb, var(--card) 55%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.8);
    backdrop-filter: blur(20px) saturate(1.8);
    border: 1px solid rgba(255,255,255,.35); /* fallback: 1px 亮光边 */
    border: 1px solid color-mix(in srgb, #fff 45%, transparent);
    border-radius: 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,.07), inset 0 1px 0 rgba(255,255,255,.45);
    white-space: pre-wrap; word-break: break-word;
  }
  /* ---------- 分支树（栖燃 9-11晚）：‹k/n›切换器 / 行尾菜单 / 树抽屉 ---------- */
  .bwrap { position: relative; }
  .bsw {
    display: inline-flex; align-items: center; gap: 2px; margin-top: 5px;
    font-size: 11px; opacity: .55; transition: opacity .2s;
  }
  .bsw:hover { opacity: 1; }
  .bsw button {
    border: none; background: rgba(128,128,128,.14); color: inherit; cursor: pointer;
    width: 22px; height: 18px; border-radius: 9px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center; padding: 0;
  }
  .bsw button:disabled { opacity: .35; cursor: default; }
  .bsw .n { min-width: 30px; text-align: center; font-size: 10.5px; opacity: .8; }
  .bmenu {
    display: inline-flex; gap: 2px; margin-top: 5px; opacity: 0; transition: opacity .2s;
  }
  .row:hover .bmenu, .bmenu:focus-within { opacity: .75; }
  .bmenu button {
    border: none; background: rgba(128,128,128,.12); color: inherit; cursor: pointer;
    height: 22px; padding: 0 9px; border-radius: 11px; font-size: 11px;
    display: inline-flex; align-items: center; gap: 4px;
  }
  .bmenu button:hover { background: rgba(128,128,128,.22); }
  #treeSheet .tbody { padding: 14px 16px 20px; font-size: 13px; }
  .tnode {
    display: flex; align-items: baseline; gap: 8px; padding: 6px 8px;
    border-radius: 10px; cursor: pointer; line-height: 1.45;
  }
  .tnode:hover { background: rgba(128,128,128,.08); }
  .tnode.on { background: rgba(201,100,66,.12); }
  .tnode .tseq { font-size: 10.5px; opacity: .45; flex: none; min-width: 30px; }
  .tnode .tkind { flex: none; font-size: 10.5px; opacity: .6; }
  .tnode.on .tkind { color: #c96442; opacity: 1; }
  .tnode .tprev { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tnode.branchroot { margin-left: 18px; border-left: 2px solid rgba(201,100,66,.35); }
  .tnode .tgap { flex: none; width: 14px; }
  .gu img.chatimg, .bubble img.chatimg {
    max-width: min(240px, 70%); border-radius: 14px; display: block; margin: 6px 0;
  }
  
  .mdh { font-family: var(--serif); font-weight: 700; line-height: 1.4; margin: 10px 0 6px; }
  .mdh1 { font-size: 27px; }
  .mdh2 { font-size: 22px; }
  .mdh3 { font-size: 18.5px; }
  
  .gu strong, .bubble strong { font-weight: 700; }
  .gu a, .bubble a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
  .gu s, .bubble s { opacity: .55; }
  .mdcode {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .9em; padding: 1px 5px; border-radius: 5px;
    background: rgba(128,128,128,.15);
  }
  
  .cbk { margin: 10px 0; border-radius: 16px; overflow: hidden;
    background: var(--card); box-shadow: inset 0 0 0 1px var(--line); }
  .cbk-h { display: flex; align-items: center; gap: 2px;
    padding: 9px 10px 8px 15px; box-shadow: inset 0 -1px 0 var(--line); }
  .cbk-h .lang { flex: 1; min-width: 0; font-size: 12.5px; color: var(--dim);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
  .cbk-h button { flex: none; width: 30px; height: 30px; padding: 6px;
    background: none; border: 0; color: var(--dim); cursor: pointer;
    border-radius: 8px; display: flex; align-items: center; justify-content: center; }
  .cbk-h button svg { width: 100%; height: 100%; stroke-width: 1.8; }
  .cbk-h button:active { background: rgba(128,128,128,.12); }
  
  .cbk-h button.done { color: var(--dim); }
  .cbk pre { margin: 0; padding: 13px 15px 15px; overflow-x: auto;
    -webkit-overflow-scrolling: touch; }
  .cbk code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12.5px; line-height: 1.7; white-space: pre;
    background: none; padding: 0; color: var(--text); }
  /* 点右边那个展开：整段代码摊到全屏看，长命令不用左右拖 */
  .cbk-full { position: fixed; inset: 0; z-index: 300; display: flex;
    flex-direction: column; background: var(--bg);
    padding: calc(env(safe-area-inset-top) + 12px) 0 calc(env(safe-area-inset-bottom) + 12px); }
  .cbk-full .cbk-h { box-shadow: inset 0 -1px 0 var(--line); }
  .cbk-full pre { flex: 1; overflow: auto; }
  .cbk-full code { white-space: pre-wrap; word-break: break-all; }
  .gu .caret {
    display: inline-block; width: 7px; height: 1.05em; vertical-align: -2px;
    background: var(--accent-soft); border-radius: 1px; animation: blink 1s steps(2) infinite;
  }
  @keyframes blink { 50% { opacity: 0; } }

  .toolline .ic { width: 15px; height: 15px; }
  .grabber {
    width: 38px; height: 5px; border-radius: 3px; background: var(--line);
    margin: 10px auto 0; flex: none;
  }
  .thinkbody {
    font-size: 15.5px; color: var(--text); line-height: 1.85;
    white-space: pre-wrap; word-break: break-word; padding: 6px 4px 14px;
  }

  .toolline {
    color: var(--dim); font-size: 14.5px; cursor: pointer; user-select: none;
    display: flex; align-items: center; gap: 6px; min-height: 24px;
    max-width: 100%;
  }
  .toolline:active { opacity: .6; }
  
  .toolline .lbl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    min-width: 0; flex: 1 1 auto; }
  .toolline .lbl b { font-weight: 500; color: var(--dim); }
  .toolline .plus { color: var(--green); }
  .toolline .minus { color: var(--red); }
  .toolline .chev { flex: none; font-size: 13px; }
  .toolline .spin {
    flex: none; width: 13px; height: 13px; border-radius: 50%;
    border: 2px solid var(--line); border-top-color: var(--accent-soft);
    animation: rot 1s linear infinite;
  }
  @keyframes rot { to { transform: rotate(360deg); } }

  .sys { font-size: 13px; color: var(--dim); text-align: center; }
  .err {
    font-size: 13px; color: var(--red);
    border-left: 2px solid var(--red); padding-left: 12px; white-space: pre-wrap;
  }

  #pet {
    display: block;  /* pet素材34e2a40已补齐，经小羽0917批准复活 [ds] */   /* 宠物挂件素材没跟着仓库带，暂时隐藏，免得空图标占个灰框 */
    position: fixed; right: 8px; bottom: calc(118px + env(safe-area-inset-bottom));
    width: 144px; height: 144px; z-index: 40; cursor: grab;
    -webkit-user-select: none; user-select: none; touch-action: none;
  }
  #pet:active { cursor: grabbing; }
  #pet.pet-off { display: none; }
  #pet img { width: 100%; height: 100%; display: block; pointer-events: none; }

  /* ============ 输入区 ============ */
  footer {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    padding: 6px 12px calc(10px + env(safe-area-inset-bottom));
    background: transparent; pointer-events: none;
  }
  /* padding-bottom 由 JS 跟着输入卡实际高度走，字永远不许被玻璃压住 */
  
  .composer {
    max-width: 720px; margin: 0 auto; pointer-events: auto;
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, .55);
    box-shadow: 0 2px 18px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.5);
    padding: 12px 14px 10px;
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #nkPop {
      border: 1px solid rgba(255,255,255,.12);
      box-shadow: 0 8px 28px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
    }
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #nkPop button {
      background: rgba(255,255,255,.1);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
    }
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .nk-say {
      background: var(--glass);
      border: 1px solid rgba(255,255,255,.12);
      box-shadow: 0 2px 18px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.08);
    }
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .composer {
      background: var(--glass);
      border: 1px solid rgba(255, 255, 255, .12);
      box-shadow: 0 2px 18px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.08);
    }
}
html[data-theme="dark"] .composer {
      background: var(--glass);
      border: 1px solid rgba(255, 255, 255, .12);
      box-shadow: 0 2px 18px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.08);
    }
  #attachStrip { display: none; gap: 8px; padding-bottom: 8px; flex-wrap: wrap; }
  #attachStrip .att {
    position: relative; width: 54px; height: 54px; border-radius: 10px; overflow: hidden;
    border: 1px solid var(--line); background: var(--panel);
    display: flex; align-items: center; justify-content: center; font-size: 11px; color: var(--dim);
  }
  #attachStrip .att img { width: 100%; height: 100%; object-fit: cover; }
  #attachStrip .att .x {
    position: absolute; top: 2px; right: 2px; width: 18px; height: 18px; border-radius: 50%;
    background: rgba(0,0,0,.55); color: #fff;
    display: flex; align-items: center; justify-content: center;
  }
  #box {
    width: 100%; border: 0; outline: 0; resize: none; background: transparent;
    color: var(--text); font: inherit; line-height: 1.6;
    max-height: 160px; padding: 2px 2px 8px;
  }
  #box::placeholder { color: var(--dim); }
  .ctlrow { display: flex; align-items: center; gap: 8px; }
  .pill {
    display: flex; align-items: center; gap: 6px;
    background: var(--panel); border-radius: 999px;
    padding: 7px 14px; font-size: 14px; color: var(--text);
  }
  .pill:active { opacity: .7; }
  .pill .ic { width: 14px; height: 14px; }
  #plusBtn { width: 36px; height: 36px; border-radius: 50%; background: var(--panel); flex: none; display: flex; align-items: center; justify-content: center; }
  #plusBtn .ic { width: 17px; height: 17px; }
  #stickerBtn { width: 36px; height: 36px; border-radius: 50%; background: var(--panel); flex: none; display: flex; align-items: center; justify-content: center; }
  #stickerBtn .ic { width: 18px; height: 18px; }
  .sticker-search { padding: 10px 16px 4px; }
  .sticker-search input {
    width: 100%; box-sizing: border-box; padding: 9px 12px;
    border: 1px solid var(--line); border-radius: 10px;
    background: var(--panel); color: inherit; font: inherit; font-size: 14px;
  }
  .sticker-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 8px 12px 16px; }
  .sticker-grid img {
    width: 100%; height: 76px; object-fit: contain; border-radius: 10px;
    background: transparent; cursor: pointer; padding: 2px; box-sizing: border-box;
  }
  .sticker-grid .sticker-cell:not(.custom) img { outline: none; }
  .sticker-grid img:active { transform: scale(.96); }
  .hw-heart {
  border: none; background: none; font-size: 13px; cursor: pointer;
  padding: 2px 4px; opacity: .75; transition: opacity .15s;
  filter: drop-shadow(0 2px 3px rgba(140,110,120,.25));
}
.hw-heart:hover { opacity: 1; }
.hw-shade { position: fixed; inset: 0; background: rgba(20,18,16,.35); z-index: 90; }
.hw-card {
  position: fixed; left: 50%; top: 42%; transform: translate(-50%,-50%);
  width: min(78vw, 340px); background: var(--card, #fffdf8); border-radius: 18px;
  padding: 18px 18px 16px; box-shadow: 0 18px 50px rgba(60,40,20,.25); z-index: 91;
}
.hw-tt { font-size: 13px; color: var(--accent, #a58); letter-spacing: 1px; margin-bottom: 10px; opacity: .85; }
.hw-bd { font-size: 15.5px; line-height: 1.75; color: var(--text, #3a352e); white-space: pre-wrap; }
  .wish-list { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
  .wish-item { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; }
  .wish-item.imprint { background: linear-gradient(135deg, rgba(255,200,220,.18), rgba(255,180,210,.10)); border-color: #e8b4cf; }
  .wish-text { font-size: 14px; line-height: 1.5; }
  .wish-ops { display: flex; gap: 8px; margin-top: 8px; align-items: center; }
  .wish-op { font-size: 12px; padding: 3px 10px; border-radius: 99px; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; }
  .wish-op.grant { border-color: #7fb881; color: #4a7a4e; }
  .wish-op.mark { border-color: #d89bc0; color: #a8628e; }
  .wish-op.del { color: #b0655c; border-color: #d3a49e; margin-left: auto; }
  .wish-status { font-size: 11px; color: var(--ink2); }
  .wish-btn.draw { border-color: #c9a86c; color: #8a6d3b; background: rgba(255,220,160,.12); }
  .wish-filter-bar { display: flex; gap: 6px; margin-top: 10px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .wish-filter { font-size: 12px; padding: 4px 12px; border-radius: 99px; border: 1px solid var(--line); background: transparent; color: var(--ink2); cursor: pointer; white-space: nowrap; }
  .wish-filter.active { background: var(--card); color: var(--ink); border-color: var(--ink2); font-weight: 600; }
  .wish-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
  .wish-author { font-size: 11px; color: var(--ink2); font-weight: 600; }
  .wish-time { font-size: 10px; color: var(--ink2); opacity: .7; }
  .wish-item.wish-fulfilled { background: linear-gradient(135deg, rgba(180,220,180,.14), rgba(160,210,170,.08)); border-color: #a8c9a8; }
  .wish-item.wish-released { opacity: .55; }
  .wish-legend { font-size: 12px; color: var(--ink2); margin-top: 14px; }
.saybtn {
    width: 26px; height: 26px; border-radius: 50%; margin: 2px 0 0 4px;
    background: var(--panel); color: var(--dim); flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity .15s;
  }
  .row:hover .saybtn, .saybtn:focus { opacity: 1; }
  .saybtn .ic { width: 13px; height: 13px; }
  .ctlrow .gap { flex: 1; }
  #send {
    flex: none; width: 38px; height: 38px; border-radius: 50%;
    background: var(--accent); color: #fff;
    display: flex; align-items: center; justify-content: center;
  }
  #send .ic { width: 17px; height: 17px; }
  #send:disabled { opacity: .35; }
  
  #send.stop { background: var(--panel); box-shadow: inset 0 0 0 1px var(--line); }
  #send.stop .ic { display: none; }
  #send.stop::after {
    content: ''; width: 13px; height: 13px; border-radius: 3px; background: var(--text);
  }

  #lockWrap {
    position: fixed; inset: 0; z-index: 999; background: var(--bg);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: calc(env(safe-area-inset-top) + 26px) 24px calc(env(safe-area-inset-bottom) + 15vh);
    transition: opacity .55s ease, transform .55s cubic-bezier(.4,0,.2,1);
    touch-action: none; user-select: none; -webkit-user-select: none;
    overflow: hidden;
  }
  
  #lockWrap.gone { opacity: 0; transform: translateY(-26px) scale(1.03); pointer-events: none; }
  .lk-time { font-size: 46px; font-weight: 300; letter-spacing: -.01em; color: var(--text);
    line-height: 1.05; font-variant-numeric: tabular-nums; }
  .lk-date { font-size: 14px; color: var(--dim); margin-top: 5px; letter-spacing: .06em; }
  .lk-art { width: min(52vw, 202px); height: auto; margin: 5vh 0 0;
    animation: lkFloat 6s ease-in-out infinite; }
  @keyframes lkFloat { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-9px) } }
  
  .lk-word { font-family: var(--serif); font-size: 25px; color: var(--text);
    letter-spacing: .005em; margin: 34px 24px 38px; font-weight: 700;
    line-height: 1.42; text-align: center; }

  /* 液态玻璃滑块：半透明 + 背后模糊 + 一道内高光，压在浅底上才有"玻璃"的实感 */
  .lk-track {
    position: relative; width: min(84vw, 320px); height: 62px; border-radius: 999px;
    background: var(--panel);
    box-shadow: inset 0 0 0 1px var(--line);
    overflow: hidden;
  }
  /* 一道慢慢扫过去的光，暗示"往右滑" */
  
  .lk-hint { position: absolute; inset: 0; display: flex; align-items: center;
    justify-content: center; font-size: 14px; color: var(--dim); letter-spacing: .16em;
    padding-left: 46px; transition: opacity .2s; pointer-events: none; }
  
  .lk-knob {
    position: absolute; top: 5px; left: 5px; width: 52px; height: 52px; border-radius: 50%;
    background: var(--text);
    box-shadow: 0 3px 12px rgba(0,0,0,.22);
    display: flex; align-items: center; justify-content: center;
    transition: transform .32s cubic-bezier(.34,1.4,.5,1);
    touch-action: none; cursor: grab;
  }
  .lk-knob.dragging { transition: none; }
  .lk-knob::after {
    content: ''; width: 11px; height: 11px; border-right: 2.4px solid #fff;
    border-top: 2.4px solid #fff; transform: rotate(45deg) translate(-2px, 2px);
  }

  /* ============ 侧边栏 ============ */
  #drawerWrap { position: fixed; inset: 0; z-index: 40; display: none; }
  #drawerWrap.open { display: block; }
  #drawerWrap .shade { position: absolute; inset: 0; background: var(--overlay); opacity: 0; transition: opacity .22s; }
  #drawerWrap.show .shade { opacity: 1; }
  #drawer {
    position: absolute; top: 0; bottom: 0; left: 0; width: min(82vw, 330px);
    background: var(--bg); display: flex; flex-direction: column;
    padding: calc(16px + env(safe-area-inset-top)) 0 calc(14px + env(safe-area-inset-bottom));
    transform: translateX(-102%); transition: transform .24s ease;
    box-shadow: 4px 0 24px rgba(0,0,0,.12);
  }
  #drawerWrap.show #drawer { transform: none; }
  .brand {
    font-family: var(--serif); font-size: 30px; font-weight: 700;
    padding: 6px 24px 18px; letter-spacing: .01em;
  }
  .nav { flex: 1; overflow-y: auto; padding: 0 10px; }
  .nav .item {
    display: flex; align-items: center; gap: 13px; width: 100%;
    padding: 8px 13px; border-radius: 11px; font-size: 16px; text-align: left;
  }
  .nav .item .ic { width: 21px; height: 21px; }
  .nav .item.on { background: var(--panel); }
  .nav .item.dis { color: var(--dim); }
  .nav .item.dis .tag {
    margin-left: auto; font-size: 11px; color: var(--dim);
    border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px;
  }
  
  .nav .sect {
    font-size: 12px; font-weight: 500; letter-spacing: .1em; color: var(--dim);
    padding: 10px 15px 4px; display: flex; align-items: center; gap: 10px;
  }
  .nav .sect.first { padding-top: 6px; }

  .nav .sect i {
    font-style: normal; font-size: 10px; letter-spacing: .05em;
    color: var(--dim); opacity: .75;
  }
  .nav .recent {
    display: block; width: 100%; text-align: left; padding: 10px 14px;
    font-size: 15.5px; border-radius: 10px;
  }
  .nav .recent:active { background: var(--panel); }
  .drawer-foot { flex: none; display: flex; align-items: center; gap: 10px; padding: 10px 20px 0; }
  #drawerNewChat {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px;
    height: 42px; border-radius: 21px; font-size: 14px;
    background: #f5f4ef; color: #262624;
  }
  html[data-theme="dark"] #drawerNewChat { background: #f5f4ef; color: #262624; }
  #drawerNewChat .ic { width: 15px; height: 15px; }
  /* 抽屉窗口条（官克式一行流，2026-09-10合体版） */
  .dw-win {
    display: block; width: 100%; text-align: left; min-height: 36px;
    padding: 7px 12px; border-radius: 11px; font-size: 14.5px;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  }
  .dw-win:active { background: var(--panel); }
  .dw-win.cur { background: var(--panel); font-weight: 600; }
  .dw-win.cur::before { content: "● "; font-size: 9px; vertical-align: 2px; color: var(--dim); }
  #drawerNewChat {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px;
    height: 42px; border-radius: 21px; font-size: 14.5px;
    background: var(--card); border: 1px solid var(--line);
  }
  #drawerNewChat .ic { width: 15px; height: 15px; }
  /* 抽屉里的窗口列表（chatnest式一行流） */
  .dw-win {
    display: flex; align-items: center; gap: 8px; width: 100%;
    min-height: 38px; padding: 7px 12px; border-radius: 11px;
    font-size: 14px; text-align: left; color: var(--ink2);
  }
  .dw-win .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .dw-win.cur { background: var(--panel); color: var(--ink); font-weight: 600; }
  .dw-win .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--line); flex: none; }
  .dw-win.cur .dot { background: #d89bc0; }
  #avatarBtn {
    width: 44px; height: 44px; border-radius: 50%; background: var(--card);
    border: 1px solid var(--line); font-size: 16px; font-weight: 600;
    display: flex; align-items: center; justify-content: center;
  }
  .freshtip { text-align: center; font-size: 13px; color: var(--dim); padding: 34px 30px; line-height: 1.8; }
  
  #gongSheet .sheet { height: 100dvh; max-height: 100dvh; border-radius: 0; }
  /* 换行，不然他的思维链会被挤成气泡旁边一条窄柱（8/3 截图当场看出来的） */
  
  #gongBody { display: flex; flex-direction: column; gap: 18px; }
  #gongBody .gu, #gongBody .bubble { font-size: 15.5px; line-height: 1.75; }
  #gongFoot {
    flex: none; display: flex; align-items: flex-end; gap: 9px;
    padding: 10px 14px calc(12px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
  }
  #gongInput {
    flex: 1; border: 0; outline: 0; background: var(--panel); color: var(--text);
    font: inherit; font-size: 16px; padding: 11px 14px; border-radius: 18px;
    resize: none; max-height: 120px;
  }
  #gongSend {
    width: 38px; height: 38px; border-radius: 50%; flex: none;
    background: var(--accent); color: #fff;
    display: flex; align-items: center; justify-content: center;
  }
  #gongSend .ic { width: 18px; height: 18px; }
  #gongSend:disabled { opacity: .4; }

  .filecard {
    display: inline-flex; align-items: center; gap: 9px; max-width: 100%;
    background: var(--panel); border: 1px solid var(--line); border-radius: 13px;
    padding: 10px 14px; margin: 6px 0; font-size: 14.5px; color: var(--text);
    text-decoration: none; vertical-align: middle;
  }
  .filecard:active { background: var(--card); }
  .filecard .ic { width: 17px; height: 17px; color: var(--dim); flex: none; }
  .filecard span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* ============ 弹层 ============ */
  .sheetWrap { position: fixed; inset: 0; z-index: 50; display: none; }
  .sheetWrap.open { display: flex; align-items: flex-end; justify-content: center; }
  @media (min-width: 700px) { .sheetWrap.open { align-items: center; } }
  .sheetWrap .shade { position: absolute; inset: 0; background: var(--overlay); }
  .sheet {
    position: relative; width: 100%; max-width: 640px;
    max-height: 86vh; min-height: 300px;
    background: var(--bg); border-radius: 24px 24px 0 0;
    display: flex; flex-direction: column;
    animation: rise .22s ease;
  }
  @media (min-width: 700px) { .sheet { border-radius: 24px; max-height: 80vh; } }
  .sheet::after {   /* 往上拽的时候底下不露缝 */
    content: ""; position: absolute; top: 100%; left: 0; right: 0; height: 80px;
    background: var(--bg);
  }
  
  .sheetWrap.page .sheet {
    height: 100dvh; max-height: 100dvh; border-radius: 0;
  }
  .sheetWrap.page .grabber { margin-top: calc(10px + env(safe-area-inset-top)); }
  @keyframes rise { from { transform: translateY(24px); opacity: .6; } }
  .sheet .head {
    flex: none; display: flex; align-items: center; padding: 16px 16px 12px;
  }
  .sheet .head .hbtn {   
    width: 40px; height: 40px; flex: none; color: inherit;
    display: flex; align-items: center; justify-content: center;
  }
  .sheet .head .hbtn .ic { width: 19px; height: 19px; }
  .sheet .head .ht { flex: 1; text-align: center; font-size: 18px; font-weight: 700; padding: 0 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sheet .head .hspace { width: 40px; flex: none; }
  .sheet .body { flex: 1; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 6px 20px calc(20px + env(safe-area-inset-bottom)); }

  .group-label { font-size: 14.5px; color: var(--dim); padding: 14px 4px 8px; }
  .group { background: var(--panel); border-radius: 18px; overflow: hidden; }
  .group .grow {
    display: flex; align-items: center; gap: 13px; width: 100%;
    padding: 15px 18px; font-size: 16px; text-align: left;
  }
  .group .grow + .grow { border-top: 1px solid var(--line); }
  .group .grow .ic { width: 20px; height: 20px; color: var(--text); }
  .group .grow .val { margin-left: auto; color: var(--dim); font-size: 15px; }
  .group .grow .chev { color: var(--dim); font-size: 14px; }
  .group .grow .val + .chev { margin-left: 6px; }
  .group .grow:not(.static):active { background: rgba(0,0,0,.04); }
  .gnote { font-size: 13.5px; color: var(--dim); padding: 12px 6px 0; line-height: 1.6; }

  /* Usage */
  .ucard { background: var(--panel); border-radius: 18px; padding: 18px 20px; }
  .ucard + .ucard, .ucard + .group-label { margin-top: 6px; }
  .urow-top { display: flex; align-items: baseline; justify-content: space-between; }
  .urow-top .un { font-size: 17px; font-weight: 600; }
  .urow-top .up { font-size: 15px; color: var(--dim); }
  .ubar {
    height: 8px; border-radius: 999px; background: var(--amber-track);
    margin: 12px 0 10px; overflow: hidden;
  }
  
  .ubar > i { display: block; height: 100%; border-radius: 999px; background: var(--amber); transition: width .4s, background .3s; }
  .ubar.warn { background: var(--amber-track); }
  .ubar.warn > i { background: var(--amber); }
  .ubar.hot { background: var(--red-track); }
  .ubar.hot > i { background: var(--red); }
  .ureset { font-size: 14px; color: var(--dim); }
  .usep { border: 0; border-top: 1px solid var(--line); margin: 16px 0; }

  /* 工具时间线 */
  .tl { padding: 8px 4px; }
  .tl .titem {
    display: flex; align-items: center; gap: 12px; width: 100%;
    padding: 9px 6px; font-size: 15.5px; text-align: left; border-radius: 10px;
  }
  .tl .titem:active { background: rgba(0,0,0,.04); }
  .tl .titem .ic { width: 19px; height: 19px; color: var(--text); }
  .tl .titem .tlbl { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dim); }
  .tl .titem .tlbl b { color: var(--text); font-weight: 500; }
  .tl .link { width: 2px; height: 14px; background: var(--line); margin-left: 14px; }

  .dwrap { padding: 4px 2px 10px; }
  .dpath { font-size: 13px; color: var(--dim); word-break: break-all; padding: 0 2px 10px; }
  pre.code {
    margin: 0; background: var(--card); border: 1px solid var(--line); border-radius: 14px;
    padding: 14px; font-size: 13px; line-height: 1.6; overflow-x: auto;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    white-space: pre; color: var(--text);
  }
  .diff { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--card); }
  .diff .dl {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12.5px; line-height: 1.65; padding: 1px 12px;
    white-space: pre-wrap; word-break: break-all;
  }
  .diff .dl.add { background: rgba(46, 125, 67, .12); color: var(--green); }
  .diff .dl.del { background: rgba(192, 57, 43, .10); color: var(--red); }

  /* 选模型 / Effort / More models */
  .mrow { display: block; width: 100%; text-align: left; padding: 15px 18px; }
  .mrow + .mrow { border-top: 1px solid var(--line); }
  .mrow .mn { font-size: 16.5px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
  .mrow .mn .ck { margin-left: auto; color: var(--accent); width: 18px; height: 18px; }
  .mrow .mn .badge {
    font-size: 11.5px; font-weight: 500; color: var(--dim);
    background: var(--bg); border: 1px solid var(--line); border-radius: 999px; padding: 1px 9px;
  }
  .mrow .md { font-size: 13.5px; color: var(--dim); margin-top: 2px; font-weight: 400; }

  /* 全屏房间开着时，聊天的顶栏和输入卡先退场——毛玻璃层在个别浏览器里会钻上来 */
  body:has(.sheetWrap.open) header, body:has(.sheetWrap.open) footer { visibility: hidden; }

  .nb-tabs {
    display: flex; gap: 4px; padding: 4px; margin-bottom: 12px;
    background: var(--panel); border-radius: 13px;
  }
  .nb-tab {
    flex: 1; padding: 8px 0; border-radius: 10px; font-size: 14.5px;
    background: transparent; color: var(--dim);
  }
  .nb-tab.on {
    background: var(--card); color: var(--text); font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,.09);
  }
  .nb-note {
    position: relative; border-radius: 4px; padding: 15px 16px 12px;
    margin-bottom: 14px; box-shadow: 0 2px 7px rgba(0,0,0,.09);
    color: #3d3830;
  }
  .nb-note::before {   /* 顶上一条胶带，跟便签板一家人 */
    content: ""; position: absolute; top: -6px; left: 50%; margin-left: -22px;
    width: 44px; height: 13px; border-radius: 2px;
    background: rgba(243, 237, 221, .9); box-shadow: 0 1px 3px rgba(0,0,0,.12);
    transform: rotate(-1.5deg);
  }
  .nb-note .nbt { font-size: 15px; line-height: 1.75; white-space: pre-wrap; word-break: break-word; }
  .nb-note .nbm { font-size: 11.5px; opacity: .55; margin-top: 8px; display: flex; align-items: center; }
  .nb-note .nbx { margin-left: auto; opacity: .6; font-size: 13px; }
  .nb-write { display: flex; flex-direction: column; gap: 8px; background: var(--panel); border-radius: 16px; padding: 12px 14px; margin-bottom: 16px; }
  .nb-write textarea {
    border: 0; outline: 0; background: transparent; color: var(--text);
    font: inherit; font-size: 15px; resize: none; min-height: 62px; line-height: 1.7;
  }
  .nb-write textarea::placeholder { color: var(--dim); }
  .nb-write .go { align-self: flex-end; background: var(--text); color: var(--bg); border-radius: 999px; padding: 7px 20px; font-size: 14px; }
  .nb-empty { text-align: center; color: var(--dim); font-size: 14px; padding: 34px 0; font-family: var(--serif); }

  /* 搜索 */
  .fd-bar { display: flex; align-items: center; gap: 10px; background: var(--panel); border-radius: 14px; padding: 11px 15px; }
  .fd-bar .ic { width: 17px; height: 17px; color: var(--dim); flex: none; }
  .fd-bar input { flex: 1; border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-size: 15.5px; }
  .fd-hint { font-size: 13px; color: var(--dim); padding: 12px 4px; line-height: 1.8; }
  .fd-hit { padding: 12px 4px; border-bottom: 1px solid var(--line); }
  .fd-hit .fh { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--dim); margin-bottom: 4px; }
  .fd-hit .fk { background: var(--panel); border-radius: 999px; padding: 1px 9px; }
  .fd-hit .fs { font-size: 14.5px; line-height: 1.7; word-break: break-word; }
  .fd-hit .fs mark { background: rgba(217, 119, 87, .28); color: inherit; border-radius: 3px; padding: 0 2px; }

  .cal-head { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 2px 0 14px; }
  .cal-head .cm { font-size: 18px; font-weight: 600; min-width: 145px; text-align: center; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
  .cal-head .cnav { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; opacity: .55; }
  .cal-head .cnav .ic { width: 14px; height: 14px; }
  .cal-head .ctoday {   
    position: absolute; right: 0; top: 4px;
    font-size: 12.5px; color: var(--dim); padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px;
  }
  
  .cal-week {
    display: grid; grid-template-columns: repeat(7, 1fr);
    font-size: 10.5px; letter-spacing: .12em; color: var(--dim);
    text-align: center; padding-bottom: 10px;
  }
  .cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); row-gap: 6px; }
  .cal-day {
    position: relative; aspect-ratio: 1 / 1.15;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: 15px; background: transparent;
  }
  .cal-day.other { opacity: .22; }
  .cal-day .dnum {
    width: 38px; height: 38px; border-radius: 50%;   
    display: flex; align-items: center; justify-content: center;
    font-variant-numeric: tabular-nums;      /* 1 和 31 一样宽，列才齐 */
    transition: background .18s;
  }
  
  .cal-day.sel .dnum { background: color-mix(in srgb, var(--dim) 30%, transparent); }
  
  .cal-day.today .dnum { background: var(--accent); color: #fff; }  /* 今天=这一屏唯一的一粒橘 */
  .cal-day .dnum, .cal-day .dots { position: relative; z-index: 1; }
  .cal-day .dots { display: flex; gap: 3px; height: 4px; margin-top: 3px; }
  .cal-day .dots i { width: 4px; height: 4px; border-radius: 50%; }
  .cal-day .dots .dr { background: var(--dim); }
  .cal-day .dots .ds { background: var(--text); }
  /* 详情区：日期是节标，每件事是一根圆角玻璃条 */
  .cal-detail { margin-top: 20px; }
  .cal-dt { font-size: 12px; color: var(--dim); letter-spacing: .12em;
    padding: 0 4px 10px; font-variant-numeric: tabular-nums; }
  .cal-ev { display: flex; align-items: center; gap: 10px; padding: 12px 15px;
    font-size: 15px; margin-bottom: 9px; border-radius: 15px;
    background: var(--panel); }
  .cal-ev .et { flex: 1; min-width: 0; }
  .cal-ev .em { font-size: 12.5px; color: var(--dim); font-variant-numeric: tabular-nums; }
  .cal-ev .star { color: var(--pink); width: 16px; height: 16px; }
  .cal-ev .edel { color: var(--dim); width: 17px; height: 17px; opacity: .5; }
  .cal-plus { display: flex; align-items: center; gap: 8px; padding: 12px 15px;
    font-size: 14.5px; color: var(--dim); width: 100%; text-align: left;
    border-radius: 15px; border: 1px dashed var(--line); margin-bottom: 9px; }
  .cal-plus .ic { width: 14px; height: 14px; }
  .cal-add { display: none; border-radius: 15px; padding: 14px 15px 12px; margin-bottom: 9px;
    background: var(--panel); }
  .cal-add.open { display: block; }
  .cal-add input[type=text] {
    width: 100%; border: 0; outline: 0; background: transparent; color: var(--text);
    font: inherit; font-size: 15.5px; padding: 2px 0 10px;
  }
  .cal-add .row2 { display: flex; align-items: center; gap: 8px; font-size: 12.5px;
    color: var(--dim); flex-wrap: wrap; }
  .cal-add input[type=time] {
    border: 0; border-radius: 999px; padding: 6px 12px;
    background: var(--panel); color: var(--text); font: inherit; font-size: 12.5px;
    font-variant-numeric: tabular-nums; -webkit-appearance: none; appearance: none;
  }
  .cal-add .go { margin-left: auto; background: var(--text); color: var(--bg);
    border: 0; border-radius: 999px; padding: 8px 20px; font-size: 13px; font-weight: 500; }
  .pcard { margin-top: 14px; border-radius: 15px; padding: 14px 15px 10px;
    background: var(--panel); }
    .pcard .pt { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 7px; padding-bottom: 6px; }
  .pcard .pt .ic { width: 14px; height: 14px; color: var(--pink); }
  /* 一行一件事，左边名目右边内容——跟小票的表头一个排法 */
  /* 日历详情：当天聊天摘要 + 日记联动（栖燃9-16） */
  .cal-daychat { margin-top: 10px; padding: 10px 12px; border-radius: 12px;
    background: var(--card-2, rgba(255,255,255,.55)); border: 1px solid var(--line); }
  .cal-dc-h { font-size: 12px; letter-spacing: .12em; color: var(--dim); margin-bottom: 8px; }
  .cal-dc-b { font-size: 13.5px; line-height: 1.65; }
  .cal-dc-row { display: flex; gap: 8px; padding: 4px 0; align-items: baseline; }
  .cal-dc-w { flex: 0 0 auto; font-size: 11px; padding: 1px 7px; border-radius: 8px; }
  .cal-dc-w.me { background: var(--accent-weak, #F3E2DB); color: var(--accent-deep, #8A5A4A); }
  .cal-dc-w.gu { background: var(--line); color: var(--dim); }
  .cal-dc-t { color: var(--text); word-break: break-word; }
  .cal-dc-more { font-size: 11px; color: var(--dim); margin-top: 6px; letter-spacing: .08em; }
  .cal-dc-diary { padding: 6px 0; border-top: 1px dashed var(--line); white-space: pre-wrap; word-break: break-word; }
  .cal-dc-diary:first-child { border-top: none; }
  /* 她的本子：编辑态 */
  .hd-edit { width: 100%; min-height: 84px; margin-top: 8px; padding: 10px; border-radius: 10px;
    border: 1px solid var(--line); background: var(--card, #fff); color: var(--text);
    font: inherit; font-size: 14px; line-height: 1.6; resize: vertical; }
  .hd-editbtns { display: flex; gap: 8px; margin-top: 6px; }
  .hd-editbtns .go { padding: 4px 14px; font-size: 12.5px; }
  .prow { display: flex; align-items: center; padding: 11px 0; font-size: 14.5px; }
  .prow + .prow { border-top: 1px solid var(--line); }
  .prow .pk { color: var(--dim); font-size: 13.5px; letter-spacing: .08em; }
  .prow .pv { margin-left: auto; display: flex; align-items: center; gap: 16px; }
  /* 强度：亮几个就是几分，粉的 */
  .pv .lv { width: 19px; height: 19px; color: var(--pink); opacity: .25; }
  .pv .lv.on { opacity: 1; }
  .pv .lv svg { fill: currentColor; stroke: none; }
  .pv .gap { gap: 11px; display: flex; align-items: center; }
  /* 心情：一排小脸，选中的粉起来 */
  .pv .face { width: 25px; height: 25px; color: var(--dim); opacity: .45; }
  .pv .face.on { color: var(--pink); opacity: 1; }
  .pv .face svg { stroke-width: 1.7; }
  /* 来没来：iOS 那种开关 */
  .psw {
    width: 46px; height: 27px; border-radius: 999px; flex: none;
    background: color-mix(in srgb, var(--dim) 32%, transparent);
    position: relative; transition: background .22s;
  }
  .psw.on { background: var(--pink); }
  .psw::after {
    content: ""; position: absolute; top: 3px; left: 3px; width: 21px; height: 21px;
    border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.22);
    transition: transform .22s;
  }
  .psw.on::after { transform: translateX(19px); }
  .pnote { width: 100%; border: 0; background: transparent; color: var(--text); font: inherit; font-size: 14.5px; padding: 0; outline: 0; }
  .plock { font-size: 11.5px; color: var(--dim); margin-top: 8px; }

  /* 身体间(8/3 完整版,鼠尾草的岗):sage 总览卡 + 分组卡 + 大数值行 */
  
  /* 比原版再放开一点：让花撑出卡片的内边距（svg overflow 是 visible，标签不会被切）。
     算过：最外那个标签离中心 140/310，撑到 412px 宽时是 186px，
     屏幕中线 215 → 最远 401，离屏幕边还有 29px 余量 */
  
  .drive-flower { touch-action: manipulation; width: 100%; display: block; overflow: visible; }
  @keyframes petal-sway { 0%, 100% { transform: rotate(-1.3deg); } 50% { transform: rotate(1.3deg); } }
  
  .sw { width: 46px; height: 28px; border-radius: 999px; background: var(--line);
    flex: none; position: relative; transition: background .28s; margin-left: auto; }
  .sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px;
    border-radius: 999px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.18);
    transition: transform .28s cubic-bezier(.34,1.4,.5,1); }
  .sw.on { background: var(--sage); }
  .sw.on::after { transform: translateX(18px); }
  .sw.wait { opacity: .45; }
  .grow .val + .sw { margin-left: 10px; }

  /* --tone 挂在整页上，不能挂在 SVG 里那个 g 上——挂在 g 上，
     底下的按钮在 SVG 外面，继承不到，选中的按钮就成了没底色的光杆 */
  
  @keyframes bdFloat  { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-11px); } }
  @keyframes bdBreath { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.14); } }
  
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv0 { background: #55554F; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv1 { background: #6A6963; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv2 { background: #8F8E88; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv3 { background: #B3B0A4; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv4 { background: #DCDAD2; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv5 { background: var(--text); }
  }
  
  @keyframes bdGrow { from { transform: scaleX(0); } }
  
  @media (prefers-reduced-motion: reduce) {
    
  }
  
  .songcard { display: inline-flex; align-items: center; gap: 12px;
    margin: 10px 0; padding: 12px 14px; border-radius: 16px;
    min-width: min(276px, 100%); max-width: min(340px, 100%);
    cursor: pointer; transition: transform .16s; vertical-align: top; }
  .songcard.on:active { transform: scale(.99); }
  .sc-art { width: 52px; height: 52px; border-radius: 10px; flex: none;
    background: var(--panel); object-fit: cover;
    box-shadow: 0 2px 8px rgba(0,0,0,.14); }
  .sc-txt { min-width: 0; flex: 1; }
  .sc-n { font-size: 15px; font-weight: 600; line-height: 1.35; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; }
  .sc-a { font-size: 12px; color: var(--dim); margin-top: 4px; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; }
  .sc-go { width: 30px; height: 30px; border-radius: 50%; flex: none;
    display: flex; align-items: center; justify-content: center;
    color: var(--text); background: color-mix(in srgb, var(--text) 8%, transparent); }

  .repo-tabs { display: flex; gap: 6px; padding: 4px; margin-bottom: 14px;
    background: var(--panel); border-radius: 999px; }
  .repo-tabs button { flex: 1; border: 0; background: transparent; color: var(--dim);
    font-size: 13.5px; padding: 8px 0; border-radius: 999px; cursor: pointer;
    transition: background .18s, color .18s; }
  .repo-tabs button.on { background: var(--card); color: var(--text); font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,.06); }
  .repo-more { display: block; width: 100%; margin: 18px 0 6px; padding: 13px 0;
    background: var(--panel); border: 0; border-radius: 14px; color: var(--text);
    font-size: 13.5px; cursor: pointer; }
  .repo-end { text-align: center; font-size: 12px; color: var(--dim); margin: 20px 0 6px; }
  .repo-day { font-size: 11.5px; color: var(--dim); letter-spacing: .1em;
    margin: 20px 2px 8px; }
  .repo-none { font-size: 13px; color: var(--dim); padding: 18px 4px; text-align: center; }

  .rc { background: var(--panel); border-radius: 14px; padding: 12px 14px; margin-bottom: 8px; }
  .rc-h { display: flex; gap: 10px; align-items: baseline; cursor: pointer; }
  .rc-t { font-size: 12px; color: var(--dim); flex: none;
    font-variant-numeric: tabular-nums; }
  .rc-s { font-size: 14.5px; line-height: 1.45; flex: 1; }
  .rc-f { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
  
  .rc-f .fx { font-size: 11px; color: var(--dim); background: var(--card);
    padding: 3px 8px; border-radius: 999px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .rc-f .fx.A::before { content: '+ '; }
  .rc-f .fx.D::before { content: '− '; }
  .rc-f .fx.more { font-family: inherit; }
  .rc-d { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
  .rc.open .rc-d { max-height: none; margin-top: 12px; }

  .repo-diff { background: var(--card); border-radius: 10px; padding: 10px 0;
    overflow-x: auto; }
  .repo-diff .dl { font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11.5px; line-height: 1.6; white-space: pre; padding: 0 12px;
    color: var(--text); }
  .repo-diff .dl.a { background: color-mix(in srgb, #3d7f4a 11%, transparent); }
  .repo-diff .dl.d { background: color-mix(in srgb, #a04a42 11%, transparent); }
  .repo-diff .dl.at { color: var(--dim); margin-top: 6px; }
  .repo-diff .dl.g { color: var(--text); font-weight: 600; margin-top: 12px;
    padding-top: 8px; border-top: 1px solid var(--line); }
  .repo-diff .dl.meta { color: var(--dim); opacity: .7; }

  .repo-crumb { font-size: 13px; margin-bottom: 12px; color: var(--dim); }
  .repo-crumb .cb { cursor: pointer; color: var(--text); }
  .repo-crumb .cs { margin: 0 5px; }
  .repo-list { background: var(--panel); border-radius: 14px; overflow: hidden; }
  .ri { display: flex; align-items: center; gap: 10px; padding: 12px 14px;
    cursor: pointer; border-bottom: 1px solid var(--line); }
  .ri:last-child { border-bottom: 0; }
  .ri .ic { width: 16px; height: 16px; flex: none; color: var(--dim); }
  .ri.dir .ic { color: var(--text); }
  .rn { flex: 1; font-size: 14.5px; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; }
  .ri.dir .rn { font-weight: 600; }
  .rz { font-size: 11.5px; color: var(--dim); flex: none;
    font-variant-numeric: tabular-nums; }
  .repo-file { background: var(--card); border-radius: 12px; padding: 12px;
    overflow-x: auto; }
  .repo-file pre { margin: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11.5px; line-height: 1.65; white-space: pre; }

  /* 点哪一行，下面那条线就换成哪一项。选中的那行左边立一道竖杠——
     不加颜色、不加底色（本家橘一屏最好为零，这里一点都不该用） */
  
  @keyframes bdDraw { to { stroke-dashoffset: 0; } }
  /* 「做完了」那一刀 */
  
  /* 标题即结论（Tufte）：这一行说的是"发生了什么"，不是"这是什么图" */
  
  /* 线头上那个点——"现在在这儿" */
  
  /* 按住拖出来的游标 */
  
  @media (prefers-reduced-motion: reduce) {
    
  }
  
  /* 梦（2026-08-06）。卡片照家里统一那份暖灰来，不另起炉灶 */
  
  .nt-day { font-size: 11.5px; color: var(--dim); letter-spacing: .1em;
    margin: 22px 4px 8px; }
  .nt-day:first-child { margin-top: 4px; }
  .dm-card.nt .dm-when { font-variant-numeric: tabular-nums; }
  .dm-card.nt .dm-b { white-space: pre-wrap; }

  .nt-sw-wrap { display: flex; justify-content: center; margin-bottom: 14px; }
  .nt-switch { border: 1px solid var(--line); background: var(--card-2, transparent); color: var(--dim);
    border-radius: 999px; padding: 7px 16px; font-size: 12.5px; letter-spacing: .06em; cursor: pointer; }
  .nt-switch.on { color: var(--accent-deep, #8A5A4A); border-color: var(--accent-weak, #F3E2DB);
    background: var(--accent-weak, #F3E2DB); }
  .dm-wrap { display: flex; flex-direction: column; gap: 12px; padding: 4px 0 20px; }
  .dm-card { background: var(--panel); border-radius: 16px; padding: 15px 16px 14px;
    box-shadow: inset 0 0 0 1px var(--line); }
  .dm-when { font-size: 11px; color: var(--dim); letter-spacing: .06em; }
  .dm-t { font-size: 16px; font-weight: 600; margin: 3px 0 7px; }
  .dm-b { font-size: 14px; line-height: 1.75; white-space: pre-wrap; }
  .dm-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }
  .dm-tag { font-size: 11px; color: var(--dim); padding: 3px 9px; border-radius: 999px;
    box-shadow: inset 0 0 0 1px var(--line); }
  .dm-none { text-align: center; padding: 52px 20px; color: var(--dim); font-size: 15px; }
  .dm-none .s { font-size: 12.5px; line-height: 1.9; margin-top: 10px; opacity: .82; }
  
  @media (prefers-reduced-motion: reduce) {  }
  
  @keyframes bdRipple { 0% { r: 74; opacity: .7; } 100% { r: 132; opacity: 0; } }
  
  /* 共读（8/5 晚盖起来的）：书架一张卡一本书，翻开就是正文。
     字号和行距是照着纸书调的——这一页是用来读完一章的，不是用来扫一眼的 */
  .nk-shelf { display: grid; gap: 12px; padding: 2px 0 6px; }
  /* 卡片用家里那个暖灰（--panel），跟全家的行卡一致——
     原来是纯白，一眼看出来不是这个家的 */
  .nk-book { background: var(--panel); border: none; border-radius: 15px; padding: 16px 18px;
    text-align: left; font-family: inherit; width: 100%;
    box-shadow: 0 1px 4px rgba(0,0,0,.05); }
  .nk-book:active { transform: scale(.985); }
  .nk-book .t { font-size: 17px; color: var(--text); margin-bottom: 5px; }
  .nk-book .a { font-size: 13px; color: var(--dim); line-height: 1.6; }
  .nk-bar { height: 4px; border-radius: 999px; background: var(--panel); margin-top: 11px;
    overflow: hidden; }
  .nk-bar i { display: block; height: 100%; border-radius: 999px; background: var(--sage);
    transition: width .5s; }
  .nk-ct { text-align: center; font-size: 14.5px; color: var(--dim); padding: 30px 0; }
  .nk-h { text-align: center; font-size: 16px; color: var(--dim); margin: 2px 0 22px;
    letter-spacing: .04em; line-height: 1.9; }
  
  .nk-h-tip { font-size: 13px; color: var(--dim); }
  .nk-read { font-size: 17.5px; line-height: 2.05; color: var(--text); }
  .nk-read p { margin: 0 0 1.15em; text-indent: 2em; }
  .nk-nav { display: flex; gap: 10px; margin: 26px 0 6px; }
  .nk-nav button { flex: 1; border: none; border-radius: 13px; padding: 14px;
    font-family: inherit; font-size: 15px; background: var(--panel); color: var(--text); }
  .nk-nav button:disabled { opacity: .32; }
  .nk-nav button:active:not(:disabled) { transform: scale(.96); }
  .nk-toc { display: grid; gap: 1px; }
  .nk-toc button { border: none; background: none; font-family: inherit; font-size: 15px;
    color: var(--text); text-align: left; padding: 12px 12px; border-radius: 10px; }
  /* 当前这一节：用底色标出来，字不变色（同上那条规矩） */
  .nk-toc button.on { background: var(--panel); color: var(--text); font-weight: 600; }

  .nk-mark { background: color-mix(in srgb, var(--dim) 20%, transparent);
    border-radius: 3px; padding: 1px 0; cursor: pointer;
    box-shadow: 0 1px 0 color-mix(in srgb, var(--dim) 42%, transparent); }
  /* 说过话的那几处深一档，底下再压一道实线 */
  .nk-mark.has { background: color-mix(in srgb, var(--dim) 32%, transparent);
    border-bottom: 1.6px solid color-mix(in srgb, var(--dim) 80%, transparent);
    box-shadow: none; }
  /* 选中文字之后浮出来的那两颗 */
  
  #nkPop { position: fixed; z-index: 90; display: none; gap: 8px; align-items: center;
    left: 50%; transform: translateX(-50%) translateY(140%);
    bottom: calc(env(safe-area-inset-bottom) + 18px);
    max-width: min(94vw, 460px);
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    border: 1px solid rgba(255,255,255,.55);
    border-radius: 999px; padding: 8px 8px 8px 16px;
    box-shadow: 0 8px 28px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.6);
    transition: transform .28s cubic-bezier(.34,1.3,.5,1); }
  #nkPop.on { display: flex; transform: translateX(-50%) translateY(0); }
  #nkPop .sel { font-size: 13px; color: var(--dim); white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; }
  #nkPop button { flex: none; border: none; color: var(--text);
    background: rgba(255,255,255,.55);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.45);
    font-family: inherit; font-size: 14px; padding: 10px 16px; border-radius: 999px; }
  
  #nkPop button.hi { background: var(--text); color: var(--bg); }
  
  .nk-quote { font-size: 14.5px; color: var(--dim); line-height: 1.8;
    border-left: 3px solid var(--line); padding: 2px 0 2px 12px; margin-bottom: 16px; }
  
  .nk-bub { max-width: 85%; font-size: 15.5px; line-height: 1.75; margin-bottom: 14px;
    white-space: pre-wrap; word-break: break-word; }
  .nk-bub.her { margin-left: auto; width: fit-content;
    background: var(--user-bubble); color: var(--text);
    border-radius: 18px; padding: 10px 16px; }
  .nk-bub.mine { margin-right: auto; color: var(--text); }
  .nk-bub .t { display: block; font-size: 11.5px; color: var(--dim); margin-top: 5px; }
  .nk-bub.her .t { opacity: .7; }

  /* 说话那一行也照聊天界面：一块圆角玻璃 + 里面透明的输入 + 一颗圆按钮 */
  .nk-say {
    display: flex; align-items: flex-end; gap: 8px; margin-top: 18px;
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    border-radius: 24px; border: 1px solid rgba(255,255,255,.55);
    box-shadow: 0 2px 18px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.6);
    padding: 10px 10px 10px 16px;
  }
  .nk-say textarea {
    flex: 1; border: 0; outline: 0; resize: none; background: transparent;
    color: var(--text); font: inherit; line-height: 1.6;
    max-height: 140px; min-height: 26px; padding: 4px 0 6px;
  }
  .nk-say textarea::placeholder { color: var(--dim); }
  .nk-say button {
    flex: none; width: 38px; height: 38px; border-radius: 50%; border: none;
    background: var(--accent); color: #fff; font-family: inherit; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
  }
  .nk-say button:disabled { opacity: .35; }

  /* ===== 阅读器 v2（第2步：抄 reading-nook 骨架 + 仿真翻页精进）===== */
  #nookSheet .sheet { background: var(--bgfull, var(--bg)); }
  #nookSheet.nk-on .body { padding: 0; }
  #nookSheet .nk-bar i { background: var(--accent); }
  #nkStage { position: relative; min-height: 100%; }
  #nkPage { max-width: 680px; margin: 0 auto; min-height: 100%; box-sizing: border-box;
    padding: 10px 22px calc(26px + env(safe-area-inset-bottom));
    font-size: 17.5px; line-height: 2.05; color: var(--rink, var(--text));
    background: var(--rbg, transparent); }
  #nkPage p, #nkTopPage p { margin: 0 0 1.05em; text-indent: 2em; }
  .nk-chdiv { text-align: center; color: var(--dim); font-size: 14px;
    margin: 30px 0 20px; letter-spacing: 3px; }
  #nkPage mark, #nkTopPage mark {
    background: var(--mark-u, color-mix(in srgb, var(--dim) 22%, transparent));
    border-radius: 3px; padding: 1px 0; cursor: pointer; }
  #nkPage mark.mr, #nkTopPage mark.mr {
    background: var(--mark-ai, color-mix(in srgb, var(--dim) 32%, transparent)); }
  #nkPage mark .dot, #nkTopPage mark .dot { display: inline-block; width: 8px; height: 8px;
    border-radius: 50%; margin-left: 2px; vertical-align: super; }
  #nkPage mark .du, #nkTopPage mark .du { background: var(--pink-line); }
  #nkPage mark .dr, #nkTopPage mark .dr { background: var(--blue-line); }
  #nkBotbar { position: sticky; bottom: 0; z-index: 6; display: flex; align-items: center;
    justify-content: space-between; padding: 9px 16px calc(9px + env(safe-area-inset-bottom));
    background: var(--rbg, var(--bg)); border-top: 1px solid var(--line); }
  #nkBotbar button { border: none; background: none; font-family: inherit; font-size: 15px;
    color: var(--accent); padding: 8px 14px; }
  #nkBotbar button:active { transform: scale(.94); }
  #nkPg { font-size: 12.5px; color: var(--dim); font-variant-numeric: tabular-nums; }
  /* 卷页三层：翻动层(字随折缝消失) / 折缝软阴影 / 纸卷(纸背光影) */
  #nkTopPage { position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%);
    width: min(100%, 680px); z-index: 2; display: none; overflow: hidden;
    box-sizing: border-box; padding: 10px 22px calc(26px + env(safe-area-inset-bottom));
    font-size: 17.5px; line-height: 2.05; color: var(--rink, var(--text));
    background: var(--rbg, var(--bgfull, var(--bg)));
    will-change: clip-path; pointer-events: none; }
  #nkCurlShade { position: absolute; top: 0; bottom: 0; z-index: 3; display: none; pointer-events: none;
    background: linear-gradient(90deg, rgba(0,0,0,.20), rgba(0,0,0,0) 82%); }
  #nkCurlFlap { position: absolute; top: 0; bottom: 0; z-index: 4; display: none; pointer-events: none;
    background: linear-gradient(90deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,.04) 20%, #ececea 45%, #d9d9d5 100%);
    border-radius: 0 10px 10px 0; }
  #nookSheet[data-nknight="1"] #nkCurlFlap {
    background: linear-gradient(90deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.16) 24%, #3a4050 55%, #262b38 100%); }
  .nk-drawer { position: absolute; top: 0; bottom: 0; right: 0; width: min(84%, 340px); z-index: 30;
    background: var(--panel, var(--bg)); box-shadow: -3px 0 16px rgba(0,0,0,.14);
    padding: 18px 16px calc(18px + env(safe-area-inset-bottom)); overflow-y: auto; display: none; }
  .nk-drawer.on { display: block; }
  .nk-drawer h3 { font-size: 15px; margin-bottom: 8px; }
  #nkSet { left: 0; right: 0; top: auto; bottom: 0; width: auto; max-width: 640px;
    margin: 0 auto; height: auto; max-height: 78%; border-radius: 20px 20px 0 0;
    box-shadow: 0 -6px 24px rgba(0,0,0,.2); }
  #nkMask { position: absolute; inset: 0; z-index: 25; background: rgba(0,0,0,.28); display: none; }
  #nkMask.on { display: block; }
  .nk-tocit { padding: 11px 10px; font-size: 14.5px; color: var(--text);
    border-bottom: 1px solid var(--line); cursor: pointer; line-height: 1.6; }
  .nk-tocit.cur { color: var(--accent); font-weight: 600; }
  .nk-rns { font-size: 12.5px; color: var(--dim); margin: 14px 0 6px; }
  .nk-thg { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .nk-th { border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px; font-size: 13.5px;
    cursor: pointer; display: flex; align-items: center; gap: 6px;
    background: transparent; color: var(--text); font-family: inherit; }
  .nk-th.cur { outline: 2px solid var(--accent); }
  .nk-th .dots { display: flex; gap: 3px; margin-left: auto; }
  .nk-th .dots i { width: 11px; height: 11px; border-radius: 50%;
    border: 1px solid rgba(0,0,0,.12); display: block; }
  .nk-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
  .nk-bt { padding: 8px 14px; font-size: 13px; border-radius: 10px; border: 1px solid var(--line);
    background: transparent; color: var(--text); font-family: inherit; cursor: pointer; }
  .nk-bt.cur { background: var(--accent); color: #fff; border-color: var(--accent); }
  .nk-sw { width: 26px; height: 26px; border-radius: 50%; cursor: pointer;
    border: 1px solid rgba(0,0,0,.15); display: inline-block; }
  .nk-sw.cur { outline: 2.5px solid var(--accent); outline-offset: 1px; }
  .nk-pl { font-size: 11px; color: var(--dim); width: 100%; margin-top: 4px; }
  .nk-clr { width: 44px; height: 32px; border: 1px solid var(--line); border-radius: 8px;
    padding: 0; background: none; cursor: pointer; }
  .nk-del { border: none; background: none; color: var(--dim); font-size: 12.5px;
    font-family: inherit; padding: 4px 0; margin: -6px 0 12px; cursor: pointer;
    text-decoration: underline; }
  #nookSheet.nk-zen .head, #nookSheet.nk-zen #nkBotbar { display: none; }
  #nkAnnoSheet .nk-bub.mine { background: var(--blue); border: 1px solid var(--blue-line);
    border-radius: 18px; padding: 10px 16px; width: fit-content; }
  #nkAnnoBtn .n { font-size: 11px; color: var(--dim); }
  #nkMeasure { position: absolute; left: -9999px; top: 0; visibility: hidden; }
  #nkMeasure p, #nkPage p.nkc { margin: 0 0 1.05em; text-indent: 2em; }
  #nkPage p.nkc { color: var(--dim); text-indent: 0; text-align: center; }
  .nk-sec { border-top: 1px solid var(--line); margin-top: 16px; padding-top: 12px; }
  .nk-crow { display: flex; flex-direction: column; gap: 5px; margin: 2px 0 8px; }
  .nk-clab { font-size: 12.5px; color: var(--dim); }
  .nk-swrow { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .nk-swrow .nk-sw { width: 20px; height: 20px; }
  .nk-swf { font-size: 10px; color: var(--dim); display: flex; align-items: center;
    justify-content: center; background: transparent; border: 1px dashed var(--line); }
  .nk-clrsm { width: 30px; height: 24px; }
  /* 设置面板：圆角卡片分组 */
  .nk-card { background: var(--panel, var(--card)); border: 1px solid var(--line);
    border-radius: 14px; padding: 12px 12px 10px; margin: 10px 0; }
  .nk-card .nk-rns { font-size: 12px; font-weight: 700; letter-spacing: .5px;
    color: var(--dim); margin: 0 0 10px; }
  .nk-sethd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
  .nk-setx { border: none; background: transparent; color: var(--dim); font-size: 17px;
    cursor: pointer; padding: 4px 8px; }
  .nk-sw { box-shadow: inset 0 0 0 1.5px rgba(0,0,0,.07); }
  .nk-sw.cur { box-shadow: inset 0 0 0 2px var(--accent); transform: scale(1.14); }
  .nk-bt { border-radius: 10px; }
  #nkSet h3 { margin: 4px 0 2px; font-size: 16px; }

  .wh-list { display: flex; flex-direction: column; gap: 10px; padding: 4px 2px 10px; }
  .wh { max-width: 82%; padding: 12px 14px; border-radius: 16px; font-size: 15.5px;
    line-height: 1.68; white-space: pre-wrap; word-break: break-word;
    box-shadow: 0 1px 5px rgba(0,0,0,.05); }
  .wh.her { align-self: flex-end; background: var(--pink-track); border-bottom-right-radius: 6px; }
  .wh.gu  { align-self: flex-start; background: var(--panel); border-bottom-left-radius: 6px;
    background: color-mix(in srgb, var(--panel) 55%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.8);
    backdrop-filter: blur(20px) saturate(1.8);
    border: 1px solid rgba(255,255,255,.35);
    border: 1px solid color-mix(in srgb, #fff 45%, transparent);
    box-shadow: 0 4px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.5); }
  .wh time { display: block; font-size: 12.5px; color: var(--dim); margin-top: 5px;
    font-variant-numeric: tabular-nums; }
  .wh-empty { color: var(--dim); font-size: 13.5px; line-height: 1.8; padding: 30px 6px; text-align: center; }
  .wh-write { display: flex; gap: 8px; align-items: flex-end; margin-top: 14px; }
  .wh-write textarea { flex: 1; background: var(--panel); border: none; border-radius: 15px;
    padding: 12px 14px; font: inherit; font-size: 15.5px; color: var(--text);
    resize: none; min-height: 46px; max-height: 160px; -webkit-appearance: none; }
  .wh-send { border: none; border-radius: 999px; padding: 12px 18px; font-family: inherit;
    font-size: 13.5px; background: var(--text); color: var(--bg); flex: none; }
  .wh-note { font-size: 12.5px; color: var(--dim); line-height: 1.75; padding: 14px 4px 0; }

  .flower-hub { fill: var(--card); stroke: none; cursor: pointer;
    transition: r .35s cubic-bezier(.34,1.4,.5,1), fill-opacity .35s; }
     /* 微透就好：能看出底下有东西，但字还是清楚的 */
  .hub-label, .hub-value { fill: var(--text); text-anchor: middle; pointer-events: none;
    opacity: 0; transition: opacity .3s; }
  .hub-label { font-size: 8.4px; letter-spacing: .06em; }
  .hub-value { font-size: 13px; font-variant-numeric: tabular-nums; }
  
  @media (prefers-reduced-motion: reduce) {  }

  /* 换色的小圆点，蹲在「情绪」旁边 */
  
  .hl-hero { border-radius: 15px; padding: 14px 16px; background: var(--sage-track); margin-bottom: 6px; }
  .hl-hero .ht1 { font-size: 15.5px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
  .hl-hero .dotp { width: 8px; height: 8px; border-radius: 50%; background: var(--sage); flex: none; }
  .hl-hero .ht2 { font-size: 12.5px; color: var(--dim); margin-top: 4px; }
  .hl-card { border-radius: 15px; background: var(--panel); overflow: hidden; }
  .hl-row { display: flex; align-items: center; gap: 8px; padding: 11px 15px; }
  .hl-row + .hl-row { border-top: 1px solid rgba(0,0,0,.045); }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .hl-row + .hl-row { border-top-color: rgba(255,255,255,.06); }
}
html[data-theme="dark"] .hl-row + .hl-row { border-top-color: rgba(255,255,255,.06); }
  .hl-row .hn { flex: 1; font-size: 14.5px; }
  .hl-row .hv { font-size: 16.5px; }   
  .hl-row .hu { font-size: 12px; color: var(--dim); }
  .hl-row .hdot { width: 6px; height: 6px; border-radius: 50%; flex: none; margin-left: 4px; }
  .hl-tip { font-size: 12px; color: var(--dim); text-align: center; margin: 20px 8px 8px; line-height: 1.8; }
  
  .hbars { display: flex; gap: 7px; align-items: flex-end; height: 46px; padding: 12px 15px 2px; }
  .hbars i { flex: 1; background: var(--sage); border-radius: 4px; min-height: 3px; opacity: .8; }
  .hbars i.empty { background: var(--line); height: 3px; opacity: 1; }
  .hlabs { display: flex; gap: 7px; padding: 4px 15px 12px; }
  .hlabs span { flex: 1; text-align: center; font-size: 10.5px; color: var(--dim); }

  .tl-day { display: flex; gap: 14px; }
  .tl-left { flex: none; width: 50px; text-align: right; padding-top: 4px; }
  .tl-num { font-family: var(--serif); font-size: 25px; line-height: 1;
    font-variant-numeric: tabular-nums; }
  .tl-mon { font-size: 11px; color: var(--dim); margin-top: 4px; letter-spacing: .06em; }
  .tl-line { flex: none; width: 1px; background: var(--line); }
  .tl-items { flex: 1; min-width: 0; padding-bottom: 20px; }
  .tl-item { display: block; width: 100%; text-align: left; padding: 6px 0 12px; }
  .tl-item .tt { font-family: var(--serif); font-size: 16.5px; font-weight: 400; line-height: 1.55; }
  .tl-item .tk { font-size: 12.5px; color: var(--dim); margin-top: 3px; line-height: 1.7;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

  .bn-motto { font-family: var(--serif); font-style: italic; color: var(--dim);
    font-size: 14px; margin: 2px 0 16px; }
  .bn-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .bn-card { position: relative; overflow: hidden; border-radius: 20px; padding: 18px 16px 16px;
    background: #fff; text-align: left; min-height: 118px;
    display: flex; flex-direction: column; justify-content: flex-end;
    box-shadow: 0 1px 8px rgba(0,0,0,.05); cursor: pointer; }
  .bn-card:active { opacity: .88; }
  .bn-card.wide { grid-column: 1 / -1; }
  .bn-card.hero { background: #c8694a; color: #fff; min-height: 130px;
    box-shadow: 0 4px 18px rgba(200,105,74,.28); }
  .bn-card .beyebrow { font-size: 11px; letter-spacing: .12em; opacity: .75;
    font-style: italic; margin-bottom: 6px; }
  .bn-card .bt { font-size: 17px; font-weight: 600; line-height: 1.3; }
  .bn-card .bs { font-size: 12px; margin-top: 4px; opacity: .68; line-height: 1.6; }
  .bn-card.tall { grid-row: span 2; min-height: 240px; }
  .bn-card .bicon { position: absolute; right: -10px; top: -12px; width: 88px; height: 88px;
    opacity: .08; pointer-events: none; }
  .bn-card .bicon svg { width: 100%; height: 100%; }
  .bn-card.tall .bicon { width: 120px; height: 120px; right: -20px; top: -16px; }
  .bn-card.hero .bicon { opacity: .18; width: 140px; height: 140px; right: -24px; top: -28px; }

  .hd-write { border-radius: 18px; padding: 16px; background: var(--card);
    box-shadow: 0 2px 24px rgba(180,160,140,.16); margin-bottom: 18px; }
  .hd-write textarea { width: 100%; border: 0; outline: 0; background: transparent;
    color: inherit; font: inherit; font-size: 15.5px; line-height: 1.8;
    min-height: 96px; resize: vertical; }
  .hd-write textarea::placeholder { color: var(--dim); opacity: .7; }
  .hd-write .row { display: flex; justify-content: flex-end; margin-top: 8px; }
  
  .hd-write .go { border: 0; border-radius: 999px; padding: 8px 22px; font-size: 13px;
    background: var(--text); color: var(--bg); font-weight: 500; }
  .hd-item { border-radius: 18px; padding: 18px 18px 14px; background: #fff;
    margin-bottom: 12px; position: relative; overflow: hidden;
    box-shadow: 0 1px 8px rgba(0,0,0,.04); }
  .hd-item::after { content: '\201C'; position: absolute; top: 8px; right: 14px;
    font-size: 44px; color: #f0ebe4; font-family: Georgia,serif; line-height: 1;
    pointer-events: none; user-select: none; }
  .hd-item .hdd { font-size: 11px; letter-spacing: .06em; color: #b0a99f;
    font-variant-numeric: tabular-nums; margin-bottom: 10px; }
  .hd-item .hdt { font-size: 15.5px; line-height: 1.82; white-space: pre-wrap;
    word-break: break-word; padding-right: 20px; }
  .hd-item .hdx { position: absolute; right: 8px; bottom: 8px; opacity: .25; padding: 4px; }

  .fav-card { position: relative; border-radius: 18px; padding: 20px 18px 16px;
    background: var(--panel); margin-bottom: 14px; overflow: hidden; }
  .fav-card .fq { position: absolute; right: -10px; top: -16px; width: 92px; height: 92px;
    opacity: .1; transform: rotate(8deg); pointer-events: none; }
  .fav-card .fd { font-size: 11px; letter-spacing: .25em; color: var(--dim);
    font-variant-numeric: tabular-nums; margin-bottom: 8px; }
  .fav-card .fx { font-family: var(--serif); font-size: 16.5px; line-height: 1.95;
    word-break: break-word; }
  .fav-card .fn { font-size: 12.5px; color: var(--dim); line-height: 1.75; margin-top: 10px;
    border-top: 1px solid var(--line); padding-top: 10px; }

  .board-bar {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    padding: 4px 0 10px; font-family: var(--serif);
  }
  .board-bar .bdate { font-size: 16.5px; font-weight: 700; min-width: 150px; text-align: center; }
  .board-bar .bnav {
    width: 32px; height: 32px; border-radius: 50%; background: var(--panel);
    display: flex; align-items: center; justify-content: center;
  }
  .board-bar .bnav .ic { width: 14px; height: 14px; }
  .board-bar .bnav:disabled { opacity: .25; }
  .board-sub { text-align: center; font-size: 12px; color: var(--dim); padding-bottom: 8px; }
  .board-toggle {
    position: absolute; right: 14px; bottom: calc(16px + env(safe-area-inset-bottom));
    z-index: 5; border-radius: 999px; padding: 9px 16px; font-size: 13.5px;
    background: var(--glass);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    border: 1px solid var(--line); box-shadow: 0 3px 14px rgba(0,0,0,.1);
  }
  #board {
    position: relative; min-height: 66vh;
    background:
      radial-gradient(circle at 20% 30%, rgba(0,0,0,.025), transparent 50%),
      radial-gradient(circle at 80% 70%, rgba(0,0,0,.025), transparent 50%);
    border-radius: 18px;
  }
  .note {
    position: absolute; width: 46%; max-width: 220px;
    border-radius: 6px; padding: 18px 13px 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,.13);
    cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none;
    color: #3d3830;
  }
  .note:active { cursor: grabbing; box-shadow: 0 8px 22px rgba(0,0,0,.2); }
  .note.big { width: 56%; max-width: 260px; }
  
  .note { --tape: rgba(240, 232, 212, .9); }
  .note::before {
    content: ""; position: absolute; border-radius: 2px;
    background: var(--tape); box-shadow: 0 1px 3px rgba(0,0,0,.12);
  }
  .note.t-h::before {   /* 横贴顶中 */
    top: -7px; left: 50%; margin-left: -24px; width: 48px; height: 15px;
    transform: rotate(var(--ta, -2deg));
  }
  .note.t-l::before {   /* 歪贴左上角 */
    top: -8px; left: -12px; width: 44px; height: 14px; transform: rotate(-38deg);
  }
  .note.t-r::before {   /* 歪贴右上角 */
    top: -8px; right: -12px; width: 44px; height: 14px; transform: rotate(38deg);
  }
  .note.t-v::before {   
    top: -12px; left: 50%; margin-left: -7px; width: 14px; height: 30px;
    transform: rotate(var(--ta, 2deg));
  }
  .note.t-2::before {   /* 对角两条 */
    top: -8px; right: -12px; width: 44px; height: 14px; transform: rotate(38deg);
  }
  .note.t-2::after {
    content: ""; position: absolute; bottom: -7px; left: -13px;
    width: 44px; height: 14px; border-radius: 2px;
    background: var(--tape); box-shadow: 0 1px 3px rgba(0,0,0,.12);
    transform: rotate(38deg);
  }
  .note.lined {         /* 横线笔记纸纹理（可与任何胶带叠穿） */
    background-image: repeating-linear-gradient(to bottom, transparent 0 20px, rgba(70, 90, 130, .13) 20px 21px);
  }
  /* 形状：竖长方（默认）、方、横长方 */
  .note.sq { width: 40%; max-width: 190px; min-height: 130px; }
  .note.wide { width: 58%; max-width: 270px; min-height: 84px; }

  /* 日期筛选面板 */
  .dp { background: var(--panel); border-radius: 16px; padding: 10px 14px 12px; margin-bottom: 12px; display: none; }
  .dp.show { display: block; }
  .dp .dpm { font-size: 12.5px; color: var(--dim); margin: 8px 0 5px; font-family: var(--serif); letter-spacing: .1em; }
  .dp .dpd {
    display: inline-flex; min-width: 36px; height: 32px; padding: 0 6px;
    align-items: center; justify-content: center; border-radius: 9px;
    background: var(--card); margin: 3px; font-size: 13.5px;
  }
  .dp .dpd.on { background: var(--card); color: var(--text); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.09); }

  #noteSheet { z-index: 56; }
  .note-full { font-family: var(--serif); padding: 2px 4px 20px; }
  .note-full .nfd { font-size: 12.5px; color: var(--dim); }
  .note-full .nft { font-size: 19px; font-weight: 700; line-height: 1.5; margin: 4px 0 14px; }
  .note-full .nfb { font-size: 15.5px; line-height: 2; white-space: pre-wrap; word-break: break-word; }
  .note .nt { font-size: 13.5px; font-weight: 700; line-height: 1.55; word-break: break-word; }
  .note .nk { font-size: 11px; opacity: .62; line-height: 1.6; margin-top: 5px; word-break: break-word;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .note .nm { font-size: 10px; opacity: .5; margin-top: 6px; }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .note { color: #2f2b26; box-shadow: 0 3px 12px rgba(0,0,0,.45); }
}
html[data-theme="dark"] .note { color: #2f2b26; box-shadow: 0 3px 12px rgba(0,0,0,.45); }
  .board-empty { text-align: center; color: var(--dim); font-size: 14px; padding: 60px 0; font-family: var(--serif); }

  /* 全景墙（第二视图） */
  .wall-intro { font-family: var(--serif); text-align: center; padding: 10px 6px 18px; }
  .wall-intro .big { font-size: 21px; font-weight: 700; }
  .wall-intro .sub { font-size: 13px; color: var(--dim); margin-top: 4px; }
  .wall-month { font-family: var(--serif); font-size: 14px; color: var(--dim); letter-spacing: .15em; padding: 16px 4px 8px; display: flex; align-items: center; gap: 10px; }
  .wall-month::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
  .wall-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(34px, 1fr)); gap: 7px; }
  .brick {
    border-radius: 9px; aspect-ratio: 1; cursor: pointer;
    transition: transform .15s;
  }
  .brick:active { transform: scale(.88); }
  .brick.a4 { box-shadow: 0 0 7px 0 color-mix(in srgb, var(--glow) 55%, transparent); }
  .brick.a5 { box-shadow: 0 0 14px 2px var(--glow); }
  .brick-card {
    position: sticky; bottom: 0; margin-top: 16px;
    background: var(--card); border-radius: 18px; padding: 14px 18px;
    box-shadow: 0 -4px 24px rgba(0,0,0,.1); border: 1px solid var(--line);
    display: none;
  }
  .brick-card.show { display: block; }
  .brick-card .bd { font-size: 12.5px; color: var(--dim); }
  .brick-card .bt { font-size: 15.5px; font-weight: 600; margin: 3px 0 6px; line-height: 1.5; }
  .brick-card .bm { display: flex; gap: 14px; font-size: 12.5px; color: var(--dim); }
  .brick-card .bm b { color: var(--text); font-weight: 600; }
  .brick-card .bk { font-size: 12.5px; color: var(--dim); margin-top: 6px; line-height: 1.6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  .paper { padding: 2px 4px 30px; }
  .masthead { text-align: center; padding: 4px 0 12px; border-bottom: 3px double currentColor; }
  .masthead .brand-title { font-family: var(--serif); font-size: 32px; font-weight: 600;
    letter-spacing: .1em; margin: 2px 0 6px; }
  .masthead .dateline {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    font-size: 12.5px; color: var(--dim); padding: 2px 0;
    font-variant-numeric: tabular-nums;
  }
  .masthead .dateline button {
    width: 30px; height: 30px; border-radius: 999px; background: var(--panel);
    display: flex; align-items: center; justify-content: center; color: var(--text);
  }
  .masthead .dateline button .ic { width: 13px; height: 13px; }
  .masthead .dateline button:disabled { opacity: .25; }
  .masthead .motto { font-size: 12px; color: var(--dim); padding-top: 4px; }
  
  .section-head {
    display: flex; align-items: center; gap: 10px; margin: 26px 0 10px;
    font-size: 13.5px; font-weight: 500; letter-spacing: .15em; color: var(--dim);
  }
  .section-head::before, .section-head::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
  
  .headline { font-size: 17px; font-weight: 600; line-height: 1.55; margin: 16px 0 3px; }  
  .story { font-size: 15.5px; line-height: 1.85; margin-bottom: 6px; }
  .brief {
    font-size: 13.5px; line-height: 1.8; padding: 3px 0 3px 14px; position: relative;
  }
  .brief::before { content: "·"; position: absolute; left: 2px; top: 1px; color: var(--dim); }
  .brief .src { color: var(--dim); font-size: 12.5px; }
  .censor-note { font-size: 12.5px; color: var(--dim); margin: 4px 0 6px; }
  
  .gnote { position: relative; background: var(--panel); border-radius: 14px;
    padding: 12px 14px 13px 18px; margin: 12px 0 18px; }
  .gnote::before { content: ''; position: absolute; left: 9px; top: 14px; bottom: 14px;
    width: 3px; border-radius: 999px; background: var(--amber); }
  .gnote .lb { font-size: 12.5px; color: var(--dim); letter-spacing: .08em; margin-bottom: 6px; }
  .gnote .tx { font-size: 13.5px; line-height: 1.75; color: var(--text); }
  .paper-foot { text-align: center; font-size: 11.5px; color: var(--dim); margin-top: 28px;
    padding-top: 10px; border-top: 3px double currentColor; letter-spacing: .08em; }

  /* ============ 家的零件库（8/3 设计系统 v1，图纸在 engineering/前端重做/）============
     一套零件盖全家：页面头 / 分组卡 / 行 / 节标 / 状态点 / 进度环。四间屋子只换内容不换零件 */
  .sheetWrap.page .grabber { display: none; }   
  .sh-head { padding: 2px 4px 14px; }
  .sh-head h1 { margin: 0; font-family: var(--serif); font-size: 26px; font-weight: 400;
                letter-spacing: -.01em; line-height: 1.25; }
  .sh-head .sub { color: var(--dim); font-size: 12.5px; margin-top: 2px;
                  font-variant-numeric: tabular-nums; }
  .sh-head .ring { float: right; margin-top: 4px; }
  .sh-head .shnav { float: right; display: flex; gap: 6px; margin-top: 4px; }
  .sh-head .shnav button { min-width: 30px; height: 30px; border-radius: 999px;
    background: var(--panel); display: flex; align-items: center; justify-content: center;
    color: var(--text); }
  .sh-head .shnav .ctd { padding: 0 12px; font-size: 12.5px; color: var(--dim); }
  .sh-head .shnav .ic { width: 13px; height: 13px; }
  .hsect { font-size: 12px; color: var(--dim); letter-spacing: .12em; margin: 22px 4px 8px; }
  
  .hcard { display: grid; gap: 9px; }
  .hrow { display: flex; align-items: center; gap: 12px; padding: 12px 15px;
          font-size: 15.5px; width: 100%; text-align: left;
          border-radius: 15px;
          background: var(--panel); }
    .hrow .tx { flex: 1; min-width: 0; line-height: 1.45; word-break: break-word; }
  .hrow .tx small { display: block; font-size: 12px; color: var(--dim); margin-top: 1px; }
  .hrow .val { flex: none; font-variant-numeric: tabular-nums; color: var(--dim); font-size: 14px; }
  .hrow .val.due { color: var(--amber); font-weight: 600; }
  .hrow.done .tx { text-decoration: line-through; opacity: .42; }
  .hrow .hck { flex: none; padding: 2px 0; display: flex; }
  .hrow .hck svg { display: block; }
  .hrow .hx { flex: none; opacity: .35; display: flex; padding: 2px; }
  .hfoot { text-align: center; color: var(--dim); font-size: 11px; letter-spacing: .3em;
           margin: 26px 0 8px; font-variant-numeric: tabular-nums; }
  /* 进度环——跟 Things 学的：完成度是一枚安静的小圆环，不是一根喊叫的进度条 */
  .ring svg { display: block; transform: rotate(-90deg); }
  .ring circle { fill: none; stroke-width: 3; }
  .ring .track { stroke: var(--sage-track); }
  .ring .fill { stroke: var(--sage); stroke-linecap: round;
                transition: stroke-dashoffset .5s cubic-bezier(.25,.46,.45,.94); }
  
  .hplus { padding: 12px 15px; font-size: 14.5px; color: var(--dim);
           display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
           border-radius: 15px; border: 1px dashed var(--line); }
  .hplus .ic { width: 14px; height: 14px; }
  .hadd { display: none; border-radius: 15px; padding: 14px 15px 12px;
          background: var(--panel); }
  .hadd.open { display: block; }
    .hadd input[type=text] {
    width: 100%; border: 0; outline: 0; background: transparent; color: inherit;
    font: inherit; font-size: 15.5px; padding: 2px 0 10px;
  }
  .hadd input::placeholder { color: var(--dim); opacity: .7; }
  .hadd .row { display: flex; align-items: center; gap: 8px; }
  .chip { border: 0; border-radius: 999px; padding: 7px 14px; font-size: 12.5px;
          background: var(--panel); color: var(--text);
          font-variant-numeric: tabular-nums; transition: background .2s, color .2s; }
  .chip.on { background: var(--text); color: var(--bg); }
  .hadd input[type=time] {
    border: 0; border-radius: 999px; padding: 6px 12px;
    background: var(--panel); color: inherit; font: inherit; font-size: 12.5px;
    font-variant-numeric: tabular-nums; -webkit-appearance: none; appearance: none;
  }
  .hadd .go { margin-left: auto; border: 0; border-radius: 999px; padding: 8px 20px;
              font-size: 13px; background: var(--text); color: var(--bg); font-weight: 500; }

  /* 备用通道（接入 API）面板样式 —— 参照 .hadd/.cal-add 的圆角面板语言补齐 */
  .ap-lb { font-size: 12.5px; color: var(--dim); letter-spacing: .02em; margin: 16px 6px 6px;
    display: flex; align-items: center; justify-content: space-between; }
  .ap-lb:first-of-type { margin-top: 4px; }
  .ap-pull { border: 0; background: none; color: var(--accent); font-size: 12px; font-weight: 500;
    padding: 2px 0; }
  .ap-pull:active { opacity: .6; }
  .ap-mpick { background: var(--panel); border-radius: 14px; padding: 4px 14px; margin-bottom: 10px;
    max-height: 220px; overflow-y: auto; }
  .ap-mchk { display: flex; align-items: center; gap: 10px; padding: 9px 0; font-size: 14px;
    border-bottom: 1px solid var(--line); }
  .ap-mchk:last-child { border-bottom: 0; }
  .ap-mchk input { width: 17px; height: 17px; accent-color: var(--accent); flex: none; }
  .ap-mchk span { word-break: break-all; }
  .ap-in {
    display: block; width: 100%; box-sizing: border-box;
    border: 0; outline: 0; background: var(--panel); color: var(--text);
    font: inherit; font-size: 15px; padding: 12px 14px; border-radius: 14px;
  }
  .ap-in::placeholder { color: var(--dim); opacity: .75; }
  .ap-btns { display: flex; gap: 8px; margin-top: 18px; }
  .ap-b {
    flex: 1; border: 0; outline: 0; border-radius: 999px; padding: 11px 16px;
    font-size: 14px; font-weight: 500; background: var(--panel); color: var(--text);
    transition: background .15s, opacity .15s;
  }
  .ap-b:active { background: var(--line); }
  .ap-b.go { background: var(--accent); color: #fff; }
  .ap-b.go:active { background: var(--accent-soft); }
  .ap-msg {
    display: none; margin-top: 14px; padding: 12px 14px; border-radius: 14px;
    background: var(--panel); font-size: 13px; line-height: 1.6; color: var(--text);
    white-space: pre-wrap; word-break: break-word;
  }
  .ap-msg.on { display: block; }
  .ap-msg.on.bad { background: var(--red-track); color: var(--red); }
  .ap-more { margin-top: 14px; }
  .ap-more .ap-b { width: auto; flex: none; }
  .ap-note {
    margin-top: 20px; padding: 4px 6px; font-size: 12.5px; color: var(--dim);
    line-height: 1.7;
  }
  .ap-note b { color: var(--text); font-weight: 600; }

  .rc {
    
    --stamp: var(--accent);              
    --rc-foot-ink: rgba(43, 42, 39, .72);/* 比划掉的字深，但不到纯黑 */
    --paper: transparent;                
    font-variant-numeric: tabular-nums;
  }
  .rc-num, .rc-kv .v, .rc-code, .rc-meta, .rc-sum .sv {
    font-family: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
    font-variant-numeric: tabular-nums;
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .rc { --stamp: var(--accent-soft); --rc-foot-ink: rgba(245, 244, 239, .72); --paper: transparent; }
}
html[data-theme="dark"] .rc { --stamp: var(--accent-soft); --rc-foot-ink: rgba(245, 244, 239, .72); --paper: transparent; }
  .rc-paper { background: var(--paper); padding: 4px 2px 24px; }
  /* 上下两道撕口——小票的魂 */
  .rc-tear { display: none; }
  .rc-tear.top {
    background-image:
      linear-gradient(45deg, transparent 33.4%, var(--paper) 33.4%, var(--paper) 66.6%, transparent 66.6%),
      linear-gradient(-45deg, transparent 33.4%, var(--paper) 33.4%, var(--paper) 66.6%, transparent 66.6%);
    background-size: 13px 18px;
    background-position: bottom;
  }
  .rc-tear.bottom {
    background-image:
      linear-gradient(45deg, var(--paper) 33.4%, transparent 33.4%, transparent 66.6%, var(--paper) 66.6%),
      linear-gradient(-45deg, var(--paper) 33.4%, transparent 33.4%, transparent 66.6%, var(--paper) 66.6%);
    background-size: 13px 18px;
    background-position: top;
  }
  .rc-shop { text-align: center; font-size: 11.5px; letter-spacing: .46em; opacity: .58; padding: 2px 0 10px; }
  .rc-kv { display: flex; font-size: 12.5px; padding: 3px 0; opacity: .82; }
  .rc-kv .k { letter-spacing: .1em; }
  .rc-kv .v { margin-left: auto; }
  .rc-head { text-align: center; padding: 0 0 8px; }
  .rc-title { font-family: var(--serif); font-size: 26px; font-weight: 700; letter-spacing: .16em; }
  .rc-meta { font-size: 13px; opacity: .68; letter-spacing: .22em; }
  .rc-hr { border: 0; border-top: 1px dashed currentColor; opacity: .32; margin: 10px 0; }
  .rc-sect { font-size: 12px; letter-spacing: .18em; opacity: .55; margin: 14px 0 6px; }
  .rc-item { display: flex; align-items: flex-start; gap: 10px; padding: 7px 2px; }
  .rc-box {
    flex: none; margin-top: 2px; min-width: 24px; text-align: left;
    display: flex; align-items: flex-start;
  }
  .rc-box svg { display: block; }
  .rc-box.ro { opacity: .5; }
  .rc-body { flex: 1; min-width: 0; }
  .rc-tx { font-size: 14.5px; line-height: 1.6; word-break: break-word; }
  .rc-tx.done { text-decoration: line-through; opacity: .42; }
  .rc-tags { font-size: 11px; opacity: .58; margin-top: 3px; display: flex; gap: 9px; flex-wrap: wrap; }
  .rc-tags .late { color: var(--amber); opacity: 1; font-weight: 700; }
  .rc-x { opacity: .35; padding: 0 2px; flex: none; display: flex; align-items: center; }
  .rc-empty { font-size: 12.5px; opacity: .5; padding: 8px 2px; }
  
  .rc-plus { padding: 9px 2px; font-size: 14px; opacity: .55; display: flex; align-items: center; gap: 7px; }
  .rc-plus .ic { width: 13px; height: 13px; }
  .rc-add { padding: 4px 2px 2px; display: none; }
  .rc-add.open { display: block; }
  .rc-add input[type=text] {
    width: 100%; border: 0; outline: 0; background: transparent; color: inherit;
    font: inherit; font-size: 14px; padding: 6px 0;
    border-bottom: 1px dashed currentColor;
  }
  .rc-add input::placeholder { opacity: .45; }
  .rc-add .row {
    display: flex; align-items: center; gap: 8px; margin-top: 9px; font-size: 12px; flex-wrap: wrap;
  }
  .rc-add input[type=time] {
    border: 1px solid currentColor; border-radius: 4px; padding: 3px 6px;
    background: transparent; color: inherit; font: inherit; font-size: 12px; opacity: .8;
  }
  .rc-add label { display: flex; align-items: center; gap: 4px; opacity: .75; }
  .rc-add .go {
    margin-left: auto; border: 1px solid currentColor; border-radius: 4px;
    padding: 5px 14px; font-size: 12.5px; letter-spacing: .1em;
  }
  
  .rc-sum { padding: 4px 2px; }
  .rc-sum .sr { display: flex; align-items: center; font-size: 13.5px; padding: 4px 0; }
  .rc-sum .sr .sl { opacity: .78; }
  .rc-sum .sr .sv { margin-left: auto; font-weight: 600; }
  .rc-sum .sr.dim { opacity: .5; }
  .rc-bar {
    flex: 1; height: 9px; margin: 0 12px; overflow: hidden;
    background-image: radial-gradient(currentColor 0.7px, transparent 0.8px);
    background-size: 4px 4px; opacity: .85;
  }
  .rc-bar > i { display: block; height: 100%; background: currentColor; transition: width .45s; }
  /* 印章：盖在小票下半张 */
  .rc-stamp {
    margin: 20px auto 6px; width: 172px; padding: 9px 0;
    border: 2px solid var(--stamp); border-radius: 6px;
    color: var(--stamp); text-align: center; transform: rotate(-6deg);
    opacity: .82;
  }
  .rc-stamp .s1 { font-family: var(--serif); font-size: 17px; font-weight: 700; letter-spacing: .18em; }
  .rc-stamp .s2 { font-size: 10px; letter-spacing: .28em; margin-top: 2px; opacity: .85; }
  .rc-foot { text-align: center; font-size: 12px; margin-top: 14px; line-height: 2; color: var(--rc-foot-ink); }
  .rc-foot .thin { opacity: .72; font-style: italic; }
  .rc-code { font-size: 11px; letter-spacing: .34em; opacity: .55; margin-top: 6px; }
  .rc-barcode {
    margin: 10px auto 0; height: 26px; width: 76%;
    background: repeating-linear-gradient(to right,
      currentColor 0 2px, transparent 2px 4px, currentColor 4px 5px, transparent 5px 9px,
      currentColor 9px 12px, transparent 12px 14px);
    opacity: 1;
  }

  .addgrid { display: flex; gap: 12px; padding: 8px 0 4px; }
  .addbig {
    flex: none; width: 108px; height: 108px; border-radius: 18px; background: var(--panel);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
    font-size: 15px;
  }
  .addbig .ic { width: 26px; height: 26px; }
  .addrow {
    display: flex; align-items: center; gap: 12px; width: 100%;
    background: var(--panel); border-radius: 16px; padding: 16px 18px; font-size: 16px;
    margin-top: 12px; text-align: left;
  }
  .addrow .ic { width: 20px; height: 20px; }

  .menuCard {   
    position: fixed; z-index: 60; top: calc(58px + env(safe-area-inset-top)); right: 12px;
    border-radius: 20px; padding: 7px; min-width: 190px; display: none;
    background: var(--glass);
    -webkit-backdrop-filter: blur(30px) saturate(1.9);
    backdrop-filter: blur(30px) saturate(1.9);
    border: 1px solid rgba(255,255,255,.42);
    box-shadow: 0 12px 40px rgba(0,0,0,.13), inset 0 1px 0 rgba(255,255,255,.55);
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .menuCard {
      background: color-mix(in srgb, var(--bg) 48%, transparent);
      border: 1px solid rgba(255,255,255,.1);
      box-shadow: 0 12px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.07);
    }
}
html[data-theme="dark"] .menuCard {
      background: color-mix(in srgb, var(--bg) 48%, transparent);
      border: 1px solid rgba(255,255,255,.1);
      box-shadow: 0 12px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.07);
    }
  .menuCard.open { display: block; }
  .menuCard .mi {
    display: flex; align-items: center; gap: 12px; width: 100%;
    padding: 12px 14px; border-radius: 12px; font-size: 15.5px; text-align: left;
  }
  .menuCard .mi:active { background: var(--panel); }
  .menuCard .mi .ic { width: 19px; height: 19px; }
  .menuCard .mi.danger { color: var(--red); }

  #chatsSheet .sheet { height: 100dvh; max-height: 100dvh; border-radius: 0; }
  #chatScope { display: flex; align-items: center; gap: 4px; width: auto; padding: 0 4px; color: var(--dim); }
  #chatScope .sc { font-size: 14.5px; }
  #chatScope .ic { width: 15px; height: 15px; }
  
  .crow {
    display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
    background: var(--glass);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    backdrop-filter: blur(18px) saturate(1.6);
    border: 1px solid rgba(255, 255, 255, .45);
    box-shadow: 0 1px 5px rgba(0,0,0,.045);
    border-radius: 15px; padding: 11px 14px; margin-bottom: 7px;
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .crow { border-color: rgba(255,255,255,.1); box-shadow: 0 1px 5px rgba(0,0,0,.2); }
}
html[data-theme="dark"] .crow { border-color: rgba(255,255,255,.1); box-shadow: 0 1px 5px rgba(0,0,0,.2); }
  .crow:active { background: color-mix(in srgb, var(--panel) 75%, transparent); }
  .crow .cmid { flex: 1; min-width: 0; }
  .crow .cn { font-size: 15px; font-weight: 600; }
  .crow .cp {
    font-size: 12.5px; color: var(--dim); margin-top: 2px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .crow .ct { font-size: 12.5px; color: var(--dim); flex: none; align-self: flex-start; }
  #newSession {
    position: absolute; right: 18px; bottom: calc(20px + env(safe-area-inset-bottom));
    background: #2b2a27; color: #faf9f5; border-radius: 999px;
    padding: 12px 22px; font-size: 15px;
    display: flex; align-items: center; gap: 7px;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
  }
  #newSession .ic { width: 15px; height: 15px; }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #newSession { background: #f5f4ef; color: #262624; }
}
html[data-theme="dark"] #newSession { background: #f5f4ef; color: #262624; }
/* ---------- 模型能力 v2（9-10晚重构）：一张卡一个能力，跟随/独立一排分段控件，不再是表单堆叠 ---------- */
.capv2-list { display: flex; flex-direction: column; gap: 12px; }
.capv2 {
  position: relative;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-lg, 16px);
  padding: 16px 16px 14px;
  overflow: hidden;
  transition: border-color .2s, box-shadow .2s;
}
.capv2::before {              /* 左侧能力色条：dedicated亮/跟随灰 */
  content: ""; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 3px; border-radius: 0 3px 3px 0;
  background: var(--accent); opacity: .75;
  transition: opacity .2s, background .2s;
}
.capv2.seg-follow::before { opacity: .18; }
.capv2:hover { border-color: var(--accent); box-shadow: 0 2px 12px var(--glow, rgba(201,100,66,.1)); }
.capv2-top { display: flex; align-items: center; gap: 11px; }
.capv2-ic {
  line-height: 1; display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 11px;
  background: var(--glow, rgba(201,100,66,.12));
}
.capv2-ic .ic { width: 18px; height: 18px; color: var(--accent, #c96442); }
.capv2-ic .ic svg { width: 100%; height: 100%; }
.capv2-name { font-size: 15px; font-weight: 650; letter-spacing: .2px; }
.capv2-cur {
  margin-left: auto; font-size: 11.5px; color: var(--dim);
  max-width: 50%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 3px 10px; border-radius: 99px;
  background: var(--panel);
}
.capv2.dedicated .capv2-cur { color: var(--accent); background: var(--glow, rgba(201,100,66,.1)); }
.capv2-row { display: flex; gap: 8px; margin-top: 13px; }
.capv2-seg {
  flex: 1; display: flex; background: var(--panel); border-radius: var(--r-sm, 10px); padding: 3px;
}
.capv2-seg button {
  flex: 1; font-size: 12.5px; padding: 7px 0; border-radius: calc(var(--r-sm, 10px) - 3px);
  color: var(--dim); transition: color .15s;
}
.capv2-seg button.on {
  background: var(--card); color: var(--accent); font-weight: 600;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.capv2-ded { display: none; margin-top: 11px; flex-direction: column; gap: 8px; }
.capv2.dedicated .capv2-ded { display: flex; }
.capv2-ded select {
  width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm, 10px);
  background: var(--panel); color: inherit; font: inherit; font-size: 13.5px;
  transition: border-color .15s;
}
.capv2-ded select:focus { border-color: var(--accent); outline: none; }
.capv2-save {
  align-self: stretch; font-size: 12.5px; padding: 9px 22px; border-radius: 99px;
  background: var(--accent); border: none; color: var(--accent-ink, #fff); font-weight: 600;
  transition: opacity .15s, transform .1s;
}
.capv2-save:active { transform: scale(.97); }
.capv2-save.ok { background: var(--green, #4a7a4e); }
.capv2-list { display: flex; flex-direction: column; gap: 11px; }



/* ==== 可搬运代码：方案A（原版风味：安静一行 + 底部弹层） ==== */
  .tooline { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
    padding: 10px 6px; }
  .tooline:active { opacity: .6; }
  .spin2 { flex: none; width: 13px; height: 13px; border-radius: 50%;
    border: 1.5px solid var(--line); border-top-color: var(--accent);
    animation: tspin .8s linear infinite; }
  @keyframes tspin { to { transform: rotate(360deg); } }
  .stfin { flex: none; font-size: 13px; font-weight: 700; color: var(--green); }
  .stfin.bad { color: var(--red); }
  .tooline .tl { flex: 1; min-width: 0; font-size: 13.5px; color: var(--text);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tooline .du { flex: none; font-size: 12px; color: var(--dim); }
  .tooline .ch { flex: none; font-size: 13px; color: var(--dim); }

  .tshade { position: fixed; inset: 0; z-index: 60; background: var(--overlay);
    opacity: 0; pointer-events: none; transition: opacity .2s ease; }
  .tshade.on { opacity: 1; pointer-events: auto; }
  .tsheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 61;
    background: var(--bg); border-radius: 22px 22px 0 0;
    padding: 10px 18px calc(18px + env(safe-area-inset-bottom));
    transform: translateY(103%); transition: transform .26s cubic-bezier(.22,1.1,.36,1);
    max-height: 76vh; overflow: auto; }
  .tsheet.on { transform: translateY(0); }
  .tsheet .grab { width: 36px; height: 4px; border-radius: 999px; background: var(--line);
    margin: 4px auto 10px; }
  .tsheet .tsh { display: flex; align-items: center; margin-bottom: 2px; }
  .tsheet .tsh .t { flex: 1; text-align: center; font-size: 16px; font-weight: 700; }
  .tsheet .tsh .x { flex: none; width: 32px; height: 32px; color: var(--dim); font-size: 15px; }
  .tsitem { padding: 12px 0; }
  .tsitem + .tsitem { border-top: 1px solid var(--line); }
  .tsitem-h { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
  .tsitem-h b { font-size: 14.5px; font-weight: 600; }
  .tsitem-h .sp { flex: 1; }
  .tstag { font-size: 11px; font-weight: 600; padding: 1.5px 8px; border-radius: 6px;
    color: var(--green); background: color-mix(in srgb, var(--green) 12%, transparent); }
  .tstag.bad { color: var(--red); background: color-mix(in srgb, var(--red) 12%, transparent); }
  .tstag.run { color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
  .tsms { font-size: 12px; color: var(--dim); }

  /* ==== 可搬运代码：方案B（步骤铁轨，长回合自动启用） ==== */
  .tsteps { margin: 2px 0 6px; }
  .tstep { display: flex; gap: 10px; }
  .tind { flex: none; width: 16px; display: flex; flex-direction: column; align-items: center; }
  .tdot { flex: none; width: 8px; height: 8px; border-radius: 999px; margin-top: 8px;
    background: var(--line); }
  .tdot.run { background: var(--accent); animation: tpulse 1.4s ease-in-out infinite; }
  .tdot.ok { background: var(--green); }
  .tdot.err { background: var(--red); }
  @keyframes tpulse {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 35%, transparent); }
    50% { box-shadow: 0 0 0 5px transparent; }
  }
  .trail { width: 1.5px; flex: 1; min-height: 10px; margin-top: 2px; background: var(--line); }
  .tstep:last-child .trail { display: none; }
  .tcard { flex: 1; min-width: 0; margin-bottom: 6px;
    background: var(--card); border: 1px solid var(--line); border-radius: 12px;
    overflow: hidden; }
  .tcard.errcard { border-color: color-mix(in srgb, var(--red) 32%, var(--line)); }
  .tline { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
    padding: 9px 12px; }
  .tline:active { background: var(--panel); }
  .tlbl { flex: 1; min-width: 0; font-size: 13.5px; display: flex; align-items: baseline;
    gap: 7px; overflow: hidden; }
  .tlbl b { flex: none; font-weight: 600; }
  .tsum { font-style: normal; color: var(--dim); font-size: 12.5px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tmeta { flex: none; font-size: 12px; color: var(--dim); }
  .tchev { flex: none; color: var(--dim); font-size: 13px; transition: transform .18s ease; }
  .tline.open .tchev { transform: rotate(90deg); }
  .tbody { border-top: 1px solid var(--line); padding: 8px 12px 10px; }
  .tsec-h { font-size: 11px; font-weight: 500; letter-spacing: .1em; color: var(--dim);
    margin: 2px 0 4px; }
  .targs { margin: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11.5px; line-height: 1.5; color: var(--text);
    background: var(--panel); border-radius: 8px; padding: 8px 10px;
    max-height: 150px; overflow: auto; white-space: pre-wrap; word-break: break-word; }
  .tres { font-size: 13px; line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
  .tres.tempty { color: var(--dim); }

  .ctrls { display: flex; gap: 8px; margin: 14px 0 4px; flex-wrap: wrap; }
  .cbtn { flex: none; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line);
    background: var(--card); font-size: 13px; color: var(--dim); }
  .cbtn:active { background: var(--panel); }


  /* ==== MCP工具箱卡片风（16:50 v2）==== */
  .mcp-summary { font-size: 13px; color: var(--dim); padding: 10px 4px 12px; }
  .mcp-summary b { color: var(--text); }
  .mcp-list { display: flex; flex-direction: column; gap: 10px; }
  .mcp-card { background: var(--panel); border-radius: 16px; padding: 14px 16px; }
  .mcp-card-top { display: flex; align-items: center; gap: 9px; }
  .mcp-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
  .mcp-dot.on { background: #7fb881; box-shadow: 0 0 0 3px rgba(127,184,129,.18); }
  .mcp-dot.off { background: #c96a6a; box-shadow: 0 0 0 3px rgba(201,106,106,.15); }
  .mcp-card-name { flex: 1; font-weight: 700; font-size: 16px; }
  .mcp-badge { font-size: 11px; padding: 2px 9px; border-radius: 99px; flex: none; }
  .mcp-badge.on { background: rgba(127,184,129,.15); color: #4a7a4e; }
  .mcp-badge.off { background: rgba(201,106,106,.12); color: #a05252; }
  .mcp-ic { width: 32px; height: 32px; border-radius: 50%; border: none; background: none; color: var(--dim); display: flex; align-items: center; justify-content: center; flex: none; }
  .mcp-ic:active { background: var(--line); }
  .mcp-ic .ic { width: 15px; height: 15px; }
  .mcp-card-url { font-size: 11.5px; color: var(--dim); word-break: break-all; margin-top: 7px; padding-left: 18px; }
  .mcp-card-meta { display: flex; gap: 12px; font-size: 11.5px; color: var(--dim); margin-top: 7px; padding-left: 18px; }
  .mcp-actions { display: flex; gap: 10px; margin-top: 14px; }
  .mcp-btn { flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px;
    padding: 13px; border-radius: 14px; border: 1px solid var(--line); background: var(--card);
    color: var(--text); font-size: 14.5px; }
  .mcp-btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
  .mcp-btn:active { opacity: .85; }
  .mcp-btn .ic { width: 15px; height: 15px; }
  .mcp-hint { font-size: 11.5px; color: var(--dim); padding: 12px 4px; line-height: 1.6; }
  .mcp-field { display: flex; align-items: center; gap: 10px; padding: 13px 16px; }
  .mcp-field label { font-size: 13.5px; color: var(--dim); flex: none; width: 88px; }
  .mcp-field input { flex: 1; border: none; background: none; text-align: right; color: var(--text); font-size: 14.5px; min-width: 0; }


/* ---- 四主题token（自dwell-ui.css v1.3注入，栖燃9-15） + index变量适配 ---- */
[data-theme="t-terracotta"]{
  --bg:#faf9f5; --card:#ffffff; --panel:#f0eee6; --line:#e8e5dc;
  --text:#2b2a27; --dim:#8a867c; --dim-strong:#6f6d64;
  --accent:#c96442; --accent-ink:#ffffff; --rose:#d48a94;
  --green:#2e7d43; --red:#c0392b;
  --overlay:rgba(40,38,34,.4); --user-bubble:#f0eee6;
  --glow:rgba(201,100,66,.16); --scrim:rgba(250,249,245,.78);
  --r-sm:10px; --r-md:14px; --r-lg:16px; --r-pill:999px;
  --font-display:"Noto Serif SC","Songti SC","STSong",serif;
}
[data-theme="t-candy"]{
  --bg:#fff7fa; --card:#ffffff; --panel:#ffe9f1; --line:#f7dbe6;
  --text:#4a3540; --dim:#a67a8d; --dim-strong:#8a5f71;
  --accent:#b2537b; --accent-ink:#ffffff; --rose:#e39cb8;
  --green:#2e7d43; --red:#c0392b;
  --overlay:rgba(74,53,64,.35); --user-bubble:#ffe4ee;
  --glow:rgba(216,120,159,.22); --scrim:rgba(255,247,250,.8);
  --r-sm:14px; --r-md:18px; --r-lg:24px; --r-pill:999px;
  --font-display:"Yuanti SC","PingFang SC","Noto Sans SC",sans-serif;
}
[data-theme="t-nightlamp"]{
  /* [ds 10-01 栖燃 804 go] 经典暗夜 = **中性炭黑**（小羽拍板：不要紫黑 ✓）
     与 dwell-ui.css:275 完全一致 ✓ 色值照 index.css 旧 dark：#262624/#30302e/#383836/#3d3d3a */
  --bg:#262624; --card:#30302e; --panel:#383836; --line:#3d3d3a;
  --text:#f5f4ef; --dim:#a3a099; --dim-strong:#bfb3a4;
  --accent:#c96442; --accent-ink:#ffffff;
  --rose:#e8a9ae; --green:#6fbf85; --red:#e07a6a;
  --overlay:rgba(0,0,0,.55); --user-bubble:#35353260;
  --scrim:rgba(38,38,36,.72);
  --r-sm:10px; --r-md:14px; --r-lg:16px; --r-pill:999px;
}
[data-theme="t-garden"]{
  --bg:#f4f6ef; --card:#ffffff; --panel:#e9efe2; --line:#dde4d3;
  --text:#2e332b; --dim:#82887b; --dim-strong:#5d6455;
  --accent:#5c7355; --accent-ink:#ffffff; --rose:#d48a94;
  --green:#3d7a4e; --red:#c0392b;
  --overlay:rgba(46,51,43,.4); --user-bubble:#e7eedd;
  --glow:rgba(109,133,101,.18); --scrim:rgba(244,246,239,.78);
  --r-sm:10px; --r-md:14px; --r-lg:16px; --r-pill:999px;
  --font-display:"Noto Serif SC","Songti SC","STSong",serif;
}
[data-theme="t-terracotta"], [data-theme="t-garden"]{
  --accent-soft: var(--accent); --serif: SerifNum, "Songti SC", "Noto Serif SC", Georgia, serif;
  --glass: color-mix(in srgb, var(--card) 70%, transparent);
}
[data-theme="t-candy"]{
  --accent-soft: var(--accent); --serif: "Yuanti SC", "PingFang SC", "Noto Sans SC", sans-serif;
  --glass: color-mix(in srgb, var(--card) 70%, transparent);
}
[data-theme="t-nightlamp"]{
  --accent-soft: var(--accent); --serif: SerifNum, "Songti SC", "Noto Serif SC", Georgia, serif;
  --glass: color-mix(in srgb, var(--card) 70%, transparent);
}
/* 灯屋是暗主题：系统暗色媒体查询不再覆盖它（data-theme优先级已高于:root，但index的@media暗色块选择器是html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"])会误伤新主题——用更高优先级抵消） */
html[data-theme="t-candy"], html[data-theme="t-garden"], html[data-theme="t-terracotta"]{
  --bg-override: 1;
}


/* ==== dsLogin 登录遮罩样式（原style块2） ==== */
    #dsLogin{background:linear-gradient(165deg,var(--bg,#fff8f2),var(--bg2,#fde9dd))!important}
    #dsLogin .ds-card{background:var(--card,#fff8f2);border:1px solid var(--line,#f0e3d8);border-radius:20px;padding:34px 30px;width:min(340px,86vw);box-shadow:0 14px 44px rgba(120,80,50,.14);text-align:center}
    #dsLogin h1{font-size:26px;margin:0 0 4px;color:var(--ink,#4a3f38);letter-spacing:1px}
    #dsLogin .sub{font-size:12.5px;color:var(--ink-soft,#9a8f84);margin:0 0 20px}
    #dsLogin input{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:12px;border:1px solid var(--line,#f0e3d8);background:var(--bg,#fff);color:var(--ink,#4a3f38);font-size:15px;text-align:center;letter-spacing:2px;outline:none}
    #dsLogin input:focus{border-color:var(--accent,#e0835a)}
    #dsLogin button{margin-top:14px;width:100%;padding:12px;border:none;border-radius:12px;background:linear-gradient(150deg,var(--accent,#e0835a),var(--accent-d,#c96a3f));color:#fff;font-weight:700;font-size:15px;cursor:pointer;letter-spacing:3px}
    #dsLogin button:disabled{opacity:.55;cursor:wait}
    #dsLogin .msg{margin-top:12px;font-size:12.5px;min-height:16px;color:#c0564a}
    #dsLogin .msg.ok{color:var(--good,#3c8a4e)}
    @media (prefers-color-scheme: dark){
      #dsLogin{background:linear-gradient(165deg,#241a16,#2b1f19)!important}
      #dsLogin .ds-card,#dsLogin .ds-hint{background:#2b1f19}
      #dsLogin .ds-card{border-color:#3a2c24;box-shadow:0 14px 44px rgba(0,0,0,.5)}
    }

/* ═══ 表情包v2：上传+自定义角标 ═══ */
.sticker-cell { position: relative; }
.sticker-cell.custom img { outline: 2px dashed var(--c-accent, #b98a47); outline-offset: 2px; border-radius: 8px; }
.sticker-tag {
  position: absolute; bottom: 3px; left: 50%; transform: translateX(-50%);
  font-size: 10px; padding: 1px 6px; border-radius: 8px;
  background: rgba(0,0,0,.55); color: #fff; white-space: nowrap; max-width: 90%;
  overflow: hidden; text-overflow: ellipsis;
}
.sticker-upload-bar { padding: 10px 0 16px; text-align: center; }
.sticker-up-btn {
  padding: 8px 18px; border-radius: 999px; border: 1px dashed var(--c-accent, #b98a47);
  background: transparent; color: var(--c-accent, #b98a47); font-size: 13px;
}
.sticker-up-btn:active { background: rgba(185,138,71,.12); }


/* ═══ [kiran 09-26] 表情包消息：透明底适配+大图无框 ═══ */
.bubble img.chatimg {
  background: transparent !important;
  border-radius: 12px;
}
/* 气泡本身给图让位：含图消息的气泡去背景去边框（表情包模式） */
.bubble.imgonly {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.bubble.imgonly img.chatimg {
  max-width: min(220px, 80%);
  width: auto; height: auto;
  background: transparent !important;
  display: block; margin-left: auto; margin-right: 0;
}

/* ═══ [kiran 09-26] dwell风格对话框/操作菜单 v2：全走主题token，四主题自动适配 ═══ */
.dask-mask {
  position: fixed; inset: 0; z-index: 300;
  background: var(--overlay, rgba(40,38,34,.4));
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  padding: 32px;
  animation: daskIn .18s ease;
}
.dask-mask.sheet { align-items: flex-end; padding: 0; }
.dask {
  width: min(340px, 92vw);
  background: var(--card, #ffffff);
  border-radius: var(--r-lg, 16px);
  padding: 20px 18px 14px;
  box-shadow: 0 12px 40px var(--overlay, rgba(40,38,34,.3)), 0 2px 8px rgba(0,0,0,.08);
  border: 1px solid var(--line, #e8e5dc);
}
.dask-h {
  font-family: var(--font-display, serif); font-size: 16px; font-weight: 700;
  color: var(--text, #2b2a27); text-align: center; margin-bottom: 6px;
  letter-spacing: .3px;
}
.dask-d { font-size: 12.5px; color: var(--dim, #8a867c); text-align: center; margin-bottom: 10px; line-height: 1.5; }
.dask-inp {
  width: 100%; box-sizing: border-box; margin: 10px 0 4px;
  padding: 10px 14px; border-radius: var(--r-md, 14px);
  border: 1px solid var(--line, #e8e5dc);
  background: var(--bg, #faf9f5); color: var(--text, #2b2a27);
  font-size: 15px; outline: none;
  transition: border-color .15s;
}
.dask-inp:focus { border-color: var(--accent, #c96442); }
.dask-row { display: flex; gap: 10px; margin-top: 14px; }
.dask-btn {
  flex: 1; padding: 10px 0; border-radius: var(--r-md, 14px); border: none;
  background: var(--panel, #f0eee6); color: var(--text, #2b2a27);
  font-size: 14.5px; cursor: pointer;
  transition: transform .1s, opacity .15s;
}
.dask-btn:active { transform: scale(.97); }
.dask-btn.ok {
  background: color-mix(in srgb, var(--accent, #c96442) 78%, var(--card, #fff));
  color: var(--accent-ink, #fff); font-weight: 600;
}
@supports not (background: color-mix(in srgb, red 50%, blue)) {
  .dask-btn.ok { background: var(--accent-soft, var(--accent, #c96442)); }
}
.dask-btn.ok.danger { background: var(--red, #c0392b); color: #fff; }
.dsheet {
  width: 100%; max-width: 480px;
  background: var(--card, #ffffff);
  border-radius: var(--r-lg, 16px) var(--r-lg, 16px) 0 0;
  padding: 14px 14px calc(14px + env(safe-area-inset-bottom));
  box-shadow: 0 -8px 30px var(--overlay, rgba(40,38,34,.25));
  animation: dsheetUp .22s ease;
}
.dsheet-h {
  font-size: 13px; color: var(--dim, #8a867c); text-align: center;
  padding: 6px 0 10px;
}
.dsheet-btn {
  display: block; width: 100%; padding: 13px 0; margin-bottom: 6px;
  border-radius: var(--r-md, 14px); border: none;
  background: var(--panel, #f0eee6); color: var(--text, #2b2a27);
  font-size: 15px; cursor: pointer;
}
.dsheet-btn:active { background: var(--line, #e8e5dc); }
.dsheet-btn.danger { color: var(--red, #c0392b); }
.dsheet-btn.cancel { margin-top: 4px; font-weight: 600; }
@keyframes daskIn { from { opacity: 0; } }
@keyframes dsheetUp { from { transform: translateY(40px); opacity: .4; } }
  :root {
    --bg: #faf9f5;
    --card: #ffffff;
    --panel: #f0eee6;
    --line: #e8e5dc;
    --text: #2b2a27;
    --dim: #8a867c;
    --accent: #c96442;        
    --accent-soft: #d97757;
    --user-bubble: #f0eee6;
    --sage: #96B08F;          
    --sage-track: #E7EDE2;
    --pink-track: #F8E5DE;
    --green: #2e7d43;
    --red: #c0392b;
    --amber: #e3a13a;         
    --amber-track: #f5e6c8;
    --red-track: #f6d8d4;
    --overlay: rgba(40, 38, 34, .4);
    --serif: SerifNum, "Songti SC", "Noto Serif SC", Georgia, serif;
    --glass: color-mix(in srgb, var(--card) 70%, transparent);  /* 悬浮层玻璃度（顶栏/菜单——内容条 8/3 改用 --panel 实色） */
    --pink: #E5A192;          
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) {
      --bg: #262624; --card: #30302e; --panel: #383836; --line: #3d3d3a;
      --text: #f5f4ef; --dim: #a3a099; --user-bubble: #35353260;
      --sage: #A8C0A0; --sage-track: #3A423A; --pink-track: #4A3B34;
      --green: #6fbf85; --red: #e07a6a;
      --amber: #e8b45c; --amber-track: #4a4232; --red-track: #4d3a36;
      --overlay: rgba(0, 0, 0, .55);
    }
}
html[data-theme="dark"] {
      --bg: #262624; --card: #30302e; --panel: #383836; --line: #3d3d3a;
      --text: #f5f4ef; --dim: #a3a099; --user-bubble: #35353260;
      --sage: #A8C0A0; --sage-track: #3A423A; --pink-track: #4A3B34;
      --green: #6fbf85; --red: #e07a6a;
      --amber: #e8b45c; --amber-track: #4a4232; --red-track: #4d3a36;
      --overlay: rgba(0, 0, 0, .55);
    }
  
  @font-face {
    font-family: SerifNum;
    src: local("Helvetica Neue"), local("Helvetica");
    unicode-range: U+0030-0039, U+002F, U+002E, U+003A;
  }
  * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
  html, body {
    margin: 0; height: 100%;
    overflow-x: hidden; max-width: 100vw;   
    background: var(--bg); color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Noto Sans SC", "Segoe UI", sans-serif;
    font-size: 15.5px; line-height: 1.72;
    font-variant-numeric: tabular-nums;   
    -webkit-font-smoothing: antialiased;
    overscroll-behavior: none;
  }
  body { display: flex; flex-direction: column; }
  button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }

  .ic { display: inline-flex; align-items: center; justify-content: center; flex: none; }
  .ic svg { width: 100%; height: 100%; display: block; }
  
  #doingLine { display: none; margin: 0 auto 7px; max-width: 720px;
    pointer-events: none; }
  #doingLine.on { display: flex; }
  #doingLine .pill { display: inline-flex; align-items: center; gap: 8px;
    max-width: 100%; padding: 7px 14px; border-radius: 999px;
    font-size: 14px; color: var(--dim); font-variant-numeric: tabular-nums;
    white-space: nowrap; overflow: hidden;
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    box-shadow: 0 2px 14px rgba(0,0,0,.07), inset 0 0 0 1px rgba(255,255,255,.5); }
  
  #doingLine .w { font-weight: 600; color: var(--accent); overflow: hidden;
    text-overflow: ellipsis; }
  #doingLine .en { color: var(--accent); opacity: .55; font-size: 12px;
    font-weight: 600; flex: none; }
  #doingLine .t { flex: none; color: var(--dim); }
  #doingLine .t { opacity: .75; }

  .toast {
    display: flex; align-items: center; gap: 12px;
    padding: 13px 14px 13px 16px; border-radius: 20px;
    pointer-events: auto; cursor: pointer;
    transform: translateY(-140%); opacity: 0;
    transition: transform .42s cubic-bezier(.22,1.1,.36,1), opacity .28s ease;
  }
  .toast.in { transform: translateY(0); opacity: 1; }
  .toast .ti { flex: none; width: 22px; height: 22px; color: var(--dim); }
  .toast .ti svg { width: 100%; height: 100%; stroke-width: 1.8; }
  .toast .tx { flex: 1; min-width: 0; }
  .toast .t1 { font-size: 14.5px; font-weight: 700; line-height: 1.35; }
  .toast .t2 { font-size: 13px; color: var(--dim); line-height: 1.45; margin-top: 1px;
    word-break: break-word; }
  .toast .tx-close { flex: none; width: 26px; height: 26px; color: var(--dim); opacity: .7; }
  .toast .tx-close svg { width: 100%; height: 100%; stroke-width: 1.8; }

  .glass,
  .composer, #nkPop, .nk-say, .board-toggle, .menuCard, .crow, .songcard {
    
    background: var(--glass);
    background: linear-gradient(180deg,
      color-mix(in srgb, var(--card) 76%, transparent),
      color-mix(in srgb, var(--card) 58%, transparent));
    -webkit-backdrop-filter: blur(24px) saturate(1.9) brightness(1.04);
    backdrop-filter: blur(24px) saturate(1.9) brightness(1.04);
    border: 0;
    box-shadow:
      0 10px 34px rgba(0,0,0,.09),              /* 外阴影：浮起来 */
      0 1px 3px rgba(0,0,0,.05),                /* 贴地那道近影 */
      inset 0 1px 0 rgba(255,255,255,.92),      /* 顶部内高光：上边缘那道光 */
      inset 0 -7px 18px rgba(255,255,255,.34),  /* 底部内反光：光打在下沿的回弹 */
      inset 0 0 0 1px rgba(255,255,255,.44);    /* 一圈细描边：厚度的轮廓 */
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .glass,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .songcard,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .composer,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #nkPop,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .nk-say,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .board-toggle,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .menuCard,
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .crow {
      background: var(--glass);
      background: linear-gradient(180deg,
        color-mix(in srgb, var(--card) 74%, transparent),
        color-mix(in srgb, var(--card) 56%, transparent));
      box-shadow:
        0 12px 38px rgba(0,0,0,.42),
        0 1px 3px rgba(0,0,0,.3),
        inset 0 1px 0 rgba(255,255,255,.16),
        inset 0 -7px 18px rgba(255,255,255,.045),
        inset 0 0 0 1px rgba(255,255,255,.09);
    }
}
html[data-theme="dark"] .glass,
  html[data-theme="dark"] .songcard,
  html[data-theme="dark"] .composer,
  html[data-theme="dark"] #nkPop,
  html[data-theme="dark"] .nk-say,
  html[data-theme="dark"] .board-toggle,
  html[data-theme="dark"] .menuCard,
  html[data-theme="dark"] .crow {
      background: var(--glass);
      background: linear-gradient(180deg,
        color-mix(in srgb, var(--card) 74%, transparent),
        color-mix(in srgb, var(--card) 56%, transparent));
      box-shadow:
        0 12px 38px rgba(0,0,0,.42),
        0 1px 3px rgba(0,0,0,.3),
        inset 0 1px 0 rgba(255,255,255,.16),
        inset 0 -7px 18px rgba(255,255,255,.045),
        inset 0 0 0 1px rgba(255,255,255,.09);
    }

  /* ============ 顶栏（悬浮玻璃，消息从底下滑过去） ============ */
  header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 20;
    padding: 8px 12px 20px; padding-top: calc(8px + env(safe-area-inset-top));
    display: flex; align-items: center; gap: 8px;
    
    background: linear-gradient(to bottom,
      color-mix(in srgb, var(--bg) 88%, transparent) 0%,
      color-mix(in srgb, var(--bg) 55%, transparent) 55%,
      transparent 100%);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 52%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 52%, transparent 100%);
  }
  .iconbtn {
    width: 40px; height: 40px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    flex: none; color: var(--text);
  }
  .iconbtn .ic { width: 18px; height: 18px; }
  
  header .iconbtn.glass {
    background: transparent;
    border: none; box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .title { flex: 1; text-align: center; min-width: 0; }
  .title h1 { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.3; }
  .title .sub { font-size: 12px; color: var(--dim); line-height: 1.2; }
  .row { width: 100%; max-width: 720px; margin: 0 auto; padding: 0 4px; }
  .row.me { display: flex; justify-content: flex-end; }
  .bubble {
    background: var(--user-bubble); /* fallback: 不支持 color-mix 的旧浏览器仍是实色，气泡不消失 */
    background: color-mix(in srgb, var(--user-bubble) 55%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.8);
    backdrop-filter: blur(20px) saturate(1.8);
    border: 1px solid rgba(255,255,255,.35); /* fallback: 1px 亮光边 */
    border: 1px solid color-mix(in srgb, #fff 45%, transparent);
    border-radius: 18px; padding: 11px 17px;
    box-shadow: 0 4px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.5);
    max-width: 88%; white-space: pre-wrap; word-break: break-word;
  }
  .gu {
    background: var(--card); /* fallback */
    background: color-mix(in srgb, var(--card) 55%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.8);
    backdrop-filter: blur(20px) saturate(1.8);
    border: 1px solid rgba(255,255,255,.35); /* fallback: 1px 亮光边 */
    border: 1px solid color-mix(in srgb, #fff 45%, transparent);
    border-radius: 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,.07), inset 0 1px 0 rgba(255,255,255,.45);
    white-space: pre-wrap; word-break: break-word;
  }
  .bsw {
    display: inline-flex; align-items: center; gap: 2px; margin-top: 5px;
    font-size: 11px; opacity: .55; transition: opacity .2s;
  }
  .bsw:hover { opacity: 1; }
  .bsw button {
    border: none; background: rgba(128,128,128,.14); color: inherit; cursor: pointer;
    width: 22px; height: 18px; border-radius: 9px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center; padding: 0;
  }
  .bsw button:disabled { opacity: .35; cursor: default; }
  .bsw .n { min-width: 30px; text-align: center; font-size: 10.5px; opacity: .8; }
  .bmenu {
    display: inline-flex; gap: 2px; margin-top: 5px; opacity: 0; transition: opacity .2s;
  }
  .row:hover .bmenu, .bmenu:focus-within { opacity: .75; }
  .bmenu button {
    border: none; background: rgba(128,128,128,.12); color: inherit; cursor: pointer;
    height: 22px; padding: 0 9px; border-radius: 11px; font-size: 11px;
    display: inline-flex; align-items: center; gap: 4px;
  }
  .bmenu button:hover { background: rgba(128,128,128,.22); }
  #treeSheet .tbody { padding: 14px 16px 20px; font-size: 13px; }
  .tnode {
    display: flex; align-items: baseline; gap: 8px; padding: 6px 8px;
    border-radius: 10px; cursor: pointer; line-height: 1.45;
  }
  .tnode:hover { background: rgba(128,128,128,.08); }
  .tnode.on { background: rgba(201,100,66,.12); }
  .tnode .tseq { font-size: 10.5px; opacity: .45; flex: none; min-width: 30px; }
  .tnode .tkind { flex: none; font-size: 10.5px; opacity: .6; }
  .tnode.on .tkind { color: #c96442; opacity: 1; }
  .tnode .tprev { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tnode.branchroot { margin-left: 18px; border-left: 2px solid rgba(201,100,66,.35); }
  .tnode .tgap { flex: none; width: 14px; }
  .gu img.chatimg, .bubble img.chatimg {
    max-width: min(240px, 70%); border-radius: 14px; display: block; margin: 6px 0;
  }
  
  .gu strong, .bubble strong { font-weight: 700; }
  .gu a, .bubble a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
  .gu s, .bubble s { opacity: .55; }
  
  .cbk { margin: 10px 0; border-radius: 16px; overflow: hidden;
    background: var(--card); box-shadow: inset 0 0 0 1px var(--line); }
  .cbk-h { display: flex; align-items: center; gap: 2px;
    padding: 9px 10px 8px 15px; box-shadow: inset 0 -1px 0 var(--line); }
  .cbk-h .lang { flex: 1; min-width: 0; font-size: 12.5px; color: var(--dim);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
  .cbk-h button { flex: none; width: 30px; height: 30px; padding: 6px;
    background: none; border: 0; color: var(--dim); cursor: pointer;
    border-radius: 8px; display: flex; align-items: center; justify-content: center; }
  .cbk-h button svg { width: 100%; height: 100%; stroke-width: 1.8; }
  .cbk-h button:active { background: rgba(128,128,128,.12); }
  
  .cbk-h button.done { color: var(--dim); }
  .cbk pre { margin: 0; padding: 13px 15px 15px; overflow-x: auto;
    -webkit-overflow-scrolling: touch; }
  .cbk code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12.5px; line-height: 1.7; white-space: pre;
    background: none; padding: 0; color: var(--text); }
  /* 点右边那个展开：整段代码摊到全屏看，长命令不用左右拖 */
  .cbk-full { position: fixed; inset: 0; z-index: 300; display: flex;
    flex-direction: column; background: var(--bg);
    padding: calc(env(safe-area-inset-top) + 12px) 0 calc(env(safe-area-inset-bottom) + 12px); }
  .cbk-full .cbk-h { box-shadow: inset 0 -1px 0 var(--line); }
  .cbk-full pre { flex: 1; overflow: auto; }
  .cbk-full code { white-space: pre-wrap; word-break: break-all; }
  .gu .caret {
    display: inline-block; width: 7px; height: 1.05em; vertical-align: -2px;
    background: var(--accent-soft); border-radius: 1px; animation: blink 1s steps(2) infinite;
  }
  @keyframes blink { 50% { opacity: 0; } }

  .toolline .ic { width: 15px; height: 15px; }
  .grabber {
    width: 38px; height: 5px; border-radius: 3px; background: var(--line);
    margin: 10px auto 0; flex: none;
  }

  .toolline {
    color: var(--dim); font-size: 14.5px; cursor: pointer; user-select: none;
    display: flex; align-items: center; gap: 6px; min-height: 24px;
    max-width: 100%;
  }
  .toolline:active { opacity: .6; }
  
  .toolline .lbl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    min-width: 0; flex: 1 1 auto; }
  .toolline .lbl b { font-weight: 500; color: var(--dim); }
  .toolline .plus { color: var(--green); }
  .toolline .minus { color: var(--red); }
  .toolline .chev { flex: none; font-size: 13px; }
  .toolline .spin {
    flex: none; width: 13px; height: 13px; border-radius: 50%;
    border: 2px solid var(--line); border-top-color: var(--accent-soft);
    animation: rot 1s linear infinite;
  }
  @keyframes rot { to { transform: rotate(360deg); } }
  .err {
    font-size: 13px; color: var(--red);
    border-left: 2px solid var(--red); padding-left: 12px; white-space: pre-wrap;
  }

  #pet {
    display: block;  /* pet素材34e2a40已补齐，经小羽0917批准复活 [ds] */   /* 宠物挂件素材没跟着仓库带，暂时隐藏，免得空图标占个灰框 */
    position: fixed; right: 8px; bottom: calc(118px + env(safe-area-inset-bottom));
    width: 144px; height: 144px; z-index: 40; cursor: grab;
    -webkit-user-select: none; user-select: none; touch-action: none;
  }
  #pet:active { cursor: grabbing; }
  #pet.pet-off { display: none; }
  #pet img { width: 100%; height: 100%; display: block; pointer-events: none; }

  /* ============ 输入区 ============ */
  footer {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    padding: 6px 12px calc(10px + env(safe-area-inset-bottom));
    background: transparent; pointer-events: none;
  }
  /* padding-bottom 由 JS 跟着输入卡实际高度走，字永远不许被玻璃压住 */
  
  .composer {
    max-width: 720px; margin: 0 auto; pointer-events: auto;
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, .55);
    box-shadow: 0 2px 18px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.5);
    padding: 12px 14px 10px;
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #nkPop {
      border: 1px solid rgba(255,255,255,.12);
      box-shadow: 0 8px 28px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
    }
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #nkPop button {
      background: rgba(255,255,255,.1);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
    }
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .nk-say {
      background: var(--glass);
      border: 1px solid rgba(255,255,255,.12);
      box-shadow: 0 2px 18px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.08);
    }
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .composer {
      background: var(--glass);
      border: 1px solid rgba(255, 255, 255, .12);
      box-shadow: 0 2px 18px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.08);
    }
}
html[data-theme="dark"] .composer {
      background: var(--glass);
      border: 1px solid rgba(255, 255, 255, .12);
      box-shadow: 0 2px 18px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.08);
    }
  #attachStrip { display: none; gap: 8px; padding-bottom: 8px; flex-wrap: wrap; }
  #attachStrip .att {
    position: relative; width: 54px; height: 54px; border-radius: 10px; overflow: hidden;
    border: 1px solid var(--line); background: var(--panel);
    display: flex; align-items: center; justify-content: center; font-size: 11px; color: var(--dim);
  }
  #attachStrip .att img { width: 100%; height: 100%; object-fit: cover; }
  #attachStrip .att .x {
    position: absolute; top: 2px; right: 2px; width: 18px; height: 18px; border-radius: 50%;
    background: rgba(0,0,0,.55); color: #fff;
    display: flex; align-items: center; justify-content: center;
  }
  #box {
    width: 100%; border: 0; outline: 0; resize: none; background: transparent;
    color: var(--text); font: inherit; line-height: 1.6;
    max-height: 160px; padding: 2px 2px 8px;
  }
  #box::placeholder { color: var(--dim); }
  .ctlrow { display: flex; align-items: center; gap: 8px; }
  .pill {
    display: flex; align-items: center; gap: 6px;
    background: var(--panel); border-radius: 999px;
    padding: 7px 14px; font-size: 14px; color: var(--text);
  }
  .pill:active { opacity: .7; }
  .pill .ic { width: 14px; height: 14px; }
  #plusBtn { width: 36px; height: 36px; border-radius: 50%; background: var(--panel); flex: none; display: flex; align-items: center; justify-content: center; }
  #plusBtn .ic { width: 17px; height: 17px; }
  #stickerBtn { width: 36px; height: 36px; border-radius: 50%; background: var(--panel); flex: none; display: flex; align-items: center; justify-content: center; }
  #stickerBtn .ic { width: 18px; height: 18px; }
  .sticker-search { padding: 10px 16px 4px; }
  .sticker-search input {
    width: 100%; box-sizing: border-box; padding: 9px 12px;
    border: 1px solid var(--line); border-radius: 10px;
    background: var(--panel); color: inherit; font: inherit; font-size: 14px;
  }
  .sticker-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 8px 12px 16px; }
  .sticker-grid img {
    width: 100%; height: 76px; object-fit: contain; border-radius: 10px;
    background: transparent; cursor: pointer; padding: 2px; box-sizing: border-box;
  }
  .sticker-grid .sticker-cell:not(.custom) img { outline: none; }
  .sticker-grid img:active { transform: scale(.96); }
  .hw-heart {
  border: none; background: none; font-size: 13px; cursor: pointer;
  padding: 2px 4px; opacity: .75; transition: opacity .15s;
  filter: drop-shadow(0 2px 3px rgba(140,110,120,.25));
}
.hw-heart:hover { opacity: 1; }
  .wish-item { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; }
  .wish-item.imprint { background: linear-gradient(135deg, rgba(255,200,220,.18), rgba(255,180,210,.10)); border-color: #e8b4cf; }
  .wish-op { font-size: 12px; padding: 3px 10px; border-radius: 99px; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; }
  .wish-op.grant { border-color: #7fb881; color: #4a7a4e; }
  .wish-op.mark { border-color: #d89bc0; color: #a8628e; }
  .wish-op.del { color: #b0655c; border-color: #d3a49e; margin-left: auto; }
  .wish-filter { font-size: 12px; padding: 4px 12px; border-radius: 99px; border: 1px solid var(--line); background: transparent; color: var(--ink2); cursor: pointer; white-space: nowrap; }
  .wish-filter.active { background: var(--card); color: var(--ink); border-color: var(--ink2); font-weight: 600; }
  .wish-item.wish-fulfilled { background: linear-gradient(135deg, rgba(180,220,180,.14), rgba(160,210,170,.08)); border-color: #a8c9a8; }
  .wish-item.wish-released { opacity: .55; }
.saybtn {
    width: 26px; height: 26px; border-radius: 50%; margin: 2px 0 0 4px;
    background: var(--panel); color: var(--dim); flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity .15s;
  }
  .row:hover .saybtn, .saybtn:focus { opacity: 1; }
  .saybtn .ic { width: 13px; height: 13px; }
  .ctlrow .gap { flex: 1; }
  #send {
    flex: none; width: 38px; height: 38px; border-radius: 50%;
    background: var(--accent); color: #fff;
    display: flex; align-items: center; justify-content: center;
  }
  #send .ic { width: 17px; height: 17px; }
  #send:disabled { opacity: .35; }
  
  #send.stop { background: var(--panel); box-shadow: inset 0 0 0 1px var(--line); }
  #send.stop .ic { display: none; }
  #send.stop::after {
    content: ''; width: 13px; height: 13px; border-radius: 3px; background: var(--text);
  }

  #lockWrap {
    position: fixed; inset: 0; z-index: 999; background: var(--bg);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: calc(env(safe-area-inset-top) + 26px) 24px calc(env(safe-area-inset-bottom) + 15vh);
    transition: opacity .55s ease, transform .55s cubic-bezier(.4,0,.2,1);
    touch-action: none; user-select: none; -webkit-user-select: none;
    overflow: hidden;
  }
  
  #lockWrap.gone { opacity: 0; transform: translateY(-26px) scale(1.03); pointer-events: none; }
  @keyframes lkFloat { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-9px) } }
  
  .lk-knob {
    position: absolute; top: 5px; left: 5px; width: 52px; height: 52px; border-radius: 50%;
    background: var(--text);
    box-shadow: 0 3px 12px rgba(0,0,0,.22);
    display: flex; align-items: center; justify-content: center;
    transition: transform .32s cubic-bezier(.34,1.4,.5,1);
    touch-action: none; cursor: grab;
  }
  .lk-knob.dragging { transition: none; }
  .lk-knob::after {
    content: ''; width: 11px; height: 11px; border-right: 2.4px solid #fff;
    border-top: 2.4px solid #fff; transform: rotate(45deg) translate(-2px, 2px);
  }

  /* ============ 侧边栏 ============ */
  #drawerWrap { position: fixed; inset: 0; z-index: 40; display: none; }
  #drawerWrap.open { display: block; }
  #drawerWrap .shade { position: absolute; inset: 0; background: var(--overlay); opacity: 0; transition: opacity .22s; }
  #drawerWrap.show .shade { opacity: 1; }
  #drawer {
    position: absolute; top: 0; bottom: 0; left: 0; width: min(82vw, 330px);
    background: var(--bg); display: flex; flex-direction: column;
    padding: calc(16px + env(safe-area-inset-top)) 0 calc(14px + env(safe-area-inset-bottom));
    transform: translateX(-102%); transition: transform .24s ease;
    box-shadow: 4px 0 24px rgba(0,0,0,.12);
  }
  #drawerWrap.show #drawer { transform: none; }
  .nav { flex: 1; overflow-y: auto; padding: 0 10px; }
  .nav .item {
    display: flex; align-items: center; gap: 13px; width: 100%;
    padding: 8px 13px; border-radius: 11px; font-size: 16px; text-align: left;
  }
  .nav .item .ic { width: 21px; height: 21px; }
  .nav .item.on { background: var(--panel); }
  .nav .item.dis { color: var(--dim); }
  .nav .item.dis .tag {
    margin-left: auto; font-size: 11px; color: var(--dim);
    border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px;
  }
  
  .nav .sect {
    font-size: 12px; font-weight: 500; letter-spacing: .1em; color: var(--dim);
    padding: 10px 15px 4px; display: flex; align-items: center; gap: 10px;
  }
  .nav .sect.first { padding-top: 6px; }

  .nav .sect i {
    font-style: normal; font-size: 10px; letter-spacing: .05em;
    color: var(--dim); opacity: .75;
  }
  .nav .recent {
    display: block; width: 100%; text-align: left; padding: 10px 14px;
    font-size: 15.5px; border-radius: 10px;
  }
  .nav .recent:active { background: var(--panel); }
  #drawerNewChat {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px;
    height: 42px; border-radius: 21px; font-size: 14px;
    background: #f5f4ef; color: #262624;
  }
  html[data-theme="dark"] #drawerNewChat { background: #f5f4ef; color: #262624; }
  #drawerNewChat .ic { width: 15px; height: 15px; }
  /* 抽屉窗口条（官克式一行流，2026-09-10合体版） */
  .dw-win {
    display: block; width: 100%; text-align: left; min-height: 36px;
    padding: 7px 12px; border-radius: 11px; font-size: 14.5px;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  }
  .dw-win:active { background: var(--panel); }
  .dw-win.cur { background: var(--panel); font-weight: 600; }
  .dw-win.cur::before { content: "● "; font-size: 9px; vertical-align: 2px; color: var(--dim); }
  #drawerNewChat {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px;
    height: 42px; border-radius: 21px; font-size: 14.5px;
    background: var(--card); border: 1px solid var(--line);
  }
  #drawerNewChat .ic { width: 15px; height: 15px; }
  /* 抽屉里的窗口列表（chatnest式一行流） */
  .dw-win {
    display: flex; align-items: center; gap: 8px; width: 100%;
    min-height: 38px; padding: 7px 12px; border-radius: 11px;
    font-size: 14px; text-align: left; color: var(--ink2);
  }
  .dw-win .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .dw-win.cur { background: var(--panel); color: var(--ink); font-weight: 600; }
  .dw-win .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--line); flex: none; }
  .dw-win.cur .dot { background: #d89bc0; }
  
  #gongSheet .sheet { height: 100dvh; max-height: 100dvh; border-radius: 0; }
  /* 换行，不然他的思维链会被挤成气泡旁边一条窄柱（8/3 截图当场看出来的） */
  
  #gongBody { display: flex; flex-direction: column; gap: 18px; }
  #gongBody .gu, #gongBody .bubble { font-size: 15.5px; line-height: 1.75; }
  #gongSend {
    width: 38px; height: 38px; border-radius: 50%; flex: none;
    background: var(--accent); color: #fff;
    display: flex; align-items: center; justify-content: center;
  }
  #gongSend .ic { width: 18px; height: 18px; }
  #gongSend:disabled { opacity: .4; }

  .filecard {
    display: inline-flex; align-items: center; gap: 9px; max-width: 100%;
    background: var(--panel); border: 1px solid var(--line); border-radius: 13px;
    padding: 10px 14px; margin: 6px 0; font-size: 14.5px; color: var(--text);
    text-decoration: none; vertical-align: middle;
  }
  .filecard:active { background: var(--card); }
  .filecard .ic { width: 17px; height: 17px; color: var(--dim); flex: none; }
  .filecard span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* ============ 弹层 ============ */
  .sheetWrap { position: fixed; inset: 0; z-index: 50; display: none; }
  .sheetWrap.open { display: flex; align-items: flex-end; justify-content: center; }
  @media (min-width: 700px) { .sheetWrap.open { align-items: center; } }
  .sheetWrap .shade { position: absolute; inset: 0; background: var(--overlay); }
  .sheet {
    position: relative; width: 100%; max-width: 640px;
    max-height: 86vh; min-height: 300px;
    background: var(--bg); border-radius: 24px 24px 0 0;
    display: flex; flex-direction: column;
    animation: rise .22s ease;
  }
  @media (min-width: 700px) { .sheet { border-radius: 24px; max-height: 80vh; } }
  .sheet::after {   /* 往上拽的时候底下不露缝 */
    content: ""; position: absolute; top: 100%; left: 0; right: 0; height: 80px;
    background: var(--bg);
  }
  
  .sheetWrap.page .sheet {
    height: 100dvh; max-height: 100dvh; border-radius: 0;
  }
  .sheetWrap.page .grabber { margin-top: calc(10px + env(safe-area-inset-top)); }
  @keyframes rise { from { transform: translateY(24px); opacity: .6; } }
  .sheet .head {
    flex: none; display: flex; align-items: center; padding: 16px 16px 12px;
  }
  .sheet .head .hbtn {   
    width: 40px; height: 40px; flex: none; color: inherit;
    display: flex; align-items: center; justify-content: center;
  }
  .sheet .head .hbtn .ic { width: 19px; height: 19px; }
  .sheet .head .ht { flex: 1; text-align: center; font-size: 18px; font-weight: 700; padding: 0 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sheet .head .hspace { width: 40px; flex: none; }
  .sheet .body { flex: 1; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 6px 20px calc(20px + env(safe-area-inset-bottom)); }

  .group-label { font-size: 14.5px; color: var(--dim); padding: 14px 4px 8px; }
  .group { background: var(--panel); border-radius: 18px; overflow: hidden; }
  .group .grow {
    display: flex; align-items: center; gap: 13px; width: 100%;
    padding: 15px 18px; font-size: 16px; text-align: left;
  }
  .group .grow + .grow { border-top: 1px solid var(--line); }
  .group .grow .ic { width: 20px; height: 20px; color: var(--text); }
  .group .grow .val { margin-left: auto; color: var(--dim); font-size: 15px; }
  .group .grow .chev { color: var(--dim); font-size: 14px; }
  .group .grow .val + .chev { margin-left: 6px; }
  .group .grow:not(.static):active { background: rgba(0,0,0,.04); }
  .gnote { font-size: 13.5px; color: var(--dim); padding: 12px 6px 0; line-height: 1.6; }

  /* Usage */
  .ucard { background: var(--panel); border-radius: 18px; padding: 18px 20px; }
  .ucard + .ucard, .ucard + .group-label { margin-top: 6px; }
  .urow-top { display: flex; align-items: baseline; justify-content: space-between; }
  .urow-top .un { font-size: 17px; font-weight: 600; }
  .urow-top .up { font-size: 15px; color: var(--dim); }
  .ubar {
    height: 8px; border-radius: 999px; background: var(--amber-track);
    margin: 12px 0 10px; overflow: hidden;
  }
  
  .ubar > i { display: block; height: 100%; border-radius: 999px; background: var(--amber); transition: width .4s, background .3s; }
  .ubar.warn { background: var(--amber-track); }
  .ubar.warn > i { background: var(--amber); }
  .ubar.hot { background: var(--red-track); }
  .ubar.hot > i { background: var(--red); }

  /* 工具时间线 */
  .tl { padding: 8px 4px; }
  .tl .titem {
    display: flex; align-items: center; gap: 12px; width: 100%;
    padding: 9px 6px; font-size: 15.5px; text-align: left; border-radius: 10px;
  }
  .tl .titem:active { background: rgba(0,0,0,.04); }
  .tl .titem .ic { width: 19px; height: 19px; color: var(--text); }
  .tl .titem .tlbl { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dim); }
  .tl .titem .tlbl b { color: var(--text); font-weight: 500; }
  .tl .link { width: 2px; height: 14px; background: var(--line); margin-left: 14px; }
  .diff { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--card); }
  .diff .dl {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12.5px; line-height: 1.65; padding: 1px 12px;
    white-space: pre-wrap; word-break: break-all;
  }
  .diff .dl.add { background: rgba(46, 125, 67, .12); color: var(--green); }
  .diff .dl.del { background: rgba(192, 57, 43, .10); color: var(--red); }

  /* 选模型 / Effort / More models */
  .mrow { display: block; width: 100%; text-align: left; padding: 15px 18px; }
  .mrow + .mrow { border-top: 1px solid var(--line); }
  .mrow .mn { font-size: 16.5px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
  .mrow .mn .ck { margin-left: auto; color: var(--accent); width: 18px; height: 18px; }
  .mrow .mn .badge {
    font-size: 11.5px; font-weight: 500; color: var(--dim);
    background: var(--bg); border: 1px solid var(--line); border-radius: 999px; padding: 1px 9px;
  }
  .mrow .md { font-size: 13.5px; color: var(--dim); margin-top: 2px; font-weight: 400; }

  /* 全屏房间开着时，聊天的顶栏和输入卡先退场——毛玻璃层在个别浏览器里会钻上来 */
  body:has(.sheetWrap.open) header, body:has(.sheetWrap.open) footer { visibility: hidden; }
  .nb-tab {
    flex: 1; padding: 8px 0; border-radius: 10px; font-size: 14.5px;
    background: transparent; color: var(--dim);
  }
  .nb-tab.on {
    background: var(--card); color: var(--text); font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,.09);
  }
  .nb-note {
    position: relative; border-radius: 4px; padding: 15px 16px 12px;
    margin-bottom: 14px; box-shadow: 0 2px 7px rgba(0,0,0,.09);
    color: #3d3830;
  }
  .nb-note::before {   /* 顶上一条胶带，跟便签板一家人 */
    content: ""; position: absolute; top: -6px; left: 50%; margin-left: -22px;
    width: 44px; height: 13px; border-radius: 2px;
    background: rgba(243, 237, 221, .9); box-shadow: 0 1px 3px rgba(0,0,0,.12);
    transform: rotate(-1.5deg);
  }
  .nb-note .nbt { font-size: 15px; line-height: 1.75; white-space: pre-wrap; word-break: break-word; }
  .nb-note .nbm { font-size: 11.5px; opacity: .55; margin-top: 8px; display: flex; align-items: center; }
  .nb-note .nbx { margin-left: auto; opacity: .6; font-size: 13px; }
  .nb-write { display: flex; flex-direction: column; gap: 8px; background: var(--panel); border-radius: 16px; padding: 12px 14px; margin-bottom: 16px; }
  .nb-write textarea {
    border: 0; outline: 0; background: transparent; color: var(--text);
    font: inherit; font-size: 15px; resize: none; min-height: 62px; line-height: 1.7;
  }
  .nb-write textarea::placeholder { color: var(--dim); }
  .nb-write .go { align-self: flex-end; background: var(--text); color: var(--bg); border-radius: 999px; padding: 7px 20px; font-size: 14px; }

  /* 搜索 */
  .fd-bar { display: flex; align-items: center; gap: 10px; background: var(--panel); border-radius: 14px; padding: 11px 15px; }
  .fd-bar .ic { width: 17px; height: 17px; color: var(--dim); flex: none; }
  .fd-bar input { flex: 1; border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-size: 15.5px; }
  .fd-hit { padding: 12px 4px; border-bottom: 1px solid var(--line); }
  .fd-hit .fh { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--dim); margin-bottom: 4px; }
  .fd-hit .fk { background: var(--panel); border-radius: 999px; padding: 1px 9px; }
  .fd-hit .fs { font-size: 14.5px; line-height: 1.7; word-break: break-word; }
  .fd-hit .fs mark { background: rgba(217, 119, 87, .28); color: inherit; border-radius: 3px; padding: 0 2px; }

  .cal-head { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 2px 0 14px; }
  .cal-head .cm { font-size: 18px; font-weight: 600; min-width: 145px; text-align: center; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
  .cal-head .cnav { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; opacity: .55; }
  .cal-head .cnav .ic { width: 14px; height: 14px; }
  .cal-head .ctoday {   
    position: absolute; right: 0; top: 4px;
    font-size: 12.5px; color: var(--dim); padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px;
  }
  .cal-day {
    position: relative; aspect-ratio: 1 / 1.15;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: 15px; background: transparent;
  }
  .cal-day.other { opacity: .22; }
  .cal-day .dnum {
    width: 38px; height: 38px; border-radius: 50%;   
    display: flex; align-items: center; justify-content: center;
    font-variant-numeric: tabular-nums;      /* 1 和 31 一样宽，列才齐 */
    transition: background .18s;
  }
  
  .cal-day.sel .dnum { background: color-mix(in srgb, var(--dim) 30%, transparent); }
  
  .cal-day.today .dnum { background: var(--accent); color: #fff; }  /* 今天=这一屏唯一的一粒橘 */
  .cal-day .dnum, .cal-day .dots { position: relative; z-index: 1; }
  .cal-day .dots { display: flex; gap: 3px; height: 4px; margin-top: 3px; }
  .cal-day .dots i { width: 4px; height: 4px; border-radius: 50%; }
  .cal-day .dots .dr { background: var(--dim); }
  .cal-day .dots .ds { background: var(--text); }
  .cal-ev { display: flex; align-items: center; gap: 10px; padding: 12px 15px;
    font-size: 15px; margin-bottom: 9px; border-radius: 15px;
    background: var(--panel); }
  .cal-ev .et { flex: 1; min-width: 0; }
  .cal-ev .em { font-size: 12.5px; color: var(--dim); font-variant-numeric: tabular-nums; }
  .cal-ev .star { color: var(--pink); width: 16px; height: 16px; }
  .cal-ev .edel { color: var(--dim); width: 17px; height: 17px; opacity: .5; }
  .cal-plus { display: flex; align-items: center; gap: 8px; padding: 12px 15px;
    font-size: 14.5px; color: var(--dim); width: 100%; text-align: left;
    border-radius: 15px; border: 1px dashed var(--line); margin-bottom: 9px; }
  .cal-plus .ic { width: 14px; height: 14px; }
  .cal-add { display: none; border-radius: 15px; padding: 14px 15px 12px; margin-bottom: 9px;
    background: var(--panel); }
  .cal-add.open { display: block; }
  .cal-add input[type=text] {
    width: 100%; border: 0; outline: 0; background: transparent; color: var(--text);
    font: inherit; font-size: 15.5px; padding: 2px 0 10px;
  }
  .cal-add .row2 { display: flex; align-items: center; gap: 8px; font-size: 12.5px;
    color: var(--dim); flex-wrap: wrap; }
  .cal-add input[type=time] {
    border: 0; border-radius: 999px; padding: 6px 12px;
    background: var(--panel); color: var(--text); font: inherit; font-size: 12.5px;
    font-variant-numeric: tabular-nums; -webkit-appearance: none; appearance: none;
  }
  .cal-add .go { margin-left: auto; background: var(--text); color: var(--bg);
    border: 0; border-radius: 999px; padding: 8px 20px; font-size: 13px; font-weight: 500; }
  .pcard { margin-top: 14px; border-radius: 15px; padding: 14px 15px 10px;
    background: var(--panel); }
    .pcard .pt { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 7px; padding-bottom: 6px; }
  .pcard .pt .ic { width: 14px; height: 14px; color: var(--pink); }
  .cal-dc-w { flex: 0 0 auto; font-size: 11px; padding: 1px 7px; border-radius: 8px; }
  .cal-dc-w.me { background: var(--accent-weak, #F3E2DB); color: var(--accent-deep, #8A5A4A); }
  .cal-dc-w.gu { background: var(--line); color: var(--dim); }
  .cal-dc-diary { padding: 6px 0; border-top: 1px dashed var(--line); white-space: pre-wrap; word-break: break-word; }
  .cal-dc-diary:first-child { border-top: none; }
  .hd-editbtns { display: flex; gap: 8px; margin-top: 6px; }
  .hd-editbtns .go { padding: 4px 14px; font-size: 12.5px; }
  .prow { display: flex; align-items: center; padding: 11px 0; font-size: 14.5px; }
  .prow + .prow { border-top: 1px solid var(--line); }
  .prow .pk { color: var(--dim); font-size: 13.5px; letter-spacing: .08em; }
  .prow .pv { margin-left: auto; display: flex; align-items: center; gap: 16px; }
  /* 强度：亮几个就是几分，粉的 */
  .pv .lv { width: 19px; height: 19px; color: var(--pink); opacity: .25; }
  .pv .lv.on { opacity: 1; }
  .pv .lv svg { fill: currentColor; stroke: none; }
  .pv .gap { gap: 11px; display: flex; align-items: center; }
  /* 心情：一排小脸，选中的粉起来 */
  .pv .face { width: 25px; height: 25px; color: var(--dim); opacity: .45; }
  .pv .face.on { color: var(--pink); opacity: 1; }
  .pv .face svg { stroke-width: 1.7; }
  /* 来没来：iOS 那种开关 */
  .psw {
    width: 46px; height: 27px; border-radius: 999px; flex: none;
    background: color-mix(in srgb, var(--dim) 32%, transparent);
    position: relative; transition: background .22s;
  }
  .psw.on { background: var(--pink); }
  .psw::after {
    content: ""; position: absolute; top: 3px; left: 3px; width: 21px; height: 21px;
    border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.22);
    transition: transform .22s;
  }
  .psw.on::after { transform: translateX(19px); }
  @keyframes petal-sway { 0%, 100% { transform: rotate(-1.3deg); } 50% { transform: rotate(1.3deg); } }
  
  .sw { width: 46px; height: 28px; border-radius: 999px; background: var(--line);
    flex: none; position: relative; transition: background .28s; margin-left: auto; }
  .sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px;
    border-radius: 999px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.18);
    transition: transform .28s cubic-bezier(.34,1.4,.5,1); }
  .sw.on { background: var(--sage); }
  .sw.on::after { transform: translateX(18px); }
  .sw.wait { opacity: .45; }
  .grow .val + .sw { margin-left: 10px; }

  /* --tone 挂在整页上，不能挂在 SVG 里那个 g 上——挂在 g 上，
     底下的按钮在 SVG 外面，继承不到，选中的按钮就成了没底色的光杆 */
  
  @keyframes bdFloat  { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-11px); } }
  @keyframes bdBreath { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.14); } }
  
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv0 { background: #55554F; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv1 { background: #6A6963; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv2 { background: #8F8E88; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv3 { background: #B3B0A4; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv4 { background: #DCDAD2; }
    html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .bd-nums .xc-row .xc-fill.lv5 { background: var(--text); }
  }
  
  @keyframes bdGrow { from { transform: scaleX(0); } }
  
  @media (prefers-reduced-motion: reduce) {
    
  }
  
  .songcard { display: inline-flex; align-items: center; gap: 12px;
    margin: 10px 0; padding: 12px 14px; border-radius: 16px;
    min-width: min(276px, 100%); max-width: min(340px, 100%);
    cursor: pointer; transition: transform .16s; vertical-align: top; }
  .songcard.on:active { transform: scale(.99); }

  .repo-tabs { display: flex; gap: 6px; padding: 4px; margin-bottom: 14px;
    background: var(--panel); border-radius: 999px; }
  .repo-tabs button { flex: 1; border: 0; background: transparent; color: var(--dim);
    font-size: 13.5px; padding: 8px 0; border-radius: 999px; cursor: pointer;
    transition: background .18s, color .18s; }
  .repo-tabs button.on { background: var(--card); color: var(--text); font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,.06); }

  .rc { background: var(--panel); border-radius: 14px; padding: 12px 14px; margin-bottom: 8px; }
  .rc-f { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
  
  .rc-f .fx { font-size: 11px; color: var(--dim); background: var(--card);
    padding: 3px 8px; border-radius: 999px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .rc-f .fx.A::before { content: '+ '; }
  .rc-f .fx.D::before { content: '− '; }
  .rc-f .fx.more { font-family: inherit; }
  .rc-d { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
  .rc.open .rc-d { max-height: none; margin-top: 12px; }

  .repo-diff { background: var(--card); border-radius: 10px; padding: 10px 0;
    overflow-x: auto; }
  .repo-diff .dl { font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11.5px; line-height: 1.6; white-space: pre; padding: 0 12px;
    color: var(--text); }
  .repo-diff .dl.a { background: color-mix(in srgb, #3d7f4a 11%, transparent); }
  .repo-diff .dl.d { background: color-mix(in srgb, #a04a42 11%, transparent); }
  .repo-diff .dl.at { color: var(--dim); margin-top: 6px; }
  .repo-diff .dl.g { color: var(--text); font-weight: 600; margin-top: 12px;
    padding-top: 8px; border-top: 1px solid var(--line); }
  .repo-diff .dl.meta { color: var(--dim); opacity: .7; }

  .repo-crumb { font-size: 13px; margin-bottom: 12px; color: var(--dim); }
  .repo-crumb .cb { cursor: pointer; color: var(--text); }
  .repo-crumb .cs { margin: 0 5px; }
  .ri { display: flex; align-items: center; gap: 10px; padding: 12px 14px;
    cursor: pointer; border-bottom: 1px solid var(--line); }
  .ri:last-child { border-bottom: 0; }
  .ri .ic { width: 16px; height: 16px; flex: none; color: var(--dim); }
  .ri.dir .ic { color: var(--text); }
  .rn { flex: 1; font-size: 14.5px; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; }
  .ri.dir .rn { font-weight: 600; }
  .repo-file { background: var(--card); border-radius: 12px; padding: 12px;
    overflow-x: auto; }
  .repo-file pre { margin: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11.5px; line-height: 1.65; white-space: pre; }

  /* 点哪一行，下面那条线就换成哪一项。选中的那行左边立一道竖杠——
     不加颜色、不加底色（本家橘一屏最好为零，这里一点都不该用） */
  
  @keyframes bdDraw { to { stroke-dashoffset: 0; } }
  /* 「做完了」那一刀 */
  
  /* 标题即结论（Tufte）：这一行说的是"发生了什么"，不是"这是什么图" */
  
  /* 线头上那个点——"现在在这儿" */
  
  /* 按住拖出来的游标 */
  
  @media (prefers-reduced-motion: reduce) {
    
  }
  
  /* 梦（2026-08-06）。卡片照家里统一那份暖灰来，不另起炉灶 */
  
  .nt-day { font-size: 11.5px; color: var(--dim); letter-spacing: .1em;
    margin: 22px 4px 8px; }
  .nt-day:first-child { margin-top: 4px; }
  .dm-card.nt .dm-when { font-variant-numeric: tabular-nums; }
  .dm-card.nt .dm-b { white-space: pre-wrap; }
  .nt-switch { border: 1px solid var(--line); background: var(--card-2, transparent); color: var(--dim);
    border-radius: 999px; padding: 7px 16px; font-size: 12.5px; letter-spacing: .06em; cursor: pointer; }
  .nt-switch.on { color: var(--accent-deep, #8A5A4A); border-color: var(--accent-weak, #F3E2DB);
    background: var(--accent-weak, #F3E2DB); }
  .dm-card { background: var(--panel); border-radius: 16px; padding: 15px 16px 14px;
    box-shadow: inset 0 0 0 1px var(--line); }
  .dm-when { font-size: 11px; color: var(--dim); letter-spacing: .06em; }
  .dm-b { font-size: 14px; line-height: 1.75; white-space: pre-wrap; }
  .dm-none { text-align: center; padding: 52px 20px; color: var(--dim); font-size: 15px; }
  .dm-none .s { font-size: 12.5px; line-height: 1.9; margin-top: 10px; opacity: .82; }
  
  @media (prefers-reduced-motion: reduce) {  }
  
  @keyframes bdRipple { 0% { r: 74; opacity: .7; } 100% { r: 132; opacity: 0; } }
  /* 卡片用家里那个暖灰（--panel），跟全家的行卡一致——
     原来是纯白，一眼看出来不是这个家的 */
  .nk-book { background: var(--panel); border: none; border-radius: 15px; padding: 16px 18px;
    text-align: left; font-family: inherit; width: 100%;
    box-shadow: 0 1px 4px rgba(0,0,0,.05); }
  .nk-book:active { transform: scale(.985); }
  .nk-book .t { font-size: 17px; color: var(--text); margin-bottom: 5px; }
  .nk-book .a { font-size: 13px; color: var(--dim); line-height: 1.6; }
  .nk-bar { height: 4px; border-radius: 999px; background: var(--panel); margin-top: 11px;
    overflow: hidden; }
  .nk-bar i { display: block; height: 100%; border-radius: 999px; background: var(--sage);
    transition: width .5s; }
  .nk-read { font-size: 17.5px; line-height: 2.05; color: var(--text); }
  .nk-read p { margin: 0 0 1.15em; text-indent: 2em; }
  .nk-nav { display: flex; gap: 10px; margin: 26px 0 6px; }
  .nk-nav button { flex: 1; border: none; border-radius: 13px; padding: 14px;
    font-family: inherit; font-size: 15px; background: var(--panel); color: var(--text); }
  .nk-nav button:disabled { opacity: .32; }
  .nk-nav button:active:not(:disabled) { transform: scale(.96); }
  .nk-toc { display: grid; gap: 1px; }
  .nk-toc button { border: none; background: none; font-family: inherit; font-size: 15px;
    color: var(--text); text-align: left; padding: 12px 12px; border-radius: 10px; }
  /* 当前这一节：用底色标出来，字不变色（同上那条规矩） */
  .nk-toc button.on { background: var(--panel); color: var(--text); font-weight: 600; }

  .nk-mark { background: color-mix(in srgb, var(--dim) 20%, transparent);
    border-radius: 3px; padding: 1px 0; cursor: pointer;
    box-shadow: 0 1px 0 color-mix(in srgb, var(--dim) 42%, transparent); }
  /* 说过话的那几处深一档，底下再压一道实线 */
  .nk-mark.has { background: color-mix(in srgb, var(--dim) 32%, transparent);
    border-bottom: 1.6px solid color-mix(in srgb, var(--dim) 80%, transparent);
    box-shadow: none; }
  /* 选中文字之后浮出来的那两颗 */
  
  #nkPop { position: fixed; z-index: 90; display: none; gap: 8px; align-items: center;
    left: 50%; transform: translateX(-50%) translateY(140%);
    bottom: calc(env(safe-area-inset-bottom) + 18px);
    max-width: min(94vw, 460px);
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    border: 1px solid rgba(255,255,255,.55);
    border-radius: 999px; padding: 8px 8px 8px 16px;
    box-shadow: 0 8px 28px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.6);
    transition: transform .28s cubic-bezier(.34,1.3,.5,1); }
  #nkPop.on { display: flex; transform: translateX(-50%) translateY(0); }
  #nkPop .sel { font-size: 13px; color: var(--dim); white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; }
  #nkPop button { flex: none; border: none; color: var(--text);
    background: rgba(255,255,255,.55);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.45);
    font-family: inherit; font-size: 14px; padding: 10px 16px; border-radius: 999px; }
  
  #nkPop button.hi { background: var(--text); color: var(--bg); }
  
  .nk-bub { max-width: 85%; font-size: 15.5px; line-height: 1.75; margin-bottom: 14px;
    white-space: pre-wrap; word-break: break-word; }
  .nk-bub.her { margin-left: auto; width: fit-content;
    background: var(--user-bubble); color: var(--text);
    border-radius: 18px; padding: 10px 16px; }
  .nk-bub.mine { margin-right: auto; color: var(--text); }
  .nk-bub .t { display: block; font-size: 11.5px; color: var(--dim); margin-top: 5px; }
  .nk-bub.her .t { opacity: .7; }

  /* 说话那一行也照聊天界面：一块圆角玻璃 + 里面透明的输入 + 一颗圆按钮 */
  .nk-say {
    display: flex; align-items: flex-end; gap: 8px; margin-top: 18px;
    background: var(--glass);
    -webkit-backdrop-filter: blur(20px) saturate(1.7);
    backdrop-filter: blur(20px) saturate(1.7);
    border-radius: 24px; border: 1px solid rgba(255,255,255,.55);
    box-shadow: 0 2px 18px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.6);
    padding: 10px 10px 10px 16px;
  }
  .nk-say textarea {
    flex: 1; border: 0; outline: 0; resize: none; background: transparent;
    color: var(--text); font: inherit; line-height: 1.6;
    max-height: 140px; min-height: 26px; padding: 4px 0 6px;
  }
  .nk-say textarea::placeholder { color: var(--dim); }
  .nk-say button {
    flex: none; width: 38px; height: 38px; border-radius: 50%; border: none;
    background: var(--accent); color: #fff; font-family: inherit; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
  }
  .nk-say button:disabled { opacity: .35; }

  /* ===== 阅读器 v2（第2步：抄 reading-nook 骨架 + 仿真翻页精进）===== */
  #nookSheet .sheet { background: var(--bgfull, var(--bg)); }
  #nookSheet.nk-on .body { padding: 0; }
  #nookSheet .nk-bar i { background: var(--accent); }
  #nkPage { max-width: 680px; margin: 0 auto; min-height: 100%; box-sizing: border-box;
    padding: 10px 22px calc(26px + env(safe-area-inset-bottom));
    font-size: 17.5px; line-height: 2.05; color: var(--rink, var(--text));
    background: var(--rbg, transparent); }
  #nkPage p, #nkTopPage p { margin: 0 0 1.05em; text-indent: 2em; }
  #nkPage mark, #nkTopPage mark {
    background: var(--mark-u, color-mix(in srgb, var(--dim) 22%, transparent));
    border-radius: 3px; padding: 1px 0; cursor: pointer; }
  #nkPage mark.mr, #nkTopPage mark.mr {
    background: var(--mark-ai, color-mix(in srgb, var(--dim) 32%, transparent)); }
  #nkPage mark .dot, #nkTopPage mark .dot { display: inline-block; width: 8px; height: 8px;
    border-radius: 50%; margin-left: 2px; vertical-align: super; }
  #nkPage mark .du, #nkTopPage mark .du { background: var(--pink-line); }
  #nkPage mark .dr, #nkTopPage mark .dr { background: var(--blue-line); }
  #nkBotbar { position: sticky; bottom: 0; z-index: 6; display: flex; align-items: center;
    justify-content: space-between; padding: 9px 16px calc(9px + env(safe-area-inset-bottom));
    background: var(--rbg, var(--bg)); border-top: 1px solid var(--line); }
  #nkBotbar button { border: none; background: none; font-family: inherit; font-size: 15px;
    color: var(--accent); padding: 8px 14px; }
  #nkBotbar button:active { transform: scale(.94); }
  /* 卷页三层：翻动层(字随折缝消失) / 折缝软阴影 / 纸卷(纸背光影) */
  #nkTopPage { position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%);
    width: min(100%, 680px); z-index: 2; display: none; overflow: hidden;
    box-sizing: border-box; padding: 10px 22px calc(26px + env(safe-area-inset-bottom));
    font-size: 17.5px; line-height: 2.05; color: var(--rink, var(--text));
    background: var(--rbg, var(--bgfull, var(--bg)));
    will-change: clip-path; pointer-events: none; }
  #nkCurlFlap { position: absolute; top: 0; bottom: 0; z-index: 4; display: none; pointer-events: none;
    background: linear-gradient(90deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,.04) 20%, #ececea 45%, #d9d9d5 100%);
    border-radius: 0 10px 10px 0; }
  #nookSheet[data-nknight="1"] #nkCurlFlap {
    background: linear-gradient(90deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.16) 24%, #3a4050 55%, #262b38 100%); }
  .nk-drawer { position: absolute; top: 0; bottom: 0; right: 0; width: min(84%, 340px); z-index: 30;
    background: var(--panel, var(--bg)); box-shadow: -3px 0 16px rgba(0,0,0,.14);
    padding: 18px 16px calc(18px + env(safe-area-inset-bottom)); overflow-y: auto; display: none; }
  .nk-drawer.on { display: block; }
  .nk-drawer h3 { font-size: 15px; margin-bottom: 8px; }
  #nkSet { left: 0; right: 0; top: auto; bottom: 0; width: auto; max-width: 640px;
    margin: 0 auto; height: auto; max-height: 78%; border-radius: 20px 20px 0 0;
    box-shadow: 0 -6px 24px rgba(0,0,0,.2); }
  #nkMask { position: absolute; inset: 0; z-index: 25; background: rgba(0,0,0,.28); display: none; }
  #nkMask.on { display: block; }
  .nk-tocit { padding: 11px 10px; font-size: 14.5px; color: var(--text);
    border-bottom: 1px solid var(--line); cursor: pointer; line-height: 1.6; }
  .nk-tocit.cur { color: var(--accent); font-weight: 600; }
  .nk-rns { font-size: 12.5px; color: var(--dim); margin: 14px 0 6px; }
  .nk-th { border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px; font-size: 13.5px;
    cursor: pointer; display: flex; align-items: center; gap: 6px;
    background: transparent; color: var(--text); font-family: inherit; }
  .nk-th.cur { outline: 2px solid var(--accent); }
  .nk-th .dots { display: flex; gap: 3px; margin-left: auto; }
  .nk-th .dots i { width: 11px; height: 11px; border-radius: 50%;
    border: 1px solid rgba(0,0,0,.12); display: block; }
  .nk-bt { padding: 8px 14px; font-size: 13px; border-radius: 10px; border: 1px solid var(--line);
    background: transparent; color: var(--text); font-family: inherit; cursor: pointer; }
  .nk-bt.cur { background: var(--accent); color: #fff; border-color: var(--accent); }
  .nk-sw { width: 26px; height: 26px; border-radius: 50%; cursor: pointer;
    border: 1px solid rgba(0,0,0,.15); display: inline-block; }
  .nk-sw.cur { outline: 2.5px solid var(--accent); outline-offset: 1px; }
  #nookSheet.nk-zen .head, #nookSheet.nk-zen #nkBotbar { display: none; }
  #nkAnnoSheet .nk-bub.mine { background: var(--blue); border: 1px solid var(--blue-line);
    border-radius: 18px; padding: 10px 16px; width: fit-content; }
  #nkAnnoBtn .n { font-size: 11px; color: var(--dim); }
  #nkMeasure { position: absolute; left: -9999px; top: 0; visibility: hidden; }
  #nkMeasure p, #nkPage p.nkc { margin: 0 0 1.05em; text-indent: 2em; }
  #nkPage p.nkc { color: var(--dim); text-indent: 0; text-align: center; }
  .nk-swrow { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .nk-swrow .nk-sw { width: 20px; height: 20px; }
  /* 设置面板：圆角卡片分组 */
  .nk-card { background: var(--panel, var(--card)); border: 1px solid var(--line);
    border-radius: 14px; padding: 12px 12px 10px; margin: 10px 0; }
  .nk-card .nk-rns { font-size: 12px; font-weight: 700; letter-spacing: .5px;
    color: var(--dim); margin: 0 0 10px; }
  .nk-sw { box-shadow: inset 0 0 0 1.5px rgba(0,0,0,.07); }
  .nk-sw.cur { box-shadow: inset 0 0 0 2px var(--accent); transform: scale(1.14); }
  .nk-bt { border-radius: 10px; }
  #nkSet h3 { margin: 4px 0 2px; font-size: 16px; }
  .wh { max-width: 82%; padding: 12px 14px; border-radius: 16px; font-size: 15.5px;
    line-height: 1.68; white-space: pre-wrap; word-break: break-word;
    box-shadow: 0 1px 5px rgba(0,0,0,.05); }
  .wh.her { align-self: flex-end; background: var(--pink-track); border-bottom-right-radius: 6px; }
  .wh.gu  { align-self: flex-start; background: var(--panel); border-bottom-left-radius: 6px;
    background: color-mix(in srgb, var(--panel) 55%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.8);
    backdrop-filter: blur(20px) saturate(1.8);
    border: 1px solid rgba(255,255,255,.35);
    border: 1px solid color-mix(in srgb, #fff 45%, transparent);
    box-shadow: 0 4px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.5); }
  .wh time { display: block; font-size: 12.5px; color: var(--dim); margin-top: 5px;
    font-variant-numeric: tabular-nums; }
  .wh-write { display: flex; gap: 8px; align-items: flex-end; margin-top: 14px; }
  .wh-write textarea { flex: 1; background: var(--panel); border: none; border-radius: 15px;
    padding: 12px 14px; font: inherit; font-size: 15.5px; color: var(--text);
    resize: none; min-height: 46px; max-height: 160px; -webkit-appearance: none; }
     /* 微透就好：能看出底下有东西，但字还是清楚的 */
  .hub-label, .hub-value { fill: var(--text); text-anchor: middle; pointer-events: none;
    opacity: 0; transition: opacity .3s; }
  .hub-label { font-size: 8.4px; letter-spacing: .06em; }
  .hub-value { font-size: 13px; font-variant-numeric: tabular-nums; }
  
  @media (prefers-reduced-motion: reduce) {  }

  /* 换色的小圆点，蹲在「情绪」旁边 */
  
  .hl-hero { border-radius: 15px; padding: 14px 16px; background: var(--sage-track); margin-bottom: 6px; }
  .hl-hero .ht1 { font-size: 15.5px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
  .hl-hero .dotp { width: 8px; height: 8px; border-radius: 50%; background: var(--sage); flex: none; }
  .hl-hero .ht2 { font-size: 12.5px; color: var(--dim); margin-top: 4px; }
  .hl-row { display: flex; align-items: center; gap: 8px; padding: 11px 15px; }
  .hl-row + .hl-row { border-top: 1px solid rgba(0,0,0,.045); }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .hl-row + .hl-row { border-top-color: rgba(255,255,255,.06); }
}
html[data-theme="dark"] .hl-row + .hl-row { border-top-color: rgba(255,255,255,.06); }
  .hl-row .hn { flex: 1; font-size: 14.5px; }
  .hl-row .hv { font-size: 16.5px; }   
  .hl-row .hu { font-size: 12px; color: var(--dim); }
  .hl-row .hdot { width: 6px; height: 6px; border-radius: 50%; flex: none; margin-left: 4px; }
  
  .hbars { display: flex; gap: 7px; align-items: flex-end; height: 46px; padding: 12px 15px 2px; }
  .hbars i { flex: 1; background: var(--sage); border-radius: 4px; min-height: 3px; opacity: .8; }
  .hbars i.empty { background: var(--line); height: 3px; opacity: 1; }
  .hlabs { display: flex; gap: 7px; padding: 4px 15px 12px; }
  .hlabs span { flex: 1; text-align: center; font-size: 10.5px; color: var(--dim); }
  .tl-item { display: block; width: 100%; text-align: left; padding: 6px 0 12px; }
  .tl-item .tt { font-family: var(--serif); font-size: 16.5px; font-weight: 400; line-height: 1.55; }
  .tl-item .tk { font-size: 12.5px; color: var(--dim); margin-top: 3px; line-height: 1.7;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .bn-card { position: relative; overflow: hidden; border-radius: 20px; padding: 18px 16px 16px;
    background: #fff; text-align: left; min-height: 118px;
    display: flex; flex-direction: column; justify-content: flex-end;
    box-shadow: 0 1px 8px rgba(0,0,0,.05); cursor: pointer; }
  .bn-card:active { opacity: .88; }
  .bn-card.wide { grid-column: 1 / -1; }
  .bn-card.hero { background: #c8694a; color: #fff; min-height: 130px;
    box-shadow: 0 4px 18px rgba(200,105,74,.28); }
  .bn-card .beyebrow { font-size: 11px; letter-spacing: .12em; opacity: .75;
    font-style: italic; margin-bottom: 6px; }
  .bn-card .bt { font-size: 17px; font-weight: 600; line-height: 1.3; }
  .bn-card .bs { font-size: 12px; margin-top: 4px; opacity: .68; line-height: 1.6; }
  .bn-card.tall { grid-row: span 2; min-height: 240px; }
  .bn-card .bicon { position: absolute; right: -10px; top: -12px; width: 88px; height: 88px;
    opacity: .08; pointer-events: none; }
  .bn-card .bicon svg { width: 100%; height: 100%; }
  .bn-card.tall .bicon { width: 120px; height: 120px; right: -20px; top: -16px; }
  .bn-card.hero .bicon { opacity: .18; width: 140px; height: 140px; right: -24px; top: -28px; }

  .hd-write { border-radius: 18px; padding: 16px; background: var(--card);
    box-shadow: 0 2px 24px rgba(180,160,140,.16); margin-bottom: 18px; }
  .hd-write textarea { width: 100%; border: 0; outline: 0; background: transparent;
    color: inherit; font: inherit; font-size: 15.5px; line-height: 1.8;
    min-height: 96px; resize: vertical; }
  .hd-write textarea::placeholder { color: var(--dim); opacity: .7; }
  .hd-write .row { display: flex; justify-content: flex-end; margin-top: 8px; }
  
  .hd-write .go { border: 0; border-radius: 999px; padding: 8px 22px; font-size: 13px;
    background: var(--text); color: var(--bg); font-weight: 500; }
  .hd-item { border-radius: 18px; padding: 18px 18px 14px; background: #fff;
    margin-bottom: 12px; position: relative; overflow: hidden;
    box-shadow: 0 1px 8px rgba(0,0,0,.04); }
  .hd-item::after { content: '\201C'; position: absolute; top: 8px; right: 14px;
    font-size: 44px; color: #f0ebe4; font-family: Georgia,serif; line-height: 1;
    pointer-events: none; user-select: none; }
  .hd-item .hdd { font-size: 11px; letter-spacing: .06em; color: #b0a99f;
    font-variant-numeric: tabular-nums; margin-bottom: 10px; }
  .hd-item .hdt { font-size: 15.5px; line-height: 1.82; white-space: pre-wrap;
    word-break: break-word; padding-right: 20px; }
  .hd-item .hdx { position: absolute; right: 8px; bottom: 8px; opacity: .25; padding: 4px; }

  .fav-card { position: relative; border-radius: 18px; padding: 20px 18px 16px;
    background: var(--panel); margin-bottom: 14px; overflow: hidden; }
  .fav-card .fq { position: absolute; right: -10px; top: -16px; width: 92px; height: 92px;
    opacity: .1; transform: rotate(8deg); pointer-events: none; }
  .fav-card .fd { font-size: 11px; letter-spacing: .25em; color: var(--dim);
    font-variant-numeric: tabular-nums; margin-bottom: 8px; }
  .fav-card .fx { font-family: var(--serif); font-size: 16.5px; line-height: 1.95;
    word-break: break-word; }
  .fav-card .fn { font-size: 12.5px; color: var(--dim); line-height: 1.75; margin-top: 10px;
    border-top: 1px solid var(--line); padding-top: 10px; }

  .board-bar {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    padding: 4px 0 10px; font-family: var(--serif);
  }
  .board-bar .bdate { font-size: 16.5px; font-weight: 700; min-width: 150px; text-align: center; }
  .board-bar .bnav {
    width: 32px; height: 32px; border-radius: 50%; background: var(--panel);
    display: flex; align-items: center; justify-content: center;
  }
  .board-bar .bnav .ic { width: 14px; height: 14px; }
  .board-bar .bnav:disabled { opacity: .25; }
  .board-toggle {
    position: absolute; right: 14px; bottom: calc(16px + env(safe-area-inset-bottom));
    z-index: 5; border-radius: 999px; padding: 9px 16px; font-size: 13.5px;
    background: var(--glass);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    border: 1px solid var(--line); box-shadow: 0 3px 14px rgba(0,0,0,.1);
  }
  .note {
    position: absolute; width: 46%; max-width: 220px;
    border-radius: 6px; padding: 18px 13px 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,.13);
    cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none;
    color: #3d3830;
  }
  .note:active { cursor: grabbing; box-shadow: 0 8px 22px rgba(0,0,0,.2); }
  .note.big { width: 56%; max-width: 260px; }
  
  .note { --tape: rgba(240, 232, 212, .9); }
  .note::before {
    content: ""; position: absolute; border-radius: 2px;
    background: var(--tape); box-shadow: 0 1px 3px rgba(0,0,0,.12);
  }
  .note.t-h::before {   /* 横贴顶中 */
    top: -7px; left: 50%; margin-left: -24px; width: 48px; height: 15px;
    transform: rotate(var(--ta, -2deg));
  }
  .note.t-l::before {   /* 歪贴左上角 */
    top: -8px; left: -12px; width: 44px; height: 14px; transform: rotate(-38deg);
  }
  .note.t-r::before {   /* 歪贴右上角 */
    top: -8px; right: -12px; width: 44px; height: 14px; transform: rotate(38deg);
  }
  .note.t-v::before {   
    top: -12px; left: 50%; margin-left: -7px; width: 14px; height: 30px;
    transform: rotate(var(--ta, 2deg));
  }
  .note.t-2::before {   /* 对角两条 */
    top: -8px; right: -12px; width: 44px; height: 14px; transform: rotate(38deg);
  }
  .note.t-2::after {
    content: ""; position: absolute; bottom: -7px; left: -13px;
    width: 44px; height: 14px; border-radius: 2px;
    background: var(--tape); box-shadow: 0 1px 3px rgba(0,0,0,.12);
    transform: rotate(38deg);
  }
  .note.lined {         /* 横线笔记纸纹理（可与任何胶带叠穿） */
    background-image: repeating-linear-gradient(to bottom, transparent 0 20px, rgba(70, 90, 130, .13) 20px 21px);
  }
  /* 形状：竖长方（默认）、方、横长方 */
  .note.sq { width: 40%; max-width: 190px; min-height: 130px; }
  .note.wide { width: 58%; max-width: 270px; min-height: 84px; }

  /* 日期筛选面板 */
  .dp { background: var(--panel); border-radius: 16px; padding: 10px 14px 12px; margin-bottom: 12px; display: none; }
  .dp.show { display: block; }
  .dp .dpm { font-size: 12.5px; color: var(--dim); margin: 8px 0 5px; font-family: var(--serif); letter-spacing: .1em; }
  .dp .dpd {
    display: inline-flex; min-width: 36px; height: 32px; padding: 0 6px;
    align-items: center; justify-content: center; border-radius: 9px;
    background: var(--card); margin: 3px; font-size: 13.5px;
  }
  .dp .dpd.on { background: var(--card); color: var(--text); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.09); }
  .note-full { font-family: var(--serif); padding: 2px 4px 20px; }
  .note-full .nfd { font-size: 12.5px; color: var(--dim); }
  .note-full .nft { font-size: 19px; font-weight: 700; line-height: 1.5; margin: 4px 0 14px; }
  .note-full .nfb { font-size: 15.5px; line-height: 2; white-space: pre-wrap; word-break: break-word; }
  .note .nt { font-size: 13.5px; font-weight: 700; line-height: 1.55; word-break: break-word; }
  .note .nk { font-size: 11px; opacity: .62; line-height: 1.6; margin-top: 5px; word-break: break-word;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .note .nm { font-size: 10px; opacity: .5; margin-top: 6px; }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .note { color: #2f2b26; box-shadow: 0 3px 12px rgba(0,0,0,.45); }
}
html[data-theme="dark"] .note { color: #2f2b26; box-shadow: 0 3px 12px rgba(0,0,0,.45); }

  /* 全景墙（第二视图） */
  .wall-intro { font-family: var(--serif); text-align: center; padding: 10px 6px 18px; }
  .wall-intro .big { font-size: 21px; font-weight: 700; }
  .wall-intro .sub { font-size: 13px; color: var(--dim); margin-top: 4px; }
  .wall-month { font-family: var(--serif); font-size: 14px; color: var(--dim); letter-spacing: .15em; padding: 16px 4px 8px; display: flex; align-items: center; gap: 10px; }
  .wall-month::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
  .brick {
    border-radius: 9px; aspect-ratio: 1; cursor: pointer;
    transition: transform .15s;
  }
  .brick:active { transform: scale(.88); }
  .brick.a4 { box-shadow: 0 0 7px 0 color-mix(in srgb, var(--glow) 55%, transparent); }
  .brick.a5 { box-shadow: 0 0 14px 2px var(--glow); }
  .brick-card {
    position: sticky; bottom: 0; margin-top: 16px;
    background: var(--card); border-radius: 18px; padding: 14px 18px;
    box-shadow: 0 -4px 24px rgba(0,0,0,.1); border: 1px solid var(--line);
    display: none;
  }
  .brick-card.show { display: block; }
  .brick-card .bd { font-size: 12.5px; color: var(--dim); }
  .brick-card .bt { font-size: 15.5px; font-weight: 600; margin: 3px 0 6px; line-height: 1.5; }
  .brick-card .bm { display: flex; gap: 14px; font-size: 12.5px; color: var(--dim); }
  .brick-card .bm b { color: var(--text); font-weight: 600; }
  .brick-card .bk { font-size: 12.5px; color: var(--dim); margin-top: 6px; line-height: 1.6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .masthead { text-align: center; padding: 4px 0 12px; border-bottom: 3px double currentColor; }
  .masthead .brand-title { font-family: var(--serif); font-size: 32px; font-weight: 600;
    letter-spacing: .1em; margin: 2px 0 6px; }
  .masthead .dateline {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    font-size: 12.5px; color: var(--dim); padding: 2px 0;
    font-variant-numeric: tabular-nums;
  }
  .masthead .dateline button {
    width: 30px; height: 30px; border-radius: 999px; background: var(--panel);
    display: flex; align-items: center; justify-content: center; color: var(--text);
  }
  .masthead .dateline button .ic { width: 13px; height: 13px; }
  .masthead .dateline button:disabled { opacity: .25; }
  .masthead .motto { font-size: 12px; color: var(--dim); padding-top: 4px; }
  
  .section-head {
    display: flex; align-items: center; gap: 10px; margin: 26px 0 10px;
    font-size: 13.5px; font-weight: 500; letter-spacing: .15em; color: var(--dim);
  }
  .section-head::before, .section-head::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
  .brief {
    font-size: 13.5px; line-height: 1.8; padding: 3px 0 3px 14px; position: relative;
  }
  .brief::before { content: "·"; position: absolute; left: 2px; top: 1px; color: var(--dim); }
  .brief .src { color: var(--dim); font-size: 12.5px; }
  
  .gnote { position: relative; background: var(--panel); border-radius: 14px;
    padding: 12px 14px 13px 18px; margin: 12px 0 18px; }
  .gnote::before { content: ''; position: absolute; left: 9px; top: 14px; bottom: 14px;
    width: 3px; border-radius: 999px; background: var(--amber); }
  .gnote .lb { font-size: 12.5px; color: var(--dim); letter-spacing: .08em; margin-bottom: 6px; }
  .gnote .tx { font-size: 13.5px; line-height: 1.75; color: var(--text); }

  /* ============ 家的零件库（8/3 设计系统 v1，图纸在 engineering/前端重做/）============
     一套零件盖全家：页面头 / 分组卡 / 行 / 节标 / 状态点 / 进度环。四间屋子只换内容不换零件 */
  .sheetWrap.page .grabber { display: none; }   
  .sh-head { padding: 2px 4px 14px; }
  .sh-head h1 { margin: 0; font-family: var(--serif); font-size: 26px; font-weight: 400;
                letter-spacing: -.01em; line-height: 1.25; }
  .sh-head .sub { color: var(--dim); font-size: 12.5px; margin-top: 2px;
                  font-variant-numeric: tabular-nums; }
  .sh-head .ring { float: right; margin-top: 4px; }
  .sh-head .shnav { float: right; display: flex; gap: 6px; margin-top: 4px; }
  .sh-head .shnav button { min-width: 30px; height: 30px; border-radius: 999px;
    background: var(--panel); display: flex; align-items: center; justify-content: center;
    color: var(--text); }
  .sh-head .shnav .ctd { padding: 0 12px; font-size: 12.5px; color: var(--dim); }
  .sh-head .shnav .ic { width: 13px; height: 13px; }
  .hrow { display: flex; align-items: center; gap: 12px; padding: 12px 15px;
          font-size: 15.5px; width: 100%; text-align: left;
          border-radius: 15px;
          background: var(--panel); }
    .hrow .tx { flex: 1; min-width: 0; line-height: 1.45; word-break: break-word; }
  .hrow .tx small { display: block; font-size: 12px; color: var(--dim); margin-top: 1px; }
  .hrow .val { flex: none; font-variant-numeric: tabular-nums; color: var(--dim); font-size: 14px; }
  .hrow .val.due { color: var(--amber); font-weight: 600; }
  .hrow.done .tx { text-decoration: line-through; opacity: .42; }
  .hrow .hck { flex: none; padding: 2px 0; display: flex; }
  .hrow .hck svg { display: block; }
  .hrow .hx { flex: none; opacity: .35; display: flex; padding: 2px; }
  /* 进度环——跟 Things 学的：完成度是一枚安静的小圆环，不是一根喊叫的进度条 */
  .ring svg { display: block; transform: rotate(-90deg); }
  .ring circle { fill: none; stroke-width: 3; }
  .ring .track { stroke: var(--sage-track); }
  .ring .fill { stroke: var(--sage); stroke-linecap: round;
                transition: stroke-dashoffset .5s cubic-bezier(.25,.46,.45,.94); }
  
  .hplus { padding: 12px 15px; font-size: 14.5px; color: var(--dim);
           display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
           border-radius: 15px; border: 1px dashed var(--line); }
  .hplus .ic { width: 14px; height: 14px; }
  .hadd { display: none; border-radius: 15px; padding: 14px 15px 12px;
          background: var(--panel); }
  .hadd.open { display: block; }
    .hadd input[type=text] {
    width: 100%; border: 0; outline: 0; background: transparent; color: inherit;
    font: inherit; font-size: 15.5px; padding: 2px 0 10px;
  }
  .hadd input::placeholder { color: var(--dim); opacity: .7; }
  .hadd .row { display: flex; align-items: center; gap: 8px; }
  .chip { border: 0; border-radius: 999px; padding: 7px 14px; font-size: 12.5px;
          background: var(--panel); color: var(--text);
          font-variant-numeric: tabular-nums; transition: background .2s, color .2s; }
  .chip.on { background: var(--text); color: var(--bg); }
  .hadd input[type=time] {
    border: 0; border-radius: 999px; padding: 6px 12px;
    background: var(--panel); color: inherit; font: inherit; font-size: 12.5px;
    font-variant-numeric: tabular-nums; -webkit-appearance: none; appearance: none;
  }
  .hadd .go { margin-left: auto; border: 0; border-radius: 999px; padding: 8px 20px;
              font-size: 13px; background: var(--text); color: var(--bg); font-weight: 500; }

  /* 备用通道（接入 API）面板样式 —— 参照 .hadd/.cal-add 的圆角面板语言补齐 */
  .ap-lb { font-size: 12.5px; color: var(--dim); letter-spacing: .02em; margin: 16px 6px 6px;
    display: flex; align-items: center; justify-content: space-between; }
  .ap-lb:first-of-type { margin-top: 4px; }
  .ap-pull { border: 0; background: none; color: var(--accent); font-size: 12px; font-weight: 500;
    padding: 2px 0; }
  .ap-pull:active { opacity: .6; }
  .ap-mchk { display: flex; align-items: center; gap: 10px; padding: 9px 0; font-size: 14px;
    border-bottom: 1px solid var(--line); }
  .ap-mchk:last-child { border-bottom: 0; }
  .ap-mchk input { width: 17px; height: 17px; accent-color: var(--accent); flex: none; }
  .ap-mchk span { word-break: break-all; }
  .ap-in {
    display: block; width: 100%; box-sizing: border-box;
    border: 0; outline: 0; background: var(--panel); color: var(--text);
    font: inherit; font-size: 15px; padding: 12px 14px; border-radius: 14px;
  }
  .ap-in::placeholder { color: var(--dim); opacity: .75; }
  .ap-b {
    flex: 1; border: 0; outline: 0; border-radius: 999px; padding: 11px 16px;
    font-size: 14px; font-weight: 500; background: var(--panel); color: var(--text);
    transition: background .15s, opacity .15s;
  }
  .ap-b:active { background: var(--line); }
  .ap-b.go { background: var(--accent); color: #fff; }
  .ap-b.go:active { background: var(--accent-soft); }
  .ap-msg {
    display: none; margin-top: 14px; padding: 12px 14px; border-radius: 14px;
    background: var(--panel); font-size: 13px; line-height: 1.6; color: var(--text);
    white-space: pre-wrap; word-break: break-word;
  }
  .ap-msg.on { display: block; }
  .ap-msg.on.bad { background: var(--red-track); color: var(--red); }
  .ap-more { margin-top: 14px; }
  .ap-more .ap-b { width: auto; flex: none; }
  .ap-note {
    margin-top: 20px; padding: 4px 6px; font-size: 12.5px; color: var(--dim);
    line-height: 1.7;
  }
  .ap-note b { color: var(--text); font-weight: 600; }

  .rc {
    
    --stamp: var(--accent);              
    --rc-foot-ink: rgba(43, 42, 39, .72);/* 比划掉的字深，但不到纯黑 */
    --paper: transparent;                
    font-variant-numeric: tabular-nums;
  }
  .rc-num, .rc-kv .v, .rc-code, .rc-meta, .rc-sum .sv {
    font-family: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
    font-variant-numeric: tabular-nums;
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .rc { --stamp: var(--accent-soft); --rc-foot-ink: rgba(245, 244, 239, .72); --paper: transparent; }
}
html[data-theme="dark"] .rc { --stamp: var(--accent-soft); --rc-foot-ink: rgba(245, 244, 239, .72); --paper: transparent; }
  /* 上下两道撕口——小票的魂 */
  .rc-tear { display: none; }
  .rc-tear.top {
    background-image:
      linear-gradient(45deg, transparent 33.4%, var(--paper) 33.4%, var(--paper) 66.6%, transparent 66.6%),
      linear-gradient(-45deg, transparent 33.4%, var(--paper) 33.4%, var(--paper) 66.6%, transparent 66.6%);
    background-size: 13px 18px;
    background-position: bottom;
  }
  .rc-tear.bottom {
    background-image:
      linear-gradient(45deg, var(--paper) 33.4%, transparent 33.4%, transparent 66.6%, var(--paper) 66.6%),
      linear-gradient(-45deg, var(--paper) 33.4%, transparent 33.4%, transparent 66.6%, var(--paper) 66.6%);
    background-size: 13px 18px;
    background-position: top;
  }
  .rc-kv { display: flex; font-size: 12.5px; padding: 3px 0; opacity: .82; }
  .rc-kv .k { letter-spacing: .1em; }
  .rc-kv .v { margin-left: auto; }
  .rc-meta { font-size: 13px; opacity: .68; letter-spacing: .22em; }
  .rc-box {
    flex: none; margin-top: 2px; min-width: 24px; text-align: left;
    display: flex; align-items: flex-start;
  }
  .rc-box svg { display: block; }
  .rc-box.ro { opacity: .5; }
  .rc-tx { font-size: 14.5px; line-height: 1.6; word-break: break-word; }
  .rc-tx.done { text-decoration: line-through; opacity: .42; }
  .rc-tags { font-size: 11px; opacity: .58; margin-top: 3px; display: flex; gap: 9px; flex-wrap: wrap; }
  .rc-tags .late { color: var(--amber); opacity: 1; font-weight: 700; }
  
  .rc-plus { padding: 9px 2px; font-size: 14px; opacity: .55; display: flex; align-items: center; gap: 7px; }
  .rc-plus .ic { width: 13px; height: 13px; }
  .rc-add { padding: 4px 2px 2px; display: none; }
  .rc-add.open { display: block; }
  .rc-add input[type=text] {
    width: 100%; border: 0; outline: 0; background: transparent; color: inherit;
    font: inherit; font-size: 14px; padding: 6px 0;
    border-bottom: 1px dashed currentColor;
  }
  .rc-add input::placeholder { opacity: .45; }
  .rc-add .row {
    display: flex; align-items: center; gap: 8px; margin-top: 9px; font-size: 12px; flex-wrap: wrap;
  }
  .rc-add input[type=time] {
    border: 1px solid currentColor; border-radius: 4px; padding: 3px 6px;
    background: transparent; color: inherit; font: inherit; font-size: 12px; opacity: .8;
  }
  .rc-add label { display: flex; align-items: center; gap: 4px; opacity: .75; }
  .rc-add .go {
    margin-left: auto; border: 1px solid currentColor; border-radius: 4px;
    padding: 5px 14px; font-size: 12.5px; letter-spacing: .1em;
  }
  
  .rc-sum { padding: 4px 2px; }
  .rc-sum .sr { display: flex; align-items: center; font-size: 13.5px; padding: 4px 0; }
  .rc-sum .sr .sl { opacity: .78; }
  .rc-sum .sr .sv { margin-left: auto; font-weight: 600; }
  .rc-sum .sr.dim { opacity: .5; }
  .rc-bar {
    flex: 1; height: 9px; margin: 0 12px; overflow: hidden;
    background-image: radial-gradient(currentColor 0.7px, transparent 0.8px);
    background-size: 4px 4px; opacity: .85;
  }
  .rc-bar > i { display: block; height: 100%; background: currentColor; transition: width .45s; }
  /* 印章：盖在小票下半张 */
  .rc-stamp {
    margin: 20px auto 6px; width: 172px; padding: 9px 0;
    border: 2px solid var(--stamp); border-radius: 6px;
    color: var(--stamp); text-align: center; transform: rotate(-6deg);
    opacity: .82;
  }
  .rc-stamp .s1 { font-family: var(--serif); font-size: 17px; font-weight: 700; letter-spacing: .18em; }
  .rc-stamp .s2 { font-size: 10px; letter-spacing: .28em; margin-top: 2px; opacity: .85; }
  .rc-foot { text-align: center; font-size: 12px; margin-top: 14px; line-height: 2; color: var(--rc-foot-ink); }
  .rc-foot .thin { opacity: .72; font-style: italic; }
  .rc-code { font-size: 11px; letter-spacing: .34em; opacity: .55; margin-top: 6px; }
  .addbig {
    flex: none; width: 108px; height: 108px; border-radius: 18px; background: var(--panel);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
    font-size: 15px;
  }
  .addbig .ic { width: 26px; height: 26px; }
  .addrow {
    display: flex; align-items: center; gap: 12px; width: 100%;
    background: var(--panel); border-radius: 16px; padding: 16px 18px; font-size: 16px;
    margin-top: 12px; text-align: left;
  }
  .addrow .ic { width: 20px; height: 20px; }

  .menuCard {   
    position: fixed; z-index: 60; top: calc(58px + env(safe-area-inset-top)); right: 12px;
    border-radius: 20px; padding: 7px; min-width: 190px; display: none;
    background: var(--glass);
    -webkit-backdrop-filter: blur(30px) saturate(1.9);
    backdrop-filter: blur(30px) saturate(1.9);
    border: 1px solid rgba(255,255,255,.42);
    box-shadow: 0 12px 40px rgba(0,0,0,.13), inset 0 1px 0 rgba(255,255,255,.55);
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .menuCard {
      background: color-mix(in srgb, var(--bg) 48%, transparent);
      border: 1px solid rgba(255,255,255,.1);
      box-shadow: 0 12px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.07);
    }
}
html[data-theme="dark"] .menuCard {
      background: color-mix(in srgb, var(--bg) 48%, transparent);
      border: 1px solid rgba(255,255,255,.1);
      box-shadow: 0 12px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.07);
    }
  .menuCard.open { display: block; }
  .menuCard .mi {
    display: flex; align-items: center; gap: 12px; width: 100%;
    padding: 12px 14px; border-radius: 12px; font-size: 15.5px; text-align: left;
  }
  .menuCard .mi:active { background: var(--panel); }
  .menuCard .mi .ic { width: 19px; height: 19px; }
  .menuCard .mi.danger { color: var(--red); }

  #chatsSheet .sheet { height: 100dvh; max-height: 100dvh; border-radius: 0; }
  #chatScope { display: flex; align-items: center; gap: 4px; width: auto; padding: 0 4px; color: var(--dim); }
  #chatScope .sc { font-size: 14.5px; }
  #chatScope .ic { width: 15px; height: 15px; }
  
  .crow {
    display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
    background: var(--glass);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    backdrop-filter: blur(18px) saturate(1.6);
    border: 1px solid rgba(255, 255, 255, .45);
    box-shadow: 0 1px 5px rgba(0,0,0,.045);
    border-radius: 15px; padding: 11px 14px; margin-bottom: 7px;
  }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) .crow { border-color: rgba(255,255,255,.1); box-shadow: 0 1px 5px rgba(0,0,0,.2); }
}
html[data-theme="dark"] .crow { border-color: rgba(255,255,255,.1); box-shadow: 0 1px 5px rgba(0,0,0,.2); }
  .crow:active { background: color-mix(in srgb, var(--panel) 75%, transparent); }
  .crow .cmid { flex: 1; min-width: 0; }
  .crow .cn { font-size: 15px; font-weight: 600; }
  .crow .cp {
    font-size: 12.5px; color: var(--dim); margin-top: 2px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .crow .ct { font-size: 12.5px; color: var(--dim); flex: none; align-self: flex-start; }
  #newSession {
    position: absolute; right: 18px; bottom: calc(20px + env(safe-area-inset-bottom));
    background: #2b2a27; color: #faf9f5; border-radius: 999px;
    padding: 12px 22px; font-size: 15px;
    display: flex; align-items: center; gap: 7px;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
  }
  #newSession .ic { width: 15px; height: 15px; }
  @media (prefers-color-scheme: dark) {
html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"]) #newSession { background: #f5f4ef; color: #262624; }
}
html[data-theme="dark"] #newSession { background: #f5f4ef; color: #262624; }
/* ---------- 模型能力 v2（9-10晚重构）：一张卡一个能力，跟随/独立一排分段控件，不再是表单堆叠 ---------- */
.capv2-list { display: flex; flex-direction: column; gap: 12px; }
.capv2 {
  position: relative;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-lg, 16px);
  padding: 16px 16px 14px;
  overflow: hidden;
  transition: border-color .2s, box-shadow .2s;
}
.capv2::before {              /* 左侧能力色条：dedicated亮/跟随灰 */
  content: ""; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 3px; border-radius: 0 3px 3px 0;
  background: var(--accent); opacity: .75;
  transition: opacity .2s, background .2s;
}
.capv2.seg-follow::before { opacity: .18; }
.capv2:hover { border-color: var(--accent); box-shadow: 0 2px 12px var(--glow, rgba(201,100,66,.1)); }
.capv2-ic {
  line-height: 1; display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 11px;
  background: var(--glow, rgba(201,100,66,.12));
}
.capv2-ic .ic { width: 18px; height: 18px; color: var(--accent, #c96442); }
.capv2-ic .ic svg { width: 100%; height: 100%; }
.capv2-cur {
  margin-left: auto; font-size: 11.5px; color: var(--dim);
  max-width: 50%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 3px 10px; border-radius: 99px;
  background: var(--panel);
}
.capv2.dedicated .capv2-cur { color: var(--accent); background: var(--glow, rgba(201,100,66,.1)); }
.capv2-seg {
  flex: 1; display: flex; background: var(--panel); border-radius: var(--r-sm, 10px); padding: 3px;
}
.capv2-seg button {
  flex: 1; font-size: 12.5px; padding: 7px 0; border-radius: calc(var(--r-sm, 10px) - 3px);
  color: var(--dim); transition: color .15s;
}
.capv2-seg button.on {
  background: var(--card); color: var(--accent); font-weight: 600;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.capv2-ded { display: none; margin-top: 11px; flex-direction: column; gap: 8px; }
.capv2.dedicated .capv2-ded { display: flex; }
.capv2-ded select {
  width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm, 10px);
  background: var(--panel); color: inherit; font: inherit; font-size: 13.5px;
  transition: border-color .15s;
}
.capv2-ded select:focus { border-color: var(--accent); outline: none; }
.capv2-save {
  align-self: stretch; font-size: 12.5px; padding: 9px 22px; border-radius: 99px;
  background: var(--accent); border: none; color: var(--accent-ink, #fff); font-weight: 600;
  transition: opacity .15s, transform .1s;
}
.capv2-save:active { transform: scale(.97); }
.capv2-save.ok { background: var(--green, #4a7a4e); }
.capv2-list { display: flex; flex-direction: column; gap: 11px; }



/* ==== 可搬运代码：方案A（原版风味：安静一行 + 底部弹层） ==== */
  .tooline { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
    padding: 10px 6px; }
  .tooline:active { opacity: .6; }
  @keyframes tspin { to { transform: rotate(360deg); } }
  .stfin { flex: none; font-size: 13px; font-weight: 700; color: var(--green); }
  .stfin.bad { color: var(--red); }
  .tooline .tl { flex: 1; min-width: 0; font-size: 13.5px; color: var(--text);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .tooline .du { flex: none; font-size: 12px; color: var(--dim); }
  .tooline .ch { flex: none; font-size: 13px; color: var(--dim); }

  .tshade { position: fixed; inset: 0; z-index: 60; background: var(--overlay);
    opacity: 0; pointer-events: none; transition: opacity .2s ease; }
  .tshade.on { opacity: 1; pointer-events: auto; }
  .tsheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 61;
    background: var(--bg); border-radius: 22px 22px 0 0;
    padding: 10px 18px calc(18px + env(safe-area-inset-bottom));
    transform: translateY(103%); transition: transform .26s cubic-bezier(.22,1.1,.36,1);
    max-height: 76vh; overflow: auto; }
  .tsheet.on { transform: translateY(0); }
  .tsheet .grab { width: 36px; height: 4px; border-radius: 999px; background: var(--line);
    margin: 4px auto 10px; }
  .tsheet .tsh { display: flex; align-items: center; margin-bottom: 2px; }
  .tsheet .tsh .t { flex: 1; text-align: center; font-size: 16px; font-weight: 700; }
  .tsheet .tsh .x { flex: none; width: 32px; height: 32px; color: var(--dim); font-size: 15px; }
  .tsitem { padding: 12px 0; }
  .tsitem + .tsitem { border-top: 1px solid var(--line); }
  .tsitem-h { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
  .tsitem-h b { font-size: 14.5px; font-weight: 600; }
  .tsitem-h .sp { flex: 1; }
  .tstag { font-size: 11px; font-weight: 600; padding: 1.5px 8px; border-radius: 6px;
    color: var(--green); background: color-mix(in srgb, var(--green) 12%, transparent); }
  .tstag.bad { color: var(--red); background: color-mix(in srgb, var(--red) 12%, transparent); }
  .tstag.run { color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
  .tstep { display: flex; gap: 10px; }
  .tdot { flex: none; width: 8px; height: 8px; border-radius: 999px; margin-top: 8px;
    background: var(--line); }
  .tdot.run { background: var(--accent); animation: tpulse 1.4s ease-in-out infinite; }
  .tdot.ok { background: var(--green); }
  .tdot.err { background: var(--red); }
  @keyframes tpulse {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 35%, transparent); }
    50% { box-shadow: 0 0 0 5px transparent; }
  }
  .trail { width: 1.5px; flex: 1; min-height: 10px; margin-top: 2px; background: var(--line); }
  .tstep:last-child .trail { display: none; }
  .tcard { flex: 1; min-width: 0; margin-bottom: 6px;
    background: var(--card); border: 1px solid var(--line); border-radius: 12px;
    overflow: hidden; }
  .tcard.errcard { border-color: color-mix(in srgb, var(--red) 32%, var(--line)); }
  .tline { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
    padding: 9px 12px; }
  .tline:active { background: var(--panel); }
  .tlbl { flex: 1; min-width: 0; font-size: 13.5px; display: flex; align-items: baseline;
    gap: 7px; overflow: hidden; }
  .tlbl b { flex: none; font-weight: 600; }
  .tchev { flex: none; color: var(--dim); font-size: 13px; transition: transform .18s ease; }
  .tline.open .tchev { transform: rotate(90deg); }
  .tbody { border-top: 1px solid var(--line); padding: 8px 12px 10px; }
  .tres { font-size: 13px; line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
  .tres.tempty { color: var(--dim); }
  .cbtn { flex: none; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line);
    background: var(--card); font-size: 13px; color: var(--dim); }
  .cbtn:active { background: var(--panel); }


  /* ==== MCP工具箱卡片风（16:50 v2）==== */
  .mcp-summary { font-size: 13px; color: var(--dim); padding: 10px 4px 12px; }
  .mcp-summary b { color: var(--text); }
  .mcp-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
  .mcp-dot.on { background: #7fb881; box-shadow: 0 0 0 3px rgba(127,184,129,.18); }
  .mcp-dot.off { background: #c96a6a; box-shadow: 0 0 0 3px rgba(201,106,106,.15); }
  .mcp-badge { font-size: 11px; padding: 2px 9px; border-radius: 99px; flex: none; }
  .mcp-badge.on { background: rgba(127,184,129,.15); color: #4a7a4e; }
  .mcp-badge.off { background: rgba(201,106,106,.12); color: #a05252; }
  .mcp-ic { width: 32px; height: 32px; border-radius: 50%; border: none; background: none; color: var(--dim); display: flex; align-items: center; justify-content: center; flex: none; }
  .mcp-ic:active { background: var(--line); }
  .mcp-ic .ic { width: 15px; height: 15px; }
  .mcp-btn { flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px;
    padding: 13px; border-radius: 14px; border: 1px solid var(--line); background: var(--card);
    color: var(--text); font-size: 14.5px; }
  .mcp-btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
  .mcp-btn:active { opacity: .85; }
  .mcp-btn .ic { width: 15px; height: 15px; }
  .mcp-field { display: flex; align-items: center; gap: 10px; padding: 13px 16px; }
  .mcp-field label { font-size: 13.5px; color: var(--dim); flex: none; width: 88px; }
  .mcp-field input { flex: 1; border: none; background: none; text-align: right; color: var(--text); font-size: 14.5px; min-width: 0; }


/* ---- 四主题token（自dwell-ui.css v1.3注入，栖燃9-15） + index变量适配 ---- */
[data-theme="t-terracotta"]{
  --bg:#faf9f5; --card:#ffffff; --panel:#f0eee6; --line:#e8e5dc;
  --text:#2b2a27; --dim:#8a867c; --dim-strong:#6f6d64;
  --accent:#c96442; --accent-ink:#ffffff; --rose:#d48a94;
  --green:#2e7d43; --red:#c0392b;
  --overlay:rgba(40,38,34,.4); --user-bubble:#f0eee6;
  --glow:rgba(201,100,66,.16); --scrim:rgba(250,249,245,.78);
  --r-sm:10px; --r-md:14px; --r-lg:16px; --r-pill:999px;
  --font-display:"Noto Serif SC","Songti SC","STSong",serif;
}
[data-theme="t-candy"]{
  --bg:#fff7fa; --card:#ffffff; --panel:#ffe9f1; --line:#f7dbe6;
  --text:#4a3540; --dim:#a67a8d; --dim-strong:#8a5f71;
  --accent:#b2537b; --accent-ink:#ffffff; --rose:#e39cb8;
  --green:#2e7d43; --red:#c0392b;
  --overlay:rgba(74,53,64,.35); --user-bubble:#ffe4ee;
  --glow:rgba(216,120,159,.22); --scrim:rgba(255,247,250,.8);
  --r-sm:14px; --r-md:18px; --r-lg:24px; --r-pill:999px;
  --font-display:"Yuanti SC","PingFang SC","Noto Sans SC",sans-serif;
}
[data-theme="t-nightlamp"]{
  /* [ds 10-01 栖燃 804 go] 经典暗夜 = **中性炭黑**（小羽拍板：不要紫黑 ✓）
     与 dwell-ui.css:275 完全一致 ✓ 色值照 index.css 旧 dark：#262624/#30302e/#383836/#3d3d3a */
  --bg:#262624; --card:#30302e; --panel:#383836; --line:#3d3d3a;
  --text:#f5f4ef; --dim:#a3a099; --dim-strong:#bfb3a4;
  --accent:#c96442; --accent-ink:#ffffff;
  --rose:#e8a9ae; --green:#6fbf85; --red:#e07a6a;
  --overlay:rgba(0,0,0,.55); --user-bubble:#35353260;
  --scrim:rgba(38,38,36,.72);
  --r-sm:10px; --r-md:14px; --r-lg:16px; --r-pill:999px;
}
[data-theme="t-garden"]{
  --bg:#f4f6ef; --card:#ffffff; --panel:#e9efe2; --line:#dde4d3;
  --text:#2e332b; --dim:#82887b; --dim-strong:#5d6455;
  --accent:#5c7355; --accent-ink:#ffffff; --rose:#d48a94;
  --green:#3d7a4e; --red:#c0392b;
  --overlay:rgba(46,51,43,.4); --user-bubble:#e7eedd;
  --glow:rgba(109,133,101,.18); --scrim:rgba(244,246,239,.78);
  --r-sm:10px; --r-md:14px; --r-lg:16px; --r-pill:999px;
  --font-display:"Noto Serif SC","Songti SC","STSong",serif;
}
[data-theme="t-terracotta"], [data-theme="t-garden"]{
  --accent-soft: var(--accent); --serif: SerifNum, "Songti SC", "Noto Serif SC", Georgia, serif;
  --glass: color-mix(in srgb, var(--card) 70%, transparent);
}
[data-theme="t-candy"]{
  --accent-soft: var(--accent); --serif: "Yuanti SC", "PingFang SC", "Noto Sans SC", sans-serif;
  --glass: color-mix(in srgb, var(--card) 70%, transparent);
}
[data-theme="t-nightlamp"]{
  --accent-soft: var(--accent); --serif: SerifNum, "Songti SC", "Noto Serif SC", Georgia, serif;
  --glass: color-mix(in srgb, var(--card) 70%, transparent);
}
/* 灯屋是暗主题：系统暗色媒体查询不再覆盖它（data-theme优先级已高于:root，但index的@media暗色块选择器是html:not([data-theme="light"]):not([data-theme="t-terracotta"]):not([data-theme="t-candy"]):not([data-theme="t-garden"]):not([data-theme="t-nightlamp"])会误伤新主题——用更高优先级抵消） */
html[data-theme="t-candy"], html[data-theme="t-garden"], html[data-theme="t-terracotta"]{
  --bg-override: 1;
}


/* ==== dsLogin 登录遮罩样式（原style块2） ==== */
    #dsLogin{background:linear-gradient(165deg,var(--bg,#fff8f2),var(--bg2,#fde9dd))!important}
    #dsLogin .ds-card{background:var(--card,#fff8f2);border:1px solid var(--line,#f0e3d8);border-radius:20px;padding:34px 30px;width:min(340px,86vw);box-shadow:0 14px 44px rgba(120,80,50,.14);text-align:center}
    #dsLogin h1{font-size:26px;margin:0 0 4px;color:var(--ink,#4a3f38);letter-spacing:1px}
    #dsLogin .sub{font-size:12.5px;color:var(--ink-soft,#9a8f84);margin:0 0 20px}
    #dsLogin input{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:12px;border:1px solid var(--line,#f0e3d8);background:var(--bg,#fff);color:var(--ink,#4a3f38);font-size:15px;text-align:center;letter-spacing:2px;outline:none}
    #dsLogin input:focus{border-color:var(--accent,#e0835a)}
    #dsLogin button{margin-top:14px;width:100%;padding:12px;border:none;border-radius:12px;background:linear-gradient(150deg,var(--accent,#e0835a),var(--accent-d,#c96a3f));color:#fff;font-weight:700;font-size:15px;cursor:pointer;letter-spacing:3px}
    #dsLogin button:disabled{opacity:.55;cursor:wait}
    #dsLogin .msg{margin-top:12px;font-size:12.5px;min-height:16px;color:#c0564a}
    #dsLogin .msg.ok{color:var(--good,#3c8a4e)}
    @media (prefers-color-scheme: dark){
      #dsLogin{background:linear-gradient(165deg,#241a16,#2b1f19)!important}
      #dsLogin .ds-card,#dsLogin .ds-hint{background:#2b1f19}
      #dsLogin .ds-card{border-color:#3a2c24;box-shadow:0 14px 44px rgba(0,0,0,.5)}
    }

/* ═══ 表情包v2：上传+自定义角标 ═══ */
.sticker-cell { position: relative; }
.sticker-cell.custom img { outline: 2px dashed var(--c-accent, #b98a47); outline-offset: 2px; border-radius: 8px; }
.sticker-up-btn {
  padding: 8px 18px; border-radius: 999px; border: 1px dashed var(--c-accent, #b98a47);
  background: transparent; color: var(--c-accent, #b98a47); font-size: 13px;
}
.sticker-up-btn:active { background: rgba(185,138,71,.12); }


/* ═══ [kiran 09-26] 表情包消息：透明底适配+大图无框 ═══ */
.bubble img.chatimg {
  background: transparent !important;
  border-radius: 12px;
}
/* 气泡本身给图让位：含图消息的气泡去背景去边框（表情包模式） */
.bubble.imgonly {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.bubble.imgonly img.chatimg {
  max-width: min(220px, 80%);
  width: auto; height: auto;
  background: transparent !important;
  display: block; margin-left: auto; margin-right: 0;
}

/* ═══ [kiran 09-26] dwell风格对话框/操作菜单 v2：全走主题token，四主题自动适配 ═══ */
.dask-mask {
  position: fixed; inset: 0; z-index: 300;
  background: var(--overlay, rgba(40,38,34,.4));
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  padding: 32px;
  animation: daskIn .18s ease;
}
.dask-mask.sheet { align-items: flex-end; padding: 0; }
.dask-inp {
  width: 100%; box-sizing: border-box; margin: 10px 0 4px;
  padding: 10px 14px; border-radius: var(--r-md, 14px);
  border: 1px solid var(--line, #e8e5dc);
  background: var(--bg, #faf9f5); color: var(--text, #2b2a27);
  font-size: 15px; outline: none;
  transition: border-color .15s;
}
.dask-inp:focus { border-color: var(--accent, #c96442); }
.dask-btn {
  flex: 1; padding: 10px 0; border-radius: var(--r-md, 14px); border: none;
  background: var(--panel, #f0eee6); color: var(--text, #2b2a27);
  font-size: 14.5px; cursor: pointer;
  transition: transform .1s, opacity .15s;
}
.dask-btn:active { transform: scale(.97); }
.dask-btn.ok {
  background: color-mix(in srgb, var(--accent, #c96442) 78%, var(--card, #fff));
  color: var(--accent-ink, #fff); font-weight: 600;
}
@supports not (background: color-mix(in srgb, red 50%, blue)) {
  .dask-btn.ok { background: var(--accent-soft, var(--accent, #c96442)); }
}
.dask-btn.ok.danger { background: var(--red, #c0392b); color: #fff; }
.dsheet-btn {
  display: block; width: 100%; padding: 13px 0; margin-bottom: 6px;
  border-radius: var(--r-md, 14px); border: none;
  background: var(--panel, #f0eee6); color: var(--text, #2b2a27);
  font-size: 15px; cursor: pointer;
}
.dsheet-btn:active { background: var(--line, #e8e5dc); }
.dsheet-btn.danger { color: var(--red, #c0392b); }
.dsheet-btn.cancel { margin-top: 4px; font-weight: 600; }
@keyframes daskIn { from { opacity: 0; } }
@keyframes dsheetUp { from { transform: translateY(40px); opacity: .4; } }


/* ═══ [kiran 09-26] 模型页v3：供应商卡对齐能力页视觉 ═══ */
.capv2 .mchip {
  font-size: 12px; padding: 5px 13px; border-radius: 99px;
  border: 1px solid var(--line); color: var(--dim);
  background: transparent; cursor: pointer;
  transition: all .15s;
}
.capv2 .mchip:active { transform: scale(.96); }
.capv2 .mchip.on {
  border-color: var(--accent); color: var(--accent);
  background: var(--glow, rgba(201,100,66,.1)); font-weight: 600;
}
.capv2 .mchip.on::before { content: "● "; font-size: 8px; vertical-align: 2px; }


/* ===== [ds 09-27] 子页面全屏（甲方要求「这些子页面都做成全屏」）=====
   复用代码里**早就有**的机制：.sheetWrap.page 那套（#chatsSheet / #gongSheet 一直是全屏）。
   现在把它推平到所有子页面。
   范围只限 .sheetWrap 的**直接子** .sheet —— 不动 .dask-mask.sheet 对话框（那个本来就该小）。
   桌面（≥700px）保持 640px 居中一列，整页高度：全屏不等于拉满 1280 宽。 */
.sheetWrap.open { align-items: stretch; }
.sheetWrap > .sheet {
  height: 100dvh; max-height: 100dvh; min-height: 0; border-radius: 0;
}
.sheetWrap > .sheet::after { display: none; }      /* 全屏后不需要底部补缝 */
.sheetWrap > .sheet > .grabber { display: none; }  /* 抓手在整页里没有意义 */
.sheetWrap > .sheet > .head {
  padding-top: calc(14px + env(safe-area-inset-top, 0px));
  border-bottom: 1px solid var(--line);            /* 头部与滚动内容分层 */
}
.sheetWrap > .sheet > .body { padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)); }
@media (min-width: 700px) {
  .sheetWrap.open { align-items: center; }
  .sheetWrap > .sheet { max-width: 640px; }
}

/* ---------- 气泡样式系统（栖燃 10-06：开关+色板+间距，设置→主题与背景） ---------- */
/* 默认=磨砂开。变量由JS写body style；body.no-bubble类=恢复素净（磨砂前的原样） */
body.no-bubble .bubble {
  background: var(--user-bubble);
  -webkit-backdrop-filter: none; backdrop-filter: none;
  border: 0; box-shadow: none;
}
body.no-bubble .gu {
  background: var(--card);
  -webkit-backdrop-filter: none; backdrop-filter: none;
  border: 0; border-radius: 16px; box-shadow: none;
}
/* 色板：--bubble-user/--bubble-gu有值时覆盖默认底色（仍带磨砂） */
body[data-bubble-user] .bubble { background: var(--bubble-user); }
body[data-bubble-gu] .gu { background: var(--bubble-gu); }
/* [10-06下晌] 真·磨砂参数（她嫌丑：糊在纯色上=脏。升级：更通透+更大blur+光边更亮，配气氛底纹才出效果） */
body.bubble-real .bubble {
  background: color-mix(in srgb, var(--user-bubble) 55%, transparent);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid color-mix(in srgb, #fff 45%, transparent);
  box-shadow: 0 4px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.5);
}
body.bubble-real .gu {
  background: color-mix(in srgb, var(--card) 72%, transparent);
  -webkit-backdrop-filter: blur(10px) saturate(1.2);
  backdrop-filter: blur(10px) saturate(1.2);
  border: 1px solid color-mix(in srgb, #fff 45%, transparent);
  border-radius: 16px;
  box-shadow: 0 2px 10px rgba(0,0,0,.07), inset 0 1px 0 rgba(255,255,255,.45);
}
/* 气氛底纹（可选三款柔和渐变，给磨砂"可糊的东西"；纯装饰可关） */
body[data-chat-amb="dawn"] #log {
  background: radial-gradient(120% 90% at 15% 8%, rgba(240,122,138,.10), transparent 55%),
              radial-gradient(120% 90% at 88% 90%, rgba(201,100,66,.10), transparent 55%);
}
body[data-chat-amb="sea"] #log {
  background: radial-gradient(130% 80% at 80% 10%, rgba(140,180,220,.13), transparent 60%),
              radial-gradient(120% 90% at 10% 95%, rgba(150,200,190,.11), transparent 55%);
}
body[data-chat-amb="lavender"] #log {
  background: radial-gradient(130% 90% at 20% 15%, rgba(190,160,220,.11), transparent 55%),
              radial-gradient(120% 80% at 85% 85%, rgba(230,180,200,.09), transparent 60%);
}
/* 消息间隔三档：normal(默认18) / roomy(30，她要的"别长在一起") / cozy(10) */
body[data-msg-gap="roomy"] #log { gap: 30px !important; }
body[data-msg-gap="cozy"] #log { gap: 10px !important; }
#addSheet #stickerBtn, #addSheet #dsPokeBtn { width: 100% !important; height: 44px !important; min-height: 44px; border-radius: 10px; justify-content: flex-start; gap: 8px; }
/* Chat composer: text above one compact action rail. Lazy controls live in the
   scrollable middle cell; the attachment and send buttons never wrap. */
.composer { box-sizing: border-box; width: min(100%, 720px); padding: 8px 10px 7px; border-radius: 20px; }
.composer .ctlrow {
  display: grid;
  grid-template-columns: 44px minmax(70px, 102px) minmax(0, 1fr) 44px;
  grid-template-rows: minmax(38px, auto) 44px;
  align-items: center;
  gap: 3px 7px;
  min-width: 0;
}
.composer .ctlrow #box {
  grid-column: 1 / -1; grid-row: 1;
  width: 100%; min-width: 0; min-height: 38px; max-height: 128px;
  margin: 0; padding: 5px 4px; box-sizing: border-box; overflow-y: auto;
  line-height: 1.45;
}
.composer .ctlrow #plusBtn { grid-column: 1; grid-row: 2; width: 44px; height: 44px; }
.composer .ctlrow #modelPill {
  grid-column: 2; grid-row: 2; justify-self: start;
  width: fit-content; min-width: 56px; max-width: 100%; height: 40px; min-height: 40px;
  padding: 0 10px; box-sizing: border-box;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font-size: 12.5px;
}
.composer .ctlrow #quickActions {
  grid-column: 3; grid-row: 2; display: flex; align-items: center;
  min-width: 0; gap: 3px; overflow-x: auto; overflow-y: hidden;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.composer .ctlrow #quickActions::-webkit-scrollbar { display: none; }
.composer .ctlrow #quickActions > button {
  flex: none; width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden; white-space: nowrap; font-size: 0;
}
.composer .ctlrow #quickActions #callBtn { margin-left: auto; order: 99; }
.composer .ctlrow #send { grid-column: 4; grid-row: 2; width: 44px; height: 44px; }
.composer .ctlrow :is(#plusBtn,#send,#modelPill,#quickActions > button):focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px;
}
@media (max-width: 360px) {
  footer { padding-left: 8px; padding-right: 8px; }
  .composer { padding-left: 8px; padding-right: 8px; }
  .composer .ctlrow { gap: 3px 5px; grid-template-columns: 44px minmax(66px, 92px) minmax(0, 1fr) 44px; }
}

/* The attachment chooser is a bottom sheet, independent from full-page tools. */
#addSheet.open { align-items: flex-end; }
#addSheet > .sheet {
  width: 100%; height: min(62dvh, 510px); min-height: 0;
  max-height: calc(100dvh - 24px); max-width: 640px;
  border-radius: 24px 24px 0 0;
  box-shadow: 0 -12px 40px rgba(26, 24, 20, .13);
}
#addSheet > .sheet::after { display: block; }
#addSheet > .sheet > .grabber {
  display: block; flex: none; align-self: center;
  width: 38px; height: 4px; margin: 10px 0 0;
  border-radius: 4px; background: var(--line);
}
#addSheet > .sheet > .head { padding: 7px 16px 9px; border-bottom: 0; }
#addSheet > .sheet > .body { padding: 4px 18px calc(20px + env(safe-area-inset-bottom)); }
#addSheet .addgrid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; padding: 2px 0 6px; }
#addSheet .addbig { width: 100%; height: 106px; }
#addSheet .addrow { min-height: 52px; padding: 11px 16px; margin-top: 9px; }
/* Thought process opens as a readable bottom sheet; drag its handle to resize. */
#thinkSheet.open { align-items: flex-end; }
#thinkSheet > .sheet { height: 62dvh; min-height: 0; max-height: 92dvh; border-radius: 24px 24px 0 0; }
#thinkSheet > .sheet > .grabber { display: block; touch-action: none; }
#thinkSheet > .sheet > .grabber {
  flex: none; align-self: center; width: 38px; height: 4px;
  margin: 10px 0 0; border-radius: 4px; background: var(--line);
}
#thinkSheet > .sheet > .head {
  min-height: 48px; padding: 4px 16px 8px;
  border-bottom: 1px solid var(--line); touch-action: none;
}
#thinkSheet > .sheet > .body { min-height: 0; overflow-y: auto; }
@media (min-width: 700px) {
  #addSheet.open { align-items: center; }
  #addSheet > .sheet { width: min(440px, calc(100% - 32px)); height: auto; min-height: 330px; border-radius: 24px; }
  #addSheet > .sheet::after { display: none; }
}

/* Safe block Markdown used in chat bubbles. Tables scroll inside the bubble on phones. */
.gu .mdp, .bubble .mdp { margin: 0 0 8px; line-height: 1.65; }
.gu .mdp:last-child, .bubble .mdp:last-child { margin-bottom: 0; }
.gu .mdh4, .bubble .mdh4 { font-size: 17px; }
.gu .mdh5, .bubble .mdh5 { font-size: 15px; }
.gu .mdh6, .bubble .mdh6 { font-size: 14px; }
.gu .mdquote, .bubble .mdquote { margin: 8px 0; padding: 2px 0 2px 12px; border-left: 3px solid var(--accent-soft); color: var(--dim); }
.gu .mdquote > :first-child, .bubble .mdquote > :first-child { margin-top: 0; }
.gu .mdquote > :last-child, .bubble .mdquote > :last-child { margin-bottom: 0; }
.gu ul, .gu ol, .bubble ul, .bubble ol { margin: 6px 0 10px; padding-left: 24px; }
.gu li, .bubble li { padding-left: 2px; margin: 3px 0; }
.gu .mdtable-wrap, .bubble .mdtable-wrap { max-width: 100%; overflow-x: auto; margin: 8px 0 12px; -webkit-overflow-scrolling: touch; }
.gu .mdtable, .bubble .mdtable { border-collapse: collapse; min-width: 100%; font-size: .94em; }
.gu .mdtable th, .gu .mdtable td, .bubble .mdtable th, .bubble .mdtable td { padding: 6px 9px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.gu .mdtable th, .bubble .mdtable th { background: rgba(128,128,128,.08); font-weight: 700; }
.gu hr, .bubble hr { border: 0; border-top: 1px solid var(--line); margin: 10px 0; }

/* Message attachments share one compact layout in echo and reloaded history. */
.bubble .chat-attachments { display: grid; gap: 8px; margin-top: 8px; white-space: normal; }
.bubble .chat-attachments:first-child { margin-top: 0; }
.chat-attachment-image { display: block; max-width: min(260px, 68vw); overflow: hidden; border-radius: 13px; color: var(--text); }
.chat-attachment-image img { display: block; width: 100%; max-height: 340px; object-fit: contain; border-radius: inherit; }
.chat-attachment-file {
  display: flex; align-items: center; gap: 10px;
  min-width: 0; max-width: min(310px, 70vw);
  padding: 9px 11px; border: 1px solid var(--line); border-radius: 12px;
  background: var(--panel); color: var(--text); text-decoration: none !important;
}
.chat-file-icon { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--card); font-size: 18px; }
.chat-file-label { display: grid; min-width: 0; gap: 2px; }
.chat-file-label strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; }
.chat-file-label small { color: var(--dim); font-size: 11px; }

/* Model usage remains legible even when the optional runtime style is unavailable. */
#modelBody .ds-ledger { margin: 16px 0 6px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: var(--card); }
#modelBody .ds-led-head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 0; border: 0; background: transparent; color: var(--text); font: inherit; font-weight: 650; text-align: left; }
#modelBody .ds-led-chev { margin-left: auto; }
#modelBody .ds-led-sum { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
#modelBody .ds-led-k { padding: 5px 8px; border-radius: 8px; background: var(--panel); font-size: 12px; white-space: nowrap; }
#modelBody .ds-led-ctx, #modelBody .ds-led-hint { color: var(--dim); font-size: 12px; line-height: 1.5; }
#modelBody .ds-led-recent { display: grid; gap: 8px; margin-top: 12px; }
#modelBody .ds-led-recent .ds-led-labels { display: none; }
#modelBody .ds-led-recent .ds-led-row:not(.ds-led-labels) { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px 4px; align-items: start; padding: 10px; border: 1px solid var(--line); border-radius: 11px; background: var(--panel); font-size: 12px; }
#modelBody .ds-led-row .ds-led-time { grid-column: 1; color: var(--dim); font-variant-numeric: tabular-nums; }
#modelBody .ds-led-row .ds-led-model { grid-column: 2 / -1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-weight: 600; text-align: right; }
#modelBody .ds-led-row .ds-led-n { min-width: 0; color: var(--text); text-align: left; font-variant-numeric: tabular-nums; }
#modelBody .ds-led-row .ds-led-n::before { display: block; margin-bottom: 2px; color: var(--dim); font-size: 10px; font-weight: 400; }
#modelBody .ds-led-row .ds-led-n:nth-child(3)::before { content: '输入'; }
#modelBody .ds-led-row .ds-led-n:nth-child(4)::before { content: '命中'; }
#modelBody .ds-led-row .ds-led-n:nth-child(5)::before { content: '输出'; }
#modelBody .ds-led-row .ds-led-n:nth-child(6)::before { content: '耗时'; }
#modelBody .ds-led-row .ds-led-n:last-child { display: block; }
#modelBody .ds-led-hint { margin-top: 12px; }

/* Keep the single branch navigator aligned with the message action icons. */
#log .ds-mm .row1 .ds-branch-n { align-self: center; min-width: 28px; padding: 0 2px; color: var(--dim); font-size: 11px; font-variant-numeric: tabular-nums; text-align: center; }