/* 顶栏胶囊（第十轮，10-16）：一个框、两个标签「问 AI ｜ 随手记」。结构与行为见 app.js「画：顶栏胶囊」，「问 AI」里的对话样式在 ask.css。
   白晨 10-16 凌晨：不硬融合、找巧妙的共存方式；文案不随输入内容变；框左边不放图标；对话中三种能力都在；用行业里通用、新用户看得懂的做法。
   视觉：收着是一条安静的胶囊，右端一个只有图标的二选一（便签＝随手记、星芒＝问 AI；10-16 白晨嫌字突兀）。
   选了问 AI，整个框换上 Siri 那种全彩流光边框（白晨 10-16 定，选全彩不选杏粉紫）：一道细的彩色描边沿边流动、框内沿一圈柔光、框外一层彩色光晕，
   AI 在答时流得更快；随手记是暖白纸面、普通细边。一眼知道「现在在跟谁说话」。
   动效：滑片 420 毫秒带一点回弹；换房间时高度从旧补到新、内容错峰浮现（app.js islSwap）；只动 transform、opacity 与框的宽高。 */

.ask-wrap { position: relative; display: flex; align-items: center; flex: 1 1 auto; height: 40px; max-width: 600px; min-width: 0; margin: 0 auto; }
.isl { --dz: oklch(64% .08 296); --s1: #2F8BFF; --s2: #9B5CF6; --s3: #F0479A; --s4: #FF8A3D; --s5: #FFC35A; position: absolute; z-index: 30; top: 0; left: 0; right: 0; height: 40px; display: flex; flex-direction: column; overflow: hidden; border-radius: 20px;
  background: #FFFDFB; box-shadow: inset 0 0 0 1px var(--line), 0 4px 14px -8px rgba(150, 90, 60, .28);
  transition: background-color 280ms var(--ease), box-shadow 320ms var(--ease); }
.isl:hover { background: #FFFFFF; }
.isl.t-ask { --dz: var(--s2); }
/* 问 AI 的流光：四层，都靠透明度淡入淡出（渐变本身没法过渡）——
   ::before 一道 1.6 像素的彩色描边，沿边流动（平时 6 秒一圈，AI 在答 1.1 秒一圈、框外光晕 2.2 秒换一轮）；
   .isl-glow 框内沿一圈柔光（同一条彩带放宽、模糊，框外那半被裁掉，只剩向内渗的光）；
   ::after 展开后面板的极淡彩色底；框外的彩色光晕用 box-shadow，几种颜色的影子绕着框慢慢换位置（isl-halo）。 */
.isl::after { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity 360ms var(--ease);
  background: linear-gradient(115deg, color-mix(in srgb, var(--s1) 5%, #FFFFFF), color-mix(in srgb, var(--s2) 4%, #FFFFFF) 40%, color-mix(in srgb, var(--s3) 4%, #FFFFFF) 70%, color-mix(in srgb, var(--s4) 5%, #FFFFFF)); }
.isl::before { content: ""; position: absolute; inset: 0; z-index: 3; padding: 1.6px; border-radius: inherit; pointer-events: none; opacity: 0;
  background: conic-gradient(from var(--edge-a, 0deg), var(--s1), var(--s2) 20%, var(--s3) 40%, var(--s4) 60%, var(--s5) 72%, var(--s3) 86%, var(--s1));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  animation: isl-flow 6s linear infinite; transition: opacity 360ms var(--ease); }
.isl-glow { position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none; opacity: 0; filter: blur(7px); transition: opacity 420ms var(--ease); }
.isl-glow i { position: absolute; inset: 0; padding: 4px; border-radius: inherit;
  background: conic-gradient(from var(--edge-a, 0deg), var(--s1), var(--s2) 20%, var(--s3) 40%, var(--s4) 60%, var(--s5) 72%, var(--s3) 86%, var(--s1));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: .55; animation: isl-flow 6s linear infinite; }
.isl.t-ask::before, .isl.t-ask .isl-glow { opacity: 1; }
.isl.is-open.t-ask::after { opacity: 1; }
.isl.is-open.t-ask .isl-glow i { opacity: .42; }
.isl.is-busy::before, .isl.is-busy .isl-glow i, .isl.is-busy .isl-thumb::after { animation-duration: 1.1s; }
.isl.is-open.t-ask.is-busy { animation-duration: 2.2s; }
.isl.is-busy .isl-glow i { opacity: .7; }
@keyframes isl-flow { from { --edge-a: 0deg; } to { --edge-a: 360deg; } }
.isl-row, .isl-more { position: relative; z-index: 1; }
/* 框外光晕：收着时 */
.isl.t-ask:not(.is-open) { background: #FFFFFF; box-shadow: 0 4px 14px -8px rgba(150, 90, 60, .22); animation: isl-halo 6s linear infinite; }
@keyframes isl-halo {
  0%, 100% { box-shadow: -8px 0 18px -8px color-mix(in srgb, var(--s1) 70%, transparent), 8px 0 18px -8px color-mix(in srgb, var(--s3) 70%, transparent), 0 6px 16px -8px color-mix(in srgb, var(--s4) 60%, transparent); }
  33% { box-shadow: -8px 0 18px -8px color-mix(in srgb, var(--s3) 70%, transparent), 8px 0 18px -8px color-mix(in srgb, var(--s4) 70%, transparent), 0 6px 16px -8px color-mix(in srgb, var(--s2) 60%, transparent); }
  66% { box-shadow: -8px 0 18px -8px color-mix(in srgb, var(--s4) 70%, transparent), 8px 0 18px -8px color-mix(in srgb, var(--s1) 70%, transparent), 0 6px 16px -8px color-mix(in srgb, var(--s3) 60%, transparent); }
}

/* ---- 收着：一行 ---- */
.isl-row { display: flex; align-items: center; gap: 4px; flex: none; height: 40px; padding: 0 5px 0 0; }
.isl textarea { flex: 1; min-width: 0; height: 40px; margin: 0; padding: 9px 6px 9px 18px; border: 0; background: none; outline: none; resize: none; overflow: hidden;
  font-size: 14px; line-height: 22px; white-space: nowrap; caret-color: var(--ink); color: var(--ink); }
/* 占位提示是单独一层：换房间时能从下面换上来（原生 placeholder 做不了动效）；写了字就藏起来 */
.isl-ph { position: absolute; left: 18px; top: 9px; z-index: 0; font-size: 14px; line-height: 22px; color: var(--ink-3); white-space: nowrap; pointer-events: none; }
.isl.has-text .isl-ph { visibility: hidden; }
.isl-clip { display: grid; place-items: center; flex: none; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--ink-3); cursor: pointer;
  transition: background-color 160ms var(--ease), color 160ms var(--ease); }
.isl-clip:hover { background: var(--accent-soft); color: var(--ink); }
.isl-clip .ico { width: 16px; height: 16px; }

/* ---- 两个标签：二选一，白色滑片滑到亮着的那个下面 ---- */
.isl-tabs { position: relative; display: flex; flex: none; height: 30px; padding: 3px; border-radius: 15px; background: rgba(31, 30, 27, .055); }
.isl-thumb { position: absolute; top: 3px; left: 0; width: var(--w, 0px); height: 24px; border-radius: 12px; background: #FFFFFF; transform: translateX(var(--x, 0px));
  box-shadow: 0 1px 2px rgba(70, 48, 34, .12), 0 3px 10px -3px rgba(70, 48, 34, .22);
  transition: transform 420ms cubic-bezier(.3, 1.18, .45, 1), width 420ms cubic-bezier(.3, 1.18, .45, 1); }
.isl-thumb::after { content: ""; position: absolute; inset: 0; border-radius: inherit; opacity: 0; pointer-events: none;
  background: conic-gradient(from var(--edge-a, 0deg), var(--s1), var(--s2) 25%, var(--s3) 50%, var(--s4) 75%, var(--s1)); animation: isl-flow 6s linear infinite; transition: opacity 320ms var(--ease); }
.isl.t-ask .isl-thumb::after { opacity: 1; }
.isl-tab { position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 24px; padding: 0; border: 0; border-radius: 12px; background: none;
  color: var(--ink-3); cursor: pointer; transition: color 220ms var(--ease); }
.isl-tab > .ico { width: 15px; height: 15px; stroke-width: 1.8; transition: transform 360ms cubic-bezier(.3, 1.18, .45, 1); }
.isl-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
/* AI 图标：没选时是 Siri 那套蓝紫粉橙的渐变实心星芒，选了是流光滑片上的白星芒，小星芒闪一下 */
.isl-tab[data-v="ask"] > .ico { width: 17px; height: 17px; }
.isl-tab[data-v="ask"] path { fill: url(#isl-ai-g); transition: fill 200ms var(--ease); }
.isl.t-ask .isl-tab[data-v="ask"] path { fill: #FFFFFF; }
/* 胶囊里其他 AI 的小星芒（能看什么、示例问题、整理进度与建议、开着的「AI 帮我整理」）也用同一条渐变 */
.isl-scope .ico path, .ask-chip .ico path, .rc-ai .ico path, .rc-sug .ico path, .isl-aiop[aria-pressed="true"] .ico path, .nt-ai .ico path, .nt-sum .ico path { fill: url(#isl-ai-g); }
.isl-tab .ai-s { transform-box: fill-box; transform-origin: center; }
.isl.t-ask .isl-tab[data-v="ask"] .ai-s { animation: isl-twinkle 2.8s var(--ease) infinite; }
@keyframes isl-twinkle { 0%, 70%, 100% { transform: none; opacity: 1; } 80% { transform: scale(.55) rotate(45deg); opacity: .7; } 90% { transform: scale(1.15); opacity: 1; } }
.isl-tab:hover { color: var(--ink-2); }
.isl-tab[aria-selected="true"] { color: var(--ink); }
.isl-tab[aria-selected="true"] > .ico { transform: scale(1.06); }
.isl.t-ask .isl-tab[data-v="ask"] { color: #FFFFFF; }
.isl.t-ask .isl-tab[data-v="ask"] > .ico { transform: scale(1.04); filter: drop-shadow(0 1px 1.5px rgba(80, 40, 120, .35)); }
.isl-tab:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }
/* 标签上的状态：在忙（看不见那个房间时）转一个小圈；有新结果留一个点（都挂在图标右上角） */
.isl-st { display: none; position: absolute; top: 1px; right: 3px; width: 7px; height: 7px; border-radius: 50%; }
.isl-tab.is-new .isl-st { display: block; background: conic-gradient(var(--r1), var(--r2), var(--r3), var(--r1)); box-shadow: 0 0 0 1.5px #FFFFFF; animation: isl-pop 420ms cubic-bezier(.3, 1.18, .45, 1); }
.isl-tab.is-busy .isl-st { display: block; top: -1px; right: 1px; width: 10px; height: 10px; background: conic-gradient(from 0deg, transparent 0 25%, var(--r1), var(--r2), var(--r3));
  -webkit-mask: radial-gradient(circle, transparent 2.6px, #000 3px); mask: radial-gradient(circle, transparent 2.6px, #000 3px); animation: isl-spin 900ms linear infinite; }
@keyframes isl-spin { to { transform: rotate(1turn); } }
@keyframes isl-pop { from { transform: scale(0); } }
.isl-tab.is-ping { animation: isl-ping 1.4s var(--ease); }
@keyframes isl-ping { 25% { background: color-mix(in srgb, var(--e2) 18%, #FFFFFF); box-shadow: 0 0 0 3px color-mix(in srgb, var(--e2) 30%, transparent); } }

/* ---- 展开 ---- */
.isl-more { display: none; }
.isl.is-open { top: -6px; left: -40px; right: -40px; height: auto; border-radius: 24px; background: #FFFDFA;
  box-shadow: inset 0 0 0 1px var(--line), 0 2px 6px rgba(70, 48, 34, .07), 0 30px 64px -20px rgba(70, 48, 34, .38); }
.isl.is-open.t-ask { animation: isl-halo-open 6s linear infinite; }
@keyframes isl-halo-open {
  0%, 100% { box-shadow: -10px 0 30px -12px color-mix(in srgb, var(--s1) 60%, transparent), 10px 0 30px -12px color-mix(in srgb, var(--s3) 60%, transparent), 0 2px 6px rgba(70, 48, 34, .07), 0 30px 64px -20px rgba(70, 48, 34, .34); }
  33% { box-shadow: -10px 0 30px -12px color-mix(in srgb, var(--s3) 60%, transparent), 10px 0 30px -12px color-mix(in srgb, var(--s4) 60%, transparent), 0 2px 6px rgba(70, 48, 34, .07), 0 30px 64px -20px rgba(70, 48, 34, .34); }
  66% { box-shadow: -10px 0 30px -12px color-mix(in srgb, var(--s4) 60%, transparent), 10px 0 30px -12px color-mix(in srgb, var(--s1) 60%, transparent), 0 2px 6px rgba(70, 48, 34, .07), 0 30px 64px -20px rgba(70, 48, 34, .34); }
}
.isl.is-open .isl-row { align-items: flex-start; height: auto; padding: 9px 9px 0 0; }
.isl.is-open textarea { height: 46px; padding: 6px 6px 4px 20px; white-space: pre-wrap; overflow: auto; font-size: 15px; line-height: 24px; }
.isl.is-open .isl-ph { left: 20px; top: 15px; font-size: 15px; line-height: 24px; }
.isl.is-open .isl-more { display: flex; flex-direction: column; }
.isl-ghost { position: absolute; pointer-events: none; }
.isl-more.isl-ghost { display: flex !important; flex-direction: column; }
.isl-pane.isl-ghost { display: flex !important; flex-direction: column; }

/* 附件：拖到「问 AI」的文件挂在框上 */
.isl-att:empty { display: none; }
.isl-att { display: flex; padding: 4px 14px 0 18px; }
.isl-file { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; height: 36px; padding: 0 4px 0 10px; border-radius: 11px; background: #FFFFFF;
  box-shadow: inset 0 0 0 1px var(--line-strong), 0 6px 14px -10px rgba(70, 48, 34, .35); font-size: 12.5px; }
.isl-file > .ico { flex: none; width: 16px; height: 16px; color: oklch(52% .09 296); }
.isl-file b { min-width: 0; overflow: hidden; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.isl-file span { flex: none; color: var(--ink-3); white-space: nowrap; }
.isl-file-x { display: grid; place-items: center; flex: none; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--ink-3); cursor: pointer; }
.isl-file-x:hover { background: var(--accent-soft); color: var(--ink); }
.isl-file-x .ico { width: 13px; height: 13px; }

/* 底栏：左边是这个房间自己的一样东西（随手记：「AI 帮我整理」开关；问 AI：它能看什么），右边固定的键位提示和发送 */
.isl-foot { display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 4px 10px 10px 14px; }
.isl-aiop { display: inline-flex; align-items: center; gap: 6px; flex: none; height: 30px; padding: 0 8px 0 9px; border: 1px solid transparent; border-radius: var(--radius-pill);
  background: rgba(31, 30, 27, .05); color: var(--ink-3); font: 600 12.5px var(--font-sans); cursor: pointer; transition: background-color 200ms var(--ease), color 200ms var(--ease), box-shadow 200ms var(--ease); }
.isl-aiop:hover { color: var(--ink-2); background: rgba(31, 30, 27, .08); }
.isl-aiop .ico { width: 14px; height: 14px; stroke-width: 1.6; transition: color 200ms var(--ease), transform 360ms cubic-bezier(.3, 1.18, .45, 1); }
.isl-aiop[aria-pressed="true"] { color: var(--e-ink);
  background: linear-gradient(#FFFFFF, #FFFFFF) padding-box, linear-gradient(115deg, color-mix(in srgb, var(--s1) 55%, #FFFFFF), color-mix(in srgb, var(--s2) 55%, #FFFFFF), color-mix(in srgb, var(--s3) 55%, #FFFFFF), color-mix(in srgb, var(--s4) 55%, #FFFFFF)) border-box;
  box-shadow: 0 6px 14px -10px color-mix(in srgb, var(--s2) 80%, transparent); }
.isl-aiop[aria-pressed="true"] .ico { transform: scale(1.08); }
/* 开关的小拨钮：开着是光边色、圆点在右 */
.isl-sw { position: relative; flex: none; width: 24px; height: 14px; margin-left: 2px; border-radius: 7px; background: rgba(31, 30, 27, .18); transition: background-color 240ms var(--ease); }
.isl-sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 10px; height: 10px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 1px 2px rgba(31, 30, 27, .25);
  transition: transform 300ms cubic-bezier(.3, 1.18, .45, 1); }
.isl-aiop[aria-pressed="true"] .isl-sw { background: linear-gradient(90deg, var(--s1), var(--s2), var(--s3)); }
.isl-aiop[aria-pressed="true"] .isl-sw::after { transform: translateX(10px); }
.isl-scope { display: none; align-items: center; gap: 6px; min-width: 0; font-size: 12px; color: var(--e-ink); }
.isl-scope .ico { flex: none; width: 12px; height: 12px; color: var(--r2); fill: currentColor; stroke-width: 1.2; }
.isl-scope span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.isl.t-ask .isl-aiop { display: none; }
.isl.t-ask .isl-scope { display: inline-flex; }
.isl-keys { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; font-size: 11.5px; color: var(--ink-3); white-space: nowrap; }
.isl-keys kbd { padding: 1px 5px; border-radius: 5px; background: rgba(31, 30, 27, .06); box-shadow: inset 0 -1px 0 rgba(31, 30, 27, .08); color: var(--ink-2); font: 600 10.5px/16px var(--font-num); }
.isl-keys i { font-style: normal; opacity: .5; }
.isl-send { display: grid; place-items: center; flex: none; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: var(--ink); color: #FFFFFF; cursor: pointer;
  transition: background-color 220ms var(--ease), transform 220ms var(--ease), box-shadow 220ms var(--ease); }
.isl-send .ico { width: 17px; height: 17px; stroke-width: 2.2; }
.isl-send:hover { transform: translateY(-1px); }
.isl-send:active { transform: scale(.94); }
.isl:not(.has-text) .isl-send { background: rgba(31, 30, 27, .14); cursor: default; transform: none; }
.isl.t-ask.has-text .isl-send { box-shadow: 0 6px 16px -6px color-mix(in srgb, var(--e2) 85%, transparent); }

/* ---- 两个房间 ---- */
.isl-pane { display: none; flex-direction: column; min-height: 0; padding: 12px 14px 14px; border-top: 1px solid var(--line); }
.isl.t-ask .isl-pane { border-top-color: color-mix(in srgb, var(--s2) 14%, var(--line)); }
.isl.t-note .p-note, .isl.t-ask .p-ask { display: flex; }
.p-ask .ask-head { padding-top: 0; border-top: 0; }

/* 随手记：「刚记的」三行，每行右边是 AI 整理的进度或结果 */
.isl-rh { display: flex; align-items: center; justify-content: space-between; margin: -2px 0 8px 4px; font-size: 12px; color: var(--ink-3); }
.isl-lnk { display: inline-flex; align-items: center; gap: 2px; height: 24px; padding: 0 4px 0 8px; border: 0; border-radius: 12px; background: none; color: var(--ink-3); font-size: 12px; cursor: pointer;
  transition: background-color 160ms var(--ease), color 160ms var(--ease); }
.isl-lnk:hover { background: var(--accent-soft); color: var(--ink); }
.isl-lnk .ico { width: 12px; height: 12px; }
.isl-rcs { position: relative; display: flex; flex-direction: column; gap: 5px; }
.isl-rc { position: relative; display: flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 6px 0 2px; border-radius: 12px;
  background: color-mix(in oklch, var(--sn-p) 85%, #FFFFFF); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--sn-e) 75%, transparent); }
.isl-rc.is-recv { background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--line); }
.isl-rc.is-new { animation: rc-new 1.3s var(--ease); }
@keyframes rc-new { 0%, 30% { box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--sn-c) 60%, transparent), 0 0 0 4px color-mix(in oklch, var(--sn-c) 16%, transparent); } }
.isl-rc-gone { background: none; box-shadow: inset 0 0 0 1px var(--line); pointer-events: none; }
.rc-t { display: flex; align-items: center; gap: 9px; flex: 1; min-width: 0; height: 38px; padding: 0 6px 0 10px; border: 0; border-radius: 10px; background: none; color: var(--ink); font-size: 13.5px; text-align: left; cursor: pointer; }
.rc-t > i { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--sn-c); }
.rc-t > .ico { flex: none; width: 15px; height: 15px; margin: 0 -2px 0 -3px; color: var(--sn-c); }
.rc-t span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rc-t:hover span { text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
.rc-st { display: flex; align-items: center; flex: none; }
.rc-at { padding-right: 6px; font: 12px var(--font-num); color: var(--ink-3); }
.rc-ai { display: inline-flex; align-items: center; gap: 5px; padding-right: 6px; font-size: 12px; color: var(--e-ink); }
.rc-ai .ico { width: 12px; height: 12px; color: var(--r2); fill: currentColor; stroke-width: 1.2; }
.rc-ai.is-run .ico, .nt-ai.is-run .ico { animation: isl-spin 2.4s linear infinite; }
.rc-ai.is-run span, .nt-ai.is-run span { background: linear-gradient(90deg, var(--e-ink) 0%, var(--e-ink) 38%, color-mix(in srgb, var(--e2) 70%, #FFFFFF) 50%, var(--e-ink) 62%, var(--e-ink) 100%); background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent; animation: isl-shine 1.5s linear infinite; }
@keyframes isl-shine { from { background-position: 100% 0; } to { background-position: 0 0; } }
.rc-sug { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 3px 0 9px; border: 1px solid transparent; border-radius: var(--radius-pill); cursor: pointer;
  background: linear-gradient(#FFFFFF, #FFFFFF) padding-box, linear-gradient(115deg, color-mix(in srgb, var(--s1) 45%, #FFFFFF), color-mix(in srgb, var(--s2) 45%, #FFFFFF), color-mix(in srgb, var(--s3) 45%, #FFFFFF), color-mix(in srgb, var(--s4) 45%, #FFFFFF)) border-box;
  color: var(--e-ink); font-size: 12px; transition: transform 160ms var(--ease), box-shadow 160ms var(--ease); }
.rc-sug .ico { width: 12px; height: 12px; color: var(--r2); fill: currentColor; stroke-width: 1.2; }
.rc-sug b { height: 20px; padding: 0 8px; border-radius: 10px; background: var(--ink); color: #FFFFFF; font: 600 11.5px/20px var(--font-sans); }
.rc-sug:hover { transform: translateY(-1px); box-shadow: 0 6px 14px -8px color-mix(in srgb, var(--e2) 90%, transparent); }
.rc-ok { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 9px; border: 0; border-radius: var(--radius-pill); background: var(--done-bg); color: var(--done-ink); font: 600 12px var(--font-sans); cursor: pointer; }
.rc-ok .ico { width: 12px; height: 12px; stroke-width: 2.4; }
.isl-empty { margin: 0 4px 2px; font-size: 12.5px; line-height: 1.7; color: var(--ink-3); }

/* ---- 拖文件进来：落点占满面板，虚线框呼吸；正在它上面时实线、亮起来。另一个标签描一圈虚线：拖到它上面停一下就切过去 ---- */
.isl-drop { display: none; }
.isl.is-drag .isl-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; height: 124px; margin: 8px 12px 12px; border-radius: 16px; text-align: center;
  background: rgba(255, 255, 255, .72); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--dz) 55%, transparent); outline: 1.5px dashed color-mix(in srgb, var(--dz) 70%, transparent); outline-offset: -6px;
  animation: isl-breathe 1.6s ease-in-out infinite; transition: background-color 160ms var(--ease), transform 200ms var(--ease); }
.isl.is-drag .isl-foot, .isl.is-drag .isl-pane, .isl.is-drag .isl-att { display: none; }
.isl.is-open.is-drag textarea { height: 32px; overflow: hidden; }
.isl.is-drag .isl-tab[aria-selected="false"] { outline: 1px dashed var(--line-strong); outline-offset: -2px; }
.isl-drop b { font-size: 15px; font-weight: 650; }
.isl-drop > span:last-child { font-size: 12px; color: var(--ink-2); }
.isl-drop-ic { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 4px; border-radius: 50%; background: var(--dz); color: #FFFFFF; }
.isl-drop-ic .ico { width: 17px; height: 17px; }
.isl.t-ask .isl-drop-ic .ico { fill: currentColor; stroke-width: 1.2; }
.isl.is-hot .isl-drop { background: #FFFFFF; outline-style: solid; transform: scale(1.015); animation: none; }
@keyframes isl-breathe { 50% { outline-offset: -9px; } }

/* ---- 桌面便签上的 AI 整理：整理中，便签外圈一道光边沿边流动；整理好了亮一下，长出建议 ---- */
.nt.is-ai-run::before { content: ""; position: absolute; inset: 0; z-index: 1; padding: 1.3px; border-radius: inherit; pointer-events: none;
  background: conic-gradient(from calc(var(--edge-a, 0deg) + 200deg), var(--r1), var(--r2) 28%, var(--r3) 52%, var(--r2) 76%, var(--r1));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: isl-flow 2.4s linear infinite; }
.nt.is-ai-done::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; animation: nt-ai-ring 1.4s var(--ease) forwards; }
@keyframes nt-ai-ring { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--e2) 55%, transparent); } 100% { box-shadow: 0 0 0 12px color-mix(in srgb, var(--e2) 0%, transparent); } }
.nt-f { flex-wrap: wrap; gap: 6px; }
.nt-ai { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px 0 8px; border-radius: var(--radius-pill); background: rgba(255, 255, 255, .78); color: var(--e-ink); font: 600 12px var(--font-sans); }
.nt-ai .ico { width: 12px; height: 12px; color: var(--r2); fill: currentColor; stroke-width: 1.2; }
.nt-chip.nt-link .ico { color: var(--ink-3); fill: none; stroke-width: 1.8; }
.nt-sum { display: flex; gap: 6px; margin: -2px 0 0; padding-right: 18px; font-size: 12px; line-height: 1.55; color: var(--e-ink); }
.nt-sum .ico { flex: none; width: 12px; height: 12px; margin-top: 3px; color: var(--r2); fill: currentColor; stroke-width: 1.2; }

@media (max-width: 1100px) {
  .isl-keys { display: none; }
  .isl-send { margin-left: auto; }
}
/* 手机：胶囊里只留字和两个标签；展开成顶栏下面整宽的一张面板（键盘从下面弹，面板在上方不被挡） */
@media (max-width: 760px) {
  .ask-wrap { height: 36px; }
  .isl { height: 36px; border-radius: 18px; }
  .isl-row { height: 36px; padding: 0 3px 0 0; gap: 2px; }
  .isl textarea { height: 36px; padding: 7px 4px 7px 14px; font-size: 13px; }
  .isl-ph { left: 14px; top: 7px; font-size: 13px; }
  .isl:not(.is-open) .isl-clip { display: none; }
  .isl-tabs { height: 30px; }
  .isl-tab { width: 30px; }
  .isl.is-open { position: fixed; top: 6px; left: 8px; right: 8px; border-radius: 22px; }
  .isl.is-open .isl-row { padding: 8px 8px 0 0; }
  .isl.is-open textarea { padding-left: 16px; }
  .isl.is-open .isl-ph { left: 16px; }
  .isl-foot { padding: 6px 8px 8px 10px; }
  .isl-pane { padding: 10px 10px 12px; }
  .rc-sug > span { display: none; }
  .isl-file span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .isl, .isl-thumb, .isl-tab, .isl-tab > .ico, .isl-aiop, .isl-aiop .ico, .isl-sw::after, .isl-send, .isl::before, .isl::after, .isl-glow { transition: none; }
  .isl::before, .isl-glow i, .isl-thumb::after, .isl-tab .ai-s, .isl.t-ask, .isl.is-open.t-ask, .isl.is-busy::before, .nt.is-ai-run::before, .isl-tab.is-busy .isl-st, .isl-tab.is-ping, .rc-ai.is-run .ico, .nt-ai.is-run .ico, .isl-rc.is-new, .nt.is-ai-done::after { animation: none; }
  .rc-ai.is-run span, .nt-ai.is-run span { color: var(--e-ink); background: none; animation: none; }
  .isl-drop { animation: none !important; }
}