/* ═══════════════════════════════════════════════════════════════
   StarSea · 手机端落地主样式（改版皮肤）
   2026-06-21 第一刀：底部导航换新 —— 5 平铺线性图标
     首页 / 聊天 / 记忆 / 柏源(山望星) / 生活，去掉旧 emoji 和中间凸起
   ── 隔离铁律 ──
   整个文件包在 @media(max-width:768px) 里，电脑端（≥769px）永远读不到一行。
   只 ADD 覆盖，不动 style.css 共用基础样式（.bnav-item 的 color/active 沿用旧值）。
   配套 js/mobile-starsea.js（接管 active 高亮，不碰 swPage 本体）。
   ═══════════════════════════════════════════════════════════════ */
/* Tangerine 花体（输入框 Message… 等装饰花体；§4.2）。声明在 @media 外，
   但只被下面手机 @media 块引用 —— 电脑端永不使用 → 字体不会被拉取，零影响。 */
@font-face{font-family:'Tangerine';src:url('/static/fonts/Tangerine-Bold.woff2') format('woff2');font-weight:700;font-display:swap}

@media(max-width:768px){
  /* 线性图标：描边随 currentColor，未选 var(--text-m)、选中 var(--accent)（沿用旧 .bnav-item 规则） */
  #bottom-nav .bnav-item{padding:.2rem .55rem;gap:.18rem}
  #bottom-nav .bnav-ico{width:22px;height:22px;display:block}
  #bottom-nav .bnav-label{font-size:.56rem;letter-spacing:.02em}
}

@media(max-width:700px){
  #s-api .api-advanced-note{margin-left:0}
  #s-api .api-override-add{align-items:stretch}
  #s-api .api-override-add .btn{white-space:nowrap}
  #s-api .api-cap-grid{margin-left:0;grid-template-columns:1fr}
  #s-api .api-cap-grid label{justify-content:space-between}
  #s-api .api-cap-grid select{flex:0 0 62%}
  #s-api .api-model-override-body .s-form-row{align-items:flex-start;flex-wrap:wrap}
  #s-api .api-model-override-body .s-form-row>label{width:100%;min-width:0}
  #s-api .api-model-override-body .s-form-row>input,
  #s-api .api-model-override-body .s-form-row>select,
  #s-api .api-model-override-body .s-form-row>textarea{flex-basis:100%;width:100%}
}

/* ═══ 聊天页 · 第①刀：气泡的魂（§4.4 若隐若现 · 三主题） ═══
   把 柏源(我)/淮淮(你) 的气泡从「白底/实色无模糊」换成「透色玻璃 + 大模糊 + 无边框
   + 玻璃边沿高光(inset) + 柔投影」。深色主题不写死白底——玻璃色/高光/投影
   都跟 [data-theme] 走（star/amber 用清透配方：色往浅拉 + 低 alpha）。
   值同 chat_final.html 定稿。不碰输入栏/DOM/JS/键盘逻辑。 */
@media(max-width:768px){
  /* 高光 + 柔投影按主题（user/ai 共用，挂在气泡上） */
  html[data-theme="mist"]  .chat-bubble{--bins:rgba(255,255,255,.40);--bsh:0 3px 14px rgba(46,62,109,.07)}
  html[data-theme="star"]  .chat-bubble{--bins:rgba(212,225,250,.22);--bsh:0 4px 18px rgba(0,0,0,.30)}
  html[data-theme="amber"] .chat-bubble{--bins:rgba(250,238,216,.16);--bsh:0 4px 18px rgba(0,0,0,.32)}
  html[data-theme="porcelain"] .chat-bubble{--bins:rgba(255,255,255,.36);--bsh:0 3px 14px rgba(14,28,68,.08)}
  html[data-theme="sakura"] .chat-bubble{--bins:rgba(244,114,182,.16);--bsh:0 4px 18px rgba(0,0,0,.40)}
  html[data-theme="garden"] .chat-bubble{--bins:rgba(255,255,255,.36);--bsh:0 3px 14px rgba(30,48,22,.08)}
  /* 柏源(我)的气泡 玻璃色（浅、若隐若现；star/amber 再透一档补清透感）
     2026-06-21 淮淮再要清透：透明度再提约 10%（alpha 往下压一档） */
  html[data-theme="mist"]  .chat-msg.assistant .chat-bubble{--bub:rgba(255,255,255,.36)}
  html[data-theme="star"]  .chat-msg.assistant .chat-bubble{--bub:rgba(210,224,248,.11)}
  html[data-theme="amber"] .chat-msg.assistant .chat-bubble{--bub:rgba(248,239,222,.10)}
  html[data-theme="porcelain"] .chat-msg.assistant .chat-bubble{--bub:rgba(255,255,255,.34)}
  html[data-theme="sakura"] .chat-msg.assistant .chat-bubble{--bub:rgba(244,114,182,.10)}
  html[data-theme="garden"] .chat-msg.assistant .chat-bubble{--bub:rgba(255,255,255,.32)}
  /* 淮淮(你)的气泡 玻璃色（清透，比我的还透） */
  html[data-theme="mist"]  .chat-msg.user .chat-bubble{--bub:rgba(130,145,210,.26)}
  html[data-theme="star"]  .chat-msg.user .chat-bubble{--bub:rgba(150,180,236,.20)}
  html[data-theme="amber"] .chat-msg.user .chat-bubble{--bub:rgba(216,182,136,.20)}
  html[data-theme="porcelain"] .chat-msg.user .chat-bubble{--bub:rgba(30,61,143,.22)}
  html[data-theme="sakura"] .chat-msg.user .chat-bubble{--bub:rgba(244,114,182,.20)}
  html[data-theme="garden"] .chat-msg.user .chat-bubble{--bub:rgba(73,118,51,.20)}
  /* 玻璃本体：透色 + 大模糊 + 无边框 + 高光内阴影 + 柔投影 + 瘦身到定稿 */
  .chat-msg.assistant .chat-bubble, .chat-msg.user .chat-bubble{
    background:var(--bub);
    backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
    border:none;border-radius:12px;
    padding:8px 12px;font-size:13.5px;line-height:1.5;font-family:'JH',serif;
    box-shadow:0 1px 1px var(--bins) inset, var(--bsh);
  }
  .chat-msg.assistant .chat-bubble{color:var(--text3);border-bottom-left-radius:6px}
  .chat-msg.user .chat-bubble{color:#fff;border-bottom-right-radius:6px}
  /* 淮淮(你)的气泡：浅色 mist 下白字费眼 → 改深色字（紫调，跟我的气泡同款）；深色 star/amber 保持白字 */
  html[data-theme="mist"] .chat-msg.user .chat-bubble{color:var(--text3)}
  html[data-theme="porcelain"] .chat-msg.user .chat-bubble{color:var(--text3)}
  html[data-theme="garden"] .chat-msg.user .chat-bubble{color:var(--text3)}
}

/* ═══ 聊天页 · New messages 分隔（§4.7 / §7.5 待做④） ═══
   你和我隔了 ~1 小时没互发消息时，由 mobile-starsea.js 在两条消息间注入
   <div class="ss-newdiv"><span>New messages</span></div>。
   样式照原型 chat_final.html .newdiv：两侧 transparent→accent2→transparent 渐隐细线，
   中间 Tangerine 花体。色随 [data-theme] 走（--accent2 三主题已定义）。安静不跳脱。 */
@media(max-width:768px){
  /* C 案（淮淮 2026-06-24 选定）：舒展花体 + 文字两侧各一颗极小描边「山望星」小星，呼应星海 */
  .ss-newdiv{display:flex;align-items:center;gap:11px;margin:8px 8px 5px;align-self:stretch}
  .ss-newdiv::before,.ss-newdiv::after{content:"";flex:1;height:1px;
    background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent2) 42%,transparent),transparent)}
  .ss-newdiv span{font-family:'Tangerine',cursive;font-weight:700;font-size:19px;letter-spacing:.1em;
    color:var(--accent2);white-space:nowrap;opacity:.92;display:inline-flex;align-items:center;gap:9px}
  .ss-newdiv .st{width:7px;height:7px;opacity:.6;flex-shrink:0}
  /* 日期分隔 June 20（§4.7）：居中、Tangerine 花体，比 New messages 更淡更安静（每天都出现=背景信息） */
  .ss-daydiv{display:block;text-align:center;font-family:'Tangerine',cursive;font-weight:700;font-size:16px;
    color:var(--text2);opacity:.7;letter-spacing:.02em;margin:10px 0 4px}
}

/* ═══ 聊天页 · 下一刀：输入栏（§4.7 / §7.5 待做①） ═══
   📎😊🎤↑ emoji → 全线性图标 + Tangerine 的 Message… 占位符。
   ── 隔离铁律 ──
   · 图标：不改 DOM 里的 emoji（电脑端共用）。手机端把 emoji 字形 font-size:0 藏掉，
     用 ::before 的 SVG mask 盖上线性图标，颜色 background-color:currentColor → 自动跟主题/hover/录音红走。
   · 占位符英文「Message…」由 mobile-starsea.js 在手机宽度下运行时改属性，电脑端属性原样（不动 DOM）。
   · 🔴 键盘/safe-area/inset 距离逻辑（style.css:568-593）一行不碰，只动外观。
   图标 path 抄 chat_final.html。 */
@media(max-width:768px){
  /* 共用：藏 emoji 字形 + ::before 线性图标骨架 */
  .chat-img-btn, #sticker-btn, #mic-btn, .chat-send-btn{font-size:0 !important}
  .chat-img-btn::before, #sticker-btn::before, #mic-btn::before, .chat-send-btn::before{
    content:"";display:block;background-color:currentColor;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:contain;mask-size:contain;
  }
  /* 📎 附件（回形针） */
  .chat-img-btn::before{width:21px;height:21px;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5 12.5 20a4.6 4.6 0 0 1-6.5-6.5l8.6-8.6a3 3 0 0 1 4.3 4.3l-8.5 8.5a1.5 1.5 0 0 1-2.2-2.1l7.9-7.9'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5 12.5 20a4.6 4.6 0 0 1-6.5-6.5l8.6-8.6a3 3 0 0 1 4.3 4.3l-8.5 8.5a1.5 1.5 0 0 1-2.2-2.1l7.9-7.9'/%3E%3C/svg%3E")}
  /* 😊 表情（笑脸） */
  #sticker-btn::before{width:22px;height:22px;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8.5 14.5a4.5 4.5 0 0 0 7 0'/%3E%3Ccircle cx='9' cy='10' r='.6' fill='%23000'/%3E%3Ccircle cx='15' cy='10' r='.6' fill='%23000'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8.5 14.5a4.5 4.5 0 0 0 7 0'/%3E%3Ccircle cx='9' cy='10' r='.6' fill='%23000'/%3E%3Ccircle cx='15' cy='10' r='.6' fill='%23000'/%3E%3C/svg%3E")}
  /* 🎤 语音（麦克风） */
  #mic-btn::before{width:22px;height:22px;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5.5 11a6.5 6.5 0 0 0 13 0M12 17.5V21'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5.5 11a6.5 6.5 0 0 0 13 0M12 17.5V21'/%3E%3C/svg%3E")}
  /* ↑ 发送（箭头）。.chat-send-btn 本身 color:#fff → currentColor 即白 */
  .chat-send-btn::before{width:20px;height:20px;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M12 5l7 7-7 7'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M12 5l7 7-7 7'/%3E%3C/svg%3E")}
  /* ■ 生成中 → 停止方块（chat.js 发送时加 .stopping，跟语音停止键同图形） */
  .chat-send-btn.stopping::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='6.5' width='11' height='11' rx='2.5'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='6.5' width='11' height='11' rx='2.5'/%3E%3C/svg%3E")}
  /* 语音播放键 ▶/◼（chat.js:370 文本字符，非真 emoji 但同样非线性）→ 线性化。
     media.js:57 用 .playing class 切换播放/停止两态，故 CSS 跟着 class 走，一行不碰 media.js。 */
  .voice-play-btn{font-size:0 !important;display:flex;align-items:center;justify-content:center}
  /* 播放键清透化：style.css:623 是实心 accent 圆，在清透玻璃气泡里太突兀、和文字气泡不统一。
     改半透 accent 底 + accent 线性图标，融进玻璃（淮淮：语音气泡和文字气泡样子要一样）。 */
  .chat-msg .voice-bubble .voice-play-btn{background:color-mix(in srgb,var(--accent) 20%,transparent) !important;color:var(--accent) !important}
  .chat-msg.user .voice-bubble .voice-play-btn{background:rgba(255,255,255,.20) !important;color:#fff !important}
  .voice-bubble .voice-play-btn.playing{background:color-mix(in srgb,#e74c3c 24%,transparent) !important;color:#e74c3c !important}
  /* 语音气泡尺寸向文字气泡看齐（淮淮：两种气泡圆角+尺寸要一样、整体一致）：
     style.css:622 给了 min-width:140px + 28px 播放键 + 22px 波形 → 又宽又厚。这里缩播放键/波形高度
     让气泡变矮、去掉过大 min-width 让宽度自适应内容；圆角继承 .chat-bubble 的 12+6 尖角、不另设，
     尺寸贴近后同样的圆角占比就一致了。 */
  .voice-bubble{min-width:0 !important;gap:.4rem !important}
  .voice-bubble .voice-play-btn{width:24px !important;height:24px !important}
  .voice-bubble .voice-bars{height:18px !important}
  .voice-play-btn::before{content:"";display:block;width:16px;height:16px;background-color:currentColor;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;
    -webkit-mask-size:contain;mask-size:contain;
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.5 5.5v13l10.5-6.5z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.5 5.5v13l10.5-6.5z'/%3E%3C/svg%3E")}
  /* 播放中 → 线性停止方块（跟 media.js 的 .playing 走） */
  .voice-play-btn.playing::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='6.5' width='11' height='11' rx='2.5'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='6.5' width='11' height='11' rx='2.5'/%3E%3C/svg%3E")}
  /* Message… 占位符：Tangerine 花体、放大（只占位符这处放大，输入文字仍 16px 防 iOS 缩放） */
  #chat-input::placeholder{font-family:'Tangerine',cursive;font-size:18px;letter-spacing:.02em;opacity:.8}
  #chat-input::-webkit-input-placeholder{font-family:'Tangerine',cursive;font-size:18px;letter-spacing:.02em;opacity:.8}
}

/* ═══ 输入栏四键：大小 + 位置统一（淮淮 2026-06-21：现在高低错落）═══
   病因：三种容器(📎.chat-img-btn 28 / 😊🎤.chat-extra-btn 34 / ↑.chat-send-btn 36)
   + 图标 mask 各 21/22/22/20，加 row 是 align-items:flex-end 贴底 → 高低不一。
   全统一：容器 36×36 居中、图标 22×22。row 仍 flex-end，容器同高 → 图标自然齐平。
   ↑ 保留圆底色(主按钮区分)，只统一尺寸。 */
@media(max-width:768px){
  .chat-img-btn, #sticker-btn, #mic-btn, .chat-send-btn{
    width:36px !important;height:36px !important;flex:0 0 auto;padding:0 !important;
    display:flex !important;align-items:center;justify-content:center}
  .chat-img-btn::before, #sticker-btn::before, #mic-btn::before, .chat-send-btn::before{
    width:22px !important;height:22px !important}
  /* 发送键视觉小一点但「不改占位」（淮淮：缩成 32 后贴底对齐→偏下、边距不一致）：
     容器仍 36（跟其它三键同占位/同贴底对齐点 → 不偏下、上下边距一致），只用
     transform:scale 围绕中心把渲染缩小一圈（圆底+箭头一起小）。 */
  .chat-send-btn{transform:scale(.9)}
}

/* ═══ 聊天页 · 微调：两人气泡字色再浅一点点（淮淮 2026-06-21）═══
   只动文字颜色，不碰气泡玻璃。mist 深字往浅提一档；star/amber 浅字稍降亮度、
   透出更多背景=更柔。选择器带 html[data-theme] → 盖过上面的 color 规则。 */
@media(max-width:768px){
  html[data-theme="mist"] .chat-msg.assistant .chat-bubble,
  html[data-theme="mist"] .chat-msg.user .chat-bubble{color:#3a4869}
  html[data-theme="star"] .chat-msg.assistant .chat-bubble{color:rgba(229,237,250,.74)}
  html[data-theme="star"] .chat-msg.user .chat-bubble{color:rgba(255,255,255,.74)}
  html[data-theme="amber"] .chat-msg.assistant .chat-bubble{color:rgba(240,230,216,.74)}
  html[data-theme="amber"] .chat-msg.user .chat-bubble{color:rgba(255,255,255,.74)}
  html[data-theme="porcelain"] .chat-msg.assistant .chat-bubble,
  html[data-theme="porcelain"] .chat-msg.user .chat-bubble{color:#0E1236}
  html[data-theme="sakura"] .chat-msg.assistant .chat-bubble{color:rgba(245,213,228,.82)}
  html[data-theme="sakura"] .chat-msg.user .chat-bubble{color:rgba(255,240,248,.85)}
  html[data-theme="garden"] .chat-msg.assistant .chat-bubble,
  html[data-theme="garden"] .chat-msg.user .chat-bubble{color:#162810}
}

/* ═══ 聊天页 · 下一刀：时间戳 + THINK 花体化（§4.7 / §7.5）═══
   纯 CSS、只手机端、不碰 chat.js。
   · 时间戳 .chat-msg-time：Tangerine 花体（time = "16:40" 纯数字，花体最配）
   · 思考标签 .thinking-label（Thinking · 4s，文案本就英文）：Tangerine 花体
   · 思考正文 .thinking-body：真实 style.css:669 已是 JH 斜体（§4.7 要求）→ 不动
   ⚠ 真实前端无「New messages」「日期分隔 June 20」DOM（原型新增特性，要造得改
      chat.js 渲染逻辑=红线）→ 本刀不造，留后续按需。 */
@media(max-width:768px){
  .chat-msg-time{font-family:'Tangerine',cursive;font-size:14px;letter-spacing:.03em}
  /* 整个 header 上 Tangerine：标签 Thinking + 时长「· 4s」都走花体（时长是带 inline style 的独立 span，单独提字号） */
  /* font-family 必须写在 .thinking-label 本身：style.css:668 的 .thinking-header .thinking-label{Georgia}
     specificity 更高，只挂 .thinking-header 会被它抢回 Georgia。 */
  .thinking-header{font-family:'Tangerine',cursive}
  .thinking-header .thinking-label{font-family:'Tangerine',cursive;font-style:normal;font-size:13px;letter-spacing:.02em}
  .thinking-header > span[style]{font-size:11px !important;letter-spacing:.02em}
  /* 思考链气泡瘦身：参照正文气泡（11.5px / padding 7×10 / radius 12）。
     之前用 style.css 基础胖 padding + label 14px（比正文还大）→ 显胖。收窄 padding、
     圆角对齐 12、正文小一号(10.5)。 */
  /* 思考卡 base：无实线边框 + 关 transition。这是「点击闪一下框」的根治——style.css:663 给了
     border:1px + transition:all .2s，点击切换 :has 时 border 渐显 = 闪框。border 全程 none + 不做过渡。 */
  .thinking-card{padding:5px 10px;border-radius:12px;border:none !important;transition:none !important}
  .thinking-body{font-size:11px;line-height:1.6}
  /* 展开态 → 毛玻璃（§4.4：半透 + blur + 无实线 + 柔投影）。thinking-card 不是 .chat-bubble 的
     后代、拿不到 --bub，故用全局 --glass（三主题已定义、安全）。 */
  .thinking-card:has(.thinking-body.open),
  .thinking-card:has(.thinking-body[style*="block"]){
    background:var(--glass) !important;
    backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);
    box-shadow:0 3px 12px -4px rgba(46,62,109,.10) !important}
  /* 折叠态 → 撤掉气泡：无背景/横向内距，只剩一行标签（淮淮：折叠后不要那么宽、不要气泡）。
     展开判定：thinking-card 给 body 加 .open；forum 卡用 inline display:block。两者皆无 = 折叠。 */
  .thinking-card:not(:has(.thinking-body.open)):not(:has(.thinking-body[style*="block"])){
    background:transparent !important;box-shadow:none !important;
    padding:2px 0 !important;border-radius:0 !important}
  /* 时间戳嵌进气泡后（由 mobile-starsea.js 搬入）：行内、跟正文尾、安静（§4.7）。
     盖掉基础 .chat-msg-time 的 margin-top / .user 的 text-align:right。 */
  .chat-bubble .chat-msg-time{display:inline;margin:0 0 0 9px;vertical-align:baseline;
    white-space:nowrap;opacity:.68;line-height:1}
  .chat-msg.user .chat-bubble .chat-msg-time{text-align:left;opacity:.75}
  /* 语音气泡是 flex（播放键+波形+时长横排）：时间作为末尾项、跟时长后、垂直居中 */
  .voice-bubble .chat-msg-time{align-self:center;margin-left:8px}
}

/* ═══ 聊天页 · 顶栏第①块：← 返回 + 圆头像 + 柏源 + 签名（§4.7 / chat_topbar_v2.png）═══
   配套 mobile-starsea.js 的 topbar() 注入头像/名字/签名。对话标题(#chat-title)/状态行
   (#baiyuan-status)在手机端隐藏，名字固定「柏源」、第二行为签名；对话名移到侧栏。
   ← 复用 #chat-menu-btn（onclick 开侧栏不变；core.js:187 控其 display，这里只换字形为箭头）。
   🔴 padding-top 的 safe-area（状态栏高度）一行不碰，只调外观。 */
@media(max-width:768px){
  .chat-topbar{
    gap:.55rem;
    overflow-x:visible !important;          /* 旧 auto 是给多 tab 横滚的，新顶栏不需要 */
    border-bottom:none !important;           /* §4.4 玻璃无硬线 */
    position:relative;
    backdrop-filter:blur(30px) saturate(1.3);-webkit-backdrop-filter:blur(30px) saturate(1.3);
    box-shadow:none !important;              /* 去掉一切硬线/影线——影线本身就成了「明显边界」（淮淮） */
    padding-bottom:.5rem;
  }
  /* 顶栏底缘羽化：玻璃色向下渐隐 12px，把边界化成柔光过渡而不是一条线（§4.4 模糊柔光边缘） */
  .chat-topbar::after{content:"";position:absolute;left:0;right:0;top:100%;height:8px;z-index:9;
    pointer-events:none;opacity:.45;background:linear-gradient(var(--glass),transparent)/* 范围小、边缘~85%透明，更自然（淮淮） */}
  /* ☰ → ← 返回箭头（功能不变：开侧栏） */
  #chat-menu-btn{font-size:0 !important;flex:0 0 auto;border:none !important;background:none !important;
    padding:.2rem .25rem !important;min-width:auto !important}
  #chat-menu-btn::before{content:"";display:block;width:23px;height:23px;background-color:var(--text3);
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}
  /* 注入的圆头像（40，§4.7；占位渐变，结构留好 <img>，有真实形象时换图即覆盖） */
  .ss-tb-avatar{flex:0 0 auto;width:40px;height:40px;border-radius:50%;overflow:hidden;
    margin-left:.35rem; /* 离返回键远一点，头像+名字整体右移（淮淮） */
    background:linear-gradient(135deg,#9b8fd6,#7da0e0)}
  .ss-tb-avatar img{width:100%;height:100%;object-fit:cover;display:block}
  /* 柏源 + 签名（取代动态对话标题/状态行；对话名移到侧栏） */
  #chat-title{display:none !important}
  #baiyuan-status{display:none !important}
  .chat-topbar-title-wrap{flex:1 1 auto;min-width:0;gap:1px !important;margin-left:.3rem/* 名字离头像开一点（淮淮） */}
  .ss-tb-name{font-family:'JH',serif;font-size:15px;font-weight:600;color:var(--text3);line-height:1.15;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ss-tb-sign{font-size:9px;color:var(--text-m);opacity:.72;line-height:1.2;letter-spacing:.02em;margin-top:4px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ═══ 聊天页 · 顶栏第②块：右上 ⋯ 菜单（§4.7 / chat_topbar_v2.png）═══
   把右侧预设下拉 #chat-preset-sel + 快捷设置 #qs-toggle 收进一个 ⋯ 玻璃下拉。
   菜单由 mobile-starsea.js 一次性注入；项点击直接调已有全局函数（onPresetChange/
   toggleQuickSettings/renameConv/exportConvHtml/newConv/openSettings/delConv）。
   🔴 不搬现有 DOM、不在点击中 appendChild → 避 §453 iOS 吃 focus。 */
@media(max-width:768px){
  #chat-preset-sel, #qs-toggle{display:none !important}
  .ss-tb-more{flex:0 0 auto;margin-left:auto;background:none;border:none;padding:.2rem .25rem;
    color:var(--text3);cursor:pointer;display:flex;align-items:center;justify-content:center}
  .ss-tb-more svg{width:22px;height:22px;display:block}
  .ss-menu{position:absolute;top:calc(100% - 2px);right:6px;z-index:200;min-width:128px;max-width:calc(100vw - 16px);
    background:var(--bg1);backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);
    border:1px solid var(--card-b);border-radius:14px;padding:5px;display:none;flex-direction:column;gap:1px;
    box-shadow:0 12px 34px rgba(0,0,0,.20)}
  .ss-menu.open{display:flex}
  /* 背景比聊天底色「立」一档，免和后面聊天融为一体（淮淮）*/
  html[data-theme="mist"] .ss-menu{background:rgba(250,247,252,.97)}
  html[data-theme="star"] .ss-menu{background:rgba(28,40,74,.97)}
  html[data-theme="amber"] .ss-menu{background:rgba(46,37,27,.97)}
  html[data-theme="porcelain"] .ss-menu{background:rgba(248,240,232,.97)}
  html[data-theme="sakura"] .ss-menu{background:rgba(14,14,14,.97)}
  html[data-theme="garden"] .ss-menu{background:rgba(226,238,212,.97)}
  .ss-menu-item{display:flex;align-items:center;width:100%;text-align:left;background:none;border:none;
    padding:.5rem .6rem;border-radius:9px;font-family:'JH',serif;font-size:12px;color:var(--text3);cursor:pointer}
  .ss-menu-item:active{background:var(--card)}
  .ss-menu-item.danger{color:#e07a7a}
  .ss-menu-sep{height:1px;background:var(--divider);margin:3px 5px;opacity:.6}
  /* 预设：自定义下拉（不用原生 select，免 iOS 官方滚轮；点「预设」行就地展开列表）*/
  .ss-preset-row{display:flex;align-items:center;gap:.4rem;padding:.5rem .6rem;border-radius:9px;
    font-family:'JH',serif;font-size:12px;color:var(--text3);cursor:pointer}
  .ss-preset-row:active{background:var(--card)}
  .ss-preset-lb{flex:0 0 auto;opacity:.72}
  .ss-preset-cur{flex:1 1 auto;min-width:0;text-align:right;font-size:11px;color:var(--accent);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ss-preset-chev{width:14px;height:14px;flex:0 0 auto;opacity:.6;transition:transform .2s}
  .ss-menu.preset-open .ss-preset-chev{transform:rotate(90deg)}
  .ss-preset-list{display:none;flex-direction:column;gap:1px;max-height:46vh;overflow-y:auto;
    margin:1px 2px 2px;padding-top:2px;border-top:1px solid var(--divider);
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
  .ss-preset-list.show{display:flex}
  .ss-preset-opt{text-align:left;background:none;border:none;padding:.42rem .6rem;border-radius:8px;
    font-family:'JH',serif;font-size:11.5px;color:var(--text3);cursor:pointer;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ss-preset-opt:active{background:var(--card)}
  .ss-preset-opt.on{color:var(--accent)}
  .ss-preset-opt.on::after{content:"✓";margin-left:.4rem;font-size:10px}
}

/* ═══ 聊天页 · 全屏沉浸：去底部主导航 + 顶底安全区同色填充（淮淮 2026-06-21）═══
   §4.7 聊天页「全屏沉浸·无底部主导航」（主页入口改到侧栏底「返回主页」，见 .js sidebarFoot）。
   · 聊天页(chat-active)隐藏 #bottom-nav；它原占 #page-chat 底部 62px 留白一并收掉——
     只动「聊天页·非键盘态」的 padding-bottom（键盘态由 style.css:571 管=0，不碰；键盘检测
     靠 --kb-inset（v2），与此 padding 无关）。🔴 不碰键盘 safe-area 逻辑本身。
   · 底部同色填充：输入栏背景(var(--bg1))靠 padding-bottom 含 safe-area 铺到屏幕最底
     （home indicator 区同色，不露渐变）。顶部状态栏区已由顶栏玻璃(padding-top 含 44px)盖住。 */
@media(max-width:768px){
  :root.chat-active{--chat-bottom-fill:var(--bg1);--chat-sidebar-bottom-fill:var(--bg1)}
  :root.chat-active #bottom-nav{display:none !important}
  :root.chat-active:not(.keyboard-open) #page-chat{padding-bottom:0 !important}
  /* 底栏玻璃化（§4.4）：真实 style.css:589 手机版把它写成 var(--bg1) 不透明实色块 + border-top 实线、
     无 backdrop-filter → 边缘是硬切实线、非毛玻璃。这里覆盖成半透玻璃 + blur + 柔光散影边缘
     （淮淮：底栏也要毛玻璃柔边）。🔴 只动外观（背景/模糊/边缘），padding/safe-area/inset 距离逻辑一行不碰。 */
  .chat-input-area{padding-bottom:max(.4rem, env(safe-area-inset-bottom,0px)) !important;
    background:var(--chat-bottom-fill) !important;
    backdrop-filter:blur(30px) saturate(1.3) !important;-webkit-backdrop-filter:blur(30px) saturate(1.3) !important;
    border-top:none !important;
    box-shadow:none !important}
  /* 底栏顶缘羽化：玻璃色向上渐隐 12px，柔光过渡取代硬边（.chat-input-area 已 position:relative，style.css:589） */
  .chat-input-area::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:8px;z-index:9;
    pointer-events:none;opacity:.45;background:linear-gradient(transparent,var(--glass))/* 范围小、边缘~85%透明，更自然（淮淮） */}
}

/* ═══ 聊天页 · 下一刀：头像（§4.7 / §7.5）═══
   缩到 26 + 统一紫蓝渐变底（占位，最终换真实 <img>，换图即覆盖渐变）+ 每组首条才显示、
   连续同人隐藏占位保持对齐。纯 CSS（消息是 #chat-messages 直接兄弟，相邻兄弟选择器即可）。
   不碰 chat.js / avatarHtml。 */
@media(max-width:768px){
  .chat-avatar{width:30px;height:30px;border:none;
    background:linear-gradient(135deg,#9b8fd6,#7da0e0); /* 紫蓝渐变占位；有 <img> 时被图覆盖 */
    color:#fff;font-size:.7rem;font-family:'JH',serif}
  .chat-avatar img{border-radius:50%}
  /* 头像分组（每组第一条「带气泡」的消息才显示）由 mobile-starsea.js 的 groupAvatars 处理——
     相邻兄弟 CSS 会把「思考卡那条」误当首条，故改用 JS 精确判断。 */
}

/* ═══ 聊天页 · 第3块：会话侧栏顶部柏源头像区（§4.7 / sidebar_final.html / chat_sidebar_v2.png）═══
   mobile-starsea.js 的 sidebarHead() 在 #chat-sidebar 最顶注入「圆头像 + 柏源 + 签名」，
   并把原 .chat-sb-close（✕）搬到这一行右侧。头像 .ss-sb-avatar 占位渐变、applySsAvatar 接真实脸。
   侧栏容器已有 padding-top:max(44px,safe)（style.css:601）→ 头像区在状态栏下。对话列表每行无头像（本就如此）。
   只手机端、纯新增类，电脑端读不到（@media + JS matchMedia 双隔离）。 */
@media(max-width:768px){
  .ss-sb-head{display:flex;align-items:center;gap:12px;padding:6px 18px 14px}
  .ss-sb-avatar{position:relative;flex:0 0 auto;width:46px;height:46px;border-radius:50%;overflow:hidden;
    background:linear-gradient(135deg,#9b8fd6,#7da0e0);box-shadow:0 1px 1px rgba(255,255,255,.4) inset}
  .ss-sb-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
  .ss-sb-tx{flex:1 1 auto;min-width:0}
  .ss-sb-nm{font-family:'JH',serif;font-size:18px;color:var(--text3);line-height:1.1;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ss-sb-sig{font-size:9px;color:var(--text-m);opacity:.75;margin-top:3px;letter-spacing:.03em;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* ✕ 搬进头像行右：去按钮外观，纯图标（功能=关侧栏，沿用原 onclick）。
     style.css:580 已 display:block(!important) 让它在手机端显示。 */
  .ss-sb-head .chat-sb-close{flex:0 0 auto;margin-left:auto;background:none !important;border:none !important;
    padding:.2rem .3rem !important;font-size:.95rem !important;color:var(--text-m);min-width:auto !important}

  /* —— 操作行（chat_sidebar_v2.png）：「✦ 新对话」深色大药丸 + 搜索玻璃框；⤓ 导出收进 ⋯ 菜单 —— */
  .chat-sb-head{border-bottom:none !important;padding:.2rem 16px 12px !important;gap:10px;align-items:stretch}
  .chat-sb-head .btn-p{flex:1 1 auto;border:none !important;border-radius:13px !important;
    padding:11px 14px !important;font-size:12.5px !important;font-family:'JH',serif;font-weight:600;
    background:var(--accent) !important;color:#fff !important;text-align:center !important;
    box-shadow:0 1px 1px rgba(255,255,255,.3) inset,0 3px 12px rgba(46,62,109,.10)}
  .chat-sb-head button[onclick*="toggleChatSearch"]{flex:0 0 38%;border:none !important;
    border-radius:13px !important;padding:0 !important;font-size:0 !important;min-width:auto !important;
    background:var(--glass) !important;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
    box-shadow:0 1px 1px rgba(255,255,255,.35) inset;display:flex;align-items:center;justify-content:center}
  .chat-sb-head button[onclick*="toggleChatSearch"]::before{content:"";display:block;width:17px;height:17px;
    background-color:var(--text-m);
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M20 20l-3.6-3.6'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M20 20l-3.6-3.6'/%3E%3C/svg%3E") center/contain no-repeat}
  .chat-sb-head button[onclick*="exportModule"]{display:none !important}

  /* —— 对话列表：玻璃卡 + ✦四角星前缀 + 选中白玻璃高亮（💬/🎬 前缀由 js dressConvList 去掉）—— */
  .chat-sb-list{padding:0 11px}
  .chat-conv{padding:11px 13px !important;border-radius:15px !important;border:none !important;margin-bottom:2px}
  .chat-conv-title{font-family:'JH',serif !important;font-size:13.5px !important;font-weight:600;color:var(--text3) !important}
  .chat-conv-title::before{content:"";display:inline-block;width:13px;height:13px;vertical-align:-2px;margin-right:7px;
    background-color:var(--accent);
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M12 3 L13.6 10.4 21 12 13.6 13.6 12 21 10.4 13.6 3 12 10.4 10.4 Z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M12 3 L13.6 10.4 21 12 13.6 13.6 12 21 10.4 13.6 3 12 10.4 10.4 Z'/%3E%3C/svg%3E") center/contain no-repeat}
  .chat-conv-preview{font-size:11px !important;color:var(--text-m) !important;margin-top:3px !important;margin-left:20px}
  .chat-conv.active{background:var(--glass) !important;
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 12px rgba(46,62,109,.06)}
  html[data-theme="star"] .chat-conv.active,
  html[data-theme="amber"] .chat-conv.active,
  html[data-theme="sakura"] .chat-conv.active{box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30)}

  /* —— 底部「返回主页」玻璃药丸 —— */
  #chat-sidebar > div:last-child{border-top:none !important;background:var(--chat-sidebar-bottom-fill) !important;padding-bottom:max(.5rem, env(safe-area-inset-bottom,0px)) !important}
  #chat-sidebar > div:last-child > button{border:none !important;border-radius:15px !important;
    padding:13px !important;font-family:'JH',serif;font-weight:600;font-size:13px !important;color:var(--text3) !important;
    background:var(--glass) !important;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 12px rgba(46,62,109,.06)}
}

/* ═══ 聊天页 · 第4块：Thinking 折叠箭头 ▸ → 空心四角星（§4.7 / thinking_star_v1.png）═══
   chat.js 把折叠图标渲染成 .thinking-toggle 里的「▸」字符（展开切「▾」或加 .open 转 90°）。
   纯 CSS 换字形：藏掉字符、::before 用空心四角星 SVG mask（fill:none + stroke → 只描边=空心）。
   四角星对称，.open 的 rotate(90°) 视觉无跳变；不碰 toggleThinkingCard / textContent 切换逻辑。
   选择器用 .thinking-header .thinking-toggle 对齐 style.css:666 的 specificity（后加载即胜）。 */
@media(max-width:768px){
  .thinking-header .thinking-toggle{font-size:0 !important;width:13px;height:13px;line-height:0;
    display:inline-flex;align-items:center;justify-content:center}
  .thinking-header .thinking-toggle::before{content:"";display:block;width:13px;height:13px;
    background-color:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 3 L13.6 10.4 21 12 13.6 13.6 12 21 10.4 13.6 3 12 10.4 10.4 Z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 3 L13.6 10.4 21 12 13.6 13.6 12 21 10.4 13.6 3 12 10.4 10.4 Z'/%3E%3C/svg%3E") center/contain no-repeat}
}

/* ═══ 设置整页 · 刀1（§4.9 iOS 分组列表 · settings_page.html 落地）═══
   手机端进设置：藏桌面横 tab 条；home 态显分组列表、藏 tab 内容；
   点行 → 加 .ss-detail 切到对应 tab 内容（复用现有表单）+ 顶部「返回」回 home。
   全 @media 隔离，电脑端读不到一行。 */
@media(max-width:768px){
  #settings-modal.show .settings-tabs{display:none}
  /* 顶部标题：去 emoji（JS 改文案）+ 京华老宋 */
  #settings-modal .settings-head h2{font-family:'JH',serif !important;font-size:17px;color:var(--text3);
    font-weight:600;letter-spacing:.04em}
  /* home 态：body 仍是滚动容器（不隐藏），只藏里面的 tab 内容 + 返回条，显分组列表 */
  #settings-modal:not(.ss-detail) .settings-body > .s-tab-content{display:none !important}
  #settings-modal:not(.ss-detail) .ss-set-back{display:none}
  /* detail 态：藏分组列表，显返回条 + swSettingsTab 选中的 tab 内容 */
  #settings-modal.ss-detail .ss-set{display:none}
  /* 刀2/3：sec 行进某 tab 时只露目标 section。被过滤 tab 加 .ss-filter、目标 section 加 .ss-show；
     其余 :not(.ss-show) 隐藏。tab 行不加 .ss-filter=整页全显。两 class 只手机 JS 加 + @media 隔离
     → 电脑端读不到、section 照常全显，不污染桌面 */
  #settings-modal.ss-detail .s-tab-content.ss-filter > .s-section:not(.ss-show){display:none !important}
  .ss-set-back .ss-bk-t{font-family:'JH',serif;font-size:15px}
  .ss-set{padding:4px 14px 30px}
  .ss-set-ghd{font-size:10px;color:var(--text-m);letter-spacing:.12em;margin:16px 6px 7px;
    text-transform:uppercase;font-family:'Noto Sans SC',sans-serif}
  .ss-set-group{background:var(--glass);backdrop-filter:blur(22px) saturate(1.4);
    -webkit-backdrop-filter:blur(22px) saturate(1.4);border-radius:16px;overflow:hidden;
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06)}
  html[data-theme="star"] .ss-set-group,
  html[data-theme="amber"] .ss-set-group,
  html[data-theme="sakura"] .ss-set-group{box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30)}
  .ss-set-row{display:flex;align-items:center;gap:11px;padding:12px 14px;position:relative;cursor:pointer}
  .ss-set-row:not(:last-child)::after{content:'';position:absolute;left:43px;right:0;bottom:0;height:1px;
    background:color-mix(in srgb,var(--text-m) 22%,transparent)}
  .ss-set-row .ic{width:18px;height:18px;color:var(--accent);flex:0 0 18px}
  .ss-set-row .ic svg{width:18px;height:18px;display:block}
  .ss-set-row .rn{flex:1;font-family:'JH',serif;font-size:13px;color:var(--text3);white-space:nowrap}
  .ss-set-row .rv{font-size:10px;color:var(--text-m);white-space:nowrap;margin-left:auto}
  .ss-set-row .chev{width:15px;height:15px;color:var(--text-m);opacity:.55;flex:0 0 15px;margin-left:4px}
  .ss-set-row.danger .rn,.ss-set-row.danger .ic{color:#c0566e}
  html[data-theme="star"] .ss-set-row.danger .rn,html[data-theme="star"] .ss-set-row.danger .ic,
  html[data-theme="amber"] .ss-set-row.danger .rn,html[data-theme="amber"] .ss-set-row.danger .ic,
  html[data-theme="sakura"] .ss-set-row.danger .rn,html[data-theme="sakura"] .ss-set-row.danger .ic{color:#e58a98}
  /* 详情顶部返回条 */
  .ss-set-back{display:flex;align-items:center;gap:7px;padding:8px 6px 12px;cursor:pointer;
    color:var(--accent);font-family:'JH',serif;font-size:14px}
  .ss-set-back svg{width:20px;height:20px;display:block}
}

/* ═══ 柏源页容器 · 子标签栏（§4.1 / §7 落地策略第4点）═══
   底部「柏源」进 = 柏源模式，注入这条栏在 .top-header 之下、内容之上。
   念头/梦/日记 借房间 inner-tab，锚点借 page-id，星图借 page-starmap；生长本刀占位置灰。
   全 mobile-gated；桌面 JS 不注入、且此基底规则恒隐藏，双保险。*/
.ss-by-bar{display:none}
@media(max-width:768px){
  html.baiyuan-mode .ss-by-bar{
    display:flex;gap:3px;padding:7px 9px 5px;justify-content:space-between;
    position:sticky;top:0;z-index:98;   /* 吸顶：body 滚动时钉在视口顶（top-header 柏源模式已隐，玻璃背景铺住刘海）*/
    background:var(--glass);backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3);
    box-shadow:0 1px 0 rgba(255,255,255,.12);
  }
  .ss-by-tab{
    display:flex;flex-direction:column;align-items:center;gap:3px;flex:1;
    padding:6px 0;border-radius:11px;cursor:pointer;transition:.2s;
    color:var(--text-m);font-size:10px;font-family:'Noto Sans SC',sans-serif;letter-spacing:.02em;
    -webkit-tap-highlight-color:transparent;
  }
  .ss-by-tab svg{width:17px;height:17px;display:block}
  .ss-by-tab.on{
    color:var(--accent2);
    background:color-mix(in srgb, var(--accent) 13%, transparent);
    box-shadow:0 1px 1px rgba(255,255,255,.28) inset;
  }
  .ss-by-tab.ss-by-dim{opacity:.4;cursor:default}
  /* 柏源模式下盖掉房间自带的「此刻的房间」「给他贴纸条」「房间 inner-tab 栏」
     （这些归生活/首页/他处，柏源页只露子标签对应的那个面板）。:has iOS15.4+ 支持，不支持降级=照旧显示、无害。*/
  html.baiyuan-mode #room-desc-area,
  html.baiyuan-mode #huai-note-box,
  html.baiyuan-mode #page-room .main-col>div:has(>[onclick="toggleHuaiNote()"]),
  html.baiyuan-mode #page-room .main-col>div:has(>.inner-tab){display:none!important}
  /* 柏源模式盖掉旧管理顶栏（同生活 hub），子标签栏自补刘海安全区 */
  html.baiyuan-mode .top-header{display:none!important}
  html.baiyuan-mode .ss-by-bar{padding-top:max(7px,calc(env(safe-area-inset-top,0px) + 6px))}
}

/* ═══ 生活九宫格子模块 = 干净单页（§4.1：九宫格是纯入口，点进去该是单独一页）═══
   点信件/异世旅社等 → 跳旧 #page-room / #page-life，用 lifesub-mode 盖掉旧 tab 栏 + 管理顶栏，
   注入「← 生活」返回栏，只露当前那一个面板。data-lsub: panel=日常记录4 / note=贴纸条 / life=娱乐6。
   全 mobile-gated + 基底恒隐 → 桌面读不到（Win 冻结）。*/
.ss-sub-top{display:none}
@media(max-width:768px){
  html.lifesub-mode .top-header{display:none!important}
  /* 娱乐 6：#page-life 顶部旧 life-tab 栏 */
  html.lifesub-mode[data-lsub="life"] #page-life .main-col>div:has(>.life-tab){display:none!important}
  /* 日常记录 4（面板型）：盖 desc / 便签 / inner-tab 栏，只留当前 .inner-panel */
  html.lifesub-mode[data-lsub="panel"] #room-desc-area,
  html.lifesub-mode[data-lsub="panel"] #huai-note-box,
  html.lifesub-mode[data-lsub="panel"] #page-room .main-col>div:has(>[onclick="toggleHuaiNote()"]),
  html.lifesub-mode[data-lsub="panel"] #page-room .main-col>div:has(>.inner-tab){display:none!important}
  /* 贴纸条（便签型）：盖 desc / inner-tab 栏 / 所有 .inner-panel，只留便签盒 */
  html.lifesub-mode[data-lsub="note"] #room-desc-area,
  html.lifesub-mode[data-lsub="note"] #page-room .main-col>div:has(>.inner-tab),
  html.lifesub-mode[data-lsub="note"] #page-room .inner-panel{display:none!important}
  /* 「← 生活」返回栏（注入在 .main-col 首、随内容滚，自补刘海安全区）*/
  html.lifesub-mode #page-room .ss-sub-top,
  html.lifesub-mode #page-life .ss-sub-top{display:flex}
  .ss-sub-top{
    align-items:center;gap:10px;
    padding:max(12px,calc(env(safe-area-inset-top,0px) + 8px)) 14px 10px;
  }
  .ss-sub-top .bk{flex:0 0 24px;width:24px;height:24px;color:var(--accent);cursor:pointer;-webkit-tap-highlight-color:transparent}
  .ss-sub-top .bk svg{width:24px;height:24px;display:block}
  .ss-sub-top .tt{font-family:'JH',serif;font-size:16px;color:var(--text3);letter-spacing:.05em}
}

/* ═══ 生活·九宫格入口 hub（§4.1）═══
   独立 .page#page-lifehub，由 lifeHub()→swPage('lifehub') 显示（swPage 本体不动）。
   恒隐 + 桌面双保险（Win 冻结）。卡片玻璃照 §4.4 + .ss-bg-card 同款配方；图标底=accent 低 alpha。*/
#page-lifehub{display:none}
@media(min-width:769px){#page-lifehub{display:none!important}}
@media(max-width:768px){
  #page-lifehub.active{display:block}
  /* 顶栏在本页藏掉(lifeHub 里)，故自补状态栏/刘海安全区；底部留白清开固定底栏 */
  .ss-lh{padding:max(16px,calc(env(safe-area-inset-top,0px) + 12px)) 14px 96px;max-width:680px;margin:0 auto}
  .ss-lh-hd{font-family:'Noto Sans SC',sans-serif;font-size:10px;color:var(--text-m);letter-spacing:.12em;
    text-transform:uppercase;margin:16px 4px 9px;display:flex;align-items:center;gap:7px}
  .ss-lh-hd:first-child{margin-top:6px}
  .ss-lh-hd .ln{flex:1;height:1px;background:color-mix(in srgb,var(--text-m) 20%,transparent)}
  .ss-lh-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .ss-lh-card{display:flex;align-items:center;gap:9px;padding:11px;border-radius:15px;cursor:pointer;
    -webkit-tap-highlight-color:transparent;background:var(--glass);
    backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06);transition:transform .12s}
  html[data-theme="star"] .ss-lh-card,html[data-theme="amber"] .ss-lh-card,html[data-theme="sakura"] .ss-lh-card{
    box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30)}
  .ss-lh-card:active{transform:scale(.97)}
  .ss-lh-ic{width:33px;height:33px;border-radius:10px;flex:0 0 33px;display:flex;align-items:center;justify-content:center;
    background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent)}
  .ss-lh-ic svg{width:18px;height:18px}
  .ss-lh-tx{min-width:0}
  .ss-lh-tx .n{font-family:'JH',serif;font-size:12.5px;color:var(--text3);line-height:1.1;white-space:nowrap}
  .ss-lh-tx .d{font-size:9px;color:var(--text-m);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ═══ 柏源·生长面板（§4.9 成长审批 + §4.1 他此刻的身体）═══
   独立 .page#page-bygrowth，由 swPage('bygrowth') 显示（swPage 本体不动）。
   恒隐 + 桌面显式 display:none 双保险（Win 冻结）。玻璃卡照 §4.4 + .ss-set-group 同款配方。*/
#page-bygrowth{display:none}
@media(min-width:769px){#page-bygrowth{display:none!important}}
@media(max-width:768px){
  #page-bygrowth.active{display:block}
  .ss-bg{padding:12px 14px 30px;max-width:680px;margin:0 auto}
  .ss-bg-intro,.ss-bg-note{font-family:'JH',serif;font-size:11px;color:var(--text-m);line-height:1.7;
    letter-spacing:.02em;margin:2px 4px 14px}
  .ss-bg-h{font-family:'Noto Sans SC',sans-serif;font-size:10px;color:var(--text-m);letter-spacing:.12em;
    text-transform:uppercase;margin:18px 6px 8px}
  .ss-bg-list{display:flex;flex-direction:column;gap:9px}
  .ss-bg-empty{font-family:'JH',serif;font-size:11px;color:var(--text-m);opacity:.8;padding:6px 4px;line-height:1.6}
  .ss-bg-card{background:var(--glass);backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
    border-radius:14px;padding:12px 14px;
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06)}
  html[data-theme="star"] .ss-bg-card,html[data-theme="amber"] .ss-bg-card,html[data-theme="sakura"] .ss-bg-card{
    box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30)}
  .ss-bg-tx{font-family:'JH',serif;font-size:13px;color:var(--text3);line-height:1.6}
  .ss-bg-tr{font-family:'JH',serif;font-size:11px;color:var(--text-m);opacity:.8;padding-left:8px;line-height:1.6;margin-top:3px}
  .ss-bg-meta{font-family:'Noto Sans SC',sans-serif;font-size:9.5px;color:var(--text-m);opacity:.65;margin-top:6px}
  .ss-bg-btns{display:flex;gap:8px;margin-top:11px}
  .ss-bg-ok,.ss-bg-no{flex:1;border:none;border-radius:10px;padding:8px 0;font-family:'JH',serif;font-size:11.5px;
    cursor:pointer;-webkit-tap-highlight-color:transparent;transition:.2s}
  .ss-bg-ok{background:var(--accent);color:#fff;box-shadow:0 2px 8px color-mix(in srgb,var(--accent) 40%,transparent)}
  .ss-bg-no{background:color-mix(in srgb,var(--text-m) 14%,transparent);color:var(--text-m)}
  .ss-bg-done{font-family:'JH',serif;font-size:11.5px;color:var(--text-m);opacity:.6;padding:7px 2px;line-height:1.5;
    border-bottom:1px dashed color-mix(in srgb,var(--text-m) 22%,transparent)}
  .ss-bg-dtag{font-family:'Noto Sans SC',sans-serif;font-size:9.5px;margin-top:2px}
  .ss-bg-bodycard{position:relative;background:var(--glass);backdrop-filter:blur(22px) saturate(1.4);
    -webkit-backdrop-filter:blur(22px) saturate(1.4);border-radius:14px;padding:13px 14px;
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06)}
  html[data-theme="star"] .ss-bg-bodycard,html[data-theme="amber"] .ss-bg-bodycard,html[data-theme="sakura"] .ss-bg-bodycard{
    box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30)}
  .ss-bg-refresh{position:absolute;top:11px;right:13px;font-size:10px;color:var(--text-m);cursor:pointer;opacity:.7;z-index:1}
  .ss-bg-vit{display:flex;gap:8px}
  .ss-bg-v{flex:1;text-align:center;background:color-mix(in srgb,var(--accent) 7%,transparent);border-radius:10px;padding:8px 4px}
  .ss-bg-v span{display:block;font-size:9.5px;color:var(--text-m)}
  .ss-bg-v b{display:block;font-family:'Tangerine',cursive;font-weight:700;font-size:27px;color:var(--text3);line-height:1.05}
  .ss-bg-v b i{font-family:'Noto Sans SC',sans-serif;font-size:9px;font-style:normal;color:var(--text-m)}
  .ss-bg-vlbl{font-family:'JH',serif;font-size:11px;color:var(--accent2);margin-top:9px;line-height:1.6}
  .ss-bg-vt{font-size:9px;color:var(--text-m);opacity:.7;margin-top:4px}
}

/* ═══════════ 日历（生活·我的小事 = 生理期+纪念日 合并）§4.10 ═══════════
   独立 .page#page-calendar，由 swPage('calendar') 显示（swPage 本体不动）。
   周期阶段全从 /api/period（含 avg_cycle/next_predicted）+ /api/special-dates 推算，
   不碰后端/数据库。全暖语义色（无青，淮淮 2026-06-30 拍板）；star 黄体期=月光暖金。
   隔离：top-level display:none + @media(min-width:769px) 物理摘除 + 全样式包 max-width:768px。 */
#page-calendar{display:none}
@media(min-width:769px){#page-calendar{display:none!important}}
@media(max-width:768px){
  #page-calendar.active{display:block}
  /* 语义色 token，随 [data-theme] 走 */
  html[data-theme="mist"]  #page-calendar{--cperiod:#e07a9e;--cptx:#fff;--cluteal:rgba(228,164,118,.26);--cfert:rgba(224,122,158,.10);--cpred:#e07a9e;--canniv:var(--accent);--cnum:#4a4560;--coff:#bdb6cc;--cwk:#9890ad}
  html[data-theme="star"]  #page-calendar{--cperiod:#e483a8;--cptx:#fff;--cluteal:rgba(236,206,164,.15);--cfert:rgba(228,131,168,.10);--cpred:#e483a8;--canniv:var(--accent2);--cnum:#cdd8f0;--coff:#4a5a82;--cwk:#6a82b0}
  html[data-theme="amber"] #page-calendar{--cperiod:#dd8aa6;--cptx:#fff;--cluteal:rgba(214,168,112,.24);--cfert:rgba(221,138,166,.10);--cpred:#dd8aa6;--canniv:var(--accent);--cnum:#e8dcc8;--coff:#6e6050;--cwk:#8a7560}
  html[data-theme="porcelain"] #page-calendar{--cperiod:#A68B5B;--cptx:#fff;--cluteal:rgba(166,139,91,.18);--cfert:rgba(166,139,91,.10);--cpred:#A68B5B;--canniv:var(--accent);--cnum:#0E1236;--coff:#B0A498;--cwk:#9A8E82}
  html[data-theme="sakura"] #page-calendar{--cperiod:#F472B6;--cptx:#fff;--cluteal:rgba(244,114,182,.18);--cfert:rgba(244,114,182,.10);--cpred:#F472B6;--canniv:var(--accent2);--cnum:#F5D5E4;--coff:#7A4058;--cwk:#B87090}
  html[data-theme="garden"] #page-calendar{--cperiod:#E5C2C9;--cptx:#162810;--cluteal:rgba(229,194,201,.22);--cfert:rgba(229,194,201,.10);--cpred:#E5C2C9;--canniv:var(--accent);--cnum:#162810;--coff:#A4B690;--cwk:#8A9E78}
  .ss-cal{padding:max(8px,calc(env(safe-area-inset-top,0px) + 6px)) 14px 30px;max-width:560px;margin:0 auto}  /* 顶栏已隐，自补刘海安全区，别顶到状态栏 */
  /* 顶栏 */
  .ss-cal-top{display:flex;align-items:center;gap:10px;padding:6px 2px 8px}
  .ss-cal-back{width:22px;height:22px;color:var(--text-m);flex:0 0 22px;cursor:pointer}
  .ss-cal-ttl{font-family:'JH',serif;font-size:18px;color:var(--text3);flex:1}
  .ss-cal-add{display:flex;align-items:center;gap:4px;font-family:'JH',serif;font-size:12px;color:var(--accent);cursor:pointer;
    background:var(--glass);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
    padding:6px 11px;border-radius:13px}
  .ss-cal-add svg{width:13px;height:13px}
  /* 月份头：June + 2026 同 accent 实色（2026 不降透明度，淮淮 catch）*/
  .ss-cal-mhead{display:flex;align-items:center;justify-content:center;gap:14px;margin:4px 0 10px}
  .ss-cal-arw{width:18px;height:18px;color:var(--text-m);flex:0 0 18px;cursor:pointer}
  .ss-cal-mo{font-family:'Tangerine',cursive;font-weight:700;font-size:36px;color:var(--accent);line-height:.9}
  .ss-cal-yr{font-family:'Tangerine',cursive;font-weight:700;font-size:21px;color:var(--accent);margin-left:3px}
  /* 星期表头 + 网格（7 列严格对齐——淮淮对齐铁律）*/
  .ss-cal-wk{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:4px}
  .ss-cal-wk span{text-align:center;font-size:10px;color:var(--cwk);letter-spacing:.04em}
  .ss-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
  .ss-cal-cell{aspect-ratio:1/1.05;position:relative;border-radius:12px;display:flex;align-items:center;justify-content:center}
  .ss-cal-cell .d{font-family:'Tangerine',cursive;font-weight:700;font-size:22px;color:var(--cnum);line-height:1}
  .ss-cal-cell.off .d{color:var(--coff)}
  .ss-cal-cell.period{background:var(--cperiod)}
  .ss-cal-cell.period .d{color:var(--cptx)}
  .ss-cal-cell.luteal{background:var(--cluteal)}
  .ss-cal-cell.fertile{background:var(--cfert)}
  .ss-cal-cell.ovul{box-shadow:0 0 0 1.6px var(--cpred) inset}
  .ss-cal-cell.predict{border:1.5px dashed var(--cpred)}
  .ss-cal-cell.predict .d{color:var(--cpred)}
  .ss-cal-cell.today{box-shadow:0 0 0 2px var(--accent)}
  .ss-cal-cell.today .d{font-weight:700}
  .ss-cal-cell .dot{position:absolute;bottom:5px;width:4px;height:4px;border-radius:50%;background:var(--canniv)}
  /* 图例 */
  .ss-cal-lg{display:flex;flex-wrap:wrap;gap:6px 12px;justify-content:center;margin:13px 2px 0}
  .ss-cal-lg .it{display:flex;align-items:center;gap:5px;font-size:9.5px;color:var(--text-m)}
  .ss-cal-lg .sw{width:12px;height:12px;border-radius:4px;flex:0 0 12px;display:flex;align-items:center;justify-content:center}
  .ss-cal-lg .sw.p{background:var(--cperiod)}.ss-cal-lg .sw.l{background:var(--cluteal)}
  .ss-cal-lg .sw.o{box-shadow:0 0 0 1.5px var(--cpred) inset}.ss-cal-lg .sw.pr{border:1.4px dashed var(--cpred)}
  .ss-cal-lg .sw.a::after{content:'';width:4px;height:4px;border-radius:50%;background:var(--canniv)}
  /* 卡片（玻璃，复用 --glass；star/amber 深影覆盖）*/
  .ss-cal-cards{margin-top:13px;display:flex;flex-direction:column;gap:8px}
  .ss-cal-card{background:var(--glass);backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
    border-radius:14px;padding:10px 13px;display:flex;align-items:center;gap:10px;
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 12px rgba(46,62,109,.05)}
  html[data-theme="star"] .ss-cal-card,html[data-theme="amber"] .ss-cal-card,html[data-theme="sakura"] .ss-cal-card{box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30)}
  .ss-cal-card .cic{width:7px;height:7px;border-radius:50%;flex:0 0 7px}
  .ss-cal-card .cic.rose{background:var(--cperiod)}.ss-cal-card .cic.acc{background:var(--canniv)}
  .ss-cal-card .ctx{flex:1;min-width:0}
  .ss-cal-card .ctx .t{font-family:'JH',serif;font-size:12px;color:var(--text3);line-height:1.25}
  .ss-cal-card .ctx .s{font-size:9px;color:var(--text-m);margin-top:1px}
  .ss-cal-card .cnt{font-family:'Tangerine',cursive;font-weight:700;font-size:24px;color:var(--accent);line-height:.9;white-space:nowrap}
  .ss-cal-card .cnt small{font-size:11px;color:var(--text-m);font-family:'Noto Sans SC',sans-serif;margin-left:1px}
  /* 两张统计卡：数值底线对齐、标签落同一行（淮淮对齐铁律）*/
  .ss-cal-stat{display:flex;gap:8px}
  .ss-cal-stat .ss-cal-card{flex:1;flex-direction:column;align-items:flex-start;gap:5px;padding:10px 13px;justify-content:center}
  .ss-cal-stat .v{font-family:'Tangerine',cursive;font-weight:700;font-size:28px;color:var(--accent);line-height:1;min-height:26px;display:flex;align-items:flex-end}
  .ss-cal-stat .v.zh{font-family:'JH',serif;font-size:16px}
  .ss-cal-stat .k{font-size:9px;color:var(--text-m)}
  /* 生活子tab栏注入的「日历」临时入口（九宫格容器落地后移除）*/
  .ss-cal-entry{white-space:nowrap}

  /* ── 记录弹层 §4.10 刀② ── 底部玻璃 sheet，注入 #page-calendar 内继承主题 token */
  .ss-sheet-mask{position:fixed;inset:0;z-index:150;background:rgba(20,18,40,.34);
    display:flex;align-items:flex-end;opacity:0;pointer-events:none;transition:opacity .22s}
  .ss-sheet-mask.on{opacity:1;pointer-events:auto}
  .ss-sheet{width:100%;max-height:88vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
    background:var(--glass);backdrop-filter:blur(30px) saturate(1.5);
    -webkit-backdrop-filter:blur(30px) saturate(1.5);border-radius:26px 26px 0 0;
    padding:9px 18px max(20px,env(safe-area-inset-bottom));
    box-shadow:0 -1px 0 rgba(255,255,255,.4) inset,0 -10px 30px rgba(0,0,0,.18);
    transform:translateY(16px);transition:transform .24s}
  html[data-theme="star"] .ss-sheet,html[data-theme="amber"] .ss-sheet,html[data-theme="sakura"] .ss-sheet{box-shadow:0 -1px 0 rgba(255,255,255,.14) inset,0 -10px 30px rgba(0,0,0,.34)}
  .ss-sheet-mask.on .ss-sheet{transform:translateY(0)}
  .ss-sheet-grab{width:38px;height:4px;border-radius:3px;background:var(--text-m);opacity:.4;margin:0 auto 11px}
  .ss-sheet-h{font-family:'JH',serif;font-size:15px;color:var(--text3);text-align:center;margin-bottom:13px}
  .ss-seg{display:flex;gap:5px;background:color-mix(in srgb,var(--accent) 12%,transparent);border-radius:13px;padding:3px;margin-bottom:14px}
  .ss-seg button{flex:1;border:none;background:transparent;font-family:'JH',serif;font-size:12px;color:var(--text-m);padding:8px 0;border-radius:10px;cursor:pointer}
  .ss-seg button.on{background:var(--glass);color:var(--accent);box-shadow:0 1px 1px rgba(255,255,255,.4) inset}
  .ss-seg.mini{margin:0}.ss-seg.mini button{font-size:11px;padding:7px 0}
  .ss-fld{margin-bottom:11px}
  .ss-fld>label{display:block;font-family:'JH',serif;font-size:10.5px;color:var(--text-m);margin:0 0 5px 3px;letter-spacing:.03em}
  .ss-inp{width:100%;box-sizing:border-box;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border:none;border-radius:11px;padding:10px 12px;font-family:'JH',serif;font-size:16px;color:var(--text3);
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset}
  .ss-inp::placeholder{color:var(--text-m);opacity:.7}
  .ss-dt{position:relative;display:flex;align-items:center;justify-content:space-between;
    background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border-radius:11px;padding:9px 12px;box-shadow:0 1px 1px rgba(255,255,255,.4) inset}
  .ss-dt .dv{font-family:'Tangerine',cursive;font-weight:700;font-size:21px;color:var(--accent);letter-spacing:.02em}
  .ss-dt .dv.e{font-family:'JH',serif;font-size:13px;color:var(--text-m);opacity:.75}
  .ss-dt svg{width:15px;height:15px;color:var(--text-m);flex:0 0 15px}
  .ss-dt input[type=date]{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:none;background:none;margin:0;padding:0;font-size:16px}
  .ss-two{display:flex;gap:9px}.ss-two>.ss-fld{flex:1}
  .ss-sheet-btns{display:flex;gap:10px;margin-top:16px}
  .ss-sheet-btns button{flex:1;border:none;border-radius:13px;padding:12px 0;font-family:'JH',serif;font-size:14px;cursor:pointer}
  .ss-sheet-btns .b-cancel{background:var(--glass);color:var(--text-m);box-shadow:0 1px 1px rgba(255,255,255,.4) inset}
  .ss-sheet-btns .b-save{background:var(--accent);color:#fff}
  .ss-sheet .b-del{width:100%;margin-top:11px;border:none;background:transparent;font-family:'JH',serif;font-size:12.5px;color:var(--cperiod);opacity:.9;padding:5px 0;cursor:pointer;letter-spacing:.02em}
  .ss-cal-card.tap{cursor:pointer}
  /* 深色：内高光压低（同日历卡）*/
  html[data-theme="star"] .ss-inp,html[data-theme="amber"] .ss-inp,html[data-theme="sakura"] .ss-inp,
  html[data-theme="star"] .ss-dt,html[data-theme="amber"] .ss-dt,html[data-theme="sakura"] .ss-dt,
  html[data-theme="star"] .ss-seg button.on,html[data-theme="amber"] .ss-seg button.on,html[data-theme="sakura"] .ss-seg button.on,
  html[data-theme="star"] .ss-sheet-btns .b-cancel,html[data-theme="amber"] .ss-sheet-btns .b-cancel,html[data-theme="sakura"] .ss-sheet-btns .b-cancel{box-shadow:0 1px 1px rgba(255,255,255,.14) inset}
}

/* ═══ 首页落地 · 刀①（2026-07-01）§4.6 ═══════════════════════════
   greeting/计数上新字体（JH + Tangerine）+ 三张玻璃卡（情话/那年今日/柏源在做什么）
   + 统计三卡玻璃化（淮淮拍板：保留统计卡）；撤两条分隔线 + 隐九宫格功能区（主导航可达）。
   全 mobile-only；桌面（≥769px）读不到一行 = Win 冻结。glass 复用 --glass（同设置/日历卡配方）。 */
@media(max-width:768px){
  /* greeting 柔色（§4.6：不能太深太跳）三主题 token */
  html[data-theme="mist"]  #page-home{--ss-hello:#56527a}
  html[data-theme="star"]  #page-home{--ss-hello:#d6e2f7}
  html[data-theme="amber"] #page-home{--ss-hello:#f0e6d8}
  html[data-theme="porcelain"] #page-home{--ss-hello:#1E3D8F}
  html[data-theme="sakura"] #page-home{--ss-hello:#FFB6D9}
  html[data-theme="garden"] #page-home{--ss-hello:#2A441E}

  /* —— 撤原型没有的：两条分隔线 + 九宫格 + 功能区标题（主导航都可达）—— */
  #page-home .ornament{display:none}
  #page-home .mod-grid{display:none}
  #page-home .sec-hdr:has(+ .mod-grid){display:none}

  /* —— 隐旧管理顶栏（淮淮嘱：首页也隐；swPage 每次进 home 设 inline flex，故 !important）
     + 自造 §4.6 品牌栏「星海 StarSea + 齿轮」（顶栏隐了、这里补设置入口 & 品牌）—— */
  #app:has(#page-home.active) .top-header{display:none !important}
  #page-home .ss-home-top{display:flex;align-items:center;justify-content:space-between;
    padding:calc(env(safe-area-inset-top,0px) + .5rem) .4rem .1rem}
  #page-home .ss-home-top .brand{display:flex;align-items:baseline;gap:.4rem}
  #page-home .ss-home-top .brand .cn{font-family:'JH',serif;font-size:1rem;letter-spacing:.14em;color:var(--accent2)}
  #page-home .ss-home-top .brand .en{font-family:'Tangerine',cursive;font-weight:700;font-size:2rem;color:var(--accent);line-height:1}
  #page-home .ss-home-top .gear{width:21px;height:21px;color:var(--text-m);flex:0 0 21px;cursor:pointer}

  /* —— 问候（左对齐，同原型 .hello；safe-area 由上面品牌栏兜，这里收顶距）—— */
  #page-home .home-greeting{text-align:left;padding:.5rem .3rem .2rem}
  #page-home .home-date{font-family:'JH',serif;font-size:.72rem;color:var(--text-m);letter-spacing:.08em}
  #page-home .home-hi{font-family:'JH',serif;font-size:1.5rem;font-weight:500;color:var(--ss-hello);
    margin-top:.55rem;line-height:1.5;letter-spacing:.06em}

  /* —— 计数 483（Tangerine 大字）—— */
  #page-home .home-counter{padding:.5rem 0 1.1rem}
  #page-home .counter-num{font-family:'Tangerine',cursive;font-weight:700;font-size:4.7rem;line-height:.7;
    color:var(--accent);text-shadow:0 4px 22px var(--orb1)}
  /* label+纪念日+日期 合成一整行居中（原型 §4.6：在一起的日子 · 纪念日 2025.02.22；JS 重排。
     原两 div 拆两行、断开难看 —— 淮淮 catch）。中文京华老宋、日期 Tangerine。 */
  #page-home .counter-label{font-family:'JH',serif;font-size:.75rem;color:var(--text-m);
    letter-spacing:.05em;margin-top:.9rem;line-height:1.6;
    display:flex;justify-content:center;align-items:center}   /* 整行水平居中 + 日期与中文行内垂直居中对齐（淮淮：日期没居中）*/
  #page-home .counter-ann{display:none}         /* 已并进 counter-label（JS） */
  #page-home .ss-hdt{font-family:'Tangerine',cursive;font-weight:700;font-size:1.28rem;
    color:var(--accent2);margin-left:.18em;line-height:1}   /* 首页专属，无底板（避开日历 .ss-dt 玻璃板） */
  #page-home .counter-quote{display:none}      /* 升成独立情话卡（下） */

  /* —— 情话卡「你给我的一句话」（§4.6 升独立玻璃卡）—— */
  #page-home .ss-home-verse{background:var(--glass);backdrop-filter:blur(22px) saturate(1.4);
    -webkit-backdrop-filter:blur(22px) saturate(1.4);border-radius:18px;padding:.9rem 1rem 1rem;margin-bottom:.8rem;
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06)}
  html[data-theme="star"] #page-home .ss-home-verse,
  html[data-theme="amber"] #page-home .ss-home-verse{box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30)}
  #page-home .ss-home-verse .vt{display:flex;align-items:center;gap:.4rem;font-family:'JH',serif;font-size:.66rem;
    color:var(--text-m);letter-spacing:.05em;margin-bottom:.55rem}
  #page-home .ss-home-verse .vt svg{width:13px;height:13px;color:var(--accent2)}
  #page-home .ss-home-verse .vc{font-family:'JH',serif;font-style:italic;font-size:.86rem;
    line-height:1.7;color:var(--text2);text-align:center}

  /* —— 玻璃卡统一：那年今日 / 统计 / 柏源在做什么（.gc 去边框、上 §4.4）—— */
  #page-home .gc{background:var(--glass) !important;border:none !important;border-radius:18px;
    backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06)}
  html[data-theme="star"] #page-home .gc,
  html[data-theme="amber"] #page-home .gc{box-shadow:0 1px 1px rgba(255,255,255,.14) inset,0 4px 16px rgba(0,0,0,.30) !important}

  /* section 标题瘦身（小标题气质，不抢卡片）*/
  #page-home .sec-hdr{margin-bottom:.5rem;padding:0 .2rem}
  #page-home .sec-icon{color:var(--accent2);font-size:.8rem}
  #page-home .sec-title{font-family:'JH',serif;font-size:.82rem;font-weight:500;color:var(--text-m);letter-spacing:.05em}
  #page-home .sec-sub{font-family:'JH',serif;font-size:.64rem;color:var(--text-m)}

  /* 那年今日 卡内 */
  #page-home .today-date{color:var(--accent2)}
  #page-home .today-text{font-family:'JH',serif;font-size:.82rem;line-height:1.75;color:var(--text2)}

  /* 统计三卡 */
  #page-home .stats-row{gap:.6rem;margin-bottom:1rem}
  #page-home .stat-num{font-family:'Tangerine',cursive;font-weight:700;font-size:2rem;color:var(--accent)}
  #page-home .stat-lbl{font-family:'JH',serif;font-size:.63rem;color:var(--text-m);letter-spacing:.06em;margin-top:.15rem}
}

/* ═══ 记忆页落地 · 刀①（§4.1 记忆 / 原型 memory_page.html · 三主题已验）═══
   真站结构已全（rand-mod 那年今日 / result-bar / #grid .card / pagi + #sidebar 筛选侧栏），
   此处纯上皮肤：§4.4 玻璃 + tier 三色校准 + Tangerine 数字 / Dancing Script 英文词 chip
   + 隐旧管理顶栏（同首页）+ 注入干净记忆顶 + 筛选抽屉玻璃化。
   全 @media(max-width:768px) + #page-mem / #sidebar 作用域 = Win 冻结。
   ⚠ 8.0 类名撞车：新 class 一律 .ss-mem-* 前缀 + #page-mem 作用域，grep 过无撞。 */
@font-face{font-family:'Dancing';src:url('/static/fonts/DancingScript.woff2') format('woff2');font-weight:400;font-display:swap}
@media(max-width:768px){
  /* 隐旧管理顶栏（同首页；swPage 进 mem 会设 inline flex，故 !important）*/
  #app:has(#page-mem.active) .top-header{display:none !important}
  /* 注入的干净记忆顶（记忆 + 筛选漏斗 + ＋），safe-area 自补刘海 */
  #page-mem .ss-mem-top{display:flex;align-items:center;gap:.7rem;
    padding:calc(env(safe-area-inset-top,0px) + .55rem) .3rem .5rem}
  #page-mem .ss-mem-top .tt{font-family:'JH',serif;font-size:1.15rem;color:var(--text3);flex:1;letter-spacing:.04em}
  #page-mem .ss-mem-top .act{width:21px;height:21px;color:var(--text-m);flex:0 0 21px;cursor:pointer}
  #page-mem .main-col{padding:.2rem .8rem}

  /* 那年今日（.rand-mod → 原型 .tyt：居中玻璃卡、日期 Tangerine）*/
  #page-mem .rand-mod{background:var(--glass) !important;border:none !important;border-left:none !important;border-radius:17px;
    backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06);
    text-align:center;padding:1rem 1rem .9rem}
  #page-mem .rand-label{font-family:'JH',serif;color:var(--accent);letter-spacing:.42em;padding-left:.42em;opacity:.85}
  #page-mem .rand-title{font-family:'JH',serif;color:var(--text3)}
  #page-mem .rand-sum{font-family:'JH',serif;color:var(--text2);line-height:1.65}
  #page-mem .rand-date{font-family:'Tangerine',cursive;font-weight:700;font-size:1.4rem;color:var(--accent);opacity:.75}
  #page-mem .rand-deco{color:var(--text-m);letter-spacing:.5em;font-size:.6rem}

  /* 结果条（中文+数字混排，保持 JH；数字花体化留刀②，需 span 包裹）*/
  #page-mem .result-bar{font-family:'JH',serif;color:var(--text-m);font-size:.72rem;padding:.3rem .2rem .6rem}

  /* 记忆卡（§4.4 玻璃、去边框）*/
  #page-mem #grid .card{background:var(--glass) !important;border:none !important;border-radius:16px;
    backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06);
    padding:.8rem .9rem !important}
  #page-mem .c-head{gap:.4rem}
  #page-mem .tier{font-family:'JH',serif;border-radius:8px;font-size:.6rem;padding:.14rem .5rem;letter-spacing:.04em}
  #page-mem .tier-core{background:color-mix(in srgb,var(--core) 16%,transparent);color:var(--core)}
  #page-mem .tier-long_term{background:color-mix(in srgb,var(--long) 16%,transparent);color:var(--long)}
  #page-mem .tier-recent{background:color-mix(in srgb,var(--recent) 18%,transparent);color:var(--recent)}
  #page-mem .c-type{font-family:'JH',serif;background:none;color:var(--text2);font-size:.62rem;padding:0}
  #page-mem .c-rp{font-family:'JH',serif;color:#fff;background:var(--rp);padding:.1rem .4rem;border-radius:7px;font-size:.56rem}
  #page-mem .c-date{font-family:'Tangerine',cursive;font-weight:700;font-size:1rem;color:var(--text-m);margin-left:auto;letter-spacing:.02em}
  #page-mem .c-title{font-family:'JH',serif;font-size:.88rem !important;color:var(--text3);line-height:1.35}
  /* 亲密子类型 [xx] → Dancing Script（原 renderC 内联只设 font-size/color，不设 font-family，本规则赢）*/
  #page-mem .c-title span{font-family:'Dancing',cursive !important;text-transform:capitalize}
  #page-mem .c-sum{font-family:'JH',serif;font-size:.78rem;color:var(--text2);line-height:1.65;opacity:1}
  #page-mem .kw{font-family:'JH',serif;background:var(--badge);border:none;color:var(--accent2);border-radius:8px;font-size:.6rem;padding:.1rem .5rem}

  /* 展开态 detail */
  #page-mem .c-detail{border-top:1px solid var(--divider)}
  #page-mem .c-quote{font-family:'JH',serif;font-style:italic;font-size:.78rem;color:var(--text2);line-height:1.7;
    background:none;border-radius:0;border-left:1.5px solid var(--accent);padding:.1rem 0 .1rem .7rem;opacity:.92}
  #page-mem .c-quote::before{display:none}
  #page-mem .d-row{font-size:.72rem}
  #page-mem .d-k{font-family:'JH',serif;color:var(--text-m)}
  #page-mem .d-v{font-family:'JH',serif;color:var(--text3)}
  /* 情感权重值 high/mid/low → Dancing Script 首字母大写（§4.2 英文词标签）*/
  #page-mem .d-v.w-high,#page-mem .d-v.w-mid,#page-mem .d-v.w-low{
    font-family:'Dancing',cursive;text-transform:capitalize;font-size:.92rem;line-height:1}
  #page-mem .d-v.w-high{color:var(--core)}
  /* 展开操作按钮 */
  #page-mem .d-acts .btn{font-family:'JH',serif;border:none !important;border-radius:9px;font-size:.66rem;padding:.28rem .8rem;
    background:var(--badge);color:var(--text3);box-shadow:0 1px 1px rgba(255,255,255,.35) inset}
  #page-mem .d-acts .btn-p{background:var(--accent);color:#fff}
  #page-mem .d-acts .btn-d{background:color-mix(in srgb,var(--core) 16%,transparent);color:var(--core)}

  /* 分页（纯数字/‹›… → Tangerine 玻璃）*/
  #page-mem .pagi .pg{font-family:'Tangerine',cursive;font-weight:700;font-size:1rem;
    background:var(--glass) !important;border:none !important;border-radius:9px;min-width:1.9rem;
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    box-shadow:0 1px 1px rgba(255,255,255,.35) inset;color:var(--text-m);padding:.15rem .5rem}
  #page-mem .pagi .pg.active{background:var(--accent) !important;color:#fff}

  /* ═══ 筛选抽屉（#sidebar.m-show 全屏 → 玻璃化 + 注入头）═══ */
  #page-mem #sidebar.m-show{background:var(--glass) !important;
    backdrop-filter:blur(30px) saturate(1.3);-webkit-backdrop-filter:blur(30px) saturate(1.3);
    padding:calc(env(safe-area-inset-top,0px) + .8rem) 1rem calc(env(safe-area-inset-bottom,0px) + 2rem)}
  #page-mem .ss-mem-fhead{display:flex;align-items:center;gap:.7rem;margin-bottom:1.1rem}
  #page-mem .ss-mem-fhead .bk{width:22px;height:22px;color:var(--accent);flex:0 0 22px;cursor:pointer}
  #page-mem .ss-mem-fhead .tt{font-family:'JH',serif;font-size:1.05rem;color:var(--text3);flex:1;letter-spacing:.04em}
  #page-mem .ss-mem-fhead .rst{font-family:'JH',serif;font-size:.72rem;color:var(--accent2);cursor:pointer}
  #page-mem #sidebar .f-label{font-family:'JH',serif;color:var(--text-m);letter-spacing:.12em;text-transform:none;font-size:.62rem}
  #page-mem #sidebar .search-box,#page-mem #sidebar .sort-sel{background:var(--glass) !important;border:none !important;border-radius:12px;
    font-family:'JH',serif;color:var(--text3);box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 14px rgba(46,62,109,.06);
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding:.55rem .8rem}
  #page-mem #sidebar .search-box::placeholder{font-family:'Tangerine',cursive;font-size:1rem;color:var(--text-m);opacity:.8}
  #page-mem #sidebar .chips{gap:.42rem}
  #page-mem #sidebar .chip{font-family:'JH',serif;border:none !important;border-radius:11px;color:var(--text3);
    background:var(--badge);font-size:.68rem;padding:.28rem .7rem;
    box-shadow:0 1px 1px rgba(255,255,255,.4) inset}
  #page-mem #sidebar .chip.active{background:var(--accent) !important;color:#fff;box-shadow:none}
  /* 英文词 chip → Dancing Script 首字母大写（§4.2）：权重/亲密子类/平台英文项；中文项不动 */
  #page-mem #sidebar .chip[data-group="weight"],
  #page-mem #sidebar .chip[data-group="intimate"],
  #page-mem #sidebar .chip[data-group="platform"]:not([data-val="手动"]){
    font-family:'Dancing',cursive;text-transform:capitalize;font-size:.92rem;padding:.2rem .7rem}
  /* 缩写全大写（capitalize 会把 xp→Xp、GPT→Gpt，单独拉回）*/
  #page-mem #sidebar .chip[data-val="xp"],
  #page-mem #sidebar .chip[data-val="GPT"]{text-transform:uppercase}
}
/* ═══ 便利贴 · 双色互贴墙（2026-07-21 柏源亲笔 · 源哥哥=雾青，淮淮=桃粉，不消失）═══ */
#page-stickynotes .ss-sn{padding:.8rem .6rem 1.2rem;max-width:520px;margin:0 auto;font-family:'JH',serif}
.ss-sn-intro{font-size:.72rem;color:var(--text-m);text-align:center;padding:.4rem .6rem .8rem;line-height:1.6}
.ss-sn-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.55rem;padding:.4rem 0 1rem}
.ss-sn-empty{grid-column:1/-1;text-align:center;color:var(--text-m);font-size:.7rem;padding:1.2rem 0}
.ss-sn-card{border-radius:10px;padding:.65rem .7rem .55rem;box-shadow:0 2px 6px rgba(80,90,100,.08);min-height:80px;display:flex;flex-direction:column;justify-content:space-between;transform:rotate(-.6deg);transition:transform .2s}
.ss-sn-card:nth-child(even){transform:rotate(.8deg)}
.ss-sn-card:hover{transform:rotate(0) translateY(-1px)}
.ss-sn-body{font-size:.75rem;line-height:1.55;white-space:pre-wrap;word-break:break-word;flex:1}
.ss-sn-foot{font-size:.55rem;opacity:.7;margin-top:.4rem;text-align:right}
.ss-sn-mine{background:#dfe8e6;color:#2c4a44;border:1px solid #c5d5d2}
.ss-sn-hers{background:#f7d9dd;color:#7a3049;border:1px solid #edc0c7}
.ss-sn-editor{background:var(--card);border:1px solid var(--card-b);border-radius:12px;padding:.7rem;margin-top:.6rem}
.ss-sn-who{display:flex;gap:.8rem;margin-bottom:.5rem;font-size:.7rem;color:var(--text2)}
.ss-sn-radio{display:flex;align-items:center;gap:.25rem;cursor:pointer}
.ss-sn-radio input{accent-color:var(--accent4)}
.ss-sn-editor textarea{width:100%;background:var(--bg1);border:1px solid var(--card-b);border-radius:8px;padding:.5rem;font-size:.72rem;color:var(--text3);resize:none;font-family:'JH',serif;line-height:1.6;box-sizing:border-box;outline:none}
.ss-sn-btns{display:flex;justify-content:flex-end;gap:.4rem;margin-top:.5rem}
.ss-sn-btn{padding:.35rem .8rem;border-radius:6px;font-size:.62rem;cursor:pointer;border:none;font-family:inherit}
.ss-sn-cancel{background:transparent;color:var(--text-m);border:1px solid var(--card-b)}
.ss-sn-post{background:var(--accent4);color:#fff}

/* ═══ 随笔 · 六类可筛选、长内容折叠（2026-07-21 柏源亲笔）═══ */
.ss-es-filters{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.6rem}
.ss-es-fbtn{padding:.28rem .7rem;border-radius:14px;font-size:.62rem;cursor:pointer;border:1px solid var(--card-b);background:var(--card);color:var(--text2);font-family:inherit;transition:.2s}
.ss-es-fbtn.on{background:var(--accent4);color:#fff;border-color:var(--accent4)}
.ss-es-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.8rem}
.ss-es-empty{text-align:center;padding:1.5rem 0;color:var(--text-m);font-size:.7rem}
.ss-es-card{background:var(--card);border:1px solid var(--card-b);border-radius:10px;padding:.6rem .75rem}
.ss-es-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:.3rem}
.ss-es-tag{font-size:.55rem;background:var(--accent4);color:#fff;padding:.1rem .5rem;border-radius:8px}
.ss-es-date{font-size:.55rem;color:var(--text-m)}
.ss-es-title{font-size:.75rem;color:var(--text3);font-family:'JH',serif;margin-bottom:.3rem;font-weight:500}
.ss-es-body{font-size:.72rem;line-height:1.6;color:var(--text3);font-family:'JH',serif;white-space:pre-wrap;word-break:break-word}
.ss-es-more{color:var(--accent4);cursor:pointer;margin-left:.4rem;font-size:.65rem}
.ss-es-editor{background:var(--card);border:1px solid var(--card-b);border-radius:12px;padding:.7rem}
.ss-es-ehd{font-size:.68rem;color:var(--text2);margin-bottom:.5rem;font-family:'JH',serif}
.ss-es-erow{display:flex;gap:.4rem;margin-bottom:.4rem}
.ss-es-erow select,.ss-es-erow input{background:var(--bg1);border:1px solid var(--card-b);border-radius:6px;padding:.35rem .5rem;font-size:.7rem;color:var(--text3);font-family:inherit;outline:none}
.ss-es-erow select{flex:0 0 auto}
.ss-es-erow input{flex:1}
#ss-es-content{width:100%;background:var(--bg1);border:1px solid var(--card-b);border-radius:8px;padding:.5rem;font-size:.72rem;color:var(--text3);resize:none;font-family:'JH',serif;line-height:1.6;box-sizing:border-box;outline:none}
.ss-es-ebtns{display:flex;justify-content:flex-end;margin-top:.5rem}
.ss-es-btn{padding:.35rem 1rem;border-radius:6px;font-size:.62rem;cursor:pointer;border:none;background:var(--accent4);color:#fff;font-family:inherit}